/*-----------------------------------------------------------------------------------

    Template Name: Mentos - Consulting Business Template
    Template URI: http://rockstheme.com
    Description: This is html5 template
    Author: Rocks_theme
    Author URI: http://rockstheme.com
    Version: 1.0

-----------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------  
     CSS INDEX
    ===================

    1. Theme Default CSS (body, link color, section etc)
    2. Header Top Area
    2.1 Header Bottom Area
    2.1 Sticky Header Area
    2.3. Mobile Menu Area
    3. Slider Area
    4.Welcome Services Area
    5. About area
    6.Services Area
    7.Counter AreaFG
    8.project Area
    9. banner area css
    10. Overview Area
    11. FAQ  Area
    12. Add Area
    13. Blog Area
    14. Footer Area
    15. Home 2 area
    16. Testimonial area
    17. Home 03 Area
    18. Wellcome Services 2 Area
    19. Team member area
    20. Home-4 area
    21. Breadcumbs Area
    22. About page Area
    23. Blog Details page
    24.	Contact Us page area
    25. Services Details area
    26. Project Details page
    27. Error page area

    
-----------------------------------------------------------------------------------*/
/*----------------------------------------*/
/*  Google Fonts
/*----------------------------------------*/
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700,800|Open+Sans:400,400i,600,700|Raleway:400,500,600,700,800");

/*----------------------------------------*/
/*  1.  Theme default CSS
/*----------------------------------------*/
html,
body {
  height: 100%;
}
.floatleft {
  float: left;
}
.floatright {
  float: right;
}
.alignleft {
  float: left;
  margin-right: 15px;
  margin-bottom: 15px;
}
.alignright {
  float: right;
  margin-left: 15px;
  margin-bottom: 15px;
}
.aligncenter {
  display: block;
  margin: 0 auto 15px;
}
a:focus {
  outline: 0px solid;
}
img {
  max-width: 100%;
}
.fix {
  overflow: hidden;
}
p {
  margin: 0 0 15px;
  color: #060606ad;

  line-height: 32px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Montserrat", sans-serif;
  margin: 0 0 15px;
  color: #444;
  font-weight: 700;
}
h1 {
  font-size: 48px;
  line-height: 50px;
  font-family: "Raleway", sans-serif;
}
h2 {
  font-size: 38px;
  line-height: 44px;
}
h3 {
  font-size: 30px;
  line-height: 36px;
  font-family: "Raleway", sans-serif;
}
h4 {
  font-size: 24px;
  line-height: 34px;
}
h5 {
  font-size: 20px;
  line-height: 28px;
}
h6 {
  font-size: 16px;
  line-height: 26px;
}
a {
  transition: all 0.3s ease 0s;
  text-decoration: none;
}
a:hover {
  color: rgb(0, 125, 207);
  text-decoration: none;
}
a:active,
a:hover {
  outline: 0 none;
}
a:hover,
a:focus {
  color: #444;
  text-decoration: none;
}

/*.mega-menu {
    background-color: #fffffffff;
    border: 0 solid #e9e9e9;
    display: table;
    left: 0px;
    list-style: none;
    opacity: 0;
    position: absolute;
    right: 0px;
    visibility: hidden;
     width: 25%;
    margin-top: 20px;
    box-shadow: 0 15px 20px 0 rgba(0, 0, 0, 0.1);
    color: red;
}*/
.para {
  text-align: justify;
}

.navrow {
  margin-top: 20px;
}
ul.mega-menu span {
  font-size: 16px;
  padding-left: 17px;
  color: #2e80ed;
  font-weight: bold;
}

ul.mega-menu.mega span {
  color: #2e80ed;
  margin-left: 15px;
}
.mega-menu.mega {
  /* background-color: #000; */
}
.mega-menu.mega a:hover {
  background-color: #2e80ed;
}

ul.mega-menu.mega1 span {
  color: #2e80ed;
}
.mega-menu.mega1 a:hover {
  background-color: #2e80ed;
}

ul.mega-menu.mega2 span {
  color: #2e80ed;
}
.mega-menu.mega2 a:hover {
  background-color: #2e80ed;
}

ul.mega-menu.mega3 span {
  color: #2e80ed;
}

.mega-menu.mega3 a:hover {
  background-color: #2e80ed;
}
ul.mega-menu.mega4 span {
  color: #2e80ed;
}
.mega-menu.mega4 a:hover {
  background-color: #2e80ed;
}

ul.mega-menu.mega5 span {
  color: #2e80ed;
}
.mega-menu.mega5 a:hover {
  background-color: #2e80ed;
}
.material-symbols-outlined {
  font-size: 20px;
  margin-right: 5px;
}

ul.mega-menu.mega6 span {
  color: #fabc05;
}
.mega-menu.mega6 a:hover {
  background-color: #fabc05;
}

body {
  background: #ffffff none repeat scroll 0 0;
  /* color: #777; */
  /* font-family: "Open Sans", sans-serif; */
  /* font-size: 16px; */
  text-align: left;
  overflow-x: hidden;
  line-height: 25px;
}
#scrollUp {
  background: #000 none repeat scroll 0 0;
  border-radius: 2px;
  bottom: 30px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  color: #ffffff;
  font-size: 34px;
  height: 50px;
  line-height: 46px;
  right: 15px;
  text-align: center;
  transition: all 0.3s ease 0s;
  width: 50px;
}
#scrollUp:hover {
  background: rgb(0, 125, 207);
  opacity: 1;
}
.clear {
  clear: both;
}
ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
input,
select,
textarea,
input[type="text"],
input[type="date"],
input[type="url"],
input[type="email"],
input[type="password"],
input[type="tel"],
button,
button[type="submit"] {
  -moz-appearance: none;
  box-shadow: none !important;
}
input:focus,
textarea:focus,
select:focus {
  outline: none;
}
div#preloader {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99999;
  width: 100%;
  height: 100%;
  overflow: visible;
  background: #ffffff url("img/logo/preloader.gif") no-repeat center center;
}
.navbar-collapse {
  padding-left: 0px;
}
::-moz-selection {
  background: rgb(0, 125, 207);
  text-shadow: none;
}
::selection {
  background: rgb(0, 125, 207);
  text-shadow: none;
}
.color {
  color: #0f90b8;
  font-weight: 700;
}
.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}
.area-padding {
  padding-top: 37px;
  padding-bottom: 20px;
}
.area-padding-2 {
  padding: 70px 0px 50px;
}
.area-padding-3 {
  padding: 13px 0px;
}
.area-padding-4 {
  padding-top: 37px;
}
.area-padding-5 {
  padding-top: 27px;
}
.padding-2 {
  padding-bottom: 90px;
}
.section-headline {
  /* margin-bottom: 15px; */
  position: relative;
}
.section-headline-2 {
  margin-bottom: 10px;
  position: relative;
}
.section-headline h3 {
  display: inline-block;
  font-size: 40px;
  font-weight: 700;
  text-transform: capitalize;
}
.section-headline.white-headline h3 {
  color: #ffffff;
}
.section-headline.text-left {
  margin-bottom: 30px;
}
.section-headline::before {
  border: 1px solid rgb(0, 125, 207);
  bottom: 31px;
  content: "";
  left: 107px;
  margin: 0 -88px;
  position: absolute;
  width: 400px;
  right: 0;
}

.section-headline::after {
  border: 1px solid rgb(0, 125, 207);
  bottom: 31px;
  content: "";
  left: 699px;
  margin: 0 auto;
  position: absolute;
  width: 400px;
  right: 0;
}
.section-headline.text-left h3::after {
  border: 2px solid rgb(0, 125, 207);
  left: 0;
  right: auto;
}
.section-headline p {
  max-width: 680px;
  font-size: 17px;
  letter-spacing: 0.6px;
  margin: 0 auto;
  line-height: 28px;
  font-weight: 500;
}
.sub-head h4 {
  color: #ffffff;
  font-size: 30px;
  position: relative;
  padding-bottom: 30px;
}
.sub-head h4::after {
  border: 2px solid rgb(0, 125, 207);
  bottom: 0px;
  content: "";
  left: 0;
  margin: 0 auto;
  position: absolute;
  width: 20%;
}
.sub-head p {
  color: #ffffff;
  font-size: 17px;
  margin-top: 20px;
  line-height: 26px;
}
.load-more-btn {
  text-transform: uppercase;
  background: rgb(0, 125, 207);
  display: inline-block;
  padding: 15px 30px;
  color: #ffffff;
  font-weight: 600;
  margin-top: 30px;
  border-radius: 3px;
  width: 200px;
  transition: 0.4s;
  border: 2px solid rgb(0, 125, 207);
}
.load-more-btn:hover {
  background: #ffffff;
  border: 2px solid rgb(0, 125, 207);
  color: rgb(0, 125, 207);
  transition: 0.4s;
}
.section-headline h4 {
  font-size: 28px;
  max-width: 870px;
  line-height: 36px;
  font-weight: 600;
  margin: 0 auto;
}
.section-headline h4 .color {
  color: rgb(0, 125, 207);
  font-weight: 600;
}
:focus {
  outline: -webkit-focus-ring-color auto 0px;
}
.last-content {
  margin-bottom: 0px !important;
  padding-bottom: 0px !important;
}
.bg-color,
.bg-color-2 {
  position: relative;
  overflow: hidden;
  background: #ffffff;
  z-index: 1;
}
.bg-color-2::after {
  position: absolute;
  left: 0px;
  top: 0px;

  height: 100%;
  content: "";
  background: rgba(232, 234, 237, 0.3) none repeat scroll 0 0;
  z-index: -1;
}
.bg-color::after {
  position: absolute;
  right: 0px;
  top: 0px;

  height: 100%;
  content: "";
  background: rgba(232, 234, 237, 0.3) none repeat scroll 0 0;
  z-index: -1;
}
.bg-gray {
  background: #fcfafa;
}
.bg-dark {
  background: #071333;
}
/*--------------------------------*/
/*  2. Header top Area
/*--------------------------------*/

.navbar-brand > img {
  display: block;
  width: 72%;
}

ul.mega-menu .fa {
  font-size: 17px;
  margin-right: 5px;
}

.topbar-right ul li {
  display: inline-block;
}
.topbar-area {
  background: #212121;
}
.topbar-right ul li a {
  color: #ddd;
  display: block;
  font-weight: 600;
  margin-right: 20px;
  padding: 12px 0;
  text-decoration: none;
  font-size: 16px;
}
.topbar-right ul li a i {
  color: #0f90b8;
  font-size: 16px;
  padding-right: 7px;
}
.topbar-right {
  position: relative;
  display: block;
  float: right;
}
.top-social {
  float: left;
  padding: 11px 0px;
  margin-left: 10px;
}
.top-social ul li {
  display: inline-block;
}
.top-social ul li a {
  color: #ddd;
  margin-right: 5px;
  display: block;
  text-align: center;
  font-size: 22px;
  width: 26px;
  height: 26px;
  border-radius: 5px;
  line-height: 25px;
  font-weight: 600;
}
.top-social ul li a:hover {
  color: #ffffff;
  background: rgb(0, 125, 207);
}
.quote-button {
  float: left;
}
.quote-button .quote-btn {
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 800;
  color: #ddd;
  /* background: rgb(0, 125, 207); */
  display: inline-block;
  /* border: 2px solid rgb(0, 125, 207); */
  padding: 10px 20px;
  margin: 0px;
}
.quote-button .quote-btn:hover {
  /* background: transparent;
  color: rgb(0, 125, 207); */
}
.slogan {
  margin-bottom: 0px;
  padding: 16px 0px;
  color: #ffffff;
  font-size: 16px;
}
/*----------------------------------------*/
/*  2.1 Header Bottom Area 
/*----------------------------------------*/
.header-area {
  background: #ffffff;
  box-shadow: 2px 2px 5px #ccc, 0px 0px 0px #ccc;
}
.logo {
  display: block;
  /* position: fixed; */
}
.logo a {
  display: inline-block;
  /* height: auto;
  padding: 12px 0; */
}
.main-menu ul.navbar-nav li {
  float: left;
  position: relative;
}
.main-menu ul.navbar-nav > li > a {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  color: #212121;
  font-size: 14px;
  font-weight: 600;
  padding: 27px 6px;

  font-family: "Montserrat", sans-serif;
  margin: 0px 5px;
}
.main-menu ul.navbar-nav li a:hover {
  color: #212121;
}
.main-menu ul.navbar-nav > li > a::before {
  background: rgb(0, 125, 207);
  content: "";
  height: 2px;
  position: absolute;
  top: 0;
  width: 0;
  transition: 0.5s;
  left: 0px;
}
.main-menu ul.navbar-nav > li:hover > a:before,
.main-menu ul.navbar-nav > li.active > a::before {
  width: 100%;
}
.main-menu ul.navbar-nav li.active a:focus {
  color: #333;
}
.main-menu ul.navbar-nav li.active a {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  color: rgb(0, 125, 207);
  position: relative;
  z-index: 9999999;
}
.navbar {
  border: medium none;
  margin-bottom: 0;
}
.navbar-default {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.main-menu ul.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  background: none;
  color: #333;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  background-color: transparent;
  color: #000;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background: none;
}

.main-menu ul.nav li ul.sub-menu {
  background: #ffffff;
  border-top: 2px solid rgb(0, 125, 207);
  left: 0px;
  opacity: 0;
  position: absolute;
  top: 115%;
  transition: all 0.3s ease 0s;
  visibility: hidden;
  width: 242px;
  z-index: -99;
  box-shadow: 0px 0px 1px #ddd, -0px -0px 1px #ddd;
}

#sticker .sub-menu1 {
  left: -135px;
  background: #fff;
}
#sticker .sub-menu2 {
  width: 281px;
}

.main-menu ul.nav li ul.sub-menu1 {
  background: #ffffff;
  border-top: 2px solid rgb(0, 125, 207);

  opacity: 0;
  position: absolute;
  top: 115%;
  transition: all 0.3s ease 0s;
  visibility: hidden;
  width: 655px;
  z-index: -99;
  box-shadow: 0px 0px 1px #ddd, -0px -0px 1px #ddd;
}
.container {
  /* width: 100vw; */
}
.main-menu ul.nav li ul.sub-menu2 {
  background: #fff;
  /* margin-top: 3px; */
  opacity: 0;
  position: absolute;
  top: 115%;
  transition: all 0.3s ease 0s;
  visibility: hidden;
  border-top: 2px solid rgb(0, 125, 207);
  z-index: -99;
  box-shadow: 0px 0px 1px #ddd, -0px -0px 1px #ddd;
}

.main-menu ul.nav li ul.sub-menu33 {
  background: #ffffff;
  border-top: 2px solid rgb(0, 125, 207);
  left: -583px;
  opacity: 0;
  position: absolute;
  top: 115%;
  transition: all 0.3s ease 0s;
  visibility: hidden;
  width: 655px;
  z-index: -99;
  box-shadow: 0px 0px 1px #ddd, -0px -0px 1px #ddd;
}
.pagess {
  position: relative;
}
.navbar.navbar-default {
  float: right;
}
.main-menu ul.nav li ul.sub-menu li {
  padding: 0;
  position: relative;
  width: 100%;
  border-bottom: 1px solid #ccc;
}

.main-menu ul.nav li ul.sub-menu1 li {
  padding: 0;

  width: 100%;
  /* border-bottom: 1px solid #ccc; */
}
.main-menu ul.nav li ul.sub-menu2 li {
  padding: 0;
  position: relative;
  width: 100%;
  /* border-bottom: 1px solid #ccc; */
}
.main-menu ul.nav li:hover ul.sub-menu {
  top: 100%;
  opacity: 1;
  z-index: 999;
  visibility: visible;
  padding: 20px 0px;
}

.main-menu ul.nav li:hover ul.sub-menu1 {
  top: 100%;
  opacity: 1;
  z-index: 999;
  visibility: visible;
  padding: 8px 0px 8px 0px;
}
.main-menu ul.nav li:hover ul.sub-menu2 {
  top: 100%;
  opacity: 1;
  z-index: 999;
  visibility: visible;
  padding: 8px 0px 8px 0px;
}
.main-menu ul.nav li ul.sub-menu li a {
  color: #444;
  display: block;
  font-size: 13px;
  font-weight: 700;
  padding: 5px 15px;
  text-transform: uppercase;
  font-family: "Montserrat", sans-serif;
}
.main-menu ul.nav li ul.sub-menu1 li a {
  display: block;
  font-size: 12px;
  font-weight: 500;
  padding: 5px 15px;
  background: white;
  font-family: "Montserrat", sans-serif;
  color: black;
}
.main-menu ul.nav li ul.sub-menu2 li a {
  color: black;
  display: block;
  font-size: 13px;
  font-weight: 600;
  padding: 2px 15px;
  font-family: "Montserrat", sans-serif;
  line-height: 30px;
}
.main-menu ul.nav li ul.sub-menu li a span {
  color: rgb(0, 125, 207);
}
.main-menu ul.nav li ul.sub-menu1 li a span {
  color: rgb(0, 125, 207);
}
.main-menu ul.nav li ul.sub-menu2 li a span {
  color: rgb(0, 125, 207);
}
.main-menu ul.nav li:hover ul.sub-menu li a:hover {
  color: rgb(0, 125, 207);
}
.main-menu ul.nav li:hover ul.sub-menu1 li a:hover {
  color: #ffffff;
  background-color: #2e80ed;
}
.main-menu ul.nav li:hover ul.sub-menu2 li a:hover {
  color: #ffffff;
}
.main-menu ul.nav li ul.sub-menu li:last-child {
  border: none;
}
.main-menu ul.nav li ul.sub-menu1 li:last-child {
  border: none;
}
.stick span.search-button i,
.stick .header-search input {
  color: #444;
}
.search-option-5 button.button {
  display: inline-block;
  border: none;
  background: none;
  padding: 0;
}
.search-option {
  background: #f5f5f5;
  bottom: -85px;
  color: #444;
  display: none;
  position: absolute;
  right: 20px;
  width: 300px;
  z-index: 99999;
  padding: 20px;
}
.search-option input {
  background: #ffffff none repeat scroll 0 0;
  border: medium none;
  color: #444;
  display: block;
  float: left;
  font-size: 14px;
  font-style: italic;
  padding: 8px 10px;
  width: 214px;
  height: 44px;
}
.search-option button.button {
  background: rgb(0, 125, 207);
  border: medium none;
  color: #ffffff;
  display: inline-block;
  float: right;
  font-size: 17px;
  line-height: 35px;
  padding: 5px 15px;
  text-align: center;
}
.header-right-link a.main-search {
  color: #ffffff;
  display: inline-block;
  float: right;
  font-size: 16px;
  line-height: 39px;
  position: relative;
  text-align: center;
  width: 40px;
  height: 40px;
  background: rgb(0, 125, 207);
  border-radius: 5px;
  margin: 30px 0px 30px 10px;
}
/*--------------------------------*/
/* 2.2. Sticky Header Area
/*--------------------------------*/
.header-area.stick {
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999999;
  box-shadow: 0px 0px 5px #ccc, -2px -2px 5px #ccc;
  background: #ffffff;
}
.header-area.stick .logo a {
  display: inline-block;
  height: auto;
  padding: 11px 0;
}
.header-area.stick .main-menu ul.navbar-nav li a {
  padding: 25px 8px;
}

ul.mega-menu a {
  padding: 4px 10px !important;
}
.header-area.stick .quote-button {
  float: right;
  padding: 13px 5px;
}
.header-area.stick .header-right-link a.main-search {
  margin: 15px 10px;
}
.header-area.stick .main-menu ul.nav li ul.sub-menu li a {
  color: #444;
  display: block;
  font-size: 13px;
  font-weight: 700;
  padding: 10px 15px;
}
.header-area.stick .main-menu ul.nav li ul.sub-menu li a:hover {
  color: rgb(0, 125, 207);
}
.header-area.stick .navbar-brand > img {
  display: block;
  width: 220px;
  height: auto;
}
/*----------------------------------------*/
/*  2.3. Mobile Menu Area
/*----------------------------------------*/
.mobile-menu-area {
  background: #f9f9f9 none repeat scroll 0 0;
  padding: 10px 0px;
}
.mean-container .mean-bar::after {
  content: "";
  font-size: 21px;
  left: 5%;
  position: absolute;
  top: 12px;
  text-transform: uppercase;
  font-weight: 500;
}
.mean-container a.meanmenu-reveal:hover {
  color: #252525;
}
.quote-btn:hover .mean-container .mean-nav ul {
  list-style-type: none;
  margin: 20px 0px;
  padding: 0;
  width: 100%;
}
.mean-container .mean-nav ul li a {
  background: #f8f8f8 none repeat scroll 0 0;
  color: #444;
  display: block;
  float: left;
  font-size: 12px;
  font-weight: 700;
  margin: 0;
  padding: 13px 10px;
  text-align: left;
  text-decoration: none;
  text-transform: uppercase;
  width: 90%;
}
.mean-nav ul li.mean-last {
  margin-bottom: 20px;
}
.mean-container .mean-nav ul li a.mean-expand {
  color: #444;
  line-height: 17px;
}
.mean-container .mean-nav ul li {
  width: 99.7%;
}
/*----------------------------------------*/
/*  3. Slider Area
/*----------------------------------------*/
.intro-content {
  position: relative;
  z-index: 1;
}
.intro-content::after {
  background: rgba(10, 27, 40, 0.75) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}
.intro-content1::after {
  background: rgba(10, 27, 40, 0.75) none repeat scroll 0 0;
  content: "";
  height: 193vh;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}
.slider-content {
  position: absolute;
  right: 0;
  text-align: left;
  top: 50%;
  z-index: 3;
  left: 0;
  margin: 0 auto;
  margin-top: -150px;
}
.layer-1-2 {
  /* margin: 0px 0 20px; */
}
.layer-1-1 p {
  color: rgb(255, 255, 255);
  font-size: 19px;
  letter-spacing: 0.6px;
  line-height: 30px;
  max-width: 700px;
}
.layer-1-2 h1 {
  color: #ffeb3b;
  font-size: 50px;
  font-weight: 900;
  line-height: 60px;

  /* width: 180vh; */
  letter-spacing: 2px;
}
.ready-btn {
  border: 1px solid rgb(0, 125, 207);
  color: #ffffff;
  cursor: pointer;
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  margin-top: 20px;
  padding: 12px 10px;
  text-align: center;
  text-transform: uppercase;
  transition: all 0.4s ease 0s;
  z-index: 222;
  background: rgb(0, 125, 207);
  width: 160px;
  border-radius: 2px;
}
.ready-btn:hover {
  color: #ffffff;
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
  text-decoration: none;
}
.ready-btn.right-btn {
  margin-left: 15px;
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #444;
}
.ready-btn.right-btn:hover {
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
  color: #ffffff;
}
.ready-btn.left-btn:hover {
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #444;
}
.layer-1-2 .color {
  color: rgb(255, 255, 255);
  font-weight: 900;
}
.intro-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev,
.intro-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
  color: #ffffff;
  font-size: 24px;
  margin-top: -20px;
  position: absolute;
  top: 50%;
  text-align: center;
  line-height: 48px;
  opacity: 0;
  border: 1px solid #ffffff;
  width: 50px;
  height: 50px;
  border-radius: 3px;
}
.intro-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev {
  left: 10%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
}
.intro-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
  right: 10%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
}
.intro-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-next {
  right: 2%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  opacity: 1;
}
.intro-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-prev {
  left: 2%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  opacity: 1;
}
.intro-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-next:hover,
.intro-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-prev:hover {
  color: #ffffff;
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
}
.intro-carousel .owl-item .layer-1-2 {
  transform: translateY(100%);
  opacity: 0;
  /* transition: all 1s ease-out 0.1s; */
}
.intro-carousel .owl-item .layer-1-1 {
  transform: translateY(100%);
  opacity: 0;
  transition: all 0.3s ease-in-out 0.4s;
}
.intro-carousel .owl-item .layer-1-3 {
  transform: translateY(100%);
  opacity: 0;
  transition: all 1s ease-in-out 1.5s;
}
.intro-carousel .owl-item.active .layer-1-2,
.intro-carousel .owl-item.active .layer-1-1,
.intro-carousel .owl-item.active .layer-1-3 {
  transform: translateY(0);
  opacity: 1;
}
.intro-carousel .owl-item.active .slider-images img {
  transform: scale(1.1);
}
/*--------------------------------*/
/* 4.Welcome Services Area
/*--------------------------------*/
.well-services {
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  z-index: 1;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.4);
}
.top-icon {
  position: absolute;
  right: 15px;
  font-size: 44px;
  bottom: 0px;
  background: rgb(0, 125, 207);
  width: 60px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  color: #ffffff;
  border-radius: 5px 5px 0px 0px;
  z-index: 9;
}
.main-services {
  display: block;
  overflow: hidden;
  padding: 20px;
  position: relative;
  z-index: 1;
}

.well-icon {
  width: 60px;
  float: left;
  height: 100px;
  font-size: 40px;
  color: rgb(0, 125, 207);
}
.services-img {
  overflow: hidden;
  position: relative;
  text-align: center;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.services-img img {
  transform: scale(1.1);
  transition: 0.4s;
  /* border-top-left-radius: 8px; */
  /* border-top-right-radius: 8px; */
}
.image-layer {
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 100%;
  background: rgba(0, 44, 87, 0.95) none repeat scroll 0 0;
  z-index: 1;
  opacity: 1;
  transition: 0.4s;
  padding: 30px 20px;
}
.image-layer a {
  display: block;
  text-align: left;
  position: relative;
  margin-bottom: 10px;
  color: #ffffff;
  font-size: 14px;
}
.image-layer a i {
  border-radius: 50%;
  background: transparent;
  font-size: 20px;
  opacity: 0.9;
  line-height: 30px;
  margin-right: 15px;
}
.service-content h4 {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 0;
  padding: 0 0 10px;
  text-transform: uppercase;
}
.service-btn {
  font-weight: 700;
  text-transform: uppercase;
  color: #444;
  position: relative;
  font-family: "Montserrat", sans-serif;
  font-size: 13px;
  z-index: 2;
}
.service-btn::after {
  position: absolute;
  content: "\f105";
  font-family: fontAwesome;
  right: -15px;
  top: -5px;
  font-size: 16px;
}
.well-services:hover .services-img img {
  transform: scale(1);
  transition: 0.4s;
}
.well-services:hover .image-layer {
  position: absolute;
  left: 0;
  top: 0;
  transition: 0.4s;
}
.well-services:hover {
  background-color: #012a51; /* Change background color on hover */
} 
.well-services:hover .service-content h4 {
  color: #fff;
}
.well-services:hover p{
  color: #fff;
}
.well-services:hover .service-btn:hover {
  color: rgb(0, 125, 207);
}

.image-layer a:hover {
  color: rgb(0, 125, 207);
}
/*----------------------------------------*/
/*  5. About area
/*----------------------------------------*/
.about-image img {
  border-radius: 10px;
}
.about-content h2 {
  line-height: 38px;
  font-size: 26px;
  font-weight: 600;
  /* margin-left: 26px; */
}
.about-details {
  overflow: hidden;
  display: block;
  margin-top: -15px;
}
.single-about {
  display: block;
  margin-top: 30px;
}
.single-about a {
  font-size: 40px;
  color: rgb(0, 125, 207);
  float: left;
  line-height: 80px;
  width: 80px;
  height: 80px;
  border: 1px solid rgb(0, 125, 207);
  text-align: center;
  margin-right: 15px;
  border-radius: 3px;
}
.single-about1 a {
  font-size: 20px;
  color: rgb(0, 125, 207);
  float: left;
  line-height: 46px;
  width: 50px;
  height: 50px;
  border: 1px solid rgb(0, 125, 207);
  text-align: center;
  margin-right: 15px;
  border-radius: 27px;
}
.icon-text {
  padding-left: 95px;
}
.icon-textt {
  padding-left: 35px;
}
.icon-text h5 {
  margin-bottom: 5px;
}
.about-image {
  /* border-radius: 102px; */
  position: relative;
  overflow: hidden;
}
.about-image img {
  border-radius: 5px;
}
/* .about-image::after {
  position: absolute;
  right: -220px;
  top: 0px;
  width: 453px;
  height: 100%;
  content: "";
  background: #0f90b8 none repeat scroll 0 0;
  transform: rotate(45deg);
} */
.video-content {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0 auto;
  margin-top: -50px;
  text-align: center;
  z-index: 9;
}
.video-play.vid-zone {
  background: #ffffff;
  border-radius: 100%;
  display: inline-block;
  font-size: 34px;
  height: 100px;
  line-height: 96px;
  width: 100px;
  overflow: hidden;
  transition: 0.4s;
  border: 1px solid #ffffff;
}
.video-play.vid-zone i {
  color: rgb(0, 125, 207);
  margin-left: 5px;
}
.video-play.vid-zone:hover {
  border: 1px solid rgb(0, 125, 207);
  background: rgb(0, 125, 207);
  color: #ffffff;
  transition: 0.4s;
}
.video-play.vid-zone:hover i {
  color: #ffffff;
}
/*--------------------------------*/
/* 6.Services Area
/*--------------------------------*/
.services-all {
  margin-top: -20px;
}
.single-services {
  margin-top: 60px;
  display: block;
}

.service-inner {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4); /* Adding shadow */
  border-radius: 8px; 
  /* border: 1px solid #ddd; */
  padding: 30px 30px;
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.service-icon {
  display: inline-block;
  font-size: 40px;
  line-height: 67px;
  color: #fff;
  transition: 0.4s;
  position: absolute;
  top: -30px;
  z-index: 9999;
  width: 70px;
  height: 70px;
  /* background: #80c32f; */
  text-align: center;
  border-radius: 3px;
  transition: 0.4s;
  border: 1px solid #80c32f;
}
.services-all .service-content {
  padding-top: 30px;
}
.service-inner::after {
  background: #012a51;
  /* border: 1px solid #012a51; */
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 8px;
  content: "";
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.5);
  top: 0;
  left: 0;
  opacity: 0;
  transition: 0.4s;
  z-index: -1;
}
.single-services:hover .service-inner::after {
  opacity: 1;
  transition: 0.4s;
}
/* single-services:hover .service-inner {
  border: 1px solid #012a51;
} */
.service-inner .service-content h4 {
  font-size: 20px;
  text-transform: capitalize;
  font-weight: 600;
}
/* .service-inner .service-content h4 a {
  color: #444;
} */
.service-inner .service-content p {
  margin-bottom: 0px;
}
.single-services:hover .service-content h4 a,
.single-services:hover .service-content p {
  color: #fff;
}
/* .single-services:hover .service-icon {
  color: rgb(0, 125, 207);
  background: #ffffff;
  transition: 0.4s;
} */
/*----------------------------------------*/
/* 7.Counter Area
/*----------------------------------------*/
.counter-area {
  position: relative;
  overflow: hidden;
}
.counter-inner {
  background: #f5f5f5;
  padding: 100px 30px 100px 70px;
}
.fun-title h3 {
  color: #f5f5f5;
  font-size: 26px;
  line-height: 40px;
  margin-bottom: 0px;
  font-weight: 600;
  letter-spacing: 1px;
}
.fun-title {
  position: relative;
  background: rgba(10, 24, 40, 1) none repeat scroll 0 0;
  padding: 114px 0px 114px 100px;
  z-index: 1;
  margin-right: 125px;
}
.fun-title:after {
  content: "";
  position: absolute;
  width: 441px;
  height: 100%;
  background: rgba(10, 24, 40, 1) none repeat scroll 0 0;
  top: 76px;
  right: -164px;
  z-index: -1;
  transform: rotate(60deg);
}
.fun-content {
  display: block;
  padding: 80px 40px 80px 0px;
  overflow: hidden;
}
.fun_text i {
  font-size: 50px;
  color: #ffffff;
  line-height: 50px;
  margin-bottom: 30px;
  display: inline-block;
  width: 80px;
  height: 80px;
  line-height: 76px;
  border: 2px solid rgb(0, 125, 207);
  background: rgb(0, 125, 207);
  border-radius: 3px;
}
.fun_text {
  width: 50%;
  float: left;
  text-align: center;
}
.fun_text span {
  color: #444;
  display: block;
  font-size: 36px;
  font-weight: bold;
  padding-bottom: 10px;
  line-height: 40px;
}
.fun_text > h5 {
  color: #444;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 0;
}
/*--------------------------------*/
/*  8.project Area
/*--------------------------------*/
.single-awesome-project {
  float: left;
  overflow: hidden;
  width: 100%;
}
.project-all {
  margin-top: -40px;
}
.project-all .single-awesome-project {
  margin-top: 30px;
}
.first-item {
  margin-bottom: 30px;
}
.project-carousel .col-md-4 {
  width: 100%;
}
.awesome-img {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  height: 214px;
}
.awesome-img img {
  transform: scale(1.1);
  transition: 0.4s;
}
.single-awesome-project:hover .awesome-img img {
  transform: scale(1);
  transition: 0.4s;
}
.awesome-img > a {
  display: block;
  position: relative;
}
.single-awesome-project:hover .awesome-img > a::after {
  opacity: 1;
}
.single-awesome-project:hover .add-actions {
  opacity: 1;
}
.awesome-img > a::after {
  background: rgba(0, 44, 87, 0.95);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  opacity: 0;
  transition: 0.4s;
}
.add-actions {
  display: block;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  text-align: center;
  transition: all 0.4s ease 0s;
  width: 100%;
  z-index: 9999;
  top: 0;
  cursor: pointer;
}
.port-icon {
  color: #ffffff;
  display: inline-block;
  cursor: pointer;
  top: 41%;
  position: relative;
  font-size: 40px;
}
.project-dec {
  display: block;
  padding: 20px 0px 0px 0px;
}
.project-dec h4 {
  color: #444;
  font-size: 22px;
  font-weight: 500;
  text-decoration: none;
  text-transform: capitalize;
  margin-bottom: 5px;
  cursor: pointer;
  position: relative;
}
.project-dec h4::after {
  position: absolute;
  content: "\e87a";
  right: 40px;
  top: 0px;
  font-family: mentos;
  font-size: 20px;
  transition: 0.5s;
  width: 50px;
  height: 30px;
  border: 1px solid rgb(0, 125, 207);
  background: rgb(0, 125, 207);
  color: #ffffff;
  text-align: center;
  line-height: 27px;
  opacity: 0;
  transition: 0.5s;
}
.single-awesome-project:hover .project-dec h4::after {
  right: 0px;
  opacity: 1;
  transition: 0.5s;
}
.project-dec a {
  color: #444;
}
.project-dec a:hover {
  color: #333;
}
.project-dec span {
  font-size: 14px;
}
.project-dec p {
  margin-bottom: 0px;
}
.pst-content {
  padding-left: 10px;
}
.single-awesome-project:hover .project-dec h4 {
  color: rgb(0, 125, 207);
}
.project-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev,
.project-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
  color: #ffffff;
  font-size: 18px;
  margin-top: -20px;
  position: absolute;
  top: 50%;
  text-align: center;
  line-height: 39px;
  opacity: 0;
  border: 1px solid #ffffff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.project-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev {
  left: 10%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
}
.project-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
  right: 10%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
}
.project-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-next {
  right: 2%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  opacity: 1;
}
.project-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-prev {
  left: 2%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  opacity: 1;
}
.project-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-next:hover,
.project-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-prev:hover {
  color: #ffffff;
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
}
/*----------------------------------------*/
/* 9. banner area css
/*----------------------------------------*/
.banner-area {
  background: rgba(0, 0, 0, 0) url(img/background/bg1.jpg) no-repeat scroll top
    center / cover;
  position: relative;
  z-index: 1;
}
.banner-area:after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(10, 24, 40, 0.9) none repeat scroll 0 0;
  content: "";
  z-index: -1;
}
.banner-text h3 {
  font-size: 32px;
  line-height: 44px;
  color: #ffffff;
  max-width: 760px;
  margin: 0px auto 30px;
  letter-spacing: 1px;
}
.hire-btn {
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
  color: #ffffff;
  display: inline-block;
  font-size: 18px;
  margin-top: 30px;
  padding: 14px 30px;
  transition: 0.4s;
  text-transform: uppercase;
  border-radius: 2px;
  font-weight: 700;
}
.hire-btn:hover {
  background: transparent;
  color: rgb(0, 125, 207);
}
.single-brand-item {
  float: left;
  width: 20%;
}
.single-brand-item a {
  border: 1px solid #666;
  display: block;
  margin: 15px;
  background: #212d3c;
}
/*----------------------------------------*/
/*  10. Overview Area
/*----------------------------------------*/
.small-title {
  color: rgb(0, 125, 207);
  text-transform: uppercase;
  font-size: 15px;
  margin-bottom: 5px;
}
.overview-inner {
  padding-right: 20px;
}
/*----------------------------------------*/
/*  11. FAQ  Area
/*----------------------------------------*/
.company-faq {
  display: block;
  overflow: hidden;
  padding: 30px 30px;
  box-shadow: 0 3px 12px #ccc;
}
.faq-details .panel-heading {
  padding: 0;
}
.panel {
  margin-bottom: 20px;
  background-color: #ffffff;
  border: none;
  border-radius: 4px;
}
.panel-default {
  border-color: #f5f5f5;
  border-radius: 0 !important;
}
.panel-group .panel + .panel {
  margin-top: 10px;
}
.panel-default > .panel-heading {
  color: #444;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #f5f5f5;
  background: #ffffff;
}
.faq-details h4.check-title a {
  color: #444;
  display: block;
  font-weight: 500;
  padding: 10px 10px 10px 60px;
  text-decoration: none;
  background: #ffffff;
}
.panel-body {
  padding: 15px 15px 0px 45px;
}
.faq-details h4.check-title {
  color: #444;
  font-size: 18px;
  margin-bottom: 0px;
  text-transform: capitalize;
}
.faq-details .panel-heading h4 a {
  position: relative;
}
.faq-details .panel-heading h4 a::before {
  color: #444;
  content: "\e881 ";
  font-family: mentos;
  font-size: 16px;
  left: 0px;
  line-height: 46px;
  position: absolute;
  text-align: center;
  top: 0px;
  width: 50px;
  height: 100%;
}
.faq-details .panel-heading h4 a.active::before {
  color: rgb(0, 125, 207);
  content: "\e882";
  font-family: mentos;
  font-size: 16px;
  left: 0px;
  line-height: 46px;
  position: absolute;
  text-align: center;
  top: 0px;
  width: 50px;
  height: 100%;
}
.faq-details .panel-heading h4 a.active {
  color: rgb(0, 125, 207);
}
.faq-area .col-md-6 {
  padding-left: 0px;
  padding-right: 0px;
}
.faq-area .faq-content {
  margin-left: 30px;
  padding: 30px;
  border-radius: 5px;
  border: 1px solid #ccc;
}
.faq-area .contact-form input[type="text"],
.faq-area .contact-form input[type="email"] {
  border: 1px solid #ccc;
  border-radius: 0;
  height: 44px;
  margin-bottom: 15px;
  padding-left: 20px;
  width: 100%;
}
.faq-content h4 {
  color: #444;
  padding-bottom: 20px;
}
.faq-area .faq-content .contact-form textarea#message {
  height: 135px;
}
.faq-area .quote-btn {
  font-weight: 600;
  color: #ffffff;
  background: rgb(0, 125, 207);
  display: inline-block;
  border: 2px solid rgb(0, 125, 207);
  padding: 10px 20px;
  width: 134px;
  text-transform: uppercase;
  border-radius: 3px;
  transition: 0.4s;
  margin-top: 10px;
}
.faq-area .quote-btn:hover {
  background: transparent;
  border: 2px solid rgb(0, 125, 207);
  color: rgb(0, 125, 207);
  transition: 0.4s;
}
/*----------------------------------------*/
/*  12. Add Area
/*----------------------------------------*/
.add-area {
  background: url(img/background/multi.jpg) no-repeat scroll center center / cover;
  display: block;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.add-area::after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(10, 24, 40, 0.7) none repeat scroll 0 0;
  content: "";
  z-index: -1;
}
.add-content h4 {
  color: #fff;
  font-size: 29px;
  line-height: 44px;
  /* max-width: 750px; */
  float: left;
  margin-bottom: 21px;
  margin-top: -24px;
  letter-spacing: 1px;
  font-weight: 600;
}
.add-contact {
  /* float: left; */
  margin-left: 164px;
}
.call-us {
  /* display: block; */
  color: #fff;
  font-size: 22px;
  margin-bottom: 30px;
  margin-right: 43px;
}
.call-us i {
  width: 50px;
  height: 50px;
  display: inline-block;
  border: 1px solid rgb(0, 125, 207);
  background: rgb(0, 125, 207);
  text-align: center;
  line-height: 46px;
  margin-right: 15px;
  border-radius: 3px;
}
.mail-us {
  margin-bottom: 0px;
}
/*----------------------------------------*/
/*  13. Blog Area
/*----------------------------------------*/
.blog-area {
  background: #ffffff;
}
.blog-image {
  overflow: hidden;
  display: block;
}
.image-scale {
  position: relative;
  transform: scale(1.1);
  display: block;
  transition: 0.5s;
}
.image-scale::after {
  position: absolute;
  content: "";
  background: rgba(0, 46, 91, 0.1);
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.blog-content a h4 {
  font-size: 20px;
  text-transform: capitalize;
  font-weight: 600;
  color: #444;
  line-height: 28px;
  margin-bottom: 10px;
}
.blog-category span {
  text-transform: uppercase;
  font-size: 13px;
  color: rgb(0, 125, 207);
  font-weight: 600;
}
.blog-content {
  margin-top: 20px;
}
.blog-title {
  margin-top: 10px;
}
.blog-details .blog-content a h4 {
  font-size: 24px;
  line-height: 32px;
}
.home-blog .blog-content a h4 {
  margin-bottom: 0px;
}
.blog-meta {
  padding: 15px 0px 10px;
  position: relative;
}
.blog-meta span {
  color: #666;
  font-size: 13px;
  font-weight: 600;
  margin-right: 10px;
}
.blog-meta span i {
  padding-right: 3px;
}
.single-blog:hover .image-scale {
  transform: scale(1);
  transition: 0.5s;
}
.single-blog:hover .image-scale::after {
  background: rgba(0, 46, 91, 0);
}
.single-blog {
  position: relative;
  overflow: hidden;
}
.blog-grid-fast {
  margin-top: -30px;
}
.single-blog.b-mar {
  margin-top: 20px;
}
.blog-content a h4:hover {
  color: rgb(0, 125, 207);
}
.blog-btn {
  display: inline-block;
  font-weight: 700;
  color: #444;
  position: relative;
  text-transform: uppercase;
  font-size: 12px;
}
.blog-btn::after {
  position: absolute;
  content: "\e876";
  right: -12px;
  top: 0px;
  font-family: mentos;
  font-size: 10px;
  transition: 0.5s;
}
.blog-btn:hover {
  color: rgb(0, 125, 207);
}
.blog-btn:hover.blog-btn::after {
  right: -20px;
  opacity: 1;
  transition: 0.5s;
}
/*----------------------------------------*/
/*  14. Footer Area
/*----------------------------------------*/
.footer-area {
  padding: 40px 0px 40px 0;
}
.footer-1 {
  background: url(img/background/bg1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom center;
  background-attachment: scroll;
}
.footer-1 .footer-area {
  z-index: 1;
  background: transparent;
}
.footer-1 {
  z-index: 1;
  position: relative;
}
.footer-1::after {
  background: rgba(10, 24, 40, 0.95) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}
.footer-logo {
  margin-bottom: 15px;
}
.footer-head p {
  color: #ddd;
  letter-spacing: 0.6px;
}
.footer-head h4 {
  color: #ddd;
  font-size: 18px;
  margin-bottom: 20px;
  text-transform: uppercase;
  font-weight: 700;
}
.suscribe-input input {
  background: transparent;
  border: medium none;
  color: #777;
  font-size: 15px;
  line-height: 24px;
  padding: 11px 15px;
  height: 42px;
  border-radius: 0;
  width: 100%;
  border: 1px solid #777;
}
.suscribe-input button {
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
  color: #ffffff;
  font-size: 16px;
  padding: 8px 20px;
  border-radius: 3px;
  transition: 0.4s;
  margin-top: 15px;
  text-transform: uppercase;
  width: 100%;
}
.suscribe-input button:hover {
  background: transparent;
  border: 1px solid rgb(0, 125, 207);
  color: rgb(0, 125, 207);
  transition: 0.4s;
}
.footer-icons ul li {
  display: inline-block;
}
.footer-icons ul li a {
  color: #ddd;
  display: block;
  font-size: 16px;
  line-height: 28px;
  text-align: center;
  margin-right: 5px;
  width: 30px;
  height: 30px;
  border: 1px solid #ddd;
  border-radius: 50%;
}
.footer-tags li a:hover,
.footer-icons ul li a:hover {
  color: #ffffff;
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
}
.footer-tags li {
  float: left;
}
.footer-tags li a {
  color: #ddd;
  display: block;
  font-size: 14px;
  line-height: 28px;
  text-align: center;
  margin: 3px;
  border: 1px solid #012a51;
  background: #012a51;
  font-weight: 600;
  padding: 3px 5px;
  border-radius: 2px;
}
.footer-icons {
  margin-top: 20px;
}
.footer-contacts p span {
  color: rgb(0, 125, 207);
  font-weight: 700;
}
.footer-content {
  display: block;
  overflow: hidden;
}
.footer-list li a {
  color: #ddd;
  padding: 3px 0px 3px 20px;
  display: block;
  position: relative;
  font-weight: 500;
}
.subs-feilds {
  margin-top: 20px;
}
.footer-list li:first-child a {
  padding-top: 0px;
}
.footer-list li:last-child a {
  padding-bottom: 0px;
}
.footer-list li a::after {
  position: absolute;
  content: "";
  right: auto;
  top: 12px;
  left: 0;
  width: 5px;
  height: 5px;
  background: #ddd;
}
.footer-list li a:hover {
  color: rgb(0, 125, 207);
}
.footer-list li a:hover::after {
  background: rgb(0, 125, 207);
}
.footer-area-bottom {
  background: #071333 none repeat scroll 0 0;
  padding: 25px 0;
  border-top: 1px solid #333;
}
.copyright-text a:hover {
  text-decoration: underline;
  color: rgb(0, 125, 207);
}
.copyright-text a {
  color: #ddd;
}
.copyright > p {
  margin-bottom: 0;
  color: #ddd;
}
.copyright a {
  color: rgb(0, 125, 207);
}
.footer-1 .footer-area-bottom {
  background: rgba(10, 24, 40, 0.9) none repeat scroll 0 0;
  padding: 25px 0;
  border-top: none;
}
/*----------------------------------------*/
/*  15. Home 02 Area
/*----------------------------------------*/
.header-two .topbar-area {
  background: transparent;
}
.header-two {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 999;
}
.header-area-2 {
  background: transparent;
  box-shadow: none;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.header-two .main-menu ul.navbar-nav > li > a {
  color: #ffffff;
}
.slide-area {
  background: rgba(0, 0, 0, 0) url(img/slider/s2.jpg) no-repeat scroll top
    center / cover;
  width: 100%;
  height: 100%;
  z-index: 1;
  position: relative;
}
.display-table-cell {
  width: 100%;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
}
.display-table {
  width: 100%;
  height: 100%;
  display: table;
}
.slide-area .title2 {
  font-size: 46px;
  line-height: 54px;
  margin-bottom: 0px;
  color: #ffffff;
  padding-bottom: 20px;
  max-width: 640px;
}
.slide-area::after {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background: rgba(10, 24, 40, 0.6) none repeat scroll 0 0;
  content: "";
  z-index: -1;
}
.slide-content {
  margin-top: 120px;
}
.header-center {
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  padding: 0px 15px;
}
.header-area-2.stick {
  background: rgba(10, 24, 40, 0.99) none repeat scroll 0 0;
  box-shadow: 0px 0px 5px #444, -2px -2px 5px #444;
}
.counter-area-2 .fun-content {
  display: block;
  padding: 90px 0px 90px 0px;
  overflow: hidden;
}
.counter-area-2 .fun_text {
  width: 25%;
  float: left;
  text-align: center;
}
.counter-area-2 .fun_text > h5,
.counter-area-2 .fun_text span {
  color: #ffffff;
}
.project-area-2 .single-awesome-project {
  position: relative;
  margin-top: 0px;
}
.project-area-2 .project-dec {
  position: absolute;
  left: 20px;
  bottom: 30px;
}
.project-area-2 .project-dec h4 {
  color: #ffffff;
}
.project-area-2 .awesome-img > a::after {
  background: rgba(0, 44, 87, 0.95);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  opacity: 0.4;
  transition: 0.4s;
}
.project-area-2 .single-awesome-project:hover .awesome-img > a::after {
  opacity: 0.7;
}
.project-area-2 .single-awesome-project:hover .project-dec h4::after {
  display: none;
}
.project-area-2 .project-all {
  margin-top: 0px;
}
/*----------------------------------------*/
/*  16. Testimonial area
/*----------------------------------------*/
.single-testimonial {
  padding: 130px 0px;
  padding-left: 80px;
}
.single-testi {
  padding: 30px 20px;
  position: relative;
  background-color: #ffffff;
}
.testimonial-text {
  position: relative;
}
.testimonial-text::after {
  position: absolute;
  left: -35px;
  top: -5px;
  content: "\f10d ";
  font-family: fontawesome;
  font-size: 28px;
  transition: 0.5s;
  font-weight: 400;
}
.testimonial-text p {
  color: #444;
  font-size: 18px;
  line-height: 30px;
  letter-spacing: 0.6px;
}
.testimonial-text h5 {
  color: #444;
  font-size: 20px;
}
.testimonial-text a {
  color: rgb(0, 125, 207);
}
.testimonial-inner,
.testimonial-inner img {
  border-radius: 5px;
}
.client-name {
  display: inline-block;
}
.client-name h4 {
  font-weight: 600;
  font-size: 24px;
  margin-bottom: 0px;
}
.client-name span {
  font-size: 13px;
}
.hire-btn {
  margin-top: 10px;
}
.blog-right-column .blog-image {
  float: left;
  width: 50%;
}
.blog-right-column .blog-content {
  border: 1px solid #f5f5f5;
  height: 100%;
  min-height: 238px;
  margin-top: 0px;
  width: 50%;
  float: right;
  padding: 20px;
}
.blog-area-2 .single-blog {
  margin-bottom: 30px;
}
.blog-right-column .blog-meta {
  padding: 5px 0px 10px;
  position: relative;
}
.footer-2 .footer-area {
  background: #071333;
}
/*----------------------------------------*/
/*  17. Home 03 Area
/*----------------------------------------*/
.header-area-3 {
  background: rgba(10, 24, 40, 0.6) none repeat scroll 0 0;
  box-shadow: none;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.header-two .topbar-area-2 {
  background: rgba(10, 24, 40, 0.6) none repeat scroll 0 0;
}
.header-area-3.stick {
  background: #071333;
  box-shadow: 0px 0px 5px #444, -2px -2px 5px #444;
}
.intro-area-3 .layer-1-2 h1 {
  color: #ffffff;
  font-size: 46px;
  font-weight: 700;
  line-height: 54px;
  text-transform: unset;
  max-width: 700px;
  letter-spacing: 2px;
}
.intro-area-3 .slider-content {
  margin-top: -110px;
}
/*----------------------------------------*/
/*  18. Wellcome Services 2 Area
/*----------------------------------------*/
.welcome-area-2 .well-services {
  padding: 30px;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 1;
}
.welcome-area-2 .well-services::after {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #012a51;
  content: "";
  transition: 0.5s;
  z-index: -1;
  opacity: 0;
}
.welcome-area-2 .well-services:hover::after {
  opacity: 1;
  transition: 0.5s;
}
.welcome-area-2 .well-icon {
  margin-bottom: 20px;
  display: block;
  float: none;
  width: auto;
  height: auto;
}
.welcome-area-2 .well-icon a {
  font-size: 60px;
  line-height: 60px;
  color: rgb(0, 125, 207);
  font-weight: 800;
}
.welcome-area-2 .well-services .well-content h4 {
  font-size: 24px;
  line-height: 30px;
}
.welcome-area-2 .well-services:hover .well-content h4,
.welcome-area-2 .well-services:hover .well-content p,
.welcome-area-2 .well-services:hover .well-icon a {
  color: #ffffff;
}
.base {
  position: absolute;
  right: 10px;
  font-size: 140px;
  line-height: 150px;
  color: #ddd;
  top: 10px;
  z-index: -1;
  opacity: 0.3;
}
.services-area-3 .service-icon {
  position: relative;
  top: 0px;
}
.services-area-3 .services-all {
  margin-top: -30px;
}
.services-area-3 .single-services {
  margin-top: 30px;
}
.project-carousel .col-md-3 {
  width: 100%;
}
/*----------------------------------------*/
/* 19. Team member area
/*----------------------------------------*/
.team-hover li {
  display: inline-block;
  margin: 0px 1px;
}
.team-hover li a {
  color: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
  display: block;
  width: 36px;
  height: 36px;
  line-height: 36px;
  border-radius: 2px;
}
.team-member {
  margin-top: -30px;
}
.team-hover li a:hover {
  color: rgb(0, 125, 207);
}
.team-hover {
  padding: 15px 0;
  text-align: center;
  transition: all 0.4s ease 0s;
}
.single-member {
  margin-top: 30px;
}
.single-member .team-img {
  display: block;
  position: relative;
  overflow: hidden;
}
.single-member .team-img a {
  display: block;
}
.team-content {
  padding: 10px;
  text-align: center;
}
.team-content h4 a {
  color: #444;
}
.team-content p {
  margin-bottom: 0;
}
.team-content h4 {
  font-size: 22px;
  margin: 10px 0px;
  text-transform: uppercase;
  font-weight: 700;
}
.footer-3 .footer-area {
  background: #222222;
}
.footer-3 .footer-tags li a {
  border: 1px solid #272727;
  background: #272727;
}
.footer-3 .footer-area-bottom {
  background: #212121;
}
/*----------------------------------------*/
/* 20. Home-4 area
/*----------------------------------------*/
.header-area-4 {
  background: transparent;
  box-shadow: none;
}
.header-area-4 .header-center {
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  padding: 0px 15px;
  background: rgb(0, 125, 207);
}
.header-area-4.stick {
  background: rgb(0, 125, 207);
}
.intro-area-4 .slider-content {
  text-align: center;
  margin-top: -130px;
}
.intro-area-4 .layer-1-2 h1 {
  font-size: 56px;
  font-weight: 700;
  line-height: 66px;
  text-transform: uppercase;
  max-width: 850px;
  margin: 0 auto;
}
.intro-area-4 .layer-1-1 p {
  margin: 0 auto 20px;
}
/*----------------------------------------*/
/*  21. Breadcumbs Area
/*----------------------------------------*/
.page-area {
  position: relative;
}
.page-area {
  background: url(img/background/b.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.page-area1 {
  background: url(img/background/b.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area13 {
  background: url(img/background/Yard\ Dock7.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area14 {
  background: url(img/background/Yard\ Dock9.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}
.page-area15 {
  background: url(img/background/rfid_arrival.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
  height: 110%;
}
.page-area16 {
  background: url("https://aransubhe.sirv.com/Images/virtual-copy.jpg?q=47");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
  padding: 19px;
}

.page-area17 {
  background: url(img/project/drive-by-rfid-2.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
  position: relative;
  margin: 9px 12px 0px 12px;
}

.page-area31 {
  background: url(img/project/antenna-rfid.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
  position: relative;
  margin: 9px 12px 0px 12px;
}
.page-area18 {
  /* background: url(img/project/smart-home.svg); */
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
  position: relative;
  margin-top: 20px;
}

.page-area19 {
  background: url(img/project/IODDOCK9.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area20 {
  background: url(img/project/smart-home.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
  position: relative;
  margin-top: 20px;
}

.page-area21 {
  background: url(img/project/IODDOCK4.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area22 {
  background: url(img/project/Yard\ Dock6.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area23 {
  background: url(img/project/IoT\ Gateway.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
  position: relative;
  margin: 9px 12px 0px 12px;
  padding: 41px 1px 1176px 4px;
}

.page-area24 {
  background: url(img/background/Yard\ Dock2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area25 {
  background: url(img/background/Yard\ Dock2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area26 {
  background: url(img/background/Yard\ Dock2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area27 {
  background: url(img/background/Yard\ Dock2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area28 {
  background: url(img/background/Yard\ Dock2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area29 {
  background: url(img/background/Yard\ Dock2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

/* .page-area2 {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
} */

/* .page-area2 video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}

.content {
  position: relative;
  z-index: 1;
  color: white;
  text-align: center;
  padding: 20px;
} */

.nav-arrow {
  position: absolute;
  top: 96%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  display: inline-block;
  font-size: 42px;
  padding: 17px 15px;
  cursor: pointer;
  z-index: 3; /* Above everything */
}


.left-arrow {
  /* left: 10px; */
  /* margin-left: 1370px; */
  /* margin-right: 75%; */
  float: left;
  top: 50vh
}

.right-arrow {
  /* right: -207vh; */
  float: right;
  top: 50vh
}

.nav-arrow:hover {
  background: rgba(0, 0, 0, 0.7);
}

.page-area2 {
    background: url('https://aransubhe.sirv.com/Images/yard-dock15.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    margin-top: 0px;
    margin-bottom: 0px;
    position: relative;
    width: 100%;
    min-height: 100%;
}
.page-area2::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(
    0,
    0,
    0,
    0.3
  ); /* Adjust the opacity (0.5) to make it more or less transparent */
  z-index: 1;
}
.page-area2 > * {
  position: relative;
  z-index: 2; /* Ensures content appears above the overlay */
}

.page-area30 {
  background: url(img/project/IODDOCK8.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
}

.page-area32 {
  background: url("https://aransubhe.sirv.com/Images/parking7.jpg?q=55");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 100px;
  position: relative;
  width: 100%;
  /* height: 100vh; */
}

.page-area32::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(
    0,
    0,
    0,
    0.3
  ); /* Adjust the opacity (0.5) to make it more or less transparent */
  z-index: 1;
}

.page-area32 > * {
  position: relative;
  z-index: 2; /* Ensures content appears above the overlay */
}

.breadcumb-overlay {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  /* background: rgba(10, 27, 40, 0.5) none repeat scroll 0 0; */
  content: "";
}
.breadcrumb {
  padding: 100px 0px;
  background-color: transparent;
  /* margin-bottom: 0;
  overflow: hidden; */
}
.breadcrumb-bg {
  float: right;
  padding: 14px 0px;
}
.bread-inner {
  padding: 80px 0px;
}
.breadcrumb .section-headline h2 {
  background-color: #001cff38;
  font-size: 40px;
  letter-spacing: 1px;
  line-height: 54px;
  text-transform: uppercase;
  position: relative;
  color: #ffffff;
  margin-bottom: 0px;
}
.breadcrumb .section-headline {
  margin-bottom: 0px;
  display: inline-block;
}
.breadcrumb .section-headline h2::after {
  display: none;
}
.breadcrumb ul li {
  display: inline-block;
  color: #ffffff;
  padding: 0px 10px 0px 20px;
  position: relative;
  font-size: 15px;
  text-transform: uppercase;
  font-weight: 700;
}
.breadcrumb ul li.home-bread {
  padding-left: 0px;
}
.breadcrumb ul li.home-bread::after {
  position: absolute;
  content: "\f105";
  font-family: fontAwesome;
  right: -10px;
  top: 0;
}
.breadcrumb .section-headline::after {
  display: none;
}
.testimonial-page-area .single-testimonial {
  padding: 15px 0px;
  padding-left: 80px;
  margin-bottom: 30px;
}
.testimonial-page-area .client-name h4 {
  font-size: 20px;
}
.testimonial-page-area .testimonial-text p {
  font-size: 17px;
  line-height: 26px;
}
.project-content {
  margin-top: -30px;
}
.project-content .single-awesome-project {
  margin-top: 30px;
}
.blog-grid .blog-text p {
  margin-bottom: 0px;
}
/*----------------------------------------*/
/*  22. About page Area
/*----------------------------------------*/
.support-services {
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  padding: 40px 30px;
  text-align: center;
}
.support-services .support-content h4 {
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 700;
  padding-bottom: 0px;
}
.support-services .support-content h4 a {
  color: #444;
}
.support-services:hover .support-content h4 a {
  color: rgb(0, 125, 207);
}
.support-services .support-content p {
  color: #444;
  margin-bottom: 0px;
}
.support-images {
  display: inline-block;
  font-size: 34px;
  color: rgb(0, 125, 207);
  line-height: 77px;
  text-align: center;
  margin-bottom: 30px;
  transition: 0.4s;
  text-transform: uppercase;
  font-weight: 600;
  border: 1px solid rgb(0, 125, 207);
  border-radius: 50px;
  width: 80px;
  height: 80px;
}
.support-services:hover .support-images {
  background: rgb(0, 125, 207);
  transition: 0.4s;
  border: 1px solid rgb(0, 125, 207);
  color: #ffffff;
}
/*----------------------------------------*/
/* 23. Blog Details page
/*----------------------------------------*/
.page-blog .blog-grid {
  margin-top: -30px;
}
.page-blog .single-blog {
  margin-top: 30px;
}
.left-head-blog {
  padding: 30px 20px;
  border: 1px solid #ddd;
}
.blog-search-option input {
  padding: 5px 15px;
  width: 80%;
  border: none;
  height: 50px;
}
.blog-search-option {
  margin-bottom: 30px;
  display: block;
  border: 1px solid #ccc;
}
.blog-search-option button {
  background: transparent;
  border: none;
}
.blog-search-option button i {
  line-height: 16px;
  font-size: 20px;
  padding: 0px 10px;
}
.blog-search-option button i:hover {
  color: rgb(0, 125, 207);
}
.left-blog h4 {
  border-bottom: 1px solid #ddd;
  color: #444;
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 0;
  padding: 15px 0px;
  text-transform: uppercase;
  position: relative;
}
.left-blog h4::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: -1px;
  width: 70px;
  height: 2px;
  background: rgb(0, 125, 207);
}
.left-blog {
  overflow: hidden;
  padding-bottom: 20px;
}
.left-blog ul {
  margin-top: 15px;
}
.left-blog li {
  display: block;
}
.left-blog ul li a {
  color: #444;
  display: block;
  font-size: 14px;
  padding: 10px 0px 10px 20px;
  text-transform: capitalize;
  position: relative;
  font-weight: 600;
}
.left-blog ul li a:after {
  position: absolute;
  content: "\e876";
  font-family: mentos;
  left: 0px;
  top: 10px;
  font-size: 12px;
}
.popular-tag.left-blog ul li a:after {
  display: none;
}
.recent-single-post {
  display: block;
  overflow: hidden;
  padding: 15px 0px;
}
.recent-single-post:last-child {
  border-bottom: none;
}
.left-blog-page .post-img {
  display: inline-block;
  float: left;
  padding: 0 5px;
  width: 35%;
  height: 100%;
  min-height: 100px;
}
.left-blog-page .post-img img {
  width: 100%;
  height: 100%;
  min-height: 100px;
  object-fit: cover;
}
.left-blog-page .recent-post {
  margin-top: 15px;
}
.pst-content {
  display: inline-block;
  float: left;
  width: 65%;
  padding-left: 10px;
}
.pst-content p a:hover,
.left-blog ul li a:hover {
  color: rgb(0, 125, 207);
}
.pst-content p a {
  color: #444;
  font-size: 15px;
  font-weight: 600;
}
.pst-content p {
  margin-bottom: 5px;
}
.blog-tags {
  padding: 1px 0;
}
.left-blog li:last-child {
  border-bottom: 0;
}
.popular-tag.left-blog ul li a:hover {
  color: #ffffff;
}
.popular-tag.left-side-tags.left-blog ul {
  padding: 0px;
}
.pst-content .blog-meta {
  padding: 0px;
}
.left-tags .left-side-tags ul li {
  border-bottom: 0;
  display: inline-block;
  margin: 5px 0px;
}
.left-tags .left-side-tags ul li a {
  padding: 0px 6px;
  width: auto;
  font-weight: 600;
  font-size: 14px;
}
.left-tags .left-side-tags ul li a:hover {
  color: rgb(0, 125, 207);
}
.left-side-tags h4 {
  margin-bottom: 15px;
}
.comments-heading h3,
h3.comment-reply-title {
  border-bottom: 1px solid #e8e8e9;
  color: #444;
  font-size: 18px;
  margin: 0 0 20px;
  padding: 0 0 5px;
  text-transform: capitalize;
}
.comments-list ul li {
  margin-bottom: 25px;
}
.comments-list-img {
  float: left;
  margin-right: 15px;
}
.comments-content-wrap {
  color: #444;
  font-size: 14px;
  margin: 0 0 15px 60px;
  padding: 10px;
  position: relative;
}
.blog-content p {
  font-size: 15px;
  letter-spacing: 0.5px;
}
blockquote {
  padding: 10px 20px;
  margin: 0 0 20px;
  font-size: 15px;
  border-left: 5px solid rgb(0, 125, 207);
  font-style: italic;
}
blockquote p {
  font-size: 16px !important;
  line-height: 28px;
  color: #444;
}
.author-avatar {
  display: inline-block;
  float: left;
  width: 10%;
}
.author-description h2 {
  color: #777;
  font-size: 20px;
  text-transform: uppercase;
}
.author-description h2 a {
  color: #333;
}
.comments-content-wrap span b {
  margin-right: 5px;
}
.comments-content-wrap span a:hover {
}
span.post-time {
  margin-right: 5px;
}
.comments-content-wrap p {
  color: #444;
  margin-top: 10px;
}
li.threaded-comments {
  margin-left: 50px;
}
.comment-respond {
  margin-top: 20px;
}
span.email-notes {
  color: #42414f;
  display: block;
  font-size: 12px;
  margin-bottom: 10px;
}
.comment-respond p {
  color: #444;
  margin-bottom: 5px;
}
.comment-respond input[type="text"],
.comment-respond input[type="email"] {
  border: 1px solid #e5e5e5;
  border-radius: 0;
  height: 32px;
  margin-bottom: 15px;
  padding: 0 0 0 10px;
  width: 100%;
}
.comment-respond textarea#message-box {
  border: 1px solid #e5e5e5;
  border-radius: 0;
  max-width: 100%;
  padding: 10px;
  height: 160px;
  width: 100%;
}
.comments-content-wrap span a {
  color: rgb(0, 125, 207);
}
.comments-content-wrap span a:hover {
  color: rgb(0, 125, 207);
}
.comment-respond .add-btn.contact-btn {
  background: rgb(0, 125, 207);
  color: #ffffff;
  display: block;
  font-size: 15px;
  margin-top: 5px;
  padding: 13px 20px;
  transition: 0.4s;
  border-radius: 2px;
  width: auto !important;
  margin-top: 20px;
  border: 1px solid rgb(0, 125, 207);
  text-transform: uppercase;
  font-weight: 700;
}
.comment-respond .add-btn.contact-btn:hover {
  background: #ffffff;
  color: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
}
.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 30px 0 0px;
  border-radius: 4px;
}
.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  line-height: 1.42857143;
  text-decoration: none;
  color: #666;
  background-color: transparent;
  border: none;
  margin-left: -1px;
  border-radius: 2px;
  border: 1px solid #666;
}
.pagination > li {
  display: inline-block;
  margin: 0px 3px;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  z-index: 3;
  color: #ffffff;
  background-color: rgb(0, 125, 207);
  border-color: rgb(0, 125, 207);
  cursor: default;
  border-radius: 2px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
  z-index: 2;
  color: #ffffff;
  background-color: rgb(0, 125, 207);
  border-color: rgb(0, 125, 207);
  border-radius: 2px;
}
.blog-page-details .left-blog-page {
  margin-top: 0px;
  margin-bottom: 30px;
}
.single-post-comments {
  margin-top: 30px;
}
/*----------------------------------------*/
/*  24.	Contact Us page area
/*----------------------------------------*/
.contact-details {
  display: block;
  overflow: hidden;
  background: #f5f5f5;
  padding: 40px 30px;
  margin-bottom: 40px;
}
.contact-head {
  padding-right: 40px;
}
.contact-head h3 {
  font-weight: 700;
  font-size: 30px;
}
.contact-inner a i {
  color: #ffffff;
  display: inline-block;
  font-size: 26px;
  text-align: center;
  line-height: 48px;
  margin-right: 15px;
  border-radius: 3px;
  width: 50px;
  height: 50px;
  border: 1px solid rgb(0, 125, 207);
  background: rgb(0, 125, 207);
  margin-top: 15px;
}
.contact-inner a {
  color: #666;
  font-size: 16px;
  display: block;
}
.contact-inner a span {
  line-height: 30px;
  display: inline-block;
  overflow: hidden;
}
.contact-head p {
  font-size: 16px;
}
.contact-form input[type="text"],
.contact-form input[type="email"] {
  border: 1px solid #ccc;
  border-radius: 0;
  height: 44px;
  margin-bottom: 15px;
  padding-left: 20px;
  width: 100%;
}
.contact-form textarea#message {
  border: 1px solid #ccc;
  border-radius: 0px;
  height: 180px;
  padding: 20px;
  width: 100%;
}
.contact-page .contact-btn {
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
  color: #ffffff;
  display: inline-block;
  font-size: 16px;
  margin-top: 5px;
  padding: 13px 36px;
  transition: 0.4s;
  width: auto;
  float: left;
  text-transform: uppercase;
  border-radius: 2px;
  font-weight: 700;
}
.contact-page .contact-btn:hover {
  background: transparent;
  border: 1px solid rgb(0, 125, 207);
  color: rgb(0, 125, 207);
  transition: 0.4s;
}
/*----------------------------------------*/
/* 25. Services Details area
/*----------------------------------------*/
.single-page-head {
  margin-bottom: 30px;
}
.single-services-page p {
  color: #666;
}
.left-menu li:first-child {
  margin: 0px 0px 2px;
}
.left-contact h4 {
  font-size: 24px;
  text-transform: uppercase;
  margin-bottom: 30px;
}
.left-menu {
  border: 1px solid #ddd;
  padding: 30px 20px;
}
.left-menu li {
  display: block;
}
.build-img .page-img {
  padding-bottom: 0;
}
.left-menu ul li.active a {
  color: rgb(0, 125, 207);
  position: relative;
}
.left-menu ul li a:hover {
  color: rgb(0, 125, 207);
}
.left-menu ul li a {
  color: #444;
  display: block;
  font-size: 17px;
  font-weight: 600;
  padding: 10px 0px;
  position: relative;
  text-decoration: none;
  text-transform: capitalize;
}
.left-menu ul li.active a::after,
.left-menu ul li a:hover::after {
  content: "\e876";
  font-family: mentos;
  font-size: 12px;
  position: absolute;
  right: 0px;
  top: 11px;
}
.download-btn h4 {
  text-transform: uppercase;
  font-weight: 700;
  font-family: "Open Sans", sans-serif;
}
.download-btn h4 {
  text-transform: uppercase;
}
.down-btn i {
  font-size: 24px;
  float: left;
  margin-right: 15px;
}
.down-btn {
  border: 1px solid #ddd;
  color: #444;
  cursor: pointer;
  display: inline-block;
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 15px;
  padding: 15px;
  text-align: left;
  text-transform: capitalize;
  transition: all 0.4s ease 0s;
  z-index: 222;
  background: #ffffff;
  width: 100%;
  position: relative;
  border-radius: 3px;
}
.down-btn.apli {
  margin-bottom: 0px;
}
.down-btn:hover {
  color: rgb(0, 125, 207);
  background: #ffffff;
  border: 1px solid rgb(0, 125, 207);
}
.single-page-head .clients-testi {
  padding: 20px 15px;
  border: 1px solid #243559;
  background: #243559;
}
.single-page-head .review-text {
  margin-top: 20px;
}
.clients-testi .review-text a,
.clients-testi .guest-rev {
  color: #ffffff;
}
.clients-testi .single-review {
  border: none;
}
.review-text h4 {
  text-transform: uppercase;
  font-size: 16px;
  margin-bottom: 0px;
  color: #ffffff;
}
.single-page-head .review-text p {
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.5px;
}
.single-page-head .review-img {
  margin-top: 0px;
}
.single-page-head .review-img img {
  border-radius: 50%;
}
.page-content h3 {
  font-weight: 600;
  padding: 15px 0 0;
}
.single-well {
  margin-bottom: 30px;
}
.single-page {
  overflow: hidden;
}
.single-well h3 {
  margin-bottom: 15px;
}
.single-well.last-part p {
  margin-bottom: 0px;
}
.service-list li {
  display: block;
  position: relative;
  padding-left: 30px;
  color: #444;
}
.service-list li::before {
  position: absolute;
  left: 0;
  content: "\f00c";
  font-family: fontawesome;
  top: 0;
  color: rgb(0, 125, 207);
}
.single-page-head .service-btn {
  width: 100%;
  margin: 20px 0px 0px 0px;
}
.marker-list li {
  color: #444;
  padding-left: 30px;
  margin: 10px 0px;
  position: relative;
}
.marker-list li::after {
  position: absolute;
  content: "\e87f";
  left: 0;
  top: 3px;
  font-family: mentos;
  color: rgb(0, 125, 207);
  font-weight: 700;
}
.single-services-page .marker-list li {
  color: #444;
}
.blog-details .blog-category {
  margin-bottom: 15px;
}
.blog-details .blog-content h4 {
  margin-bottom: 0px;
}
/*----------------------------------------*/
/* 26. Project Details page
/*----------------------------------------*/
.project-page-area .project-menu li a {
  color: #444;
}
.project-2-column .project-single {
  float: left;
  width: 50%;
}
.project-4-column .project-single {
  float: left;
  width: 25%;
}
.project-carousel-2.owl-carousel.owl-theme .owl-controls .owl-nav div {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 1px solid #ffffff;
  border-radius: 0;
  color: #ffffff;
  display: inline-block;
  font-size: 14px;
  height: 40px;
  line-height: 38px;
  position: relative;
  text-align: center;
  transition: all 0.5s ease 0s;
  width: 40px;
  border-radius: 50%;
}
.project-carousel-2.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev {
  top: 50%;
  position: absolute;
  left: 3%;
  margin-top: -30px;
}
.project-carousel-2.owl-carousel.owl-theme
  .owl-controls
  .owl-nav
  div.owl-prev:hover,
.project-carousel-2.owl-carousel.owl-theme
  .owl-controls
  .owl-nav
  div.owl-next:hover {
  background: rgb(0, 125, 207);
  border: 1px solid rgb(0, 125, 207);
  color: #ffffff;
}
.project-carousel-2.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
  margin-top: -30px;
  position: absolute;
  right: 3%;
  top: 50%;
}
.project-history {
  background: #f5f5f5;
  padding: 30px;
  margin-bottom: 30px;
}
.project-details h4 {
  font-size: 26px;
  font-weight: 600;
}
.project-name ul li {
  color: #444;
  font-weight: 500;
  font-size: 18px;
  line-height: 32px;
  margin: 10px 0px;
}
.project-name span {
  padding-right: 15px;
  min-width: 110px;
  display: inline-block;
  font-weight: 700;
  font-size: 18px;
}
.project-inner {
  margin-bottom: 40px;
}
.project-details p {
  font-size: 14px;
  letter-spacing: 0.5px;
  margin-bottom: 25px;
}
/*--------------------------------*/
/* 27. Error page
/*--------------------------------*/
.error-easy-text {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 30px;
}
.high-text {
  font-size: 200px;
  line-height: 200px;
  font-family: "Montserrat", sans-serif;
}
.error-bot {
  font-size: 24px;
}
.error-btn {
  background: rgb(0, 125, 207);
  border: 2px solid rgb(0, 125, 207);
  color: #ffffff;
  font-size: 16px;
  padding: 12px 20px;
  transition: 0.4s;
  margin-top: 15px;
  text-transform: capitalize;
  margin-top: 30px;
  display: inline-block;
  font-weight: 700;
}
.error-btn:hover {
  background: #ffffff;
  border: 2px solid rgb(0, 125, 207);
  color: rgb(0, 125, 207);
}