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

    Template Name: imak - Technology services
    Template URI: https://www.imaksoftwaresolutions.com/
    Description:  imaksoftwaresolutions - Technology services
    Author: imaksoftwaresolutions
    Author URI: https://www.imaksoftwaresolutions.com/
    Version: 1.0

-----------------------------------------------------------------------------------
    
    CSS INDEX
    =========================================
	
    01. Theme default CSS
        - Common Classes
        - Section Padding
    02. Element
        - Button Style 
        - Section Title Css
        - Breadcrumb Style
        - Paginatoin Css
    03. Mobile Menu Css
    04. Header css
    05. Hero Css
    06. Service Css 
    07. About Area Css
    08. Repair Service Css
    09. Project Count Css
    10. FAQ Css
    11. Something New Css
    12 .Latest Blog Css
        - Blog Details Css
    13. Your Opinion Css
    14. Gallery Css
    15. Pricing Table Css
    16. Team Area Css
    17. Contact Page Css
    18. Footer Css
    
    
-----------------------------------------------------------------------------------*/
/* transition */
/* flex */
/* transform */
/* opacity */
/*----------------------------------------*/
/*  01. Theme default CSS
/*----------------------------------------*/
/*-- Google Font --*/
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
/*-- Common Style --*/
*, *::after, *::before {
  box-sizing: border-box;
}
html, body {
  height: 100%;
}
body {
  background-color: #fff;
  line-height: 22px;
  font-size: 16px;
  font-style: normal;
  font-weight: normal;
  visibility: visible;
  font-family: "Inter", sans-serif;
  color: #555;
}
h1, h2, h3, h4, h5, h6 {
  color: #333;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  margin-top: 0;
}
h1 {
  font-size: 58px;
  line-height: 1;
  font-weight: 700;
}
h2 {
  font-size: 30px;
  line-height: 36px;
}
h3 {
  font-size: 24px;
  line-height: 30px;
}
h4 {
  font-size: 18px;
  line-height: 24px;
}
h5 {
  font-size: 14px;
  line-height: 18px;
}
h6 {
  font-size: 12px;
  line-height: 14px;
}
p:last-child {
  margin-bottom: 0;
}
p {
  font-family: "Inter", sans-serif;
}
a, button {
  color: inherit;
  display: inline-block;
  line-height: inherit;
  text-decoration: none;
  cursor: pointer;
}
a, button, img, input, span {
  transition: all 0.3s ease 0s;
}
*:focus {
  outline: none !important;
}
a:focus {
  color: inherit;
  outline: none;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
  color: #e6012c;
}
button, input[type="submit"] {
  cursor: pointer;
}
img {
  max-width: 100%;
  height: auto;
}
ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
/*-- 
    - Common Classes
-----------------------------------------*/
.fix {
  overflow: hidden;
}
.hidden {
  display: none;
}
.clear {
  clear: both;
}
@media only screen and (max-width: 767px) {
  .container {
    width: 450px;
  }
}
@media only screen and (max-width: 479px) {
  .container {
    width: 100%;
  }
}
.capitalize {
  text-transform: capitalize;
}
.uppercase {
  text-transform: uppercase;
}
.no-gutters > .col, .no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
  margin: 0;
}
/*-- 
    - Background color
-----------------------------------------*/
.bg-white {
  background-color: #ffffff;
}
.bg-light-grey {
  background-color: #f6fafb;
}
.bg-dark {
  background-color: #555;
}
.bg-grey {
  background-color: #f7f7f7;
}
.bluewood-bg {
  background: #354b65;
}
/*- Overlay Color BG -*/
.bluewood-bg-overlay {
  position: relative;
}
.bluewood-bg-overlay::before {
  background: rgba(70, 90, 112, 0.9);
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.overly-bg-black {
  position: relative;
}
.overly-bg-black::before {
  /* background: rgba(0, 0, 0, 0.3);*/
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
/*-- 
    - color
-----------------------------------------*/
.c-blue {
  color: #e6012c;
}
/*-- 
    - Input Placeholder
-----------------------------------------*/
input:-moz-placeholder, textarea:-moz-placeholder {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
/*-- 
    Scroll Up 
-----------------------------------------*/
#scrollUp {
  width: 40px;
  height: 40px;
  background-color: #e6012c;
  color: #ffffff;
  right: 20px;
  bottom: 60px;
  text-align: center;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  #scrollUp {
    display: none !important;
  }
}
#scrollUp i {
  display: block;
  line-height: 40px;
  font-size: 24px;
}
#scrollUp:hover i {
  animation-name: fadeInUp;
  animation-duration: 1s;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
}
/*-- 
    - Main Wrapper
-----------------------------------------*/
.main-wrapper.header-transparent {
  padding: 0 !important;
  margin: 0 !important;
}
/*-- 
    - Section Padding
-------------------------------------*/
.section-ptb {
  padding: 110px 0;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .section-ptb {
    padding: 90px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-ptb {
    padding: 80px 0;
  }
}
@media only screen and (max-width: 767px) {
  .section-ptb {
    padding: 70px 0;
  }
}
@media only screen and (max-width: 479px) {
  .section-ptb {
    padding: 60px 0;
  }
}
.section-pt {
  padding-top: 110px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .section-pt {
    padding-top: 90px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-pt {
    padding-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .section-pt {
    padding-top: 70px;
  }
}
@media only screen and (max-width: 479px) {
  .section-pt {
    padding-top: 60px;
  }
}
.section-pt-100 {
  padding-top: 100px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .section-pt-100 {
    padding-top: 70px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-pt-100 {
    padding-top: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .section-pt-100 {
    padding-top: 40px;
  }
}
@media only screen and (max-width: 479px) {
  .section-pt-100 {
    padding-top: 30px;
  }
}
.section-pt-80 {
  padding-top: 80px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .section-pt-80 {
    padding-top: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-pt-80 {
    padding-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .section-pt-80 {
    padding-top: 40px;
  }
}
@media only screen and (max-width: 479px) {
  .section-pt-80 {
    padding-top: 30px;
  }
}
.section-pb-80 {
  padding-bottom: 80px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .section-pb-80 {
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-pb-80 {
    padding-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .section-pb-80 {
    padding-bottom: 40px;
  }
}
@media only screen and (max-width: 479px) {
  .section-pb-80 {
    padding-bottom: 30px;
  }
}
.section-pb {
  padding-bottom: 110px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .section-pb {
    padding-bottom: 90px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-pb {
    padding-bottom: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .section-pb {
    padding-bottom: 70px;
  }
}
@media only screen and (max-width: 479px) {
  .section-pb {
    padding-bottom: 60px;
  }
}
.section-pb-100 {
  padding-bottom: 100px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .section-pb-100 {
    padding-bottom: 70px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-pb-100 {
    padding-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .section-pb-100 {
    padding-bottom: 40px;
  }
}
@media only screen and (max-width: 479px) {
  .section-pb-100 {
    padding-bottom: 30px;
  }
}
/*-- Margin top --*/
.mt--5 {
  margin-top: 5px;
}
.mt--10 {
  margin-top: 10px;
}
.mt--15 {
  margin-top: 15px;
}
.mt--20 {
  margin-top: 20px;
}
.mt--25 {
  margin-top: 25px;
}
.mt--30 {
  margin-top: 30px;
}
.mt--35 {
  margin-top: 35px;
}
.mt--40 {
  margin-top: 40px;
}
.mt--45 {
  margin-top: 45px;
}
.mt--50 {
  margin-top: 50px;
}
.mt--55 {
  margin-top: 55px;
}
.mt--60 {
  margin-top: 60px;
}
.mt--65 {
  margin-top: 65px;
}
.mt--70 {
  margin-top: 70px;
}
.mt--75 {
  margin-top: 75px;
}
.mt--80 {
  margin-top: 80px;
}
.mt--85 {
  margin-top: 85px;
}
.mt--90 {
  margin-top: 90px;
}
.mt--95 {
  margin-top: 95px;
}
.mt--100 {
  margin-top: 100px;
}
.mt--105 {
  margin-top: 105px;
}
.mt--110 {
  margin-top: 110px;
}
.mt--115 {
  margin-top: 115px;
}
.mt--120 {
  margin-top: 120px;
}
.mt--125 {
  margin-top: 125px;
}
/*-- Margin Bottom --*/
.mb--5 {
  margin-bottom: 5px;
}
.mb--10 {
  margin-bottom: 10px;
}
.mb--15 {
  margin-bottom: 15px;
}
.mb--20 {
  margin-bottom: 20px;
}
.mb--25 {
  margin-bottom: 25px;
}
.mb--30 {
  margin-bottom: 30px;
}
.mb--35 {
  margin-bottom: 35px;
}
.mb--40 {
  margin-bottom: 40px;
}
.mb--45 {
  margin-bottom: 45px;
}
.mb--50 {
  margin-bottom: 50px;
}
.mb--55 {
  margin-bottom: 55px;
}
.mb--60 {
  margin-bottom: 60px;
}
.mb--65 {
  margin-bottom: 65px;
}
.mb--70 {
  margin-bottom: 70px;
}
.mb--75 {
  margin-bottom: 75px;
}
.mb--80 {
  margin-bottom: 80px;
}
.mb--85 {
  margin-bottom: 85px;
}
.mb--90 {
  margin-bottom: 90px;
}
.mb--95 {
  margin-bottom: 95px;
}
.mb--100 {
  margin-bottom: 100px;
}
.mb--105 {
  margin-bottom: 105px;
}
.mb--110 {
  margin-bottom: 110px;
}
.mb--115 {
  margin-bottom: 115px;
}
.mb--120 {
  margin-bottom: 120px;
}
.mb--125 {
  margin-bottom: 125px;
}
/*-- padding top --*/
.pt--5 {
  padding-top: 5px;
}
.pt--10 {
  padding-top: 10px;
}
.pt--15 {
  padding-top: 15px;
}
.pt--20 {
  padding-top: 20px;
}
.pt--25 {
  padding-top: 25px;
}
.pt--30 {
  padding-top: 30px;
}
.pt--35 {
  padding-top: 35px;
}
.pt--40 {
  padding-top: 40px;
}
.pt--45 {
  padding-top: 45px;
}
.pt--50 {
  padding-top: 50px;
}
.pt--55 {
  padding-top: 55px;
}
.pt--60 {
  padding-top: 60px;
}
.pt--65 {
  padding-top: 65px;
}
.pt--70 {
  padding-top: 70px;
}
.pt--75 {
  padding-top: 75px;
}
.pt--80 {
  padding-top: 80px;
}
.pt--85 {
  padding-top: 85px;
}
.pt--90 {
  padding-top: 90px;
}
.pt--95 {
  padding-top: 95px;
}
.pt--100 {
  padding-top: 100px;
}
.pt--105 {
  padding-top: 105px;
}
.pt--110 {
  padding-top: 110px;
}
.pt--115 {
  padding-top: 115px;
}
.pt--120 {
  padding-top: 120px;
}
.pt--125 {
  padding-top: 125px;
}
/*-- padding Bottom --*/
.pb--5 {
  padding-bottom: 5px;
}
.pb--10 {
  padding-bottom: 10px;
}
.pb--15 {
  padding-bottom: 15px;
}
.pb--20 {
  padding-bottom: 20px;
}
.pb--25 {
  padding-bottom: 25px;
}
.pb--30 {
  padding-bottom: 30px;
}
.pb--35 {
  padding-bottom: 35px;
}
.pb--40 {
  padding-bottom: 40px;
}
.pb--45 {
  padding-bottom: 45px;
}
.pb--50 {
  padding-bottom: 50px;
}
.pb--55 {
  padding-bottom: 55px;
}
.pb--60 {
  padding-bottom: 60px;
}
.pb--65 {
  padding-bottom: 65px;
}
.pb--70 {
  padding-bottom: 70px;
}
.pb--75 {
  padding-bottom: 75px;
}
.pb--80 {
  padding-bottom: 80px;
}
.pb--85 {
  padding-bottom: 85px;
}
.pb--90 {
  padding-bottom: 90px;
}
.pb--95 {
  padding-bottom: 95px;
}
.pb--100 {
  padding-bottom: 100px;
}
.pb--105 {
  padding-bottom: 105px;
}
.pb--110 {
  padding-bottom: 110px;
}
.pb--115 {
  padding-bottom: 115px;
}
.pb--120 {
  padding-bottom: 120px;
}
.pb--125 {
  padding-bottom: 125px;
}
.boxed-layout {
  background: #ffffff none repeat scroll 0 0;
  box-shadow: -3px 0 50px -2px rgba(0, 0, 0, 0.14);
  margin: auto;
  max-width: 1400px;
  position: relative;
  width: 100%;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .boxed-layout {
    max-width: 980px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .boxed-layout {
    max-width: 730px;
  }
}
@media only screen and (max-width: 767px) {
  .boxed-layout {
    max-width: 560px;
  }
}
/*--
    02. Element
-------------------------*/
/*--
    - Button Style
------------------------------------------*/
.default-btn {
  border: 1px solid #e6012c;
  padding: 12px 30px;
  color: #ffffff;
  background: #e6012c;
  font-size: 16px;
  font-weight: 600;
}
.default-btn:hover {
  border: 1px solid #333;
  background: #333;
  color: #ffffff;
}
.primary-btn {
  border: 1px solid #ffffff;
  padding: 10px 40px;
  color: #ffffff;
  background: transparent;
  font-size: 16px;
  font-weight: 600;
}
.primary-btn:hover {
  border: 1px solid #e6012c;
  background: #e6012c;
  color: #ffffff;
}
.border-radius {
  border-radius: 25px;
}
.btn {
  background: #e6012c;
  color: #ffffff;
  border-radius: 0;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 14px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  position: relative;
}
.btn:focus {
  outline: none;
  box-shadow: none;
}
@media only screen and (max-width: 479px) {
  .btn {
    padding: 1px 20px;
    font-size: 12px;
  }
}
.btn span {
  display: inline-block;
  line-height: inherit;
  transition: none;
}
.btn i {
  display: inline-block;
  line-height: inherit;
  transition: none;
}
.btn.left i {
  margin-right: 10px;
}
.btn.right i {
  margin-left: 10px;
}
.btn:hover, .btn:active {
  background: #000000;
  color: #ffffff;
}
/*--
    - Section Title Css
-------------------------------*/
.section-title {
  margin-bottom: 30px;
  text-align: center;
}
.section-title h4 {
  font-size: 16px;
  font-weight: 500;
  color: #e6012c;
  margin-bottom: 10px;
  margin-top: -5px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.section-title h2 {
  font-size: 48px;
  text-transform: capitalize;
  font-weight: 600;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title h2 {
    font-size: 38px;
  }
}
@media only screen and (max-width: 767px) {
  .section-title h2 {
    font-size: 34px;
  }
}
@media only screen and (max-width: 767px) {
  .section-title {
    margin-bottom: 10px;
  }
}
.section-title-two {
  margin-bottom: 30px;
}
.section-title-two h2 {
  font-size: 36px;
  text-transform: uppercase;
  font-weight: 600;
  position: relative;
  padding-bottom: 16px;
  margin-bottom: 20px;
  margin-top: -5px;
}
@media only screen and (max-width: 767px) {
  .section-title-two h2 {
    font-size: 28px;
  }
}
.section-title-two h2::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 35px;
  height: 1px;
  background: #354b65;
}
.section-title-two h2 span {
  color: #e6012c;
}
@media only screen and (max-width: 767px) {
  .section-title-two {
    margin-bottom: 20px;
  }
}
/*--
    - Breadcrumb Style
------------------------------------------*/
/*---- Breadcrumb One ----*/
.breadcrumb-area {
  position: relative;
  overflow: hidden;
  background:
    url("../images/breadcrumb-tech-bg.jpeg") center center/cover no-repeat;
  padding: 120px 0;
}
.breadcrumb-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(0, 51, 160, .50), rgba(0, 51, 160, .50));
}
.breadcrumb-area .container {
  position: relative;
  z-index: 2;
}
.breadcrumb-area h1, .breadcrumb-area .breadcrumb {
  color: #fff;
}
.breadcrumb-area h2 {
  font-size: 30px;
  font-weight: 600;
  margin-top: -5px;
  color: #fff;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-area h2 {
    font-size: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .breadcrumb-area h2 {
    font-size: 24px;
  }
}
.breadcrumb-list .breadcrumb-item {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  color: #fff;
  text-transform: capitalize;
  line-height: 1;
  display: inline-block;
}
.breadcrumb-list .breadcrumb-item.active {
  color: #fff;
}
.breadcrumb-list .breadcrumb-item a:hover {
  color: #e6012c;
}
.breadcrumb-item + .breadcrumb-item::before {
  color: #fff;
  content: "/";
  display: inline-block;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
/*--
    - Paginatoin Css
---------------------------------*/
.paginatoin-area {
  border-bottom: 1px solid #dddddd;
  border-top: 1px solid #dddddd;
  padding: 15px 0;
  margin-top: 30px;
}
@media only screen and (max-width: 479px), only screen and (max-width: 767px) {
  .paginatoin-area p {
    text-align: center;
    margin-bottom: 8px;
  }
}
.pagination-box {
  display: flex;
  justify-content: flex-end;
}
@media only screen and (max-width: 479px), only screen and (max-width: 767px) {
  .pagination-box {
    justify-content: center;
  }
}
.pagination-box li {
  display: inline-block;
}
.pagination-box li.active a {
  color: #e6012c;
}
.pagination-box li a {
  color: #333333;
  display: block;
  padding: 0 8px;
}
.pagination-box li a:hover {
  color: #e6012c;
}
.pagination-box li a i {
  font-size: 22px;
  line-height: 30px;
}
/*-- 
    03. Mobile Menu Css
-------------------------*/
.mobile-menu {
  float: left;
  width: 100% !important;
  position: relative !important;
}
.mobile-menu .mean-bar {
  position: relative;
  /*---- Mean Nav ----*/
}
.mobile-menu .mean-bar .meanmenu-reveal {
  position: absolute;
  top: -53px;
  color: #000;
  right: auto !important;
  left: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .mobile-menu .mean-bar .meanmenu-reveal {
    top: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .mobile-menu .mean-bar .meanmenu-reveal {
    top: -45px;
  }
}
@media only screen and (max-width: 479px) {
  .mobile-menu .mean-bar .meanmenu-reveal {
    top: -45px;
  }
}
.mobile-menu .mean-bar .meanmenu-reveal span {
  position: relative;
  /*---- Menu Open ----*/
  /*---- Menu Close ----*/
}
.mobile-menu .mean-bar .meanmenu-reveal span.menu-bar {
  height: 2px;
  width: 26px;
  background-color: #000000;
  display: block;
  margin: 8px 0;
}
.mobile-menu .mean-bar .meanmenu-reveal span.menu-bar::before, .mobile-menu .mean-bar .meanmenu-reveal span.menu-bar::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
}
.mobile-menu .mean-bar .meanmenu-reveal span.menu-bar::before {
  top: -8px;
}
.mobile-menu .mean-bar .meanmenu-reveal span.menu-bar::after {
  bottom: -8px;
}
.mobile-menu .mean-bar .meanmenu-reveal span.menu-close {
  height: 2px;
  width: 26px;
  background-color: transparent;
  display: block;
  margin: 8px 0;
}
.mobile-menu .mean-bar .meanmenu-reveal span.menu-close::before, .mobile-menu .mean-bar .meanmenu-reveal span.menu-close::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
}
.mobile-menu .mean-bar .meanmenu-reveal span.menu-close::before {
  top: 0;
  transform: rotate(45deg);
}
.mobile-menu .mean-bar .meanmenu-reveal span.menu-close::after {
  bottom: 0;
  transform: rotate(-45deg);
}
.mobile-menu .mean-bar .mean-nav {
  background-color: #fff;
}
.mobile-menu .mean-bar .mean-nav > ul {
  margin-bottom: 30px;
  /*border: 1px solid #eeeeee;*/
  border-top: 0px solid transparent;
  overflow-x: hidden;
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .mobile-menu .mean-bar .mean-nav > ul {
    max-height: 280px;
    overflow-y: auto;
  }
}
@media only screen and (max-width: 479px) {
  .mobile-menu .mean-bar .mean-nav > ul {
    max-height: 220px;
    overflow-y: auto;
  }
}
.mobile-menu .mean-bar .mean-nav > ul li {
  position: relative;
  display: block;
  float: left;
  width: 100%;
  /*---- Sub Menu & Mega Menu ----*/
}
.mobile-menu .mean-bar .mean-nav > ul li a {
  font-size: 13px;
  display: block;
  color: #000;
  font-weight: 600;
  font-family: "Inter", sans-serif;
  text-transform: uppercase;
  line-height: 44px;
  position: relative;
  border-top: 1px solid #eeeeee;
  padding: 0 40px 0 20px;
  /*---- Menu Expand For Sub Menu ----*/
}
.mobile-menu .mean-bar .mean-nav > ul li a i {
  display: none;
}
.mobile-menu .mean-bar .mean-nav > ul li a:hover {
  color: #e6012c;
  padding-left: 25px;
}
.mobile-menu .mean-bar .mean-nav > ul li a.mean-expand {
  border: 1px solid #eeeeee;
  font-family: "Inter", sans-serif;
  position: absolute;
  right: -1px;
  top: 0;
  font-size: 20px !important;
  color: #000;
  line-height: 44px;
  height: 46px;
  width: 40px;
  text-align: center;
  padding: 0;
}
.mobile-menu .mean-bar .mean-nav > ul li a.mean-expand.mean-clicked {
  line-height: 40px;
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu, .mobile-menu .mean-bar .mean-nav > ul li ul {
  position: static;
  background-color: #fff;
  margin: 0;
  padding: 0 !important;
  width: 100%;
  box-shadow: none;
  margin: 0;
  display: none;
  float: left;
  width: 100%;
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li, .mobile-menu .mean-bar .mean-nav > ul li ul li {
  padding: 0;
  margin: 0;
  flex: 0 0 100%;
  border-right: 0px solid transparent;
  width: 100%;
  display: block !important;
  float: left;
  width: 100%;
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li a, .mobile-menu .mean-bar .mean-nav > ul li ul li a {
  font-size: 12px;
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li a::before, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li a::before, .mobile-menu .mean-bar .mean-nav > ul li ul li a::before {
  display: none;
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li ul li ul {
  background-color: rgba(0, 0, 0, 0.04);
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul li a, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul li a, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li ul li ul li a {
  border-top: 1px solid #dddddd;
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li ul li ul li a.mean-expand {
  border: 1px solid #dddddd;
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu ul, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul ul, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu ul, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul ul, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu ul, .mobile-menu .mean-bar .mean-nav > ul li ul li ul .sub-menu, .mobile-menu .mean-bar .mean-nav > ul li ul li ul ul {
  background-color: rgba(0, 0, 0, 0.05);
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu ul li a, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul ul li a, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu ul li a, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul ul li a, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu ul li a, .mobile-menu .mean-bar .mean-nav > ul li ul li ul .sub-menu li a, .mobile-menu .mean-bar .mean-nav > ul li ul li ul ul li a {
  border-top: 1px solid #eeeeee;
}
.mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li .sub-menu ul li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .sub-menu li ul ul li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li .sub-menu ul li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li .mega-menu li ul ul li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li ul li .sub-menu ul li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li ul li ul .sub-menu li a.mean-expand, .mobile-menu .mean-bar .mean-nav > ul li ul li ul ul li a.mean-expand {
  border: 1px solid #eeeeee;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .bluewood-bg .mobile-menu .meanmenu-reveal {
    top: -38px;
  }
}
@media only screen and (max-width: 767px) {
  .bluewood-bg .mobile-menu .meanmenu-reveal {
    top: -38px;
  }
}
@media only screen and (max-width: 479px) {
  .bluewood-bg .mobile-menu .meanmenu-reveal {
    top: -38px;
  }
}
.bluewood-bg .mobile-menu .meanmenu-reveal span {
  position: relative;
  /*---- Menu Open ----*/
  /*---- Menu Close ----*/
}
.bluewood-bg .mobile-menu .meanmenu-reveal span.menu-bar {
  background-color: #fff;
}
.bluewood-bg .mobile-menu .meanmenu-reveal span.menu-bar::before, .bluewood-bg .mobile-menu .meanmenu-reveal span.menu-bar::after {
  background-color: #fff;
}
.bluewood-bg .mobile-menu .meanmenu-reveal span.menu-close::before, .bluewood-bg .mobile-menu .meanmenu-reveal span.menu-close::after {
  background-color: #fff;
}
/*--
    04. Header Css
--------------------------------------*/
@media only screen and (max-width: 767px) {
  .logo {
    text-align: center;
  }
}
.contact-information-top {
  display: flex;
  justify-content: flex-end;
}
@media only screen and (max-width: 767px) {
  .contact-information-top {
    justify-content: center;
  }
}
.single-information-top {
  display: flex;
  align-items: center;
  margin-left: 30px;
  margin-top: 25px;
}
.single-information-top:first-child {
  margin-left: 0;
}
@media only screen and (max-width: 767px) {
  .single-information-top {
    justify-content: center;
    margin-left: 20px;
    margin-top: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .single-information-top {
    margin-left: 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-information-top {
    margin-left: 25px;
  }
}
.single-information-top .info-icon i {
  color: #e6012c;
  font-size: 22px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-information-top .info-icon i {
    font-size: 32px;
  }
}
@media only screen and (max-width: 479px) {
  .single-information-top .info-icon i {
    font-size: 26px;
  }
}
.single-information-top .info-content {
  margin-left: 25px;
}
.single-information-top .info-content h4 {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 0;
}
.single-information-top .info-content p {
  font-size: 14px;
  font-weight: 500;
  color: #555;
}
@media only screen and (max-width: 479px) {
  .single-information-top .info-content {
    margin-left: 8px;
  }
  .single-information-top .info-content h4 {
    font-size: 15px;
  }
}
.border-top-1 {
  border-top: 1px solid #ddd;
}
.border-bottom-1 {
  border-bottom: 1px solid #ddd;
}
.bluewood-top-area {
  border-bottom: 2px solid #354b65;
}
.bluewood-information-area .single-information-top .info-icon i {
  color: #354b65;
}
.bluewood-information-area .single-information-top .info-content h4 {
  color: #354b65;
}
.header-menu-wrap {
  display: flex;
  justify-content: space-between;
}
.main-menu ul li {
  display: inline-block;
  margin-right: 30px;
  position: relative;
}
.main-menu ul li:last-child {
  margin-right: 0;
}
.main-menu ul li.active a {
  color: #e6012c;
}
.main-menu ul li a {
  color: #333;
  font-size: 15px;
  font-weight: 400;
  padding: 20px 0;
}
.main-menu ul li a:hover {
  color: #e6012c;
}
.main-menu ul li .sub-menu {
  width: 230px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
  position: absolute;
  background: #fff;
  padding: 15px;
  z-index: 9;
  top: 120%;
  visibility: hidden;
  opacity: 0;
  -ms-filter: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  border-bottom: 2px solid #e6012c;
}
.main-menu ul li .sub-menu li {
  display: block;
  margin-right: 0;
  margin-bottom: 8px;
}
.main-menu ul li .sub-menu li:last-child {
  margin-bottom: 0;
}
.main-menu ul li .sub-menu li > a {
  display: block;
  padding: 0;
  font-weight: 500;
  text-align: left;
  text-transform: capitalize;
  color: #333;
  font-size: 14px;
}
.main-menu ul li .sub-menu li > a:hover {
  color: #e6012c;
}
.main-menu ul li:hover {
  color: #e6012c;
}
.main-menu ul li:hover .sub-menu {
  visibility: visible;
  opacity: 1;
  -ms-filter: 1;
  top: 100%;
}
.make-apoinmant-button {
  padding-top: 10px;
  padding-bottom: 10px;
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .make-apoinmant-button {
    padding: 15px 0;
  }
  .make-apoinmant-button > a {
    padding: 8px 15px;
  }
}
.header-menu-two .main-menu ul li a {
  color: #fff;
  padding: 21px 0;
}
.header-menu-two .main-menu ul li a:hover {
  color: #e6012c;
}
.header-menu-two .make-apoinmant-button {
  padding-top: 0;
}
.header-menu-two .make-apoinmant-button a {
  padding: 21px 30px;
  font-size: 18px;
  text-transform: capitalize;
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .header-menu-two .make-apoinmant-button {
    padding: 0;
  }
  .header-menu-two .make-apoinmant-button > a {
    padding: 14px 15px;
    font-size: 16px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .header-menu-two .make-apoinmant-button > a {
    padding: 20px 15px;
    font-size: 18px;
  }
}
.is-sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background: #fff;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
  animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
}
.is-sticky .border-top-1 {
  border-top: none;
}
.is-sticky .main-menu ul li a {
  padding: 25px 0;
}
.is-sticky.menu-area-top .main-menu ul li a {
  color: #222;
}
.is-sticky.menu-area-top .main-menu ul li a:hover {
  color: #e6012c;
}
.is-sticky.menu-area-top .meanmenu-reveal span {
  /*---- Menu Open ----*/
  /*---- Menu Close ----*/
}
.is-sticky.menu-area-top .meanmenu-reveal span.menu-bar {
  background-color: #333;
}
.is-sticky.menu-area-top .meanmenu-reveal span.menu-bar::before, .is-sticky.menu-area-top .meanmenu-reveal span.menu-bar::after {
  background-color: #333;
}
.is-sticky.menu-area-top .meanmenu-reveal span.menu-close::before, .is-sticky.menu-area-top .meanmenu-reveal span.menu-close::after {
  background-color: #333;
}
.is-sticky .make-apoinmant-button {
  padding-top: 12px;
}
.is-sticky .header-menu-two .main-menu ul > li > a {
  padding: 19px 0;
}
.is-sticky .header-menu-two .main-menu ul > li .sub-menu li > a {
  padding: 0;
}
.is-sticky .header-menu-two .make-apoinmant-button {
  padding-top: 0;
}
.is-sticky .header-menu-two .make-apoinmant-button a {
  padding: 18px 30px;
  font-size: 18px;
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .is-sticky .header-menu-two .make-apoinmant-button {
    padding: 0;
  }
  .is-sticky .header-menu-two .make-apoinmant-button > a {
    padding: 14px 15px;
    font-size: 16px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .is-sticky .header-menu-two .make-apoinmant-button > a {
    padding: 20px 15px;
    font-size: 18px;
  }
}
/*--
    05. Hero Css
--------------------------------*/
.hero-slider-1 .single-slide {
  height: 750px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .hero-slider-1 .single-slide {
    height: 650px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .hero-slider-1 .single-slide {
    height: 600px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-slider-1 .single-slide {
    height: 500px;
  }
}
@media only screen and (max-width: 767px) {
  .hero-slider-1 .single-slide {
    height: 480px;
  }
}
@media only screen and (max-width: 479px) {
  .hero-slider-1 .single-slide {
    height: 420px;
  }
}
.hero-slider-1 .slider-text-info h1 {
  font-size: 60px;
  color: #ffffff;
  line-height: 72px;
  margin-top: -15px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .hero-slider-1 .slider-text-info h1 {
    font-size: 50px;
    line-height: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-slider-1 .slider-text-info h1 {
    font-size: 40px;
    line-height: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .hero-slider-1 .slider-text-info h1 {
    font-size: 30px;
    line-height: 35px;
  }
}
.hero-slider-1 .slider-text-info p {
  margin-top: 15px;
  font-size: 22px;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-slider-1 .slider-text-info p {
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .hero-slider-1 .slider-text-info p {
    font-size: 14px;
  }
}
.hero-slider-1 .slider-text-info .slider-button {
  margin-top: 50px;
}
.hero-slider-1 .slider-text-info .slider-button .default-btn {
  font-weight: 600;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-slider-1 .slider-text-info .slider-button {
    margin-top: 35px;
  }
}
@media only screen and (max-width: 767px) {
  .hero-slider-1 .slider-text-info .slider-button {
    margin-top: 20px;
  }
  .hero-slider-1 .slider-text-info .slider-button .default-btn {
    padding: 8px 18px;
  }
}
.hero-slider-2 .single-slide {
  height: 800px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .hero-slider-2 .single-slide {
    height: 650px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .hero-slider-2 .single-slide {
    height: 600px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-slider-2 .single-slide {
    height: 500px;
  }
}
@media only screen and (max-width: 767px) {
  .hero-slider-2 .single-slide {
    height: 480px;
  }
}
@media only screen and (max-width: 479px) {
  .hero-slider-2 .single-slide {
    height: 420px;
  }
}
.hero-slider-2 .slider-text-info h1 {
  font-size: 72px;
  color: #ffffff;
  line-height: 80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .hero-slider-2 .slider-text-info h1 {
    font-size: 64px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .hero-slider-2 .slider-text-info h1 {
    font-size: 60px;
    line-height: 70px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-slider-2 .slider-text-info h1 {
    font-size: 50px;
    line-height: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .hero-slider-2 .slider-text-info h1 {
    font-size: 38px;
    line-height: 40px;
  }
}
@media only screen and (max-width: 479px) {
  .hero-slider-2 .slider-text-info h1 {
    font-size: 36px;
    line-height: 40px;
  }
}
.hero-slider-2 .slider-text-info p {
  font-size: 24px;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1200px) {
  .hero-slider-2 .slider-text-info p {
    font-size: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .hero-slider-2 .slider-text-info p {
    font-size: 16px;
  }
}
@media only screen and (max-width: 479px) {
  .hero-slider-2 .slider-text-info p {
    font-size: 14px;
  }
}
.hero-slider-2 .slider-text-info .slider-button {
  margin-top: 40px;
}
.hero-slider-2 .slider-text-info .slider-button .default-btn {
  font-size: 16px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-slider-2 .slider-text-info .slider-button {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .hero-slider-2 .slider-text-info .slider-button {
    margin-top: 30px;
  }
  .hero-slider-2 .slider-text-info .slider-button .default-btn {
    font-size: 16px;
    padding: 8px 18px;
  }
}
/*--
    06. Service Css
------------------------------*/
.single-service img {
  width: 100%;
}
.single-service:hover .service-content {
  box-shadow: 0 4px 18px 0 rgba(85, 85, 85, 0.2);
}
.service-content {
  background: #ffffff;
  padding: 30px 20px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.service-content h3 {
  font-size: 18px;
  font-weight: 600;
}
.service-content p {
  font-size: 14px;
  margin: 10px 0 10px 0;
}
.service-content > a {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #e6012c;
}
.service-content > a:hover {
  color: #333;
}
.service-slider-active .slick-arrow {
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 0;
  right: auto;
  background: #ddd;
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  z-index: 5;
  visibility: hidden;
  opacity: 0;
  transition: 0.3s ease-in-out;
}
.service-slider-active .slick-arrow:hover {
  background: #e6012c;
  color: #ffffff;
}
.service-slider-active .slick-arrow.slick-next {
  right: 0;
  left: auto;
}
.service-slider-active:hover .slick-arrow {
  transform: translateY(-50%);
  visibility: visible;
  opacity: 1;
}
.service-area-tow {
  background: #354b65;
  position: relative;
  padding-left: 20px;
}
.service-area-tow::after {
  background: #354b65;
  position: absolute;
  content: "";
  left: 0;
  top: -19px;
  height: 20px;
  width: 80%;
  z-index: 9;
}
.service-area-tow::before {
  background: #354b65;
  position: absolute;
  content: "";
  left: 0;
  bottom: -19px;
  height: 20px;
  width: 80%;
  z-index: 9;
}
@media only screen and (max-width: 767px) {
  .service-area-tow {
    padding-left: 0px;
  }
  .service-area-tow::after {
    display: none;
  }
  .service-area-tow::before {
    display: none;
  }
}
.service-area-tow .single-service {
  background: #f7f7f7;
  border-top: 1px solid #d0d5da;
  border-right: 1px solid #d0d5da;
  border-bottom: 1px solid #d0d5da;
  padding: 50px 30px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  position: relative;
}
.service-area-tow .single-service:hover {
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
  z-index: 1;
}
.service-area-tow .single-service .service-icon {
  margin-bottom: 15px;
}
.service-area-tow .single-service .service-icon i {
  font-size: 38px;
}
.service-area-tow .single-service .service-content-info h3 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
  font-weight: 600;
}
.service-area-tow .single-service .service-content-info p {
  font-size: 14px;
}
.service-area-tow .col-lg-4:nth-child(4) .single-service, .service-area-tow .col-lg-4:nth-child(5) .single-service, .service-area-tow .col-lg-4:nth-child(6) .single-service {
  border-top: none;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-area-tow .col-lg-4:nth-child(4) .single-service {
    border-top: 1px solid #d0d5da;
  }
}
@media only screen and (max-width: 767px) {
  .service-area-tow .col-lg-4:nth-child(3) .single-service {
    border-top: none;
  }
  .service-area-tow .col-lg-4:nth-child(1) .single-service, .service-area-tow .col-lg-4:nth-child(2) .single-service, .service-area-tow .col-lg-4:nth-child(3) .single-service, .service-area-tow .col-lg-4:nth-child(4) .single-service, .service-area-tow .col-lg-4:nth-child(5) .single-service, .service-area-tow .col-lg-4:nth-child(6) .single-service {
    border-left: 1px solid #d0d5da;
  }
}
.service-area-tow .single-service-title-area {
  height: 250px;
}
.service-area-tow .single-service-title-area .service-title {
  transform: translateY(50%);
  padding: 0 25px 0 50px;
}
@media only screen and (max-width: 479px) {
  .service-area-tow .single-service-title-area .service-title {
    padding: 0 25px 0 0px;
  }
}
@media only screen and (max-width: 767px) {
  .service-area-tow .single-service-title-area .service-title {
    padding-left: 20px;
    transform: translateY(50%);
  }
}
@media only screen and (max-width: 479px) {
  .service-area-tow .single-service-title-area .service-title {
    padding-left: 20px;
    transform: translateY(30%);
  }
}
.service-area-tow .single-service-title-area .service-title h2 {
  font-size: 22px;
  color: #ffffff;
  position: relative;
  padding-bottom: 16px;
  margin-bottom: 20px;
  font-weight: 700;
  letter-spacing: 1px;
}
.service-area-tow .single-service-title-area .service-title h2::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 35px;
  height: 1px;
  background: #fff;
}
.service-area-tow .single-service-title-area .service-title p {
  color: #fff;
}
.service-details-menu li {
  margin-bottom: 10px;
}
.service-details-menu li a {
  background: #f6f6f6;
  font-size: 16px;
  font-weight: 500;
  display: block;
  padding: 20px;
  text-align: center;
}
.service-details-menu li a.active {
  background: #e6012c;
  color: #ffffff;
}
.service-details-menu li:last-child {
  margin-bottom: 0;
}
.service-details-content p {
  margin-top: 30px;
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .service-details-content {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .service-details-content .service-details-image {
    margin-top: 30px;
  }
}
.service-details-content-inner h2 {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 30px;
}
.service-details-content-inner .service-details-list {
  margin-top: 30px;
}
.service-details-content-inner .service-details-list li {
  margin-bottom: 10px;
}
.service-details-content-inner .service-details-list li:last-child {
  margin: 0;
}
.service-details-content-inner .service-details-list li i {
  color: #e6012c;
  margin-right: 10px;
}
/*--
   07. About Area Css
------------------------------*/
.about-imak-content {
  border: 10px solid #f1f1f1;
  margin-right: -120px;
  margin-top: 100px;
  padding: 70px 160px 70px 60px;
  position: relative;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .about-imak-content {
    padding: 40px 160px 40px 40px;
    margin-right: -150px;
    margin-top: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .about-imak-content {
    padding: 20px 20px 20px 20px;
    margin-right: 0;
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-imak-content {
    padding: 40px 40px 40px 40px;
    margin-right: 0;
    margin-top: 0;
    margin-bottom: 30px;
  }
}
.about-image {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .about-image {
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image {
    margin-bottom: 30px;
  }
}
.about-image img {
  position: relative;
  z-index: 1;
  width: 100%;
}
.about-image .about-image-box {
  position: absolute;
  width: 95%;
  height: 95%;
  top: 60px;
  left: -30px;
  background: #eee;
}
@media only screen and (max-width: 767px) {
  .about-image .about-image-box {
    position: absolute;
    top: 0;
    left: 0;
  }
}
.top-border::after {
  height: 10px;
  width: 70px;
  left: 0;
  top: -10px;
  background: #e6012c;
  content: "";
  position: absolute;
}
.top-border::before {
  height: 70px;
  width: 10px;
  left: -10px;
  top: -10px;
  background: #e6012c;
  content: "";
  position: absolute;
}
.bottom-border::after {
  height: 10px;
  width: 70px;
  right: -10px;
  bottom: -10px;
  background: #e6012c;
  content: "";
  position: absolute;
}
.bottom-border::before {
  height: 70px;
  right: -10px;
  bottom: -10px;
  background: #e6012c;
  content: "";
  position: absolute;
  width: 10px;
  z-index: 99;
}
.about-title {
  margin-top: -100px;
  position: absolute;
  background: #F7F7F7;
  right: 100px;
  padding: 8px 60px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .about-title {
    margin-top: -70px;
    right: 120px;
  }
}
@media only screen and (max-width: 767px) {
  .about-title {
    margin-top: 0;
    position: inherit;
    right: 0;
    padding: 8px 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-title {
    margin-top: 0;
    position: inherit;
    right: 0;
    padding: 8px 0px;
  }
}
.about-title h3 {
  color: #354b65;
  font-size: 36px;
  letter-spacing: 1px;
  font-weight: 600;
}
.about-title h3 span {
  color: #e6012c;
}
@media only screen and (max-width: 767px) {
  .about-title h3 {
    font-size: 25px;
    letter-spacing: 1px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-title h3 {
    font-size: 30px;
    letter-spacing: 1px;
  }
}
.about-info > h4 {
  font-size: 22px;
  font-style: italic;
  line-height: 30px;
  margin-bottom: 20px;
  color: #354b65;
}
@media only screen and (max-width: 767px) {
  .about-info > h4 {
    font-size: 18px;
    margin-bottom: 20px;
  }
}
.about-info p {
  font-size: 14px;
  margin-bottom: 15px;
}
.about-info .social-link {
  margin-top: 30px;
}
.about-info .social-link .social-title h4 {
  font-size: 22px;
  color: #354b65;
  margin-bottom: 15px;
  font-weight: 600;
}
.about-info .social-link ul li {
  display: inline-block;
  margin-right: 12px;
}
.about-info .social-link ul li a {
  font-size: 16px;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  border: 1px solid #e6012c;
  color: #e6012c;
  border-radius: 50%;
  display: block;
}
.about-info .social-link ul li a:hover {
  color: #fff;
  background: #e6012c;
}
/*--
    08. Repair Service Css
------------------------------*/
@media only screen and (max-width: 767px) {
  .repair-service-inner {
    margin-top: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .repair-service-inner.service-ph-inner {
    margin-top: 0px;
    margin-bottom: 30px;
  }
}
.repair-service-inner h3 {
  font-size: 22px;
  font-weight: 500;
  color: #e6012c;
  margin-top: -5px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px) {
  .repair-service-inner h3 {
    font-size: 18px;
  }
}
.repair-service-inner h2 {
  font-size: 48px;
  font-weight: 600;
  margin-top: 15px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px) {
  .repair-service-inner h2 {
    font-size: 30px;
    margin-top: 5px;
  }
}
.repair-service-inner p {
  font-size: 16px;
  margin-top: 25px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px) {
  .repair-service-inner p {
    margin-top: 15px;
    font-size: 14px;
  }
}
.repair-service-inner .make-apoinment-button {
  margin-top: 45px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .repair-service-inner .make-apoinment-button {
    margin-top: 15px;
  }
  .repair-service-inner .make-apoinment-button .default-btn {
    padding: 8px 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .repair-service-inner .make-apoinment-button {
    margin-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px) {
  .repair-service-inner .make-apoinment-button {
    margin-top: 25px;
  }
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .repair-image.pt--30 {
    padding-top: 60px;
  }
}
/*--
    09. Project Count Css
----------------------------------*/
.counter-bg {
  background: url(../images/bg/fun-bg.png);
  background-size: cover;
}
.counter {
  margin-top: 30px;
}
.counter h3 {
  font-size: 48px;
  font-weight: 700;
}
.counter p {
  color: #e6012c;
  margin-top: 25px;
  text-transform: capitalize;
  letter-spacing: 1px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter h3 {
    font-size: 34px;
    margin-top: -5px;
  }
  .counter p {
    font-size: 18px;
    margin-top: 15px;
    line-height: 16px;
  }
}
@media only screen and (max-width: 767px) {
  .counter h3 {
    font-size: 34px;
    margin-bottom: 0;
    margin-top: -5px;
  }
  .counter p {
    font-size: 16px;
    margin-top: 10px;
    line-height: 16px;
  }
}
.cont-two .counter p {
  margin-bottom: 15px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cont-two .counter p {
    font-size: 18px;
    margin-top: 0px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .cont-two .counter {
    margin-top: 25px;
  }
  .cont-two .counter p {
    font-size: 16px;
    margin-top: 0px;
    margin-bottom: 15px;
  }
}
.counter-title {
  margin-top: 30px;
}
.counter-title h4 {
  font-size: 22px;
  color: #ffffff;
  font-weight: 600;
}
@media only screen and (max-width: 767px) {
  .counter-title h4 {
    margin-bottom: 0px;
    margin-top: -5px;
  }
}
.counter-title h2 {
  font-size: 48px;
  line-height: 50px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0;
}
@media only screen and (max-width: 479px) {
  .counter-title {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-title {
    text-align: center;
  }
  .counter-title h4 {
    font-size: 18px;
  }
  .counter-title h2 {
    font-size: 34px;
    line-height: 34px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .counter-title h4 {
    font-size: 24px;
  }
  .counter-title h2 {
    font-size: 48px;
    line-height: 48px;
  }
}
.project-count-area .counter h3 {
  color: #ffffff;
}
.project-count-area .counter p {
  color: #ffffff;
  text-transform: uppercase;
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .project-count-area.pb--90 {
    padding-bottom: 60px;
  }
}
/*--
    10. FAQ Css
--------------------------------*/
.single-faq {
  margin-top: 30px;
  padding: 45px 25px;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.single-faq .title-content h4 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 20px;
  letter-spacing: 1px;
}
.single-faq .title-content i {
  color: #ffffff;
  background: #e6012c;
  font-size: 22px;
  height: 30px;
  width: 30px;
  line-height: 30px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
}
.single-faq p {
  font-size: 14px;
  margin-top: 20px;
}
.single-faq:hover {
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.2);
}
/*--
    11. Something New Css
------------------------------*/
.something-new-bg {
  background: url(../images/bg/02.jpg);
  background-size: cover;
}
.something-new-bg.overly-bg-black::before {
  background: rgba(0, 0, 0, 0.5);
}
.something-new-inner h2 {
  font-size: 48px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 25px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .something-new-inner h2 {
    font-size: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .something-new-inner h2 {
    font-size: 30px;
  }
}
.something-new-inner p {
  width: 45%;
  margin: 0 auto;
}
@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .something-new-inner p {
    width: 80%;
  }
}
.contact-us-button {
  margin-top: 40px;
  margin-top: 30px;
}
.contact-us-button a {
  margin: 0 10px;
}
@media only screen and (max-width: 479px) {
  .contact-us-button a {
    margin: 15px 0 0 0;
  }
}
/*--
    12 .Latest Blog Css
-----------------------------------*/
.single-letest-blog {
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.single-letest-blog .blog-image a {
  display: block;
}
.single-letest-blog .blog-image a img {
  width: 100%;
}
.single-letest-blog .blog-content {
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
  padding: 30px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.single-letest-blog .blog-content .post-mata {
  margin-bottom: 5px;
}
.single-letest-blog .blog-content .post-mata ul li {
  display: inline-block;
  font-size: 14px;
}
.single-letest-blog .blog-content h3 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
}
.single-letest-blog .blog-content p {
  font-size: 14px;
}
.single-letest-blog:hover .blog-content {
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.2);
}
.latest-blog-active .slick-arrow {
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 0;
  right: auto;
  background: #ddd;
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  z-index: 5;
  visibility: hidden;
  opacity: 0;
  transition: 0.3s ease-in-out;
}
.latest-blog-active .slick-arrow:hover {
  background: #e6012c;
  color: #ffffff;
}
.latest-blog-active .slick-arrow.slick-next {
  right: 0;
  left: auto;
}
.latest-blog-active:hover .slick-arrow {
  transform: translateY(-50%);
  visibility: visible;
  opacity: 1;
}
/*--
    - Blog Details Css
----------------------------*/
.single-blog-area {
  margin-bottom: 30px;
}
.blog-contend {
  margin-top: 20px;
}
.blog-contend h3 {
  font-weight: 600;
}
.blog-contend .blog-btn {
  display: inline-block;
  padding: 5px 15px;
}
.blog-date-categori {
  margin-bottom: 10px;
}
.blog-date-categori ul li {
  display: inline-block;
}
.blog-date-categori ul li a {
  font-size: 14px;
  margin-right: 10px;
  font-weight: 500;
}
.blog-date-categori ul li a i {
  font-size: 14px;
  margin-right: 5px;
}
.search-post {
  position: relative;
  margin-top: 20px;
}
.search-post input {
  border: 1px solid #dddddd;
  font-size: 14px;
  height: 40px;
  padding: 10px 50px 10px 10px;
  position: relative;
  width: 100%;
}
.search-post .btn-search {
  border: medium none;
  font-size: 16px;
  padding: 7px 15px;
  position: absolute;
  right: 0;
  top: 0;
  background: #ddd;
}
.search-post .btn-search:hover {
  background: #e6012c;
  color: #ffffff;
}
.social-icons {
  float: right;
  margin-top: 5px;
}
.social-icons li {
  display: inline-block;
  margin-left: 10px;
}
.blog-image-slider .slick-arrow {
  background: #dddddd none repeat scroll 0 0;
  border: 1px solid #dddddd;
  font-size: 16px;
  height: 40px;
  position: absolute;
  top: 50%;
  width: 40px;
  z-index: 9;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.blog-image-slider .slick-arrow:hover {
  background: #e6012c;
  color: #ffffff;
  border-color: #e6012c;
}
.blog-image-slider .slick-next {
  right: 0;
}
.post-info {
  margin-top: 30px;
}
.post-info .blockquote-inner {
  border-left: 5px solid #e6012c;
  background: #fafafa;
  font-size: 16px;
  font-style: italic;
  margin: 30px 0;
  padding: 20px 10px;
}
.post-info .post-commet {
  border-bottom: 1px solid #e7e4dd;
  border-top: 1px solid #e7e4dd;
  font-size: 14px;
  margin: 60px 0 30px;
  padding: 15px 0;
  text-align: left;
  text-transform: uppercase;
}
.post-info .post-commet .social-icons {
  margin-top: 1px;
  font-size: 16px;
}
.comment-form-comment .comment-notes {
  width: 100%;
  padding: 10px;
  border: 1px solid #ddd;
  height: 140px;
  font-size: 14px;
  color: #666;
}
.comment-form-comment label {
  display: block;
}
.comment-form-comment label span {
  color: #e6012c;
}
.comment-form-author, .comment-form-email, .comment-form-url {
  float: left;
  padding: 0 10px;
  width: 33.3333%;
}
@media only screen and (max-width: 479px) {
  .comment-form-author, .comment-form-email, .comment-form-url {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .comment-form-author, .comment-form-email, .comment-form-url {
    width: 100%;
  }
}
.comment-input {
  margin: 0 -10px;
  overflow: hidden;
}
.comment-input label {
  display: block;
}
.comment-input input {
  width: 100%;
  padding: 10px;
  border: 1px solid #ddd;
  height: 40px;
  font-size: 14px;
  color: #666;
}
.comment-form-submit .comment-submit {
  background: #e6012c;
  color: #ffffff;
  border: none;
  padding: 8px 15px;
  margin-top: 20px;
}
.comment-form-submit .comment-submit:hover {
  background: #000000;
}
.blog-wrap-col-3 .blog-contend h3 {
  font-size: 18px;
}
.blog-wrap-col-3 .blog-contend .blog-date-categori {
  margin-bottom: 10px;
}
.blog-wrap-col-3 .blog-contend .blog-date-categori ul li {
  display: inline-block;
}
.blog-wrap-col-3 .blog-contend .blog-date-categori ul li a {
  font-size: 14px;
  margin-right: 10px;
  font-weight: 400;
}
.blog-wrap-col-3 .blog-contend .blog-date-categori ul li a i {
  font-size: 14px;
  margin-right: 5px;
}
.blog-wrap-col-3 .blog-btn {
  display: inline-block;
  padding: 5px 15px;
}
.pro_review {
  display: flex;
}
.pro_review.ans {
  margin-bottom: 50px;
  margin-left: 50px;
  margin-top: 50px;
}
@media only screen and (max-width: 479px) {
  .pro_review.ans {
    margin-bottom: 30px;
    margin-left: 20px;
    margin-top: 30px;
  }
}
.review_thumb {
  margin-right: 20px;
  min-width: 8%;
}
@media only screen and (max-width: 767px) {
  .review_thumb {
    min-width: 25%;
  }
}
.review_info h4 {
  font-weight: 500;
}
.rating_send a {
  font-size: 14px;
  border: 1px solid #dddddd;
  display: block;
  float: right;
  font-size: 20px;
  margin-top: -30px;
  padding: 2px 13px;
}
.review_date {
  margin-top: 5px;
}
.review_details p {
  margin-top: 5px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-sidebar-wrap {
    padding-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .blog-sidebar-wrap {
    padding-top: 70px;
  }
}
@media only screen and (max-width: 479px) {
  .blog-sidebar-wrap {
    padding-top: 60px;
  }
}
.blog-sidebar .title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.blog-sidebar ul li {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
  display: block;
}
.blog-sidebar ul li:last-child {
  margin-bottom: 0px;
  padding-bottom: 0px;
  border-bottom: none;
}
.blog-sidebar ul li a {
  font-size: 14px;
  display: block;
}
.blog-sidebar ul li a span {
  float: right;
}
.sidbar-blog-inner {
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 20px;
}
.sidbar-blog-inner .sidbar-blog-image {
  padding-right: 15px;
}
.sidbar-blog-inner .sidbar-blog-image img {
  width: 150px;
}
.sidbar-blog-inner .sidbar-blog-content {
  position: relative;
  width: 100%;
}
.sidbar-blog-inner .sidbar-blog-content h3 {
  font-size: 16px;
  font-weight: 500;
  line-height: 23px;
}
.sidebar-tag > a {
  border: 1px solid #000000;
  color: #000000;
  font-size: 14px;
  font-weight: 500;
  margin: 10px 10px 0 0;
  padding: 4px 15px;
}
.sidebar-tag > a:hover {
  background: #e6012c;
  color: #ffffff;
  border: 1px solid #e6012c;
}
/*-- 
    13. Your Opinion Css
-----------------------------*/
.opinion-bg {
  background: url(../images/bg/01.jpg);
  background-size: cover;
}
.your-opinion-wrap {
  text-align: center;
}
.your-opinion-wrap h2 {
  font-size: 48px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 60px;
}
@media only screen and (max-width: 767px) {
  .your-opinion-wrap h2 {
    margin-bottom: 30px;
    font-size: 30px;
  }
}
.opinion-content-inner .form-control {
  width: 100%;
  font-size: 16px;
  margin-bottom: 30px;
}
.opinion-content-inner .form-control:focus {
  outline: none;
  box-shadow: none;
  border-color: #e6012c;
}
.opinion-content-inner input, .opinion-content-inner textarea {
  padding: 20px 30px;
  height: 60px;
}
.opinion-content-inner textarea {
  height: 120px;
}
.opinion-content-inner select.selector-time-date {
  height: 60px !important;
  -webkit-user-select: none;
  -moz-appearance: none;
  position: relative;
}
.opinion-content-inner select.selector-time-date::before {
  position: absolute;
  right: 0;
  top: 0;
  content: "\\";
  width: 20px;
  height: 20px;
  color: #000;
}
.opinion-content-inner .submit-box {
  margin-top: 10px;
}
/*--
    14. Gallery Css
----------------------------*/
.gallery-menu button {
  background: none;
  border: none;
  font-size: 16px;
  margin-right: 40px;
  font-weight: 600;
  color: #354b65;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .gallery-menu button {
    margin-right: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .gallery-menu button {
    margin-right: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .gallery-menu button {
    margin-right: 10px;
    margin-top: 5px;
    font-size: 18px;
  }
}
.gallery-menu button:last-child {
  margin-right: 0;
}
.gallery-menu button.is-checked {
  color: #e6012c;
}
.masonry-wrap .gallery {
  margin-top: 30px;
}
.masonry-wrap .gallery img {
  width: 100%;
}
.hover-1 {
  position: relative;
}
.hover-1 > a {
  display: block;
}
.hover-1 > a::after {
  bottom: 0;
  color: #fff;
  content: "\ef71";
  font-family: icofont;
  font-size: 36px;
  height: 50px;
  left: 0;
  line-height: 50px;
  margin: auto;
  opacity: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
  width: 50px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.hover-1 > a::before {
  background: rgba(53, 75, 101, 0.8);
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: scale(1);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.hover-1:hover a::after {
  opacity: 1;
}
.hover-1:hover a::before {
  opacity: 1;
  transform: scale(0.9);
}
/*--
    15. Pricing Table Css
---------------------------------*/
.single-pricing-table {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  background: #ffffff;
  padding: 65px 20px 50px;
  border-radius: 5px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.single-pricing-table:hover {
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}
.single-pricing-table h3 {
  font-size: 48px;
  color: #354b65;
  font-weight: 600;
  margin-bottom: 30px;
}
.single-pricing-table h3 span {
  font-size: 30px;
  position: absolute;
  margin-top: -15px;
  margin-left: 5px;
}
.single-pricing-table h4 {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 1px;
}
.single-pricing-table .pricing-content {
  margin-top: 20px;
}
.single-pricing-table .pricing-content ul li {
  margin-bottom: 5px;
  font-size: 14px;
}
.single-pricing-table .pricing-content ul li:last-child {
  margin: 0;
}
.single-pricing-table .pricing-button {
  margin-top: 25px;
}
.single-pricing-table .pricing-button a {
  font-size: 14px;
  text-transform: uppercase;
  padding: 8px 40px;
  background: #e6012c;
  border-radius: 5px;
  color: #ffffff;
}
.single-pricing-table .pricing-button a:hover {
  background: #354b65;
  color: #ffffff;
}
/*--
   16. Team Area Css
------------------------------*/
.single-team-member {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.single-team-member:hover .hover-2::before {
  opacity: 1;
  transform: scale(0.9);
}
.single-team-member:hover .team-member-image .team-social-link {
  opacity: 1;
}
.team-member-image {
  position: relative;
}
.team-member-image img {
  width: 100%;
}
.team-member-image .team-social-link {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  opacity: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.team-member-image .team-social-link ul li {
  display: inline-block;
}
.team-member-image .team-social-link ul li a {
  display: block;
  height: 30px;
  width: 30px;
  line-height: 30px;
  text-align: center;
  border: 1px solid #fff;
  color: #fff;
  border-radius: 50%;
  margin: 0 7px;
}
.team-member-image .team-social-link ul li a:hover {
  background: #fff;
  color: #354b65;
}
.hover-2 {
  position: relative;
}
.hover-2::before {
  background: rgba(53, 75, 101, 0.8);
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: scale(1);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.team-member-info {
  padding: 25px 0;
}
.team-member-info h3 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 0px;
  letter-spacing: 1px;
  line-height: 20px;
}
.team-member-info p {
  font-size: 14px;
}
/*--
    17. Contact Page Css
------------------------------*/
#map {
  height: 800px;
}
@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  #map {
    height: 600px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  #map {
    height: 600px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  #map {
    height: 600px;
  }
}
@media only screen and (max-width: 767px) {
  #map {
    height: 600px;
  }
}
.box-contact {
  border: 1px solid #ddd;
  background: #fff;
  max-width: 1410px;
  width: 100%;
  z-index: 9;
  margin: auto;
  position: relative;
}
@media only screen and (max-width: 479px) {
  .box-contact {
    border: none;
  }
}
.contact-us-area {
  /*margin-top: -250px;*/
  padding: 110px 0;
  background: #fff;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .contact-us-area {
    padding: 80px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-us-area {
    padding: 80px 0;
  }
}
@media only screen and (max-width: 767px) {
  .contact-us-area {
    padding: 70px 0;
  }
}
@media only screen and (max-width: 479px) {
  .contact-us-area {
    padding: 60px 0;
  }
}
.contact-form-area h3 {
  font-size: 42px;
  font-weight: 600;
  margin-bottom: 55px;
}
@media only screen and (max-width: 767px) {
  .contact-form-area h3 {
    font-size: 28px;
    margin-bottom: 25px;
  }
}
.contact-form-warp .input-box {
  margin-bottom: 30px;
}
.contact-form-warp .input-box input, .contact-form-warp .input-box textarea {
  width: 100%;
  padding: 15px;
  color: #555;
  border: 1px solid #ddd;
}
.contact-form-warp .input-box textarea {
  height: 120px;
}
.contact-info-wrap .single-contact-info {
  margin-bottom: 60px;
}
.contact-info-wrap .single-contact-info:last-child {
  margin-bottom: 0;
}
.contact-info-wrap .single-contact-info h3 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 15px;
}
@media only screen and (max-width: 767px) {
  .contact-info-wrap .single-contact-info h3 {
    margin-bottom: 10px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .contact-info-wrap .single-contact-info {
    margin-bottom: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-info-wrap {
    margin-top: 60px;
  }
  .contact-info-wrap .single-contact-info {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .contact-info-wrap {
    margin-top: 60px;
  }
  .contact-info-wrap .single-contact-info {
    margin-bottom: 25px;
  }
}
@media only screen and (max-width: 479px) {
  .contact-info-wrap {
    margin-top: 30px;
  }
}
.form-messege.error {
  color: red;
  font-size: 14px;
  margin-top: 5px;
  font-style: italic;
}
.form-messege.success {
  color: green;
  font-size: 14px;
  margin-top: 5px;
  font-style: italic;
}
.footer-info .logo {
  text-align: left;
}
/*--
    18. Footer Css
---------------------------*/
.footer-area {
  background: #1d1e26;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .footer-area.mt--110 {
    margin-top: 90px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-area.mt--110 {
    margin-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-area.mt--110 {
    margin-top: 0px;
  }
}
@media only screen and (max-width: 479px) {
  .footer-area.mt--110 {
    margin-top: 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .footer-top.pb--100 {
    padding-bottom: 80px;
  }
  .footer-top.pt--50 {
    padding-top: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-top.pb--100 {
    padding-bottom: 70px;
  }
  .footer-top.pt--50 {
    padding-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-top.pb--100 {
    padding-bottom: 60px;
  }
  .footer-top.pt--50 {
    padding-top: 10px;
  }
}
@media only screen and (max-width: 479px) {
  .footer-top.pb--100 {
    padding-bottom: 50px;
  }
  .footer-top.pt--50 {
    padding-top: 10px;
  }
}
.footer-info .social {
  margin-top: 20px;
}
.footer-info .social li {
  display: inline-block;
  margin-right: 5px;
}
.footer-info .social li a {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border: 1px solid #fff;
  border-radius: 50%;
  color: #ffffff;
  text-align: center;
}
.footer-info .social li a:hover {
  background: #ffffff;
  color: #1d1e26;
  border: 1px solid #ffffff;
}
@media only screen and (max-width: 767px) {
  .footer-info.mt--60 {
    margin-top: 50px;
  }
}
.footer-info .footer-title {
  margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
  .footer-info .footer-title {
    margin-bottom: 20px;
  }
}
.footer-info .footer-title h3 {
  font-size: 16px;
  color: #ffffff;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 1px;
  margin-top: -5px;
}
.footer-info p {
  color: #ffffff;
  font-size: 14px;
  margin-top: 25px;
}
.footer-info .footer-list li {
  color: #ffffff;
  margin-bottom: 10px;
  font-size: 14px;
}
@media only screen and (max-width: 767px) {
  .footer-info .footer-list li {
    margin-bottom: 10px;
  }
}
.footer-info .footer-list li:last-child {
  margin-bottom: 0;
}
.footer-info .footer-list li a:hover {
  color: #e6012c;
}
.footer-info .footer-list-instagram {
  margin: 0 -5px -5px -5px;
}
.footer-info .footer-list-instagram li {
  float: left;
  width: 29.5%;
  margin: 5px;
}
.footer-info .footer-list-instagram li a {
  display: block;
}
.footer-info .footer-list-instagram li a img {
  width: 100%;
}
.footer-bottom .footer-bottom-inner {
  padding: 30px 0;
  border-top: 1px solid #333333;
}
.footer-bottom .footer-bottom-inner p {
  color: #fff;
  font-size: 14px;
}
.footer-bg {
  background: url(../images/bg/fotter-bg.jpg);
  background-size: cover;
}
.footer-title-two h2 {
  font-size: 48px;
  color: #fff;
  margin-bottom: 60px;
  margin-top: -5px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-title-two h2 {
    font-size: 32px;
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-title-two h2 {
    font-size: 30px;
    margin-bottom: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-content-inner {
    margin-top: 20px;
  }
}
.footer-content-inner h4 {
  color: #e6012c;
  margin-bottom: 30px;
  font-weight: 600;
  letter-spacing: 1px;
  font-size: 22px;
  margin-top: -5px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-content-inner h4 {
    margin-bottom: 15px;
    font-size: 18px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-content-inner h4 {
    margin-bottom: 10px;
    font-size: 18px;
  }
}
.footer-content-inner p {
  font-size: 20px;
  color: #ffffff;
  line-height: 40px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-content-inner p {
    font-size: 16px;
    line-height: 28px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-content-inner p {
    font-size: 16px;
    line-height: 28px;
    margin-bottom: 10px;
  }
}
.footer-content-inner ul li a {
  font-size: 20px;
  color: #ffffff;
  line-height: 40px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-content-inner ul li a {
    font-size: 16px;
    line-height: 28px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-content-inner ul li a {
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 10px;
  }
}
.footer-bottom-two {
  padding: 30px 0;
  font-size: 14px;
}
@media only screen and (max-width: 767px) {
  .footer-bottom-two {
    text-align: center;
  }
}
.footer-bottom-two p {
  color: #ffffff;
}
.footer-bottom-two .footer-bottom-social {
  float: right;
}
@media only screen and (max-width: 767px) {
  .footer-bottom-two .footer-bottom-social {
    float: inherit;
    margin-top: 15px;
    text-align: center;
  }
}
.footer-bottom-two .footer-bottom-social ul li {
  display: inline-block;
  margin-left: 55px;
  color: #ffffff;
}
.footer-bottom-two .footer-bottom-social ul li:first-child {
  margin-left: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-bottom-two .footer-bottom-social ul li {
    margin-left: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-bottom-two .footer-bottom-social ul li {
    margin-left: 10px;
  }
}
.receivable h4 {
  color: #e6012c;
}
.receivable ul {
  padding: 30px 0px 20px 20px;
}
.receivable ul li {
  list-style: square;
  padding-bottom: 10px;
}
.site-logo {
  height: 80px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}
/*# sourceMappingURL=style.css.map */
/* ===========================
   OUR EXPERTISE ANIMATIONS
=========================== */
/* Section */
.our-service-area {
  position: relative;
  overflow: hidden;
}
/* Initial state before scroll animation */
.our-service-area .single-service {
  opacity: 0;
  transform: translateY(60px) scale(0.95);
  transition:
    opacity 0.7s ease, transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.4s ease;
}
/* When card enters viewport */
.our-service-area .single-service.service-show {
  opacity: 1;
  transform: translateY(0) scale(1);
}
/* Card design */
.our-service-area .single-service {
  background: #fff;
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  height: 100%;
}
/* Hover effect */
.our-service-area .single-service:hover {
  transform: translateY(-12px) scale(1.02);
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.15);
}
/* Image container */
.our-service-area .service-image {
  position: relative;
  overflow: hidden;
}
/* Image animation */
.our-service-area .service-image img {
  width: 100%;
  transition: transform 0.7s ease;
}
/* Zoom image on hover */
.our-service-area .single-service:hover .service-image img {
  transform: scale(1.12);
}
/* Image overlay */
.our-service-area .service-image::after {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
  transform: skewX(-20deg);
  transition: 0.7s;
}
/* Shine animation */
.our-service-area .single-service:hover .service-image::after {
  left: 150%;
}
/* Service content */
.our-service-area .service-content {
  padding: 25px 20px;
}
/* Heading animation */
.our-service-area .service-content h3 {
  transition: transform 0.4s ease;
}
.our-service-area .single-service:hover .service-content h3 {
  transform: translateY(-4px);
}
/* Read more link */
.our-service-area .service-content > a {
  position: relative;
  display: inline-block;
  transition: all 0.3s ease;
}
/* Animated underline */
.our-service-area .service-content > a::after {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  bottom: -5px;
  left: 0;
  background: currentColor;
  transition: width 0.3s ease;
}
.our-service-area .single-service:hover .service-content > a::after {
  width: 100%;
}
/* Section title animation */
.our-service-area .section-title {
  opacity: 0;
  transform: translateY(-30px);
  transition: all 0.8s ease;
}
.our-service-area .section-title.title-show {
  opacity: 1;
  transform: translateY(0);
}
/* Mobile */
@media (max-width: 767px) {
  .our-service-area .single-service:hover {
    transform: translateY(-5px);
  }
}
/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .our-service-area .single-service, .our-service-area .section-title {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
/* =========================================
   WHAT GUIDES US
========================================= */
.guides-section {}
.guides-title {
  margin-bottom: 50px;
}
.guides-title h2 {
  font-size: 30px;
  line-height: 1.3;
  font-weight: 600;
  color: #111827;
  margin: 0;
}
.guide-item {
  padding: 0 10px;
}
/* Icon Box */
.guide-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0033a0;
  border-radius: 12px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.guide-icon i {
  font-size: 29px;
  color: #fff;
  line-height: 1;
}
/* Heading */
.guide-item h3 {
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  color: #111;
  margin-bottom: 10px;
}
/* Description */
.guide-item p {
  font-size: 14px;
  line-height: 23px;
  color: #65758b;
  margin: 0 auto;
  max-width: 270px;
}
/* Simple Corporate Hover */
.guide-item:hover .guide-icon {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 107, 214, 0.12);
}
/* Tablet */
@media only screen and (max-width: 991px) {
  .guide-item {
    margin-bottom: 40px;
  }
  .guides-title {
    margin-bottom: 40px;
  }
}
/* Mobile */
@media only screen and (max-width: 767px) {
  .guides-title h2 {
    font-size: 26px;
  }
  .guide-item {
    margin-bottom: 35px;
  }
  .guide-item p {
    max-width: 320px;
  }
}
/* =========================================
   RELIABLE SUPPORT SECTION
========================================= */
.reliable-support {
  background: #f8fafc;
  overflow: hidden;
}
/* Section Heading */
.support-heading {
  max-width: 700px;
  margin: 0 auto 55px;
}
.support-heading span {
  display: inline-block;
  font-size: 14px;
  font-weight: 600;
  color: #e6012c;
  letter-spacing: 1.5px;
  margin-bottom: 10px;
}
.support-heading h2 {
  font-size: 40px;
  line-height: 1.3;
  font-weight: 600;
  color: #172033;
  margin-bottom: 15px;
}
.support-heading p {
  font-size: 16px;
  line-height: 26px;
  color: #667085;
}
/* =========================================
   LEFT IMAGE
========================================= */
.support-image-wrap {
  position: relative;
  padding-right: 30px;
}
.support-main-image {
  width: 100%;
  height: 500px;
  object-fit: cover;
  border-radius: 20px;
  display: block;
}
/* Floating Box */
.support-floating-box {
  position: absolute;
  right: 0;
  bottom: 35px;
  display: flex;
  align-items: center;
  gap: 15px;
  background: #ffffff;
  padding: 18px 25px;
  border-radius: 12px;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}
.floating-icon {
  width: 50px;
  height: 50px;
  border-radius: 10px;
  background: #e9f2fb;
  display: flex;
  align-items: center;
  justify-content: center;
}
.floating-icon i {
  color: #006bd6;
  font-size: 25px;
}
.support-floating-box strong, .support-floating-box span {
  display: block;
}
.support-floating-box strong {
  color: #172033;
  font-size: 16px;
  font-weight: 600;
}
.support-floating-box span {
  color: #667085;
  font-size: 13px;
  margin-top: 3px;
}
/* =========================================
   FEATURE CARDS
========================================= */
.support-features {
  padding-left: 30px;
}
.support-feature-card {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  background: #ffffff;
  padding: 25px;
  margin-bottom: 20px;
  border-radius: 14px;
  border: 1px solid #edf0f4;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}
/* Feature Icon */
.support-icon {
  width: 58px;
  height: 58px;
  min-width: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e9f2fb;
  border-radius: 12px;
  transition: all 0.35s ease;
}
.support-icon i {
  color: #006bd6;
  font-size: 25px;
}
/* Feature Content */
.support-content h4 {
  font-size: 19px;
  line-height: 26px;
  font-weight: 600;
  color: #172033;
  margin: 0 0 8px;
}
.support-content p {
  font-size: 14px;
  line-height: 24px;
  color: #667085;
  margin: 0;
}
/* =========================================
   CORPORATE HOVER EFFECT
========================================= */
.support-feature-card:hover {
  transform: translateX(8px);
  border-color: #d6e7f7;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08);
}
.support-feature-card:hover .support-icon {
  background: #006bd6;
  transform: scale(1.05);
}
.support-feature-card:hover .support-icon i {
  color: #ffffff;
}
/* =========================================
   RESPONSIVE
========================================= */
@media only screen and (max-width: 991px) {
  .support-heading h2 {
    font-size: 34px;
  }
  .support-image-wrap {
    padding-right: 0;
    margin-bottom: 50px;
  }
  .support-features {
    padding-left: 0;
  }
  .support-main-image {
    height: 420px;
  }
}
@media only screen and (max-width: 767px) {
  .support-heading {
    margin-bottom: 35px;
  }
  .support-heading h2 {
    font-size: 28px;
  }
  .support-main-image {
    height: 350px;
  }
  .support-floating-box {
    position: relative;
    right: auto;
    bottom: auto;
    margin: -35px 15px 0;
  }
  .support-feature-card {
    padding: 20px;
  }
}
@media only screen and (max-width: 479px) {
  .support-feature-card {
    display: block;
  }
  .support-icon {
    margin-bottom: 15px;
  }
  .support-main-image {
    height: 280px;
  }
}
.hero-section {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #001f6b, #0033a0, #005ce6);
  min-height: 100vh;
  padding: 60px 0px 60px 0px;
}
.hero-content {
  color: #fff;
}
.hero-content h1 {
  font-size: 70px;
  font-weight: 800;
  line-height: 1.1;
  color: #fff;
}
#changingText {
  display: block;
  color: #55d4ff;
}
.hero-badge {
  display: inline-block;
  background: rgba(255, 255, 255, .15);
  backdrop-filter: blur(15px);
  padding: 10px 20px;
  border-radius: 50px;
  margin-bottom: 25px;
}
.hero-content p {
  font-size: 20px;
  line-height: 34px;
  margin: 30px 0;
}
.btn-main {
  display: inline-block;
  padding: 15px 40px;
  background: #fff;
  color: #0033a0;
  border-radius: 50px;
  font-weight: 700;
  text-decoration: none;
}
.btn-outline {
  display: inline-block;
  padding: 10px 40px;
  border: 2px solid rgba(255, 255, 255, .3);
  color: #fff;
  border-radius: 50px;
  margin-left: 15px;
  text-decoration: none;
}
.hero-image {
  position: relative;
  text-align: center;
}
.hero-image img {
  width: 100%;
  animation: float 6s ease-in-out infinite;
}
.floating-card {
  position: absolute;
  background: rgba(255, 255, 255, .12);
  backdrop-filter: blur(15px);
  padding: 15px 25px;
  border-radius: 16px;
  color: #fff;
  font-weight: 600;
  animation: floatCard 4s ease-in-out infinite;
}
.card1 {
  top: 10%;
  left: 0;
}
.card2 {
  top: 25%;
  right: 0;
}
.card3 {
  bottom: 25%;
  left: 10%;
}
.card4 {
  bottom: 10%;
  right: 10%;
}
.hero-shape {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
}
.hero-shape-1 {
  width: 500px;
  height: 500px;
  background: #00b7ff;
  top: -200px;
  right: -150px;
  opacity: .25;
}
.hero-shape-2 {
  width: 400px;
  height: 400px;
  background: #4b7dff;
  bottom: -180px;
  left: -120px;
  opacity: .2;
}
@keyframes float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
}
@keyframes floatCard {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}
@media (max-width: 767.98px) {
  .contact-information-top {
    display: none !important;
  }
}
@media (max-width:767px) {
  .hero-image {
    position: relative;
    max-width: 320px;
    margin: 40px auto 0;
  }
  .hero-image img {
    width: 100%;
    display: block;
  }
  /* Floating Cards */
  .floating-card {
    position: absolute;
    padding: 8px 12px;
    font-size: 11px;
    font-weight: 600;
    border-radius: 10px;
    background: rgba(255, 255, 255, .15);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: #fff;
    white-space: nowrap;
    z-index: 5;
    animation: floatCard 4s ease-in-out infinite;
  }
  /* Top Left */
  .card1 {
    top: 8%;
    left: -18px;
  }
  /* Top Right */
  .card2 {
    top: 18%;
    right: -18px;
    animation-delay: .6s;
  }
  /* Bottom Left */
  .card3 {
    bottom: 20%;
    left: -22px;
    animation-delay: 1.2s;
  }
  /* Bottom Right */
  .card4 {
    bottom: 8%;
    right: -20px;
    animation-delay: 1.8s;
  }
}
@keyframes floatCard {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-8px);
  }
}
.hero-btns {
  display: flex;
  gap: 15px;
  margin-top: 30px;
}
.hero-btns a {
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width:767px) {
  .hero-btns {
    flex-direction: row;
    justify-content: center;
    gap: 10px;
  }
  .hero-btns a {
    flex: 1;
    max-width: 160px;
    padding: 12px 15px;
    font-size: 14px;
    margin: 0 !important;
  }
}
/* Mobile Responsive */
@media (max-width: 991px) {
  .service-details-menu {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    margin-bottom: 20px;
    padding-bottom: 10px;
    scrollbar-width: thin;
  }
  .service-details-menu::-webkit-scrollbar {
    height: 5px;
  }
  .service-details-menu li {
    flex: 0 0 auto;
    margin-right: 8px;
    list-style: none;
  }
  .service-details-menu li a {
    display: block;
    padding: 10px 18px;
    font-size: 14px;
    border-radius: 5px;
    white-space: nowrap;
  }
  .dashboard-content {
    margin-top: 15px;
  }
  .service-details-content img {
    width: 100%;
    height: auto;
  }
  .service-details-content h2 {
    font-size: 28px;
  }
  .service-details-content p {
    font-size: 15px;
    line-height: 1.8;
  }
}
/* ============================================
           HERO – with "Powering The Business" style
           ============================================ */
.service-hero {
  padding: 24px 0 40px;
}
.service-hero .power-tag {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #5b6f82;
  margin-bottom: 6px;
  display: inline-block;
}
.service-hero .lead-text {
  font-size: 2.6rem;
  font-weight: 550;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #0a0f14;
  max-width: 800px;
  margin-bottom: 16px;
}
.service-hero .lead-text .highlight {
  background: linear-gradient(135deg, #0a0f14 60%, #4b5f72);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.service-hero .body-text {
  font-size: 1.05rem;
  line-height: 1.75;
  color: #2a3a4a;
  max-width: 700px;
  font-weight: 400;
  margin-bottom: 20px;
}
.service-hero .feature-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 28px;
}
.service-hero .feature-list li {
  font-size: 0.95rem;
  color: #1a2a3a;
  font-weight: 450;
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
}
.service-hero .feature-list li::before {
  content: "◆";
  font-size: 0.5rem;
  color: #0a0f14;
  opacity: 0.5;
}
/* ============================================
           LARGE IMAGE BLOCK – editorial
           ============================================ */
.image-block {
  margin: 12px 0 48px;
  border-radius: 28px;
  overflow: hidden;
  background: #dce2ea;
  box-shadow: 0 12px 40px -12px rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.5s ease;
}
.image-block:hover {
  box-shadow: 0 28px 64px -16px rgba(0, 0, 0, 0.08);
}
.image-block img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  aspect-ratio: 16 / 7;
  transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1);
}
.image-block:hover img {
  transform: scale(1.015);
}
@media (max-width: 768px) {
  .image-block img {
    aspect-ratio: 4 / 3;
  }
  .image-block {
    border-radius: 20px;
  }
}
/* ============================================
           STRONG FOUNDATION SECTION – editorial
           ============================================ */
.foundation-section {
  padding: 16px 0 32px;
  border-top: 1px solid rgba(0, 0, 0, 0.04);
  margin-top: 8px;
}
.foundation-section .foundation-label {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #5b6f82;
  margin-bottom: 4px;
  display: inline-block;
}
.foundation-section h3 {
  font-size: 2rem;
  font-weight: 550;
  letter-spacing: -0.02em;
  color: #0a0f14;
  margin-bottom: 12px;
  line-height: 1.2;
}
.foundation-section .foundation-text {
  font-size: 1.02rem;
  line-height: 1.7;
  color: #2a3a4a;
  max-width: 640px;
  font-weight: 400;
}
/* ============================================
           PANELS – editorial, borderless, 4 columns
           ============================================ */
.panels-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 32px 0 48px;
}
.panel-item {
  background: #ffffff;
  border-radius: 20px;
  padding: 24px 20px 26px;
  border: 1px solid rgba(0, 0, 0, 0.02);
  transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.01);
  position: relative;
}
.panel-item::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 20px;
  right: 20px;
  height: 2px;
  background: #0a0f14;
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: 4px;
}
.panel-item:hover {
  transform: translateY(-5px);
  border-color: rgba(0, 0, 0, 0.04);
  box-shadow: 0 20px 44px -20px rgba(0, 0, 0, 0.06);
}
.panel-item:hover::after {
  opacity: 1;
}
.panel-item .number {
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #8a9aa8;
  text-transform: uppercase;
  margin-bottom: 6px;
  display: block;
}
.panel-item h4 {
  font-size: 1.05rem;
  font-weight: 620;
  letter-spacing: -0.01em;
  color: #0a0f14;
  margin-bottom: 4px;
}
.panel-item p {
  font-size: 0.9rem;
  line-height: 1.6;
  color: #314253;
  margin-bottom: 0;
}
@media (max-width: 1024px) {
  .panels-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
}
@media (max-width: 576px) {
  .panels-grid {
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 24px 0 32px;
  }
  .panel-item {
    padding: 16px 16px 18px;
  }
}
/* ============================================
           METRIC / QUOTE BLOCK
           ============================================ */
.metric-block {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  padding: 28px 0 24px;
  border-top: 1px solid rgba(0, 0, 0, 0.04);
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  margin: 12px 0 48px;
  gap: 16px;
}
.metric-item {
  flex: 1 1 100px;
}
.metric-item .value {
  font-size: 2rem;
  font-weight: 620;
  letter-spacing: -0.02em;
  color: #0a0f14;
  line-height: 1.1;
}
.metric-item .label {
  font-size: 0.82rem;
  color: #4b5f72;
  font-weight: 400;
  margin-top: 2px;
}
.metric-quote {
  flex: 2 1 260px;
  padding-left: 24px;
  border-left: 2px solid #0a0f14;
}
.metric-quote blockquote {
  font-size: 0.95rem;
  font-weight: 400;
  line-height: 1.6;
  color: #0a0f14;
  margin-bottom: 0;
  font-style: italic;
}
.metric-quote cite {
  font-size: 0.8rem;
  font-weight: 450;
  color: #4b5f72;
  font-style: normal;
  display: block;
  margin-top: 2px;
}
@media (max-width: 768px) {
  .metric-block {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 18px 0 14px;
  }
  .metric-quote {
    padding-left: 0;
    border-left: none;
    border-top: 1px solid rgba(0, 0, 0, 0.04);
    padding-top: 12px;
    width: 100%;
  }
}
/* ============================================
           CTA – full width, dark
           ============================================ */
.cta-block {
  background: #0a0f14;
  border-radius: 32px;
  padding: 48px 48px;
  margin: 40px 0 72px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.4s ease;
}
.cta-block:hover {
  box-shadow: 0 24px 60px -16px rgba(0, 0, 0, 0.14);
}
.cta-text h3 {
  font-size: 1.8rem;
  font-weight: 440;
  color: #ffffff;
  letter-spacing: -0.02em;
  margin-bottom: 2px;
  line-height: 1.2;
}
.cta-text p {
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.98rem;
  font-weight: 400;
  margin-bottom: 0;
}
.cta-btn {
  background: #ffffff;
  color: #0a0f14;
  border: none;
  padding: 14px 44px;
  border-radius: 60px;
  font-weight: 500;
  font-size: 0.95rem;
  letter-spacing: 0.01em;
  transition: all 0.25s ease;
  text-decoration: none;
  display: inline-block;
  font-family: 'Inter', sans-serif;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
}
.cta-btn:hover {
  background: #f0f4f8;
  transform: scale(1.02);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  color: #0a0f14;
}
@media (max-width: 768px) {
  .cta-block {
    padding: 28px 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    border-radius: 24px;
  }
  .cta-text h3 {
    font-size: 1.4rem;
  }
  .cta-btn {
    width: 100%;
    text-align: center;
    padding: 14px 24px;
  }
}
/* ============================================
           UTILITY – animations
           ============================================ */
.fade-up {
  opacity: 0;
  animation: fadeUp 0.7s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}
@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translateY(16px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.delay-1 {
  animation-delay: 0.04s;
}
.delay-2 {
  animation-delay: 0.08s;
}
.delay-3 {
  animation-delay: 0.12s;
}
.delay-4 {
  animation-delay: 0.16s;
}
/* ============================================
           RESPONSIVE
           ============================================ */
@media (max-width: 992px) {
  .breadcrumb-title {
    font-size: 2.6rem;
  }
  .service-hero .lead-text {
    font-size: 2rem;
  }
}
@media (max-width: 576px) {
  .breadcrumb-title {
    font-size: 2rem;
  }
  .breadcrumb-title .light {
    display: block;
  }
  .service-hero {
    padding: 12px 0 24px;
  }
  .service-hero .lead-text {
    font-size: 1.5rem;
  }
  .service-hero .body-text {
    font-size: 0.95rem;
  }
  .service-hero .feature-list {
    flex-direction: column;
    gap: 6px;
  }
  .foundation-section h3 {
    font-size: 1.5rem;
  }
  .foundation-section .foundation-text {
    font-size: 0.95rem;
  }
  .metric-item .value {
    font-size: 1.6rem;
  }
}
/* ============================================
           HERO / INTRO – editorial, text-first
           ============================================ */
.service-hero {
  padding: 40px 0 56px;
}
.service-hero .lead-text {
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.01em;
  color: #0b1117;
  max-width: 820px;
  margin-bottom: 24px;
}
.service-hero .body-text {
  font-size: 1.05rem;
  line-height: 1.7;
  color: #2d3748;
  max-width: 720px;
  font-weight: 400;
}
/* ============================================
           LARGE IMAGE BLOCK – editorial, full-bleed feel
           ============================================ */
.image-block {
  margin: 0 0 64px 0;
  border-radius: 28px;
  overflow: hidden;
  background: #eef2f6;
  box-shadow: 0 12px 40px -12px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.4s ease;
}
.image-block:hover {
  box-shadow: 0 24px 64px -16px rgba(0, 0, 0, 0.10);
}
.image-block img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  aspect-ratio: 16 / 9;
  transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}
.image-block:hover img {
  transform: scale(1.015);
}
/* ============================================
           PANELS – editorial bento, no cards
           ============================================ */
.panels-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
  margin: 56px 0 64px;
}
.panel-item {
  background: #ffffff;
  border-radius: 24px;
  padding: 32px 28px 36px;
  transition: all 0.35s cubic-bezier(0.23, 1, 0.32, 1);
  border: 1px solid rgba(0, 0, 0, 0.03);
  box-shadow: 0 4px 16px -8px rgba(0, 0, 0, 0.02);
  position: relative;
  backdrop-filter: blur(2px);
}
.panel-item::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: #0b1117;
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: 24px 24px 0 0;
}
.panel-item:hover {
  transform: translateY(-6px);
  border-color: rgba(0, 0, 0, 0.06);
  box-shadow: 0 24px 48px -20px rgba(0, 0, 0, 0.12);
}
.panel-item:hover::after {
  opacity: 1;
}
.panel-item h4 {
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: #0b1117;
  margin-bottom: 10px;
}
.panel-item p {
  font-size: 0.98rem;
  line-height: 1.6;
  color: #334155;
  font-weight: 400;
  margin-bottom: 0;
}
.panel-item .meta-tag {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  margin-bottom: 12px;
  border-bottom: 1.5px solid #e9edf2;
  padding-bottom: 6px;
}
/* ============================================
           STATISTICS / TESTIMONIAL BLOCK (modern)
           ============================================ */
.stats-block {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding: 40px 0 32px;
  border-top: 1px solid rgba(0, 0, 0, 0.04);
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  margin: 16px 0 56px;
}
.stat-item {
  flex: 1 1 140px;
  padding: 8px 0;
}
.stat-number {
  font-size: 2.2rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: #0b1117;
  line-height: 1.1;
}
.stat-label {
  font-size: 0.85rem;
  font-weight: 400;
  color: #5b6773;
  margin-top: 2px;
}
/* ============================================
           FULL-WIDTH CTA – clean, premium
           ============================================ */
.cta-block {
  background: #0b1117;
  border-radius: 32px;
  padding: 60px 48px;
  margin: 56px 0 80px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  transition: box-shadow 0.3s ease;
  box-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.12);
}
.cta-block:hover {
  box-shadow: 0 20px 56px -16px rgba(0, 0, 0, 0.20);
}
.cta-text h3 {
  font-size: 2rem;
  font-weight: 500;
  color: #ffffff;
  letter-spacing: -0.01em;
  margin-bottom: 6px;
  line-height: 1.2;
}
.cta-text p {
  color: rgba(255, 255, 255, 0.6);
  font-size: 1rem;
  font-weight: 400;
  margin-bottom: 0;
}
.cta-btn {
  background: #ffffff;
  color: #0b1117;
  border: none;
  padding: 14px 40px;
  border-radius: 60px;
  font-weight: 500;
  font-size: 0.95rem;
  letter-spacing: 0.01em;
  transition: all 0.25s ease;
  text-decoration: none;
  display: inline-block;
  font-family: 'Inter', sans-serif;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.cta-btn:hover {
  background: #f0f4f8;
  transform: scale(1.02);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  color: #0b1117;
}
/* ============================================
           RESPONSIVE – mobile-first, refined
           ============================================ */
@media (max-width: 992px) {
  .breadcrumb-title {
    font-size: 2.4rem;
  }
  .service-hero .lead-text {
    font-size: 1.4rem;
  }
  .panels-grid {
    gap: 20px;
  }
  .panel-item {
    padding: 24px 20px 28px;
  }
  .cta-block {
    padding: 44px 32px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }
  .cta-text h3 {
    font-size: 1.7rem;
  }
}
@media (max-width: 768px) {
  .breadcrumb-area {
    padding: 32px 0 20px;
  }
  .breadcrumb-title {
    font-size: 2rem;
  }
  .service-hero {
    padding: 24px 0 32px;
  }
  .service-hero .lead-text {
    font-size: 1.2rem;
  }
  .service-hero .body-text {
    font-size: 0.95rem;
  }
  .panels-grid {
    grid-template-columns: 1fr;
    gap: 16px;
    margin: 32px 0 40px;
  }
  .panel-item {
    padding: 20px 18px 24px;
  }
  .image-block {
    margin: 0 0 40px 0;
    border-radius: 20px;
  }
  .image-block img {
    aspect-ratio: 4 / 3;
  }
  .stats-block {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding: 28px 0 24px;
  }
  .stat-item {
    flex: 1 1 auto;
    width: 100%;
  }
  .stat-number {
    font-size: 1.8rem;
  }
  .cta-block {
    padding: 32px 24px;
    border-radius: 24px;
    margin: 32px 0 56px;
  }
  .cta-text h3 {
    font-size: 1.4rem;
  }
  .cta-btn {
    width: 100%;
    text-align: center;
    padding: 14px 24px;
  }
}
@media (max-width: 480px) {
  .breadcrumb-title {
    font-size: 1.7rem;
  }
  .breadcrumb-item {
    font-size: 0.8rem;
  }
  .service-hero .lead-text {
    font-size: 1.05rem;
  }
  .panel-item h4 {
    font-size: 1.1rem;
  }
}
/* ============================================
           UTILITY – micro‑interactions
           ============================================ */
.fade-up {
  opacity: 0;
  animation: fadeUp 0.7s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}
@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translateY(14px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.delay-1 {
  animation-delay: 0.05s;
}
.delay-2 {
  animation-delay: 0.10s;
}
.delay-3 {
  animation-delay: 0.15s;
}
.delay-4 {
  animation-delay: 0.20s;
}
/* subtle divider */
.divider-light {
  width: 60px;
  height: 2px;
  background: #dce2e9;
  margin: 16px 0 20px;
  border-radius: 4px;
}
/* image mask effect (editorial) */
.image-mask {
  mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}
.service-modern {
  padding: 90px 0;
}
.service-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
  align-items: center;
  margin-bottom: 70px;
}
.service-image {
  overflow: hidden;
  /*border-radius: 28px;*/
}
.service-image img {
  width: 100%;
  transition: .6s;
}
.service-image:hover img {
  transform: scale(1.05);
}
.intro {
  font-size: 22px;
  line-height: 1.8;
  color: #111;
  margin-bottom: 25px;
}
.service-content p {
  color: #666;
  line-height: 1.9;
}
.bento-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}
.bento {
  background: #fafafa;
  padding: 35px;
  border-radius: 24px;
  transition: .35s;
  border: 1px solid #eee;
}
.bento:hover {
  transform: translateY(-10px);
  box-shadow: 0 30px 60px rgba(0, 0, 0, .08);
}
.bento.large {
  grid-column: span 2;
}
.bento h3 {
  font-size: 24px;
  margin-bottom: 15px;
}
.bento p {
  margin: 0;
  color: #666;
  line-height: 1.8;
}
@media(max-width:991px) {
  .service-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .bento-grid {
    grid-template-columns: 1fr;
  }
  .bento.large {
    grid-column: span 1;
  }
  .intro {
    font-size: 18px;
  }
}
.bg-orange {
  background: #f97316 !important;
}
.bg-indigo {
  background: #4338ca !important;
}
.bg-teal {
  background: #0f766e !important;
}
.bg-purple {
  background: #6f42c1 !important;
}
.bg-medical {
  background: #14b8a6 !important;
}
.bg-ar {
  background: #0d9488 !important;
}
.bg-civil {
  background: #8b5e3c !important;
}
.bg-electronics {
  background: #2563eb !important;
}
.bg-custom {
  background: #9333ea !important;
}
.bg-analytics {
  background: #0284c7 !important;
}
.bg-arcalling {
  background: #7c2d12 !important;
}
.bg-transcription {
  background: #0f766e !important;
}