@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, article { display: block }
body { line-height: 1 }
ol, ul { list-style: none }
:focus { outline: 0 }
::-moz-focus-inner {border:0;outline:0}
table { border-collapse: collapse; border-spacing: 0;}
.clear { clear: both }
.cf:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; font-size: 0; line-height: 0 }
.cf { display: inline-block }
* html .cf { height: 1% }
.cf { display: block }
a, a:hover, a:focus{outline: none;}
a:hover{text-decoration: none;}
img, a, .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {outline: none;}

html, body{min-height: 100%;}
body{background: url(../images/login-bg.jpg) no-repeat center center; background-size: cover; font-family: 'Lato', sans-serif; font-size: 16px;}


h1 {font-size: 56px; line-height: 66px; font-weight: 700; letter-spacing: -1px;}
h2 {font-size: 40px; line-height: 47px; font-weight: 700;}
h3 {font-size: 32px; line-height: 38px; font-weight: 700;}
h4 {font-size: 22px; line-height: 26px; font-weight: 500;}
.sub-heading{font-size: 18px; line-height: 21px;}
.caption{font-size: 10px; line-height: 12px; letter-spacing: 0.5px;}
.caption-large{font-size: 12px; line-height: 14px;}
.bb-text-1{letter-spacing: 0.5px; font-size: 13px; line-height: 20px;}
.font-14, .btn, .app-btn-link{font-size: 14px; line-height: 17px; font-weight: 700;}

h1, h2, h3, h4, .sub-heading{font-family: 'Rubik', sans-serif;}
.caption, .caption-large, .bb-text-1, .font-14, .btn, .app-btn-link{font-family: 'Lato', sans-serif; }

label{ font-weight: inherit;}
.primary-blue{background: #1B3144;}
.header, .white-bg, .whiteBox, .table-striped>tbody>tr:nth-of-type(even){background: #fff;}
.blue-bg{background: #3A59A8;}

.bb-text-1{color: #313237}
.bb-text-1 a{color: #3A59A8;}
body, h1, h2, h3, .caption, .caption-large, h4, .sub-heading, .white-bg .bb-text-1, .font-14, .bb-text-1 a:hover{ color: #1B3144;}

.green, .app-table tr td.green{color: #4B986D}
.neon, .app-table tr td.neon{color: #ED1C57}
.app-btn-link{color: #3A59A8;}
.app-btn-link:hover{color: #1B3144; text-decoration: none;}

.form-control{background: #fff; border: 2px solid #DEE0E5; width: 100%; padding: 6px 12px 7px; color: #1B3144; font-size: 16px; line-height: 19px; font-family: 'Lato', sans-serif; font-weight: 700; height: auto; letter-spacing: 0.2px;}
select.form-control{background-image: url(../images/icon/select-icon.svg); background-position: calc(100% - 8px) 4px, calc(100% - 8px) 7px, 100% 0; background-size: 14px 14px, 10px 10px; background-repeat: no-repeat; -webkit-appearance: none; -moz-appearance: none; padding: 2px 15px 2px 10px;}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control{background: #fff; color: #DEE0E5;}
input:focus, textarea:focus, .form-control:focus, select:focus, input, textarea, .form-control, select, .btn:focus, .btn:active, .btn:visited, .btn:hover, .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus{ -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
select.form-control:focus, input.form-control:focus, textarea.form-control:focus{border: 2px solid #DEE0E5;}

.btn{padding: 3px 12px 4px;}
.btn-primary{border: 2px solid #3A59A8; color: #fff; background: #3A59A8;}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle{border: 2px solid #3A59A8; color: #3A59A8; background: transparent; background-color: transparent;}
.btn-secondary{border: 2px solid #3A59A8; color: #3A59A8;background: transparent; background-color: transparent;}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary:active:focus, .btn-secondary:active:hover, .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, .show > .btn-secondary.dropdown-toggle{ border: 2px solid #3A59A8; color: #3A59A8; background: #F5F6F8;}
/* Start Placeholder */
.form-control::placeholder {color: #1B3144 !important; opacity: 1;}
.form-control:-ms-input-placeholder {color: #1B3144 !important; opacity: 1;}
.form-control::-ms-input-placeholder {color: #1B3144 !important; opacity: 1;}

.btn, .form-control, .card, .checkmark{ -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}

body { -webkit-animation: fadein 2s; -moz-animation: fadein 2s; -o-animation: fadein 2s; animation: fadein 2s; }
a,a:after, button, .app-btn-link{ -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; -ms-transition: all 0.2s linear; transition: all 0.2s linear;}

.app-login-box{width: 100%; max-width: 614px; padding: 0 15px; margin: 50px auto 0;}
.app-login-logo{ width: 100%; max-width: 480px; padding: 0 15px; margin: 13vh auto 0;}
.app-login-logo img{width: 100%;}
.card{border: 2px solid #DEE0E5; padding: 35px 133px 50px;}
.app-login-title{text-align: center;}
.app-login-box .card-body{padding: 0;}
.app-login-box .form-group{margin-top: 34px; margin-bottom: 0;}
.app-login-box .form-group.mt-26{margin-top: 26px;}
.form-check-label{vertical-align: middle; color: #3A59A8; font-size: 13px; line-height: 20px; letter-spacing: 0.5px;}
.checkBox{padding-left: 25px; cursor: pointer;}
.checkBox input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
.checkmark { position: absolute; top: 0; left: 0; height: 20px; width: 20px; background-color: #fff; border: 2px solid #DEE0E5; }
.checkBox label{cursor: pointer;}
.checkBox:hover input ~ .checkmark { background-color: #fff;}
.checkBox input:checked ~ .checkmark {
    background-color: #3A59A8; border-color:#3A59A8;}
.checkmark:after { content: ""; position: absolute; display: none;}
.checkBox input:checked ~ .checkmark:after { display: block;}
.checkBox .checkmark:after { left: 4px; top: 0px; width: 8px; height: 13px; border: solid #fff; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus{ -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus, .was-validated .form-control:invalid, .form-control.is-invalid{border: 2px solid #AF0606;}
.form-control::placeholder {color: #DEE0E5 !important; opacity: 1;}
.form-control:-ms-input-placeholder {color: #DEE0E5 !important; opacity: 1;}
.form-control::-ms-input-placeholder {color: #DEE0E5 !important; opacity: 1;}

.mt-17{margin-top: 17px;}
.mt-27{margin-top: 27px;}
.width-100{width: 100%;}

.alert-1{
    margin-top: 15px;
}
.alert-1.alert-dismissible .close{
    padding: 0.54rem 0.75rem;
}
.invalid-feedback{margin: 8px 0 0 0px;}
.invalid-feedback strong, .invalid-feedback{ font-size: 12px; line-height: 14px; color: #AF0606;}

@media (max-height : 750px) {
    .app-login-logo{margin-top: 60px;}
    .app-login-box{margin-top: 50px;}
}

@media (max-width : 768px) {
    .app-login-logo img{width: 90%;}
    .card{padding: 15px;}
    .app-login-box .form-group{margin-top: 16px;}
    .app-forgot{padding: 15px 0 0 15px !important; text-align: left !important;}
}



