﻿/* =========================================================
   Page Style Clean
   Inner pages / Filters / About / Contact / Careers
   ========================================================= */

.section-cus-01 {
    position: relative;
    padding: 2rem 0;
}

.section-cus-02 {
    padding: 2rem 0;
}

.section-cus-03 {
    padding: 2rem 0;
}

.section-cus-04 {
    position: relative;
    padding: 2rem 0 6rem 0;
}

    .section-cus-04::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 3rem;
        opacity: .4;
        background-image: url(../img/pages/scale-top.webp);
        background-position: top;
        background-repeat: repeat-x;
        transform: rotate(180deg);
    }

@media (max-width: 990px) {
    .section-cus-01 {
        padding: 2rem 0;
    }

    .section-cus-02 {
        padding: 2rem 0;
    }

    .section-cus-03 {
        padding: 2rem 0 0 0;
    }

    .section-cus-04 {
        padding: 3rem 0 4rem 0;
    }
}

.text-theme-01 {
    color: var(--theme-color);
}

.text-theme-02 {
    color: var(--theme-color);
}



.cus-bord-top,
.cus-bord-bot {
    position: relative;
}

    .cus-bord-top::before {
        content: "";
        position: absolute;
        top: -8px;
        left: 0;
        width: 100%;
        height: 1rem;
        opacity: 1;
        background-image: url(../img/pages/scale-top.webp);
        background-position: top;
        background-repeat: repeat-x;
        background-size: contain;
    }

    .cus-bord-bot::after {
        content: "";
        position: absolute;
        bottom: -14px;
        left: 0;
        width: 100%;
        height: 1rem;
        opacity: 1;
        background-image: url(../img/pages/scale-bot.webp);
        background-position: bottom;
        background-repeat: repeat-x;
        background-size: contain;
    }

.btn-cus-01,
.btn-cus-01:focus {
    display: inline-block;
    padding: .5rem 2rem;
    text-align: center;
    position: relative;
    z-index: 1;
    background-color: var(--theme-color-02);
    color: var(--white-color);
    border: 1px solid var(--theme-color-02);
    border-radius: var(--border-radius-03);
    font-size: 1.125rem;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--font-rajdhani);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .btn-cus-01:hover {
        background-color: var(--theme-color-01);
        color: var(--white-color);
        border: 1px solid var(--theme-color-01);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

.btn-cus-02,
.btn-cus-02:focus {
    display: inline-block;
    padding: .5rem 2rem;
    text-align: center;
    position: relative;
    z-index: 1;
    background-color: var(--white-color);
    color: var(--theme-color-01);
    border: 1px solid var(--white-color);
    border-radius: var(--border-radius-03);
    font-size: 1.125rem;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--font-rajdhani);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .btn-cus-02:hover {
        background-color: var(--theme-color-01);
        color: var(--white-color);
        border: 1px solid var(--theme-color-01);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

.btn-cus-03,
.btn-cus-03:focus {
    display: inline-block;
    padding: .5rem 2rem;
    text-align: center;
    position: relative;
    z-index: 1;
    background-color: var(--theme-color-01);
    color: var(--white-color);
    border: 1px solid var(--theme-color-01);
    border-radius: var(--border-radius-03);
    font-size: 1.125rem;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--font-rajdhani);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .btn-cus-03:hover {
        background-color: var(--theme-color-02);
        color: var(--white-color);
        border: 1px solid var(--theme-color-02);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

.btn-cus-03-02,
.btn-cus-03-02:focus {
    display: inline-block;
    padding: .25rem 1.5rem;
    text-align: center;
    position: relative;
    z-index: 1;
    background-color: var(--theme-color-01);
    color: var(--white-color);
    border: 1px solid var(--theme-color-01);
    border-radius: var(--border-radius-03);
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--font-rajdhani);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .btn-cus-03-02:hover {
        background-color: var(--theme-color-02);
        color: var(--white-color);
        border: 1px solid var(--theme-color-02);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

.btn-cus-03-03,
.btn-cus-03-03:focus {
    display: inline-block;
    padding: .25rem 1.5rem;
    text-align: center;
    position: relative;
    z-index: 1;
    background-color: var(--theme-color-02);
    color: var(--white-color);
    border: 1px solid var(--theme-color-02);
    border-radius: var(--border-radius-03);
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--font-rajdhani);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .btn-cus-03-03:hover {
        background-color: var(--theme-color-01);
        color: var(--white-color);
        border: 1px solid var(--theme-color-01);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

.btn-cus-04,
.btn-cus-04:focus {
    display: inline-block;
    padding: .5rem 2rem;
    text-align: center;
    position: relative;
    z-index: 1;
    background-color: var(--white-color);
    color: var(--theme-color-01);
    border: 1px solid var(--white-color);
    border-radius: var(--border-radius-03);
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--font-rajdhani);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .btn-cus-04:hover {
        background-color: var(--transparent-color);
        color: var(--white-color);
        border: 1px solid var(--white-color);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

.btn-cus-05,
.btn-cus-05:focus {
    display: inline-block;
    padding: .25rem .5rem;
    text-align: center;
    position: relative;
    z-index: 1;
    background-color: var(--transparent-color);
    color: var(--theme-color-01);
    border: 1px solid var(--theme-color-01);
    border-radius: var(--border-radius-03);
    font-size: 1.125rem;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--font-rajdhani);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .btn-cus-05:hover {
        color: var(--theme-color-02);
        border: 1px solid var(--theme-color-02);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

.cus-link,
.cus-link:focus {
    position: relative;
    display: inline-block;
    color: var(--theme-color-01);
}

    .cus-link:hover {
        color: var(--theme-color-02);
    }

    .cus-link::after,
    .cus-link::before {
        content: "";
        position: absolute;
        left: 0;
        bottom: 2px;
        height: 1px;
        width: 100%;
        background-color: currentColor;
    }

    .cus-link::before {
        -webkit-transform-origin: 100% 50%;
        -moz-transform-origin: 100% 50%;
        transform-origin: 100% 50%;
    }

    .cus-link::after {
        -webkit-transform-origin: 0 50%;
        -moz-transform-origin: 0 50%;
        transform-origin: 0 50%;
        -webkit-transform: scaleX(0);
        -moz-transform: scaleX(0);
        transform: scaleX(0);
    }

    .cus-link:hover::before {
        -webkit-transform: scaleX(0);
        -moz-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transition: -webkit-transform .3s cubic-bezier(.86, 0, .07, 1);
        -moz-transition: -moz-transform .3s cubic-bezier(.86, 0, .07, 1);
        transition: transform .3s cubic-bezier(.86, 0, .07, 1);
    }

    .cus-link:hover::after {
        -webkit-transform: scaleX(1);
        -moz-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transition: -webkit-transform .3s cubic-bezier(.86, 0, .07, 1) .25s;
        -moz-transition: -moz-transform .3s cubic-bezier(.86, 0, .07, 1) .25s;
        transition: transform .3s cubic-bezier(.86, 0, .07, 1) .25s;
    }

.section-title-bg {
    position: relative;
    overflow: hidden;
    z-index: 0;
}

.page-title-bg {
    background-image: url(../img/pages/page-top-bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: 50% 50%;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
}

    .page-title-bg::before {
        content: "";
        background-color: var(--theme-color-03);
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }

.section-mask {
    background-image: var(--mask-color-01);
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 50%;
}

.constrot-strip {
    position: absolute;
    top: 0;
    height: 15px;
    width: 100%;
    background-image: url(../img/pages/footer-strip.webp);
    background-repeat: repeat-x;
    background-position: center top;
}

/****** Pages ******/



.art-title {
    font-family: var(--font-rajdhani);
    color: var(--theme-color-01);
    text-transform: uppercase;
    font-size: 1.5rem;
    font-weight: 700;
    position: relative;
    display: inline-block;
    margin-bottom: 1rem;
}

    .art-title::after {
        content: "";
        width: 80%;
        height: 3px;
        border-radius: 0;
        position: absolute;
        left: 50%;
        top: 2.5rem;
        background-color: var(--theme-color-02);
        -webkit-transform: translate(-50%,0);
        -ms-transform: translate(-50%,0);
        -o-transform: translate(-50%,0);
        transform: translate(-50%,0);
    }

.text-box-01 {
    position: relative;
    overflow: hidden;
    padding: 0;
    border: none;
    border-bottom: 1px solid var(--theme-color-02);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .text-box-01:hover {
        border-bottom: 1px solid var(--theme-color-01);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-01 .text-box-slide-01 {
        background-color: var(--white-color);
        padding: 1rem .5rem 2rem .5rem;
        position: relative;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-01 h6 {
        font-size: 1rem;
        text-transform: uppercase;
        margin-bottom: 0;
    }

    .text-box-01 h3,
    .text-box-01 h3 a,
    .text-box-01 h3 a:focus {
        color: var(--theme-color-01);
        font-size: 1.5rem;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .text-box-01 h3 a:hover {
            color: var(--theme-color-02);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

    .text-box-01 .date i {
        color: var(--theme-color-02);
    }

    .text-box-01 img {
        position: relative;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-01:hover img {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    .text-box-01 .img-over {
        position: relative;
        display: block;
    }

        .text-box-01 .img-over::after {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            background-color: var(--theme-color-01-25);
            -webkit-transform: scale(0);
            transform: scale(0);
            z-index: 1;
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

    .text-box-01:hover .img-over::after {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-01 .img-over-01 {
        padding: 0;
        padding-top: 60%;
        margin: 0;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }



.text-box-02 {
    position: relative;
    padding: 1rem 1rem 2rem 1rem;
    background-color: var(--white-color);
    text-align: center;
    overflow: hidden;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .text-box-02::after {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        right: 0;
        top: 0;
        opacity: 0;
        border-top: .25rem solid var(--theme-color-02);
        border-right: .25rem solid var(--theme-color-02);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-02::before {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        left: 0;
        bottom: 0;
        opacity: 0;
        border-bottom: .25rem solid var(--theme-color-02);
        border-left: .25rem solid var(--theme-color-02);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-02:hover::after {
        width: 50%;
        height: 50%;
        opacity: 1;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-02:hover::before {
        width: 50%;
        height: 50%;
        opacity: 1;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-02 .text-box-slide-02 {
        z-index: 1;
        position: relative;
        display: block;
    }

    .text-box-02 h4,
    .text-box-02 h4 a,
    .text-box-02 h4 a:focus {
        color: var(--theme-color-01);
        font-size: 1.25rem;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .text-box-02 h4 a:hover {
            color: var(--theme-color-02);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

    .text-box-02 .img-over-02 {
        padding: 0;
        padding-top: 90%;
        margin: 0;
        margin-bottom: 1rem;
        background-position: 50% 0;
        background-repeat: no-repeat;
        background-size: cover;
    }

.text-box-03 {
    margin-bottom: 1.5rem;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .text-box-03:hover {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px)
    }

    .text-box-03 .img-over-03 {
        padding: 0;
        padding-top: 70%;
        margin-bottom: 0;
        border-radius: 0 !important;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }

.text-box-03-info {
    background: var(--theme-color-01);
    margin-left: 1rem;
    margin-right: 1rem;
    margin-top: -50px;
    position: relative;
    padding: 1rem;
}

.text-box-03 h5 a,
.text-box-03 h5 a:focus {
    font-size: 1.25rem;
    margin-bottom: 1rem;
    color: var(--white-color);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .text-box-03 h5 a:hover {
        color: var(--theme-color-02);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

.text-box-03 p {
    margin-bottom: 1.5rem;
    font-size: .875rem;
    color: var(--white-color);
}

.offer-cus {
    overflow: hidden;
}

    .offer-cus .img-over-04 {
        padding: 0;
        padding-top: 76%;
        margin-bottom: 0;
        border-radius: 0 !important;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }

.swipe-img-02 {
    height: 3rem;
    cursor: default;
    filter: grayscale(100%);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

    .swipe-img-02:hover {
        filter: grayscale(0%);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

.card-01 {
    background-color: var(--theme-color-01);
    color: var(--white-color);
    padding: 2rem 1rem;
    text-align: center;
}

    .card-01 i {
        font-size: 1.5rem;
        margin-bottom: .5rem;
    }

    .card-01 .card-01-title {
        font-size: 1.125rem;
        font-weight: 700;
        text-transform: uppercase;
        margin-bottom: .5rem;
    }

    .card-01 a,
    .card-01 a:focus {
        color: var(--white-color);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        .card-01 a:hover {
            color: var(--white-color);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all 0.3s ease-in-out;
        }

.ifram-map {
    border: none;
    width: 100%;
    height: auto;
    min-height: 35.75rem;
    margin: 0;
    padding: 0;
}

.ifram-map-02 {
    border: none;
    width: 100%;
    height: auto;
    min-height: 21.5rem;
    margin: 0;
    padding: 0;
}

.section-full-01 {
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: 20% 50%;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
}

    .section-full-01::before {
        content: "";
        background-color: var(--theme-color-01-75);
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }

.section-full-cont {
    padding: 4rem 0;
    color: var(--white-color);
}

    .section-full-cont h5 {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }

    .section-full-cont h2 {
        font-size: 2.5rem;
        margin-bottom: 1.5rem;
    }

    .section-full-cont h6 {
        text-transform: uppercase;
        display: inline-block;
    }

    .section-full-cont p {
        margin-bottom: 2rem;
    }

        .section-full-cont p.tit-cou {
            display: inline-block;
            font-size: .875rem;
        }

    .section-full-cont .counter-number {
        display: inline-block;
        font-size: 3rem;
        font-weight: 600;
        width: 7rem;
    }

    .section-full-cont i {
        display: inline-block;
        font-size: 2rem;
    }

.widget {
    padding: 1rem;
    border: 1px solid var(--theme-color-01);
    border-radius: 0;
    background-color: var(--gray-color);
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 1;
}

    .widget .widget-title {
        position: relative;
        left: -1rem;
        top: -1rem;
        width: calc(100% + 2rem);
        display: inline-block;
        font-family: var(--font-rajdhani);
        font-size: 1.25rem;
        font-weight: 700;
        text-transform: uppercase;
        background-color: var(--theme-color-01);
        color: var(--white-color);
        padding: .75rem;
        border: none;
        border-radius: 0;
    }

    .widget p {
        font-size: .875rem;
    }

.widget-02 {
    padding: 1rem;
    border: 1px solid var(--theme-color-02-50);
    border-radius: 0;
    background-color: var(--white-color);
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 1;
}

    .widget-02 .carousel-item img {
        width: 100%;
        max-width: inherit;
    }

@media (max-width: 570px) {
    .widget-02 {
        padding: .25rem;
    }
}

.widget-03 {
    padding: .5rem;
    border: 1px solid var(--theme-color-02-50);
    border-radius: 0;
    background-color: var(--white-color);
    position: relative;
    z-index: 1;
}

    .widget-03 .widget-title {
        position: relative;
        left: -0.5rem;
        top: -0.5rem;
        width: calc(100% + 1rem);
        display: inline-block;
        font-family: var(--font-rajdhani);
        font-size: 1.25rem;
        font-weight: 700;
        text-transform: uppercase;
        background-color: var(--theme-color-01);
        color: var(--white-color);
        padding: .5rem .75rem;
        border: none;
        border-radius: 0;
    }


.testim {
    text-align: center;
    position: relative;
}

    .testim img {
        background: var(--white-color);
        width: 8rem;
        height: 8rem;
        position: relative;
        display: inline-block;
        border: 2px solid var(--white-color);
        margin: 0 0 1rem 0;
        border-radius: 100%;
        box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
    }

    .testim h6 {
        margin-bottom: .5rem;
        text-transform: uppercase;
        font-weight: 600;
    }

        .testim h6 span {
            color: var(--theme-color-02);
        }

.text-box-05 {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--theme-color-01);
    text-align: center;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .text-box-05 .text-box-slide {
        position: relative;
        transform: translateY(0);
        background-color: var(--gray-color);
        padding: 3rem 3rem 3rem 3rem;
        border-bottom: 1px solid var(--transparent-color);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
        z-index: 2;
    }

    .text-box-05 h3 {
        color: var(--theme-color-01);
        text-transform: uppercase;
        font-size: 1.5rem;
        margin: 0 0 1.5rem 0;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-05 p {
        display: inline-block;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-05 a,
    .text-box-05 a:focus
    .text-box-05 a:hover {
        color: var(--theme-color-01);
        text-transform: uppercase;
        font-size: 1.125rem;
        margin-top: 2rem;
        display: inline-block;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-05 .text-box-image {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 0;
    }

    .text-box-05:hover {
        border: 1px solid var(--theme-color-02);
        padding-bottom: 1.5rem;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .text-box-05:hover .text-box-slide {
            transform: translateY(-80%);
            padding: 4rem 3rem .5rem 3rem;
            border-bottom: 1px solid var(--theme-color-02);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

        .text-box-05:hover p {
            color: var(--white-color);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

        .text-box-05:hover a {
            color: var(--theme-color-02);
            font-weight: 600;
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

.text-box-06 {
    background-color: var(--theme-color-01-25);
    position: relative;
    overflow: hidden;
    border: 1px solid var(--theme-color-01);
    z-index: 1;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .text-box-06 .text-box-slide-03 {
        background-color: var(--theme-color-01-50);
        padding: 6rem 2rem 3rem 2rem;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-06 a h3 {
        color: var(--white-color);
        text-transform: uppercase;
        font-size: 1.25rem;
        margin: 2rem 0 .5rem 0;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-06 p {
        display: inline-block;
        color: var(--gray-color);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-06 .text-box-image-03 {
        -webkit-transform: scale(1);
        transform: scale(1);
        background-size: cover;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-attachment: scroll;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .text-box-06:hover {
        border: 1px solid var(--theme-color-02);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .text-box-06:hover .text-box-slide-03 {
            background-color: var(--theme-color-01-75);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

        .text-box-06:hover h3 {
            color: var(--theme-color-02);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

        .text-box-06:hover p {
            color: var(--white-color);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

        .text-box-06:hover .text-box-image-03 {
            -webkit-transform: scale(1.1);
            transform: scale(1.1);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

.profile-cus {
    position: relative;
}

    .profile-cus h4 {
        text-transform: uppercase;
    }

    .profile-cus span {
        font-weight: 700;
    }

    .profile-cus a,
    .profile-cus a:focus {
        color: var(--theme-color-01);
    }

        .profile-cus a:hover {
            color: var(--theme-color-02);
        }

    .profile-cus i {
        font-size: 1.5rem;
    }



.accordion-item {
    border: none;
    margin-bottom: .5rem;
    border-radius: 0;
}

.accordion-flush .accordion-item:last-child {
    margin-bottom: 0;
}

.accordion-button {
    position: relative;
    display: inline-block;
    align-items: center;
    width: 100%;
    padding: 1rem 3rem 1rem 1.25rem;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--theme-color-01);
    background-color: var(--theme-color-02-25);
    border-radius: 0;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

    .accordion-button i {
        font-size: 1.125rem;
    }

.accordion-body {
    padding: 1rem;
    border: 1px solid var(--theme-color-02-50);
}

.accordion-button:not(.collapsed) {
    color: var(--white-color);
    background-color: var(--theme-color-01);
    border-radius: 0;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.accordion-button::after {
    content: "\f078";
    font-family: var(--font-awesome);
    background-image: none;
    position: absolute;
    right: 1rem;
    top: 1rem;
    color: var(--theme-color-01);
    transition: transform .3s ease-in-out;
}

.accordion-button:not(.collapsed)::after {
    content: "\f078";
    font-family: var(--font-awesome);
    background-image: none;
    color: var(--white-color);
    position: absolute;
    right: 1.3125rem;
    top: 1rem;
    transition: transform .3s ease-in-out;
}

.accordion-button.accordion-button-trip {
    cursor: default;
    color: var(--white-color);
    padding: 0.635rem 1.25rem;
}

    .accordion-button.accordion-button-trip::after {
        display: none;
    }


/****** Validate & Sweet Alert ******/

.form-outline {
    position: relative;
}

    .form-outline .form-label {
        color: var(--black-color);
        font-family: var(--font-rajdhani);
        margin-bottom: 0;
        font-weight: 800;
        text-transform: uppercase;
    }

    .form-outline .form-control {
        padding: .25rem .5rem;
        color: var(--black-color);
        background-color: var(--transparent-color);
        border: none;
        border-bottom: 1px solid var(--black-color);
        border-radius: 0;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        .form-outline .form-control:focus {
            border-bottom: 1px solid var(--black-color);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all 0.3s ease-in-out;
        }

    .form-outline textarea.form-control {
        resize: none;
        height: 6rem;
    }

    .form-outline .btn-light,
    .form-outline .btn-light:focus {
        color: var(--light-color-03);
        background-color: var(--transparent-color);
        border: none;
        outline: 0 !important;
        box-shadow: none !important;
    }

    .form-outline .btn.btn-light,
    .form-outline .btn.btn-light:focus,
    .form-outline .btn.btn-light:hover {
        display: inline-block;
        line-height: 1.5;
        color: var(--black-color);
        background-color: var(--transparent-color);
        border: none;
        padding: 0 .75rem 0 0;
        border-radius: var(--border-radius);
        outline: 0 !important;
        box-shadow: none !important;
    }

        .form-outline .btn.btn-light.bs-placeholder {
            color: var(--gray-color) !important;
            font-weight: 600 !important;
        }

    .form-outline .dropdown-menu {
        padding: 0;
        margin: 0;
        margin-left: -.5rem !important;
        font-size: 1rem;
        color: var(--black-color);
        text-align: left;
        list-style: none;
        background-color: var(--white-color);
        background-clip: padding-box;
        border: 1px solid var(--light-color);
        border-radius: var(--border-radius-03);
    }

    .form-outline .bootstrap-select .dropdown-toggle .filter-option {
        left: 0;
        right: auto;
        float: left;
        text-align: left;
    }

    .form-outline .dropdown-item {
        padding: 0.25rem 1.5rem;
        font-weight: 600;
    }

        .form-outline .dropdown-item:focus, .form-outline .dropdown-item:hover {
            color: var(--black-color);
            background-color: var(--light-color);
            padding: .25rem 1.5rem;
        }

        .form-outline .dropdown-item.active, .form-outline .dropdown-item:active {
            color: var(--white-color);
            text-decoration: none;
            background-color: var(--theme-color-02);
        }

    .form-outline .form-control::placeholder {
        color: var(--gray-color) !important;
        font-weight: 400 !important;
        opacity: 1 !important;
    }

    .form-outline .form-control:-ms-input-placeholder {
        color: var(--gray-color) !important;
        font-weight: 400 !important;
        opacity: 1 !important;
    }

    .form-outline .form-control:-ms-input-placeholder {
        color: var(--gray-color) !important;
        font-weight: 400 !important;
        opacity: 1 !important;
    }

    .form-outline .invalid-feedback, .error {
        width: auto;
        position: absolute;
        bottom: -.05rem;
        right: .25rem;
        z-index: 2;
        color: var(--red-color);
        font-size: .75rem;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .form-outline.is-invalid .form-control {
        border-bottom: 1px solid var(--red-color) !important;
    }

.sweet-alert {
    padding: 1rem;
    border-radius: 0;
}

    .sweet-alert h3 {
        font-size: 1.5rem;
        margin-top: 2rem;
        color: var(--theme-color-01);
    }

    .sweet-alert .text-muted {
        color: var(--black-color) !important;
    }

    .sweet-alert .sa-confirm-button-container {
        position: relative;
        display: grid !important;
    }

    .sweet-alert .sa-icon.sa-success .sa-line {
        background-color: var(--green-color);
    }

    .sweet-alert .sa-icon.sa-success .sa-placeholder {
        border: 4px solid var(--green-color) !important;
    }

    .sweet-alert .btn-primary,
    .sweet-alert .btn-primary:focus {
        font-family: var(--font-arimo);
        font-weight: 700;
        text-transform: uppercase;
        text-align: center;
        padding: .5rem 2.5rem;
        border-radius: 0;
        color: var(--white-color);
        background-color: var(--theme-color-01);
        border: 1px solid var(--theme-color-01);
        display: inline-block;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .sweet-alert .btn-primary:hover {
            color: var(--white-color);
            background-color: var(--theme-color-02);
            border: 1px solid var(--theme-color-02);
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

.sweet-overlay {
    background-color: var(--theme-color-01);
    opacity: .8 !important;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    margin: .25rem 0 0 1rem;
    padding: .5rem !important;
}

    .bootstrap-datetimepicker-widget.dropdown-menu::after,
    .bootstrap-datetimepicker-widget.dropdown-menu::before {
        display: none;
    }

.bootstrap-datetimepicker-widget table td.disabled,
.bootstrap-datetimepicker-widget table td.disabled:focus,
.bootstrap-datetimepicker-widget table td.disabled:hover {
    text-decoration: line-through !important;
    color: var(--black-color) !important;
    background-color: var(--transparent-color) !important;
    text-shadow: none !important;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover,
.bootstrap-datetimepicker-widget table td span.active {
    background-color: var(--theme-color) !important;
    color: var(--white-color) !important;
    text-shadow: none !important;
}

.bootstrap-datetimepicker-widget table td.day:hover,
.bootstrap-datetimepicker-widget table td.hour:hover,
.bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td.second:hover,
.bootstrap-datetimepicker-widget table td span.month:hover,
.bootstrap-datetimepicker-widget table td span.year:hover {
    background-color: var(--black-color);
}

.bootstrap-datetimepicker-widget table th.next,
.bootstrap-datetimepicker-widget table th.prev {
    position: relative;
    background-color: var(--transparent-color);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.bootstrap-datetimepicker-widget table td.today::before {
    border-bottom-color: var(--theme-color-01) !important;
}
/****** DateTable ******/

.bg-table {
    background-color: #f7f7f7;
}



hr.hr-cus {
    background-color: var(--gray-color);
    opacity: 1;
    margin: 2rem 0;
}

.cus-datatable h4 {
    text-align: center;
    background-color: var(--gray-color);
    color: var(--white-color);
    margin-bottom: 1.5rem;
    padding: .5rem 0;
}

.cus-datatable h5 {
    text-align: center;
    color: var(--theme-color-02);
    margin-bottom: 1rem;
}


/****** Tabs ******/

.cus-datatable {
    overflow: auto;
}

.table-code-01 {
    width: 100%;
    overflow: auto;
}

.nav-pills .nav-link {
    background: 0 0;
    border: 0;
    border-bottom: 3px solid var(--transparent-color);
    border-radius: 0;
    background-color: var(--white-color);
    color: var(--theme-color-02);
    text-align: center;
    width: 100%;
    font-weight: 700;
    font-family: var(--font-rajdhani);
    font-size: 1.25rem;
    padding: .5rem 1.5rem;
}

    .nav-pills .nav-link.active,
    .nav-pills .show > .nav-link {
        color: var(--theme-color-01);
        background-color: var(--gray-color);
        border-bottom: 3px solid var(--theme-color-01);
    }

.nav-pills .nav-item {
    padding: 0;
}

@media (max-width: 570px) {
    .nav-pills .nav-item {
        padding: .25rem 0;
        width: 100%;
    }
}

/* =========================================================
   Inner Page Title
   ========================================================= */

.page-title {
    padding: 75px 0 84px 0 !important;
}

    .page-title .page-title-name {
        color: #fff !important;
        font-size: 50px !important;
        letter-spacing: 1px;
    }

    .page-title .page-title-links {
        margin-top: 14px;
        color: rgba(255,255,255,0.82) !important;
    }

.page-title-bg::before {
    background: linear-gradient(90deg, rgba(1,56,43,0.94), rgba(4,84,61,0.78)) !important;
}

@media (max-width: 990px) {
    .page-title {
        padding: 62px 0 54px 0 !important;
    }

        .page-title .page-title-name {
            font-size: 38px !important;
        }
}

/* =========================================================
   Filter Sidebar
   Used in Departs / Doctors / Contracts listing pages
   ========================================================= */

.filter-sidebar,
.side-filter,
.filter-box,
.doctord-filter .col-lg-3 > div {
    background: #fff !important;
    border: 1px solid var(--as-border) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 22px rgba(1,56,43,0.06) !important;
}

    .filter-sidebar .filter-title,
    .side-filter .filter-title,
    .filter-box .filter-title,
    .doctord-filter .col-lg-3 h4,
    .doctord-filter .filter-title,
    .doctord-filter .widget-title {
        background: var(--as-green) !important;
        color: #fff !important;
        padding: 13px 16px !important;
        margin: 0 !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        letter-spacing: 0.5px;
        border-radius: 0 !important;
    }

    .doctord-filter .col-lg-3 > div > div {
        padding: 12px 14px 14px !important;
    }

.doctord-filter h5,
.doctord-filter label,
.doctord-filter .sub-title {
    color: var(--as-green) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    margin: 0 0 6px 0 !important;
}

/* Search inputs */
.filter-sidebar input,
.side-filter input,
.filter-box input,
.doctord-filter input[type="text"],
.doctord-filter input[type="search"] {
    height: 40px !important;
    border: 1px solid #CBD8D1 !important;
    border-radius: 7px !important;
    background: #fff !important;
    padding: 0 12px !important;
    margin-bottom: 14px !important;
    color: var(--as-text) !important;
    font-size: 14px !important;
    box-shadow: none !important;
}

    .filter-sidebar input:focus,
    .side-filter input:focus,
    .filter-box input:focus,
    .doctord-filter input[type="text"]:focus,
    .doctord-filter input[type="search"]:focus {
        border-color: var(--as-green) !important;
        outline: none !important;
        box-shadow: 0 0 0 2px rgba(4,84,61,0.08) !important;
    }

/* Filter list */
.doctord-filter ul,
.doctord-filter .filter-list,
.doctord-filter .specialty-list {
    margin: 0 !important;
    padding: 0 !important;
}

    .doctord-filter ul li,
    .doctord-filter .filter-list li,
    .doctord-filter .specialty-list li {
        margin: 0 0 8px 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        list-style: none !important;
    }

        .doctord-filter ul li a,
        .doctord-filter ul li button,
        .doctord-filter .filter-list a,
        .doctord-filter .filter-list button,
        .doctord-filter .specialty-list a,
        .doctord-filter .specialty-list button,
        .doctord-filter .col-lg-3 a.btn,
        .doctord-filter .col-lg-3 button.btn {
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            width: 100% !important;
            min-height: 42px !important;
            padding: 10px 12px !important;
            margin: 0 !important;
            background: #fff !important;
            color: var(--as-green) !important;
            border: 1px solid var(--as-green) !important;
            border-radius: 7px !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            text-align: center !important;
            text-decoration: none !important;
            box-shadow: none !important;
        }

            .doctord-filter ul li a *,
            .doctord-filter ul li button *,
            .doctord-filter .filter-list a *,
            .doctord-filter .filter-list button *,
            .doctord-filter .specialty-list a *,
            .doctord-filter .specialty-list button *,
            .doctord-filter .col-lg-3 a.btn *,
            .doctord-filter .col-lg-3 button.btn * {
                background: transparent !important;
                border: 0 !important;
                color: inherit !important;
            }

            .doctord-filter ul li a:hover,
            .doctord-filter ul li button:hover,
            .doctord-filter .filter-list a:hover,
            .doctord-filter .filter-list button:hover,
            .doctord-filter .specialty-list a:hover,
            .doctord-filter .specialty-list button:hover,
            .doctord-filter .col-lg-3 a.btn:hover,
            .doctord-filter .col-lg-3 button.btn:hover {
                background: #F5FAF7 !important;
                color: var(--as-green) !important;
                border-color: var(--as-green) !important;
            }

        .doctord-filter ul li.active a,
        .doctord-filter ul li.active button,
        .doctord-filter .active,
        .doctord-filter a.active,
        .doctord-filter button.active,
        .doctord-filter .btn.active {
            background: var(--as-green) !important;
            color: #fff !important;
            border-color: var(--as-green) !important;
            font-weight: 800 !important;
            border-radius: 8px !important;
        }

        /* If the first item is All Specialties and has no active class */
        .doctord-filter ul li:first-child a,
        .doctord-filter ul li:first-child button,
        .doctord-filter .filter-list li:first-child a,
        .doctord-filter .filter-list li:first-child button,
        .doctord-filter .specialty-list li:first-child a,
        .doctord-filter .specialty-list li:first-child button {
            background: var(--as-green) !important;
            color: #fff !important;
            border-color: var(--as-green) !important;
            font-weight: 800 !important;
        }

/* =========================================================
   Departs Listing Cards Tuning
   ========================================================= */

.as-departs-page .text-box-slide-01 {
    min-height: 130px !important;
}

/* =========================================================
   About Page
   ========================================================= */

.about-page {
    background: var(--as-cream);
    padding: 60px 0;
}

.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: stretch;
}

.about-content-card,
.about-small-card {
    background: #fff;
    border: 1px solid var(--as-border);
    border-left: 4px solid var(--as-gold);
    border-radius: 18px;
    box-shadow: 0 10px 28px rgba(1,56,43,0.06) !important;
    font-weight: 500;
}

.about-content-card {
    padding: 34px;
}

    .about-content-card h2,
    .about-content-card h3,
    .about-small-card h3 {
        color: var(--as-green);
        font-weight: 800;
        margin-bottom: 16px;
    }

    .about-content-card p {
        color: #2B3D36;
        font-size: 16px;
        line-height: 1.9;
        margin-bottom: 0;
    }

.about-image-card {
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--as-border);
    box-shadow: 0 10px 28px rgba(1,56,43,0.08) !important;
    background: #fff;
    display: flex;
}

    .about-image-card img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.about-info-cards {
    margin-top: 28px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}

.about-small-card {
    padding: 24px;
}

    .about-small-card h3 {
        font-size: 24px;
        margin-bottom: 12px;
    }

    .about-small-card p {
        color: #2B3D36;
        font-size: 15px;
        line-height: 1.8;
    }

.about-stats {
    margin-top: 36px;
    background: var(--as-green);
    border-radius: 18px;
    padding: 26px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.about-stat {
    text-align: center;
    color: #fff;
}

    .about-stat strong {
        display: block;
        color: var(--as-gold);
        font-size: 28px;
        font-weight: 900;
        margin-bottom: 6px;
    }

    .about-stat span {
        font-size: 14px;
        color: rgba(255,255,255,0.84);
    }

html[dir="rtl"] .about-content-card,
html[dir="rtl"] .about-small-card {
    border-left: 1px solid var(--as-border);
    border-right: 4px solid var(--as-gold);
    text-align: right;
}

@media (max-width: 990px) {
    .about-grid,
    .about-info-cards,
    .about-stats {
        grid-template-columns: 1fr;
    }

    .about-image-card img {
        height: 320px;
    }
}

/* =========================================================
   Career Text Card
   ========================================================= */

.career-section {
    padding: 20px 10px;
}

.career-card {
    max-width: 950px;
    margin: auto;
    background: #fff;
    border-radius: 22px;
    padding: 40px;
    box-shadow: 0 12px 35px rgba(0,60,45,0.12);
    border-top: 6px solid #1f6f5b;
}

.career-badge {
    display: inline-block;
    background: #e3f2ed;
    color: #1f6f5b;
    padding: 8px 18px;
    border-radius: 30px;
    font-weight: 600;
    margin-bottom: 18px;
}

.career-card h2 {
    color: #123c34;
    font-size: 34px;
    margin-bottom: 15px;
}

.career-intro {
    font-size: 18px;
    color: #555;
    margin-bottom: 30px;
}

.career-details h4 {
    color: #1f6f5b;
    margin-top: 25px;
    margin-bottom: 12px;
}

.career-details ul {
    padding-left: 22px;
    margin-bottom: 10px;
}

.career-details li {
    margin-bottom: 8px;
    color: #444;
    line-height: 1.6;
}

.career-footer {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #e1e8e5;
    color: #333;
}

    .career-footer a {
        color: #1f6f5b;
        font-weight: 600;
        text-decoration: none;
    }

        .career-footer a:hover {
            text-decoration: underline;
        }

@media (max-width: 760px) {
    .career-card {
        padding: 25px;
    }

        .career-card h2 {
            font-size: 26px;
        }
}

/* =========================================================
   Contact Page
   ========================================================= */

.as-contact-page {
    background: var(--as-cream);
    padding-top: 42px !important;
    padding-bottom: 70px !important;
}

.as-contact-info-card {
    background: #fff !important;
    border: 1px solid var(--as-border) !important;
    border-radius: 18px !important;
    min-height: 135px;
    padding: 26px 18px !important;
    text-align: center;
    box-shadow: 0 10px 28px rgba(1,56,43,0.06) !important;
    color: var(--as-text) !important;
    transition: 0.25s ease;
}

    .as-contact-info-card:hover {
        transform: translateY(-5px);
        border-color: var(--as-green) !important;
        box-shadow: 0 16px 36px rgba(1,56,43,0.12) !important;
    }

    .as-contact-info-card i {
        color: var(--as-gold) !important;
        font-size: 28px !important;
        margin-bottom: 12px;
    }

    .as-contact-info-card .card-01-title,
    .as-contact-info-card div:first-of-type {
        color: var(--as-green) !important;
        font-size: 16px !important;
        font-weight: 800 !important;
        letter-spacing: 0.4px;
        text-transform: uppercase;
        margin-bottom: 8px;
    }

    .as-contact-info-card a,
    .as-contact-info-card div {
        color: var(--as-text) !important;
        font-size: 15px !important;
        font-weight: 600;
    }

        .as-contact-info-card a:hover {
            color: #B88A2E !important;
        }

.as-contact-card {
    background: #fff;
    border: 1px solid var(--as-border);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(1,56,43,0.07) !important;
    height: 100%;
}

.as-contact-card-title {
    background: var(--as-green);
    color: #fff;
    padding: 15px 20px;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.as-contact-map,
.as-contact-card .ifram-map {
    width: 100% !important;
    height: 420px !important;
    border: 0 !important;
    display: block;
}

.as-contact-form-card {
    padding: 0;
}

    .as-contact-form-card .nav-pills {
        background: #F4F8F6;
        padding: 10px 10px 0;
        margin: 0;
        border-bottom: 1px solid var(--as-border);
    }

        .as-contact-form-card .nav-pills .nav-link {
            border-radius: 10px 10px 0 0 !important;
            color: var(--as-green) !important;
            font-size: 15px !important;
            font-weight: 800 !important;
            padding: 12px 18px !important;
            background: transparent !important;
        }

            .as-contact-form-card .nav-pills .nav-link.active {
                background: #fff !important;
                color: var(--as-green) !important;
                border-top: 3px solid var(--as-gold);
            }

.as-contact-form-body {
    padding: 24px 24px 28px;
    background: #fff;
}

    .as-contact-form-body h5 {
        color: var(--as-green);
        font-size: 20px;
        font-weight: 800;
        margin-bottom: 20px;
    }

    .as-contact-form-body .form-label {
        color: var(--as-green);
        font-size: 14px;
        font-weight: 800;
        margin-bottom: 6px;
        text-transform: uppercase;
    }

    .as-contact-form-body .form-control {
        height: 44px;
        border: 1px solid #D8E2DD !important;
        border-radius: 8px !important;
        background: #fff !important;
        color: var(--as-text) !important;
        font-size: 15px !important;
        padding: 0 12px !important;
    }

    .as-contact-form-body textarea.form-control {
        height: 125px !important;
        padding: 12px !important;
        resize: vertical;
    }

    .as-contact-form-body .form-control:focus {
        border-color: var(--as-green) !important;
        box-shadow: 0 0 0 3px rgba(4,84,61,0.10) !important;
    }

    .as-contact-form-body .btn-cus-03,
    .as-contact-form-body button[type="submit"] {
        min-width: 170px;
        height: 44px;
        border-radius: 9px !important;
        background: var(--as-green) !important;
        border: 1px solid var(--as-green) !important;
        color: #fff !important;
        font-size: 14px !important;
        font-weight: 800 !important;
    }

        .as-contact-form-body .btn-cus-03:hover,
        .as-contact-form-body button[type="submit"]:hover {
            background: var(--as-gold) !important;
            border-color: var(--as-gold) !important;
            color: var(--as-green-dark) !important;
        }

html[dir="rtl"] .as-contact-form-body {
    text-align: right;
}

@media (max-width: 990px) {
    .as-contact-page {
        padding-top: 34px !important;
    }

    .as-contact-map,
    .as-contact-card .ifram-map {
        height: 320px !important;
    }

    .as-contact-form-card .nav-pills .nav-link {
        font-size: 14px !important;
        padding: 10px 12px !important;
    }
}

/* =========================================================
   Careers Form Page
   ========================================================= */

.as-careers-page {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.as-careers-form-card {
    max-width: 1050px;
    margin: 0 auto;
    background: #fff !important;
    border: 1px solid var(--as-border) !important;
    border-left: 4px solid var(--as-gold) !important;
    border-radius: 18px !important;
    padding: 34px 36px 38px !important;
    box-shadow: 0 12px 32px rgba(1,56,43,0.08) !important;
}

.as-careers-form-title {
    color: var(--as-green);
    font-size: 26px;
    font-weight: 800;
    margin-bottom: 24px;
    position: relative;
    padding-bottom: 12px;
}

    .as-careers-form-title::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 72px;
        height: 3px;
        background: var(--as-gold);
        border-radius: 3px;
    }

.as-careers-form-card .form-label,
.as-careers-form-card label,
.as-careers-form-card .form-outline .form-label {
    color: var(--as-green) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 7px !important;
}

.as-careers-form-card .form-control,
.as-careers-form-card input[type="text"],
.as-careers-form-card input[type="email"],
.as-careers-form-card input[type="tel"],
.as-careers-form-card textarea,
.as-careers-form-card select,
.as-careers-form-card .form-outline .form-control {
    width: 100% !important;
    height: 46px !important;
    border: 1px solid #D8E2DD !important;
    border-radius: 9px !important;
    background: #fff !important;
    color: var(--as-text) !important;
    font-size: 15px !important;
    padding: 0 13px !important;
    box-shadow: none !important;
}

    .as-careers-form-card .form-control:focus,
    .as-careers-form-card input:focus,
    .as-careers-form-card textarea:focus,
    .as-careers-form-card select:focus {
        border-color: var(--as-green) !important;
        box-shadow: 0 0 0 3px rgba(4,84,61,0.10) !important;
        outline: none !important;
    }

    .as-careers-form-card textarea,
    .as-careers-form-card textarea.form-control {
        height: 130px !important;
        padding: 12px 13px !important;
        resize: vertical;
    }

.as-careers-form-card input[type="file"] {
    height: auto !important;
    padding: 10px 12px !important;
    border: 1px solid #D8E2DD !important;
    border-radius: 9px !important;
    background: #fff !important;
    color: var(--as-text) !important;
}

    .as-careers-form-card input[type="file"]::file-selector-button {
        height: 36px;
        padding: 0 16px;
        margin-right: 12px;
        border: 0;
        border-radius: 7px;
        background: var(--as-green);
        color: #fff;
        font-weight: 800;
        cursor: pointer;
    }

.as-careers-form-card .btn,
.as-careers-form-card button,
.as-careers-form-card input[type="submit"],
.as-careers-form-card .btn-cus-03 {
    min-width: 180px;
    height: 46px !important;
    border-radius: 9px !important;
    background: var(--as-green) !important;
    border: 1px solid var(--as-green) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 0.4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 18px;
}

    .as-careers-form-card .btn:hover,
    .as-careers-form-card button:hover,
    .as-careers-form-card input[type="submit"]:hover,
    .as-careers-form-card .btn-cus-03:hover {
        background: var(--as-gold) !important;
        border-color: var(--as-gold) !important;
        color: var(--as-green-dark) !important;
    }

.as-careers-form-card .row {
    row-gap: 18px;
}

.as-careers-form-card .form-outline {
    margin-bottom: 18px;
}

html[dir="rtl"] .as-careers-form-card {
    border-left: 1px solid var(--as-border) !important;
    border-right: 4px solid var(--as-gold) !important;
    text-align: right;
}

html[dir="rtl"] .as-careers-form-title::after {
    left: auto;
    right: 0;
}

html[dir="rtl"] .as-careers-form-card input[type="file"]::file-selector-button {
    margin-right: 0;
    margin-left: 12px;
}

@media (max-width: 760px) {
    .as-careers-form-card {
        padding: 24px 18px 28px !important;
    }

        .as-careers-form-card .btn,
        .as-careers-form-card button,
        .as-careers-form-card input[type="submit"],
        .as-careers-form-card .btn-cus-03 {
            width: 100%;
        }
}
/* =========================================================
   Generic Datatable
   ========================================================= */

.cus-datatable .table-striped thead,
.cus-datatable .table-striped tfoot {
    background-color: var(--as-green);
    color: #fff;
}

.cus-datatable .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #F4F8F6;
}

.cus-datatable .table-striped > tbody > tr:nth-of-type(even) {
    background-color: #fff;
}

.cus-datatable .page-link {
    color: var(--as-green);
}

.cus-datatable .page-item.active .page-link {
    background-color: var(--as-green) !important;
    border-color: var(--as-green) !important;
    color: #fff;
}

/* Page title name clean */
.page-title .page-title-name {
    display: inline-block !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border: 0 !important;
    color: #fff !important;
}

    .page-title .page-title-name::before,
    .page-title .page-title-name::after {
        content: none !important;
        display: none !important;
    }

.page-title h1,
.page-title h2,
.page-title h3 {
    background: transparent !important;
    box-shadow: none !important;
}
/* Breadcrumb color fix */
.page-title .page-title-links a[href],
.page-title .page-title-links a[href]:link,
.page-title .page-title-links a[href]:visited,
.page-title .page-title-links a[href]:hover,
.page-title .page-title-links a[href]:focus,
.page-title .page-title-links a[href]:active {
    color: rgba(255,255,255,0.92) !important;
    text-decoration: none !important;
}

.page-title .page-title-links a:{
    color: rgba(255,255,255,0.92) !important;
}

    .page-title .page-title-links a::after {
        content: "›" !important;
        display: inline-block !important;
        margin-left: 8px !important;
        color: var(--as-gold) !important;
        font-size: 18px !important;
        font-weight: 800 !important;
    }