@charset "utf-8";
/* CSS Document */

/* @import 'https://fonts.googleapis.com/css?family=Noto+Sans:300,400,400i,500,600,700&subset=cyrillic&display=swap'; */
@font-face {font-family:'rosatom'; src:url('/font/Rosatom-Light.otf') format('opentype'); font-weight:300; font-style:normal;}
@font-face {font-family:'rosatom'; src:url('/font/Rosatom-Regular.otf') format('opentype'); font-weight:400; font-style:normal;}
@font-face {font-family:'rosatom'; src:url('/font/Rosatom-Italic.otf') format('opentype'); font-weight:400; font-style:italic;}
@font-face {font-family:'rosatom'; src:url('/font/Rosatom-Bold.otf') format('opentype'); font-weight:700; font-style:normal;}


:root
{
--bs1:#003274;
--bs1h:#025EA1;
--bs2:#E80000;
--bs2h:#FF6A6A;
--bs3:#6CACE4;
--font:#333333;
--gr:#7C7C7C;
--bgnd:#E7EBF6;
--lgt:#F8FAFF;
--border:#B4BACF;
--bk:#000000;
--wt:#ffffff;
--gray1:#ADC7EB;

}

* {font-family:"rosatom", sans-serif; outline:none; transition:0.15s;}
body {width:100%; color:var(--font); margin:0px; font-size:16px; font-weight:400; background:var(--bgnd);}
main {display:flex; position:relative; min-height:calc(100vh - 90px); width:100%;}
img {max-width:100%;}
header {width:auto; height:90px; padding:0px 30px; color:var(--wt); background:var(--bs1);}

h1 {margin:0px; font-size:32px; line-height:1; font-weight:400;}
h3 {margin:0px 0px 32px; font-size:27px; line-height:1; font-weight:400;}
label {display:block; padding:0px 0px 26px;}
label.inlineblock {display:inline-block; padding:0px;}
label span {display:block; margin:0px 0px 6px; font-size:13px;}
input[type=text], input[type=password], textarea, select {width:calc(100% - 22px); height:20px; padding:6px 10px; border:1px solid var(--border); border-radius:8px; font-family:inherit; font-size:15px; line-height:20px;}
select {width:100%; height:34px;}
textarea {height:160px;}
textarea.tinytext {height:90px;}
textarea.widetext {height:360px;}
input.large, textarea.large, select.large {font-size:18px;}
input.big, textarea.big, select.big {font-size:20px; font-weight:600;}
input[type=submit], button, a.btn, .ui-datepicker .ui-datepicker-buttonpane button {display:inline-block; padding:6px 14px; border:0px; border-radius:8px; font-size:15px; font-weight:400; color:var(--wt); background:var(--bs1h); cursor:pointer; text-align:center; text-decoration:none;}
input[type=submit]:hover, button:hover, a.btn:hover {background:var(--bs1); color:var(--wt);}
input[type=submit].midi, button.midi, a.btn.midi {padding:8px 16px; min-width:120px; font-size:16px;}
input[type=submit].mini, button.mini, a.btn.mini {padding:4px 8px; min-width:100px; font-size:14px;}
input[type=submit].large, button.large, a.btn.large {padding:16px 32px; min-width:240px; border-radius:16px; font-size:24px;}
input[type=text].bg-input-folder {padding-left:44px; width:calc(100% - 56px); background-image:url(/pic/icons/gray-folder.svg); background-position:14px center; background-repeat:no-repeat;}

.roof {width:320px; background-color:var(--wt);}
.content {width:100%; padding:0px 0px 32px;}
.roof + .content {width:calc(100% - 320px);}

.full {width:100%;}
.double {width:60%;}
.half {width:48%;}
.tres {width:30%;}
.quart {width:24%;}
.minimal {width:min-content;}
.search {width:calc(100% - 200px);}

.s-head {height:32px; padding:32px;}
.s-tiny {height:32px; padding:0px 32px 16px;}
.s-common {padding:16px 32px;}
.s-line {border-bottom:1px solid #D0D0D0;}
.s-right {width:100%; height:100%; background:#00000064; position:absolute; top:0px; left:0px; z-index:10;}
.s-right .wrap {position:absolute; right:0px; width:350px; height:calc(100% - 64px); padding:32px; background:var(--wt);}

.edit-plate {width:350px; margin:auto;}
.flexer-w {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start;}
.flexer-m {display:flex; flex-wrap:wrap; justify-content:space-around; align-items:flex-start;}
.save-buttons button {margin-right:16px;}
.box-buttons {margin:0px 0px 16px;}
.box-buttons a {margin-right:16px; padding-left:44px; background-size:20px 20px; background-position:14px center; background-repeat:no-repeat;}
.box-buttons a:hover {background-size:20px 20px; background-position:14px center; background-repeat:no-repeat;}
.box-buttons a.bg-plus {background-image:url(/pic/icons/white-plus.svg);}
.box-buttons a.bg-folder {background-image:url(/pic/icons/white-folder.svg);}

.floader input[type="file"] {position:absolute; top:-20px; opacity:0;}
.floader {position:relative; width:100%; height:70px;}
.floader figure {position:absolute; left:0px; top:0px; width:calc(100% - 4px); height:calc(100% - 4px); margin:0px; border:2px dashed var(--bs3); border-radius:8px; cursor:pointer; z-index:10;}
.floader figure:hover {border:2px dashed var(--bs1);}
.floader figure span {position:absolute; width:100%; top:13px; text-align:center; color:var(--font); padding:28px 0px 0px; font-size:13px; background:url(/pic/icons/upload.svg) top center no-repeat; background-size:24px; z-index:-1; pointer-events:none;}
.floader-drag {display:block;}
.floader-drop {display:none;}
.floader figure.active .floader-drag {display:none;}
.floader figure.active .floader-drop {display:block;}
.progress {display:none;}
.progress-bar {position:absolute; width:0%; height:100%; background:#d0ffe0; z-index:5;}
.progress-value {position:absolute; top:24px; width:100%; height:100%; text-align:center; font-size:24px; font-weight:500; color:var(--bs1); z-index:7;}

.login-block {width:328px; padding:93px 16px; margin:180px auto 0px; background:var(--bs1); border-radius:25px; box-shadow:2px 2px 15px #3668A9;}
.login-block input[type=text], .login-block input[type=password] {background:transparent; border:1px solid var(--gray1); color:var(--wt);}
.login-block button, .login-block button:hover {background:var(--gray1); color:var(--bs1);}
.login-block label span {color:var(--gray1);}
.logo-big {display:flex; width:256px; margin:0px auto 20px; align-items:center; justify-content:flex-start; color:var(--wt);}
.logo-slogan {padding:9px 0px 9px 11px; margin:0px 0px 0px 11px; border-left:1px solid var(--wt);}
.logo-slogan span {display:block; text-transform:uppercase; font-size:14px; letter-spacing:1px;}
.logo-slogan span:first-child {font-size:16px; width:max-content;}
.logo-img {width:72px; height:72px;}
.logo-img img {width:100%; height:100%; object-fit:contain;}
.login-block .forgot {margin:8px 0px; font-size:13px; color:var(--gray1);}
.login-block label i {display:none; position:absolute; margin:3px 0px 0px; color:var(--bs2h); font-size:12px; font-style:normal;}
.login-block.wrong label i {display:block;}
.nic-field input[type=text] {width:calc(100% - 52px); height:20px; padding:6px 10px 6px 40px; background:url(/pic/icons/head-user.svg) 10px center no-repeat; background-size:20px 20px;}
.passw-field input[type=text], .passw-field input[type=password] {width:calc(100% - 52px); height:20px; padding:6px 10px 6px 40px; background:url(/pic/icons/stop-lock.svg) 10px center no-repeat; background-size:20px 20px;}
.wrong .passw-field input {border:1px solid var(--bs2h);}
.passw-field {position:relative;}
.passw-field b {display:block; position:absolute; width:20px; height:20px; right:11px; top:31px; background:url(/pic/icons/stop-eye-close.svg) center center no-repeat; background-size:20px 20px; cursor:pointer; z-index:5;}
.passw-field b.opened {background-image:url(/pic/icons/stop-eye.svg);}

.hat {display:flex; height:90px; justify-content:space-between; align-items:center;}
.hat-logo {display:flex; width:256px; align-items:center; justify-content:flex-start; color:var(--wt);}
.hat-logo-slogan {padding:6px 0px 6px 8px; margin:0px 0px 0px 8px; border-left:1px solid var(--wt);}
.hat-logo-slogan span {display:block; text-transform:uppercase; font-size:12px; letter-spacing:1px;}
.hat-logo-slogan span:first-child {font-size:13px; width:max-content;}
.hat-logo-img {width:58px; height:58px;}
.hat-logo-img img {width:100%; height:100%; object-fit:contain;}
.personal {display:flex; align-items:center; justify-content:flex-end;}
.exit {display:block; padding:2px 32px 2px 0px; margin-left:48px; color:var(--wt); font-size:15px; text-decoration:none; background:url(/pic/icons/head-exit.svg) right center no-repeat; background-size:24px 24px;}
.personal .username {padding:0px 0px 0px 32px; color:var(--gray1); font-size:21px; background:url(/pic/icons/head-user.svg) left center no-repeat; background-size:24px 24px;}
.personal .userrole {padding:0px 0px 0px 32px; color:var(--gray1); font-size:15px;}

nav ul {list-style:none; margin:0px; padding:0px;}
nav li {display:block;}
nav a {display:block; position:relative; padding:12px 28px 12px 64px; height:24px; font-size:17px; color:var(--font); text-decoration:none; background-position:30px center; background-repeat:no-repeat; background-size:24px 24px; border-bottom:1px solid var(--bgnd);}
nav a:after {content:""; display:none; position:absolute; width:8px; height:14px; right:28px; top:17px; background-image:url(/pic/icons/menu-arrow-right.svg);}
nav a:hover {background-color:var(--lgt);}
nav a:hover:after {display:block;}
nav a.active {background-color:var(--bgnd);}
.menu-markers a {background-image:url(/pic/icons/menu-marker.svg);}
.menu-models a {background-image:url(/pic/icons/menu-3dmodel.svg);}
.menu-images a {background-image:url(/pic/icons/menu-images.svg);}
.menu-videos a {background-image:url(/pic/icons/menu-videos.svg);}
.menu-pushes a {background-image:url(/pic/icons/menu-push.svg);}
.menu-chatbots a {background-image:url(/pic/icons/menu-chat.svg);}
.menu-users a {background-image:url(/pic/icons/menu-users.svg);}

.r-line {display:flex; flex-wrap:nowrap; justify-content:space-between; align-items:center; height:55px; padding:0px 14px; margin:0px 0px 6px; background:var(--wt); border-radius:8px; box-shadow:0px 2px 10px #c3d2e1;}
.cell-num {width:40px;}
.cell-name {width:500px; height:24px; padding-left:34px; background-position:left center; background-repeat:no-repeat; background-size:24px 24px;}
.cell-date {width:180px;}
.cell-autor {width:200px;}
.cell-count {width:80px;}
.cell-name-markers, .cell-name-images {background-image:url(/pic/icons/td-img.svg);}
.cell-name-images.imgcount {background-image:url(/pic/icons/td-images.svg);}
.cell-name-videos {background-image:url(/pic/icons/td-movie.svg);}
.cell-name-models {background-image:url(/pic/icons/td-3dmodel.svg);}
.folder1 .cell-name {background-image:url(/pic/icons/gray-folder.svg);}
.cell-name.cell-role1 {background-image:url(/pic/icons/td-role1.svg);}
.cell-name.cell-role2 {background-image:url(/pic/icons/td-role2.svg);}
.case-box-in {margin:0px 0px 24px 32px;}
.case-box-in .cell-name {width:468px;}
.folder1 .cell-name b {position:absolute; display:inline-block; margin:4px 0px 0px -34px; width:24px; font-size:14px; color:var(--wt); text-align:center; cursor:pointer;}
.folder1 .cell-name span {color:var(--bs1); cursor:pointer;}
.r-hd {font-weight:700;}
.r-hd .sort-by:after {content:""; display:inline-block; width:15px; height:24px; margin-left:6px; vertical-align:middle; background:url(/pic/icons/td-sort.svg) center center no-repeat; background-size:15px 24px;}

.cell-icons {display:flex; flex-wrap:nowrap; justify-content:flex-end; align-items:center; width:160px;}
.cell-icons .ico-unit {position:relative; width:24px; height:24px; margin:0px 8px;}
.cell-icons a {display:block; width:24px; height:24px; text-decoration:none; background-position:center center; background-repeat:no-repeat; background-size:100% 100%;}
.cell-icons a:after {display:none; position:absolute; top:32px; right:0px; width:max-content; padding:11px 17px; font-size:13px; background:var(--font); color:var(--wt); border-radius:8px 0px 8px 8px; z-index:2;}
.ico-edit {background-image:url(/pic/icons/td-edit.svg);}
.ico-edit:after {content:"Редактировать";}
.ico-rename {background-image:url(/pic/icons/td-edit.svg);}
.ico-rename:after {content:"Переименовать";}
.ico-off {background-image:url(/pic/icons/td-lamp.svg);}
.ico-off:after {content:"Выключить не удаляя";}
.ico-folder {background-image:url(/pic/icons/td-folder.svg);}
.ico-folder:after {content:"Переместить в папку";}
.ico-remove {background-image:url(/pic/icons/td-trash.svg);}
.ico-remove:after {content:"Удалить совсем";}
.cell-icons a:hover:after {display:block;}

.keywords-block {display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:flex-start; margin:0px 0px 24px;}
.keyword-elem {display:inline-block; padding:8px 16px; margin:0px 16px 8px 0px; height:16px; font-size:14px; line-height:1; border:1px solid var(--font); border-radius:8px; cursor:pointer;}
.keyword-elem input {display:none;}
.keyword-elem.active {border:1px solid var(--bs3); background:var(--bs3); color:var(--wt);}
.keyword-elem.active i {display:inline-block; vertical-align:middle; width:16px; height:16px; margin-left:8px; background:url(/pic/icons/close-wt.svg) center center no-repeat; background-size:100%;}

.mask-images {display:grid; grid-gap:4px 4px; grid-template-columns:1fr 1fr;}
.mask-images div {padding:6px; cursor:pointer;}
.mask-images div:hover {background-color:var(--border);}
.mask-images div.active {background-color:var(--bs3);}

.img-block {position:relative;}
.img-self video {width:100%; height:auto;}
.img-self img {width:100%; height:auto;}
.models .img-self {text-align:center;}
.models .img-self img {width:50%; height:auto; margin:auto;}

.push-box {width:800px; margin:auto;}
.case-pushes .cell-date {width:150px; padding-left:30px;}
.case-pushes .date-future .cell-date {background:url(/pic/icons/calendar-gray.svg) left center no-repeat; background-size:20px 20px;}

.popup {position:absolute; width:350px; padding:16px 16px 20px; background-color:var(--wt); border-radius:8px; box-shadow:2px 2px 15px #B4C3D6;}
.datefield {background:url(/pic/icons/calendar-gray.svg) calc(100% - 5px) center no-repeat var(--wt); background-size:20px 20px;}
label i.error {position:absolute; margin:3px 0px 0px; color:var(--bs2); font-size:12px; font-style:normal;}
.error {color:var(--bs2); line-height:2;} 
.fs13 {font-size:13px;}
.hddn {display:none!important;}
.close {display:block; position:absolute; width:24px; height:24px; right:32px; top:32px; background:url(/pic/icons/close-bk.svg) center center no-repeat; background-size:100% 100%; z-index:10; cursor:pointer;}
.off2 {opacity:0.4;}
.del {position:absolute; bottom:10px; right:6px; width:28px; height:28px; background:url(/pic/icons/trash-media.svg) center center no-repeat; background-size:100% 100%;}
.popup#theremove {width:260px;}

.check-boxes input[type=checkbox] {appearance:none; -moz-appearance:none; -webkit-appearance:none; position:relative; padding:0px; margin:0px 2px; width:40px; height:24px; border-radius:12px; background:#CCCCD8; border:0px; vertical-align:middle;}
.check-boxes input[type=checkbox]:after {content:""; display:block; position:absolute; left:3px; top:3px; width:18px; height:18px; background-color:var(--wt); border-radius:10px; transition:0.2s;}
.check-boxes input[type=checkbox]:checked {background:var(--bs1h);}
.check-boxes input[type=checkbox]:checked:after {left:19px;}

#ui-datepicker-div {width:318px; border:0px; padding:16px; background-color:var(--wt); box-shadow:2px 2px 15px #B4C3D6; border-radius:8px; transition:0s;}
.ui-datepicker .ui-datepicker-header {background:var(--wt); font-size:16px; font-weight:700; border:0px;}
.ui-widget-content .ui-state-default {display:inline-block; width:32px; height:16px; padding:8px 0px; margin:6px 0px; font-size:15px; line-height:16px; font-weight:400; text-align:center; border:0px; border-radius:16px; background:var(--wt);}
.ui-widget-content .ui-state-default:hover {background-color:var(--bgnd);}
.ui-widget-content .ui-state-active, .ui-widget-content .ui-state-active:hover {background-color:var(--bs1h); color:var(--wt);}
.ui-datepicker td {padding:0px; border:0px; text-align:center;}
.ui-widget-content button.ui-state-default {height:auto;}
.ui-widget-content button.ui-state-default:hover {background-color:var(--bs1h);}

.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 40%; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
.ui-timepicker-div .ui_tpicker_unit_hide{ display: none; }
.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { background: none; color: inherit; border: none; outline: none; border-bottom: solid 1px #555; width: 95%; }
.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus { border-bottom-color: #aaa; }
.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
.ui-timepicker-rtl dl dt{ float: right; clear: right;}
.ui-timepicker-rtl dl dd {margin: 0 40% 10px 10px;}

/* Shortened version style */
.ui-timepicker-div.ui-timepicker-oneLine { padding-right: 2px; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time, 
.ui-timepicker-div.ui-timepicker-oneLine dt { display: none; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time_label { display: block; padding-top: 2px; }
.ui-timepicker-div.ui-timepicker-oneLine dl { text-align: right; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd, 
.ui-timepicker-div.ui-timepicker-oneLine dl dd > div { display:inline-block; margin:0; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_minute:before,
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_second:before { content:':'; display:inline-block; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_millisec:before,
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_microsec:before { content:'.'; display:inline-block; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide,
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide:before{ display: none; }
.ui-timepicker-div dl dd.ui_tpicker_time, .ui-timepicker-div dl dt {display:none;}
.ui-timepicker-div dl dd {margin:0px; display:inline-block; width:64px; margin-right:8px;}
.ui-timepicker-div dl dd .ui-widget.ui-widget-content {border:1px solid var(--border); border-radius:8px;}
input.ui-timepicker-input {width:40px; margin:0px; padding:7px 8px; border-radius:8px;}
.ui-spinner a.ui-spinner-button {width:17px; background:none; border:0px;}
.ui-button-icon-only .ui-icon {margin-top:-5px;}
