

body {

    background-color: #fff6f3;

    font-family: 'Poppins', sans-serif;

    font-size: 16px;

    line-height: 1.4;

    color: #835547;

}





.form-control:focus, .form-select:focus {

    box-shadow: none;

    outline: none;

}



header {

    position: fixed;

    left: 0;

    width: 75px;

    top: 0;

    z-index: 99;

    height: 100vh;

    border-right:1px solid #e78568;

    color: #fff;

}



.mask-nav {

    position: fixed;

    left: 0;

    width: 75px;

    top: 0; 

    z-index: 99;

    /* mix-blend-mode: exclusion; */

    height: 100vh;

}



video {

    object-fit: fill;

}



div#slideshow-banner { width:100%; overflow:hidden; position:relative; margin:0; min-height: 100vh; }

div#slideshow-banner ul li img {width: 100%;}

.navbutton {background-color: transparent; border: 0; width: 100%;padding: 10px;color: #e78568;}



.hero-text {

    position: absolute;

    z-index: 1;

    left: 16%;

    bottom: 10%;

    max-width: 650px;

    color: #fff;

    font-weight: 700;

}

.hero-text h1 {font-size: 48px; color: #fff;}

.hero-text img {max-width: 270px;}

.navbutton i {

    font-size: 20px;

}

.main-container {

    padding-left: 75px;

}

.navbutton .navopen {

    -webkit-transform: rotate(-90deg);

    -ms-transform: rotate(-90deg);

    transform: rotate(-90deg);

    position: absolute;

    left: 16px;

    top: 50px;

    font-weight: 600;

    font-size: 14px;

    color: #e78568;

}



.logoicon {

    position: absolute;

    top: 40%;

    left: 0;

    width: 100%;

    text-align: center;

}

.logoicon a {

    display: block;

    padding: 10px;

}

.logoicon img {

    max-width: 100%;

}

.navsocial {

    position: absolute;

    bottom: 0;

    left:0;

    width: 100%;

    text-align: center;

}

.navsocial a {

    display: block; 

    color: #e78568; 

    text-decoration: none;

    text-decoration: none;

    padding: 12px 10px;

    font-size: 26px;

    mix-blend-mode: difference;

}



.navsocial a:after {

    /* This value is the OPPOSITE color of our background */

    color: rgb(0, 255, 255); 

    mix-blend-mode: difference;

}



.mannavbar {

    position: fixed;

    width: 100%;

    height: 100vh;

    background-color: #fff;

    z-index: 9;

    visibility: hidden;

    transform: translateX(-100%);

    transition: transform 0.3s ease-in-out;

}



.navigationmenu {

    flex: 0 40%;

    width: 40%;

    background: #7e1830;

    height: 100vh;

    padding-left: 150px;

    align-items: center;

    /* justify-content: center; */

    display: flex;

}



.navigationmenu ul li a {font-size: 22px; color: #ffdbe3; text-decoration: none; display: block;padding: 10px 0;}



.nav-projectslider {

    flex: 0 60%;

    width: 60%;

}



.nav-pro-head {

    font-size: 22px;

    font-weight: 300;

    text-align: center;

    padding-top: 5px;

    color: #835547;

}



.navslider-project .owl-nav {text-align: right;}



.navslider-project button.owl-prev span, .navslider-project button.owl-next span {

    font-size: 30px;

    color: #7c3848;

    margin: 20px 14px;

}



.projects__name .nav-pro-head {

    font-size: 40px;

}

div#counter {

    position: absolute;

    bottom: 32px;

    left: 12px;

}



.btn-link {

    font-weight: 400;

    color: #e78568;

    text-decoration: none;

    border: 1px solid #e78568;

    text-transform: uppercase;

    padding: 10px 30px;

    border-radius: 0;

    transition: all .5s;

    overflow: hidden;

    position: relative;

}



.btn-link:before{

    width: 100%;

    height: 100%;

    content: '';

    margin: auto;

    position: absolute;

    top:  -100%;

    left: -100%;

    background: #e78568;

    transition: all .5s;

    z-index: -1;

    

}



.btn-link:hover{

    color: white;

}

.btn-link:hover:before{			

        top: 0;

        left: 0;



}



.projects__name {

    text-align: center;

}

.projects__name img {max-width: 200px; display: inline-block !important;}



/* .btn-link:hover {

  background-color: #e78568;

  color: #fff;  

} */



/* .btn-link:hover,

.btn-link:focus {

  box-shadow: inset -10em 0 0 0 var(--hover), inset 10em 0 0 0 var(--hover);

  color: #fff;

}



.btn-link {

    --color: #fff;

    --hover: #e78568;

} */



section h2 {

    font-size: 33px;

    font-weight: 300;

    color: #835547;

    margin-bottom: 30px;

}



.about-container h2 {

    font-size: 40px;

    font-weight: 300;

    color: #835547;

    margin-bottom: 30px;

}



.about-container p {color:#835547; font-size: 22px;}

.about-container img {max-width: 300px;}



.lifestyImg {

    position: relative;

    overflow: hidden;

    max-height: 369px;

}

.lifestyImg img {width: 100%;}

.dls-text {

    position: absolute;

    bottom: 10px;

    padding: 20px;

    left: 0;

    right: 0;

    text-align: center;

}

.dls-text h6 {text-transform: uppercase;}

.dls-text h6, .dls-text p {color: #fff;}

.dls-text p {

    margin-bottom: 0px;

}



.redmorebtn a {

    color: #7e1830;

    text-decoration: none;

    position: relative;

    display: inline-block;

    text-transform: uppercase;

    font-size: 14px;

    font-weight: 500;

    padding: 5px 0;

    min-width: 78px;

}

.redmorebtn a i {

    margin-left: 5px;

}

.redmorebtn a:before {

    content: "";

    height: 2px;

    background-color:#976b75;

    position: absolute;

    bottom: 2px;

    left: 0;

    width: 100%;

}

.redmorebtn a:hover:before {

    background-color: #eb5d69;

}



.bg-light {

    background-color: #f9eae6 !important;

}



.owl-dots {

    text-align: center;

    margin-top: 20px;

}

.owl-dot span {

    display: inline-block;

    margin: 0 5px;

    width: 10px;

    height: 10px;

    border-radius: 50%;

    background-color: #ccc;

}

.owl-dot.active span {

    background-color: #e78568;

}



.form-group {

    margin-bottom: 20px;

}

.form-group label {

    text-transform: uppercase;

    font-weight: 600;

    font-size: 14px;

}



.getintouch .form-control {

    border-radius: 0px;

    background-color: transparent;

    border: 0px;

    border-bottom: 1px solid #976b75;

    padding-left: 0px;

    padding-right: 0px;

}



.form-control::placeholder {

    font-style: italic;

    font-weight: 300;

}



.btn-primary {

    background-color: #e78568;

    border-color: #e78568;

    color: #fff;

    border-radius: 0;

    padding: 7px 30px;

    text-transform: uppercase;

    font-weight: 500;

    transition: all .5s;

    overflow: hidden;

}



.btn-primary:hover, .btn-primary:focus {

    background-color: transparent;

    color:#e78568;

    border-color: #e78568;

}

.contact-details {

    margin-bottom: 30px;

}

.contact-details p {

    font-size: 22px;

    font-weight: 300;

    color:#835547;

}

.contact-details p a, .contactSe-details p a {color: #835547;text-decoration: none;}

.contact-details p i {width: 30px;}

.contact-details p a:hover, .contactSe-details p a:hover{color: #7e1830;}



footer {

    background-color: #7e1830;

    color: #fff;

}

footer h6 {

    font-size: 24px;

    font-weight: 300;

    color: #e9c8d0;

}



.bottom-social a {

    margin-left: 20px;

    color: #e9c8d0;

    text-decoration: none;

    font-size: 32px;

}



.footerTop img {max-width: 90px;}



.footersitemap {

    margin-top: 40px;

    padding-bottom: 40px;

    border-bottom:1px solid #9d3c53;

}

footer h3 {font-size: 22px;}

.footersitemap li a {color: #e9c8d0; display: block; padding: 5px 0; text-decoration: none;}

.footercontact span {text-transform: uppercase; font-weight: 500; font-size: 14px;}

.btn-secondary {

    background-color: #fff;

    border: 0px;

    color:#835547;

    font-size: 14px;

    text-transform: uppercase;

    letter-spacing: 1px;

    border-radius: 0;

    padding: 10px 30px;

}

.footercontact {

    border-bottom: 1px solid #9d3c53;

}

.closemanu {display: none;}



.blockquote-footer {color: #835547;}

.blockquotecon {

    padding: 50px 0;

    max-width: 860px;

    margin: 0 auto;

}



.santanbilityCon {

    background: #7e1830;

    position: relative;

    padding:140px 0 80px 0;

    overflow: hidden;

}



.santanbilityCon:before {

    border-width: 75px 100vW 0 0;

    border-color: #fff6f3 transparent transparent;

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 0;

    height: 0;

    border-style: solid;

}



.santanbilityCon:after {

    border-width: 75px 100vW 0 0;

    border-color: #fff6f3 transparent transparent;

    content: '';

    position: absolute;

    display: none;

    bottom: 0;

    left: 0;

    width: 0;

    height: 0;

    border-style: solid;

    -webkit-transform: rotate(180deg);

    -ms-transform: rotate(180deg);

    transform: rotate(180deg);

    -webkit-transform-origin: center;

    -ms-transform-origin: center;

    transform-origin: center;

}



.santanbilityCon h2, .santanbilityCon p  {

    color: #fff;

}

.portfolio-filter {

    margin-top: 20px;

}

.portfolio-filter .form-select {

    border-radius: 0px;

    background-color: transparent;

    border: 0px;

    border-bottom: 1px solid #976b75;

    padding-left: 0px;

    padding-right: 0px;

    color: #976b75;

}

.projectList {

    padding-top: 40px;

}

.projectList a {display: block; color: #835547; text-decoration: none;}

.projectList h5 {

    font-size: 24px;

    font-weight: 300;

    margin-top: 20px;

    text-decoration: none;

    margin-bottom: 40px;

}

.projectImg {

    position: relative;

    overflow: hidden;

    background: #9b9b9b;

    /* min-height: 550px; */

}



.prol-hover {

    position: absolute;

    height: 100%;

    left: 0;

    top: 0;

    width: 100%;

    align-items: center;

    justify-content: center;

    background-color: rgb(50 36 32 / 90%);

    display: none;

}

.prol-hover img {max-width: 200px;}



.projectImg:hover .prol-hover {display: flex;}



.project-hero {

    height: 100vh;

    overflow: hidden;

    position: relative;

}

.project-hero img {

    width: 100%;

}



.project-hero .herologo-img{

    max-width: 200px;

    position: absolute;

    top: 35%;

    left: 5%;

}



.sideimages img {

    border-radius: 0 100px 0 0;

}

.featureList {

    margin-bottom: 20px;

}



.featureList p {

    margin-bottom: 0;

    text-transform: uppercase;

    font-size: 13px;

    font-weight: 700;

    color: #a16351;

}

.featureList i {

    margin-right: 10px;

}

.featureList i img {max-width: 40px;}



.ametiesSection {

    padding:auto ;

}



.proImageSlider img {

    border-radius: 100px 0 100px 0;

}



.sep-border {border-left:1px solid #976b75;}

.proImageSlider .owl-nav {padding-left: 40px;}

button.owl-prev i, button.owl-next i {

    font-size: 30px;

    color: #7c3848;

    margin: 20px 10px;

}



.contactSe-details span {

    text-transform: uppercase;

    font-size: 14px;

    font-weight: 600;

}



.conlogo span {

    background: #7c3848;

    width: 60px;

    height: 60px;

    border-radius: 50%;

    display: block;

    text-align: center;

    line-height: 60px;

    margin-right: 20px;

}



.conlogo img {

    max-width: 40px;

}



.salecon h6 {

    text-transform: uppercase;

    font-weight: 300;

    font-size: 14px;

    margin-bottom: 0px;

}

.salecon h4 {font-size: 24px; color: #7e1830; font-weight: 700;}

.lifestyle__nav {text-align: center;}

.lifestyle__nav ul li {padding: 0 20px;}

.lifestyle__nav ul li a {

    text-decoration: none;

    text-transform: uppercase;

    color: #ddafa2;

    display: block;

    padding: 5px 0px;

    position: relative;

}



.lifestyle__nav ul li a.active, .lifestyle__nav ul li a:hover {

    color: #a16351;

}



.lifestyle__nav ul li a.active:before, .lifestyle__nav ul li a:hover:before {

    content: "";

    position: absolute;

    height: 2px;

    background-color:#a16351;

    left: 0;

    width: 100%;

    bottom: 0;



}



.lifestyle__nav.stickysabmenu {

    background: #ffffff;

    width: 100%;

    padding:5px 0 15px 0;

    box-shadow: 0 0 8px rgb(0 0 0 / 16%);

    position: fixed;

    left: 75px;

    right: 0;

    top: 0;

    z-index:1;

}



.logo-frame {

    background: #7e1830;

    border-radius: 10%;

    /* max-width: 350px; */

    min-height: 350px;

    height: 100%;

    width: 100%;

    padding: 0px 0px;

    display: flex;

    align-items: center;

    justify-content: center;

    /* border: 4px solid #7e1830; */

}

.logo-frame img.img-fluid {

    max-width: 80%;

}

.hero-video {

    width: 100%; height: 100vh;

}



.sustainability {

    width: 352px;

    height: 352px;

    border-radius: 10px;

}



.logopage {max-width: 300px;}

.lifestyImg:before {

    content: "";

    background: rgb(0 0 0 / 43%);

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

}



.padd140 {

    padding-top: 140px !important;

}



@media (max-width:767px) {

    div#slideshow-banner {

        min-height: auto;

    }

    .padd140 {

        padding-top: 0px !important;

    }

    .hero-video {

        width: auto; height: 75vh;

    }

    .santanbilityCon {padding-top: 140px;}

    .main-container {

        padding-left: 0px;

        padding-top: 63px;

    }

    .navsocial {

        display: none;

    }

    .logoicon {position: static; text-align: left;width: 70px;}

    .logoicon a {padding: 0 10px;}

    header {

        height: inherit;

        width: 100vw;

        display: flex;

        justify-content: space-between;

        padding: 10px;

        border-right: 0;

    }

    header.darkheader {

        background: #fff;

        box-shadow:0 0 10px rgb(0 0 0 / 16%);

    }

    .navbutton i {

        font-size: 34px;

    }

    .navbutton {width: auto; padding: 0 10px;}

    .navbutton .navopen {display: none;}

    .nav-projectslider {display: none;}

    .navigationmenu {width: 100%;}

    .navigationmenu {padding-left: 50px;}

    div#slideshow-banner ul li img {

        width: auto;

        height: 100vh;

    }

    .hero-text {

        left: 6%;

        bottom:10%;

    }

    .hero-text h1 {font-size: 26px;}

    .projects__name {

        text-align: center;

        margin-bottom: 40px;

    }

    .footerTop img {

        margin-bottom: 30px;

    }

    

    .lifestyle__nav.stickysabmenu {

        left: 0;

        right: 0;

        top: 62px;

    }

    .lifestyle__nav ul li {

        padding: 0 7px;

    }

    .project-hero {height: auto;}

    .sep-border {border-top:1px solid #976b75 !important; border-left: 0;}

    section.lifestyle-container h2 {

        font-size: 24px;

    }

    section h2 {font-size: 26px;}

    .project-hero .herologo-img {top: inherit; bottom: 20px;}

    .proImageSlider img {border-radius: 0;}

    .contact-details p {font-size: 18px;}

    .about-container img {

        max-width: 200px;

    }

    .about-container h2 {font-size: 34px;}

    .logopage {max-width: 250px;}

    .project-hero:before {

        content: "";

        position: absolute;

        background: rgb(0 0 0 / 39%);

        left: 0;

        width: 100%;

        top: 0;

        height: 100%;

    }
    .sustainability {

        width: 100%;
    
        height: 352px;
    
        border-radius: 10px;
    
    }

}



.footerBottom a {color: #ffccbd; text-decoration: none;}