#rawafed-custom-container .img-full-width{
    max-width:100%;
    height:auto;
}
#rawafed-custom-container .default-block-padding{
    padding-block: 40px;
}
#rawafed-custom-container .bg-air{
    background:#f3f3f1;
}
#rawafed-custom-container .text-grey {
    color: #000;
    opacity: 0.7;
}
#rawafed-custom-container .text-pink {
    color: #ff375e;
}
#rawafed-custom-container .text-purple {
    color: #4f008c;
}
#rawafed-custom-container .width-100{
    max-width: 100%;
}
#rawafed-custom-container .section-header-padding {
    padding-inline-end: 40px;
}
#rawafed-custom-container .default-heading-spacing{
    margin-bottom:2rem;
}
#rawafed-custom-container .accordion__head-text + p{
    line-height: 2;
    max-width: 70%;
}
#rawafed-custom-container .rawafed-page-header h3 {
    font-size: 2rem;
    max-width: 50%;
    line-height: 1.5;
}
#rawafed-custom-container .r-cards {
    background: #fff;
    padding: 1.25rem;
    height: 100%;
    border: solid 1px #ced2d5;
    transition:all ease-in-out 300ms;
    border-radius: 2px;
    position:relative;
}
#rawafed-custom-container .r-cards:hover {
    background: #4f008c;
    border-color: #4f008c;
}
#rawafed-custom-container .r-cards:hover  *:not(.rawafed-plus) {
    color:#fff !important;
}
#rawafed-custom-container .r-cards .r-card-img {
    margin-bottom: 20px;
    text-align: center;
}
#rawafed-custom-container .r-cards .r-card-img img{
    width: 90px;
    margin-bottom: 20px;
}
#rawafed-custom-container .r-cards:hover .r-card-img img{
    filter: brightness(0) invert(1);
}
#rawafed-custom-container .r-card-heading {
    min-height: 230px;
}

#rawafed-custom-container .rawafed-arrow-up-down {
    margin-block: 20px;
}

#rawafed-custom-container .r-card-content {
    flex: 1;
}
#rawafed-custom-container .r-card-footer {
    min-height: 170px;
}

#rawafed-custom-container .rawafed-plus {
    position: absolute;
    bottom: 78px;
    inset-inline-start: -24px;
    color: #ff375e;
    font-size: 25px;
    font-weight: 600;
}

#rawafed-custom-container .r-sub-description {
    border-bottom: solid 1px #ced2d5;
    padding-bottom: 10px;
    min-height: 90px;
}
#rawafed-custom-container .default-h-spacing {
    gap: 30px;
}
#rawafed-custom-container .no-left-margin{
    margin-inline-start:0;
}
#rawafed-custom-container .testimonial-text {
    font-size: 24px;
}
#rawafed-custom-container .testimonial-user {
    font-size: 18px;
}

#rawafed-custom-container .rawafed-arrow-up-down img {
    max-height: 36px;
}
#rawafed-custom-container .percentage-bottom-label {
    background: #f4f5f5;
    color: #ff375e;
    text-align: center;
    padding: 16px;
    font-weight: 600;
    position: absolute;
    bottom: 78px;
    width: 100%;
    max-width: 360px;
}
#rawafed-custom-container .initiative-cards .r-cards {
    padding: 0 0 20px;
}

#rawafed-custom-container .initiative-cards .r-card-img img {
    max-width: 100%;
    width: 100%;
    margin-bottom: 10px;
    filter: none !important;
}
#rawafed-custom-container .initiative-cards .r-cards :is(.r-card-content, .r-content-footer) {
    padding-inline:20px;
}
#rawafed-custom-container .initiative-cards .r-cards .r-card-content .r-card-heading{
    min-height: unset;
    margin-bottom: 20px;
}
#rawafed-custom-container .initiative-cards .r-cards .r-card-footer{
    min-height: unset;
    display: flex;
    padding-inline: 20px;
    justify-content: flex-end;
}

#rawafed-custom-container .initiative-cards .r-cards .r-card-content .r-card-heading h3 {
    font-size: 24px;
    color: #000;
    display: flex;
    gap: 8px;
}

#rawafed-custom-container .initiative-cards .r-cards .r-card-content .r-card-heading h3 > span:first-child {
    opacity: 1;
}

#rawafed-custom-container .initiative-cards .r-cards .r-card-content .r-card-heading h3 >span {
    opacity: 0.4;
}
#rawafed-custom-container .initiative-cards .r-cards .r-card-footer .expandList-btn-animation {
    position: relative;
    inset: 0;
}
#rawafed-custom-container .custom-accordion-padding{
    padding-inline-end:6% !important;
    padding-bottom: 90px;
}

html[dir=rtl] #rawafed-custom-container .expandList-comp-drop-down {
                  float: left;
}

#rawafed-custom-container .data-expandList-button{
    margin-top: 15px;
    width: 125px;
    padding: 1px 1px 1px 1px;
    border: 2px solid #FF375E;
    border-radius: 2px;
    background: #FF375E;
    color: #F3F3F1 !important;
}

#rawafed-custom-container .expandList-comp-drop-down{
    float: right;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 4px;
    padding-bottom: 2px;
    margin-top: -27px;
}


/* Mobile classes */
@media all and (max-width:992px){
    #rawafed-custom-container .percentage-bottom-label {
        position: relative;
        bottom: 0px;
        margin-bottom: 40px;
        max-width: unset;
    }

    #rawafed-custom-container .section-header-padding {
        padding-inline-end: 0;
    }

    #rawafed-custom-container .accordion__head-text + p {
        max-width: unset;
    }

    #rawafed-custom-container .rawafed-page-header h3 {
        max-width: unset;
    }

    #rawafed-custom-container .rawafed-plus {
        bottom: auto;
        top: -32px;
        inset-inline-start: 50%;
    }

    #rawafed-custom-container .r-card-footer {
        min-height: unset;
    }

    #rawafed-custom-container .r-sub-description {
        min-height: unset;
    }
    #rawafed-investment-form .radio {
        display: flex;
        gap: 1.5rem; /* space between Yes and No */
        align-items: center;
        }

    #rawafed-investment-form .cmp-form-options__field-label {
        display: flex;
        align-items: center;
    }

    #rawafed-investment-form .checkbox-input-label {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    .container #rawafed-investment-form .columncontainer div[role=complementary].col-sm-8 .columncontainer, .container #rawafed-inquiry-form .columncontainer div[role=complementary].col-sm-8 .columncontainer{
        padding-left:0px !important;
    }

    @media (min-width: 1100px) and (max-width: 1280px) {
        #rawafed-investment-form .columncontainer div[role=complementary].col-sm-8 .text{
            padding-left:0px !important;
        }
    }
}

.iti__flag {
    background-image: url("../../../etc.clientlibs/stc/clientlibs/clientlib-site/resources/images/flags.png") !important;
    @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
        background-image: url("../../../etc.clientlibs/stc/clientlibs/clientlib-site/resources/images/flags@2x.png") !important;
    }
  }
.wholesales-map {
    max-width: 1290px;
    margin: 0 auto;
}

.wholesales-map .wholesales-banner {
    background: url('../../../content/dam/corporatesite/en/wholesale/services/map-intro.jpg') no-repeat center center;
    padding: 50px;
    background-size: cover;
    color: #ffff;
    height: 100%;
    min-height: 650px;
}

.wholesales-map .wholesales-banner h3 {
    font-size: 2.429em;
    line-height: 1.3em;
    color: #fff;
    padding-bottom: 30px;
    border-bottom: solid 2px #e40421;
    width: fit-content;
}

.wholesales-map .wholesales-banner .view-map-btn {
    align-self: flex-end;
    justify-self: flex-end;
}

.wholesales-map .wholesales-banner .view-map-btn a {
    background: #4f008c;
    border: solid 2px #fff;
    color: #fff;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.wholesales-map .submarine-info {
    padding: 15px;
    position: relative;
    margin-inline-start: 30px;
}

.wholesales-map .submarine-info h4 {
    color: #4f008c;
    font-size: 1.5rem;
    margin-bottom: 20px;
}

.wholesales-map .submarine-info p {
    line-height: 40px;
}

.wholesales-map .submarine-info .stc-caption {
    font-size: 2rem;
    color: #4f008c;
}
.wholesales-map *{
    z-index:2
}
.wholesales-map .submarine-info:after {
    content: '';
    background-image: url('../../../content/dam/corporatesite/en/wholesale/sub-map.5c737e7bbd1749d8.jpg');
    background-repeat: no-repeat;
    background-size: contain;
    opacity: .3;
    top: 8rem;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}

@media screen and (min-width: 0px) and (max-width: 991px){
    .wholesales-map .wholesales-banner {
        min-height: 480px;
    }

    .wholesales-map .submarine-info {
        margin-inline: 0;
    }

    ::after {}

    .wholesales-map .submarine-info:after {
        width: 100%;
        top: 60px;
    }
}

/*New DLS updates */
:root {
    --black: #000;
    --white: #fff;
    --primary: #4f008c;
    --secondary: #ff375e;
    --dark: #1d252d;
    --grey-air: #f3f3f1;
    --grey: #8e9aa0;
    --grey-1: #4C4C4C;
    --grey-2: #6e6e6e;
    --grey-3: #989696;
    --grey-4: #c4c5c5;
    --grey-5: #dedcdd;
    --grey-line: #C0C6C8;
    --grey-border: #dde0e2;
    --grey-off-white: #f5f5f5;
    --air: #ffffff;
    --purple: #4f008c;
    --purple-dark: #290048;
    --purple-lite: #7500d0;
    --purple-ultra-lite: #DCCCE8;
    --coral: #ff375e;
    --coral-dark: #e1002c;
    --coral-lite: #ff7b95;
    --coral-ultra-lite: #FFD7DF;
    --sunset: #f9633a;
    --sunset-dark: #d73309;
    --sunset-lite: #fb977c;
    --sunset-ultra-lite: #FFE1D7;
    --oasis: #00c48c;
    --oasis-dark: #00805b;
    --oasis-lite: #00e6a4;
    --oasis-ultra-lite: #CCF3E8;
    --moon: #a54ee1;
    --moon-dark: #8522c9;
    --moon-lite: #c388eb;
    --moon-ultra-lite: #EDDCF9;
    --sun: #ffdd40;
    --sun-dark: #A67A1C;
    --sun-lite: #ffeb8c;
    --sun-ultra-lite: #FFF8D9;
    --sea: #1bced8;
    --sea-dark: #13949c;
    --sea-lite: #4ee1e9;
    --sea-ultra-lite: #D2F5F7;
    --silver: #89979f;
    --silver-dark: #6a7982;
    --silver-lite: #aeb8be;
    --silver-ultra-lite: #E8EBEC;
    --onyx: #1d252d;
    --onyx-dark: #0f1418;
    --onyx-lite: #44586b;
    --onyx-ultra-lite: #D2D3D5;
    --premium: #dca428;
    --premium-dark: #A67A1C;
    --premium-lite: #e6bd62;
    --premium-ultra-lite: #F8EDD4;
    --success: #30800a;
    --success-dark: #184006;
    --success-lite: #48c00d;
    --success-ultra-lite: #CCF3E8;
    --error: #ed0c00;
    --error-dark: #a90a00;
    --error-lite: #ff4d43;
    --error-ultra-lite: #FDE7E6;
    --warning: #cfa600;
    --warning-dark: #A67A1C;
    --warning-lite: #e7d27f;
    --warning-ultra-lite: #FAF6E6;
    --info: #1cced8;
    --info-dark: #13949c;
    --info-lite: #4ee1e9;
    --info-ultra-lite: #E8FAFB;
    --defaultSahdow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
}

/* typography updates */
h1, h2, h3, h4, h5, h6 {
    text-transform: lowercase;
}

/*h1{*/
/*    font-size:80px !important;*/
/*    line-height: 98px !important;*/
/*    letter-spacing: -3px;*/
/*}*/
/*h2{*/
/*    font-size:64px !important;*/
/*    line-height: 78px !important;*/
/*    letter-spacing: -2px;*/
/*}*/
/*h3{*/
/*    font-size:48px !important;*/
/*    line-height: 60px !important;*/
/*    letter-spacing: -1px;*/
/*}*/
/*h4{*/
/*    font-size:32px !important;*/
/*    line-height: 48px !important;*/
/*    letter-spacing: -0.5px;*/
/*}*/
/*h5{*/
/*    font-size:28px !important;*/
/*    line-height: 40px !important;*/
/*    letter-spacing: -0.2px;*/
/*}*/
/*h6{*/
/*    font-size:24px !important;*/
/*    line-height: 36px !important;*/
/*    letter-spacing: -0.1px;*/
/*}*/

h1 {
    font-size: 60px !important;
    line-height: 72px !important;
    letter-spacing: -3px;
}

h2 {
    font-size: 48px !important;
    line-height: 60px !important;
    letter-spacing: -2px;
}

h3 {
    font-size: 32px !important;
    line-height: 48px !important;
    letter-spacing: -1px;
}

h4 {
    font-size: 28px !important;
    line-height: 40px !important;
    letter-spacing: -0.5px;
}

h5 {
    font-size: 24px !important;
    line-height: 36px !important;
    letter-spacing: -0.2px;
}

h6 {
    font-size: 20px !important;
    line-height: 32px !important;
    letter-spacing: -0.1px;
}


.expand-list-component__img-container:hover .expandList-btn-animation.expandList-btn-background-slide > svg {
    fill: #fff;
    color: #fff;
}

.expand-list-component__img-container:hover .expand-list-component__button-arrow {
    background: var(--coral-dark) !important;
}

body button:is(.owl-next, .owl-prev) {
    background-color: transparent !important;
    background-image: none !important;

}

body button:is(.owl-next, .owl-prev) > svg {
    fill: var(--coral);
    color: var(--coral);
    display: block !important;
    width: 24px !important;
    height: auto;
}

body button:is(.owl-next, .owl-prev):hover > svg {
    fill:  var(--coral-dark) !important;
}

body .carousel-indicators button {
    background: transparent !important;
}

/* checkbox and radio buttons */
body .form-check-input[type=radio], body .form-check-input[type=checkbox] {
    border-color: #8E9AA0;
    background: transparent;
    transition: all ease-in-out 200ms;
}

/* store updated */
body :is(.cmp-button__tertiary, .btn-tertiary) {
    background: transparent !important;
    color: var(--coral) !important;
    border: solid 2px transparent !important;
}

body :is(.cmp-button__tertiary, .btn-tertiary):hover {
    background: transparent !important;
    color: var(--coral-dark) !important;
    border: solid 2px transparent !important;
    font-weight: 600;
}

.nav-bg-purple .cmp-button__tertiary {
    color: #fff !important;
}

.soho-confirm-button {
    color: #fff !important;
}

/* footer updates  */
.cmp-footerSiteMap .footer-site-button > .header-text {
    font-size: 16px !important;
}

html[dir=rtl] .groupCustomNavigation .cmp-search__field {
    right: auto;
    left: auto;
}

/* stc group prototype updates */
.card-grid .card-item, .bordered-swiper-item {
    border-color: #f3f3f1 !important;
}
.swiper-button-next, .swiper-button-prev {
    background: transparent !important;
    color: var(--coral) !important;
}
.whats-new-swiper .swiper  .whats-new-item {
    justify-content: end;
}

body .whats-new-item p {
    min-height: 64px !important;
    flex: auto;
}

.whats-new-img {
    flex: 1;
}
.pagination-number, .pagination-button {
    border-radius: 2px;
}


/* Responsive updates */
@media all and (max-width: 991px) {
    h1 {
        font-size: 40px !important;
        line-height: 52px !important;
        letter-spacing: -1.5px;
    }

    h2 {
        font-size: 32px !important;
        line-height: 48px !important;
        letter-spacing: -.5px;
    }

    h3 {
        font-size: 28px !important;
        line-height: 40px !important;
        letter-spacing: -0.2px;
    }

    h4 {
        font-size: 21px !important;
        line-height: 32px !important;
        letter-spacing: 0;
    }

}
/** button classes **/
.btn {
    --bs-btn-border-radius: 2px;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-border-color: transparent;
    --svg-color:#fff;
    --svg-hover-color:#fff;
    box-shadow: none;
    font-weight: 400;
    transition : all ease-in-out 200ms;
    display:inline-flex;
    align-items:center;
    gap:12px;
    min-height: 40px;
    font-size:1rem;
    --bs-btn-disabled-bg: var(--grey-1);
    --bs-btn-disabled-border-color: var(--grey-1);
    --bs-btn-disabled-color: #fff;
    --bs-border-width: 2px;
    --bs-btn-active-border-color: var(--bs-btn-hover-bg);
}
.btn:hover {
    font-weight:400;
}
.btn:focus {
    --bs-btn-border-color: var(--onyx);
    --bs-border-width: 2px;
}
.btn:disabled{
    background-color: var(--bs-btn-disabled-bg);
    border-color: var(--bs-btn-disabled-border-color);
    color: var(--bs-btn-disabled-color);
    pointer-events: none;
}
.btn.btn-large {
    min-height: 48px;
    font-size: 1.125rem;
}
.btn-medium {
    min-height: 40px;
    font-size: 1rem;
}

.btn-small {
    min-height: 36px;
    font-size: .875rem;
}

.btn svg, .btn svg path {
    fill : var(--svg-color)
}
.btn:is(:hover, :active, :focus) :is(svg,svg path) {
    fill : var(--svg-hovercolor)
}

.btn:before {
    display: none;
}

.btn-primary {
    --bs-btn-bg: var(--coral);
    --bs-btn-border-color: var(--coral);
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: var(--coral-dark);
    --bs-btn-hover-border-color: var(--coral-dark);
    --bs-btn-active-bg: var(--coral-dark);
    --bs-btn-disabled-border-color: var(--grey-1);
    --bs-btn-hover-color:#fff;
    --bs-btn-active-color: #fff;
    --svg-color: #fff;
    --svg-hover-color: #fff;
}
.btn-secondary {
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #fff;
    --bs-btn-color: var(--coral);
    --bs-btn-hover-bg: #fff;
    --bs-btn-hover-border-color: #fff;
    --bs-btn-active-bg: #fff;
    --bs-btn-active-border-color: #fff;
    --bs-btn-hover-color: var(--coral-dark);
    --bs-btn-active-color: var(--coral-dark);
    --svg-color: var(--coral);
    --svg-hover-color: var(--coral-dark);
}
.btn-tertiary {
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--coral);
    --bs-btn-color: var(--coral) !important;
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: var(--coral-dark);
    --bs-btn-active-bg: transparent;
    --bs-btn-active-border-color: var(--coral-dark);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--grey-1);
    --bs-btn-disabled-color: var(--grey-1);
    --bs-btn-hover-color: var(--coral-dark);
    --bs-btn-active-color: var(--coral-dark);
    --bs-border-width: 1px;
    --svg-color: var(--coral);
    --svg-hover-color: var(--coral-dark);
}

.master-link {
    --link-color: var(--coral);
    --link-hover: var(--coral-dark);
    --link-disabled-color: var(--grey-2);
    --svg-color:var(--coral);
    --svg-hover-color:var(--coral-dark);
    color: var(--link-color);
    text-decoration: none;
    display: inline;
    align-items: center;
    gap: 10px;
    font-weight:400;
    transition:all ease-in-out 200ms;
    border:solid 0 transparent;
    font-size: 1rem;
}
.master-link:is(:hover, :active, :focus){
    color:var(--link-hover);
    font-weight:500;
}
.master-link:focus{
    border-color:var(--onyx);
}

.master-link[aria-disabled="true"]{
    color:var(--link-disabled-color);
    pointer-events:none;
}
.master-link :is(svg,svg path) {
    fill : var(--svg-color)
}
.master-link:is(:hover, :active, :focus) :is(svg,svg path) {
    fill : var(--svg-hover-color)
}

.master-link-large {
    font-size: 1.125rem;
}
.master-link-medium {
    font-size: 1rem;
}
.master-link-small {
    font-size: .875rem;
}
.master-link-primary {
    --link-color: var(--coral);
    --link-hover: var(--coral-dark);
    --link-disabled-color: var(--grey-1);
    --svg-color: var(--coral);
    --svg-hover-color: var(--coral-dark);
}

.master-link-secondary {
    --link-color: var(--onyx);
    --link-hover: var(--silver);
    --link-disabled-color: var(--silver);
    --svg-color: var(--onyx);
    --svg-hover-color: var(--silver);
}

.btn a {
    color: var(--btn-color);
}
.btn a:hover {
    color: var(--btn-hover-color);
}