/**
* Template Name: Groovin
* Template URL: https://bootstrapmade.com/groovin-free-bootstrap-theme/
* Updated: Mar 17 2024 with Bootstrap v5.3.3
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
    font-family: Montserrat;
    font-size: 14px;
    color: #a09e9c;
    text-transform: initial;
    max-width: 1920px;
    margin: 0 auto;
    overflow-x: hidden;
}

.dsno {
    display: none;
}

a {
    /*color: #5c9f24;*/
    text-decoration: none !important;
}

    a:hover {
        /*color: #74c92d;*/
        text-decoration: none;
    }

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Roboto", sans-serif;
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
    position: fixed;
    /*visibility: hidden;*/
    opacity: 1;
    right: 15px;
    bottom: 15px;
    z-index: 996;
    /*background: #5c9f24;*/
    width: 37px;
    height: 37px;
    border-radius: 4px;
    transition: all 0.4s;
    border: 1px solid;
}

    .back-to-top i {
        font-size: 20x;
        color: #fff;
        line-height: 0;
    }

    .back-to-top:hover {
        /*background: #6fc02c;*/
        /*color: #fff;*/
    }

    .back-to-top.active {
        visibility: visible;
        opacity: 1;
    }

.logo {
    font-size: 20px;
}

#logoimg {
    height: 40px;
}

/*Header*/
.header-top {
    border-bottom: 1px solid #f6f8fa;
}
/*-------------------------------------
        2. Header-top
--------------------------------------*/
/*.header-top {
    border-bottom: 1px solid #f6f8fa;
    margin: 0 auto;
    top: 0;
    width: 100%;
    z-index: 2;
    position: fixed;
    background-color: #fff;
    box-shadow: rgba(32, 33, 36, 0.15) 0px 1px 6px 0px;
    box-sizing: border-box;
}

.header-top ul {
    list-style: none;
    padding: 3px;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-top-left,
.header-top-right {
    display: flex;
    align-items: center;
}

.header-top-left ul,
.header-top-right ul {
    display: flex;
    gap: 15px; 
}

.header-top-left .logo img {
    max-width: 100px; 
}

.header-top-contact a {
    color: #333;
    text-decoration: none;
}

@media (max-width: 600px) {
     .header-top ul {
        flex-direction: column;
        align-items: flex-start;
        padding: 10px;
    }

    .header-top-left,
    .header-top-right {
        width: 100%;
        justify-content: space-between;
    }

    .header-top-left ul,
    .header-top-right ul {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }

    .header-top-left ul li,
    .header-top-right ul li {
        margin: 5px 0; /* Adjust spacing as needed */
}

.header-top-left .logo img {
    max-width: 80px; /* Adjust logo size for mobile */
}

}



.header-top-left li, .header-top-right li {
    display: inline-block;
}

/*.select-opt*/
.select-opt, .header-top-contact {
    padding: 10px 18px;
    border-right: 1px solid #f6f8fa;
}

.header-top-contact {
    border-right: 0;
    border-left: 1px solid #f6f8fa;
    font-size: 14px;
}

.select-opt select {
    border: none;
    cursor: pointer;
    color: #a7b0ba;
    font-size: 12px;
    font-weight: 300;
}

.select-opt option {
    color: #a7b0ba;
    text-transform: uppercase;
}

.select-opt a span.lnr-magnifier:before {
    font-size: 12px;
    color: #373939;
}

.select-opt a span.lnr-magnifier:before {
    font-size: 12px;
    color: #373939;
}
/*.select-opt*/

.header-top-right ul li a {
    color: #a7b0ba;
    font-size: 15px;
    font-weight: 400;
}

*/
/*-------------------------------------
        4.  Welcome-hero
--------------------------------------*/
#home {
    margin-top: 30px;
}

.welcome-hero {
    position: relative;
    background-position: center;
    background-size: cover;
    text-align: center;
    height: 90px;
    z-index: 1;
    padding: 15px;
    margin-top: 10px;
    width: 70% !important;
}

    .welcome-hero:before {
        position: absolute;
        content: " ";
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(65,73,89,.65);
        z-index: -1;
    }

.welcome-hero-txt {
    padding-top: 155px;
}

    .welcome-hero-txt h2 {
        font-size: 48px;
        color: #fff;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 2.4px;
        line-height: 1.4;
    }

    .welcome-hero-txt p {
        font-size: 18px;
        color: #fcfcfc;
        margin-top: 25px;
    }

.welcome-hero-serch-box {
    padding-top: 0;
    display: flex;
    margin-top: -4px;
}

.welcome-hero-form {
    display: flex;
    background: #fff;
    height: 70px;
    border-radius: 3px;
    width: 100%;
}

.single-welcome-hero-form {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    padding: 0 30px;
}

    /*.single-welcome-hero-form:first-child {
        border-right: 1px solid #edeff1;
    }*/

    .single-welcome-hero-form input {
        margin-left: 10px;
        height: 50px;
        width: 100%;
        border: 0;
        background: transparent;
        margin-bottom: 0.5rem;
        border-left: 1px solid #ddd;
    }

        .single-welcome-hero-form input[type="text"] {
            font-size: 25px;
            color: #363636;
            text-transform: capitalize;
            font-weight: 500;
        }

.welcome-hero-form-icon {
    position: absolute;
    top: 20px;
    right: 30px;
    color: #252d32;
}

.welcome-hero-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    color: #fff;
    width: 170px;
    height: 70px;
    background: #2197e0;
    text-transform: capitalize;
    margin-left: 30px;
    border-radius: 3px;
    -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
    -ms-transition: 0.3s linear;
    -o-transition: 0.3s linear;
    transition: 0.3s linear;
}

    .welcome-hero-btn:hover {
        background: #f8915a;
    }

    .welcome-hero-btn svg {
        width: 14px;
        height: auto;
        margin-left: 12px;
    }


/*-------------------------------------
        5. List-topuics
--------------------------------------*/
.list-topics-content {
    position: relative;
    top: 20px;
    z-index: 1;
}

    .list-topics-content ul li {
        display: inline-block;
        padding: 4px;
    }

.single-list-topics-icon {
    font-size: 20px;
}

.single-list-topics-content {
    display: flex;
    align-items: center;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    width: 100px;
    height: 100px;
    background: #fff;
    border-radius: 10px;
    /*margin-right: 5px;*/
    margin-bottom: 20px;
    box-shadow: 0 0px 10px rgba(71,71,71,.2);
    -webkit-transition: .3s linear;
    -moz-transition: .3s linear;
    -ms-transition: .3s linear;
    -o-transition: .3s linear;
    transition: .3s linear;
    padding: 5px;
}

    .single-list-topics-content h2 > a {
        margin: 13px 0;
    }
/*.single-list-topics-content:last-child{margin-right: 0;}*/

.single-list-topics-icon [class^="flaticon-"]:before, .single-list-topics-icon [class*=" flaticon-"]:before, .single-list-topics-icon [class^="flaticon-"]:after, .single-list-topics-icon [class*=" flaticon-"]:after {
    font-size: 45px;
    color: #343a3f;
}

.single-list-topics-content:hover .single-list-topics-icon [class^="flaticon-"]:before, .single-list-topics-content:hover .single-list-topics-icon [class*=" flaticon-"]:before, .single-list-topics-content:hover .single-list-topics-icon [class^="flaticon-"]:after, .single-list-topics-content:hover .single-list-topics-icon [class*=" flaticon-"]:after {
    color: #fff;
}

.single-list-topics-content:hover h2 > a, .single-list-topics-content:hover p {
    color: #fff !important;
}

.single-list-topics-content:hover {
    color: #fff;
    background: #f8915a;
    box-shadow: 0 5px 10px rgba(71,71,71,.4);
}

.marquee {
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    position: relative;
}

    .marquee ul {
        display: inline-flex;
        padding-left: 100%;
        animation: marquee 200s linear infinite;
        align-items: center;
        transition: animation-direction 0.5s; /* Smooth transition when reversing */
    }

        .marquee ul li {
            display: inline-block;
            padding: 6px;
        }

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

.marquee:hover ul {
    animation-play-state: paused; /* Pause animation on hover */
}

.reverse-direction .marquee ul {
    animation-direction: reverse; /* Reverse the animation direction */
}

/*-------------------------------------
        7. Explore
--------------------------------------*/
.explore {
    padding: 10px 5px 10px;
    background: #f4f5f6;
}

.explore-content {
    margin-top: 78px;
}

.single-explore-item {
    background: #fff;
    border-radius: 3px;
    -webkit-transition: .3s linear;
    -moz-transition: .3s linear;
    -ms-transition: .3s linear;
    -o-transition: .3s linear;
    transition: .3s linear;
    border-radius: 15px;
}

.single-explore-img {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 270px;
    cursor: pointer;
}

.bizbox {
    margin-bottom: 25px;
}

.single-explore-img:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background: rgba(162,172,177,.2);*/
}

.single-explore-img-info {
    position: absolute;
    bottom: -20px;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: .3s linear;
    -moz-transition: .3s linear;
    -ms-transition: .3s linear;
    -o-transition: .3s linear;
    transition: .3s linear;
}

.single-explore-item:hover .single-explore-img-info {
    opacity: 1;
    visibility: visible;
    bottom: 0px;
}

.single-explore-img-info button {
    position: absolute;
    bottom: 15px;
    left: 15px;
    width: 83px;
    height: 21px;
    line-height: 21px;
    background: #ff545a;
    border-radius: 3px;
    color: #fcfcfc;
    text-transform: capitalize;
    text-align: center;
    font-size: 12px;
}

.single-explore-image-icon-box {
    text-align: right;
    position: absolute;
    bottom: 10px;
    right: 10px;
}

    .single-explore-image-icon-box ul li {
        display: inline-block;
        width: 30px;
        height: 28px;
        line-height: 28px;
        background: #252d32;
        text-align: center;
        margin-left: 5px;
        color: #cbcccd;
    }

        .single-explore-image-icon-box ul li:hover i {
            color: #267dff;
        }

.single-explore-txt {
    padding: 26px 25px 24px 15px;
}

    .single-explore-txt.bg-theme-1 .explore-rating {
        background: #70a9ff;
    }

    .single-explore-txt.bg-theme-2 .explore-rating {
        background: #00c61c;
    }

    .single-explore-txt.bg-theme-3 .explore-rating {
        background: #ffcc5d;
    }

    .single-explore-txt.bg-theme-4 .explore-rating {
        background: #bd70ff;
    }

    .single-explore-txt.bg-theme-5 .explore-rating {
        background: #ff7a40;
    }

.explore-rating-price, .explore-rating-price a {
    font-size: 12px;
    color: #777f85;
    text-transform: capitalize;
    font-weight: 400;
    margin: 15px 0 20px;
}

    .explore-rating-price a {
        margin: 0;
    }

.explore-rating {
    display: inline-block;
    width: 32px;
    height: 20px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    border-radius: 3px;
    font-weight: 500;
    margin-right: 10px;
}

.explore-price {
    color: #f63138;
}

.explore-price-box {
    display: inline-block;
    padding: 0 10px;
    margin: 0 8px;
    border-left: 1px solid #dde0e4;
    border-right: 1px solid #dde0e4;
}

.explore-person {
    padding-bottom: 28px;
    border-bottom: 1px solid #e1e5eb;
}

.explore-person-img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.explore-person p {
    font-size: 12px;
}

.explore-open-close-part {
    margin-top: 20px;
}

.close-btn {
    color: #f63138;
    text-transform: capitalize;
}

    .close-btn.open-btn {
        color: #00c437;
    }

.explore-map-icon {
    text-align: right;
}

    .explore-map-icon a svg {
        width: 12px;
        height: 14px;
        margin-left: 23px;
        color: #767f86;
    }

        .explore-map-icon a svg:hover {
            color: #f63138;
        }

.single-explore-txt.bg-theme-2 .explore-map-icon a svg:hover {
    color: #00c437;
}

.single-explore-item:hover {
    box-shadow: 0 10px 20px rgba(21,19,19,.2);
}

.close-btn.open-btn {
    color: #00c437;
}

.close-btn {
    color: #f63138;
    text-transform: capitalize;
}

button {
    background: transparent;
    border: 0;
    font-size: 12px;
}

select, input, textarea, button {
    box-shadow: none;
    outline: 0 !important;
}

.explore-map-icon a svg {
    width: 12px;
    height: 14px;
    margin-left: 23px;
    color: #767f86;
}

h5 a {
    font-size: 12px;
    color: black;
    white-space: break-spaces;
}

.busimg {
    width: 100%;
    height: auto;
    padding: 10px;
    border-radius: 20px;
}


/*footer css*/

.footer-distributed {
    background: #141d2f;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
    box-sizing: border-box;
    width: 100%;
    text-align: left;
    /*font: bold 16px sans-serif;*/
    padding: 55px 50px;
}

    .footer-distributed .footer-left,
    .footer-distributed .footer-center,
    .footer-distributed .footer-right {
        display: inline-block;
        vertical-align: top;
    }

    /* Footer left */

    .footer-distributed .footer-left {
        width: 40%;
        color: white;
    }

    /* The company logo */

    .footer-distributed h3 {
        color: #ffffff;
        margin-left: 62px;
    }

        .footer-distributed h3 span {
            color: lightseagreen;
        }

    /* Footer links */

    .footer-distributed .footer-links {
        color: #ffffff;
        margin: 20px 0 12px;
        padding: 0;
    }

        .footer-distributed .footer-links a {
            display: inline-block;
            line-height: 1.8;
            font-weight: 400;
            text-decoration: none;
            color: inherit;
        }

    .footer-distributed .footer-company-name {
        color: #222;
        font-size: 14px;
        font-weight: normal;
        margin: 0;
    }

    /* Footer Center */

    .footer-distributed .footer-center {
        width: 35%;
    }

        .footer-distributed .footer-center i {
            background-color: #33383b;
            color: #ffffff;
            font-size: 25px;
            width: 38px;
            height: 38px;
            border-radius: 50%;
            text-align: center;
            line-height: 42px;
            margin: 10px 15px;
            vertical-align: middle;
        }

            .footer-distributed .footer-center i.fa-envelope {
                font-size: 17px;
                line-height: 38px;
            }

        .footer-distributed .footer-center p {
            display: inline-block;
            color: #ffffff;
            font-weight: 400;
            vertical-align: middle;
            margin: 0;
        }

            .footer-distributed .footer-center p span {
                display: block;
                font-weight: normal;
                font-size: 14px;
                line-height: 2;
            }

            .footer-distributed .footer-center p a {
                color: lightseagreen;
                text-decoration: none;
                ;
            }

    .footer-distributed .footer-links a:before {
        content: "|";
        font-weight: 300;
        font-size: 20px;
        left: 0;
        color: #fff;
        display: inline-block;
        padding-right: 5px;
    }

    .footer-distributed .footer-links .link-1:before {
        content: none;
    }

    /* Footer Right */

    .footer-distributed .footer-right {
        width: 20%;
    }

    .footer-distributed .footer-company-about {
        line-height: 20px;
        color: #92999f;
        font-size: 13px;
        font-weight: normal;
        margin: 0;
    }

        .footer-distributed .footer-company-about span {
            display: block;
            color: #ffffff;
            font-size: 14px;
            font-weight: bold;
            margin-bottom: 20px;
        }

    .footer-distributed .footer-icons {
        margin-top: 25px;
    }

        .footer-distributed .footer-icons a {
            display: inline-block;
            width: 35px;
            height: 35px;
            cursor: pointer;
            /*background-color: #33383b;*/
            border-radius: 2px;
            font-size: 20px;
            color: #ffffff;
            text-align: center;
            line-height: 35px;
            margin-right: 3px;
            margin-bottom: 5px;
        }

/* If you don't want the footer to be responsive, remove these media queries */

@media (max-width: 880px) {

    .footer-distributed {
        font: bold 14px sans-serif;
    }

        .footer-distributed .footer-left,
        .footer-distributed .footer-center,
        .footer-distributed .footer-right {
            display: block;
            width: 100%;
            margin-bottom: 40px;
            text-align: center;
        }

            .footer-distributed .footer-center i {
                margin-left: 0;
            }
}

.copyright {
    text-align: center;
    padding-top: 100px;
    color: #fff;
}

b, strong {
    font-weight: bolder;
}

.credits {
    text-align: center;
    font-size: 13px;
    color: #ddd;
}

a {
    color: #2192e1 !important;
    transition: 0.5s;
    text-decoration: none;
    /*margin-right: 16px;*/
    cursor: pointer;
}

.pro {
    font-size: 160px;
    text-align: center;
    margin-top: 187px;
    margin-left: 25px;
    font-weight: 600;
    padding-bottom: 50px;
    font-family: 'Poppins' !important;
}

.csbtn {
    color: black;
    padding: 1px 23px 2px 23px;
    box-shadow: 0 0px 10px rgba(71, 71, 71, .2);
    cursor: pointer;
    font-size: 25px;
    border-radius: 12px;
}

    .csbtn:hover {
        border: 0.5px solid #c7c7c7;
    }

.explore-contact-buttons {
    background-color: #ffffff;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    text-align: center;
    border: 1px solid #ddd;
    padding-top: 5px;
    padding-bottom: 5px;
}

.adres {
    font-size: 13px;
}

p {
    margin-bottom: 0.5rem !important;
}

.pull-right {
    float: right !important;
}

#scrollToTopBtn {
    /*display: none;*/ /* Hidden by default */
    position: fixed; /* Fixed position */
    bottom: 20px; /* Place the button at the bottom */
    right: 15px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background: #21addd; /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 15px; /* Some padding */
    border-radius: 10px; /* Rounded corners */
    font-size: 15px; /* Increase font size */
}

    #scrollToTopBtn:hover {
        background-color: #88d3ec; /* Add a dark-grey background on hover */
    }
   .header-top {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    background-color: #fff;
    height: 60px; /* Default height */
    padding: 10px 20px; /* Add some padding for content inside the header */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Optional: shadow for better visibility */
}

/* Adjust the content below the header */
.content {
    margin-top: 60px; /* Default margin-top matching the header height */
    padding: 15px;
}

/* Media queries for responsiveness */
@media (max-width: 768px) {
   .header-top {
        height: 130px !important; /* Smaller height for tablets and smaller screens */
        padding: 8px 15px;
    }

    .content {
        margin-top: 50px; /* Adjust margin-top to match the new header height */
    }
}
.mt-15 {
    margin-top: 4.5rem !important;
}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 768px) {
    .mt-15 {
        margin-top: 9rem !important;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) {
    .mt-15 {
        margin-top: 9rem !important;
    }
}
@media (max-width: 48c0px) {
   .header-top{
        height: 45px; /* Even smaller height for mobile screens */
        padding: 6px 10px;
    }

    .content {
        margin-top: 45px; /* Adjust margin-top to match the new header height */
    }
}
/*.header-top {
    background-color: #f8f8f8;
    padding: 10px 20px;
    position:fixed;
}*/

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.header-top-left .logo img {
    height: 40px;
}

.header-top-right {
    display: flex;
    align-items: center;
}

    .header-top-right .contact-info {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .header-top-right .contact-info li {
            margin-left: 20px;
        }

    .header-top-right .contact-details {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0;
        flex-wrap: wrap;
    }

        .header-top-right .contact-details li {
            margin-left: 20px;
            width: 100%;
            text-align: right;
        }

/* Responsive Styles */
@media (max-width: 768px) {
    .header-container {
        flex-direction: column;
        align-items: flex-start;
    }

    .header-top-right {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

        .header-top-right .contact-info {
            width: 100%;
            justify-content: flex-end;
        }

            .header-top-right .contact-info li {
                margin-left: 10px;
            }

        .header-top-right .contact-details {
            width: 100%;
            justify-content: flex-start;
            margin-top: 10px;
        }

            .header-top-right .contact-details li {
                width: auto;
                text-align: left;
                margin-left: 0;
            }
}

.floating-andbutton {
    position: fixed;
    right: 10px;
    bottom: 88px;
    background-color: transparent;
    color: white;
    padding: 0px;
    border-radius: 50%;
    cursor: pointer;
    /* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); */
    z-index: 10;
}

    .floating-andbutton i {
        font-size: 40px;
    }

.bswburl {
    word-break: break-all;
    overflow-wrap: break-word;
}


.suggestions-box {
    max-height: 200px;
    overflow-y: auto;
    position: absolute;
    background-color: #e6e6e6;
    width: 50%;
    margin-top: 30%;
    margin-left: 10%;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

    .suggestions-box div {
        padding: 10px;
        cursor: pointer;
    }

        .suggestions-box div:hover {
            background-color: #f0f0f0;
        }

.dvcompnm {
    text-align: center;
    padding: 5px;
}


@media (max-width: 600px) {
    .single-welcome-hero-form {
        padding: 0 6px;
    }

    .welcome-hero-btn {
        width: 71px;
        height: 70px;
        margin-left: 5px;
    }

    .welcome-hero {
        width: 100% !important;
    }

    .suggestions-box {
        width: 100%;
        margin-top: 85%;
    }
}

.autocomplete-active {
    background-color: #bfbdbd;
    cursor: pointer;
}