/**************** 20-12-2019 *******************/
@import url('https://fonts.googleapis.com/css?family=Cabin:400,500,600,700&display=swap');

/*
font-family: 'Cabin', sans-serif;
*/

@font-face {
    font-family:'SFProDisplayRegular';
    src: url('../fonts/SFProDisplayRegular.eot');
    src: url('../fonts/SFProDisplayRegular.eot') format('embedded-opentype'),
         url('../fonts/SFProDisplayRegular.woff2') format('woff2'),
         url('../fonts/SFProDisplayRegular.woff') format('woff'),
         url('../fonts/SFProDisplayRegular.ttf') format('truetype'),
         url('../fonts/SFProDisplayRegular.svg#SFProDisplayRegular') format('svg');
}

@font-face {
    font-family: 'SFProDisplayBlack';
    src: url('../fonts/SFProDisplayBlack.eot');
    src: url('../fonts/SFProDisplayBlack.eot') format('embedded-opentype'),
         url('../fonts/SFProDisplayBlack.woff2') format('woff2'),
         url('../fonts/SFProDisplayBlack.woff') format('woff'),
         url('../fonts/SFProDisplayBlack.ttf') format('truetype'),
         url('../fonts/SFProDisplayBlack.svg#SFProDisplayBlack') format('svg');
}

@font-face {
    font-family: 'SFProDisplayBold';
    src: url('../fonts/SFProDisplayBold.eot');
    src: url('../fonts/SFProDisplayBold.eot') format('embedded-opentype'),
         url('../fonts/SFProDisplayBold.woff2') format('woff2'),
         url('../fonts/SFProDisplayBold.woff') format('woff'),
         url('../fonts/SFProDisplayBold.ttf') format('truetype'),
         url('../fonts/SFProDisplayBold.svg#SFProDisplayBold') format('svg');
}
body,html{ height: 100%;}
body{ padding:0; margin:0; font-size:12px; color:#000; font-family: 'Cabin', sans-serif; overflow-x:hidden; background:#f5f4f8 url(../images/body_bg.jpg) no-repeat right bottom; background-size: 75% auto;}
a {outline:none !important; text-decoration:none;
-webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; -ms-transition: all .6s ease-in-out; transition:all .6s ease-in-out;}
a:hover, a:focus, select:focus, button:focus { outline:none; text-decoration:none;}
* { margin:0; padding:0;}
img { border:none; vertical-align:middle; max-width:100%;}
li{ list-style:none;}
h1, h2, h3, h4, h5, h6, input, select, textarea, button{ outline:none !important; font-weight:400;}
input, textarea, select{ /*-moz-appearance: none; -webkit-appearance: none;*/}

.container{ width:96%; max-width:1450px; margin:0 auto; padding:0;}

.main_login{ width:100%; float:left; margin:0; padding:40px 0;}
.main_login .inner{ width:100%; float:left; margin:0; padding:0; position:relative;}
.main_login .logo{ width:100%; float:left; margin:0 0 85px 0; padding:0;}
.main_login .logo img{ max-width:220px; }
.main_login figure{ width:100%; float:left; margin:10px 0 0 0; padding:0; text-align: center;}

.main_login .log_form{ width:100%; float:left; margin:0; padding:0;}
.main_login h3{ margin: 0 0 6px 0; padding: 0; font-size: 26px; font-weight: 700; color: #313637; clear: both;}
.main_login .info{ width:100%; float:left; margin: 0 0 30px 0; padding: 0; font-size: 18px; color: #949393;}

.main_login .form_block{ width:100%; display: inline-block; margin:0 0 11px 0; padding:0; position:relative; }
.main_login .form_block label{ width: 100%; display: inline-block; margin: 0; padding:16px 0 5px 27px; position: absolute; left: 4px; top:0; font-size: 18px; color:  #313637; font-weight: 400;}
.main_login .form_block .form-control{ height: 91px; border-radius: 0px; background:#fff; border:1px solid #e9ebf3; font-size:18px; color:#1b3a8a; padding:31px 20px 0 30px; box-shadow:2px 2px 8px rgba(0, 0, 0, 0.05) !important; font-weight:400;}
.main_login .form_block .form-control::placeholder{ color:#1b3a8a; opacity:1;}
.main_login .form_block .form-control:focus::placeholder{ color:#1b3a8a; opacity:1;}

.main_login .form_block .form-control:focus{ border-left: 4px solid #1b3a8a; padding-left: 27px;}

.main_login .btn{ -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; transition:all .4s ease-in-out;}
.main_login .log_btn{margin:0 17px 35px 0; height:51px; background:#06d2ed; font-size:16px; color:#fff; font-weight:600; border-radius:3px; border:none !important; box-shadow:3px 3px 15px rgba(6, 210, 237, 0.53); padding:0 53px; cursor: pointer; letter-spacing: 0.6px;}
.main_login .log_btn:hover, .main_login .log_btn:focus{ background:#1b3a8a; color:#fff; box-shadow: 0 0 0 rgba(0, 0, 0, 0.0);}
.main_login .fb_log{margin:0 0 35px 0; height:51px; background:transparent; font-size:16px; color:#1b3a8a; font-weight:600; border-radius:3px; border:1px solid #1b3a8a !important; box-shadow:none !important; padding:0 28px; cursor: pointer;}
.main_login .fb_log i{ font-size:19px; position:relative; bottom:-1px; margin-right:5px;}
.main_login .fb_log:hover, .main_login .fb_log:focus{ background:#1b3a8a; color:#fff; box-shadow: 0 0 0 rgba(0, 0, 0, 0.0);}
.main_login p{ margin:0; padding:0; font-size:16px; color:#7f8284;}
.main_login p a{ color:#7f8284;}
.main_login p strong a{ color:#1b3a8a;}
.main_login p a:hover{ color:#1b3a8a; text-decoration: underline;}
.main_login p strong a:hover{ color:#06d2ed;}

.check_detail{ width:100%; float:left; padding:0; margin:0 0 50px 0;}
.check_detail label{ width:100%; font-size:16px; color:#7f8284; margin:0;}
input[type=checkbox]+.lbl::before, input[type=radio]+.lbl::before { font-family: fontAwesome; font-weight: normal; font-size: 11px; color: #fff; content: "\a0"; background-color: #fff; border: 1px solid #e4e7ef; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); border-radius: 4px; display: inline-block; text-align: center; vertical-align: middle; height:15px; line-height:15px; min-width:15px; margin-right:10px; margin-top:-3px;}
/* Checked state styles */
input[type=checkbox]:checked+.lbl::before, input[type=radio]:checked+.lbl::before { display: inline-block; content: '\f00c'; background-color: #1b3a8a; border-color: #1b3a8a;}
/* Hover state styles */
input[type=checkbox]:hover+.lbl::before, input[type=radio]:hover+.lbl::before, input[type=checkbox]+.lbl:hover::before, input[type=radio]+.lbl:hover::before { border-color: #1b3a8a;}
/* Shadow when checked or Active */
input[type=checkbox]:active+.lbl::before, input[type=radio]:active+.lbl::before, input[type=checkbox]:checked:active+.lbl::before, input[type=radio]:checked:active+.lbl::before {}
/* Disabled state styles */
input[type=checkbox]:disabled+.lbl::before, input[type=radio]:disabled+.lbl::before, input[type=checkbox][disabled]+.lbl::before, input[type=radio][disabled]+.lbl::before, input[type=checkbox].disabled+.lbl::before, input[type=radio].disabled+.lbl::before { background-color: #DDD !important; border-color: #CCC !important; box-shadow: none !important; color: #BBB;}
/* Styles for Radio button */
input[type=radio]+.lbl::before { border-radius: 32px; font-family: Arial, Helvetica, sans-serif; font-size:32px;}
input[type=radio]:checked+.lbl::before { content: "\2022";}
/* Hiding default checkbox and Radio button design */
input[type=checkbox], input[type=radio] { opacity: 0; position: absolute; z-index: 12; width: 18px; height: 18px; }
/* Disable outline when clicked*/
input[type=checkbox]:checked, input[type=radio]:checked, input[type=checkbox]:focus, input[type=radio]:focus { outline: none !important; }
input[type=checkbox]+.lbl, input[type=radio]+.lbl { position: relative; z-index: 11; display: inline-block; margin: 0; line-height: 15px; min-height: 15px; min-width: 15px; font-weight:400; }