@charset "utf-8";
@import url("fontawesome-free-5.15.1-web/css/all.css");
/* CSS Document */

.body{

  margin: 0;
  padding: 0;
}

.letter {
  font-weight: lighter;
  line-height: 35px;
}

.buffer {
  background-color: #e5aa4e;
  height: 5px;}
.contact-heading{background-color:#ffc107; color:black;
        text-align: center;
				 padding:20px;}
.primary-swatch{background-color: #2d6c94;}

.blueish{
  color:#2d6c94;
}
.headblank {
  padding: 20px;
}
.indexheader{
   background-image: url(img/img-header2.jpg);

}
.servicesbg{
  background-image: url(img/bg-services.jpg);
}
.aboutus {
  background-image: url(img/bg-team.jpg);
  background-position: 50% -10%;
  background-color: white;
}

.mission {
  max-width: 280px;
  height: 400px;
  object-fit: cover;
}
  
 .bgcover {
    background-repeat: no-repeat;
  background-attachment: fixed;
  background-size:cover;
 } 
 .mobius {
  background-color: #de992d;


}




.mobius a{
  text-align: center;
  color: white;
  text-decoration: none;
  height:50px;
  border-bottom:2px solid #e5aa4e ;
  margin: 0 auto;
  padding: 10px;

}

.mobius a:hover{
  background-color:white;
  color:black;
  text-decoration: none;
  border-bottom: 0px;

}
.carouselcontain{padding:0}
.category-button img{width:80%;}

.footer-nav a{color:#FFFFFF; text-decoration: none;}
.footer-nav {color:#e5aa4e;}
.footer-nav a:hover{text-decoration: overline; color:#4eaae5}
.newslink {padding-bottom:30px}
.newslink a{color: #606060; text-decoration: none; font-weight: lighter;}
.newslink a:hover{color:#45b2d8;}
.gallery figcaption {margin-bottom: 20px;}
.peach {
  min-height:500px;
  background-image: url(img/bg-construction.png);
  background-position: 50% 50%;
  padding-left:0;
  padding-top:20%;
  padding-right:0;
  padding-bottom:20%;
  text-align: center;

}
.peach h3{
  color:#e5aa4e;
}

.ourservices
{
  background-image: url(img/bg-ourservices.png);
  padding-top: 80px;
  padding-left: 50px;
  padding-right: 50px;
  line-height: 30px;

}

.portfolio {
 color: white;
 background-color: #87CEEB;
   font-size: 25pt;
   font-weight: lighter;}

.portfolio-btn {
  text-decoration:none;
  color:white;
  font-weight: lighter;
  background-color: #2d6c94;
   border: 1px solid white
  
}
.portfolio-btn :hover{
  color:black;
  background-color:#d4d4d4;
  
}
.accordion-button:not(.collapsed) {
    color:black;
    background-color: #e5aa4e ;
    box-shadow: 0 2px 1px #D9D9D9;}

  .accordion-header button { background-color: #2d6c94;
    color: white;}

.accordion-item {
background-color: #f2f2f2;
border-style: solid;
border-width:0 0 1px 0;
font-size: 25pt;
font-weight: lighter;

}


.accordion-header button:hover{
  color:#grey;
  background-color:#e5aa4e}
.logorow {padding-left: 50px;
	padding-right: 50px;
	padding-bottom:30px;}
.logorow a:hover {opacity:70%}

.carousel-item h3{
  font-weight: lighter;
  
}
.carousel-caption{
  background-image: linear-gradient(to left, rgba(50,50,50,0),rgba(50,50,50,1), rgba(50,50,50,1), rgba(50,50,50,0));
}

.menucontact {
  margin:none;
  padding:20px;
  float: right;
  color: white;
  background-color: #2d6c94;
}


#whyus h1{color:#ffff;}
#whyus {line-height: 45px;
border-radius:200px;
max-width:960px;
padding:50px;
margin-top:100px;
margin-bottom:100px;
}

#whyus a{color:#ffff;}
#whyus a:hover {opacity:50% }
#gettouch {border-style: solid;
  border-radius: 89px;
border-color: #45b2d8;
padding: 20px}

#clientele {/*border-top:1px solid black*/
 padding-top: 30px;
color:#2d6c94;
}

.carouselowl {
  border-left: 1px solid black;
  margin-bottom: 50px;
}
.carouselowl img{
  width: 150px;
  height: 100%;
  padding: 10px;

}

.services{
margin:auto;
min-height:500px;
  background-image: url(img/img-header.png);
  padding:50px;
  line-height: 30px;

}

.servetext{
  color:white;
  background-color:#e5aa4e;
  padding:50px;
  border-radius: 15px;
}



.carousel-wrapper {
  display:flex;
}
.card-title {

  background-color: #f3f3f3;
  text-align: center;
  padding:30px;
  color: #2d6c94;
}
.cardx {
  width:calc(100%/2);
  min-height: 600px;
  background-color: white;
  border-radius: 15px;
  box-shadow: 3px 5px 5px rgba(0,0,0,0.2);
  margin: 20px;
  line-height: 30px;
}

.card-img-top {
  object-fit: cover;
  max-height: 200px;
}

.card-row {
  padding-right: 50px;
  padding-left:60px;
  margin:auto;
}


.cardm{

  width: 12rem;
  font-size: 10px;

}

  .cardm img{
    transition: width 1s, height 1s, transform 1s;
  }

  .cardm img:hover{
    transform: scale(2.0);
    position: relative;
    z-index: 10000;
    border-radius: 0px;
  }

.butt-car {
  background-color: #2d6c94;
  height: 50px;
  width: 50px;
  margin-top: 30%;
  border-radius: 50px;}

.working {

  max-width: 960px;
  padding: 50px;
  align-content: center;
  line-height: 50px;
  list-style-type: none;


}

.working h1{
  text-align: center;

}


.grid-item {
  float: left;
  background: #D26;
  border: 2px solid #333;
  border-color: hsla(0, 0%, 0%, 0.5);
  border-radius: 5px;
}


#btn-back-to-top{
	position:fixed;
	bottom:50px;
	right:50px;
	display:none;
  border: 1px solid white;
	background-color:#ffc107;
	z-index: 1000;
}


.navbar {
  background-color: #4eaae5;
}
.navbar .navbar-brand {
  width: 20%;
  color: #ffffff;
}
.navbar .navbar-brand:hover,
.navbar .navbar-brand:focus {
  color: #2d6c94;
}
.navbar .navbar-text {
  align-content: center;
  color: #ffffff;
}
.navbar .navbar-text a {
  color: darkorange;
}
.navbar .navbar-text a:hover,
.navbar .navbar-text a:focus {
  color: darkorange; 
}
.navbar .navbar-nav .nav-link {
  color: #ffffff;
  border-radius: .25rem;
  margin: 0 0.25em;
}
.navbar .navbar-nav .nav-link:not(.disabled):hover,
.navbar .navbar-nav .nav-link:not(.disabled):focus {
  color: #1f5689;
}
.navbar .navbar-nav .nav-item.active .nav-link,
.navbar .navbar-nav .nav-item.active .nav-link:hover,
.navbar .navbar-nav .nav-item.active .nav-link:focus,
.navbar .navbar-nav .nav-item.show .nav-link,
.navbar .navbar-nav .nav-item.show .nav-link:hover,
.navbar .navbar-nav .nav-item.show .nav-link:focus {
  color: #1f5689;
  background-color: #f7f2f9;
}
.navbar .navbar-toggler {
  border-color: #f7f2f9;
}
.navbar .navbar-toggler:hover,
.navbar .navbar-toggler:focus {
  background-color: #f7f2f9;
}
.navbar .navbar-toggler .navbar-toggler-icon {
  color: #ffffff;
}
.navbar .navbar-collapse,
.navbar .navbar-form {
  border-color: #ffffff;
}
.navbar .navbar-link {
  color: #ffffff;
}
.navbar .navbar-link:hover {
  color: #9EBEFF;
}



@media (max-width: 575px) {
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item {
    color: #ffffff;
  }
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item:focus {
    color: #1f5689;
  }
  .navbar-expand-sm .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #1f5689;
    background-color: #f7f2f9;
  }

.indexheader, .services {
  background-color: black;
  background-position: 63%;

}

.working {
  line-height: 40px;

}

.services {
  display: flex;
  overflow-x: scroll;
}


.cardx {
  width:auto;
  height: auto;
  background-color: white;
  border-radius: 15px;
  box-shadow: 3px 5px 5px rgba(0,0,0,0.2);
  margin: 20px;
  line-height: 30px;
}

.cardm{
  text-align: center;
  width: 8rem;
  font-size: 10px;
  padding:0;
  margin:5px;
}




#whyus {line-height: 45px;
max-width:960px;
border-radius: 0px;
padding:50px;
margin-bottom:0px;
}



 /*
 .indexheader::before {
  content: "";
  display: block;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);  Change the color and opacity as needed 
 }
 */

 

  #whatwedo,#whoweare {background-position: 50% 50%;}



}




@media (max-width: 767px) {
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown-item {
    color: #ffffff;
  }
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown-item:focus {
    color: #1f5689;
  }
  .navbar-expand-md .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #1f5689;
    background-color: #f7f2f9;
  }


.working {
  line-height: 40px;

}

}

@media (max-width: 991px) {
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item {
    color: #ffffff;
  }
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item:focus {
    color: #1f5689;
  }
  .navbar-expand-lg .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #1f5689;
    background-color: #f7f2f9;
  }


 .indexheader{
       background-position: 63%;

  }

  .peach {
  background-position: 75% 75%;
  padding-right: 80%;
  padding-left: 10%;
  text-align: left;
}

}

	


@media (max-width: 1199px) {
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown-item {
    color: #ffffff;
  }
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown-item:hover,
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown-item:focus {
    color: #1f5689;
  }
  .navbar-expand-xl .navbar-nav .show .dropdown-menu .dropdown-item.active {
    color: #1f5689;
    background-color: #f7f2f9;
  }
}

.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item {
  color: #ffffff;
}
.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item:hover,
.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item:focus {
  color: #1f5689;
}
.navbar-expand .navbar-nav .show .dropdown-menu .dropdown-item.active {
  color: #1f5689;
  background-color: #f7f2f9;
}

 .portfolio-gallery {
   width:95%;
   height:100%;
   margin: auto;
   padding-top: 30px;
  }

}
