color{
  color: #758FC9;
  color: #1D257A;
  color: #ABCDE8;
}




.bg-orange{
  background-color: white;
  
}

.nav-item a{
  padding-left: 10px;
  /* margin-right: 10px; */
    color: black;
    border-right: #DB4A07 3px solid;
    /* border-right: red px solid; */
    font-family: "Varela Round", sans-serif;
  font-weight: 800;
  font-style: normal;

}

.nav-item .nav-link{
  color: black;
  padding-left: 20px;
  padding-right: 20px;
  font-family: "Varela Round", sans-serif;
  font-weight: 800;
  font-style: normal;

}

.nav-item:hover{
  /* transition: 2s ease-out; */
  /* transform: translateY(-5px); */
background-color: #DB4A07;
color: white;

}
.nav-items a{
  padding-left: 10px;
  /* margin-right: 10px; */
    color: black;
    border-right: #DB4A07 3px solid;
    /* border-left: #DB4A07 3px solid; */
    /* border-right: red px solid; */
    font-family: "Varela Round", sans-serif;
  font-weight: 800;
  font-style: normal;

}

.nav-items .nav-link{
  color: black;
  padding-left: 20px;
  padding-right: 20px;
  font-family: "Varela Round", sans-serif;
  font-weight: 800;
  font-style: normal;

}

.nav-items:hover{
  /* transition: 2s ease-out; */
  /* transform: translateY(-5px); */
background-color: #DB4A07;
color: white;

}

.navbar-nav{
    /* gap: 30px; */
    font-size: 18px;
    color: black;
}

/* dropdown */
.dropdown {
    position: relative; 
    display: inline-block;
  }
  
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: WHITE;
    color: black;
    min-width: 260px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 12px 16px;
    z-index: 1;
    gap: 50px;
  }

  .dropdown-content a{
    color: black;
  }

  .dropdown-content:hover{
    background-color: white;
    color: black;
    }


  
  .dropdown:hover .dropdown-content {
    display: block;
    color: black;
  }
  
  .dropdown-link{
    padding-top: 30px;
  }


  @media(max-width:800px){
    .nav-items a{
      padding-left: 10px;
      /* margin-right: 10px; */
        color: black;
        border-right: #DB4A07 3px solid;
        
        font-family: "Varela Round", sans-serif;
      font-weight: 800;
      font-style: normal;
    }

  }
  /* banner */

  .home-banner {
    /* margin-top: 79.5px; */
    width: 100%;
    height: 70vh;
    font-family: 'Fredoka', sans-serif;
  
  }
  .home-banner img {
    margin-top: 0px;
    width: 100%;
    height: 70vh;
    /* filter: brightness(50%);
    object-fit: cover; */
  }
  
  
  @keyframes slideDown {
    0% {
      padding-top: 200px;
    }
    100% {
      padding-top: 300px;
    }
  }
  .banner-heading {
    position: absolute;
    z-index: 1;
    width: 100%;
    text-align: center;
    padding-top: 300px;
    color: white;
    animation-name: slideDown;
    animation-duration: 2s;
    padding-left: 20px;
  }
  
  .banner-heading h1{
    /* padding-right: 50px; */
    text-align: center;
    color: white;
    font-family: 'Fredoka', sans-serif;
  
  
  }
  
  .banner-button{
    text-align: center;
    width: 100%;
    padding-top: 40px;
  }
  
  .banner-button button{
    padding: 15px;
    border: none;
    /* font-size: large; */
    /* border-radius: 50px; */
    /* width: 200px; */
    /* padding-top: 30px; */
  }
  
  .banner-button button:hover{
    background-color: #758FC9;
  }
  

  /* about */

  .about{
    padding-top: 50px;
    padding-bottom: 30px;
   background: linear-gradient(90deg, rgb(167, 169, 176) 0%, rgba(93, 97, 116, 0.566) 61%, rgb(214, 214, 214) 100%);
   ;
  }
  .about-container{
    display: flex;
    /* padding-top: 20px; */
    padding-bottom: 30px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

  }

  .about-title{
    width: 50%;
  }

  .about-pic{
    width: 50%;
    /* background-color: #758FC9; */
    
  }
  

  .about-pic img{
    width: 100%;
    /* transform: rotateZ(-10deg); */
    transition: 1s ease-out;
  }
  /* .about-pic img:hover{
    width: 100%;
    transform: rotateZ(0deg);
    
  } */
  .about-title h1{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 50px;

  }
  .about-button button{
    color: white;
    padding: 20px;
    border-radius: 30px;
    border: none;
    background-color: #758FC9;
    transition: 2s ease-in;
  }
  .about-button button:hover{
    
    background-color: black;
    border-radius: 0px;
    
  }

  .about p{
    color: black;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  }

  .about h1{
    color: #758FC9 ;
    font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-size: 60px;
  }

  .about-view {
    color: black;
  }
  
.about-banner{
  margin-top: 0px;
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../assets/short-banner.jpg");
  height: 70%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  width: 100%;
  height: 200px;
}
.about-banner h2 {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}


  @media(max-width:800px){

    .banner-button button{
      padding: 10px;
      border: none;
      /* font-size: large; */
      /* border-radius: 50px; */
      /* width: 200px; */
      /* padding-top: 30px; */
    }
 
    .about-container{
      flex-direction: column-reverse;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

    }

    .about-title{
      width: 100%;
    }
    .about-title h1{
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      font-size: 50px;
    }
  
    .about-pic{
      width: 100%;
    }
    .homefloorpartner{
      display: none;
    }
    /* .service{
      display: none;
    } */
  }


 

  /* CLIENTFOR COMPANY */
  .homefloorpartner{
    width: 100%;
  }

  .clientflooring{
    display: flex;
    width: 100%;
    justify-content: space-evenly;
    gap: 20px;
  }
  .clientcompany{
    width: 25%;
    margin-bottom: 30px;
    box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;    border-radius: 16px;
    height: 200px;
    
    

  }

  .clientcompany img{
    width: 100%;
    height: 200px;
    /* From https://css.glass */
    background: rgba(117, 143, 201, 1);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    border: 1px solid rgba(117, 143, 201, 0.43);

    

  }
  .clientheading h1{
    margin: 40px;
    color: #758FC9;
    font-size: 50px;
    width: 100%;
    text-align: center;
    font-family: serif;
  }









  /* contact */
  .pagecontact{
    margin-top: 130px;
    text-align: center;
}

.contactpagetitle {
    background: url(../assets/banner/b2.jpg);
    background-size: cover; /* This property ensures that the background image covers the entire container */
    background-position: center; /* This property centers the background image within the container */
    height: 300px;
} 

.contactpagetitle h1 {
    padding-top: 150px;
    font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-size: 50px;

   
}
.contact-view-container{
  display: flex;
  gap:40px;
  padding-bottom: 50px;
}

.contact-view-form{
  border-radius: 40px;
  width: 100%;
  /* height: 00px; */
  text-align: center;

}

@media(max-width:800px){
  .contact-view-container{
    display:inline;
    
  }
}