body{  color:#202020; font-size: 18px; line-height: 24px; font-family: 'Lato', sans-serif; 
}

h1,h2,h3,h4,h5,h6{margin: 0px; padding: 0px; font-family: 'Titillium Web', sans-serif !important;}


a{
   -webkit-transition: all 0.4s ease-in-out;
     -moz-transition: all 0.4s ease-in-out;
     -ms-transition: all 0.4s ease-in-out;
     -o-transition: all 0.4s ease-in-out;
     transition: all 0.4s ease-in-out;
}
* { margin:0px; padding:0px; box-sizing:border-box;}
.clear { clear:both;}


/* top-box start */

.top-box { width:100%; height:auto; float:left; text-align:left; padding-top:10px; padding-bottom: 10px;} 

.logo { font-size:30px; line-height:40px; font-weight: 700; text-decoration: none;
  color: #202020; font-family: 'Titillium Web', sans-serif; } 
  .logo a { color: #202020; text-decoration: none; font-family: 'Titillium Web', sans-serif;}
  .logo:hover { color: #202020 !important; text-decoration: none; font-family: 'Titillium Web', sans-serif;}
 .logo i { color: #FFF; font-size: 22px;}
 .logo .badge { width: 42px; height: 42px; background-color: #d4e6f6; border-radius: 50%; display: inline-block; text-align: center; padding:6px 0px 0px 0px; color: #FFF; margin: 0px;}

 .top-box h3 { color:#202020; font-size:20px; line-height: 30px; text-decoration:none; font-weight:400;} 
 .top-box h3 a { color:#202020; text-decoration: none; font-weight: 700;} 
 .top-box h3 a:hover { color:#2d4c69; text-decoration:none; font-weight: 700;
  }

/* welcome Start */
  
.welcome { width:100%; height: auto; float:left; background:  linear-gradient(-45deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.01)) fixed,  url(../images/welcome-bg2.jpg) center top no-repeat; background-size: cover; clear:both; } 

 .welcome .inside { width: 100%; height: auto; float: left; padding-top:130px; padding-bottom: 150px; color: #FFF; font-size: 24px; line-height: 30px; text-align: center;}
.welcome .inside h1 { font-weight: 700; color: #FFF; } 
.welcome .inside h2 { font-weight: 400; color: #FFF; font-size: 28px;} 
.welcome .inside .box { max-width: 1060px; margin: 0px auto; text-align: center;}

  .typer-text {
   height:80px; width:100%; float:left; text-align:center; font-size:36px; line-height:40px; color: #01a377 !important; font-weight:700; margin:0px; text-transform:uppercase; padding-top: 22px;
   font-family: 'Titillium Web', sans-serif;
}

a.get-in-touch-button{  background: #d3e600;
  text-align: center; display: inline-block; color: #202020; font-weight: 700; font-size: 22px; text-decoration: none; border-radius:0px; text-shadow:none; border:none; transition: all 0.5s; padding: 22px 44px;  text-transform: uppercase; font-family: 'Titillium Web', sans-serif; } 
  a.get-in-touch-button:hover{ background: #e2f600; font-family: 'Titillium Web', sans-serif;
    color: #000000; box-shadow: 0 10px 10px -8px rgba(0, 0, 0,.5);}

  /* welcome end */

   /* featured-title start */

   .featured-title { width: 100%; height: auto; float: left; text-align: center; background-color: #f5f5f5;
  padding-top: 50px; padding-bottom: 50px; font-weight: 600;}

  /* featured-title end */

   /* services-box start */

 .services-box { width: 100%; height: auto; float: left; padding-top: 120px; padding-bottom: 120px; }
 .services-box .title-box { max-width: 900px; margin: 0px auto; text-align: center;}
 .services-box .title-box h2 { font-weight: 700; } 
 .services-box h3 { font-weight: 700; font-size: 18px; color: #19ce67;}
 .services-box h4 { font-weight: 600; font-size: 26px;}
 .services-box .item-box { width: 100%; height: auto; float: left; text-align: center; background-color: #FFF;  box-shadow: 0px 20px 45px rgba(51, 77, 114, 0.10); transition: all 0.3s ease-out; position: relative; border: 1px solid #dbdbdb;
  clear: both; font-size: 16px; color: #333333;} 
   .services-box .item-box .top { width: 100%; left: 0px; top: 0px; position: relative;} 
   .services-box .item-box .icon { width: 100%; margin: 0px auto; text-align: center; left: 0px; right: 0px;
  bottom: -70px; position: absolute;}
  
  .services-box .item-box .bottom-box { width: 100%; float: left; text-align: center; padding:30px 30px 30px 30px; position: relative;}

    .services-box .item-box:hover { box-shadow: 0px 20px 45px rgba(51, 77, 114, 0.25); background-color: #ebf4fb;}

    .svcase img { width: 100% !important;}
  
    .svcase__img img {
      max-width: 100% !important;
      transform: scale(1);
      transition: 1s; 
    }
    .svcase:hover .svcase__img img {
      transform: scale(1.1);
    
    }
    .fix {
      overflow: hidden;
    }

  /* services-box end */

  /* about-us start */

.about-us { width: 100%; float: left; padding-top: 120px; padding-bottom: 120px; background-color: #f8f8f8;}
.about-us h2 { font-weight: 700;}
.about-us .item-box { width: 100%; float: left; background-color: #FFF; padding: 26px 26px;
  box-shadow: 0px 10px 39.2px 0.8px rgb(0 0 0 / 10%);}
.about-us .item-box h4 { font-weight: 600; font-size: 22px; color: #2d5d83;} .about-us .item-box i { color: #256aa1; } 
.about-us .item-box .badge { width: 50px; height: 50px; background-color: #2d5d83; border-radius: 50%;
 display: inline-block; text-align: center; padding-top: 14px;}

 a.contact-button{  background: #2d5d83;
  text-align: center; display: inline-block; color: #FFF; font-weight: 700; font-size: 22px; text-decoration: none; border-radius:0px; text-shadow:none; border:none; transition: all 0.5s; padding: 22px 44px;  text-transform: uppercase; font-family: 'Titillium Web', sans-serif; } 
  a.contact-button:hover{ background: #256aa1; font-family: 'Titillium Web', sans-serif;
    color: #FFF; box-shadow: 0 10px 10px -8px rgba(0, 0, 0,.5);}

/* about-us end */

   /* counter-box start */

   .counter-box { width: 100%; height: auto; float: left;  background:  linear-gradient(-45deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)) fixed,  url(../images/counter-box-bg.jpg) center top no-repeat; background-size: cover; clear:both; padding-top: 80px;
    padding-bottom: 80px; text-align: center; color: #FFF;}
    .counter-box h2 { font-weight: 700; color: #FFF; margin-top: 10px;} .counter-box i { margin-bottom: 24px;}
    .counter-box h3 { font-weight: 600; color: #FFF; font-size: 22px;}
    
      /* counter-box end */

/* featured start */

.featured { width: 100%; height: auto; float: left; padding-top: 100px;
  padding-bottom: 100px; }
  .featured h2 { font-weight: 700; }
  .featured .item-box { width: 100%; float: left; padding: 24px 30px; background-color: #2d5d83; color: #FFF;} .featured .item-box i { }  
  .featured .item-box h4 { font-weight: 700;}
  .featured .item-box2 { width: 100%; float: left; padding: 24px 30px; background-color: #f5f5f5; }
  .featured .item-box2 h4 { font-weight: 700;}
  .featured .item-box2 i { color: #2d5d83;}
  
  /* featured end */

   /*our-services Start */


   .our-services { text-align:center; width:100%; height:auto; clear:both; float:left; padding-top:90px; padding-bottom:100px; background-color: #2d5d83; color: #FFF; }
     .our-services .title-box { text-align:center; max-width: 800px; margin: 0px auto; height:auto; clear:both;} 
     .our-services .title-box h2 {  font-weight:700; color: #FFF;} 
    .our-services .item-box { width:100%; float:left; text-align:center;} 
     .our-services .item-box img { margin-bottom:24px;}
    .our-services .item-box h3 { color:#FFF; font-size:24px; font-weight:700;}
    
    /*our-services end */

 /* locksmith start */

 .locksmith { width: 100%; height: auto; float: left; text-align: left;
 }  
 .locksmith .container-fluid {width:100%; max-width:none; padding:0; margin: 0px;}
 .locksmith .row {margin-left:0;margin-right:0;}
 .locksmith [class*="col-"] {padding-left:0;padding-right:0}
 .locksmith h2 { font-weight: 700; text-transform: capitalize;}
 .locksmith-img { height: 550px;} .locksmith .box .row { flex-direction: row-reverse;}
 .locksmith ul { margin: 0px; padding: 0px; list-style-type: none;}
 .locksmith ul li { width: 50%; float: left; display: block; padding: 6px 0px; font-weight: 600; font-size: 18px;}
 .locksmith ul li i { color: #2d5d83; margin-right: 5px;}
 
 /* locksmith end */

  /*testimonial Start */

.testimonial { text-align:center; width:100%; height:auto; clear:both; float:left; padding-top:120px; padding-bottom:120px;}
.testimonial .title-box { width:100%; height:auto;  float:left; text-align:center;}
.testimonial .title-box h2 { font-weight:700;} .testimonial i { color: #2d5d83; font-size: 24px; margin-right: 4px;} 
.testimonial .item-box { width:100%; float:left; text-align:center;} 
.testimonial .item-box img { margin-right:4px;} 
.testimonial .item-box strong { color:#2d5d83; font-weight:700; text-transform:uppercase;}

/*testimonial end */

 /* body-title start */

 .body-title { width: 100%; height: auto; float: left; text-align: center; background: linear-gradient(-45deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0.7)) fixed, url(../images/body-title-bg.jpg) center top no-repeat; background-size: cover; padding-top: 100px; padding-bottom: 100px; color: #FFF; }

 .body-title .inside { max-width: 800px; height: auto; margin: 0px auto; text-align: center;}
 .body-title .inside h2 { font-weight: 700; text-transform: capitalize;}

/* body-title end */


    /* contact-us Start */

    .contact-us { width:100%; height:auto; float:left; text-align:center; padding-top:72px; padding-bottom:76px; border-bottom: 1px solid #cccccc;} 
    .contact-us .title { max-width: 800px; margin: 0px auto; text-align: center;}
  
    .contact-us h2 {  font-weight: 700; color: #2d5d83; } 
    .contact-us p { margin: 8px 0px 7px 0px; text-align: center;}
    .contact-us .inside { max-width: 800px; height: auto; margin: 0px auto; text-align: left; font-size: 14px;
    } .contact-us .form-label { margin-bottom: 0px;}
    .contact-us .form-control { margin-bottom: 20px; border-radius: 0px;} 
    .contact-us .form-control:focus { box-shadow: none; outline: none;} .contact-us .form-select:focus { box-shadow: none; outline: none;}
    .contact-us .form-select {  border-radius: 0px; margin-bottom: 20px; color: #000000;} 
    .contact-us .form-select-lg { font-size: 16px; height: 50px;}
    .contact-us .form-control-lg { font-size: 16px; height: 50px;}
    .contact-us textarea { height: 150px;}
   
    input[type=submit] {  background: #2d5d83 !important; text-align: center; display: inline-block;color: #FFF !important; font-weight: 700; font-size:22px !important; border-radius:0px; text-decoration: none;  text-transform:uppercase; text-shadow:none; padding: 22px 76px; text-transform:uppercase; transition: all 0.5s; border: none; } 
     input[type=submit]:hover { background: #256aa1 !important;  color: #FFF !important;
      box-shadow: 0 10px 10px -8px rgba(0, 0, 0,.5);
   }
  
   .form-control::-moz-placeholder {
    color: #000000;
    opacity: 1;
  }
  .form-control:-ms-input-placeholder {
    color: #000000;
  }
  .form-control::-webkit-input-placeholder {
    color: #000000;
  }
   
    /* contact-us end */

  /*inner-welcome Start */

.inner-welcome { width:100%; height: auto; float:left; background:  linear-gradient(-45deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.1)) fixed,  url(../images/welcome-bg2.jpg) center top no-repeat; background-size: cover; clear:both;}
.inner-welcome .inside {  width:100%; float:left; padding-top:144px; padding-bottom:140px; text-align: center;}  
.inner-welcome .inside h1 { font-weight: 700; color: #FFF; } 
.inner-welcome .inside h2 { font-weight: 700; color: #FFF;  text-transform: uppercase;} 
.inner-welcome .inside .box { max-width: 1060px; margin: 0px auto; text-align: center;}

    /*inner-welcome end */

    /* thanks start */
    
.thanks-box { width:100%; height:auto; float:left; text-align:left; padding-top:60px; padding-bottom: 60px;
}
.thanks-box .inside { width:100%; height:auto; float:left; text-align:center; border:1px solid #000000; padding:70px 20px;}  .thanks-box h2 { font-weight: 700; text-transform: uppercase; }
    
    /* thanks end */

  /* footer start */

#footer { padding-top:34px; padding-bottom:34px; background-color:#FFF; color:#202020; width:100%;  text-align:center; clear:both;}
#footer .footer-block {  text-align:center; color:#202020;} 
#footer .footer-block a {  text-align:center; color:#202020; text-decoration:none;}
#footer .footer-block a:hover {  text-align:center; color:#2d5d83; text-decoration:none; }

/* footer end */
.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 aspect ratio (height:width) */
  height: 0;
  overflow: hidden;
  
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}