/*
@File: Disin Template Style

* This file contains the styling for the actual template, this
is the file you need to edit to change the look of the
template.

This files table contents are outlined below>>>>>

*******************************************
*******************************************

** - Default CSS
** - Preloader CSS
** - Header Top CSS
** - Navbar CSS
** - Home Slider CSS
** - Counter CSS
** - About CSS
** - Services CSS
** - Expertise CSS
** - Video CSS
** - Doctors CSS
** - Blog CSS
** - Newsletter CSS
** - Footer CSS
** - Copyright CSS
** - Emergency CSS
** - Welcome CSS
** - Speciality CSS
** - Appointment CSS
** - Banner CSS
** - Review Slider CSS
** - Page Title CSS
** - Doctor Search CSS
** - Doctor CSS
** - Doctor Details CSS
** - Blog Details CSS
** - Location CSS
** - Drop CSS
** - Map CSS
** - Faq CSS
** - 404 CSS
** - Coming CSS
** - Testimonial CSS
** - Sign Up CSS
** - Login CSS
** - Privacy Policy CSS
** - Department CSS
** - Service Details CSS
** - Back to Top CSS
** - Home Four CSS
** - Home Five CSS
*/


$body-font: 'Poppins', sans-serif;
$main-color: #0046c0;
$white-color: #ffffff;
$grey-color: #344c5d;
$black-color: #111111;
$transition: .5s all ease;
$all-size: 15px;

:root {
    scroll-behavior: initial;
}

/*-- Default CSS --*/
body {
    font-family: $body-font;
    color: $grey-color;
    background-color: $white-color;
    font-size: $all-size;
}
h1, h2, h3, h4, h5, h6 {
    color: #232323;
}
p {
    line-height: 1.7;
}
a {
    transition: $transition;
    text-decoration: none;
    &:hover {
        text-decoration: none;
    }
}
img {
    max-width: 100%;
}
.plr-15 {
    padding-left: 15px;
    padding-right: 15px;
}
.d-table {
    width:100%;
    height:100%;
}
.d-table-cell {
    vertical-align: middle;
}
.ptb-100 {
    padding-top: 100px;
    padding-bottom: 100px;
}
.pt-100 {
    padding-top: 100px;
}
.pb-70 {
    padding-bottom: 70px;
}
.pb-100 {
    padding-bottom: 100px;
}
button {
    &:focus{
        outline: 0;
    }
}
.btn.focus, .btn:focus {
    box-shadow: none;
}
/*-- End Default CSS --*/

/*----- Home Page One -----*/
/*-- Header Top --*/
.header-top {
    padding-top: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f2f2f2;
    background-color: $white-color;
    z-index: 1;
}
.header-top-item {
    .header-top-left {
        ul {
            margin: 0;
            padding: 0;

            li {
                display: inline-block;
                list-style-type: none;
                font-weight: 500;
                font-size: 14px;
                color: $grey-color;
                margin-right: 25px;

                i {
                    color: $main-color;
                    font-size: 18px;
                    position: relative;
                    top: 2px;
                    margin-right: 6px;
                }
                &:last-child {
                    margin-right: 0;
                }
                a {
                    display: inline-block;
                    color: #4a6f8a;

                    &:hover {
                        color: $main-color;
                    }
                    i {
                        color: $main-color;
                        font-size: 18px;
                        position: relative;
                        top: 2px;
                        margin-right: 6px;
                    }
                }
            }
        }
    }
    .header-top-right {
        text-align: right;
        .lang-list {
            margin-right: 30px;
            position: relative;
            top: -2px;
            li {
                a {
                    padding: 0 10px;
                    width: auto;
                    height: auto;
                    font-size: 13px;
                }
            }
        }
        ul {
            margin: 0;
            padding: 0;
            display: inline-block;

            li {
                list-style-type: none;
                display: inline-block;
                margin-right: 10px;

                &:last-child {
                    margin-right: 0;
                }
                a {
                    display: block;
                    width: 25px;
                    height: 25px;
                    line-height: 25px;
                    color: $white-color;
                    font-size: 16px;
                    text-align: center;
                    border: 1px solid transparent;
                    background-color: $main-color;

                    &:hover {
                        color: $main-color;
                        background-color: transparent;
                        border: 1px solid $main-color;
                    }
                }
            }
        }
    }
}
/*-- End Header Top --*/

/*-- Navbar --*/
.main-nav {
    background: $white-color;
    padding-top: 0;
    padding-bottom: 0;
    position: relative;

    nav {
        padding-top: 15px;
        padding-bottom: 15px;
        padding-right: 0;
        padding-left: 0;
        transition: $transition;

        .navbar-nav {
            margin-right: auto;
            margin-left: auto;

            .nav-item {
                &:hover {
                    a {
                        color: $main-color;
                    }
                }
                .dropdown-menu {
                    background: $white-color;
                    box-shadow: 0px 0px 15px 0px #ddd;
                    border: 0;
                    border-top: 2px solid $main-color;
                    padding: 10px 0;

                    li {
                        a {
                            color: #344c5d;
                            font-size: 14px;
                            
                            &:hover, &:focus, &.active {
                                color: $main-color;
                            }
                        }
                        &:hover {
                            a {
                                color: $main-color;

                                &:hover, &:focus, &.active {
                                    color: $main-color;
                                }
                            }
                        }
                    }
                }
                a {
                    font-weight: 500;
                    font-size: 15px;
                    color: #344c5d;
                    text-transform: capitalize;

                    &:hover, &:focus, &.active {
                        color: $main-color;
                    }
                }
            }
        }
    }
}
.search-icon {
    font-size: 16px;
    border: 0;
    outline: none;
    transition: $transition;
    color: $main-color;
    background-color: #d8e0e8;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 5px;

    &:hover{
        background-color: $black-color;
        color: $white-color;
    }
}
.search-toggle .search-icon.icon-close {
    display: none;
}
.search-toggle.opened .search-icon.icon-search {
    display: none;
}
.search-toggle.opened .search-icon.icon-close {
    display: block;
}
.nav-srh {
    position: relative;

    form {
        .form-control {
            font-size: 15px;
            height: 40px;
        }
        .icon-search {
            position: absolute;
            top: 0;
            right: 0;
            height: 40px;
        }
    }
}
.is-sticky {
    box-shadow: 0px 0px 15px 0px #ddd;

    nav {
        padding-top: 13px;
        padding-bottom: 13px;
    }
}

/* Navbar toggler */
.navbar-toggler {
    border: none;
	border-radius: 0;
	padding: 0;
    &:focus {
        outline: 0;
    }
    &:hover {
        box-shadow: none;
    }

    .icon-bar {
        width: 35px;
        transition: all 0.3s;
        background: #221638;
        height: 4px;
		display: block;
		border-radius: 3px;
    }
    .top-bar {
        transform: rotate(45deg);
        transform-origin: 10% 10%;
        left: 4px;
        position: relative;
    }
    .middle-bar {
        opacity: 0;
        margin: 5px 0;
    }
    .bottom-bar {
        transform: rotate(-45deg);
        transform-origin: 10% 90%;
        left: 4px;
        position: relative;
    }
    &.collapsed {
        .top-bar {
            transform: rotate(0);      
            left: 0;
        }
        .middle-bar {
            opacity: 1;
        }
        .bottom-bar {
            transform: rotate(0);
            left: 0;
        }
    }
}
/*-- End Navbar --*/

/*-- Home Slider --*/
.slider-item-img {
    background-image: url('/images/home-one/home-slider-bg.jpg');
}
.slider-item {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: 730px;
    position: relative;

    .slider-shape {
        img {
            position: absolute;
            top: -9px;
            right: -90px;
            max-width: 730px;
        }
    }
    .slider-shape-two {
        img {
            position: absolute;
            top: 20px;
            right: -60px;
            max-width: 730px;
        }
    }
    .slider-shape-three {
        img {
            position: absolute;
            top: 60px;
            right: 0;
            max-width: 730px;
        }
    }
    &::before {
        position: absolute;
        content: '';
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background-color: $main-color;
        opacity: .80;
    }
    .slider-text {
        position: relative;
        margin-top: -160px;
        z-index: 5;

        h1 {
            font-weight: 700;
            font-size: 46px;
            color: $white-color;
            margin-bottom: 25px;
            max-width: 600px;
            margin-left: 0;
            line-height: 1.4;
        }
        p {
            color: $white-color;
            font-weight: 40;
            margin-bottom: 40px;
            max-width: 575px;
            margin-left: 0;
        }
    }
}
.common-btn {
    a {
        display: inline-block;
        color: $main-color;
        background-color: $white-color;
        font-size: $all-size;
        font-weight: 500;
        padding: 12px 18px;
        border-radius: 5px;
        margin-right: 20px;
        border: 2px solid transparent;

        &:hover {
            background-color: transparent;
            border: 2px solid $white-color;
            color: $white-color;
        }
        &:last-child {
            margin-right: 0;
        }
    }
    .cmn-btn-right {
        background-color: transparent;
        color: $white-color;
        border: 2px solid $white-color;
        padding-left: 25px;
        padding-right: 25px;

        &:hover {
            color: $main-color;
            background-color: $white-color;
        }
    }
}
.home-slider {
    &.owl-theme {
        .owl-nav {
            margin-top: 0;
            .owl-prev, .owl-next {
                position: absolute;
                top: 45%;
                left: 15px;
                width: 55px;
                height: 55px;
                line-height: 55px;
                font-size: 28px;
                border-radius: 50%;
                color: $white-color;
                background-color: #2459b8;
                transition: $transition;
                padding: 0;
                margin: 0;
        
                &:hover {
                    color: $white-color;
                    background-color: $black-color;
                }
            }
            .owl-next {
                left: auto;
                right: 15px;
            }
        }
        .owl-dots {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 150px;
            .owl-dot {
                span {
                    width: 20px;
                    height: 5px;
                    margin: 5px 4px;
                    background-color: $main-color;
                    transition: $transition;
                }

                &.active span, &:hover span {
                    background: $white-color;
                    width: 30px;
                }
            }
        }
    }
}
/*-- End Home Slider --*/

/*-- Counter --*/
.counter-bg {
    background-image: url('/images/map-bg.png');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: $white-color;
    padding-top: 45px;
    padding-bottom: 15px;
    border-radius: 8px;
    box-shadow: 0px 0px 30px 0px #dddddda6;
    margin-top: -140px;
    position: relative;
    z-index: 1;
}
.counter-item {
    margin-bottom: 30px;
    text-align: center;

    i {
        display: block;
        color: $main-color;
        font-size: 45px;
        margin-bottom: 20px;
    }
    h3 {
        font-weight: 700;
        font-size: 48px;
        color: $main-color;
        margin-bottom: 8px;
    }
    p {
        margin-bottom: 0;
        font-weight: 600;
        font-size: 18px;
    }
}
/*-- End Counter --*/

/*-- About --*/
.about-item {
    margin-bottom: 30px;

    h2 {
        font-size: 38px;
        font-weight: 700;
        margin-bottom: 20px;
    }
    p {
        margin-bottom: 25px;
    }
    ul {
        margin: 0;
        padding: 0;
        margin-bottom: 30px;

        li {
            list-style-type: none;
            display: block;
            font-size: 18px;
            font-weight: 500;
            color: $black-color;
            margin-bottom: 12px;

            &:last-child {
                margin-bottom: 0;
            }
            i {
                display: inline-block;
                margin-right: 10px;
                color: $main-color;
                font-size: 23px;
                position: relative;
                top: 2px;
            }
        }
    }
    a {
        display: inline-block;
        font-size: $all-size;
        color: $white-color;
        background-color: $main-color;
        font-weight: 500;
        padding: 20px 45px;
        border-radius: 5px;

        &:hover {
            color: $all-size;
            background-color: $black-color;
        }
    }
}
.about-left {
    position: relative;

    img {
        width: 100%;
        z-index: 1;
        border-radius: 10px;
        animation: a-seven 10s infinite linear;
    }
    &:before {
        position: absolute;
        content: '';
        top: -10px;
        left: -10px;
        width: 430px;
        height: 375px;
        border-radius: 10px;
        z-index: -1;
        animation: a-one 5s infinite linear;
        background-color: $main-color;
    }
    &:after {
        position: absolute;
        content: '';
        bottom: -10px;
        right: -10px;
        width: 430px;
        height: 375px;
        border-radius: 10px;
        z-index: -1;
        animation: a-two 5s infinite linear;
        background-color: $main-color;
    }
}
@keyframes a-one {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(-20px, -20px);
    }
    100% {
        transform: translate(0, 0);
    }
}
@keyframes a-two {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(20px, 20px);
    }
    100% {
        transform: translate(0, 0);
    }
}
.about-right {
    padding-left: 40px;
    position: relative;

    img {
        position: absolute;
        top: -55px;
        right: 0;
        z-index: -1;
        width: 500px;
        animation: a-three 5s infinite linear;
    }
}
@keyframes a-three {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(0, 35px);
    }
    100% {
        transform: translate(0, 0);
    }
}
/*-- End About --*/

/*-- Services --*/
.section-title {
    margin-bottom: 50px;
    margin-top: -7px;

    h2 {
        font-weight: 700;
        font-size: 38px;
        margin-bottom: 0;
        padding-bottom: 15px;
        position: relative;

        &:before {
            position: absolute;
            content: '';
            left: 0;
            bottom: 0;
            width: 80px;
            height: 5px;
            background-color: $main-color;
            border-radius: 5px;
        }
    }
}
.service-item {
    margin-bottom: 30px;
    box-shadow: 0px 0px 25px 0px #ddddddbf;
    text-align: center;
    position: relative;
    padding-top: 25px;
    padding-bottom: 25px;
    padding-left: 15px;
    padding-right: 15px;

    &:before {
        position: absolute;
        content: '';
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        opacity: .50;
        background-color: $main-color;
        opacity: 0;
        z-index: -1;
        transition: $transition;
    }
    &:hover {
        box-shadow: none;

        &:before {
            opacity: 1;
        }
        .service-front {
            display: none;
            transform: scale(0.5);
        }
        .service-end {
            display: block;
            transform: scale(1);

            p {
                margin-bottom: 24px;
            }
        }
    }
    .service-front {
        transition: $transition;
        display: block;

        i {
            display: block;
            color: #4d93e9;
            font-size: 65px;
            margin-bottom: 20px;
        }
        h3 {
            font-weight: 600;
            font-size: 20px;
            margin-bottom: 12px;
        }
        p {
            margin-bottom: 0;
        }
    }
    .service-end {
        position: relative;
        display: none;
        transform: scale(0.5);
        padding-top: 4px;
        padding-bottom: 5px;

        i {
            position: absolute;
            left: 0;
            right: 0;
            top: 10%;
            font-size: 170px;
            color: #fff;
            opacity: .10;
            z-index: -1;
        }
        h3 {
            color: $white-color;
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 20px;
        }
        p {
            margin-bottom: 0;
            color: $white-color;
        }
        a {
            display: inline-block;
            color: $main-color;
            background-color: $white-color;
            padding: 12px 15px;

            &:hover {
                color: $white-color;
                background-color: $black-color;
            }
        }
    }
}
/*-- End Services --*/

/*-- Expertise --*/
.expertise-item {
    text-align: center;

    a {
        color: #fff;
    }
    .expertise-inner {
        background-color: $main-color;
        padding: 42px 25px 35px 25px;
        border-radius: 10px;
        margin-bottom: 30px;

        &:hover {
            i {
                box-shadow: none;
            }
        }
        i {
            display: block;
            width: 70px;
            height: 70px;
            line-height: 70px;
            margin-left: auto;
            margin-right: auto;
            border-radius: 50%;
            color: $main-color;
            font-size: 30px;
            margin-bottom: 35px;
            box-shadow: 0px 0px 0px 7px #ffffffa6;
            background-color: $white-color;
            transition: $transition;
            position: relative;
            top: 8px;        
        }
        h3 {
            color: $white-color;
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 14px;
        }
        p {
            margin-bottom: 0;
            color: $white-color;
        }
    }
    .expertise-right {
        padding-left: 80px;
        position: relative;

        &:before {
            position: absolute;
            content: '';
            top: -10px;
            left: 70px;
            width: 430px;
            height: 380px;
            z-index: -1;
            border-radius: 10px;
            animation: a-one 5s infinite linear;
            background-color: $main-color;
        }
        &:after {
            position: absolute;
            content: '';
            bottom: -10px;
            right: -10px;        
            width: 430px;
            height: 380px;
            z-index: -1;
            border-radius: 10px;
            animation: a-two 5s infinite linear;
            background-color: $main-color;
        }
        img {
            width: 100%;
            z-index: 1;
            animation: a-seven 10s infinite linear;
        }
    }
}
@keyframes a-seven {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}
/*-- End Expertise --*/

/*-- Video --*/
.video-area {
    background-image: url('/images/intro-video-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: 560px;
    text-align: center;
}
.video-item {
    .popup-youtube {
        display: inline-block;
        width: 110px;
        height: 110px;
        line-height: 110px;
        border-radius: 50%;
        color: #4d93e9;
        font-size: 35px;
        background-color: $white-color;
        cursor: pointer;
        transition: $transition;

        &:hover {
            color: $white-color;
            background-color: $black-color;
        }
    }
    .video-content {
        margin-top: 90px;
        text-align: left;
        padding-left: 30px;
        position: relative;
        max-width: 745px;
        margin-left: 0;

        &:before {
            position: absolute;
            content: '';
            top: 9px;
            left: 0;
            width: 5px;
            height: 130px;
            background-color: $white-color;
        }
        h3 {
            color: $white-color;
            font-weight: 600;
            font-size: 36px;
            margin-bottom: 25px;
        }
        p {
            color: $white-color;
            margin-bottom: 0;
        }
    }
}
.video-wrap {
    .react-tabs__tab-list {
        background-color: $white-color;
        text-align: center;
        position: relative;
        box-shadow: 0px 0px 15px 0px #ddd;
        margin: 0;
        border: none;

        .react-tabs__tab {
            display: inline-block;     
            color: $main-color;
            font-size: 16px;
            font-weight: 600;
            background-color: transparent;
            padding: 25px 49.4px 22px 49.3px;
            border-radius: 0;
            border: none;
            bottom: 0;
            
            &.react-tabs__tab--selected {
                background-color: $main-color;
                color: #fff;
            }
        }
    }
}
/*-- End Video --*/

/*-- Doctors --*/
.doctor-item {
    margin-bottom: 30px;
    background-color: $white-color;
    text-align: center;
    box-shadow: 0px 0px 20px 0px #ddd;
    border-radius: 10px;

    &:hover {
        .doctor-top {
            &:before {
                opacity: .60;
                transform: scale(1);
            }
            a {
                opacity: 1;
                bottom: 20px;
            }
        }
    }
    .doctor-top {
        position: relative;
        border-radius: 10px;

        a {
            display: inline-block;
            color: $main-color;
            font-size: 14px;
            font-weight: 600;
            padding: 15px 0;
            position: absolute;
            border-radius: 5px;
            left: 0;
            right: 0;
            bottom: 10px;
            opacity: 0;
            max-width: 160px;
            margin-left: auto;
            margin-right: auto;
            background-color: $white-color;

            &:hover {
                color: $white-color;
                background-color: $black-color;
            }
        }
        img {
            width: 100%;
            border-radius: 10px;
        }
    }
    .doctor-bottom {
        padding-top: 25px;
        padding-bottom: 25px;

        h3 {
            a {
                display: block;
                font-weight: 600;
                font-size: 22px;
                margin-bottom: 10px;
                color: #232323;

                &:hover {
                    color: $main-color;
                }
            }
        }
        span {
            display: block;
            color: $grey-color;
            font-size: $all-size;
        }
    }
}
.doctor-btn {
    text-align: center;

    a {
        margin-top: 30px;
        display: inline-block;
        font-weight: 600;
        color: #232323;
        font-size: 18px;
        border: 2px solid #386ae6;
        padding: 18px 55px;
        border-radius: 10px;

        &:hover {
            color: $white-color;
            background-color: #386ae6;
        }
    }
}
/*-- End Doctors --*/

/*-- Blog --*/
.blog-area {
    background-color: #f8fbff;
}
.blog-item {
    margin-bottom: 30px;
    border-radius: 10px;
    background-color: $white-color;
    box-shadow: 0px 0px 20px 0px #dddddd6b;

    &:hover .blog-top {
        overflow: hidden;

        img {
            transform: scale(1.1);
        }
    }
    .blog-top {
        overflow: hidden;

        img {
            width: 100%;
            border-radius: 10px;
            transition: $transition;
        }
        a {
            display: block;
        }
    }
    .blog-bottom {
        padding: {
            top: 25px;
            left: 20px;
            right: 20px;
            bottom: 25px;
        };
        h3 {
            margin-bottom: 0;

            a {
                font-weight: 600;
                font-size: 20px;
                color: #232323;
                margin-bottom: 12px;
                transition: $transition;
                line-height: 1.4;
                display: block;

                &:hover {
                    color: $main-color;
                }
            }
        }
        p {
            color: #232323;
            margin-bottom: 0;
            padding-bottom: 20px;
        }
        ul {
            margin: 0;
            padding: 0;
            padding-top: 20px;
            border-top: 1px solid #b1b8ed;

            li {
                display: inline-block;
                list-style-type: none;
                color: #0046c0;
                font-weight: 500;
                font-size: 14px;

                i {
                    color: #0046c0;
                }
                &:last-child {
                    float: right;

                    i {
                        font-size: 15px;
                        margin-right: 6px;
                    }
                }
                a {
                    display: block;
                    color: #0046c0;
                    font-weight: 500;
                    font-size: $all-size;

                    &:hover {
                        color: $black-color;

                        i {
                            color: $black-color;
                        }
                    }
                    i {
                        display: inline-block;
                        font-size: 22px;
                        position: relative;
                        top: 4px;
                        transition: .3s all ease;
                    }
                }
            }
        }
    }
}
/*-- End Blog --*/

/*-- Newsletter --*/
.newsletter-wrap {
    padding: 45px;
    box-shadow: 0px 0px 20px 0px #ddddddab;
    background-color: $white-color;
    border-radius: 10px;
}
.newsletter-item {
    h2 {
        font-weight: 600;
        font-size: 36px;
        margin-bottom: 15px;
    }
    p {
        margin-bottom: 0;
        color: #676767;
        font-size: 15px;
        max-width: 550px;
        margin-left: 0;
    }
    .newsletter-form {
        position: relative;
        .form-control {
            height: 75px;
            border-radius: 10px;
            border: 1px solid $main-color;
            padding-left: 25px;
            font-size: 18px;

            &:focus {
                box-shadow: none;
                border: 1px solid $black-color;
            }
        }
        ::placeholder {
            color: #333333;
        }
        .newsletter-btn {
            border-radius: 10px;
            padding: 16px 30px;
            font-size: 18px;
            position: absolute;
            top: 7px;
            right: 7px;
            color: $white-color;
            background-color: $main-color;
            transition: $transition;
            opacity: 1;

            &:hover {
                background-color: $black-color;
            }
        }
        .validation-danger {
            color: #dc3545;
            margin-top: 10px;
        }
    }
}
/*-- End Newsletter --*/

/*-- Footer --*/
footer {
    background-image: url('/images/footer-bg.png');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #0843aa;
    position: relative;
}
.footer-item {
    margin-bottom: 30px;

    .footer-contact {
        h3 {
            color: $white-color;
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 30px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                display: block;
                color: $white-color;
                font-weight: 500;
                font-size: $all-size;
                padding-left: 60px;
                position: relative;
                margin-bottom: 30px;

                &:last-child {
                    margin-bottom: 0;
                    margin-left: 0;

                    i {
                        top: 2px;
                    }
                }
                a {
                    display: block;
                    color: $white-color;
                    margin-bottom: 7px;

                    &:last-child {
                        margin-bottom: 0;
                    }
                    &:hover {
                        margin-left: 5px;

                        i {
                            left: 5px;
                        }
                    }
                }
                i {
                    position: absolute;
                    top: 2px;
                    left: 0;
                    font-size: 42px;
                    transition: $transition;
                }
            }
        }
    }
    .footer-quick {
        h3 {
            color: $white-color;
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 30px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                display: block;
                margin-bottom: 20px;

                &:last-child {
                    margin-bottom: 0;
                }
                a {
                    display: block;
                    font-weight: 500;
                    font-size: $all-size;
                    color: $white-color;

                    &:hover {
                        margin-left: 5px;
                    }
                }
            }
        }
    }
    .footer-feedback {
        h3 {
            color: $white-color;
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 30px;
        }
        .form-group {
            margin-bottom: 20px;

            .form-control {
                font-size: $all-size;
                background-color: transparent;
                border-radius: 0;
                border: 0;
                border-bottom: 1px solid #ffffffc7;
                padding-left: 0;
                padding-top: 0;
                padding-bottom: 15px;
                color: $white-color;

                &:focus {
                    box-shadow: none;
                    border-bottom: 1px solid #ffffffc7;
                }
            }
            ::placeholder {
                color: #ffffffc7;
            }
        }
        .feedback-btn {
            font-weight: 600;
            font-size: 14px;
            background-color: $white-color;
            padding: 12px 35px;
            border-radius: 30px;
            color: $main-color;
            transition: $transition;

            &:hover {
                color: $white-color;
                background-color: $black-color;
            }
        }
    }
}
/*-- End Footer --*/

/*-- Copyright --*/
.copyright-area {
    background-color: #001230;

    .copyright-item {
        padding-top: 20px;
        padding-bottom: 20px;

        p {
            margin-bottom: 0;
            color: $white-color;
            font-weight: 500;
            font-size: 14px;
            text-align: center;

            a {
                display: inline-block;
                color: $white-color;

                &:hover {
                    color: $main-color;
                }
            }
        }
    }
}
/*-- End Copyright --*/
/*----- End Home Page One -----*/

/*----- Home Page Two -----*/
/*-- Home Slider --*/
.home-slider-two.owl-theme .owl-dots .owl-dot.active span, .home-slider-two.owl-theme .owl-dots .owl-dot:hover span {
    background: #9dbdfc;
}
.slider-item-img-two {
    background-image: url('/images/home-two/home-2-slider1.jpg');
}
.slider-item-img-three {
    background-image: url('/images/home-two/home-2-slider2.jpg');
}
.slider-item-img-four {
    background-image: url('/images/home-two/home-2-slider3.jpg');
}
.home-slider-two {
    &.owl-theme {
        .owl-nav {
            .owl-prev, .owl-next {
                background-color: #bdcce2;
            }
        }
    }
    
    .slider-item {
        height: 830px;

        .slider-shape {
            img {
                position: absolute;
                top: -160px;
                left: 0;
                width: 525px;
                animation: a-three 5s infinite linear;
                z-index: -1;
            }
        }
        &::before {
            background-color: transparent;
        }
        .slider-text {
            h1 {
                color: #232323;
            }
            p {
                color: #000000;
            }
            .common-btn {
                a {
                    border: 2px solid $main-color;
                    color: $white-color;
                    background-color: $main-color;
                    position: relative;

                    &:hover {
                        color: $main-color;
                        background-color: transparent;
                    }
                }
                .cmn-btn-right {
                    background-color: transparent;
                    color: $main-color;

                    &:hover {
                        color: $white-color;
                        background-color: $main-color;
                    }
                }
            }
        }
    }
}
/*-- End Home Slider --*/

/*-- Emergency --*/
.emergency-area {
    margin-top: -125px;
    position: relative;
    z-index: 1;
}
.emergency-bg {
    background-image: url(/images/contact-info-bg1.png);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 45px 0 15px 110px;
    border-radius: 10px;
}
.emergency-item {
    margin-bottom: 30px;
    position: relative;

    i {
        display: inline-block;
        position: absolute;
        top: 5px;
        left: 0;
        text-align: center;
        width: 45px;
        height: 45px;
        line-height: 45px;
        border-radius: 50%;
        color: $black-color;
        font-size: 20px;
        box-shadow: 0px 0px 0px 4px #ffffff9c;
        background-color: $white-color;
    }
    .emergency-inner {
        padding-left: 75px;

        h3 {
            color: $white-color;
            margin-bottom: 18px;
            font-size: 22px;
            font-weight: 600;
        }
        p {
            color: $white-color;
            margin-bottom: 0;
            font-size: 14px;
        }
    }
}
/*-- End Emergency --*/

/*-- Welcome --*/
.welcome-left {
    background-image: url('/images/about3.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 0 10px 10px 0;
    margin-bottom: 30px;
    width: 100%;
    height: 100%;

    img {
        display: none;
    }
}
.welcome-item {
    ul {
        margin: 0;
        padding: 0;
        max-width: 430px;

        li {
            list-style-type: none;
            display: block;
            position: relative;
            margin-bottom: 40px;

            &:hover {
                i {
                    box-shadow: 0px 0px 0px 10px $black-color;
                }
            }
            &:last-child {
                margin-bottom: 0;
            }
            i {
                display: inline-block;
                position: absolute;
                top: 9px;
                left: 0;
                text-align: center;
                font-size: 35px;
                width: 70px;
                height: 70px;
                line-height: 70px;
                border-radius: 50%;
                color: $black-color;
                box-shadow: 0px 0px 0px 10px $main-color;
                background-color: #f1f1f1;
                transition: $transition;
            }
            .welcome-inner {
                padding-left: 110px;

                h3 {
                    font-weight: 600;
                    font-size: 22px;
                    color: #232323;
                    margin-bottom: 10px;
                }
                p {
                    margin-bottom: 0;
                }
            }
        }
    }
}
.welcome-right {
    padding-left: 70px;
    padding-top: 0;
}
.section-title-two {
    max-width: 430px;
    margin-left: 0;
    margin-bottom: 40px;
    margin-top: -5px;

    span {
        display: inline-block;
        color: $main-color;
        font-size: $all-size;
        font-weight: 600;
        margin-bottom: 5px;
    }
    h2 {
        font-size: 38px;
        font-weight: 700;
        color: #232323;
    }
}
/*-- End Welcome --*/

/*-- Speciality --*/
.speciality-area {
    .section-title-two {
        padding-top: 50px;
        padding-left: 15px;
    }
}
.speciality-item {
    .speciality-inner {
        border-radius: 10px;
        box-shadow: 0px 0px 20px 0px #dddddda6;
        padding: 35px;
        margin-bottom: 30px;
        
        &:hover {
            i {
                color: $white-color;
                background-color: #6096fd;
            }
        }
        i {
            display: block;
            color: #6096fd;
            background-color: #e9eef5;
            width: 40px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            border-radius: 50%;
            font-size: 28px;
            margin-bottom: 18px;
            transition: $transition;
        }
        h3 {
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 12px;
        }
        p {
            margin-bottom: 0;
        }
    }
}
.speciality-right {
    background-image: url('/images/about4.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 10px 0 0 10px;
    position: relative;
    width: 100%;
    height: 100%;

    img {
        display: none;
    }
    .speciality-emergency {
        position: absolute;
        bottom: 20px;
        left: -70px;
        background-color: $main-color;
        padding: 30px 295px 25px 40px;;
        border-radius: 10px;

        .speciality-icon {
            width: 45px;
            height: 45px;
            background-color: $white-color;
            transform: rotate(45deg);
            display: inline-block;
            position: relative;
    
            i {
                display: inline-block;
                line-height: 45px;
                color: $main-color;
                text-align: center;
                font-size: 20px;
                transform: rotate(-45deg);
                position: absolute;
                top: 0px;
                left: 12px;
            }
        }
        h3 {
            font-weight: 500;
            color: $white-color;
            font-size: 24px;
            margin-bottom: 8px;
            position: absolute;
            top: 23px;
            right: 70px;
        }
        p {
            margin-bottom: 0;
            color: $white-color;
            position: absolute;
            right: 142px;
            top: 56px;
        }
    }
}
.speciality-left {
    padding-left: 55px;
    padding-right: 120px;
}
/*-- End Speciality --*/

/*-- Video --*/
.video-wrap-two {
    .video-area {
        background-image: url('/images/home-two/7.jpg');
    }
    .video-nav {
        .video-nav-item {
            a {
                padding-left: 49.7px;
                padding-right: 49px;
            }
        }
    }
    .video-item {
        a {
            color: $main-color;
        }
    }
    .nav-pills .nav-link, .nav-pills .show>.nav-link {
        border-top: 0;
    }
    .nav-pills .nav-link.active, .nav-pills .show>.nav-link {
        border-top: 0;
        background-color: $main-color;
        color: $white-color;
    }
}
/*-- End Video --*/

/*-- Counter --*/
.counter-area-two {
    .counter-bg {
        margin-top: 0;
        bottom: 0;
    }
}
/*-- End Counter --*/

/*-- Appointment --*/
.appointment-area {
    background-image: url('/images/appointment-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
.appointment-item {
    max-width: 770px;
    margin-left: auto;
    margin-right: auto;
    background-color: $white-color;
    padding: 80px 100px 80px;
    border-radius: 10px;
    background-image: url('/images/home-two/home-2-hart-shape.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

    h2 {
        color: $main-color;
        font-weight: 600;
        font-size: 30px;
        margin-bottom: 15px;
    }
    span {
        display: block;
        color: $grey-color;
        font-size: $all-size;
        font-weight: 600;
        margin-bottom: 50px;
    }
    .appointment-form {
        .form-group {
            padding-left: 70px;
            position: relative;
            margin-bottom: 60px;

            i {
                display: inline-block;
                color: $main-color;
                position: absolute;
                top: 11px;
                left: 0;
                font-size: 50px;
            }
            label {
                margin-bottom: 10px;
                color: $grey-color;
                font-size: $all-size;
                font-weight: 500;
            }
            .form-control {
                border-radius: 0;
                border: 0;
                border-bottom: 1px solid #0046c09e;
                font-size: $all-size;
                padding-left: 0;
                padding-bottom: 8px;
                height: 40px;
                background-color: transparent;

                &:focus {
                    box-shadow: none;
                    border-bottom: 1px solid #0046c09e;
                }
            }
            ::placeholder {
                color: $grey-color;
            }
        }
        .appointment-btn {
            color: $white-color;
            background-color: $main-color;
            font-weight: 500;
            font-size: $all-size;
            border-radius: 5px;
            padding: 18px 45px;
            transition: $transition;

            &:hover {
                color: $white-color;
                background-color: $black-color;
            }
        }
    }
}
/*-- End Appointment --*/
/*----- End Home Page Two -----*/

/*----- Home Page Three -----*/
/*-- Banner --*/
.banner-area {
    height: 700px;
    position: relative;

    .heart-shape {
        img {
            position: absolute;
            bottom: 35px;
            left: 0;
            z-index: -1;
        }
    }
}
.banner-item {
    position: relative;

    h1 {
        font-weight: 700;
        font-size: 48px;
        margin-bottom: 25px;
        max-width: 575px;
        margin-left: 0;
    }
    p {
        color: #616263;
        margin-bottom: 35px;
        max-width: 575px;
        margin-left: 0;
    }
    .common-btn-two {
        a {
            display: inline-block;
            color: $white-color;
            background-color: $main-color;
            font-size: $all-size;
            font-weight: 500;
            padding: 12px 18px;
            border-radius: 5px;
            margin-right: 20px;
            border: 2px solid transparent;
    
            &:hover {
                background-color: transparent;
                border: 2px solid $main-color;
                color: $main-color;
            }
            &:last-child {
                margin-right: 0;
            }
        }
        .cmn-btn-right-two {
            background-color: transparent;
            color: $main-color;
            border: 2px solid $main-color;
            padding-left: 25px;
            padding-right: 25px;
    
            &:hover {
                color: $white-color;
                background-color: $main-color;
            }
        }
    }
    .banner-right {
        img {
            position: absolute;

            &:nth-child(1) {
                top: -125px;
                right: 10px;
                max-width: 510px;
                z-index: 1;
                margin-left: auto;
                margin-right: auto;
            }
            &:nth-child(2) {
                top: -125px;
                right: 20px;
                max-width: 510px;
                animation: a-four 5s infinite linear;
                margin-left: auto;
                margin-right: auto;
            }
            &:nth-child(3) {
                top: -125px;
                right: 0px;
                max-width: 510px;
                animation: a-five 5s infinite linear;
                margin-left: auto;
                margin-right: auto;
            }
            &:nth-child(4) {
                bottom: 215px;
                left: 50px;
                max-width: 360px;
                z-index: -1;
                animation: a-eight 20s infinite linear;
            }
        }
    }
}
@keyframes a-eight {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(75px, 0);
    }
    100% {
        transform: translate(0, 0);
    }
}
@keyframes a-four {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(-10px, -10px);
    }
    100% {
        transform: translate(0, 0);
    }
}
@keyframes a-five {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(10px, 10px);
    }
    100% {
        transform: translate(0, 0);
    }
}
/*-- End Banner --*/

/*-- About --*/
.hospital-area {
    position: relative;

    .hospital-shape {
        img {
            position: absolute;
            bottom: 80px;
            right: 0;
            width: 290px;
            animation: a-six 5s infinite linear;
        }
    }
}
@keyframes a-six {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(0, 40px);
    }
    100% {
        transform: translate(0, 0);
    }
}
.hospital-item {
    margin-bottom: 30px;
    position: relative;

    .hospital-play-btn {
        display: inline-block;
        width: 110px;
        height: 110px;
        line-height: 110px;
        border-radius: 50%;
        color: $main-color;
        text-align: center;
        font-size: 32px;
        background-color: $white-color;
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        z-index: 2;
        top: 40%;
        cursor: pointer;

        &:hover {
            color: $white-color;
            background-color: $black-color;
        }
    }
    h2 {
        font-weight: 700;
        font-size: 38px;
        margin-bottom: 15px;
    }
    p {
        margin-bottom: 40px;
    }
    ul {
        margin: 0;
        padding: 0;
        margin-bottom: 50px;

        li {
            list-style-type: none;
            display: block;
            font-weight: 500;
            font-size: 18px;
            color: $black-color;
            margin-bottom: 20px;

            &:last-child {
                margin-bottom: 0;
            }
            i {
                color: #6096fd;
                font-size: 22px;
                margin-right: 8px;
                position: relative;
                bottom: -1px;
            }
        }
    }
    .hospital-btn {
        display: inline-block;
        color: $white-color;
        background-color: $main-color;
        border-radius: 10px;
        font-weight: 500;
        font-size: $all-size;
        padding: 20px 42px;

        &:hover {
            color: $white-color;
            background-color: $black-color;
        }
    }
    .hospital-left-one {
        margin-top: 100px;
        position: relative;
        z-index: 1;

        &:before {
            position: absolute;
            content: '';
            right: -17px;
            bottom: -15px;
            width: 430px;
            height: 380px;
            z-index: -1;
            border-radius: 10px;
            background-color: $main-color;
        }
        img {
            width: 100%;
            z-index: 1;
        }
    }
    .hospital-left-two {
        margin-left: 15px;
        margin-bottom: 100px;
        position: relative;
        z-index: 1;

        &:before {
            position: absolute;
            content: '';
            left: -17px;
            top: -15px;
            width: 295px;
            height: 380px;
            z-index: -1;
            border-radius: 10px;
            background-color: $main-color;
        }
        img {
            width: 100%;
            z-index: 1;
        }
    }
}
.hospital-right {
    max-width: 525px;
    margin-left: 85px;
}
/*-- End About --*/

/*-- Speciality --*/
.speciality-right-two {
    position: relative;

    &:before {
        position: absolute;
        content: '';
        top: -25px;
        right: 0;
        width: 405px;
        height: 300px;
        z-index: -1;
        background-color: $main-color;
    }
}
/*-- End Speciality --*/

/*-- Welcome --*/
.welcome-left-two {
    position: relative;
    z-index: 1;
}
/*-- End Welcome --*/

/*-- Counter --*/
.counter-area-three {
    .counter-bg {
        margin-top: 0;
        bottom: 0;
    }
}
/*-- End Counter --*/

/*-- Review Slider --*/
.review-area {
    position: relative;
    background-image: url('/images/feedback-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    &:before {
        position: absolute;
        content: '';
        width: 100%;
        height: 100%;
        opacity: .8;
        top: 0;
        left: 0;
        background-color: $main-color;
    }
}
.main {
    max-width: 770px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 80px;
    padding-left: 80px;
    padding-right: 80px;
    position: relative;

    &:before {
        position: absolute;
        content: '';
        width: 100%;
        height: 330px;
        top: 65px;
        left: 0;
        right: 0;
        background-color: $white-color;
    }
}
.slick-dotted.slick-slider {
    margin-bottom: 25px;
}
.slider-nav {
    margin-bottom: 30px;
    position: relative;
    max-width: 440px;
    margin-left: auto;
    margin-right: auto;
    
    .slick-dots {
        bottom: -145px;

        li {
            margin: 0;

            button {
                &:before {
                    font-size: 12px;
                    opacity: 1;
                    color: $grey-color;
                }
            }
            &.slick-active {
                button {
                    &:before {
                        opacity: 1;
                        color: $main-color;
                    }
                }
            }
        }
    }
    .slick-track {
        padding-top: 2px;
    }
    div {
        text-align: center;

        .review-img {
            position: relative;
            margin-top: 10px;
            margin-right: 15px;
            margin-left: 15px;

            img {
                display: inline-block;
                margin-bottom: 45px;
                width: 90px;
                height: 90px;
                border: 3px solid $main-color;
                border-radius: 50%;
                transition: $transition;
                margin-top: 2px;
                cursor: pointer;
            }
        }
        h3 {
            font-size: 24px;
            font-weight: 600;
            margin-bottom: 12px;
        }
        span {
            display: block;
            color: #3776d0;
        }
    }
}
.slick-slide .review-details {
    opacity: 0;
}
.slick-slide {
    &:focus {
        outline: 0;
    }
}
.slick-slide.slick-center {
    .review-details {
        opacity: 1;
    }
    .review-img {

        img {
            transform: scale(1.3);
        }
    }
}
.slider-for {
    div {
        p {
            margin-bottom: 0;
            color: #000000;
            font-size: $all-size;
            text-align: center;
            max-width: 580px;
            margin-left: auto;
            margin-right: auto;
        }
    }
}

.feedback-slider {
    &.owl-theme {
        .owl-nav  {
            .owl-prev, .owl-next {
                background-color: #fff;
                color: $main-color;

                &:hover {
                    background-color: $main-color;
                }
            }
        }
    }
}
.feedback-item {
    max-width: 770px;
    width: 100%;
    background-color: #fff;
    margin: auto;
    text-align: center;
    padding: 60px 30px;
    border-radius: 10px;

    .client-img {
        img {
            width: 90px !important;
            height: 90px;
            margin: auto;
        }
        h3 {
            margin-top: 20px;
            font-size: 22px;
        }
    }
    p {
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
        &:last-child {
            margin-bottom: 0;
        }
    }
}
/*-- End Review Slider --*/
/*----- End Home Page Three -----*/

/*----- Doctor Page -----*/
/*-- Page Title --*/
.page-title-one {
    background-image: url('/images/page-banner1.jpg');
}
.page-title-area {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: 400px;
    text-align: center;
    position: relative;

    &:before {
        position: absolute;
        content: '';
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        opacity: .50;
        background-color: $main-color;
    }
}
.page-title-item {
    position: relative;
    h2 {
        color: #f8f8f8;
        font-weight: 700;
        font-size: 48px;
        margin-bottom: 20px;
    }
    ul {
        margin: 0;
        padding: 0;

        li {
            list-style-type: none;
            display: inline-block;
            color: #f8f8f8;
            font-weight: 600;
            font-size: 18px;
            margin-right: 25px;
            position: relative;

            &:last-child {
                margin-right: 0;
            }

            a {
                display: inline-block;
                color: #f8f8f8;

                &:hover {
                    color: $black-color;
                }
            }

            &::before {
                content: ">";
                position: absolute;
                right: -17px;
                top: 1px;
            }

            &:last-child::before {
                display: none;
            }
        }
    }
}
/*-- End Page Title --*/

/*-- Doctor Search --*/
.doctor-search-wrap {
    padding-top: 45px;
    padding-bottom: 15px;
    border-radius: 10px;
    box-shadow: 0px 0px 20px 0px #ddd;
    margin-top: -80px;
    z-index: 1;
    position: relative;
    background-color: $white-color;
    max-width: 970px;
    margin-right: auto;
    margin-left: auto;
}
.doctor-search-item {
    margin-bottom: 30px;
    position: relative;
    max-width: 340px;
    margin-right: auto;
    margin-left: auto;
    
    .form-group {
        position: relative;
        padding-left: 60px;
        margin-bottom: 0;

        i {
            display: inline-block;
            color: $main-color;
            font-size: 45px;
            position: absolute;
            top: 8px;
            left: 0;
        }
        label {
            color: $grey-color;
            font-size: $all-size;
            margin-bottom: 5px;
        }
        .form-control {
            font-weight: 600;
            font-size: $all-size;
            border-radius: 0;
            border: 0;
            padding-left: 0;
            padding-top: 0;
            padding-bottom: 10px;
            border-bottom: 1px solid #ccd9f2;

            &:focus {
                border-bottom: 1px solid $black-color;
                box-shadow: none;
            }
        }
        ::placeholder {
            color: $grey-color;
        }
    }
    .doctor-search-btn {
        position: absolute;
        bottom: 0;
        right: 0;
        color: $grey-color;
        font-size: 18px;
    }
}
/*-- End Doctor Search --*/

/*-- Doctor --*/
.doctors-area-two {
    position: relative;

    .doctor-shape {
        position: absolute;
        top: 45%;
        left: 0;
        animation: a-six 5s infinite linear;
    }
}
/*-- End Doctor --*/
/*----- End Doctor Page -----*/

/*----- Apoointment Page -----*/
/*-- Page Title --*/
.page-title-two {
    background-image: url('/images/page-banner2.jpg');
}
/*-- End Page Title --*/

/*-- Appointment --*/
.appointment-item-two {
    background-image: none;
    margin-bottom: 30px;
    box-shadow: 0px 0px 20px 0px #ddd;
    padding: 80px 65px 80px;
    position: relative;

    .appointment-shape {
        position: absolute;
        bottom: -65px;
        left: -74px;
        width: 310px;
        animation: a-six 5s infinite linear;
    }
}
.appointment-item-two-right {
    background-image: url('/images/appointment1.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: 100%;
    padding-top: 50px;
    padding-bottom: 50px;

    .appointment-item-content {
        background-color: #f6f6f6;
        padding: 95px 40px 100px;
        margin: 0 40px;
        border-radius: 10px;

        h2 {
            color: $main-color;
            font-weight: 600;
            font-size: 24px;
            margin-bottom: 30px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                position: relative;
                color: $grey-color;
                font-weight: 500;
                font-size: 14px;
                border-bottom: 1px solid #eee;
                padding: 10px 0;
                span {
                    float: right;
                }
            }
        }
    }
}
/*-- End Appointment --*/
/*----- End Apoointment Page -----*/

/*----- Doctor Details Page -----*/
/*-- Page Title --*/
.page-title-three {
    background-image: url('/images/page-banner3.jpg');
}
.page-title-item-two {
    position: relative;
    text-align: left;
    max-width: 500px;
    margin-left: auto;

    h2 {
        font-weight: 700;
        font-size: 48px;
        color: $white-color;
        margin-bottom: 14px;
    }
    h3 {
        font-weight: 600;
        font-size: 32px;
        color: #fefefe;
        margin-bottom: 15px;
    }
    p {
        margin-bottom: 0;
        font-size: 20px;
        color: #fefefe;
        padding-bottom: 55px;
    }
}
/*-- End Page Title --*/

/*-- Doctor Details --*/
.doctor-details-left {
    box-shadow: 0px 0px 10px 0px #ddd;
    border-radius: 10px;
}
.doctor-details-item {
    margin-bottom: 30px;

    img {
        width: 100%;
        border-radius: 10px;
        margin-bottom: 50px;
    }
    .doctor-details-contact {
        padding: 0 40px;
        margin-bottom: 50px;

        h3 {
            font-weight: 600;
            font-size: 22px;
            color: $grey-color;
            margin-bottom: 30px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                display: block;
                font-weight: 500;
                font-size: 15px;
                color: $grey-color;
                margin-bottom: 25px;

                &:last-child {
                    margin-bottom: 0;
                }
                i {
                    display: inline-block;
                    color: $main-color;
                    margin-right: 10px;
                    font-size: 18px;
                    position: relative;
                    top: 2px;
                }
            }
        }
    }
    .doctor-details-work {
        padding: 0 40px;
        padding-bottom: 50px;

        h3 {
            font-weight: 600;
            font-size: 22px;
            color: $grey-color;
            margin-bottom: 30px;
        }
        .appointment-item-two-right {
            background-image: none;
            padding-top: 0;
            padding-bottom: 0;

            .appointment-item-content {
                padding: 0;
                background-color: transparent;
                margin: 0;

                ul {
                    li {
                        font-size: 15px;
                        padding: 10px 0;

                        &:first-child {
                            border-top: 1px solid #eee;
                        }
                    }
                }
            }
        }
    }
    .doctor-details-biography {
        padding-left: 30px;
        margin-bottom: 40px;

        &:last-child {
            margin-bottom: 0;
        }
  
        h3 {
            font-weight: 600;
            font-size: 24px;
            color: #2f60bd;
            margin-bottom: 25px;
        }
        p {
            &:last-child {
                margin-bottom: 0;
            }
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                display: block;
                margin-bottom: 15px;

                &:last-child {
                    margin-bottom: 0;
                }
            }
        }
    }
}
/*-- End Doctor Details --*/

/*-- Appointment --*/
.appointment-area-three {
    .appointment-item {
        max-width: 565px;
        margin-left: auto;
        margin-right: 80px;
        margin-top: 50px;

        .appointment-shape {
            bottom: 0;
            top: -95px;
            left: -74px;
            width: 250px;
        }
    }
    .speciality-right-three {
        background-image: url('/images/appointment1.jpg');
    }
}
/*-- End Appointment --*/
/*----- End Doctor Details Page -----*/

/*----- Blog Details Page -----*/
/*-- Page Title --*/
.page-title-four {
    background-image: url('/images/page-banner4.jpg');
}
/*-- End Page Title --*/

/*-- Blog Details --*/
.blog-details-item {
    margin-bottom: 30px;

    .blog-details-img {
        img {
            width: 100%;
            margin-bottom: 30px;
        }
        h2 {
            color: #232323;
            font-weight: 600;
            font-size: 28px;
            margin-bottom: 16px;
            line-height: 1.4;
        }
        ul {
            margin: 0;
            padding: 0;
            margin-bottom: 20px;

            li {
                list-style-type: none;
                display: inline-block;
                color: #3a5ed3;
                font-size: 16px;
                margin-right: 50px;

                a {
                    font-weight: 400;
                    color: $main-color;
                    display: inline-block;

                    &:hover {
                        color: $black-color;
                    }
                }
                &:last-child {
                    margin-right: 0;
                }
                i {
                    display: inline-block;
                    font-size: 20px;
                    margin-right: 5px;
                }
            }
        }
        p {
            font-size: 15px;
            margin-bottom: 22px;
        }
    }
    .blog-details-previous {
        h3 {
            color: #232323;
            font-weight: 700;
            margin-top: 10px;
            font-size: $all-size;
            margin-bottom: 25px;
        }
        ul {
            margin: 0;
            padding: 0;
            margin-bottom: 30px;

            li {
                list-style-type: none;
                display: block;
                margin-bottom: 6px;

                &:last-child {
                    margin-bottom: 0;
                }
            }
        }
        .prev-next {
            ul {
                margin: 0;
                padding: 0;

                li {
                    list-style-type: none;
                    display: inline-block;

                    &:last-child {
                        float: right;
                    }
                    a {
                        display: block;
                        font-size: $all-size;
                        color: #0045be;
                        border: 1px solid #0045be;
                        padding: 10px 25px;
                        border-radius: 6px;

                        &:hover {
                            color: $white-color;
                            border: 1px solid $grey-color;
                            background-color: $grey-color;
                        }
                    }
                }
            }
        }
    }
    .blog-details-search {
        position: relative;
        margin-bottom: 40px;

        .form-control {
            height: 50px;
            border-radius: 6px;
            border: 1px solid $main-color;
            padding-left: 25px;

            &:focus {
                box-shadow: none;
            }
        }
        .blog-details-btn {
            color: $white-color;
            background-color: $main-color;
            border-radius: 6px;
            position: absolute;
            top: 0;
            right: 0;
            font-size: 17px;
            padding: 11px 20px;
            transition: $transition;

            &:hover {
                background-color: $grey-color;
            }
        }
        ::placeholder {
            color: $grey-color;
        }
    }
    .blog-details-recent {
        margin-bottom: 40px;

        h3 {
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 30px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                display: block;
                position: relative;
                padding-left: 120px;
                padding-bottom: 25px;

                &:last-child {
                    padding-bottom: 0;
                }
                img {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100px;
                    height: 95px;
                }
                a {
                    display: block;
                    font-weight: 600;
                    font-size: $all-size;
                    color: #232323;
                    margin-bottom: 15px;
                    padding-top: 4px;

                    &:hover {
                        color: $main-color;
                    }
                }
                ul {
                    li {
                        display: inline-block;
                        padding-left: 0;
                        color: #3a5ed3;
                        font-size: $all-size;
                        margin-right: 25px;
                        padding-bottom: 0;

                        a {
                            font-weight: 400;
                            color: $main-color;
                            display: inline-block;

                            &:hover {
                                color: $black-color;
                            }
                        }
                        i {
                            font-size: 20px;
                            margin-right: 2px;
                            display: inline-block;
                        }
                        &:last-child {
                            margin-right: 0;
                        }
                    }
                }
            }
        }
    }
    .blog-details-category {
        margin-bottom: 40px;

        h3 {
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 30px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                display: block;
                border-bottom: 1px solid #dee8f5;
                position: relative;
                padding-left: 20px;
                padding-bottom: 15px;
                margin-bottom: 15px;
                
                &:hover {
                    a {
                        color: $white-color;
                    }
                    &:before {
                        width: 100%;
                    }
                }
                &:before {
                    position: absolute;
                    content: '';
                    left: 0;
                    top: -3px;
                    width: 3px;
                    height: 30px;
                    z-index: -1;
                    transition: $transition;
                    background-color: #2362bc;
                }
                &:last-child {
                    margin-bottom: 0;
                }
                a {
                    display: block;
                    z-index: 1;
                    color: $grey-color;
                    font-weight: 500;
                }
            }
        }
    }
    .blog-details-tags {
        h3 {
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 30px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                display: inline-block;
                margin-bottom: 8px;
                margin-right: 4px;

                a {
                    display: block;
                    font-size: $all-size;
                    color: $grey-color;
                    background-color: #e5e5e5;
                    padding: 12px 25px;
                    border-radius: 8px;

                    &:hover {
                        color: $white-color;
                        background-color: $grey-color;
                    }
                }
            }
        }
    }
}
.blog-details-form {
    position: relative;

    .blog-details-shape {
        position: absolute;
        top: 130px;
        right: 0;
        width: 360px;  
        animation: a-six 5s infinite linear;  
    }
    .blog-details-form-wrap {
        max-width: 770px;

        h2 {
            font-weight: 600;
            font-size: 25px;
            margin-bottom: 30px;
        }
        .form-group {
            margin-bottom: 30px;

            textarea {
                height: auto !important;
                padding: 20px;
                z-index: 1;
                position: relative;
            }
            .form-control {
                height: 50px;
                padding-left: 20px;
                border-radius: 6px;
                border: 0;
                background-color: #fafafa; 
                box-shadow: none;
            }
            ::placeholder {
                color: $grey-color;
            }
        }
        .blog-details-form-btn {
            color: $white-color;
            font-weight: 600;
            font-size: $all-size;
            padding: 15px 34px;
            background-color: $main-color;
            transition: $transition;

            &:hover {
                color: $white-color;
                background-color: $grey-color;
            }
        }
    }
}
/*-- End Blog Details --*/

/*-- Blog --*/
.blog-area-two {
    .section-title {
        margin-bottom: 0;

        h2 {
            font-weight: 600;
            font-size: 22px;
            margin-bottom: 30px;
            padding-bottom: 0;

            &:before {
                display: none;
            }
        }
    }
}
/*-- End Blog --*/
/*----- End Blog Details Page -----*/

/*----- Contact Page -----*/
/*-- Page Title --*/
.page-title-five {
    background-image: url('/images/page-banner3.jpg');
}
/*-- End Page Title --*/

/*-- Location --*/
.location-wrap {
    .location-item {
        margin-bottom: 30px;
        text-align: center;
        border: 1px solid #eee;
        padding: 30px 15px;

        i {
            display: inline-block;
            width: 75px;
            height: 75px;
            line-height: 75px;
            border-radius: 50%;
            color: $white-color;
            text-align: center;
            font-size: 32px;
            margin-bottom: 25px;
            background-color: $main-color;
        }
        h3 {
            font-weight: 600;
            font-size: 25px;
            margin-bottom: 15px;
        }
        p {
            margin-bottom: 0;
        }
        a {
            display: inline-block;
            color: $main-color;

            &:hover {
                color: $grey-color;
            }
        }
    }
}
/*-- End Location --*/

/*-- Drop --*/
.drop-img {
    background-image: url('/images/contact-form-bg.png');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;

    img {
        display: none;
    }
}
.drop-area {
    .speciality-right-three {
        border-radius: 0;
    }
}
.drop-item {
    .drop-left {
        max-width: 560px;
        margin-left: auto;
        margin-right: auto;
        padding-top: 100px;
        padding-bottom: 100px;
        h2 {
            font-weight: 600;
            font-size: 32px;
            margin-bottom: 25px;
            padding-right: 50px;
            line-height: 1.4;
        }
        .form-group {
            margin-bottom: 30px;

            .form-control {
                height: 50px;
                background-color: $white-color;
                padding-left: 20px;
                border: none;
                box-shadow: 0px 0px 15px 0px #dddddda3;
            }
            textarea {
                padding-top: 20px;
                height: auto !important;
            }
        }
        .drop-btn {
            font-weight: 600;
            font-size: $all-size;
            color: $white-color;
            padding: 14px 35px;
            transition: $transition;
            background-color: $main-color;
            box-shadow: none;
            border: 0;
            &:hover {
                color: $white-color;
                background-color: $grey-color;
            }
        }
        .list-unstyled {
            color: #dc3545;
            font-size: 13px;
            margin-top: 10px;
        }
        .text-danger {
            color: #dc3545;
            margin-top: 25px;
            margin-bottom: 0;
            font-size: 24px;
        }
        .text-success {
            color: #28a745;
            margin-top: 25px;
            font-size: 24px;
        }
    }
}
/*-- End Drop --*/

/*-- Map --*/
#map {
    height: 600px;
}
/*-- End Map --*/
/*----- End Contact Page -----*/

/*----- FAQ PAGE -----*/
/*-- Faq --*/
.faq-head {
    h2 {
        margin-bottom: 35px;
        font-weight: 600;
        font-size: 25px;
    }
}
.faq-wrap {
    margin-bottom: 50px;

    &:last-child {
        margin-bottom: 30px;
    }
}
/*-- End Faq --*/

/*-- Footer --*/
.footer-two {
    padding-top: 100px;
}
/*-- End Footer --*/
/*----- END FAQ PAGE -----*/

/*----- ERROR PAGE -----*/
/*-- 404 --*/
.error-item {
    height: 100vh;
    text-align: center;
    padding: 50px 20px;

    h1 {
        font-size: 100px;
        font-weight: 700;
        margin-bottom: 0;
    }
    p {
        margin-bottom: 10px;
        font-weight: 600;
        font-size: 35px;
        color: #000000;
    }
    span {
        display: block;
    }
    a {
        display: inline-block;
        color: $white-color;
        background-color: $main-color;
        border-radius: 10px;
        padding: 15px 30px;
        margin-top: 30px;
        font-size: 17px;

        &:hover {
            background-color: $black-color;
        }
    }
}
/*-- End 404 --*/
/*----- END ERROR PAGE -----*/

/*----- COMING SOON PAGE -----*/
/*-- Coming --*/
.coming-item {
    height: 100vh;
    text-align: center;

    h1 {
        font-size: 75px;
        font-weight: 700;
        font-style: italic;
        margin-bottom: 20px;
    }
    p {
        margin-bottom: 40px;
        max-width: 865px;
        margin-left: auto;
        margin-right: auto;
    }
    .coming-wrap {
        max-width: 700px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 30px;

        .coming-inner{
            text-align: center;
            background-color: #efefef;
            padding-top: 15px;
            padding-bottom: 12px;
            margin-bottom: 30px;
        
            #days, #hours, #minutes, #seconds {
                font-size: 40px;
                font-weight: 600;
                color: #232323;
                margin-bottom: 5px;
            }
            span {
                font-size: 16px;
                font-style: italic;
                display: block;
                font-weight: normal;
            }
        }
    }
    ul {
        margin: 0;
        padding: 0;

        li {
            list-style-type: none;
            display: inline-block;
            margin-right: 2px;
            margin-left: 2px;

            a {
                display: block;
                color: $white-color;
                background-color: #232323;
                width: 35px;
                height: 35px;
                line-height: 35px;
                border-radius: 50%;
                font-size: 15px;

                &:hover {
                    background-color: $main-color;
                }
            }
        }
    }
}
/*-- End Coming --*/
/*----- END COMING SOON PAGE -----*/

/*----- TESTIMONIAL PAGE -----*/
/*-- Testimonial --*/
.testimonial-area {
    background-image: url('/images/testimonial-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    text-align: center;
    position: relative;

    &:before {
        position: absolute;
        content: '';
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background-color: $main-color;
        opacity: .50;
    }
    .owl-theme .owl-nav {
        margin-top: 25px;
    }
    .testimonial-wrap {
        background-color: $white-color;
        border-radius: 10px;
        position: relative;
        max-width: 830px;
        margin-left: auto;
        margin-right: auto;
        padding: 50px 50px 60px;

        h2 {
            font-weight: 700;
            font-size: 38px;
            margin-bottom: 50px;
        }
        .testimonial-slider {
            .owl-prev {
                width: 40px;
                height: 40px;
                line-height: 40px !important;
                border-radius: 50% !important;
                color: $white-color !important;
                background-color: #232323 !important;
                font-size: 25px !important;
                transition: $transition;

                &:hover {
                    background-color: $main-color !important;
                }
            } 
            .owl-next {
                width: 40px;
                height: 40px;
                line-height: 40px !important;
                border-radius: 50% !important;
                color: $white-color !important;
                background-color: #232323 !important;
                font-size: 25px !important;
                transition: $transition;

                &:hover {
                    background-color: $main-color !important;
                }
            }  
            .testimonial-item {
                img {
                    width: 120px;
                    height: 120px;
                    border-radius: 50%;
                    margin-left: auto;
                    margin-right: auto;
                    margin-bottom: 30px;
                }
                h3 {
                    font-weight: 600;
                    font-size: 26px;
                    margin-bottom: 15px;
                }
                p {
                    margin-bottom: 0;
                    max-width: 620px;
                    margin-left: auto;
                    margin-right: auto;
                }
            }
        }
    }
}
/*-- End Testimonial --*/
/*----- END TESTIMONIAL PAGE -----*/

/*----- SIGN UP PAGE -----*/
/*-- Sign Up --*/
.signup-left {
    background-image: url('/images/signup-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;

    img {
        display: none;
    }
}
.signup-item {
    max-width: 590px;
    margin-left: auto;
    margin-right: auto;

    .signup-head {
        margin-bottom: 40px;

        h2 {
            font-weight: 700;
            font-size: 38px;
            padding-bottom: 15px;
            margin-bottom: 15px;
            position: relative;

            &:before {
                position: absolute;
                content: '';
                left: 0;
                bottom: 0;
                width: 80px;
                height: 5px;
                background-color: $main-color;
                border-radius: 5px;
            }
        }
        p {
            font-weight: 500;
            font-size: 16px;
            margin-bottom: 0;

            a {
                display: inline-block;
                color: $main-color;

                &:hover {
                    color: $black-color;
                }
            }
        }
    }
    .signup-form {
        .form-group {
            margin-bottom: 30px;

            .form-control {
                height: 45px;
                border: 1px solid $grey-color;
                padding-left: 20px;
                font-size: $all-size;

                &:focus {
                    border: 1px solid $main-color;
                    box-shadow: none;
                }
            }
            .form-check {
                .form-check-input {
                    width: 15px !important;
                    height: 15px !important;
                    top: 3px;
                    margin-top: 0;
                }
                label {
                    color: $grey-color;

                    a {
                        display: inline-block;
                        color: $main-color;
    
                        &:hover {
                            color: $black-color;
                        }
                    }
                }
            }
            ::placeholder {
                color: $grey-color;
            }
            .forgot-pass {
                a {
                    color: $grey-color;
                    display: inline-block;
                    border-bottom: 2px solid $main-color;

                    &:hover {
                        color: $main-color;
                    }
                }
            }
        }
        .signup-btn {
            color: $white-color;
            background-color: $main-color;
            width: 100%;
            display: block;
            border-radius: 5px;
            font-size: 18px;
            font-weight: 500;
            padding-top: 10px;
            padding-bottom: 10px;
            margin-top: 5px;
            transition: $transition;

            &:hover {
                background-color: #232323;
            }
        }
    }
}
/*-- End Sign Up --*/
/*----- END SIGN UP PAGE -----*/

/*----- LOGIN PAGE -----*/
/*-- Login --*/
.login-left {
    background-image: url('/images/login-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;

    img {
        display: none;
    }
}
/*-- End Login --*/
/*----- END LOGIN PAGE -----*/

/*----- PRIVACY POLICY PAGE -----*/
/*-- Privacy --*/
.privacy-area {
    h2 {
        font-size: 26px;
        margin-bottom: 15px;
        font-weight: 600;
    }
    p {
        margin-bottom: 15px;
        &:last-child {
            margin-bottom: 0;
        }
    }
    ul {
        li {
            margin-bottom: 15px;
            &:last-child {
                margin-bottom: 0;
            }
        }
    }
}
/*-- End Privacy --*/
/*----- END PRIVACY POLICY PAGE -----*/

/*----- DEPARTMENTS PAGE -----*/
/*-- Department --*/
.department-item {
    text-align: center;
    border: 1px solid $main-color;
    padding-top: 30px;
    padding-bottom: 30px;
    transition: $transition;
    margin-bottom: 30px;
    position: relative;
    z-index: 1;

    &:before {
        position: absolute;
        content: '';
        width: 0;
        height: 100%;
        left: 0;
        top: 0;
        z-index: -1;
        background-color: $main-color;
        transition: $transition;
    }
    &:after {
        position: absolute;
        content: '';
        width: 0;
        height: 100%;
        right: 0;
        top: 0;
        z-index: -1;
        background-color: $main-color;
        transition: $transition;
    }
    &:hover {
        &:before {
            width: 51%;
        }
        &:after {
            width: 50%;
        }

        i {
            color: $white-color;
        }
        h3 {
            color: $white-color;
        }
        p {
            color: $white-color;
        }
    }
    i {
        font-size: 45px;
        display: block;
        margin-bottom: 20px;
        color: $main-color;
        transition: $transition;
    }
    h3 {
        margin-bottom: 12px;
        font-size: 26px;
        font-weight: 600;
        transition: $transition;
    }
    p {
        margin-bottom: 0;
        padding-left: 15px;
        padding-right: 15px;
        transition: $transition;
    }
}
/*-- End Department --*/
/*----- END DEPARTMENTS PAGE -----*/

/*----- SERVICES DETAILS PAGE -----*/
/*-- Service Details --*/
.services-details-img {
    margin-bottom: 50px;

    img {
        width: 100%;
        margin-bottom: 30px;
    }
    h2 {
        font-weight: 600;
        font-size: 28px;
        margin-bottom: 16px;
    }
    P {
        margin-bottom: 20px;
    }
    blockquote {
        font-size: $all-size;
        color: $grey-color;
        background-color: #0046c014;
        padding: 30px 75px;
        line-height: 26px;
        position: relative;
        margin-bottom: 20px;

        i {
            position: absolute;
            display: inline-block;
            top: 20px;
            left: 38px;
            font-size: 32px;
        }
    }
}
.service-details-inner-left {
    background-image: url('/images/signup-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    
    img {
        display: none;
    }
}
.service-details-inner {
    max-width: 580px;
    margin-left: auto;
    margin-right: auto;

    h2 {
        font-weight: 600;
        font-size: 30px;
        margin-bottom: 15px;
    }
    p {
        margin-bottom: 0;
    }
}
/*-- End Service Details --*/
/*----- END SERVICES DETAILS PAGE -----*/

/*----- ABOUT PAGE -----*/
/*-- Counter --*/
.counter-area-four {
    margin-top: 0;
    margin-bottom: 100px;
}
/*-- End Counter --*/
/*----- END ABOUT PAGE -----*/

/*-- Back To Top --*/
#toTop {
	position: fixed;
	bottom: 30px;
    right: 0;
	cursor: pointer;
    display: none;
    z-index: 10;
}
.go-top {
    position: fixed;
    right: 10px;
    bottom: 25px;
    transform: scale(0);
    transition: .5s;
    cursor: pointer;
    &.active {
        transform: scale(1);
    }
    i {
        background-color: $main-color;
        color: $white-color;
        height: 50px;
        width: 50px;
        line-height: 50px;
        display: inline-block;
        text-align: center;
        font-size: 26px;
        border-radius: 50%;
        transition: $transition;
        margin-right: 28px;
        box-shadow: 0px 0px 14px 0px $main-color;
    
        &:hover {
            background-color: $black-color;
            color: $white-color;
            box-shadow: 0px 0px 14px 0px $black-color;
        }
    }
}
/*-- End Back To Top --*/

/*----- Home Four CSS -----*/
.slider-item-two {
    overflow: hidden;

    &:before {
        background-color: #000111;
    }
    .slider-shape {
        img {
            top: -75px;
            right: 0;
            animation: item-two-ani 35s infinite linear;
        }
    }
    .slider-text {
        h1 {
            margin-bottom: 25px;
            line-height: 60px;
        }
    }
}
@keyframes item-two-ani {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(180deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.about-area-two {
    .about-item {
        p {
            margin-bottom: 10px;
        }
        a {
            margin-top: 20px;
        }
    }
}
.service-area-two {
    .section-title {
        max-width: 415px;
    }
}
.symptoms-img {
    margin-bottom: 30px;

    img {
        border-radius: 10px;
        width: 100%;
    }
}
.symptoms-content {
    .section-title {
        margin-bottom: 30px;
    }
    .section-title-two {
        max-width: 100%;
    }
    p {
        margin-bottom: 20px;
    }
    ul {
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        margin-left: -10px;
        margin-right: -10px;

        li {
            list-style-type: none;
            display: inline-block;
            flex: 0 0 50%;
            max-width: 50%;
            padding-right: 10px;
            padding-left: 10px;
            margin-bottom: 30px;
            position: relative;

            span {
                display: block;
                position: relative;
                box-shadow: 0px 0px 20px 0px #dddddd80;
                color: $black-color;
                font-weight: 600;
                font-size: 16px;
                padding: 12px 10px 14px 40px;
                border-radius: 5px;
                z-index: 1;
                transition: $transition;

                &:hover {
                    color: $white-color;

                    i {
                        color: $white-color;
                    }
                    &:before {
                        height: 100%;
                        border-radius: 5px;
                    }
                }
                &:before {
                    position: absolute;
                    content: '';
                    width: 100%;
                    height: 2px;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    background-color: $main-color;
                    border-radius: 0 0 5px 5px;
                    z-index: -1;
                    transition: $transition;
                }
                i {
                    display: inline-block;
                    color: $main-color;
                    font-size: 30px;
                    position: absolute;
                    top: 9px;
                    left: 10px;
                    transition: $transition;
                }
            }
        }
    }
}
.faq-area-two {
    background-color: #4f87fb;
    position: relative;

    .faq-shape {
        img {
            position: absolute;

            &:nth-child(1) {
                top: 0;
                right: 0;
            }
            &:nth-child(2) {
                left: 0;
                bottom: 0;
            }
        }
    }
    .section-title {
        text-align: center;

        h2 {
            color: $white-color;
            display: inline-block;

            &:before {
                background-color: #fff;
            }
        }
    }
    .faq-img {
        margin-bottom: 30px;
        background-image: url('/images/faq-main.jpg');
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
        width: 100%;
        height: 100%;
        text-align: center;
        position: relative;

        img {
            width: 100%;
            display: none;
        }
        .popup-youtube {
            display: inline-block;
            width: 80px;
            height: 80px;
            line-height: 80px;
            border-radius: 50%;
            color: #fff;
            background-color: #4f87fb;
            position: absolute;
            top: 50%;
            left: 20%;
            right: 0;
            margin-left: auto;
            margin-right: auto;
            font-size: 30px;
            cursor: pointer;
            z-index: 1;
            text-align: center;
            transform: translateY(-50%) translateX(-50%);

            &:hover {
                background-color: #232323;
            }
        }
    }
}

.accordion {
    border: none;
    .accordion__item {
        -webkit-box-shadow: 0 0 1.25rem rgba(108, 118, 134, 0.1);
        box-shadow: 0 0 1.25rem rgba(108, 118, 134, 0.1);
        background: transparent;
        margin-bottom: 10px;
        position: relative;
        border: none;

        &:last-child {
            margin-bottom: 0;
        }
    }
    .accordion__button {
        border-bottom: none;
        color: #fff;
        cursor: pointer;
        padding: 15px 35px 15px 18px;
        margin: 0;
        text-decoration: none;
        transition: 0.5s;
        position: relative;
        font-size: 15px;
        font-weight: 700;
        background: transparent;
        border: 1px solid #ffffff;
        border-radius: 8px 8px 0 0;

        &:hover, &[aria-expanded="true"] {
            background-color: $main-color;
            color: #fff;
            border: 1px solid $main-color;
        }
        &:focus {
            outline: 0;
        }
        span {
            &::before {
                position: absolute;
                height: 100%;
                width: 40px;
                content: '';
                right: 0;
                top: 0;
                z-index: 0;
            }
        }

        &:before {
            margin-right: 0;
            border-bottom: 3px solid #fff;
            border-right: none;
            transform: rotate(0deg);
            height: 13px;
            width: 13px;
            position: absolute;
            right: 15px;
            top: 25%;
            z-index: 1;
        }
        &::after {
            content: '';
            margin-right: 0;
            border-right: 3px solid #fff;
            transform: rotate(0deg);
            margin-top: 5px;
            height: 13px;
            width: 13px;
            position: absolute;
            right: 20px;
            top: 25%;
            z-index: 1;
        }

        &[aria-expanded='true']::after, &[aria-selected='true']::after {
            display: none;
        }
        &[aria-expanded='true']::before, &[aria-selected='true']::before {
            transform: rotate(0deg);
        }
    }

    .accordion__panel {
        padding: 15px; 
        p {
            color: #fff;
            &:last-child {
                margin-bottom: 0;
            }
        }
    }
}
/*----- End Home Four CSS -----*/

/*----- Home Five CSS -----*/
.slider-item-three-img {
    background-image: url('/images/home-five/home-five-slider1.jpg');
}
.slider-item-three-img-two {
    background-image: url('/images/home-five/home-five-slider2.jpg');
}
.home-slider-three {
    .owl-dots {
        display: none !important;
    }
}
.slider-item-three {
    overflow: hidden;

    &:before {
        display: none;
    }
    .slider-text {
        margin-top: -30px;

        span {
            display: inline-block;
            color: #111111;
            font-size: 15px;
            font-weight: 500;
            position: relative;
            padding-left: 25px;
            margin-bottom: 20px;

            &:before {
                position: absolute;
                content: '';
                width: 15px;
                height: 3px;
                left: 0;
                bottom: 10px;
                background-color: #2459b8;
                border-radius: 10px;
            }
        }
        h1 {
            font-size: 60px;
            margin-bottom: 25px;
            color: #111111;
        }
        p {
            font-weight: 500;
            margin-bottom: 30px;
            font-size: 22px;
            color: #111111;
        }
        .common-btn {
            a {
                color: #fff;
                background-color: #0046c0;
    
                &:hover {
                    border: 2px solid #111111;
                    background-color: #111111;
                }
            }
            .cmn-btn-right {
                background-color: transparent;
                color: #0046c0;
                border: 2px solid #0046c0;

                &:hover {
                    background-color: #0046c0;
                    color: #fff;
                    border: 2px solid #0046c0;
                }
            }
        }
    }
    .slider-shape {
        img {
            top: -65px;
            right: 0;
            animation: item-two-ani 40s infinite linear;
        }
    }
}
.spread-area {
    .spread-img {
        margin-bottom: 30px;

        img {
            border-radius: 10px;
            width: 100%;
        }
    }
    .spread-content {
        .section-title-two {
            margin-bottom: 25px;
            max-width: 100%;
        }
        p {
            margin-bottom: 25px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                list-style-type: none;
                display: block;
                position: relative;
                margin-bottom: 30px;
                padding-left: 105px;

                &:hover {
                    img {
                        animation: item-two-ani 5s infinite linear;
                    }
                }
                img {
                    position: absolute;
                    top: 0;
                    left: 0;
                    animation: none;
                    transition: $transition;
                }
                h3 {
                    font-weight: 600;
                    font-size: 20px;
                }
                p {
                    margin-bottom: 0;
                }
            }
        }
    }
}
/*----- End Home Five CSS -----*/

.map-area {
    iframe {
        border: none;
        width: 100%;
    }
}

.faq-content {
    margin-bottom: 50px;

    &:last-child {
        margin-bottom: 0;
    }

    h2 {
        margin-bottom: 25px;
        font-weight: 600;
        font-size: 25px;
    }

    .accordion {
        .accordion__button {
            border: 1px solid #232323;
            color: #232323;

            &:hover, &[aria-expanded="true"] {
                background-color: $main-color;
                color: #fff;

                &:before {
                    border-bottom: 3px solid #fff;
                }
                &:after {
                    border-right: 3px solid #fff;
                }
            }

            &:before {
                border-bottom: 3px solid #232323;
            }
            &:after {
                border-right: 3px solid #232323;
            }
        }
        .accordion__item {
            margin-bottom: 25px;
        }
        .accordion__panel p {
            color: #344c5d;
        }
    }
}