
body {
    background: #f3fcf1;  
}

.d2d-header {
    background:black;      
}

.d2d-header h2{
    font-size: 250%;      
}
.gradient-text {
    font-family: "Archivo Black", sans-serif;
    margin-bottom: 0;
    background-color: #14ce2d;
    background-image: linear-gradient(90deg,#14ce2d,white,#14ce2d);
    background-size: 80%;
    background-repeat: no-repeat;
    animation: animate 3s linear infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@keyframes animate {
    0% {
        background-position: -500%;
    }
    100% {
        background-position: 500%;
    }
}

.bgimage {
    width:100%;
    height:580px;
    background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/trucks_on_highway.jpg');
    background-repeat: no-repeat;
    background-position: relative;
    background-size:cover;
    background-attachment: fixed;
    background-color: #888;
}

  .bgimage p {
    color:white;
    position: relative; /* Stay fixed */
    top: 60%;
}

.custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
  
.custom-toggler.navbar-toggler {
    border-color: rgb(255,255,255);
}

.navbar-custom .navbar-brand {
    color: black;
    margin-left: 15px;    
}

.d2d-nav {
    background: #14ce2d;
    margin-bottom: 25px;
    color: white;
}

.navbar-nav li a {
    color: white;
    font-size: larger;
    margin-left:25px;
    margin-right:25px;
}

.navbar-nav a:hover {
    color:black;
}

.navbar-nav .active {
    color:black;
}

.opacity {
    border-width: 200px;
    border-color: #14ce2d; 
}

.btn-primary { 
    background-color: #14ce2d;
    border-color: #14ce2d;
}

.btn.btn-primary:hover {  
    background-color: #3F4A3C;
    border-color: #3F4A3C;
}

.inner {
    overflow: hidden;
}

.inner img {
    transition: all 1.5s ease;
}

.inner:hover img {
    transform: scale(1.5);
}
 
.carousel {
    background: #f3fcf1;
    margin-top: 20px;
    color: #3F4A3C;
}

.carousel-item {
    text-align: center;
    min-height: 240px; /* Prevent carousel from being distorted if for some reason image doesn't load */
}
.carousel .carousel-indicators {
    bottom: 15px;
}

.carousel-indicators li, .carousel-indicators li.active {
    width: 11px;
    height: 11px;
    margin: 1px 5px;
    border-radius: 50%;
}

.carousel-indicators li {	
    background: #e2e2e2;
    border: none;
}

.carousel-indicators li.active {		
    background: #888;		
}

.carousel .testimonial {
	padding: 35px 140px;
	position: relative;
}
.carousel .testimonial::before {
	content: "\201C";
	font-family: Arial,sans-serif;
	color: #14CE2D;
	font-weight: bold;
	font-size: 72px;
	line-height: 74px;
	position: absolute;
	left: 300px;
    top: 0;
}
.services h3 {
    font-size: 250%;
}
.services h2 {
    font-size: 150%;
}
.footer {
    background: #3F4A3C;
    color: #e2e2e2;
}
.footer a:hover {
    background: #3F4A3C;
    color: #14ce2d;
}
a[href^=tel] {
    color: inherit;
    text-decoration: none;
}
.tnc {
    color:#14ce2d;
}
.kb {
    color:#ff7f50;
}
.kbdev, .kbdev a { 
    background: black;
    color: #e2e2e2;   
}
.kbdev a:hover {
    color: 	#ff7f50;
    background: black;
}
.contact_details p, a {
    color: #3F4A3C; 
}
.fa-map-marker, .fa-phone, .fa-envelope {
     color: #14ce2d;   
}
.phoneNum {
    color: #14ce2d;
    font-size: 18px;
}
.phoneNum:hover {
    color:#3F4A3C;    
}
    
.fa-facebook-f {
    color: #14ce2d;
    background: #3F4A3C;
    padding-top:5px;
    padding-right: 5px;
}

.fa-instagram {
    color: #14ce2d;
    background: #3F4A3C;
    padding-top:5px;
    padding-right: 5px;
}

.fa-instagram:hover, .fa-facebook-f:hover {
    opacity: 0.6;
}

 /* ---Media Queries -- */

@media (max-width: 992px) {
.carousel .testimonial {
    padding: 35px 60px 45px;
    position: relative;
}

.carousel .testimonial::before {
    left: 170px;

}

.bgimage {
    width:100%;
    height:500px;
    background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/trucks_on_highway.jpg');
    background-repeat: no-repeat;
    background-position: relative;
    background-size:cover;
    background-attachment: fixed;
    background-color: #888;
}

.bgimage p {
    color:white;
    position: relative; /* Stay fixed */
    top: 50%;
}

.display-3 {
    font-size: 350%;
}

}

@media (max-width: 768px) {
.bgimage {
    width:100%;
    height:500px;
    background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/trucks_on_highway.jpg');
    background-repeat: no-repeat;
    background-position: relative;
    background-size:cover;
    background-attachment: fixed;
    background-color: #888; 
}

.bgimage p {
    color:white;
    position: relative; /* Stay fixed */
    top: 50%;
}

.display-3 {
    font-size: 300%;
}

.display-4 {
    font-size: 250%;
}

.carousel .testimonial {
    padding: 35px 80px 45px;
    position: relative;
}

.carousel .testimonial::before {
    left: 100px;

}

}

@media (max-width: 576px) {
.bgimage {
background-image: linear-gradient(200deg,#14ce2d, rgb(236, 227, 227));
}

.display-4 {
    font-size: 200%;
}

.d2d-header h1{
    font-size: 160%;
}

.carousel .testimonial {
    padding: 35px 20px 45px;
    position: relative;
}

.carousel .testimonial::before {
    left: 70px;
}

.carousel h2 {
    font-size: 180%;
}
    
.display-3 {
    font-size: 280%;
}

} 

/*---Firefox Bug Fix --*/
.carousel-item {
transition: -webkit-transform 0.5s ease;
transition: transform 0.5s ease;
transition: transform 0.5s ease, -webkit-transform 0.5s ease;
-webkit-backface-visibility: visible;
backface-visibility: visible;
}

/*--- Bootstrap Padding Fix --*/
[class*="col-"] {
    padding: 1rem;
}
  
  
  
  
  

  
  
  
  
  
  
  
  
  