html{height: 100%;}
body{height: 100%; min-width: 360px; position: relative; font: 20px/26px "Calibri"; background: #fff; color: #1c1c20}
#container{min-height: 100%; position: relative;}
#sticky-footer-wrapper {padding-bottom: 110px;}
#header{height: 155px; position: relative; border-bottom: 2px solid #e9ecf7; margin-bottom: 30px;}
#content{min-height: 200px; position: relative;}
#footer{position: absolute; left: 0; bottom: 0; width: 100%; height: 110px; font-size: 17px; display: flex;
flex-direction: column; justify-content: center; align-items: center;}

/*Common styles*/
.title{font: 66px/0.9 "Calibri-Light"; margin: 0 0 25px 0;}
.title-2{font: 40px/1 "Calibri-Light"; margin: 0 0 15px 0}
h1{font: 52px/60px "Calibri-Light"; margin: 0 0 23px 0}
h2{font: 40px "Calibri-Light"; margin: 0 0 15px 0}
h3{font: 36px "Calibri-Light"; margin: 0 0 15px 0}
.subtitle{font: 36px/1 "Calibri-Light"; margin: 0 0 10px 0}
p{margin-bottom: 21px}
strong{font-weight: normal; font-family: "Calibri-Bold";}
ul a{color: inherit}
ul a:hover{color: #1b4e9b}
#content li{margin: 0 0 7px;}
#content iframe.video{max-width: 100%;}

.button, .modal-button{display: inline-block; min-width: 142px; padding: 10px 20px; text-transform: uppercase; 
background: #f8b002;  text-align: center; border-radius: 50px; cursor: pointer; -moz-transition: all 0.7s; 
-o-transition: all 0.7s; -webkit-transition: all 0.7s; font: 15px "Calibri-Bold"; color: inherit; border: none;
-webkit-appearance: none;}
.button:hover, .modal-button:hover{background: #d99802}

#header div.inner{max-width: 1680px; margin: 0 auto; height: 100%; display: flex; justify-content: space-between;
align-items: center;}
#header a.logo{}
#header a.logo-mobile{display: none;}
#header a.logo img{display: block; max-width: 100%;}
#header div.data{font-size: 16px; display: flex; align-items: center;}
#header div.data a{margin-left: 18px; padding-left: 20px;}
#header div.data a span{text-decoration: underline;}
#header div.data a:hover span{text-decoration: none;}
#header a.password{background: url(../images/cabinet/password.svg) left center no-repeat;}
#header a.logout{background: url(../images/cabinet/logout.svg) left center no-repeat;}

#container.login-page{background: url(../images/cabinet/bg.png) top center no-repeat;}
#container.login-page #header{border-color: transparent;}
#container.login-page #footer{color: #fff;}
#container.login-page #footer a{color: #f8b002;}

div.registration-block{max-width: 560px; margin: 0 auto; background: url(../images/cabinet/bg-login.png);
border-radius: 10px; padding: 30px 80px 50px 80px;}
div.registration-block h1{text-align: center; margin-bottom: 13px; font: 40px/40px "Calibri-Light"}
div.registration-block div.login-title{text-align: center; font-family: "Calibri-Bold"; margin-bottom: 30px;}
div.registration-block form div.fields{display: flex; justify-content: space-between; flex-wrap: wrap;}
div.registration-block form div.fields.recover{margin-bottom: 30px;}
div.registration-block form div.fields.recover div:last-child{width: 100%; justify-content: space-between;
display: flex; align-items: center;}
div.registration-block form div.fields.recover div:last-child img{margin-right: 15px;}
div.registration-block form div.fields.recover div:last-child input{margin-bottom: 0;}
div.registration-block form div.fields.recover-create{margin-bottom: 10px;}
div.registration-block form div.fields.recover-create input.form-text-input{width: 240px}
div.registration-block form input.form-text-input{border-radius: 6px; border: none; height: 45px; width: 300px;
padding: 0 10px; margin-bottom: 20px;}
div.registration-block form div.field-name{height: 45px; display: flex; align-items: center;}
div.registration-block form div.field-input{position: relative;}
div.field-input span.eye{width: 30px; height: 30px; background: url(../images/cabinet/eye.svg) center no-repeat;
background-size: 20px 20px; cursor: pointer; display: inline-block; position: absolute; right: 8px; top: 9px;}
div.registration-block form span.required{display: none;}
div.registration-block div.bottom{width: 300px; margin-left: calc(100% - 300px); font-size: 16px; display: flex;
justify-content: space-between; align-items: center; margin-bottom: 28px}
div.registration-block div.bottom a{text-decoration: underline;}
div.registration-block div.bottom span.remember{display: flex; align-items: center;}
div.registration-block div.bottom span.remember input{width: 18px; height: 18px;}
div.registration-block div.bottom span.remember label{margin-left: 8px;}
div.registration-block div.form-buttons{width: 300px; margin-left: calc(100% - 300px);}
div.registration-block div.form-buttons input{width: 200px;}

.form-errors, .form-success{margin: 0 0 20px 0; padding: 9px 7px 2px 7px; width: 100%; font-size: 17px; border-radius: 6px;
line-height: 19px}
.form-errors p, .form-success p{margin-bottom: 8px}
.form-errors {border: 1px solid #d85a5b; color: #d85a5b; background: #fff0f0}
.form-success{border: 1px solid #84a151; color: #84a151; background: #edf5df}

#content.inside{max-width: 1160px; margin: 0 auto; display: flex; justify-content: space-between; 
align-items: flex-start;}
.private-menu{width: 265px; border: 2px solid #e9ecf7; padding: 27px;}
.private-menu ul{}
.private-menu ul li{margin-bottom: 22px !important;}
.private-menu > ul > li > a, .private-menu > ul > li > span{font-family: "Calibri-Bold"; text-transform: uppercase;}
.private-menu > ul > li:last-child{margin-bottom: 0 !important;}
.private-menu ul ul{padding: 15px 0 0 23px;}
.private-menu ul ul li{background: url(../images/cabinet/minus.svg) left center no-repeat; padding-left: 25px;
margin-bottom: 19px !important;}
.private-menu ul ul li a{text-transform: none;}

.private-main{width: 860px;}

form.private.requests{padding-top: 25px;}
form.private div.fields{display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 25px;}
form.private div.fields div.field-name{width: 20%; height: 46px; display: flex; align-items: center;}
form.private span.required{color: #ff0000;}
form.private div.fields div.field-input{width: 77%; margin-bottom: 20px; position: relative;}
form.private div.fields div.field-input input{border: 1px solid #abaaaa; border-radius: 4px; padding: 10px;
width: 100%;}
form.private div.fields div.field-input input[type="password"]{max-width: 350px;}
form.private div.fields div.field-input input[type="file"]{border: none; -webkit-appearance: none;}
form.private div.fields div.field-input span.eye{right: auto; left: 310px;}
form.private div.fields.two-passwords input[type="text"]{max-width: 350px;}
form.private div.fields select, form.private div.fields textarea{border: 1px solid #abaaaa; border-radius: 4px; 
padding: 10px; width: 100%;}
form.private div.form-buttons{margin-bottom: 15px;}
form.private p.required-fields{font-size: 15px;}
form.private div.file-params span.delete{color: #1b4e9b; text-decoration: underline; cursor: pointer;}

#menu-button{width: 25px; height: 25px; background: url("../images/menu.svg") no-repeat; background-size: cover; 
cursor: pointer; display: none; margin-left: 18px;}
#mobile-menu{padding: 60px 30px 20px 30px; background: #fff; width: 100%; position: fixed; bottom: -100%; height: 100%;
z-index: 1000; overflow-x: hidden; overflow-y: auto; right: auto; transition: bottom 0.5s;}
#mobile-menu.showed{bottom: 0}
#mobile-menu #menu-close{width: 25px; height: 25px; position: absolute; top: 30px; right: 30px; 
background: url("../images/cross.svg") no-repeat center; background-size: contain; cursor: pointer}
#mobile-menu a, #mobile-menu li span{color: #1b4e9b;}
#mobile-menu ul.top{border-bottom: 2px solid #e9ecf7; padding-bottom: 15px; margin-bottom: 20px;}
#mobile-menu ul.top li{margin-bottom: 9px;}
#mobile-menu ul.top li a{font-size: 16px; padding-left: 20px;}
#mobile-menu ul.top li span{border-bottom: 1px solid #1b4e9b;}
#mobile-menu div.private-menu{padding: 0; border: none;}

div.private-main div.top-section{width: 708px; display: flex; justify-content: space-between; align-items: center;
margin-bottom: 20px;}
div.private-main div.top-section > h1{margin: 0;}
div.private-main div.top-section > a{position: relative; margin-bottom: -5px; padding: 8px 30px 8px 53px;
border: 2px solid #f8b002;}
div.top-section > a.add-file{background: url("../images/cabinet/btn-document.svg") left 28px center no-repeat;}
div.top-section > a.add-video{background: url("../images/cabinet/btn-video.svg") left 28px center no-repeat;}

form.filters{padding: 20px 2.5%; background: #e9ecf7; margin-bottom: 30px; display: flex; justify-content: space-between;
align-items: center;}
form.filters input[type='text']{border: 1px solid #abaaaa; border-radius: 20px; height: 38px; padding-left: 12px;
padding-right: 12px; font-size: 18px;}
form.filters input.autocomplete-input{width: 205px; padding-right: 35px; 
background: #fff url("../images/cabinet/search.svg") right 14px center no-repeat;}
form.filters input.interval{width: 150px; background: #fff url("../images/cabinet/calendar.svg") right 14px center no-repeat;}
form.filters input.button{min-width: 100px; background: #abaaaa;}
form.filters a{text-decoration: underline; font-size: 16px;}

div.materials{margin-bottom: 50px; border-top: 1px solid #e9ecf7;}
div.materials > div{border-bottom: 1px solid #e9ecf7; padding: 15px 0 18px 0; display: flex; align-items: flex-start;}
div.materials div.left{width: calc(100% - 100px); padding-right: 3%;}
div.materials div.left a{background: url("../images/cabinet/document.svg") no-repeat left center; text-decoration: underline; 
padding-left: 33px;}
div.materials div.left a.video{background: url("../images/cabinet/video.svg") no-repeat left center;}
div.materials div.left > p{color: #abaaaa; padding-top: 4px; margin: 0 0 0 33px;}
div.materials div.left > p span{margin-left: 12px;}
div.materials div.right{width: 100px;}
div.materials div.right span.delete{color: #abaaaa; background: url("../images/cabinet/trash.svg") left 0 top 6px no-repeat;
font-size: 16px; padding-left: 25px; height: 24px; display: flex; align-items: center; cursor: pointer;}

div.pager{display: flex; align-items: flex-start;}
div.pager a{font: 21px "Calibri-Bold"; padding: 4px 11px;}
div.pager a.active, div.pager a:hover{background-color: #e9ecf7;}
div.pager a.pager-prev{background: url("../images/cabinet/prev.svg") no-repeat center; height: 34px;}
div.pager a.pager-next{background: url("../images/cabinet/next.svg") no-repeat center; height: 34px;}

.autocomplete-suggestions{border: 1px solid #999; border-radius: 4px; background: #fff; overflow: auto; cursor: pointer}
.autocomplete-suggestion{padding: 2px 5px; white-space: nowrap; overflow: hidden; font-size: 18px;}
.autocomplete-selected{background: #f0f0f0;}
.autocomplete-suggestions strong{font-weight: normal; color: #1b4e9b;}
.autocomplete-group{padding: 2px 5px;}
.autocomplete-group strong{display: block; border-bottom: 1px solid #000;}

.ui-datepicker td, .ui-datepicker th{padding: 1px !important; min-width: auto !important;}
.ui-datepicker tr:hover{background: none !important;}
.ui-datepicker.ui-widget{font-size: 0.85em !important;}
.ui-datepicker .ui-state-highlight, .ui-datepicker  .ui-state-active{background: #f8b002 !important; 
color: #111 !important;}

#overlay{display: none; width: 100%; height: 100%; position: fixed; background: #131111; opacity: 0.5; z-index: 999; 
top: 0; left: 0;}
#custom-modal-window{display: none; position: fixed; background: #fff; width: 400px;
z-index: 1001; top: 15%; left: 50%; transform: translateX(-50%); padding: 20px 25px 20px 25px; border-radius: 4px;
box-shadow: 0px 2px 25px #333; -webkit-box-shadow: 0px 2px 25px #333;}
#custom-modal-window span.close{background: url("../images/cross.svg") no-repeat center; position: absolute;
width: 12px; height: 12px; top: 15px; right: 15px; cursor: pointer;}
#custom-modal-window div.message{margin:10px 0 15px 0; line-height: 20px;}
#custom-modal-window div.extra.active{margin-bottom: 15px;}
#custom-modal-window select{width: 190px}
#custom-modal-window div.buttons{padding-top: 10px; display: flex; justify-content: space-between;}
#custom-modal-window div.buttons input.modal-button{margin: 0}