/*
 * Colours below read a --theme-* custom property with the current value as the var()
 * fallback, so the page looks exactly like this until the `pageTheme` metadata sets one.
 * See App\Libraries\V3\ViewDataLibrary::getPageTheme() for the metadata syntax.
 */

/* fonts */
.roboto {
    font-family: 'Roboto', sans-serif;
}

.montserrat {
    font-family: 'Montserrat', sans-serif;
}

.font-10 {
    font-size: 14px;
}

.font-15 {
    font-size: 15px;
}

.font-17 {
    font-size: 17px;
}

.font-18 {
    font-size: 18px;
}

.font-20 {
    font-size: 20px;
}

.font-23 {
    font-size: 23px;
}

.font-25 {
    font-size: 25px;
}

.font-26 {
    font-size: 26px;
}

.font-27 {
    font-size: 27px;
}

.font-30 {
    font-size: 30px;
}

.font-32 {
    font-size: 32px;
}

.font-92 {
    font-size: 92px;
}

.regular {
    font-weight: 400;
}

/* color */

.color-c3c3c3 {
    color: #c3c3c3;
}

.color-5b5a5a {
    color: #5b5a5a;
}

.color-787878 {
    color: #787878;
}

.color-181818 {
    color: #181818;
}

.color-9c9c9c {
    color: #9c9c9c;
}

.color-565656 {
    color: #565656;
}

.color-111 {
    color: #111;
}

.bg-dedede {
    background-color: var(--theme-surface-alt, #dedede);
}

.text-2672ab {
    color: var(--theme-accent, #2672ab);
}

.text-a8cff0 {
    color: var(--theme-link, #084c94);
}

.lh-32 {
    line-height: 32px;
}

.pt-600 {
    padding-top: 600px !important;
}

.popup_margin {
    margin-top: 11px;
}

.letter-spacing-2 {
    letter-spacing: 1px;
}

.pt-40 {
    padding-top: 25px;
    padding-bottom: 15px;
}

.pt-35 {
    padding-top: 15px;
    padding-bottom: 35px;
}

.mt-8 {
    margin-top: 80px;
    padding-bottom: 80px;
}

.py-35 {
    padding-top: 35px;
    padding-bottom: 31px;
}

.ps-130 {
    padding-left: 180px;
}

.pt-174 {
    padding-top: 100px;
}

.pb-60 {
    padding-bottom: 60px;
}

.mt-75 {
    margin-top: 75px;
}

.mb-150 {
    margin-bottom: 150px;
}

.me-62 {
    margin-right: -70px;
}

.py-168 {
    padding-top: 0px;
    padding-bottom: 30px;
}

.pb-65 {
    padding-bottom: 15px;
    padding-top: 10px;
}

.opacity_0 {
    opacity: 0;
}

.opacity_1 {
    opacity: 1;
}

.z_index_0 {
    z-index: 0;
}

.footer-p {
    line-height: 20px;
    font-size: 14px;
}

.footer a:hover {
    color: var(--theme-link, #000) !important;
}

.footer {
    background: var(--theme-footer-bg, #2672ab);
}


.terms_condition a:hover {
    color: var(--theme-link, #2bc9ff) !important;
    text-decoration: underline !important;
}

.error {
    color: #f82121;
    font-size: 15px;
}

.navbar-brand {
    margin-right: -2rem !important;
}

.modal .modal-body button.con_button_1 {
    color: var(--theme-cta-text, #fff) !important;
}

.modal .modal-body a.con_button_1:hover {
    color: var(--theme-cta-text, #fff) !important;
    text-decoration: unset !important
}

.cnt_icon {
    width: 100%;
    padding: 0px 0px 1px 1px;
}

input.enter_num_field::-webkit-input-placeholder {
    color: #220000;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 500;
}

input.enter_num_field::-moz-placeholder {
    color: #220000;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 500;
}

input.enter_num_field:-ms-input-placeholder {
    color: #220000;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 500;
}

input.enter_num_field:-moz-placeholder {
    color: #220000;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 500;
}

input.enter_num_field::-webkit-input-placeholder {
    color: #828282;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px
}

input.enter_num_field::-moz-placeholder {
    color: #828282;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px
}

input.enter_num_field:-ms-input-placeholder {
    color: #828282;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px
}

input.enter_num_field:-moz-placeholder {
    color: #828282;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px
}

.con_button_1 {
    border-radius: 7px;
    background: var(--theme-cta-bg, #2672ab);
    width: 100%;
    height: 44px;
    line-height: 35px;
}

.con_button_1_B {
    border-radius: 7px !important;
    border: 1px solid var(--theme-cta-ring, white) !important;
    background: var(--theme-cta-bg, #0044CC) !important;
}

.con_button_1_B:hover {
    color: var(--theme-cta-text, white) !important;
}

.lh12 {
    line-height: 12px;
}

.enter_num_field {
    width: 100%;
    border: 0;
    height: 45px;
    padding-left: 63px;
    color: #220000;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    padding-bottom: 8px;
    font-weight: 500;
    border-radius: 7px;
}

#pho_noNumberSubscriptionBtn.con_button_1:disabled,
.con_button_1[disabled] {
    border: 1px solid var(--theme-border, #999999);
    background: var(--theme-cta-bg, #0044CC);
    color: var(--theme-cta-text, white) !important;
}

#pho_noNumberSubscriptionBtn.con_button_1_B:disabled,
.con_button_1_B[disabled] {
    border: 1px solid var(--theme-cta-ring, white) !important;
    background: var(--theme-cta-bg, #0044CC) !important;
}

.con_button_1.opcity_low {
    background: #ec2121;

}

.video_popup .modal-content .modal-title {
    background-color: transparent;
}

.video_popup .modal-content .btn-close {
    position: absolute;
    right: 15px;
    top: 15px;
    opacity: 1;
    background-repeat: no-repeat;
    background-size: contain;
    height: 15px;
    width: 15px;
    z-index: 1;
}

/****************change-section-4/1********************************************************************

/****new_popup***/

.img-display-none {
    display: none;
}

.img-display-block {
    display: block;
}

.popup_content, .popup_2_content {
    background-color: transparent;
    border-radius: 10px;
}

.popup_content_B {
    background-color: var(--theme-surface-alt, #e5e6e8);
    border-radius: 10px;
}

.dark_blue_bg {
    background-color: transparent;
    border-radius: 10px 10px 0px 0px;
}

.cnt_icon {
    position: relative;
}

.cnt_icon:before {
    content: '';
    position: absolute;
    background-image: url('../images/cnt_icon.png');
    width: 53px;
    height: 47px;
    background-repeat: no-repeat;
    left: 0;
    background-size: 100%;
    top: 0;
    transform: translate(-2px, -2px);
}

.font-22 {
    font-size: 23px;
}

.check_icon {
    z-index: 1;
}

.check_icon img {
    max-width: 70%;
}

.vd1_btn_openmd img {
    margin-top: -30px;
    max-width: 52%;
}

.grai_bg {
    background: var(--theme-bg, #212121);
}

.header .logo img {
    max-width: 45%;
}

.py-160 {
    padding-top: 90px;
    padding-bottom: 90px;
}

.opacity-67 {
    opacity: .87 !important;
}


.video_header ul li a {
    width: 100%;
    padding: 17px 12px;
    display: inline-block;
}

.video_header .offcanvas-body ul li {
    background-color: transparent;
    border-bottom: 1px solid var(--theme-border, #000);
}

.video_header .offcanvas-body ul li:hover a {
    color: var(--theme-surface-text, #fff) !important;
}

.video_header .offcanvas-body ul li:hover {
    background: var(--theme-surface-alt, #0c0d0e);
    border-bottom: 1px solid transparent;
}

.video_header .navbar-light .navbar-toggler {
    border: 1px solid var(--theme-text, #fff);
    padding: 2px 7px !important;
}

.video_header .navbar-toggler:focus {
    box-shadow: none;
}

.video_header .navbar-brand img {
    width: 100%;
}

.video_header .navbar-toggler {
    font-size: unset;
}


.form-select:focus {
    box-shadow: none;
}

.form-select {
    border: 2px solid var(--theme-border, #1f1f5e);
}

.video_header .form-select {
    border: 1px solid var(--theme-border, #1f1f5e);
    padding: 2px 2.25rem 2px 0.75rem;
}

/******************************************* New Style 21/04 ***************************************************/

.ofeer_video {
    position: relative;
}

.play_button img {
    position: absolute;
    width: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -85%);
    -webkit-transition: all .3s ease 0s;
}

.ofeer_video .modal-content .modal-title {
    background-color: transparent;
}

.my_loader {
    position: absolute;
    top: 38%;
    left: 45%;
    transform: translate(-50%, -45%);
    color: var(--theme-text, #ededed);
    font-size: 89px;
    height: 150px;
}

.ofeer_video .modal-content {
    background-color: transparent;
}

.ofeer_video {
    position: relative;
}

.ofeer_video .popoup_1 {
    position: absolute;
    width: 100%;
    left: 50%;
    top: 49%;
    transform: translate(-50%, -57%);
}

.ofeer_video .popup_2 {
    position: absolute;
    left: 50%;
    top: 47%;
    transform: translate(-50%, -57%);
    width: 100%;
}

.ofeer_video .video_popup3 {
    position: absolute;
    width: 100%;
    left: 50%;
    top: 47%;
    transform: translate(-50%, -57%);
}

.img-display-none {
    display: none;
}

.img-display-block {
    display: block;
}

.sr-only {
    display: contents;
}

.terms_condition {
    padding-top: 0px;
}

/*progressbar*/

.text {
    color: var(--theme-progress, #2F8D46);
    font-weight: normal
}

#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    color: var(--theme-progress-track, lightgrey)
}

#progressbar .active {
    color: var(--theme-progress, #2F8D46)
}

#progressbar li {
    list-style-type: none;
    font-size: 15px;
    width: 33.33%;
    float: left;
    position: relative;
    font-weight: 400
}

#progressbar #step1:before {
    content: "1"
}

#progressbar #step2:before {
    content: "2"
}

#progressbar #step3:before {
    content: "3"
}

#progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 20px;
    color: var(--theme-cta-text, #ffffff);
    background: var(--theme-progress-track, lightgray);
    border-radius: 50%;
    margin: 0 auto 10px auto;
    padding: 2px
}

#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: var(--theme-progress-track, lightgray);
    position: absolute;
    left: 0;
    top: 25px;
    z-index: -1
}

#progressbar li.active:before,
#progressbar li.active:after {
    background: var(--theme-progress, #2F8D46)
}

.progress {
    height: 20px
}

.progress-bar {
    background-color: var(--theme-progress, #2F8D46)
}

.color-fa0f0f {
    color: var(--theme-text, #fff);
    font-size: 20px;
    font-weight: bold;
}

.font-15 {
    line-height: 20px;
    font-size: 14px;
}

.text-under-input {
    font-size: 10px;
    padding: 0px;
    margin: 0px;
}

.terms_btn ul li a, .video_header ul li {
    transition: all .4s ease 0s;
    -webkit-transition: all .4s ease 0s;
    -moz-transition: all .4s ease 0s;
    -o-transition: all .4s ease 0s;
}

.ofeer_video .popup_1_5 {
    position: absolute;
    left: 50%;
    top: 47%;
    transform: translate(-50%, -57%);
    width: 100%;
}

.vd1_btn_openmd_img {
    border: 2px solid var(--theme-border, #262727);
}

.prefix__icon {
    background-color: var(--theme-cta-bg, #0044CC);
    height: 105%;
    line-height: 45px;
    padding: 0 10px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.enter_num_field_variantA {
    padding-left: 15px;
    width: 300px;
    border: 0;
    height: 45px;
    color: #220000;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    padding-bottom: 4px;
    border-radius: 0;
}

.mt-190 {
    margin-top: 190px
}

.logo-2{
    height: 40px;
}

/***********************************************************************************************************/
/***********************************************************************************************************/

/* for responsive */

@media (min-width: 576px) {
    .video_popup .modal-dialog {
        max-width: 400px;
        margin: 1.75rem auto;
    }
}

@media (min-width: 1680px) {
    .container {
        max-width: 1400px;
    }
}

@media only screen and (max-width: 1700px) {
    .video_section .ofeer_video {
        width: 80%;
    }

    .ofeer_video .popup_1 {
        top: 51%;
    }

    .my_loader {
        font-size: 70px;
    }
}

@media only screen and (max-width: 1610px) {

    .enter_num_field {
        height: 43px;
    }

    .cnt_icon:before {
        width: 51px;
    }

    .con_button_1 {
        height: 39px;
    }

    .lh-32 {
        line-height: 27px;
    }

    .font-15 {
        font-size: 14px;
    }

    .py-168 {
        padding-bottom: 15px;
    }

    .pt-35 {
        padding-bottom: 21px;
    }

    .pb-65 {
        padding-bottom: 0px;
    }

    .font-17 {
        font-size: 15px;
    }

    .vd1_btn_openmd img {
        margin-top: -70px;
        max-width: 50%;
    }

    .video_header .navbar-brand img {
        width: 91%;
    }

    .font-22 {
        font-size: 18px;
    }

    input.enter_num_field::-webkit-input-placeholder {
        color: #828282;
        font-family: 'Montserrat', sans-serif;
        font-size: 16px
    }

    input.enter_num_field::-moz-placeholder {
        color: #828282;
        font-family: 'Montserrat', sans-serif;
        font-size: 16px
    }

    input.enter_num_field:-ms-input-placeholder {
        color: #828282;
        font-family: 'Montserrat', sans-serif;
        font-size: 16px
    }

    input.enter_num_field:-moz-placeholder {
        color: #828282;
        font-family: 'Montserrat', sans-serif;
        font-size: 16px
    }
}

@media only screen and (max-width: 1490px) {

    .font-92 {
        font-size: 84px;
    }

    .check_icon img {
        max-width: 56%;
        margin-bottom: 4px;
    }

}

@media only screen and (max-width: 1399px) {
    .popoup_1 .font-18 {
        font-size: 12px;
    }

    .my_loader {
        font-size: 65px;
    }

    .enter_num_field {
        height: 38px;
        font-size: 16px !important;
        padding-bottom: 0px;
        padding-left: 52px;
    }

    .cnt_icon:before {
        width: 45px;
    }

    .check_icon {
        max-width: 23%;
    }

    .vd1_btn_openmd img {
        margin-top: -75px;
    }

    .font-26 {
        font-size: 19px;
    }

    .me-62 {
        margin-right: -40px !important;
    }

    .font-22 {
        font-size: 16px;
    }

    .pt-35 {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .lh-32 {
        line-height: 23px;
    }

    .py-168 {
        padding: 15px;
    }

    .font-15 {
        font-size: 12px;
    }

    .pb-65 {
        padding-bottom: 5px;
        padding-top: 16px;
    }

    .font-17 {
        font-size: 14px;
    }

    .video_header .navbar-brand img {
        width: 73%;
    }

    .video_header .navbar-light .navbar-toggler-icon {
        background-size: 14px;
    }

    .video_header .navbar-light .navbar-toggler {
        padding: 0px 2px !important;
    }

    .header .logo img {
        max-width: 79%;
    }

    .font-92 {
        font-size: 71px;
    }

    .font-23 {
        font-size: 20px;
    }

    .font-27 {
        font-size: 21px;
    }

    .font-30 {
        font-size: 22px;
    }

    .pt-174 {
        padding-top: 40px;
    }

    .pb-60 {
        padding-bottom: 20px;
    }

    .mt-75 {
        margin-top: 60px;
    }

    .icon_set .list_icon {
        max-width: 68%;
    }

    .con_button_1 {
        height: 28px;
        line-height: 28px;
        font-size: 11px;
    }

    .lh12 {
        font-size: 8px;
    }

    .banner_img2 img {
        width: 100%;
    }

    .img_sec img {
        max-width: 85%;
    }
}

@media only screen and (max-width: 1199px) {
    .lh-32 {
        line-height: 32px;
    }

    .font-15 {
        font-size: 15px;
    }

    .font-25 {
        font-size: 18px;
    }

    .font-23 {
        font-size: 23px;
    }

    .font-27 {
        font-size: 27px;
    }

    .icon_set .list_icon {
        max-width: 70%;
    }

    .pb-60 {
        padding-bottom: 60px;
    }


    .pt-174 {
        padding-top: 100px;
    }

    .font-92 {
        font-size: 57px;
    }

    .mt-8 {
        padding-bottom: 94px;
        margin-top: 10px;
    }

    .ps-130 {
        padding-left: 78px;
    }
}

@media only screen and (max-width: 1024px) {
    .font-30 {
        font-size: 22px;
    }

    .video_section .ofeer_video {
        width: 100%;
    }

    .pb-65 {
        padding-bottom: 60px;
    }

}

@media only screen and (max-width: 991px) {
    .font-92 {
        font-size: 62px;
    }

    .icon_set li {
        max-width: 18%;
    }

    .ps-130 {
        padding-left: 50px;
    }

    .mt-8 {
        margin-top: 8%;
    }

    .font-18 {
        font-size: 15px;
    }

    .img-display-none {
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
    }

    .img-display-block {
        display: none;
    }

    .ofeer_video {
        height: 450px;
    }

    .video_section {
        overflow-x: hidden;
        clear: both;
    }

    .my_loader {
        font-size: 40px;
        top: 43%;
        left: 42%;
    }
}

@media only screen and (max-width: 900px) {
    .ofeer_video {
        background-color: var(--theme-surface-alt, #58585a);
    }

    .vd1_btn_openmd img {
        max-width: 100%;
    }

    .vd1_btn_openmd img {
        margin-top: -15px;
    }

    .font-22 {
        font-size: 17px;
    }

    .enter_num_field {
        height: 37px;
    }

    .cnt_icon::before {
        width: 44px;
    }

    .enter_num_field {
        padding-left: 50px;
    }

    .me-62 {
        margin-right: -68px !important;
    }

    .con_button_1 {
        height: 37px;
        font-size: 14px;
    }

    .lh12 {
        font-size: 12px;
        line-height: 17px;
    }

    .pt-35 {
        padding-top: 20px;
        padding-bottom: 20px;
    }


}

@media only screen and (max-width: 768px) {
    .play_button img {
        top: 55%;
    }

    #progressbar li {
        font-size: 10px;
    }

    ol, ul {
        padding-left: 0rem;
    }

    .py-160 {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .ps-130 {
        padding-left: 0px;
    }

    .pt-400 {
        padding-top: 250px;
    }

    .font-92 {
        font-size: 45px;
    }

    .font-30 {
        font-size: 20px;
    }

    .header .logo img {
        max-width: 21%;
        margin-bottom: 35px;
    }

    .font-17 {
        font-size: 13px;
    }

    .pt-174 {
        padding-top: 70px;
    }

    .icon_set li {
        max-width: 18%;
    }

    .icon_set .list_icon {
        max-width: 68%;
    }

    .font-27 {
        font-size: 21px;
    }

    .pb-60 {
        padding-bottom: 35px;
    }

    .font-23 {
        font-size: 20px;
    }

    .font-25 {
        font-size: 18px;
    }

    .px-50 {
        padding-left: 60px;
        padding-right: 60px;
    }

    .footer {
        padding-bottom: 24px !important;
    }

    .ps-130 {
        padding-bottom: 60px;
        padding-top: 40px;
    }

    .py-168 {
        padding-top: 0px;
        padding-bottom: 10px;
    }

    .terms_condition {
        margin-top: 0px;
    }

    .terms_condition_A {
        margin-top: 295px;
    }
}

@media (max-width: 330px) {

    .pt-100 {
        padding-top: 149px;
    }

    .px-50 {
        padding-left: 35px;
        padding-right: 35px;
    }
}