@font-face {
    font-family: 'biennale';
    src: url('Fontspring-DEMO-biennale-regular.otf') format('opentype');
}
@font-face {
    font-family: 'nexa';
    src: url('Nexa-ExtraLight.ttf') format('truetype');
}

@font-face {
    font-family: 'nexa';
    font-weight: bold;
    src: url('Nexa-Heavy.ttf') format('truetype');
}


@font-face {
    font-family: 'biennale';
    font-weight: bold;
    src: url('Fontspring-DEMO-biennale-bold.otf') format('opentype');
}

@font-face {
    font-family: 'biennale';
    font-weight: 500; /* Or 'normal' */
    src: url('Fontspring-DEMO-biennale-medium.otf') format('opentype');
}

@font-face {
    font-family: 'biennale';
    font-weight: 600; /* Or 'semibold' */
    src: url('Fontspring-DEMO-biennale-semibold.otf') format('opentype');
}
html {
  scroll-behavior: smooth; /* Enable smooth scrolling for the entire page */
}

  body{
font-family: 'biennale',sans-serif !important;

width: 100vw!important;
  }
  nav a{
color: #2D2725 !important;
  }


  .container-1 h2{
    color: #C9B091;
    font-size: 40px;
  }
  .heading-1{
    font-size: 100px;
    font-weight: 600;
    color: #2D2725;
  }
  .container-1 button:first-child{
    
   padding: 10px;
    background-color: #f0f0f0;
    font-weight: bold;
  }
.container-1 button:nth-child(2){
    background-color: #2D2725;
    color: #C9B091;  
    padding: 15px;
}
.container-1 p{
    color: #b4b4b4;
    
}

.customer-container{
    border-radius: 20px;
    font-size: 14px;
    display: flex;
    background-color: #f8f8f8;
    align-items: center;
    justify-content: space-around;
    font-weight:600 ;
    padding: 10px;
    gap:20px;
}
.customer-container span{
    font-size: 40px;
    font-weight: bold;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.left-container{
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    font-size: 24px;

}
.services-container{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 80px;
}
.services-container h2{
    font-weight: bold;
    font-size: 3.5em;
}
.services-container p{
    font-size: 24px;
    margin-top: 10px;
}
.rating,.design,.satisfied-customer{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    
}
.rating,.design p,.satisfied-customer p{
    font-size:1em;
    margin:0;
}
.inner-container{
    background-color: #f8f8f8;
    display: flex;
    justify-content: space-between;
    align-items: center;
    overflow-x: scroll;
    margin-top: 50px;
    padding: 10px;
    
}
.inner-container::-webkit-scrollbar{
    display: none;
}
.service-1{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  max-width: 100%;
  height: 100%;
  margin: 0 auto;
  flex: 0 0 auto;
  transition: transform 1s ease-in-out;
}

.service-1 p{
    font-size: 1em;
}
.service-1 img{
  width: 100%;
  height: 300px;
  display: block;
  object-fit: cover;
}


.service-1 .i-container{
width: 100%;
height: 100%;
padding: 20px;

}
.i-container h2{
    font-size: 1.5em;
}
.black-container{
    background-color: #000000;
    width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
}
.black-container h1{
    font-size: 4em;
    font-weight: bold;
    color: #FFFFFF;
    margin-top: 50px;
    margin-bottom: 50px;
}

@media  (max-width: 420px){
    
.btn_mt-2{
    margin-top:10px;
}
    .black-container h1{
        font-size: 3em!important;
    }
    .right-container h3{
        font-size: 2em!important;
        font-weight: bold;
        
    
    }
    .right-container h5{
        font-size: 1em !important;
        font-weight: lighter;
        color: #b4b4b4;
    
    }
    .star span{
        font-size: 1em !important;
        
    }
    .inner-container{
        flex-direction: column;
    }
    #slideRight,#slideLeft{
        display: none;
    }
    .services-container p{
        font-size: 16px;
       
    }
    #contact-us h5{
        font-size: 1em;
    }
    .heading-1{
        font-size: 3em;
        font-weight:bold;
    }
    .container-1 h2{
        
        font-size: 1em;
      }
}

.right-container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
    padding: 50px;
    color: white;

}
.right-container h3{
    font-size: 4em;
    font-weight: bold;
    

}

.right-container h5{
    font-size: 1.5em;
    font-weight: lighter;
    color: #b4b4b4;

}
.right-container .star img{
    height: 20px;
    width: 20px;
}
 .star{
    display: flex;
    align-items: center;
    justify-content: center;
}
.star span{
    font-size: 1.5em;
    font-weight: 600;
}
.right-container button{
    
    width: 100%;
    height: 60px;
    background-color: #f8f8f8;
    color: #414546;
    font-size: 1.2em;
    font-weight: bold;

}
@media (max-width:420px){
    .work-row{
      
        flex-direction: row!important;
    }
    .work-step h2{
        
           font-size: 1em!important;
           
        }
        .work-step{
            height: 400px !important;

        }

}
.work-row{
    display: flex;
    flex-direction: row;
    padding: 10px;
    width: 100vw;
}
.work-step{
    display: flex;
    align-items: end;
    justify-content: center;
    background-color: #1f1f1f;
    height: 600px;
    border: 0.2px solid white ;
    max-width: 100%;
 
    }
.work-step img{
    display: none;
    width: 100%;
    height: 100%;
    object-fit: cover;

    

}
.work-container{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.work-step:hover img{
    display: block;
    width: 100%;
    height: 100%;
   background: #C9B091;
  
}
.work-step:hover h2{
    display: none;
  
   
}

.work-step h2{
font-weight: bold;
   font-size: 3em;
   color: #FFF;
   padding: 10px;
}
.about-us{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.about-container{
    display: flex;
    
    justify-self: center;
    flex-direction: column;
    align-items: center;
    background-color: #cfcfcf4a;
    border-radius: 10px;
    margin-top: 20px;
    color: white;

}
.about-imggg{
        
        width:100%; 
        height:700px; 
        object-fit: cover;
    }
.about-container img{
    padding: 50px;
}

@media (max-width:420px) {
    
    .work-container{
        display:none;
    }
    #about-us p,li{
        font-size:0.7em;
    }
    .about-imggg{
        margin-top:10px;
    height:300px;
    }
    .about-container {
        width: 100vw;
        
    }
    .about-container p{
        color: white;
        font-size: 1em!important;
        width:100%;
        margin-top: 20px;
       
    }
}
.about-container p{
    color: white;
    font-size: 1.2em;
    width:100%;
    margin-top: 20px;
    padding: 10px;
   
}
.about-container span{
    
    font-size: 3em;
    font-weight: bold;
    margin-top: 20px;
}
.about-container h1{
    color: #414546;
    font-size: 3em;
    font-weight: bold;
}

.about-container h4{
    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.what-customer-container{
    
    margin-top: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.what-customer-container h1{
    font-weight: bold;
    font-size: 4em;
}
.customer-1{
    
    height: auto;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    background-color: #1f1f1f;
    padding: 30px;
    color: #fff;
    
}
@media (max-width:420px){
.contact-mt{
    margin-top: 10px!important;
    
}

.customer-container{
   margin-top: 20px;
  }

}
.customer-1 h1{
    display: flex;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    justify-content: start;
    align-items: center;
}
.customer-1 h1 img{
height: 40px;
width: 40px;
margin-right: 10px;
}
#slideRight,#slideLeft{
  background-color: transparent;
  border: none;
  z-index: 1;
  
}
#slideLeft{
    position: absolute;
    right: 30px;
}
.number-m{
    color: black!important; /* Make the text transparent */
    text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white;
}

.primary-text{
    color:#2C2527
  }
  .secondary-text{
    color:#ECE7E3;
  }
  .primary-bg{
    background-color:#1f1f1f
  }
  .secondary-bg{
    background-color:#ECE7E3;
  }
  .info{
    font-family:'nexa',sans-serif ;
    
  }
  .submit-form {
    background-color: #414546;
    width: 100%;
    height: 50px;
    color: white;
    border-radius: 10px;
    border:none;
  
  }
  label{
    color: #606060;
 margin-top: 10px;
    font-size: large;
  }
  input,textarea{
    border: none!important;
    border-bottom: 1px solid #c4c4c4 !important;
    border-radius: 0px !important;
    padding: 5px!important;
    background-color: #f8f8f854!important;
 
  }
  .contact-info {
    display: flex;
    justify-content: space-between;
}
#contact-us,#about-us{
    font-family: 'nexa',sans-serif;
}
.bg-gray{
    background-color: #f8f8f8!important;
  }
  @media (max-width:420px){
    .customer-say{
        margin-top: 10px!important;
    }
  }
  .p-blue a{
    text-decoration: none;
  }