@font-face {
    font-family: 'Museo Sans Cyrl';
    font-style: normal;
    font-weight: 100;
    src: local('Museo Sans Cyrl Light'), url(/new/fonts/MuseoSansCyrl.otf) format('truetype')
}

@font-face {
    font-family: 'Museo Sans Cyrl';
    font-style: normal;
    font-weight: 300;
    src: local('Museo Sans Cyrl'), url(/new/fonts/MuseoSansCyrl_0.otf) format('truetype')
}

@font-face {
    font-family: 'Museo Sans Cyrl';
    font-style: normal;
    font-weight: 500;
    src: local('Museo Sans Cyrl Semibold'), url(/new/fonts/MuseoSansCyrl_1.otf) format('truetype')
}

@font-face {
    font-family: 'Museo Sans Cyrl';
    font-style: normal;
    font-weight: 700;
    src: local('Museo Sans Cyrl Bold'), url(/new/fonts/MuseoSansCyrl_2.otf) format('truetype')
}

@font-face {
    font-family: 'Museo Sans Cyrl';
    font-style: normal;
    font-weight: 900;
    src: local('Museo Sans Cyrl Extrabold'), url(/new/fonts/MuseoSansCyrl_3.otf) format('truetype')
}

@font-face {
    font-family: Proxima_Nova_Regular;
    src: url(/new/fonts/Proxima%20Nova%20Regular.otf)
}

@font-face {
    font-family: Proxima_Nova_Light;
    src: url(/new/fonts/Proxima%20Nova%20Light.otf)
}

@font-face {
    font-family: Proxima_Nova_Bold;
    src: url(/new/fonts/Proxima%20Nova%20Bold.otf)
}

/** small detail styling */

.btn-ip {
    background-color: #A22E32;
    color: #fff !important;
    border-color: #A22E32;
}

.btn-ip-secondary {
    color: #555 !important;
}

.btn-ip:hover,
.btn-ip:active {
    background-color: #dd3f44;
    color: #fff;
    transition: all 0.6s ease-out;
}

.login-page {
    color: #A22E32;
    font-family: 'Museo Sans Cyrl', sans-serif;
}

.login-box {
    border-radius: 10px;
    border: 2px rgb(143, 143, 143) solid;
    background: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
}

.login-box-header {
    padding: 20px 20px 0 20px;
}

.login-box-header h1 {
    font-size: 1.3em;
    font-weight: 300;
    margin-top: 5px;
}

.login-box-header p {
    text-transform: uppercase;
    font-size: 1.3em;
    font-weight: 600;
    margin-bottom: 0;
}

.login-box-body input[type=text],
.login-box-body input[type=email],
.login-box-body input[type=password] {
    border-left: 0;
    border-right: 0;
    border-top: 0;
    padding-left: 0;
}

.form-control:focus {
    border-color: #A22E32;
}

.login-page a {
    color: #c0363b;
}

.login-page a:hover,
.login-page a:active {
    color: #296986;
    text-decoration: underline;
    transition: all 0.3s ease-out;
}

.login-top a:hover,
.login-top a:active {
    color: #fff;
}

.help-block {
    display: none;
}

.has-error .help-block {
    display: block;
}

/** overall login page styling */
/*
html, body {
    width: 100%;
    height: 100%;
}
*/
.login-logo img {
    max-width: 300px;
}

.login-logo {
    float: left;
    margin-left: 30px;
    margin-top: 30px;
}

.login-back {
    text-align: right;
    margin-top: 50px;
    margin-right: 30px;
    float: right;
    color: #F4D7D8;
}

@media screen and (max-width: 767px) {
    .login-logo {
        text-align: center;
        width: 100%;
        margin-left: 0;
    }

    .login-back {
        text-align: center;
        margin-left: 0px;
        margin-top: 20px;
        margin-right: 0;
        margin-bottom: 30px;
        float: left;
        width: 100%;
    }
}

.login-wrapper {
    max-width: 1200px;
    margin: 0 auto;
}

.login-box {
    clear: both;
}

.login-page {
    background: url(/new/images/login_bg_blurred.jpg) center center / contain no-repeat;
    background: -webkit-image-set(url(/new/images/login_bg_blurred_850.jpg) 1x, url(/new/images/login_bg_blurred.jpg) 2x);
    background: image-set(url(/new/images/login_bg_blurred_850.jpg) 1x, url(/new/images/login_bg_blurred.jpg) 2x);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top left;
    min-width: 300px;
    min-height: 100%;
    min-height: 100vh;
}

.terms-box {
    max-width: 800px;
    margin: 0 auto;
}

@media screen and (min-width: 768px) and (min-height: 500px) {
    .login-box {
        position: relative;
        top: 100px;
    }
}

@media screen and (min-width: 768px) and (min-height: 800px) {
    .login-box {
        position: relative;
        top: 200px;
    }
}

.login-center {
    /*min-height: 100%;
    min-height: 100vh;
    min-width: 100%;
    min-width: 100vw;
    display: flex;
    align-items: center;*/
}

.login-box {
    /*max-width: 50%;*/
}

.login-top {
    /*max-width: 50%;
    align-self: flex-start;*/
}

.login-footer {
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    width: 100%;
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
    background: #2b2b2b;
    color: #40C5FF;
}