/*

TemplateMo 591 villa agency

https://templatemo.com/tm-591-villa-agency

*/

/* ---------------------------------------------
Table of contents
------------------------------------------------
01. font & reset css
02. reset
03. global styles
04. header
05. banner
06. features
07. testimonials
08. contact
09. footer

--------------------------------------------- */
/*
---------------------------------------------
font & reset css
---------------------------------------------
*/
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900");
/*
---------------------------------------------
reset
---------------------------------------------
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
div pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
figure,
header,
nav,
section,
article,
aside,
footer,
figcaption {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
}

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

ul,
li {
    padding: 0;
    margin: 0;
    list-style: none;
}

header,
nav,
section,
article,
aside,
footer,
hgroup {
    display: block;
}

* {
    box-sizing: border-box;
}

html,
body {
    font-family: "Poppins", sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    text-decoration: none !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #1e1e1e;
    margin-top: 0px;
    margin-bottom: 0px;
    font-weight: 700;
}

ul {
    margin-bottom: 0px;
}

p {
    font-size: 14px;
    line-height: 28px;
    color: #4a4a4a;
}

img {
    width: 100%;
    overflow: hidden;
}

/*
---------------------------------------------
Global Styles
---------------------------------------------
*/
html,
body {
    font-family: "Poppins", sans-serif;
}

::selection {
    background: #0071f8;
    color: #fff;
}

::-moz-selection {
    background: #0071f8;
    color: #fff;
}

.section {
    margin-top: 20px;
    /* margin-top: 120px; */
}

.section-heading {
    margin-bottom: 20px;
    /* margin-bottom: 70px; */
}

.section-heading h2 {
    font-size: 40px;
    font-weight: 700;
    text-transform: capitalize;
    margin-top: 20px;
    line-height: 56px;
}

.section-heading h2 em {
    font-style: normal;
    color: #0071f8;
}

.section-heading h6 {
    color: #ee626b;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 700;
}

.icon-button a {
    display: inline-block;
    background-color: #1e1e1e;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    height: 50px;
    line-height: 50px;
    padding: 0px 30px 0px 0px;
    border-radius: 25px;
    transition: all 0.3s;
}

.icon-button a i {
    background-color: #f35525;
    height: 50px;
    width: 50px;
    text-align: center;
    border-radius: 50%;
    line-height: 50px;
    display: inline-block;
    margin-right: 15px;
    margin-left: -1px;
}

.icon-button a:hover {
    color: #f35525;
}

.icon-button a:hover i {
    color: #fff;
}

.main-button a {
    display: inline-block;
    background-color: #1e1e1e;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    height: 40px;
    line-height: 40px;
    padding: 0px 30px;
    border-radius: 25px;
    transition: all 0.3s;
}

.main-button a:hover {
    background-color: #f35525;
    color: #fff;
}

/*
---------------------------------------------
Pre-loader Style
---------------------------------------------
*/

.js-preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.99);
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    opacity: 1;
    visibility: visible;
    z-index: 9999;
    -webkit-transition: opacity 0.25s ease;
    transition: opacity 0.25s ease;
}

.js-preloader.loaded {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

@-webkit-keyframes dot {
    50% {
        -webkit-transform: translateX(96px);
        transform: translateX(96px);
    }
}

@keyframes dot {
    50% {
        -webkit-transform: translateX(96px);
        transform: translateX(96px);
    }
}

@-webkit-keyframes dots {
    50% {
        -webkit-transform: translateX(-31px);
        transform: translateX(-31px);
    }
}

@keyframes dots {
    50% {
        -webkit-transform: translateX(-31px);
        transform: translateX(-31px);
    }
}

.preloader-inner {
    position: relative;
    width: 142px;
    height: 40px;
    background: transparent;
}

.preloader-inner .dot {
    position: absolute;
    width: 16px;
    height: 16px;
    top: 12px;
    left: 15px;
    background: #f35525;
    border-radius: 50%;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation: dot 2.8s infinite;
    animation: dot 2.8s infinite;
}

.preloader-inner .dots {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    margin-top: 12px;
    margin-left: 31px;
    -webkit-animation: dots 2.8s infinite;
    animation: dots 2.8s infinite;
}

.preloader-inner .dots span {
    display: block;
    float: left;
    width: 16px;
    height: 16px;
    margin-left: 16px;
    background: #f35525;
    border-radius: 50%;
}

/*
---------------------------------------------
Header Style
---------------------------------------------
*/

.sub-header {
    background-color: #fff;
    padding: 10px 0px;
    border-bottom: 1px solid #eee;
}

.sub-header ul li {
    display: inline-block;
}

.sub-header ul.social-links {
    text-align: right;
}

.sub-header ul.social-links li {
    margin-left: 8px;
}

.sub-header ul.social-links li a {
    display: inline-block;
    width: 30px;
    height: 30px;
    background-color: #cdcdcd;
    border-radius: 50%;
    text-align: center;
    line-height: 30px;
    color: #fff;
    font-size: 14px;
    transition: all 0.3s;
}

.sub-header ul.social-links li a:hover {
    background-color: #f35525;
}

.sub-header ul.info li {
    font-size: 14px;
    color: #7a7a7a;
    border-right: 1px solid #eee;
    margin-right: 25px;
    padding-right: 25px;
}

.sub-header ul.info li:last-child {
    margin-right: 0px;
    padding-right: 0px;
    border-right: none;
}

.sub-header ul.info li i {
    font-size: 20px;
    color: #f35525;
    margin-right: 8px;
}

.background-header {
    background-color: #fff;
    height: 80px !important;
    position: fixed !important;
    top: 0 !important;
    left: 0;
    right: 0;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15) !important;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}


.header-area {
    position: relative;
    background-color: #fff;
    height: 100px;
    z-index: 100;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.header-area .main-nav {
    background: transparent;
    display: flex;
}

.header-area .main-nav .logo {
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    display: inline-block;
}

.header-area .main-nav .logo h1 {
    line-height: 100px;
    font-size: 28px;
    text-transform: uppercase;
    color: #1e1e1e;
    font-weight: 700;
    letter-spacing: 2px;
}

.background-header .main-nav .logo h1 {
    line-height: 80px;
}

.header-area .main-nav ul.nav {
    flex-basis: 100%;
    margin-top: 30px;
    justify-content: right;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    position: relative;
    z-index: 999;
}

.header-area .main-nav .nav li:last-child {
    padding-right: 0px;
}

.header-area .main-nav .nav li {
    /* padding-left: 10px;
    padding-right: 10px;
    height: 100px;
    line-height: 100px; */
}

.header-area .main-nav .nav li a {
    display: block;
    padding-left: 20px;
    padding-right: 20px;
    font-weight: 500;
    font-size: 15px;
    height: 40px;
    line-height: 40px;
    text-transform: capitalize;
    color: #1e1e1e;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    border: transparent;
    letter-spacing: 0.25px;
}

.header-area .main-nav .nav li:last-child a {
    background-color: #1e1e1e;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    text-transform: none;
    border-radius: 20px;
    padding-left: 0px;
}

.header-area .main-nav .nav li:last-child a i {
    background-color: #f35525;
    display: inline-block;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    margin-right: 10px;
    border-radius: 50%;
    margin-left: -1px;
}

.header-area .main-nav .nav li:last-child:hover a {
    background-color: #1e1e1e;
}

.header-area .main-nav .nav li:last-child:hover a i {
    color: #fff;
}

.header-area .main-nav .nav li:hover a {
    color: #f35525;
}

.header-area .main-nav .nav li a.active {
    color: #f35525;
}

.background-header .main-nav .nav li a.active {
    color: #f35525;
}

.header-area .main-nav .menu-trigger {
    cursor: pointer;
    position: absolute;
    top: 23px;
    width: 32px;
    height: 40px;
    text-indent: -9999em;
    z-index: 99;
    right: 20px;
    display: none;
}

.background-header .main-nav .menu-trigger {
    top: 22px;
}

.background-header .main-nav ul.nav {
    margin-top: 20px;
}

.header-area .main-nav .menu-trigger span,
.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    background-color: #1e1e1e;
    display: block;
    position: absolute;
    width: 30px;
    height: 2px;
    left: 0;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    background-color: #1e1e1e;
    display: block;
    position: absolute;
    width: 30px;
    height: 2px;
    left: 0;
    width: 75%;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
    content: "";
}

.header-area .main-nav .menu-trigger span {
    top: 16px;
}

.header-area .main-nav .menu-trigger span:before {
    -moz-transform-origin: 33% 100%;
    -ms-transform-origin: 33% 100%;
    -webkit-transform-origin: 33% 100%;
    transform-origin: 33% 100%;
    top: -10px;
    z-index: 10;
}

.header-area .main-nav .menu-trigger span:after {
    -moz-transform-origin: 33% 0;
    -ms-transform-origin: 33% 0;
    -webkit-transform-origin: 33% 0;
    transform-origin: 33% 0;
    top: 10px;
}

.header-area .main-nav .menu-trigger.active span,
.header-area .main-nav .menu-trigger.active span:before,
.header-area .main-nav .menu-trigger.active span:after {
    background-color: transparent;
    width: 100%;
}

.header-area .main-nav .menu-trigger.active span:before {
    -moz-transform: translateY(6px) translateX(1px) rotate(45deg);
    -ms-transform: translateY(6px) translateX(1px) rotate(45deg);
    -webkit-transform: translateY(6px) translateX(1px) rotate(45deg);
    transform: translateY(6px) translateX(1px) rotate(45deg);
    background-color: #1e1e1e;
}

.background-header .main-nav .menu-trigger.active span:before {
    background-color: #1e1e1e;
}

.header-area .main-nav .menu-trigger.active span:after {
    -moz-transform: translateY(-6px) translateX(1px) rotate(-45deg);
    -ms-transform: translateY(-6px) translateX(1px) rotate(-45deg);
    -webkit-transform: translateY(-6px) translateX(1px) rotate(-45deg);
    transform: translateY(-6px) translateX(1px) rotate(-45deg);
    background-color: #1e1e1e;
}

.background-header .main-nav .menu-trigger.active span:after {
    background-color: #1e1e1e;
}

.visible {
    display: inline !important;
}

@media (max-width: 1200px) {
    .header-area .main-nav .nav li {
        padding-left: 5px;
        padding-right: 5px;
    }
}

@media (max-width: 767px) {
    .background-header .main-nav {
        box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
        border-radius: 0px 0px 25px 25px;
        width: 100%;
    }
    .background-header .main-nav .nav,
    .header-area .main-nav .nav {
        background-color: #fff;
    }
    .background-header .main-nav .nav li a,
    .header-area .main-nav .nav li a {
        line-height: 50px;
        height: 50px;
        font-weight: 400;
        color: #1e1e1e;
        background-color: #fff;
        border-radius: 0px 0px 25px 25px;
    }
    .background-header .main-nav .nav li,
    .header-area .main-nav .nav li {
        border-top: 1px solid #ddd;
        background-color: #f1f0fe;
        height: 50px;
        border-radius: 0px 0px 25px 25px;
    }
    .header-area .main-nav .nav {
        height: auto;
        flex-basis: 100%;
    }
    .header-area .main-nav .logo {
        position: absolute;
        left: 30px;
        top: 0px;
    }
    .background-header .main-nav .logo {
        top: 0px;
    }
    .background-header .main-nav .border-button {
        top: 0px !important;
    }
    .header-area .main-nav .border-button {
        position: absolute;
        top: 15px;
        right: 70px;
    }
    .header-area.header-sticky .nav li a:hover,
    .header-area.header-sticky .nav li a.active {
        color: #ee626b !important;
        opacity: 1;
    }
    .header-area.header-sticky .nav li.search-icon a {
        width: 100%;
    }
    .header-area .nav li:last-child a {
        background-color: transparent !important;
        font-weight: 300 !important;
        text-transform: capitalize !important;
    }
    .header-area {
        padding: 0px 15px;
        height: 80px;
        box-shadow: none;
        text-align: center;
    }
    .header-area .container {
        padding: 0px;
    }
    .header-area .logo {
        margin-left: 0px;
    }
    .header-area .menu-trigger {
        display: block !important;
    }
    .header-area .main-nav {
        overflow: hidden;
    }
    .header-area .main-nav .nav {
        float: none;
        width: 100%;
        display: none;
        -webkit-transition: all 0s ease 0s;
        -moz-transition: all 0s ease 0s;
        -o-transition: all 0s ease 0s;
        transition: all 0s ease 0s;
        margin-left: 0px;
    }
    .header-area .main-nav .nav li:first-child {
        border-top: 1px solid #eee;
    }
    .header-area.header-sticky .nav {
        margin-top: 80px !important;
    }
    .background-header.header-sticky .nav {
        margin-top: 80px !important;
    }
    .header-area .main-nav .nav li {
        width: 100%;
        background: #fff;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
}

/*
---------------------------------------------
Banner Style
---------------------------------------------
*/
/* Default Styles for Larger Screens */
.main-banner .item {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 220px 20% 320px 20%;
    margin-top: 0;
}

.main-banner .item-1 {
    background-image: url(../images/banner-01.jpg);
}

.main-banner .item-2 {
    background-image: url(../images/banner-02.jpg);
}

.main-banner .item-3 {
    background-image: url(../images/banner-03.jpg);
}

.main-banner .item span.category {
    background-color: #fff;
    color: #1e1e1e;
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    padding: 6px 15px;
    display: inline-block;
    margin-bottom: 30px;
}

.main-banner .item span.category em {
    font-style: normal;
    color: #f35525;
}

.main-banner .item h2 {
    font-size: 62px;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    line-height: 72px;
    width: 50%;
    margin-bottom: 0;
}

.main-banner .owl-dots {
    position: absolute;
    bottom: 60px;
    left: 20%;
}

.main-banner .owl-dots .owl-dot {
    width: 10px;
    height: 10px;
    background-color: #fff;
    border-radius: 50%;
    margin-right: 10px;
    transition: all 0.5s;
}

.main-banner .owl-dots .active {
    background-color: #f35525;
}
.main-banner .owl-nav {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
}

.main-banner .owl-nav .owl-prev i,
.main-banner .owl-nav .owl-next i {
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    display: inline-block;
    color: #fff;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    opacity: 1;
    transition: all 0.3s;
}

.main-banner .owl-nav .owl-prev i {
    position: absolute;
    left: 45px;
}

.main-banner .owl-nav .owl-next i {
    position: absolute;
    right: 45px;
}

.main-banner .owl-nav .owl-prev i:hover,
.main-banner .owl-nav .owl-next i:hover {
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.5);
}

/* Mobile View Adjustments */
@media (max-width: 767px) {
    .main-banner .item {
        padding: 70px; /* Adjust padding for mobile view */
        background-size: cover; /* Ensure background image covers the item */
    }

    .main-banner .item h2 {
        font-size: 36px; /* Adjust font size for mobile */
        line-height: 44px;
        width: 90%;
    }

    .main-banner .item span.category {
        font-size: 14px; /* Adjust font size for mobile */
        padding: 4px 10px;
        margin-bottom: 20px;
    }

    .main-banner .owl-dots {
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%); /* Center the dots horizontally */
    }

    .main-banner .owl-nav {
        top: 60%; /* Adjust the vertical position of navigation buttons */
    }

    .main-banner .owl-nav .owl-prev,
    .main-banner .owl-nav .owl-next {
        position: absolute;
        width: 40px; /* Adjust button size */
        height: 40px; /* Adjust button size */
        line-height: 40px; /* Center the icon */
    }

    .main-banner .owl-nav .owl-prev i,
    .main-banner .owl-nav .owl-next i {
        font-size: 18px; /* Adjust icon font size */
    }

    .main-banner .owl-nav .owl-prev {
        left: 10px; /* Position the left button */
    }

    .main-banner .owl-nav .owl-next {
        right: 10px; /* Position the right button */
    }
}

/*
---------------------------------------------
Featured Style
---------------------------------------------
*/

.featured .left-image {
    position: relative;
}

.featured .left-image img {
    padding-left: 55px;
}

.featured .left-image a {
    display: inline-block;
    width: 110px;
    height: 110px;
    line-height: 110px;
    background-color: #f35525;
    border-radius: 50%;
    text-align: center;
    position: absolute;
    left: 0;
    bottom: -55px;
}

.featured .section-heading {
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 60px;
}

.featured .section-heading h2 {
    width: 70%;
}

.featured .accordion {
    margin-left: 10px;
    margin-right: 10px;
    --bs-accordion-border-radius: 10px;
    --bs-accordion-inner-border-radius: 10px;
    --bs-accordion-bg: #fafafa;
    --bs-accordion-border-color: none;
    border: none !important;
}

.featured .accordion-header {
    border-bottom: 1px solid #eaeaea;
}

.featured .accordion-button {
    box-shadow: none;
    font-size: 17px;
    font-weight: 500;
    color: #1e1e1e;
}

.featured .accordion-button:not(.collapsed) {
    color: #f35525;
    background-color: #fafafa;
    outline: none;
}

.featured .accordion-button::after {
    display: none;
}

.featured #headingThree {
    border-bottom: none;
}

.featured .accordion-item:last-of-type .accordion-collapse {
    border-top: 1px solid #eaeaea;
}

.featured .info-table {
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    padding: 35px 30px;
}

.featured .info-table ul li {
    display: block;
    margin-bottom: 35px;
    padding-bottom: 35px;
    border-bottom: 1px solid #eee;
}

.featured .info-table ul li:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.featured .info-table ul li img {
    float: left;
    margin-right: 25px;
}

.featured .info-table ul li h4 {
    font-size: 22px;
    font-weight: 600;
}

.featured .info-table ul li h4 span {
    font-size: 15px;
    color: #aaa;
    font-weight: 400;
}

/*
---------------------------------------------
Video Style
---------------------------------------------
*/

.video {
    background-image: url(../images/video-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 100px 0px 250px 0px;
    position: relative;
}

.video-content {
    margin-top: -240px;
}

.video .section-heading h2 {
    color: #fff;
}

.video-content .video-frame {
    position: relative;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    border-radius: 10px;
}

.video-content .video-frame img {
    border-radius: 10px;
}

.video-content .video-frame a {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-26px, -26px);
    width: 52px;
    height: 52px;
    background-color: #fff;
    border-radius: 50%;
    display: inline-block;
    text-align: center;
    line-height: 52px;
    color: #f35525;
    outline: 15px solid rgba(254, 85, 37, 0.5);
    font-size: 18px;
}

/*
---------------------------------------------
Fun Facts Style
---------------------------------------------
*/

.fun-facts {
    text-align: center;
    margin-top: 125px;
}

.fun-facts .counter {
    background-color: #ffeee9;
    position: relative;
    border-radius: 10px;
    width: 270px;
    padding: 20px 0px;
    display: inline-block;
}

.fun-facts .counter h2,
.fun-facts .counter p {
    display: inline-flex;
    vertical-align: middle;
}

.fun-facts .counter p {
    text-align: left;
    font-size: 16px;
    color: #1e1e1e;
    font-weight: 600;
    line-height: 28px;
}

.fun-facts .counter h2 {
    margin-right: 25px;
    font-size: 40px;
    color: #f35525;
}

.fun-facts .counter:after {
    position: absolute;
    width: 50px;
    height: 50px;
    background-color: #f35525;
    border-radius: 50%;
    content: "";
    right: -25px;
    top: -25px;
}

/*
---------------------------------------------
Best Deal Style
---------------------------------------------
*/

.best-deal {
    background-color: #fafafa;
    padding: 100px 0px;
}

.best-deal .tab-content img {
    padding: 0px 45px;
}

.best-deal .tabs-content .nav-link {
    font-size: 16px;
    font-weight: 500;
    background-color: #1e1e1e !important;
    border-radius: 5px;
    height: 50px;
    line-height: 50px;
    display: inline-block;
    padding: 0px 25px;
    color: #fff;
}

.best-deal .tabs-content .nav-tabs .nav-link.active {
    background-color: #f35525 !important;
    color: #fff;
}

.best-deal .tabs-content ul.nav-tabs {
    border-bottom: none !important;
    margin-bottom: 80px;
    align-items: end;
    justify-content: end;
    margin-top: -130px;
}

.best-deal .tabs-content ul.nav-tabs li {
    padding-right: 0px;
    border-right: none;
    margin-left: 20px;
}

.best-deal .info-table {
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    padding: 35px 30px;
}

.best-deal .info-table ul li {
    display: block;
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #eee;
    text-align: left;
    font-size: 15px;
    color: #aaa;
    font-weight: 400;
}

.best-deal .info-table ul li:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.best-deal .info-table ul li span {
    font-size: 20px;
    color: #1e1e1e;
    font-weight: 700;
    float: right;
    display: inline-block;
}

.best-deal .tabs-content {
    padding: 0px;
    background-color: transparent;
}

.best-deal .tabs-content h4 {
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 30px;
}

.best-deal .icon-button {
    margin-top: 30px;
}

/*
---------------------------------------------
Properties Style
---------------------------------------------
*/

.properties .item {
    background-color: #fafafa;
    border-radius: 10px;
    padding: 30px;
    margin-bottom: 30px;
}

.service-item img {
    width: 100%; /* Ensures the image takes full width of its container */
    max-height: 200px; /* Adjust this value to control the image height */
    object-fit: cover; /* Ensures the image scales and crops if necessary */
}

.properties .item img {
    border-radius: 10px;
}

@media (min-width: 769px) {
    .properties .item img {
        width: 100%;
        height: 270px;
        object-fit: contain;
    }
}

.properties .item span.category {
    background-color: #fbd9cf;
    font-weight: 500;
    border-radius: 5px;
    font-size: 14px;
    color: #1e1e1e;
    padding: 5px 12px;
    display: inline-block;
    margin-top: 15px;
    /* margin-top: 25px; */
}

.properties .item h4 {
    font-size: 19px;
    margin: 15px 0px;
    /* margin: 25px 0px; */
}

.properties .item h4 a {
    color: #1e1e1e;
}

.properties .item ul li {
    display: inline-block;
    font-size: 15px;
    color: #4a4a4a;
    margin-right: 20px;
}

.properties .item ul li span {
    font-weight: 600;
    color: #1e1e1e;
}

.properties .item ul {
    border-bottom: 1px solid #eaeaea;
    margin-bottom: 10px;
    padding-bottom: 10px;
    /* margin-bottom: 30px;
  padding-bottom: 30px; */
}

.properties .item h6 {
    font-size: 20px;
    color: #f35525;
    margin-top: 6px;
    display: inline-block;
    float: right;
    margin-top: 30px;
}

.properties .item .main-button {
    text-align: center;
}

/*
---------------------------------------------
Contact Style
---------------------------------------------
*/

.contact {
    background-image: url(../images/contact-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 100px 0px 250px 0px;
    position: relative;
}

.contact .section-heading h2 {
    color: #fff;
}

.contact-content {
    margin-top: -240px;
    position: relative;
    z-index: 1;
}

.contact-content #map {
    border-radius: 10px;
    margin-bottom: 60px;
}

.contact-content .item {
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    padding: 35px 30px;
    background-color: #fff;
}

.contact-content .phone {
    margin-right: 15px;
}

.contact-content .email {
    margin-left: 15px;
}

.contact-content .item img {
    float: left;
    margin-right: 25px;
    vertical-align: middle;
}

.contact-content .item h6 {
    font-size: 20px;
    font-weight: 600;
    vertical-align: middle;
}

.contact-content .item h6 span {
    font-size: 15px;
    color: #aaaaaa;
    font-weight: 400;
}

.contact-content #contact-form {
    margin-left: 30px;
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    padding: 35px 30px;
    background-color: #fff;
}

.contact-content #contact-form label {
    font-size: 15px;
    color: #3a3a3a;
    margin-bottom: 15px;
}

.contact-content #contact-form input {
    width: 100%;
    height: 44px;
    border-radius: 22px;
    background-color: #f6f6f6;
    border: none;
    margin-bottom: 30px;
    font-size: 14px;
    padding: 0px 15px;
}

.contact-content #contact-form textarea {
    width: 100%;
    height: 150px;
    max-height: 180px;
    border-radius: 22px;
    background-color: #f6f6f6;
    border: none;
    margin-bottom: 40px;
    font-size: 14px;
    padding: 15px 15px;
}

.contact-content #contact-form button {
    background-color: #1e1e1e;
    height: 44px;
    border-radius: 22px;
    padding: 0px 20px;
    color: #fff;
    border: none;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.5s;
}

.contact-content #contact-form button:hover {
    background-color: #f35525;
}

/*
---------------------------------------------
Footer Style
---------------------------------------------
*/
/*
---------------------------------------------
Clean & Modern Footer Style
---------------------------------------------
*/

footer {
    background-color: #1e1e1e;
    padding: 30px 0;
    color: #fff;
    font-size: 14px;
}

footer p {
    margin: 5px 0;
    font-size: 14px;
    font-weight: 400;
    color: #ccc;
}

footer p a {
    color: #ffffff;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease;
}

footer p a:hover {
    color: #f1c40f;
}

.footer-links {
    padding: 0;
    margin: 15px 0 0;
    list-style: none;
}

.footer-links li {
    display: inline;
    margin: 0 10px;
}

.footer-links a {
    color: #ffffff;
    font-size: 14px;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-links a:hover {
    color: #f1c40f;
}

/*
---------------------------------------------
Page Header Style
---------------------------------------------
*/

.page-heading {
    background-image: url(../images/page-heading-bg.jpg);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 110px 0px;
    text-align: center;
}

.page-heading span {
    background-color: #fff;
    color: #1e1e1e;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    padding: 10px 25px;
    display: inline-block;
    margin-bottom: 30px;
}

.page-heading span a {
    color: #1e1e1e;
}

.page-heading h3 {
    font-size: 48px;
    font-weight: 900;
    text-transform: uppercase;
    color: #fff;
}

/*
---------------------------------------------
Properties Style
---------------------------------------------
*/

.properties ul.properties-filter {
    list-style: none;
    text-align: center;
    margin-bottom: 70px;
}

.properties ul.properties-filter li {
    display: inline-block;
    margin: 5px 8px;
}

.properties ul.properties-filter li a {
    display: inline-block;
    text-align: center;
    font-size: 15px;
    text-transform: capitalize;
    font-weight: 500;
    color: #fff;
    background-color: #1e1e1e;
    padding: 12px 25px;
    border-radius: 5px;
    transition: all 0.3s;
}

.properties ul.properties-filter li a.is_active {
    background-color: #f35525;
    color: #fff;
}

.properties ul.properties-filter li a.is_active:hover {
    color: #fff;
}

.properties ul.properties-filter li a:hover {
    color: #f35525;
}

.properties ul.pagination {
    margin-top: 50px;
    text-align: center;
    width: 100%;
    display: inline-block;
}

.properties ul.pagination li {
    display: inline-block;
    margin: 0px 5px;
}

.properties ul.pagination li a {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background-color: #1e1e1e;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    border-radius: 50%;
    transition: all 0.3s;
}

.properties ul.pagination li a:hover,
.properties ul.pagination li a.is_active {
    background-color: #f35525;
    color: #fff;
}

/*
---------------------------------------------
Single Page Style
---------------------------------------------
*/

.single-property .main-image img {
    float: none;
}

.single-property .main-content h4 {
    font-size: 25px;
    margin-top: 25px;
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #eee;
}

.single-property .main-content span.category {
    background-color: #fbd9cf;
    font-weight: 500;
    border-radius: 5px;
    font-size: 14px;
    color: #1e1e1e;
    padding: 5px 12px;
    display: inline-block;
    margin-top: 40px;
}

.single-property .accordion {
    margin-top: 60px;
    margin-left: 0px;
    margin-right: 0px;
    --bs-accordion-border-radius: 10px;
    --bs-accordion-inner-border-radius: 10px;
    --bs-accordion-bg: #fafafa;
    --bs-accordion-border-color: none;
    border: none !important;
}

.single-property .accordion-header {
    border-bottom: 1px solid #eaeaea;
}

.single-property .accordion-button {
    box-shadow: none;
    font-size: 17px;
    font-weight: 500;
    color: #1e1e1e;
}

.single-property .accordion-button:not(.collapsed) {
    color: #f35525;
    background-color: #fafafa;
    outline: none;
}

.single-property .accordion-button::after {
    display: none;
}

.single-property #headingThree {
    border-bottom: none;
}

.single-property .accordion-item:last-of-type .accordion-collapse {
    border-top: 1px solid #eaeaea;
}

.single-property .info-table {
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    padding: 35px 30px;
    margin-left: 60px;
}

.single-property .info-table ul li {
    display: block;
    margin-bottom: 35px;
    padding-bottom: 35px;
    border-bottom: 1px solid #eee;
}

.single-property .info-table ul li:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.single-property .info-table ul li img {
    float: left;
    margin-right: 25px;
}

.single-property .info-table ul li h4 {
    font-size: 22px;
    font-weight: 600;
}

.single-property .info-table ul li h4 span {
    font-size: 15px;
    color: #aaa;
    font-weight: 400;
}

/*
---------------------------------------------
Contact Page Style
---------------------------------------------
*/

.contact-page #map {
    margin-top: 100px;
}

.contact-page .section-heading {
    margin-bottom: 40px;
    margin-right: 280px;
}

.contact-page p {
    margin-bottom: 50px;
}

.contact-page .item {
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    padding: 35px 30px;
    background-color: #fff;
    display: inline-block;
    min-width: 360px;
}

.contact-page .phone {
    margin-bottom: 30px;
}

.contact-page .item img {
    float: left;
    margin-right: 25px;
    vertical-align: middle;
}

.contact-page .item h6 {
    font-size: 20px;
    font-weight: 600;
    vertical-align: middle;
}

.contact-page .item h6 span {
    font-size: 15px;
    color: #aaaaaa;
    font-weight: 400;
}

.contact-page #contact-form {
    margin-left: 30px;
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    padding: 35px 30px;
    background-color: #fff;
}

.contact-page #contact-form label {
    font-size: 15px;
    color: #3a3a3a;
    margin-bottom: 15px;
}

.contact-page #contact-form input {
    width: 100%;
    height: 44px;
    border-radius: 22px;
    background-color: #f6f6f6;
    border: none;
    margin-bottom: 30px;
    font-size: 14px;
    padding: 0px 15px;
}

.contact-page #contact-form textarea {
    width: 100%;
    height: 150px;
    max-height: 180px;
    border-radius: 22px;
    background-color: #f6f6f6;
    border: none;
    margin-bottom: 40px;
    font-size: 14px;
    padding: 15px 15px;
}

.contact-page #contact-form button {
    background-color: #1e1e1e;
    height: 44px;
    border-radius: 22px;
    padding: 0px 20px;
    color: #fff;
    border: none;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.5s;
}

.contact-page #contact-form button:hover {
    background-color: #f35525;
}

/*
---------------------------------------------
Responsive Style
---------------------------------------------
*/

body {
    overflow-x: hidden;
}

@media (max-width: 767px) {
    .header-area .main-nav .logo h1 {
        line-height: 80px !important;
    }
    .best-deal .tabs-content .nav-link {
        font-size: 14px;
        padding: 0px 15px;
        height: 44px;
        line-height: 44px;
    }
    .best-deal .tabs-content ul.nav-tabs li {
        margin: 0px 5px;
    }
    .properties ul.properties-filter li a {
        font-size: 14px;
        padding: 10px 15px;
    }
    .properties ul.properties-filter li {
        margin: 5px;
    }
    .header-area .main-nav .nav li:last-child {
        /* display: none; */
        height: 75px;
    }

.header-area .main-nav .nav li:last-child a {
    /* background-color: #1e1e1e;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    text-transform: none;
    border-radius: 20px;
    padding-left: 0px; */

    background-color: #1e1e1e !important;
    color: #fff;
    font-size: 14px;
    font-weight: 400 !important;
    text-transform: none !important;
    border-radius: 20px;
    padding-left: 0px;
    margin-left: 20%;
    margin-top: 10px;
    margin-right: 20%;
    margin-bottom: 10px;
}

.header-area .main-nav .nav li:last-child a i {
    background-color: #f35525;
    display: inline-block;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    margin-right: 10px;
    border-radius: 50%;
    margin-left: -1px;
}

.header-area .main-nav .nav li:last-child:hover a {
    background-color: #1e1e1e;
}

.header-area .main-nav .nav li:last-child:hover a i {
    color: #fff;
}

}

@media (max-width: 992px) {
    .sub-header {
        display: none;
    }
    .header-area .main-nav .logo h1 {
        line-height: 100px;
    }
    .background-header .main-nav .logo h1 {
        line-height: 80px;
    }
    .header-area .main-nav .nav li a {
        padding-left: 3px;
        padding-right: 3px;
    }
    .header-area .main-nav .nav li:last-child a {
        padding-right: 15px;
    }
    .main-banner .item h2 {
        width: 100%;
    }
    .featured .section-heading {
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 100px;
    }
    .featured .accordion {
        margin-left: 0px;
        margin-right: 0px;
    }
    .featured .info-table {
        margin-top: 45px;
    }
    .fun-facts .counter {
        margin-bottom: 45px;
    }
    .best-deal .section-heading {
        text-align: center;
    }
    .best-deal .tabs-content ul.nav-tabs {
        margin-top: 0px;
        justify-content: center;
    }
    .best-deal .info-table {
        margin-bottom: 45px;
    }
    .best-deal .tab-content img {
        padding: 0px;
    }
    .best-deal .tabs-content h4 {
        margin-top: 45px;
    }
    .properties .item h6 {
        text-align: center;
        margin-bottom: 15px;
    }
    .properties .item .main-button {
        text-align: center;
    }
    .properties .item ul li {
        margin-right: 10px;
        font-size: 13px;
    }
    .contact-content .phone {
        margin-right: 0px;
        margin-bottom: 20px;
    }
    .contact-content .email {
        margin-left: 0px;
        margin-bottom: 45px;
    }
    .contact-content #contact-form {
        margin-left: 0px;
    }
    .single-property .info-table {
        margin-left: 0px;
        margin-top: 45px;
    }
    .contact-page .section-heading {
        margin-right: 0px !important;
    }
    .contact-page #contact-form {
        margin-left: 0px;
        margin-top: 60px;
    }
    .best-deal .info-table ul li span {
        float: right !important;
        width: auto !important;
    }
}

@media (max-width: 1200px) {
    .best-deal .info-table ul li span {
        float: none;
        width: 100%;
    }
    .contact-page .section-heading {
        margin-right: 100px;
    }
}

#cookieConsentModal {
    display: none; /* Hide by default */
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    color: #000;
    border: 1px solid #ccc;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    z-index: 1000; /* Ensure it's on top of other content */
}
#cookieConsentModal button {
    background: #f1d600;
    color: #000;
    border: none;
    padding: 10px;
    cursor: pointer;
    margin-right: 10px;
}
#cookieConsentModal a {
    color: #007bff;
    text-decoration: none;
}
#cookieConsentModal a:hover {
    text-decoration: underline;
}
/* Overlay styles */
#cookieConsentOverlay {
    display: none; /* Hide by default */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999; /* Behind the modal but on top of the page */
}

.quiz-detail {
    margin-top: 50px;
}

.quiz-question h4 {
    margin-bottom: 20px;
}

.list-group-item {
    padding: 15px;
}

@media (max-width: 768px) {
    .quiz-detail {
        padding: 0 15px;
    }

    .quiz-question {
        text-align: center;
    }

    .list-group-item {
        text-align: left;
    }
}

.btn-primary {
    display: inline-block;
    background-color: #1e1e1e;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    height: 40px;
    line-height: 40px;
    padding: 0px 30px;
    border-radius: 25px;
    transition: all 0.3s;
    border: none; /* Remove border for a cleaner look */
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #f35525;
    color: #fff;
    outline: none;
    box-shadow: none; /* Remove any default Bootstrap box shadows */
}

.btn-sm {
    display: inline-block;
    background-color: #1e1e1e;
    color: #fff;
    font-size: 12px; /* Smaller font size for smaller button */
    font-weight: 500;
    height: 32px; /* Reduced height */
    line-height: 32px; /* Matches height */
    padding: 0px 20px; /* Smaller padding for a compact look */
    border-radius: 20px; /* Slightly smaller border-radius */
    transition: all 0.3s;
    border: none;
}

.btn-sm:hover,
.btn-sm:focus,
.btn-sm:active {
    background-color: #f35525;
    color: #fff;
    outline: none;
    box-shadow: none;
}

.btn-lg {
    display: inline-block;
    background-color: #1e1e1e;
    color: #fff;
    font-size: 16px; /* Larger font size */
    font-weight: 600; /* Bolder font for emphasis */
    height: 50px; /* Increased height for larger buttons */
    line-height: 50px;
    padding: 0px 40px; /* More padding for a more substantial feel */
    border-radius: 30px; /* Larger border-radius */
    transition: all 0.3s;
    border: none;
}

.btn-lg:hover,
.btn-lg:focus,
.btn-lg:active {
    background-color: #f35525;
    color: #fff;
    outline: none;
    box-shadow: none;
}

/* Ensure the testimonial section is responsive */

/* Ensure the testimonial section is responsive */
/* Ensure the testimonial section is responsive */


.modal-review-card {
    display: flex;               /* Use flex to allow proper alignment */
    flex-direction: column;      /* Stack items vertically */
    align-items: center;         /* Center align items */
    background-color: #fff;     /* White background for contrast */
    padding: 20px;              /* Padding inside the review card */
    border-radius: 8px;         /* Rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    text-align: center;          /* Center text */
    width: 100%;                 /* Full width inside the modal */
    max-width: 400px;            /* Max width for larger screens */
}

.modal-review-card img {
    border-radius: 50%;          /* Circular image */
    width: 100px;                /* Adjusted width for visibility */
    height: 100px;               /* Adjusted height */
    object-fit: cover;           /* Ensure image covers area */
    margin-bottom: 10px;         /* Spacing below image */
}

.modal-review-card h4 {
    margin: 10px 0;             /* Spacing above and below name */
}

.modal-review-card .rating-stars {
    margin: 10px 0;             /* Spacing around the rating */
}


.review-carousel {
    background-color: #f8f9fa;
    padding: 50px 0;
}

.testimonial-section {
    background-color: #f8f9fa; /* Light background for the section */
    padding: 50px 0; /* Padding around the section */
}

.review-card {
    text-align: center; /* Center align text */
    margin: 20px; /* Margin around each card */
    background-color: #fff; /* White background for the card */
    padding: 20px; /* Padding inside the card */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Shadow for depth */
    transition: transform 0.3s; /* Smooth transition for hover effect */
}

/* Card hover effect */
.review-card:hover {
    transform: translateY(-5px); /* Slightly lift card on hover */
}

.review-card .pic {
    display: inline-block; /* Inline-block to center */
    width: 100px; /* Fixed size for the picture */
    height: 100px; /* Fixed size for the picture */
    border-radius: 50%; /* Circle shape for the picture */
    margin-bottom: 15px; /* Space below the image */
    overflow: hidden; /* Hide overflow for round images */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Shadow for image */
}

.review-card .pic img {
    width: 100%; /* Responsive width */
    height: auto; /* Maintain aspect ratio */
}

.review-card .description {
    padding: 10px 10px; /* Padding for the description */
    font-size: 15px; /* Font size */
    color: #333; /* Font color */
    line-height: 1.5; /* Line height */
    margin-bottom: 15px; /* Space below the description */
}

.review-card .title {
    margin: 10px 0; /* Margin around title */
    font-size: 20px; /* Font size */
    font-weight: 600; /* Bold font */
    color: #f35525; /* Title color using primary color */
    letter-spacing: 1px; /* Space between letters */
    text-transform: uppercase; /* Uppercase text */
}

.review-card .rating-stars {
    margin: 10px 0; /* Margin for star ratings */
    font-size: 18px; /* Star size */
    color: #f35525; /* Color for stars */
}

/* Navigation button styles */

.owl-nav {
    text-align: center;
    margin-top: 20px;
}

.owl-nav button {
    background-color: #f35525;
    color: #fff;
    border: none;
    padding: 10px 15px;     border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s;
    margin: 0 10px;
}

.owl-nav button:hover {
    background-color: #e44b1b;
}

/* Responsive adjustments */
@media only screen and (max-width: 479px) {
    .review-card {
        padding: 15px; /* Padding for smaller screens */
    }

    .review-card .description {
        padding: 0; /* Padding for description */
    }
}

@media (min-width: 768px) {
    /* .owl-carousel {
        max-width: 80%;
        margin: 0 auto;
    } */
}

@media (min-width: 1024px) {
    .review-card {
        max-width: 300px; /* Maximum width on larger screens */
    }
}

.owl-theme .owl-controls {
    margin-top: 20px; /* Space above controls */
}

.owl-theme .owl-controls .owl-page span {
    width: 15px; /* Dot size */
    height: 15px; /* Dot size */
    border-radius: 50%; /* Circle shape */
    background: #f35525; /* Dot background */
    opacity: 0.8; /* Dot opacity */
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.45); /* Dot shadow */
    transition: all 0.3s ease 0s; /* Transition for hover effect */
}

.owl-theme .owl-controls .owl-page.active span {
    background: #000; /* Active dot color */
}

.btn-prev,
.btn-next {
    display: inline-block; /* Inline block for button layout */
    background-color: #1e1e1e; /* Default background color */
    color: #fff; /* Text color */
    font-size: 14px; /* Font size */
    font-weight: 500; /* Font weight */
    height: 40px; /* Button height */
    line-height: 40px; /* Line height to center text vertically */
    padding: 0px 30px; /* Padding for button */
    border-radius: 25px; /* Rounded corners */
    transition: all 0.3s; /* Smooth transition for hover effects */
    border: none; /* Remove border for a cleaner look */
    cursor: pointer; /* Change cursor to pointer */
    margin: 0 10px; /* Margin for space between buttons */
}

/* Hover and focus effects */
.btn-prev:hover,
.btn-next:hover,
.btn-prev:focus,
.btn-next:focus,
.btn-prev:active,
.btn-next:active {
    background-color: #f35525; /* Background color on hover */
    color: #fff; /* Text color on hover */
    outline: none; /* Remove outline */
    box-shadow: none; /* Remove any default box shadows */
}

/* business profile */
/* General styling for the container */
.business-profile-container {
    /* max-width: 1200px; */
    max-width: 100%;
    margin: 0 auto;
    padding: 20px;
    /* background-color: #f9f9f9; */
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Header section */
.header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 20px;
}

.logo img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
}

.business-details {
    margin-left: 20px;
}

.business-name {
    font-size: 24px;
    margin: 0;
}

.verified-badge {
    color: green;
    font-size: 16px;
    margin-left: 10px;
}

.business-tags {
    /* font-size: 14px; */
    /* color: #666; */
    color: #f35525;
}

.ratings {
    font-size: 14px;
    color: #999;
}

.rating-stars {
    color: #f39c12;
    font-size: 24px;
}
/* General Styles for info-box */
.info-box {
    background-color: #fff;
    padding: 15px;
    margin-bottom: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Grid Layout: Responsive Behavior */
.grid-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
}

/* For Desktop & Large Screens: 3 items per row */
@media (min-width: 1024px) {
    .grid-layout {
        grid-template-columns: 1fr 1fr 1fr;

    }
}

/* For Mobile: Single Column Layout */
@media (max-width: 768px) {
    .grid-layout {
        grid-template-columns: 1fr;
    grid-gap: 0px;

    }
}

/* Social links: Centered and spaced */
.business-social-links {
    display: flex;
    justify-content: space-around;
    padding: 0;
}

.business-social-links li {
    list-style: none;
}

.business-social-links a {
    font-size: 1.5rem;
}

/* Modal improvements for mobile */
@media (max-width: 768px) {
    .modal-dialog {
        max-width: 100%;
        margin: 0;
    }

    .modal-content {
        height: 100vh;
        border-radius: 0;
    }

    .modal-body {
        overflow-y: auto;
    }
}

/* Specialization badges: Make them responsive */
.specialization-list {
    padding: 0;
}

.specialization-list li {
    display: inline-block;
    background-color: #f35525;
    color: #fff;
    padding: 5px 10px;
    border-radius: 15px;
    font-size: 0.9rem;
    margin-bottom: 5px;
}

/* Map Container: Make it responsive */
.info-box iframe {
    width: 100%;
    height: 300px; /* Adjust the height of the map for mobile */
}

@media (max-width: 767px) {
    .busines-mtop {
        margin-top: 85px;
    }
}



.gallery-img {
    max-width: 100%;
    max-height: 300px;
    object-fit: cover;
    border-radius: 8px;
}


.write-review-section {
    max-width: 600px;
    background-color: #f9f9f9;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.star-container i {
    font-size: 2rem;
    color: #ccc;
    cursor: pointer;
    transition: color 0.3s ease;
}

.star-container i.selected,
.star-container i.hovered {
    color: #ffc107;
}

.star-container i:hover {
    color: #ffc107;
}


/* CSS to increase the size of radio buttons */
.larger-radio {
    width: 25px;
    height: 25px;
    margin-right: 10px;
}

/* loading gif */
.loading-gif{
    height: 200px;
    width: 200px;
}
/* Mobile Navigation Container */
.mobile-nav {
    position: fixed; /* Position fixed at the bottom */
    bottom: 0; /* Align to the bottom */
    left: 0; /* Align to the left */
    right: 0; /* Align to the right */
    background-color: #f35525; /* Background color */
    border-top: 1px solid #ddd; /* Top border for separation */
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.15); /* Shadow effect */
    z-index: 9999; /* Ensure it stays on top */
}

/* Mobile Navigation List */
.mobile-nav-list {
    display: flex; /* Use flexbox for layout */
    padding: 0; /* Remove default padding */
    margin: 0; /* Remove default margin */
    list-style: none; /* Remove list styles */
}

/* Mobile Navigation Items */
.mobile-nav-item {
    flex: 1; /* Flex to fill space equally */
    display: flex; /* Use flexbox for layout */
    flex-direction: column; /* Stack items vertically */
    justify-content: center; /* Center items vertically */
    align-items: center; /* Center items horizontally */
}

/* Mobile Navigation Links */
.mobile-nav .nav-link {
    color: white !important; /* Override color to white */
    font-size: 12px !important; /* Set font size */
    display: flex !important; /* Use flexbox for layout */
    flex-direction: column !important; /* Stack items vertically */
    align-items: center !important; /* Center items horizontally */
    justify-content: center !important; /* Center items vertically */
    padding: 5px 0 !important; /* Set padding */
    position: relative !important; /* Position relative for ::before */
    border-radius: 0 !important; /* Remove border-radius to avoid interference */
    background: transparent !important; /* Ensure background is transparent */
    text-align: center !important; /* Center text for better alignment */
}

/* Icon and text styles specific to mobile nav */
.mobile-nav .nav-link i {
    font-size: 22px !important; /* Icon size */
}

.mobile-nav .nav-link span {
    font-size: 10px !important; /* Text size under the icon */
    margin-top: 5px !important; /* Space above text */
}

/* Active link styles specific to mobile nav */
.mobile-nav .nav-link.active {
    background-color: transparent !important; /* No background for active tab */
    color: #ffffff !important; /* Active link text color */
}

/* Top line indicator for active link */
.mobile-nav .nav-link.active::before {
    content: '' !important; /* Empty content for line */
    position: absolute !important; /* Position absolutely */
    top: 0 !important; /* Align to top */
    left: 0 !important; /* Align to left */
    right: 0 !important; /* Align to right */
    height: 2px !important; /* Height of the line */
    background-color: white !important; /* Color of the line */
}

/* Active icon and text color */
.mobile-nav .nav-link.active i,
.mobile-nav .nav-link.active span {
    color: white !important; /* Keep icon and text color white */
}

/* Responsive Adjustments */
@media (max-width: 992px) {
    .favbtn .position-fixed {
        bottom: 70px !important; /* Adjust position of favorites button */
    }

    .offcanvas-footer {
        bottom: 35px !important; /* Adjust position of offcanvas footer */
    }

    .favbtn {
        display: none !important; /* Hide favorites button */
    }
}

/* Desktop WhatsApp button styling */
.whatsapp-desktop {
    background-color: #25D366;
    border-color: #25D366;
    border-radius: 50px;
    padding: 12px 20px;
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(37, 211, 102, 0.3);
    animation: pulse-whatsapp 2s infinite;
}

.whatsapp-desktop:hover {
    background-color: #128C7E;
    border-color: #128C7E;
    transform: scale(1.05);
    transition: all 0.3s ease;
}

/* Mobile WhatsApp button styling */
.whatsapp-btn-mobile .btn-success {
    background-color: #25D366;
    border-color: #25D366;
    border-radius: 50px;
    padding: 12px 20px;
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(37, 211, 102, 0.3);
    animation: pulse-whatsapp 2s infinite;
}

.whatsapp-btn-mobile .btn-success:hover {
    background-color: #128C7E;
    border-color: #128C7E;
    transform: scale(1.05);
    transition: all 0.3s ease;
}

@keyframes pulse-whatsapp {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(37, 211, 102, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
    }
}

/* Desktop button container */
.desktop-buttons .d-flex {
    flex-direction: row;
    align-items: center;
}

/* Mobile responsive adjustments */
@media (max-width: 992px) {
    .whatsapp-btn-mobile {
        bottom: 90px !important; /* Increased from default to move up */
    }
}

@media (max-width: 576px) {
    .whatsapp-btn-mobile {
        bottom: 60px !important; /* Even higher on smaller screens */
        padding: 12px !important;
    }

    .whatsapp-btn-mobile .btn-success {
        padding: 10px 18px;
        font-size: 14px;
    }
}

/* Extra small devices */
@media (max-width: 375px) {
    .whatsapp-btn-mobile {
        bottom: 50px !important;
    }
}