.slide-page {
    position           : fixed;
    top                : 0;
    left               : 0;
    width              : 100%;
    height             : 100vh;
    z-index            : 99;
    overflow           : hidden;
    visibility         : hidden;
    transform          : translateY(-100%);
    transition         : visibility 0s 0.6s, transform 0.6s ease-in-out;
    background         : url(../uploads/other/slide-background.webp);
    background-position: center;
    background-size    : cover;
    color              : #fff;
    padding            : 100px;

    .main-slide-content {
        display        : flex;
        justify-content: space-between;
        padding-top    : 100px;

        a {
            color: #fff
        }

        .social-media {
            ul {
                display    : flex;
                align-items: center;
                gap        : 15px
            }

            img {
                width: 64px
            }
        }

        .box {
            display       : flex;
            flex-direction: column;
            gap           : 15px;

            a {
                font-size: 24px
            }
        }

        .limo-details {
            display       : flex;
            flex-direction: column;
            gap           : 30px
        }

        .limo-book {
            text-align: center;

            .site-logo {
                margin-bottom: 50px
            }
        }

        .primary-btn a {
            background-color: #d7b65d
        }
    }

    .close-button {
        position : absolute;
        top      : 0;
        right    : 50px;
        font-size: 40px
    }
}

.close-button {
    cursor          : pointer;
    margin-top      : 20px;
    padding         : 10px 20px;
    background-color: #000;
    border          : none;
    border-radius   : 5px;
    color           : #fff
}

.slide-page.visible {
    visibility: visible;
    transform : translateY(0);
    transition: visibility 0s, transform 0.6s ease-in-out
}

header {
    padding        : 15px 100px;
    display        : flex;
    justify-content: space-between;
    align-items    : center;

    .logo {
        img {
            width: 300px
        }
    }

    .logo-white {
        display: none
    }

    .primary-menu {
        text-align: center;

        nav {
            ul {
                display    : flex;
                align-items: center;
                gap        : 10px
            }

            li a {
                padding  : 8px 8px;
                font-size: 18px;
                color    : #000
            }
        }
    }

    .site-details {
        cursor: pointer;

        img {
            width: 40px
        }

        svg {
            width : 50px;
            height: 50px
        }
    }
}

.hero-section {
    padding      : 0 100px;
    height       : 750px;
    overflow     : hidden;
    border-radius: 20px;

    .hero-video {
        border-radius: 20px;
        display      : flex;
        height       : 750px;
        position     : relative;

        .phone {
            display: none
        }
    }

    video {
        border-radius: 20px;
        object-fit   : cover
    }
}

.feature {
    width   : 100%;
    position: absolute;
    bottom  : 58px;
    left    : 0;

    .main-feature {
        display      : flex;
        width        : 100%;
        padding      : 0 100px;
        border-radius: 0 0 20px 20px
    }

    .item {
        background: rgb(0 0 0 / 48%);
        display   : flex;
        flex      : 1;
        gap       : 20px;
        padding   : 20px 30px;
        color     : #fff;

        img {
            width        : 80px;
            border-radius: 50%;
            height       : 100%
        }

        h5 {
            margin-bottom: 10px
        }

        p {
            font-size: 14px
        }
    }

    .item:nth-child(2) {
        border-left : 1px solid #ccc;
        border-right: 1px solid #ccc
    }
}

.service-section {
    padding: 100px 0 0;

    .main-service {
        display: flex;
        gap    : 30px
    }

    .box1 {
        width         : 40%;
        display       : flex;
        flex-direction: column;
        gap           : 30px
    }

    .box2 {
        width  : 60%;
        display: flex;
        gap    : 30px;

        .box2-item-col1 {
            width: 50%
        }
    }

    .service-item {
        .item {
            position: relative;
            height  : 100%;
            overflow: hidden;

            .item-img {
                display      : flex;
                border-radius: 15px;
                overflow     : hidden;
                height       : 100%;

                img {
                    object-fit: cover;
                    transition: all .3s linear;
                    transform : scale(1)
                }
            }

            .item-content {
                position: absolute;
                bottom  : 0;
                left    : 0;
                padding : 20px;

                .title {
                    padding         : 15px 20px;
                    display         : inline-block;
                    background-color: #fff;
                    border-radius   : 10px;
                    font-weight     : 600;
                    text-transform  : capitalize
                }

                a {
                    color: #000
                }
            }
        }
    }

    .dec {
        opacity   : 0;
        height    : 0;
        transition: all .3s linear;
        color     : #fff;

        p {
            transition: all .3s linear
        }
    }

    .group-item {
        width         : 50%;
        display       : flex;
        flex-direction: column;
        gap           : 30px;

        .service-item {
            height: 50%
        }
    }

    .service-item:hover .item-img img {
        transform: scale(1.1)
    }

    .service-item:hover .dec {
        opacity   : 1;
        height    : auto;
        transition: all .3s linear
    }

    .service-item:hover .item-content {
        background: linear-gradient(#fff0, rgb(0 0 0 / .5))
    }
}

.about-section {
    .main-about {
        display: flex;
        gap    : 50px;

        .about-img {
            width: 50%
        }

        .about-content {
            width         : 50%;
            display       : flex;
            flex-direction: column;
            gap           : 15px
        }
    }
}
.about-content h3{
    font-size: 50px;
}
.quote {
    background         : url(../uploads/other/about-sky.webp);
    background-position: center;
    background-size    : cover;
    text-align         : center;
    padding            : 100px 0 0 0;

    .tagline {
        display    : inline-block;
        font-size  : 24px;
        font-family: "Taviraj", serif;
        width      : 30%;
        margin     : 0 auto
    }

    h3 {
        font-size: 160px
    }

    .text-style {
        display: block;
        color  : #d7b65d
    }
}

.why-choose {
    background-color: #192026;
    padding         : 200px 0 0;
    margin-top      : -120px;
    margin-bottom   : 150px;

    .main-why-choose {
        display: flex;
        gap    : 40px
    }

    .img-box {
        width        : 45%;
        margin-bottom: -100px
    }

    .content-box {
        width: 55%;
        color: #fff;

        .text-style {
            color: #d7b65d
        }
    }

    .why-choose-items {
        margin-top           : 40px;
        display              : grid;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        grid-gap             : 20px;
        align-items          : stretch;

        .item {
            text-align: center;
            padding   : 30px;

            img {
                width : 100px;
                height: 100px
            }
        }
    }
}

.our-fleet {
    .fleet-content {
        display        : flex;
        align-items    : center;
        width          : 60%;
        margin         : 0 auto;
        gap            : 40px;
        justify-content: center;

        h3 {
            width    : 40%;
            font-size: 50px
        }

        p {
            width: 60%
        }
    }

    .fleet-items {
        width   : 85%;
        margin  : 60px 0 0 auto;
        position: relative;

        .img-box {
            padding         : 30px;
            background-color: #ebebeb;
            border-radius   : 20px;
            transition      : all .2s linear;

            img {
                transition: all .2s linear
            }
        }

        .item-content {
            display        : flex;
            justify-content: space-between;
            align-items    : center;
            padding        : 20px 30px
        }

        .siter {
            padding         : 10px;
            background-color: #000;
            color           : #fff;
            border-radius   : 10px;
            display         : flex;
            align-items     : center;
            gap             : 10px
        }

        .item:hover .img-box {
            background-color: #eef3e6
        }

        .item:hover img {
            transform: scale(1.1)
        }
    }

    .owl-theme .owl-nav {
        position: absolute;
        top     : -80px;
        right   : 50px;
        display : flex;

        button {
            width          : 50px;
            height         : 50px;
            background     : #000;
            border-radius  : 50%;
            color          : #fff;
            font-size      : 35px;
            display        : flex;
            align-items    : center;
            justify-content: center
        }
    }

    .owl-theme .owl-dots .owl-dot span {
        width : 50px;
        height: 4px
    }
}

.cta {
    background         : linear-gradient(rgb(0 0 0 / .3), rgb(0 0 0 / .3)), url(../uploads/other/cta-banner.webp);
    background-position: center;
    background-size    : cover;
    color              : #fff;
    padding            : 100px 0;

    .cta-main {
        display        : flex;
        justify-content: space-between;
        align-items    : center
    }

    h3 {
        font-size: 60px;
        width    : 50%
    }

    .primary-btn a {
        background-color: #d7b65d
    }
}

.testimonial {
    background         : url(../uploads/other/testimonial-bg.webp);
    background-position: center;
    background-size    : cover;

    h3 {
        text-align: center
    }

    .testimonial-items {
        margin-top: 40px
    }

    .item-header {
        display        : flex;
        align-items    : center;
        justify-content: space-between;
        padding-bottom : 20px
    }

    .items {
        background-color: #fff;
        border-radius   : 20px;
        padding         : 20px;

        p {
            border-top : 1px solid #ccc;
            padding-top: 20px
        }
    }

    .google-review-icon {
        img {
            width: 120px
        }
    }

    .author {
        font-size  : 20px;
        font-weight: 600
    }
}

footer {
    background-color: #192026;
    color           : #fff;

    a {
        color: #fff
    }

    .top-footer {
        .footer-main {
            padding        : 50px 0 30px;
            display        : flex;
            gap            : 15px;
            flex-wrap      : wrap;
            justify-content: space-between
        }

        .about-box {
            width: 30%
        }

        h5 {
            margin-bottom: 20px
        }

        ul {
            a {
                padding: 5px 0;
                display: block
            }
        }
    }

    .bottom-footer {
        padding-top: 20px;
        border-top : 1px solid #ccc;
        text-align : center;
        font-size  : 14px;

        img {
            width: 90px
        }
    }

    .contact-box {
        ul {
            li a {
                display    : flex;
                gap        : 15px;
                align-items: center
            }
        }
    }
}

.inner-page {
    header {
        position: absolute;
        top     : 0;
        width   : 100%;

        .logo {
            display: none
        }

        .logo-white {
            display: block;

            img {
                width: 300px
            }
        }

        .primary-menu {
            nav {
                li a {
                    padding  : 8px 8px;
                    font-size: 18px;
                    color    : #fff
                }
            }
        }

        .site-details {
            svg {
                width : 50px;
                height: 50px;
                fill  : #fff
            }
        }
    }

    .inner-banner {
        padding: 200px 0 120px;

        .content {
            text-align: center;
            color     : #fff;

            a {
                color: #d7b65d
            }
        }
    }
}

.about-page {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/about-inner-banner.webp);
        background-position: center;
        background-size    : cover
    }

    .about-img {
        img {
            border-radius: 20px;
            box-shadow   : 0 0 12px #22222242
        }
    }
}

.book-page {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/book-now.webp);
        background-position: center;
        background-size    : cover
    }

    .main-form {
        width           : 80%;
        margin          : 0 auto;
        background-color: #d7b65d;
        padding         : 30px;
        border-radius   : 10px
    }
}

.contact-page {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/contact-banner.webp);
        background-position: center;
        background-size    : cover
    }

    .main-contact-section {
        display: flex;
        gap    : 50px;

        .contact-details {
            width         : 50%;
            display       : flex;
            flex-direction: column;
            gap           : 20px;

            .details-main {
                display       : flex;
                flex-direction: column;
                gap           : 20px;
                margin-top    : 30px
            }

            .item {
                display    : flex;
                gap        : 20px;
                align-items: center;

                img {
                    width: 60px
                }

                h5 {
                    margin-bottom: 10px
                }

                a {
                    font-size: 18px;
                    color    : #222
                }
            }
        }

        .contact-form {
            width: 50%;

            .main-form {
                padding         : 20px;
                background-color: #d7b65d;
                border-radius   : 20px
            }
        }
    }

    .map-section {
        display: flex;

        iframe {
            width : 100%;
            height: 350px
        }
    }
}

form {
    display       : flex;
    flex-direction: column;
    gap           : 15px;

    .group-box {
        display: flex;
        gap    : 20px;

        .box {
            width: 50%
        }
    }

    .box {
        width: 100%
    }

    label {
        display      : block;
        margin-bottom: 5px
    }

    input,
    textarea,
    select {
        width  : 100%;
        padding: 10px
    }

    input[type="submit"] {
        padding         : 15px 15px;
        font-size       : 16px;
        background-color: #000;
        color           : #fff;
        width           : 170px;
        border          : none;
        display         : inline-block
    }
}

.blog-page {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/blog-banner.webp);
        background-position: center;
        background-size    : cover
    }

    .blog-grid {
        display              : grid;
        grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
        grid-gap             : 30px;
        align-items          : stretch
    }

    .date {
        padding   : 3px 10px;
        background: #d7b65d
    }

    .blog-item {
        background   : #e6e6e6;
        padding      : 20px;
        border-radius: 10px;
        box-shadow   : 0 0 12px #2222225b;

        .item-content {
            display       : flex;
            flex-direction: column;
            gap           : 12px;
            align-items   : self-start;

            .read-more a {
                color    : #795902;
                font-size: 18px
            }
        }
    }

    .main-blog-detail {
        display: flex;
        gap    : 30px;

        .blog-detail-content {
            display       : flex;
            flex-direction: column;
            align-items   : self-start;
            gap           : 20px;
            width         : 70%;

            .blog-title {
                font-size: 32px
            }

            .content-box {
                display       : flex;
                flex-direction: column;
                gap           : 15px
            }
        }
    }

    .blog-sidebar {
        width           : 30%;
        background-color: #e2e2e2;
        padding         : 20px;
        border-radius   : 10px;
        position        : relative;

        h5 {
            font-size: 26px
        }

        .sidebar-items {
            margin-top    : 30px;
            display       : flex;
            flex-direction: column;
            gap           : 20px;
            position      : sticky;
            top           : 50px
        }

        .item {
            display         : flex;
            align-items     : center;
            gap             : 15px;
            background-color: #fff;
            padding         : 0 10px 10px;
            box-shadow      : 0 0 7px #34343436
        }

        .item-img {
            width  : 200px;
            display: flex
        }

        .item-content {
            .date {
                font-size: 14px
            }

            p {
                font-size  : 14px;
                line-height: 1.5;
                margin-top : 10px
            }

            a {
                color: #000
            }
        }
    }
}

.service-area-page {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/service-area-banner.webp);
        background-position: center;
        background-size    : cover
    }
}

.service-area {
    .area-box {
        .box {
            display: flex;
            gap    : 40px
        }

        .area-img {
            width: 50%;

            img {
                border-radius: 15px;
                box-shadow   : 0 0 10px #22222242
            }
        }

        .area-content {
            display       : flex;
            flex-direction: column;
            gap           : 20px;
            width         : 50%;

            .area-grid {
                display  : flex;
                flex-wrap: wrap;
                gap      : 15px;

                li {
                    padding         : 8px 30px;
                    text-align      : center;
                    background-color: #d7b65d
                }
            }
        }
    }

    .area-box:nth-child(even) {
        background-color: #f4f4f4;

        .box {
            display       : flex;
            flex-direction: row-reverse
        }
    }
}

.service-page {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/service-banner.webp);
        background-position: center;
        background-size    : cover
    }

    .main-services-grid {
        display              : grid;
        grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
        grid-gap             : 30px;
        align-items          : stretch;

        .item {
            display         : flex;
            background-color: #d7b65d;
            box-shadow      : 0 0 12px #2222224f;

            .item-img {
                width  : 40%;
                display: flex;

                img {
                    object-fit: cover
                }
            }

            .item-content {
                width         : 60%;
                padding       : 20px 30px;
                display       : flex;
                flex-direction: column;
                gap           : 15px
            }
        }
    }
}

.service-detail-page {
    .main-service-detail {
        display: flex;
        gap    : 40px;

        .img-box {
            width: 50%;

            img {
                object-fit   : cover;
                border-radius: 15px;
                box-shadow   : 0 0 12px #ccc
            }
        }

        .content-box {
            width         : 50%;
            display       : flex;
            flex-direction: column;
            gap           : 20px
        }
    }
}

.airport-limo {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/airport-banner.webp);
        background-position: center;
        background-size    : cover
    }
}

.wedding-limo {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/wedding.webp);
        background-position: center;
        background-size    : cover
    }
}

.prom-limo {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/prom.webp);
        background-position: center;
        background-size    : cover
    }
}

.night-out-limo {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/night-out-banner.webp);
        background-position: center;
        background-size    : cover
    }
}

.birthday-party-limo {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/birthday-banner.webp);
        background-position: center;
        background-size    : cover
    }
}

.point-limo {
    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/point-banner.webp);
        background-position: center;
        background-size    : cover
    }
}

.fleet-page {
    h2 {
        text-align   : center;
        margin-bottom: 30px
    }

    .inner-banner {
        background         : linear-gradient(rgb(0 0 0 / .4), rgb(0 0 0 / .4)), url(../uploads/other/our-fleet.webp);
        background-position: right;
        background-size    : cover
    }

    .main-fleet-grid {
        display              : grid;
        grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
        grid-gap             : 30px;
        align-items          : stretch;

        .item {
            background-color: #d7b65d;
            border          : 1px solid #ccc;
            border-radius   : 15px;
            overflow        : hidden;
            box-shadow      : 0 0 12px #2222224d
        }

        .item-content {
            background-color: #d7b65d;
            padding         : 20px;
            display         : flex;
            flex-direction  : column;
            gap             : 10px;
            align-items     : self-start;

            p {
                font-size  : 16px;
                line-height: 1.5
            }

            .passenger {
                padding         : 4px 10px;
                background-color: #192026;
                color           : #fff
            }
        }

        .item-img {
            display   : flex;
            background: #f7ffed;
            padding   : 30px;

            img {
                transition: all .2s linear
            }
        }

        .item:hover img {
            transform: scale(1.1)
        }
    }
}

.box_two {
    width: 25%;
}

.content-box h2 {
    font-size: 28px;
}

.content-box h3 {
    font-size: 25px;
}

.seo-none {
    display: none;
}