*{font-family: Arial, Helvetica, sans-serif;}
.border_{/*border: 1px dashed #6b6b6b;*/}

/*logo*/
/*header logo*/
.logo{
  position: absolute;
  left: 45%;
  top: 40px;
  width: 250px;
  /* height: auto; */
  /* right: auto; */
  z-index: 1000;
}
.logo .logo-img{
  width: 220px;
  height: auto;
}
@media only screen and (max-width: 768px) {
  .logo{
    display: none;
  }
}
@media only screen and (max-width: 600px) {
  .logo{
    display: none;
  }
}
/*footer logo*/
.logo-footer{
  width: 100px;
}

.bg-light {
    background: linear-gradient(to right, transparent 0%, #95c442 100%);
}


/*social media icons*/
.social-media{
    display: block;
    width: 100%;
}
.social-media .fa {
  padding: 20px;
  font-size: 30px;
  /*width: 50px;*/
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
}
.social-media .fa:hover {
    opacity: 0.7;
    text-decoration: none;
}
.social-media .fa-facebook {
  background: #3B5998;
  color: white;
  padding: 10px;
  font-size: 28px;
}
.social-media .fa-twitter {
  background: #55ACEE;
  color: white;
  padding: 10px;
  font-size: 28px;
}
.social-media .fa-google {
  background: #dd4b39;
  color: white;
  padding: 10px;
  font-size: 28px;
}
.social-media .fa-linkedin {
  background: #007bb5;
  color: white;
  padding: 10px;
  font-size: 28px;
}
.social-media .fa-youtube {
  background: #bb0000;
  color: white;
  padding: 10px;
  font-size: 28px;
}
.social-media .fa-instagram {
  background: #125688;
  color: white;
  padding: 10px;
  font-size: 28px;
}
.social-media .fa-whatsapp{
  background: #a4c639;
  color: white;
  padding: 10px;
  font-size: 28px;
}

/*back top button*/
/*back to top button*/
#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  border: none;
  outline: none;
  background-color: #337ab7;
  color: white;
  cursor: pointer;
  padding: 15px 25px;
  border-radius: 0;
  font-size: 14px;
}
#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}

.carousel-caption{
  top: 60%;
  transform: translateY(-50%);
}

.overlapping_{
  position: relative;
}
.overlapping-section{
  position: relative;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  margin-top: -80px;
  margin-bottom: 0px;
  padding: 0px 15px 0px 15px;
}
@media only screen and (max-width: 600px) {
  .overlapping-section{
    position: relative;
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    margin-top: 10px;
    margin-bottom: 0px;
    padding: 0px 15px 0px 15px;
  }
}
.overlapping-section .col01{
  background-color: #a9c4d0;
}
.overlapping-section .col02{
  background-color: #007bb5;
  color: #FFF;
}
.overlapping-section .col03{
  background-color: #54b0d9;
}
.overlapping-section .col04{
  background-color: #1c8e4f;
  color: #FFF;

}

.col02 a, 
.col04 a {
  color:#FFF;
  text-decoration: none;
} 
.col01 a, 
.col03 a {
  color:#000;
  text-decoration: none;
} 
.col01:hover, .col03:hover {
    background-color: #55ACEE;
}
.col02:hover {
    background-color: #0c90f6;
}
.col04:hover {
    background-color: #25940f;
}

.btnx{
  padding: 10px 30px;
  border-radius: 0;
}

/*overlay*/
#overlay {
  position: relative;
  background-color: #FFFFFF;
  background-image: linear-gradient(rgb(0 255 36 / 60%), rgb(57 116 196 / 74%)), url(https://www.sktperfectdemo.com/demos/securepro/wp-content/uploads/2021/03/section-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 7%;
  color: #FFF;
}
@media only screen and (max-width: 600px) {
  #overlay {
    padding: 20%;
  }
}
@media only screen and (max-width: 768px) {
  #overlay {
    padding: 20%;
  }
}
#color-overlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: black;
   opacity: 0.6;
}
#overlay-content{
  position: absolute;
  top: 50%;
  left: 50%;
  color: white;
  transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
}


/*security equipment*/
#image-left img{
    display: block;
    margin-left: auto;
    text-align: left;
    /*width: 150px;*/
}
#image-right img{
    display: block;
    margin-right: auto;
    text-align: right;
    /*width: 150px;*/
}
#image-left, 
#image-right{
  position: relative;
  display: block;
  height: 400px;
  overflow: hidden;
}
.image-content {
  background-color: #1da353;
  color: white;
  padding: 50px;
  height: 400px;
  text-align: left;
}
.image-content02 {
  background-color: #007bb5;
  color: white;
  padding: 50px;
  height: 400px;
  text-align: left;
}
.image-content03 {
  background-color: #495357;
  color: white;
  padding: 50px;
  height: 400px;
  text-align: left;
}
@media only screen and (max-width: 600px) {
  .image-content {
    padding: 20px;
  }
  .image-content02 {
    padding: 20px;
  }
  .image-content03 {
    padding: 20px;
  }
}
@media only screen and (max-width: 768px) {
  .image-content {
    padding: 20px;
  }
  .image-content02 {
    padding: 20px;
  }
  .image-content03 {
    padding: 20px;
  }
}
.image-content-list{
  list-style-type: none;
  padding: 0;
}
.whatwedo .col-md-6{
  padding: 0 0;
}
@media only screen and (max-width: 600px) {
  .whatwedo .col-md-6{
    padding: 0 13px;
  }
  #image-left, 
  #image-right{
    position: relative;
    display: block;
    height: 300px;
    overflow: hidden;
  }
  #image-left img, 
  #image-right img{ 
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: left;
  }
}
@media only screen and (max-width: 768px) {
  .whatwedo .col-md-6{
    padding: 0 13px;
  }
  #image-left, 
  #image-right{
    position: relative;
    display: block;
    height: 300px;
    overflow: hidden;
  }
  #image-left img, 
  #image-right img{ 
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: left;
  }

}