﻿
body {
    font-family: 'Proxima-Nova-Alt';
}

    body.register, body.register > .container-fluid, body.register > .container-fluid > .row {
        min-height: 100vh
    }

        body.register > .container-fluid > .row > .col-lg-7 > img {
            object-fit: cover;
            height: 100vh !important;
            min-height:100%;
        }

.logo img {
    max-width: 180px;
}

.backlink {
    color: #000;
    text-decoration: none;
    font-size: 15px;
    font-family: 'Poppins';
    font-weight: 500;
}

    .backlink img {
        filter: invert(1);
    }

.langlinks a {
    color: #666;
    font-size: 15px;
    text-decoration: none
}

.ar {
    font-family: 'Readex-Pro';
}

.register-heading {
    background: #EFF3F3;
    border-radius: 8px;
    width: 100%;
    height: 90px;
    padding: 20px 0px;
    font-size: 14px;
    font-weight: 300
}

    .register-heading h3 {
        font-size: 18px;
        font-weight: bold;
        color: #102851
    }

    .register-heading img {
        margin-top: -10px;
    }

.nav-tabs li button {
    font-size: 16px;
    color: #666 !important;
    margin-bottom: -1px !important;
    border: none !important;
}

    .nav-tabs li button.active {
        color: #0097A3 !important;
        border: none;
        border-bottom: 1px solid #0097A3 !important;
    }

.tab-content + p {
    font-size: 14px;
    font-weight: 300;
    color: #666;
    margin-top: 20px;
}

.tab-content p {
    font-size: 14px;
    font-weight: 300;
    color: #666;
    margin-top: 20px;
}

.lblPlaceHolder span {
    font-size: 14px;
    font-weight: 300;
    color: #666;
}

html[dir=rtl] .lblPlaceHolder span {
    direction: ltr !important;
    display: inline-block;
}

body.register p a {
    color: #0097A3;
    font-weight: 600;
}

.next {
    background: #0097A3;
    border-radius: 10px;
    display: block;
    margin-top: 20px;
    padding: 15px 0;
    text-align: center;
    color: #FFF;
    border: none;
    width: 100%;
}

.or {
    color: #84A0A0;
    font-size: 16px;
    display: flex;
    font-weight: 300;
    margin: 20px 0;
    align-items: center
}

    .or::before, .or::after {
        height: 1px;
        flex-grow: 1;
        content: "";
        background: #D8D8D8
    }

.google-register {
    background: #EFF3F3;
    border-radius: 10px;
    padding: 15px 0;
    text-align: center;
    text-decoration: none;
    width: 100%;
    display: block;
    color: #5B6363;
    margin-bottom: 20px;
    position: relative;
}

    .google-register img {
        position: absolute;
        left: 25px;
        height: 30px;
    }

.signin::after {
    content: "";
    width: 100px;
    height: 1px;
    background: #D8D8D8;
    display: block;
    margin: 20px auto
}

.signin, .careprovider {
    font-size: 16px;
    color: #666;
    text-align: center
}

    .signin a, .careprovider a {
        font-weight: normal !important;
        text-decoration: none
    }

.input-area {
    width: 100%;
    height: 54px;
    border: 1px solid #D8D8D8;
    border-radius: 10px;
    margin-top: 20px
}

.confirmation {
    margin-top: 100px !important;
}

.no-bg.register-heading {
    background: none;
    margin-bottom: 30px
}

.confirmation-area, .form-area {
    font-size: 16px;
    font-weight: 600;
    color: #102851;
    position: relative;
}

    .confirmation-area input, .form-area input {
        border: 1px solid #D8D8D8;
        border-radius: 10px;
        width: 100%;
        height: 54px;
        margin: 10px 0 15px;
        padding: 0 15px
    }

    .confirmation-area a {
        display: block;
        color: #0097A3;
        font-weight: 300;
        font-size: 14px;
        text-decoration: none
    }

span.view-password {
    position: absolute;
    right: 15px;
    top: 49px;
}

.google-register {
    margin-top: 15px;
}

.intl-tel-input {
    width: 100%;
    direction:ltr !important;
}

    .intl-tel-input .input-control {
        padding-left: 87px;
    }

    .intl-tel-input .country-list .country.standard {
        display: none;
    }

.intl-tel-input .flag-container {
    top: 10px !important;
    bottom: 10px !important;
}

.intl-tel-input.separate-dial-code .selected-flag {
    background: none !important;
    border-right: 1px solid #ccc !important;
}

.form-area i.required {
    color:red;
}

/*html[dir="rtl"] .intl-tel-input.allow-dropdown .flag-container, html[dir="rtl"] .intl-tel-input.separate-dial-code .flag-container {
right:0;
left:auto
}

html[dir="rtl"] .intl-tel-input {
    width: 100%;
}

    html[dir="rtl"] .intl-tel-input.allow-dropdown input, html[dir="rtl"] .intl-tel-input.allow-dropdown input[type=text], html[dir="rtl"] .intl-tel-input.allow-dropdown input[type=tel], html[dir="rtl"] .intl-tel-input.separate-dial-code input, html[dir="rtl"] .intl-tel-input.separate-dial-code input[type=text], html[dir="rtl"] .intl-tel-input.separate-dial-code input[type=tel] {
        padding-right: 52px !important;
    }*/

html[dir="rtl"] body, html[dir="rtl"] .topbar .language .ar, html[dir="rtl"] .ar, html[dir="rtl"] .topbar a, html[dir="rtl"] .about-psyter p, html[dir="rtl"] .cta p {
    font-family: 'Alexandria', sans-serif;
    font-size: 14px
}

/*html[dir="rtl"] .intl-tel-input .country-list .country {
    text-align:right;
}

html[dir="rtl"] .intl-tel-input .selected-flag .iti-arrow {
    margin-right: 6px !important;
    margin-left: 0px !important;
}*/

html[dir="rtl"] .register-heading img {
    transform: scalex(-1);
    margin-right: 30px
}

html[dir="rtl"] .register-heading, html[dir="rtl"] .nav-tabs li button, html[dir="rtl"] .tab-content + p, html[dir="rtl"] .confirmation-area a, html[dir="rtl"] .nav-tabs li button, html[dir="rtl"] .tab-content p {
    font-size: 12px;
}

html[dir="rtl"] .signin, html[dir="rtl"] .careprovider, html[dir="rtl"] .confirmation-area, html[dir="rtl"] .form-area {
    font-size: 14px;
}

html[dir="rtl"] .register-heading h3 {
    font-size: 16px
}


html[dir="rtl"] .col-lg-5.px-md-5.px-3 > .row {
    flex-direction: row-reverse;
}

html[dir="rtl"] .backlink {
    font-family: 'Alexandria', sans-serif;
}

html[dir="rtl"] .backlink img {
    float: left;
    margin-top: 8px;
    margin-left: 0 !important;
    margin-right: 0.5rem;
    font-family: 'Alexandria', sans-serif;
}

html[dir="rtl"] span.view-password {
    right: auto;
    left: 15px;
}

.form-row .text-danger {
font-size:12px;display:block
}
html[dir="rtl"] .form-area, html[dir="rtl"] .form-area input {
    font-size: 14px;
}

    .form-area.error-field input {
        margin-bottom:0;border-color:#FF0000;
    }

 .form-area.error-field .text-danger {
    font-size:12px;
}
html[dir="rtl"] .form-area.error-field .text-danger {
    font-size: 10px;margin-bottom:10px;display:block
}
html[dir="rtl"] .form-row .text-danger {
    font-size: 10px;
}
.col-lg-7 img.h-100 {
min-height:100vh;
}


a.border-btn {
    border-radius: 6px;
    border: 1px solid #0097A3;
    line-height: 40px;
    padding: 0 18px;
    color: #0097A3;
    text-decoration: none;
    font-weight: normal;
}

    a.border-btn.red {
        border-color: #E22525;
        color: #E22525
    }

.info-box {
    background: #FFB4001F;
    border-radius: 5px
}

html[dir="rtl"] #email-tab-pane input::placeholder {
    text-align: right;
}

html[dir="rtl"] #email-tab-pane input {
    direction: ltr;
}

@media screen and (min-width:1551px) {
    .google-register {
        background: #eff3f3;
        border-radius: 10px;
        padding: 15px 0;
        text-align: center;
        text-decoration: none;
        width: 100%;
        display: block;
        color: #5b6363;
        margin-bottom: 30px;
        position: relative;
    }

    .tab-content p {
        font-size: 14px;
        font-weight: 300;
        color: #666;
        margin-top: 60px !important;
        margin-bottom: 44px !important;
    }

    #myTabContent .formarea {
        margin-top: 28px
    }
}
@media screen and (max-width:1400px) {
    .logo img {
        max-width: 150px;
    }

    .register-heading {
        padding: 12px 0px;
        height: 70px
    }

    .input-area {
        height: 45px;
    }

    .tab-content + p {
        margin-top: 10px;
    }

    .or {
        margin: 10px 0;
    }

    .google-register, .next {
        padding: 10px 0;
    }

    .signin, .careprovider {
        font-size: 14px;
        margin: 0
    }

    .row.justify-content-between.pt-4 {
        padding-top: 0.5rem !important;
    }

    .signin::after {
        margin: 10px auto;
    }

    .logo {
        margin-top: 1.0rem !important;
        margin-bottom: 1rem !important;
    }

    ul#myTab {
        margin-top: 1.5rem !important;
    }

    .confirmation {
        margin-top: 50px !important;
    }

    .google-register {
        margin-top: 15px
    }

    .view-password img {
        width: 18px;
    }

    span.view-password {
        top: 39px
    }

    .info img {
        width: 16px
    }

    .confirmation-area {
        margin-bottom: 0.5rem !important;
    }

    .form-area {
        font-size: 14px;
    }

        .confirmation-area input, .form-area input {
            height: 45px;
            margin: 5px 0 10px;
        }


    html[dir="rtl"] .signin, html[dir="rtl"] .careprovider {
        font-size: 12px;
    }

    html[dir="rtl"] ul#myTab {
        margin-top: 2.5rem !important;
    }

    html[dir="rtl"] .form-area, html[dir="rtl"] .form-area input {
        font-size: 12px;
    }
}

@media screen and (max-width:1140px) and (min-width:992px) {
    body.register > .container-fluid > .row > div {
        flex: 0 0 50%
    }
}
@media screen and (max-width:991px) {
    body.register > .container-fluid > .row > .col-lg-7 > img {
        display:none;
    }
    #reg_main_container, .login-container {
        padding: 10px 25px 0 !important;
    }
    .langlinks img {
    width:25px;
    }
}
@media screen and (max-width:576px) {
    .register-heading img {
        display: none;
    }
    .register-heading {
    padding-left:20px;padding-right:20px;justify-content:flex-start !important;
    }
}
@media screen and (max-width:450px) {
    .register-heading {
        flex-wrap: wrap;
        flex-direction: column;
        height: unset;
        align-items: center;
    }

        .register-heading img {
            margin-top: 10px;
            margin-bottom: -40px;
        }

    .google-register img {
        left: 10px;
        height: 21px;
    }

    .nav-tabs li button {
        font-size: 14px;
    }
}

html[dir=rtl] .input-en-sequence {
    direction: ltr !important;
    text-align: right !important;
}

/* Loder Css*/
.loader {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.5);
    z-index: 2000
}

    .loader img {
        max-width: 50%;
        max-height: 50%;
    }
/* Loder Css*/