*{
  padding: 0;
  margin: 0;
}

.drop-shadow{
    filter: drop-shadow(0px 1px 0px #fff) !important;
}

@font-face {
  font-family: "CustomFont";
  src: url("SFCompactDisplay-Regular.otf") format("opentype");
}

body {
  font-family: "CustomFont", sans-serif !important;
  overflow-x: hidden !important;
}

.bg-red{
  background-color:#9d2022!important;
  color:#fff !important;
}
.bg-orange{
  background-color:#EC5800!important;
  color:#fff !important;
}
.bg-dark{
  background-color:#3b3735!important;
  color:#fff !important;
}

.text-red{
  color:#9d2022 !important;
}
.text-orange{
  color: #EC5800 !important;
}

.bg-image-f {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/b.jpeg')!important;
  /*background-position: center center !important;*/
  /*background-attachment: fixed !important;*/
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
.bg-image-one {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/bc.jpeg')!important;
  /*background-position: center !important;*/
  /*background-attachment: fixed !important;*/
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
.bg-image-two {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/bc5.png')!important;
  background-position: center !important;
  /*background-attachment: fixed !important;*/
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
.bg-image-three {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/bc4.jpeg')!important;
  /*background-position: center !important;*/
  /*background-attachment: fixed !important;*/
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.bg-image-terms-conditions {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/terns-conditions.jpeg')!important;
  background-position: center !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.bg-image-privacy-policy {
  width: 100% !important;
  height: 600px !important;
  background-image: url('https://img.freepik.com/free-photo/standard-quality-control-collage-concept_23-2149595831.jpg?w=996&t=st=1691391879~exp=1691392479~hmac=c2b98a0541edd622ac45ad847f5b3678a351cbb89786f1c1f09674c017ed7904')!important;
  background-position: center !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.bg-image-four {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/bc2.png')!important;
  /*background-position: center !important;*/
  /*background-attachment: fixed !important;*/
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
.bg-image-contact {
  width: 100% !important;
  height: 390px !important;
  background-image: url('https://img.freepik.com/premium-photo/contact-us-business-icon-computer-keyboard-with-globe_117856-2468.jpg?w=996')!important;
  /*background-position: center !important;*/
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
.bg-image-contact-us {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/contact-us.png')!important;
  background-position: center !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
.bg-image-about-us {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/about-us.jpg')!important;
  background-position: center !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.bg-image-who-we-are-us {
  width: 100% !important;
  height: 600px !important;
  background-image: url('assets/bc.jpeg')!important;
  background-position: center !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.bg-s-1 {
  width: 100% !important;
  height: 300px !important;
  background-image: url('https://img.freepik.com/free-photo/carpenter-holds-drill-drills-window_1150-24060.jpg?w=360&t=st=1690458943~exp=1690459543~hmac=534db14448dc8de7cdf5174bb10f046c5654c9d2866188a2b4f5ff8c25ecf61c')!important;
  /*background-position: center !important;*/
  background-repeat: no-repeat !important;
  background-size: contain !important;
}
.container-header {
  width: 86%;
  max-width: 86%;
}

.overlay {
  margin-top: 70px;
  background: rgb(0, 0, 0);
  background: rgba(0, 0, 0, 0.5); /* Black see-through */
  color: #f1f1f1; 
  width: 100%;
  transition: .5s ease;
  opacity:1;
  color: white;
  font-size: 20px;
  padding: 20px;
  text-align: center;
}

/* .container-header:hover .overlay {
  opacity: 1;
} */

.title-length {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.description-length {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.border-white-b{
  width: 100px !important;
  height: 5px;
  background-color:white;
}
.border-orange-b{
  width: 100px !important;
  height: 5px;
  background-color:#EC5800;
}

.card-box:hover{
  background-color:#EC5800;
  color: white;

}
.card-box-dark:hover{
  background-color:#fff!important;

}
.card-box, .card-box-dark{
  width: 100%;
  height: 420px;
}
 
.card-box:hover .text-orange{
  color: #fff!important;

}
.card-box:hover .text-dark{
  color: #fff!important;

}
.card-box-dark:hover .text-white {
  color: #000!important;

}
.card-box:hover .bg-orange {
  color: #fff!important;
 background-color: #000!important;
}
.container-s {
  position: relative;
  width: 100%;
}

.image-s {
  display: block;
  width: 100%;
  height: auto;
}

.overlay-s {
  position: absolute;
  bottom: 0;
  left: 100%;
  right: 0;
  background-color: #EC5800;
  overflow: hidden;
  width: 0;
  height: 100%;
  transition: .5s ease;
}

.col-five {
  flex: 0 0 19.33%;
  max-width: 50.6667%;
}

.container-s:hover .overlay-s {
  width: 100%;
  left: 0;
}

.text-s {
  color: white;
  font-size: 20px;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 45%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);

}

.logo-size{
  width: 150px!important;
}

.card-about{
  width: 100%!important;
  height: 430px !important;
}

.header-text-size{
  font-size: 23px!important;
 }

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .font-size{
    font-size:14px!important;
  }
  .overlay {
    margin-top: 30px!important;
  
  }
  .logo-size{
    width:100px !important
  }

  .h1,h1{
    font-size:25px!important;
  }
  .h4,h4{
    font-size:20px!important;
  }
  .container-header {
    width: 100%!important;
    max-width: 100%!important;
  }
  .header-text-size{
   font-size: 18px!important;
  }
  .bg-image-one, .bg-image-two, .bg-image-three,.bg-image-privacy-policy, .bg-image-four,.bg-image-terms-conditions,.bg-image-contact-us {
    width: 100% !important;
    height: 370px !important;
  }
  .bg-image-contact {
    width: 100% !important;
    height: auto !important;
   
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

}