/* Application stylesheet definitions, 0.2 2023-07-04
* AIP Solutions' 2023, https://aip.solutions
*/
@charset "UTF-8";
/** generic */
/* fonts
pa:this is disabled because will slow down the loading
@font-face {font-family:'IBM Plex Sans';font-weight:normal;src:url('/res/IBMPlexSans-Regular.woff2') format('woff2');}
@font-face {font-family:'IBM Plex Sans';font-weight:bold;src:url('/res/IBMPlexSans-SemiBold.woff2') format('woff2');}
*/
@font-face {font-family:'Roboto';font-weight:normal;src:url('/res/Roboto-Regular.ttf') format('ttf');}
@font-face {font-family:'Roboto';font-weight:light;src:url('/res/Roboto-Ligth.ttf') format('ttf');}
@font-face {font-family:'Roboto';font-weight:bold;src:url('/res/Roboto-Bold.ttf') format('ttf');}
@font-face {font-family:'Roboto';font-weight:500;src:url('/res/Roboto-Medium.ttf') format('ttf');}
/* normalization */
html {overflow-x:hidden;overflow-y:auto;}
body {min-width:360px;margin:0;background:#eee;/*overflow:hidden;*/}
header, main, footer, nav, menu, li, h1, section, article, aside, p, table
{position:relative;box-sizing:border-box;}
li {list-style-type:none;}
ul, menu, h1, h2
{margin:0;padding:0;}
a {box-sizing:border-box;color:inherit;text-decoration:none;}
/* global formatting */
.num {text-align:right;}
th.num {text-align:center;}
tfoot th.num {text-align:right;}
.hide, .tablet, .laptop, .desktop {display:none;}
/*2023-08-29mss:added! To be moved in proper section! */
.right {float:right;}
.left {float:left;}
p::after, main.large.detail header::after{content:"";display:block;clear:both;}
/* .loading {position:relative;}
.loading::after {content:attr(data-loading);display:block;position:absolute;top:0;right:0;bottom:0;left:0;min-height:20px;padding-left:30px;color:#1c1f29;background:transparent url('../img/loading.gif') center center no-repeat;background-size:auto 20px;}
.loading::after {content:attr(data-loading);z-index:100;position:fixed;top:0;right:0;bottom:0;left:-0;color:#fff;font-weight:bold;font-size:22px;line-height:150px;text-align:center;} background:rgba(0,0,0,0.75); */
form.loading {pointer-events:none;}
iframe.popup {z-index:103;position:absolute;left:0;right:0;outline:solid 1000px rgba(0,0,0,0.5);margin:auto;border:0px solid #000;box-shadow:0 0 10px #000;border-radius:30px;background:#fff;}
iframe.popup.l {/*left:20%;margin-left:-10%;*/width:100%;height:90%;}
iframe.popup.m {/*left:10%;*/width:100%;}
iframe.popup.ms {width:314px;height:463px;outline:solid 2000px rgba(0,0,0,0.0);left:340px!important;right:unset!important;top:475px!important;}
div.popup {z-index:103;display:none;position:absolute;left:0;right:0;outline:solid 1000px rgba(0,0,0,0.5);margin:auto;border:0px solid #000;box-shadow:0 0 10px #000;border-radius:30px;background:#fff;}
.multiple {display:flex;position:relative;flex-wrap:wrap;border:1px solid #7A86A1;border-radius:19px;margin:22px 15px 30px 0;padding:4px 4px;width:100%;background:#fff;min-height:195px;align-content:baseline;box-sizing:border-box}
.multiple::before {content:attr(title);display:block;position:absolute;top:-22px;left:0;white-space:nowrap;font-size:15px;font-weight:500;}
.multiple label {position:relative;flex:0 0 50%;margin:0;padding:4px 4px !important;box-sizing:border-box;}
.multiple label::before {display:none;font-size:0;content:none;}
.multiple label.s {flex:0 0 21.3%;}
.multiple .add {/*flex:1 0 100%;*/border:none;background:none;}
.multiple label.add {flex:0 0 100%;}
.multiple .empty {position:absolute;top:50%;text-align:center;transform:translate(0, -50%);}
.multiple .add input,
.multiple .add select{border-radius:0;margin:0;height:30px;border:none;}
.multiple .add select{background-position:right 25px top 13px}
.multiple .add button{display:none;position:absolute;top:10px;right:0;border-radius:6px;margin:0;padding:0;width:18px;height:18px;background:#61c474;font-size:14px;font-weight:normal;color:#fff;line-height:18px;}
.multiple label:not(.add) input{border:none;border-radius:12px;margin:0;padding:7px 25px 7px 10px;height:unset;background:#EFF3FF;color:#000;text-align:center;}
.multiple label:not(.add) button{position:absolute;top:50%;right:10px;transform:translate(0px, -50%);border:0;border-radius:8px;margin:0;padding:0;width:20px;height:20px;font-size:0;background:url(../res/icon-close.svg) #fff center no-repeat;background-size:8px;}
.multiple label:not(.add) button:hover{background:url(../res/icon-close.svg) #fff center no-repeat;background-size:8px;border:none;}
main.detail .multiple label.s input {line-height:unset;}
.blacklist label:not(.add) input{background:#FFC7C7;}
.whitelist label:not(.add) input{background:#D5FAD2;}
@media screen and (min-width:360px) {
main.popup form {background:#fff;}
body.popup {background:transparent;}
body.popup main {height:auto;}
iframe.popup.ms >body.popup {min-width:314px!important;}
main.popup {margin:0 auto;background:#fff;padding:20px 20px;position:relative;}
main.popup h1 {font-size:20px;}
main.popup section {background:transparent;box-shadow:unset;margin-top:50px;padding:0px;}
main.popup div.wrap table tbody td {white-space:nowrap;}
main.popup div.wrap {height:300px;}
main.popup table {position:relative;margin-top:37px;}
main.popup thead th {position:sticky;top:20px;box-shadow:0 2px 2px -1px rgba(0, 0, 0, 0.4);background:#fff;}
main.popup thead tr:hover {border-radius:unset;box-shadow:none;}
main.popup header b {margin-left:20px;}
main.popup nav.toolbar {position:absolute;right:20px;top:20px;}
main.popup footer {position:unset;padding:20px 0 0;background:#fff;text-align:right;width:100%;box-shadow:unset;}
main.popup footer button:last-of-type{margin-right:0;}
main.popup footer button.red {margin-right:15px;}
main.popup header button {margin-bottom:0px;}
main.popup label.t {width:100%; margin-bottom:25px;}
main.popup label.t input {margin-bottom:10px;}
}
.cke_chrome {border-radius:19px!important;margin-top:5px!important;}
.stats h3 {position:relative;margin:35px 0 0 -10px;width:216px;text-align:center;font-size:0;font-weight:bold;white-space:nowrap;}
.stats div {margin:20px 0;opacity:0;transition:opacity .4s;width:216px;}
.stats div h3 {margin:7px 0 0;font-weight:normal;text-align:center;white-space:nowrap;}
.stats h3::after {content:"STATS";display:block;margin-left:10px;font-size:12px;color:#607D8B;font-weight:normal;width:48px;}
.stats div {margin:20px 0;width:216px;}
.stats div h3 {margin:7px 0 0;font-weight:normal;text-align:center;white-space:nowrap;}
.chart {margin-bottom:100px;}
/* #myChartBar {border-radius:20px;border-width:2px; } */
/* .chartBar canvas, .stats canvas {display:none!important;}
.chartBar canvas.active, .stats canvas.active {display:block!important;} */
.data-container {max-height:434px; }
/* #myChartBar .bar {border-radius:10px;} */
:root {
/* default gray theme */
--black:#000a23;
--main10:#263238;
--main20:#37474F;
--main30:#455A64;
--main40:#546E7A;
--main50:#607D8B;
--main60:#78909C;
--main70:#90A4AE;
--main80:#CFD8DC;
--main90:#ECEFF1;
--white:#fff;
--info1:#42a5f5; /* blue */
--info2:#61C474; /* green */
--alert1:#f1c21b; /* yellow */
--alert2:#ff832b; /* orange */
--alert3:#FF5F5F; /* red */
--text-color: #263238; /* За светла тема */
--bg-color: #488ed2;
--gradient-start: #3C648C;
--gradient-middle: #3C648C;
--gradient-end: #4991D8;
--icon-employee:url(../res/Business-card.svg);
--icon-work:url(../res/development.svg);
--icon-inventory:url(../res/Box-3.svg);
--icon-financial:url(../res/Money-bag.svg);
--icon-double-vacation:url(../res/Suitcase-2-blue.svg);
--icon-double-sickleave:url(../res/health-test-blue.svg);
--icon-double-revenue:url(../res/Dollar-2-blue.svg);
--icon-double-expected:url(../res/Time-Is-Money-blue.svg);
--icon-double-storage:url(../res/Loader-blue.svg);
--icon-double-turnover:url(../res/Bar-chart-dynamic-blue.svg);
--icon-double-direction:url(../res/Box-1-blue.svg);
--icon-double-project:url(../res/Cashier-list-blue.svg);
--icon-double-activity:url(../res/Clock_1-blue.svg);
--icon-server:url(../res/server-solid.svg);
--icon-mailer:url(../res/inbox-icon.svg);
--icon-double-campaign:url(../res/Campaigns-icon-dark.svg);
--icon-double-list:url(../res/apps-icon-dark.svg);
--icon-double-subscriber:url(../res/Notifications-icon-dark.svg);
--icon-double-templates:url(../res/Statement-dark.svg);
--icon-search:url(../res/search-icon.svg);
}
@media (prefers-color-scheme: dark) {
:root {
--text-color: #fff; /* За тъмна тема */
--bg-color: #1a1a1a;
--gradient-start: #1a1a1a;
--gradient-middle: #000000;
--gradient-end: #1a1a1a;
--icon-employee:url(../res/Business-card-dark.svg);
--icon-work:url(../res/development-dark.svg);
--icon-inventory:url(../res/Box-3-dark.svg);
--icon-financial:url(../res/Money-bag-dark.svg);
--icon-double-vacation:url(../res/Suitcase-2.svg);
--icon-double-sickleave:url(../res/health-test.svg);
--icon-double-revenue:url(../res/Dollar-2.svg);
--icon-double-expected:url(../res/Time-Is-Money.svg);
--icon-double-storage:url(../res/Loader.svg);
--icon-double-turnover:url(../res/Bar-chart-dynamic.svg);
--icon-double-direction:url(../res/Box-1.svg);
--icon-double-project:url(../res/Cashier-list.svg);
--icon-double-activity:url(../res/Clock_1.svg);
--icon-server:url(../res/server-solid-dark.svg);
--icon-mailer:url(../res/inbox-icon-dark.svg);
--icon-double-campaign:url(../res/Campaigns-icon.svg);
--icon-double-list:url(../res/apps-icon.svg);
--icon-double-subscriber:url(../res/Notifications-icon.svg);
--icon-double-templates:url(../res/Statement.svg);
--icon-search:url(../res/search-icon-white.svg);
}
}
/* headers */
h1, h2, h3 {color: light-dark(#263238,#fff)}
h1 {font-size:20px;}
h2 {font-size:18px;}
h3 {font-size:16px;}
h4, h5, h6 {position:absolute;right:0;margin:auto;padding:0px 45px;border:1px solid var(--info1);border-radius:17px;min-width:300px;height:45px;line-height:45px;box-sizing:border-box;font-size:14px;font-weight:bold;cursor:pointer;color:var(--white);background:var(--info1);white-space:nowrap;z-index:101;}
.popup h4, .popup h5, .popup h6 {top:-75px;right:65px;}
h4::before, h5:before, h6::before {content:"";position:absolute;top:13px;left:15px;width:18px;height:18px;}
h4::after, h5:after, h6::after {content:"\2715";position:absolute;top:12px;right:12px;background:var(--white);font-size:11px;width:20px;height:20px;text-align:center;line-height:22px;border-radius:8px;}
th > h4 {position:relative;margin-bottom:30px;}
h5 {border-color:var(--info2);background:var(--info2);}
h5::before {background:url(../res/icon/save.svg) center no-repeat;background-size:18px;}
h5::after {color:var(--info2);}
h6 {border-color:var(--alert3);background:var(--alert3);}
h6::before {background:url(../res/icon/error.svg) center no-repeat;background-size:18px;}
h6::after {color:var(--alert3);}
h6.validation {display:none;}
td > h6 {z-index:10;margin-bottom:32px;position:relative;}
ins + ins h6 {margin-top:60px;}
body > h6 {top: 30px;right:30px;}
iframe.popup.ms h2 {padding-bottom:30px!important;}
iframe.popup.ms h3 {color:#7A86A1!important;font-size:12px;padding-bottom:17px;}
/* form elements */
p {font-size:0;margin:8px 0;}
label {display:inline-block;width:100%;margin-bottom:8px;padding-right:10px;}
label::before {content:attr(title);display:inline-block;white-space:nowrap;font-size:14px;width:fit-content;}
.hint {display:inline-block;position:relative;margin-right:-240px;min-width: 240px;height:12px;background:url(../res/icon/info.svg) center left no-repeat;}
.hint.active::after {content: attr(data-hint);position: absolute;bottom: 10px;left: 12px;padding: 5px 10px;background: #385f87;border-radius: 17px 17px 17px 0;box-shadow: -5px 8px 16px rgba(0, 0, 0, 0.1);color: #fff;/*font-size: 11px;*/z-index: 1;}
.multiple .hint {position:absolute;top:-20px;left:122px;}
.hint.ref {left:57px;}
input, output, select, textarea {display:inline-block;box-sizing:border-box;height:45px;font-size:14px;background:#fff;border:1px solid #7A86A1;border-radius:20px;outline:unset;color:var(--main10);padding:5px 20px;margin-top:5px;width:100%;appearance:none;}
.error {border-color:#CC1935;color:#CC1935;}
label select {background:#fff url(../res/arrow-dow.svg) top 20px right 20px no-repeat;}
textarea {min-height:130px;padding:10px 20px}
input:focus {background:var(--white);}
input[readonly], select[readonly], textarea[readonly], output[readonly],
input:disabled, output:disabled,
select:disabled, textarea:disabled {border-color:var(--main80);color:var(--main40);cursor:copy;}
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari only override */
input[type=datetime-local]{
padding-top:0;line-height:40px !important;
}
}
/* tables */
table {width:100%;border-collapse:collapse;margin-top:20px;background:#fff;}
th, td {text-align:left;vertical-align:middle;padding-left:15px;}
th > sub {display:block;font-weight:normal;font-size:12px;}
td > sub {display:block;font-size:12px;color:var(--main30);}
thead th {color:#7A86A1;font-weight:normal;font-size:12px;}
/* thead tr {border-radius:30px;} */
tbody th.group {border-bottom:1px solid #EBEBEB;padding-left:15px;}
tfoot th {font-size:12px;}
td.chk {padding-left:15px;}
tr th:first-child {color:#000;}
/* buttons */
button {position:relative;align-items:center;align-self:baseline; justify-content:center;height:45px;font-size:13px;color:#F7FDFF;margin-right:5px;border-radius:17px;transition:box-shadow .3s;border:0;cursor:pointer;}
button.mobile {display:flex;margin-right:0;/*width:140px;*/padding-left:45px;padding-right:15px;}
button.edit, button.back, button.nextpage, button.copy {font-size:0;width:45px;border-radius:17px;background:transparent;}
button.copy {position:absolute;right:13px;bottom:10px;width:35px;height:24px;}
button.copy:hover {transform:scale(1.1);box-shadow:unset;}
button.copy.pass::before {background:url(../res/icon/eye.svg) center no-repeat}
input.visible + button.pass::after {content:"/";position:absolute;left:13px;top:-4px;transform:rotate(54deg);font-size:30px;color:#7a86a1;}
button.copy.pass:hover {transform:none;}
button.nextpage {display:inline-block;vertical-align:middle;margin-bottom:8px;height:45px;padding:0;}
button.back {background:#fff;}
button.back:hover {box-shadow:unset;outline:unset;border:unset;}
button.back:hover::before {opacity:0.7;}
button.edit::before, button.back::before, button.nextpage::before, button.copy::before {content:'';display:inline-block;width:45px;height:20px;cursor:pointer;z-index:100;}
button.edit::before {background:url(../res/icon/r.svg) center no-repeat;background-size:18px;}
button.back {display:none;}
button.back::before {background:url(../res/icon/f.svg) center no-repeat;background-size:20px;width:45px;height:20px; opacity:1;}
button.nextpage::before {background:#EFF6F8 url(../res/settings-arrow.svg) center no-repeat;background-size:20px;width:45px;height:45px; opacity:1;border-radius:17px;}
button.copy::before {background:url(../res/icon/copy.svg) center no-repeat;background-size:17px;width:26px;height:23px; opacity:1;border-radius:17px;}
label.search::before {content:"";display:block;position:absolute;left:15px;top:15px;width:24px;height:24px;color:white;background:url(../res/search-icon.svg) no-repeat;}
.view {display:block;width:24px;height:24px;color:white;background:url(../res/search-icon.svg) no-repeat;}
button.red {background:#CC1335;font-weight:bold;}
button.blue {background:var(--info1);}
button.green {background:#61C474;font-weight:bold;}
button.focus {max-width:299px;}
button.list {background:#b0b0b0;border:1px solid #b0b0b0;font-weight:bold;}
button.disabled {background:#95A3B1;font-weight:bold;background:#CC1335;}
button:hover {box-shadow:4px 0px 15px #6149CD42;}
button:disabled {background:#b0b0b0;border:1px solid #b0b0b0;cursor:not-allowed;}
label.save {display:flex;margin-left:10px;}
select.time {display:inline-block;background:url(../res/new-time.svg) center no-repeat;width:32px;height:32px;background-size:22px;border-radius:50px;appearance:none;color:var(--main30);border:1px solid var(--main30);font-size:0;cursor:pointer;}
label.time {min-width:33px;width:33px;background:var(--main30);border-radius:50px;padding-right:0px;}
select.time:hover {font-size:14px;}
::placeholder {color:#121213;}
::-webkit-scrollbar {width:5px;height:5px;}
::-webkit-scrollbar-track {box-shadow:inset 0 0 2px #EBEBEB; border-radius:10px;}
::-webkit-scrollbar-thumb {background:#C0BDCC; border-radius:10px;}
::-webkit-scrollbar-thumb:hover {background:#7A86A1; }
.popup::-webkit-scrollbar {display:none;}
.popup {overflow-y:scroll;-ms-overflow-style:none; scrollbar-width:none;}
section.alert button::before {display:none;}
em {position:relative;}
.visible::after {content:"";display:inline-block;background:url(/res/eye.svg); background-repeat:repeat;width:18px;height:23px;background-repeat:no-repeat;position:absolute;right:10px;top:3px;}
.visible:hover::after {content:"/";color:#C0BDCC;text-align:center;}
button.submit {display:none;}
/* icons */
.icon {display:inline-block;width:45px;height:45px;cursor:pointer;background:#FFFFFF 0% 0% no-repeat padding-box;border:1px solid #EBEBEB;border-radius:19px;box-shadow:1px 8px 29px #695F9724;transform:scale(1);}
.icon:hover {transform:scale(1.1);}
.delete {background:url('data:image/svg+xml;utf8,') center center no-repeat;}
.close {background:url('data:image/svg+xml;utf8,')no-repeat center;}
.link {padding:0;text-decoration:underline;color:#4185ca;font-size:13px;cursor:pointer;}
.link:hover {text-decoration:none;}
main.detail label.q {max-width:unset;}
main.detail label.u {max-width:unset;}
main.detail label.t {max-width:unset;}
main.detail label.s input {line-height:45px;padding-right:15px;}
.x3 {height:150px;}
textarea.x3 {padding:15px;}
tr.order .u, tr.order .q,
tr.order .t, tr.order .s {width:100%;max-width:auto;}
tr.order .t {min-height:0;max-height:0px;}
tr.order.active .t {min-height:100px;height:100%;max-height:100px;transition:max-height .3s ease-in;}
a.more::after {content:'\21E8';color:var(--info1);font-size:12px;cursor:pointer;}
a.info::after {content:'\24D8';color:var(--info1);font-size:12px;cursor:pointer;font-weight:bold;}
a.info:hover::after {color:var(--alert1);}
article.s {width:100%;min-width:unset;max-width:unset;}
article.m {width:100%;min-width:unset;max-width:unset;}
article.l {width:100%;min-width:unset;max-width:unset;}
aside.s {width:100%;min-width:unset;max-width:unset;}
aside.m {width:100%;min-width:unset;max-width:unset;}
aside.l {width:100%;min-width:unset;max-width:unset;}
article nav.filter {position:absolute;right:32px;top:32px;}
/*DETAIL PAGE*/
main.detail aside article {margin-bottom:0;}
main.detail aside article.pie h2 {white-space: nowrap;}
/* label.title::before {position:absolute; top:0px;border-radius:0;}
label.title {margin-bottom:18px} */
label.preview {position:relative;border-radius:19px;width:100%;padding-top:56.25%;overflow:hidden;padding-right:0;}
label.preview::before {display:none;}
/* body.player label.preview {padding-top:59.25%;} */
label.preview iframe,
label.preview img {position:absolute;top:0px;left:0;bottom:0;right:0;width:100%;height:100%;}
h1 .status {text-transform:capitalize;}
.input-container b {display:inline-block;font-size:15px;color:#3C648C;}
main.detail aside article div {position:relative;margin-bottom:30px;height:350px;}
.input-container {position:absolute;left:0;top:22px; width:100%;height:100%;display:inline-block; border:1px dashed #7A86A1; border-radius:19px; text-align:center;padding-top:100px;line-height:25px;box-sizing:border-box;cursor:auto;transition:all .4s;}
.input-container.transcoding {top:0;padding-top: 0;background: #EFF6F8;}
.input-container img {width:85px;height:75px}
.input-container.transcoding img {position:unset;/*margin: 0 0 -10px 20px;width: 420px;*/margin:0 0 -10px 0px;width:100%; height: auto;}
.input-container.dragover {border-color:#3f6d9b;background: #eff6f8; box-shadow: 10px 10px 20px 1px #7d789142;}
.input-container p {font-size:14px;}
.input-container.transcoding p {font-weight:bold;}
.input-container em {font-style:normal;color:#7A86A1;display:block;}
.input-container label.file {position:relative; border:1px solid #e5e5e5;border-radius:19px;margin-top:5px;background:#fff;text-align:center;width:142px;box-sizing:border-box;line-height:37px;padding-left:22px;cursor:pointer;transition: box-shadow .3s;}
.input-container label.file:hover {box-shadow: 4px 0px 15px #6149CD42;}
.input-container label.file.disabled {pointer-events: none;background: #e5e5e5;cursor: not-allowed;}
.input-container .progress {display:none;border-radius:10px;margin:10px auto;width:60%;height:7px;background:#b0b0b0;}
.input-container .progress>div {border-radius:10px;width:0%;height:100%;background:#61C474;}
input[type="file"] {display:none;}
label.file::before {content:"Browse Files";padding:5px;display:inline-block; background-color:#fff;color:#7A86A1;cursor:pointer;z-index:999;font-size:12px;font-style:normal;}
label.file.disabled::before {background-color: #e5e5e5;}
label.file::after {content:'';display:inline-block;width:45px;height:45px;background:url(../res/icon-import.svg)center no-repeat;transform:rotate(-90deg);z-index:1;position:absolute;left:0;top:-2px; background-size:15px;}
ul.slide {display:none;align-items:center;justify-content:left;flex-wrap:wrap; margin:0;padding:0; min-height:unset!important;margin-top:35px;position:relative;}
.tab-settings ul.slide {display:flex;}
ul.slide::before {content:'Video covers';display:inline-block; position:absolute;top:-27px;font-size:15px;}
ul.slide img.slide {width:86px;height:66px;border:3px solid #3C648C;position:relative;border-radius:17px;box-sizing:border-box;margin-right:15px;margin-bottom:15px;}
.input-container.slide {width:86px;padding-top:18px;line-height:10px;margin-bottom:15px;position:relative;left:unset;right:unset;top:unset;bottom:unset;display:inline-block;box-sizing:border-box; border:1px dashed #7A86A1;border-radius:17px;text-align:center;height:66px;}
.input-container.slide img {width:20px;height:unset;}
.input-container.slide label.file::before {content:'Upload cover';color:#3C648C;}
.input-container.slide label.file::after {display:none;}
.input-container.slide label.file {width:100%;height:auto; border:none;padding:0;line-height:normal;margin-top:0px;}
.input-container.error,
.input-container.error em,
.input-container.error label.file,
.input-container.error label.file::before {border-color:#CC1935;color:#CC1935;}
ul.slide button {display:inline-block;border-radius:50px;background:#fff url(../res/icon-close.svg) center no-repeat;background-size:9px; width:20px;height:20px;position:absolute;top:7px;right:18px;opacity:0;}
ul.slide button:hover {opacity:1;}
ul.slide img:hover + button {opacity:1;}
.txt p {font-size:14px;}
@media screen and (min-width:660px) {
article.s, h1.s {width:100%;min-width:unset;max-width:unset;display:inline-block;}
article.m, h1.m {width:100%;min-width:unset;max-width:unset;}
article.l, h1.l {width:100%;min-width:unset;max-width:unset;}
aside.s {width:100%;min-width:unset;max-width:unset;box-sizing:border-box;float:right;}
main.dashboard aside.s {float:unset;}
aside.m {width:100%;min-width:unset;max-width:unset;}
select.time {background:none;border-radius:4px;appearance:auto;width:100%;font-size:14px;color:#000;}
label.time {border-radius:0px;width:auto;background-color:var(--main90);margin-right:4px;}
main.popup label.t {width:50% !important;height:45px;float:left;box-sizing:border-box;}
.multiple label {flex:0 0 30%;align-self:baseline;}
.multiple label.s {flex:0 0 16%;min-width:unset;}
.multiple label.add {flex:0 0 48%;}
}
@media screen and (min-width:1024px) {
button.submit {display:inline-block;}
.mobile {display:none;}
.u {width:12.5%;}
.q {width:25%;}
.t {width:37.5%;}
.s {width:50%;}
.su {width:62.5%;}
.sq {width:75%;}
.st, label.st {width:87.5%;}
main.detail label.s input {line-height:45px;}
/* main.detail p label:last-of-type {padding-right:0px;} */
.list-project {display:flex;flex-wrap:wrap;}
label.grid {right:0px;}
label.list {right:50px;}
}
@media screen and (min-width:1280px) {
/* grid system */
article.s, h1.s, aside.s {width:50%;}
article.l, h1.l, aside.l {width:100%;}
/* main.detail label.t {max-width:356px;} */
.multiple {width:unset;}
}
/* misc */
/*new vision Iva 09-10-23*/
label {font-size:14px;font-weight:500;position:relative;}
label.group select {background:#fff url(../res/arrow-dow.svg) top 20px right 10px no-repeat;}
label.search {max-width:315px;}
label.search input {padding-left:40px;}
label.code input {margin-top:0px;}
section label.x {margin-top:15px;}
section header input, section header select {margin-top:0px;}
/*checkbox style*/
td.check {text-align:center;vertical-align:middle;}
input.check, input[type="radio"]{margin:0;width:20px;height:20px;opacity:0;position:absolute;box-sizing:border-box;z-index:1;cursor:pointer;padding:0;}
label.check {margin:0px;width:auto;cursor:pointer;font-weight:normal;line-height:18px;clear:both;text-align:center;padding:0;color:#7A86A1;/*23-06-26 Iva comment width:20px;*/}
label.check::before {content:'';display:inline-block;width:20px;height:20px;color:#607D8B;text-align:center;line-height:20px;border-width:2px;vertical-align:top;border:1px solid#C0BDCC;border-radius:6px;background-color:#fff;margin-right:10px;}
input.check:checked + label.check::before, input[type="radio"]:checked + label.check::before{background:url(../res/icon-tick.svg) no-repeat; font-size:14px;border:unset;}
th label.check::before {color:#fff;border:1px solid #fff;}
label.check::after {content:attr(title);white-space:nowrap;font-size:14px;margin-left:3px; margin-right:5px;}
table label.check::after {display:none;}
a.forgot {display:none;width:50%;padding-left:8px;font-size:14px;color:#3C648C;font-size:14px;cursor:pointer;}
/* HEADER*/
body {position:relative;font-family:'Roboto', sans-serif;font-size:14px;color:light-dark(#263238,#fff);background:linear-gradient(89deg, var(--gradient-start) 0%, var(--gradient-end) 100%) 0% 0% no-repeat padding-box;/*overflow:visible; */}
body.login, body.logout {background-color:light-dark(#fff,#1a1a1a);}
body > header > h1.title {display:none;}
body > header {position:sticky;top:0;height:67px;max-width:1920px;margin:auto;text-align:center;color:light-dark(#fff,#fff);background:linear-gradient(89deg, var(--gradient-start) 0%, var(--gradient-end) 100%) 0% 0% no-repeat padding-box;z-index:101;}
body>header::before, body>header::after {content:'';position:absolute;bottom:-50px;left:0px;width:50px;height:50px;background:transparent;border-radius:30px 0 0 0;box-shadow:-10px -20px 0 0 light-dark(#3c658e,#1a1a1a);}
body>header::after {right:0;left:unset;border-radius:0 30px 0 0;box-shadow:20px -20px 0 0 light-dark(#488ed2,#1a1a1a);}
body > header > a {display:inline-block;background:url(../res/logo/new-logo-evolink.svg) center no-repeat;width:130px;background-size:130px;height:45px;margin-top:5px;}
/* NAVIGATION */
body > header > nav {left:0;top:27px;overflow:auto;margin-left:0px;background:transparent;position:relative;max-width:224px;text-align:left;padding:0px 20px;opacity:0;pointer-events:none;transition:opacity 0.2s ease-in-out;}
body > header > nav::before {display:block;content:attr(title);width:100%;box-sizing:border-box;cursor:pointer;position:absolute;bottom:50px;}
body header nav > a {border-radius:17px;height:45px;line-height:45px;text-align:left;min-width:190px;display:block;padding-left:65px;}
body header>nav > a.active,
body header>nav > a:hover {background:#fff;color:#CC1335;font-weight:600;}
body nav a::before {content:'';display:inline-block;width:25px;height:24px;position:absolute;left:15px;top:50%;transform:translate(0, -50%);}
nav a.security::before {background:url(../res/icon/template.svg)center no-repeat;}
nav a.list::before {background:url(../res/apps-icon.svg)center no-repeat;}
nav a.fls::before {background:url(../res/menu-camera.svg)center no-repeat;}
nav a.vod::before {background:url(../res/menu-movie.svg)center no-repeat;}
nav a.player::before {background:url(../res/icon/player.svg)center no-repeat;}
a.statistic::before {background:url(../res/icon/statistic.svg)center no-repeat;}
a.video::before {background:url(../res/video-content.svg)center no-repeat;}
a.settings::before {background:url(../res/settings.svg)center no-repeat;}
a.help::before {background:url(../res/help.svg)center no-repeat;}
li.active > a.video::before {background:url(../res/video-content-red.svg) center no-repeat;}
li.active > a.settings::before {background:url(../res/settings-red.svg)center no-repeat;}
li.active > a.statistic::before {background:url(../res/icon/statistic-red.svg)center no-repeat;}
li.active > a.help::before {background:url(../res/help-red.svg)center no-repeat;}
body header >nav >ul {margin-left:1px;}
body header> nav li {width:190px;}
body header> nav li>a {display:flex;align-items:center;justify-content:center;background:#fff;color:#3C648C;font-weight:600;border-radius:17px;margin-bottom:30px;line-height:45px;}
body header> nav li>a.has-sub::after {content:'';display:inline-block;width:20px;height:24px;position:relative;background:url(../res/arrow-dow.svg) center no-repeat;position:absolute;right:12px;}
body header> nav li.active>a.has-sub::after {background:url(../res/arrow-dow-red.svg) center no-repeat;}
body header> nav li.active >a {color:#CC1335;}
body header> nav li.active nav >a.active, body header> nav li.active nav >a:hover{outline:1px solid #EBEBEB;}
body header> nav li.active > nav {border-top:1px solid #fff;border-bottom:1px solid #fff;padding-top:30px;margin-bottom:30px;padding-bottom:20px;}
body header> nav li.active > nav a {margin-bottom:10px;}
body menu {min-width:32px;font-size:0;display:none;position:absolute;right:0;top:77px;z-index:1;}
body menu a {min-width:200px;color:#7A86A1;text-align:left;height:35px;padding:0px 23px;background-color:#fff;}
body.menu-active {overflow:hidden;height:100vh; }
body.menu-active >header::before,
body.menu-active >header::after {display:none;}
body.menu-active header > nav {pointer-events:all;opacity:1;}
body.menu-active header > nav > a {display:block;}
body.menu-active header > nav.tab {padding:0;}
body.menu-active header > nav.tab > a {display:block;min-width:75px;}
body.menu-active header::after {left:268px;}
body.menu-active header nav a span {display:none;}
.side-bar {display:inline-block;;z-index:103;position:fixed;left:15px;top:20px;width:30px;height:30px;cursor:pointer;background:none;}
.side-bar em {display:inline-block;width:30px;height:3px;background-color:#fff;transition:.05s cubic-bezier(0.68, -0.6, 0.32, 1.6);border-radius:20px;position:absolute;top:10px;left:4px;}
.side-bar::after , .side-bar::before {content:"";display:block;position:absolute;top:0px; left:4px;width:30px;height:3px;background:#fff;transition:.05s ease-in;transition-property:all;transition-property:transform;border-radius:20px; }
.side-bar::after {top:20px;width:25px;}
body.menu-active .side-bar::after {transform:translate(0, -11px) rotate(45deg);top:21px;width:30px;}
body.menu-active .side-bar::before {transform:translate(0, 11px) rotate(-45deg);}
body.menu-active .side-bar em {width:0;height:0;}
body.menu-active main {left:268px;top:67px;width:100%; z-index:105;position:absolute;transition:left .5s ease-in;height:100vh;}
body main::after {content:'';display:block;width:25px;height:0;background-color:light-dark(#F5FAFE,#000);box-shadow:4px 22px 54px #695F977A;border-radius:30px 0 0 0 ;position:absolute;top:22px;left:-25px;opacity:0;transition:opacity .5s;}
body.menu-active main::after {opacity:0.44;height:100%;}
body > .active a, body > menu.user.active + menu a {display:flex;align-items:center;justify-content:center;font-size:14px;height:45px;line-height:45px;}
body > menu.user.active {top:8px;}
/* body > menu.user.active + menu a.display {display:none;} */
body menu ul {max-height:0px;width:314px;background:transparent ;border-radius:30px;text-align:center;position:relative;line-height:30px;padding-bottom:15px;transition:all .3s ease-in-out;}
body menu ul li {list-style-type:none;width:100%;height:100px;max-height:0;font-size:0;}
body menu ul::after {content:'';display:block;background:transparent linear-gradient(69deg, #3C648C 0%, #3C648C 34%, #4991D8 100%) 0% 0% no-repeat padding-box;border-radius:25px;width:100%;height:100%;max-height:0px;position:absolute;top:0;z-index:0;}
body menu ul li.img {z-index:1;display:inline-block;width:100px;margin:0 auto;border-radius:50px;background:#FFF4F2 url(../res/user.png) top 20px left 16px no-repeat;position:relative;margin-top:89px;box-shadow:4px 22px 54px #695F977A;}
body > menu.user {display:inline-block;position:fixed; width:40px;height:66px;background:url(../res/account.png) center no-repeat;background-size:70px;top:8px;right:15px;cursor:pointer;z-index:101;font-size:0;}
body > menu.user::after {display:none;}
body > menu.user.active + menu ul li.name {color:#000;font-weight:bold;font-size:16px;max-height:20px;}
body > menu.user.active + menu ul li.email {color:#7A86A1;font-size:14px;max-height:20px;}
body menu::after {content:'';display:block;width:314px;background:#FFFFFF 0% 0% no-repeat padding-box;box-shadow:4px 22px 54px #695F971A;border-radius:30px;position:absolute;top:16px;z-index:-1;height:100%;}
body menu a:hover {background:#FFF4F2 0% 0% no-repeat padding-box;color:#000;}
body > menu.user.active::after {display:block;width:10000%;height:1000%;left:-10000%;position:absolute;background:none;border:none;box-shadow:none;max-height:unset;z-index:-2;outline:2000px transparent;}
body > menu.user.active + menu ul {max-height:300px;transition:all .3s ease-in-out;width:314px;z-index:1;}
body > menu.user.active + ul {max-height:240px;transition:all .3s ease-in-out;width:314px;z-index:1;padding-bottom:50px;}
body > menu.user.active + menu ul::after{max-height:140px;}
body > menu.user.active + menu ul li {max-height:100px;font-size:100%;transition:all .3s ease-in-out;}
body > menu.user.active + menu, body menu.active {display:inline-block;top:77px;z-index:101;}
body > header > form {position:absolute;left:40px;bottom:100px;}
body > header > form > label.t {min-width:190px;max-width:190px;}
body > label {width:40px;position:fixed;right:49px;top:8px; background:url(../res/icon/earth-mobile.svg) center no-repeat;background-position:left;background-size:22px;z-index:101;}
body > label::before {display:none;}
body > label select {background:none;color:#fff;border:none;appearance:auto;}
a.display {position:relative;}
a.display::after {content:'';display:none;width:20px;height:20px;background:url(../res/arrow-dow.svg) center no-repeat;transform:rotate(-90deg);position:absolute;top:12px;right:20px;background-size:auto;}
body > menu.user.active + menu a.display::after {display:inline-block;}
body.logout header {height:126px;}
nav.tab a::before {display:none;}
/* .settings {display:none;} */
.settings ul::after {display:none;}
.settings ul {font-size:12px;color:#7A86A1;text-align:left;}
.settings ul li {color:#000;height:auto;}
.settings button {float:right;clear:both;}
.settings h2 {display:inline-block;font-size:18px;margin-top:0px;}
ul.layout li {display:inline-block;vertical-align:top;width:130px;height:auto;margin-top:30px;}
ul.layout li label.check {position:absolute;bottom:26px;right:0;font-size:0;}
figcaption {text-align:center;color:#7A86A1;}
input[type="radio"]:checked + label.check::before + img{box-shadow:5px 5px 23px #695F973A;color:#000;}
.switch {position:relative;display:inline-block;width:36px;height:20px;float:right;padding-right:0;margin-right:60px;}
.switch input {opacity:0;width:0;height:0; }
/* span {position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#F6EFFF;-webkit-transition:.4s;transition:.4s;} */
.switch span:before {position:absolute;content:"";height:16px;width:16px;left:2px;bottom:2px;background-color:white;-webkit-transition:.4s;transition:.4s;}
.switch input:checked + span {background-color:#3D6792;}
.switch input:focus + span {box-shadow:0 0 1px #3D6792; }
.switch input:checked + span:before {-webkit-transform:translateX(16px);-ms-transform:translateX(16px);transform:translateX(16px); }
.switch span.round {border-radius:34px; }
.switch span.round:before {border-radius:50%;}
a.logout {position:relative;;margin-top:20px !important;}
a.logout::after {content:'';position:absolute;top:-10px;left:0;width:100%;height:1px;background:#695F971A;pointer-events:none;}
a.logout::before {content:'';display:inline-block;background:url(../res/icon-import.svg) no-repeat;width:20px;height:20px;background-position:left;vertical-align:middle;padding-right:5px;visibility:hidden;}
body > menu.user.active + menu >a.logout::before {visibility:visible;}
sub {display:block;}
.tablet {display:none;}
/*LOGIN PAGE*/
body.login > header, body.logout > header{height:auto;padding:15px 57px 44px 30px;text-align:left;}
body.login > header > a, body.logout > header > a{margin-top:0px;}
body.login .side-bar, body.logout .side-bar{display:none;}
body.login > header > h1.title,
body.logout > header > h1.title {display:block;margin-top:10px;margin-bottom:0px;font-size:28px;letter-spacing:-0.28px;text-align:left;color:#fff;font-weight:normal;}
div.img-place {display:none;}
body.login form {background:#fff;position:relative;}
section.alert {padding:35px 30px 57px 30px;}
/* body.login section.alert,
body.logout section.alert {background:#fff;} */
label.check::after {margin-left:0px;}
body.login input {height:50px;padding-left:20px;}
body.login button, body.logout button {height:55px;border-radius:22px;background:transparent linear-gradient(90deg, #3C648C 0%, #3E6995 47%, #4990D7 100%) 0% 0% no-repeat padding-box;}
section.alert footer {margin-top:41px;}
body.login p.check {margin-top:20px;}
body.login label::before {display:block;}
/*DASHBOARD PAGE*/
main.dashboard {padding:15px 15px 0;display:block;height:unset;}
main.dashboard h2 {color:#7A86A1;margin:0px 0 10px 0;font-weight:normal;font-size:14px;max-width:100%;}
main.dashboard h3 {margin:0;}
main.dashboard nav {display:block;}
main.dashboard nav a::before {display:none;}
main.dashboard a {position:relative;background:#4584C2;width:100%;padding:0px 20px; display:inline-block;border-radius:22px;margin-top:20px;color:#fff;font-size:22px;text-align:left;}
main.dashboard nav a.live {background:#4584C2 url(../res/video_camera.svg)center no-repeat;background-position-x:right;background-size:contain;}
main.dashboard nav a.video {background:#4584C2 url(../res/movie_fly.svg)center no-repeat;background-position-x:right;background-size:contain;}
main.dashboard a:last-of-type {margin-right:0px;}
main.dashboard button {display:block;background:#FFFFFF 0% 0% no-repeat padding-box;box-shadow:2px 14px 32px #6149CD1A;border-radius:22px;color:#3C648C;font-size:16px;height:45px;max-width:100%;margin:0px; text-align:left;padding-left:20px;margin-bottom:20px;}
main.dashboard nav a::before {content:'';display:block;background:#fff;width:30px;height:30px;margin-bottom:10px; border-radius:50px;padding-right:0;position:relative;left:unset;top:15px;}
main.dashboard nav a.live::after {background:url(../res/video-camera.svg)center no-repeat;background-size:18px;}
main.dashboard nav a::after {content:'';display:inline-block;position:absolute; width:30px;height:30px;font-size:45px;top:10px;left:10px;}
main.dashboard nav a.video::after {background:url(../res/s-green.svg)center no-repeat;background-size:18px;}
main.dashboard nav {display:flex;max-width:100%;margin-bottom:15px;}
main.dashboard nav a {position:relative;display:inline; height:94px;border-radius:22px;margin-top:0;margin-right:10px;font-size:12px;text-align:left;padding:10px;font-weight:bold;}
main.dashboard nav a:last-of-type {margin-right:0px;}
main.dashboard button {background:#FFFFFF 0% 0% no-repeat padding-box;box-shadow:2px 14px 32px #6149CD1A;border-radius:22px;color:#3C648C;font-size:16px;height:55px;text-align:left;display:block;}
main.dashboard nav a span {display:block;width:100%; font-size:12px;position:relative;background:none;font-weight:normal;}
main.dashboard section {display:block;background:none; padding:0;margin:0px;}
main.dashboard aside.s {position:relative;/*width:100%;*/padding:20px;background:#fff;border-radius:30px;}
main.dashboard section article.s {/*flex:0 1 100%;*/background:#fff;border-radius:30px;padding:15px;margin-bottom:15px;}
main.dashboard aside article {height:100%;padding:20px;}
main.dashboard article h2 {color:#000;display:inline-block;font-size:22px;}
main.dashboard article label.period {width:140px;margin:0;float:right;}
main.dashboard article label::before {display:none;}
label.period select, label.period input {border-width:0 0 0 1px;border-radius:0;outline:none;margin-top:0px;}
label.period:last-of-type input {border:none;}
.log li {display:flex;align-items:center;justify-content:space-between;}
main.dashboard .log li a {background:transparent url(../res/ellipsis-solid.svg)center no-repeat;width:40px;height:7px;background-size:18px;margin-top:0px;}
main.dashboard .log li {margin-bottom:20px;}
.log time {display:block;color:#7A86A1;font-size:14px;font-weight:medium;}
a.profile, a.account, a.logout {justify-content:left!important;padding-left:20px;margin:0 10px;border-radius:20px;}
table.usages th, table.usages td {height:20px;padding:10px 20px;background:#000;color:#fff;}
/*MAIN*/
body > main {display:flex;flex-direction:column;align-items:center;overflow:visible;margin:0px 0;margin-top:0px;padding:0px; max-width:100%;background-color:light-dark(#F5FAFE,#000);left:0px;top:0;transition:left .5s ease-in;border-radius:25px;border-bottom-right-radius:0; border-bottom-left-radius:0;z-index:100;}
body > main.large {max-width:2560px;}
body > main >form {width:100%;}
body > main.large > form,
body > main section {height:auto;}
main header {width:100%;display:block;margin:0px;border-radius:4px;padding-bottom:10px;box-sizing:border-box;}
main form>header {min-height:75px;padding:15px}
main form>header h1 {line-height:45px}
main header > label {margin-bottom:0;position:relative;}
main header > label::before {display:none;}
main header > label.group {padding-right:0;margin-right:5px;}
body. main.detail header, body.player main.detail header {display:flex;align-items:center;justify-content:space-between; }
main header h1 {display:inline-block;vertical-align:middle;font-size:22px;letter-spacing:-0.55px;text-align:left;white-space:nowrap;margin-right:10px;}
nav.preset a .delete {display:none;position:absolute;right:2px;top:2px;width:16px;height:16px;border-radius:4px;background-size:16px 16px;}
nav.preset a .delete:hover {border:1px solid red;}
nav.preset a:hover .delete {display:block;}
nav.status {text-align:center;margin-top:15px;display:inline-block;width:auto;}
nav.status label {width:71px;padding:0px 5px;text-align:center;cursor:pointer;border-radius:17px;line-height:45px;height:45px;background:#fff;color:#7A86A1;font-size:14px;}
nav.status label::before {font-size:14px;}
nav.status label.active, nav.status label:hover {background:#3D6792;color:#fff;font-weight:bold;}
nav.status input {visibility:hidden;}
main section {background-color:light-dark(#fff,#1a1a1a);padding:30px 0px;border-radius:30px 30px 0 0 ;}
main.large section {padding:0px;}
section header label {padding-right:0px;margin-right:0px;}
section header label.s {max-width:190px;}
section header label:hover select {font-weight:bold; background:#6149CD url(../res/arrow-dow-white.svg) top 20px right 20px no-repeat;color:#fff;transition:background-color .3s;}
main.detail section header label select {margin-top:0px;cursor:pointer;transition:background-color .3s;}
header.main label {max-height:45px;min-height:45px;position:relative;display:flex;align-items:center;justify-content:center; box-sizing:border-box;padding:0px 32px;margin-bottom:15px;width:auto; min-width:155px;max-width:250px;background:#fff url(../res/icon/j.svg) center no-repeat;background-position-x:15px;color:#3D6792;margin-right:15px;border-radius:17px;text-align:center;cursor:pointer;}
header.main label input {width:100%;min-width:unset;height:40px;margin:0;padding:0;position:absolute;top:0;left:0;border:unset;background:no-repeat;z-index:-1;}
header.main {display:flex;flex-wrap:nowrap;align-items:baseline;justify-content:left; overflow:auto;padding:0px 15px;min-height:unset;}
header.main label a {display:inline-block;background:url(../res/icon/delete.svg) center no-repeat;width:11px;height:11px;position:absolute;right:13px;top:18px;}
header.main label a:hover {background:url(../res/icon/delete-red.svg) center no-repeat;}
/*TABLE*/
thead tr > th > div {position:relative;max-height:0px;transition:max-height .3s ease-in;overflow:hidden;}
thead tr.active > th {padding-top:20px;padding-bottom:20px;vertical-align:top;}
thead tr.active > th > div {max-height:max-content;transition:max-height .3s ease-in;overflow:visible;}
thead tr.active > th > div.s {max-width:unset;}
thead tr.active > th > div label {position:relative;margin:0;}
thead tr.active > th > div input, thead tr.active > th > div select {width:100%;}
thead tr.active > th > div sub input {margin-top:10px;}
thead tr th.button {padding:0;width:30px;}
thead a.filter {display:block;width:36px;height:36px;position:relative;top:0px;right:0px;background:url('data:image/svg+xml;utf8,') no-repeat center 10px;}
table tr {padding:0;padding-left:15px;}
thead tr {position:sticky;top:0px;background:#fff;outline:solid 0px #EBEBEB;box-shadow:0px 2px 0px #EBEBEB;}
tbody tr {background-color:light-dark(#fff,#1a1a1a);cursor:pointer;}
tbody tr:nth-child(2n) {background-color:light-dark(#EFF6F8,#000);}
th[data-order] {cursor:pointer;position:relative;}
tbody tr:hover {box-shadow:2px 5px 2px -1px #695F9721;position:relative;}
th[data-order]::before {content:"";display:none;padding:0 0px;position:absolute;left:2px;top:45%;transform:translate(0px, -50%);}
th[data-order]:hover::before {content:"\2193";display:inline-block;}
th[data-order].button::before {display:none;}
th[data-order].asc, th[data-order].desc {font-weight:bold;}
th[data-order].asc::before {content:"\2193";display:inline-block;}
th[data-order].asc:hover::before {content:"\2191";;}
th[data-order].desc::before {content:"\2191";display:inline-block;}
th[data-order].desc:hover::before {content:"\2193";}
table tr.disabled td {color:#A8A8A8;}
table.block,
table.block thead,
table.block tbody,
table.block tfoot,
table.block tr,
table.block th,
table.block td {box-sizing:border-box;display:block;}
table.block td::before {content:attr(title)':';font-weight:bold;}
.sent td {background:#efe;}
.schedule td {/*content:'';display:block;position:absolute;top:0;left:0;right:0;bottom:0;background:red;*/
animation:NAME-YOUR-ANIMATION 2s infinite; /* IE 10+, Fx 29+ */
}
@-webkit-keyframes NAME-YOUR-ANIMATION {
0%, 49% {background-color:white;}
50%, 100% {background-color:#fee;}
}
/* main content */
main.detail section {padding:15px 15px;}
main.large section header {position:sticky;z-index:3;padding:15px 15px 0;}
main.large.detail section {margin:0px;padding:0 0 45px;}
main.detail section header {justify-content:space-between;}
main.detail section header span {position:relative;color:#3D6792;}
main.detail section footer {position:relative;margin-top:20px;background:none;box-shadow:none;display:inline-block;text-align:right;}
.security main.detail section footer {margin-top:0;}
main.large.detail section footer {position:fixed;background-color:#fff;box-shadow:0px 2px 15px #4A5A6E29;display:flex;align-content:space-between;flex-wrap:wrap;align-items:center;padding:0;}
main.large.detail section footer label {display:flex;align-items:center;padding:0 30px;color:#7A86A1;font-weight:normal;max-width:120px;}
main.large.detail section footer label select{border:none;padding:0 15px;height:45px;margin:0;color:#7A86A1;}
main.detail section footer button {width:124px;height:40px;position:relative;}
/* main.detail section footer button.wait {background:#b0b0b0 url(https://i.gifer.com/ZKZg.gif) no-repeat center;background-size:25px;font-size:0;} */
button.wait::before {content:'';background:url(https://i.gifer.com/ZKZg.gif) no-repeat center;background-size:35px;width:35px;height:35px;position:absolute;left:-40px;top:2px;}
main.large section table thead {position:sticky;top:0;z-index:1;}
main.large.detail section table thead {position:sticky;top:67px;z-index:3;}
main.detail h1.s {padding-left:20px;}
main.detail h2 {max-width:40%;}
main.detail .icon.print {display:none;}
main.detail section:nth-of-type(2) {margin-top:20px;}
main.detail section::after {content:"";display:block;clear:both;}
main.popup button {width:76px;height:40px;font-size:13px;margin-bottom:10px;margin-left:0;margin-right:5px;vertical-align:bottom;}
main.detail p {margin:0px;}
main.detail p label {/*width:100%;margin-bottom:10px;*/box-sizing:border-box;padding-right:0px;}
main.detail p.security {display:flex;}
p.security.s {float:left;}
main.detail p.security.hide {display:none;}
/*main.detail p.security label::before {position:absolute} */
/* p.security input, p.security select, p.security textarea{margin-top:22px} */
main.detail p.security a {align-self:center;margin:15px 0 0 15px;background:#EFF6F8;width:45px;height:45px;opacity:1;border-radius:17px;}
/* main.detail p label input, main.detail p label select, main.detail p label textarea {margin-top:25px;} */
/* main.popup button:hover {background:#fff;color:#7B7B7B;box-shadow:1px 8px 29px #695F9724;border:1px solid #7B7B7B;} */
/* article.s label::before {display:inline-block;position:absolute;} */
aside th {color:#C0BDCC;border-bottom:1px solid #EBEBEB;}
/*GRID TEMPLATE*/
.list-project {display:flex;flex-wrap:wrap;justify-content:left;padding:15px 15px;}
.list-project >li {display:block;width:48%; height:156px;margin-bottom:20px;padding:20px 0px;text-align:left;padding-left:20px;padding-right:20px; background:#fff;border-radius:30px;box-shadow:2px 13px 54px #695F9714;cursor:pointer;}
.list-project li::before {content:'';position:relative;margin:0 auto; display:block;width:100%;height:90px;margin-bottom:10px;border-bottom:1px solid #EBEBEB;transition:opacity 0.3s ease;}
.list-project li.video::before {background:#fff url(../res/movie.svg) center no-repeat;}
.list-project li.live::before {background:#fff url(../res/video-camera.svg) center no-repeat;}
.list button, .add-live button, .add-video button {/*width:111px;*//*width:140px;*/margin-right:0;}
.add {position:absolute;/*right:280px;*/ background:#61A6C4 url(../res/d.svg) center no-repeat;background-position-x:15px;margin-right:15px;padding-left:45px;background-size:20px;right:0;/*width:140px;*/padding-right: 23px;}
.add-folder {background:#4583C0 url(../res/icon/u.svg) center no-repeat;background-position-x: 15px;background-size: 20px;margin: 0 15px 15px 0;padding-left: 45px;min-width: 140px;padding-right: 23px;white-space: nowrap;}
.add.live {background:#F96767 url(../res/d.svg) center no-repeat;background-position-x:15px;background-size:20px;}
.add.help {background-color: #4176AB;}
section header button, button.mobile {background:#61C474 url(../res/s.svg) center no-repeat;background-size:20px;background-position-x:15px;position:relative;right: unset;float:right;}
section header button.add, button.mobile.add{background:#61C474 url(../res/d.svg) center no-repeat;background-size:20px;background-position-x:15px;position:relative;right: unset;}
main.detail section header span.status {display:inline-block;vertical-align:middle;min-width:111px;line-height:40px;border-radius:17px;text-align:center; color:#61C474;background-color:#EFF6F8;height:40px;font-size:14px;font-weight:normal;letter-spacing:0;margin-left:10px;}
main.detail section header span.status-1 {color:#CC1335;}
.status-1 select {color:#CC1335;}
.status1 select {color:#61C474;}
.list-project h3 {position:absolute;bottom:40px;left:0;right:0;text-align:center;}
.add-help .list-project li.add {background:transparent linear-gradient(89deg, #3C648C 0%, #4991D8 100%) 0% 0% no-repeat padding-box;}
.add-help .list-project li::before {background: #fff url(../res/help.svg) center no-repeat;background-size:50px;}
/*DETAIL PAGE LIST_PROJECT*/
main.detail article button.edit {background:#EFF6F8 ;width:45px;height:45px; opacity:1;border-radius:17px;vertical-align:middle;}
main.detail article p.security a::before {content:"";display:inline-block; background:url(../res/icon/r.svg) center no-repeat;background-size:20px;width:45px;height:45px;}
main.detail article button.edit::before {background:#EFF6F8 url(../res/icon/r.svg) center no-repeat;background-size:20px;width:45px;margin-right:0;}
main.detail .list-project li {background:#fff;}
main.detail .list-project li::before {content:"";display:inline-block;width:40px;height:40px;position:absolute; left:auto;top:39px;transform:scale(1);}
main.detail .list-project li.video::before {background:#fff url(../res/movie.svg) no-repeat;transition:all 0.3s ease;}
main.detail .list-project li.video.directory::before {background:#fff url(../res/directory.svg) no-repeat;background-size:38px;transition:all 0.3s ease;}
main.detail .list-project > li.live::before {background:#fff url(../res/video-camera.svg) no-repeat;background-size:38px;transition:all 0.3s ease;}
main.detail .list-project li:hover::before {transform:scale(1.2);}
main.detail p.publishtab {margin:20px 0 10px;}
main.detail p.publishtab.tab {margin:0;margin-bottom:10px;}
p.publishtab label {color:#7A86A1;font-size:12px;/*text-transform:uppercase; 2024-17-06 Iva comment*/}
/* p.publishtab label::before {display:none;font-size:12px;} */
p.publishtab label input, p.publishtab label select {color:#000;border:none;font-size:14px;}
p.publishtab.tab label::before {display:block;}
p.publishtab input {height:15px;padding:0;}
p.publishtab.tab input {background-color:#EFF3FF;height:30px;border-radius:12px;margin-right:10px;padding:0 15px;text-align:center;}
main.detail h1 label {margin:-10px 0 0;padding:0;vertical-align:top;}
main.detail h1 label select {margin:0;width:200px;}
main.list-project> a {max-width:185px;padding-bottom:20px; background:#fff;border-radius:30px;box-shadow:2px 13px 54px #695F9714;}
.mobile {display:none;}
.list-project li a::after {content:'';display:inline-block;position:absolute;right:0px; background:url(../res/edit.svg) center no-repeat;width:20px;height:20px; padding:0px 20px;transition:transform 0.3s;}
.add-live .list-project li a::after {background:url(../res/edit-live.svg) center no-repeat;}
.add-help .list-project li a::after {background:url(../res/edit-help.svg) center no-repeat;}
.list-project li a:hover::after {transform:scale(1.1);}
.list-project li.add {position:relative;background:#61A7C4;right:unset;color:#fff;}
.list-project li.add::before {background:url(../res/d.svg) center no-repeat;}
.list-project li.live::after {background:url(../res/file-export-live.svg) center no-repeat;}
.list-project li:hover::before {opacity:0.7;}
.add-live .list-project li.add {background:#F96767;}
section header label.s {max-width:160px!important;}
main.detail h2.processing {text-align: center;width:100%;max-width: 100%;display:flex;align-items: center;align-content: center;justify-content: center;font-size: 24px;position: absolute;top: 50%;}
/*LIST TEMPLATE*/
.list table {display:table;margin-top:0px;padding:0;background:none;-moz-border-radius:30px;-webkit-border-radius:30px;border-radius:30px;}
.list table th {padding-top:10px;padding-bottom:10px;background:#fff;color:#7A86A1;}
.list table th:last-of-type {padding-right:15px;}
.list table thead tr {background:none;}
.list table td {position:relative;color:#000;padding:11px;height:45px;max-width:170px;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;}
.list table td.live::before {content:'';display:inline-block;width:30px;height:20px;position:relative;top:0px;left:0px; background:url(../res/video-camera.svg) center no-repeat;background-size:25px;z-index:0;}
.list table td.video::before {content:'';display:inline-block;width:30px;height:20px;position:relative;top:0px;left:0px; background:url(../res/movie.svg) center no-repeat;background-size:21px;z-index:0;}
.list span, .list em {position:relative;display:inline-block;width:auto;}
.list img {max-width:75px;border-radius:8px;position:absolute; left:10px;top:10px;}
td.statistic::before {content:'';display:inline-block;width:30px;height:20px;background:url(../res/statistic.svg) center no-repeat;background-size:21px;}
td.publish::before {content:'';display:inline-block;width:30px;height:20px;background:url(../res/upload.svg) center no-repeat;background-size:21px;}
td.security::before {content:'';display:inline-block;width:30px;height:20px;background:url(../res/key-hole.svg) center no-repeat;background-size:21px;}
nav.breadcrumb {display:none;}
nav.tab {display:flex;align-items:center;align-self:center;flex-wrap:nowrap;overflow:auto;margin-top:10px;margin-bottom:10px;}
nav.tab a.active, nav.tab a:hover {background-color:#3C648C;color:#fff;border:none;outline:none;font-weight:normal;}
nav.tab a {align-items:center;width:140px;min-width:unset; color:#7A86A1;font-size:14px;background:none;margin:0;padding:0;height:auto;margin-right:5px;font-weight:normal;border-radius:17px;text-align:center;cursor:pointer;}
.tab-stats h2 {display:inline-block;}
.tab-stats label {max-width:200px;}
.tab-stats label select {margin-top:0;}
main.detail section.tab-stats aside,
main.detail section.tab-stats footer {display:none;}
article.tab {display:none;}
article.tab.active {display:inline-block;}
@media screen and (min-width:360px) and (max-width:480px){
.list-project li.add {margin-right:0;}
.add a::before {left:35%;}
section.alert footer {text-align:center;}
section.alert footer button {max-width:100%;}
main.detail .list-project > li {width:48.2%;}
button.clear {margin-left:75px;}
section header label.s.right {margin-top:10px;}
}
@media screen and (min-width:480px) and (max-width:780px){
.list-project {padding-right:0px;}
.list-project >li {width:45.7%;margin-right:20px;}
}
@media screen and (min-width:360px) and (max-width:580px){
.list-project {justify-content:space-between;}
.list-project >li {margin-bottom:15px; }
section header label.s {min-width:108px;max-width:108px!important;}
main header h1 {margin-right:0px!important;}
main.detail section footer button {margin-bottom:15px;}
}
@media screen and (min-width:680px) {
body.security main.detail .add {top:0px;left:unset;}
}
@media screen and (min-width:780px) {
.list-project {padding-top:0px;}
.add a:hover {box-shadow:2px 2px 13px 5px #695f9742;border-radius:30px;transition:all 0.3s ease;}
.add a:hover::before {transform:scale(0.9);transition:all 0.3s ease;}
.list-project {padding-right:0px;}
button {/*width:150px;*/font-size:14px;}
/* .list button, .add-live button, .add-video button {width:160px;width:auto;padding-left:45px;text-align:left;padding-right: 15px;} */
/* section header button.add, button.mobile.add{background:#61C474 url(../res/d.svg) center no-repeat;background-size:18px;background-position-x:15px;float:right;position:relative;right:unset;width: auto;text-align: left;letter-spacing: normal;} */
}
@media screen and (min-width:480px) and (max-width:579px){
.list-project > li {width:45.7%;}
}
@media screen and (min-width:580px) and (max-width:1023px) {
.list-project {padding-right:0px;}
}
@media screen and (min-width:580px) and (max-width:779px){
.list-project {justify-content:left;padding-right:0px;}
.list-project > li {width:29.5%;margin-right:20px;}
}
@media screen and (min-width:780px) and (max-width:980px){
.list-project > li {width:22.4%;margin-right:20px;}
}
@media screen and (min-width:980px) and (max-width:1023px){
.list-project > li {width:17.9%;margin-right:20px;}
}
@media screen and (min-width:1180px) and (max-width:1379px){
.list-project > li {width:23%;margin-right:20px;}
.list-project > li:nth-of-type(4n+4) {margin-right:0px;}
}
@media screen and (min-width:1380px) and (max-width:1479px){
.list-project >li {margin-right:20px;width:auto;width:23.4%;}
.list-project > li:nth-of-type(4n+4) {margin-right:0px;}
}
@media screen and (min-width:1480px) and (max-width:1679px){
.list-project > li {width:18.5%;}
.list-project > li:nth-of-type(5n+5) {margin-right:0px;}
}
@media screen and (min-width:1680px) and (max-width:1779px){
.list-project > li {width:15.3%;}
.list-project > li:nth-of-type(6n+6) {margin-right:0px;}
}
@media screen and (min-width:1780px) and (max-width:1919px){
.list-project > li {width:12.9%;}
.list-project > li:nth-of-type(7n+7) {margin-right:0px;}
}
@media screen and (min-width:1920px) and (max-width:2139px){
.list-project > li {width:11.4%; }
.list-project > li:nth-of-type(8n+8) {margin-right:0px;}
}
@media screen and (min-width:2141px) and (max-width:2199px){
.list-project > li {width:11.5%;}
.list-project > li:nth-of-type(8n+8) {margin-right:0px;}
}
@media screen and (min-width:2200px) and (max-width:2399px){
.list-project > li {max-width:386px;width:10.1%;}
.list-project > li:nth-of-type(9n+9) {margin-right:0px;}
}
@media screen and (min-width:2400px) {
.list-project > li {max-width:386px;width:10.2%;}
.list-project > li:nth-of-type(9n+9) {margin-right:0px;}
}
@media screen and (min-width:1024px) and (max-width:1180px){
.list-project >li {width:100%;margin-right:20px;width:30.9%;max-width:unset;}
.list-project > li:nth-of-type(3n+3) {margin-right:0px;}
}
@media screen and (min-width:1024px) and (max-width:1360px){
button.clear {float:right;}
}
@media screen and (min-width:1024px) {
button.back {display:flex;}
header.main {flex-wrap:wrap;}
button.hide {display:inline-block;}
.list-project {padding:0px 30px;}
body.security main.detail .add {top:0;left:unset;right:unset;}
th, td {font-size:15px;}
.add {right:295px;top:unset;}
nav.breadcrumb, nav.tab {display:flex;align-items:center;align-self:center;}
nav.tab {justify-content:right;}
nav.breadcrumb a, nav.tab a {display:flex;align-items:center;justify-content:center;width:auto;min-width:unset; color:#7A86A1;font-size:14px;background:none;margin:0;padding:0;height:auto;margin-right:5px;}
nav.breadcrumb a::before {content:'>';position:unset;width:10px;height:23px;padding-right:2px;}
nav.breadcrumb a::after,
nav.breadcrumb a.active::after {display:none;}
nav.breadcrumb a.active,
nav.breadcrumb a.active:hover {font-weight:600;color:#7A86A1;border:none;outline:none;background:none;}
nav.breadcrumb a:hover {background:none;border:none;outline:none;text-decoration:underline;color:#7A86A1;font-weight:normal;}
main.detail.dashboard h2 {max-width: 70%;}
}
section.alert h5, section.alert h6 {position:relative;margin-bottom:32px;max-width:460px;}
section.alert button {width:100%;font-size:16px;}
section.alert footer {margin-top:24px;position:relative;box-shadow:unset;}
nav a {position:relative;}
/*FOOTER*/
body > footer {display:none;position:fixed;width:250px;bottom:0;height:45px;line-height:24px;padding:0 14px;padding-left:30px;font-size:12px;font-style:normal;text-align:left;color:var(--main90);z-index:99;}
section footer {position:fixed;width:100%;bottom:0;height:45px;background:#fff;box-shadow:0px 2px 15px #4A5A6E29;}
nav.paging {position:fixed;right:0px;bottom:0;;display:flex;align-items:center;justify-content:end;height:45px;background:#fff;border-radius:30px;border-top-left-radius:0;border-bottom-right-radius:0;border-top-right-radius:0;z-index:1;padding-right:30px;}
nav.paging a {font-size:14px;color:#C0BDCC;margin-right:15px;display:flex;align-items:center;justify-content:center;}
nav.paging a:last-of-type {margin-right:0;}
nav.paging a.active {color:#3E6B98;font-weight:bold;}
nav.paging a::before {display:none;}
nav.paging a.prev::before, nav.paging a.next::before {content:'';display:inline-block;width:20px;height:20px;background:url(../res/icon/prev.svg) center no-repeat;background-size:16px;position:unset;transform:none;}
nav.paging a.next::before {transform:rotate(180deg)}
@media screen and (min-width:768px) {
nav.tab { margin-top:0;margin-bottom:0;}
nav.tab a {min-width:117px;font-size:14px;padding:0 15px;}
main header {width:100%;display:flex;align-items:center; }
main.large.detail form>header:first-of-type{display:block;}
main.large section {padding:15px 0px;}
section header button {top:unset;right:unset;float:right;}
main.large section header {position:relative;}
.hint {min-width: 260px;}
}
@media screen and (min-width:980px) {
iframe.popup.m {width:40%!important;}
main.popup {padding:32px 46px!important;}
main.popup h1 {font-size:20px!important;}
main.popup nav.toolbar {position:absolute;right:45px;top:34px;}
/* main.popup footer {padding:0 45px;} */
}
@media screen and (min-width:1024px) {
.tablet {display:revert;}
label.tablet {display:inline-block;}
button.save, button.clear {font-size:0;padding:0;}
button.small {font-size:100%;width:auto;white-space:nowrap;}
th > sub, td > sub {display:none;}
main.detail form>header:first-of-type{display:flex !important;min-height:unset !important;}
body {background:light-dark(#EFF6F8,#000);}
main.detail p label {padding-right:15px;}
main section footer {z-index:1;}
nav.tab a {min-width:75px;}
body>header::before, body>header::after{content:'';position:absolute;top:0;right:-50px;left:unset;bottom:unset;width:50px;height:50px;background:transparent;border-radius:30px 0 100% 0;box-shadow:-5px -20px 0 0 light-dark(#488ed2,#1a1a1a);}
body>header::after {bottom:0;top:unset;border-radius:0 100% 0 30px;box-shadow:-2px 20px 0 0 light-dark(#488ed2,#1a1a1a);}
main.dashboard nav a.live {background-size:auto;}
main.dashboard nav a.video {background-size:auto;}
main.dashboard nav a.live::after {background-size:27px;}
main.dashboard nav a.video::after {background-size:27px;}
main.large.detail section table thead {top:0px;}
button.mobile {display:none;}
sub {display:none;}
.tablet {display:table-cell;}
body > header > .side-bar {display:none;}
main header {flex-wrap:nowrap;padding:0px;margin:0 0 20px 0;}
nav.status {text-align:right;margin-top:0px;overflow:unset;}
nav.status label {margin-bottom:0px;}
body > main.detail>section {border-radius:0px;}
/*main header style*/
main form > header {margin:0 0 0px 0;padding:20px 30px; position:relative;min-height:unset;}
header.main {padding:0 30px 8px;overflow:unset;}
main.large section {padding:30px 0px;margin-top:0}
main.large section header {position:relative;padding:0px 30px;}
main.large.detail section header {position:relative;padding:30px 30px;top:0;background:#fff;margin-bottom:0px;border-radius:30px;display:block;}
main.detail aside article {padding-right:15px;}
main.detail section footer {margin-top:50px;padding-bottom:20px;}
main.dashboard.detail section {margin:0px 0px;box-shadow:unset;}
main.dashboard {padding:0;}
body.player main.large.detail section {margin:30px 0px;margin-top:0px;}
body.security main.large.detail header {margin:0;}
main.detail .icon.print {display:inline-block;}
section header label {padding-right:0px;margin-right:8px;}
main.detail >h1 {padding-left:0px;padding-top:10px;}
/*NAVIGATION*/
body > header {position:fixed;top:0;min-height:100vh;height:100%;}
body > header > a {margin-left: -15px;margin-top: 15px;height: 55px;width: 190px;background-size: 170px;}
body > header > nav {margin:0 auto;max-width:190px;overflow:visible;padding:0;opacity:1;pointer-events:all;}
body > header > nav > nav::before {display:block;left:0%;width:100%;}
body > label {display:block;left:unset;top:17px;right:95px;bottom:unset;width:190px;position:absolute;background:#fff url(../res/icon/earth.svg) center no-repeat;background-size:22px;border-radius:17px;margin-top:3px;background-position-x:20px;z-index:101;}
body > label select {padding:0 45px;font-size:16px;color:#3D6792;margin:0;appearance:none;-webkit-appearance:none;}
body > label::after {content:'';position:absolute;right:20px;top:18px;width:10px;height:10px;background:url(../res/arrow-down-blue.svg) no-repeat center;}
body > menu.user {position:absolute;background-size:unset;top:19px;right:15px;padding-top:11px;padding-left:80px;white-space:nowrap;z-index:101;font-size:0;}
body > menu.user.active {top:19px;}
body > menu.user.active + menu {position:absolute;padding-top:55px;top:140px;right:30px;z-index:101;}
body > menu.user.active::after {right:0%;top:0%;}
body > menu.user.active + menu a.display {display:block;}
body > menu > ul {top:-116px;}
body > header > menu.active::before {border:0;line-height:20px;}
body > menu > a {padding-left:24px;}
body > menu.user.active + menu ul {max-height:140px;transition:all .3s ease-in-in;width:314px;z-index:1;padding-bottom:15px;}
/* .settings {display:inline-block;max-height:0px;position:absolute;top:0px;z-index:200;left:0;background:#FFF 0% 0% no-repeat padding-box;box-shadow:4px 22px 54px #695F971A;border-radius:30px;box-sizing:border-box;transition:max-height .3s ease-in;overflow:hidden;} */
a.display::after {display:none;}
a.display.active .settings {max-height:500px;min-width:314px;max-width:314px;top:49px;padding:23px; transition:max-height .3s ease-in-in;}
a.display.active ul.layout {max-height:230px;}
body > menu.user.active + menu a.display::after{display:inline-block;}
body > header > nav > a span {display:none;}
body > header > nav.active::before {height:26px;margin-bottom:0;line-height:20px;}
body > header > nav > a.active > span {display:none;}
body > header > nav > a > span {display:none;}
thead tr.active > th sub {display:none;}
section.dev menu {white-space:nowrap;}
main.detail section:nth-of-type(2) {margin-top:10px;}
section.alert button {background:transparent linear-gradient(90deg, #3C648C 0%, #3E6995 47%, #4990D7 100%) 0% 0% no-repeat padding-box;}
body {overflow:auto;min-height:100vh;}
/*LOGIN PAGE*/
body h1.title {display:none;}
body div.img-place {display:none;}
body.login , body.logout {overflow:hidden;}
body.login div.img-place,
body.logout div.img-place {display:block;width:100%;margin:0px;box-sizing:border-box;position:absolute;top:44%;bottom:0px;left:0px;right:0px;background:url(../res/evolink-banner.png) center no-repeat;background-size:cover;}
body.login form {z-index:103;}
body.login, body.logout {display:flex;align-items:center;justify-content:space-between;height:100vh;width:100%;font-family:normal normal normal 60px/64px 'Roboto';}
body.login header, body.logout header {position:relative;display:block;width:50%;height:100%;max-width:unset;margin:0;text-align:left;padding:50px;}
body.login header a, body.logout header a{width: 200px;background-size: 200px;margin-left: 55px;}
body.login header.loged a {padding:0px;min-width:unset;max-width:unset;}
body.login>header::after {box-shadow:-2px 20px 0 0 #52abe1;}
body.login > footer, body.logout >footer {display:none;}
body.login form {width:100%;max-width:57%;position:relative;left:0%; border-radius:0;background:#fff;margin-top:0px;z-index:100;box-shadow:-13px 0px 50px #00000029;}
body.login h1, body.logout h1 {font-size:30px;letter-spacing:-0.75px;padding-bottom:37px;font:normal normal normal 30px/60px 'Roboto';font-family:inherit;font-weight:bold;}
body.login h1.title, body.logout h1.title{display:block;font-size:60px;padding-top:74px;color:#fff;font-family:inherit;margin-right:20px;font-size:60px !important;}
section.alert {width:100%;height:100vh;padding:290px 20px 0px 20px;max-width:618px;margin:0px auto;position:relative;top:30%;left:auto;}
body.login form section.alert {background:transparent;}
section.alert p {width:49%;display:inline-block ;white-space:nowrap;}
section footer {border-radius:30px;border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:0;}
body.logout section {padding-top:0;max-width:57%;text-align:center;}
body.logout section button {margin:auto;}
/*Dashboard page*/
main.dashboard header {z-index:101;}
main.dashboard {z-index:100;}
main.dashboard nav {width:100%;margin-bottom:0;margin-top:56px;}
main.dashboard nav a {margin-bottom:20px;}
main.dashboard h1 {font-size:52px;letter-spacing:-1.3px;}
main.dashboard h2 {font-size:22px;}
main.dashboard nav a::before {width:60px;height:60px;top:30px;}
main.dashboard nav a::after {content:'';display:inline-block;position:absolute; width:30px;height:30px;font-size:45px;top:35px;left:35px;}
main.dashboard nav a {position:relative;height:177px;display:inline-block;border-radius:30px;margin-top:0;margin-right:20px;margin-bottom:20px; font-size:24px;text-align:left;padding:20px;font-weight:bold;}
main.dashboard nav a:last-of-type {margin-right:0px;}
main.dashboard button {background:#FFFFFF 0% 0% no-repeat padding-box;box-shadow:2px 14px 32px #6149CD1A;border-radius:22px;color:#3C648C;font-size:16px;height:55px;text-align:left;display:block;}
main.dashboard nav a span {display:inline-block;width:100%; color:#fff;font-size:15px;position:relative;padding-left:0px; background:none;font-weight:normal;}
main.dashboard aside::before {content:'';display:block;clear:both;}
/* vertical navigation */
body >main {display:flex;flex-direction:column;margin:0px auto 0px 250px;padding:0px 0px;border-radius:30px 0px 0px 30px;align-items:center;height:100vh;transition:all .3s ease-in;overflow:unset;background-color:light-dark(#EFF6F8,#000);z-index:100;}
body >main form {width:100%;display:flex;flex-direction:column;height:100% !important;}
body >main section, body >main.large.detail section {height:100%;}
body >main.detail section {height:auto;border-radius:30px;}
body > header {min-width:250px;/*background:transparent;*/}
thead tr.active > th > div input[type="date"] {width:49%;display:inline;}
thead tr {top:0px;}
thead tr.active > th {padding-top:0px;padding-bottom:0px;}
main.detail section {margin:0px 30px;padding:30px 15px 30px 30px;box-shadow:4px 22px 54px #695F971A;}
/* main[class="detail"] section article{padding:0 15px 0 0;} */
main[class="detail"] section header {padding-right:15px;}
main > header h1 {margin-right:24px;}
nav.status::before {display:none;}
nav.status.active {background:none;}
nav.status div, nav.status.active div
{position:relative;display:flex;align-items:center;justify-content:right;height:36px;background:none;max-width:100%;}
nav.status div::before {display:none;}
nav.status div a {height:26px;margin-right:5px;padding:0px 16px;}
table.block {display:table;}
table.block thead {display:table-header-group;}
table.block thead {display:table-row-group;}
table.block tfoot {display:table-footer-group;}
table.block tr {display:table-row;}
table.block th,
table.block td {display:table-cell;width:inherit;}
table.block td::before {display:none; }
main.detail p.security a {margin:15px 15px 0 0;}
main.detail section footer button {margin-right:15px;}
}
@media screen and (min-width:1280px) {
nav.tab a {min-width:117px;}
main.dashboard.detail section {padding-right:26px;padding-top:30px;}
/* bodymain.dashboard main nav a {margin-bottom:20px;width:49.1%;font-size:24px;} */
main.dashboard aside.s {padding:0px;margin-top:0;z-index:102;background:#fff;box-sizing:border-box;position:absolute;top:0;right:0;border-radius:0;width:30%;height:100%}
main.dashboard section article.s {width:68.6%;overflow:hidden;padding:20px;}
main.dashboard aside article {height:100%;border-radius:0;padding:135px 30px 30px 30px;}
body.account main.detail label.q {max-width:31%;}
main.dashboard nav {width:68.6%;margin-bottom:0;margin-top:0;}
}
@media screen and (min-width:1366px) {
body.login h1.title {font-size:60px;}
main.dashboard aside article {padding:135px 60px 60px 60px;}
body.account main.detail label.q {max-width:31.6%;}
main > header {padding:8px;}
main > header nav {min-height:40px;line-height:26px;}
main > header nav a {font-size:16px;height:38px;line-height:38px;}
nav.preset::before {display:none;}
nav.preset.active {background:none;}
nav.preset div, nav.preset.active div {position:relative;display:flex;align-items:center;justify-content:right;height:38px;background:none;} /* Iva change justify-content:left 07-09-23*/
nav.preset div::before {display:none;}
nav.preset div a {height:36px;margin:5px 5px 0 0;line-height:36px;padding:0px 16px;border-radius:4px 4px 0 0;}
nav.status label {margin-right:15px;}
/* label::before {font-size:14px;} */
.laptop {display:block;}
label.laptop {display:inline-block;}
tr td:first-child {color:#000;padding-left:30px;}
tr th:first-child {padding-left:30px;}
th[data-order]:first-child::before {left:16px;}
th, td {font-size:14px;}
td {color:#7A86A1;}
thead th, tfoot th {font-size:14px;}
select.time {background:none;border-radius:4px;appearance:auto;width:100%;font-size:16px;color:#000;height:36px;}
select.time:hover {font-size:16px;}
.list-project li {margin-right:20px;}
}
@media screen and (min-width:1595px) {
body.detail {padding-left:250px;}
body > header {left:0;}
main[class="detail"] {margin:auto;max-width:1340px;}
body.detail > label {left:0;right:-1205px;margin:5px auto;}
/* body.detail > label:before {content:'';position:absolute;right:0;top:0;border-radius:19px;width:200px;height:45px;background:#fff url(../res/icon/earth.svg) center no-repeat;background-position-x:20px;z-index:-1;} */
body.detail > menu.user {left:0;right:-1505px;margin:auto;background-position-x:right;}
body.detail > menu.user.active + menu {left:0;right:-1215px;margin:auto;max-width:314px;}
body.detail > menu.user.active + menu a {width:294px;}
body.login h1.title,body.logout h1.title{letter-spacing:-0.6px;width:385px;height:392px;font:normal normal normal 60px/64px 'Roboto';margin-left:52px;font-family:inherit;}
main.popup button {width:124px;height:40px;font-size:14px;}
main.detail footer {text-align:right;}
body.login div.img-place {left:0px;right:0px;}
}
/* form view */
/* aside view */
/* end of style, enjoy...*/