/* - table of content - start
==================================================================================================== */

/* --------------------------------------------------
Version:        1.0
File:           CSS Base
Author:         THMLMATE
Last change:    01/08/2017
-------------------------------------------------- */


/* --------------------------------------------------
* 1 = fonts-load
* 2 = global-area

* 3 = header-section
* 4 = footer-section
* 5 = breadcrumb-section
* 6 = right-sidebar-section

* 7 = home page (index-1)
* 8 = about page
* 9 = portfolio page
* 10 = blog page
* 11 = blog details page
* 12 = contact page
* 13 = error404 page
-------------------------------------------------- */

/* - table of content - end
==================================================================================================== */





/* - 1 - fonts-load - start
==================================================================================================== */
@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700');

body {font-family: 'ui-sans-serif', sans-serif;}
/* - 1 - fonts-load - end
==================================================================================================== */





/* - 2 - global-area - start
==================================================================================================== */
* { box-sizing: border-box; }
body {
  margin: 0;
  padding: 0;
  color: #555555;
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: .5px;

  font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
}


::selection {
  color: #004aad;
  background: #040404;
}

p,
a,
ul,
li,
ul li,
button,
h1,h2,h3,h4,h5,h6 {
  margin: 0;
  padding: 0;
}



button {
  color: #040404;
  display: inline-block;
  text-transform: uppercase;
}
button,
button:focus,
button:active,
button:visited {
  border: none;
  outline: none;
  background: none;
}

a {
  color: #040404;
  text-decoration: none;
  display: inline-block;
  text-transform: uppercase;
}
a:hover {
  color: #004aad;
  text-decoration: none;
}
a:focus {text-decoration: none;}

li {
  list-style: none;
}
h1,h2,h3,h4,h5,h6 {
  color: #040404;
  line-height: normal;
  text-transform: capitalize;
}




.header {
  overflow: hidden;
  background-color: #f1f1f1;
  padding: 20px 10px;
}

.header a {
  float: left;
  color: black;
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 18px; 
  line-height: 25px;
  border-radius: 4px;
}

.header a.logo {
  font-size: 25px;
  font-weight: bold;
}

.header a:hover {
  background-color: #ddd;
  color: black;
}

.header a.active {
  background-color: dodgerblue;
  color: white;
}

.header-right {
  float: right;
}

@media screen and (max-width: 500px) {
  .header a {
    float: none;
    display: block;
    text-align: left;
  }
  
 .header-right {
    float: none;
  }
}


img {
  height: auto;
  max-width: 100%;
}

.imgfooter {
  height: auto;
  max-width: 60%;
}
.imglogo {
  height: auto;
  max-width: 60%;
}
span,
small,
strong {display: inline-block;}

.form-control {
  margin: 0;
  height: 50px;
  border: none;
  color: #555555;
  box-shadow: none;
  padding: 0px 20px;
  border-radius: 0px;
  background-color: #fff;
}
.form-control:focus {
  outline: none;
  box-shadow: none;
}

input,
textarea {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
  background: none;
}
input:focus,
textarea:focus {
  outline: none;
}

blockquote {
  margin: 0;
  padding: 0;
  font-size: 18px;
}
blockquote .small:before,
blockquote footer:before,
blockquote small:before {
  display: none;
}



/* customization of unorder list - start 
-------------------------------------------------- */
ul.ul-li,
ul.ul-li-block {
  width: 100%;
  display: table;
}
ul.ul-li li {
  list-style: none;
  display: inline-block;
}
ul.ul-li-block li {
 display: block;
}


ul.mate li {
  margin-right: 30px;
  display: inline-block;
}
ul.mate li:last-child {margin-right: 0px;}

ul.mate li,
ul.mate li a {text-transform: capitalize;}


ul.mate > li.mate-person {padding: 40px 0px;}
ul.mate > li.mate-person a>small.img {
  float: left;
  width: 80px;
  height: 80px;
  margin: -30px 0;
  overflow: hidden;
  margin-right: 20px;
  border-radius: 100%;
}
/* customization of unorder list - end
-------------------------------------------------- */



/* customization of padding / margin setting - start 
-------------------------------------------------- */
.sec-ptb-150 {
  padding-bottom: 100px;
  padding-top: 100px ;
}

.sec-ptb-1500 {
  padding-bottom: 50px;
  padding-top: 50px ;
}

.p-30 {padding: 30px;}

.mb-40 {margin-bottom: 40px;}
.mb-30 {margin-bottom: 30px;}
.mb-15 {margin-bottom: 15px;}
/* customization of padding / margin setting - end
-------------------------------------------------- */



/* customization of link button - start
-------------------------------------------------- */
a.custom-btn,
a.custom-btn2,
button.custom-btn,
button.custom-btn2 {
 font-size: 16px;
 display: inline-block;
 text-transform: uppercase;
}

a.custom-btn:hover > .la-icon,
button.custom-btn:hover > .la-icon {
  margin-left: 10px;
}

a.custom-btn,
button.custom-btn {color: #fff;}

a.custom-btn2,
button.custom-btn2 {
  color: #c9c9c9;
  margin: 32px 0px;
}
a.custom-btn2:hover,
button.custom-btn2:hover {color: #004aad;}
/* customization of link button - end
-------------------------------------------------- */



/* customization of owl-carousel - start
-------------------------------------------------- */
.owl-theme .owl-dots .owl-dot span {
  margin: 5px;
  width: 10px;
  height: 10px;
  background: #c5c5c5;
  border-radius: 0px;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: #004aad;
}
/* customization of owl-carousel - end
-------------------------------------------------- */



/* section-title / titles - start
-------------------------------------------------- */
.section-title {
  text-align: left;
  position: relative;
  margin-bottom: 40px;
  margin-top: 30px;
}
.section-title h2 {
  font-size: 36px;
  font-weight: 700;
  text-transform: capitalize;
}
.small-line {
  color: #004aad;
  font-size: 18px;
  font-weight: 600;
  position: relative;
  letter-spacing: 5px;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.small-line:after {
  top: 13px;
  content: '';
  height: 2px;
  width: 100px;
  right: -120px;
  position: absolute;
  background-color: #040404;
}

.title-xlarge {font-size: 45px;}
.title-large {font-size: 30px;}
.title-small {font-size: 21px;}
.title-xsmall {font-size: 18px;}
/* section-title / titles - end
-------------------------------------------------- */



/* customization of classes - start
-------------------------------------------------- */
.block {
  width: 100%;
  height: 100%;
  display: block;
}
.display-block {
  width: 100%;
  display: block;
}

.clr-red {color: #cb0630 !important;}
.clr-white {color: #ffffff !important;}
.clr-black {color: #040404 !important;}
.clr-offwhite {color: #555555 !important;}
.clr-lit-green {color: #004aad !important;}

.bg-white {background-color: #ffffff !important;}
.bg-black {background-color: #040404 !important;}
.bg-lit-green {background-color: #004aad !important;}

.overlay-black {background-color: rgba(4,4,4,0.9) !important;}
.overlay-white {background-color: rgba(255,255,255,0.9) !important;}
.overlay-lit-green {background-color: rgba(150,221,30,0.9) !important;}

.gradient-tb-white {
  background: -o-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -ms-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -moz-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -webkit-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
}

.gradient-bt-white {
  background: -o-linear-gradient(bottom, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -ms-linear-gradient(bottom, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -moz-linear-gradient(bottom, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -webkit-linear-gradient(bottom, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
}
/* customization of classes - end
-------------------------------------------------- */



/* all transitions - start
-------------------------------------------------- */
a,
.badge,
button,
a > .la-icon,
button > .la-icon {
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -ms-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}
/* all transitions - end
-------------------------------------------------- */



/* back to top - start
.................................................. */
.backtotop {
  width: 40px;
  height: 60px;
  right: 30px;
  bottom: 70px;
  display: none;
  z-index: 1000;
  position: fixed;
  overflow: hidden;
  text-align: center;
  background-color: #69dd1e;
  box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.1);
}
.backtotop a.scroll {
  width: 100%;
  height: 100%;
  color: #ffffff;
  display: block;
  font-size: 18px;
  line-height: 60px;
}
/* back to top - end
.................................................. */



/* preloader - start
.................................................. */
#preloader {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1005;
  position: fixed;
  overflow: visible;
  background: #fff url('../images/preloader.html') no-repeat center center;
}
/* preloader - end
.................................................. */
/* - 2 - global-area - end
==================================================================================================== */





/* - 3 - header-section - start
==================================================================================================== */
.header-section .contact{
  display: inline-block;
  float: right;
}

.header-section .main-menu {
  display: inline-block;
  float: right;
}

.header-section .brand-logo {
  float: left;
  display: inline-block;
}
.header-section .brand-logo img {
    width: 55%;
    align-items: center;
    margin-top: 4px;
}
/* brand-logo - start
================================================== */
.header-section .brand-logo {
  width: 20%;
  text-align: left;
}
/* brand-logo - end
================================================== */



/* contact - start
================================================== */

.slider-sectionone{
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/apsimage/bannerimgcontact.jpg);
  margin-bottom: 30px;
  height: 550px;
}

.slider-sectiontwo{
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/apsimage/aboutusbanner.png);
  margin-bottom: 30px;
  height: 550px;
}

.slider-sectionthree{
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
background-image: url(../images/apsimage/blogimagebanner.jpg);
margin-bottom: 30px;
height: 550px;
}

.slider-sectionfour{
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/apsimage/portfolioimagebanner.jpg);
  margin-bottom: 30px;
  height: 550px;
}
.slider-sectionportfolio{
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
background-image: url(../images/apsimage/portfolio.jpg);
margin-bottom: 30px;
height: 550px;
}
.header-section .contact {
  width: 50%;
  padding: 12px 0px;
  text-align: center;
}
.header-section .contact li,
.header-section .contact li a {font-size: 18px;}
.header-section .contact li {margin-right: 20px;}
.header-section .contact li:last-child {margin-right: 0px;}

.header-section .contact li.contact-number {
  margin-right: 85px;
  padding-right: 85px;
  border-right: 2px solid #444444;
}
/* contact - end
================================================== */



/* main-menu - start
================================================== */
.header-section .main-menu {
  width: 30%;
  text-align: right;
  padding: 12px 0px;
}
.header-section .main-menu li {
  color: #040404;
  font-size: 18px;
  font-weight: 700;
  margin-right: 40px;
  text-transform: uppercase;
}
.header-section .main-menu li span {margin-left: 15px;}
.header-section .main-menu li:last-child {margin-right: 0px;}



/* main-menu-list - start
-------------------------------------------------- */
.main-menu-list li {
  width: 100%;
  padding: 10px;
  display: none;
  text-align: center;
}
.main-menu-list li a {
  color: #777777;
  font-size: 24px;
}

.main-menu-list li a:hover {color: #004aad;}
/* main-menu-list - end
-------------------------------------------------- */



/* search-bar - start
-------------------------------------------------- */
.header-section .main-menu li button:hover {color: #004aad;}
.header-section .search-body,
.header-section .menu-body {
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  position: fixed;
  visibility: hidden;
  padding: 200px 100px;
  transition: all .5s ease;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  background-color: #ffffff;
}
.header-section .menu-body {padding: 115px 100px;}

.header-section .search-body input.search-input {
  margin: 0;
  padding: 0;
  width: 100%;
  height: auto;
  border: none;
  font-size: 60px;
  text-align: center;
  letter-spacing: 10px;
  color: #040404 !important;
}
.header-section .search-body input.search-input:focus {
  background: none;
}

.header-section .open {
  opacity: 1;
  visibility: visible;
}

.header-section .close {
  top: 50px;
  z-index: 3;
  right: 50px;
  color: #040404;
  font-size: 36px;
  position: fixed;
  cursor: pointer;
}
/* search-bar - start
-------------------------------------------------- */
/* main-menu - end
================================================== */



/* sticky menu - start
================================================== */
.header-section {
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
  padding: 10px 50px;

  position: fixed;
  background-color: transparent;
}

.not-stuck {
  position: fixed;
  transition: all .3s ease-in-out;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
}

.stuck {
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  position: fixed;
  padding: 30px 50px;
  background-color: #ffffff;
  box-shadow: 0 0 15px rgba(0,0,0,0.2);
  transition: .3s all ease-in-out;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
}
/* sticky menu - end
================================================== */
/* - 3 - header-section - end
==================================================================================================== */





/* - 4 - footer-section - start
==================================================================================================== */
.footer-section {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/footer-bg1.jpg);
}
.footer-section .gradient-tb-white {
  background: -o-linear-gradient(
    top,
    rgba(255,255,255,1),
    rgba(255,255,255,0.9),
    rgba(255,255,255,0.8),
    rgba(255,255,255,0.7)
    );
  background: -ms-linear-gradient(
    top,
    rgba(255,255,255,1),
    rgba(255,255,255,0.9),
    rgba(255,255,255,0.8),
    rgba(255,255,255,0.7)
    );
  background: -moz-linear-gradient(
    top,
    rgba(255,255,255,1),
    rgba(255,255,255,0.9),
    rgba(255,255,255,0.8),
    rgba(255,255,255,0.7)
    );
  background: -webkit-linear-gradient(
    top,
    rgba(255,255,255,1),
    rgba(255,255,255,0.9),
    rgba(255,255,255,0.8),
    rgba(255,255,255,0.7)
    );
}



/* footer-top - start
================================================== */
.footer-top {
  padding-left: 50px;
  padding-right: 50px;
}
.footer-top .ftr-col5 {
  width: 25%;
  float: left;
  display: inline-block;
}

.footer-top .newslater-form {
  height: 50px;
  overflow: hidden;
  position: relative;
}
.footer-top .newslater-form button {
  top: 16px;
  right: 20px;
  color: #004aad;
  position: absolute;
}

.footer-top .company li a span,
.footer-top .useful-link li a span {
  margin-right: 10px;
}
/* footer-top - end
================================================== */



/* footer-bottom - start
================================================== */
.footer-bottom .contact li {margin-right: 20px;}
.footer-bottom .contact li:last-child {margin-right: 0px;}
.footer-bottom .contact li a {font-size: 24px;}
/* footer-bottom - end
================================================== */
/* - 4 - footer-section - end
==================================================================================================== */





/* - 5 - breadcrumb-section - start
==================================================================================================== */
/* breadcrumb reset - start
-------------------------------------------------- */
.breadcrumb {
  margin: 0px;
  padding: 0px;
  border: none;
  padding-top: 70px;
  text-align: right;
  border-radius: 0px;
  background-color: transparent;
}
/* breadcrumb reset - en
-------------------------------------------------- */

.breadcrumb-section {
  padding-top: 288px;
  position: relative;
  padding-bottom: 150px;
}

.breadcrumb a.breadcrumb-item {
  color: #c5c5c5;
  color: #040404;
  font-size: 16px;
  font-weight: 400;
  text-transform: uppercase;
}
.breadcrumb>li+li:before {
  content: "/";
  padding: 0 5px;
  color: #040404;
}
.breadcrumb span.breadcrumb-item.active {
  color: #c5c5c5;
  font-size: 16px;
  font-weight: 400;
  text-transform: uppercase;
}
.breadcrumb a.breadcrumb-item:hover {color: #004aad;}
/* - 5 - breadcrumb-section - end
==================================================================================================== */





/* - 6 - right-sidebar-section - start
==================================================================================================== */
.right-sidebar-section {padding-left: 70px;}



/* - 6.1 - rs-search-form - start
================================================== */
.rs-search-form {
  position: relative;
  background-color: red;
}
.rs-search-form input[type=search] {background-color: #efefef;}
.rs-search-form button {
  right: 20px;
  bottom: 11px;
  font-size: 16px;
  position: absolute;
  background-color: #efefef;
}
/* - 6.1 - rs-search-form - end
================================================== */



/* - 6.2 - rs-categories - start
================================================== */
.badge {
  padding: 0px;
  color: #555555;
  font-size: 14px;
  font-weight: 500;
  line-height: unset;
  border-radius: 0px;
  background: transparent;
}

.rs-categories li a {
  width: 100%;
  color: #555555;
  display: block;
}
.rs-categories li a:hover {
  color: #69dd1e;
  padding: 0px 15px;
}
.rs-categories li a:hover .badge {color: #69dd1e;}
/* - 6.2 - rs-categories - end
================================================== */



/* - 6.3 - rs-recent-post - start
================================================== */
.rs-recent-post .post .post-img {
  float: left;
  width: 100px;
  height: 80px;
  overflow: hidden;
  margin-right: 15px;
}

.rs-recent-post .post .post-contant {display: table;}
.rs-recent-post .post .post-contant a.title-xsmall {
  font-size: 16px;
  text-transform: capitalize;
}

.rs-recent-post .post:hover .post-contant a.title-xsmall {color: #69dd1e;}
/* - 6.3 - rs-recent-post - end
================================================== */
/* - 6 - right-sidebar-section - end
==================================================================================================== */





/* - 7 - home page (index-1) - start
==================================================================================================== */
/* - 7.1 - slider-section - start
================================================== */
.slider-section {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/slider/slider-bg1.jpg);
}
.slider-section .gradient-bt-white {padding: 300px 0px 300px 0px;}
/* - 7.1 - slider-section - end
================================================== */



/* - 7.2 - service-section - start
================================================== */
.service-section {position: relative;}

/* service-area - start
-------------------------------------------------- */
.service-area {
  left: 50%;
  top: -122px;
  padding: 30px;
  position: absolute;
  background-color: #ffffff;
  transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
}

.margintopOne{
  margin-top: 210px;
}

.shadow{
  box-shadow: 2px 2px 2px 2px #004bad18 !important;
}
@media (min-width: 768px) {
  .service-area {
    width: 100%;
  }
}
@media (min-width: 992px) {
  .service-area {
    width: 100%;
  }
}
@media (min-width: 1200px) {
  .service-area {
    width: 1140px;
  }
}
/* service - start
.............................. */
.service-area .service {
  overflow: hidden;
  position: relative;
}

.service-area .service .service-contant {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  padding: 15px 30px;
  position: absolute;
  border: 5px solid transparent;
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -ms-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}
.service-area .service:hover .service-contant {
  opacity: 1;
  padding: 30px;
  position: absolute;
  border: 5px solid #004aad;
}
.service-area .service:hover .service-contant p {
  color: #b3b3b3;
}
/* service - end
.............................. */
/* service-area - end
-------------------------------------------------- */
/* - 7.2 - service-section - end
================================================== */



/* - 7.3 - about-section - start
================================================== */
.about-section .section-title {
  z-index: 1;
  margin-bottom: 0px;
  padding: 0px 0px 30px;
}
/* about-contant - start
-------------------------------------------------- */
.about-section .about-contant {padding: 30px 10px 30px 0px;}
.about-section .about-contant .custom-btn:hover {color: #004aad !important;}
/* about-contant - end
-------------------------------------------------- */



/* about-video - start
-------------------------------------------------- */
.about-section .about-video {
  width: 100%;
  height: auto;
  display: block;
  overflow: hidden;
  position: relative;
}

.about-section .about-video .video-play-overlay {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  position: absolute;
  background-color: rgba(4,4,4,0.3);
  background-image: url('path/to/your/image.jpg');
  background-size: cover; /* This property ensures the image covers the entire section */
  background-position: center center; /* Center the image both horizontally and vertically */
  /* You can add more styles as needed */
}
.about-section .about-video .video-play-overlay a.play-icon {
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
}
/* about-video - end
-------------------------------------------------- */
/* - 7.3 - about-section - end
================================================== */



/* - 7.4 - funfact-section - start
================================================== */
.funfact-contant {padding: 60px 0px 60px 60px;}

.margintop{margin-top: -70px !important;}
/* - 7.4 - funfact-section - end
================================================== */



/* - 7.5 - recent-projects-section - start
================================================== */
.recent-projects-carousel {position: relative;}

.recent-projects-carousel .projects {
  overflow: hidden;
  max-height: 470px;
  position: relative;
}
.recent-projects-carousel .projects .projects-contant {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  border: 5px solid transparent;
  padding: 260px 25px 50px 25px;
  background-color: rgba(4,4,4,0.3);
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -ms-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}
.recent-projects-carousel .projects:hover .projects-contant {
  border: 5px solid #004aad;
  padding: 215px 25px 25px 25px;
  background-color: rgba(4,4,4,0.9);
}

/* owl-nav setting - start
-------------------------------------------------- */
.owl-theme .owl-dots {margin-top: 60px;}
.recent-projects-section .owl-theme .owl-nav [class*=owl-] {
  margin: 0;
  padding: 0;
  color: transparent;
  border-radius: 0px;
}
.recent-projects-section .owl-carousel .owl-nav .owl-prev,
.recent-projects-section .owl-carousel .owl-nav .owl-next {
  top: 0;
  width: 140px;
  height: 400px;
  position: absolute;
}

.recent-projects-section .owl-carousel .owl-nav .owl-prev {
  left: 0;
  background: -o-linear-gradient(left, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -ms-linear-gradient(left, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -moz-linear-gradient(left, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -webkit-linear-gradient(left, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
}
.recent-projects-section .owl-carousel .owl-nav .owl-next {
  right: 0;
  background: -o-linear-gradient(right, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -ms-linear-gradient(right, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -moz-linear-gradient(right, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
  background: -webkit-linear-gradient(right, rgba(255,255,255,1), rgba(255,255,255,0.5), rgba(255,255,255,0));
}

.recent-projects-section .owl-theme .owl-nav .owl-prev:hover {
  background: -o-linear-gradient(left, #004aad);
  background: -ms-linear-gradient(left, #004aad);
  background: -moz-linear-gradient(left, #004aad);
  background: -webkit-linear-gradient(left, #004aad);
}
.recent-projects-section .owl-theme .owl-nav .owl-next:hover {
  background: -o-linear-gradient(right, #004aad);
  background: -ms-linear-gradient(right, #004aad);
  background: -moz-linear-gradient(right, #004aad);
  background: -webkit-linear-gradient(right, #004aad);
}
/* owl-nav setting - end
-------------------------------------------------- */
/* - 7.5 - recent-projects-section - end
================================================== */



/* - 7.6 - service-showcase-section - start
================================================== */
.service-showcase-section p.service-number {
  color: #e5e5e5;
  font-size: 30px;
  font-weight: 800;
  margin-top: 65px;
}
/* - 7.6 - service-showcase-section - end
================================================== */



/* - 7.7 - testimonial-section - start
================================================== */
.testimonial-section {padding: 0px 50px;}
.testimonial-section .testimonial-items {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/testimonial/testimonial-bg.jpg);
}

.testimonial-section .overlay-black {position: relative;}
.testimonial-section .overlay-black .small-line {
  top: 48%;
  left: 5px;
  color: #ffffff;
  position: absolute;
  transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
}
.testimonial-section .overlay-black .small-line:after {background-color: #ffffff;}

.testimonial-carousel {margin-bottom: 150px;}
.testimonial-carousel .item {padding: 0px 200px;}
.testimonial-carousel .item .viewer-img {
  width: 130px;
  height: 130px;
  overflow: hidden;
  text-align: center;
  border-radius: 100%;
}
.viewer-comment {
  color: #b3b3b3;
}

/* owl dot setting - start
-------------------------------------------------- */
.testimonial-section .owl-theme .owl-dots .owl-dot {display: table;}
.testimonial-section .owl-dots {
  top: 50%;
  right: 0;
  margin: 0;
  position: absolute;
  transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}
/* owl dot setting - end
-------------------------------------------------- */
/* partners - start
-------------------------------------------------- */
.testimonial-section ul.partners li.partner {
  width: 20%;
  height: auto;
  padding: 15px;
  overflow: hidden;
  text-align: center;
  transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  -ms-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -webkit-transition: all .4s ease-in-out;
}
.testimonial-section ul.partners li.partner a {
  width: 100%;
  height: 110px;
  display: block;
  line-height: 110px;
}

.testimonial-section ul.partners li.partner:hover {background-color: rgba(255, 255, 255, 0.1);}
/* partners - end
-------------------------------------------------- */
/* - 7.7 - testimonial-section - end
================================================== */



/* - 7.8 - latest-news-section - start
================================================== */
.latest-news-section .latest-news {
  overflow: hidden;
  position: relative;
}
.latest-news-section .date {
  top: 30px;
  left: 30px;
  z-index: 1;
  color: #004aad;
  position: absolute;
}
.latest-news-section .latest-news-contant {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  border: 5px solid transparent;
  padding: 255px 25px 25px 25px;

  transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  -ms-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -webkit-transition: all .4s ease-in-out;
}
.latest-news-section .latest-news:hover .latest-news-contant {
  border: 5px solid #004aad;
  padding: 210px 25px 25px 25px;
  background-color: rgba(4,4,4,0.9);
}
/* - 7.8 - latest-news-section - end
================================================== */



/* - 7.9 - map-section - start
================================================== */
.map-section {
  position: relative;
  padding-top: 150px;
}
#google-map {
  left: 50%;
  z-index: 1;
  height: 400px;
  bottom: -200px;
  position: absolute;
  transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
}
@media (min-width: 768px) {
  #google-map {
    width: 100%;
  }
}
@media (min-width: 992px) {
  #google-map {
    width: 100%;
  }
}
@media (min-width: 1200px) {
  #google-map {
    width: 1140px;
  }
}
/* - 7.9 - map-section - end
================================================== */
/* - 7 - home page (index-1) - end
==================================================================================================== */





/* - 8 - about page - start
==================================================================================================== */
/* - 8.1 - lamsum-section - start
================================================== */
.lamsum-section {
  padding-left: 50px;
  padding-right: 50px;
}
/* - 8.1 - lamsum-section - end
================================================== */



/* - 8.1 - lamsum-section - start
================================================== */
.about-page .funfact-section {padding-bottom: 10px;}
/* - 8.1 - lamsum-section - end
================================================== */

.recent-projects-section2 {
  background-color: #f9f9f9;
}

.recent-projects-section2 .projects2 p.service-number {
  color: #e5e5e5;
  font-size: 30px;
  font-weight: 800;
  margin-top: 65px;
}
.recent-projects-section2 .owl-theme .owl-dots {display: none;}

.recent-projects-section2 .owl-theme .owl-nav {
  right: 0;
  top: -174px;
  margin: 0px;
  position: absolute;
}
.owl-theme .owl-nav [class*=owl-] {
  margin: 5px;
  width: 40px;
  height: 40px;
  padding: 0px;
  overflow: hidden;
  text-align: center;
  position: relative;
  color: transparent;
  border-radius: 0px;
  background: transparent;
}
.recent-projects-section2 .owl-theme .owl-nav [class*=owl-]:hover {
  color: transparent;
  background: transparent;
}

.recent-projects-section2 .owl-carousel .owl-nav .owl-next:before,
.recent-projects-section2 .owl-carousel .owl-nav .owl-prev:before {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  color: #c5c5c5;
  font-size: 36px;
  line-height: 40px;
  position: absolute;
  font-family: 'Linearicons-Free';
}
.recent-projects-section2 .owl-carousel .owl-nav .owl-next:before {content: "\e87a";}
.recent-projects-section2 .owl-carousel .owl-nav .owl-prev:before {content: "\e879";}

.recent-projects-section2 .owl-carousel .owl-nav .owl-next:hover:before,
.recent-projects-section2 .owl-carousel .owl-nav .owl-prev:hover:before {
  color: #040404;
}
/* - 8 - about page - end
==================================================================================================== */





/* - 9 - portfolio page - start
==================================================================================================== */
/* - portfolio-section - start
================================================== */
.portfolio-section .button-group {margin-bottom: 50px;}
.portfolio-section .button-group .button {
  float: left;
  color: #040404;
  font-size: 18px;
  font-weight: 600;
  margin-right: 40px;
  display: inline-block;
}
.portfolio-section .button:last-child {margin-right: 0px;}

.portfolio-section .button:active,
.portfolio-section .button.is-checked {
  color: #004aad;
}

.portfolio-section .grid {
  margin-left: -15px;
  margin-right: -15px;
}

.portfolio-section .element-item {
  float: left;
  height: auto;
  padding: 15px;
  width: 33.3333%;
  overflow: hidden;
  position: relative;
}
.portfolio-section .element-item .date {
  top: 45px;
  left: 45px;
  z-index: 1;
  color: #004aad;
  position: absolute;
}
.portfolio-section .element-item .element-contant {
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  overflow: hidden;
  position: absolute;
  border: 5px solid transparent;
  padding: 320px 25px 25px 25px;

  transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  -ms-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -webkit-transition: all .4s ease-in-out;
}
.portfolio-section .element-item:hover .element-contant {
  border: 5px solid #004aad;
  padding: 270px 25px 25px 25px;
  background-color: rgba(4,4,4,0.9);
}
/* - portfolio-section - end
================================================== */
/* - 9 - portfolio page - end
==================================================================================================== */





/* - 10 - blog page - start
==================================================================================================== */
/* - blog-section - start
================================================== */
.blog-section .button-group {margin-bottom: 50px;}
.blog-section .button-group .button {
  color: #040404;
  font-size: 18px;
  font-weight: 600;
  margin-right: 40px;
  display: inline-block;
}
.blog-section .button:last-child {margin-right: 0px;}

.blog-section .button:active,
.blog-section .button.is-checked {
  color: #004aad;
}

.blog-section .grid {
  margin-left: -15px;
  margin-right: -15px;
}

.blog-section .element-item {
  float: left;
  height: auto;
  padding: 15px;
  width: 33.3333%;
  overflow: hidden;
  position: relative;
}
.blog-section .element-item .date {
  top: 45px;
  left: 45px;
  z-index: 1;
  color: #004aad;
  position: absolute;
}
.blog-section .element-item .element-contant {
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  overflow: hidden;
  position: absolute;
  border: 5px solid transparent;
  padding: 255px 25px 25px 25px;

  transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  -ms-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -webkit-transition: all .4s ease-in-out;
}
.blog-section .element-item:hover .element-contant {
  border: 5px solid #004aad;
  padding: 210px 25px 25px 25px;
  background-color: rgba(4,4,4,0.9);
}
/* - blog-section - end
================================================== */
/* - 10 - blog page - end
==================================================================================================== */





/* - 11 - blog details page - start
==================================================================================================== */
.blog-details-section blockquote {
  border: none;
  margin: 100px 70px;
  position: relative;
}
.blog-details-section blockquote span {
  top: -5px;
  left: -60px;
  position: absolute;
}



/* tag-list / share-links - start
================================================== */
.blog-details-section .tag-list li {margin-right: 15px;}
.blog-details-section .share-links li {margin-right: 15px;}
.blog-details-section .tag-list li:last-child {margin-right: 0px;}
.blog-details-section .share-links li:last-child {margin-right: 0px;}

.blog-details-section .tag-list li a,
.blog-details-section .share-links li a {
  color: #555555;
  text-transform: capitalize;
}
.blog-details-section .tag-list li a:hover {color: #69dd1e;}
.blog-details-section .share-links li a:hover {color: #69dd1e;}
/* tag-list / share-links - end
================================================== */



/* comment-area - start
================================================== */
.blog-details-section .comment-area {margin: 100px 0px;}

.blog-details-section .comment-area .hero-img {
  width: 70px;
  height: 70px;
  overflow: hidden;
  margin-right: 30px;
  text-align: center;
  border-radius: 100%;
}

.blog-details-section .comment-area .hero-contant {display: table;}
/* comment-area - end
================================================== */



/* message-form - start
================================================== */
.blog-details-section .message-form input,
.blog-details-section .message-form textarea {
  padding: 15px;
  margin-bottom: 30px;
  background-color: #efefef;
}

.blog-details-section .message-form a.custom-btn {
  color: #ffffff;
  padding: 20px 40px;
  background-color: #040404;
}
/* message-form - end
================================================== */
/* - 11 - blog details page - end
==================================================================================================== */





/* - 12 - contact page - start
==================================================================================================== */
/* - 12.1 - map-section - start
================================================== */
.marginbottom{
  margin-bottom: 220px;
}


.contact-page .map-section {
  padding: 0px 50px;
}

.contact-page #google-map {
  width: 100%;
  bottom: unset;
  position: unset;
}
/* - 12.1 - map-section - end
================================================== */



/* - 12.2 - contact-links - start
================================================== */
.contact-page .contact-links li {margin-right: 20px;}
.contact-page .contact-links li:last-child {margin-right: 0px;}

.contact-page .contact-links li a {font-size: 18px;}



/* contact-form - start
-------------------------------------------------- */
.contact-form-area {position: relative;}
.contact-form-area .contact-form {
  left: 0;
  right: 0;
  bottom: -395px;
  position: absolute;
}



.contact-page .contact-form input,
.contact-page .contact-form textarea {
  background-color: #efefef;
}
.contact-page .contact-form textarea {padding: 20px;}
.contact-page .contact-form .send-message {
  padding: 15px 35px;
  background-color: #004aad;
}
.contact-page .contact-form .send-message:hover {
  color: #004aad;
  background-color: #040404;
}

.contact-page .contact-form .option-btn {
  width: 100%;
  height: 50px;
  color: #757575;
  display: block;
  text-align: left;
  padding: 0px 20px;
  position: relative;
  background-color: #efefef;
  text-transform: capitalize;
}
.contact-page .contact-form .option-btn:after {
  right: 20px;
  content: "\e874";
  position: absolute;
  font-family: 'Linearicons-Free';
}



.contact-page .contact-form .subject-option {position: relative;}
.contact-page .contact-form .dropdown-menu {
  margin: 0;
  width: 100%;
  border: none;
  padding: 10px 0;
  border-radius: 0px;
  background-color: #efefef;
}
.contact-page .contact-form .dropdown-menu>li>a {
  color: #040404;
  padding: 10px 20px;
}
.contact-page .contact-form .dropdown-menu>li>a:focus,
.contact-page .contact-form .dropdown-menu>li>a:hover {
  color: #040404;
  background-color: #004aad;
}
/* contact-form - end
-------------------------------------------------- */
/* - 12.2 - contact-links - end
================================================== */
/* - 12 - contact page - end
==================================================================================================== */





/* - 13 - error404 page - start
==================================================================================================== */
.error404-section {position: relative;}

.error404-contant {
  left: 50%;
  bottom: -175px;
  padding-top: 150px;
  position: absolute;

  transform: translateX(-50%);
  transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
}

.error404-section h2.big-title {
  font-size: 250px;
  font-weight: 700;
  letter-spacing: 50px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/404.jpg);
  text-shadow: 0px 0px 50px rgba(0,0,0,0.3);
  
  -webkit-background-clip: text;
  -o-text-fill-color: transparent;
  -ms-text-fill-color: transparent;
  -moz-text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
}

.error404-section .get-hepl,
.error404-section .send-message {
  margin: 5px;
  color: #040404;
  padding: 15px 40px;
}

.error404-section .send-message {background-color: #004aad;}

.error404-section .get-hepl:hover,
.error404-section .send-message:hover {
  color: #004aad;
  background-color: #040404;
}
/* - 13 - error404 page - end
==================================================================================================== */

.logotemp{
  color: #040404 ;
  font-size: 50px;
  font-weight: 1000;
}