@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Marcellus&display=swap');

* {
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
}


:root {
    --mainColor: #849474;
    --mainBg: #F8E4CB;
    --fontColor: #1a1a1a;
    --disColor: rgba(26, 26, 26, .5);
    --section_dis_color: rgba(54, 51, 52, .5);
}


body {
    font-family: "Almarai", serif;
    background-color: var(--mainBg);
    text-transform: capitalize;
}




/* nav */

.navbar {
    padding-top: 0px;
}

.navbar .container-fluid {
    padding: 0px;
}

.header-top {
    text-align: center;
    padding: 10px 0px;
}

.navbar-brand {
    margin: 0px;
}

.header-top .logo {
    height: 60px;
    object-fit: contain;
}

.navbar-collapse {
    justify-content: center;
    background: var(--mainColor);
    padding: 0px;
    outline: none;
    box-shadow: none
}

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

.navbar-nav {
    gap: 40px;
    padding: 12px 0;
}

.nav-link {
    color: white !important;
    position: relative;
    transition: color 0.3s;
}






.fa-brands {
    color: white;
    font-size: 24px;
}

li {
    display: flex;
    align-items: center;
}




/* slider */

#carouselExampleCaptions h5,
#carouselExampleCaptions p {
    text-shadow: 0 4px 4px rgba(0, 0, 0, .25);
    text-align: right;
}

#carouselExampleCaptions h5 {
    font-size: 60px;
    margin-bottom: 15px;
}

#carouselExampleCaptions p {
    font-weight: 700;
    padding-left: 200px;
    font-size: 18px;
}

.carousel-control-next,
.carousel-control-prev {
    width: 3% !important;
}

.carousel-caption {
    right: 50px;
    top: 50%;
    padding: 5px 15px 10px 10px;
    border-radius: 5px;
    width: fit-content;
    height: fit-content;
    text-align: right;
}

.carousel-item {
    height: 100vh;
}

.carousel-item img {
    height: 100%;
    width: 100%;
    object-fit: fill;
}

.big {
    padding: 15px 24px 15px 50px;
    background-color: var(--mainColor);
    border: 2px solid #fff;
    font-size: 14px;
    position: relative;
    color: white;
    border-radius: 200px;
    transition: .3s
}



.big:before {
    background-image: url("https://www.levelsclinic.com/wp-content/themes/levels-clinic/assets/Img/Icons/chevron-right.svg");
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 24px;
    position: absolute;
    right: 17px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    left: 17px;
    right: auto;
    transform: translateY(-50%) rotate(180deg);
}

.big:hover {
    background-color: var(--mainColor);
    border: 2px solid #fff;
    transform: scale(1.1, 1.1);
    transition: .3s
}


/* doctors */

.our-doctors-outer {
    text-align: center;
    margin-top: 40px;
}

h2 {
    color: var(--mainColor);
    margin-bottom: 5px;
    position: relative;
    font-weight: 600;

}

.description {
    color: var(--section_dis_color);
    font-size: 17px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}

.doctor {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-bottom: 32px;
    text-align: center;
}

.doctor .image img {
    background-image: url("../../../logo.png");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    margin-bottom: 0px;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 400px;
    object-fit: contain;
}

.doctor .name {
    align-items: center;
    color: var(--fontColor);
    display: flex;
    font-size: 32px;
    margin-bottom: 0px;
    min-height: 60px;
    padding: 0 5px;
    text-align: center;
    text-transform: capitalize;
    justify-content: center;
}

.doctor .job {
    color: var(--disColor);
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 8px;
}

.doctor .big {
    padding: 10px 24px 10px 50px;
    border: none;
}


/* contact */


.contact {
    text-align: center;
    background: white;
    margin-bottom: 11px;
    padding-bottom: 10px;
}

.contact .title,
.before_after .title {
    margin-bottom: 5px;
    position: relative;
}

z
/* .contact .title::before,
.before_after .title::before {
    background-image: url("data:image/png+xml;base64,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");
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 70px;
    left: 50%;
    position: absolute;
    top: -14px;
    transform: translateX(-50%);
    width: 70px;

} */



.big::after {
    content: "";
    display: block;
    height: calc(100% + 4px);
    left: -2px;
    position: absolute;
    top: -2px;
    width: calc(100% + 4px);
    animation: 1.5s linear 0s infinite normal none running ripple-btn;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(255, 255, 255);
    border-image: initial;
    border-radius: 40px;
}

@keyframes ripple-btn {
    0% {
        transform: scale(1);
    }

    0% {
        transform: scale(1);
    }

    100% {
        opacity: 0;
        transform: scale(1.1, 1.3);
    }
}



form {
    width: 70%;
    margin: auto;
}

input,
textarea {
    outline: none;
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
    appearance: textfield;
    border: 1px solid #bfbfbf;
    border-radius: 5px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -.16px;
    line-height: 120%;
    margin-bottom: 13px;
    outline: none;
    padding: 11px 15px;
    width: 100%;
}

input:focus,
.select2-selection--multiple:focus {
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    border-color: rgb(67 118 109);
    outline-width: 0;


    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(202 211 209 / var(--tw-ring-opacity));

}

input::placeholder,
textarea::placeholder {

    opacity: .8;
}


/******************************************************* before after */

.before_after {
    width: 100%;
    text-align: center;
}

.compare-image-wrapper {
    position: relative;
    max-width: 100%;
    aspect-ratio: 16 / 9;
    background: #fff;
    padding: 5px;
    border-radius: 5px;
    overflow: hidden;
}


.compare-image {
    position: relative;
    width: 100%;
    height: 100%;

}

.img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;

}

.background-img {
    clip-path: inset(0 50% 0 0);

}

.foreground-img {
    clip-path: inset(0 0 0 50%);
}

/* شريط التمرير */
.slider {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    top: 50%;
    direction: ltr;
    z-index: 10;
    opacity: 0;
    width: 100%;
    height: 100%;
}

/* الفاصل الأبيض */
.slider-button {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 4px;
    background: #fff;
    left: 50%;
    transform: translateX(-50%);
    z-index: 20;
    pointer-events: none;
}

.slider-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3px;
    height: 100%;
    background: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
}

.slider-button:before {
    content: "";
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    width: 30px;
    height: 30px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.slider-button:after {
    content: "";
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 13" fill="none"><g><path d="M15.6672 1L20.223 6.40211L15.6672 11.8042" stroke="%23000" stroke-width="2"/><path d="M6.55591 1L2.00012 6.40211L6.55591 11.8042" stroke="%23000" stroke-width="2"/></g></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    width: 20px;
    height: 10px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.before {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translatey(-50%);
    font-weight: 600;
    color: white;
    text-shadow: 0 4px 4px rgba(0, 0, 0, .4);
    font-size: 14px;
}

.after {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translatey(-50%);
    font-weight: 600;
    color: white;
    text-shadow: 0 4px 4px rgba(0, 0, 0, .4);
    font-size: 14px;

}


/* foter------------------------- */

footer {
    background: var(--mainColor);
    color: white;
    padding: 40px 0px 0px;
    position: relative;
    overflow: hidden;
}

footer .logo {
    margin-bottom: 10px;
    width: 200px;
}


footer .title {
    margin-bottom: 20px;
}

footer .detail i {
    margin-left: 10px;
    line-height: 30px;
}

.fax a {
    color: white;
    text-decoration: none;
    text-transform: none;
}

.credit {
    align-items: center;
    border-top: 1px solid #fff;
    gap: 11px;
    justify-content: center;
    padding: 20px 0;
}

.foonter_icons {
    width: fit-content;
    display: flex;
    position: relative;
    z-index: 5;
}


.foonter_icons span {
    color: white;
    font-size: 22px;
}


z footer .logo {
    width: 150px;
    height: 80px;
    object-fit: contain;

}


/* slider */

.swiper {
    width: 100%;
    height: 350px;
    padding: 10px 0px 25px;
    /* box-shadow: -10px 20px 30px rgb(0 0 0 / 5%); */
    margin-bottom: 20px;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;

    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.swiper-pagination-bullet-active {
    background: var(--mainColor)
}

.swiper-slide {
    border: 1px solid #edf0f4;
    padding: 5px;
    /* box-shadow: -10px 20px 30px rgb(0 0 0 / 5%); */
    border-radius: 5px;

    /* background-color: #ffffff; */
}


.btns {
    position: absolute;
    top: 0px;
    width: 100%;
    height: 50px;
    z-index: 999;
}


.btns {
    width: 100px;
    right: 0;
    height: 10px;
    top: 7px;
}

.swiper-button-next,
.swiper-button-prev {
    margin: 0px;
    height: 10px;
    /* background-color: #f5f7f9 !important; */
    border-radius: 50px !important;

    /* box-shadow: 0 3px 30px rgb(0 0 0 / 15%) !important; */
}

.swiper {
    position: static;
}

.sliderHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(100% - 100px);
}


@media (min-width:993px) {



    .nav-link::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 0;
        height: 2px;
        background-color: white;
        transition: width 0.3s;
    }

    .nav-link:hover::after {
        width: 100%;
    }


    .navbar {
        padding-bottom: 0px;
    }

    .icons,
    .navbar-brand {
        display: none;
    }

    .carousel-caption {
        max-width: 75%;
    }

}



.categories {
    display: flex;
    column-gap: 40px;
    padding: 0px;
    flex-wrap: wrap;
    justify-content: center;
}

.categories li {
    color: var(--mainColor);
    cursor: pointer;
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;

}

.categories li.active {
    border-bottom: 1px solid var(--mainColor);
    ;
}


iframe {
    max-width: 100%;
    min-width: 80%;
}


.ref_link {
    position: fixed;
    top: 50%;
    left: -30px;
    transform: translatey(50%);
    z-index: 99999;
    text-transform: uppercase;
    padding: 10px 40px 10px 40px;
}


.ref_link:hover {
    color: white;
    top: 50%;
    transform: translatey(50%);
}

.ref_link:before {
    transform: translateY(-50%) rotate(360deg);
    left: unset;
    right: 10px;

}


.space {
    padding: 20px 0px 10px;
}