﻿.swiper-slide .eventDateDay, .swiper-slide .eventTo {
    font-size: 21px !important;
    font-weight: 700 !important
}

.innerpages .swiper-slide:hover, body .gawdaSlider .swiper-slide .item .nav-link.active:hover {
    border-bottom: 3px solid #161616 !important
}

body .gawdaSlider .swiper-slide .item .nav-link.active {
    background-color: #fff !important;
    text-align: center;
    color: #161616 !important;
    border-bottom: 3px solid #3ca078 !important;
    border-radius: 0
}
.innerpages #cardSliderST a .image-div {
    margin-bottom: 5px;
}
.innerpages #cardSliderST span.SectotsNav-TitleTxt {
    font-size: 14px;
}
.eventDate {
    display: flex;
    justify-content: space-between;
    margin: 20px 100px 50px
}

.eventDateDay {
    background-color: #1b8354;
    text-align: center;
    color: #fff !important;
    font-size: 16px;
    height: 60px;
    width: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 100px
}

.gawdaSlider, .list-prods {
    background-color: #f5f7fa
}

    .gawdaSlider .swiper-button-next::after, .gawdaSlider .swiper-button-prev::after, .innerMainslider .swiper-button-next::after, .innerMainslider .swiper-button-prev::after, .performance-sign .top-div .sort .select2-container--default .select2-selection--single .select2-selection__arrow b, .swiper-slide .image-div, .tabsSliderNew .swiper-button-next::after, .tabsSliderNew .swiper-button-prev::after, .x-btn {
        display: none
    }

.swiper-slide .eventTo {
    margin-top: 12px;
    padding-left: 15px;
    padding-right: 15px;
}

.innerpages .swiper-slide {
    border-bottom: 0 solid #161616 !important;
    border-radius: 0
}

    .innerpages .swiper-slide:hover {
        border-radius: 0
    }

.header-wrapper.home-header {
    border-bottom: 2px solid #0096b6;
    box-shadow: 0 15px 45px rgb(0 42 51 / 10%)
}

#tabsSliderNewId .swiper-slide {
    border: 0 solid #d2d6db !important
}

.inner-main-header h2 {
    font-size: 35px;
    font-family: fontBold;
    margin-top: 60px;
    margin-bottom: 62px;
    text-align: center;
    position: relative
}

    .inner-main-header h2::before {
        content: "";
        position: absolute;
        right: 46%;
        top: 0;
        width: 233px;
        height: 110px;
        background-image: url("../../../ar-sa/styles/images/quality/title-bg.svg");
        background-repeat: no-repeat;
        background-size: contain;
        z-index: -1;
        animation: 7s linear infinite titleMove
    }

@keyframes titleMove {
    0%,100% {
        transform: translateX(0)
    }

    50% {
        transform: translateX(100px)
    }
}

.innerMainslider .swiper-button-next, .innerMainslider .swiper-button-prev {
    display: none;
    border-radius: 50%;
    background-color: #fff;
    width: 38px;
    height: 38px;
    background-size: auto;
    background-position: center;
    filter: drop-shadow(0px 5px 25px rgb(0 0 0 / 10%));
    margin-top: 0;
    background-repeat: no-repeat
}

.innerMainslider .swiper-button-prev {
    background-image: url("../../../ar-sa/images/New/right-arrow.svg");
    right: 148px
}

.innerMainslider .swiper-button-next {
    background-image: url("../../../ar-sa/images/New/left-arrow.svg");
    left: 148px
}

.innerMainslider-container {
    width: 100%;
    height: 100%
}

.innerMainslider-wrapper {
    height: 100%
}

.innerMainslider {
    height: 570px !important
}

    .innerMainslider .silder-item {
        height: 100%;
        position: sticky
    }

        .innerMainslider .silder-item .slider-img {
            height: 100%;
            position: relative
        }

            .innerMainslider .silder-item .slider-img::after {
                content: "";
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                background: #002a33;
                background: linear-gradient(90deg,#002a33 15%,rgba(0,42,51,.227328431372549) 100%)
            }

            .innerMainslider .silder-item .slider-img img {
                height: 100%;
                width: 100%;
                object-fit: cover
            }

        .innerMainslider .silder-item .slider-caption {
            max-width: 35%;
            position: absolute;
            right: 50%;
            top: 20%;
            transform: translateX(50%)
        }

            .innerMainslider .silder-item .slider-caption h3 {
                color: #fff !important;
                font-size: 30px;
                font-family: fontBold;
                margin-bottom: 24px;
                text-align: center
            }

            .innerMainslider .silder-item .slider-caption p {
                color: #fff !important;
                font-size: 20px;
                margin-bottom: 44px;
                padding: 0;
                text-align: center
            }

            .innerMainslider .silder-item .slider-caption .inner-slider-btns {
                text-align: center
            }

                .innerMainslider .silder-item .slider-caption .inner-slider-btns a.more {
                    display: inline-block;
                    background-color: #0096b6;
                    color: #fff;
                    font-size: 16px;
                    padding: 13px 24px;
                    border-radius: 25px;
                    transition: .5s
                }

                .innerMainslider .silder-item .slider-caption .inner-slider-btns span {
                    color: #fff;
                    font-size: 16px;
                    margin-left: 15px;
                    margin-right: 15px
                }

                .innerMainslider .silder-item .slider-caption .inner-slider-btns a.vid {
                    display: inline-block;
                    background-color: transparent;
                    color: #fff;
                    font-size: 16px;
                    padding: 13px 0
                }

                    .innerMainslider .silder-item .slider-caption .inner-slider-btns a.vid img {
                        margin-right: 5px;
                        vertical-align: middle
                    }

    .innerMainslider .swiper-pagination {
        bottom: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 99999
    }

    .innerMainslider .swiper-pagination-bullet {
        background: #5a676a
    }

    .innerMainslider .swiper-pagination-bullet-active {
        width: 14px;
        height: 14px;
        background: #0096b6
    }

.performance-sign .top-div {
    margin-top: 60px;
    margin-bottom: 30px
}

.gawdaSlider .swiper-button-next, .gawdaSlider .swiper-button-prev, .tabsSliderNew .swiper-button-next, .tabsSliderNew .swiper-button-prev {
    width: 40px;
    background-size: auto;
    background-position: center;
    filter: drop-shadow(0px 8px 16px rgb(0 0 0 / 16%));
    margin-top: 0;
    background-color: #fff;
    background-repeat: no-repeat
}

.performance-sign .top-div h3 {
    font-size: 24px;
    font-family: fontBold;
    color: #58595b !important
}

.performance-sign .top-div .sort .form-inline {
    justify-content: flex-end
}

.performance-sign .top-div .sort label {
    font-size: 17px;
    color: #0096b6;
    margin-inline-end: 6px
}

.performance-sign .top-div .sort select.form-control + .select2-container {
    max-width: 120px
}

.performance-sign .top-div .sort .select2-container--default .select2-selection--single {
    border: 1px solid #c7c9cb;
    border-radius: 20px;
    height: 42px !important;
    padding: 8px 15px
}

    .performance-sign .top-div .sort .select2-container--default .select2-selection--single .select2-selection__rendered {
        font-size: 16px;
        color: #58595b
    }

    .performance-sign .top-div .sort .select2-container--default .select2-selection--single .select2-selection__arrow {
        background-image: url("../../../ar-sa/styles/images/quality/arrow-down-linear.svg");
        width: 18px;
        height: 18px;
        left: 16px;
        top: 13px
    }

.gawdaSlider {
    border-radius: 16px;
    padding: 28px 24px
}

    .gawdaSlider .swiper-slide .item .nav-link {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        width: 204px;
        height: 73px;
        background-color: #fff;
        border-radius: 16px
    }

        .gawdaSlider .swiper-slide .item .nav-link img {
            max-width: 24px;
            max-height: 24px;
            margin-inline-end: 15px
        }

        .gawdaSlider .swiper-slide .item .nav-link h4 {
            font-size: 16px;
            font-family: fontReg;
            color: #161616 !important
        }

        .gawdaSlider .swiper-slide .item .nav-link.active {
            background-color: #0096b6
        }

            .gawdaSlider .swiper-slide .item .nav-link.active img {
                filter: brightness(3)
            }

            .gawdaSlider .swiper-slide .item .nav-link.active h4 {
                color: #161616 !important;
                font-family: fontBold
            }

    .gawdaSlider .swiper-button-next, .gawdaSlider .swiper-button-prev {
        border-radius: 50%;
        height: 40px;
        top: 35%
    }

    .gawdaSlider .swiper-button-prev, .tabsSliderNew .swiper-button-prev {
        background-image: url("../../../ar-sa/styles/images/quality/arrow-circle-right.svg");
        right: -25px;
        left: auto
    }

    .gawdaSlider .swiper-button-next, .tabsSliderNew .swiper-button-next {
        background-image: url("../../../ar-sa/styles/images/quality/arrow-circle-left.svg");
        left: -25px;
        right: auto
    }

        .gawdaSlider .swiper-button-next:focus, .gawdaSlider .swiper-button-prev:focus, .tabsSliderNew .swiper-button-next:focus, .tabsSliderNew .swiper-button-prev:focus {
            outline: 0 !important
        }

.gawda-tab-content {
    margin-top: 48px
}

    .gawda-tab-content .gawda-item {
        height: 329px;
        margin-bottom: 30px;
        border: 1px solid #d2d6db;
        border-radius: 8px;
        padding: 24px 18px
    }

        .gawda-tab-content .gawda-item .img-box img {
            max-width: 100%;
            max-height: 100%
        }

.tabsSliderNew .swiper-container {
    padding: 0 12px
}

.tabsSliderNew .swiper-button-next, .tabsSliderNew .swiper-button-prev {
    border-radius: 50%;
    height: 40px;
    top: 45%
}

.tabsSliderNew .swiper-slide a.nav-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
    box-shadow: 0 6px 12px rgb(0 0 0 / 10%);
    margin-top: 20px;
    margin-bottom: 0;
    padding-left: 50px;
    padding-right: 50px
}

    .tabsSliderNew .swiper-slide a.nav-link img {
        width: 44px;
        height: 42px;
        margin-bottom: 12px
    }

    .tabsSliderNew .swiper-slide a.nav-link .SectotsNav-TitleTxt {
        font-size: 18px;
        color: #58595b;
        text-align: center
    }

.swiper-slide .active .SectotsNav-TitleTxt {
    color: #fff !important
}

body .quality-cards-list .quality-card .number {
    color: #1b8354 !important;
    margin-bottom: 5px;
    text-align: center
}

body .quality-cards-list .quality-card {
    border: 2px solid #fff !important
}

.tabsSliderNew .swiper-slide a.nav-link.active {
    background-color: #f5f7fa;
    box-shadow: none;
    padding-bottom: 30px;
    height: 214px;
    margin-bottom: 0;
    border-radius: 8px 8px 0 0
}

#qualityTabContent {
    background-color: #fff;
    background-image: url("../../../ar-sa/styles/images/quality/white-pattern.svg");
    padding: 0 158px
}

    #qualityTabContent .content-box {
        margin-top: 20px;
        margin-bottom: 48px
    }

    #qualityTabContent h3 {
        font-size: 24px;
        font-family: fontBold;
        color: #58595b;
        text-align: center
    }

    #qualityTabContent p {
        font-size: 15px;
        color: #58595b;
        text-align: center
    }

.quality-cards-list {
    margin-bottom: 48px
}

    .quality-cards-list .quality-card {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        height: 220px;
        min-height: auto;
        background-color: #fff;
        background-repeat: no-repeat;
        background-size: contain;
        filter: drop-shadow(0px 5px 35px rgb(0 42 51 / 15%));
        border-radius: 25px;
        padding: 30px;
        overflow: hidden;
        background-image: none;
        position: relative
    }

        .quality-cards-list .quality-card .img-box {
            width: 78px;
            height: 78px;
            margin-inline-end: 24px;
            margin: auto
        }

            .quality-cards-list .quality-card .img-box img {
                max-width: 100%
            }

        .quality-cards-list .quality-card .number {
            color: #0096b6;
            font-size: 40px;
            font-family: fontBold;
            margin-bottom: 17px;
            line-height: 40px
        }

        .quality-cards-list .quality-card .desc {
            font-size: 17px;
            color: #58595b
        }

.vidOverlay {
    z-index: 0
}

@media (min-width:200px) and (max-width:700px) {
.quality-cards-list .quality-card {
        max-width: 90%;
        min-height: 169px;
        margin: 0 auto 25px;
    }
    #qualityTabContent {
    background-image: url(../images/quality/white-pattern.svg);
    padding: 0 0px !important;
}
#cardSliderST .related-sites .r-sites .sites-wrapper .swiper-button-next:after, #cardSliderST .related-sites .r-sites .sites-wrapper .swiper-button-prev:after {
    padding: 6px !important;
}
}


@media (min-width:1400px) {
    .container {
        width: 1374px;
        max-width: 1374px
    }
}

@media (max-width:1399.99px) {
    .innerMainslider .silder-item .slider-caption {
        max-width: 45%;
        top: 35%
    }

        .innerMainslider .silder-item .slider-caption h3 {
            font-size: 25px
        }

        .innerMainslider .silder-item .slider-caption p {
            font-size: 16px;
            margin-bottom: 35px
        }

    #qualityTabContent {
        padding: 0 71px
    }

    .quality-cards-list .quality-card .number {
        font-size: 35px;
        margin-bottom: 12px
    }

    .tabsSlider .swiper-slide .item a.nav-link {
        padding-left: 30px;
        padding-right: 30px
    }

        .tabsSlider .swiper-slide .item a.nav-link h4 {
            font-size: 16px
        }
}

@media (max-width:1300px) {
    .quality-cards-list .quality-card {
        min-height: 182px
    }
}

@media (max-width:1199.99px) {
    .inner-main-header h2 {
        font-size: 25px;
        margin-top: 40px;
        margin-bottom: 40px
    }

        .inner-main-header h2::before {
            width: 200px;
            height: 70px;
            right: 43%
        }

    .innerMainslider .silder-item .slider-caption {
        top: 30%;
        max-width: 100%
    }

        .innerMainslider .silder-item .slider-caption h3 {
            margin-bottom: 15px;
            font-size: 23px
        }

        .innerMainslider .silder-item .slider-caption p {
            margin-bottom: 25px
        }

        .innerMainslider .silder-item .slider-caption .inner-slider-btns a {
            font-size: 14px !important
        }

    .quality-cards-list .row {
        justify-content: center
    }

    .quality-cards-list .quality-card {
        max-width: 280px;
        min-height: 169px;
        margin: 0 auto 25px
    }

        .quality-cards-list .quality-card .img-box {
            width: 65px;
            height: 65px
        }

        .quality-cards-list .quality-card .number {
            font-size: 25px
        }

        .gawdaSlider .swiper-slide .item .nav-link h4, .performance-sign .top-div .sort .select2-container--default .select2-selection--single .select2-selection__rendered, .performance-sign .top-div .sort label, .quality-cards-list .quality-card .desc {
            font-size: 14px
        }

    .performance-sign .top-div {
        margin-top: 45px;
        margin-bottom: 20px
    }

        .performance-sign .top-div h3 {
            font-size: 22px
        }

        .performance-sign .top-div .sort select.form-control + .select2-container {
            max-width: 95px
        }

        .performance-sign .top-div .sort .select2-container--default .select2-selection--single {
            height: 38px !important;
            padding: 5px 14px
        }

            .performance-sign .top-div .sort .select2-container--default .select2-selection--single .select2-selection__arrow {
                width: 14px;
                height: 14px;
                left: 16px;
                top: 13px;
                background-size: contain
            }

    .gawdaSlider {
        padding: 20px
    }

        .gawdaSlider .swiper-slide .item .nav-link {
            min-height: 55px;
            height: auto;
            width: auto
        }
}

@media (max-width:991.99px) {
    .gawda-tab-content .gawda-item .img-box {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center
    }

    #qualityTabContent {
        padding: 0 35px
    }
}

@media (max-width:767.99px) {
    .innerMainslider .swiper-pagination-bullet-active {
        width: 8px;
        height: 8px
    }

    .inner-main-header h2::before {
        width: 140px;
        height: 55px;
        right: 42%;
        top: 3px
    }
}

@media (max-width:574.99px) {
    .innerMainslider .silder-item .slider-caption {
        right: 30%;
        transform: translateX(22%);
        top: 40%
    }

        .innerMainslider .silder-item .slider-caption h3 {
            margin-bottom: 10px;
            font-size: 18px
        }

        .innerMainslider .silder-item .slider-caption p {
            font-size: 14px;
            margin-bottom: 20px
        }

        .innerMainslider .silder-item .slider-caption .inner-slider-btns a {
            font-size: 12px !important
        }

        .innerMainslider .silder-item .slider-caption .inner-slider-btns span {
            font-size: 14px;
            margin-left: 10px;
            margin-right: 10px
        }

    #qualityTabContent h3 {
        font-size: 20px
    }

    #qualityTabContent p, .tabsSlider .swiper-slide .item a.nav-link h4 {
        font-size: 14px
    }

    #qualityTabContent .content-box {
        margin-top: 25px;
        margin-bottom: 35px
    }

    .performance-sign .top-div h3 {
        font-size: 18px
    }

    .gawdaSlider .swiper-button-next, .gawdaSlider .swiper-button-prev, .tabsSlider .swiper-button-next, .tabsSlider .swiper-button-prev {
        width: 30px;
        height: 30px;
        background-size: 7px
    }

    .gawdaSlider .swiper-button-prev, .tabsSlider .swiper-button-prev {
        right: -7px
    }

    .gawdaSlider .swiper-button-next, .tabsSlider .swiper-button-next {
        left: -7px
    }

    .tabsSlider .swiper-slide .item a.nav-link {
        height: 165px
    }

        .tabsSlider .swiper-slide .item a.nav-link.active {
            padding-bottom: 15px;
            height: 180px
        }

    .gawda-tab-content {
        margin-top: 30px
    }

        .gawda-tab-content .gawda-item {
            height: 125px;
            padding: 12px 18px
        }
}

.modal .modal-large {
    max-width: 1140px
}

.modal-large .modal-header {
    margin-bottom: 0;
    border: 0;
    justify-content: space-between;
    min-height: 30px
}

.modal-large .modal-body {
    padding: 10px 115px 45px
}

    .modal-large .modal-body h3 {
        font-size: 30px;
        font-weight: 600;
        color: #0096b6 !important;
        text-align: center;
        margin-bottom: 40px
    }

.quality-popup .popup-details .main-img-box {
    border-radius: 16px;
    overflow: hidden;
    margin: 0 auto 24px
}

    .quality-popup .popup-details .main-img-box img {
        width: 100%;
        height: 100%;
        object-fit: cover
    }

.brand-dates .brand-name {
    max-width: 200px
}

.brand-dates {
    margin-bottom: 40px
}

    .brand-dates .content-container {
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: center;
        height: 100%
    }

        .brand-dates .content-container .date {
            display: flex;
            flex-direction: revert;
            align-items: center;
            justify-content: center
        }

            .brand-dates .content-container .date .img-box {
                flex: 0 0 50px;
                width: 50px;
                height: 50px;
                background-color: #f2f4f7;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-inline-end: 15px
            }

                .brand-dates .content-container .date .img-box img {
                    width: 30px;
                    height: 30px
                }

            .brand-dates .content-container .date .content-box h5 {
                font-size: 16px;
                font-weight: 700;
                color: #002a33;
                margin: 0 auto 5px
            }

            .brand-dates .content-container .date .content-box p {
                font-size: 16px;
                color: #58595b;
                margin: 0 auto;
                padding: 0
            }

        .brand-dates .content-container .date-two {
            margin-inline-start: 22px
        }

.list-prods {
    padding: 24px 24px 48px;
    border-radius: 8px;
    overflow: hidden
}

.modal-large .modal-body h3.prods-h {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #002a33 !important;
    margin: 0 auto 12px;
    text-align: start
}

.list-prods .prod-card {
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 30px
}

    .list-prods .prod-card .img-box {
        width: 100%;
        height: 100%;
        position: relative
    }

        .list-prods .prod-card .img-box span.elzamy {
            color: #0096b6;
            position: absolute;
            top: 12px;
            margin-inline-start: 12px
        }

            .list-prods .prod-card .img-box span.elzamy img {
                margin-inline-end: 3px;
                vertical-align: text-bottom;
                width: 55px;
                height: 55px;
                position: absolute;
                left: -9px;
                top: -9px
            }

    .list-prods .prod-card .content-box {
        background-color: #ebebeb;
        padding: 12px
    }

        .list-prods .prod-card .content-box h4 {
            font-size: 18px;
            font-weight: 700;
            color: #58595b !important;
            line-height: 24px;
            height: calc(24px*2);
            margin: 0;
            overflow: hidden
        }

@media (max-width:991.98px) {
    .modal-large .modal-body {
        padding: 10px 40px 45px
    }
}

.gawdaSlider, .tabsSliderNew {
    position: relative;
    margin-top: 48px;
    height: auto !important
}

.x-btn {
    width: 90px;
    height: 90px;
    left: 10%;
    top: 0;
    position: absolute;
    z-index: 99999999999
}

.silder-item .x-btn.show {
    display: block
}

.ms-webpart-zone, body .quality-content .ms-rtestate-field {
    background-color: #fff !important;
    display: block !important;
    padding: 20px
}

.nav-pager .pagination span {
    background: #f5f7fa !important
}

body .quality-content .ms-rtestate-field > p:first-of-type {
    margin-top: 0 !important
}

.card-body li, .innerpages #ctl00_PlaceHolderMain_ctl02__ControlWrapper_RichHtmlField span {
    color: #666 !important
}

.innerpages #ctl00_PlaceHolderMain_ctl02__ControlWrapper_RichHtmlField .card-header span {
    color: #0091b4 !important
}

.quality-cards-list .quality-card::before {
    content: "";
    position: absolute;
    width: 180px;
    height: 500px;
    background-color: #fff;
    z-index: -1;
    transform: rotate(-45deg);
    background-image: none;
    transition: 1s
}

.quality-cards-list .quality-card::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    border: 4px solid #0096b6;
    border-radius: 25px;
    z-index: -2
}

.quality-cards-list .quality-card:hover::before {
    animation: 1.5s linear forwards movee;
    transition: 1s
}

@keyframes movee {
    0% {
        transform: rotate(0) scale(1)
    }

    100% {
        transform: rotate(-220deg) scale(.57)
    }
}

.content-container .footer-social {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}

    .content-container .footer-social a {
        display: block;
        margin: 0 15px;
        filter: grayscale(1);
        transition: .5s
    }

        .content-container .footer-social a:hover {
            filter: none
        }

.list-prods .prod-card .img-box .EndDateCls {
    position: absolute;
    right: 10px !important;
    left: auto !important;
    width: max-content !important;
    top: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(4px)
}

    .list-prods .prod-card .img-box .EndDateCls span, .list-prods .prod-card .img-box .EndDateCls span label {
        font-size: 12px;
        color: #529c44;
        line-height: 20px
    }

        .list-prods .prod-card .img-box .EndDateCls span:first-child {
            color: #0096b6
        }

.list-prods .prod-card .img-box span.elzamy {
    width: 38px;
    height: 50px;
    margin-inline-start: 20px;
    margin-top: 5px;
    font-size: 10px;
    line-height: 17px;
    text-align: center
}

.ms-rtestate-field ul li:before {
    float: left;
    padding-top: 8px
}
