* {
    user-select: none;
}
/*img {
    background-color: #f9fafb;
}*/
.main--main-secoundry {
    /*overflow-x: hidden;*/
    padding-top: 80px;
    padding-bottom: 10px;
}

    .main--main-secoundry.main--main-thirdary {
        padding-top: 449px;
    }

.main-black {
    background-color: #000;
}

.mindrocket-deaf {
    display: none !important;
}

.sp-main-ribbon {
    position: fixed;
    top: 50px;
    width: 100%;
    z-index: 900;
}

.margin-top-15px {
    margin-top: 15px !important;
}

.margin-bottom-30px {
    margin-bottom: 30px !important;
}

.carousel-inner .item {
    padding: 0;
}

.search-form__input {
    border-radius: 0.3125rem;
    box-shadow: 0 0rem 0.875rem 0 rgba(0, 0, 0, 0.1);
}

.social-icon {
    overflow: hidden;
}

    .social-icon a {
        width: 100%;
        height: 100%;
        display: inline-block;
        border-radius: 50%;
    }

.dimelo_chat_item_container,
.dimelo-chat-bubble {
    position: fixed;
    right: 0;
    bottom: 0;
}

.footer-store-container {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}
/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    /*-webkit-text-fill-color: green;*/
}

.search-form__input:-webkit-autofill,
.search-form__input:-webkit-autofill:hover,
.search-form__input:-webkit-autofill:focus {
    background-color: transparent !important;
}

input[type="radio"], input[type="checkbox"] {
    width: auto;
    margin-right: 8px;
}

.menu-banner .menu-banner--btn_container .btn {
    color: white;
    padding: 10px 50px 10px 50px;
    font-weight: 700;
    vertical-align: middle;
    letter-spacing: 1px;
}

#headerMenu hr.separator {
    border: none;
    border-top: 0.0625rem solid #CBCBCB;
}

#headerMenu .collapse-container .content hr.separator:last-child,
.myservices-repeater .separator:last-child {
    display: none;
}

#preloader {
    z-index: 99;
}

#preloader_ZainInternet {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 99;
}

#loader_ZainInternet {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #9370DB;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

    #loader_ZainInternet:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #BA55D3;
        -webkit-animation: spin 3s linear infinite;
        animation: spin 3s linear infinite;
    }

    #loader_ZainInternet:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #54B8E9;
        -webkit-animation: spin 1.5s linear infinite;
        animation: spin 1.5s linear infinite;
    }

#preloader-trigger {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 99;
}

#loader-trigger {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #9370DB;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

    #loader-trigger:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #BA55D3;
        -webkit-animation: spin 3s linear infinite;
        animation: spin 3s linear infinite;
    }

    #loader-trigger:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #54B8E9;
        -webkit-animation: spin 1.5s linear infinite;
        animation: spin 1.5s linear infinite;
    }

.switch--content__item {
    display: block !important;
}

.no-resize {
    resize: none;
}

.custom-nav > li > a:hover {
    cursor: pointer;
}

.slick-dots li button:before {
    font-size: 24px;
}

input::placeholder {
    font-size: 14px !important;
}

.has-error input::placeholder {
    color: rgba(255, 0, 0, 0.4);
}

.has-error input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: rgba(255, 0, 0, 0.4);
}

.has-error input::-ms-input-placeholder { /* Microsoft Edge */
    color: rgba(255, 0, 0, 0.4);
}

.login .mz-form {
    width: 70%;
    margin: 0px auto;
}

    .login .mz-form .form-inputs-container {
        text-align: left;
    }

    .login .mz-form .form-input-wrapper {
        width: 100%;
    }

        .login .mz-form .form-input-wrapper .form-input-lable {
            cursor: pointer;
            color: #898EA2;
            font-size: 16px;
            font-weight: bold;
            line-height: 20px;
            margin-bottom: 1.25rem;
        }

#signup .register-otp-message {
    font-size: 16px;
    font-weight: normal;
    color: #323232;
    margin: 0;
    padding: 0;
    margin-top: 16px;
}

#signup .register-form-label {
    font-size: 16px;
    font-weight: bold;
    color: #898ea2;
    margin: 0;
    padding: 0;
    margin-bottom: 8px;
}

    #signup .register-form-label.mt-16 {
        margin-top: 16px;
    }

#signup .card {
    margin: 0;
    padding: 0;
    margin-top: 16px;
    display: flex;
    flex-wrap: nowrap;
}

    #signup .card .column-50 {
        width: 50%;
    }

        #signup .card .column-50:last-child {
            text-align: right;
        }

        #signup .card .column-50 a {
            font-size: 16px;
            font-weight: bold;
            color: #0070c9 !important;
            text-decoration: none !important;
        }

/*.mz-form input, .mz-form textarea {
    border-radius: 0.3125rem;
    background-color: #FFFFFF;
    width: 100%;
    padding: 0.9375rem 1.25rem;
    background-color: #FFFFFF;
    border: 0;
    box-shadow: 0 0rem 0.875rem 0 rgba(0, 0, 0, 0.1);
    outline: none;
}

    .mz-form input[type="password"], .mz-form textarea[type="password"] {
        font-size: 1.25rem;
        color: #898EA2;
    }

.mz-form .form-inputs-container .btn {
    outline: none;
    border-radius: 5px;
    width: 100%;
    padding: 0.9375rem 1.25rem;
    margin-top: 30px;
}*/

.ms-webpartzone-cell {
    margin: 0 !important;
}

.ms-webpart-chrome-title {
    display: none;
}

.premium-content__type {
    cursor: pointer;
    transition: all 0.3s;
}

.premium-content__type--icon {
    background-color: transparent;
}

    .premium-content__type--icon img {
        width: 30px;
    }

.premium-content__item {
    width: 100%;
}

.premium-content__item--image-container img {
    position: relative;
    top: 0;
    left: 0;
    transform: translate(0,0);
    width: 100%;
}

.main-secondary-thirdary-rollup-image-container img {
    position: fixed;
    z-index: -5;
    top: 106px;
    color: white;
    width: 100%;
    transition: top 0.5s ease-in-out;
}

.main-secondary-thirdary-rollup-image-container-business img {
    width: 100%;
    transition: top 0.5s ease-in-out;
}

.btn btn-primary prepaid-banner--footer_button {
    padding: 0;
}

    .btn btn-primary prepaid-banner--footer_button a {
        padding: 10px;
        text-decoration: none;
        color: white;
    }

.ms-WPBorder {
    border: none;
}

.subscriptions .primary-card--actions a.btn-primary-card-link {
    background-color: #54B8E9;
    border: 0;
    font-size: 1rem;
    color: white;
    text-decoration: none;
}

.main-secondary-rollup-image-container img {
    width: 100%;
}

.PostpaidGoPackagesCategories .step img {
    fill: #54B8E9;
    height: 70px;
    width: 70px;
}

.package-card .services.step__active {
    opacity: 1;
    overflow: visible;
}

.services .services--icon-container img {
    width: 30px;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    position: absolute;
}

.margin-right-10 {
    margin-right: 10px;
}

.modal-container.services, .modal-container.terms {
    position: fixed;
}

    .modal-container.services .chevron-icon-primary, .modal-container.terms .chevron-icon-primary {
        height: 15px;
    }

.smartcameras-carditems-container .separator:last-child {
    display: none;
}

.darak-package .custom-radio, .darak-package .custom-checkbox {
    display: block;
    position: relative;
    margin: 0;
    padding: 20px 20px 20px 55px;
}


.darak-package .checkmark {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
}

.darak-package .sub-title {
    position: absolute;
    top: 0px;
    font-size: 14px;
    left: 30px;
    color: #777;
}

.darak-package .input-value span {
    display: inline-block;
    text-align: left;
}

    .darak-package .input-value span hr {
        margin-top: 2px;
        margin-bottom: 15px;
    }

.darak-package .total-price {
    transition: transform 2s ease;
    display: inline-block;
}

.shake-scale {
    animation-name: shake-scale;
    animation-duration: 2s;
    color: #08cff0;
}


@keyframes shake-scale {
    from, to {
        transform: scale3d(1,1,1);
        opacity: 1;
    }

    10%, 30%, 50%, 70%, 90% {
        transform: scale3d(1.05,1.05,1);
        opacity: 0.9;
    }

    20%, 40%, 60%, 80% {
        transform: scale3d(1.2,1.2,1);
        opacity: 1;
    }
}

.sidebar__content--item---wrapper img {
    width: 20px;
    max-height: 20px;
}

.login-user-links {
    position: relative;
    display: block;
    padding: 10px 15px;
    color: #FFFFFF;
    font-size: 18px;
}

.text-float-right {
    text-align: right;
}

.text-float-left {
    text-align: left;
}

.rewards-inactive-bg {
    background: #c6c7c8 !important;
}

form select {
    border-radius: 0.3125rem;
    background-color: #FFFFFF;
    width: 100%;
    padding: 5px 20px;
    border: 0;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    outline: none;
    color: #333;
    font-size: 16px;
}

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1;
}

.buttons-excel, .buttons-html5, .buttons-print {
    color: #333;
    padding: 10px 20px;
}

.w-auto {
    width: auto;
}

.modal-body-flow-y-65vh {
    max-height: 65vh !important;
    overflow: auto !important;
    display: block !important;
}

.locator-map-container .gm-style-mtc {
    display: none !important;
}

.google-map-option-container {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 5px;
}

    .google-map-option-container select {
        width: auto;
        display: inline-block;
        background-color: #FFFFFF;
        border: 0;
        box-shadow: none;
        outline: none;
        color: #333;
        font-size: 14px;
        line-height: 14px;
        height: 45px;
        padding: 10px 10px;
        border-radius: 3px;
    }

.gm-filter-area {
    display: none !important;
}

.gm-filter-category.active {
    z-index: 1;
    background-color: #54B8E9;
    color: #FFFFFF;
    transform: translate(0);
}


/*.dimelo-chat-container-opened .dimelo-chat-header, .dimelo-chat-has-notifications .dimelo-chat-header {
    background-color: #54b8e9 !important;
    border-color: #54b8e9 !important;
}

.dimelo-chat-message-body {
    color: #333;
    background-color: #bdf8fb5c !important;
}*/

.zain-group-links li {
    height: 40px;
}


.background-image-mobile img {
    width: 100%;
}

.premium-content__item--info {
    width: 100%;
}

.prepaid-services-svg {
    width: auto;
}

.service-card-header .chevron-icon-primary, .service-card-header .icon-chevron-right.chevron-icon-primary {
    height: auto;
}

.header--item.dropdown {
    position: relative;
    display: block;
    padding: 10px 15px;
    color: #FFFFFF;
    font-size: 18px;
    cursor: pointer;
}

.sidebar-container-sticky {
    /*position: sticky;
    top: 70px;*/
}

#sidebar.sidebar {
    margin-bottom: 24px;
}

#sidebar .sidebar__info--details .open-content .icon-chevron-down.icon {
    display: inline;
    width: auto;
    height: auto;
    line-height: normal;
    vertical-align: baseline;
    background-image: none;
    background-position: 0% 0%;
    background-repeat: repeat;
}

.form-check-input input {
    width: auto !important;
    box-shadow: none;
}

#devices_button {
    width: 240px;
    height: 45px;
}

.four-g-card ul {
    max-height: 300px;
    height: 300px;
    overflow-y: auto;
}

.mx-10 {
    margin-left: 10px;
    margin-right: 10px;
}

.switch--item.step__active {
    z-index: 1;
    background-color: #54B8E9;
    color: #FFFFFF;
    transform: translate(0);
}

.permisions-container-open-permision .permisions-actions {
    z-index: 1;
}

.fiber-slider .product-feature {
    max-width: 260px;
    min-width: 260px;
}

.service-card-content.postpaidgo {
    max-height: unset !important;
}
/*.ms-srch-hover-subTitle, .ms-srch-hover-text, .ms-srch-hover-action:nth-child(2), .ms-srch-hover-body*/
.ms-srch-hover-subTitle, .ms-srch-hover-text, .ms-srch-hover-action:nth-child(2) {
    display: none !important;
}

.slick-slider-main > .slick-list {
    width: 100%;
}

/*.slick-slider-main > .slick-dots {
    bottom: 35px;
}*/

.slick-slider-main > .slick-dots li.slick-active button:before {
    color: #27aef1;
}

.slick-slider-supper {
    width: 22px;
    height: 3px;
    display: inline-block;
    border-radius: 100px;
    margin: 0px 4px;
    background-color: #f7f7fa;
}

.slick-slider-main img {
    width: 100%;
}

.slick-slider-main .slick-track {
    margin-left: 0;
    margin-right: 0;
}

.slick-slide {
    outline: none !important;
}

.device-action-container {
    text-align: right;
}

.deal-of-the-week-container .text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.custom-table__xs {
    border-spacing: 5px;
}

    .custom-table__xs td {
        padding: 5px;
    }

.pagination.z-index-auto > li > a:hover, .pagination.z-index-auto > li > a:focus, .pagination.z-index-auto > li > span:hover, .pagination.z-index-auto > li > span:focus {
    z-index: auto;
}

.aligntop {
    vertical-align: top;
}

.chat-container {
    bottom: -100px;
}

    .chat-container.active {
        bottom: 50px;
    }

.twitter-blue {
    background-color: #1da1f2;
}


.survey.survey-opinion {
    position: fixed;
    left: 30px;
    width: 100px;
    height: 100px;
    z-index: 900;
    bottom: -100px;
    background-color: rgba(255, 255, 255, 0.90);
    border-radius: 10px;
    box-shadow: 0px 0px 5px #6db7e5;
    transition: all 0.5s ease;
}

    .survey.survey-opinion.active {
        bottom: 50px;
    }

    .survey.survey-opinion:hover {
        background-color: #fff;
        box-shadow: 0px 0px 10px 1px #6db7e5;
    }


    .survey.survey-opinion a, .survey.survey-opinion img {
        width: 100%;
        display: block;
    }

.survey-opinion-image-full {
    display: block !important;
}

.survey-opinion-image-mobile {
    display: none !important;
}

.speed-test {
    width: 100%;
    min-height: 300px;
    background-color: black;
    padding-top: 50px;
}

.header--item span {
    font-size: 16px;
}

.header--item .dropdown-menu > li > a {
    padding: 10px 10px;
}

.subscriptions .primary-card--actions {
    min-height: 125px;
}

.quick-pay--form-container--input {
    height: 45px;
}


/*Business*/

.block-table {
    display: table;
}

.block-table-cell {
    display: table-cell;
}

.business-main-menu-container {
    display: grid;
    gap: 40px;
    flex-wrap: wrap;
    justify-content: start;
    justify-content: flex-start;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}
/*.header--sub_business {
    background-color: rgba(0, 0, 0, 0.65) !important;
}*/
.header--sub_business .mega-menu {
    background-color: black;
}

.header--sub_business .mega-menu--categories-section__category-main {
    font-size: 16px;
}

.mega-menu--categories-section__category-sub {
    line-height: 1;
}

.header--sub_business .mega-menu--categories-section__category-main, .header--sub_business .mega-menu--categories-section__category-sub {
    color: #FFFFFF !important;
}

.header--sub_business .open-mega-menu {
    height: 500px;
}

.mega-menu--product-section__product-image {
    max-width: 100%;
}

.menu-banner .menu-banner--btn_container .btn.pink-5g {
    background-color: #D81D7F;
    border-color: #D81D7F;
}

.header--sub_business.header--sub ul li {
    height: 28px;
}

.header--sub_business .custom-navbar--logo {
    padding: 0;
}

    .header--sub_business .custom-navbar--logo img {
        height: 50px;
    }


.landing-preview-card {
    background-color: white;
    border-radius: 10px;
    overflow: hidden;
}

.preview-card-md, .preview-card-lg, .business-lvl1-card {
    height: 450px;
    overflow: hidden;
}

    .preview-card-md .a-white, .preview-card-lg .a-white, .business-lvl1-card .a-white {
        opacity: 0;
        transition: all 0.5s ease;
    }

    .preview-card-md:hover .landing-preview-img, .preview-card-lg:hover .landing-preview-img, .business-lvl1-card:hover .business-lvl1-img {
        transform: scale(1.1);
        -ms-filter: brightness(0.3);
        filter: brightness(0.3);
    }

    .preview-card-md:hover .a-white, .preview-card-lg:hover .a-white, .business-lvl1-card:hover .a-white {
        opacity: 1;
    }

.landing-preview-card .preview-card-md:nth-child(2), .landing-preview-card .preview-card-lg:nth-child(2) {
    padding: 35px;
}


.landing-preview-img, .business-lvl1-img {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    transition: all 0.5s ease;
}

.landing-preview-desc {
    color: white;
    z-index: 1;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    text-align: center;
}

.business-preview-icon {
    margin-right: 10px;
    width: 35px;
}

a.business-preview-arrow-link img {
    width: 40px;
    transform: translateY(-10px);
}

.a-black {
    background-color: black;
    border-color: black;
    color: white;
    font-weight: normal;
}

    .a-black:hover, .a-black:focus, .a-black:active, .a-black:visited {
        background-color: black;
        border-color: black;
        color: white;
        font-weight: normal;
        transform: translateY(1px);
    }

.a-white {
    background-color: transparent;
    border-color: white;
    color: white;
    font-weight: normal;
}

    .a-white:hover, .a-white:focus, .a-white:active, .a-white:visited {
        background-color: transparent;
        border-color: white;
        color: white;
        font-weight: normal;
        transform: translateY(1px);
    }

.m-h-40 {
    min-height: 40%;
}

.business-preview-divider {
    position: relative;
    height: 20%;
}

    .business-preview-divider::after {
        content: '';
        width: 100%;
        top: 50%;
        left: 50%;
        height: 1px;
        background-color: #ccc;
        border-radius: 1px;
        position: absolute;
        transform: translate(-50%,-50%);
    }



.business-preview-desc {
    overflow: hidden;
    line-height: 20px;
    height: 60px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.business-lvl1-rollup {
    position: relative;
    height: 400px;
}

    .business-lvl1-rollup img {
        width: 100%;
        height: 100%;
    }

.business-lvl1-header {
    position: absolute;
    top: 50%;
    left: 10%;
    transform: translate(0%,-50%);
}

    .business-lvl1-header p {
        width: 40%;
    }


/*.business-lvl1-desc p,
.business-lvl1-desc > div {
    width: 80%;
    left: 10%;
    position: relative;
}*/
.business-lvl1-desc p {
    width: 80%;
    left: 10%;
    position: relative;
}

.business-lvl1-desc .business-section, .business-lvl1-desc p {
    position: relative;
    color: #737373;
}

.business-lvl2-desc p {
    position: relative;
    color: #737373;
}

.business-section h1 {
    color: black;
    margin-top: 0 !important;
    margin-bottom: 30px;
}

.business-lvl3-desc {
    padding-top: 20px;
    padding-bottom: 30px;
}



.business-section.business-lvl3-details .tab-content {
    height: auto !important;
    max-height: unset !important;
}



.business-section.business-lvl3-details p {
    left: unset;
    right: unset;
    position: relative;
    width: 90%;
}

.business-section.business-lvl3-details img {
    width: 100%;
    max-width: 100%;
}

.business-section iframe {
    max-width: 100vw;
}

.business-lvl2-breadcrumb {
    position: relative;
    color: #555;
    font-size: 18px;
    padding-bottom: 30px;
}

    .business-lvl2-breadcrumb a, .business-lvl2-breadcrumb a:hover, .business-lvl2-breadcrumb a:visited, .business-lvl2-breadcrumb a:focus, .business-lvl2-breadcrumb a:active {
        color: #333;
        text-decoration: none;
    }

        .business-lvl2-breadcrumb a:last-child {
            text-decoration: underline;
        }

    .business-lvl2-breadcrumb .glyphicon {
        color: #CFCFCF;
        font-size: 14px;
        font-weight: bold;
    }

.business-lvl1-card .landing-preview-desc {
    color: white;
    z-index: 1;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    right: unset;
    text-align: left;
}

    .business-lvl1-card .landing-preview-desc h2, .business-lvl1-card .landing-preview-desc p {
        width: 60%;
    }

    .business-lvl1-card .landing-preview-desc h2 {
        display: inline-block;
    }

.business-lvl1-card.card-black h2, .business-lvl1-card.card-black p {
    color: black;
}

.business-lvl1-card.card-black .btn-primary-card-link.a-white {
    color: white;
    background-color: black;
    border-color: black;
}

.business-lvl1-card.card-black .btn-primary-card-link.a-black:hover, .business-lvl1-card.card-black .btn-primary-card-link.a-black:focus, .business-lvl1-card.card-black .btn-primary-card-link.a-black:active, .business-lvl1-card.card-black .btn-primary-card-link.a-black:visited {
    background-color: black;
    border-color: black;
    color: white;
    font-weight: normal;
    transform: translateY(1px);
}

.business-lvl1-card.card-white .h2, .business-lvl1-card.card-white p {
    color: white;
}

.business-lvl1-card.card-white .btn-primary-card-link.a-white {
    color: black;
    background-color: white;
    border-color: white;
}

.business-lvl1-header.header-white h1, .business-lvl1-header.header-white p {
    color: white;
}

.business-lvl1-header.header-black h1, .business-lvl1-header.header-black p {
    color: black;
}

.business-lvl1-card.card-white p, .business-lvl1-card.card-black p {
    max-height: 200px;
    overflow-y: auto;
}

.list-h-auto li {
    height: auto !important;
}

.business-lvl2-slick-container {
    background-color: #F7F7F7;
    border: 1px solid #E2E2E2;
}

.business-lvl2-slick {
    padding: 20px 50px;
}

    .business-lvl2-slick .slick-track {
        padding-bottom: 14px;
    }

    .business-lvl2-slick a {
        font-size: 18px !important;
        color: black !important;
        border: none !important;
        background-color: transparent !important;
        outline: none !important;
        text-decoration: none !important;
        padding: 0 20px;
    }

    .business-lvl2-slick .active a {
        font-weight: bold !important;
    }

.business-slick-arrows-left {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translate(0,-50%);
    width: 25px;
}

.business-slick-arrows-right {
    position: absolute;
    left: unset;
    top: 50%;
    transform: translate(0,-50%);
    right: 15px;
    width: 25px;
}

    .business-slick-arrows-left img, .business-slick-arrows-right img {
        width: 25px;
        cursor: pointer;
    }

.business-follow-up .custom-form--input {
    height: 50px;
}

.business-follow-up .request-checkbox-container .label-gap {
    height: 25px;
}

.business-follow-up .request-checkbox-container .checkbox {
    width: 100%;
    border: none;
    color: black;
    box-shadow: none;
    position: relative;
}

    .business-follow-up .request-checkbox-container .checkbox label {
        width: 100%;
        display: block;
        font-size: 1.125rem;
        font-weight: 700;
        color: #333333;
        display: block;
        margin-bottom: 0.625rem;
        border: none;
    }

    .business-follow-up .request-checkbox-container .checkbox input {
        width: 16px;
    }

.business-landing-preview-card {
    display: flex;
    background: #FFFFFF;
    box-shadow: 0px 0px 24px 2px rgba(0, 0, 0, 0.08);
    border-radius: 10px;
    margin-top: 48px;
    height: 550px;
    max-height: 550px;
}

    .business-landing-preview-card:nth-child(even) {
        flex-direction: row-reverse;
    }

    .business-landing-preview-card .business-landing-preview-card-img {
        display: block;
        text-decoration: none;
        border-radius: 8px 0px 0px 8px;
        overflow: hidden;
        width: 50%;
        height: 100%;
    }

        .business-landing-preview-card .business-landing-preview-card-img img {
            height: 100%;
            width: 100%;
        }


    .business-landing-preview-card:nth-child(even) .business-landing-preview-card-img {
        border-radius: 0px 8px 8px 0px;
    }


    .business-landing-preview-card .business-landing-preview-card-previews-container {
        border-radius: 0px 8px 8px 0px;
        background: #FFFFFF;
        display: flex;
        flex-direction: column;
        width: 50%;
    }

    .business-landing-preview-card:nth-child(even) .business-landing-preview-card-previews-container {
        border-radius: 8px 0px 0px 8px;
        background: #FFFFFF;
    }

    .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview {
        padding: 40px 28px;
        display: block;
        text-decoration: none;
        color: black;
    }

        .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview:hover {
            text-decoration: none;
        }



        .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview:nth-child(even) {
            background: #F8FBFF;
        }

        .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview .business-landing-preview-card-preview-title img {
            display: none;
        }

        .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview .business-landing-preview-card-preview-title {
            font-weight: bold;
            font-size: 20px;
            line-height: 27px;
            color: black;
            margin: 0px;
            margin-bottom: 8px;
        }

.business-landing-preview-card-flex-container {
    display: flex;
    gap: 50px;
    justify-content: space-between;
}

    .business-landing-preview-card-flex-container .business-landing-preview-card-preview-description {
        display: block;
        font-size: 16px;
        line-height: 20px;
        overflow: hidden;
        height: 60px;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }

    .business-landing-preview-card-flex-container .business-landing-preview-card-preview-title-more-info {
        display: block;
        align-self: center;
        text-decoration: none;
    }

        .business-landing-preview-card-flex-container .business-landing-preview-card-preview-title-more-info img {
            width: 40px;
            height: 40px;
        }

.business-landing-preview-card.big {
    flex-direction: column;
    max-height: 550px;
    height: 550px;
}

    .business-landing-preview-card.big .business-landing-preview-card-img {
        display: block;
        text-decoration: none;
        border-radius: 8px 8px 0px 0px;
        width: 100%;
        height: 65%;
    }

    .business-landing-preview-card.big .business-landing-preview-card-previews-container {
        border-radius: 0px 0px 8px 8px;
        background: #FFFFFF;
        display: flex;
        flex-direction: row;
        width: 100%;
        overflow: hidden;
    }

        .business-landing-preview-card.big .business-landing-preview-card-previews-container .business-landing-preview-card-preview {
            padding: 40px 28px;
            background: white;
            width: 50%;
        }

            .business-landing-preview-card.big .business-landing-preview-card-previews-container .business-landing-preview-card-preview:nth-child(1) {
                border-right: 1px solid lightgrey;
            }



            .business-landing-preview-card.big .business-landing-preview-card-previews-container .business-landing-preview-card-preview .business-landing-preview-card-preview-title img {
                display: inline-block;
                margin-right: 5px;
                width: 30px;
                height: 30px;
            }

            .business-landing-preview-card.big .business-landing-preview-card-previews-container .business-landing-preview-card-preview .business-landing-preview-card-preview-title {
                font-weight: bold;
                font-size: 20px;
                line-height: 27px;
                color: black;
                margin: 0px;
                margin-bottom: 8px;
            }

.business-category-landing-title-container {
    margin-top: 50px;
    margin-bottom: 30px;
}

    .business-category-landing-title-container h3 {
        font-weight: bold;
        font-size: 34px;
        line-height: 46px;
    }

.business-category-categories-container {
    display: flex;
    margin: 0 auto;
    gap: 27px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

    .business-category-categories-container .business-subcategory-card {
        position: relative;
        width: 270px;
        height: 270px;
        overflow: hidden;
        border-radius: 9px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .business-category-categories-container .business-subcategory-card .business-subcategory-card-overlay {
            top: 50%;
            height: 50%;
            width: 100%;
            position: absolute;
            background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
            border-bottom-left-radius: 7px;
            border-bottom-right-radius: 7px;
            display: none;
        }

        .business-category-categories-container .business-subcategory-card .business-subcategory-thumbnail-image {
            border: 1px solid white;
            border-radius: 7px;
            max-width: 100%;
            object-fit: cover;
        }

        .business-category-categories-container .business-subcategory-card .buisness-subcategory-card-title {
            position: absolute;
            top: 70%;
            text-align: center;
            width: 100%;
            font-size: 21px;
            font-weight: bold;
            color: white;
            padding-left: 10px;
            padding-right: 10px;
            display: none;
        }



.w-full-important {
    width: 100% !important;
}

.has-error select {
    border: 1px solid rgba(255, 0, 0, 0.4);
}


.input-optout {
    width: 180px;
    border-radius: 10px;
    padding: 0 10px;
    height: 34px;
    display: inline-block;
}

.btn-optout {
    width: 150px;
    padding: 5px;
    margin-left: 20px;
    margin-right: 20px;
    display: inline-block;
    background-color: #37ace5;
    border-color: #20a2e2;
    color: white;
}

.outline-none {
    outline: none !important;
}

.header--mobile__logo-box .logo {
    height: 40px;
}

p.pb-sm {
    padding: 0 !important;
    margin: 0 !important;
}

.business-mobile-caret {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: 10px;
    padding: 0 5px;
    text-decoration: none !important;
}

    .business-mobile-caret .icon-caret-down {
        display: inline-block;
        transform: rotate(-90deg);
    }


.login__background {
    background-position: 0 0;
    animation: background-zoom 60s linear infinite;
    animation-delay: 2s;
}

.primary-card--header.active {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.bb-card.active {
    background-color: #dff0d8;
}

    .bb-card.active .four-g-card__price {
        color: #5cb85c;
    }

.card-select {
    cursor: pointer;
}

.mbb-fiber-lead .subscriptions {
    width: 300px;
}

.mbb-fiber-lead .primary-card--header {
    height: 100px !important;
}


.mbb-fiber-lead .subscriptions .primary-card--header h3 {
    font-size: 1.3rem;
}

.mbb-fiber-lead .primary-card--content {
    height: 250px;
}

.mbb-fiber-lead .subscriptions .primary-card--content li {
    font-size: .8rem;
    padding: 10px;
}

.mbb-fiber-lead.center .slick-slide {
    text-align: center;
}

.mbb-fiber-lead.center .card-select {
    width: auto !important;
    margin: 0 auto;
    text-align: left;
}

.mbb-google-map-container {
    height: 100vh;
    max-height: 500px;
    border-radius: 10px;
    box-shadow: 0 0 15px 2px #333;
    overflow: hidden;
}

#mbb-google-map {
    height: 100%;
    width: 100%;
}

.mbb-map-control-location {
    display: block;
    width: 50px;
    padding: 10px 10px;
    text-align: center;
    border-radius: 3px;
    position: absolute;
    z-index: 1;
    top: 60px;
    left: 25px;
    font-size: 20px;
    box-shadow: 0 0 5px 1px #54b8e9;
    background-color: white;
    color: #54b8e9;
    transition: all 0.3s ease;
}

    .mbb-map-control-location:hover {
        box-shadow: 0 0 5px 1px #42b7f0;
        color: #FFF;
        background-color: #42b7f0;
        border-color: #42b7f0;
    }


.mbb-map-control-address {
    margin: 0 auto;
    box-shadow: 0 0 10px #ccc;
}







.business-parallax-main {
    background-image: url('https://www.jo.zain.com/english/Business/PublishingImages/BunkerPage/section1bg.jpg');
    background-position: top center;
    background-position-y: 50px;
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    height: 120%;
    height: 120vh;
    margin-top: 50px;
}

.business-parallax-bottom {
    background-image: url('https://www.jo.zain.com/english/Business/PublishingImages/BunkerPage/form_image_58.png');
    background-position: top center;
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    height: 135%;
    height: 135vh;
    margin-top: 50px;
}

.business-form-container {
    padding: 60px;
    text-align: center;
    margin-top: 50px;
}

    .business-form-container.business-bunker-form-right {
        position: absolute;
        right: 60px;
    }

.business-bunker-form {
    background-color: #e2e5e6;
    border-radius: 50px;
    min-height: 500px;
    max-width: 350px;
    box-shadow: 0 0 15px black, 0 0 20px white;
    padding: 20px;
    margin: 0 auto;
}



.business-form-contactus-img {
    width: 100%;
    max-width: 120px;
}

.btn-business-request {
    background-color: #4d4d4d;
    border: none;
    outline: none;
    border-radius: 30px;
    color: white;
    font-size: 20px;
    transition: all 0.3s;
}

    .btn-business-request:hover, .btn-business-request:focus, .btn-business-request:active {
        background-color: #3e3d3d;
        border: none;
        outline: none;
        color: white;
    }

.div-checkbox-container {
    color: #333;
    font-weight: normal;
    position: relative;
    padding-left: 15px;
}

    .div-checkbox-container input {
        display: inline-block;
        width: 15px !important;
        box-shadow: none !important;
        margin-right: 15px;
        position: absolute;
        left: 0;
    }

    .div-checkbox-container input {
        padding: 0 10px;
    }

.business-bunker-bg {
    background-color: #3e3e3f;
    background-image: linear-gradient(90deg,#3e3e3f,#010101);
    color: white;
}

    .business-bunker-bg img {
        transition: all 0.3s ease;
        width: 100%;
        max-width: 150px;
    }

        .business-bunker-bg img:hover {
            transform: scale(1.05);
        }

        .business-bunker-bg img.h-auto {
            height: auto;
        }

    .business-bunker-bg .btn-business-request {
        background-color: white;
        color: #3e3e3f;
    }

.bunker-video {
    padding: 60px;
    text-align: center;
}

    .bunker-video iframe {
        width: 500px;
        height: 300px;
        border-radius: 20px;
        box-shadow: 0 0 15px black, 0 0 3px white;
        transition: all 0.5s ease-in;
    }

.business-p {
    padding: 60px;
}

.business-badges {
    text-align: center;
    font-size: 20px;
}

.business-bunker-bg .business-badges {
    color: white;
}

.business-badges img {
    width: 100%;
    max-width: 150px;
}

.business-badges h4 {
    padding-top: 10px;
}

.business-front-line {
    /*background-image: url('https://www.jo.zain.com/english/Business/PublishingImages/BunkerPage/bdots.png');
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: contain;*/
    min-height: 120px;
    color: white;
    text-align: center;
}


.business-bunker-paragraph {
    font-size: 18px;
}

.business-bunker-bg .business-bunker-paragraph {
    color: white;
}

.business-parallax-cctv {
    background-image: url('https://www.jo.zain.com/english/Business/PublishingImages/BunkerPage/CCTV_EN.png');
    background-position: top center;
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    height: 40%;
    height: 40vh;
    min-height: 350px;
}

.mix-blend {
    color: #bbb;
    mix-blend-mode: difference;
    text-shadow: 0 0 3px black;
}

.mix-blend-white {
    color: white;
    mix-blend-mode: difference;
    text-shadow: 5px 5px 10px grey;
}

.text-dark-shadow-white {
    color: #333;
    text-shadow: 0 0 3px white;
}

.text-white-shadow-dark {
    color: #fff;
    text-shadow: 0 0 3px #333;
}

.business-dots-white-md {
    background-image: url('https://www.jo.zain.com/english/Business/PublishingImages/BunkerPage/bdots.png');
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: contain;
    min-height: 350px;
}

.business-dots-white-sm {
    background-image: url('https://www.jo.zain.com/english/Business/PublishingImages/BunkerPage/bdots.png');
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: contain;
    min-height: 180px;
}

.business-blue-dots-white-md {
    background-image: url('https://www.jo.zain.com/english/Business/PublishingImages/BunkerPage/blue-dots.png');
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: contain;
    min-height: 350px;
}

#business-corporate-roaming .switch--item__active {
    background-color: #414141 !important;
}

#business-corporate-roaming table tr.info th {
    background-color: #414141 !important;
    color: #fff !important;
}

#business-corporate-roaming .corporate-operators-td {
    vertical-align: middle;
    text-align: center;
}

    #business-corporate-roaming .corporate-operators-td ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

.about-us-slider-container .slick-track {
    margin-left: 0 !important;
    margin-right: 0 !important;
}


.about-us-slider-container .slider img {
    max-width: unset;
    height: 100vh !important;
    transform: scale(1) !important;
}

.about-us-slider-container .slider-container-desktop .slider img {
    width: auto !important;
    transform: translateX(-50%) scale(1) !important;
    left: 50%;
    position: relative;
}

.about-us-slider-container .slider-container-mobile .slider img {
    height: auto !important;
    width: 100% !important;
}

.about-us-slider-container .slick-dots {
    bottom: 50px;
}

    .about-us-slider-container .slick-dots li button {
        border-radius: 50%;
        padding: 0;
        margin: 0;
        position: relative;
    }

        .about-us-slider-container .slick-dots li button:before {
            font-size: 18px;
            line-height: 1;
            position: absolute;
            top: 50%;
            left: 50%;
            width: 20px;
            height: 20px;
            content: '•';
            text-align: center;
            opacity: 0.7;
            color: #fff !important;
            -webkit-font-smoothing: antialiased;
            padding: 0;
            margin: 0;
            transform: translate(-50%,-50%);
        }

    .about-us-slider-container .slick-dots li.slick-active button {
        box-shadow: 0 0 2px 1px #fff;
    }

        .about-us-slider-container .slick-dots li.slick-active button:before {
            opacity: 1;
        }

#business-iphone14 .business-follow-up {
    padding: 14px;
    border-radius: 4px;
    box-shadow: 0 0 10px 1px #777;
    background-color: #333;
}

#business-iphone14 h1,
#business-iphone14 label {
    color: #fff !important;
}

img.img-business-iphone-14 {
    width: 100%;
}

.border-bottom {
    border-bottom: 1px solid #333;
    padding-bottom: 2px;
}


.h-max-300 {
    max-height: 300px;
}

.w-80 {
    width: 80px !important;
}

.h-80 {
    height: 80px !important;
}

.w-max-unset {
    max-width: none !important;
}

.go-to-top {
    padding: 0;
    width: 35px;
    height: 60px;
    position: fixed;
    bottom: -60px;
    right: 60px;
    z-index: 1;
    transition: all 0.8s ease;
}

    .go-to-top img {
        width: 35px;
    }

    .go-to-top.active {
        bottom: 150px;
    }

.badge-icon {
    width: 100%;
    max-width: 150px;
}

.dd-roaming .bootstrap-select.bs3.dd.dropdown.form-control.open > .dropdown-menu.open {
    display: block;
    position: relative;
}

.cell-50-break {
    width: 50%;
    word-break: break-word;
}

.cell-middle-center {
    vertical-align: middle !important;
    text-align: center;
}

.fade-in {
    animation: fade-in 1s;
}

.fade-in-3 {
    animation: fade-in 3s;
}

/*.dimelo-chat-container svg {
    width: 20px;
    height: 20px;
}*/


/*New eBill*/
#quickpay_ebill {
    padding: 20px 40px 0 40px;
    min-height: 200px;
    transition: height 0.5s ease;
}

    #quickpay_ebill * {
        user-select: none;
    }

    #quickpay_ebill .back-btn {
        height: 25px;
    }

.qp-title {
    height: 45px;
}

    .qp-title h1 {
        margin-top: 10px;
        user-select: none;
    }

.qp-desc {
    padding-top: 10px;
    min-height: 65px;
}

.qp-controls {
    min-height: 65px;
    margin-bottom: 20px;
}

    .qp-controls input, .qp-controls select {
        width: 100%;
        max-width: 400px;
        max-height: 45px;
        border-radius: 5px;
        box-shadow: 0 0 4px 1px #ccc;
        margin-bottom: 10px;
    }

    .qp-controls a {
        max-width: 400px;
    }

    .qp-controls .ZainCashInfoDiv label {
        font-size: 14px;
        font-weight: normal;
    }

    .qp-controls .ZainCashInfoDiv .qp-zaincash-info a {
        font-size: 14px;
        font-weight: bold;
        color: #0070c9;
    }

    .qp-controls .ZainCashInfoDiv .qp-hr-v {
        height: 20px !important;
    }

.qp-btn-link {
    color: #37ace5 !important;
    text-decoration: none !important;
    border-bottom: 1px solid #37ace5;
}

.qp-side-image {
    user-select: none;
}

.qp-view, .qp-ebill-content {
    animation: fade-in .8s;
}

.row.ebill-row, #quickpay_ebill .btn, #quickpay_ebill input, #quickpay_ebill select, #quickpay_ebill a {
    animation: fade-in 1.2s;
}

.qp-view.view-01, .row.qp-view-view-02 {
    background-image: url('https://www.jo.zain.com/english/PublishingImages/QuickpayFigure.png');
    background-repeat: no-repeat;
    background-position-x: 80%;
    background-position-y: 100%;
    background-size: auto 100%;
}

.row.qp-view-view-02 {
    min-height: 300px;
}

    .row.qp-view-view-02.div_view_02_SurpriseMe_OTP {
        background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/SurpriseMe/bg-otp.png');
        background-repeat: no-repeat;
        background-position-x: 90%;
        background-position-y: 10%;
        background-size: auto 80%;
    }

    .row.qp-view-view-02.div_view_02_SurpriseMe_Success {
        background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/SurpriseMe/bg-success.png');
        background-repeat: no-repeat;
        background-position-x: 90%;
        background-position-y: 10%;
        background-size: auto 80%;
    }

    .row.qp-view-view-02.div_view_02_SurpriseMe_Error {
        background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/SurpriseMe/bg-error.png');
        background-repeat: no-repeat;
        background-position-x: 90%;
        background-position-y: 10%;
        background-size: auto 80%;
    }

    .row.qp-view-view-02.div_view_02_SurpriseMe_Data {
        background-image: none;
    }

.qp-ebill-trigger-container {
    padding-top: 16px;
    text-align: left;
    max-width: 400px;
}

.qp-btn-payment-container {
    display: flex;
    gap: 8px;
    width: 100%;
}

.qp-btn-payment, .qp-btn-payment:active {
    border-radius: 6px;
    box-shadow: 0 0 4px 1px #ccc;
    color: #333;
    max-width: 200px;
    height: 45px;
    padding: 10px 10px;
    position: relative;
}

    .qp-btn-payment .qp-banner {
        display: block;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%,-20px);
        font-size: 12px;
        font-weight: normal;
        color: #fff;
        background-color: #5BAAE0;
        padding: 4px 8px;
        border-radius: 4px;
        display: flex;
        flex-wrap: nowrap;
        gap: 6px;
        align-items: center;
    }

        .qp-btn-payment .qp-banner img {
            width: 14px;
            height: 14px;
        }

.btn.btn-primary.qp-btn {
    max-width: 400px;
    max-height: 45px;
    border-radius: 5px;
    box-shadow: 0 0 4px 1px #ccc;
    margin-bottom: 10px;
    color: #fff;
}

.btn.btn-default.qp-btn {
    max-width: 400px;
    max-height: 45px;
    border-radius: 5px;
    background-color: #fff !important;
    box-shadow: 0 0 4px 2px #37ace5;
    margin-bottom: 10px;
    color: #37ace5;
    border: none;
}

.qp-btn-payment:active {
    transform: translateY(2px);
}

.qp-btn-payment-active {
    box-shadow: 0 0 4px 1px #167daf;
}

.qp-hr-v {
    margin-right: 15px;
    margin-left: 15px;
    display: inline-block;
    width: 2px;
    height: 45px;
    background-color: #ccc;
    vertical-align: middle;
}

.qp-hd-reconnection.card {
    display: flex;
    gap: 8px;
}

    .qp-hd-reconnection.card .column-50 {
        width: 50%;
    }

.qp-hd-reconnection-amountinfo,
.qp-hd-reconnection-warning {
    font-size: 14px;
}

.qp-hd-reconnection-amountinfo,
.qp-hd-billrun {
    max-width: 400px;
}

    .qp-hd-reconnection-amountinfo .break {
        display: block;
    }

.qp-hd-reconnection-warning input {
    max-width: unset;
    width: auto;
}

.qp-zaincash-submit-button {
    width: 100%;
    margin-top: 20px;
}

#modal_ebill .modal-dialog {
    max-width: 500px;
}

#modal_ebill .modal-header {
    border-bottom: none;
}

#modal_ebill .close {
    opacity: 0.5;
}

    #modal_ebill .close:hover, #modal_ebill .close:focus {
        opacity: 1;
    }

#modal_ebill .modal-content, #modal_ebill .btn.btn-default.qp-btn {
    background-color: #F5F6FB;
}

#modal_ebill small, #modal_ebill .small {
    font-size: 14px !important;
}

.tbEBillPIN {
    width: 55px;
    box-shadow: 2px 2px #E4E5E8;
    background-color: #fff;
}

.qp-ebill-container {
    margin-top: 40px;
}

.qp-ebill-content {
    background-color: #F5F6FB;
    padding: 40px;
    margin-bottom: 40px;
    box-shadow: 0px 10px 10px -2px #ccc;
    border-radius: 4px;
}

    .qp-ebill-content .ebill-col-overflow {
        overflow-y: auto;
        padding: 25px;
        height: 100%;
        max-height: 400px;
    }

.ebill-account-number {
    color: #888;
}

.ebill-tab-switcher li {
    background-color: #fff;
    color: #37ace5;
    padding: 10px 20px;
    border-radius: 20px;
    width: 125px;
    text-align: center;
    box-shadow: 0 0 0 2px #37ace5;
    transition: all 0.2s ease;
    margin: 0 5px;
    margin-bottom: 10px;
}

    .ebill-tab-switcher li a {
        color: #37ace5 !important;
        text-decoration: none !important;
    }

    .ebill-tab-switcher li.active {
        background-color: #37ace5;
        color: #fff;
        padding: 10px 20px;
        border-radius: 20px;
        width: 125px;
        text-align: center;
    }

        .ebill-tab-switcher li.active a {
            color: #fff !important;
        }

.qp-ebill-container img {
    max-width: 30px;
}

.row.ebill-row {
    background-color: #fff;
    box-shadow: 0 0 0px 2px #ddd;
    border-radius: 10px;
    margin-bottom: 10px;
    padding: 10px;
    font-size: 14px;
}

    .row.ebill-row img {
        max-width: 25px;
        margin: -5px 5px 0 5px;
    }

.ebill-color-black {
    font-weight: bold;
    color: black;
}

.ebill-status-paid {
    background-color: #37ace5;
    color: #fff;
    padding: 2px 5px;
    border-radius: 20px;
    min-width: 100px;
    text-align: center;
    font-weight: normal;
}

.ebill-status-pending {
    color: #37ace5;
    background-color: #fff;
    padding: 2px 5px;
    border-radius: 20px;
    min-width: 100px;
    text-align: center;
    font-weight: bold;
    box-shadow: 0 0 0 1px #37ace5;
    display: inline-block;
}

.qp-zaincash-invalidwallet {
    font-size: 12px;
    color: red;
}

.ZainCashOTPDiv {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    max-width: 400px;
    font-size: 14px;
}

    .ZainCashOTPDiv a {
        font-size: 14px;
    }

.qp-zaincash-result {
    max-width: 400px;
    margin: 0 auto;
    padding: 32px 16px;
    text-align: center;
}

    .qp-zaincash-result img {
        margin-bottom: 32px;
    }

    .qp-zaincash-result h4 {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        padding: 0;
        margin-bottom: 32px;
        text-align: center;
    }

    .qp-zaincash-result a {
        font-size: 14px;
        font-weight: bold;
        text-align: center;
    }

.qp-recurring-accounts-list-container {
    box-shadow: 0 0 5px #ccc;
    padding: 12px 20px;
    border-radius: 8px;
    margin: 12px 0;
}

.qp-recurring-accounts-list {
    display: inline-flex;
    justify-content: flex-start;
    gap: 14px;
    flex-wrap: wrap;
    max-height: 200px;
    overflow-y: auto;
    font-size: 14px;
}

    .qp-recurring-accounts-list span:before {
        content: "•";
        color: #777;
    }

.qp-recurring-card .card {
    display: flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    font-size: 14px;
}

    .qp-recurring-card .card a {
        position: relative;
        z-index: 10;
    }

    .qp-recurring-card .card .cbox {
        animation: none !important;
    }

.recurring-terms-trigger {
    cursor: pointer;
}

.qp-recurring-controls {
    margin-top: 16px;
    display: flex;
    justify-content: flex-end;
}

    .qp-recurring-controls .btn,
    .btnManageRecurring {
        width: auto !important;
    }

#quickpay_ebill.not-apple-device .btnApplePay {
    display: none;
}

.apple-pay-icon {
    max-height: 20px;
}

#modal_recurring_terms .modal-footer {
    padding: 15px;
}

#modal_recurring_terms .btn.btn-default {
    color: #ccc;
}

#modal_recurring_terms .modal-body {
    max-height: 70vh;
    overflow: auto;
    font-size: 14px;
}

.recurring-card-container {
    display: flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    column-gap: 18px;
    align-content: center;
    align-items: center;
}

    .recurring-card-container div:last-child {
        margin-left: auto;
    }

    .recurring-card-container .recurring-card-img-container {
        border: 1px solid #E7E7E7;
        height: 64px;
        width: 72px;
        display: flex;
        justify-content: center;
        align-content: center;
        align-items: center;
    }

    .recurring-card-container h4 {
        font-size: 14px;
        font-weight: bold;
        padding: 0;
        margin: 0;
        padding-bottom: 8px;
    }

    .recurring-card-container h2 {
        font-size: 28px;
        font-weight: bold;
        padding: 0;
        margin: 0;
        padding-bottom: 8px;
        color: #000;
    }

    .recurring-card-container h5 {
        font-size: 14px;
        font-weight: normal;
        padding: 0;
        margin: 0;
        color: #686868;
    }

    .recurring-card-container .recurring-remove-img-container {
        border: 1px solid #D91B1B;
        height: 64px;
        width: 72px;
        display: flex;
        justify-content: center;
        align-content: center;
        align-items: center;
        color: #D91B1B;
        font-size: 12px;
    }

.qp-controls .total-cost {
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 4px;
    margin-bottom: 4px;
    gap: 8px;
    border-bottom: 1px dashed #ccc;
}

    .qp-controls .total-cost span:last-child {
        font-weight: bold;
    }

.qp-surpriseme-input-otp-container {
    display: flex;
    gap: 12px;
    flex-wrap: nowrap;
    margin-bottom: 12px;
}

    .qp-surpriseme-input-otp-container input {
        border: 1px solid #979797;
        background: #FFF;
        height: 50px;
        width: 48px;
        padding: 0;
        outline: none;
        box-shadow: none;
        transition: unset;
        text-align: center;
        border-radius: 6px;
    }

.qp-resend-otp-container, .qp-otp-pending {
    text-align: center;
    margin-bottom: 12px;
    font-size: 14px;
    max-width: 350px;
}

.btn-qp-verifyotp {
    min-width: 350px;
    font-weight: normal;
    border-radius: 12px;
}

.btn.btn-secondary {
    color: #000 !important;
    background-color: #F1F0F0 !important;
    border-color: #F1F0F0;
}

.qp-services-card-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    align-items: start;
    gap: 20px;
}

    .qp-services-card-container .qp-service-card {
        height: 140px;
        width: 250px;
        box-shadow: 0 0 2px 1px #EBEBEB;
        border-radius: 6px;
        padding: 20px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }

        .qp-services-card-container .qp-service-card h4 {
            padding: 0;
            margin: 0;
            font-size: 18px;
            font-weight: bold;
            color: #2D2D2D;
        }

        .qp-services-card-container .qp-service-card h5 {
            padding: 0;
            margin: 0;
            font-size: 16px;
            font-weight: bold;
            color: #5CAAE0;
        }

        .qp-services-card-container .qp-service-card button {
            width: 190px;
            height: 38px;
            border-radius: 4px;
            font-size: 14px;
            font-weight: normal;
            color: #fff;
            background-color: #5CAAE0;
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 4px;
        }

#modal_surpriseme.in {
    display: flex !important;
    justify-content: center;
    align-items: center;
    padding: 0 !important;
}

    #modal_surpriseme.in .modal-dialog {
        max-width: 450px;
    }

#modal_surpriseme .modal-body {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
    padding: 40px 30px;
}

#modal_surpriseme h2 {
    font-size: 34px;
    font-weight: bold;
    color: #2D2D2D;
    padding: 0;
    margin: 0;
    margin-bottom: 15px;
}

#modal_surpriseme h4 {
    font-size: 18px;
    font-weight: normal;
    color: #2D2D2D;
    padding: 0;
    margin: 0;
}

#modal_surpriseme label {
    font-size: 18px;
    font-weight: bold;
    color: #2D2D2D;
    padding: 0;
    margin: 0;
    margin-bottom: 15px;
}

#modal_surpriseme .qp-surpriseme-modal-value-price {
    color: #5CAAE0;
}

#modal_surpriseme .btn {
    width: 100%;
    border-radius: 8px;
    font-weight: normal;
    font-size: 16px;
    height: 48px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

    #modal_surpriseme .btn.btn-close {
        color: #000;
        Background-color: #F6F6F6;
    }
/*Contact Us*/
#contact_us {
    /*padding: 40px;*/
}

    #contact_us .row {
        overflow: hidden;
    }

    #contact_us .contact_us_col_title {
        padding-left: 20px;
        padding-right: 20px;
    }

    #contact_us .contact_us_col {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
        padding-left: 0;
        padding-right: 0;
    }

        #contact_us .contact_us_col .contact_us_box {
            background-color: #F7F9FA;
            border-radius: 6px;
            min-height: 400px;
            margin: 20px;
        }

    #contact_us .contact_us_icon {
        padding-top: 40px;
        text-align: center;
    }

        #contact_us .contact_us_icon img {
            height: 80px;
        }

    #contact_us .contact_us_title {
        padding-top: 20px;
        text-align: center;
    }

        #contact_us .contact_us_title h2 {
            font-size: 24px;
        }

        #contact_us .contact_us_title p {
            font-size: 14px;
        }

    #contact_us .contact_us_desc.call_us a {
        font-weight: bold;
        color: #000 !important;
    }

    #contact_us .contact_us_desc {
        min-height: 150px;
        padding: 20px 30px;
        padding-bottom: 10px;
        display: flex;
        align-items: stretch;
        justify-content: center;
    }

        #contact_us .contact_us_desc.social-media {
            text-align: center;
        }

            #contact_us .contact_us_desc.social-media a {
                padding: 0;
                margin: 0;
                margin-right: 5px;
                margin-left: 5px;
                margin-bottom: 10px;
                display: inline-block;
            }

                #contact_us .contact_us_desc.social-media a img {
                    width: 35px;
                    height: 35px;
                    transition: all 0.3s ease;
                }

                #contact_us .contact_us_desc.social-media a:hover img {
                    transform: scale(1.1);
                }

/*.dimelo-chat-bubble-icon svg {
    width: 32px;
    height: 32px;
}*/

.login.login-icon-white,
.login.login-icon-m-black,
.login.login-icon-menu-white-black,
.login.login-icon-menu-white-m-black,
.hearing-menu-white-black,
.locator-menu-white-black,
.search-menu-white-black,
.search-menu-white-m-black,
.locator-menu-white-m-black,
.search-menu-black-white,
.search-menu-black-m-black,
.locator-menu-black-m-black {
    display: inline-block;
}

.login.login-icon-black,
.login.login-icon-m-white,
.login.login-icon-menu-white-white,
.login.login-icon-menu-white-m-white,
.hearing-menu-white-white,
.locator-menu-white-white,
.search-menu-white-white,
.search-menu-white-m-white,
.locator-menu-white-m-white,
.search-menu-black-black,
.search-menu-black-m-white,
.locator-menu-black-m-white {
    display: none;
}

.bootstrap-select.bs3.dd.dropdown.form-control .dropdown-menu.open {
    max-height: 300px !important;
}

.report-table-container .col-sm-12 {
    max-height: 55vh;
    overflow: auto;
}

#zain_magazine {
    padding: 20px;
    margin-bottom: 20px;
}

    #zain_magazine .magazine-card {
        padding: 10px;
        margin-bottom: 20px;
        border-radius: 4px;
        text-align: center;
        box-shadow: 0 0 0 #eee;
        transition: all 0.4s linear;
    }

        #zain_magazine .magazine-card .magazine-image {
            overflow: hidden;
            border-radius: 3px;
            position: relative;
        }

            #zain_magazine .magazine-card .magazine-image:after {
                content: '';
                display: inline-block;
                vertical-align: top;
                width: 100%;
                height: 0;
                padding-top: 100%;
            }

        #zain_magazine .magazine-card img {
            width: 100%;
            transform: scale(1);
            transition: all 0.6s ease;
            position: absolute;
            top: 0;
            left: 0;
        }



        #zain_magazine .magazine-card:hover img {
            transform: scale(1.15);
        }

        #zain_magazine .magazine-card .magazine-link {
            color: unset;
            text-decoration: none !important;
            outline: none !important;
            display: block;
        }

        #zain_magazine .magazine-card:hover {
            box-shadow: 0 0 8px #ccc;
        }



#appointments {
    margin-bottom: 64px;
}

    #appointments .appointments-breadcrumb a {
        margin: 0;
        font-size: 12px;
        font-weight: normal;
        color: #000 !important;
        text-decoration: none !important;
    }

    #appointments .appointments-breadcrumb span {
        opacity: 0.6;
        margin: 2px 4px;
        font-size: 10px;
    }

    #appointments h2.title {
        margin-top: 30px;
        margin-bottom: 20px;
        font-size: 24px;
        font-weight: bold;
        color: #323232;
    }

    #appointments h4 {
        font-size: 16px;
    }

    #appointments h2.title-secondary {
        font-size: 21px;
        font-weight: bold;
        color: #323232;
    }

    #appointments .appointment-record {
        padding: 24px 0;
        border: 1px solid #f3f5f6;
        margin-bottom: 16px;
        position: relative;
    }

    #appointments .appointment-record-item {
        padding: 0 24px;
        display: inline-block;
        text-align: left;
        float: left;
    }

    #appointments .appointment-record-item-header {
        font-size: 14px;
        color: #8b9aa8;
    }

    #appointments .appointment-record-item-value {
        font-size: 14px;
        font-weight: bold;
        color: #11120e;
        padding-top: 15px;
    }

    #appointments .appointment-record-item.ticket-number .appointment-record-item-value {
        font-size: 36px;
        padding-top: 0;
    }

    #appointments .appointment-record-item checked-in {
        color: #326e41;
    }

        #appointments .appointment-record-item checked-in .checkedin-fail {
            color: red;
        }

    #appointments .btn.btn-appointments, #modal_cancel .btn.btn-appointments {
        font-size: 16px;
        font-weight: normal;
        color: #fff;
        width: 100%;
        max-width: 328px;
        height: 40px;
        padding: 9px;
        border-radius: 20px;
        background-color: #e6007e;
    }

    #appointments .btn.btn-appointments {
        margin-bottom: 24px;
    }

    #appointments .appointment-record-item-checkin {
        padding-top: 15px;
    }

    #appointments .btn.btn-appointments-checkin {
        width: 100%;
        min-width: 100px;
        max-width: 127px;
        height: 36px;
        padding: 7px 32px;
        border-radius: 20px;
        background-color: transparent;
        border: solid 1px #e6007e;
        color: #e6007e;
        font-size: 16px;
        font-weight: normal;
        box-shadow: none;
        outline: none;
    }

    #appointments .appointment-record-item.check-in-disabled .btn.btn-appointments-checkin {
        opacity: 0.4;
        border: solid 1px #8b9aa8;
        color: #8b9aa8;
        pointer-events: unset !important;
    }

    #appointments .img-action {
        width: 48px;
        height: 48px;
        padding: 0;
        box-shadow: none !important;
        outline: none !important;
        border: none !important;
    }

    #appointments .appointment-hint {
        font-size: 14px;
        color: #323232;
    }

        #appointments .appointment-hint .inline-block h2 {
            margin-top: 0;
            font-size: 21px;
        }

        #appointments .appointment-hint .inline-block {
            float: left;
        }

            #appointments .appointment-hint .inline-block:last-child {
                padding-left: 15px;
            }

    #appointments .img-hint {
        width: 40px;
        height: 40px;
    }

    #appointments .appointment-wizard label {
        font-weight: normal;
        font-size: 14px;
        color: #11120e;
    }

    #appointments .appointment-wizard input, #appointments .appointment-wizard select {
        height: 48px;
        font-weight: normal;
        font-size: 16px;
        color: #11120e;
        padding: 13px 16px;
        border-color: #d1d7e0;
        margin: 0;
    }

        #appointments .appointment-wizard input:disabled {
            background-color: #fff !important;
            cursor: default !important;
        }

    #appointments .appointment-wizard .input-group-addon {
        min-width: 110px;
        font-size: 14px;
        font-weight: bold;
        color: #0070c9;
        background-color: #edeff3;
        border-color: #d1d7e0;
        cursor: pointer;
    }

    #appointments .input-group .input-group-addon:first-child {
        display: none;
    }

    #appointments .appointment-wizard .error-text {
        padding-top: 5px;
        font-size: 12px;
        font-weight: normal;
        color: #b10000;
    }

    #appointments .form-control[readonly] {
        background-color: #fff;
    }

    #appointments .checkin-error {
        display: block;
        width: 100%;
        float: none;
        clear: both;
        padding: 0px 24px;
        font-size: 14px;
        color: red;
    }

#modal_select_date .modal-dialog,
#modal_select_time .modal-dialog {
    max-width: 360px;
}

#modal_select_date .modal-header,
#modal_select_time .modal-header {
    color: #fff;
    padding: 16px 16px 12px;
    background-color: #008388;
    height: 123px;
    font-size: 18px;
}

#modal_select_date .modal-body {
    padding: 15px;
}

#modal_select_time .modal-body {
    padding: 15px 0;
}

#modal_select_date .close,
#modal_select_time .close {
    color: #fff !important;
    opacity: 1 !important;
    font-size: 30px;
    font-weight: normal;
}

#modal_select_date h2,
#modal_select_time h2 {
    margin: 20px 120px 0 0;
    font-size: 32px;
    font-weight: bold;
    color: #ffffff;
}

.select-date-calendar-container .select-date-calendar {
    margin-bottom: 20px;
}

.select-date-calendar-container .datepicker.datepicker-inline, .select-date-calendar-container .table-condensed {
    width: 100% !important;
}

    .select-date-calendar-container .table-condensed th, .select-date-calendar-container .table-condensed td {
        width: 45px;
        height: 45px;
    }

    .select-date-calendar-container .table-condensed .datepicker-switch, .select-date-calendar-container .table-condensed .prev, .select-date-calendar-container .table-condensed .next {
        color: rgba(0, 0, 0, 0.6);
        font-size: 14px;
    }

    .select-date-calendar-container .table-condensed th.dow {
        font-size: 12px;
        color: rgba(0, 0, 0, 0.6);
        opacity: 0.87;
    }

    .select-date-calendar-container .table-condensed .day {
        color: rgba(0, 0, 0, 0.87);
        font-size: 12px;
        border-radius: 50%;
        transition: all 0.3s;
    }

        .select-date-calendar-container .table-condensed .day.disabled {
            color: #a4b0c1;
        }

        .select-date-calendar-container .table-condensed .day.active {
            color: #ffffff !important;
            padding: 2px 3px 3px 2px !important;
            background-color: #008388 !important;
        }

    .select-date-calendar-container .table-condensed .month.active {
        background-color: #008388 !important;
        border-color: #008388 !important;
    }

    .select-date-calendar-container .table-condensed .day.today,
    .select-date-calendar-container .table-condensed .day.today:hover,
    .select-date-calendar-container .table-condensed .day.today:active {
        background-color: #d1ffee;
        border-color: #48e4a3;
    }

.select-date-calendar-picker-container,
.select-time-calendar-picker-container {
    /*text-align: right;*/
    text-align: center;
    /*padding: 0 32px;*/
}

.select-time-calendar-container {
    max-height: 450px;
    overflow-y: auto;
}

.select-date-calendar-picker-container .select-date-calendar-pick,
.select-time-calendar-picker-container .select-time-calendar-pick {
    /*color: #0070c9 !important;
    width: 72px;
    height: 36px;
    padding: 7px 24px;
    margin-top: 15px;
    background-color: #fff;
    font-size: 16px;
    font-weight: bold;
    border: none !important;
    outline: none !important;*/
    width: 100%;
    height: 30px;
    border-radius: 20px;
    background-color: #e6007e;
    outline: none !important;
    padding: 0;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    line-height: 1;
    transition: all 0.3s;
    display: inline-block;
    margin-bottom: 0;
    user-select: none;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    margin-top: 24px;
}

.select-time-calendar {
    text-align: center;
}

    .select-time-calendar .time-block {
        width: 99px;
        height: 40px;
        margin: 8px;
        padding: 10px 24px;
        border-radius: 4px;
        display: inline-block;
        border: solid 1px #d1d7e0;
        cursor: pointer;
        text-align: center;
        color: #323232;
        font-size: 14px;
        transition: all 0.3s;
        user-select: none;
    }

        .select-time-calendar .time-block.active {
            background-color: #008388;
            color: #ffffff;
        }

.appointments-GoToMyAppointments {
    text-align: center;
}

.btn.btn-appointments-link {
    width: auto;
    height: auto;
    font-size: 16px;
    color: #0070c9;
    margin: 0;
    padding: 10px;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.appointment-modal-title-text {
    font-size: 18px;
    font-weight: bold;
    color: #11120e;
}

.appointment-modal-body-text {
    font-size: 14px;
    color: #11120e;
}

#modal_checkin .modal-dialog,
#modal_cancel .modal-dialog,
#modal_checkedin .modal-dialog,
#modal_checkin_error .modal-dialog {
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0;
}

.appointment-record-item-action {
    padding-top: 12px;
}

.gmap-appointment-link {
    width: 160px;
    height: 32px;
    margin: 16px 0 0 0;
    padding: 6px 16px 7px;
    border-radius: 18px;
    background-color: #e6007e;
    width: 139px;
    height: 19px;
    font-size: 14px;
    font-weight: normal;
    color: #fff !important;
    text-decoration: none !important;
    outline: none !important;
    border: none !important;
}

.gm-style .gm-style-iw-c {
    padding: 10px !important;
}

#vaccine-bundle {
    min-height: 40vh;
}

.vaccine-bundle-content {
    max-height: 412px;
    overflow-y: auto;
    padding: 24px;
    border-radius: 4px;
    border: solid 1px #d1d7e0;
}

.vaccine-checkbox-container input {
    display: inline-block;
    width: auto;
    margin-left: 10px;
}

.international-switcher {
    position: sticky;
    background-color: #fff;
    top: 50px;
    z-index: 5;
    box-shadow: 0 5px 5px #fff;
    padding: 24px;
}

.international-bundles-content tr.info th {
    background-color: #54b8e9 !important;
    color: #fff;
    font-size: 16px;
    font-weight: normal !important;
}

.international-bundles-content table.table th,
.international-bundles-content table.table td {
    padding: 10px 24px;
    vertical-align: middle !important;
}

.js-international-rates table.table {
    position: relative;
}

    .js-international-rates table.table th {
        position: sticky;
        top: -1px;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2);
    }

.js-international-rates .js-btn-search-rates {
    width: 40px;
    padding: 0;
    height: 36px;
}

.overflow-y-400 {
    max-height: 400px;
    overflow-y: auto;
}

#jeeran .gift-item {
    padding: 24px 12px;
}

    #jeeran .gift-item .gift-item-row {
        display: flex;
        justify-content: space-between;
        justify-items: start;
        align-items: start;
        flex-wrap: nowrap;
    }

        #jeeran .gift-item .gift-item-row .gift-item-column {
            margin: 0 12px;
        }

            #jeeran .gift-item .gift-item-row .gift-item-column:nth-child(2) {
                flex-grow: 2;
            }

            #jeeran .gift-item .gift-item-row .gift-item-column.break {
                display: none;
            }


            #jeeran .gift-item .gift-item-row .gift-item-column img {
                width: 64px;
            }

            #jeeran .gift-item .gift-item-row .gift-item-column h1 {
                padding-bottom: 6px;
            }

            #jeeran .gift-item .gift-item-row .gift-item-column .btn {
                font-weight: normal;
                height: 40px;
                padding: 10px;
                width: 100%;
                min-width: 100px;
                max-width: 124px;
            }

            #jeeran .gift-item .gift-item-row .gift-item-column .jeeran-item-title {
                font-size: 18px;
                font-weight: bold;
                margin-top: 0;
                margin-bottom: 0;
                padding-top: 5px;
            }

    #jeeran .gift-item .gift-item-row-request {
        padding-right: 16px;
        padding-left: 16px;
    }

        #jeeran .gift-item .gift-item-row-request hr {
            margin-top: 16px;
            margin-bottom: 16px;
        }

    #jeeran .gift-item .redeemed {
        min-width: 140px;
        color: #5a6f84;
        font-size: 14px;
    }

    #jeeran .gift-item .redeemed-on {
        background-color: #f2f4f6;
        padding: 10px 24px;
        border-radius: 4px;
    }

#jeeran .btn-redeem-trigger {
    cursor: pointer;
}

#modal_redeem {
    padding-right: 8px;
    padding-left: 8px;
}

    #modal_redeem .modal-dialog {
        top: 50%;
        transform: translateY(-50%);
        margin-top: 0;
    }

    #modal_redeem .modal-body {
        padding: 24px;
    }

    #modal_redeem .modal-title {
        font-size: 18px;
        font-weight: bold;
        color: #11120e;
    }

    #modal_redeem .modal-subtitle {
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

    #modal_redeem .jeeran-lostmycode {
        float: right;
        font-size: 14px;
        font-weight: bold;
        color: #37ace5 !important;
        outline: none !important;
        text-decoration: none !important;
    }

    #modal_redeem .btn.btn-redeem {
        font-size: 16px;
        font-weight: normal;
        color: #fff;
        width: 100%;
        max-width: 124px;
        height: 40px;
        padding: 9px;
        border-radius: 20px;
        background-color: #e6007e;
    }

/* SIM Management*/
#sim-management h4 {
    font-size: 18px;
    font-weight: bold;
}

#sim-management .card-main {
    padding: 40px;
    padding-top: 32px;
}

#sim-management .card-sub {
    padding: 24px;
    padding-bottom: 32px;
    display: flex;
    justify-content: space-between;
    justify-items: start;
    align-items: start;
    flex-wrap: nowrap;
    margin-bottom: 10px;
}

#sim-management .card-image,
#sim-management .card-image img {
    width: 64px;
}

#sim-management .card-location {
    flex-grow: 2;
    padding: 0 24px;
}

    #sim-management .card-location h4 {
        margin-top: 5px;
        margin-bottom: 8px;
    }

#sim-management .card-title {
    flex-grow: 2;
    padding-right: 24px;
}

    #sim-management .card-title h4 {
        margin-top: 0;
    }

#sim-management .card-action {
    width: 124px;
}

    #sim-management .card-action .btn {
        width: 124px;
        height: 40px;
    }

        #sim-management .card-action .btn.btn-link {
            color: #37ace5 !important;
            font-size: 16px;
            font-weight: normal;
            text-decoration: none !important;
            outline: none !important;
            border: none !important;
        }

#sim-management .break {
    display: none;
}

/****esim***/
#esim .esim-trigger {
    display: flex;
    justify-content: space-between;
    color: black;
}


#esim .collapse-trigger[aria-expanded="true"] img {
    transform: rotate(45deg);
}

#esim .search-list {
    gap: 10px;
    display: inline-flex;
    flex-wrap: wrap;
}

#esim .esim-devices-list-text {
    margin: 0 !important;
}

#esim .esim-devices-list {
    display: none;
    border: 1px solid rgba(241, 241, 241, 1);
    border-radius: 7px;
    background: rgba(255, 255, 255, 1);
    padding: 5px 13px;
}

    #esim .esim-devices-list.active {
        display: block;
    }

        #esim .esim-devices-list.active.found-active {
            display: block;
            background: rgba(192, 239, 254, 1);
        }

#esim .esim-devices {
    background: rgba(250, 250, 250, 1);
}

#esim .number {
    background: rgba(216, 29, 127, 1);
    width: 37px;
    min-width: 37px;
    height: 37px;
    text-align: center;
    color: white;
    margin: 8px;
    display: flex;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
}

#esim .lblStep {
    font-weight: normal;
}

#esim .DevicesHeader {
    font-size: 22px;
    font-weight: 700;
    margin: 0 !important;
}

#esim .collapse.in {
    background-color: #f5f5f5 !important;
}

#esim .title {
    font-size: 32px;
    font-weight: 700;
    line-height: 48.24px;
}

#esim .content {
    font-size: 16px;
    line-height: 21.82px;
    margin: 0px !important;
}

#esim #devices {
    margin: 2% 0;
    scroll-margin: 150px;
}

#esim .esim-devices {
    position: relative;
    z-index: 2;
    background-color: transparent;
}

#esim .esim-devices-bg {
    background-color: #fafafa;
    z-index: -1;
    position: absolute;
    width: 200%;
    height: 100%;
    left: -50%;
}

#esim .nav-link {
    color: black !important;
    font-size: 20px;
}

    #esim .nav-link.active {
        border-bottom: 4px solid rgba(64, 181, 225, 1);
    }


#esim .esim-notes {
    padding: 25px 30px 40px 30px;
    background: rgba(250, 250, 250, 1);
    border-radius: 14px;
}

#esim .steps {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: start;
}

#esim .more-info {
    font-size: 16px !important;
    line-height: 24px;
    font-weight: normal !important;
}
/***end of esim***/


/**************Sponsorship**************/

#zain-sponsorship .pkgBox {
    margin: 20px auto;
    padding: 20px;
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px; /* Rounded corners */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle box shadow */
    transition: box-shadow 0.3s ease; /* Smooth transition for hover effect */
}

    #zain-sponsorship .pkgBox:hover {
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* Darker shadow on hover */
    }

    #zain-sponsorship .pkgBox label {
        font-size: 18px;
        font-weight: bold;
        color: #333;
        margin-bottom: 10px;
        display: block;
    }

    #zain-sponsorship .pkgBox textarea,
    .pkgBox input[type="text"] {
        width: 100%;
        padding: 12px;
        margin: 10px 0;
        border: 1px solid #ddd;
        border-radius: 5px;
        font-size: 14px;
        box-sizing: border-box; /* Ensures padding doesn't affect width */
        transition: border-color 0.3s ease;
    }

        #zain-sponsorship .pkgBox textarea:focus,
        .pkgBox input[type="text"]:focus {
            border-color: #3498db; /* Highlight border color on focus */
            outline: none; /* Remove default focus outline */
        }

    #zain-sponsorship .pkgBox .form-control {
        font-size: 16px;
    }

        #zain-sponsorship .pkgBox .form-control::placeholder {
            color: #888; /* Light gray placeholder */
        }

        #zain-sponsorship .pkgBox .form-control:focus::placeholder {
            color: transparent; /* Hide placeholder on focus */
        }

#zain-sponsorship .thankyouHeader {
    font-size: 51px;
    font-weight: 700;
    line-height: 70px;
}

#zain-sponsorship .sentSuccessfully {
    font-size: 23px;
    font-weight: 700;
    line-height: 35px;
}

#zain-sponsorship .getBackSoon {
    font-size: 18px;
    font-weight: 400;
    line-height: 35px;
}

#zain-sponsorship .text-end {
    text-align: end;
}

#zain-sponsorship .stepwizard-step p {
    margin-top: 0px;
    color: #666;
}

#zain-sponsorship .stepwizard-row {
    width: 100%;
    height: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#zain-sponsorship .stepwizard {
    width: 100%;
    position: relative;
}

#zain-sponsorship .wizardProgress {
    background-size: contain;
    background-repeat: no-repeat;
}

#zain-sponsorship .stepwizard-step button[disabled] {
    /*opacity: 1 !important;
    filter: alpha(opacity=100) !important;*/
}

#zain-sponsorship .stepwizard .btn.disabled, .stepwizard .btn[disabled], .stepwizard fieldset[disabled] .btn {
    opacity: 1 !important;
    color: #bbb;
}

#zain-sponsorship .stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    z-index: 0;
}

#zain-sponsorship .stepwizard-step {
    height: 30px;
    padding: 0;
    display: inline-block;
    text-align: center;
    z-index: 1;
}

#zain-sponsorship .btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}

#zain-sponsorship .title {
    color: #000;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}


#zain-sponsorship .description {
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

#zain-sponsorship .group-input .tbControl {
    height: 48px;
    border-radius: 7px;
    border: 1px solid #D1D1D1;
    width: 100%;
    /*max-width: 500px;*/
}

#zain-sponsorship .subheader {
    font-size: 22px;
}

#zain-sponsorship .description {
    font-weight: normal;
}

#zain-sponsorship .btn-blue {
    background: #37ACE5;
    color: white;
}

#zain-sponsorship .btn-grey {
    background: rgba(244, 244, 244, 1);
    color: black;
}

#zain-sponsorship .btn-next {
    width: 255px;
    height: 48px;
    padding: 17px 44px;
    border-radius: 7px;
}



#zain-sponsorship .sp-form-input-otp-container input {
    border-radius: 8.014px;
    border: 0.89px solid #D2D2D2;
    background: #FFF;
    width: 58.766px;
    height: 73.903px;
}

#zain-sponsorship .sp-form-input-otp-container {
    display: flex;
    gap: 12px;
    flex-wrap: nowrap;
    margin-bottom: 12px;
    text-align-last: center;
    justify-content: center;
}

#zain-sponsorship .feedback {
    width: 100%;
    border-radius: 7px;
    border: 1px solid #D1D1D1;
    background: #FFF;
    max-width: 1031px;
    margin-top: 10px;
}

#zain-sponsorship .FormFeedback {
    background-color: #F9F9F9;
    padding: 30px;
    border-radius: 10px;
}

#zain-sponsorship lblCheckboxOption {
    display: block;
    border: solid 1px gray;
    line-height: 40px;
    height: 40px;
    width: 250px;
    -webkit-font-smoothing: antialiased;
    margin-top: 10px;
    font-family: Arial,Helvetica,sans-serif;
    color: gray;
    text-align: center;
    width: Fill (507.5px);
    height: Fixed (48px);
    padding: 19px, 24px, 19px, 24px;
    border-radius: 7px;
    border: 1px;
    gap: 10px;
}

#zain-sponsorship .checkbox {
    display: none;
}

#zain-sponsorship .file-group-view {
    font-size: 17px;
    font-weight: 600;
    line-height: 23.19px;
    text-align: center;
    margin-top: 15px;
}


    #zain-sponsorship .file-group-view.active {
        font-size: 19px;
        font-weight: 600;
        line-height: 23.19px;
        text-align: center;
        color: rgba(55, 172, 229, 1);
        margin-top: 15px;
    }

#zain-sponsorship .fileType {
    font-size: 15px;
    font-weight: 400;
    line-height: 16.37px;
    text-align: center;
    color: rgba(129, 129, 129, 1);
}

#zain-sponsorship .lblUpload {
    color: rgba(55, 172, 229, 1) !important;
}


#zain-sponsorship .upload-box {
    width: 445px;
    height: 170px;
    padding: 15px;
    border-radius: 8px;
    border: 1.5px dashed #C8C8C8;
    background: #FFFFFF;
    margin-bottom: 35px;
}

#zain-sponsorship .before-upload {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    display: flex;
    flex-direction: column;
    background: #FFF;
    align-items: center;
    gap: 3px;
}

#zain-sponsorship .progress-upload {
    padding: 15px;
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
    min-height: 70px;
}

#zain-sponsorship .success-upload, .error-upload {
    padding: 15px;
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    min-height: 90px;
}


#zain-sponsorship .file-info {
    gap: 30px;
    direction: ltr;
    align-self: flex-start;
}

#zain-sponsorship .file-info-size, .file-info-date {
    color: var(--Secondary-Gray, #71839B);
    text-align: right;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
    letter-spacing: -0.06px;
}


#zain-sponsorship input.checkbox:checked + label:before {
    content: "";
}

#zain-sponsorship .chkbox-group {
    height: 48px;
    padding: 23px 24px 19px 24px;
    border-radius: 7px;
    gap: 10px;
    border: 1px solid #D1D1D1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: black;
}

    #zain-sponsorship .chkbox-group.active {
        background-color: #37ACE5;
        color: white;
    }


#zain-sponsorship .formInput {
    border: 1px solid #D1D1D1;
    height: 48px;
    border-radius: 7px;
}

#zain-sponsorship .formTextarea {
    width: 100% !important;
    height: 170px !important;
    max-width: none !important;
}

/************** End of Sponsorship**************/
/**************  Fiber Relocation *************/

#fiberRelocation .fr-header {
    display: flex;
    align-items: center;
}


    #fiberRelocation .fr-header h3 {
        font-weight: bold;
    }

#fiberRelocation .fr-map-modal-container {
    display: flex;
    flex-direction: column;
    padding: 15px;
    gap: 30px;
}

#fiberRelocation .bolde {
    font-weight: bold;
}

#fiberRelocation .fr-map-container {
    background: rgba(249, 250, 251, 1);
    margin-bottom: 46px;
}


#fiberRelocation .fr-map-modal-desc h2 {
    padding: 0;
    margin: 0;
    margin-bottom: 16px;
    font-size: 32px;
    font-weight: bold;
    color: #11120e;
}

#fiberRelocation .fr-map-modal-desc p {
    color: rgba(17, 24, 39, 1);
}

#fiberRelocation .fr-modal-current-location img {
    margin-right: 16px;
    margin-top: -4px;
}

#fiberRelocation a.fr-modal-current-location {
    display: block;
    padding: 12px 0;
    margin: 0;
    font-size: 18px;
    font-weight: bold !important;
    color: rgba(39, 133, 177, 1);
    text-decoration: none !important;
    outline: none !important;
    cursor: pointer;
}

#fiberRelocation .needHelpSection {
    display: flex;
    gap: 20px;
    justify-content: space-around;
}

#fiberRelocation .supportChannel {
    display: flex;
    align-items: center;
    gap: 20px;
}

#fiberRelocation img.help-icon {
    width: 100%;
}

#fiberRelocation #google-map {
    max-height: 364px;
    height: 100vh;
}

#fiberRelocation .form-group label {
    font-weight: normal;
    font-size: 18px;
}

#fiberRelocation input.msisdn {
    width: 480px;
    height: 55px;
    border-radius: 7px;
    border-width: 1px;
    padding-top: 5px;
    padding-right: 20px;
    padding-bottom: 5px;
    padding-left: 20px;
    border: 1px solid rgba(208, 208, 208, 1);
}


#fiberRelocation input.serialNumber {
    width: 480px;
    height: 55px;
    border-radius: 7px;
    border-width: 1px;
    padding-top: 5px;
    padding-right: 20px;
    padding-bottom: 5px;
    padding-left: 20px;
    border: 1px solid rgba(208, 208, 208, 1);
}

#fiberRelocation .w-100 {
    width: 100%;
}

#fiberRelocation .form-img {
    width: 100%;
}

#fiberRelocation .form {
    margin-bottom: 70px;
    margin-top: 28px;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

#fiberRelocation .RequestForm {
    background: rgba(249, 250, 251, 1);
    padding-top: 20px;
    margin-bottom: 25px;
}

#fiberRelocation .form-request {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

#fiberRelocation .paymentMethods {
    display: flex;
}

#fiberRelocation .btn-cash {
    font-weight: 700;
    font-size: 18px;
    letter-spacing: 0px;
    width: 100%;
    max-width: 217px;
    height: 75px;
    border: 1px solid rgba(208, 208, 208, 1);
    border-bottom-left-radius: 6px;
    border-top-left-radius: 6px;
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-width: 1px;
    padding-right: 60px;
    color: black;
    padding-left: 60px;
    background: white;
}

#fiberRelocation .btn-installement {
    font-weight: 700;
    font-size: 18px;
    letter-spacing: 0px;
    width: 100%;
    max-width: 400px;
    height: 75px;
    border: 1px solid rgba(208, 208, 208, 1);
    border-bottom-right-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 0px !important;
    border-top-left-radius: 0px !important;
    border-width: 1px;
    padding-right: 60px;
    color: black;
    padding-left: 60px;
    background: white;
}

#fiberRelocation .btn-payment.active {
    background: rgba(85, 185, 232, 1) !important;
    color: white !important;
    border: 1px solid rgba(84, 184, 233, 1);
}

#fiberRelocation .btn-submit {
    width: 100%;
    max-width: 617px;
    height: 55px;
    border-radius: 7px;
    background: rgba(85, 185, 232, 1);
    padding-top: 16px;
    padding-right: 36px;
    padding-bottom: 16px;
    padding-left: 36px;
}

#fiberRelocation .CheckMSISDN {
    display: flex;
}

#fiberRelocation .btn-check {
    width: 138px;
    height: 55px;
    border-radius: 7px;
    padding-top: 10px;
    padding-right: 45px;
    padding-bottom: 10px;
    padding-left: 45px;
    background: rgba(85, 185, 232, 1);
}

#fiberRelocation .modal-container {
    background-color: #fff;
    width: 400px;
    border-radius: 10px;
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    padding: 30px 20px;
    text-align: center;
    position: unset !important;
}

#fiberRelocation .sp-form-input-otp-container {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin: 20px 0;
}

#fiberRelocation .otp-input {
    width: 45px;
    height: 45px;
    text-align: center;
    font-size: 20px;
    border-radius: 6px;
    border: 1px solid #ccc;
}

#fiberRelocation .btn-submit {
    width: 100%;
    padding: 12px;
    font-size: 16px;
    margin-bottom: 10px;
    background-color: #55c7f7;
    color: white;
    border: none;
    border-radius: 8px;
    cursor: pointer;
}

#fiberRelocation .btn-close {
    background-color: #f0f0f0;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    width: 100%;
    color: black;
}

#fiberRelocation .Thankyou {
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-bottom: 40px;
}

#fiberRelocation .btn-cancel {
    width: 375px;
    height: 55px;
    border-radius: 7px;
    padding-top: 15.45px;
    padding-right: 89.4px;
    padding-bottom: 15.45px;
    padding-left: 89.4px;
    color: white;
    background: rgba(85, 185, 232, 1);
}

#fiberRelocation .fr-map-modal-next {
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
}

#fiberRelocation button.btn-check-availablity-map.btn {
    width: 302px;
    height: 55px;
    border-radius: 7px;
    padding-top: 16px;
    padding-right: 36px;
    background: rgba(85, 185, 232, 1);
    padding-bottom: 16px;
    padding-left: 36px;
}

#fiberRelocatione #preloader {
    z-index: 10000 !important;
}


#cancelRelocation .RelocationRequstItem {
    display: flex;
    width: 798px;
    height: 113px;
    top: 262px;
    left: 433px;
    justify-content: space-between;
    border-radius: 7px;
    padding-top: 20px;
    padding-right: 28px;
    padding-bottom: 20px;
    background: rgba(255, 255, 255, 1);
    padding-left: 28px;
    box-shadow: 0px 0px 20px 0px rgba(69, 73, 91, 0.08);
}


#cancelRelocation .RelocationRequestsList {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

#cancelRelocation .relocation-cancel-button {
    border: 1px solid #D91B1B;
    color: #D91B1B;
    border-radius: 4px;
    padding: 14px;
    height: 85%;
    align-self: center;
    text-align: center;
}

    #cancelRelocation .relocation-cancel-button img {
        height: 18px;
        margin: 0 auto;
        margin-bottom: 5px;
    }

    #cancelRelocation .relocation-cancel-button p {
        margin-bottom: 0px;
    }

    #cancelRelocation .relocation-cancel-button a {
        color: #D91B1B !important;
    }

/********** End Fiber Relocation **************/

/************** My Status Service **************/
#myStatusContatiner {
    display: flex;
    flex-direction: column;
}

    #myStatusContatiner .btnCancelPopup {
        width: 100px;
        color: black;
        height: 46px;
        text-align: center;
        opacity: 1;
        border-radius: 0;
        padding: 0;
    }


    #myStatusContatiner .btnConfirmPopup {
        width: 225px;
        height: 46px;
        background: rgba(85, 185, 232, 1);
        opacity: 1;
        border-radius: 8px;
        padding-top: 10px;
        padding-right: 30px;
        padding-bottom: 10px;
        padding-left: 30px;
    }

    #myStatusContatiner .modal-body {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    #myStatusContatiner .gap-2 {
        gap: 20px;
    }

    #myStatusContatiner .bold {
        font-weight: bold;
    }

    #myStatusContatiner .serviceControl {
        display: flex;
        flex-direction: column;
        gap: 25px;
    }

    #myStatusContatiner .d-flex {
        display: flex;
    }

    #myStatusContatiner .justify-content-end {
        justify-content: flex-end;
    }

    #myStatusContatiner .justify-content-center {
        justify-content: center;
        gap: 10px;
    }

#myStatusContentTemplate {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

    #myStatusContentTemplate .tableChkBox {
        width: 26px;
        height: 26px;
    }

    #myStatusContentTemplate .general-edit-action {
        display: flex;
        justify-content: flex-end; /* align to the right if needed */
        align-items: center;
    }

    #myStatusContentTemplate .edit-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 48px; /* fixed square size—adjust as needed */
        height: 48px;
        padding: 0;
        border: 1px solid #ddd;
        border-radius: 6px;
        background: #fff;
        cursor: pointer;
        transition: background 0.2s ease-in-out;
        box-sizing: border-box;
    }

    #myStatusContentTemplate .edit-icon {
        width: 24px; /* adjust size of the icon */
        height: 24px;
        margin-bottom: 4px;
    }

    #myStatusContentTemplate .edit-label {
        font-size: 13px;
        color: #333;
    }

    #myStatusContentTemplate .edit-btn:hover {
        background: #f5f5f5;
    }

#myStatusContatiner .bulk-actions {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

/* Works for <a> (LinkButton) and <button> */
#myStatusContentTemplate .bulk-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px; /* space between text and icon */
    padding: 10px 16px;
    border-radius: 12px;
    border: 1.5px solid transparent;
    background: #fff;
    color: #333;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 1px 0 rgba(0,0,0,.02);
    transition: background-color .15s, border-color .15s, filter .15s;
}

    #myStatusContentTemplate .bulk-btn:hover {
        filter: brightness(0.98);
    }

#myStatusContentTemplate .btn-icon {
    width: 18px;
    height: 18px;
    display: inline-block;
}

/* Variants to match your screenshot */
#myStatusContentTemplate .bulk-btn--activate {
    background: #eaf6ff;
    border-color: #bfe4ff;
    color: #1d7fdc;
}

#myStatusContentTemplate .bulk-btn--deactivate {
    background: #f4f4f5;
    border-color: #e6e6ea;
    color: #5b5b5f;
}

#myStatusContentTemplate .bulk-btn--edit {
    background: #fff;
    border-color: #d9954a;
    color: #8a5b1f;
}

#myStatusContentTemplate .bulk-btn--delete {
    background: #fff;
    border-color: #e35b5b;
    color: #9d1d1d;
}

/* Optional disabled look */
#myStatusContentTemplate .bulk-btn:disabled {
    opacity: .5;
    cursor: default;
    filter: none;
}


/*#myStatusContentTemplate .btnActivateSelected {
    max-width: 195px;
    height: 45px;
    opacity: 1;
    border: 1px solid rgba(85, 185, 232, 1);
    border-radius: 8px;
    border-width: 1px;
    background: rgba(85, 185, 232, 0.09);
    padding: 10px 20px;
}

#myStatusContentTemplate .btnDeactivateSelected {
    max-width: 195px;
    height: 45px;
    opacity: 1;
    border: 1px solid rgba(183, 183, 183, 1);
    border-radius: 8px;
    border-width: 1px;
    background: rgba(183, 183, 183, 0.05);
    padding: 10px 20px;
}

#myStatusContentTemplate .btnEditSelected {
    max-width: 195px;
    height: 45px;
    opacity: 1;
    border: 1px solid rgba(212, 123, 18, 1);
    border-radius: 8px;
    border-width: 1px;
    background: rgba(212, 123, 18, 0.05);
    padding: 10px 20px;
}*/

#myStatusContentTemplate .switch {
    position: relative;
    display: inline-block;
    width: 37px;
    height: 20px;
}

    #myStatusContentTemplate .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

#myStatusContentTemplate .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    #myStatusContentTemplate .slider:before {
        position: absolute;
        content: "";
        height: 16px;
        width: 16px;
        left: 1px;
        bottom: 1px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

#myStatusContentTemplate input:checked + .slider {
    background: rgba(85, 185, 232, 1);
    border: 1.18px solid rgba(85, 185, 232, 1);
}

#myStatusContentTemplate input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

#myStatusContentTemplate input:checked + .slider:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}

/* Rounded sliders */
#myStatusContentTemplate .slider.round {
    border-radius: 34px;
}

    #myStatusContentTemplate .slider.round:before {
        border-radius: 50%;
    }

/*#myStatusContentTemplate .general-message-bar {
        width: 100%;
        padding: 15px;
        height: 100px;
        border-radius: 8px;
        border-width: 1px;
        border: 1px solid rgba(223, 223, 223, 1);
        display: flex;
        justify-content: space-between;
        align-items: center;
    }*/

#myStatusContentTemplate .general-message-bar {
    border: 1px solid rgba(223, 223, 223, 1);
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    opacity: 1;
    border-radius: 8px;
    border-width: 1px;
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 30px;
    gap: 10px;
}

/* Right-side actions container (Edit + Toggle cards) */
#myStatusContentTemplate .general-actions {
    display: inline-flex;
    gap: 16px;
    align-items: center;
}

/* Shared card look */
#myStatusContentTemplate .action-card {
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    background: #fff;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 96px; /* gives that “card” feel */
    height: 84px;
    box-sizing: border-box;
}

/* Edit card content stacked vertically */
#myStatusContentTemplate .edit-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
}

#myStatusContentTemplate .edit-icon {
    width: 24px;
    height: 24px;
}

#myStatusContentTemplate .edit-label {
    font-size: 14px;
    color: #333;
}

/* Toggle card: switch on top, label below */
#myStatusContentTemplate .general-change-status {
    flex-direction: column;
    gap: 6px;
}

#myStatusContentTemplate .toggle-card-label {
    font-size: 14px;
    color: #333;
}

/* Optional: status text under the cards, aligned right */
#myStatusContentTemplate .general-status-text {
    text-align: right;
    margin-top: 6px;
}

/* If you want the whole block to breathe a bit more */
#myStatusContentTemplate .general-message {
    margin-right: 16px;
}


/* ===== Table shell ===== */
#myStatusContentTemplate .table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border: 1px solid #ececf1;
    border-radius: 12px;
    overflow: hidden; /* keep rounded header corners */
}

    /* Header */
    #myStatusContentTemplate .table thead th {
        background: #f7f7fa;
        color: #3a3a3a;
        font-weight: 700;
        padding: 14px 18px;
        border-bottom: 1px solid #ececf1;
        white-space: nowrap;
    }

    /* Cells */
    #myStatusContentTemplate .table tbody td {
        padding: 14px 18px;
        vertical-align: middle;
        border-bottom: 1px solid #f3f3f6;
    }

    /* Zebra rows + hover */
    #myStatusContentTemplate .table tbody tr:nth-child(even) {
        background: #fafafb;
    }

    #myStatusContentTemplate .table tbody tr:hover {
        background: #f5f9ff;
    }

    /* Selected row highlight (toggle .row-selected on <tr>) */
    #myStatusContentTemplate .table tbody tr.row-selected {
        background: #eef6ff !important;
        box-shadow: inset 3px 0 0 #2f80ff;
    }

    /* Checkbox column width */
    #myStatusContentTemplate .table thead th:first-child,
    #myStatusContentTemplate .table tbody td:first-child {
        width: 44px;
        text-align: center;
    }

    /* Message column wider */
    #myStatusContentTemplate .table thead th:nth-child(3),
    #myStatusContentTemplate .table tbody td:nth-child(3) {
        width: 55%;
    }

/* ===== Service Status column (layout only, no slider styles) ===== */
#myStatusContentTemplate .status-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}

#myStatusContentTemplate .status-text {
    font-weight: 600;
    color: #4b4b4b;
}

/* ===== Actions column (compact icon buttons) ===== */
#myStatusContentTemplate .actions-cell {
    white-space: nowrap;
}

    #myStatusContentTemplate .actions-cell .btn {
        padding: 0;
        margin-left: 10px;
    }

    #myStatusContentTemplate .actions-cell img {
        width: 18px;
        height: 18px;
        display: inline-block;
        vertical-align: middle;
        opacity: .95;
    }

    #myStatusContentTemplate .actions-cell button[disabled] img {
        opacity: .35;
    }

/* ===== Table footer: rows-per-page + pager ===== */
#myStatusContentTemplate .table-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 8px 0;
    color: #4b4b4b;
}

#myStatusContentTemplate .rows-per-page label {
    margin-right: 8px;
    font-weight: 600;
}

#myStatusContentTemplate .rows-per-page select {
    border: 1px solid #e1e1e6;
    border-radius: 8px;
    padding: 6px 10px;
    background: #fff;
}

#myStatusContentTemplate .pager {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

#myStatusContentTemplate .pg-btn {
    width: 28px;
    height: 28px;
    line-height: 26px;
    text-align: center;
    border: 1px solid #e1e1e6;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
}

    #myStatusContentTemplate .pg-btn[disabled] {
        opacity: .5;
        cursor: default;
    }

#myStatusContentTemplate .pg-current {
    font-weight: 700;
}

#myStatusContentTemplate .pg-sep,
#myStatusContentTemplate .pg-total {
    color: #8d8d95;
}


#myStatusContatiner .search-container {
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 20px;
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

    #myStatusContatiner .search-container input[type="text"],
    #myStatusContatiner .search-container select {
        padding: 10px 15px;
        border: 1px solid #ccc;
        border-radius: 8px;
        font-size: 14px;
        outline: none;
    }

    #myStatusContatiner .search-container button {
        background-color: #50bfff;
        color: white;
        border: none;
        padding: 10px 20px;
        font-size: 14px;
        border-radius: 8px;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 5px;
    }

        #myStatusContatiner .search-container button svg {
            width: 16px;
            height: 16px;
            fill: white;
        }

#myStatusContatiner .general-edit-action {
    display: flex;
    flex-direction: column;
}

#myStatusContatiner .general-change-status {
    display: flex;
    flex-direction: column;
}

#myStatusContatiner .toggle-switch {
    width: 40px;
    height: 20px;
    appearance: none;
    background-color: #ccc;
    border-radius: 20px;
    position: relative;
    cursor: pointer;
}

    #myStatusContatiner .toggle-switch:checked {
        background-color: #4cd964;
    }


#myStatusContatiner .service-status-bar {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 70px;
    border-radius: 8px;
    align-items: center;
    padding: 0 15px;
    background: rgba(244, 249, 251, 1);
}

#myStatusContatiner .btn-newMessage {
    max-height: 180px;
    height: 45px;
    border-radius: 8px;
    background: rgba(85, 185, 232, 1);
}


#myStatusContatiner .msisdn-multi {
    position: relative;
    display: block;
}

    #myStatusContatiner .msisdn-multi summary {
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        cursor: pointer;
        padding: 10px 14px;
        border: 1px solid #dbe1ea;
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 1px 2px rgba(0,0,0,.04);
        user-select: none;
    }

        #myStatusContatiner .msisdn-multi summary::-webkit-details-marker {
            display: none;
        }

        #myStatusContatiner .msisdn-multi summary:focus {
            outline: none;
        }

        #myStatusContatiner .msisdn-multi summary:focus-visible {
            outline: 3px solid rgba(41,155,213,.25);
            border-color: #8ecdf1;
        }

    #myStatusContatiner .msisdn-multi .summary-left {
        display: flex;
        align-items: center;
        gap: 8px;
        font-weight: 600;
    }

    #myStatusContatiner .msisdn-multi .summary-right {
        margin-left: auto;
        font-size: 12px;
        color: #6b7280;
    }

    #myStatusContatiner .msisdn-multi summary::after {
        content: '▾';
        margin-left: 8px;
        transition: transform .2s ease;
    }

    #myStatusContatiner .msisdn-multi[open] summary::after {
        transform: rotate(180deg);
    }

#myStatusContatiner .dropdown-panel {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    z-index: 40;
    background: #fff;
    border: 1px solid #e5ebf1;
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 10px 20px rgba(16,24,40,.08);
}

#myStatusContatiner .panel-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 8px;
}

    #myStatusContatiner .panel-actions .btn {
        border: 1px solid #dbe1ea;
        border-radius: 10px;
        font-weight: 600;
    }

    #myStatusContatiner .panel-actions .btn-primary {
        border-color: #2da4df;
    }

/* The ListBox itself */
#myStatusContatiner .did-multiselect {
    width: 100%;
    min-height: 220px;
    border: 1px solid #dbe1ea;
    border-radius: 12px;
    padding: 6px;
    background: #fff;
    font-size: 14px;
    line-height: 1.3;
    outline: none;
    box-shadow: 0 1px 2px rgba(0,0,0,.04),0 0 0 3px transparent;
    transition: box-shadow .15s ease,border-color .15s ease;
}

    #myStatusContatiner .did-multiselect:focus {
        border-color: #8ecdf1;
        box-shadow: 0 0 0 3px rgba(41,155,213,.2);
    }

    #myStatusContatiner .did-multiselect option {
        padding: 10px 12px;
        margin: 2px 0;
        border-radius: 8px;
    }

        #myStatusContatiner .did-multiselect option:hover {
            background: #f2f7ff;
        }

        #myStatusContatiner .did-multiselect option:checked {
            background: #2da4df;
            color: #fff;
        }

        #myStatusContatiner .did-multiselect option[disabled] {
            color: #9aa7b2;
            font-style: italic;
        }

    #myStatusContatiner .did-multiselect::-webkit-scrollbar {
        width: 10px;
    }

    #myStatusContatiner .did-multiselect::-webkit-scrollbar-track {
        background: #f3f6f9;
        border-radius: 8px;
    }

    #myStatusContatiner .did-multiselect::-webkit-scrollbar-thumb {
        background: #c8d3de;
        border-radius: 8px;
    }

        #myStatusContatiner .did-multiselect::-webkit-scrollbar-thumb:hover {
            background: #a9b7c6;
        }


/********** En of My Status Service ************/
/**************  Revamp Home Page*************/

#HomePageNew {
    margin-top: 50px;
}

    #HomePageNew .promotionsSection img {
        border-radius: 16px;
    }

    #HomePageNew .align-img {
        text-align: right;
    }

    #HomePageNew .item .reset-a img {
        width: 100%;
        border-radius: 15px;
    }

    #HomePageNew .allDeals .slick-dots {
        gap: 0px !important;
    }

    #HomePageNew .support-title {
        font-weight: bold;
    }

    #HomePageNew .latestOffersSlider .slick-slide {
        padding: 0 5px;
    }

    #HomePageNew .mainSliderSectionMobile .slick-dots {
        position: absolute !important;
        left: 50%;
        transform: translateX(-50%);
        margin-bottom: 10px;
        display: flex !important;
        justify-content: center;
        width: 100%;
    }


    #HomePageNew .latestOffersHeader {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 10px;
    }

    #HomePageNew .slider-arrows button {
        background-color: unset;
        border: none;
        font-size: 18px;
        padding: 5px 10px;
        cursor: pointer;
        border-radius: 4px;
        margin-left: 5px;
    }

    #HomePageNew .mainSliderSection .slick-track {
        margin-left: 0 !important;
    }

    #HomePageNew .slick-prev {
        left: 6px !important;
    }


    #HomePageNew .slick-next {
        right: 40px !important;
    }

    #HomePageNew .slick-prev, .slick-next {
        top: 45% !important;
        width: 5px !important;
        height: 5px !important;
        z-index: 99 !important;
    }

    #HomePageNew .slick-dots li button:before {
        font-size: 50px !important;
    }

    #HomePageNew .slick-dots {
        bottom: 12px !important;
        position: static !important;
    }

    #HomePageNew .slick-prev::before,
    #HomePageNew .slick-next::before {
        content: none !important;
        display: none !important;
    }

    #HomePageNew .slick-dots li.slick-active button:before {
        font-size: 50px !important;
    }

    #HomePageNew .connectZFiber {
        font-size: 29px !important;
        margin-bottom: 0 !important;
        font-weight: 100 !important;
    }


    #HomePageNew .item-card {
        margin-left: 20px;
        max-width: 250px;
        height: 410px;
        background: white;
        position: relative;
    }

    #HomePageNew .item-img {
        max-width: 250px;
        height: 270px;
        text-align: center;
    }

    #HomePageNew .item-name {
        padding-left: 15px;
        color: rgba(24, 29, 37, 1);
    }

    #HomePageNew .item-price {
        padding-left: 15px;
        position: absolute;
        bottom: 0;
    }

    #HomePageNew .newPrice {
        font-weight: 800;
        color: rgba(24, 29, 37, 1);
        font-size: 23px;
    }

    #HomePageNew .oldPrice {
        font-weight: 400;
        font-size: 16px;
        color: rgba(156, 163, 175, 1);
        text-decoration: line-through;
    }

    #HomePageNew .itemName {
        font-weight: 700;
        font-size: 19px;
        height: 300px;
        color: rgba(24, 29, 37, 1);
    }

    #HomePageNew .needHelpSection {
        display: flex;
        gap: 20px;
        justify-content: space-around;
    }

    #HomePageNew .supportChannel {
        display: flex;
        align-items: center;
        gap: 20px;
    }


    #HomePageNew .quickPaySection {
        border-radius: 20px;
        background: rgba(249, 250, 251, 1);
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 30px;
        height: 100px;
        margin-top: 60px;
    }


    #HomePageNew .inputMSISDN {
        height: 50px;
        width: 475px;
    }

    #HomePageNew .promotionsSection {
        display: flex;
        gap: 20px;
    }

    #HomePageNew .latestOffersSection {
        display: flex;
        flex-direction: column;
        margin-top: 30px;
    }

    #HomePageNew .bold {
        font-weight: bold;
    }

    #HomePageNew .downloadAppSection {
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        background-image: url("https://www.jo.zain.com/english/PublishingImages/HomePage/DownloadAPP/Background.png");
        background-size: cover;
        background-repeat: no-repeat;
        color: white;
        border-radius: 15px;
        margin: 45px 0;
        padding: 14px 38px;
    }

    #HomePageNew .downloadApp {
        justify-content: center;
        gap: 18px;
    }

    #HomePageNew .AppStores {
        gap: 15px;
    }


    #HomePageNew .ScanQRCode {
        display: flex;
        align-items: center;
    }

    #HomePageNew .AppFeatures {
        justify-content: space-between;
    }


    #HomePageNew .offer {
        margin-left: 7px;
        width: 400px;
        height: 350px;
        border-radius: 10px;
    }

    #HomePageNew .BrandsList {
        gap: 10px;
        padding: 0 15px;
    }

    #HomePageNew .ZFiber {
        padding: 45px;
        gap: 20px;
    }

    #HomePageNew .zainFiberServices {
        margin-top: -60px;
        justify-content: space-evenly;
        display: flex;
        margin-bottom: 65px;
    }

    #HomePageNew .ServicesCardsList {
        gap: 20px;
        width: 95%;
    }

    #HomePageNew .description {
        font-size: 14px;
        line-height: 18px;
        color: rgba(0, 0, 0, 1);
    }

    #HomePageNew .r {
        display: flex;
        flex-direction: row;
    }

    #HomePageNew .c {
        display: flex;
        flex-direction: column;
    }

    #HomePageNew .eshopSection {
        background: rgba(249, 250, 251, 1);
        margin: 26px 0;
        padding: 15px;
    }

    #HomePageNew .eshop-category {
        max-width: 100%;
    }

    #HomePageNew .allDeals {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 15px;
        padding: 0 10px;
    }

    #HomePageNew .slick-dots-wrapper {
        display: flex;
        align-items: center;
    }

    #HomePageNew .slick-dots {
        display: flex !important;
        gap: 8px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    #HomePageNew .mainSliderSection .slick-dots {
        margin-top: -20px;
        justify-content: center;
    }

    #HomePageNew .slick-dots li button:before {
        font-size: 10px;
        color: #888;
    }

    #HomePageNew .slick-dots li.slick-active button:before {
        color: #007bff;
    }

    #HomePageNew .view-all-button {
        background-color: #007bff;
        color: white;
        border: none;
        padding: 6px 12px;
        border-radius: 20px;
        cursor: pointer;
    }

    #HomePageNew .latestDevicesSection {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    #HomePageNew .eshopCategory {
        width: fit-content;
        height: 45px;
        border-radius: 3px;
        padding: 10px 25px;
        border-bottom-width: 5px;
        border: 1px solid rgba(233, 239, 244, 1);
        background: white;
    }

        #HomePageNew .eshopCategory.active {
            border-bottom: 5px solid rgba(55, 172, 229, 1);
            font-weight: bold;
        }

    #HomePageNew .eshopCategoryRow {
        justify-content: space-between;
        align-items: center;
    }

    #HomePageNew .ViewAllDeals {
        width: 185px;
        height: 50px;
        border-radius: 50px;
        gap: 14px;
        font-size: 15px;
        padding: 10px 25px;
        background: rgba(55, 172, 229, 1);
        color: white;
    }

    #HomePageNew .FiberServiceCard {
        border: 2px solid rgba(40, 0, 62, 0.05);
        background: rgba(255, 255, 255, 1);
        width: 100%;
        height: 155px;
        border-radius: 10px;
        padding: 25px;
        gap: 19px;
        border-width: 2px;
    }


    #HomePageNew .FiberKnowMoreButton {
        width: 282px;
        height: 50px;
        border-radius: 54px;
        padding-top: 15px;
        padding-right: 35px;
        padding-bottom: 15px;
        padding-left: 35px;
        background: rgba(230, 0, 126, 1);
        color: white;
    }

    #HomePageNew .zainFiberSection {
        border-radius: 15px;
        background-image: url("https://www.jo.zain.com/english/PublishingImages/HomePage/ZFiber/FiberBG.png");
        color: white;
        display: flex;
        justify-content: space-between;
        width: 100%;
    }



    #HomePageNew .w-33 {
        width: 33%;
    }

    #HomePageNew .w-100 {
        width: 100%;
    }

    #HomePageNew .help-icon {
        width: 100%;
        max-width: 50px;
    }


/******** End of Revamp Home Page *********/
/************** Recontracting **************/

#recontracting {
    height: 100vh;
}


    #recontracting .pkg-comm {
        border: 1px solid #11120e;
        padding: 5px;
        text-align: center;
        margin: 6px;
    }

        #recontracting .pkg-comm.active {
            border: 2.5px solid #D81D7F;
        }


    #recontracting .otp-container {
        display: flex;
        gap: 5px;
        direction: ltr;
    }

    #recontracting .tb_OTP {
        width: 40px;
        height: 50px;
        margin: 0 10px;
    }

    #recontracting .btnScroll {
        height: 40px;
        width: 100%;
        margin: 8px 0px;
        padding: 8px 10px 11px 10px;
        border-radius: 24px;
        background-color: #D81D7F;
        color: #ffffff;
        font-size: 16px;
        font-weight: bold;
        border: none;
        outline: none;
        margin-bottom: 30px;
    }

    #recontracting .height52 {
        height: 52%;
    }

    #recontracting .termsDiv {
        height: 200px;
    }

    /*#recontracting .title {
        margin: 0px 0px 32px 0px;
    }*/

    #recontracting .title {
        margin: 48px 0px 15px 0px;
        font-size: 24px;
        font-weight: bold;
        color: #11120e;
    }

    #recontracting .data_title {
        margin: 30px 0px 15px 0px;
        font-size: 24px;
        font-weight: bold;
        color: #11120e;
    }

    #recontracting .description {
        /* max-width: 1164px;*/
        margin: 8px 0 60px;
        font-size: 14px;
        line-height: 1.78;
        color: #11120e;
    }

    #recontracting .img-100 {
        width: 100%;
    }

    #recontracting .red-border {
        border-color: red !important;
    }

    #recontracting .lblForm {
        height: 22px;
        margin: 30px 0px 0px 0;
        font-size: 14px;
        font-weight: bold;
        color: #11120e;
    }

    #recontracting .paddingleft0 {
        padding-left: 0px !important;
    }

    #recontracting .tbForm {
        max-width: 392px;
        height: 48px;
        margin: 8px 0 0;
        box-shadow: none !important;
        /*padding: 13px 181px 13px 16px;*/
        border-radius: 4px;
        border: solid 1px #d1d7e0;
        background-color: #ffffff;
    }

    #recontracting .btnSubmit {
        width: 100%;
        max-width: 200px;
        height: 40px;
        margin: 8px 0px;
        padding: 8px 37px 11px 36px;
        border-radius: 24px;
        background-color: #D81D7F;
        color: #ffffff;
        font-size: 16px;
        font-weight: bold;
        border: none;
        outline: none;
    }

    #recontracting #btnContinue {
        width: 100% !important;
        height: 40px !important;
        margin: 8px 0px !important;
        padding: 8px 37px 11px 36px !important;
        border-radius: 24px !important;
        background-color: #D81D7F !important;
        color: #ffffff !important;
        font-size: 16px !important;
        font-weight: bold !important;
        border: none !important;
        outline: none !important;
    }

    #recontracting .btnOTPSubmit {
        width: 100%;
        /*max-width: 188px;*/
        height: 40px;
        margin: 8px 0px;
        padding: 8px 37px 11px 36px;
        border-radius: 24px;
        background-color: #D81D7F;
        color: #ffffff;
        font-size: 16px;
        font-weight: bold;
        border: none;
        outline: none;
    }


    #recontracting .btnPrev {
        width: 100%;
        height: 40px;
        margin: 8px 0px;
        padding: 8px 37px 11px 36px;
        border-radius: 24px;
        background-color: #404040;
        color: #ffffff;
        font-size: 16px;
        font-weight: bold;
        border: none;
        outline: none;
        max-width: 200px;
    }


    #recontracting .btnClear {
        width: 100%;
        max-width: 200px;
        color: black;
        height: 40px;
        margin: 8px 0px;
        padding: 11px 36px 11px 36px;
        border-radius: 24px;
        font-weight: bold;
        border: 1px solid #D1D1D1;
        background: #FFF;
        outline: none;
        font-size: 14px;
    }

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

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

#recontracting .btn-tab {
    height: 47px;
    margin: 0;
    border-radius: 6px;
    border: solid 1px #d1d7e0;
    background-color: #ffffff;
    width: 100%;
    max-width: calc(50% - 12px);
}

    #recontracting .btn-tab:last-child {
        margin-left: 12px;
    }

    #recontracting .btn-tab.active {
        border: solid 2px #0070c9;
    }


#recontracting .control-height {
    height: 47px !important;
}

#recontracting .sign-box {
    width: 100%;
    height: 365px;
    border-radius: 4px;
    cursor: crosshair;
    border: solid 1px #d1d7e0;
    background-color: rgba(209, 215, 224, 0.15);
}

#recontracting .termsDiv {
    width: 100%;
    height: 375px;
    margin: 8px 0 0px;
    padding: 18px 3px 3px 24px;
    border-radius: 4px;
    border: solid 1px #d1d7e0;
    overflow-y: auto;
}

#recontracting .recontracting-checkbox-container .checkbox {
    width: 100%;
    border: none;
    color: black;
    box-shadow: none;
    position: relative;
    margin-top: 0px !important;
}

#recontracting .otpText {
    color: #5A6F84;
}

#recontracting .btnCancel {
    background-color: #4B4B4B;
    color: white;
    font-size: 16px;
    font-weight: bold;
    max-width: 120px;
}

#recontracting .btnConfirm {
    color: white;
    font-size: 16px;
    font-weight: bold;
    max-width: 275px;
    background-color: #E6007E;
}

#recontracting .img_arrow {
    height: 70%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
}

#recontracting .recontracting-checkbox-container .checkbox label {
    width: 100%;
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: #333333;
    display: block;
    margin-bottom: 0.625rem;
    border: none;
}

#recontracting .recontracting-checkbox-container .checkbox input {
    width: 16px;
}

#recontracting .card-packages-container {
    margin-top: 16px;
}

#recontracting .card-package.subscriptions {
    max-width: 356px;
    width: 100%;
    min-height: 295px;
    border: 1px solid #E1E6EC;
    height: 100%;
    margin: 0;
    border-radius: 12px;
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 0 24px;
}

    #recontracting .card-package.subscriptions hr {
        width: 100%;
    }

    #recontracting .card-package.subscriptions .ribbon-default-pink {
        background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/pink-ribbon.png');
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 310px;
        min-height: 10px;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, -5px);
        padding: 0 45px;
        padding-top: 4px;
        text-align: center;
        z-index: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 4px;
    }


    #recontracting .card-package.subscriptions .ribbon-default-gray {
        background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/gray-ribbon.png');
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        width: 310px;
        min-height: 10px;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, -5px);
        padding: 0 45px;
        padding-top: 4px;
        text-align: center;
        z-index: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 4px;
    }

    #recontracting .card-package.subscriptions .ribbon-default h4,
    #recontracting .card-package.subscriptions .ribbon-default label {
        display: none;
    }

    #recontracting .card-package.subscriptions .ribbon-default.active {
        background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/pink-ribbon.png');
        min-height: 46px;
        transform: translate(-50%, -8px);
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

        #recontracting .card-package.subscriptions .ribbon-default.active h4 {
            display: block;
            color: #fff;
            font-weight: bold;
            font-size: 14px;
            padding: 0;
            margin: 0;
            line-height: 1;
        }

        #recontracting .card-package.subscriptions .ribbon-default.active label {
            display: block;
            color: #fff;
            font-weight: normal;
            font-size: 12px;
            padding: 0;
            margin: 0;
            line-height: 1;
        }

    #recontracting .card-package.subscriptions .card-package-header h3 {
        margin-top: 16px;
        margin-bottom: 0px;
        padding: 0 30px;
        color: #11120e;
        font-size: 30px;
        font-weight: bold;
    }

        #recontracting .card-package.subscriptions .card-package-header h3.text-center {
            margin-top: 28px;
            margin-bottom: 16px;
            padding: 0 24px;
            color: #11120e;
            font-size: 18px;
            font-weight: bold;
        }

        #recontracting .card-package.subscriptions .card-package-header h3 span {
            font-size: 14px;
            font-weight: normal;
            color: #11120e;
            padding: 0;
            margin: 0;
        }

    #recontracting .card-package.subscriptions .card-package-details {
        padding: 12px 0;
        max-height: 250px;
        overflow-y: auto;
        margin-bottom: 16px;
    }

        #recontracting .card-package.subscriptions .card-package-details ul {
            padding: 0;
            list-style: none;
        }

            #recontracting .card-package.subscriptions .card-package-details ul li {
                padding: 0;
                font-size: 14px;
                font-weight: normal;
                color: #4f6f88;
            }

                /*#recontracting .card-package.subscriptions .card-package-details ul li:nth-child(odd) {
                    background-color: #F9FAFB;
                }*/

                #recontracting .card-package.subscriptions .card-package-details ul li:before {
                    content: '';
                    color: #4f6f88;
                    font-weight: 700;
                    font-size: 14px;
                    content: '✓';
                    margin-right: 10px;
                    margin-left: 0;
                }

    #recontracting .card-package.subscriptions .card-package-action {
        padding: 20px 0;
        margin-top: auto;
    }

        #recontracting .card-package.subscriptions .card-package-action a {
            background: #37ACE5;
            border-radius: 20px;
            width: 295px;
            display: block;
            margin: 0 auto;
            height: 40px;
            color: #fff;
            text-align: center;
            padding: 10px;
            font-size: 14px;
            border: none;
            outline: none;
            text-decoration: none;
        }

#recontracting .details-link {
    background-color: transparent !important;
    color: #37ace5 !important;
    padding: 0 !important;
}

#recontracting .title-related {
    font-size: 18px;
}



#recontracting .package-newchild {
    border: 1px solid #E2E6EB;
    border-radius: 6px;
    padding: 16px;
    max-width: 350px;
    margin-bottom: 16px;
}

    #recontracting .package-newchild h3 {
        font-size: 18px;
        font-weight: bold;
        padding: 0;
        margin: 0;
        margin-bottom: 14px;
    }

    #recontracting .package-newchild h2 {
        font-size: 24px;
        font-weight: bold;
        padding: 0;
        margin: 0;
    }

        #recontracting .package-newchild h2 span {
            font-size: 16px;
            font-weight: normal;
        }


#recontracting .package-currentchild {
    border: 1px solid #E2E6EB;
    border-radius: 6px;
    padding: 16px;
    max-width: 350px;
    margin-bottom: 16px;
}

    #recontracting .package-currentchild h3 {
        font-size: 18px;
        font-weight: bold;
        padding: 0;
        margin: 0;
        margin-bottom: 14px;
    }

    #recontracting .package-currentchild h2 {
        font-size: 24px;
        font-weight: bold;
        padding: 0;
        margin: 0;
    }

        #recontracting .package-currentchild h2 span {
            font-size: 16px;
            font-weight: normal;
        }

#recontracting .d-flex-action {
    display: flex;
    max-width: 350px;
}


#recontracting .tax {
    color: #808080;
    font-size: 14px;
    margin: 16px 0;
}

#recontracting .div_same_child {
    border-radius: 10px;
    border: 1.136px solid #E2E2E2;
    background: #F8F8F8;
    font-size: 14px;
    width: 318px;
    height: 69px;
    padding: 15px;
}

#recontracting .nextBillRun {
    font-size: 14px;
    margin: 24px 0;
    padding: 10px;
    color: black;
    border-radius: 50px;
}


.recontracting-d-flex {
    margin: 48px 0px 32px 0px;
    display: flex;
    flex-wrap: wrap;
    gap: 2%;
}

.recontracting-flex-column {
    width: 18%;
    flex-direction: column;
    display: flex;
}

#recontracting .step-text {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 5px;
    color: #B0B0B0;
}


    #recontracting .step-text.active {
        color: black;
    }

#recontracting .step-progress {
    width: 100%;
    background-color: #EBEBEB;
    height: 6px;
    border-radius: 6px;
}


    #recontracting .step-progress.active {
        background-color: #55B9E8;
    }

.recontracting-flex-row {
    flex-direction: row;
}


#recontracting .align-end {
    text-align: end;
}

#recontracting .drop-shadow {
    border: 1px solid;
    padding: 10px;
    box-shadow: 0px 4px 5px #05050547;
}


#login-and-registration {
    width: 100vw;
    height: 100vh;
    /*background: url(https://www.jo.zain.com/english/PublishingImages/LoginAndRegistration/DesktopBackground.png) no-repeat;
    background-position: bottom left;
    background-size: 25vw;*/
}

    #login-and-registration .lr-header {
        width: 100%;
        justify-content: space-between;
        flex-wrap: wrap;
        align-content: center;
        background-image: url(https://www.jo.zain.com/english/PublishingImages/LoginAndRegistration/HeaderBackground.png);
        background-size: cover;
        padding: 20px;
    }

    #login-and-registration .lr-logo-container {
        text-align: center;
    }

    #login-and-registration .lr-header .lr-lang-button-container {
        text-align: center;
    }

        #login-and-registration .lr-header .lr-lang-button-container a {
            display: block;
            padding-left: 16px;
            padding-right: 16px;
            padding-top: 5px;
            padding-bottom: 5px;
            color: white;
            border-radius: 10px;
            border: 1px solid #FFF;
            background-color: transparent;
        }

    #login-and-registration .lr-header .lr-logo-container img {
        max-height: calc(10vh - 30px);
    }

    #login-and-registration .lr-header .lr-header-hidden-logo {
        visibility: hidden;
        width: 1px;
        height: 1px;
    }

    #login-and-registration .lr-body {
        width: 100%;
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 16px;
        padding-right: 16px;
    }

    #login-and-registration .lr-back-container {
        transform: translateX(-5px);
    }

        #login-and-registration .lr-back-container a {
            margin-top: 22px;
            display: flex;
            gap: 8px;
            color: black;
        }

            #login-and-registration .lr-back-container a:hover, #login-and-registration .lr-back-container a:active {
                text-decoration: none;
            }


            #login-and-registration .lr-back-container a img {
                width: 6px;
                height: 22px;
                display: inline-block;
            }

    #login-and-registration .lr-login-tab-switcher-container {
        margin-top: 22px;
    }


    #login-and-registration .lr-login-tab-switcher {
        list-style: none;
        margin: 0px;
        padding: 0px;
        display: flex;
        width: 100%;
    }

        #login-and-registration .lr-login-tab-switcher li {
            display: block;
            flex: 1;
            border-bottom: 2px solid #CDCDCD;
            list-style: none;
        }

            #login-and-registration .lr-login-tab-switcher li.active {
                border-bottom: 6px solid #5BAAE0;
            }




        #login-and-registration .lr-login-tab-switcher .lr-tab-hyperlink {
            color: #A0A0A0;
            text-align: center;
            font-size: 25px;
            font-style: normal;
            line-height: normal;
            display: block;
            width: 100%;
            padding: 10px;
        }

            #login-and-registration .lr-login-tab-switcher .lr-tab-hyperlink:hover, #login-and-registration .lr-login-tab-switcher .lr-tab-hyperlink:focus, #login-and-registration .lr-login-tab-switcher .lr-tab-hyperlink:active {
                text-decoration: none;
            }


            #login-and-registration .lr-login-tab-switcher .lr-tab-hyperlink.active {
                font-weight: bold;
                color: black;
            }

    #login-and-registration .lr-body .lr-form-group {
        margin-top: 20px;
        margin-bottom: 5px;
    }

        #login-and-registration .lr-body .lr-form-group .lr-form-label {
            margin-bottom: 6px;
            color: #414141;
        }

        #login-and-registration .lr-body .lr-form-group .lr-form-input {
            border: 1px solid #979797;
            background: #FFF;
            height: 40px;
            outline: none;
            box-shadow: none;
            transition: unset;
        }

            #login-and-registration .lr-body .lr-form-group .lr-form-input::placeholder {
                color: #898EA2;
                font-size: 12px !important;
            }

        #login-and-registration .lr-body .lr-form-group .lr-form-input-container {
            position: relative;
        }

        #login-and-registration .lr-body .lr-form-group .lr-informative-sign {
            position: absolute;
            display: block;
            background: url(https://www.jo.zain.com/english/PublishingImages/LoginAndRegistration/info.svg) no-repeat center;
            background-size: 20px;
            width: 8%;
            height: 40px;
            left: 92%;
            top: 0;
        }

        #login-and-registration .lr-body .lr-form-group .lr-password-eye {
            position: absolute;
            display: block;
            background: url(https://www.jo.zain.com/english/PublishingImages/LoginAndRegistration/visibility_off.svg) no-repeat center;
            background-size: 20px;
            width: 8%;
            height: 40px;
            left: 92%;
            top: 0;
        }

            #login-and-registration .lr-body .lr-form-group .lr-password-eye.visible {
                background: url(https://www.jo.zain.com/english/PublishingImages/LoginAndRegistration/visibility_on.svg) no-repeat center;
                background-size: 20px;
            }

        #login-and-registration .lr-body .lr-form-group .lr-form-input-invalid {
            border: 1px solid #b10000;
            animation: lr-shake 0.2s ease-in-out 0s 2;
        }

    #login-and-registration .lr-body .lr-forget-password-container {
        width: 100%;
        display: flex;
        justify-content: flex-end;
        margin-bottom: 16px;
    }

        #login-and-registration .lr-body .lr-forget-password-container .lr-forget-password-button {
            font-size: 12px;
            color: #898EA2;
            text-decoration: underline;
        }

    #login-and-registration .lr-body .lr-login-button {
        width: 100%;
        color: white;
        border-radius: 5px;
        margin-bottom: 16px;
    }

    #login-and-registration .lr-body .lr-login-with-text {
        display: flex;
        gap: 8px;
        color: #898EA2;
        font-size: 12px;
        width: 100%;
        margin-bottom: 16px;
    }

        #login-and-registration .lr-body .lr-login-with-text::before, #login-and-registration .lr-body .lr-login-with-text::after {
            flex: 1;
            align-self: center;
            height: 1px;
            background-color: #979797;
            content: " ";
        }

    #login-and-registration .lr-body .lr-social-media-login-container {
        display: flex;
        gap: 12px;
        margin-bottom: 16px;
    }

        #login-and-registration .lr-body .lr-social-media-login-container button {
            flex: 1;
            border-radius: 5px;
            display: flex;
            gap: 4px;
            border-color: transparent;
            padding: 10px;
        }

        #login-and-registration .lr-body .lr-social-media-login-container .lr-facebook-login {
            background: #4267B2;
        }

            #login-and-registration .lr-body .lr-social-media-login-container .lr-facebook-login::before {
                width: 20%;
                height: 100%;
                background: url(https://www.jo.zain.com/Style%20Library/en-us/Images/assets/images/social/facebook-wt.png) no-repeat center;
                background-size: 10px;
                content: " ";
            }

        #login-and-registration .lr-body .lr-social-media-login-container .lr-google-login {
            background: white;
            border-color: #979797;
            color: black;
        }

            #login-and-registration .lr-body .lr-social-media-login-container .lr-google-login::before {
                width: 20%;
                height: 100%;
                background: url(https://www.jo.zain.com/Style%20Library/en-us/Images/assets/images/google-icon.jpg) no-repeat center;
                background-size: 30px;
                content: " ";
            }

        #login-and-registration .lr-body .lr-social-media-login-container .lr-x-login {
            background: black;
        }

            #login-and-registration .lr-body .lr-social-media-login-container .lr-x-login::before {
                width: 20%;
                height: 100%;
                background: url(https://www.jo.zain.com/english/PublishingImages/LoginAndRegistration/X.png) no-repeat center;
                background-size: 18px;
                content: " ";
            }

    #login-and-registration .lr-body .lr-no-account-text-container {
        display: flex;
        justify-content: center;
        gap: 8px;
        padding-top: 16px;
        border-top: 1px solid #E3E3E3;
        color: #898EA2;
    }

        #login-and-registration .lr-body .lr-no-account-text-container .lr-register-link {
            color: #5BAAE0;
            text-decoration: none;
            font-weight: bold;
        }


    #login-and-registration .lr-login-error {
        display: flex;
        gap: 12px;
        margin-top: 14px;
        background: #FEFBF2;
        border: 1px solid #EBDFBD;
        border-radius: 6px;
        color: black;
        font-size: 14px;
    }

        #login-and-registration .lr-login-error a {
            color: #5BAAE0;
            text-decoration: none;
            font-weight: bold;
        }

        #login-and-registration .lr-login-error p {
            margin-bottom: 0px;
        }

        #login-and-registration .lr-login-error img {
            display: block;
            width: 30px;
            height: 30px;
            align-self: center;
        }

        #login-and-registration .lr-login-error .lr-login-error-text-container {
            font-weight: bold;
            flex: 1;
            align-self: center;
        }

    #login-and-registration #failed-login-modal .modal-dialog {
        max-width: 500px;
        margin-top: 30vh;
        margin-left: auto;
        margin-right: auto;
    }

    #login-and-registration #failed-login-modal p {
        margin-bottom: 8px;
    }

    #login-and-registration #failed-login-modal .lr-modal-button {
        width: 100%;
        margin-top: 12px;
        display: flex;
        text-align: center;
        justify-content: center;
        align-items: center;
        background: #5BAAE0;
        border-color: #5BAAE0;
        border-radius: 6px;
        padding: 6px;
        gap: 5px;
        font-size: 16px;
    }

        #login-and-registration #failed-login-modal .lr-modal-button img {
            width: 22px;
            height: 22px;
        }

        #login-and-registration #failed-login-modal .lr-modal-button p {
            margin-bottom: 0px;
        }

    #login-and-registration #failed-login-modal .modal-body {
        text-align: center;
    }

    #login-and-registration #failed-login-modal .lr-modal-title {
        font-weight: bold;
        font-size: 20px;
    }

    #login-and-registration #failed-login-modal .lr-modal-warning {
        color: #E22323;
        font-weight: bold;
    }

    #login-and-registration .lr-otp-title, #login-and-registration .lr-change-reference-title, #login-and-registration .lr-reset-password-header, #login-and-registration .lr-registration-header {
        margin-top: 16px;
        font-size: 26px;
        font-weight: bold;
        text-align: center;
    }

    #login-and-registration .lr-otp-subtitle {
        margin-top: 16px;
        font-size: 16px;
        text-align: center;
    }

    #login-and-registration .lr-otp-number-container {
        display: flex;
        gap: 12px;
        justify-content: space-between;
        margin-bottom: 12px;
        align-items: flex-end;
    }

        #login-and-registration .lr-otp-number-container .lr-otp-number {
            text-align: center;
            flex: 1;
            font-size: 26px;
            letter-spacing: 1.5px;
            font-weight: bold;
            color: #414141;
        }

    #login-and-registration .lr-form-label-otp {
        text-align: center;
        font-size: 14px;
    }

    #login-and-registration .lr-form-input-otp-container {
        display: flex;
        gap: 12px;
        flex-wrap: nowrap;
        margin-bottom: 12px;
    }

        #login-and-registration .lr-form-input-otp-container input {
            border: 1px solid #979797;
            background: #FFF;
            height: 50px;
            outline: none;
            box-shadow: none;
            transition: unset;
            text-align: center;
            border-radius: 6px;
        }

    #login-and-registration .lr-resend-otp-container {
        text-align: center;
        margin-bottom: 12px;
        font-size: 14px;
    }

    #login-and-registration .lr-otp-change-reference {
        flex: 1;
        text-align: center;
    }

    #login-and-registration .lr-otp-change-reference-super-text {
        font-size: 10px;
        margin-bottom: 4px;
        text-align: center;
    }

    #login-and-registration .lr-change-reference-otp {
        display: inline-flex;
        gap: 6px;
        border-radius: 4px;
        border: #F5F5F5;
        background: #F5F5F5;
        color: #3C3A3A;
        font-size: 12px;
        padding-left: 10px;
        padding-right: 10px;
    }

        #login-and-registration .lr-change-reference-otp:hover span {
            color: #3C3A3A;
        }

        #login-and-registration .lr-change-reference-otp img {
            width: 16px;
            height: 16px;
        }

    #login-and-registration .lr-reset-password-img-container, #login-and-registration .lr-registration-img-container {
        text-align: center;
        margin-top: 12px;
    }

        #login-and-registration .lr-reset-password-img-container img, #login-and-registration .lr-registration-img-container img {
            width: 200px;
            height: 200px;
        }

    #login-and-registration .lr-red {
        color: #CF2323;
        font-weight: bold;
    }

    #login-and-registration .lr-green {
        color: #399A43;
        font-weight: bold;
    }

    #login-and-registration #tab_QuickLogin .lr-login-button {
        margin-top: 16px;
    }

@keyframes lr-shake {
    0% {
        margin-left: 0rem;
    }

    25% {
        margin-left: 0.5rem;
    }

    75% {
        margin-left: -0.5rem;
    }

    100% {
        margin-left: 0rem;
    }
}

.my-profile-flex-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
}

.my-profile-flex-grow {
    flex-grow: 1;
}

.my-profile-h-100 {
    height: 100%;
}





@media (max-width: 767px) {

    #HomePageNew .allDeals {
        flex-wrap: wrap;
        gap: 20px;
    }

    .recontracting-d-flex {
        margin: 12px 0px 20px 0px;
    }

    #recontracting .height52 {
        height: unset;
    }

    #recontracting {
        height: unset;
    }

        #recontracting .btnClear {
            max-width: unset;
        }

        #recontracting .btnPrev {
            max-width: 145px;
        }

        #recontracting .btnSubmit {
            max-width: 180px;
            margin: 8px 10px;
        }

        #recontracting .btns-flex-container {
            display: flex;
            flex-wrap: wrap-reverse;
            gap: 16px;
        }

        #recontracting .btnCancel {
            max-width: unset;
            width: 100%;
        }

        #recontracting .btnConfirm {
            max-width: unset;
            width: 100%;
        }

        #recontracting .div_same_child {
            margin: 0 35px;
        }

    /************* Cer *********************/

    #CER .ImgFirstDescDiv {
        float: none !important;
    }

    #CER .Cer-Tab-First-Desc {
        width: 100% !important;
    }

    #CER .Cer-GreenTitleBox_ {
        text-align: center !important;
        font-size: 20px !important;
    }

    #CER .frame-zinc-img {
        display: block !important;
    }

    #CER .ZINCProgramsImgFirstDesc {
        width: 100% !important;
    }
}
/*********End of Recontracting**************/




#prospective-supplier {
    margin-top: 32px;
    margin-bottom: 32px;
}

    #prospective-supplier h1 {
        margin: 0;
        font-size: 32px;
        font-weight: bold;
        color: #11120e;
    }

    #prospective-supplier h2 {
        margin: 24px 0;
        font-size: 24px;
        font-weight: bold;
        color: #11120e;
    }

    #prospective-supplier .main-paragraph {
        margin: 24px 0 0 0;
        font-size: 21px;
        font-weight: normal;
        color: #11120e;
    }

    #prospective-supplier .subtitle {
        margin: 0;
        font-size: 18px;
        font-weight: bold;
        color: #11120e;
    }

    #prospective-supplier .subtitle {
        font-size: 21px;
        font-weight: normal;
    }

    #prospective-supplier p {
        margin-bottom: 0;
    }

    #prospective-supplier .doingbusiness-list {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0;
        flex-wrap: nowrap;
        gap: 16px;
    }

        #prospective-supplier .doingbusiness-list .title-icon-container {
            width: 56px;
            height: 56px;
            margin: 0;
            padding: 12px;
            border-radius: 12px;
            background-color: #F4EDF4;
        }

            #prospective-supplier .doingbusiness-list .title-icon-container img {
                width: 32px;
                height: 32px;
            }

        #prospective-supplier .doingbusiness-list .doingbusiness-subtitle {
            margin: 0;
            font-size: 18px;
            font-weight: bold;
            color: #11120e;
            padding-top: 4px;
        }

    #prospective-supplier .row-flex {
        display: flex;
        flex-wrap: wrap;
    }

        #prospective-supplier .row-flex .col-sm-4 {
            display: flex;
            flex-direction: column;
            margin-bottom: 24px;
        }

    #prospective-supplier .selection-registration-block {
        min-height: 140px;
        height: 100%;
        padding: 24px;
        border-radius: 12px;
        background-color: #F2F4F6;
        font-size: 16px;
    }

    #prospective-supplier .btn-register {
        font-size: 18px;
        height: 48px !important;
        border-radius: 24px;
    }

    #prospective-supplier .terms-body {
        height: 100vh;
        max-height: 300px;
        padding: 24px;
        border-radius: 4px;
        border: solid 1px #d1d7e0;
        overflow-y: auto;
    }

    #prospective-supplier .input-group {
        max-width: 480px;
    }

        #prospective-supplier .input-group > input {
            height: 36px;
            padding: 14px 16px;
            border-radius: 4px;
            border: solid 1px #d1d7e0;
            border-bottom-right-radius: 0;
            border-top-right-radius: 0;
        }

        #prospective-supplier .input-group .input-group-addon {
            padding: 0;
            border: none;
            border-radius: 4px;
            border: solid 1px #d1d7e0;
            border-left: 0;
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }

            #prospective-supplier .input-group .input-group-addon input {
                min-width: 98px;
                height: 46px;
                padding: 0;
                border-radius: 4px;
                /*border: solid 1px #d1d7e0;*/
                background-color: #edeff3;
                color: #0070c9;
                font-size: 14px;
                border-left: none;
                border-top-left-radius: 0;
                border-bottom-left-radius: 0;
            }

    #prospective-supplier .h-48 {
        height: 48px !important;
    }

    #prospective-supplier .tbTerms_OTP {
        max-width: 480px;
        height: 48px;
        padding: 14px 16px;
        border-radius: 4px;
        border: solid 1px #d1d7e0;
    }



    #prospective-supplier .prospective-progress {
        font-size: 14px;
    }

        #prospective-supplier .prospective-progress .progress {
            height: 16px;
            margin-bottom: 12px;
            overflow: unset;
            background-color: #ECEFF2;
            border-radius: 8px;
            box-shadow: none;
        }

            #prospective-supplier .prospective-progress .progress .progress-bar {
                position: relative;
                background-color: #008388;
                border-radius: 8px;
            }

        #prospective-supplier .prospective-progress span {
            width: 32px;
            height: 32px;
            background-color: #008388;
            border-radius: 50%;
            position: absolute;
            top: 0;
            right: 0;
            left: unset;
            transform: translate(16px,-8px);
        }

            #prospective-supplier .prospective-progress span img {
                vertical-align: middle;
                transform: translateY(5px);
                top: 0;
                position: relative;
            }

    #prospective-supplier .prospective-form {
        padding: 32px 24px;
        border-radius: 16px;
        background-color: #f7f9fa;
    }

    #prospective-supplier .file-group-view {
        background-color: #fff !important;
    }

    #prospective-supplier .file-group-value {
        display: none !important;
    }

    #prospective-supplier .file-group-addon {
        cursor: pointer;
        background-color: #edeff3;
        border-color: #edeff3;
        color: #0070c9;
        font-size: 14px;
        font-weight: bold;
        min-width: 85px;
    }

    #prospective-supplier .prospective-thankyou {
        margin-bottom: 40px;
    }

    #prospective-supplier .prospective-multiselect .bootstrap-select.js-select-BusinessCategory03 {
        width: 100%;
    }

    #prospective-supplier .prospective-multiselect .btn.dropdown-toggle {
        width: 100%;
        border-radius: 4px;
        height: 36px;
        padding: 6px 12px;
        font-size: 16px;
        color: #555555;
        font-weight: normal;
        line-height: 20px;
    }

    #prospective-supplier .radio-inline, #prospective-supplier .checkbox-inline {
        margin-right: 10px;
    }

    #prospective-supplier .pointer label {
        display: inline;
    }


#zain-branches {
}

    #zain-branches .zain-branches-tab-selector {
        display: flex;
        gap: 16px;
        flex-wrap: nowrap;
        list-style: none;
        padding: 0;
        margin-bottom: 16px;
    }

        #zain-branches .zain-branches-tab-selector li {
            width: 50%;
            text-align: center;
            height: 40px;
            margin: 0;
            padding: 0;
            border-radius: 4px;
            border: solid 1px #d1d7e0;
            color: #d1d7e0;
            user-select: none;
        }

            #zain-branches .zain-branches-tab-selector li a {
                color: #778CA2 !important;
                text-decoration: none !important;
                height: 40px;
                width: 100%;
                display: inline-block;
                line-height: 40px;
            }

            #zain-branches .zain-branches-tab-selector li.active {
                border-color: #37ace5 !important;
            }

                #zain-branches .zain-branches-tab-selector li.active a {
                    color: #37ace5 !important;
                }

    #zain-branches .tabpanel {
        margin-bottom: 40px;
    }

    #zain-branches .tab-container {
        border-radius: 10px;
        box-shadow: 0 0 20px 0 rgba(69, 73, 91, 0.08);
        overflow: hidden;
        min-height: 420px;
    }

    #zain-branches .tab-content {
        max-height: unset !important;
    }

    #zain-branches .list-view-container {
        padding: 16px 24px;
    }

        #zain-branches .list-view-container .zain-branches-list {
            max-height: 400px;
            overflow-y: auto;
        }

            #zain-branches .list-view-container .zain-branches-list .branch-item {
                padding-bottom: 16px;
                margin-bottom: 16px;
                border-bottom: 1px solid #f2f4f6;
            }

            #zain-branches .list-view-container .zain-branches-list .title {
                font-size: 16px;
                font-weight: bold;
                display: block;
            }

            #zain-branches .list-view-container .zain-branches-list .address,
            #zain-branches .list-view-container .zain-branches-list .weekday,
            #zain-branches .list-view-container .zain-branches-list .weekend {
                font-size: 14px;
                font-weight: normal;
                display: block;
            }

            #zain-branches .list-view-container .zain-branches-list .link-book {
                font-size: 14px;
                font-weight: bold;
                color: #37ace5 !important;
            }

            #zain-branches .list-view-container .zain-branches-list .link-navigate {
                float: right;
                margin-right: 24px;
            }

                #zain-branches .list-view-container .zain-branches-list .link-navigate img {
                    width: 24px;
                }

    #zain-branches .map-control-location {
        display: inline-block;
        width: 50px;
        height: 45px;
        padding: 10px 10px;
        text-align: center;
        border-radius: 3px;
        font-size: 20px;
        border-color: #eee;
        background-color: white;
        color: #54b8e9;
        transition: all 0.3s ease;
    }

        #zain-branches .map-control-location:hover {
            box-shadow: 0 0 5px 1px #42b7f0;
            color: #FFF;
            background-color: #42b7f0;
            border-color: #42b7f0;
        }

    #zain-branches a.link-navigate {
        border: none !important;
        text-decoration: none !important;
        outline: none !important;
        color: #37ace5 !important;
    }


#my-invoices {
}

    #my-invoices .my-invoices-header {
        display: flex;
        flex-wrap: nowrap;
    }

        #my-invoices .my-invoices-header .text-float-right {
            margin-left: auto;
        }

        #my-invoices .my-invoices-header .btn.btn-primary {
            height: 32px;
            padding: 5px 32px;
            border-radius: 20px;
            background-color: #37ace5 !important;
            font-size: 16px;
            font-weight: bold;
            color: #fff;
        }

    #my-invoices .hd-alert {
        margin-top: 16px;
        line-height: 2;
    }

        #my-invoices .hd-alert .break {
            padding-left: 16px;
            padding-right: 16px;
        }

    #my-invoices .card {
        padding: 16px 24px;
        border-radius: 5px;
        box-shadow: 0 0 20px 0 rgba(69, 73, 91, 0.08);
    }

        #my-invoices .card .card-section {
            display: flex;
            flex-wrap: nowrap;
        }

            #my-invoices .card .card-section .card-image {
                width: 72px;
                height: 72px;
                position: relative;
            }

                #my-invoices .card .card-section .card-image img {
                    width: 72px;
                    height: 72px;
                }

                #my-invoices .card .card-section .card-image .month {
                    position: absolute;
                    z-index: 1;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%,-25%);
                    font-size: 16px;
                    font-weight: 800;
                    color: #0993d7;
                }

            #my-invoices .card .card-section .card-amount {
                padding: 12px 18px;
            }

                #my-invoices .card .card-section .card-amount h4 {
                    margin: 0;
                    font-size: 21px;
                    font-weight: bold;
                    color: #333;
                }

                #my-invoices .card .card-section .card-amount p {
                    margin: 4px 0 0 0;
                    padding: 0;
                }

                    #my-invoices .card .card-section .card-amount p label {
                        font-size: 16px;
                        font-weight: normal;
                        color: #333;
                    }

                    #my-invoices .card .card-section .card-amount p .dot {
                        display: inline-block;
                        border-radius: 50%;
                        width: 5px;
                        height: 5px;
                        margin: 0 16px;
                        background-color: #778ca2;
                    }

            #my-invoices .card .card-section .card-break {
                display: none;
            }

            #my-invoices .card .card-section .card-action {
                margin-left: auto;
                display: flex;
                align-items: center;
            }

                #my-invoices .card .card-section .card-action .btn-link {
                    font-size: 16px;
                    font-weight: bold;
                    color: #37ace5 !important;
                    text-decoration: none !important;
                }

            #my-invoices .card .card-section .my-invoices-toggle-container {
                position: relative;
                width: 100%;
            }

            #my-invoices .card .card-section .collapse {
                width: 100%;
            }

            #my-invoices .card .card-section .my-invoices-toggle {
                width: 40px;
                height: 40px;
                box-shadow: 0 0 12px 0 rgba(69,73, 91, 0.08);
                border-radius: 50%;
                position: absolute;
                bottom: 0;
                left: 50%;
                transform: translate(-50%,34px);
                z-index: 1;
                background-color: #fff;
            }

            #my-invoices .card .card-section .toggle-arrow {
                display: inline-block;
                width: 10px;
                height: 10px;
                border-left: 3px solid #ccc;
                border-bottom: 3px solid #ccc;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%) rotate( 135deg );
                transition: all 0.3s ease;
            }

            #my-invoices .card .card-section .my-invoices-toggle.collapsed .toggle-arrow {
                transform: translate(-50%,-50%) rotate( -45deg );
            }

            #my-invoices .card .card-section .card-invoice-detail {
                border-top: solid 1px #e8ebef;
                padding-top: 16px;
                display: flex;
                flex-wrap: nowrap;
                gap: 8px;
            }

                #my-invoices .card .card-section .card-invoice-detail p {
                    margin: 0;
                    padding: 0;
                    width: 33%;
                }

                    #my-invoices .card .card-section .card-invoice-detail p label {
                        display: block;
                    }

                #my-invoices .card .card-section .card-invoice-detail .card-invoice-detail-title {
                    font-size: 14px;
                    font-weight: normal;
                    color: #333;
                }

                #my-invoices .card .card-section .card-invoice-detail .card-invoice-detail-value {
                    font-size: 16px;
                    font-weight: bold;
                    color: #333;
                }

                #my-invoices .card .card-section .card-invoice-detail .card-invoice-detail-action-link {
                    font-size: 14px;
                    font-weight: bold;
                    color: #37ace5 !important;
                    text-decoration: none !important;
                    cursor: pointer;
                }

#modal_my_invoices .modal-body {
    padding: 16px 24px;
}

#modal_my_invoices .modal-title {
    font-size: 18px;
    font-weight: bold;
    color: #11120e;
}

#modal_my_invoices .my-invoices-modal-item {
    display: flex;
    flex-wrap: nowrap;
}

    #modal_my_invoices .my-invoices-modal-item .title {
        width: 50%;
        font-size: 14px;
        font-weight: normal;
        text-align: left;
        color: #11120e;
    }

    #modal_my_invoices .my-invoices-modal-item .value {
        width: 50%;
        font-size: 14px;
        font-weight: bold;
        text-align: right;
        color: #11120e;
    }

#modal_my_invoices .modal-footer {
    text-align: left;
    padding: 16px 24px;
}

    #modal_my_invoices .modal-footer .my-invoices-modal-item .title,
    #modal_my_invoices .modal-footer .my-invoices-modal-item .value {
        font-size: 16px;
        font-weight: bold;
    }

    #modal_my_invoices .modal-footer .btn.btn-primary {
        height: 32px;
        margin-top: 24px;
        padding: 5px 32px;
        border-radius: 20px;
        background-color: #37ace5 !important;
        font-size: 16px;
        font-weight: bold;
        color: #fff;
    }

#my-services {
}

    #my-services .main-title {
        font-size: 24px;
        font-weight: bold;
        color: #333;
    }

    #my-services .sub-title {
        font-size: 18px;
        font-weight: bold;
        color: #333;
    }

    #my-services .card-item {
        min-height: 100px;
        margin: 24px 0;
        padding: 24px;
        border-radius: 5px;
        box-shadow: 0 0 20px 0 rgba(69, 73, 91, 0.08);
        display: flex;
        justify-content: space-between;
        justify-items: start;
        align-items: start;
        flex-wrap: nowrap;
        gap: 8px;
    }

        #my-services .card-item .card-item-column {
            display: flex;
            align-self: flex-start;
            justify-content: start;
            width: 100%;
            flex-wrap: wrap;
        }

            #my-services .card-item .card-item-column:last-child {
                display: flex;
                align-self: flex-start;
                justify-content: flex-end;
            }

        #my-services .card-item h2 {
            padding: 0;
            margin: 0;
            font-size: 18px;
            font-weight: bold;
            color: #333;
        }

        #my-services .card-item p {
            font-size: 16px;
            color: #333;
            padding: 0;
            margin: 0;
            padding-top: 16px;
            margin-top: 16px;
            width: 100%;
        }

        #my-services .card-item .myservices-repeater-add {
            display: inline-block;
            min-width: 100px;
            height: 40px;
            padding: 9px;
            border-radius: 20px;
            background-color: #37ace5;
            font-size: 16px;
            font-weight: normal;
            text-align: center;
            color: #fff !important;
            border: none !important;
            outline: none !important;
            text-decoration: none !important;
        }

            #my-services .card-item .myservices-repeater-add:last-child {
                min-width: fit-content !IMPORTANT;
            }

        #my-services .card-item .myservices-repeater-remove {
            min-width: 100px;
            font-size: 16px;
            font-weight: bold;
            text-align: center;
            color: #37ace5 !important;
            border: none !important;
            outline: none !important;
            text-decoration: none !important;
        }

        #my-services .card-item small {
            font-size: 12px;
        }

    #my-services .flex-end {
        justify-content: flex-end !important;
    }

/****************/
#zain-blog .zain-blog-header {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    justify-items: start;
    align-items: start;
}

    #zain-blog .zain-blog-header h2 {
        font-size: 32px;
        font-weight: bold;
        color: #11120e;
        margin: 0;
    }

    #zain-blog .zain-blog-header .header-action {
        text-align: right;
        position: relative;
    }

        #zain-blog .zain-blog-header .header-action .zain-blog-search {
            width: 364px;
            height: 40px;
            padding: 8px 12px 8px 16px;
            border-radius: 4px;
            border: solid 1px #d1d7e0;
            font-size: 14px;
            box-shadow: none;
        }

        #zain-blog .zain-blog-header .header-action img {
            position: absolute;
            right: 8px;
            top: 50%;
            transform: translateY(-50%);
        }

#zain-blog .zain-blog-content {
    margin-top: 24px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    justify-items: start;
    align-items: start;
    gap: 24px;
}

    #zain-blog .zain-blog-content .card-item {
        flex-basis: 364px;
        width: 364px;
        margin-bottom: 16px;
    }

        #zain-blog .zain-blog-content .card-item .card-link {
            text-decoration: none !important;
            outline: none !important;
            color: #11120e !important;
            display: block;
        }

            #zain-blog .zain-blog-content .card-item .card-link .card-image {
                height: 205px;
                overflow: hidden;
            }

            #zain-blog .zain-blog-content .card-item .card-link img {
                width: 100%;
                opacity: 1;
                transition: opacity 1s ease-in, transform 0.3s ease-in;
                transform: translate(-50%,-50%);
                top: 50%;
                left: 50%;
                position: relative;
            }

                #zain-blog .zain-blog-content .card-item .card-link img:hover {
                    transform: translate(-50%,-50%) scale(1.05);
                }

            #zain-blog .zain-blog-content .card-item .card-link .card-loader {
                display: none;
                height: 100%;
                width: 100%;
                position: relative;
            }

                #zain-blog .zain-blog-content .card-item .card-link .card-loader span {
                    height: 25px;
                    width: 25px;
                    border: 2px solid #778ca2;
                    border-radius: 50%;
                    border-bottom-color: #fff;
                    position: absolute;
                    display: block;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%,-50%) rotate(0deg);
                    animation: rotate-loading 2s linear infinite;
                }

            #zain-blog .zain-blog-content .card-item .card-link .card-image.card-loading img {
                opacity: 0;
            }

            #zain-blog .zain-blog-content .card-item .card-link .card-image.card-loading .card-loader {
                display: block;
            }

        #zain-blog .zain-blog-content .card-item .card-title h4 {
            padding: 0;
            margin: 16px 0 8px 0;
            font-size: 21px;
            font-weight: 600;
            color: #11120e;
        }

        #zain-blog .zain-blog-content .card-item .card-desc p {
            padding: 0;
            margin: 0;
            /* -webkit-line-clamp: 3; */
            /* text-overflow: ellipsis; */
            /* white-space: nowrap; */
            /* overflow: hidden; */
            font-size: 14px;
            font-weight: normal;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-overflow: ellipsis;
        }

#zain-blog .zain-blog-footer {
    margin-top: 24px;
    margin-bottom: 24px;
    text-align: center;
}

    #zain-blog .zain-blog-footer .load-more-posts {
        width: 100%;
        max-width: 199px;
        height: 48px;
        padding: 12px;
        border-radius: 24px;
        font-size: 18px !important;
        font-weight: normal !important;
        color: #1a7db4 !important;
        border: solid 1px #1a7db4 !important;
        background-color: #fff !important;
    }


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

#activate-lines .activate-lines-header {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}

    #activate-lines .activate-lines-header h1 {
        font-size: 24px;
        font-weight: 600;
        width: 50%;
        margin-top: 0;
        margin-bottom: 24px;
    }

    #activate-lines .activate-lines-header .text-float-right {
        font-size: 16px;
        font-weight: bold;
        width: 50%;
        color: #37ace5 !important;
        text-decoration: none !important;
        outline: none !important;
    }

#activate-lines .card {
    padding: 32px 40px 40px 40px;
    border-radius: 5px;
    box-shadow: 0 0 20px 0 rgba(69, 73, 91, 0.08);
    margin-bottom: 32px;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

#activate-lines .sub-card {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

#activate-lines .card.add-manual-container {
    padding: 17px 40px;
}

    #activate-lines .card.add-manual-container a {
        font-weight: bold;
        color: #37ace5 !important;
        text-decoration: none !important;
        outline: none !important;
    }

#activate-lines .card label {
    font-size: 16px;
    font-weight: normal;
}

#activate-lines .column-100 {
    width: 100%;
}

#activate-lines .column-50 {
    width: calc(50% - 8px);
}

#activate-lines .form-group {
    margin-bottom: 24px;
}

#activate-lines .form-control {
    height: 40px;
}

#activate-lines .btn.btn-primary {
    max-width: 146px;
    height: 40px;
    padding: 9px 40px;
    border-radius: 20px;
    background-color: #37ace5;
}

#activate-lines .terms {
    font-size: 14px;
    color: #000;
    max-height: 160px;
    margin: 12px 0 16px;
    padding: 6px 6px 0 16px;
    border-radius: 4px;
    border: solid 1px #d1d7e0;
    overflow-y: auto;
}

#activate-lines .sub-title {
    font-size: 21px;
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 24px;
    position: relative;
}

    #activate-lines .sub-title .activate-line-delete {
        position: absolute;
        top: 0;
        right: 0;
        cursor: pointer;
    }

#activate-lines a.file-group-view {
    font-size: 14px;
    font-weight: bold;
    color: #37ace5;
    text-decoration: none !important;
    outline: none;
    cursor: pointer;
}

#activate-lines a.file-group-view-active {
    font-size: 12px;
    font-weight: normal;
    color: #5a6f84;
    padding: 5px 4px;
    border-radius: 14px;
    background-color: #edeff3;
    text-decoration: none !important;
    outline: none;
}

    #activate-lines a.file-group-view-active span {
        display: inline-block;
        padding: 0 4px;
        max-width: 200px;
    }

        #activate-lines a.file-group-view-active span.value {
            display: inline-block;
            padding: 0 4px;
            max-width: calc(100% - 28px);
            overflow: hidden;
            text-overflow: ellipsis;
            overflow-wrap: break-word;
            line-height: 12px;
            height: 12px;
        }

        #activate-lines a.file-group-view-active span.remove {
            font-size: 16px;
            display: inline-block;
            padding: 0 4px;
            cursor: pointer;
        }

#activate-lines .has-error a.file-group-view {
    color: red !important;
}

#activate-lines .download-template a {
    font-size: 14px;
    font-weight: bold;
    color: #37ace5 !important;
    text-decoration: none !important;
    outline: none !important;
    display: inline-block;
    margin-bottom: 32px;
}

    #activate-lines .download-template a span {
        display: inline-block;
        padding: 0 8px;
    }

#activate-lines .add-bulk-paragraph {
    font-size: 16px;
    font-weight: normal;
    color: #11120e;
}

#activate-lines .file-group-box {
    display: flex;
    width: 340px;
    flex-wrap: nowrap;
    gap: 8px;
}

    #activate-lines .file-group-box .file-group-box-view,
    #activate-lines .file-group-box .file-group-box-view-active {
        width: 249px;
        height: 40px;
        padding: 11px 16px;
        border-radius: 4px;
        border: solid 1px #d1d7e0;
        overflow: hidden;
        font-size: 14px;
        font-weight: normal;
        color: #778ca2;
    }

    #activate-lines .file-group-box.has-error .file-group-box-view {
        color: red;
    }

    #activate-lines .file-group-box .file-group-box-view-active {
        padding: 6px 8px;
    }

        #activate-lines .file-group-box .file-group-box-view-active .inner {
            height: 28px;
            padding: 5px 4px;
            border-radius: 14px;
            background-color: #edeff3;
            display: inline-block;
        }

            #activate-lines .file-group-box .file-group-box-view-active .inner span {
                padding: 0px 4px;
                max-width: 200px;
                overflow: hidden;
                display: inline-block;
                text-overflow: ellipsis;
            }

                #activate-lines .file-group-box .file-group-box-view-active .inner span.remove {
                    font-size: 16px;
                    cursor: pointer;
                }

    #activate-lines .file-group-box .file-group-box-button {
        width: 80px;
        height: 40px;
        padding: 11px 16px;
        border-radius: 4px;
        border: solid 1px #37ace5 !important;
        font-size: 14px;
        font-weight: bold;
        color: #37ace5;
        background-color: #fff !important;
        outline: none !important;
    }

#activate-lines .request-header {
    margin-bottom: 16px;
}

    #activate-lines .request-header a {
        font-size: 16px;
        font-weight: 600;
        color: #37ace5 !important;
        text-decoration: none !important;
        outline: none !important;
    }

    #activate-lines .request-header label {
        font-size: 16px;
        font-weight: 600;
        color: #000;
    }

    #activate-lines .request-header span {
        padding: 0 16px;
        display: inline-block;
        font-size: 16px;
        font-weight: 600;
        color: #d1d7e0;
    }

#activate-lines .table thead tr th {
    background-color: #edeff3;
    font-size: 14px;
    font-weight: bold;
    color: #11120e;
}

#activate-lines .table tbody tr td {
    font-size: 14px;
    font-weight: normal;
    color: #11120e;
}
/****************/

/********Line Status*********/

.line-status-container {
    font-size: 16px;
    font-weight: normal;
    margin-bottom: 32px;
}

    .line-status-container .line-status-success {
        color: #008931;
    }

        .line-status-container .line-status-success .line-status-circle {
            background-color: #008931;
        }

    .line-status-container .line-status-warning {
        color: #e67619;
    }

        .line-status-container .line-status-warning .line-status-circle {
            background-color: #e67619;
        }

    .line-status-container .line-status-danger {
        color: #b10000;
    }

        .line-status-container .line-status-danger .line-status-circle {
            background-color: #b10000;
        }

    .line-status-container .line-status-circle {
        width: 8px;
        height: 8px;
        display: inline-block;
        border-radius: 50%;
    }

    .line-status-container .btn.btn-primary {
        width: auto;
        min-width: 119px;
        height: 32px;
        padding: 6px 32px;
        border-radius: 16px;
        background-color: #1d9edd;
        font-size: 14px;
        border-color: #1d9edd !important;
        box-shadow: none;
    }

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

/********Zain Internet*********/
#zain-internet {
    margin-bottom: 24px;
    margin-top: 40px;
}

    #zain-internet .row-flex {
        display: flex;
    }

    #zain-internet .column-100 {
        width: 100%;
    }

    #zain-internet .column-50 {
        width: 50%;
    }

    #zain-internet .column-25 {
        width: 25%;
    }

    #zain-internet .zain-internet-info-card {
        border-radius: 24px;
        background-color: #f9fafb;
        height: 100%;
    }

    #zain-internet .zain-internet-tabs-list ul {
        padding: 0;
        margin: 0;
        /*margin-top: 24px;*/
    }

        #zain-internet .zain-internet-tabs-list ul li {
            padding: 0;
            margin: 0;
        }

            #zain-internet .zain-internet-tabs-list ul li a {
                padding: 0;
                margin: 0;
                margin-right: 48px;
                font-size: 16px;
                font-weight: normal;
                color: #11120e;
                display: block;
                text-decoration: none !important;
                outline: none !important;
            }

            #zain-internet .zain-internet-tabs-list ul li .bar {
                width: 24px;
                height: 4px;
                background-color: #0070c9;
                display: none;
                float: left;
            }

            #zain-internet .zain-internet-tabs-list ul li.active a {
                font-weight: bold;
                color: #0070c9;
            }

            #zain-internet .zain-internet-tabs-list ul li.active .bar {
                display: inline-block;
            }

    #zain-internet .zain-internet-tabs-content {
        margin-top: 40px;
    }

        #zain-internet .zain-internet-tabs-content .tab-content {
            max-height: unset !important;
        }

    #zain-internet .zain-internet-intro {
        display: flex;
        flex-wrap: nowrap;
        gap: 120px;
        justify-content: space-between;
        align-items: center;
    }

        #zain-internet .zain-internet-intro .column-50:first-child {
            padding-right: 100px;
        }

        #zain-internet .zain-internet-intro h6.intro_subtitle {
            font-size: 19px;
            font-weight: normal;
            color: #11120e;
            padding: 0;
            margin: 0;
            margin-bottom: 8px;
        }

        #zain-internet .zain-internet-intro h2.intro_title {
            font-size: 48px;
            font-weight: bold;
            line-height: 1.25;
            color: #11120e;
            padding: 0;
            margin: 0;
            margin-bottom: 16px;
        }

    #zain-internet.portal-5g-replica .zain-internet-intro h2.intro_title {
        font-size: 36px;
    }

    #zain-internet .zain-internet-intro h4.intro_paragraph {
        font-size: 21px;
        font-weight: normal;
        color: #11120e;
        padding: 0;
        margin: 0;
    }

    #zain-internet .zain-internet-intro a.link-fiber-check-availablity {
        display: inline-block;
        margin-top: 40px;
        cursor: pointer;
        font-size: 21px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
    }

    #zain-internet .zain-internet-intro .image-container {
        border-radius: 12px;
        overflow: hidden;
    }

        #zain-internet .zain-internet-intro .image-container img {
            width: 100%;
            transform: scale(1.0);
            transform-origin: center;
            transition: all 0.5s;
        }

        #zain-internet .zain-internet-intro .image-container:hover img {
            transform: scale(1.05);
        }

    #zain-internet .zain-internet-packages {
        margin-top: 88px;
        position: relative;
    }

        #zain-internet .zain-internet-packages .zain-internet-packages-bg {
            border-radius: 24px;
            background-color: #f9fafb;
            position: absolute;
            top: 0;
            left: -65vw;
            width: 100vw;
            height: 100%;
            z-index: 0;
        }

        #zain-internet .zain-internet-packages .zain-internet-packages-slider-container {
            position: relative;
            z-index: 1;
        }

        #zain-internet .zain-internet-packages .zain-internet-packages-slider {
            margin-bottom: 24px;
            display: flex;
            gap: 14px;
            flex-wrap: nowrap;
            overflow-x: auto;
            padding: 18px;
        }

            #zain-internet .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar {
                width: 8px;
                height: 8px;
            }

                #zain-internet .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar:hover {
                    height: 10px;
                }

            #zain-internet .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-track {
                background: #f1f1f1;
            }

            #zain-internet .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-thumb {
                background: #e6007e;
                border-radius: 3px;
            }

                #zain-internet .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-thumb:hover {
                    background: #b70868;
                }

        #zain-internet .zain-internet-packages h2.packages-container-title {
            font-size: 40px;
            font-weight: bold;
            color: #11120e;
            padding: 40px 0 32px 0;
            margin: 0;
        }

        #zain-internet .zain-internet-packages .zain-internet-package-card {
            width: 310px;
            min-width: 310px;
            min-height: 400px;
            padding: 24px;
            border-radius: 24px;
            border: solid 1px #e2e6eb;
            background-color: #fff;
            display: flex;
            flex-wrap: wrap;
            align-items: flex-start;
            flex-direction: column;
            justify-content: flex-start;
            position: relative;
        }

            #zain-internet .zain-internet-packages .zain-internet-package-card.card-highlight {
                box-shadow: 0px 0px 0px 1px rgb(230, 0, 126), 0px 5px 20px -5px rgb(230, 0, 126);
            }


            #zain-internet .zain-internet-packages .zain-internet-package-card hr {
                border-top: 1px solid #e2e6eb;
                width: 100%;
                margin: 16px 0;
                padding: 0;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-title {
                display: flex;
                flex-wrap: nowrap;
                gap: 8px;
                width: 100%;
            }

                #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-title h4 {
                    margin: 0;
                    padding: 0;
                    padding-bottom: 16px;
                    font-size: 18px;
                    font-weight: 600;
                    color: #11120e;
                    min-height: 55px;
                }

                #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .popular {
                    min-width: 90px;
                    height: 24px;
                    margin: 0;
                    padding: 4px 12px;
                    border-radius: 12px;
                    background-color: #e6007e;
                    font-size: 12px;
                    font-weight: normal;
                    font-stretch: normal;
                    font-style: normal;
                    line-height: normal;
                    letter-spacing: normal;
                    color: #fff;
                    margin-left: auto;
                }

                #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .exclusive {
                    min-width: 92px;
                    height: 24px;
                    margin: 0;
                    padding: 4px 10px;
                    border-radius: 12px;
                    background-color: #e6007e;
                    font-size: 12px;
                    font-weight: normal;
                    font-stretch: normal;
                    font-style: normal;
                    line-height: normal;
                    letter-spacing: normal;
                    color: #fff;
                    margin-left: auto;
                    text-align: center;
                    display: none;
                }

            #zain-internet .zain-internet-packages .zain-internet-package-card.card-highlight .zain-internet-package-title .exclusive {
                display: inline-block;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription {
                display: flex;
                width: 100%;
                justify-content: space-between;
                align-items: flex-end;
                gap: 16px;
                position: relative;
            }

                #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h2 {
                    font-size: 36px;
                    font-weight: 600;
                    color: #11120e;
                    padding: 0;
                    margin: 0;
                }

            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount {
                background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/discount-ribbon-en.png');
                min-width: 120px;
                background-size: 100% 100%;
                background-repeat: no-repeat;
                position: absolute;
                right: -7px;
                top: 20px;
                height: 50px;
                color: #fff;
                text-align: center;
                flex-wrap: nowrap;
                justify-content: space-between;
                gap: 2px;
                align-items: center;
                padding: 0 4px 8px 12px;
                z-index: 1;
                display: none;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-title .discount {
                display: flex;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-title h4 {
                max-width: 115px;
            }



            #zain-internet .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2:after {
                content: "";
                background-color: #e6007e;
                position: absolute;
                width: 2px;
                height: 120%;
                transform: translate(-50%,-10%) rotate(45deg);
                transform-origin: center;
                z-index: 1;
                top: 0;
                left: 50%;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
            #zain-internet .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4 {
                color: #ddd;
                position: relative;
            }

                #zain-internet .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4.border-divider {
                    color: #11120e;
                }

            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-price {
                font-size: 18px;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-month {
                font-size: 12px;
                font-weight: normal;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-promo {
                font-size: 10px;
                font-weight: normal;
                width: 40px;
                line-height: 1;
                text-align: center;
                padding-left: 4px;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4 {
                font-size: 14px;
                font-weight: normal;
                color: #11120e;
                padding: 0;
                margin: 0;
            }

                #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4:first-child {
                    padding-right: 16px;
                }

                #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4:last-child {
                    text-align: right;
                    padding-left: 10px;
                    border-left: solid 1px #e2e6eb;
                    margin-left: auto;
                }

            #zain-internet .zain-internet-packages .zain-internet-package-card ul {
                padding: 0;
                margin: 0 0 16px 0;
                list-style: none;
            }

                #zain-internet .zain-internet-packages .zain-internet-package-card ul:last-child {
                    min-height: 120px;
                    margin-bottom: auto;
                    margin-top: 16px;
                }

                #zain-internet .zain-internet-packages .zain-internet-package-card ul li {
                    font-size: 14px;
                    font-weight: normal;
                    color: #4f6f88;
                }

                    #zain-internet .zain-internet-packages .zain-internet-package-card ul li:before {
                        color: #4f6f88;
                        font-weight: 700;
                        font-size: 14px;
                        content: '✓';
                        margin-right: 10px;
                        margin-left: 0;
                    }



            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-bottom {
                margin-top: auto;
                width: 100%;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .btn.btn-pink {
                width: 100% !important;
                height: 40px;
                margin-bottom: 16px;
                padding: 0 10px;
                border-radius: 20px;
                background-color: #e6007e !important;
                border-color: #e6007e !important;
                font-size: 14px !important;
                font-weight: 600 !important;
                color: #fff !important;
                outline: none !important;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card a {
                font-size: 14px;
                font-weight: bold;
                color: #e6007e !important;
                text-decoration: none !important;
                outline: none !important;
                cursor: pointer;
                display: block;
            }

                #zain-internet .zain-internet-packages .zain-internet-package-card a .showmore {
                    display: inline-block;
                }

                #zain-internet .zain-internet-packages .zain-internet-package-card a .hidemore {
                    display: none;
                }

            #zain-internet .zain-internet-packages .zain-internet-package-card .toggle-arrow svg {
                width: 22px;
                height: 22px;
                margin-bottom: -5px;
                transform: rotate(0);
                transition: all 0.3s ease;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .showmore {
                display: none;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .hidemore {
                display: inline-block;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .toggle-arrow svg {
                transform: rotate(180deg);
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-pacakge-ribbon {
                display: none;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-pacakge-ribbon {
                display: block;
                top: 0;
                position: absolute;
                background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
                background-size: contain;
                min-height: 52px;
                margin: -8px;
                width: 90%;
                text-align: center;
                color: white;
                padding-top: 10px;
                font-weight: bold;
                background-repeat: no-repeat;
            }

    #zain-internet #tab_ZainFTTR .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-pacakge-ribbon {
        display: block;
        top: 0;
        position: absolute;
        background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
        background-size: cover;
        min-height: 52px;
        margin: -8px;
        width: 90%;
        text-align: center;
        color: white;
        padding-top: 10px;
        font-weight: bold;
        background-repeat: no-repeat;
    }



    #zain-internet .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-package-title {
        margin-top: 30px;
    }

    #zain-internet .zain-internet-packages .zain-internet-package-card .zain-internet-package-icon {
        display: none;
    }

    #zain-internet .zain-internet-packages .zain-internet-package-card.card-icon .zain-internet-package-icon {
        display: block;
        margin-bottom: 20px;
    }

        #zain-internet .zain-internet-packages .zain-internet-package-card.card-icon .zain-internet-package-icon img {
            width: 100%;
        }




    #zain-internet .zain-internet-smartwifi-videos a {
        font-size: 14px;
        font-weight: bold;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
        cursor: pointer;
        display: block;
    }

    #zain-internet .zain-internet-smartwifi-videos .show-videos {
        display: inline-block;
    }

    #zain-internet .zain-internet-smartwifi-videos .hide-videos {
        display: none;
    }

    #zain-internet .zain-internet-smartwifi-videos .toggle-arrow svg {
        width: 22px;
        height: 22px;
        margin-bottom: -5px;
        transform: rotate(0);
        transition: all 0.3s ease;
    }

    #zain-internet #zain-internet-smartwifi-videos-container.collapse.in ~ a .show-videos {
        display: none;
    }

    #zain-internet #zain-internet-smartwifi-videos-container.collapse.in ~ a .hide-videos {
        display: inline-block;
    }

    #zain-internet #zain-internet-smartwifi-videos-container.collapse.in ~ a .toggle-arrow svg {
        transform: rotate(180deg);
    }

    #zain-internet .zain-internet-packages .zain-internet-packages-note {
        width: 60%;
        margin-bottom: 24px;
    }

        #zain-internet .zain-internet-packages .zain-internet-packages-note .zain-internet-packages-note-list {
            padding-left: 20px;
        }

            #zain-internet .zain-internet-packages .zain-internet-packages-note .zain-internet-packages-note-list li {
                font-size: 14px;
                font-weight: normal;
                color: #4f6f88;
            }

    #zain-internet .zain-internet-packages .fiber-packages-1y-toggle {
        position: relative;
        z-index: 1;
    }

    #zain-internet a.fiber-packages-1y-toggle {
        display: inline-block;
        margin-bottom: 40px;
        font-size: 16px;
        font-weight: bold;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
    }

        #zain-internet a.fiber-packages-1y-toggle .hide-fiber-packages {
            display: none;
        }

        #zain-internet a.fiber-packages-1y-toggle .toggle-arrow svg {
            width: 22px;
            height: 22px;
            margin-bottom: -5px;
            transform: rotate(0);
            transition: all 0.3s ease;
        }

    #zain-internet .div_rpt_ZainFiber_Packages_1Y.collapse.in ~ a.fiber-packages-1y-toggle .show-fiber-packages,
    #zain-internet #div_Broadband_1Y_0Y_Packages.collapse.in ~ a.fiber-packages-1y-toggle .show-fiber-packages {
        display: none;
    }

    #zain-internet .div_rpt_ZainFiber_Packages_1Y.collapse.in ~ a.fiber-packages-1y-toggle .hide-fiber-packages,
    #zain-internet #div_Broadband_1Y_0Y_Packages.collapse.in ~ a.fiber-packages-1y-toggle .hide-fiber-packages {
        display: inline-block;
    }

    #zain-internet .div_rpt_ZainFiber_Packages_1Y.collapse.in ~ a.fiber-packages-1y-toggle .toggle-arrow svg,
    #zain-internet #div_Broadband_1Y_0Y_Packages.collapse.in ~ a.fiber-packages-1y-toggle .toggle-arrow svg {
        transform: rotate(180deg);
    }

    #zain-internet .zain-internet-best-choice {
        margin-top: 88px;
        text-align: center;
    }

        #zain-internet .zain-internet-best-choice h2 {
            font-size: 40px;
            font-weight: bold;
            color: #11120e;
            margin: 0;
            padding: 0;
        }

        #zain-internet .zain-internet-best-choice .zain-internet-best-choice-items {
            margin-top: 64px;
            display: flex;
            flex-wrap: nowrap;
            gap: 62px;
        }

            #zain-internet .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card {
                width: 100%;
            }

                #zain-internet .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card img {
                    height: 96px;
                    margin-bottom: 32px;
                }

                #zain-internet .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card h2 {
                    font-size: 21px;
                    font-weight: bold;
                    text-align: center;
                    color: #11120e;
                    padding: 0;
                    margin-bottom: 16px;
                }

                #zain-internet .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card p {
                    font-size: 16px;
                    font-weight: normal;
                    text-align: center;
                    color: #11120e;
                }


    #zain-internet .zain-internet-wifi-features {
        margin-top: 142px;
    }

        #zain-internet .zain-internet-wifi-features .column-100 {
            width: 100%;
        }

        #zain-internet .zain-internet-wifi-features .column-50 {
            width: calc(50% - 7px);
        }

        #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row {
            display: flex;
            gap: 14px;
            flex-wrap: nowrap;
            margin-bottom: 14px;
        }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row h2 {
                padding: 0;
                margin: 0;
                margin-bottom: 40px;
                font-size: 40px;
                font-weight: bold;
                color: #11120e;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row .btn.btn-white {
                min-width: 160px;
                height: 48px;
                padding: 13px 40px;
                border-radius: 24px !important;
                border: solid 1px #11120e !important;
                background-color: #fff !important;
                outline: none !important;
                font-size: 16px;
                font-weight: 600 !important;
                color: #11120e !important;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row .row-flex {
                display: flex;
                gap: 14px;
                flex-wrap: wrap;
            }


        #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-item-card {
            /*min-height: 160px;*/
            padding: 24px;
            border-radius: 24px;
            background-color: #f9fafb;
        }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-item-card.image-container {
                padding: 48px 64px;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-item-card img {
                width: 100%;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-item-card h4 {
                padding: 0;
                margin-bottom: 12px;
                font-size: 21px;
                font-weight: bold;
                color: #11120e;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-item-card p {
                font-size: 16px;
                font-weight: normal;
                color: #11120e;
                padding: 0;
                margin: 0;
            }

    #zain-internet .zain-internet-visitors-banner-desktop {
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        padding: 48px 56px 56px 56px;
        border-radius: 12px;
        min-height: 300px;
        margin-top: 106px;
        position: relative;
    }

    #zain-internet .zain-internet-visitors-banner-mobile {
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        border-radius: 12px;
        overflow: hidden;
        margin-top: 50px;
    }


        #zain-internet .zain-internet-visitors-banner-mobile img {
            max-width: 100%;
            width: 100%;
            height: auto;
        }


    #zain-internet .zain-internet-visitors-banner-desktop .visitors-package {
        margin-top: 10px;
        position: absolute;
        top: -70px;
        box-shadow: purple 0px 0px 27px;
        border-radius: 24px;
    }

    #zain-internet .zain-internet-visitors-banner-mobile .visitors-package {
        margin-top: 30px;
        margin-bottom: 30px;
    }

        #zain-internet .zain-internet-visitors-banner-mobile .visitors-package .zain-internet-package-card {
            box-shadow: purple 0px 0px 15px;
        }

    #zain-internet .zain-internet-visitors-banner-desktop .visitors-caption {
        font-size: 24px;
        color: white;
        max-width: 30%;
        margin: 0 auto;
    }

        #zain-internet .zain-internet-visitors-banner-desktop .visitors-caption img {
            height: 45px;
        }

    #zain-internet .zain-internet-visitors-banner-desktop .zain-internet-package-card, #zain-internet .zain-internet-visitors-banner-mobile .zain-internet-package-card {
        min-width: unset;
        min-height: unset;
    }

    #zain-internet .zain-internet-visitors-banner-mobile .zain-internet-package-card {
        margin: 0 auto;
    }

        #zain-internet .zain-internet-visitors-banner-desktop .zain-internet-packages .zain-internet-package-card ul:last-child,
        #zain-internet .zain-internet-visitors-banner-mobile .zain-internet-package-card ul:last-child {
            margin-top: unset;
            text-align: initial;
        }

    #zain-internet .zain-internet-check-availablity-banner {
        background-image: url('https://www.jo.zain.com/english/PublishingImages/ZainInternet/fiber_map_check_availability.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        padding: 48px 56px 56px 56px;
        border-radius: 12px;
        overflow: hidden;
        min-height: 300px;
        margin-top: 106px;
    }

        #zain-internet .zain-internet-check-availablity-banner .zain-internet-check-availablity-banner-contnet {
            max-width: 56%;
            margin: 0 auto;
            text-align: center;
        }

        #zain-internet .zain-internet-check-availablity-banner h2 {
            padding: 0;
            margin: 0;
            margin-bottom: 48px;
            font-size: 40px;
            font-weight: bold;
            text-align: center;
            color: #fff;
        }

        #zain-internet .zain-internet-check-availablity-banner .btn.btn-white {
            min-width: 222px;
            height: 48px;
            padding: 12px 40px;
            border-radius: 24px;
            background-color: #fff !important;
            font-size: 18px !important;
            font-weight: 600 !important;
            color: #5b1f69 !important;
            border: 1px solid #fff !important;
            outline: none !important;
        }


    #zain-internet .zain-internet-jeeran {
        margin-top: 48px;
    }

    #zain-internet .zain-internet-info-row {
        display: flex;
        flex-wrap: nowrap;
        gap: 24px;
    }

        #zain-internet .zain-internet-info-row .column-60 {
            width: 60%;
        }

        #zain-internet .zain-internet-info-row .column-50 {
            width: 50%;
        }

        #zain-internet .zain-internet-info-row .column-40 {
            width: 40%;
        }

    #zain-internet .zain-internet-info-card {
        padding: 32px;
    }

        #zain-internet .zain-internet-info-card h2 {
            font-size: 24px;
            font-weight: bold;
            color: #11120e;
            padding: 0;
            margin: 0;
            margin-bottom: 16px;
        }

        #zain-internet .zain-internet-info-card p {
            padding: 0;
            margin: 0;
            margin-bottom: 24px;
            font-size: 16px;
            font-weight: normal;
            color: #11120e;
        }

        #zain-internet .zain-internet-info-card ul {
            padding: 0;
            padding: 20px;
            margin: 0;
            margin-bottom: 24px;
            font-size: 16px;
            font-weight: normal;
            color: #11120e;
        }

        #zain-internet .zain-internet-info-card a {
            display: inline-block;
            font-size: 16px !important;
            font-weight: normal !important;
            color: #0070c9 !important;
            text-decoration: none !important;
            outline: none !important;
        }

    #zain-internet .zain-internet-info-img {
        border-radius: 24px;
        overflow: hidden;
        height: 100%;
    }

        #zain-internet .zain-internet-info-img img {
            width: 100%;
            height: 100%;
        }

    #zain-internet .zain-internet-4G {
        margin-top: 88px;
    }


    #zain-internet .link-icon {
        margin: 0 8px;
        margin-top: -7px;
    }

    #zain-internet .zain-internet-packages-cards-bg {
        border-radius: 24px;
        background-color: #f9fafb;
        position: absolute;
        top: 0;
        left: 65%;
        width: 100%;
        height: 100%;
        z-index: 0;
    }

    #zain-internet .zain-internet-packages-cards {
        position: relative;
        margin-top: 88px;
        padding-top: 72px;
    }

    #zain-internet .zain-internet-packages-cards-item {
        display: flex;
        flex-wrap: nowrap;
        gap: 88px;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 64px;
        z-index: 1;
        position: relative;
    }

        #zain-internet .zain-internet-packages-cards-item h2 {
            font-size: 40px;
            font-weight: bold;
            color: #11120e;
            padding: 0;
            margin: 0;
            margin-bottom: 24px;
        }

        #zain-internet .zain-internet-packages-cards-item p {
            font-size: 21px;
            font-weight: normal;
            color: #11120e;
            margin: 0;
            padding: 0;
        }

    #zain-internet .zain-internet-packages-cards-item-img {
        width: 100%;
        border-radius: 12px;
        overflow: hidden;
    }

        #zain-internet .zain-internet-packages-cards-item-img img {
            width: 100%;
            transform: scale(1.0);
            transform-origin: center;
            transition: all 0.5s;
        }

        #zain-internet .zain-internet-packages-cards-item-img:hover img {
            transform: scale(1.05);
        }

    #zain-internet #tab_SmartWIFI .zain-internet-package-card {
        background-color: transparent;
        border: none;
        padding: 0;
        width: 180px;
        min-width: 174px;
        border-radius: 0;
        min-height: 290px;
    }

        #zain-internet #tab_SmartWIFI .zain-internet-package-card img {
            width: 100%;
            border-radius: 8px;
            border: solid 1px #e2e6eb;
            background-color: #fff;
            margin-bottom: 16px;
        }

        #zain-internet #tab_SmartWIFI .zain-internet-package-card h2 {
            padding: 0;
            margin: 16px 0;
            font-size: 16px;
            font-weight: bold;
            color: #11120e;
            margin-top: auto;
        }

        #zain-internet #tab_SmartWIFI .zain-internet-package-card p {
            padding: 0;
            margin: 0;
            font-size: 16px;
            font-weight: normal;
            color: #11120e;
            margin-top: auto;
        }

    #zain-internet #tab_SmartWIFI .zain-internet-packages-slider-container a.link-pink {
        display: inline-block;
        min-width: 236px;
        height: 48px;
        margin: 0 0 40px 0;
        padding: 13px 32px;
        text-align: center;
        border-radius: 24px;
        background-color: #e6007e !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        color: #fff !important;
        outline: none !important;
        text-decoration: none !important;
    }

    #zain-internet .zain-internet-smartwiFi-app {
        margin-top: 88px;
    }

        #zain-internet .zain-internet-smartwiFi-app h2 {
            padding: 0;
            margin: 0;
            margin-bottom: 16px;
            font-size: 40px;
            font-weight: bold;
            color: #11120e;
        }

        #zain-internet .zain-internet-smartwiFi-app p {
            padding: 0;
            margin: 0;
            margin-bottom: 40px;
            font-size: 21px;
            font-weight: normal;
            color: #11120e;
        }

        #zain-internet .zain-internet-smartwiFi-app .btn.btn-white {
            display: inline-block;
            min-width: 256px;
            height: 48px;
            padding: 13px 40px;
            border-radius: 24px;
            border: solid 1px #11120e !important;
            font-size: 16px !important;
            font-weight: 600 !important;
            color: #11120e !important;
            text-decoration: none !important;
            outline: none !important;
            cursor: pointer;
        }

        #zain-internet .zain-internet-smartwiFi-app img {
            width: 216px;
        }

    #zain-internet .zain-internet-smartwifi-videos {
        margin-top: 88px;
    }

        #zain-internet .zain-internet-smartwifi-videos h2 {
            padding: 0;
            margin: 0 0 48px 0;
            font-size: 40px;
            font-weight: bold;
            color: #11120e;
        }


    #zain-internet .zain-internet-smartwifi-videos-container {
        margin-bottom: 32px;
        display: flex;
        flex-wrap: wrap;
        gap: 32px;
        justify-content: flex-start;
        overflow: hidden;
    }

    #zain-internet .zain-internet-smartwifi-videos-item {
        position: relative;
        width: calc(33% - 24px);
        min-width: 240px;
    }

        #zain-internet .zain-internet-smartwifi-videos-item iframe {
            width: 100%;
            height: 100%;
            min-height: 200px;
        }

    #zain-internet .zain-internet-smartwifi-videos-container video {
        width: 100%;
        min-width: 240px;
    }

    #zain-internet .zain-internet-smartwifi-videos-container h4 {
        padding: 0;
        margin: 24px 0 0 0;
        font-size: 18px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet .zain-internet-smartwifi-videos-container a {
        display: inline-block;
        padding: 0;
        margin: 24px 0 0 0;
        font-size: 18px;
        font-weight: bold !important;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
    }

    #zain-internet .zain-internet-smartwifi-faq {
        margin-top: 88px;
    }

        #zain-internet .zain-internet-smartwifi-faq h2 {
            padding: 0;
            margin: 16px;
            font-size: 40px;
            font-weight: bold;
            color: #11120e;
        }

    #zain-internet .zain-internet-smartwifi-faq-container {
        margin-top: 18px;
    }

        #zain-internet .zain-internet-smartwifi-faq-container a {
            display: flex;
            flex-wrap: nowrap;
            gap: 8px;
            justify-content: space-between;
            align-content: flex-start;
            align-items: flex-start;
            width: 100%;
            font-size: 24px !important;
            font-weight: 600 !important;
            color: #11120e !important;
            text-decoration: none !important;
            outline: none !important;
        }

            #zain-internet .zain-internet-smartwifi-faq-container a .toggle-arrow svg {
                width: 40px;
                height: 40px;
                margin-top: -10px;
                transform: rotate(0);
                transition: all 0.3s ease;
            }

            #zain-internet .zain-internet-smartwifi-faq-container a.active .toggle-arrow svg {
                transform: rotate(180deg);
            }

        #zain-internet .zain-internet-smartwifi-faq-container h4 {
            padding: 0;
            margin: 24px 0;
            font-size: 24px;
            font-weight: 600;
            color: #11120e;
        }

        #zain-internet .zain-internet-smartwifi-faq-container ul {
            margin: 0;
            padding-left: 20px;
        }

            #zain-internet .zain-internet-smartwifi-faq-container ul li {
                margin: 0;
                padding: 0;
                margin-bottom: 24px;
                font-size: 18px;
                font-weight: normal;
                color: #11120e;
            }

        #zain-internet .zain-internet-smartwifi-faq-container hr {
            width: 100%;
            margin: 0;
            border: solid 1px #e2e6eb;
        }

    #zain-internet .arrow-right-blue {
        margin-left: 6px;
    }

    #zain-internet .zain-internet-modal-backdrop {
        background-color: rgba(0,0,0,0.7);
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        z-index: -2;
        opacity: 0;
        transition: transform 0.3s ease-out, opacity 0.5s ease-out;
    }

        #zain-internet .zain-internet-modal-backdrop.active {
            z-index: 90;
            opacity: 1;
        }

    #zain-internet .zain-internet-modal {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background-color: #fff;
        z-index: 99;
        transform: translateY(100vh);
        opacity: 0;
        transition: transform 0.3s ease-out, opacity 0.5s ease-out;
        padding-top: 16px;
        overflow-y: auto;
    }

        #zain-internet .zain-internet-modal.active {
            opacity: 1;
            transform: translateY(30vh);
        }

            #zain-internet .zain-internet-modal.active.full {
                opacity: 1;
                transform: translateY(0);
                padding-top: 100px;
            }

        #zain-internet .zain-internet-modal hr {
            border: solid 1px #e2e6eb;
            margin: 24px 0;
            padding: 0;
        }

    #zain-internet .zain-internet-map-modal-container {
        display: flex;
        flex-wrap: wrap;
    }

    #zain-internet .zain-internet-map-modal-header {
        position: relative;
        height: 56px;
        width: 100%;
    }

        #zain-internet .zain-internet-map-modal-header .zain-internet-modal-close {
            position: absolute;
            right: 0;
            top: 0px;
            cursor: pointer;
        }

    #zain-internet .zain-internet-map-modal-desc {
        width: 40%;
        padding-right: 12px;
    }

        #zain-internet .zain-internet-map-modal-desc h2 {
            padding: 0;
            margin: 0;
            margin-bottom: 16px;
            font-size: 32px;
            font-weight: bold;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-modal-desc p {
            padding: 0;
            margin: 0;
            font-size: 18px;
            font-weight: normal;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-modal-desc a.zain-internet-modal-current-location {
            display: block;
            padding: 12px 0;
            margin: 0;
            font-size: 18px;
            font-weight: bold !important;
            color: #0070c9 !important;
            text-decoration: none !important;
            outline: none !important;
            cursor: pointer;
        }

            #zain-internet .zain-internet-map-modal-desc a.zain-internet-modal-current-location img {
                margin-right: 16px;
                margin-top: -4px;
            }

    #zain-internet .zain-internet-map-modal-map {
        width: 60%;
        padding-left: 12px;
    }

        #zain-internet .zain-internet-map-modal-map #google-map {
            max-height: 364px;
            height: 100vh;
        }

        #zain-internet .zain-internet-map-modal-map .btn-check-availablity-map {
            margin-top: 32px;
        }

    #zain-internet .zain-internet-map-result-success {
        max-width: 773px;
        margin-bottom: 150px;
    }

    #zain-internet .zain-internet-map-result-success-alert {
        min-height: 160px;
        padding: 24px;
        border-radius: 8px;
        border: solid 1px #d3eadb;
        background-color: #f2f9f4;
        text-align: center;
    }

        #zain-internet .zain-internet-map-result-success-alert img {
            width: 48px;
            margin-bottom: 16px;
        }

        #zain-internet .zain-internet-map-result-success-alert h4 {
            font-size: 18px;
            font-weight: bold;
            text-align: center;
            color: #008931;
            max-width: 250px;
            margin: 0 auto;
            padding: 0;
        }

    #zain-internet .zain-internet-map-address-container {
        margin-top: 48px;
    }

        #zain-internet .zain-internet-map-address-container h2 {
            margin-bottom: 16px;
            display: flex;
            flex-wrap: nowrap;
            gap: 24px;
            margin-bottom: 16px;
        }

            #zain-internet .zain-internet-map-address-container h2 span {
                font-size: 21px;
                font-weight: bold;
                color: #11120e;
            }

            #zain-internet .zain-internet-map-address-container h2 a {
                font-size: 16px;
                font-weight: bold;
                color: #0070c9 !important;
                text-decoration: none !important;
                outline: none !important;
            }

            #zain-internet .zain-internet-map-address-container h2 a {
                font-size: 16px;
                font-weight: bold;
                color: #0070c9 !important;
                text-decoration: none !important;
                outline: none !important;
                padding-top: 4px;
            }

        #zain-internet .zain-internet-map-address-container p {
            padding: 0;
            margin: 0;
            font-size: 16px;
            font-weight: normal;
            color: #11120e;
        }

    #zain-internet .zain-internet-map-packages-contianer {
        margin-top: 16px;
    }

        #zain-internet .zain-internet-map-packages-contianer h2.package-container-title {
            padding: 0;
            padding-top: 16px;
            margin: 0;
            font-size: 21px;
            font-weight: bold;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card {
            min-height: 130px;
            margin: 16px 0 0 0;
            padding: 16px 24px;
            border-radius: 8px;
            border: solid 1px #e2e6eb;
            background-color: transparent;
            transition: all 0.3s ease;
            position: relative;
        }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card hr {
                margin: 15px 0 12px;
                border: solid 1px #e2e6eb;
            }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.active {
                border: solid 2px #e6007e;
                background-color: rgba(230, 0, 126, 0.02);
            }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header {
            display: flex;
            flex-wrap: nowrap;
            gap: 16px;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header-check {
            width: 32px;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .zain-internet-package-card-header-check .img-package-empty {
            display: inline-block;
            width: 32px;
            cursor: pointer;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .zain-internet-package-card-header-check .img-package-check {
            display: none;
            width: 32px;
            cursor: pointer;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.active .zain-internet-package-card-header-check .img-package-empty {
            display: none;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.active .zain-internet-package-card-header-check .img-package-check {
            display: inline-block;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title {
            display: flex;
            flex-wrap: nowrap;
            gap: 32px;
        }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title h4 {
                margin: 0;
                padding: 0;
                padding-bottom: 8px;
                font-size: 18px;
                font-weight: 600;
                color: #11120e;
            }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title .popular {
                min-width: 75px;
                height: 24px;
                margin: 0;
                padding: 4px 12px;
                border-radius: 12px;
                background-color: #e6007e;
                font-size: 12px;
                font-weight: normal;
                font-stretch: normal;
                font-style: normal;
                line-height: normal;
                letter-spacing: normal;
                color: #fff;
                margin-left: auto;
                text-align: center;
            }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription {
            display: flex;
            width: 100%;
            justify-content: flex-start;
            align-items: flex-end;
            gap: 16px;
            position: relative;
        }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription h2 {
                font-size: 32px;
                font-weight: 600;
                color: #11120e;
                padding: 0;
                margin: 0;
            }


        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .zain-internet-package-title .discount,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card .zain-internet-package-title .discount {
            background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/discount-ribbon-en.png');
            min-width: 120px;
            background-size: 100% 100%;
            background-repeat: no-repeat;
            position: absolute;
            right: -7px;
            top: 20px;
            height: 50px;
            color: #fff;
            text-align: center;
            flex-wrap: nowrap;
            justify-content: space-between;
            gap: 2px;
            align-items: center;
            padding: 0 4px 8px 12px;
            z-index: 1;
            display: none;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-title .discount,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-title .discount {
            display: flex;
        }


        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2:after,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2:after {
            content: "";
            background-color: #e6007e;
            position: absolute;
            width: 2px;
            height: 120%;
            transform: translate(-50%,-10%) rotate(45deg);
            transform-origin: center;
            z-index: 1;
            top: 0;
            left: 50%;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4 {
            color: #ddd !important;
            position: relative;
        }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4.border-divider,
            #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4.border-divider {
                color: #11120e !important;
            }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-price,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-price {
            font-size: 18px;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-month,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-month {
            font-size: 12px;
            font-weight: normal;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-promo,
        #zain-internet .zain-internet-map-modal-broadband .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-promo {
            font-size: 10px;
            font-weight: normal;
            width: 40px;
            line-height: 1;
            text-align: center;
            padding-left: 4px;
        }


        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription h4 {
            font-size: 14px;
            font-weight: normal;
            color: #11120e;
            padding: 0;
            margin: 0;
        }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription h4:first-child {
                padding-right: 16px;
            }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription h4:last-child {
                padding-left: 10px;
                border-left: solid 1px #e2e6eb;
            }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card ul li {
            font-size: 14px;
            font-weight: normal;
            color: #4f6f88;
        }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card ul li:before {
                color: #4f6f88;
                font-weight: 700;
                font-size: 14px;
                content: '✓';
                margin-right: 10px;
                margin-left: 0;
            }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .link-black {
            font-size: 14px !important;
            font-weight: normal !important;
            color: #11120e !important;
            text-decoration: none !important;
            outline: none !important;
        }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .link-black .showmore {
                display: inline-block;
            }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .link-black .hidemore {
                display: none;
            }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .link-black .toggle-arrow svg {
                width: 22px;
                height: 22px;
                margin-bottom: -5px;
                transform: rotate(0);
                transition: all 0.3s ease;
            }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .collapse.in ~ .link-black .showmore {
            display: none;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .collapse.in ~ .link-black .hidemore {
            display: inline-block;
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card .collapse.in ~ .link-black .toggle-arrow svg {
            transform: rotate(180deg);
        }

        #zain-internet .zain-internet-map-packages-contianer .zain-internet-packages-note-list {
            padding-left: 20px;
            margin-top: 24px;
            margin-bottom: 32px;
        }

            #zain-internet .zain-internet-map-packages-contianer .zain-internet-packages-note-list li {
                font-size: 14px;
                font-weight: normal;
                color: #4f6f88;
            }

    #zain-internet a.fiber-packages-1y-toggle {
        display: inline-block;
        margin-bottom: 40px;
        font-size: 16px;
        font-weight: bold;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
    }

        #zain-internet a.fiber-packages-1y-toggle .hide-fiber-packages {
            display: none;
        }

        #zain-internet a.fiber-packages-1y-toggle .toggle-arrow svg {
            width: 22px;
            height: 22px;
            margin-bottom: -5px;
            transform: rotate(0);
            transition: all 0.3s ease;
        }

    #zain-internet .collapse.in ~ a.fiber-packages-1y-toggle .show-fiber-packages {
        display: none;
    }

    #zain-internet .collapse.in ~ a.fiber-packages-1y-toggle .hide-fiber-packages {
        display: inline-block;
    }

    #zain-internet .collapse.in ~ a.fiber-packages-1y-toggle .toggle-arrow svg {
        transform: rotate(180deg);
    }

    #zain-internet .zain-internet-map-form-contianer {
        margin-top: 40px;
    }

        #zain-internet .zain-internet-map-form-contianer h2 {
            padding: 0;
            margin: 0;
            margin-bottom: 16px;
            font-size: 21px;
            font-weight: bold;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-form-contianer p {
            padding: 0;
            margin: 0;
            margin-bottom: 24px;
            font-size: 16px;
            font-weight: normal;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-form-contianer input.form-control {
            max-width: 341px;
            width: 100%;
            height: 48px;
            margin-bottom: 32px;
            padding: 13px 16px;
            border-radius: 4px;
            border: solid 1px #e2e6eb;
            background-color: #fff;
            font-size: 16px;
        }

        #zain-internet .zain-internet-map-form-contianer .btn.btn-pink {
            max-width: 155px !important;
            height: 48px;
            padding: 12px 48px;
            border-radius: 24px;
            background-color: #e6007e;
        }

    #zain-internet .zain-internet-modal .zain-internet-map-edit-address {
        cursor: pointer;
    }

    #zain-internet .zain-internet-map-result-fail-alert {
        padding: 16px;
        border-radius: 8px;
        border: solid 1px #e2e6eb;
        background-color: #f9fafb;
        margin-bottom: 48px;
    }

        #zain-internet .zain-internet-map-result-fail-alert h4 {
            padding: 0;
            margin: 0;
            margin-bottom: 16px;
            font-size: 16px;
            font-weight: normal;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-result-fail-alert a {
            font-size: 16px;
            font-weight: bold !important;
            color: #0070c9 !important;
            text-decoration: none !important;
            outline: none !important;
            cursor: pointer;
        }


    #zain-internet .zain-internet-map-result-fail-container h2 {
        padding: 0;
        margin: 0;
        margin-bottom: 24px;
        font-size: 32px;
        font-weight: bold;
        color: #11120e;
    }

    #zain-internet .zain-internet-map-result-fail-container p {
        padding: 0;
        margin: 0;
        font-size: 21px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet .zain-internet-map-result-fail-container .btn.btn-pink {
        margin-top: 40px;
        height: 48px;
        font-size: 18px;
        font-weight: 600;
    }

    #zain-internet .zain-internet-map-result-submit {
        text-align: center;
        position: fixed;
        z-index: 99;
        background-color: #fff;
        width: 100%;
        height: 100vh;
        top: 50%;
        left: 50%;
        transform: translate(-50%,100vh);
        max-width: 624px;
        max-height: 326px;
        margin: 0;
        padding: 40px;
        border-radius: 8px;
        box-shadow: 0 2px 16px 0 rgba(0, 0, 0, 0.16);
        opacity: 0;
        transition: transform 0.3s ease-out, opacity 0.5s ease-out;
    }

        #zain-internet .zain-internet-map-result-submit.active {
            transform: translate(-50%,-50%);
            opacity: 1;
        }

        #zain-internet .zain-internet-map-result-submit .zain-internet-map-modal-header {
            height: 56px;
            width: 56px;
            position: absolute;
            right: 16px;
            top: 16px;
        }

        #zain-internet .zain-internet-map-result-submit h2 {
            padding: 0;
            margin: 16px 0 8px 0;
            font-size: 21px;
            font-weight: bold;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-result-submit p {
            margin: 0;
            padding: 0;
            font-size: 16px;
            font-weight: normal;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-result-submit > div > p {
            margin-top: 48px;
            margin-bottom: 8px;
        }

        #zain-internet .zain-internet-map-result-submit a {
            font-size: 16px !important;
            font-weight: bold !important;
            color: #0070c9 !important;
            text-decoration: none !important;
            outline: none !important;
        }

    #zain-internet .zain-internet-map-modal-broadband {
        display: flex;
        flex-wrap: wrap;
    }

        #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map h4 {
            padding: 0;
            margin: 0;
            margin-bottom: 12px;
            font-size: 18px;
            font-weight: normal;
            color: #11120e;
        }

        #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card {
            padding: 24px;
            border-radius: 8px;
            background-color: #f9fafb;
            position: relative;
        }

            #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-title h4 {
                padding: 0;
                margin: 0 0 8px;
                font-size: 18px;
                font-weight: 600;
                color: #11120e;
            }

            #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription {
                display: flex;
                flex-wrap: nowrap;
                width: 100%;
                justify-content: space-between;
                align-items: flex-end;
                gap: 16px;
                position: relative;
            }

                #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription h2 {
                    font-size: 36px;
                    font-weight: 600;
                    color: #11120e;
                    padding: 0;
                    margin: 0;
                }

                #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription h4 {
                    font-size: 14px;
                    font-weight: normal;
                    color: #11120e;
                    padding: 0;
                    margin: 0;
                }

                    #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription h4:first-child {
                        padding-right: 16px;
                    }

                    #zain-internet .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription h4:last-child {
                        text-align: right;
                        padding-left: 10px;
                        border-left: solid 1px #e2e6eb;
                        margin: 0;
                    }

    #zain-internet .promo-counter {
        text-align: center;
        display: flex;
        justify-content: center;
        margin-bottom: 8px;
    }

        #zain-internet .promo-counter .promo-counter-container {
            background-color: #fff;
            box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.05);
            border-radius: 14px;
            padding: 30px 44px;
        }

            #zain-internet .promo-counter .promo-counter-container h4 {
                font-size: 20px;
                text-align: center;
                font-weight: bold;
                color: #000;
            }

                #zain-internet .promo-counter .promo-counter-container h4 .percent {
                    color: #CE2C7B;
                    font-size: 32px;
                    font-weight: bold;
                    padding: 0 4px;
                }

            #zain-internet .promo-counter .promo-counter-container h5 {
                font-size: 22px;
                text-align: center;
                font-weight: normal;
                color: #333;
                padding: 0;
                margin: 0;
                margin-bottom: 16px;
            }

            #zain-internet .promo-counter .promo-counter-container h6 {
                color: #CE2C7B;
                font-weight: bold;
                padding: 0;
                margin: 0;
                margin-top: 16px;
                font-size: 18px;
            }

            #zain-internet .promo-counter .promo-counter-container .promo-counter-content {
                display: flex;
                flex-wrap: nowrap;
                gap: 8px;
            }



            #zain-internet .promo-counter .promo-counter-container .column {
                display: flex;
                flex-direction: column;
            }

                #zain-internet .promo-counter .promo-counter-container .column .digit {
                    font-weight: 600;
                    font-size: 52px;
                    text-align: center;
                    color: #CE2C7B;
                    line-height: 1;
                }

                #zain-internet .promo-counter .promo-counter-container .column .day {
                    font-style: normal;
                    font-weight: 400;
                    font-size: 14px;
                    text-align: center;
                    color: #898989;
                    line-height: 1;
                }

#zain-internet-fiber-thank-you-page .zain-internet-thank-you-page-body, #zain-internet-broadband-thank-you-page .zain-internet-thank-you-page-body {
    min-height: 70vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#zain-internet .zain-internet-package-card-new {
    min-width: 340px;
    max-width: 340px;
    background: #FFFFFF;
    border: 1px solid #E1E6EC;
    border-radius: 20px;
    align-self: flex-start;
}

    #zain-internet .zain-internet-package-card-new .zain-internet-package-new-inner-container {
        padding-left: 29px;
        padding-right: 29px;
    }

    #zain-internet .zain-internet-package-card-new .ribbon-no-promotion {
        margin-bottom: 24px;
        background-image: Url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderNoPromotion.svg");
        margin-top: -5px;
        height: 11px;
        margin: -6px auto;
        width: 90%;
        margin-bottom: 24px;
    }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-title-new h4 {
        font-size: 23px;
        font-weight: 600;
    }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-speed-new {
        margin-bottom: 12px;
    }


        #zain-internet .zain-internet-package-card-new .zain-internet-package-speed-new h4 {
            font-size: 30px;
            display: inline-block;
            font-weight: bold;
        }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-hr {
        margin-bottom: 12px;
        margin-top: 12px;
        height: 1px;
        border-top: 1px solid #ebf1f8;
    }


    #zain-internet .zain-internet-package-card-new .zain-internet-package-speed-new {
        margin-bottom: 12px;
    }


        #zain-internet .zain-internet-package-card-new .zain-internet-package-speed-new h4 {
            font-size: 30px;
            display: inline-block;
            font-weight: bold;
        }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-monthly-subscription-tag {
        margin-bottom: 2px;
    }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-subscription-new {
        margin-bottom: 14px;
    }

        #zain-internet .zain-internet-package-card-new .zain-internet-package-subscription-new h4 {
            font-weight: bold;
            font-size: 30px;
            display: inline;
        }

        #zain-internet .zain-internet-package-card-new .zain-internet-package-subscription-new .zain-internet-package-subscription-unit {
            font-size: 20px;
            font-weight: normal;
        }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new ul {
        padding: 0px;
        list-style: none;
        margin-bottom: 0px;
    }


    #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail {
        padding-left: 29px;
        padding-right: 29px;
        padding-top: 10px;
        padding-bottom: 10px;
        background-color: white;
        display: flex;
        align-content: center;
        align-items: center;
    }

        #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail:nth-child(odd) {
            background-color: #F9FAFB;
        }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .collapse .zain-internet-package-detail {
        background-color: #F9FAFB !important;
    }

        #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .collapse .zain-internet-package-detail:nth-child(odd) {
            background-color: white !important;
        }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .collapsing .zain-internet-package-detail {
        background-color: #F9FAFB !important;
    }

        #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .collapsing .zain-internet-package-detail:nth-child(odd) {
            background-color: white !important;
        }


    #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail:before {
        color: #E6007E;
        font-weight: 700;
        font-size: 14px;
        content: '✓';
        margin-right: 10px;
        margin-left: 0;
    }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail .zain-internet-package-details-key {
        min-width: 30%;
        text-wrap: normal;
        display: inline-block;
        width: 45%;
        font-size: 13px;
        vertical-align: central;
    }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail .zain-internet-package-details-value {
        min-width: 30%;
        text-wrap: normal;
        font-weight: bold;
        display: inline-block;
        text-align: right;
        width: 50%;
        font-size: 13px;
    }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail .zain-internet-package-img {
        margin-right: 5px;
    }

    #zain-internet .zain-internet-package-card-new .zain-internet-package-bottom-new {
        margin-top: 19px;
        width: 100%;
    }

        #zain-internet .zain-internet-package-card-new .zain-internet-package-bottom-new .btn.btn-pink {
            width: 100% !important;
            height: 40px;
            margin-bottom: 16px;
            padding: 10px;
            border-radius: 20px;
            background-color: #e6007e !important;
            border-color: #e6007e !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #fff !important;
            outline: none !important;
        }

        #zain-internet .zain-internet-package-card-new .zain-internet-package-bottom-new a {
            font-size: 14px;
            font-weight: bold;
            color: #e6007e !important;
            text-decoration: none !important;
            outline: none !important;
            cursor: pointer;
            display: block;
            text-align: center;
            margin-bottom: 14px;
        }

    #zain-internet .zain-internet-package-card-new [aria-expanded='false'] .showmore {
        display: inline-block;
    }

    #zain-internet .zain-internet-package-card-new [aria-expanded='false'] .hidemore {
        display: none;
    }

    #zain-internet .zain-internet-package-card-new .toggle-arrow svg {
        width: 22px;
        height: 22px;
        margin-bottom: -5px;
        transform: rotate(0);
        transition: all 0.3s ease;
    }

    #zain-internet .zain-internet-package-card-new [aria-expanded='true'] .showmore {
        display: none;
    }

    #zain-internet .zain-internet-package-card-new [aria-expanded='true'] .hidemore {
        display: inline-block;
    }

    #zain-internet .zain-internet-package-card-new [aria-expanded='true'] .toggle-arrow svg {
        transform: rotate(180deg);
    }


    #zain-internet .zain-internet-package-card-new.zain-internet-package-promoted .ribbon-no-promotion {
        display: none;
    }

    #zain-internet .zain-internet-package-card-new.zain-internet-package-promoted .zain-internet-package-promotion-new {
        display: block;
        background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
        min-height: 58px;
        margin: -11px auto;
        width: 92%;
        margin-bottom: 24px;
        text-align: center;
    }

        #zain-internet .zain-internet-package-card-new.zain-internet-package-promoted .zain-internet-package-promotion-new h4 {
            font-weight: bold;
            margin: 0px;
            padding-top: 10px;
            color: white;
        }

        #zain-internet .zain-internet-package-card-new.zain-internet-package-promoted .zain-internet-package-promotion-new p {
            color: white;
            padding-top: 3px;
            font-size: 11px;
        }

    #zain-internet .zain-internet-package-card-new .zain-internet-slashed {
        color: #D3D3D3;
        font-weight: normal;
        position: relative;
    }

        #zain-internet .zain-internet-package-card-new .zain-internet-slashed::after {
            content: "";
            background-color: #e6007e;
            position: absolute;
            width: 2px;
            height: 120%;
            transform: translate(-50%,-10%) rotate(45deg);
            transform-origin: center;
            z-index: 1;
            top: 0;
            left: 50%;
        }

#zain-internet .visibility-hidden {
    visibility: hidden;
}

#zain-internet.portal-5g-replica {
    margin-top: 80px;
}

#zain-internet .msisdn-lead-submission, #zain-internet .msisdn-lead-submission-2 {
    margin-bottom: 12px !important;
}

    #zain-internet .msisdn-lead-submission.invalid-form, #zain-internet .msisdn-lead-submission-2.invalid-form {
        margin-bottom: 0px !important;
        border: 1px solid #b10000 !important;
    }

#zain-internet .zain-internet-validation-error {
    display: none;
    margin-bottom: 12px !important;
    color: #b10000 !important;
}

#zain-internet.portal-5g-replica .zain-internet-best-choice .zain-internet-best-choice-items {
    margin-top: 64px;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    justify-content: space-around;
}

    #zain-internet.portal-5g-replica .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card {
        width: 100%;
        max-width: 240px;
    }

#zain-internet #tab_ZainFTTR .zain-internet-packages .zain-internet-package-card {
    WIDTH: 310PX;
    MAX-WIDTH: 310PX;
    MIN-WIDTH: 310PX;
}


#zain-internet .zain-internet-fttr-intro {
    width: 60%;
    padding-right: 0px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
}

#zain-internet .fttr-subscribe-now {
    max-width: 220px;
}

#zain-internet .zain-internet-fttr-benefits {
    background: #F9FAFB;
    padding-top: 70px;
    padding-bottom: 70px;
    position: relative;
    margin-top: 70px;
}

    #zain-internet .zain-internet-fttr-benefits .zain-internet-fttr-benefits-title {
        text-align: center;
        font-weight: bold;
        font-size: 40px;
        margin-bottom: 50px;
        position: relative;
    }

    #zain-internet .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 3.3%;
        row-gap: 30px;
        position: relative;
    }

        #zain-internet .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card {
            width: 30%;
            display: flex;
            flex-direction: column;
            padding: 40px 30px;
            gap: 23px;
            text-align: center;
            border-radius: 15px;
            border: 1px solid #F1F2F2;
            background: #FFF;
            align-items: center;
        }

            #zain-internet .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card .zain-internet-fttr-benefits-card-icon {
                max-width: 64px;
                width: 100%;
                max-height: 50px;
            }

            #zain-internet .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card .zain-internet-fttr-benefits-card-title {
                font-weight: bold;
                font-size: 21px;
                margin: 0px;
            }

            #zain-internet .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card .zain-internet-fttr-benefits-card-desc {
                font-size: 16px;
                margin: 0px;
            }

#zain-internet .zain-internet-fttr-video-container {
    width: 100%;
    margin-top: 50px;
    margin-bottom: 50px;
}

    #zain-internet .zain-internet-fttr-video-container iframe {
        width: 100%;
        height: 500px;
        max-height: 80vh;
        border-radius: 10px;
    }

#zain-internet .zain-internet-fttr-benefits-left-bg {
    border-radius: 24px;
    background-color: #f9fafb;
    position: absolute;
    top: 0;
    left: -65vw;
    width: 100vw;
    height: 100%;
    z-index: 0;
}

#zain-internet .zain-internet-fttr-benefits-right-bg {
    border-radius: 24px;
    background-color: #f9fafb;
    position: absolute;
    top: 0;
    right: -65vw;
    width: 100vw;
    height: 100%;
    z-index: 0;
}

#zain-internet .zain-internet-fttr-ad {
    display: flex;
    gap: 22px;
    margin-top: 50px;
}

#zain-internet .zain-internet-fttr-ad-image {
    width: 50%;
}

    #zain-internet .zain-internet-fttr-ad-image img {
        width: 100%;
        height: 100%;
        border-radius: 10px;
    }

#zain-internet .zain-internet-fttr-ad-card {
    border-radius: 20px;
    background: #F9FAFB;
    padding: 50px;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    gap: 30px;
    width: 70% !important;
}

    #zain-internet .zain-internet-fttr-ad-card h2 {
        font-size: 40px;
        font-weight: bold;
        margin-bottom: 0px;
    }

    #zain-internet .zain-internet-fttr-ad-card p {
        margin-bottom: 0px;
    }

    #zain-internet .zain-internet-fttr-ad-card ul {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        max-height: 70px;
        align-content: space-between;
        margin-bottom: 0px;
        padding-left: 16px;
    }

    #zain-internet .zain-internet-fttr-ad-card a {
        color: #0070C9;
        font-weight: bold;
    }

#zain-internet #tab_ZainFTTR .zain-internet-packages .zain-internet-packages-note {
    padding-bottom: 24px;
}

    #zain-internet #tab_ZainFTTR .zain-internet-packages .zain-internet-packages-note li {
        list-style: none;
        font-size: 14px;
    }

#zain-internet .zain-internet-package-card .discount-promotion {
    display: none;
}

#zain-internet .zain-internet-package-card.card-promotion .discount-promotion {
    display: block;
    background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
    background-repeat: round;
    min-height: 39px;
    margin: -8px auto;
    width: 92%;
    margin-bottom: 10px;
    text-align: center;
    color: white;
    font-size: 11px;
}

    #zain-internet .zain-internet-package-card.card-promotion .discount-promotion .promotion-header {
        margin: 0px;
        font-size: 12px;
        font-weight: bold;
        margin-top: 5px;
    }

    #zain-internet .zain-internet-package-card.card-promotion .discount-promotion .promotion-price {
        margin: 0px;
        font-size: 9px;
    }


/********Zain Internet Revamp*********/
#zain-internet-Revamp {
    margin-bottom: 24px;
    margin-top: 40px;
}

    #zain-internet-Revamp .row-flex {
        display: flex;
    }

    #zain-internet-Revamp .column-100 {
        width: 100%;
    }

    #zain-internet-Revamp .column-50 {
        width: 50%;
    }

    #zain-internet-Revamp .column-25 {
        width: 25%;
    }

    #zain-internet-Revamp .zain-internet-info-card {
        border-radius: 24px;
        background-color: #f9fafb;
        height: 100%;
    }

    #zain-internet-Revamp .zain-internet-tabs-list ul {
        padding: 0;
        margin: 0;
        /*margin-top: 24px;*/
    }

        #zain-internet-Revamp .zain-internet-tabs-list ul li {
            padding: 0;
            margin: 0;
        }

            #zain-internet-Revamp .zain-internet-tabs-list ul li a {
                padding: 0;
                margin: 0;
                margin-right: 48px;
                font-size: 16px;
                font-weight: normal;
                color: #11120e;
                display: block;
                text-decoration: none !important;
                outline: none !important;
            }

            #zain-internet-Revamp .zain-internet-tabs-list ul li .bar {
                width: 24px;
                height: 4px;
                background-color: #0070c9;
                display: none;
                float: left;
            }

            #zain-internet-Revamp .zain-internet-tabs-list ul li.active a {
                font-weight: bold;
                color: #0070c9;
            }

            #zain-internet-Revamp .zain-internet-tabs-list ul li.active .bar {
                display: inline-block;
            }

    #zain-internet-Revamp .zain-internet-tabs-content {
        margin-top: 40px;
    }

        #zain-internet-Revamp .zain-internet-tabs-content .tab-content {
            max-height: unset !important;
        }

    #zain-internet-Revamp .zain-internet-intro {
        display: flex;
        flex-wrap: nowrap;
        gap: 120px;
        justify-content: space-between;
        align-items: center;
    }

        #zain-internet-Revamp .zain-internet-intro .column-50:first-child {
            padding-right: 100px;
        }

        #zain-internet-Revamp .zain-internet-intro h6.intro_subtitle {
            font-size: 19px;
            font-weight: normal;
            color: #11120e;
            padding: 0;
            margin: 0;
            margin-bottom: 8px;
        }

        #zain-internet-Revamp .zain-internet-intro h2.intro_title {
            font-size: 48px;
            font-weight: bold;
            line-height: 1.25;
            color: #11120e;
            padding: 0;
            margin: 0;
            margin-bottom: 16px;
        }

#zain-internet.portal-5g-replica .zain-internet-intro h2.intro_title {
    font-size: 36px;
}

#zain-internet-Revamp .zain-internet-intro h4.intro_paragraph {
    font-size: 21px;
    font-weight: normal;
    color: #11120e;
    padding: 0;
    margin: 0;
}

#zain-internet-Revamp .zain-internet-intro a.link-fiber-check-availablity {
    display: inline-block;
    margin-top: 40px;
    cursor: pointer;
    font-size: 21px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #0070c9 !important;
    text-decoration: none !important;
    outline: none !important;
}

#zain-internet-Revamp .zain-internet-intro .image-container {
    border-radius: 12px;
    overflow: hidden;
}

    #zain-internet-Revamp .zain-internet-intro .image-container img {
        width: 100%;
        transform: scale(1.0);
        transform-origin: center;
        transition: all 0.5s;
    }

    #zain-internet-Revamp .zain-internet-intro .image-container:hover img {
        transform: scale(1.05);
    }

#zain-internet-Revamp .zain-internet-packages {
    margin-top: 88px;
    position: relative;
}

    #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-bg {
        border-radius: 24px;
        background-color: #f9fafb;
        position: absolute;
        top: 0;
        left: -65vw;
        width: 100vw;
        height: 100%;
        z-index: 0;
    }

    #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-slider-container {
        position: relative;
        z-index: 1;
    }

    #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-slider {
        margin-bottom: 24px;
        display: flex;
        gap: 14px;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 18px;
    }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar:hover {
                height: 10px;
            }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-track {
            background: #f1f1f1;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-thumb {
            background: #e6007e;
            border-radius: 3px;
        }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-thumb:hover {
                background: #b70868;
            }

    #zain-internet-Revamp .zain-internet-packages h2.packages-container-title {
        font-size: 40px;
        font-weight: bold;
        color: #11120e;
        padding: 40px 0 32px 0;
        margin: 0;
    }

    #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card {
        width: 310px;
        min-width: 310px;
        min-height: 400px;
        padding: 24px;
        border-radius: 24px;
        border: solid 1px #e2e6eb;
        background-color: #fff;
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
        position: relative;
    }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-highlight {
            box-shadow: 0px 0px 0px 1px rgb(230, 0, 126), 0px 5px 20px -5px rgb(230, 0, 126);
        }


        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card hr {
            border-top: 1px solid #e2e6eb;
            width: 100%;
            margin: 16px 0;
            padding: 0;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-title {
            display: flex;
            flex-wrap: nowrap;
            gap: 8px;
            width: 100%;
        }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-title h4 {
                margin: 0;
                padding: 0;
                padding-bottom: 16px;
                font-size: 18px;
                font-weight: 600;
                color: #11120e;
                min-height: 55px;
            }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .popular {
                min-width: 90px;
                height: 24px;
                margin: 0;
                padding: 4px 12px;
                border-radius: 12px;
                background-color: #e6007e;
                font-size: 12px;
                font-weight: normal;
                font-stretch: normal;
                font-style: normal;
                line-height: normal;
                letter-spacing: normal;
                color: #fff;
                margin-left: auto;
            }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .exclusive {
                min-width: 92px;
                height: 24px;
                margin: 0;
                padding: 4px 10px;
                border-radius: 12px;
                background-color: #e6007e;
                font-size: 12px;
                font-weight: normal;
                font-stretch: normal;
                font-style: normal;
                line-height: normal;
                letter-spacing: normal;
                color: #fff;
                margin-left: auto;
                text-align: center;
                display: none;
            }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-highlight .zain-internet-package-title .exclusive {
            display: inline-block;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription {
            display: flex;
            width: 100%;
            justify-content: space-between;
            align-items: flex-end;
            gap: 16px;
            position: relative;
        }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h2 {
                font-size: 36px;
                font-weight: 600;
                color: #11120e;
                padding: 0;
                margin: 0;
            }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount {
            background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/discount-ribbon-en.png');
            min-width: 120px;
            background-size: 100% 100%;
            background-repeat: no-repeat;
            position: absolute;
            right: -7px;
            top: 20px;
            height: 50px;
            color: #fff;
            text-align: center;
            flex-wrap: nowrap;
            justify-content: space-between;
            gap: 2px;
            align-items: center;
            padding: 0 4px 8px 12px;
            z-index: 1;
            display: none;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-title .discount {
            display: flex;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-title h4 {
            max-width: 115px;
        }



        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2:after {
            content: "";
            background-color: #e6007e;
            position: absolute;
            width: 2px;
            height: 120%;
            transform: translate(-50%,-10%) rotate(45deg);
            transform-origin: center;
            z-index: 1;
            top: 0;
            left: 50%;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4 {
            color: #ddd;
            position: relative;
        }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4.border-divider {
                color: #11120e;
            }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-price {
            font-size: 18px;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-month {
            font-size: 12px;
            font-weight: normal;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-promo {
            font-size: 10px;
            font-weight: normal;
            width: 40px;
            line-height: 1;
            text-align: center;
            padding-left: 4px;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4 {
            font-size: 14px;
            font-weight: normal;
            color: #11120e;
            padding: 0;
            margin: 0;
        }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4:first-child {
                padding-right: 16px;
            }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4:last-child {
                text-align: right;
                padding-left: 10px;
                border-left: solid 1px #e2e6eb;
                margin-left: auto;
            }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card ul {
            padding: 0;
            margin: 0 0 16px 0;
            list-style: none;
        }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card ul:last-child {
                min-height: 120px;
                margin-bottom: auto;
                margin-top: 16px;
            }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card ul li {
                font-size: 14px;
                font-weight: normal;
                color: #4f6f88;
            }

                #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card ul li:before {
                    color: #4f6f88;
                    font-weight: 700;
                    font-size: 14px;
                    content: '✓';
                    margin-right: 10px;
                    margin-left: 0;
                }



        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-bottom {
            margin-top: auto;
            width: 100%;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .btn.btn-pink {
            width: 100% !important;
            height: 40px;
            margin-bottom: 16px;
            padding: 0 10px;
            border-radius: 20px;
            background-color: #e6007e !important;
            border-color: #e6007e !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #fff !important;
            outline: none !important;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card a {
            font-size: 14px;
            font-weight: bold;
            color: #e6007e !important;
            text-decoration: none !important;
            outline: none !important;
            cursor: pointer;
            display: block;
        }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card a .showmore {
                display: inline-block;
            }

            #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card a .hidemore {
                display: none;
            }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .toggle-arrow svg {
            width: 22px;
            height: 22px;
            margin-bottom: -5px;
            transform: rotate(0);
            transition: all 0.3s ease;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .showmore {
            display: none;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .hidemore {
            display: inline-block;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .toggle-arrow svg {
            transform: rotate(180deg);
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-pacakge-ribbon {
            display: none;
        }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-pacakge-ribbon {
            display: block;
            top: 0;
            position: absolute;
            background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
            background-size: contain;
            min-height: 52px;
            margin: -8px;
            width: 90%;
            text-align: center;
            color: white;
            padding-top: 10px;
            font-weight: bold;
            background-repeat: no-repeat;
        }

#zain-internet-Revamp #tab_ZainFTTR .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-pacakge-ribbon {
    display: block;
    top: 0;
    position: absolute;
    background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
    background-size: cover;
    min-height: 52px;
    margin: -8px;
    width: 90%;
    text-align: center;
    color: white;
    padding-top: 10px;
    font-weight: bold;
    background-repeat: no-repeat;
}



#zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-package-title {
    margin-top: 30px;
}

#zain-internet-Revamp .zain-internet-packages .zain-internet-package-card .zain-internet-package-icon {
    display: none;
}

#zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-icon .zain-internet-package-icon {
    display: block;
    margin-bottom: 20px;
}

    #zain-internet-Revamp .zain-internet-packages .zain-internet-package-card.card-icon .zain-internet-package-icon img {
        width: 100%;
    }




#zain-internet-Revamp .zain-internet-smartwifi-videos a {
    font-size: 14px;
    font-weight: bold;
    color: #0070c9 !important;
    text-decoration: none !important;
    outline: none !important;
    cursor: pointer;
    display: block;
}

#zain-internet-Revamp .zain-internet-smartwifi-videos .show-videos {
    display: inline-block;
}

#zain-internet-Revamp .zain-internet-smartwifi-videos .hide-videos {
    display: none;
}

#zain-internet-Revamp .zain-internet-smartwifi-videos .toggle-arrow svg {
    width: 22px;
    height: 22px;
    margin-bottom: -5px;
    transform: rotate(0);
    transition: all 0.3s ease;
}

#zain-internet-Revamp #zain-internet-smartwifi-videos-container.collapse.in ~ a .show-videos {
    display: none;
}

#zain-internet-Revamp #zain-internet-smartwifi-videos-container.collapse.in ~ a .hide-videos {
    display: inline-block;
}

#zain-internet-Revamp #zain-internet-smartwifi-videos-container.collapse.in ~ a .toggle-arrow svg {
    transform: rotate(180deg);
}

#zain-internet-Revamp .zain-internet-packages .zain-internet-packages-note {
    width: 60%;
    margin-bottom: 24px;
}

    #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-note .zain-internet-packages-note-list {
        padding-left: 20px;
    }

        #zain-internet-Revamp .zain-internet-packages .zain-internet-packages-note .zain-internet-packages-note-list li {
            font-size: 14px;
            font-weight: normal;
            color: #4f6f88;
        }

#zain-internet-Revamp .zain-internet-packages .fiber-packages-1y-toggle {
    position: relative;
    z-index: 1;
}

#zain-internet-Revamp a.fiber-packages-1y-toggle {
    display: inline-block;
    margin-bottom: 40px;
    font-size: 16px;
    font-weight: bold;
    color: #0070c9 !important;
    text-decoration: none !important;
    outline: none !important;
}

    #zain-internet-Revamp a.fiber-packages-1y-toggle .hide-fiber-packages {
        display: none;
    }

    #zain-internet-Revamp a.fiber-packages-1y-toggle .toggle-arrow svg {
        width: 22px;
        height: 22px;
        margin-bottom: -5px;
        transform: rotate(0);
        transition: all 0.3s ease;
    }

#zain-internet-Revamp .div_rpt_ZainFiber_Packages_1Y.collapse.in ~ a.fiber-packages-1y-toggle .show-fiber-packages,
#zain-internet-Revamp #div_Broadband_1Y_0Y_Packages.collapse.in ~ a.fiber-packages-1y-toggle .show-fiber-packages {
    display: none;
}

#zain-internet-Revamp .div_rpt_ZainFiber_Packages_1Y.collapse.in ~ a.fiber-packages-1y-toggle .hide-fiber-packages,
#zain-internet-Revamp #div_Broadband_1Y_0Y_Packages.collapse.in ~ a.fiber-packages-1y-toggle .hide-fiber-packages {
    display: inline-block;
}

#zain-internet-Revamp .div_rpt_ZainFiber_Packages_1Y.collapse.in ~ a.fiber-packages-1y-toggle .toggle-arrow svg,
#zain-internet-Revamp #div_Broadband_1Y_0Y_Packages.collapse.in ~ a.fiber-packages-1y-toggle .toggle-arrow svg {
    transform: rotate(180deg);
}

#zain-internet-Revamp .zain-internet-best-choice {
    margin-top: 88px;
    text-align: center;
}

    #zain-internet-Revamp .zain-internet-best-choice h2 {
        font-size: 40px;
        font-weight: bold;
        color: #11120e;
        margin: 0;
        padding: 0;
    }

    #zain-internet-Revamp .zain-internet-best-choice .zain-internet-best-choice-items {
        margin-top: 64px;
        display: flex;
        flex-wrap: nowrap;
        gap: 62px;
    }

        #zain-internet-Revamp .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card {
            width: 100%;
        }

            #zain-internet-Revamp .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card img {
                height: 96px;
                margin-bottom: 32px;
            }

            #zain-internet-Revamp .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card h2 {
                font-size: 21px;
                font-weight: bold;
                text-align: center;
                color: #11120e;
                padding: 0;
                margin-bottom: 16px;
            }

            #zain-internet-Revamp .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card p {
                font-size: 16px;
                font-weight: normal;
                text-align: center;
                color: #11120e;
            }


#zain-internet-Revamp .zain-internet-wifi-features {
    margin-top: 142px;
}

    #zain-internet-Revamp .zain-internet-wifi-features .column-100 {
        width: 100%;
    }

    #zain-internet-Revamp .zain-internet-wifi-features .column-50 {
        width: calc(50% - 7px);
    }

    #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row {
        display: flex;
        gap: 14px;
        flex-wrap: nowrap;
        margin-bottom: 14px;
    }

        #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row h2 {
            padding: 0;
            margin: 0;
            margin-bottom: 40px;
            font-size: 40px;
            font-weight: bold;
            color: #11120e;
        }

        #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row .btn.btn-white {
            min-width: 160px;
            height: 48px;
            padding: 13px 40px;
            border-radius: 24px !important;
            border: solid 1px #11120e !important;
            background-color: #fff !important;
            outline: none !important;
            font-size: 16px;
            font-weight: 600 !important;
            color: #11120e !important;
        }

        #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row .row-flex {
            display: flex;
            gap: 14px;
            flex-wrap: wrap;
        }


    #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-item-card {
        /*min-height: 160px;*/
        padding: 24px;
        border-radius: 24px;
        background-color: #f9fafb;
    }

        #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-item-card.image-container {
            padding: 48px 64px;
        }

        #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-item-card img {
            width: 100%;
        }

        #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-item-card h4 {
            padding: 0;
            margin-bottom: 12px;
            font-size: 21px;
            font-weight: bold;
            color: #11120e;
        }

        #zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-item-card p {
            font-size: 16px;
            font-weight: normal;
            color: #11120e;
            padding: 0;
            margin: 0;
        }

#zain-internet-Revamp .zain-internet-visitors-banner-desktop {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 48px 56px 56px 56px;
    border-radius: 12px;
    min-height: 300px;
    margin-top: 106px;
    position: relative;
}

#zain-internet-Revamp .zain-internet-visitors-banner-mobile {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 12px;
    overflow: hidden;
    margin-top: 50px;
}


    #zain-internet-Revamp .zain-internet-visitors-banner-mobile img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }


#zain-internet-Revamp .zain-internet-visitors-banner-desktop .visitors-package {
    margin-top: 10px;
    position: absolute;
    top: -70px;
    box-shadow: purple 0px 0px 27px;
    border-radius: 24px;
}

#zain-internet-Revamp .zain-internet-visitors-banner-mobile .visitors-package {
    margin-top: 30px;
    margin-bottom: 30px;
}

    #zain-internet-Revamp .zain-internet-visitors-banner-mobile .visitors-package .zain-internet-package-card {
        box-shadow: purple 0px 0px 15px;
    }

#zain-internet-Revamp .zain-internet-visitors-banner-desktop .visitors-caption {
    font-size: 24px;
    color: white;
    max-width: 30%;
    margin: 0 auto;
}

    #zain-internet-Revamp .zain-internet-visitors-banner-desktop .visitors-caption img {
        height: 45px;
    }

#zain-internet-Revamp .zain-internet-visitors-banner-desktop .zain-internet-package-card, #zain-internet-Revamp .zain-internet-visitors-banner-mobile .zain-internet-package-card {
    min-width: unset;
    min-height: unset;
}

#zain-internet-Revamp .zain-internet-visitors-banner-mobile .zain-internet-package-card {
    margin: 0 auto;
}

    #zain-internet-Revamp .zain-internet-visitors-banner-desktop .zain-internet-packages .zain-internet-package-card ul:last-child,
    #zain-internet-Revamp .zain-internet-visitors-banner-mobile .zain-internet-package-card ul:last-child {
        margin-top: unset;
        text-align: initial;
    }

#zain-internet-Revamp .zain-internet-check-availablity-banner {
    background-image: url('https://www.jo.zain.com/english/PublishingImages/ZainInternet/fiber_map_check_availability.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 48px 56px 56px 56px;
    border-radius: 12px;
    overflow: hidden;
    min-height: 300px;
    margin-top: 106px;
}

    #zain-internet-Revamp .zain-internet-check-availablity-banner .zain-internet-check-availablity-banner-contnet {
        max-width: 56%;
        margin: 0 auto;
        text-align: center;
    }

    #zain-internet-Revamp .zain-internet-check-availablity-banner h2 {
        padding: 0;
        margin: 0;
        margin-bottom: 48px;
        font-size: 40px;
        font-weight: bold;
        text-align: center;
        color: #fff;
    }

    #zain-internet-Revamp .zain-internet-check-availablity-banner .btn.btn-white {
        min-width: 222px;
        height: 48px;
        padding: 12px 40px;
        border-radius: 24px;
        background-color: #fff !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        color: #5b1f69 !important;
        border: 1px solid #fff !important;
        outline: none !important;
    }


#zain-internet-Revamp .zain-internet-jeeran {
    margin-top: 48px;
}

#zain-internet-Revamp .zain-internet-info-row {
    display: flex;
    flex-wrap: nowrap;
    gap: 24px;
}

    #zain-internet-Revamp .zain-internet-info-row .column-60 {
        width: 60%;
    }

    #zain-internet-Revamp .zain-internet-info-row .column-50 {
        width: 50%;
    }

    #zain-internet-Revamp .zain-internet-info-row .column-40 {
        width: 40%;
    }

#zain-internet-Revamp .zain-internet-info-card {
    padding: 32px;
}

    #zain-internet-Revamp .zain-internet-info-card h2 {
        font-size: 24px;
        font-weight: bold;
        color: #11120e;
        padding: 0;
        margin: 0;
        margin-bottom: 16px;
    }

    #zain-internet-Revamp .zain-internet-info-card p {
        padding: 0;
        margin: 0;
        margin-bottom: 24px;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-info-card ul {
        padding: 0;
        padding: 20px;
        margin: 0;
        margin-bottom: 24px;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-info-card a {
        display: inline-block;
        font-size: 16px !important;
        font-weight: normal !important;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
    }

#zain-internet-Revamp .zain-internet-info-img {
    border-radius: 24px;
    overflow: hidden;
    height: 100%;
}

    #zain-internet-Revamp .zain-internet-info-img img {
        width: 100%;
        height: 100%;
    }

#zain-internet-Revamp .zain-internet-4G {
    margin-top: 88px;
}


#zain-internet-Revamp .link-icon {
    margin: 0 8px;
    margin-top: -7px;
}

#zain-internet-Revamp .zain-internet-packages-cards-bg {
    border-radius: 24px;
    background-color: #f9fafb;
    position: absolute;
    top: 0;
    left: 65%;
    width: 100%;
    height: 100%;
    z-index: 0;
}

#zain-internet-Revamp .zain-internet-packages-cards {
    position: relative;
    margin-top: 88px;
    padding-top: 72px;
}

#zain-internet-Revamp .zain-internet-packages-cards-item {
    display: flex;
    flex-wrap: nowrap;
    gap: 88px;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 64px;
    z-index: 1;
    position: relative;
}

    #zain-internet-Revamp .zain-internet-packages-cards-item h2 {
        font-size: 40px;
        font-weight: bold;
        color: #11120e;
        padding: 0;
        margin: 0;
        margin-bottom: 24px;
    }

    #zain-internet-Revamp .zain-internet-packages-cards-item p {
        font-size: 21px;
        font-weight: normal;
        color: #11120e;
        margin: 0;
        padding: 0;
    }

#zain-internet-Revamp .zain-internet-packages-cards-item-img {
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
}

    #zain-internet-Revamp .zain-internet-packages-cards-item-img img {
        width: 100%;
        transform: scale(1.0);
        transform-origin: center;
        transition: all 0.5s;
    }

    #zain-internet-Revamp .zain-internet-packages-cards-item-img:hover img {
        transform: scale(1.05);
    }

#zain-internet-Revamp .tab_SmartWIFI .zain-internet-package-card {
    background-color: transparent;
    border: none;
    padding: 0;
    width: 180px;
    min-width: 174px;
    border-radius: 0;
    min-height: 290px;
}

    #zain-internet-Revamp .tab_SmartWIFI .zain-internet-package-card img {
        width: 100%;
        border-radius: 8px;
        border: solid 1px #e2e6eb;
        background-color: #fff;
        margin-bottom: 16px;
    }

    #zain-internet-Revamp .tab_SmartWIFI .zain-internet-package-card h2 {
        padding: 0;
        margin: 16px 0;
        font-size: 16px;
        font-weight: bold;
        color: #11120e;
        margin-top: auto;
    }

    #zain-internet-Revamp .tab_SmartWIFI .zain-internet-package-card p {
        padding: 0;
        margin: 0;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
        margin-top: auto;
    }

#zain-internet-Revamp .tab_SmartWIFI .zain-internet-packages-slider-container a.link-pink {
    display: inline-block;
    min-width: 236px;
    height: 48px;
    margin: 0 0 40px 0;
    padding: 13px 32px;
    text-align: center;
    border-radius: 24px;
    background-color: #e6007e !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #fff !important;
    outline: none !important;
    text-decoration: none !important;
}

#zain-internet-Revamp .zain-internet-smartwiFi-app {
    margin-top: 88px;
}

    #zain-internet-Revamp .zain-internet-smartwiFi-app h2 {
        padding: 0;
        margin: 0;
        margin-bottom: 16px;
        font-size: 40px;
        font-weight: bold;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-smartwiFi-app p {
        padding: 0;
        margin: 0;
        margin-bottom: 40px;
        font-size: 21px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-smartwiFi-app .btn.btn-white {
        display: inline-block;
        min-width: 256px;
        height: 48px;
        padding: 13px 40px;
        border-radius: 24px;
        border: solid 1px #11120e !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        color: #11120e !important;
        text-decoration: none !important;
        outline: none !important;
        cursor: pointer;
    }

    #zain-internet-Revamp .zain-internet-smartwiFi-app img {
        width: 216px;
    }

#zain-internet-Revamp .zain-internet-smartwifi-videos {
    margin-top: 88px;
}

    #zain-internet-Revamp .zain-internet-smartwifi-videos h2 {
        padding: 0;
        margin: 0 0 48px 0;
        font-size: 40px;
        font-weight: bold;
        color: #11120e;
    }


#zain-internet-Revamp .zain-internet-smartwifi-videos-container {
    margin-bottom: 32px;
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    justify-content: flex-start;
    overflow: hidden;
}

#zain-internet-Revamp .zain-internet-smartwifi-videos-item {
    position: relative;
    width: calc(33% - 24px);
    min-width: 240px;
}

    #zain-internet-Revamp .zain-internet-smartwifi-videos-item iframe {
        width: 100%;
        height: 100%;
        min-height: 200px;
    }

#zain-internet-Revamp .zain-internet-smartwifi-videos-container video {
    width: 100%;
    min-width: 240px;
}

#zain-internet-Revamp .zain-internet-smartwifi-videos-container h4 {
    padding: 0;
    margin: 24px 0 0 0;
    font-size: 18px;
    font-weight: normal;
    color: #11120e;
}

#zain-internet-Revamp .zain-internet-smartwifi-videos-container a {
    display: inline-block;
    padding: 0;
    margin: 24px 0 0 0;
    font-size: 18px;
    font-weight: bold !important;
    color: #0070c9 !important;
    text-decoration: none !important;
    outline: none !important;
}

#zain-internet-Revamp .zain-internet-smartwifi-faq {
    margin-top: 88px;
}

    #zain-internet-Revamp .zain-internet-smartwifi-faq h2 {
        padding: 0;
        margin: 16px;
        font-size: 40px;
        font-weight: bold;
        color: #11120e;
    }

#zain-internet-Revamp .zain-internet-smartwifi-faq-container {
    margin-top: 18px;
}

    #zain-internet-Revamp .zain-internet-smartwifi-faq-container a {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        justify-content: space-between;
        align-content: flex-start;
        align-items: flex-start;
        width: 100%;
        font-size: 24px !important;
        font-weight: 600 !important;
        color: #11120e !important;
        text-decoration: none !important;
        outline: none !important;
    }

        #zain-internet-Revamp .zain-internet-smartwifi-faq-container a .toggle-arrow svg {
            width: 40px;
            height: 40px;
            margin-top: -10px;
            transform: rotate(0);
            transition: all 0.3s ease;
        }

        #zain-internet-Revamp .zain-internet-smartwifi-faq-container a.active .toggle-arrow svg {
            transform: rotate(180deg);
        }

    #zain-internet-Revamp .zain-internet-smartwifi-faq-container h4 {
        padding: 0;
        margin: 24px 0;
        font-size: 24px;
        font-weight: 600;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-smartwifi-faq-container ul {
        margin: 0;
        padding-left: 20px;
    }

        #zain-internet-Revamp .zain-internet-smartwifi-faq-container ul li {
            margin: 0;
            padding: 0;
            margin-bottom: 24px;
            font-size: 18px;
            font-weight: normal;
            color: #11120e;
        }

    #zain-internet-Revamp .zain-internet-smartwifi-faq-container hr {
        width: 100%;
        margin: 0;
        border: solid 1px #e2e6eb;
    }

#zain-internet-Revamp .arrow-right-blue {
    margin-left: 6px;
}

#zain-internet-Revamp .zain-internet-modal-backdrop {
    background-color: rgba(0,0,0,0.7);
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -2;
    opacity: 0;
    transition: transform 0.3s ease-out, opacity 0.5s ease-out;
}

    #zain-internet-Revamp .zain-internet-modal-backdrop.active {
        z-index: 90;
        opacity: 1;
    }

#zain-internet-Revamp .zain-internet-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #fff;
    z-index: 99;
    transform: translateY(100vh);
    opacity: 0;
    transition: transform 0.3s ease-out, opacity 0.5s ease-out;
    padding-top: 16px;
    overflow-y: auto;
}

    #zain-internet-Revamp .zain-internet-modal.active {
        opacity: 1;
        transform: translateY(30vh);
    }

        #zain-internet-Revamp .zain-internet-modal.active.full {
            opacity: 1;
            transform: translateY(0);
            padding-top: 100px;
        }

    #zain-internet-Revamp .zain-internet-modal hr {
        border: solid 1px #e2e6eb;
        margin: 24px 0;
        padding: 0;
    }

#zain-internet-Revamp .zain-internet-map-modal-container {
    display: flex;
    flex-wrap: wrap;
}

#zain-internet-Revamp .zain-internet-map-modal-header {
    position: relative;
    height: 56px;
    width: 100%;
}

    #zain-internet-Revamp .zain-internet-map-modal-header .zain-internet-modal-close {
        position: absolute;
        right: 0;
        top: 0px;
        cursor: pointer;
    }

#zain-internet-Revamp .zain-internet-map-modal-desc {
    width: 40%;
    padding-right: 12px;
}

    #zain-internet-Revamp .zain-internet-map-modal-desc h2 {
        padding: 0;
        margin: 0;
        margin-bottom: 16px;
        font-size: 32px;
        font-weight: bold;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-modal-desc p {
        padding: 0;
        margin: 0;
        font-size: 18px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-modal-desc a.zain-internet-modal-current-location {
        display: block;
        padding: 12px 0;
        margin: 0;
        font-size: 18px;
        font-weight: bold !important;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
        cursor: pointer;
    }

        #zain-internet-Revamp .zain-internet-map-modal-desc a.zain-internet-modal-current-location img {
            margin-right: 16px;
            margin-top: -4px;
        }

#zain-internet-Revamp .zain-internet-map-modal-map {
    width: 60%;
    padding-left: 12px;
}

    #zain-internet-Revamp .zain-internet-map-modal-map #google-map {
        max-height: 364px;
        height: 100vh;
    }

    #zain-internet-Revamp .zain-internet-map-modal-map .btn-check-availablity-map {
        margin-top: 32px;
    }

#zain-internet-Revamp .zain-internet-map-result-success {
    max-width: 773px;
    margin-bottom: 150px;
}

#zain-internet-Revamp .zain-internet-map-result-success-alert {
    min-height: 160px;
    padding: 24px;
    border-radius: 8px;
    border: solid 1px #d3eadb;
    background-color: #f2f9f4;
    text-align: center;
}

    #zain-internet-Revamp .zain-internet-map-result-success-alert img {
        width: 48px;
        margin-bottom: 16px;
    }

    #zain-internet-Revamp .zain-internet-map-result-success-alert h4 {
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        color: #008931;
        max-width: 250px;
        margin: 0 auto;
        padding: 0;
    }

#zain-internet-Revamp .zain-internet-map-address-container {
    margin-top: 48px;
}

    #zain-internet-Revamp .zain-internet-map-address-container h2 {
        margin-bottom: 16px;
        display: flex;
        flex-wrap: nowrap;
        gap: 24px;
        margin-bottom: 16px;
    }

        #zain-internet-Revamp .zain-internet-map-address-container h2 span {
            font-size: 21px;
            font-weight: bold;
            color: #11120e;
        }

        #zain-internet-Revamp .zain-internet-map-address-container h2 a {
            font-size: 16px;
            font-weight: bold;
            color: #0070c9 !important;
            text-decoration: none !important;
            outline: none !important;
        }

        #zain-internet-Revamp .zain-internet-map-address-container h2 a {
            font-size: 16px;
            font-weight: bold;
            color: #0070c9 !important;
            text-decoration: none !important;
            outline: none !important;
            padding-top: 4px;
        }

    #zain-internet-Revamp .zain-internet-map-address-container p {
        padding: 0;
        margin: 0;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

#zain-internet-Revamp .zain-internet-map-packages-contianer {
    margin-top: 16px;
}

    #zain-internet-Revamp .zain-internet-map-packages-contianer h2.package-container-title {
        padding: 0;
        padding-top: 16px;
        margin: 0;
        font-size: 21px;
        font-weight: bold;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card {
        min-height: 130px;
        margin: 16px 0 0 0;
        padding: 16px 24px;
        border-radius: 8px;
        border: solid 1px #e2e6eb;
        background-color: transparent;
        transition: all 0.3s ease;
        position: relative;
    }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card hr {
            margin: 15px 0 12px;
            border: solid 1px #e2e6eb;
        }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.active {
            border: solid 2px #e6007e;
            background-color: rgba(230, 0, 126, 0.02);
        }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header {
        display: flex;
        flex-wrap: nowrap;
        gap: 16px;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header-check {
        width: 32px;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .zain-internet-package-card-header-check .img-package-empty {
        display: inline-block;
        width: 32px;
        cursor: pointer;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .zain-internet-package-card-header-check .img-package-check {
        display: none;
        width: 32px;
        cursor: pointer;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.active .zain-internet-package-card-header-check .img-package-empty {
        display: none;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.active .zain-internet-package-card-header-check .img-package-check {
        display: inline-block;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title {
        display: flex;
        flex-wrap: nowrap;
        gap: 32px;
    }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title h4 {
            margin: 0;
            padding: 0;
            padding-bottom: 8px;
            font-size: 18px;
            font-weight: 600;
            color: #11120e;
        }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title .popular {
            min-width: 75px;
            height: 24px;
            margin: 0;
            padding: 4px 12px;
            border-radius: 12px;
            background-color: #e6007e;
            font-size: 12px;
            font-weight: normal;
            font-stretch: normal;
            font-style: normal;
            line-height: normal;
            letter-spacing: normal;
            color: #fff;
            margin-left: auto;
            text-align: center;
        }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription {
        display: flex;
        width: 100%;
        justify-content: flex-start;
        align-items: flex-end;
        gap: 16px;
        position: relative;
    }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription h2 {
            font-size: 32px;
            font-weight: 600;
            color: #11120e;
            padding: 0;
            margin: 0;
        }


    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .zain-internet-package-title .discount,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card .zain-internet-package-title .discount {
        background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/discount-ribbon-en.png');
        min-width: 120px;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        position: absolute;
        right: -7px;
        top: 20px;
        height: 50px;
        color: #fff;
        text-align: center;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 2px;
        align-items: center;
        padding: 0 4px 8px 12px;
        z-index: 1;
        display: none;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-title .discount,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-title .discount {
        display: flex;
    }


    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2:after,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2:after {
        content: "";
        background-color: #e6007e;
        position: absolute;
        width: 2px;
        height: 120%;
        transform: translate(-50%,-10%) rotate(45deg);
        transform-origin: center;
        z-index: 1;
        top: 0;
        left: 50%;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4 {
        color: #ddd !important;
        position: relative;
    }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4.border-divider,
        #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4.border-divider {
            color: #11120e !important;
        }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-price,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-price {
        font-size: 18px;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-month,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-month {
        font-size: 12px;
        font-weight: normal;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-promo,
    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-package-card-header .zain-internet-package-title .discount .discounted-promo {
        font-size: 10px;
        font-weight: normal;
        width: 40px;
        line-height: 1;
        text-align: center;
        padding-left: 4px;
    }


    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription h4 {
        font-size: 14px;
        font-weight: normal;
        color: #11120e;
        padding: 0;
        margin: 0;
    }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription h4:first-child {
            padding-right: 16px;
        }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card-header .zain-internet-package-subscription h4:last-child {
            padding-left: 10px;
            border-left: solid 1px #e2e6eb;
        }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card ul li {
        font-size: 14px;
        font-weight: normal;
        color: #4f6f88;
    }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card ul li:before {
            color: #4f6f88;
            font-weight: 700;
            font-size: 14px;
            content: '✓';
            margin-right: 10px;
            margin-left: 0;
        }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .link-black {
        font-size: 14px !important;
        font-weight: normal !important;
        color: #11120e !important;
        text-decoration: none !important;
        outline: none !important;
    }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .link-black .showmore {
            display: inline-block;
        }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .link-black .hidemore {
            display: none;
        }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .link-black .toggle-arrow svg {
            width: 22px;
            height: 22px;
            margin-bottom: -5px;
            transform: rotate(0);
            transition: all 0.3s ease;
        }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .collapse.in ~ .link-black .showmore {
        display: none;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .collapse.in ~ .link-black .hidemore {
        display: inline-block;
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card .collapse.in ~ .link-black .toggle-arrow svg {
        transform: rotate(180deg);
    }

    #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-packages-note-list {
        padding-left: 20px;
        margin-top: 24px;
        margin-bottom: 32px;
    }

        #zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-packages-note-list li {
            font-size: 14px;
            font-weight: normal;
            color: #4f6f88;
        }

#zain-internet-Revamp a.fiber-packages-1y-toggle {
    display: inline-block;
    margin-bottom: 40px;
    font-size: 16px;
    font-weight: bold;
    color: #0070c9 !important;
    text-decoration: none !important;
    outline: none !important;
}

    #zain-internet-Revamp a.fiber-packages-1y-toggle .hide-fiber-packages {
        display: none;
    }

    #zain-internet-Revamp a.fiber-packages-1y-toggle .toggle-arrow svg {
        width: 22px;
        height: 22px;
        margin-bottom: -5px;
        transform: rotate(0);
        transition: all 0.3s ease;
    }

#zain-internet-Revamp .collapse.in ~ a.fiber-packages-1y-toggle .show-fiber-packages {
    display: none;
}

#zain-internet-Revamp .collapse.in ~ a.fiber-packages-1y-toggle .hide-fiber-packages {
    display: inline-block;
}

#zain-internet-Revamp .collapse.in ~ a.fiber-packages-1y-toggle .toggle-arrow svg {
    transform: rotate(180deg);
}

#zain-internet-Revamp .zain-internet-map-form-contianer {
    margin-top: 40px;
}

    #zain-internet-Revamp .zain-internet-map-form-contianer h2 {
        padding: 0;
        margin: 0;
        margin-bottom: 16px;
        font-size: 21px;
        font-weight: bold;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-form-contianer p {
        padding: 0;
        margin: 0;
        margin-bottom: 24px;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-form-contianer input.form-control {
        max-width: 341px;
        width: 100%;
        height: 48px;
        margin-bottom: 32px;
        padding: 13px 16px;
        border-radius: 4px;
        border: solid 1px #e2e6eb;
        background-color: #fff;
        font-size: 16px;
    }

    #zain-internet-Revamp .zain-internet-map-form-contianer .btn.btn-pink {
        max-width: 155px !important;
        height: 48px;
        padding: 12px 48px;
        border-radius: 24px;
        background-color: #e6007e;
    }

#zain-internet-Revamp .zain-internet-modal .zain-internet-map-edit-address {
    cursor: pointer;
}

#zain-internet-Revamp .zain-internet-map-result-fail-alert {
    padding: 16px;
    border-radius: 8px;
    border: solid 1px #e2e6eb;
    background-color: #f9fafb;
    margin-bottom: 48px;
}

    #zain-internet-Revamp .zain-internet-map-result-fail-alert h4 {
        padding: 0;
        margin: 0;
        margin-bottom: 16px;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-result-fail-alert a {
        font-size: 16px;
        font-weight: bold !important;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
        cursor: pointer;
    }


#zain-internet-Revamp .zain-internet-map-result-fail-container h2 {
    padding: 0;
    margin: 0;
    margin-bottom: 24px;
    font-size: 32px;
    font-weight: bold;
    color: #11120e;
}

#zain-internet-Revamp .zain-internet-map-result-fail-container p {
    padding: 0;
    margin: 0;
    font-size: 21px;
    font-weight: normal;
    color: #11120e;
}

#zain-internet-Revamp .zain-internet-map-result-fail-container .btn.btn-pink {
    margin-top: 40px;
    height: 48px;
    font-size: 18px;
    font-weight: 600;
}

#zain-internet-Revamp .zain-internet-map-result-submit {
    text-align: center;
    position: fixed;
    z-index: 99;
    background-color: #fff;
    width: 100%;
    height: 100vh;
    top: 50%;
    left: 50%;
    transform: translate(-50%,100vh);
    max-width: 624px;
    max-height: 326px;
    margin: 0;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 2px 16px 0 rgba(0, 0, 0, 0.16);
    opacity: 0;
    transition: transform 0.3s ease-out, opacity 0.5s ease-out;
}

    #zain-internet-Revamp .zain-internet-map-result-submit.active {
        transform: translate(-50%,-50%);
        opacity: 1;
    }

    #zain-internet-Revamp .zain-internet-map-result-submit .zain-internet-map-modal-header {
        height: 56px;
        width: 56px;
        position: absolute;
        right: 16px;
        top: 16px;
    }

    #zain-internet-Revamp .zain-internet-map-result-submit h2 {
        padding: 0;
        margin: 16px 0 8px 0;
        font-size: 21px;
        font-weight: bold;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-result-submit p {
        margin: 0;
        padding: 0;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-result-submit > div > p {
        margin-top: 48px;
        margin-bottom: 8px;
    }

    #zain-internet-Revamp .zain-internet-map-result-submit a {
        font-size: 16px !important;
        font-weight: bold !important;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
    }

#zain-internet-Revamp .zain-internet-map-modal-broadband {
    display: flex;
    flex-wrap: wrap;
}

    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map h4 {
        padding: 0;
        margin: 0;
        margin-bottom: 12px;
        font-size: 18px;
        font-weight: normal;
        color: #11120e;
    }

    #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card {
        padding: 24px;
        border-radius: 8px;
        background-color: #f9fafb;
        position: relative;
    }

        #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-title h4 {
            padding: 0;
            margin: 0 0 8px;
            font-size: 18px;
            font-weight: 600;
            color: #11120e;
        }

        #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription {
            display: flex;
            flex-wrap: nowrap;
            width: 100%;
            justify-content: space-between;
            align-items: flex-end;
            gap: 16px;
            position: relative;
        }

            #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription h2 {
                font-size: 36px;
                font-weight: 600;
                color: #11120e;
                padding: 0;
                margin: 0;
            }

            #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription h4 {
                font-size: 14px;
                font-weight: normal;
                color: #11120e;
                padding: 0;
                margin: 0;
            }

                #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription h4:first-child {
                    padding-right: 16px;
                }

                #zain-internet-Revamp .zain-internet-map-modal-broadband .zain-internet-map-modal-map .zain-internet-package-card .zain-internet-package-subscription h4:last-child {
                    text-align: right;
                    padding-left: 10px;
                    border-left: solid 1px #e2e6eb;
                    margin: 0;
                }

#zain-internet-Revamp .promo-counter {
    text-align: center;
    display: flex;
    justify-content: center;
    margin-bottom: 8px;
}

    #zain-internet-Revamp .promo-counter .promo-counter-container {
        background-color: #fff;
        box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.05);
        border-radius: 14px;
        padding: 30px 44px;
    }

        #zain-internet-Revamp .promo-counter .promo-counter-container h4 {
            font-size: 20px;
            text-align: center;
            font-weight: bold;
            color: #000;
        }

            #zain-internet-Revamp .promo-counter .promo-counter-container h4 .percent {
                color: #CE2C7B;
                font-size: 32px;
                font-weight: bold;
                padding: 0 4px;
            }

        #zain-internet-Revamp .promo-counter .promo-counter-container h5 {
            font-size: 22px;
            text-align: center;
            font-weight: normal;
            color: #333;
            padding: 0;
            margin: 0;
            margin-bottom: 16px;
        }

        #zain-internet-Revamp .promo-counter .promo-counter-container h6 {
            color: #CE2C7B;
            font-weight: bold;
            padding: 0;
            margin: 0;
            margin-top: 16px;
            font-size: 18px;
        }

        #zain-internet-Revamp .promo-counter .promo-counter-container .promo-counter-content {
            display: flex;
            flex-wrap: nowrap;
            gap: 8px;
        }



        #zain-internet-Revamp .promo-counter .promo-counter-container .column {
            display: flex;
            flex-direction: column;
        }

            #zain-internet-Revamp .promo-counter .promo-counter-container .column .digit {
                font-weight: 600;
                font-size: 52px;
                text-align: center;
                color: #CE2C7B;
                line-height: 1;
            }

            #zain-internet-Revamp .promo-counter .promo-counter-container .column .day {
                font-style: normal;
                font-weight: 400;
                font-size: 14px;
                text-align: center;
                color: #898989;
                line-height: 1;
            }

#zain-internet-fiber-thank-you-page .zain-internet-thank-you-page-body, #zain-internet-broadband-thank-you-page .zain-internet-thank-you-page-body {
    min-height: 70vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#zain-internet-Revamp .zain-internet-package-card-new {
    min-width: 340px;
    max-width: 340px;
    background: #FFFFFF;
    border: 1px solid #E1E6EC;
    border-radius: 20px;
    align-self: flex-start;
}

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-new-inner-container {
        padding-left: 29px;
        padding-right: 29px;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .ribbon-no-promotion {
        margin-bottom: 24px;
        background-image: Url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderNoPromotion.svg");
        margin-top: -5px;
        height: 11px;
        margin: -6px auto;
        width: 90%;
        margin-bottom: 24px;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-title-new h4 {
        font-size: 23px;
        font-weight: 600;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-speed-new {
        margin-bottom: 12px;
    }


        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-speed-new h4 {
            font-size: 30px;
            display: inline-block;
            font-weight: bold;
        }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-hr {
        margin-bottom: 12px;
        margin-top: 12px;
        height: 1px;
        border-top: 1px solid #ebf1f8;
    }


    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-speed-new {
        margin-bottom: 12px;
    }


        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-speed-new h4 {
            font-size: 30px;
            display: inline-block;
            font-weight: bold;
        }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-monthly-subscription-tag {
        margin-bottom: 2px;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-subscription-new {
        margin-bottom: 14px;
    }

        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-subscription-new h4 {
            font-weight: bold;
            font-size: 30px;
            display: inline;
        }

        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-subscription-new .zain-internet-package-subscription-unit {
            font-size: 20px;
            font-weight: normal;
        }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new ul {
        padding: 0px;
        list-style: none;
        margin-bottom: 0px;
    }


    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail {
        padding-left: 29px;
        padding-right: 29px;
        padding-top: 10px;
        padding-bottom: 10px;
        background-color: white;
        display: flex;
        align-content: center;
        align-items: center;
    }

        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail:nth-child(odd) {
            background-color: #F9FAFB;
        }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .collapse .zain-internet-package-detail {
        background-color: #F9FAFB !important;
    }

        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .collapse .zain-internet-package-detail:nth-child(odd) {
            background-color: white !important;
        }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .collapsing .zain-internet-package-detail {
        background-color: #F9FAFB !important;
    }

        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .collapsing .zain-internet-package-detail:nth-child(odd) {
            background-color: white !important;
        }


    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail:before {
        color: #E6007E;
        font-weight: 700;
        font-size: 14px;
        content: '✓';
        margin-right: 10px;
        margin-left: 0;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail .zain-internet-package-details-key {
        min-width: 30%;
        text-wrap: normal;
        display: inline-block;
        width: 45%;
        font-size: 13px;
        vertical-align: central;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail .zain-internet-package-details-value {
        min-width: 30%;
        text-wrap: normal;
        font-weight: bold;
        display: inline-block;
        text-align: right;
        width: 50%;
        font-size: 13px;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-details-new .zain-internet-package-detail .zain-internet-package-img {
        margin-right: 5px;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-bottom-new {
        margin-top: 19px;
        width: 100%;
    }

        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-bottom-new .btn.btn-pink {
            width: 100% !important;
            height: 40px;
            margin-bottom: 16px;
            padding: 10px;
            border-radius: 20px;
            background-color: #e6007e !important;
            border-color: #e6007e !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #fff !important;
            outline: none !important;
        }

        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-package-bottom-new a {
            font-size: 14px;
            font-weight: bold;
            color: #e6007e !important;
            text-decoration: none !important;
            outline: none !important;
            cursor: pointer;
            display: block;
            text-align: center;
            margin-bottom: 14px;
        }

    #zain-internet-Revamp .zain-internet-package-card-new [aria-expanded='false'] .showmore {
        display: inline-block;
    }

    #zain-internet-Revamp .zain-internet-package-card-new [aria-expanded='false'] .hidemore {
        display: none;
    }

    #zain-internet-Revamp .zain-internet-package-card-new .toggle-arrow svg {
        width: 22px;
        height: 22px;
        margin-bottom: -5px;
        transform: rotate(0);
        transition: all 0.3s ease;
    }

    #zain-internet-Revamp .zain-internet-package-card-new [aria-expanded='true'] .showmore {
        display: none;
    }

    #zain-internet-Revamp .zain-internet-package-card-new [aria-expanded='true'] .hidemore {
        display: inline-block;
    }

    #zain-internet-Revamp .zain-internet-package-card-new [aria-expanded='true'] .toggle-arrow svg {
        transform: rotate(180deg);
    }


    #zain-internet-Revamp .zain-internet-package-card-new.zain-internet-package-promoted .ribbon-no-promotion {
        display: none;
    }

    #zain-internet-Revamp .zain-internet-package-card-new.zain-internet-package-promoted .zain-internet-package-promotion-new {
        display: block;
        background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
        min-height: 58px;
        margin: -11px auto;
        width: 92%;
        margin-bottom: 24px;
        text-align: center;
    }

        #zain-internet-Revamp .zain-internet-package-card-new.zain-internet-package-promoted .zain-internet-package-promotion-new h4 {
            font-weight: bold;
            margin: 0px;
            padding-top: 10px;
            color: white;
        }

        #zain-internet-Revamp .zain-internet-package-card-new.zain-internet-package-promoted .zain-internet-package-promotion-new p {
            color: white;
            padding-top: 3px;
            font-size: 11px;
        }

    #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-slashed {
        color: #D3D3D3;
        font-weight: normal;
        position: relative;
    }

        #zain-internet-Revamp .zain-internet-package-card-new .zain-internet-slashed::after {
            content: "";
            background-color: #e6007e;
            position: absolute;
            width: 2px;
            height: 120%;
            transform: translate(-50%,-10%) rotate(45deg);
            transform-origin: center;
            z-index: 1;
            top: 0;
            left: 50%;
        }

#zain-internet-Revamp .visibility-hidden {
    visibility: hidden;
}

#zain-internet.portal-5g-replica {
    margin-top: 80px;
}

#zain-internet-Revamp .msisdn-lead-submission, #zain-internet-Revamp .msisdn-lead-submission-2 {
    margin-bottom: 12px !important;
}

    #zain-internet-Revamp .msisdn-lead-submission.invalid-form, #zain-internet-Revamp .msisdn-lead-submission-2.invalid-form {
        margin-bottom: 0px !important;
        border: 1px solid #b10000 !important;
    }

#zain-internet-Revamp .zain-internet-validation-error {
    display: none;
    margin-bottom: 12px !important;
    color: #b10000 !important;
}

#zain-internet.portal-5g-replica .zain-internet-best-choice .zain-internet-best-choice-items {
    margin-top: 64px;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    justify-content: space-around;
}

    #zain-internet.portal-5g-replica .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card {
        width: 100%;
        max-width: 240px;
    }

#zain-internet-Revamp #tab_ZainFTTR .zain-internet-packages .zain-internet-package-card {
    WIDTH: 310PX;
    MAX-WIDTH: 310PX;
    MIN-WIDTH: 310PX;
}


#zain-internet-Revamp .zain-internet-fttr-intro {
    width: 60%;
    padding-right: 0px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
}

#zain-internet-Revamp .fttr-subscribe-now {
    max-width: 220px;
}

#zain-internet-Revamp .zain-internet-fttr-benefits {
    background: #F9FAFB;
    padding-top: 70px;
    padding-bottom: 70px;
    position: relative;
    margin-top: 70px;
}

    #zain-internet-Revamp .zain-internet-fttr-benefits .zain-internet-fttr-benefits-title {
        text-align: center;
        font-weight: bold;
        font-size: 40px;
        margin-bottom: 50px;
        position: relative;
    }

    #zain-internet-Revamp .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 3.3%;
        row-gap: 30px;
        position: relative;
    }

        #zain-internet-Revamp .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card {
            width: 30%;
            display: flex;
            flex-direction: column;
            padding: 40px 30px;
            gap: 23px;
            text-align: center;
            border-radius: 15px;
            border: 1px solid #F1F2F2;
            background: #FFF;
            align-items: center;
        }

            #zain-internet-Revamp .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card .zain-internet-fttr-benefits-card-icon {
                max-width: 64px;
                width: 100%;
                max-height: 50px;
            }

            #zain-internet-Revamp .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card .zain-internet-fttr-benefits-card-title {
                font-weight: bold;
                font-size: 21px;
                margin: 0px;
            }

            #zain-internet-Revamp .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card .zain-internet-fttr-benefits-card-desc {
                font-size: 16px;
                margin: 0px;
            }

#zain-internet-Revamp .zain-internet-fttr-video-container {
    width: 100%;
    margin-top: 50px;
    margin-bottom: 50px;
}

    #zain-internet-Revamp .zain-internet-fttr-video-container iframe {
        width: 100%;
        height: 500px;
        max-height: 80vh;
        border-radius: 10px;
    }

#zain-internet-Revamp .zain-internet-fttr-benefits-left-bg {
    border-radius: 24px;
    background-color: #f9fafb;
    position: absolute;
    top: 0;
    left: -65vw;
    width: 100vw;
    height: 100%;
    z-index: 0;
}

#zain-internet-Revamp .zain-internet-fttr-benefits-right-bg {
    border-radius: 24px;
    background-color: #f9fafb;
    position: absolute;
    top: 0;
    right: -65vw;
    width: 100vw;
    height: 100%;
    z-index: 0;
}

#zain-internet-Revamp .zain-internet-fttr-ad {
    display: flex;
    gap: 22px;
    margin-top: 50px;
}

#zain-internet-Revamp .zain-internet-fttr-ad-image {
    width: 50%;
}

    #zain-internet-Revamp .zain-internet-fttr-ad-image img {
        width: 100%;
        height: 100%;
        border-radius: 10px;
    }

#zain-internet-Revamp .zain-internet-fttr-ad-card {
    border-radius: 20px;
    background: #F9FAFB;
    padding: 50px;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    gap: 30px;
    width: 70% !important;
}

    #zain-internet-Revamp .zain-internet-fttr-ad-card h2 {
        font-size: 40px;
        font-weight: bold;
        margin-bottom: 0px;
    }

    #zain-internet-Revamp .zain-internet-fttr-ad-card p {
        margin-bottom: 0px;
    }

    #zain-internet-Revamp .zain-internet-fttr-ad-card ul {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        max-height: 70px;
        align-content: space-between;
        margin-bottom: 0px;
        padding-left: 16px;
    }

    #zain-internet-Revamp .zain-internet-fttr-ad-card a {
        color: #0070C9;
        font-weight: bold;
    }

#zain-internet-Revamp #tab_ZainFTTR .zain-internet-packages .zain-internet-packages-note {
    padding-bottom: 24px;
}

    #zain-internet-Revamp #tab_ZainFTTR .zain-internet-packages .zain-internet-packages-note li {
        list-style: none;
        font-size: 14px;
    }

#zain-internet-Revamp .zain-internet-package-card .discount-promotion {
    display: none;
}

#zain-internet-Revamp .zain-internet-package-card.card-promotion .discount-promotion {
    display: block;
    background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
    background-repeat: round;
    min-height: 39px;
    margin: -8px auto;
    width: 92%;
    margin-bottom: 10px;
    text-align: center;
    color: white;
    font-size: 11px;
}

    #zain-internet-Revamp .zain-internet-package-card.card-promotion .discount-promotion .promotion-header {
        margin: 0px;
        font-size: 12px;
        font-weight: bold;
        margin-top: 5px;
    }

    #zain-internet-Revamp .zain-internet-package-card.card-promotion .discount-promotion .promotion-price {
        margin: 0px;
        font-size: 9px;
    }


#nvidia_informative_pages {
    overflow-x: hidden;
    max-width: 100vw;
    background-color: black;
    padding-bottom: 30px;
}

    #nvidia_informative_pages #preloader-modal {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.7);
        z-index: 10000 !important;
    }

    #nvidia_informative_pages #loader-modal {
        display: block;
        position: relative;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #9370DB;
        -webkit-animation: spin 2s linear infinite;
        animation: spin 2s linear infinite;
    }

        #nvidia_informative_pages #loader-modal:before {
            content: "";
            position: absolute;
            top: 5px;
            left: 5px;
            right: 5px;
            bottom: 5px;
            border-radius: 50%;
            border: 3px solid transparent;
            border-top-color: #BA55D3;
            -webkit-animation: spin 3s linear infinite;
            animation: spin 3s linear infinite;
        }

        #nvidia_informative_pages #loader-modal:after {
            content: "";
            position: absolute;
            top: 15px;
            left: 15px;
            right: 15px;
            bottom: 15px;
            border-radius: 50%;
            border: 3px solid transparent;
            border-top-color: #54B8E9;
            -webkit-animation: spin 1.5s linear infinite;
            animation: spin 1.5s linear infinite;
        }

    #nvidia_informative_pages .otp-container {
        display: flex;
        gap: 5px;
        direction: ltr;
    }

    #nvidia_informative_pages svg:hover {
        fill: unset;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal .modal-body {
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 80px;
        padding-right: 80px;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal .nvidia-quick-subscription-modal-header {
        font-weight: bold;
        font-size: 24px;
        display: block;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal-body {
        margin-top: 40px;
        margin-bottom: 35px;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal-form-label {
        font-size: 16px;
        font-weight: bold;
        text-align: left;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal .form-control {
        border-radius: 7px;
        height: 40px;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal .nvidia-quick-subscription-actions {
        display: flex;
        gap: 5px;
        flex-wrap: wrap-reverse;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal #nvidia-quick-subscription-modal-dismiss-step-1, #nvidia_informative_pages .nvidia-quick-subscription-modal #nvidia-quick-subscription-modal-dismiss-step-2 {
        background-color: #535353;
        border: #535353;
        border-radius: 20px;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal #nvidia-quick-subscription-modal-submit-msisdn, #nvidia_informative_pages .nvidia-quick-subscription-modal #nvidia-quick-subscription-modal-submit-otp {
        background: #E6007E;
        border-color: #E60073;
        border-radius: 20px;
        flex-grow: 2;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal .alert {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-footer {
        margin-top: 10px;
        text-align: left;
        font-weight: normal;
        font-size: 12px;
    }

.geforce-background {
    background-color: black;
}

#nvidia_informative_pages .overlay-text .btn {
    margin-top: 30px;
}

#nvidia_informative_pages h1, #nvidia_informative_pages h2, #nvidia_informative_pages h3, #nvidia_informative_pages h4, #nvidia_informative_pages h5, #nvidia_informative_pages h6 {
    margin: 0px;
}

#nvidia_informative_pages p {
    font-size: 18px;
}

#nvidia_informative_pages .visibilty-none {
    visibility: hidden;
}

#nvidia_informative_pages .position-relative {
    position: relative;
}

#nvidia_informative_pages .tab-switcher {
    margin-top: 80px;
    padding-bottom: 30px;
    padding-left: 80px;
    font-size: 15px;
}

    #nvidia_informative_pages .tab-switcher a {
        color: white;
        font-size: 16px;
        font-weight: bold;
        margin-right: 30px;
    }

        #nvidia_informative_pages .tab-switcher a.active {
            padding-bottom: 4px;
            font-weight: bold;
            border-bottom: 4px solid #37ACE5;
        }

        #nvidia_informative_pages .tab-switcher a:hover {
            text-decoration: none;
        }

#nvidia_informative_pages .register-now-tab-button {
    border: 1px solid #54b8e9;
    border-radius: 5px;
    padding: 10px;
    display: inline-block;
    margin-top: 15px;
}


#nvidia_informative_pages .reveal {
    opacity: 0;
    transition: 0.5s all ease;
}

    #nvidia_informative_pages .reveal.active {
        opacity: 1;
    }

#nvidia_informative_pages .main-geforce-now {
    max-width: 100vw;
    max-height: 120vh;
    min-width: 100vw;
    overflow: hidden;
}

#nvidia_informative_pages .overlay-text {
    position: absolute;
    z-index: 1;
    width: 100vw;
    height: 120vh;
    top: 0px;
    padding: 50px;
    background-image: url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/geforce-now-banner.png");
    background-position: 14vw;
    background-size: cover;
    max-height: 900px;
}

#nvidia_informative_pages .overlay-text-header {
    color: white;
}

#nvidia_informative_pages .overlay-text-body {
    max-width: 40%;
}

    #nvidia_informative_pages .overlay-text-body p {
        margin-top: 30px;
    }

#nvidia_informative_pages .overlay-text-smallheader {
    color: #3ac3df;
}

#zain-internet .text-white {
    color: white !important;
}

#zain-internet-Revamp .text-white {
    color: white !important;
}


#nvidia_informative_pages .overlay-text h6.intro_subtitle {
    font-size: 19px;
    font-weight: normal;
    color: white;
    padding: 0;
    margin: 0;
    margin-bottom: 8px;
}

#nvidia_informative_pages .overlay-text h2.intro_title {
    font-size: 48px;
    line-height: 1.25;
    color: white;
    padding: 0;
    margin: 0;
    margin-bottom: 16px;
    width: 40%;
}

#nvidia_informative_pages .overlay-text h4.intro_paragraph {
    font-size: 21px;
    font-weight: normal;
    color: white;
    padding: 0;
    margin: 0;
}

#nvidia_informative_pages .big-picture-backdrop {
    padding: 50px;
    background-image: url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/geforce-now-platform.jpg");
    background-size: cover;
    background-position: center;
}

    #nvidia_informative_pages .big-picture-backdrop h3 {
        color: white;
        font-size: 45px;
    }

#nvidia_informative_pages .big-picture-backdrop-section {
    margin-top: 30px;
}

#nvidia_informative_pages .big-picture-backdrop-section-body {
    color: white;
    font-size: 14px;
}

#nvidia_informative_pages .big-picture-backdrop-section-header {
    color: #FFF200;
    margin-bottom: 0px;
}

#nvidia_informative_pages .left-text {
    max-width: 40%;
}

#nvidia_informative_pages .main-list-games {
    background-color: black;
    margin-top: 45px;
}

#nvidia_informative_pages .main-list-games-headers {
    text-align: center;
}

    #nvidia_informative_pages .main-list-games-headers h1 {
        font-size: 40px;
        font-weight: bold;
    }

    #nvidia_informative_pages .main-list-games-headers p {
        color: white;
        margin-bottom: 40px;
        margin-top: 40px;
    }

#nvidia_informative_pages .text-blueshade {
    color: #3ac3df;
}

#nvidia_informative_pages .geforce-cards-container {
    display: flex;
    justify-content: center;
    margin-top: 40px;
    gap: 24px;
}

#zain-internet .switch--item__active {
    background-color: #e6007e;
}

#zain-internet-Revamp .switch--item__active {
    background-color: #e6007e;
}

#nvidia_informative_pages .nvidia-card-header {
    font-weight: bold;
    color: #3ac3df;
    text-align: center;
    margin-top: 25px;
    margin-bottom: 25px;
}

#nvidia_informative_pages .nvidia-card-caption {
    color: white;
}

#nvidia_informative_pages .nvidia-card-img img {
    width: 550px;
    height: 250px;
}

#nvidia_informative_pages .steps {
    margin-top: 50px;
    margin-bottom: 50px;
}

#nvidia_informative_pages .steps-geforce-container {
    display: flex;
    justify-content: center;
    column-gap: 20px;
    overflow-x: auto;
    padding-bottom: 25px;
    margin: 50px;
}

    #nvidia_informative_pages .steps-geforce-container::-webkit-scrollbar {
        height: 3px;
    }

    #nvidia_informative_pages .steps-geforce-container::-webkit-scrollbar-thumb {
        background: #3ac3df;
        border-radius: 3px;
    }


#nvidia_informative_pages .steps-header {
    text-align: center;
    font-weight: bold;
    color: white;
    font-size: 45px;
}

#nvidia_informative_pages .step-card-img {
    height: 45px;
}

#nvidia_informative_pages .step-geforce-now {
    padding: 16px;
    border: 3px solid #3ac3df;
    border-radius: 15px;
    width: 220px;
    min-width: 220px;
    text-align: center;
}

#nvidia_informative_pages .step-geforce-now-super-text {
    color: white;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
}

#nvidia_informative_pages .step-geforce-now-caption {
    font-size: 14px;
    color: white;
    text-align: center;
}

#nvidia_informative_pages .step-geforce-now-sub-text {
    color: white;
    font-size: 25px;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 0px;
}

#nvidia_informative_pages .platform-fixed-height {
    min-height: 200px;
    height: 200px;
}

#nvidia_informative_pages .main-zain-fiber-offers {
    padding: 50px;
    margin-top: 45px;
}

#nvidia_informative_pages .main-zain-fiber-header {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

    #nvidia_informative_pages .main-zain-fiber-header h1 {
        color: #3ac3df;
        font-size: 40px;
        font-weight: bold;
    }

    #nvidia_informative_pages .main-zain-fiber-header p {
        color: white;
        margin-top: 40px;
        margin-bottom: 40px;
    }

#nvidia_informative_pages .nvidia-fiber-cards-container {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 40px;
    padding-bottom: 20px;
    overflow-x: auto;
}

    #nvidia_informative_pages .nvidia-fiber-cards-container::-webkit-scrollbar {
        height: 3px;
    }

    #nvidia_informative_pages .nvidia-fiber-cards-container::-webkit-scrollbar-thumb {
        background: #3ac3df;
        border-radius: 3px;
    }


#nvidia_informative_pages .nvidia-fiber-card {
    width: calc(33% - 30px);
    padding: 32px 24px;
    border-radius: 24px;
    border: solid 3px white;
    background-color: #111111;
    color: white;
    height: 500px;
    max-width: 300px;
    min-width: 300px;
}

#nvidia_informative_pages .nvidia-fiber-card-inner {
    width: 100%;
    height: 100%;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

    #nvidia_informative_pages .nvidia-fiber-card-inner.flipped {
        transform: rotateY(180deg);
    }


#nvidia_informative_pages .nvidia-fiber-card.premium {
    border-color: #3ac3df;
}

    #nvidia_informative_pages .nvidia-fiber-card.premium .nvidia-fiber-card-header {
        color: #3ac3df;
    }

#nvidia_informative_pages .nvidia-fiber-card-fiber-prices {
    width: 100%;
    color: white;
    margin-top: 0px;
}

#nvidia_informative_pages .nvidia-fiber-card-body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
}

#nvidia_informative_pages .nvidia-fiber-card-front-face, .nvidia-fiber-card-back-face {
    position: absolute;
    width: 100%;
    height: 100%;
}

#nvidia_informative_pages .nvidia-fiber-card-front-face {
    display: flex;
    flex-direction: column;
}


#nvidia_informative_pages .nvidia-fiber-card-body h5 {
    font-size: 18px;
}

#nvidia_informative_pages .nvidia-fiber-card-button {
    width: 100%;
    height: 50px;
    font-size: 18px;
    border-radius: 10px;
}

    #nvidia_informative_pages .nvidia-fiber-card-button:hover {
        color: white;
    }


#nvidia_informative_pages .nvidia-fiber-card.premium .nvidia-fiber-card-button {
    background: linear-gradient(to right,#6651a2, #3ac3df);
    background-origin: border-box;
    color: white;
    border-radius: 13px;
    width: 70%;
    display: block;
    margin: 0 auto;
    padding: 0px;
    padding-top: 15px;
}

#nvidia_informative_pages .nvidia-fiber-see-all-details-button {
    width: 100%;
    height: 50px;
    font-size: 18px;
    margin-top: 5px;
    background-color: #111111;
    color: white;
}

    #nvidia_informative_pages .nvidia-fiber-see-all-details-button:hover {
        color: white;
    }

#nvidia_informative_pages .see-all-details-button:active {
    color: white;
}

#nvidia_informative_pages .nvidia-fiber-card-details {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

    #nvidia_informative_pages .nvidia-fiber-card-details ul li:before {
        color: #4f6f88;
        font-weight: 700;
        font-size: 14px;
        content: '✓';
        margin-right: 10px;
        margin-left: 0;
    }

    #nvidia_informative_pages .nvidia-fiber-card-details ul li {
        font-size: 14px;
    }

#nvidia_informative_pages .zain-fiber-redirection {
    background-color: #3ac3df;
    border-color: #3ac3df;
    color: white;
    border-radius: 24px;
    margin-top: 30px;
}

    #nvidia_informative_pages .zain-fiber-redirection:hover {
        background-color: #3ac3df;
        border-color: #3ac3df;
        color: white;
    }

#nvidia_informative_pages .nvidia-main-new-games {
    margin-top: 70px;
}

#nvidia_informative_pages .nvidia-main-new-games-header {
    text-align: center;
}

    #nvidia_informative_pages .nvidia-main-new-games-header h1 {
        color: #3ac3df;
        font-size: 40px;
        font-weight: bold;
        margin-bottom: 40px;
    }

    #nvidia_informative_pages .nvidia-main-new-games-header p {
        color: white;
        margin-bottom: 40px;
        padding-left: 15px;
        padding-right: 15px;
    }

#nvidia_informative_pages .nvidia-main-platforms {
    margin-top: 70px;
}

#nvidia_informative_pages .nvidia-main-platforms-header {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
    margin-bottom: 20px;
}

    #nvidia_informative_pages .nvidia-main-platforms-header h1 {
        color: #3ac3df;
        font-size: 40px;
        font-weight: bold;
        margin-bottom: 40px;
    }

    #nvidia_informative_pages .nvidia-main-platforms-header p {
        color: white;
        margin-bottom: 40px;
    }

#nvidia_informative_pages .nvidia-main-platforms-platforms-container {
    display: flex;
    justify-content: space-evenly;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 30px;
}

#nvidia_informative_pages .nvidia-platform {
    width: 165px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 16px;
}

    #nvidia_informative_pages .nvidia-platform:hover {
        text-decoration: none;
    }

#nvidia_informative_pages .nvidia-platform-img:hover {
    transform: scale(1.2);
}

#nvidia_informative_pages .nvidia-platform-img {
    height: 70px;
    transition: all linear 0.2s;
}

#nvidia_informative_pages .nvidia-platform-header {
    color: #3ac3df;
    font-weight: bold;
    font-size: 22px;
    margin-top: 10px;
}

#nvidia_informative_pages .nvidia-platform-text {
    color: white;
    font-size: 14px;
}

#nvidia_informative_pages .geforce-redirection-link {
    text-align: center;
    background: linear-gradient(to right,#6651a2, #3ac3df);
    background-origin: border-box;
    color: white;
    border-radius: 10px;
    display: block;
    margin: 30px auto;
    padding: 6px 12px;
    transform: translateY(0);
}

    #nvidia_informative_pages .geforce-redirection-link:hover, #nvidia_informative_pages .geforce-redirection-link:active {
        transform: translateY(3px);
    }

#nvidia_informative_pages .nvidia-game-slider {
    width: 1000000px;
    height: 120px;
    margin-top: 15px;
}

    #nvidia_informative_pages .nvidia-game-slider.top {
        animation: gameSlider 40s linear infinite;
        background: transparent url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/games-top-slider.png") 0 repeat-x;
    }

    #nvidia_informative_pages .nvidia-game-slider.middle {
        animation: gameSlider 60s linear infinite;
        background: transparent url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/games-middle-slider.png") 0 repeat-x;
    }

    #nvidia_informative_pages .nvidia-game-slider.bottom {
        animation: gameSlider 70s linear infinite;
        background: transparent url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/games-bottom-slider.png") 0 repeat-x;
    }

#nvidia_informative_pages .zain-geforce-logo {
    height: 100px;
    width: 300px;
}

#nvidia_informative_pages .nvidia-fiber-card-header h3 {
    height: 50px;
}

#nvidia_informative_pages .nvidia-fiber-card-fiber-prices h3 {
    height: unset;
    margin-top: 40px;
    margin-bottom: 20px;
    font-size: 25px;
}

#nvidia_informative_pages .nvidia-main-faq-section {
    margin-top: 70px;
}

#nvidia_informative_pages .nvidia-main-faq-header h1 {
    text-align: center;
    color: #3ac3df;
}

#nvidia_informative_pages .nvidia-main-faq-body h2 {
    padding: 0;
    margin: 16px;
    font-size: 40px;
    font-weight: bold;
    color: white;
}

#nvidia_informative_pages .nvidia-main-faq-body {
    margin-top: 40px;
}

    #nvidia_informative_pages .nvidia-main-faq-body a {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        justify-content: space-between;
        align-content: flex-start;
        align-items: flex-start;
        width: 100%;
        font-size: 24px !important;
        font-weight: 600 !important;
        color: white !important;
        text-decoration: none !important;
        outline: none !important;
    }

        #nvidia_informative_pages .nvidia-main-faq-body a .toggle-arrow svg {
            width: 40px;
            height: 40px;
            margin-top: -10px;
            transform: rotate(0);
            transition: all 0.3s ease;
        }

        #nvidia_informative_pages .nvidia-main-faq-body a.active .toggle-arrow svg {
            transform: rotate(180deg);
        }

    #nvidia_informative_pages .nvidia-main-faq-body h4 {
        padding: 0;
        margin: 24px 0 !important;
        font-size: 24px;
        font-weight: 600;
        color: white !important;
    }

    #nvidia_informative_pages .nvidia-main-faq-body ul {
        margin: 0;
        padding-left: 20px;
    }

        #nvidia_informative_pages .nvidia-main-faq-body ul li {
            margin: 0;
            padding: 0;
            margin-bottom: 24px;
            font-size: 18px;
            font-weight: normal;
            color: white !important;
        }

    #nvidia_informative_pages .nvidia-main-faq-body hr {
        width: 100%;
        margin: 0;
        border: solid 1px white;
    }

    #nvidia_informative_pages .nvidia-main-faq-body .nvidia-geforce-answer {
        padding-bottom: 24px;
    }

        #nvidia_informative_pages .nvidia-main-faq-body .nvidia-geforce-answer p {
            color: white !important;
            font-size: 16px !important;
        }

#nvidia_informative_pages .nvidia-main-platforms-platforms-container {
    gap: unset;
}

#nvidia_informative_pages .availble-games-filter .panel-title a svg {
    width: 15px;
    height: 15px;
}

    #nvidia_informative_pages .availble-games-filter .panel-title a svg:hover {
        fill: unset;
    }

#nvidia_informative_pages .available-games-filter .collapse {
    margin-top: 15px;
}

#nvidia_informative_pages .available-games-filter label {
    color: white;
    font-weight: normal;
}

#nvidia_informative_pages .available-games-filter .collapse label {
    vertical-align: text-top;
}

#nvidia_informative_pages .nvidia-available-games-panel {
    background-image: url(https://www.jo.zain.com/english/PublishingImages/NvidiaContent/support-page-background.png);
    /*padding: 29px 87px;*/
    padding-top: 20px;
    padding-bottom: 20px;
    background-attachment: fixed;
    background-size: cover;
}

#nvidia_informative_pages .available-games-search-order {
    display: flex;
    padding-bottom: 41px;
    gap: 30px;
}

#nvidia_informative_pages .category-search {
    display: flex;
    gap: 12px;
    flex-grow: 1;
}

#nvidia_informative_pages .nvidia-find-game-container {
    position: relative;
    flex-grow: 1.5;
}

    #nvidia_informative_pages .nvidia-find-game-container .form-control-feedback {
        top: 6px;
        color: white;
    }

#nvidia_informative_pages .nvidia-find-game {
    background-color: #0C0C0C;
    border: 2px solid #626262;
    border-radius: 7px;
    color: white;
    height: 48px;
}

    #nvidia_informative_pages .nvidia-find-game:focus {
        box-shadow: unset;
        border-color: unset;
    }

    #nvidia_informative_pages .nvidia-find-game:active {
        box-shadow: unset;
        border-color: unset;
    }

    #nvidia_informative_pages .nvidia-find-game::placeholder {
        font-weight: bold;
        color: white;
    }

#nvidia_informative_pages .vertical-divider {
    border: 1px solid #626262;
    background-color: #626262;
    height: 48px;
}

#nvidia_informative_pages .dropdown-filters {
    background-color: #0C0C0C;
    color: white;
    height: 48px;
    border: 2px solid #626262;
    border-radius: 7px;
    margin-bottom: 0px;
}

#nvidia_informative_pages .reset-button {
    background-color: #0C0C0C;
    border: 2px solid #54B8E9;
    color: #54B8E9;
    border-radius: 7px;
    height: 48px;
    padding-top: 8px;
    padding-left: 18px;
    padding-right: 18px;
    font-size: 17px;
}

    #nvidia_informative_pages .reset-button:active {
        box-shadow: unset;
        border: 2px solid #54B8E9;
    }

    #nvidia_informative_pages .reset-button:hover {
        box-shadow: unset;
        border: 2px solid #54B8E9;
    }

    #nvidia_informative_pages .reset-button:focus {
        box-shadow: unset;
        border: 2px solid #54B8E9;
    }

    #nvidia_informative_pages .reset-button svg {
        width: 24px;
        height: 24px;
        vertical-align: sub;
    }

#nvidia_informative_pages .game-row-container {
    margin-bottom: 42px;
}

#nvidia_informative_pages .game-row.activated {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

#nvidia_informative_pages .games-filters-container {
    display: flex;
    gap: 50px;
    width: 100%;
}

#nvidia_informative_pages .game-row-header {
    margin-bottom: 18px;
    display: flex;
    justify-content: space-between;
}

    #nvidia_informative_pages .game-row-header h3 {
        font-size: 21px;
        color: white;
        padding-bottom: 4px;
        font-weight: bold;
        margin-bottom: 0px;
        border-bottom: 4px solid #54B8E9;
        margin: 0px;
        align-self: flex-end;
    }

#nvidia_informative_pages .row-slick-container {
    display: flex;
    gap: 9px;
    padding-right: 19px;
}

#nvidia_informative_pages .slick-track {
    padding-bottom: 0px;
}

#nvidia_informative_pages .modal-content {
    text-align: center;
}

#nvidia_informative_pages .slick-slider .slick-list {
    padding-top: 0px;
    padding-left: 10px;
}

#nvidia_informative_pages .view-all-games, #nvidia_informative_pages .prev-slick-games, #nvidia_informative_pages .next-slick-games {
    background-color: #0C0C0C;
    color: white;
    border-color: #626262;
    font-size: 10px;
    border-radius: 7px;
    padding: 8px;
}

    #nvidia_informative_pages .view-all-games svg, #nvidia_informative_pages .prev-slick-games svg, #nvidia_informative_pages .next-slick-games svg {
        width: 10px;
        height: 10px;
        vertical-align: sub;
    }

#nvidia_informative_pages .game-card {
    background-color: rgba(0, 0, 0, 0.5);
    max-width: 189px;
    border-radius: 5px;
    display: block;
}

    #nvidia_informative_pages .game-card:hover {
        text-decoration: none;
    }

    #nvidia_informative_pages .game-card:focus {
        outline: none;
        outline-offset: 0px;
        color: unset;
    }


#nvidia_informative_pages .game-card-information {
    padding: 12px;
    min-height: 130px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#nvidia_informative_pages .game-img {
    width: 189px;
    height: 189px;
    border-radius: 5px;
}

#nvidia_informative_pages .nvidia-available-games-panel [aria-expanded='true'] .toggle-arrow {
    transform: rotate(180deg);
    transition: 0.2s;
}

#nvidia_informative_pages .nvidia-available-games-panel span.toggle-arrow {
    transition: 0.2s;
}


#nvidia_informative_pages .store-name p {
    color: white;
    margin-bottom: 12px;
    font-size: 11px;
    font-weight: bold;
}

    #nvidia_informative_pages .store-name p img {
        width: 15px;
        height: 15px;
        display: inline;
        margin-right: 5px;
        vertical-align: middle;
    }

#nvidia_informative_pages .game-card-title h3 {
    font-weight: bold;
    color: white;
    font-size: 13px;
    margin-bottom: 1px;
    white-space: pre-wrap;
}

#nvidia_informative_pages .game-card-title p {
    color: white;
    font-size: 9px;
}

#nvidia_informative_pages .game-card-footer a {
    color: white;
    font-size: 11px;
    text-decoration: underline;
}

    #nvidia_informative_pages .game-card-footer a:hover {
        color: white;
        font-size: 11px;
        text-decoration: underline;
    }

    #nvidia_informative_pages .game-card-footer a svg {
        width: 4px;
        height: 4px;
        vertical-align: baseline;
    }

#nvidia_informative_pages .available-games-filter {
    width: 30%;
}

    #nvidia_informative_pages .available-games-filter h3 {
        color: white;
        margin-bottom: 0px;
        font-size: 21px;
        padding-bottom: 4px;
        max-width: min-content;
        font-weight: bold;
        border-bottom: 4px solid #54B8E9;
        margin-top: 3px;
        margin-left: 0px;
        margin-right: 0px;
    }

#nvidia_informative_pages .availble-games-filter {
    padding-top: 22px;
    padding-bottom: 22px;
    border-bottom: 1px solid #393939;
}

    #nvidia_informative_pages .availble-games-filter .panel-title a {
        color: #54B8E9;
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        justify-content: space-between;
        align-content: flex-start;
        align-items: flex-start;
        width: 100%;
        font-weight: 600 !important;
        text-decoration: none !important;
        outline: none !important;
        font-size: 19px;
    }

        #nvidia_informative_pages .availble-games-filter .panel-title a svg {
            width: 15px;
            height: 15px;
        }


#nvidia_informative_pages .all-games-container {
    width: 70%;
}

#nvidia_informative_pages .filtred-games-tab-container {
    display: none;
    width: 80%;
}

    #nvidia_informative_pages .filtred-games-tab-container .filter-header {
        color: white;
        margin-bottom: 0px;
        font-size: 21px;
        padding-bottom: 4px;
        /* max-width: min-content; */
        font-weight: bold;
        max-width: 12%;
        margin-bottom: 20px;
        border-bottom: 4px solid #54B8E9;
    }

#nvidia_informative_pages .filtred-games-tab {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

#nvidia_informative_pages .games-filters-container.decrease-gap {
    gap: 25px;
}

#nvidia_informative_pages .not-found-filters {
    display: none;
    color: white;
    font-weight: bold;
    font-size: 25px;
}

#nvidia_informative_pages .filters-mobile {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    margin-top: 10px;
}

    #nvidia_informative_pages .filters-mobile .nvidia-find-game-container {
        flex-grow: 1.5;
    }

    #nvidia_informative_pages .filters-mobile .show-filters-modal-button {
        background-color: #0C0C0C;
        border: 2px solid #626262;
        border-radius: 7px;
        color: white;
    }

        #nvidia_informative_pages .filters-mobile .show-filters-modal-button svg {
            width: 14px;
            height: 11px;
            margin-left: 10px;
        }

#nvidia_informative_pages .mobile-filtres-modal .modal-body {
    background: rgba(12, 12, 12, 0.8);
    border-radius: 5px;
    padding: 15px;
    border: 0;
}

    #nvidia_informative_pages .mobile-filtres-modal .modal-body .dropdown-filters {
        margin-bottom: 12px;
    }

    #nvidia_informative_pages .mobile-filtres-modal .modal-body .dropdown-filter-label {
        color: white;
        text-align: left;
        margin-bottom: 5px;
        font-weight: bold;
    }

#nvidia_informative_pages .filter-modal-actions {
    display: flex;
    gap: 10px;
}

    #nvidia_informative_pages .filter-modal-actions .reset-button {
        flex-grow: 0.5;
    }

#nvidia_informative_pages .search-button {
    background-color: #0C0C0C;
    border: 2px solid #626262;
    border-radius: 7px;
    color: white;
}

    #nvidia_informative_pages .search-button svg {
        width: 15px;
        height: 15px;
        vertical-align: middle;
    }


#nvidia_informative_pages .available-games-filter .collapse, #nvidia_informative_pages .available-games-filter .collapsing {
    margin-top: 15px;
    max-height: 300px;
    overflow-y: auto;
}

    #nvidia_informative_pages .available-games-filter .collapse::-webkit-scrollbar-thumb {
        background: #54B8E9;
        border-radius: 3px;
    }


    #nvidia_informative_pages .available-games-filter .collapse::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 3px;
    }

#nvidia_informative_pages .available-games-filter .collapsing {
    overflow-y: hidden;
}


/**********/
/*******Nvidia GeForce Now - Digital Subscription*******/

.main.main--main-secoundry #nvidia_digital_subscription {
    margin-top: 30px !important;
    min-height: 70vh;
}


#nvidia_digital_subscription .mt-28 {
    margin-top: 28px !important;
}

#nvidia_digital_subscription .mt-33 {
    margin-top: 33px !important;
}

#nvidia_digital_subscription .mt-34 {
    margin-top: 34px !important;
}

#nvidia_digital_subscription .mb-16 {
    margin-bottom: 16px !important;
}

#nvidia_digital_subscription .justify-content-between {
    justify-content: space-between;
}

#nvidia_digital_subscription .justify-content-around {
    justify-content: space-around;
}


#nvidia_digital_subscription .nvidia-ds-header-text {
    margin-top: 0px;
    font-weight: bold;
}

#nvidia_digital_subscription .nvidia-ds-package {
    padding: 20px;
    box-shadow: 0px 0px 20px 0px #45495B14;
    background-color: white;
    margin-top: 29px;
    display: flex;
    justify-content: space-between;
    border-radius: 4px;
}

#nvidia_digital_subscription .nvidia-ds-package-column {
    display: flex;
    flex-direction: column;
}

#nvidia_digital_subscription .nvidia-ds-package-header img {
    height: 32px;
    margin: 0px;
    margin-right: 8px;
}

#nvidia_digital_subscription .nvidia-ds-package-header {
    margin: 0px;
    font-weight: bold;
    margin-bottom: 17px;
}

#nvidia_digital_subscription .nvidia-ds-price-text {
    color: #37ACE5;
}

#nvidia_digital_subscription .nvidia-ds-start-wizard-button {
    background-color: #E6007E;
    border-color: #E6007E;
    color: white;
    font-weight: bold;
    text-align: center;
    font-size: 12px;
    padding: 8px;
    min-width: 150px;
}

#nvidia_digital_subscription .nvidia-ds-package-view-more-details {
    background-color: #37ACE5;
    border-color: #37ACE5;
    color: white;
    font-weight: bold;
    text-align: center;
    font-size: 12px;
    padding: 8px;
    min-width: 150px;
}

#nvidia_digital_subscription .nvidia-ds-choices {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

    #nvidia_digital_subscription .nvidia-ds-choices .nvidia-ds-choice {
        color: black;
        background-color: white;
        cursor: pointer;
        border: 2px solid #DCDCDC;
        border-radius: 20px;
        min-width: 195px;
        text-align: center;
        padding-top: 5px;
        padding-bottom: 5px;
    }

        #nvidia_digital_subscription .nvidia-ds-choices .nvidia-ds-choice.active {
            color: #37ACE5;
            background-color: white;
            border-color: #37ACE5;
        }

#nvidia_digital_subscription .nvidia-ds-flex-container {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

#nvidia_digital_subscription .nvidia-ds-cancel-button {
    background-color: #EBEBEB;
    border-color: #EBEBEB;
    color: black;
    font-weight: bold;
    min-width: 200px;
}

#nvidia_digital_subscription .nvidia-ds-submit-button {
    background-color: #E6007E;
    border-color: #E6007E;
    color: white;
    font-weight: bold;
    min-width: 300px;
}

#nvidia_digital_subscription .nvidia-ds-next-bill-run-label {
    display: none;
    margin-top: 18px;
}

#nvidia_digital_subscription .nvidia-ds-next-bill-run {
    color: #37ACE5;
    font-weight: bold;
}

#nvidia_digital_subscription .nvidia-ds-vertical-align-sub {
    vertical-align: sub;
}

#nvidia_digital_subscription .flex-wrap-reverse {
    flex-wrap: wrap-reverse;
}

#nvidia_digital_subscription input[type='text'] {
    box-shadow: none !important;
}

#nvidia_digital_subscription .nvidia-ds-valid-email {
    color: #0FAA3A;
    font-size: 14px;
}

#nvidia_digital_subscription .nvidia-ds-invalid-feedback {
    color: #b10000;
    font-size: 14px;
    display: none;
}

#nvidia_digital_subscription .nvidia-ds-form-invalid-input {
    border-color: #b10000;
    box-shadow: none;
}

#nvidia_digital_subscription .nvidia-ds-modal-emphasis-text {
    color: #E6007E;
    font-weight: bold;
}

#nvidia_digital_subscription .modal .nvidia-ds-submit-button {
    flex-grow: 1;
    min-width: unset;
}

#nvidia_digital_subscription .nvidia-ds-modal {
    padding-top: 30px;
    padding-bottom: 48px;
    padding-left: 24px;
    padding-right: 24px;
}

#nvidia_digital_subscription .nvidia-ds-modal-body-text-header .close {
    display: block;
    margin-bottom: 10px;
    opacity: 1;
}

#nvidia_digital_subscription .nvidia-ds-modal-body-text-header {
    text-align: center;
    margin: 0px;
    font-size: 21px;
    clear: both;
}

#nvidia_digital_subscription .nvidia-ds-modal-body-text-body {
    text-align: center;
    margin-top: 16px;
    margin-bottom: 40px;
}

#nvidia_digital_subscription .nvidia-ds-view-more-details {
    width: 100%;
    background-color: #E6007E;
    border-color: #E6007E;
    margin-top: 48px;
}

    #nvidia_digital_subscription .nvidia-ds-view-more-details:hover {
        color: white;
    }

#nvidia_digital_subscription .nvidia-ds-error-container .nvidia-ds-view-more-details {
    max-width: 300px;
}

#nvidia_digital_subscription .modal-flex {
    display: flex;
    align-items: center;
}

#nvidia_digital_subscription .modal-dialog {
    margin: 0 auto;
}

#nvidia_digital_subscription .not-eligible-header {
    font-weight: bold;
}

#nvidia_digital_subscription .nvidia-ds-modal-emphasis-delete {
    font-weight: bold;
    color: #BB0E0E;
}

#nvidia_digital_subscription .nvidia-ds-confirm-service-deletion-modal img {
    display: block;
    margin: 0 auto;
}

#nvidia_digital_subscription .nvidia-ds-delete-button {
    border: 1px solid #D91B1B;
    color: #D91B1B;
    border-radius: 4px;
    padding: 14px;
    height: 85%;
    align-self: center;
    text-align: center;
}

    #nvidia_digital_subscription .nvidia-ds-delete-button img {
        height: 18px;
        margin: 0 auto;
        margin-bottom: 5px;
    }

    #nvidia_digital_subscription .nvidia-ds-delete-button p {
        margin-bottom: 0px;
    }

#nvidia_digital_subscription .nvidia-ds-date-activated-on {
    background-color: #F2F4F6;
    padding: 18px;
    color: #5A6F84;
    height: 85%;
    align-self: center;
}

    #nvidia_digital_subscription .nvidia-ds-date-activated-on p {
        margin-bottom: 0px;
    }

#nvidia_digital_subscription .nvidia-ds-error-container {
    width: 100%;
    text-align: center;
}

    #nvidia_digital_subscription .nvidia-ds-error-container h3 {
        font-weight: bold;
        text-align: center;
    }

#nvidia_digital_subscription .nvidia-ds-delete-button p {
    text-align: center;
}

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

/*********Roaming and International*********/
#roaming_international {
    padding-left: 48px;
    padding-right: 48px;
}

    #roaming_international hr {
        margin-top: 0;
        margin-bottom: 32px;
    }

    #roaming_international h2 {
        margin: 0px;
    }

    #roaming_international .ri-header {
        border-radius: 22px;
        z-index: 3;
        width: 100%;
        position: relative;
        background-color: #476f8b;
        margin-top: 24px;
        height: 182px;
    }

        #roaming_international .ri-header h2 {
            width: 40%;
            font-size: 32px;
            font-weight: bold;
            color: white;
            margin: 0px;
            padding: 48px;
        }

    #roaming_international .ri-content {
        display: flex;
        flex-wrap: wrap;
        gap: 16px;
        margin-top: 32px;
    }

    #roaming_international .ri-dropdown-container-container {
        margin-bottom: 32px;
    }

    #roaming_international .ri-general-information-element {
        margin-bottom: 32px;
    }

    #roaming_international .card {
        display: flex;
        align-items: flex-end;
        align-content: flex-end;
        padding: 24px;
        border: solid 1px #e2e6eb;
        width: 32.3%;
        gap: 16px;
        border-radius: 16px;
        justify-content: space-between;
        text-decoration: none;
        color: black;
    }

        #roaming_international .card:hover {
            text-decoration: none;
            color: black;
        }

        #roaming_international .card:active {
            text-decoration: none;
            color: black;
        }

        #roaming_international .card h2 {
            font-size: 16px;
            font-weight: bold;
            color: #11120e;
            margin-top: 0px;
            margin-bottom: 0px;
        }

        #roaming_international .card p {
            margin-top: 12px;
            margin-bottom: 0px;
            font-size: 14px;
        }

    #roaming_international .ri-header-img-desktop, #roaming_international .ri-header-img {
        position: absolute;
        width: 100%;
        border-radius: 24px;
        z-index: -100;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        height: 182px;
    }

    #roaming_international .link-back {
        margin-bottom: 24px;
        margin-top: 24px;
        color: #0070c9;
        font-weight: bold;
    }

        #roaming_international .link-back img {
            height: 22px;
            vertical-align: text-bottom;
        }

    #roaming_international .ri-header-text {
        padding-left: 48px;
        padding-top: 35px;
        padding-right: 48px;
    }

    #roaming_international .ri-dropdown-note {
        font-weight: 400;
        font-size: 12px;
        line-height: 34px;
        margin-bottom: 24px !important;
    }

    #roaming_international .ri-header-text p, #roaming_international .ri-header-text h2 {
        color: white;
    }

    #roaming_international .ri-header-text h2 {
        padding: 0px;
    }

    #roaming_international .ri-header-text p {
        margin: 0px;
        margin-top: 16px;
        font-size: 16px;
        width: 50%;
    }

    #roaming_international .ri-general-information-element {
        margin-bottom: 32px;
    }

    #roaming_international .ri-level-02, #roaming_international .ri-level-03 {
        margin-top: 24px;
    }

    #roaming_international .ri-info-card {
        padding: 16px 24px;
        border-radius: 16px;
        background-color: #f9fafb;
    }

    #roaming_international .ri-info-card-container {
        background-color: #f9fafb;
        border-radius: 16px;
    }

    #roaming_international .ri-notes-mobile {
        margin-top: 40px;
        width: 100%;
    }

    #roaming_international .ri-info-card-category {
        font-size: 16px;
        margin-bottom: 8px;
    }

    #roaming_international .ri-info-card-text {
        font-size: 24px;
        font-weight: 600;
        margin-bottom: 16px;
    }

    #roaming_international .ri-info-card-subtext {
        font-size: 18px;
        font-weight: normal;
        margin-bottom: 0px;
    }

    #roaming_international .ri-info-card-container {
        margin-bottom: 32px;
    }

    #roaming_international .ri-level-03 .ri-header {
        height: 384px;
    }

        #roaming_international .ri-level-03 .ri-header img {
            height: 384px;
        }

    #roaming_international .ri-notes-list {
        padding-left: 20px;
    }

    #roaming_international .ri-notes-header {
        margin-top: 0px;
        font-size: 24px;
        font-weight: 600;
        margin-bottom: 24px;
    }

    #roaming_international .ri-highlighted-text {
        background-color: #008388;
        opacity: 0.3;
    }

    #roaming_international .ri-custom-input {
        padding: 12px 16px;
        border-radius: 4px;
        border: solid 1px #d1d7e0;
        box-shadow: unset;
        margin-top: 16px;
        height: 48px;
    }

        #roaming_international .ri-custom-input:focus {
            border-color: #0070c9;
        }

    #roaming_international .input-group {
        width: 100%;
    }

    #roaming_international .ri-search-background {
        background-image: url("https://www.jo.zain.com/english/PublishingImages/RoamingAndInternational/ri-icon-search.png");
        background-position: 99%;
        background-repeat: no-repeat;
        background-size: 24px 24px;
    }

    #roaming_international .ri-dropdown-container h2 {
        font-size: 24px;
        font-weight: bold;
        color: #11120e;
        margin-top: 0px;
    }

    #roaming_international .ri-dropdown-countries-container {
        padding-top: 8px;
        position: absolute;
        z-index: 3;
        width: 100%;
    }

        #roaming_international .ri-dropdown-countries-container ul {
            max-height: 200px;
            overflow-y: scroll;
            padding-left: 0px;
            margin-left: 0px;
            background-color: #f5f6f8 !important;
            border: 3px solid #f5f6f8 !important;
            border-radius: 7px;
            display: none;
        }

        #roaming_international .ri-dropdown-countries-container li {
            margin-left: 0px !important;
            padding-left: 0px !important;
            padding-top: 13px !important;
            padding-left: 15px !important;
            padding-bottom: 13px !important;
            padding-right: 13px !important;
            background-color: white !important;
            display: none;
        }

            #roaming_international .ri-dropdown-countries-container li:hover {
                background-color: #f5f6f8 !important;
            }

        #roaming_international .ri-dropdown-countries-container ul {
            padding-left: 0px;
            margin-left: 0px;
        }

    #roaming_international .ri-collapse-menu hr {
        margin-top: 22px;
        margin-bottom: 22px;
    }

    #roaming_international .ri-after-divider, #roaming_international .ri-before-divider {
        position: relative;
    }

    #roaming_international .ri-table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0 4px;
        margin-bottom: 32px;
    }

        #roaming_international .ri-table th {
            padding: 16px 12px;
            background-color: #ebeef1;
            font-weight: bold;
            width: 50%;
        }

        #roaming_international .ri-table td {
            padding: 16px 12px;
            background-color: #f9fafb;
            width: 50%;
        }

    #roaming_international .ri-lightbulb-element {
        background-color: #008388;
        padding: 24px 28px;
        border-radius: 16px;
        margin-bottom: 32px;
    }

    #roaming_international .ri-lightbulb-element {
        color: white;
    }

    #roaming_international .ri-lightbulb-header {
        display: flex;
        justify-content: space-between;
        margin-bottom: 24px;
    }

        #roaming_international .ri-lightbulb-header p {
            font-size: 24px;
            font-weight: bold;
        }

    #roaming_international .ri-content-column1 {
        min-width: 641px;
        max-width: 641px;
        flex-basis: auto;
    }

    #roaming_international .ri-faq-button-trigger:hover {
        text-decoration: none;
    }

    #roaming_international .ri-faq-button-trigger:focus {
        text-decoration: none;
    }

    #roaming_international .ri-faq-trigger {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
    }

        #roaming_international .ri-faq-trigger p {
            font-size: 21px;
            font-weight: bold;
            margin-bottom: 24px;
        }

    #roaming_international .ri-faq-content {
        margin-bottom: 23px;
    }

    #roaming_international .ri-invert-collapse-icon {
        transform: rotate(180deg);
    }

    #roaming_international .ri-faq-header {
        font-size: 32px;
        font-weight: bold;
        margin-bottom: 32px;
    }

    #roaming_international .ri-content-column3 hr {
        margin-top: 0px;
        margin-bottom: 22px;
    }

    #roaming_international .link-back img {
        display: inline-block;
        width: 22px;
        height: 22px;
        font-weight: bold;
        vertical-align: middle;
    }

    #roaming_international .link-back:hover {
        text-decoration: none;
    }


    #roaming_international .ri-notes-column {
        max-width: 350px;
    }

    #roaming_international .ri-notes-list li {
        margin-bottom: 24px;
        font-size: 18px;
    }

    #roaming_international .selectpicker {
        padding: 12px 12px 12px 16px !important;
        border-radius: 4px !important;
        border: solid 1px #d1d7e0 !important;
        box-shadow: unset !important;
        margin-bottom: 0px !important;
    }

    #roaming_international .ri-dropdown-header {
        font-size: 16px;
        margin-bottom: 8px;
    }

    #roaming_international .ri-level-3-super-header {
        font-size: 19px;
        width: 50%;
    }

    #roaming_international .ri-level-3-header {
        font-size: 48px;
        width: 50%;
    }

    #roaming_international .ri-level-3-sub-header {
        font-size: 21px;
        width: 50%;
    }

    #roaming_international .ri-international-rates {
        background-color: #f5f6f8 !important;
        border-radius: 16px;
        margin-bottom: 32px;
    }

    #roaming_international .ri-international-prices-trigger {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        #roaming_international .ri-international-prices-trigger h2 {
            margin: 0px;
            font-size: 24px;
            color: #11120e;
            font-weight: bold;
        }

    #roaming_international .ri-collapse-menu {
        margin-bottom: 32px;
    }

        #roaming_international .ri-collapse-menu .ri-info-card {
            margin-top: 16px;
        }

    #roaming_international .ri-level-03 .ri-header h2 {
        font-size: 48px;
        width: 55%;
    }

    #roaming_international .ri-level-03 .ri-header p {
        font-size: 19px;
        width: 45%;
    }

    #roaming_international .ri-header-img-mobile {
        height: 170px;
        margin-top: 24px;
        position: relative;
        width: 100%;
        border-radius: 16px;
        margin-bottom: 16px;
        display: none;
    }

    #roaming_international .fi {
        margin-right: 10px;
    }

    #roaming_international .ri-clear-input {
        float: right;
        z-index: 100;
        position: relative;
        top: -35px;
        left: -10px;
        color: #0070c9 !important;
    }

    #roaming_international .ri-text-before-divider {
        margin-bottom: 32px;
    }

        #roaming_international .ri-text-before-divider h2 {
            font-size: 24px;
            font-weight: bold;
        }

        #roaming_international .ri-text-before-divider p {
            margin-top: 24px;
            margin-bottom: 0px;
        }

    #roaming_international .ri-flag-textbox {
        float: left;
        position: absolute;
        position: absolute;
        z-index: 10;
        top: 30px;
        left: 20px;
    }

    #roaming_international .ri-country-selected-input {
        padding-left: 50px;
    }

    #roaming_international li::marker {
        color: #476f8b;
    }

    #roaming_international .ri-content-column3 a {
        color: unset;
        text-decoration: none;
    }

    #roaming_international .ri-level-03 .ri-content {
        gap: 48px;
        margin-top: 48px;
    }

    #roaming_international .card-column {
        display: flex;
        height: 100%;
        flex-direction: column;
    }

    #roaming_international .ri-level-3-super-header {
        visibility: hidden;
    }

    #roaming_international .ri-faq-categories-container .ri-faq-category-trigger {
        padding: 13px;
        background-color: #F7F7F7;
        font-size: 18px;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
        gap: 30px;
    }

        #roaming_international .ri-faq-categories-container .ri-faq-category-trigger p {
            margin: 0px;
        }

    #roaming_international .ri-faq-categories-container .ri-faq-categories-trigger {
        display: flex;
        justify-content: space-between;
        gap: 30px;
        font-weight: bold;
        padding: 5px 15px;
        border-bottom: 2px solid #F7F7F7;
    }

        #roaming_international .ri-faq-categories-container .ri-faq-categories-trigger p {
            font-size: 15px;
            margin: 0;
        }


    #roaming_international .ri-faq-categories-container .ri-faq-categories .ri-faq-categories-content {
        padding: 10px 15px;
    }

        #roaming_international .ri-faq-categories-container .ri-faq-categories .ri-faq-categories-content p {
            font-size: 15px;
            margin: 0;
        }

    #roaming_international .ri-faq-link {
        color: #37ace5 !important;
    }

        #roaming_international .ri-faq-link:hover {
            text-decoration: underline;
        }

    #roaming_international .ri-volte-device {
        padding: 5px 12px;
        border: 1px solid #E3E2E2;
        border-radius: 7px;
        margin-right: 5px;
        margin-top: 10px;
        display: none;
    }

    #roaming_international .ri-volte-gie {
        margin-bottom: 10px;
    }

        #roaming_international .ri-volte-gie h2 {
            font-size: 30px;
            font-weight: bold;
            margin-bottom: 10px !important;
        }

    #roaming_international .ri-volte-categories-container {
        margin-top: 15px;
    }

    #roaming_international a.nav-link {
        color: black;
        padding: 10px;
    }

        #roaming_international a.nav-link.active {
            border: 0px !important;
            border-bottom: 5px solid #40B5E1 !important;
        }

    #roaming_international span.ri-volte-device.active-pill {
        background: #C0EFFE;
    }


    #roaming_international ul.steps-numbered-list {
        counter-reset: li;
        list-style-type: none;
        padding: 1px;
    }

    #roaming_international .step-numbered-list {
        position: relative;
        padding: 8px 0 8px 30px;
    }

    #roaming_international ul.steps-numbered-list {
        counter-reset: li;
        list-style-type: none;
        padding: 10px 0px 0px 0px;
        gap: 16px;
    }

    #roaming_international .step-numbered-list {
        padding: 6px 0px 6px 0px;
    }

        #roaming_international .step-numbered-list:before {
            content: "0"counter(li);
            counter-increment: li;
            display: inline-block;
            width: 36px;
            height: 36px;
            margin: 0 5px 0 0;
            border-radius: 30px;
            text-align: center;
            left: 10px;
            top: 8px;
            Right: 10px;
            Bottom: 8px;
            background: #008388;
            line-height: 36px;
            color: white;
            font-size: small;
        }

    #roaming_international .steps-tab-container-nav-tabs {
        border-bottom: 4px solid #EDEDED;
    }

    #roaming_international .steps-tab-container > .steps-tab-container-nav-tabs > .nav-item > a.nav-link.active {
        border-bottom: 4px solid #008388 !important;
    }

    #roaming_international .ri-Volte_countries {
        border: 1px solid #D9D9D9;
        width: 80%;
        padding: 25px 35px 25px 35px;
        gap: 11px;
        /*text-align: left;*/
        margin: 0px;
        margin-bottom: 32px;
    }

    #roaming_international .Volte_country_header {
        font-size: 18px;
        font-weight: 800;
        line-height: 25.2px;
        /*text-align: left;*/
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
    }

    #roaming_international .Volte_country_header_list {
        list-style-type: none;
        margin: 0px;
        padding: 0px;
        font-size: 14px;
        font-weight: 400;
        line-height: 21px;
        /*text-align: left;*/
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
    }


    #roaming_international .BuyBundle {
        width: 129px;
        height: 39px;
        top: 782.76px;
        left: 662px;
        gap: 7px;
        border-radius: 45px;
        opacity: 0px;
        background: #37ACE5;
        color: white;
        text-decoration: none;
        cursor: pointer;
        border: #37ACE5;
    }


#business-thank-you {
    height: 80vh;
}

    #business-thank-you .thank-you-body {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
    }



/***********************Cer********************************/


#CER .tab-Img {
    width: 100%;
}

#CER .CerTabs > li.active > a {
    background: #0B807D;
    color: white;
}

#CER .CerTabs > li {
    border-radius: 0px;
    border: 1px solid #E3E5E9;
    border-top: 0px;
}

    #CER .CerTabs > li > a {
        height: 60px;
        font-family: "Zain";
        font-weight: 700;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0px;
        padding: 18px;
        color: black;
        border-radius: 0px !important;
        margin: 0;
        margin-top: -2px;
    }

#CER .Cer-Tab-title {
    font-family: "Zain";
    font-weight: 700;
    font-size: 37px;
    line-height: 100%;
    letter-spacing: -1px;
    color: #0B807D;
    margin-bottom: 32px;
}

#CER .Cer-tab-content {
    width: 80%;
    margin: auto;
    height: auto !IMPORTANT;
    max-height: max-content !IMPORTANT;
}

#CER .Cer-Tab-First-Desc {
    width: 94%;
    font-weight: 400;
    line-height: 100%;
    text-align: justify;
    font-family: "Zain";
    font-weight: 400;
    font-size: 19px;
    letter-spacing: 0px;
    text-align: justify;
    margin-top: 20px;
}

#CER .ImgFirstDesc {
    height: 280px;
    width: 100%;
}

#CER .ImgFirstDescDiv {
    text-align: center;
}

#CER .ri-lightbulb-element-CER {
    background: #008388;
    background: linear-gradient(180deg, #0DA29F 0%, #0A7977 100%);
    margin-bottom: 32px;
    color: white;
    border-radius: 10px;
    padding-top: 48px;
    padding-right: 55px;
    padding-bottom: 48px;
    padding-left: 55px;
}

#CER .Cer-GreenTitleBox {
    font-family: "Zain";
    font-weight: 700;
    font-size: 38px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
}

#CER .Cer-GreenBtnBoxDiv {
    text-align: center;
    padding: 0px;
    display: flex;
    align-content: stretch;
    justify-content: center;
    align-items: baseline;
    flex-wrap: wrap;
}

#CER .Cer-GreenBtnBox {
    border-radius: 9px;
    font-family: Zain;
    font-weight: 700;
    font-size: 20px;
    letter-spacing: 0px;
    color: #0B807D;
    background: #FFFFFF;
    border: none;
    text-decoration: none !important;
    padding: 18px 25px 18px 25px;
    cursor: pointer;
}

    #CER .Cer-GreenBtnBox > svg {
        width: AUTO !IMPORTANT;
        height: AUTO !IMPORTANT;
    }

        #CER .Cer-GreenBtnBox > svg : hover {
            fill: #0B807D;
        }

#CER .Cer-Tab-Second-Desc {
    font-weight: 400;
    font-size: 19px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: justify;
    margin-bottom: 40px;
    font-family: "Zain";
}

#CER .title-zinc-img {
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0px;
    margin-bottom: 40px;
}

#CER .frame-zinc-img {
    width: 100%;
    margin: auto;
    margin-bottom: 32px;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

    #CER .frame-zinc-img > img {
        width: 100%;
    }




#CER .ZINCProgramsImgFirstDesc {
    width: 70%;
}

#CER .ZINCProgramsImgFirstDescDiv {
    margin-bottom: 32px;
}



#CER .accordion-plus-toggle {
    background: transparent;
    text-decoration: none;
    font-family: "Zain";
    font-weight: 700;
    font-size: 25px;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
}
    /* plus glyph for showing collapsible panels */
    #CER .accordion-plus-toggle:before {
        font-family: FontAwesome;
        content: "\f00d";
        float: inline-end;
        color: silver;
        font-size: small;
        color: #0B807D;
    }

    #CER .accordion-plus-toggle.collapsed:before {
        content: "\f067";
        color: #0B807D;
    }

/* arrow glyph for showing collapsible panels */
#CER .panel-heading-ZINCPrograms .accordion-arrow-toggle:before {
    font-family: FontAwesome;
    content: "\f00d";
    float: inline-end;
    color: silver;
}

#CER .panel-heading-ZINCPrograms .accordion-arrow-toggle.collapsed:before {
    content: "\f054";
    color: silver;
}

/* sets the link to the width of the entire panel title */
#CER .panel-title > .accordion-plus-toggle {
    display: block;
}


#CER .panel-heading-ZINCPrograms {
    color: black;
    background-color: transparent !important;
}

#CER .panel-heading-ZINCPrograms {
    border-radius: 0px !important;
    border-bottom: 1px solid #EFEFEF;
    padding: 16px 0px 16px 0px;
}

#CER .panel-ZINCPrograms {
    border-radius: 0px !important;
    border: none !important;
    box-shadow: none !important;
}

#CER .panel-body-ZINCPrograms {
    border: none;
    padding: 24px 0px 24px 0px;
    border-bottom: 1px solid #EFEFEF;
}



#CER .body-GreenBox-ZINCPrograms-hidden {
    display: none;
    opacity: 0;
}

#CER .Cer-GreenTitleBox_ {
    font-family: "Zain";
    font-weight: 700;
    font-size: 25px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
}

#CER .bold {
    font-weight: bold;
}


#CER .ZINCHighlights_Img {
    width: 100%;
    height: 345px;
    margin-bottom: 32px;
    border-radius: 10px;
}

#CER .TextDisplayTitle {
    height: 145px;
    width: 93%;
    z-index: 100;
    position: absolute;
    text-align: center;
    top: 201px;
    color: white;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 82.5%);
    border-radius: 10px;
}

#CER .ZINCHighlights_DisplayTitle {
    bottom: 10px;
    max-height: 200px;
    width: 70%;
    overflow: hidden;
    z-index: 0;
    position: absolute;
    text-align: center;
    left: 15%;
}


#CER .ZINC_Locations_Img {
    vertical-align: middle;
    width: 100px;
    height: 100px;
    margin-bottom: 16px;
}

#CER .ZINC_LocationsTextDisplayTitle {
    font-family: "Zain";
    font-weight: 700;
    font-size: 19px;
    margin-bottom: 32px;
}


/*********prepaid-packages-slider********/
#prepaid-packages-slider {
    padding: 0 12px;
}

    #prepaid-packages-slider .card-package.subscriptions {
        width: 356px;
        min-height: 440px;
        border: 1px solid #E1E6EC;
        height: 100%;
        margin: 0 12px;
        border-radius: 12px;
        position: relative;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
    }

        #prepaid-packages-slider .card-package.subscriptions .ribbon-default {
            background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/ribbon-default-blue.png');
            background-repeat: no-repeat;
            background-position: center;
            background-size: 100% 100%;
            width: 310px;
            min-height: 10px;
            position: absolute;
            top: 0;
            left: 50%;
            transform: translate(-50%, -5px);
            padding: 0 45px;
            padding-top: 4px;
            text-align: center;
            z-index: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 4px;
        }

            #prepaid-packages-slider .card-package.subscriptions .ribbon-default h4,
            #prepaid-packages-slider .card-package.subscriptions .ribbon-default label {
                display: none;
            }

            #prepaid-packages-slider .card-package.subscriptions .ribbon-default.active {
                background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/ribbon-pink.png');
                min-height: 46px;
                transform: translate(-50%, -8px);
                display: flex;
                flex-direction: column;
                justify-content: center;
            }

                #prepaid-packages-slider .card-package.subscriptions .ribbon-default.active h4 {
                    display: block;
                    color: #fff;
                    font-weight: bold;
                    font-size: 14px;
                    padding: 0;
                    margin: 0;
                    line-height: 1;
                }

                #prepaid-packages-slider .card-package.subscriptions .ribbon-default.active label {
                    display: block;
                    color: #fff;
                    font-weight: normal;
                    font-size: 12px;
                    padding: 0;
                    margin: 0;
                    line-height: 1;
                }

        #prepaid-packages-slider .card-package.subscriptions .card-package-header {
            position: relative;
        }

        #prepaid-packages-slider .card-package.subscriptions .portal-5g-package-logo {
            position: absolute;
            top: 40px;
            right: 20px;
        }

            #prepaid-packages-slider .card-package.subscriptions .portal-5g-package-logo img {
                width: 50px;
                height: 50px;
            }


        #prepaid-packages-slider .card-package.subscriptions .card-package-header h3 {
            margin-top: 48px;
            margin-bottom: 16px;
            padding: 0 30px;
            color: #000;
            font-size: 30px;
            font-weight: bold;
            max-width: 60%;
            margin-left: 0;
            white-space: nowrap;
        }

        #prepaid-packages-slider .card-package.subscriptions .portal-5g-package-hr {
            margin-bottom: 12px;
            margin-top: 12px;
            height: 1px;
            border-top: 1px solid #ebf1f8;
            width: 100%;
        }

        #prepaid-packages-slider .card-package.subscriptions .portal-5g-package-inner-container {
            padding: 0 30px;
            margin-bottom: 20px;
        }

        #prepaid-packages-slider .card-package.subscriptions .portal-5g-package-monthly-subscription-tag {
            margin-bottom: 2px;
            font-size: 20px;
        }

        #prepaid-packages-slider .card-package.subscriptions .portal-5g-package-subscription h4 {
            font-weight: bold;
            font-size: 30px;
            display: inline;
        }



        #prepaid-packages-slider .card-package.subscriptions .card-package-details {
            padding: 12px 0;
            max-height: 250px;
            overflow-y: auto;
            min-height: 250px;
        }

            #prepaid-packages-slider .card-package.subscriptions .card-package-details ul {
                padding: 0;
                list-style: none;
            }

                #prepaid-packages-slider .card-package.subscriptions .card-package-details ul li {
                    padding: 8px 0;
                    padding: 10px 0 10px 46px;
                    position: relative;
                    font-size: 14px;
                    font-weight: 600;
                    color: #000;
                }

                    #prepaid-packages-slider .card-package.subscriptions .card-package-details ul li:nth-child(odd) {
                        background-color: #F9FAFB;
                    }

                    #prepaid-packages-slider .card-package.subscriptions .card-package-details ul li:before {
                        content: '';
                        color: #e3097e;
                        font-weight: 700;
                        font-size: 14px;
                        content: '✓';
                        position: absolute;
                        top: 50%;
                        left: 23px;
                        transform: translate(-50%,-50%);
                    }

        #prepaid-packages-slider .card-package.subscriptions .card-package-action {
            padding: 20px 0;
            margin-top: auto;
        }

            #prepaid-packages-slider .card-package.subscriptions .card-package-action a {
                background: #37ACE5;
                border-radius: 20px;
                width: 295px;
                display: block;
                margin: 0 auto;
                height: 40px;
                color: #fff;
                text-align: center;
                padding: 10px;
                font-size: 14px;
                border: none;
                outline: none;
                text-decoration: none;
            }

    #prepaid-packages-slider .details-link {
        background-color: transparent !important;
        color: #37ace5 !important;
        padding: 0 !important;
    }
/*********prepaid-packages-slider********/


/****Corporate Responsibility****/

#corporate-responsibility-revamp {
    padding-top: 75px;
    padding-bottom: 75px;
}

    #corporate-responsibility-revamp .corporate-responsibility-header-img-desktop, #corporate-responsibility-revamp .corporate-responsibility-header-img-mobile {
        width: 100vw;
    }

    #corporate-responsibility-revamp .corporate-responsibility-header {
        max-height: 330px;
        position: relative;
        overflow: hidden;
    }

    #corporate-responsibility-revamp .corporate-responsibility-header-text-container {
        position: absolute;
        top: 30%;
        width: 100%;
    }

    #corporate-responsibility-revamp .corporate-responsibility-header-super {
        color: #54B8E9;
        font-weight: bold;
        font-size: 40px;
        margin: 0 auto;
        text-align: right;
        max-width: 1121px;
    }

    #corporate-responsibility-revamp .corporate-responsibility-header-text {
        color: black;
        padding-top: 5px;
        font-weight: bold;
        font-size: 22px;
        max-width: 1121px;
        margin: 0 auto;
        text-align: right;
    }

    #corporate-responsibility-revamp .corporate-responsibilty-tabs-desktop-container {
        width: 100%;
        border: 1px solid #D1D7E0;
        margin-bottom: 28px;
    }

    #corporate-responsibility-revamp .corporate-responsibilty-tabs-desktop {
        display: flex;
        width: 100%;
        min-height: 58px;
        justify-content: center;
        max-width: 1121px;
        margin: 0 auto;
    }

        #corporate-responsibility-revamp .corporate-responsibilty-tabs-desktop .inactive {
            font-size: 18px;
            text-align: center;
            font-weight: bold;
            padding-top: 15px;
            padding-left: 45px;
            padding-right: 45px;
            padding-bottom: 20px;
            background-color: white;
            border: 0;
            border-right: 1px solid #D1D7E0;
            transition: 0.2s;
        }

            #corporate-responsibility-revamp .corporate-responsibilty-tabs-desktop .inactive:nth-child(1) {
                border-left: 1px solid #D1D7E0;
            }

            #corporate-responsibility-revamp .corporate-responsibilty-tabs-desktop .inactive:hover {
                background-color: #6FB6E4 !important;
                color: white;
                transition: 0.2s;
            }

        #corporate-responsibility-revamp .corporate-responsibilty-tabs-desktop .active {
            font-size: 18px;
            text-align: center;
            font-weight: bold;
            padding-top: 15px;
            padding-left: 45px;
            padding-right: 45px;
            padding-bottom: 20px;
            border: 0;
            border-right: 1px solid #D1D7E0;
            background: #6FB6E4;
            color: white;
        }

    #corporate-responsibility-revamp .corporate-responsibility-body {
        display: flex;
        max-width: 1121px;
        margin: 0 auto;
        justify-content: space-between;
        gap: 27px;
        flex-wrap: wrap;
    }

    #corporate-responsibility-revamp .corporate-responsibility-details-body {
        position: relative;
        max-width: 260px;
    }

        #corporate-responsibility-revamp .corporate-responsibility-details-body .corporate-responsibility-card-overlay {
            top: 50%;
            height: 150px;
            width: 100%;
            position: absolute;
            background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
            z-index: 111;
            border-bottom-left-radius: 7px;
            border-bottom-right-radius: 7px;
        }

        #corporate-responsibility-revamp .corporate-responsibility-details-body .cr-thumbnail-image {
            border: 1px solid white;
            border-radius: 7px;
        }

        #corporate-responsibility-revamp .corporate-responsibility-details-body .cr-thumbnail-text {
            position: absolute;
            top: 70%;
            text-align: center;
            width: 100%;
            font-size: 21px;
            font-weight: bold;
            color: white;
            z-index: 1000;
            padding-left: 10px;
            padding-right: 10px;
        }

    #corporate-responsibility-revamp .corporate-responsibilty-tabs-menu {
        width: 100%;
        padding: 10px;
        background-color: #54B8E9;
        color: white;
        text-decoration: none;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
    }

        #corporate-responsibility-revamp .corporate-responsibilty-tabs-menu .toggle-arrow {
            width: 22px;
            height: 22px;
        }

    #corporate-responsibility-revamp [aria-expanded='true'] .toggle-arrow {
        transform: rotate(180deg);
        transition: 0.2s;
    }

    #corporate-responsibility-revamp .corporate-responsibilty-tabs-menu .toggle-arrow svg {
        width: 22px;
        height: 22px;
    }

    #corporate-responsibility-revamp .corporate-responsibilty-tabs-button-mobile {
        display: block;
        width: 100%;
        background-color: #FFFFFF;
        border-bottom: 1px solid;
        border: 0px;
        padding: 10px;
        text-align: left;
        border-bottom: 1px solid #D1D7E0;
        color: black;
    }



#press-releases-revamp {
}

    #press-releases-revamp .press-release-header {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 16px;
        justify-items: start;
        align-items: start;
        margin-bottom: 38px;
    }

    #press-releases-revamp .press-release-title {
        align-self: center;
    }

        #press-releases-revamp .press-release-title h3 {
            font-weight: bold;
            font-size: 32px;
            margin-bottom: 0px;
        }

    #press-releases-revamp .pr-search-box-container {
        text-align: right;
        position: relative;
        align-self: end;
    }

    #press-releases-revamp .press-release-search-box {
        width: 364px;
        height: 40px;
        padding: 8px 12px 8px 16px;
        border-radius: 4px;
        border: solid 1px #d1d7e0;
        font-size: 14px;
        box-shadow: none;
    }

    #press-releases-revamp .pr-search-box-container img {
        position: absolute;
        right: 8px;
        top: 50%;
        transform: translateY(-50%);
    }

    #press-releases-revamp .press-release-body-container {
        display: flex;
        flex-wrap: wrap;
        gap: 46px;
    }

        #press-releases-revamp .press-release-body-container .press-release-card {
            min-width: 349px;
            max-width: 349px;
        }


            #press-releases-revamp .press-release-body-container .press-release-card .press-release-card-image {
                height: 205px;
                overflow: hidden;
                margin-bottom: 16px;
                border: 1px solid white;
                border-radius: 7px;
            }

                #press-releases-revamp .press-release-body-container .press-release-card .press-release-card-image img {
                    width: 100%;
                    opacity: 1;
                    transition: opacity 1s ease-in, transform 0.3s ease-in;
                    transform: translate(-50%,-50%);
                    top: 50%;
                    left: 50%;
                    position: relative;
                    border: 1px solid white;
                    border-radius: 7px;
                    aspect-ratio: 16 / 9;
                }

                    #press-releases-revamp .press-release-body-container .press-release-card .press-release-card-image img:hover {
                        transform: translate(-50%,-50%) scale(1.05);
                    }

                #press-releases-revamp .press-release-body-container .press-release-card .press-release-card-image .card-loader {
                    display: none;
                    height: 100%;
                    width: 100%;
                    position: relative;
                }

                #press-releases-revamp .press-release-body-container .press-release-card .press-release-card-image span {
                    height: 25px;
                    width: 25px;
                    border: 2px solid #778ca2;
                    border-radius: 50%;
                    border-bottom-color: #fff;
                    position: absolute;
                    display: block;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%,-50%) rotate(0deg);
                    animation: rotate-loading 2s linear infinite;
                }

                #press-releases-revamp .press-release-body-container .press-release-card .press-release-card-image.press-release-card-loading img {
                    opacity: 0;
                }

                #press-releases-revamp .press-release-body-container .press-release-card .press-release-card-image.press-release-card-loading .card-loader {
                    display: block;
                }

    #press-releases-revamp .press-release-card-title a {
        font-weight: bold;
        font-size: 19px;
        margin-bottom: 9px;
        margin-top: 0px;
        color: black;
        text-decoration: none;
    }

    #press-releases-revamp .press-release-card-brief {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        #press-releases-revamp .press-release-card-brief p {
            font-size: 14px !important;
        }

    #press-releases-revamp .press-release-card-date {
        font-weight: bold;
    }

    #press-releases-revamp .press-release-card .press-releaseReadMoreText {
        margin-top: 8px;
        font-size: 15px;
        font-weight: bold;
        color: #0070C9;
        text-decoration: underline;
    }

    #press-releases-revamp .press-release-show-more-button-container {
        text-align: center;
        margin-bottom: 64px;
    }

    #press-releases-revamp .press-release-load-more-button {
        background-color: white;
        color: #1A7DB4;
        border: 1px solid #1A7DB4;
        border-radius: 24px;
        margin-top: 33px;
        min-width: 162px;
        padding-top: 11px;
        text-align: center;
    }


#esports-revamp {
}

    #esports-revamp .esports-header {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 16px;
        justify-items: start;
        align-items: start;
        margin-bottom: 38px;
    }

    #esports-revamp .esports-header-title {
        align-self: center;
    }

    #esports-revamp .esports-title h3 {
        font-weight: bold;
        font-size: 32px;
        margin-bottom: 0px;
    }

    #esports-revamp .esports-search-box-container {
        text-align: right;
        position: relative;
        align-self: end;
    }

    #esports-revamp .esports-search-box {
        width: 364px;
        height: 40px;
        padding: 8px 12px 8px 16px;
        border-radius: 4px;
        border: solid 1px #d1d7e0;
        font-size: 14px;
        box-shadow: none;
    }

    #esports-revamp .esports-search-box-container img {
        position: absolute;
        right: 8px;
        top: 50%;
        transform: translateY(-50%);
    }


    #esports-revamp .esports-body-container {
        display: flex;
        gap: 46px;
        flex-wrap: wrap;
    }

    #esports-revamp .esports-card {
        min-width: 349px;
        text-decoration: none !important;
        outline: none !important;
        color: #11120e !important;
        display: block;
    }

        #esports-revamp .esports-card .esports-card-image {
            height: 205px;
            overflow: hidden;
            margin-bottom: 16px;
            border: 1px solid white;
            border-radius: 7px;
        }

            #esports-revamp .esports-card .esports-card-image img {
                width: 100%;
                opacity: 1;
                transition: opacity 1s ease-in, transform 0.3s ease-in;
                transform: translate(-50%,-50%);
                top: 50%;
                left: 50%;
                position: relative;
                border: 1px solid white;
                border-radius: 7px;
            }

                #esports-revamp .esports-card .esports-card-image img:hover {
                    transform: translate(-50%,-50%) scale(1.05);
                }

            #esports-revamp .esports-card .esports-card-image .card-loader {
                display: none;
                height: 100%;
                width: 100%;
                position: relative;
            }

            #esports-revamp .esports-card .esports-card-image span {
                height: 25px;
                width: 25px;
                border: 2px solid #778ca2;
                border-radius: 50%;
                border-bottom-color: #fff;
                position: absolute;
                display: block;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%) rotate(0deg);
                animation: rotate-loading 2s linear infinite;
            }

            #esports-revamp .esports-card .esports-card-image.esports-card-image-loading img {
                opacity: 0;
            }

            #esports-revamp .esports-card .esports-card-image.esports-card-image-loading .card-loader {
                display: block;
            }

        #esports-revamp .esports-card img {
            min-width: 350px;
            max-height: 205px;
            min-height: 205px;
            margin-bottom: 16px;
            border: 1px solid white;
            border-radius: 7px;
        }

    #esports-revamp .esports-title {
        font-weight: bold;
        font-size: 19px;
        margin-bottom: 9px;
        margin-top: 0px;
    }



    #esports-revamp .esports-load-more-button {
        background-color: white;
        color: #1A7DB4;
        border: 1px solid #1A7DB4;
        border-radius: 24px;
        margin-top: 33px;
        min-width: 162px;
        padding-top: 11px;
        text-align: center;
    }


#pr-multimedia-revamp {
}

    #pr-multimedia-revamp .multimedia-header {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 16px;
        justify-items: start;
        align-items: start;
        margin-bottom: 38px;
    }

    #pr-multimedia-revamp .multimedia-header-title {
        align-self: center;
    }

        #pr-multimedia-revamp .multimedia-header-title h3 {
            font-weight: bold;
            font-size: 32px;
            margin-bottom: 0px;
        }

    #pr-multimedia-revamp .multimedia-search-box-container {
        text-align: right;
        position: relative;
        align-self: end;
    }

        #pr-multimedia-revamp .multimedia-search-box-container img {
            position: absolute;
            right: 8px;
            top: 50%;
            transform: translateY(-50%);
        }

    #pr-multimedia-revamp .multimedia-search-box {
        width: 364px;
        height: 40px;
        padding: 8px 12px 8px 16px;
        border-radius: 4px;
        border: solid 1px #d1d7e0;
        font-size: 14px;
        box-shadow: none;
    }


    #pr-multimedia-revamp .multimedia-body-container {
        display: flex;
        gap: 46px;
        flex-wrap: wrap;
    }

    #pr-multimedia-revamp .multimedia-card iframe {
        height: 205px;
        overflow: hidden;
        margin-bottom: 16px;
        border: 1px solid white;
        border-radius: 7px;
        opacity: 1;
    }

    #pr-multimedia-revamp .multimedia-card .multimedia-card-iframe .card-loader {
        display: none;
        height: 100%;
        width: 100%;
        position: relative;
    }

    #pr-multimedia-revamp .multimedia-card .multimedia-card-iframe.multimedia-card-loading iframe {
        opacity: 0;
    }

##pr-multimedia-revamp .multimedia-card .multimedia-card-iframe span {
    height: 25px;
    width: 25px;
    border: 2px solid #778ca2;
    border-radius: 50%;
    border-bottom-color: #fff;
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) rotate(0deg);
    animation: rotate-loading 2s linear infinite;
}



#pr-multimedia-revamp .multimedia-card .multimedia-card-iframe.multimedia-card-loading .card-loader {
    display: block;
}


#pr-multimedia-revamp .multimedia-title {
    font-weight: bold;
    font-size: 19px;
    margin-bottom: 9px;
    margin-top: 0px;
}

#pr-multimedia-revamp .multimedia-show-more-button-container {
    text-align: center;
}

#pr-multimedia-revamp .multimedia-load-more-button {
    background-color: white;
    color: #1A7DB4;
    border: 1px solid #1A7DB4;
    border-radius: 24px;
    margin-top: 33px;
    min-width: 162px;
    padding-top: 11px;
    text-align: center;
}

.pr-details-revamp img {
    max-height: 456px;
    border: 1px solid white;
    border-radius: 7px;
    display: block;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
}

.pr-details-revamp .pr-details-title-container h1 {
    font-size: 31px;
    font-weight: bold;
    margin-bottom: 28px;
}

#corporate-sustainability-details {
}

    #corporate-sustainability-details .corporate-sustainability-desktop {
        width: 100%;
        max-height: 456px;
        border: 1px solid white;
        border-radius: 7px;
        margin-bottom: 41px;
    }

    #corporate-sustainability-details .corporate-sustainability-details-body-container {
        display: flex;
        gap: 31px;
        justify-content: space-between;
    }

    #corporate-sustainability-details .corporate-sustainability-details-body {
        flex-grow: 1;
    }

        #corporate-sustainability-details .corporate-sustainability-details-body h3 {
            font-weight: bold;
            margin-top: 0px;
        }

    #corporate-sustainability-details .corporate-sustainability-categories {
        min-width: 25%;
    }

    #corporate-sustainability-details .category-selector.selected-category {
        width: 100%;
        opacity: 0.74;
        border: 1px solid #6FB6E4;
        background-color: #6FB6E4;
        padding: 12px;
        color: white;
        text-decoration: none;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
    }

        #corporate-sustainability-details .category-selector.selected-category .toggle-arrow {
            width: 22px !important;
            height: 22px !important;
        }

            #corporate-sustainability-details .category-selector.selected-category .toggle-arrow svg {
                width: 22px !important;
                height: 22px !important;
            }

                #corporate-sustainability-details .category-selector.selected-category .toggle-arrow svg path {
                    fill: white !important;
                }

    #corporate-sustainability-details .category-selector {
        width: 100%;
        opacity: 0.74;
        border: 1px solid #D1D7E0;
        background-color: white;
        padding: 5px;
        color: black;
        text-decoration: none;
        padding: 10px;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
    }

        #corporate-sustainability-details .category-selector .toggle-arrow {
            width: 22px !important;
            height: 22px !important;
        }

            #corporate-sustainability-details .category-selector .toggle-arrow svg {
                width: 22px !important;
                height: 22px !important;
            }

                #corporate-sustainability-details .category-selector .toggle-arrow svg path {
                    fill: black !important;
                }

        #corporate-sustainability-details .category-selector[aria-expanded='true'] .toggle-arrow svg {
            transform: rotateZ(-180deg);
            transition: 0.2s;
        }

    #corporate-sustainability-details .subcategory-selector {
        display: block;
        width: 100%;
        border: 1px solid #D1D7E0;
        color: black;
        padding: 8px;
        font-size: 14px;
        background: #FCFCFC;
        font-weight: bold;
    }

        #corporate-sustainability-details .subcategory-selector.selected-subcategory {
            display: block;
            width: 100%;
            border: 1px solid #E6F3FB;
            color: black;
            padding: 8px;
            font-size: 14px;
            background: #E6F3FB;
            font-weight: bold;
        }


#service-codes-revamp {
}

    #service-codes-revamp .service-codes-title {
        margin-bottom: 13px;
    }

        #service-codes-revamp .service-codes-title h3 {
            margin-bottom: 0px;
            font-size: 36px;
            font-weight: bold;
            line-height: 48px;
            color: black;
        }

    #service-codes-revamp .service-code {
        border: 1px solid #E1E1E1;
        border-radius: 4px;
        display: flex;
        margin-bottom: 13px;
        width: 100%;
    }

        #service-codes-revamp .service-code p {
            margin-bottom: 0px !important;
        }

        #service-codes-revamp .service-code .service-code-description, #service-codes-revamp .service-code .service-code-code {
            padding: 14px;
            width: 40%;
            border-right: 0.5px solid #E1E1E1;
            align-self: center;
        }

            #service-codes-revamp .service-code .service-code-description p {
                font-size: 14px;
                font-weight: bold;
                line-height: 16px;
            }

            #service-codes-revamp .service-code .service-code-code p {
                font-size: 14px;
                line-height: 16px;
            }

        #service-codes-revamp .service-code .service-code-link-container {
            text-decoration: none;
            display: block;
            width: 20%;
            background-color: #F8F8F8;
            color: #37ACE5;
            display: flex;
            justify-content: space-between;
            gap: 20px;
            padding: 14px;
        }

            #service-codes-revamp .service-code .service-code-link-container p {
                font-weight: 700;
                font-size: 13px;
                line-height: 12px;
                line-break: auto;
            }

            #service-codes-revamp .service-code .service-code-link-container img {
                width: 10px;
                height: 14px;
            }

/*********Support Content********/
#content_support {
}

    #content_support .section-gradient {
        background: radial-gradient(1289.88% 147.20% at 2.26% -4.17%, #2488DE 0%, #1C63A5 28.13%, #9058A1 100%);
    }

    #content_support .section-gray {
        background: #F9FAFB;
    }

    #content_support .banner-top {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 24px;
        padding: 40px 16px;
        min-height: 290px;
        max-width: 1182px;
        margin: 0 auto;
    }

        #content_support .banner-top h2 {
            padding: 0;
            margin: 0;
            font-size: 40px;
            color: #fff;
            font-weight: bold;
        }

        #content_support .banner-top p {
            padding: 0;
            margin: 0;
            font-size: 20px;
            color: #fff;
            font-weight: 600;
        }

        #content_support .banner-top .support-search-container {
            position: relative;
            max-width: 800px;
            width: 100%;
        }

        #content_support .banner-top .support-search-input-container {
            position: relative;
            max-width: 800px;
        }

            #content_support .banner-top .support-search-input-container .support-search-input {
                border-radius: 50px;
                border: 1.5px solid #C2C2C2;
                background: #FFF;
                width: 100%;
                height: 60px;
                padding: 20px 50px;
                font-size: 14px;
                z-index: 1;
                position: relative;
            }

            #content_support .banner-top .support-search-input-container img {
                position: absolute;
                top: 50%;
                right: 4px;
                transform: translateY(-50%);
                z-index: 1;
                width: 55px;
                height: 55px;
                cursor: pointer;
            }

    #content_support .support-search-result-container .dropdown-menu {
        margin: 0;
        width: 100%;
        background-color: #fff;
        z-index: 2;
        border-radius: 25px;
        border: 1.5px solid #C2C2C2;
        box-shadow: 0 5px 5px #ccc;
        border-top: none;
        padding: 20px;
        border-top-right-radius: 0;
        border-top-left-radius: 0;
        top: -17px;
        z-index: 0;
        padding-top: 30px;
    }

        #content_support .support-search-result-container .dropdown-menu li a {
            color: #000;
            font-size: 14px;
            font-weight: 600;
            text-decoration: none;
            outline: none;
        }

    #content_support .top-links {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 10px;
        padding: 24px 16px;
        min-height: 100px;
        max-width: 1182px;
        margin: 0 auto;
    }

        #content_support .top-links a {
            display: flex;
            flex-wrap: nowrap;
            justify-content: flex-start;
            align-items: center;
            gap: 14px;
            padding: 20px;
            text-decoration: none;
            outline: none;
            width: 280px;
            border-radius: 11px;
            border: 1px solid rgba(213, 232, 237, 0.80);
            background: #FFF;
            cursor: pointer;
        }

            #content_support .top-links a img {
                width: 60px;
                cursor: pointer;
            }

            #content_support .top-links a label {
                color: #0F0F0F;
                font-size: 18px;
                font-weight: bold;
                text-transform: uppercase;
                cursor: pointer;
            }

                #content_support .top-links a label small {
                    color: #000;
                    font-size: 12px;
                    font-style: normal;
                    font-weight: 500;
                    text-transform: initial;
                    cursor: pointer;
                }

    #content_support .question-container {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
        gap: 20px;
        padding: 30px 16px;
        max-width: 1182px;
        margin: 0 auto;
    }

        #content_support .question-container .question-card {
            position: relative;
            margin-top: 40px;
            border-radius: 15px;
            border: 1px solid rgba(213, 232, 237, 0.80);
            padding-top: 58px;
            padding-bottom: 16px;
            width: 100%;
            max-width: 560px;
        }

            #content_support .question-container .question-card img {
                position: absolute;
                width: 86px;
                top: 0;
                left: 50%;
                transform: translate(-50%,-50%);
                z-index: 1;
            }

            #content_support .question-container .question-card h2 {
                color: #0F0F0F;
                text-align: center;
                font-size: 24px;
                font-weight: bold;
                text-transform: uppercase;
                padding: 0 16px;
                margin: 16px 0;
            }

            #content_support .question-container .question-card .panel-group {
                margin-bottom: 0;
            }

                #content_support .question-container .question-card .panel-group .panel {
                    border: none;
                    box-shadow: none;
                    border-radius: 0;
                }

            #content_support .question-container .question-card .questions-list .panel-heading {
                padding: 0;
                border-radius: 0;
            }

            #content_support .question-container .question-card .questions-list h4 {
                padding: 0;
                margin: 0;
            }

                #content_support .question-container .question-card .questions-list h4 a {
                    color: #000;
                    font-size: 16px;
                    font-weight: bold;
                    text-decoration: none;
                    outline: none;
                    width: 100%;
                    display: inline-flex;
                    justify-content: flex-start;
                    align-items: center;
                    padding: 10px 16px;
                }

            #content_support .question-container .question-card .questions-list ul {
                padding: 0;
                margin: 0;
                padding-inline-start: 20px;
            }

                #content_support .question-container .question-card .questions-list ul li {
                    margin-bottom: 4px;
                }

                    #content_support .question-container .question-card .questions-list ul li a {
                        padding: 0;
                        margin: 0;
                    }

                    #content_support .question-container .question-card .questions-list ul li a {
                        color: #000;
                        font-size: 14px;
                        font-weight: 600;
                        text-decoration: none;
                        outline: none;
                    }

    #content_support .video-container {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 20px;
        padding: 30px 16px;
        max-width: 1182px;
        margin: 0 auto;
    }

        #content_support .video-container .video-control {
            display: flex;
            flex-wrap: nowrap;
            justify-content: flex-start;
            align-items: center;
            gap: 16px;
            padding: 0;
            width: 100%;
        }

            #content_support .video-container .video-control h2 {
                padding: 0;
                margin: 0;
                color: #050505;
                font-size: 24px;
                font-weight: 700;
            }

        #content_support .video-container .content-support-videos-container {
            display: flex;
            gap: 20px;
            justify-content: center;
            flex-wrap: wrap;
            width: 100%;
            align-items: center;
            margin-bottom: 20px;
        }

            #content_support .video-container .content-support-videos-container.collapse {
                overflow: hidden;
            }

        #content_support .video-container .video-control .content-support-load-all-videos {
            border-radius: 50px;
            border: 1px solid #D5E8ED;
            background: #F9FAFB;
            color: #000;
            font-size: 12px;
            font-weight: 500;
            text-decoration: none;
            outline: none;
            height: 36px;
            display: inline-flex;
            justify-content: center;
            align-items: center;
            padding: 10px 20px;
            margin-left: auto;
        }

        #content_support .video-container .show-videos {
            display: inline-block;
        }

        #content_support .video-container .hide-videos {
            display: none;
        }

        #content_support .video-container .toggle-arrow svg {
            width: 22px;
            height: 22px;
            margin-bottom: -5px;
            transform: rotate(0);
            transition: all 0.3s ease;
        }

        #content_support .video-container .collapse.in ~ a .show-videos {
            display: none;
        }

        #content_support .video-container .collapse.in ~ a .hide-videos {
            display: inline-block;
        }

        #content_support .video-container .collapse.in ~ a .toggle-arrow svg {
            transform: rotate(180deg);
        }

    #content_support .banner-bottom {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 20px;
        padding: 30px 16px;
        min-height: 175px;
        max-width: 1182px;
        margin: 0 auto;
    }

        #content_support .banner-bottom h2 {
            color: #FFF;
            text-align: center;
            font-size: 24px;
            font-weight: 700;
            padding: 0;
            margin: 0;
        }

        #content_support .banner-bottom .social-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            gap: 35px;
        }

            #content_support .banner-bottom .social-container a {
                text-decoration: none;
                outline: none;
            }

                #content_support .banner-bottom .social-container a img {
                    width: 46px;
                }

    #content_support .footer-support {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 20px;
        padding: 30px 16px;
        min-height: 175px;
        max-width: 1182px;
        margin: 0 auto;
    }

        #content_support .footer-support .footer-support-container {
            border-radius: 14px;
            border: 1px solid #D5E8ED;
            background: #F9FAFB;
            display: flex;
            width: 100%;
            padding: 28px 40px;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 30px;
        }

            #content_support .footer-support .footer-support-container > div {
                display: inline-flex;
                flex-direction: column;
                justify-content: center;
                align-items: flex-start;
            }

        #content_support .footer-support h2 {
            color: #000;
            font-size: 32px;
            font-weight: 700;
            padding: 0;
            margin: 0;
            padding-bottom: 6px;
        }

        #content_support .footer-support p {
            color: #53686A;
            font-size: 16px;
            font-weight: 400;
            padding: 0;
            margin: 0;
        }

        #content_support .footer-support .link-pink {
            display: flex;
            width: 177px;
            height: 50px;
            padding: 10px 16px;
            justify-content: center;
            align-items: center;
            border-radius: 50px;
            background: #C60277;
            box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
            color: #fff;
            text-decoration: none;
            cursor: pointer;
        }

    #content_support .details-title {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 20px;
        padding: 30px 16px;
        max-width: 1182px;
        margin: 0 auto;
    }

    #content_support .blog-container {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 30px;
        padding: 30px 16px;
        padding-bottom: 60px;
        min-height: 175px;
        max-width: 1182px;
        margin: 0 auto;
    }

        #content_support .blog-container .blog-contnet p,
        #content_support .blog-container .blog-contnet h1,
        #content_support .blog-container .blog-contnet h2,
        #content_support .blog-container .blog-contnet h3,
        #content_support .blog-container .blog-contnet h4,
        #content_support .blog-container .blog-contnet h5,
        #content_support .blog-container .blog-contnet h6 {
            padding: 0;
            margin: 0;
        }

    #content_support .details-title-container {
        border-radius: 14px;
        border: 1px solid #D5E8ED;
        background: #F9FAFB;
        display: flex;
        width: 100%;
        padding: 24px 30px;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        gap: 30px;
    }

        #content_support .details-title-container h2 {
            color: #0F0F0F;
            font-size: 30px;
            font-weight: 800;
            text-transform: uppercase;
            padding: 0;
            margin: 0;
        }

    #content_support .blog-side-menu {
        min-width: 300px;
    }

        #content_support .blog-side-menu .question-container {
            padding: 0 !important;
        }

            #content_support .blog-side-menu .question-container .question-card {
                margin: 0;
                padding: 0;
                border-radius: 0;
                border: 1px solid #DEECF1;
            }

    #content_support .video-details {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 44px;
        padding: 30px 16px;
        min-height: 175px;
        max-width: 1182px;
        margin: 0 auto;
        width: 100%;
    }

        #content_support .video-details .video-details-video {
            width: 100%;
        }

            #content_support .video-details .video-details-video iframe {
                width: 100%;
                height: calc(100vw / 1.8);
                max-height: 640px;
            }

        #content_support .video-details .video-details-steps {
            display: flex;
            width: 100%;
            justify-content: flex-start;
            align-items: flex-start;
            flex-direction: column;
            gap: 44px;
            margin-bottom: 20px;
            position: relative;
        }

            #content_support .video-details .video-details-steps:after {
                content: '';
                width: 1px;
                height: 100%;
                background-color: #C9D7DB;
                position: absolute;
                left: 24px;
            }

            #content_support .video-details .video-details-steps .video-step {
                display: flex;
                flex-wrap: nowrap;
                gap: 20px;
                justify-content: flex-start;
                align-items: flex-start;
                width: 100%;
            }

                #content_support .video-details .video-details-steps .video-step .video-step-number {
                    z-index: 1;
                    position: relative;
                    padding-top: 20px;
                }

                    #content_support .video-details .video-details-steps .video-step .video-step-number span {
                        background-color: #F9FAFB;
                        border: 1px solid #C9D7DB;
                        width: 50px;
                        height: 50px;
                        border-radius: 50%;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        color: #555;
                        font-size: 26px;
                        font-weight: 600;
                    }

                #content_support .video-details .video-details-steps .video-step .video-step-card {
                    display: flex;
                    flex-wrap: nowrap;
                    gap: 32px;
                    justify-content: flex-start;
                    align-items: center;
                }

                #content_support .video-details .video-details-steps .video-step .video-step-img {
                    width: 100%;
                    max-width: 285px;
                    min-width: 130px;
                    align-self: self-start;
                }

                #content_support .video-details .video-details-steps .video-step img {
                    width: 100%;
                    max-width: 285px;
                }

                #content_support .video-details .video-details-steps .video-step h3 {
                    color: #000;
                    font-size: 24px;
                    font-weight: 600;
                    margin: 0;
                    padding: 0;
                    padding-bottom: 8px;
                }

                #content_support .video-details .video-details-steps .video-step p {
                    color: #000;
                    font-size: 16px;
                    font-weight: 600;
                    margin: 0;
                    padding: 0;
                }



/*********End Support Content********/


/***5G**/

#portal-5g {
    margin-top: 90px;
}

.portal-5g-slideshow-logo {
    text-align: center;
}

.portal-5g-slideshow {
    position: relative;
    width: 100%;
    height: calc(100vh - 90px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    background: linear-gradient(136.74deg, #D7016E 0%, #8A1669 98.74%);
    padding: 100px;
}

/*.portal-5g-slideshow-overlay {
    z-index: 1000;
    position: absolute;
    width: 100%;
    height: 100vh;
    background-color: black;
    opacity: 1;
}*/

.portal-5g-slideshow-static-text {
    color: white;
    font-size: 40px;
    text-align: center;
    width: 100%;
    font-weight: bold;
}

.portal-5g-slideshow-dynamic-text {
    color: white;
    font-size: 40px;
    text-align: center;
    width: 100%;
    font-weight: bold;
}

.portal-5g-logo {
    width: 250px;
    height: 250px;
    transition: 1s transform;
}

.portal-5g-slideshow-slide {
    height: calc(100vh - 100px);
    height: calc(100dvh - 100px);
    width: 100%;
    scroll-snap-align: start;
    --webkit-scroll-snap-align: start;
    background: transparent;
    /*background: linear-gradient(136.74deg, #D7016E 0%, #8A1669 98.74%);*/
}

    .portal-5g-slideshow-slide p {
        font-size: 40px;
        font-weight: bold;
        color: white;
        margin: 0 auto;
        padding-top: 100px;
        text-align: center;
        opacity: 0;
        transition: 1s opacity;
        position: relative;
        z-index: 99;
        text-transform: uppercase;
    }

        .portal-5g-slideshow-slide p.active {
            opacity: 1;
        }

.z-index-100, .portal-5g-hide-logo-elements {
    position: relative;
    z-index: 100;
}

@keyframes spin-initial {
    0% {
        transform: translate(-50%, -10%) rotate(0deg) scale(0.2);
    }


    100% {
        transform: translate(-50%, -10%) rotate(180deg) scale(1);
    }
}


@keyframes opacity-removal {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        z-index: -1;
    }
}

@keyframes text-reveal {
    0%,50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}


#portal-5g .portal-5g-benefits {
    padding-top: 80px;
    padding-bottom: 80px;
}

    #portal-5g .portal-5g-benefits .portal-5g-benefits-title-container {
        display: flex;
        justify-content: center;
        gap: 8px;
        margin-bottom: 60px;
    }

        #portal-5g .portal-5g-benefits .portal-5g-benefits-title-container img {
            width: 160px;
        }

        #portal-5g .portal-5g-benefits .portal-5g-benefits-title-container h2 {
            margin: 0px;
            align-self: center;
            font-weight: bold;
        }

    #portal-5g .portal-5g-benefits .portal-5g-benefits-container {
        display: flex;
        justify-content: center;
        gap: 3%;
        row-gap: 30px;
        flex-wrap: wrap;
    }

        #portal-5g .portal-5g-benefits .portal-5g-benefits-container .portal-5g-benefit-card {
            max-width: 30%;
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: center;
        }

            #portal-5g .portal-5g-benefits .portal-5g-benefits-container .portal-5g-benefit-card img {
                max-width: 100px;
            }

            #portal-5g .portal-5g-benefits .portal-5g-benefits-container .portal-5g-benefit-card h4 {
                font-weight: bold;
            }

            #portal-5g .portal-5g-benefits .portal-5g-benefits-container .portal-5g-benefit-card p {
                font-size: 14px;
                text-align: center;
                margin: 0px;
            }

            #portal-5g .portal-5g-benefits .portal-5g-benefits-container .portal-5g-benefit-card a {
                color: #D81D7F;
                text-align: center;
                font-weight: bold;
                font-size: 14px;
                text-decoration: none;
            }

                #portal-5g .portal-5g-benefits .portal-5g-benefits-container .portal-5g-benefit-card a:hover {
                    text-decoration: none;
                }

#portal-5g .bg-5g-pink {
    background: linear-gradient(137deg, #D7016E 0%, #8A1669 98.74%);
}

#portal-5g .portal-5g-links {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 30px;
}

#portal-5g .portal-5g-link {
    background: linear-gradient(136.74deg, #D7016E 0%, #8A1669 98.74%);
    display: flex;
    text-decoration: none;
    color: white;
    min-width: 23%;
    border-radius: 8px;
    padding: 15px;
    gap: 15px;
    padding-left: 30px;
    padding-top: 25px;
    justify-content: flex-start;
    transition: transform 0.5s;
}

    #portal-5g .portal-5g-link:hover {
        transform: scale(1.01);
    }

#portal-5g .portal-5g-link-container {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    text-align: left;
}

#portal-5g .portal-5g-link img {
    width: 60px;
    height: 60px;
}

#portal-5g .portal-5g-link-title {
    font-size: 24px;
}

#portal-5g .portal-5g-link-subheader {
    font-size: 18px;
    font-weight: normal;
    margin-bottom: 0px;
}


.portal-5g-subpage .portal-5g-banner-container img {
    width: 100%;
}

.portal-5g-subpage .portal-5g-packages-container {
    padding-top: 60px;
    padding-bottom: 60px;
}

.portal-5g-subpage .portal-5g-packages-title-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

    .portal-5g-subpage .portal-5g-packages-title-container h2 {
        color: white;
        font-weight: bold;
        margin-bottom: 50px;
        font-size: 40px;
        margin-left: 0px;
        margin-right: 0px;
    }

        .portal-5g-subpage .portal-5g-packages-title-container h2 img {
            width: 112px;
            margin-right: 22px;
        }

@keyframes portal-5g-spin-logo {
    0% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(180deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

.portal-5g-subpage .portal-5g-packages-button-toggle-container {
    display: flex;
    gap: 6px;
}

    .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages {
        color: white;
        border: 2px solid white;
        border-radius: 8px;
        padding-top: 10px;
        padding-bottom: 10px;
        display: inline-flex;
        gap: 6px;
        padding-left: 10px;
        padding-right: 10px;
        font-weight: bold;
        align-items: end;
        min-width: 120px;
        justify-content: center;
    }

        .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages:hover, .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages:active, .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages:focus {
            text-decoration: none;
        }

        .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages svg {
            width: 24px;
            height: 24px;
        }

        .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages .btn-icon-active {
            display: none;
        }

        .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages .btn-icon-inactive {
            display: inline-block;
        }

        .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages.active {
            background-color: white;
            color: #B60B6D;
        }

            .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages.active .btn-icon-active {
                display: inline-block;
            }

            .portal-5g-subpage .portal-5g-packages-button-toggle-container .btn-switch-tab-packages.active .btn-icon-inactive {
                display: none;
            }



.portal-5g-subpage .portal-5g-packages-slider-broadband {
    display: flex;
    gap: 18px;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-top: 18px;
    padding-bottom: 18px;
}

    .portal-5g-subpage .portal-5g-packages-slider-broadband::-webkit-scrollbar {
        width: 8px;
        height: 8px;
        border-radius: 3px;
    }

        .portal-5g-subpage .portal-5g-packages-slider-broadband::-webkit-scrollbar:hover {
            height: 10px;
        }

    .portal-5g-subpage .portal-5g-packages-slider-broadband::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 3px;
    }

    .portal-5g-subpage .portal-5g-packages-slider-broadband::-webkit-scrollbar-thumb {
        background: #e6007e;
        border-radius: 3px;
    }

        .portal-5g-subpage .portal-5g-packages-slider-broadband::-webkit-scrollbar-thumb:hover {
            background: #b70868;
        }



.portal-5g-subpage .portal-5g-package-card {
    min-width: 320px;
    max-width: 340px;
    background: #FFFFFF;
    border: 1px solid #E1E6EC;
    border-radius: 20px;
    align-self: flex-start;
}

    /*.portal-5g-subpage .portal-5g-packages-slider-broadband .portal-5g-package-card:first-child {
    margin-left: auto;
}

.portal-5g-subpage .portal-5g-packages-slider-broadband .portal-5g-package-card:last-child {
    margin-right: auto;
}*/

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-inner-container {
        padding-left: 29px;
        padding-right: 29px;
    }

    .portal-5g-subpage .portal-5g-package-card .ribbon-no-promotion {
        margin-bottom: 24px;
        background-image: Url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderNoPromotion.svg");
        margin-top: -5px;
        height: 11px;
        margin: -6px auto;
        width: 95%;
        margin-bottom: 24px;
    }

    .portal-5g-subpage .portal-5g-package-card .ribbon-promoted {
        display: none;
    }

    .portal-5g-subpage .portal-5g-package-card.card-ribbon .ribbon-no-promotion {
        display: none;
    }

    .portal-5g-subpage .portal-5g-package-card.card-ribbon .ribbon-promoted {
        display: block;
        margin-bottom: 24px;
        background-image: Url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg");
        margin-top: -5px;
        height: 60px;
        margin: -11px auto;
        width: 94%;
        margin-bottom: 24px;
        background-size: contain;
        background-repeat: no-repeat;
        text-align: center;
        font-weight: bold;
        color: white;
        padding: 15px;
    }


    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-image {
        display: none;
    }

    .portal-5g-subpage .portal-5g-package-card.card-image .portal-5g-package-card-image {
        display: block;
    }

        .portal-5g-subpage .portal-5g-package-card.card-image .portal-5g-package-card-image img {
            width: 100%;
        }


    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-title {
        position: relative;
    }

        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-title h4 {
            font-size: 23px;
            font-weight: 600;
        }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-speed {
        margin-bottom: 12px;
        color: #D81D7F;
    }


        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-speed h4 {
            font-size: 30px;
            display: inline-block;
            font-weight: bold;
        }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-hr {
        margin-bottom: 12px;
        margin-top: 12px;
        height: 1px;
        border-top: 1px solid #ebf1f8;
    }


    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-monthly-subscription-tag {
        margin-bottom: 2px;
        font-size: 14px;
    }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-subscription {
        margin-bottom: 14px;
    }

        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-subscription h4 {
            font-weight: bold;
            font-size: 30px;
            display: inline;
        }

        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-subscription .portal-5g-package-subscription-unit {
            font-size: 20px;
            font-weight: normal;
        }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details ul {
        padding: 0px;
        list-style: none;
        margin-bottom: 0px;
    }


    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .portal-5g-package-detail {
        padding-left: 29px;
        padding-right: 29px;
        padding-top: 10px;
        padding-bottom: 10px;
        background-color: white;
        display: flex;
        align-content: center;
        align-items: center;
    }

        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .portal-5g-package-detail:nth-child(odd) {
            background-color: #F9FAFB;
        }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .collapse .portal-5g-package-detail {
        background-color: #F9FAFB !important;
    }

        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .collapse .portal-5g-package-detail:nth-child(odd) {
            background-color: white !important;
        }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .collapsing .portal-5g-package-detail {
        background-color: #F9FAFB !important;
    }

        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .collapsing .portal-5g-package-detail:nth-child(odd) {
            background-color: white !important;
        }


    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .portal-5g-package-detail:before {
        color: #D81D7F;
        font-weight: 700;
        font-size: 14px;
        content: '✓';
        margin-right: 10px;
        margin-left: 0;
    }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .portal-5g-package-detail .portal-5g-package-detail-key {
        min-width: 30%;
        text-wrap: normal;
        display: inline-block;
        width: 45%;
        font-size: 13px;
        vertical-align: central;
    }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .portal-5g-package-detail .portal-5g-package-detail-value {
        min-width: 30%;
        text-wrap: normal;
        font-weight: bold;
        display: inline-block;
        text-align: right;
        width: 50%;
        font-size: 13px;
    }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-card-details .portal-5g-package-detail img {
        margin-right: 5px;
    }

    .portal-5g-subpage .portal-5g-package-card .portal-5g-package-bottom {
        width: 100%;
    }

        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-bottom .btn.btn-pink {
            width: 100% !important;
            height: 40px;
            margin-bottom: 16px;
            padding: 10px;
            border-radius: 20px;
            background-color: #D81D7F !important;
            border-color: #D81D7F !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #fff !important;
            outline: none !important;
        }

        .portal-5g-subpage .portal-5g-package-card .portal-5g-package-bottom a {
            font-size: 14px;
            font-weight: bold;
            color: #D81D7F !important;
            text-decoration: none !important;
            outline: none !important;
            cursor: pointer;
            display: block;
            text-align: center;
            margin-bottom: 14px;
            margin-top: 10px;
        }

.portal-5g-subpage .portal-5g-package-button-container {
    margin-bottom: 24px;
    margin-top: 24px;
}

    .portal-5g-subpage .portal-5g-package-button-container button {
        width: 100% !important;
        background-color: #D81D7F !important;
    }

.portal-5g-subpage .portal-5g-package-card [aria-expanded='false'] .showmore {
    display: inline-block;
}

.portal-5g-subpage .portal-5g-package-card [aria-expanded='false'] .hidemore {
    display: none;
}

.portal-5g-subpage .portal-5g-package-card .toggle-arrow svg {
    width: 22px;
    height: 22px;
    margin-bottom: -5px;
    transform: rotate(0);
    transition: all 0.3s ease;
}

.portal-5g-subpage .portal-5g-package-card [aria-expanded='true'] .showmore {
    display: none;
}

.portal-5g-subpage .portal-5g-package-card [aria-expanded='true'] .hidemore {
    display: inline-block;
}

.portal-5g-subpage .portal-5g-package-card [aria-expanded='true'] .toggle-arrow svg {
    transform: rotate(180deg);
}

.portal-5g-subpage .portal-5g-package-gsm .portal-5g-package-card {
    padding-bottom: 28px;
}

.portal-5g-subpage .tab-content {
    max-height: unset !important;
}

.portal-5g-subpage .portal-5g-package-gsm {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    row-gap: 20px;
    padding-top: 18px;
    padding-bottom: 18px;
    align-items: center;
}

.portal-5g-subpage #tab_BroadbandPackages .portal-5g-package-notes, .portal-5g-subpage .portal-5g-package-notes-gsm-2 {
    margin-top: 12px;
    max-width: 600px;
}

.portal-5g-subpage .portal-5g-package-notes h4 {
    color: white;
    font-weight: bold;
    font-size: 34px;
}

.portal-5g-subpage .portal-5g-package-notes.portal-5g-package-notes-gsm-2 h4 {
    font-size: 21px;
    font-weight: 700;
}


.portal-5g-subpage .portal-5g-package-notes ul {
    margin-left: 0px;
    padding-left: 0px;
}

    .portal-5g-subpage .portal-5g-package-notes ul li {
        display: flex;
        gap: 8px;
        color: white;
    }

        .portal-5g-subpage .portal-5g-package-notes ul li::before {
            content: "•";
        }

.portal-5g-subpage #tab_GSMPackages .portal-5g-package-notes ul li::before {
    content: "✓";
    margin-bottom: 8px;
}

.portal-5g-subpage .portal-5g-package-notes.portal-5g-package-notes-gsm-2 li {
    font-size: 12px;
}

#portal-5g .portal-5g-faqs-container {
    background-color: #F9FAFB;
    padding: 50px;
    margin-top: 60px;
    margin-bottom: 60px;
    border: 1px solid #F9FAFB;
    border-radius: 20px;
}

#portal-5g .portal-5g-faq-header-container {
    padding-bottom: 26px;
}

    #portal-5g .portal-5g-faq-header-container h2 {
        color: #D81D7F;
        margin: 0px;
        font-weight: bold;
    }


#portal-5g .faq-button-trigger {
    display: block;
    width: 100%;
    border-top: 2px solid #EFEFEF;
    padding-top: 24px;
    padding-bottom: 16px;
}

    #portal-5g .faq-button-trigger:hover, #portal-5g .faq-button-trigger:active, #portal-5g .faq-button-trigger:target, #portal-5g .faq-button-trigger:focus, #portal-5g .faq-button-trigger:focus-within {
        text-decoration: none;
    }

#portal-5g .faq-trigger {
    display: flex;
    justify-content: space-between;
    color: black;
}

    #portal-5g .faq-trigger p {
        font-weight: bold;
    }

#portal-5g .faq-button-trigger img {
    transition: 0.5s transform;
}

#portal-5g .faq-button-trigger[aria-expanded="true"] img {
    transform: rotate(45deg);
}

#portal-5g .faq-content {
    padding-bottom: 16px;
}

.portal-5g-subpage .portal-5g-subpage-packages-container .packages-header {
    font-weight: bold;
    margin-bottom: 30px;
}

.portal-5g-subpage .portal-5g-modal-backdrop {
    background-color: rgba(0,0,0,0.7);
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -2;
    opacity: 0;
    transition: transform 0.3s ease-out, opacity 0.5s ease-out;
}

    .portal-5g-subpage .portal-5g-modal-backdrop.active {
        z-index: 200;
        opacity: 1;
    }

.portal-5g-subpage .portal-5g-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #fff;
    z-index: 200;
    transform: translateY(100vh);
    opacity: 0;
    transition: transform 0.3s ease-out, opacity 0.5s ease-out;
    padding-top: 16px;
    padding-bottom: 80px;
    overflow-y: auto;
}

    .portal-5g-subpage .portal-5g-modal.active {
        opacity: 1;
        transform: translateY(20vh);
    }

        .portal-5g-subpage .portal-5g-modal.active.full {
            opacity: 1;
            transform: translateY(0);
            padding-top: 100px;
        }

    .portal-5g-subpage .portal-5g-modal hr {
        border: solid 1px #e2e6eb;
        margin: 24px 0;
        padding: 0;
    }

.portal-5g-subpage .portal-5g-map-modal-container {
    display: flex;
    flex-wrap: wrap;
}

.portal-5g-subpage .portal-5g-map-modal-header {
    position: relative;
    height: 56px;
    width: 100%;
}

    .portal-5g-subpage .portal-5g-map-modal-header .portal-5g-modal-close {
        position: absolute;
        right: 0;
        top: 0px;
        cursor: pointer;
    }

.portal-5g-subpage .portal-5g-map-modal-desc {
    width: 40%;
    padding-right: 12px;
}

    .portal-5g-subpage .portal-5g-map-modal-desc h2 {
        padding: 0;
        margin: 0;
        margin-bottom: 16px;
        font-size: 32px;
        font-weight: bold;
        color: #11120e;
    }

    .portal-5g-subpage .portal-5g-map-modal-desc p {
        padding: 0;
        margin: 0;
        font-size: 18px;
        font-weight: normal;
        color: #11120e;
    }

    .portal-5g-subpage .portal-5g-map-modal-desc a.portal-5g-modal-current-location {
        display: block;
        padding: 12px 0;
        margin: 0;
        font-size: 18px;
        font-weight: bold !important;
        color: #E6007E !important;
        text-decoration: none !important;
        outline: none !important;
        cursor: pointer;
    }

        .portal-5g-subpage .portal-5g-map-modal-desc a.portal-5g-modal-current-location img {
            margin-right: 16px;
            margin-top: -4px;
        }

.portal-5g-subpage .portal-5g-map-modal-map {
    width: 60%;
    padding-left: 12px;
}

    .portal-5g-subpage .portal-5g-map-modal-map #google-map {
        max-height: 364px;
        height: 100vh;
    }

    .portal-5g-subpage .portal-5g-map-modal-map .btn-check-availablity-map {
        margin-top: 32px;
    }


.portal-5g-subpage .portal-5g-map-result-success-alert {
    min-height: 160px;
    padding: 24px;
    border-radius: 8px;
    border: solid 1px #d3eadb;
    background-color: #f2f9f4;
    text-align: center;
    margin-bottom: 30px;
}

    .portal-5g-subpage .portal-5g-map-result-success-alert img {
        width: 48px;
        margin-bottom: 16px;
    }

    .portal-5g-subpage .portal-5g-map-result-success-alert h4 {
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        color: #008931;
        max-width: 250px;
        margin: 0 auto;
        padding: 0;
    }

.portal-5g-subpage .portal-5g-map-address-container {
    margin-top: 48px;
}

    .portal-5g-subpage .portal-5g-map-address-container h2 {
        margin-bottom: 16px;
        display: flex;
        flex-wrap: nowrap;
        gap: 24px;
        margin-bottom: 16px;
    }

        .portal-5g-subpage .portal-5g-map-address-container h2 span {
            font-size: 21px;
            font-weight: bold;
            color: #11120e;
        }

        .portal-5g-subpage .portal-5g-map-address-container h2 a {
            font-size: 16px;
            font-weight: bold;
            color: #0070c9 !important;
            text-decoration: none !important;
            outline: none !important;
        }

        .portal-5g-subpage .portal-5g-map-address-container h2 a {
            font-size: 16px;
            font-weight: bold;
            color: #0070c9 !important;
            text-decoration: none !important;
            outline: none !important;
            padding-top: 4px;
        }

    .portal-5g-subpage .portal-5g-map-address-container p {
        padding: 0;
        margin: 0;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

.portal-5g-subpage .portal-5g-selected-package-title {
    font-size: 36px;
    font-weight: bold;
    padding-bottom: 15px;
    margin-bottom: 20px;
    border-bottom: 1px solid #E2E6EB;
}

.portal-5g-subpage .portal-5g-selected-package-details {
    display: flex;
    gap: 50px;
    flex-wrap: wrap;
    margin-top: 20px;
    row-gap: 20px;
}

    .portal-5g-subpage .portal-5g-selected-package-details .correct-mark {
        color: #E6007E;
    }

    .portal-5g-subpage .portal-5g-selected-package-details .portal-5g-selected-package-detail-key {
        font-weight: bold;
    }

        .portal-5g-subpage .portal-5g-selected-package-details .portal-5g-selected-package-detail-key::after {
            content: ":";
        }



.portal-5g-subpage .portal-5g-selected-package-addons-outdoor-container {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-top: 30px;
    margin-bottom: 30px;
}

    .portal-5g-subpage .portal-5g-selected-package-addons-outdoor-container .portal-5g-selected-package-addons {
        width: calc(30% - 15px);
        padding: 30px;
        border-radius: 10px;
        border: 1px solid #E1E1E1;
        background: #FFF;
    }

    .portal-5g-subpage .portal-5g-selected-package-addons-outdoor-container .portal-5g-selected-package-addons {
        font-weight: unset;
    }

.portal-5g-subpage .portal-5g-selected-package-addons div {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #EAEAEA;
    display: flex;
}

.portal-5g-subpage .portal-5g-selected-package-addons label {
    font-weight: normal;
    display: flex;
    gap: 0px;
    flex-wrap: wrap;
}

.portal-5g-subpage .portal-5g-selected-package-addons div:last-child {
    border-bottom: 0px;
    padding-bottom: 0px;
}

.portal-5g-subpage .portal-5g-selected-package-addon-key {
    font-weight: bold;
}

    .portal-5g-subpage .portal-5g-selected-package-addon-key::after {
        content: ":";
    }

.portal-5g-subpage .portal-5g-selected-package-addons-outdoor-container .portal-5g-selected-package-addons input[type='checkbox'] {
    accent-color: #E6007E;
    width: 15px;
    height: 15px;
}

.portal-5g-subpage .portal-5g-selected-package-addons-outdoor-container .portal-5g-outdoor-card {
    width: calc(70% - 15px);
    padding: 30px;
    border-radius: 10px;
    border: 1px solid #E1E1E1;
    background: #FFF;
    flex: 1;
}

    .portal-5g-subpage .portal-5g-selected-package-addons-outdoor-container .portal-5g-outdoor-card h4 {
        font-weight: bold;
    }

.portal-5g-subpage .portal-5g-selected-package-cart-container {
    padding: 30px;
    border-radius: 10px;
    border: 1px solid #E1E1E1;
    background: #F9FAFB;
}

.portal-5g-subpage .portal-5g-selected-package-cart-title {
    display: flex;
    gap: 3px;
}

    .portal-5g-subpage .portal-5g-selected-package-cart-title h4 {
        font-weight: bold;
        margin-left: 0px;
        margin-right: 0px;
    }

    .portal-5g-subpage .portal-5g-selected-package-cart-title p {
        align-self: center;
        margin-bottom: 0px;
        font-size: 12px;
    }

.portal-5g-subpage .portal-5g-selected-package-cart {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #E2E6EB;
}

.portal-5g-subpage .portal-5g-selected-package-cart-item .cart-item-key {
    display: inline-block;
    min-width: 200px;
    max-width: 200px;
}

    .portal-5g-subpage .portal-5g-selected-package-cart-item .cart-item-key::after {
        content: ":";
    }

.portal-5g-subpage .portal-5g-selected-package-cart-item .cart-item-price {
    font-weight: bold;
}

.portal-5g-subpage .portal-5g-selected-package-cart-total {
    padding-top: 8px;
}

    .portal-5g-subpage .portal-5g-selected-package-cart-total .portal-5g-cart-total {
        color: #E6007E;
        font-size: 28px;
        font-style: normal;
        font-weight: bold;
        margin-right: 8px;
    }

.portal-5g-subpage .portal-5g-map-result-fail-container .portal-5g-map-result-fail-alert {
    border: 1px solid #D81D7F;
    border-radius: 8px;
    background: #FDFAFC;
    display: flex;
    gap: 16px;
    padding: 26px;
    margin-bottom: 20px;
}

    .portal-5g-subpage .portal-5g-map-result-fail-container .portal-5g-map-result-fail-alert img {
        width: 100px;
        height: 100px;
    }

    .portal-5g-subpage .portal-5g-map-result-fail-container .portal-5g-map-result-fail-alert .portal-5g-map-alert-text-container {
        display: flex;
        flex-direction: column;
        flex-grow: 1;
        justify-content: center;
    }

        .portal-5g-subpage .portal-5g-map-result-fail-container .portal-5g-map-result-fail-alert .portal-5g-map-alert-text-container h4 {
            margin-right: 0px;
            margin-left: 0px;
            font-weight: bold;
        }

.portal-5g-subpage .portal-5g-map-result-submit {
    text-align: center;
    position: fixed;
    z-index: 99;
    background-color: #fff;
    width: 100%;
    height: 100vh;
    top: 50%;
    left: 50%;
    transform: translate(-50%,100vh);
    max-width: 624px;
    max-height: 326px;
    margin: 0;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 2px 16px 0 rgba(0, 0, 0, 0.16);
    opacity: 0;
    transition: transform 0.3s ease-out, opacity 0.5s ease-out;
}

    .portal-5g-subpage .portal-5g-map-result-submit.active {
        transform: translate(-50%,-50%);
        opacity: 1;
    }

    .portal-5g-subpage .portal-5g-map-result-submit .portal-5g-map-modal-header {
        height: 56px;
        width: 56px;
        position: absolute;
        right: 16px;
        top: 16px;
    }

    .portal-5g-subpage .portal-5g-map-result-submit h2 {
        padding: 0;
        margin: 16px 0 8px 0;
        font-size: 21px;
        font-weight: bold;
        color: #11120e;
    }

    .portal-5g-subpage .portal-5g-map-result-submit p {
        margin: 0;
        padding: 0;
        font-size: 16px;
        font-weight: normal;
        color: #11120e;
    }

    .portal-5g-subpage .portal-5g-map-result-submit > div > p {
        margin-top: 48px;
        margin-bottom: 8px;
    }

    .portal-5g-subpage .portal-5g-map-result-submit a {
        font-size: 16px !important;
        font-weight: bold !important;
        color: #0070c9 !important;
        text-decoration: none !important;
        outline: none !important;
    }

.portal-5g-subpage .portal-5g-personal-info {
    margin-top: 50px;
    margin-bottom: 50px;
}

.portal-5g-subpage .portal-5g-personal-info-title {
    margin-bottom: 30px;
    font-size: 26px;
    color: #11120E;
}

.portal-5g-subpage .portal-5g-personal-info-form-container {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
    flex-wrap: wrap;
    align-items: flex-end;
}

    .portal-5g-subpage .portal-5g-personal-info-form-container div {
        flex: 1;
        align-self: flex-end;
    }

.portal-5g-subpage ..portal-5g-personal-info-form-container h4 {
    color: #11120E;
}

.portal-5g-subpage .portal-5g-personal-info-form-container input {
    background: #FFF;
    height: 40px;
    outline: none;
    box-shadow: none;
    transition: unset;
}

.portal-5g-subpage #preloader {
    z-index: 1000;
}

.portal-5g-subpage .add-outdoor-card .add-outdoor-text {
    display: inline;
}

.portal-5g-subpage .add-outdoor-card .remove-outdoor-text {
    display: none;
}

.portal-5g-subpage .add-outdoor-card.active .add-outdoor-text {
    display: none;
}

.portal-5g-subpage .add-outdoor-card.active .remove-outdoor-text {
    display: inline;
}

.portal-5g-subpage input.invalid-form {
    margin-bottom: 0px !important;
    border: 1px solid #b10000 !important;
}

.portal-5g-subpage .portal-5g-validation-error {
    display: none;
    margin-bottom: 12px !important;
    color: #b10000 !important;
}

.portal-5g-subpage .portal-5g-not-available-links {
    display: flex;
    gap: 14px;
}

.portal-5g-subpage a.portal-5g-change-address {
    margin-left: 6px;
    font-size: 13px;
    color: #E6007E;
    font-weight: bold;
}


#portal-5g .intro-to-5g-container {
    background: #F9FAFB;
    padding-top: 80px;
    padding-bottom: 80px;
}

    #portal-5g .intro-to-5g-container .intro-to-5g {
        display: flex;
        justify-content: space-between;
    }

#portal-5g .intro-to-5g .intro-to-5g-text {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    max-width: 50%;
}

    #portal-5g .intro-to-5g .intro-to-5g-text .intro-to-5g-text-add-margin {
        margin-bottom: 30px;
    }

    #portal-5g .intro-to-5g .intro-to-5g-text h2 {
        font-size: 40px;
        font-weight: bold;
    }

#portal-5g .intro-to-5g .intro-to-5g-logo {
    align-self: center;
}

.portal-5g-subpage .portal-5g-map-result-success-alert {
    min-height: 160px;
    padding: 24px;
    border-radius: 8px;
    border: solid 1px #d3eadb;
    background-color: #f2f9f4;
    text-align: center;
}

    .portal-5g-subpage .portal-5g-map-result-success-alert img {
        width: 48px;
        margin-bottom: 16px;
    }

    .portal-5g-subpage .portal-5g-map-result-success-alert h4 {
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        color: #008931;
        max-width: 250px;
        margin: 0 auto;
        padding: 0;
    }

.portal-5g-subpage .portal-5g-terms-and-conditions {
    margin-top: 30px;
    margin-bottom: 12px;
    max-width: 50%;
}

    .portal-5g-subpage .portal-5g-terms-and-conditions .portal-5g-package-notes ul li {
        color: black;
    }

.portal-5g-subpage .portal-5g-subpage-packages-container {
    background: #F9FAFB;
    padding-top: 30px;
    padding-bottom: 30px;
}


.portal-5g-subpage .portal-5g-subpage-description {
    padding-top: 30px;
    padding-bottom: 30px;
}

    .portal-5g-subpage .portal-5g-subpage-description h3 {
        font-weight: bold;
    }

    .portal-5g-subpage .portal-5g-subpage-description img {
        width: 50px;
    }

.portal-5g-subpage .portal-5g-package-logo {
    position: absolute;
    right: 0;
    top: -5px;
}

    .portal-5g-subpage .portal-5g-package-logo img {
        width: 50px;
    }

#portal-5g .portal-5g-go-to-packages {
    position: fixed;
    bottom: 6%;
    text-align: center;
    color: white;
    display: flex;
    justify-content: center;
    gap: 10px;
    max-width: 250px;
    width: 250px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    border: 1px solid white;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 6px;
    cursor: pointer;
}

    #portal-5g .portal-5g-go-to-packages img {
        transition: 0.5s all;
        transform: translateY(0px);
        animation: portal-5g-arrow-marker 0.5s ease-in-out infinite alternate;
    }

@keyframes portal-5g-arrow-marker {
    from {
        transform: translateY(-2px);
    }

    to {
        transform: translateY(2px);
    }
}

/*************** End 5G *********/


/************** TOD ************/
#tod_bundling {
    padding-top: 90px;
}

    #tod_bundling .slider-img {
        text-align: center !important;
    }

    #tod_bundling .TodIntroduction {
        margin-top: 35px;
    }

    #tod_bundling .entertainment {
        /*margin-top: 15px;*/
        font-size: 32px;
        font-weight: 800;
        //text-transform: uppercase;
    }

    #tod_bundling .TodSubscribe {
        margin: 70px 0;
    }

    #tod_bundling .entertainmentDetails {
        margin: 40px 20px;
        font-size: 16px;
        font-weight: 400;
    }

    #tod_bundling .header-img {
        width: 100%;
    }

    #tod_bundling .tod-logo {
        max-width: 140px;
        margin-top: auto;
    }

    #tod_bundling .flex-main-header {
        display: flex;
        justify-content: space-between;
        min-height: 50vh;
        gap: 40px;
    }

    #tod_bundling .main-header-text {
        display: flex;
        flex-direction: column;
        padding-bottom: 40px;
        padding-left: 80px;
        padding-top: 80px;
    }

    #tod_bundling .headerlbl {
        font-size: 30px;
        font-weight: 800;
    }

    #tod_bundling .btn-activate-tod {
        background: rgba(236, 219, 1, 1);
        border: none;
        border-radius: 50px;
        font-size: 17px;
        font-weight: 700;
        height: 52px;
        width: 300px;
        display: block;
        margin-top: 25px;
        color: black;
        padding: 16px;
        text-align: center;
        cursor: pointer;
        text-decoration: none;
    }

    #tod_bundling .btn-activate-tod {
        text-decoration: none;
    }

    #tod_bundling .btn-subscribeNow {
        background: rgba(236, 219, 1, 1);
        border: none;
        border-radius: 50px;
        font-size: 30px;
        font-weight: 900;
        height: 62px;
        width: 294px;
        display: block;
        margin-top: 25px;
        margin-left: 90px;
        color: black;
        padding: 12px;
        text-align: center;
        cursor: pointer;
        text-decoration: none;
    }

        #tod_bundling .btn-subscribeNow:hover {
            text-decoration: none;
        }

    #tod_bundling .app-img {
        width: 100%;
        max-width: 500px;
        margin-bottom: 16px;
    }

    #tod_bundling .white {
        color: white;
    }

    #tod_bundling .mw-125 {
        width: 100%;
        max-width: 125px;
    }

    #tod_bundling .download-tod-img {
        max-width: 285px;
    }

    #tod_bundling .TodStream {
        background-size: cover;
        background-image: url(https://www.jo.zain.com/english/PublishingImages/TOD/background.png);
        background-repeat: no-repeat;
        padding: 55px 0;
    }

    #tod_bundling .left-center {
        font-weight: 800;
        /* position: absolute; */
        /* top: 16%; */
        /* left: 10%; */
        max-width: 385px;
        color: white;
        font-size: 40px;
        margin-top: 130px;
        margin-left: 90px;
        text-transform: uppercase;
    }

    #tod_bundling .text-button-div {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    #tod_bundling .d-flex-row {
        display: flex;
        flex-direction: row;
        gap: 30px;
    }

    #tod_bundling .d-flex-column {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 10px;
    }

    #tod_bundling .header-container {
        background-size: cover;
        background-image: url(https://www.jo.zain.com/english/PublishingImages/TOD/banner-bg.jpg);
        background-repeat: no-repeat;
        // padding: 55px 0;
    }


    #tod_bundling .zain-internet-packages .zain-internet-packages-slider-container {
        position: relative;
        z-index: 1;
    }

    #tod_bundling .zain-internet-packages .zain-internet-packages-slider {
        margin-bottom: 24px;
        display: flex;
        gap: 14px;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 18px;
    }

    #tod_bundling .tod-platform-img {
        width: 100%;
        margin: 10px 0;
    }

    #tod_bundling .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }

        #tod_bundling .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar:hover {
            height: 10px;
        }

    #tod_bundling .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    #tod_bundling .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-thumb {
        background: #e6007e;
        border-radius: 3px;
    }

        #tod_bundling .zain-internet-packages .zain-internet-packages-slider::-webkit-scrollbar-thumb:hover {
            background: #b70868;
        }

    #tod_bundling .zain-internet-packages h2.packages-container-title {
        font-size: 40px;
        font-weight: bold;
        color: #11120e;
        padding: 40px 0 32px 0;
        margin: 0;
    }

    #tod_bundling .zain-internet-packages .zain-internet-package-card {
        width: 310px;
        min-width: 310px;
        min-height: 400px;
        padding: 24px;
        border-radius: 24px;
        border: solid 1px #e2e6eb;
        background-color: #fff;
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
        position: relative;
    }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-highlight {
            box-shadow: 0px 0px 0px 1px rgb(230, 0, 126), 0px 5px 20px -5px rgb(230, 0, 126);
        }


        #tod_bundling .zain-internet-packages .zain-internet-package-card hr {
            border-top: 1px solid #e2e6eb;
            width: 100%;
            margin: 16px 0;
            padding: 0;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-title {
            display: flex;
            flex-wrap: nowrap;
            gap: 8px;
            width: 100%;
        }

            #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-title h4 {
                margin: 0;
                padding: 0;
                padding-bottom: 16px;
                font-size: 18px;
                font-weight: 600;
                color: #11120e;
                min-height: 55px;
            }

            #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .popular {
                min-width: 90px;
                height: 24px;
                margin: 0;
                padding: 4px 12px;
                border-radius: 12px;
                background-color: #e6007e;
                font-size: 12px;
                font-weight: normal;
                font-stretch: normal;
                font-style: normal;
                line-height: normal;
                letter-spacing: normal;
                color: #fff;
                margin-left: auto;
            }

            #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .exclusive {
                min-width: 92px;
                height: 24px;
                margin: 0;
                padding: 4px 10px;
                border-radius: 12px;
                background-color: #e6007e;
                font-size: 12px;
                font-weight: normal;
                font-stretch: normal;
                font-style: normal;
                line-height: normal;
                letter-spacing: normal;
                color: #fff;
                margin-left: auto;
                text-align: center;
                display: none;
            }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-highlight .zain-internet-package-title .exclusive {
            display: inline-block;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription {
            display: flex;
            width: 100%;
            justify-content: space-between;
            align-items: flex-end;
            gap: 16px;
            position: relative;
        }

            #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h2 {
                font-size: 36px;
                font-weight: 600;
                color: #11120e;
                padding: 0;
                margin: 0;
            }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount {
            background-image: url('https://www.jo.zain.com/english/PublishingImages/Icons/discount-ribbon-en.png');
            min-width: 120px;
            background-size: 100% 100%;
            background-repeat: no-repeat;
            position: absolute;
            right: -7px;
            top: 20px;
            height: 50px;
            color: #fff;
            text-align: center;
            flex-wrap: nowrap;
            justify-content: space-between;
            gap: 2px;
            align-items: center;
            padding: 0 4px 8px 12px;
            z-index: 1;
            display: none;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-title .discount {
            display: flex;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-title h4 {
            max-width: 115px;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2:after {
            content: "";
            background-color: #e6007e;
            position: absolute;
            width: 2px;
            height: 120%;
            transform: translate(-50%,-10%) rotate(45deg);
            transform-origin: center;
            z-index: 1;
            top: 0;
            left: 50%;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h2,
        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4 {
            color: #ddd;
            position: relative;
        }

            #tod_bundling .zain-internet-packages .zain-internet-package-card.card-promotion .zain-internet-package-subscription h4.border-divider {
                color: #11120e;
            }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-price {
            font-size: 18px;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-month {
            font-size: 12px;
            font-weight: normal;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-title .discount .discounted-promo {
            font-size: 10px;
            font-weight: normal;
            width: 40px;
            line-height: 1;
            text-align: center;
            padding-left: 4px;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4 {
            font-size: 14px;
            font-weight: normal;
            color: #11120e;
            padding: 0;
            margin: 0;
        }

            #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4:first-child {
                padding-right: 16px;
            }

            #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-subscription h4:last-child {
                text-align: right;
                padding-left: 10px;
                border-left: solid 1px #e2e6eb;
                margin-left: auto;
            }

        #tod_bundling .zain-internet-packages .zain-internet-package-card ul {
            padding: 0;
            margin: 0 0 16px 0;
            list-style: none;
        }

            #tod_bundling .zain-internet-packages .zain-internet-package-card ul:last-child {
                min-height: 120px;
                margin-bottom: auto;
                margin-top: 16px;
            }

            #tod_bundling .zain-internet-packages .zain-internet-package-card ul li {
                font-size: 14px;
                font-weight: normal;
                color: #4f6f88;
            }

                #tod_bundling .zain-internet-packages .zain-internet-package-card ul li:before {
                    color: #4f6f88;
                    font-weight: 700;
                    font-size: 14px;
                    content: '✓';
                    margin-right: 10px;
                    margin-left: 0;
                }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-package-bottom {
            margin-top: auto;
            width: 100%;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .btn.btn-pink {
            width: 100% !important;
            height: 40px;
            margin-bottom: 16px;
            border-radius: 20px;
            background-color: #e6007e !important;
            border-color: #e6007e !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #fff !important;
            outline: none !important;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card a {
            font-size: 14px;
            font-weight: bold;
            color: #e6007e !important;
            text-decoration: none !important;
            outline: none !important;
            cursor: pointer;
            display: block;
        }

            #tod_bundling .zain-internet-packages .zain-internet-package-card a .showmore {
                display: inline-block;
            }

            #tod_bundling .zain-internet-packages .zain-internet-package-card a .hidemore {
                display: none;
            }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .toggle-arrow svg {
            width: 22px;
            height: 22px;
            margin-bottom: -5px;
            transform: rotate(0);
            transition: all 0.3s ease;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .showmore {
            display: none;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .hidemore {
            display: inline-block;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .collapse.in ~ a .toggle-arrow svg {
            transform: rotate(180deg);
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card .zain-internet-pacakge-ribbon {
            display: none;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-pacakge-ribbon {
            display: block;
            top: 0;
            position: absolute;
            background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
            background-size: contain;
            min-height: 52px;
            margin: -8px;
            width: 90%;
            text-align: center;
            color: white;
            padding-top: 10px;
            font-weight: bold;
            background-repeat: no-repeat;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-pacakge-ribbon {
            display: block;
            top: 0;
            position: absolute;
            background: url(https://www.jo.zain.com/english/PublishingImages/ZainInternet/CardHeaderPromoted.svg);
            background-size: contain;
            min-height: 52px;
            margin: -8px;
            width: 90%;
            text-align: center;
            color: white;
            padding-top: 10px;
            font-weight: bold;
            background-repeat: no-repeat;
        }

    #tod_bundling .zain-internet-packages {
        margin-top: 88px;
        position: relative;
    }

        #tod_bundling .zain-internet-packages .zain-internet-packages-bg {
            border-radius: 24px;
            background-color: #f9fafb;
            position: absolute;
            top: 0;
            left: -65vw;
            width: 100vw;
            height: 100%;
            z-index: 0;
        }

        #tod_bundling .zain-internet-packages .zain-internet-package-card.card-ribbon .zain-internet-package-title {
            margin-top: 30px;
        }

/**********End TOD ***********/

/*********General styles********/

.qp-header {
    display: flex;
    gap: 30px;
    align-items: center;
    margin-top: 40px;
}

    .qp-header p {
        font-size: 36px;
        font-weight: bold;
        margin-bottom: 0px;
    }


.qp-header-customer-data {
    display: flex;
    justify-content: space-between;
    background: #F9FAFB;
    padding: 20px;
    border: 1px solid #F9FAFB;
    border-radius: 16px;
    margin-top: 30px;
    margin-bottom: 30px;
    align-items: center;
}

    .qp-header-customer-data p {
        font-size: 16px;
        margin-bottom: 0px;
    }

.qp-header-number-data {
    display: flex;
    gap: 20px;
    background: #F9FAFB;
    border: 1px solid #F9FAFB;
    border-radius: 16px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 16px;
}

.btn-qp-change-number {
    display: flex;
    gap: 10px;
    background: #FFFFFF;
    color: black;
    border: 1px solid #DBDBDB;
    border-radius: 50px;
    align-items: center;
    font-size: 20px;
}

    .btn-qp-change-number:hover {
        background: #FFFFFF;
        border: 1px solid #DBDBDB;
    }

    .btn-qp-change-number:active {
        background: #FFFFFF;
        border: 1px solid #DBDBDB;
    }

.qp-tabs-switching-container {
    display: flex;
    gap: 10px;
}

.btn-qp-change-tab {
    background: white;
    border: 1px solid #DDE1E5;
    border-radius: 6px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom: 1px solid #F9FAFB;
    color: black;
    box-shadow: unset;
    height: 100%;
}

.qp-tab.active .btn-qp-change-tab {
    background: #F9FAFB;
    border: 1px solid #F9FAFB;
    border-radius: 6px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top: 4px solid #55B9E8;
    border-bottom: 1px solid #F9FAFB;
    color: black;
    box-shadow: unset;
}

.qp-main-tabs-container {
    background: #F9FAFB;
    padding: 30px;
    padding-bottom: 0px;
    display: flex;
    gap: 20px;
}

.qp-controls-container {
    flex-grow: 1;
    margin-bottom: 30px;
}

.qp-image-container {
    flex-grow: 1;
    max-width: 40%;
}

    .qp-image-container img {
        width: 100%;
    }

.qp-form-container {
    margin-top: 12px;
    margin-bottom: 12px;
}

.qp-payment-method-selectors-container {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    width: 100%;
}

.btn-payment-method-selection {
    border: 1px solid #D9E0E7;
    border-radius: 7px;
    color: black;
    background: white;
}

    .btn-payment-method-selection.active {
        border: 1px solid #55B9E8;
        border-radius: 7px;
        color: white;
        background: #55B9E8;
        box-shadow: unset;
    }


.hide-not-apple {
    display: none;
}

#qp-revamp-container.apple-device .hide-not-apple {
    display: block;
}

.qp-form-title {
    font-weight: bold;
    font-size: 20px;
}

.qp-form-control {
    border-color: #D9E0E7;
    box-shadow: none;
    height: 40px;
}

.qp-mt-30 {
    margin-top: 30px;
}

.btn-qp-link-button, .btn-qp-link-button:hover, .btn-qp-link-button:active {
    padding-left: 0px;
    background: transparent;
    color: #55B9E8;
    margin-bottom: 20px;
    text-decoration: underline;
}

.qp-paynow-button {
    margin-top: 14px;
    max-width: 250px;
    border: 1px solid #55B9E8;
    border-radius: 7px;
    color: white;
    background: #55B9E8;
    box-shadow: unset;
}

#qp-revamp-container .total-cost {
    display: flex;
    width: 100%;
    max-width: 100%;
    justify-content: space-between;
    margin-bottom: 10px;
}

#qp-revamp-container .qp-ebill-header {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: self-start;
}

#qp-revamp-container .ebill-tab-switcher li {
    background-color: #fff;
    color: black;
    padding: 10px 20px;
    border-radius: 11px;
    width: 125px;
    text-align: center;
    /* box-shadow: 0 0 0 2px #37ace5; */
    box-shadow: unset;
    transition: all 0.2s ease;
    margin: 0 5px;
    margin-bottom: 10px;
    border: 1px solid #D9E0E7;
}

    #qp-revamp-container .ebill-tab-switcher li.active {
        background-color: #37ace5;
        color: #fff;
        padding: 10px 20px;
        border-radius: 11px;
        width: 125px;
        text-align: center;
    }

#qp-revamp-container .ebill-row {
    display: flex;
    width: 100%;
    justify-content: space-between;
    background-color: white;
    padding: 10px;
    border-radius: 11px;
    margin-bottom: 11px;
    font-weight: bold;
}

#qp-revamp-container .qp-prepaid-vouchers-container {
    max-width: 600px;
}

    #qp-revamp-container .qp-prepaid-vouchers-container .btn-payment-method-selection {
        min-width: 200px;
        margin-left: 16px;
    }

#qp-revamp-container .slick-track {
    padding-bottom: 0px;
}

#qp-revamp-container .btn-qp-verifyotp {
    min-width: unset !important;
}

#qp-revamp-container .qp-surpriseme-input-otp-container input {
    border: 1px solid #979797;
    background: #FFF;
    height: 50px;
    padding: 0;
    outline: none;
    box-shadow: none;
    transition: unset;
    text-align: center;
    border-radius: 6px;
}

#qp-revamp-container .slick-prev::before,
#qp-revamp-container .slick-next::before {
    content: none !important;
    display: none !important;
}

#qp-revamp-container #modal_ebill .modal-dialog {
    width: 90%;
    margin: 0 auto;
    margin-top: 100px;
}

#qp-revamp-container #modal_ebill .modal-content, #qp-revamp-container #modal_ebill .btn.btn-default.qp-btn {
    background-color: white;
}

#qp-revamp-container .btn.btn-primary.qp-btn {
    box-shadow: unset;
}

#qp-revamp-container .btn.btn-default.qp-btn {
    box-shadow: unset;
    border: 1px solid black;
}
/**********End TOD ***********/
/*********General styles********/
.otp-resend, .otp-timer {
    font-size: 14px;
    font-weight: bold;
}

    .otp-resend.disabled {
        z-index: unset !important;
        opacity: 0.8;
        font-weight: normal;
    }

.userregistaration_container * {
    user-select: text !important;
}

.btn-pink {
    width: auto !important;
    min-width: 120px;
    height: 40px;
    padding: 9px 24px;
    border-radius: 20px;
    background-color: #e6007e !important;
    border-color: #e6007e !important;
    color: #fff !important;
    font-weight: normal;
}

.btn-pink-link {
    width: auto !important;
    min-width: 120px;
    height: 40px;
    padding: 9px 24px;
    border-radius: 20px;
    background-color: transparent !important;
    border-color: transparent !important;
    color: #e6007e !important;
    box-shadow: none !important;
    font-weight: bold;
}

.datepicker .table-condensed,
.timepicker .table-condensed {
    background-color: #fff;
}

    .datepicker .table-condensed .btn,
    .timepicker .table-condensed .btn {
        color: #333 !important;
        border-radius: 4px !important;
    }

    .datepicker .table-condensed .separator,
    .timepicker .table-condensed .separator {
        border: none !important;
    }

    .datepicker .table-condensed .disabled.today,
    .timepicker .table-condensed .disabled.today {
        position: unset !important;
    }

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number], input[type="number"] {
    -moz-appearance: textfield;
}

input[type=text], input[type="text"], textarea {
    -webkit-appearance: none;
}

.flex-no-wrap {
    flex-wrap: nowrap !important;
}

.flex-wrap {
    flex-wrap: wrap !important;
}

.d-block {
    display: block !important;
}

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

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

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

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

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

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

.my-24 {
    margin-top: 24px;
    margin-bottom: 24px;
}

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

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

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

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

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

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

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

.pt-34 {
    padding-top: 34px;
}

.w-max-200 {
    max-width: 200px;
}

.h-min-16 {
    min-height: 16px;
}

.f-w-normal {
    font-weight: normal !important;
}

.border-radius-4 {
    border-radius: 4px;
}

.color-default {
    color: #333;
}

.rtl {
    direction: rtl;
}

.ltr {
    direction: ltr;
}

.hidden-en {
    display: none !important;
}

.animate_headShake {
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-name: headShake;
}



@keyframes background-zoom {
    0% {
        background-size: 100%;
        background-position: 0 0;
    }

    10% {
        background-size: 105%;
        background-position: 2px 0;
    }

    20% {
        background-size: 110%;
        background-position: 4px 2px;
    }

    30% {
        background-size: 115%;
        background-position: 6px 4px;
    }

    40% {
        background-size: 120%;
        background-position: 7px 5px;
    }

    50% {
        background-size: 125%;
        background-position: 8px 7px;
    }

    60% {
        background-size: 120%;
        background-position: 7px 8px;
    }

    70% {
        background-size: 115%;
        background-position: 6px 7px;
    }

    80% {
        background-size: 110%;
        background-position: 4px 4px;
    }

    90% {
        background-size: 105%;
        background-position: 2px 2px;
    }

    100% {
        background-size: 100%;
        background-position: 0 0;
    }
}

@keyframes fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg);
    }

    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg);
    }

    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg);
    }

    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg);
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes rotate-loading {
    0% {
        transform: translate(-50%,-50%) rotate(0deg);
    }

    100% {
        transform: translate(-50%,-50%) rotate(360deg);
    }
}

@keyframes gameSlider {
    0% {
        transform: translateZ(0);
    }

    to {
        transform: translate3d(-1000px, 0, 0);
    }
}


@media (max-width: 991px) {

    #HomePageNew .slick-prev2,
    .slick-next2 {
        display: none !important;
    }

    #HomePageNew {
        margin-top: 0;
    }

        #HomePageNew .latestOffersSlider .slick-slide {
            padding: 0 5px;
        }

        #HomePageNew .btn-pay {
            width: 320px;
            height: 41px;
            border-radius: 23.81px;
            padding-top: 11px;
            padding-right: 15.88px;
            padding-bottom: 11px;
            padding-left: 15.88px;
        }

        #HomePageNew .quickPaySection {
            flex-wrap: wrap;
            justify-content: start;
            align-items: start;
            height: auto;
            width: auto;
            padding: 20px 8px;
        }

        #HomePageNew .ServicesCardsList {
            flex-wrap: wrap;
        }

        #HomePageNew inputMSISDN::placeholder {
            font-size: 12px;
        }

        #HomePageNew .offer {
            width: 100%;
            height: 100%;
        }

        #HomePageNew .eshopCategoryRow {
            flex-wrap: wrap;
        }

        #HomePageNew .promotionsSection {
            gap: 10px;
            flex-wrap: wrap;
        }

        #HomePageNew .w-33 {
            width: 100%;
        }

        #HomePageNew .ZFiberImage {
            flex-wrap: wrap;
            justify-content: end;
        }

        #HomePageNew .inputMSISDN {
            width: 325px;
        }

        #HomePageNew .connectZFiber {
            font-size: 22px !important;
            margin-bottom: 0 !important;
            font-weight: 100 !important;
        }

        #HomePageNew .ZFiber {
            padding: 20px;
        }

        #HomePageNew .zainFiberServices {
            margin-top: -150px;
        }

        #HomePageNew .AppFeatures {
            flex-wrap: wrap;
        }

        #HomePageNew .downloadApp {
            justify-content: center;
            align-items: center;
            padding: 5px 0;
        }

        #HomePageNew .downloadAppSection {
            padding: 0px;
        }

        #HomePageNew .AppFeatures {
            justify-content: start;
            padding-left: 8%;
        }

        #HomePageNew .store-img {
            width: 85px;
        }

        #HomePageNew .needHelpSection {
            margin-bottom: 20px;
            justify-content: flex-start;
            flex-wrap: wrap;
            margin-left: 20px;
        }

        #HomePageNew .help-icon {
            width: 100%;
            max-width: 50px;
        }

        #HomePageNew .supportChannel {
            flex: 1 0 100%;
        }

        #HomePageNew .support-title {
            font-weight: bold;
        }

        #HomePageNew .fiber-img {
            max-width: 235px;
        }

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

    .text-md-center {
        text-align: center;
    }

    .qp-view {
        text-align: center;
    }

    .qp-hr-v {
        display: none;
    }

    .qp-view.view-01, .row.qp-view-view-02,
    .row.qp-view-view-02.div_view_02_SurpriseMe_OTP,
    .row.qp-view-view-02.div_view_02_SurpriseMe_Success,
    .row.qp-view-view-02.div_view_02_SurpriseMe_Error {
        background-image: none;
    }

    .qp-btn-payment-container {
        flex-direction: column;
        align-items: center;
    }

    .qp-btn-payment {
        width: 100%;
    }

    #nvidia_informative_pages .nvidia-quick-subscription-modal .modal-body {
        padding: 20px;
    }

    #appointments .appointment-record-item-value {
        padding-bottom: 15px;
    }

    #appointments .appointment-record-item.ticket-number .appointment-record-item-value {
        padding-bottom: 0;
    }

    #appointments .appointment-record-item-value {
        padding-top: 0;
    }

    .appointment-record-item.ticket-number {
        width: 70%;
    }

    .appointment-record-item.branch, .appointment-record-item.date, .appointment-record-item.check-in, appointment-record-item.check-in-disabled {
        display: block;
        width: 100%;
    }

        .appointment-record-item.branch .appointment-record-item-header {
            display: none;
        }

        .appointment-record-item.branch .appointment-record-item-value {
            padding-top: 0;
        }

    .appointment-record-item.time, .appointment-record-item.service {
        width: 50%;
    }

    .appointment-record-item.action {
        position: absolute;
        float: right;
        top: 16px;
        right: 0;
    }

    .appointment-hint .inline-block:first-child {
        width: 40px;
    }

    .appointment-hint .inline-block:last-child {
        width: calc(100% - 45px);
    }

    .appointment-record-item-action {
        padding-top: 0;
    }


    #jeeran .gift-item .gift-item-row {
        flex-wrap: wrap;
    }

        #jeeran .gift-item .gift-item-row .gift-item-column:last-child {
            margin-top: 24px;
        }

        #jeeran .gift-item .gift-item-row .gift-item-column:nth-child(2) {
            flex-grow: 2;
            flex-basis: calc(100% - 112px);
        }

        #jeeran .gift-item .gift-item-row .gift-item-column.break {
            display: inline-block;
            flex-basis: 100%;
            height: 0;
        }

        #jeeran .gift-item .gift-item-row .gift-item-column.action {
            flex-basis: 100%;
        }

            #jeeran .gift-item .gift-item-row .gift-item-column.action .redeemed {
                width: 100%;
            }

            #jeeran .gift-item .gift-item-row .gift-item-column.action .redeemed-remaining {
                width: 100%;
                text-align: left !important;
            }

    #jeeran .gift-item .redeemed-on br {
        display: none;
    }


    #sim-management .card-main {
        padding: 24px 16px 40px 16px;
    }

        #sim-management .card-main .col-sm-6 {
            padding: 0;
        }

    #sim-management .card-sub {
        flex-wrap: wrap;
    }

    #sim-management .break {
        display: inline-block;
        flex-basis: 100%;
        height: 0;
    }

    #sim-management .card-action {
        flex-basis: 100%;
    }

    #roaming_international .ri-faq-header {
        font-size: 24px;
    }

    #roaming_international .ri-faq-trigger p {
        font-size: 18px;
    }

    #roaming_international .ri-header-text {
        padding-left: 0px;
        padding-top: 0px;
        padding-right: 0px;
    }

    #roaming_international {
        padding-left: 0px;
        padding-right: 0px;
        margin-top: -50px;
    }

        #roaming_international .ri-header {
            height: auto;
        }

        #roaming_international .ri-level-02 .ri-header, #roaming_international .ri-level-03 .ri-header {
            margin-top: 40px;
        }

        #roaming_international .ri-header h2, #roaming_international .ri-header .ri-header-text h2, #roaming_international .ri-header .ri-header-text p {
            position: relative;
            color: black;
            font-size: 24px;
            width: 100%;
            padding: 0px;
            margin-top: 8px;
        }

        #roaming_international .ri-header .ri-header-text p {
            font-size: 14px;
        }

        #roaming_international .card {
            padding: 16px;
            width: 100%;
        }

        #roaming_international .ri-header-desktop-img {
            display: none;
        }

        #roaming_international .ri-header-mobile-img {
            display: block;
        }

        #roaming_international .ri-content {
            margin-top: 32px;
            margin-bottom: 64px;
        }

        #roaming_international .ri-level-02 .ri-content {
            margin-top: 24px;
            margin-bottom: 64px;
        }

        #roaming_international .ri-level-03 .ri-content {
            flex-wrap: wrap;
            margin-top: 0px;
        }

        #roaming_international .ri-level-03 .ri-header {
            height: auto;
            margin-bottom: 32px;
        }

        #roaming_international .ri-content-column1 {
            min-width: unset;
            max-width: unset;
        }

        #roaming_international .ri-header {
            background-color: unset;
        }



    #nvidia_informative_pages .main-geforce-now {
        max-height: 100vh;
        min-height: 100vh;
    }

    #nvidia_informative_pages .tab-switcher {
        display: flex;
        padding-left: 16px;
        gap: 15px;
        flex-wrap: wrap;
    }

    #nvidia_informative_pages .overlay-text {
        position: absolute;
        z-index: 1;
        width: 100vw;
        height: 100vh;
        top: 40px;
        padding: 25px;
        background-image: url("https://www.jo.zain.com/english/PublishingImages/ZainInternet/geforce-now-banner.png");
        background-size: 150vw auto;
        background-position: bottom;
        background-repeat: no-repeat;
    }

    #nvidia_informative_pages .zain-fiber-redirection {
        margin-top: 15px;
    }

    #nvidia_informative_pages .overlay-text .overlay-text-body {
        width: 100%;
        max-width: unset;
    }

    #nvidia_informative_pages .overlay-text-smallheader {
        color: #3ac3df;
    }

    #nvidia_informative_pages .nvidia-card-img img {
        width: 100%;
        height: auto;
    }

    #nvidia_informative_pages .text-white {
        color: white;
    }

    #nvidia_informative_pages .steps-geforce-container {
        margin-left: 15px;
        margin-right: 15px;
        justify-content: unset;
    }

    #nvidia_informative_pages .overlay-text .overlay-text-header {
        font-size: 30px;
    }

    #nvidia_informative_pages .geforce-cards-container {
        display: block;
    }

    #nvidia_informative_pages .nvidia-card {
        max-width: unset;
        width: 100%;
        margin-bottom: 20px;
    }

    #nvidia_informative_pages .nvidia-fiber-cards-container {
        justify-content: unset;
    }

    #nvidia_informative_pages .big-picture-backdrop {
        background-image: unset;
        padding: 25px;
    }

        #nvidia_informative_pages .big-picture-backdrop .left-text {
            max-width: unset;
        }

    #nvidia_informative_pages .overlay-text h2.intro_title {
        width: unset;
    }

    #nvidia_informative_pages .main-zain-fiber-offers {
        padding-left: 15px;
        padding-right: 15px;
    }

    #nvidia_informative_pages .all-games-container {
        width: 100%;
    }

    #nvidia_digital_subscription .nvidia-ds-package {
        display: block;
    }

    #nvidia_digital_subscription .nvidia-ds-start-wizard-button {
        margin-top: 16px;
        margin-bottom: 16px;
        width: 100%;
    }

    #nvidia_digital_subscription .nvidia-ds-package-view-more-details {
        width: 100%;
    }

    #nvidia_digital_subscription .nvidia-ds-package-header {
        font-size: 24px;
    }

    #nvidia_digital_subscription .nvidia-ds-choice {
        width: 100%;
    }

    #nvidia_digital_subscription .nvidia-ds-flex-container .form-group {
        width: 100%;
    }

    #nvidia_digital_subscription .nvidia-ds-cancel-button {
        width: 100%;
    }

    #nvidia_digital_subscription .nvidia-ds-delete-button {
        width: 35%;
        height: auto;
    }

    #nvidia_digital_subscription .nvidia-ds-date-activated-on {
        height: auto;
    }

    #nvidia_informative_pages .game-img {
        max-width: 150px;
        width: 150px;
        height: 150px;
        max-height: 150px;
    }

    #nvidia_informative_pages .modal-content {
        transform: translate(8vw, 50%);
    }

    #nvidia_informative_pages .game-card {
        max-width: 150px;
    }

    #nvidia_informative_pages .filtred-games-tab-container {
        display: none;
        width: 100%;
    }

        #nvidia_informative_pages .filtred-games-tab-container .filter-header {
            min-width: max-content;
        }

    #nvidia_informative_pages .slick-slider .slick-list {
        padding-left: 0px;
    }

    #nvidia_informative_pages .game-row.activated {
        justify-content: space-between;
    }

    #nvidia_informative_pages .row-slick-container {
        padding-right: 0px;
    }

    #nvidia_informative_pages .tab-switcher a {
        margin-right: 0;
        display: inline-block;
    }

    #nvidia_informative_pages .game-row.activated {
        justify-content: space-between;
    }

    #nvidia_informative_pages .filtred-games-tab {
        justify-content: space-between;
    }

    #prepaid-packages-slider .card-package.subscriptions {
        max-width: 100%;
        margin: 0px;
    }
}

@media (max-width: 767px) {

    #roaming_international .ri-Volte_countries {
        width: 100%;
        display: flex;
        padding: 10px;
        gap: unset;
    }


    #press-releases-revamp .press-release-card {
        flex-grow: 1;
    }

    #press-releases-revamp .press-release-header {
        flex-wrap: wrap;
    }

    #press-releases-revamp .press-release-title h3,
    #press-releases-revamp .pr-search-box-container {
        width: 100%;
    }

        #press-releases-revamp .pr-search-box-container .press-release-search-box {
            width: 100%;
        }

    #esports-revamp .esports-header {
        flex-wrap: wrap;
    }

        #esports-revamp .esports-header h3,
        #esports-revamp .esports-header .esports-search-box-container {
            width: 100%;
        }

            #esports-revamp .esports-header .esports-search-box-container .esports-search-box {
                width: 100%;
            }

    #pr-multimedia-revamp .multimedia-header {
        flex-wrap: wrap;
    }

        #pr-multimedia-revamp .multimedia-header h3,
        #pr-multimedia-revamp .multimedia-header .multimedia-search-box-container {
            width: 100%;
        }

            #pr-multimedia-revamp .multimedia-header .multimedia-search-box-container .multimedia-search-box {
                width: 100%;
            }

    #corporate-sustainability-details .corporate-sustainability-details-body-container {
        flex-direction: column-reverse;
        gap: 16px;
    }

    #corporate-sustainability-details .corporate-sustainability-categories-mobile {
        width: 100vw;
        margin-left: -16px;
        margin-top: -55px;
    }

    #corporate-sustainability-details a.category-selector-mobile {
        width: 100%;
        background-color: #6FB6E4;
        color: white;
        padding: 10px;
        text-decoration: none;
        display: flex;
        justify-content: space-between;
    }

    #corporate-sustainability-details .category-selector-mobile .toggle-arrow {
        width: 22px !important;
        height: 22px !important;
    }

        #corporate-sustainability-details .category-selector-mobile .toggle-arrow svg {
            width: 22px !important;
            height: 22px !important;
        }

    #corporate-sustainability-details .category-selector-mobile[aria-expanded='true'] .toggle-arrow svg {
        transform: rotateZ(-180deg);
        transition: 0.2s;
    }

    #corporate-sustainability-details .subcategory-selector {
        background-color: #FCFCFC;
    }

    #corporate-sustainability-details .corporate-sustainability-mobile-img {
        max-height: 170px;
        border: 1px solid white;
        border-radius: 7px;
    }



    .pr-details-revamp img {
        max-height: 190px;
        border: 1px solid white;
        border-radius: 7px;
        margin-bottom: 30px;
    }

    .pr-details-revamp .pr-details-title-container h1 {
        font-size: 31px;
        font-weight: bold;
        margin-bottom: 28px;
    }



    .mb-sm-16 {
        margin-bottom: 16px;
    }

    .text-center-xs {
        text-align: center;
    }

    .sidebar-container-sticky {
        position: relative;
        top: unset;
    }

    .custom-slick-arrows {
        display: none !important;
    }

    .device-action-container {
        text-align: center;
    }

    #switcher {
        width: 100% !important;
    }

    .switch--container .switch--item {
        display: block;
        box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.1);
        margin-bottom: 10px;
    }

        .switch--container .switch--item:last-child {
            margin-bottom: 0;
        }

    .slick-dots {
        bottom: -25px;
    }

    .chat-container {
        right: 10px;
        opacity: 0.8;
    }

        .chat-container.active {
            bottom: 30px;
        }

    .survey.survey-opinion {
        position: fixed;
        left: 15px;
        width: 90px;
        height: 90px;
        z-index: 900;
        bottom: -100px;
        background-color: transparent;
        border-radius: 10px;
        box-shadow: none;
        transition: all 0.5s ease;
        border-radius: 50%;
    }

        .survey.survey-opinion.active {
            bottom: 10px;
        }

        .survey.survey-opinion:hover {
            background-color: transparent;
            box-shadow: none;
        }

    .survey-opinion-image-full {
        display: none !important;
    }

    .survey-opinion-image-mobile {
        display: block !important;
    }



    .business-lvl1-header p {
        width: 80%;
    }

    .input-optout, .btn-optout {
        width: 100%;
        display: block;
        margin: 0;
        margin-bottom: 10px;
    }

    /*.business-lvl1-card.card-white p, .business-lvl1-card.card-black p, .landing-preview-desc {
        width: 100%;
        max-width: 80%;
    }*/
    .business-parallax-main, .business-parallax-bottom {
        height: 100%;
        min-height: 100vh;
        background-attachment: unset;
        background-position-y: 0;
    }

    .business-form-container, .bunker-video {
        padding-right: 30px;
        padding-left: 30px;
    }

        .bunker-video iframe {
            width: 100%;
            height: 200px;
            border-radius: 5px;
        }

    .business-p {
        padding: 30px;
    }

    .business-front-line {
        min-height: 0;
        background-size: 100% auto;
        /*background-position-y: px;*/
    }

    .text-sm-center {
        text-align: center;
    }

    .business-parallax-cctv {
        height: auto;
        background-attachment: scroll;
    }

    .business-form-container.business-bunker-form-right {
        position: relative;
        top: unset;
        right: unset;
    }

    .badge-icon {
        max-width: 120px;
    }

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

    .business-dots-white-sm {
        min-height: 80px;
    }

    #eBillModal .modal-dialog {
        width: 100%;
    }

    .ebill-modal-body {
        max-height: calc(100vh - 60px);
        min-height: calc(100vh - 60px);
    }

    .ebill-invoice-container {
        padding: 20px;
    }

    .ebill-invoice-download {
        width: 35px;
        height: 35px;
        position: absolute;
        right: 10px;
        top: 10px;
        transition: all 0.3s ease-in;
    }

    .quick-pay--submit {
        margin-top: 20px;
    }

    .btn.qp-btn-payment {
        margin-bottom: 10px;
        max-width: 400px;
        width: 100%;
    }

    #modal_ebill .modal-dialog {
        width: 100vw;
    }

    #quickpay_ebill .qp-title {
        height: auto;
        min-height: 45px;
    }

        #quickpay_ebill .qp-title h1 {
            font-size: 32px;
        }

    .qp-hr-v {
        display: none !important;
    }

    .ebill-status-paid, .ebill-status-pending {
        width: 100%;
    }

    .ebill-tab-switcher li, .ebill-tab-switcher li.active {
        padding: 7px 10px;
        width: 100px;
        margin: 0 5px;
        margin-bottom: 5px;
        margin-top: 10px;
    }

    .qp-ebill-content {
        padding: 20px;
    }

        .qp-ebill-content .ebill-col-overflow {
            min-height: 400px;
        }

    .qp-hd-billrun {
        max-width: unset;
    }

    .qp-recurring-controls .btn,
    .btnManageRecurring {
        width: 100% !important;
    }

    .qp-services-card-container {
        align-items: center;
    }

    .recurring-card-container {
        flex-direction: column;
    }

        .recurring-card-container div:last-child {
            margin-left: unset;
        }

        .recurring-card-container .recurring-card-img-container {
            width: 100%;
        }

    #contact_us .contact_us_col .contact_us_box {
        min-height: 200px;
    }

    .row.ebill-row {
        padding: 10px 0;
    }

    #modal_select_date .modal-dialog, #modal_select_time .modal-dialog {
        margin: auto;
        width: 100%;
        max-width: 400px;
    }

    #modal_cancel .modal-dialog,
    #modal_checkin .modal-dialog,
    #modal_checkedin .modal-dialog,
    #modal_checkin_error .modal-dialog,
    #modal_redeem .modal-dialog {
        margin: auto;
        width: 100%;
    }

    .vaccine-bundle-content {
        max-height: 150px;
        overflow-y: auto;
    }

    #my-invoices {
        margin-top: 46px;
    }

        #my-invoices .hd-alert .break {
            display: block;
        }

        #my-invoices .card .card-section {
            flex-wrap: wrap;
        }

        #my-invoices .card .card-break {
            width: 100%;
            display: inline-block;
            flex-basis: 100%;
            height: 0;
        }

        #my-invoices .card .card-action {
            margin-top: 16px;
            margin-left: unset;
            width: 100%;
        }

        #my-invoices .card .card-section .card-invoice-detail {
            flex-wrap: wrap;
            margin-top: 16px;
        }

            #my-invoices .card .card-section .card-invoice-detail p {
                width: 100%;
                margin-bottom: 16px;
            }

    .modal-open #modal_my_invoices {
        padding: 0 !important;
    }

    #modal_my_invoices .modal-dialog {
        margin: 0 auto;
        width: 100%;
    }

    #my-invoices .card .card-section .card-amount h4 {
        font-size: 18px;
    }

    #my-invoices .card .card-section .card-amount p label {
        font-size: 14px;
    }

    #prospective-supplier h1 {
        font-size: 24px;
    }

    #prospective-supplier .main-paragraph {
        font-size: 16px;
    }

    #prospective-supplier .selection-registration-block {
        padding: 16px;
        font-size: 14px;
    }

    #prospective-supplier .btn-register {
        font-size: 16px;
        height: 40px !important;
        width: 100%;
        min-width: 100%;
        border-radius: 20px;
    }

    #my-services .card-item {
        flex-wrap: wrap;
    }

        #my-services .card-item .card-item-column {
            width: 100%;
        }

            #my-services .card-item .card-item-column:last-child {
                margin-top: 32px;
                justify-content: flex-start;
            }

        #my-services .card-item .myservices-repeater-remove {
            min-width: 10px;
        }

    #zain-blog .zain-blog-header {
        flex-wrap: wrap;
    }

        #zain-blog .zain-blog-header h2,
        #zain-blog .zain-blog-header .header-action {
            width: 100%;
        }

        #zain-blog .zain-blog-header .header-action {
            margin-top: 16px;
        }

            #zain-blog .zain-blog-header .header-action .zain-blog-search {
                width: 100%;
            }

    #zain-blog .zain-blog-footer {
        margin-bottom: 64px;
    }

    #activate-lines .card .column-50 {
        width: 100%;
    }

    .line-status-container .line-status-success,
    .line-status-container .line-status-warning,
    .line-status-container .line-status-danger {
        display: block;
        margin-top: 8px;
        width: 100%;
    }




    #zain-internet {
        margin-top: 0;
    }

        #zain-internet .zain-internet-tabs-list ul li a,
        #zain-internet .zain-internet-smartwiFi-app .btn.btn-white {
            font-size: 14px;
        }

        #zain-internet .zain-internet-intro,
        #zain-internet .zain-internet-best-choice .zain-internet-best-choice-items,
        #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row,
        #zain-internet .zain-internet-info-row,
        #zain-internet .zain-internet-packages-cards-item {
            flex-wrap: wrap;
        }

            #zain-internet .zain-internet-intro .column-50,
            #zain-internet .zain-internet-packages .zain-internet-packages-note,
            #zain-internet .zain-internet-wifi-features .column-50,
            #zain-internet .zain-internet-wifi-features .column-25,
            #zain-internet .zain-internet-check-availablity-banner .zain-internet-check-availablity-banner-contnet,
            #zain-internet .zain-internet-info-row .column-60,
            #zain-internet .zain-internet-info-row .column-50,
            #zain-internet .zain-internet-4G .column-50:first-child,
            #zain-internet .zain-internet-packages-cards-item .column-50,
            #zain-internet .zain-internet-smartwifi-videos-item,
            #zain-internet .zain-internet-map-modal-desc,
            #zain-internet .zain-internet-map-modal-map {
                width: 100%;
                max-width: 100%;
            }

                #zain-internet .zain-internet-intro .column-50:first-child {
                    padding: 0;
                }

                #zain-internet .zain-internet-intro .column-50:last-child,
                #zain-internet .zain-internet-info-row .column-40,
                #zain-internet .zain-internet-4G .column-50:last-child,
                #zain-internet .zain-internet-packages-cards-bg {
                    display: none;
                }

            #zain-internet .zain-internet-intro h2.intro_title,
            #zain-internet .zain-internet-best-choice h2,
            #zain-internet .zain-internet-check-availablity-banner h2,
            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row h2,
            #zain-internet .zain-internet-smartwiFi-app h2,
            #zain-internet .zain-internet-smartwifi-videos h2,
            #zain-internet .zain-internet-smartwifi-faq h2 {
                font-size: 32px;
            }

            #zain-internet .zain-internet-intro h4.intro_paragraph,
            #zain-internet .zain-internet-intro a.link-fiber-check-availablity,
            #zain-internet .zain-internet-packages-cards-item p,
            #zain-internet .zain-internet-smartwiFi-app p,
            #zain-internet .zain-internet-smartwifi-videos-container h4,
            #zain-internet .zain-internet-smartwifi-faq-container ul li {
                font-size: 16px;
            }

        #zain-internet .zain-internet-packages,
        #zain-internet .zain-internet-best-choice,
        #zain-internet .zain-internet-wifi-features {
            margin-top: 56px;
        }

            #zain-internet .zain-internet-packages h2.packages-container-title {
                font-size: 24px;
                padding: 32px 0;
            }

            #zain-internet .zain-internet-packages .zain-internet-package-card {
                width: 310px;
            }

            #zain-internet .zain-internet-wifi-features .order-1,
            #zain-internet .zain-internet-packages-cards-item .column-50:last-child {
                order: 1;
            }

            #zain-internet .zain-internet-wifi-features .order-2,
            #zain-internet .zain-internet-packages-cards-item .column-50:first-child {
                order: 2;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row,
            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row .row-flex {
                gap: 8px;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row {
                margin-bottom: 8px;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-item-card.image-container {
                padding: 40px 24px;
                text-align: center;
            }

            #zain-internet .zain-internet-wifi-features .zain-internet-wifi-features-row .btn.btn-white {
                margin-top: 24px;
            }

        #zain-internet .zain-internet-check-availablity-banner {
            margin-top: 80px;
        }

        #zain-internet .zain-internet-check-availablity-banner {
            padding: 48px 40px;
        }

        #zain-internet .zain-internet-info-card {
            padding: 24px;
        }

        #zain-internet .zain-internet-packages-cards-item h2 {
            font-size: 21px;
            margin-bottom: 16px;
        }

        #zain-internet .zain-internet-packages-cards {
            margin: 0;
        }

        #zain-internet .zain-internet-packages-cards-item {
            gap: 24px;
        }

        #zain-internet #tab_SmartWIFI .zain-internet-package-card {
            min-width: 144px;
            width: 144px;
        }

        #zain-internet .zain-internet-smartwiFi-app .zain-internet-info-row,
        #zain-internet .zain-internet-smartwifi-faq h2 {
            text-align: center;
        }

        #zain-internet .zain-internet-smartwiFi-app img {
            width: 162px;
        }

        #zain-internet .zain-internet-smartwifi-faq-container {
            margin-top: 30px;
        }

            #zain-internet .zain-internet-smartwifi-faq-container a {
                font-size: 21px !important;
            }



        #zain-internet .zain-internet-packages .zain-internet-packages-bg {
            left: -10%;
            width: 120%;
        }

        #zain-internet .zain-internet-tabs-list ul {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            row-gap: 10px;
            gap: 10px;
        }

            #zain-internet .zain-internet-tabs-list ul li a {
                margin: 0;
            }

        #zain-internet .zain-internet-smartwifi-videos-container {
            gap: 64px;
            margin-bottom: 64px;
        }

            #zain-internet .zain-internet-smartwifi-videos-container h4 {
                margin-top: 12px;
            }

        #zain-internet .zain-internet-modal.active,
        #zain-internet .zain-internet-modal.active.full {
            transform: translateY(0);
            padding-top: 50px;
        }

        #zain-internet .zain-internet-map-modal-desc,
        #zain-internet .zain-internet-map-modal-map {
            padding-left: 0;
            padding-right: 0;
        }

            #zain-internet .zain-internet-map-modal-desc h2 {
                font-size: 21px;
            }

            #zain-internet .zain-internet-map-modal-desc p,
            #zain-internet .zain-internet-map-modal-desc a.zain-internet-modal-current-location {
                font-size: 16px;
            }

            #zain-internet .zain-internet-map-modal-desc a.zain-internet-modal-current-location {
                padding: 21px 0;
            }

            #zain-internet .zain-internet-map-modal-map .btn-check-availablity-map {
                margin-top: 24px;
                width: 100% !important;
                max-width: 100%;
            }

        #zain-internet .zain-internet-modal .zain-internet-map-edit-address {
            cursor: pointer;
            margin-left: auto;
        }

        #zain-internet .zain-internet-map-modal-desc a.zain-internet-modal-current-location img {
            margin-right: 8px;
        }

        #zain-internet .zain-internet-map-modal .zain-internet-package-card-header-title,
        #zain-internet .zain-internet-map-modal .zain-internet-package-title {
            width: 100%;
        }

        #zain-internet .zain-internet-map-modal .zain-internet-package-subscription h4.border-divider {
            margin-left: auto;
        }

        #zain-internet .zain-internet-map-modal-map #google-map {
            max-height: 264px;
        }

        #zain-internet .zain-internet-map-form-contianer input.form-control,
        #zain-internet .zain-internet-map-form-contianer .btn.btn-pink {
            width: 100% !important;
            max-width: 100% !important;
        }

        #zain-internet .zain-internet-map-result-submit {
            width: calc(100% - 32px);
            margin: 0 16px;
        }

            #zain-internet .zain-internet-map-result-submit.active {
                transform: translate(calc(-50% - 16px),-50%);
            }

        #zain-internet .zain-internet-map-result-fail-container .zain-internet-map-result-fail-alert {
            margin-bottom: 32px;
        }

        #zain-internet .zain-internet-map-result-fail-container h2 {
            font-size: 24px;
            margin-bottom: 16px;
        }

        #zain-internet .zain-internet-map-result-fail-container p {
            font-size: 16px;
        }

        #zain-internet .zain-internet-map-result-fail-container .btn.btn-pink {
            margin-top: 32px;
            height: 40px;
            font-size: 14px;
            font-weight: normal;
        }


        #zain-internet .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-title h4 {
            max-width: 140px;
        }

        #zain-internet.portal-5g-replica .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card {
            max-width: unset !important;
        }


    /********Zain-internet-Revamp**********/


    zain-internet-Revamp {
        margin-top: 0;
    }

        zain-internet-Revamp .zain-internet-tabs-list ul li a,
        zain-internet-Revamp .zain-internet-smartwiFi-app .btn.btn-white {
            font-size: 14px;
        }

        zain-internet-Revamp .zain-internet-intro,
        zain-internet-Revamp .zain-internet-best-choice .zain-internet-best-choice-items,
        zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row,
        zain-internet-Revamp .zain-internet-info-row,
        zain-internet-Revamp .zain-internet-packages-cards-item {
            flex-wrap: wrap;
        }

            zain-internet-Revamp .zain-internet-intro .column-50,
            zain-internet-Revamp .zain-internet-packages .zain-internet-packages-note,
            zain-internet-Revamp .zain-internet-wifi-features .column-50,
            zain-internet-Revamp .zain-internet-wifi-features .column-25,
            zain-internet-Revamp .zain-internet-check-availablity-banner .zain-internet-check-availablity-banner-contnet,
            zain-internet-Revamp .zain-internet-info-row .column-60,
            zain-internet-Revamp .zain-internet-info-row .column-50,
            zain-internet-Revamp .zain-internet-4G .column-50:first-child,
            zain-internet-Revamp .zain-internet-packages-cards-item .column-50,
            zain-internet-Revamp .zain-internet-smartwifi-videos-item,
            zain-internet-Revamp .zain-internet-map-modal-desc,
            zain-internet-Revamp .zain-internet-map-modal-map {
                width: 100%;
                max-width: 100%;
            }

                zain-internet-Revamp .zain-internet-intro .column-50:first-child {
                    padding: 0;
                }

                zain-internet-Revamp .zain-internet-intro .column-50:last-child,
                zain-internet-Revamp .zain-internet-info-row .column-40,
                zain-internet-Revamp .zain-internet-4G .column-50:last-child,
                zain-internet-Revamp .zain-internet-packages-cards-bg {
                    display: none;
                }

            zain-internet-Revamp .zain-internet-intro h2.intro_title,
            zain-internet-Revamp .zain-internet-best-choice h2,
            zain-internet-Revamp .zain-internet-check-availablity-banner h2,
            zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row h2,
            zain-internet-Revamp .zain-internet-smartwiFi-app h2,
            zain-internet-Revamp .zain-internet-smartwifi-videos h2,
            zain-internet-Revamp .zain-internet-smartwifi-faq h2 {
                font-size: 32px;
            }

            zain-internet-Revamp .zain-internet-intro h4.intro_paragraph,
            zain-internet-Revamp .zain-internet-intro a.link-fiber-check-availablity,
            zain-internet-Revamp .zain-internet-packages-cards-item p,
            zain-internet-Revamp .zain-internet-smartwiFi-app p,
            zain-internet-Revamp .zain-internet-smartwifi-videos-container h4,
            zain-internet-Revamp .zain-internet-smartwifi-faq-container ul li {
                font-size: 16px;
            }

        zain-internet-Revamp .zain-internet-packages,
        zain-internet-Revamp .zain-internet-best-choice,
        zain-internet-Revamp .zain-internet-wifi-features {
            margin-top: 56px;
        }

            zain-internet-Revamp .zain-internet-packages h2.packages-container-title {
                font-size: 24px;
                padding: 32px 0;
            }

            zain-internet-Revamp .zain-internet-packages .zain-internet-package-card {
                width: 310px;
            }

            zain-internet-Revamp .zain-internet-wifi-features .order-1,
            zain-internet-Revamp .zain-internet-packages-cards-item .column-50:last-child {
                order: 1;
            }

            zain-internet-Revamp .zain-internet-wifi-features .order-2,
            zain-internet-Revamp .zain-internet-packages-cards-item .column-50:first-child {
                order: 2;
            }

            zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row,
            zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row .row-flex {
                gap: 8px;
            }

            zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row {
                margin-bottom: 8px;
            }

            zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-item-card.image-container {
                padding: 40px 24px;
                text-align: center;
            }

            zain-internet-Revamp .zain-internet-wifi-features .zain-internet-wifi-features-row .btn.btn-white {
                margin-top: 24px;
            }

        zain-internet-Revamp .zain-internet-check-availablity-banner {
            margin-top: 80px;
        }

        zain-internet-Revamp .zain-internet-check-availablity-banner {
            padding: 48px 40px;
        }

        zain-internet-Revamp .zain-internet-info-card {
            padding: 24px;
        }

        zain-internet-Revamp .zain-internet-packages-cards-item h2 {
            font-size: 21px;
            margin-bottom: 16px;
        }

        zain-internet-Revamp .zain-internet-packages-cards {
            margin: 0;
        }

        zain-internet-Revamp .zain-internet-packages-cards-item {
            gap: 24px;
        }

        zain-internet-Revamp .tab_SmartWIFI .zain-internet-package-card {
            min-width: 144px;
            width: 144px;
        }

        zain-internet-Revamp .zain-internet-smartwiFi-app .zain-internet-info-row,
        zain-internet-Revamp .zain-internet-smartwifi-faq h2 {
            text-align: center;
        }

        zain-internet-Revamp .zain-internet-smartwiFi-app img {
            width: 162px;
        }

        zain-internet-Revamp .zain-internet-smartwifi-faq-container {
            margin-top: 30px;
        }

            zain-internet-Revamp .zain-internet-smartwifi-faq-container a {
                font-size: 21px !important;
            }



        zain-internet-Revamp .zain-internet-packages .zain-internet-packages-bg {
            left: -10%;
            width: 120%;
        }

        zain-internet-Revamp .zain-internet-tabs-list ul {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            row-gap: 10px;
            gap: 10px;
        }

            zain-internet-Revamp .zain-internet-tabs-list ul li a {
                margin: 0;
            }

        zain-internet-Revamp .zain-internet-smartwifi-videos-container {
            gap: 64px;
            margin-bottom: 64px;
        }

            zain-internet-Revamp .zain-internet-smartwifi-videos-container h4 {
                margin-top: 12px;
            }

        zain-internet-Revamp .zain-internet-modal.active,
        zain-internet-Revamp .zain-internet-modal.active.full {
            transform: translateY(0);
            padding-top: 50px;
        }

        zain-internet-Revamp .zain-internet-map-modal-desc,
        zain-internet-Revamp .zain-internet-map-modal-map {
            padding-left: 0;
            padding-right: 0;
        }

            zain-internet-Revamp .zain-internet-map-modal-desc h2 {
                font-size: 21px;
            }

            zain-internet-Revamp .zain-internet-map-modal-desc p,
            zain-internet-Revamp .zain-internet-map-modal-desc a.zain-internet-modal-current-location {
                font-size: 16px;
            }

            zain-internet-Revamp .zain-internet-map-modal-desc a.zain-internet-modal-current-location {
                padding: 21px 0;
            }

            zain-internet-Revamp .zain-internet-map-modal-map .btn-check-availablity-map {
                margin-top: 24px;
                width: 100% !important;
                max-width: 100%;
            }

        zain-internet-Revamp .zain-internet-modal .zain-internet-map-edit-address {
            cursor: pointer;
            margin-left: auto;
        }

        zain-internet-Revamp .zain-internet-map-modal-desc a.zain-internet-modal-current-location img {
            margin-right: 8px;
        }

        zain-internet-Revamp .zain-internet-map-modal .zain-internet-package-card-header-title,
        zain-internet-Revamp .zain-internet-map-modal .zain-internet-package-title {
            width: 100%;
        }

        zain-internet-Revamp .zain-internet-map-modal .zain-internet-package-subscription h4.border-divider {
            margin-left: auto;
        }

        zain-internet-Revamp .zain-internet-map-modal-map #google-map {
            max-height: 264px;
        }

        zain-internet-Revamp .zain-internet-map-form-contianer input.form-control,
        zain-internet-Revamp .zain-internet-map-form-contianer .btn.btn-pink {
            width: 100% !important;
            max-width: 100% !important;
        }

        zain-internet-Revamp .zain-internet-map-result-submit {
            width: calc(100% - 32px);
            margin: 0 16px;
        }

            zain-internet-Revamp .zain-internet-map-result-submit.active {
                transform: translate(calc(-50% - 16px),-50%);
            }

        zain-internet-Revamp .zain-internet-map-result-fail-container .zain-internet-map-result-fail-alert {
            margin-bottom: 32px;
        }

        zain-internet-Revamp .zain-internet-map-result-fail-container h2 {
            font-size: 24px;
            margin-bottom: 16px;
        }

        zain-internet-Revamp .zain-internet-map-result-fail-container p {
            font-size: 16px;
        }

        zain-internet-Revamp .zain-internet-map-result-fail-container .btn.btn-pink {
            margin-top: 32px;
            height: 40px;
            font-size: 14px;
            font-weight: normal;
        }


        zain-internet-Revamp .zain-internet-map-packages-contianer .zain-internet-package-card.card-promotion .zain-internet-package-title h4 {
            max-width: 140px;
        }

    #zain-internet.portal-5g-replica .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card {
        max-width: unset !important;
    }


    .section__info--container---left {
        right: unset;
        left: unset;
    }

    .section__info--container---right {
        top: 16px;
        right: unset;
        left: unset;
    }

    #zain-internet .zain-internet-visitors-banner-mobile {
        text-align: center;
    }

        #zain-internet .zain-internet-visitors-banner-mobile img {
            max-width: 280px;
            border-radius: 12px;
        }

    #zain-internet .promo-counter .promo-counter-container {
        padding: 16px 22px;
    }

        #zain-internet .promo-counter .promo-counter-container h5 {
            font-size: 20px;
        }

        #zain-internet .promo-counter .promo-counter-container .column .digit {
            font-size: 44px;
        }





    #zain-internet-Revamp .zain-internet-visitors-banner-mobile {
        text-align: center;
    }

        #zain-internet-Revamp .zain-internet-visitors-banner-mobile img {
            max-width: 280px;
            border-radius: 12px;
        }

    #zain-internet-Revamp .promo-counter .promo-counter-container {
        padding: 16px 22px;
    }

        #zain-internet-Revamp .promo-counter .promo-counter-container h5 {
            font-size: 20px;
        }

        #zain-internet-Revamp .promo-counter .promo-counter-container .column .digit {
            font-size: 44px;
        }


    .corporate-responsibility-body {
        display: block !important;
        width: 100% !important;
        margin: 0 auto;
    }

    a.corporate-responsibility-details-body {
        width: 330px !important;
        max-width: 330px !important;
        height: 190px;
        max-height: 190px;
        margin: 10px auto !important;
        display: block;
    }

    .corporate-responsibility-card-overlay {
        height: 95px !important;
    }

    img.cr-thumbnail-image {
        order: 1px solid white;
        border-radius: 7px;
        /* max-height: 150px; */
        min-width: 330px;
        overflow: hidden;
        height: 100%;
        width: 100%;
        /* height: 190px;*/
    }

    #corporate-responsibility-revamp .corporate-responsibilty-tabs-button-mobile {
        font-weight: bold;
        text-decoration: none;
    }

    #corporate-responsibility-revamp .corporate-responsibility-header {
        max-height: 330px;
        position: relative;
        overflow: hidden;
    }

    #corporate-responsibility-revamp .corporate-responsibility-header-img-mobile {
        width: 100vw;
        height: 200px !important;
        /* margin-left: -80%; */
        object-fit: cover;
    }


    #corporate-responsibility-revamp .corporate-responsibility-header-text-container {
        top: 40%;
    }

    #corporate-responsibility-revamp .corporate-responsibility-header-super {
        font-size: 20px;
        text-align: center;
    }

    #corporate-responsibility-revamp .corporate-responsibility-header-text {
        font-size: 18px;
        text-align: center;
        padding-left: 10px;
        padding-right: 10px;
    }

    #corporate-responsibility-revamp {
        padding-top: 0px;
    }

    .business-landing-preview-card, .business-landing-preview-card.big, .business-landing-preview-card:nth-child(2) {
        display: flex;
        flex-direction: column;
        background: #FFFFFF;
        box-shadow: 0px 0px 24px 2px rgba(0, 0, 0, 0.08);
        border-radius: 8px;
        margin-top: 32px;
    }

        .business-landing-preview-card .business-landing-preview-card-img, .business-landing-preview-card:nth-child(2) .business-landing-preview-card-img {
            display: block;
            text-decoration: none;
            border-radius: 8px 8px 0px 0px;
            height: 225px;
            max-height: 225px;
            width: 100%;
        }

            .business-landing-preview-card .business-landing-preview-card-img img {
                height: 100%;
                width: 100%;
            }

        .business-landing-preview-card .business-landing-preview-card-previews-container,
        .business-landing-preview-card:nth-child(2) .business-landing-preview-card-previews-container, .business-landing-preview-card.big .business-landing-preview-card-previews-container {
            border-radius: 0px 0px 8px 8px;
            background: #FFFFFF;
            display: flex;
            flex-direction: column;
            width: 100%;
        }

            .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview, .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview:nth-child(2), .business-landing-preview-card.big .business-landing-preview-card-previews-container .business-landing-preview-card-preview {
                padding: 16px;
                background: white;
                text-decoration: none;
                display: block;
                width: 100%;
            }

                .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview .business-landing-preview-card-preview-title img {
                    display: none;
                }

                .business-landing-preview-card .business-landing-preview-card-previews-container .business-landing-preview-card-preview .business-landing-preview-card-preview-title {
                    font-weight: bold;
                    font-size: 14px;
                    line-height: 20px;
                    color: black;
                    margin: 0px;
                    margin-bottom: 8px;
                }

    .business-landing-preview-card-flex-container {
        display: flex;
        gap: 25px;
        justify-content: space-between;
    }

        .business-landing-preview-card-flex-container .business-landing-preview-card-preview-description {
            font-size: 12px;
            line-height: 15px;
            height: auto;
        }

        .business-landing-preview-card-flex-container .business-landing-preview-card-preview-title-more-info img {
            width: 30px;
            height: 30px;
        }


    .business-landing-preview-card.big .business-landing-preview-card-previews-container .business-landing-preview-card-preview:nth-child(1) {
        border-right: unset;
    }

    .business-category-landing-title-container {
        margin-top: 30px;
        margin-bottom: 20px;
        text-align: center;
    }

        .business-category-landing-title-container h3 {
            font-weight: bold;
            font-size: 24px;
            line-height: 33px;
        }

    .business-category-categories-container {
        display: block !important;
        width: 100% !important;
        margin: 0 auto;
    }

        .business-category-categories-container .business-subcategory-card {
            width: 330px !important;
            max-width: 330px !important;
            /* height: 190px; */
            /* max-height: 190px; */
            margin: 10px auto !important;
            display: block;
            height: 300px;
        }

    img.business-subcategory-thumbnail-image {
        order: 1px solid white;
        border-radius: 7px;
        /* max-height: 150px; */
        min-width: 330px;
        overflow: hidden;
        height: 100%;
        width: 100%;
        /* height: 190px;*/
    }


    #service-codes-revamp .service-codes-title {
        margin-bottom: 20px;
    }

        #service-codes-revamp .service-codes-title h3 {
            margin-bottom: 0px;
            font-size: 30px;
            font-weight: bold;
            line-height: 48px;
            color: black;
        }

    #service-codes-revamp .service-code {
        border: 1px solid #E1E1E1;
        border-radius: 4px;
        display: block;
        margin-bottom: 13px;
        width: 100%;
    }

        #service-codes-revamp .service-code .service-code-description, #service-codes-revamp .service-code .service-code-code {
            padding: 14px;
            width: 100%;
            border-bottom: 0.5px solid #E1E1E1;
            border-right: 0px;
        }

            #service-codes-revamp .service-code .service-code-description p {
                font-size: 14px;
                font-weight: bold;
                line-height: 16px;
            }

            #service-codes-revamp .service-code .service-code-code p {
                font-size: 14px;
                line-height: 16px;
            }

        #service-codes-revamp .service-code .service-code-link-container {
            text-decoration: none;
            display: flex;
            justify-content: center;
            width: 100%;
            background-color: #F8F8F8;
            color: #37ACE5;
        }

            #service-codes-revamp .service-code .service-code-link-container p {
                font-weight: 700;
                font-size: 13px;
                line-height: 12px;
            }

    #login-and-registration .lr-mobile-flex-layout-container {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        /* height: 100%; */
        height: 80vh;
    }


    #portal-5g {
        margin-top: 60px;
    }

    .portal-5g-slideshow {
        padding: 40px;
    }

    #portal-5g .portal-5g-slideshow-slide {
        height: calc(100vh - 60px);
        height: calc(100dvh - 60px);
    }

    #portal-5g .portal-5g-benefits .portal-5g-benefits-container .portal-5g-benefit-card {
        max-width: unset;
    }

    #portal-5g .portal-5g-benefits .portal-5g-benefits-title-container h2 {
        font-size: 24px;
    }

    #portal-5g .portal-5g-packages-button-toggle-container {
        width: 100%;
        margin-bottom: 30px;
    }

        #portal-5g .portal-5g-packages-button-toggle-container .btn-switch-tab-packages {
            width: 50%;
        }

    #portal-5g .portal-5g-faqs-container {
        padding: 25px;
    }

        #portal-5g .portal-5g-faqs-container h2 {
            font-size: 25px;
        }

    .portal-5g-subpage .portal-5g-modal.active,
    .portal-5g-subpage .portal-5g-modal.active.full {
        transform: translateY(0);
        padding-top: 50px;
    }

    .portal-5g-subpage .portal-5g-map-modal-desc,
    .portal-5g-subpage .portal-5g-map-modal-map {
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

        .portal-5g-subpage .portal-5g-map-modal-desc h2 {
            font-size: 21px;
        }

        .portal-5g-subpage .portal-5g-map-modal-desc p,
        .portal-5g-subpage .portal-5g-map-modal-desc a.portal-5g-modal-current-location {
            font-size: 16px;
        }

        .portal-5g-subpage .portal-5g-map-modal-desc a.portal-5g-modal-current-location {
            padding: 21px 0;
        }

        .portal-5g-subpage .portal-5g-map-modal-map .btn-check-availablity-map {
            margin-top: 24px;
            width: 100% !important;
            max-width: 100%;
        }

    .portal-5g-subpage .portal-5g-modal .portal-5g-map-edit-address {
        cursor: pointer;
        margin-left: auto;
    }

    .portal-5g-subpage .portal-5g-map-modal-desc a.portal-5g-modal-current-location img {
        margin-right: 8px;
    }

    .portal-5g-subpage .portal-5g-map-modal .portal-5g-package-card-header-title,
    .portal-5g-subpage .portal-5g-map-modal .portal-5g-package-title {
        width: 100%;
    }

    .portal-5g-subpage .portal-5g-map-modal .portal-5g-package-subscription h4.border-divider {
        margin-left: auto;
    }

    .portal-5g-subpage .portal-5g-map-modal-map #google-map {
        max-height: 264px;
    }

    .portal-5g-subpage .portal-5g-map-form-contianer input.form-control,
    .portal-5g-subpage .portal-5g-map-form-contianer .btn.btn-pink {
        width: 100% !important;
        max-width: 100% !important;
    }

    .portal-5g-subpage .portal-5g-map-result-submit {
        width: calc(100% - 32px);
        margin: 0 16px;
    }

        .portal-5g-subpage .portal-5g-map-result-submit.active {
            transform: translate(calc(-50% - 16px),-50%);
        }

    .portal-5g-subpage .portal-5g-map-result-fail-container .portal-5g-map-result-fail-alert {
        padding: 16px;
        margin-bottom: 20px;
    }

        .portal-5g-subpage .portal-5g-map-result-fail-container .portal-5g-map-result-fail-alert img {
            width: 50px;
            height: 50px;
            display: inline-block;
            align-self: center;
        }

    .portal-5g-subpage .portal-5g-map-result-fail-container h2 {
        font-size: 24px;
        margin-bottom: 16px;
    }

    .portal-5g-subpage .portal-5g-map-result-fail-container p {
        font-size: 16px;
    }

    .portal-5g-subpage .portal-5g-not-available-links {
        margin-top: 32px;
        flex-wrap: wrap;
    }

    .portal-5g-subpage .portal-5g-map-result-fail-container .btn.btn-pink {
        height: 40px;
        font-size: 14px;
        font-weight: normal;
        flex-grow: 1;
    }


    .portal-5g-subpage .portal-5g-map-packages-contianer .portal-5g-package-card.card-promotion .portal-5g-package-title h4 {
        max-width: 140px;
    }

    .portal-5g-subpage .portal-5g-selected-package-addons-outdoor-container .portal-5g-selected-package-addons,
    .portal-5g-subpage .portal-5g-selected-package-addons-outdoor-container .portal-5g-outdoor-card {
        width: 100%;
        padding: 20px;
    }

    .portal-5g-subpage .portal-5g-selected-package-cart-container {
        padding: 20px;
    }

    .portal-5g-subpage .portal-5g-personal-info-form-container div {
        flex: unset;
        width: 100%;
    }

    .portal-5g-subpage .portal-5g-selected-package-details div {
        width: 100%;
    }

    .portal-5g-subpage .portal-5g-packages-slider-broadband {
        justify-content: unset;
    }

    .portal-5g-subpage .portal-5g-package-card {
        margin-left: auto;
        margin-right: auto;
    }

    #portal-5g .intro-to-5g .intro-to-5g-text {
        max-width: unset;
    }

    #portal-5g .intro-to-5g .intro-to-5g-logo {
        display: none;
    }

    .portal-5g-subpage .portal-5g-terms-and-conditions {
        max-width: unset;
    }

    .portal-5g-subpage .add-outdoor-card {
        min-width: unset !important;
        width: auto;
        white-space: normal;
        height: auto;
    }

    #portal-5g .portal-5g-slideshow-static-text {
        top: 70px;
        font-weight: bold;
    }

    #portal-5g .intro-to-5g .intro-to-5g-text h2 {
        font-size: 30px;
    }

    #portal-5g .portal-5g-link {
        width: 100%;
    }

    #zain-internet.portal-5g-replica .zain-internet-best-choice .zain-internet-best-choice-items .zain-internet-best-choice-item-card {
        max-width: unset !important;
    }

    #zain-internet .zain-internet-fttr-intro {
        width: 100%;
    }


    #zain-internet .zain-internet-fttr-benefits .zain-internet-fttr-benefits-card-container .zain-internet-fttr-benefits-card {
        width: 100%;
    }

    #zain-internet .zain-internet-fttr-ad-image {
        display: none;
    }

    #zain-internet .zain-internet-fttr-ad-card {
        width: 100% !important;
        padding: 22px !important;
    }


    #tod_bundling .entertainment {
        margin-top: 7px;
        font-size: 12px;
        font-weight: 800;
    }

    #tod_bundling .left-center {
        font-size: 22px;
        margin-top: 0;
        margin-left: 0;
        text-align: center;
    }

    #tod_bundling {
        padding-top: 20px;
    }

        #tod_bundling .tod-logo {
            max-width: 90px;
            margin-top: auto;
            margin-bottom: 10px;
            align-self: center;
        }

        #tod_bundling .btn-subscribeNow {
            margin-top: 0;
            margin-left: 0;
            align-self: center;
            font-size: 22px;
            height: auto;
        }

        #tod_bundling .main-header-text {
            padding-bottom: 0;
            padding-top: 0;
            padding-left: 0;
        }

        #tod_bundling .flex-main-header {
            display: flex;
            justify-content: center;
            min-height: 50vh;
            gap: 40px;
            flex-wrap: wrap-reverse;
        }


        #tod_bundling .download-tod-img {
            max-width: 267px;
        }

        #tod_bundling .mw-125 {
            width: 100%;
            max-width: 108px;
        }

        #tod_bundling .zain-internet-packages h2.packages-container-title {
            font-size: 25px;
        }

        #tod_bundling .btn-subscribeNow {
            width: 230px;
            margin-bottom: 30px;
        }

    .qp-image-container {
        display: none;
    }

    #qp-revamp-container .qp-header p {
        font-size: 24px;
    }

    #qp-revamp-container .qp-header {
        gap: 12px;
    }

    #qp-revamp-container .qp-header-customer-data {
        flex-wrap: wrap;
        justify-content: start;
        text-align: center;
    }

    #qp-revamp-container .qp-tabs-switching-container {
        gap: 10px;
    }

        #qp-revamp-container .qp-tabs-switching-container div {
            flex-grow: 1;
        }

            #qp-revamp-container .qp-tabs-switching-container div .btn-qp-change-tab {
                padding: 10px;
            }

    #qp-revamp-container .invalid-input {
        border: 1px solid #b10000;
        animation: lr-shake 0.2s ease-in-out 0s 2;
    }

    #qp-revamp-container .qp-paynow-button {
        width: 100%;
        background: #55B9E8;
        max-width: unset !important;
    }

    #qp-revamp-container .qp-main-tabs-container {
        padding: 15px;
    }

    #qp-revamp-container .btn-payment-method-selection {
        flex-grow: 1;
        width: 100%;
    }

    #qp-revamp-container .qp-prepaid-vouchers-container {
        max-width: 300px;
        width: 100%;
    }

        #qp-revamp-container .qp-prepaid-vouchers-container .btn-payment-method-selection {
            margin-left: 0px !important;
            min-width: 100%;
        }
}





@media (min-width: 768px) and (max-width: 991) {

    .text-center-sm {
        text-align: center;
    }

    .bunker-video iframe {
        width: 585px;
        height: 330px;
    }



    #tod_bundling .download-tod-img {
        max-width: 267px;
    }

    #tod_bundling .mw-125 {
        width: 100%;
        max-width: 108px;
    }

    #tod_bundling .tod-logo {
        max-width: 140px;
        margin-top: 25px;
        margin-bottom: 10px;
        align-self: center;
    }

    #tod_bundling .zain-internet-packages h2.packages-container-title {
        font-size: 25px;
    }

    #tod_bundling {
        padding-top: 0;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .text-center-md {
        text-align: center;
    }

    #tod_bundling {
        padding-top: 0;
    }
}

@media (min-width: 992px) {

    .preview-card-lg {
        height: 550px;
    }

    .landing-preview-card .preview-card-lg:nth-child(1) {
        height: 300px;
    }

    .landing-preview-card .preview-card-lg:nth-child(2) {
        height: 250px;
        padding: 35px;
    }

    .preview-card-lg .business-preview-divider {
        position: relative;
        height: 100%;
    }

        .preview-card-lg .business-preview-divider::after {
            content: '';
            width: 1px;
            top: 50%;
            left: 50%;
            height: 100%;
            background-color: #ccc;
            border-radius: 1px;
            position: absolute;
            transform: translate(-50%,-50%);
        }

    .bunker-video iframe {
        width: 800px;
        height: 450px;
    }

    .bunker-landing-main h1 {
        font-size: 55px;
    }

    .business-dots-white-sm {
        min-height: 200px;
    }

    #modal_my_invoices .modal-dialog {
        top: 50%;
        left: 50%;
        margin: 0;
        transform: translate(-50%,-50%);
    }
}

@media (min-width: 1200px) {
    .text-center-lg {
        text-align: center;
    }

    ste .bunker-video iframe {
        width: 1066px;
        height: 600px;
    }

    .business-main-menu-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    }
}


@media (max-height: 700px) {
    .portal-5g-logo {
        width: 200px;
        height: 200px;
    }
}