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

    Theme Name: Archo
    Theme URI: http://
    Description: Architecture & Interior Design HTML Template
    Author: UI-ThemeZ
    Author URI: http://themeforest.net/user/UI-ThemeZ
    Version: 1.0

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

== Table Of Content

    |--- BASE

        |- typography
        |- helper classes

    |--- SHORTCODES

        |- extra
        |- overlay
        |- section-heading
        |- buttons
        |- navbar
        |- sliders
        |- intro
        |- feature-box
        |- clients
        |- counter
        |- portfolio
        |- process
        |- progress-bar
        |- tabs
        |- team
        |- testimonials
        |- blog
        |- contact-form
        |- footers

    |--- BASE

        |- responsive
	


---------------------------------------------------------------- */
/* ====================== [ Start Typography  ] ====================== */

@import url('https://fonts.googleapis.com/css2?family=Hammersmith+One&display=swap');
@font-face {
font-family: "Viga-Regular";
src: url("../fonts/Hammersmith%20One.html");
}
@font-face {
font-family: "Viga-Regular";
src: url("../fonts/Viga-Regular.ttf");
}
@font-face {
  font-family: "Viga-Regular";
  src: url("../fonts/Philosopher-Regular.ttf");
  }
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  list-style: none; }

body {
	    background-color: #f1f2f3;
  color: #191514;
  line-height: 1.5;
  font-weight: 400;
  overflow-x: hidden !important;
  font-family: 'Swiss-721-Condensed-BT_43232', sans-serif; }

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

span, a, a:hover {
  display: inline-block;
  color: inherit; }

h1 {
  font-size: 55px; }

h2 {
  font-size: 30px; }

h3 {
  font-size: 35px; }

h4 {
  font-size: 30px; }

h5 {
  font-size: 25px; }

h6 {
  font-size: 18px;
  }

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  line-height: 1.4;
  font-weight: 600; }

p {
  color: #555;
  font-size: 15px;
  font-weight: 400;
  line-height: 2;
  margin: 0; }

a, span {
  display: inline-block; }
  a:hover, span:hover {
    text-decoration: none; }

/* ====================== [ End Typography  ] ====================== */
/* ====================== [ Start Helper Classes  ] ====================== */
.o-hidden {
  overflow: hidden; }

.position-re {
  position: relative; }

.ontop {
  position: relative;
  z-index: 7; }

.full-over {
  position: absolute !important;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%; }

.full-width {
  width: 100% !important; }

.custom-font {
	text-transform:uppercase;
  font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
  font-weight: 400; }

.playfont {
  font-family: 'Viga-Regular', serif;
    color: #1971b8;
  }

.main-color {
  color: #002546 !important; }

.bg-gray {
  background-color: #1e6694; }
  .bg-gray .primery-shadow {
    -webkit-box-shadow: 0px 4px 30px -4px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 4px 30px -4px rgba(0, 0, 0, 0.2); }

.bg-dark {
  background-color: #141414 !important; }
  .bg-dark .primery-shadow {
    -webkit-box-shadow: 0px 4px 40px -4px rgba(255, 255, 255, 0.2);
    box-shadow: 0px 4px 40px -4px rgba(255, 255, 255, 0.2); }

.bg-color {
  background-color: #002546 !important; }
  .bg-color .primery-shadow {
    -webkit-box-shadow: 0px 4px 40px -4px rgba(255, 255, 255, 0.2);
    box-shadow: 0px 4px 40px -4px rgba(255, 255, 255, 0.2); }

.bg-img {
  background-size: cover;
  background-repeat: no-repeat; }

.bg-center {
  background-position: center center; }

.bg-fixed {
  background-attachment: fixed; }

.bg-repeat {
  background-size: auto;
  background-repeat: repeat; }

.section-padding {
  padding: 120px 0; }

.section-ptb {
  padding: 80px 0; }

.head-pt {
  padding: 80px 0 0; }

.head-pb {
  padding: 0 0 80px; }

.rounded {
  border-radius: 5px; }

.circle {
  border-radius: 50%; }

.unlist {
  list-style: none; }

.undecro:hover {
  text-decoration: none; }

.inline {
  display: inline-block; }

.valign {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }

.primery-shadow {
  -webkit-box-shadow: 0px 8px 30px -4px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 8px 30px -4px rgba(0, 0, 0, 0.1); }

.padding5 {
  padding-right: 5%;
  padding-left: 5%; }

/*-------------------------------------------------------
					 text color
-------------------------------------------------------*/
.text-white {
  color: #FFF; }

.text-black {
  color: #000; }

.text-extra-light-gray {
  color: #b7b7b7; }

/*-------------------------------------------------------
					font-weight
-------------------------------------------------------*/
.fw-100 {
  font-weight: 100 !important; }

.fw-200 {
  font-weight: 200 !important; }

.fw-300 {
  font-weight: 300 !important; }

.fw-400 {
  font-weight: 400 !important; }

.fw-500 {
  font-weight: 500 !important; }

.fw-600 {
  font-weight: 600 !important; }

.fw-700 {
  font-weight: 700 !important; }

.fw-800 {
  font-weight: 800 !important; }

.fw-900 {
  font-weight: 900 !important; }

/*-------------------------------------------------------
					 font-size
-------------------------------------------------------*/
.fz-10 {
  font-size: 10px !important; }

.fz-12 {
  font-size: 12px !important; }

.fz-14 {
  font-size: 14px !important; }

.fz-15 {
  font-size: 15px !important; }

.fz-16 {
  font-size: 16px !important; }

.fz-18 {
  font-size: 18px !important; }

.fz-20 {
  font-size: 20px !important; }

.fz-22 {
  font-size: 22px !important; }

.fz-25 {
  font-size: 25px !important; }

.fz-30 {
  font-size: 30px !important; }

.fz-40 {
  font-size: 40px !important; }

.fz-50 {
  font-size: 50px !important; }

/*-------------------------------------------------------
					line-height
-------------------------------------------------------*/
.line-height-10 {
  line-height: 10px; }

.line-height-13 {
  line-height: 13px; }

.line-height-18 {
  line-height: 18px; }

.line-height-20 {
  line-height: 20px; }

.line-height-24 {
  line-height: 24px; }

.line-height-22 {
  line-height: 22px; }

.line-height-26 {
  line-height: 26px; }

.line-height-28 {
  line-height: 28px; }

.line-height-30 {
  line-height: 30px; }

.line-height-35 {
  line-height: 35px; }

.line-height-40 {
  line-height: 40px; }

.line-height-45 {
  line-height: 45px; }

.line-height-50 {
  line-height: 50px; }

.line-height-55 {
  line-height: 55px; }

.line-height-60 {
  line-height: 60px; }

.line-height-65 {
  line-height: 65px; }

.line-height-70 {
  line-height: 70px; }

.line-height-75 {
  line-height: 75px; }

.line-height-80 {
  line-height: 80px; }

.line-height-85 {
  line-height: 85px; }

.line-height-90 {
  line-height: 90px; }

.line-height-95 {
  line-height: 95px; }

.line-height-100 {
  line-height: 100px; }

.line-height-110 {
  line-height: 110px; }

.line-height-120 {
  line-height: 120px; }

/*-------------------------------------------------------
					text-transform
-------------------------------------------------------*/
.text-u {
  text-transform: uppercase !important; }

.text-l {
  text-transform: lowercase !important; }

.text-c {
  text-transform: capitalize !important; }

.text-non {
  text-transform: none !important; }

.text-i {
  font-style: italic; }

/*-------------------------------------------------------
					 letter-spacing
-------------------------------------------------------*/
.ls0 {
  letter-spacing: 0px !important; }

.ls1 {
  letter-spacing: 1px !important; }

.ls2 {
  letter-spacing: 2px !important; }

.ls3 {
  letter-spacing: 3px !important; }

.ls4 {
  letter-spacing: 4px !important; }

.ls5 {
  letter-spacing: 5px !important; }

.ls10 {
  letter-spacing: 10px !important; }

/*-------------------------------------------------------
			 margin-top  (0/100) +5
-------------------------------------------------------*/
.mt-0 {
  margin-top: 0 !important; }

.mt-5 {
  margin-top: 5px !important; }

.mt-10 {
  margin-top: 10px !important; }

.mt-15 {
  margin-top: 15px !important; }

.mt-20 {
  margin-top: 20px !important; }

.mt-25 {
  margin-top: 25px !important; }

.mt-30 {
  margin-top: 30px !important; }

.mt-35 {
  margin-top: 35px !important; }

.mt-40 {
  margin-top: 40px !important; }

.mt-45 {
  margin-top: 45px !important; }

.mt-50 {
  margin-top: 50px !important; }

.mt-55 {
  margin-top: 55px !important; }

.mt-60 {
  margin-top: 60px !important; }

.mt-62 {
  margin-top: 62px !important; }

.mt-65 {
  margin-top: 65px !important; }

.mt-70 {
  margin-top: 70px !important; }

.mt-75 {
  margin-top: 75px !important; }

.mt-80 {
  margin-top: 80px !important; }

.mt-85 {
  margin-top: 85px !important; }

.mt-90 {
  margin-top: 90px !important; }

.mt-95 {
  margin-top: 95px !important; }

.mt-100 {
  margin-top: 100px !important; }

/*-------------------------------------------------------
			 margin-bottom  (0/100) +5
-------------------------------------------------------*/
.mb-0 {
  margin-bottom: 0 !important; }

.mb-5 {
  margin-bottom: 5px !important; }

.mb-10 {
  margin-bottom: 10px !important; }

.mb-15 {
  margin-bottom: 15px !important; }

.mb-20 {
  margin-bottom: 20px !important; 
    }

.mb-25 {
  margin-bottom: 25px !important; }

.mb-30 {
  margin-bottom: 30px !important; }

.mb-35 {
  margin-bottom: 35px !important; }

.mb-40 {
  margin-bottom: 40px !important; }

.mb-45 {
  margin-bottom: 45px !important; }

.mb-50 {
  margin-bottom: 50px !important; }

.mb-55 {
  margin-bottom: 55px !important; }

.mb-60 {
  margin-bottom: 60px !important; }

.mb-62 {
  margin-bottom: 62px !important; }

.mb-65 {
  margin-bottom: 65px !important; }

.mb-70 {
  margin-bottom: 70px !important; }

.mb-75 {
  margin-bottom: 75px !important; }

.mb-80 {
  margin-bottom: 80px !important; }

.mb-85 {
  margin-bottom: 85px !important; }

.mb-90 {
  margin-bottom: 90px !important; }

.mb-95 {
  margin-bottom: 95px !important; }

.mb-100 {
  margin-bottom: 100px !important; }

/*-------------------------------------------------------
			padding-top  (0/100) +5
-------------------------------------------------------*/
.pt-0 {
  padding-top: 0 !important; }

.pt-5 {
  padding-top: 5px !important; }

.pt-10 {
  padding-top: 10px !important; }

.pt-15 {
  padding-top: 15px !important; }

.pt-20 {
  padding-top: 20px !important; }

.pt-25 {
  padding-top: 25px !important; }

.pt-30 {
  padding-top: 30px !important; }

.pt-35 {
  padding-top: 35px !important; }

.pt-40 {
  padding-top: 40px !important; }

.pt-45 {
  padding-top: 45px !important; }

.pt-50 {
  padding-top: 50px !important; }

.pt-55 {
  padding-top: 55px !important; }

.pt-60 {
  padding-top: 60px !important; }

.pt-65 {
  padding-top: 65px !important; }

.pt-70 {
  padding-top: 70px !important; }

.pt-75 {
  padding-top: 75px !important; }

.pt-80 {
  padding-top: 80px !important; }

.pt-85 {
  padding-top: 85px !important; }

.pt-90 {
  padding-top: 90px !important; }

.pt-95 {
  padding-top: 95px !important; }

.pt-100 {
  padding-top: 100px !important; }

/*-------------------------------------------------------
		 padding-bottom  (0/100) +5
-------------------------------------------------------*/
.pb-0 {
  padding-bottom: 0 !important; }

.pb-5 {
  padding-bottom: 5px !important; }

.pb-10 {
  padding-bottom: 10px !important; }

.pb-15 {
  padding-bottom: 15px !important; }

.pb-20 {
  padding-bottom: 20px !important; }

.pb-25 {
  padding-bottom: 25px !important; }

.pb-30 {
  padding-bottom: 30px !important; }

.pb-35 {
  padding-bottom: 35px !important; }

.pb-40 {
  padding-bottom: 40px !important; }

.pb-45 {
  padding-bottom: 45px !important; }

.pb-50 {
  padding-bottom: 50px !important; }

.pb-55 {
  padding-bottom: 55px !important; }

.pb-60 {
  padding-bottom: 60px !important; }

.pb-65 {
  padding-bottom: 65px !important; }

.pb-70 {
  padding-bottom: 70px !important; }

.pb-75 {
  padding-bottom: 75px !important; }

.pb-80 {
  padding-bottom: 80px !important; }

.pb-85 {
  padding-bottom: 85px !important; }

.pb-90 {
  padding-bottom: 90px !important; }

.pb-95 {
  padding-bottom: 95px !important; }

.pb-100 {
  padding-bottom: 100px !important; }

.no-padding {
  padding: 0 !important; }

/* ====================== [ End Helper Classes  ] ====================== */
/* ====================== [ Start Preloader ] ====================== */


.pace {
	display:none;
}

#preloader {
  width: 100%;
  
  height: 100vh;
  overflow: hidden;
  position: fixed;
  z-index: 9999999; }
  #preloader:after, #preloader:before {
    content: '';
    position: fixed;
    left: 0;
    height: 50vh;
    width: 100%;
    background: #1e6694;
    -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
  #preloader:before {
    top: 0; }
  #preloader:after {
    bottom: 0; }
  #preloader.isdone {
    visibility: hidden;
    -webkit-transition-delay: 0.5s;
    -o-transition-delay: 0.5s;
    transition-delay: 0.5s; }
    #preloader.isdone:after, #preloader.isdone:before {
      height: 0;
      -webkit-transition: all 0.7s cubic-bezier(1, 0, 0.55, 1);
      -o-transition: all 0.7s cubic-bezier(1, 0, 0.55, 1);
      transition: all 0.7s cubic-bezier(1, 0, 0.55, 1);
      -webkit-transition-delay: 1s;
      -o-transition-delay: 1s;
      transition-delay: 1s; }

.loading-text {
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 3px;
  position: absolute;
  top: calc(50% - 30px);
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: #ffffff;
  font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
  z-index: 9999; }
  .loading-text.isdone {
    top: 50%;
    opacity: 0;
    -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
    -webkit-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s; }

/* ====================== [ End Preloader ] ====================== */
/* ====================== [ Start Text Animation & Images ] ====================== */
.splitting.animated .char {
  -webkit-animation: fadeInUp 0.4s cubic-bezier(0.3, 0, 0.7, 1) both;
  animation: fadeInUp 0.4s cubic-bezier(0.3, 0, 0.7, 1) both;
  -webkit-animation-delay: calc(30ms * var(--char-index));
  animation-delay: calc(30ms * var(--char-index)); }

.splitting .whitespace {
  width: 10px; }

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

.splitting.txt.animated .char {
  -webkit-animation: fadeIn 0.3s cubic-bezier(0.3, 0, 0.7, 1) both;
  animation: fadeIn 0.3s cubic-bezier(0.3, 0, 0.7, 1) both;
  -webkit-animation-delay: calc(10ms * var(--char-index));
  animation-delay: calc(10ms * var(--char-index)); }

.splitting.txt .whitespace {
  width: 5px; }

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

.imago {
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
  clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
  -webkit-transition: all .8s;
  -o-transition: all .8s;
  transition: all .8s;
  -webkit-transition-delay: .3s;
  -o-transition-delay: .3s;
  transition-delay: .3s; }
  .imago.animated {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }

/* ====================== [ End Text Animation & Images ] ====================== */
/* ====================== [ Start Cursor Style ] ====================== */
body{
cursor: default !important;
}

.mouse-cursor {
  position: fixed;
  left: 0;
  top: 0;
  pointer-events: none;
  border-radius: 50%;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  visibility: hidden; }

.cursor-inner {
  margin-left: 2px;
  margin-top: 2px;
  width: 6px;
  height: 6px;
  z-index: 10000001;
  background-color: #002546;
  -webkit-transition: width .3s ease-in-out,
 height .3s ease-in-out,
 margin .3s ease-in-out,
 opacity .3s ease-in-out;
  -o-transition: width .3s ease-in-out,
 height .3s ease-in-out,
 margin .3s ease-in-out,
 opacity .3s ease-in-out;
  transition: width .3s ease-in-out,
 height .3s ease-in-out,
 margin .3s ease-in-out,
 opacity .3s ease-in-out; }

.cursor-inner.cursor-hover {
  margin-left: -40px;
  margin-top: -40px;
  width: 80px;
  height: 80px;
  background-color: #002546;
  opacity: .3; }

.cursor-outer {
  margin-left: -15px;
  margin-top: -15px;
  width: 40px;
  height: 40px;
  border: 1px solid #002546;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 10000000;
  opacity: .5;
  -webkit-transition: all .08s ease-out;
  -o-transition: all .08s ease-out;
  transition: all .08s ease-out; }
  .cursor-outer.cursor-hover {
    opacity: 0; }

/* ====================== [ End Cursor Style ] ====================== */
/* ====================== [ Start progress-wrap ] ====================== */
.progress-wrap {
  position: fixed;
  bottom: 30px;
  right: 30px;
  height: 44px;
  width: 44px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(20px);
  -ms-transform: translateY(20px);
  transform: translateY(20px);
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear; }

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0); }

.progress-wrap::after {
  position: absolute;
  font-family: 'Font Awesome 5 Free';
  content: '\f077';
  text-align: center;
  line-height: 44px;
  font-size: 13px;
  font-weight: 900;
  color: #002546;
  left: 0;
  top: 0;
  height: 44px;
  width: 44px;
  cursor: pointer;
  display: block;
  z-index: 1;
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear; }

.progress-wrap svg path {
  fill: none; }

.progress-wrap svg.progress-circle path {
  stroke: #002546;
  stroke-width: 4;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear; }

/* ====================== [ End progress-wrap ] ====================== */
/* ====================== [ Start Overlay ] ====================== */
[data-overlay-dark],
[data-overlay-light] {
  position: relative; }

[data-overlay-dark] .container,
[data-overlay-light] .container {
  position: relative;
  z-index: 2; }

[data-overlay-dark]:before,
[data-overlay-light]:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1; }

[data-overlay-dark]:before {
	    background: #02050b;
      background: #000;
 }
 
 

[data-overlay-light]:before {
  background: #fff; }

[data-overlay-dark] h1,
[data-overlay-dark] h2,
[data-overlay-dark] h3,
[data-overlay-dark] h4,
[data-overlay-dark] h5,
[data-overlay-dark] h6,
[data-overlay-dark] span,
.bg-dark h1,
.bg-dark h2,
.bg-dark h3,
.bg-dark h4,
.bg-dark h5,
.bg-dark h6,
.bg-dark span,
.bg-color h1,
.bg-color h2,
.bg-color h3,
.bg-color h4,
.bg-color h5,
.bg-color h6,
.bg-color span {
  color: #fff; }

[data-overlay-dark] p,
.bg-dark p,
.bg-color p {
  color: #dad6d6; }

[data-overlay-dark="0"]:before,
[data-overlay-light="0"]:before {
  opacity: 0; }

[data-overlay-dark="1"]:before,
[data-overlay-light="1"]:before {
  opacity: .1; }

[data-overlay-dark="2"]:before,
[data-overlay-light="2"]:before {
  opacity: .2; }

[data-overlay-dark="3"]:before,
[data-overlay-light="3"]:before {
  opacity: .3; }

[data-overlay-dark="4"]:before,
[data-overlay-light="4"]:before {
  opacity: .4; }

[data-overlay-dark="5"]:before,
[data-overlay-light="5"]:before {
  opacity: .5; }

[data-overlay-dark="6"]:before,
[data-overlay-light="6"]:before {
  opacity: .6; }

[data-overlay-dark="7"]:before,
[data-overlay-light="7"]:before {
  opacity: .7; }

[data-overlay-dark="8"]:before,
[data-overlay-light="8"]:before {
  opacity: .8; }

[data-overlay-dark="9"]:before,
[data-overlay-light="9"]:before,
[data-overlay-color="9"]:before {
  opacity: .9; }

[data-overlay-dark="10"]:before,
[data-overlay-light="10"]:before {
  opacity: 1; }

/* ====================== [ End Overlay ] ====================== */
/* ====================== [ Start Heading ] ====================== */
.section-head {
  position: relative;
  margin: 0 auto 80px; }
  .section-head h4 {
    font-weight: 500;
    font-size: 40px;
    letter-spacing: 2px; }
  .section-head h6 {
    color: #002546;
    font-weight: 300;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0px;
    margin-bottom: 10px; }

.sub-title {
  color: #002546;
  font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 14px;
  padding-left: 60px;
  letter-spacing: 0px;
  margin-bottom: 15px;
  position: relative; }
  .sub-title:before {
    content: "";
    width: 50px;
    height: 1px;
    background: #002546;
    position: absolute;
    left: 0;
    top: 50%; }
	
	.sub-title2 {
  color: #002546;
  font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 14px;
  padding-left: 60px;
  letter-spacing: 0px;
  margin-bottom: 15px;
  position: relative; }
	.sub-title2:before {
    content: "";
    width: 50px;
    height: 1px;
    background: #002546;
    position: absolute;
    left: 35%;
    top: 50%;
}
.sub-title3 {
  color: #002546;
  font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 14px;
  padding-left: 60px;
  letter-spacing: 0px;
  margin-bottom: 15px;
  position: relative; }
.sub-title3:before {
    content: "";
    width: 50px;
    height: 1px;
    background: #002546;
    position: absolute;
    left: 28%;
    top: 50%;
}

.sub-title4 {
  color: #ffffff !important;
  font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 14px;
  padding-left: 60px;
  letter-spacing: 0px;
  margin-bottom: 15px;
  position: relative; }
.sub-title4:before {
    content: "";
    width: 50px;
    height: 1px;
    background: #ffffff;
    position: absolute;
    left: 33%;
    top: 50%;
}
.extra-title {
  font-weight: 700; }

.tit h6 {
  color: #002546;
  font-weight: 400;
  font-size: 22px; }

.tit h3 {
  font-weight: 700;
  margin-bottom: 20px; }

.tit .navs span {
  padding: 15px 30px;
  background: #1e6694;
  cursor: pointer; }
  .tit .navs span:hover {
    background: #002546;
    color: #fff; }

.sm-title {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase; }

/* ====================== [ End Heading ] ====================== */
/* ====================== [  Start Button Style ] ====================== */
.btn-curve {
	text-transform:uppercase;
  background: transparent;
  padding: 12px 35px;
  border: 1px solid #1e1e1e;
  font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
  position: relative;
  overflow: hidden;
  cursor: pointer; }
  .btn-curve:focus {
    outline: none; }
  .btn-curve:hover {
    outline: none; }
    .btn-curve:hover:after {
      bottom: -30px;
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg); }
    .btn-curve:hover span {
      color: #fff; }
  .btn-curve:after {
    content: '';
    position: absolute;
    top: -30px;
    left: -30px;
    right: -30px;
    bottom: 130%;
    background: #1e1e1e;
    -webkit-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
    -webkit-transition: all .8s;
    -o-transition: all .8s;
    transition: all .8s; }
  .btn-curve span {
text-transform: uppercase !important;
    font-size: 13px;
    text-transform: none;
    letter-spacing: 1px;
    position: relative;
    z-index: 2;
    -webkit-transition: all .8s;
    -o-transition: all .8s;
    transition: all .8s; }
  .btn-curve.btn-lit {
    border-color: #fff;
    color: #fff; }
    .btn-curve.btn-lit:hover span {
      color: #002546; }
    .btn-curve.btn-lit:after {
      background: #fff; }
  .btn-curve.btn-blc {
    background: #1e1e1e; }
    .btn-curve.btn-blc:after {
      background: #fff; }
    .btn-curve.btn-blc span {
      color: #fff; }
    .btn-curve.btn-blc:hover span {
      color: #1e1e1e; }
  .btn-curve.btn-color {
    background: #1971b8;
    border-color: #1971b8;
    border-radius: 30px;}
    .btn-curve.btn-color:after {
      background: #fff; }
    .btn-curve.btn-color span {
      color: #fff; }
    .btn-curve.btn-color:hover span {
      color: #002546; }
  .btn-curve.btn-lg {
    padding: 14px 40px; }
    .btn-curve.btn-lg span {
      font-size: 14px; }
  .btn-curve.btn-wit {
    background: #fff;
    border-color: #fff; }
    .btn-curve.btn-wit:after {
      background: #090909; }
    .btn-curve.btn-wit span {
      color: #1e1e1e; }
    .btn-curve.btn-wit:hover span {
      color: #fff; }
  .btn-curve.btn-radius {
    border-radius: 30px; }

/* ====================== [ End Button Style ] ====================== */
/* ====================== [ Start navbar ] ====================== */
.navbar {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  margin: 0;
  width: 100%;
  background: #00254600;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  z-index: 999;
  min-height: 80px; }
  .navbar .icon-bar {
    color: #fff; }
.navbar .navbar-nav .nav-link {
   
   font-size: 13px;
    color: #fff;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
    padding: 15px 4px;
    margin: 4px;
    text-shadow: 0px 0px 5px #555;
}
.nav-scroll .navbar-nav .nav-link {
  text-shadow: 0px 0px 0px transparent;
}
  .navbar .navbar-nav .dropdown-menu {
    padding: 10px 0;
    border: 0;
    -webkit-box-shadow: 0px 10px 40px -4px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 10px 40px -4px rgba(0, 0, 0, 0.1); }
  .navbar .navbar-nav .dropdown-item {
    font-size: 13px;
    padding: 10px 20px;
    opacity: .9; }
    .navbar .navbar-nav .dropdown-item:hover {
      background: transparent;
      color: #002546; }
  .navbar .dropdown-menu {
    display: block;
    opacity: 0;
    visibility: hidden;
    border-radius: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s; }
    .navbar .dropdown-menu.show {
      opacity: 1;
      visibility: visible;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0); }
    .navbar .dropdown-menu .dropdown-item {
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      padding: 10px 25px;
      position: relative; }
      .navbar .dropdown-menu .dropdown-item:after {
        content: '';
        width: 0px;
        height: 1px;
        background: #002546;
        position: absolute;
        left: 10px;
        top: 50%;
        -webkit-transition: all .4s;
        -o-transition: all .4s;
        transition: all .4s; }
      .navbar .dropdown-menu .dropdown-item:hover {
        padding-left: 30px; }
        .navbar .dropdown-menu .dropdown-item:hover:after {
          width: 10px; }
  .navbar .social-icon {
    padding: 0 20px;
    border-left: 1px solid rgba(255, 255, 255, 0.1); }
    .navbar .social-icon a {
      color: #fff;
      margin: 0 10px;
      font-size: 13px; }
  .navbar .search {
    color: #fff;
    padding-left: 30px;
    border-left: 1px solid rgba(255, 255, 255, 0.1); }
    .navbar .search .icon {
      cursor: pointer; }
    .navbar .search .search-form {
      position: fixed;
      width: 100%;
      height: 100vh;
      top: 0;
      left: 0;
      background: rgba(37, 37, 49, 0.98);
      display: none; }
      .navbar .search .search-form form {
        width: 600px;
        position: absolute;
        left: calc(50% - 300px);
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%); }
        .navbar .search .search-form form input {
          padding: 15px 0;
          font-size: 80px;
          color: #fff;
          text-transform: uppercase;
          text-align: left;
          background: transparent;
          border: 0;
          border-bottom: 2px solid #002546; }
      .navbar .search .search-form .close {
        position: absolute;
        top: 20%;
        right: 20%;
        color: #fff;
        font-size: 60px;
        opacity: 1;
        cursor: pointer; }

.light, .nav-scroll {
  background: #fff;
  -webkit-box-shadow: 0px 10px 30px rgba(37, 37, 49, 0.1);
  box-shadow: 0px 10px 30px rgba(37, 37, 49, 0.1);
  padding: 0;
  position: fixed;
  top: -80px;
  -webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s;
  -o-transition: transform .5s;
  transition: transform .5s;
  transition: transform .5s, -webkit-transform .5s;
  -webkit-transform: translateY(80px);
  -ms-transform: translateY(80px);
  transform: translateY(80px); }
  .light .icon-bar, .nav-scroll .icon-bar {
    color: #222; }
  .light .navbar-nav .nav-link, .nav-scroll .navbar-nav .nav-link {
    color: #222; }
  .light .navbar-nav .logo, .nav-scroll .navbar-nav .logo {
    width: 100px;
    padding: 15px 0;
    color: #111; }
  .light .social-icon, .nav-scroll .social-icon {
    border-left: 1px solid rgba(0, 0, 0, 0.1); }
    .light .social-icon a, .nav-scroll .social-icon a {
      color: #000; }
  .light .search, .nav-scroll .search {
    color: #000;
    border-left: 1px solid rgba(0, 0, 0, 0.1); }

/* ====================== [ End navbar ] ====================== */
/* ====================== [ Start Slider ] ====================== */
.slider {
  position: relative; }
  .slider.fixed-slider {
    position: fixed;
    top: 0;
    left: 0;
    right: 0; }
  .slider .swiper-slide-active {
    z-index: 3; }
  .slider .parallax-slider {
    position: relative; }
    .slider .parallax-slider .swiper-slide {
      position: relative;
      overflow: hidden;
      width: 100%;
      min-height: 120vh;
      padding-bottom: 50px; }
      .slider .parallax-slider .swiper-slide .bg-img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-size: cover; }
    .slider .parallax-slider .swiper-slide-active .caption h1 {
      -webkit-transition: all 0s;
      -o-transition: all 0s;
      transition: all 0s;
      opacity: 1;
      visibility: visible;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0); }
      .slider .parallax-slider .swiper-slide-active .caption h1 .char {
        -webkit-animation: fadeInUp 0.5s cubic-bezier(0.3, 0, 0.7, 1) both;
        animation: fadeInUp 0.5s cubic-bezier(0.3, 0, 0.7, 1) both;
        -webkit-animation-delay: calc(60ms * var(--char-index));
        animation-delay: calc(60ms * var(--char-index)); }
    .slider .parallax-slider .swiper-slide-active .caption .thin,
    .slider .parallax-slider .swiper-slide-active .caption .btn-curve,
    .slider .parallax-slider .swiper-slide-active .caption p {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0); }
    .slider .parallax-slider .caption .thin {
      color: #002546;
      font-size: 30px;
      font-weight: 300;
      text-transform: uppercase;
      letter-spacing: 8px;
      margin-bottom: 5px;
      opacity: 0;
      -webkit-transform: translateY(-20px);
      -ms-transform: translateY(-20px);
      transform: translateY(-20px);
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      -webkit-transition-delay: .8s;
      -o-transition-delay: .8s;
      transition-delay: .8s; }
      .slider .parallax-slider .caption .thin span {
        color: #002546; }
    .slider .parallax-slider .caption h1 {
		    position: relative;
			z-index:100;
   word-spacing: 10px;
    font-size: 50px;
    font-weight: 700;
    letter-spacing: -2px;
      color: #fff;
      opacity: 0;
      visibility: hidden;
      -webkit-transition: opacity .5s,
 visibility .5s;
      -o-transition: opacity .5s,
 visibility .5s;
      transition: opacity .5s,
 visibility .5s; }
      .slider .parallax-slider .caption h1 span {
        font-weight: 700; }
    .slider .parallax-slider .caption p {
		float: none;
      color: #eee;
      opacity: 0;
      -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
      transform: translateY(20px);
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      -webkit-transition-delay: .8s;
      -o-transition-delay: .8s;
      transition-delay: .8s; }
    .slider .parallax-slider .caption .btn-curve {
      opacity: 0;
      -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
      transform: translateY(20px);
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      -webkit-transition-delay: 1s;
      -o-transition-delay: 1s;
      transition-delay: 1s; }
    .slider .parallax-slider .hmone h1 .thin {
      font-size: 30px;
      margin-bottom: 20px; }
  .slider .caption.center h1 {
    font-size: 75px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 2px;
    margin-bottom: 20px; }
  .slider .setone {
    position: absolute;
    bottom: 8%;
    right: 40px;
    z-index: 8; }
    .slider .setone .swiper-nav-ctrl {
      color: #ccc;
      font-size: 13px;
      width: 55px;
      height: 55px;
      line-height: 55px;
      text-align: center;
      margin: 5px 0;
      border: 1px solid rgba(255, 255, 255, 0.3);
      position: static; }
      .slider .setone .swiper-nav-ctrl:after {
        display: none; }
    .slider .setone.setwo {
      position: static; }
      .slider .setone.setwo .swiper-nav-ctrl {
        border-radius: 50%; }
      .slider .setone.setwo .next-ctrl {
        position: absolute;
        top: 50%;
        right: 30px; }
      .slider .setone.setwo .prev-ctrl {
        position: absolute;
        top: 50%;
        left: 30px; }
  .slider .swiper-pagination-fraction.top {
    position: absolute;
    right: 15%;
    left: auto;
    bottom: auto;
    top: 20%;
    width: auto;
    color: #fff;
    font-size: 40px;
    font-weight: 500; }
    .slider .swiper-pagination-fraction.top .swiper-pagination-current {
      font-size: 60px;
      font-weight: 700;
      position: relative;
      color: transparent;
      -webkit-text-stroke: .5px #fff; }
      .slider .swiper-pagination-fraction.top .swiper-pagination-current:after {
        content: '/';
        color: #fff;
        position: relative;
        margin: 0 10px;
        font-size: 12px;
        font-weight: 100; }
    .slider .swiper-pagination-fraction.top.botm {
      top: auto;
      bottom: 40px;
      right: 40px; }
  .slider .social-icon {
    position: absolute;
    left: 40px;
    bottom: 40px;
    z-index: 8; }
    .slider .social-icon a {
      width: 40px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      border-radius: 50%;
      border: 1px solid rgba(255, 255, 255, 0.05);
      color: #fff;
      font-size: 13px; }

.slid-half {
  position: relative; }
  .slid-half .nofull {
    position: relative;
    overflow: hidden;
    background-color: #252531;
    background-image: url(../img/line-pattern1.png);
    background-repeat: repeat;
    height: 105vh;
    color: #fff; }
  .slid-half .swiper-pagination-fraction.top {
    position: absolute;
    right: 15%;
    left: auto;
    bottom: auto;
    top: 20%;
    width: auto;
    color: #fff;
    font-size: 40px;
    font-weight: 500; }
    .slid-half .swiper-pagination-fraction.top .swiper-pagination-current {
      font-size: 60px;
      font-weight: 700;
      position: relative;
      color: transparent;
      -webkit-text-stroke: .5px #fff; }
      .slid-half .swiper-pagination-fraction.top .swiper-pagination-current:after {
        content: '/';
        color: #fff;
        position: relative;
        margin: 0 10px;
        font-size: 12px;
        font-weight: 100; }

.cta__slider-wrapper {
  position: relative;
  width: 100%;
  height: 105vh;
  overflow: hidden; }
  .cta__slider-wrapper .block {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0; }

.cta__slider {
  min-height: 105vh; }
  .cta__slider .swiper-slide {
    overflow: hidden; }

.cta__slider-arrows {
  display: block;
  position: absolute;
  bottom: 40px;
  right: 40px;
  z-index: 2; }

.cta__slider-arrow {
  width: 55px;
  height: 55px;
  text-align: center;
  line-height: 55px;
  font-size: 13px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  display: block;
  cursor: pointer; }
  .cta__slider-arrow.cta__slider-arrow--previous {
    left: 0; }
  .cta__slider-arrow.cta__slider-arrow--next {
    left: 50%; }

.cta__slider-item {
  position: relative; }
  .cta__slider-item .media-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0; }
    .cta__slider-item .media-wrapper .bg-img {
      position: absolute;
      width: 70%;
      height: 100%;
      right: 0;
      top: 0; }
  .cta__slider-item .container {
    position: relative;
    z-index: 4; }
  .cta__slider-item .caption {
    position: relative; }
    .cta__slider-item .caption .top-corn,
    .cta__slider-item .caption .bottom-corn {
      position: absolute;
      left: -60px;
      top: -60px;
      opacity: .3; }
      .cta__slider-item .caption .top-corn:after, .cta__slider-item .caption .top-corn:before,
      .cta__slider-item .caption .bottom-corn:after,
      .cta__slider-item .caption .bottom-corn:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        background: #002546; }
      .cta__slider-item .caption .top-corn:after,
      .cta__slider-item .caption .bottom-corn:after {
        width: 30px;
        height: 1px; }
      .cta__slider-item .caption .top-corn:before,
      .cta__slider-item .caption .bottom-corn:before {
        width: 1px;
        height: 30px; }
    .cta__slider-item .caption .bottom-corn {
      top: auto;
      bottom: -60px; }
      .cta__slider-item .caption .bottom-corn:before {
        top: auto;
        bottom: 0; }
    .cta__slider-item .caption h1 {
      font-size: 75px;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 4px;
      color: #fff;
      opacity: 0;
      visibility: hidden;
      -webkit-transition: opacity .5s,
 visibility .5s;
      -o-transition: opacity .5s,
 visibility .5s;
      transition: opacity .5s,
 visibility .5s; }
    .cta__slider-item .caption .thin {
      color: #002546;
      font-size: 20px;
      font-weight: 300;
      text-transform: uppercase;
      letter-spacing: 12px;
      margin-bottom: 5px;
      opacity: 0;
      -webkit-transform: translateY(-20px);
      -ms-transform: translateY(-20px);
      transform: translateY(-20px);
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      -webkit-transition-delay: .8s;
      -o-transition-delay: .8s;
      transition-delay: .8s; }
    .cta__slider-item .caption p {
      color: #eee;
      font-weight: 300;
      font-size: 14px;
      opacity: 0;
      -webkit-transform: translateY(-20px);
      -ms-transform: translateY(-20px);
      transform: translateY(-20px);
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      opacity: 0;
      -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
      transform: translateY(20px);
      transition: all .4s;
      -webkit-transition-delay: .8s;
      -o-transition-delay: .8s;
      transition-delay: .8s; }
    .cta__slider-item .caption .btn-curve {
      opacity: 0;
      -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
      transform: translateY(20px);
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      -webkit-transition-delay: 1s;
      -o-transition-delay: 1s;
      transition-delay: 1s; }
  .cta__slider-item.swiper-slide-active .caption h1 {
    -webkit-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s;
    opacity: 1;
    visibility: visible; }
    .cta__slider-item.swiper-slide-active .caption h1 .char {
      -webkit-animation: fadeInUp 0.5s cubic-bezier(0.3, 0, 0.7, 1) both;
      animation: fadeInUp 0.5s cubic-bezier(0.3, 0, 0.7, 1) both;
      -webkit-animation-delay: calc(60ms * var(--char-index));
      animation-delay: calc(60ms * var(--char-index)); }
  .cta__slider-item.swiper-slide-active .caption .btn-curve,
  .cta__slider-item.swiper-slide-active .caption .thin,
  .cta__slider-item.swiper-slide-active .caption p {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); }

.pages-header {
  height: 35vh; }
  .pages-header .cont h1 {
    font-size: 75px;
    margin-bottom: 20px; }
	
	@media screen and (max-width: 1300px) {
		
		
		 .pages-header .cont .path {
	 
    bottom: -120px !important;
     }
	}
	@media screen and (max-width: 1000px) {
	.pages-header .cont .path {
    bottom: -80px !important;
    left: 32px !important;
}
}
	
.pages-header .cont .path a{
	color: #fff;
    font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 14px;
   
    letter-spacing: 0px;
   
}

.pages-header .cont .path {
   
    position: absolute;
    color: #fff;
    font-size: 25px;
    left: 20px;
    bottom: -100px;
}
    .pages-header .cont .path .active {
      color: #c1c1c1; }
    .pages-header .cont .path span {
      margin: 0 20px;
      font-size: 10px; }

/* ====================== [ End Slider ] ====================== */
/* ====================== [ Start Intro ] ====================== */
.about {
  position: relative; }
  .about .exp-img .img {
    width: 100%;
    height: 520px;
    position: relative;
    z-index: 2; }
/*     .about .exp-img .img:after {
      content: '';
      position: absolute;
      top: 40px;
      left: 40px;
      right: 40px;
      bottom: 40px;
      background-image: url(../img/exp1.jpg);
      z-index: -1; } */
    .about .exp-img .img .since {
      position: absolute;
      right: 70px;
      top: 70px; }
      .about .exp-img .img .since span {
        display: block;
        color: #002546;
        font-size: 22px;
        font-weight: 700;
        text-transform: uppercase;
        line-height: 1; }
        .about .exp-img .img .since span:first-of-type {
          font-size: 16px;
          font-weight: 600;
          letter-spacing: 2px; }
    .about .exp-img .img .years {
      position: absolute;
      left: 70px;
      bottom: 70px; }
      .about .exp-img .img .years h2 {
        font-size: 140px;
        font-weight: 800;
        background: url(../img/exp.jpg) no-repeat;
        background-position: 18% 65%;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        line-height: 1; }
      .about .exp-img .img .years h5 {
        color: #002546;
        letter-spacing: 5px;
        font-size: 20px; }
  .about .exp-content {
    position: relative;
    z-index: 2; }
    .about .exp-content:after {
      content: '';
      width: 200px;
      height: 250px;
      position: absolute;
      top: -40px;
      right: -40px;
      border: 10px solid #fafafa;
      z-index: -1; }
    .about .exp-content.nopat:after {
      display: none; }
    .about .exp-content ul {
      margin: 30px 0 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
      .about .exp-content ul li {
        font-size: 10px;
        font-weight: 500;
        letter-spacing: 4px;
        text-transform: uppercase; }
        .about .exp-content ul li:after {
          content: '/';
          position: relative;
          margin: 0 15px;
          color: #777; }
        .about .exp-content ul li:last-of-type:after {
          display: none; }
  .about .ab-exp .pattern {
    height: 100%;
    width: 100%; }
  .about .ab-exp .years-exp {
    position: relative;
    height: 100%;
    width: 100%;
    border: 10px solid #1e6694; }
    .about .ab-exp .years-exp .exp-text {
      position: absolute;
      bottom: 40px;
      left: -10px;
      padding: 10px 0;
      width: -webkit-max-content;
      width: -moz-max-content;
      width: max-content;
      background: #fff; }
      .about .ab-exp .years-exp .exp-text h2 {
        font-size: 70px;
        line-height: 1;
        display: inline-block;
        position: relative;
        z-index: 2; }
        .about .ab-exp .years-exp .exp-text h2:after {
          content: '';
          width: 40px;
          height: 40px;
          border-radius: 50%;
          background: #1e6694;
          position: absolute;
          right: -15px;
          top: -15px;
          z-index: -1; }
      .about .ab-exp .years-exp .exp-text h6 {
        font-size: 14px; }
  .about .specialty ul {
    margin: 0; }
    .about .specialty ul li {
      width: -webkit-max-content;
      width: -moz-max-content;
      width: max-content;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: 1px;
      text-transform: uppercase;
      padding: 0 0 15px;
      border-bottom: 1px solid #f1f1f1;
      margin-bottom: 30px; }
      .about .specialty ul li span {
        font-size: 14px;
        font-weight: 300;
        color: #999;
        margin-right: 30px; }
      .about .specialty ul li:last-of-type {
        margin-bottom: 0; }
  .about .pat {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40%;
    z-index: 2; }
    .about .pat:after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: #fff;
      opacity: .94; }

.intro-section .item h6 {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 4px;
  text-transform: uppercase;
  margin-bottom: 10px; }

/* ====================== [ End Intro ] ====================== */
/* ====================== [ Start services ] ====================== */
.services .bord-box {
  overflow: hidden; }

.services .box-top {
  position: relative;
  margin-top: -80px;
  z-index: 4; }

.services .feat-top {
  padding: 100px 80px;
  position: relative;
  width: 80%;
  margin-top: -40px;
  z-index: 3; }
  .services .feat-top .notfull {
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    -webkit-transition: all 0.7s cubic-bezier(1, 0, 0.25, 1);
    -o-transition: all 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: all 0.7s cubic-bezier(1, 0, 0.25, 1);
    -webkit-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s; }
    .services .feat-top .notfull.animated {
      width: 100%; }

.services .item-bx {
  padding: 60px 40px;
      height: 450px;
  background-color: #fff;
  border: 1px solid #eee;
  border-right: 0;
  -webkit-transition: all .4s;
  -o-transition: all .4s;
  transition: all .4s; }
  .services .item-bx:last-of-type {
    border-right: 1px solid #eee; }
  .services .item-bx:hover {
    background-color: #002546;
    color: #fff; }
	
	.services .item-bx:hover {
    background-color: #002546;
    color: #fff;
}
    .services .item-bx .playfont:hover{
    color: #fff; }
    .services .item-bx:hover .more {
      color: #002546; }
  .services .item-bx .numb {
    font-size: 45px;
    margin-bottom: 10px;
    color: #ffffffdb;
    -webkit-text-stroke: 1px #002546;
  position: absolute;
  top: 0;
  right: 10px; }
  .services .item-bx .icon {
    font-size: 60px;
    color: #002546;
    margin-bottom: 30px; }
  .services .item-bx .more {
    font-size: 20px; }
  .services .item-bx.bg-img {
    position: relative;
    border: 0;
    z-index: 2; }
    .services .item-bx.bg-img:hover:after {
      background: rgba(0, 0, 0, 0.6); }
    .services .item-bx.bg-img:after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: #fff;
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      z-index: -1; }

.services .item-sm h6 {
  font-weight: 600;
  font-size: 18px; }

.services .item-sm .numb {
  font-size: 40px;
  font-weight: 400;
  color: #002546;
  padding-right: 70px;
  line-height: 1;
  position: relative; }
  .services .item-sm .numb:after {
    content: '';
    position: absolute;
    right: 10px;
    bottom: 10px;
    background: #ddd;
    width: 50px;
    height: 1px; }

.services.halfbg .background {
  height: 70vh; }

.services.halfbg .ontop {
  position: relative;
  margin-top: -120px;
  z-index: 3; }
  .services.halfbg .ontop .item-bx:hover {
    background: #002546; }
    .services.halfbg .ontop .item-bx:hover .numb, .services.halfbg .ontop .item-bx:hover .more {
      color: #fff; }

/* ====================== [ End services ] ====================== */
/* ====================== [ Start brands ] ====================== */
.brands .box-top {
  padding: 40px 30px;
  background: #fff;
  -webkit-box-shadow: 0 0 45px rgba(10, 10, 10, 0.06);
  box-shadow: 0 0 45px rgba(10, 10, 10, 0.06);
  border-radius: 20px;
  position: relative;
  margin-top: -50px;
  z-index: 3; }
  .brands .box-top .item {
    text-align: center;
    margin: 15px 0; }

/* ====================== [ End brands ] ====================== */
/* ====================== [ Start Numbers & Counter  ] ====================== */
.numbers .item {
  position: relative; }
  .numbers .item:after {
    width: 35px;
    height: 35px;
    bottom: 0;
    background: #f7f7f7; }
  .numbers .item:before {
    width: 0;
    height: 0;
    border-top: 35px solid transparent;
    border-right: 35px solid #f7f7f7;
    bottom: 35px; }
  .numbers .item:before, .numbers .item:after {
    content: '';
    position: absolute;
    right: 20%;
    z-index: -1; }
  .numbers .item h3 {
    margin-bottom: 10px; }
    .numbers .item h3 span {
      font-size: 60px;
      color: #002546; }
    .numbers .item h3 i {
      font-size: 30px;
      font-weight: 300;
      font-style: normal;
      color: #777;
      margin-left: 15px; }
  .numbers .item h6 {
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2px; }

/* ====================== [ End Numbers & Counter  ] ====================== */
/* ====================== [ Start Work ] ====================== */
.portfolio .filtering .filter {
  padding: 15px; }
  .portfolio .filtering .filter.box {
    -webkit-box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
    display: inline-block; }

.portfolio .filtering span {
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 20px;
  cursor: pointer;
  position: relative; }
  .portfolio .filtering span.active {
    color: #002546; }
  .portfolio .filtering span:after {
    content: '';
    width: 7px;
    height: 7px;
    background: #002546;
    border-radius: 50%;
    position: absolute;
    right: -24px;
    top: 40%; }
  .portfolio .filtering span:last-of-type:after {
    display: none; }

.portfolio .gallery .items {
  padding: 0 15px; }
  .portfolio .gallery .items .item-img {
    overflow: hidden;
    position: relative;
    height: 440px; }
    .portfolio .gallery .items .item-img > a {
      display: block; }
    .portfolio .gallery .items .item-img:hover .item-img-overlay {
      opacity: 1;
      visibility: visible; }
    .portfolio .gallery .items .item-img img {
      height: 100%;
      width: 100%;
      -o-object-fit: cover;
      object-fit: cover;
      -webkit-transition: all .5s;
      -o-transition: all .5s;
      transition: all .5s; }
    .portfolio .gallery .items .item-img:after, .portfolio .gallery .items .item-img:before {
      content: '';
      position: absolute;
      background: #fff;
      z-index: 2;
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s; }
    .portfolio .gallery .items .item-img:after {
      width: 50px;
      height: 1px;
      top: 50%;
      left: -100px; }
    .portfolio .gallery .items .item-img:before {
      height: 50px;
      width: 1px;
      left: 50%;
      top: -100px; }
    .portfolio .gallery .items .item-img:hover:after {
      left: 50%;
      -webkit-transform: translateX(-25px);
      -ms-transform: translateX(-25px);
      transform: translateX(-25px); }
    .portfolio .gallery .items .item-img:hover:before {
      top: 50%;
      -webkit-transform: translateY(-25px);
      -ms-transform: translateY(-25px);
      transform: translateY(-25px); }
  .portfolio .gallery .items .item-img-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(38, 38, 40, 0.5);
    text-align: center;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    opacity: 0;
    visibility: hidden; }
  .portfolio .gallery .items .info {
    background-image: url(../img/line-pattern.png);
    padding: 10px 20px; }
    .portfolio .gallery .items .info h5 {
      font-size: 18px;
      font-weight: 700;
      text-transform: uppercase; }
    .portfolio .gallery .items .info span {
      color: #777;
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: 4px; }

.portfolio .gallery.twsty .items {
  width: 50%; }

.portfolio .gallery.twsty .four-column {
  width: 25% !important; }
  .portfolio .gallery.twsty .four-column .item-img {
    height: 300px; }

.portfolio .gallery.twsty .three-column {
  width: 33.333333% !important; }

.portfolio .gallery.inf-lit .items {
  position: relative; }
  .portfolio .gallery.inf-lit .items:hover .info {
    opacity: 1;
    -webkit-transform: translate(0) skew(0);
    -ms-transform: translate(0) skew(0);
    transform: translate(0) skew(0);
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s; }
  .portfolio .gallery.inf-lit .items .info {
    background: #fff;
    position: absolute;
    bottom: 0;
    left: 15px;
    width: 90%;
    padding: 15px;
    -webkit-transform: translateX(-30px) translateY(30px) skew(10deg);
    -ms-transform: translateX(-30px) translateY(30px) skew(10deg);
    transform: translateX(-30px) translateY(30px) skew(10deg);
    opacity: 0;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s; }
    .portfolio .gallery.inf-lit .items .info h5 {
		font-family: 'Viga-Regular', serif;
      font-weight: 600;
      text-transform: capitalize; }
    .portfolio .gallery.inf-lit .items .info span {
      text-transform: capitalize;
      letter-spacing: 1px; }

.portfolio.full-bg {
  position: relative; }
  .portfolio.full-bg .cluom {
    height: 90vh;
    padding: 0;
    position: relative;
    z-index: 2;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s; }
    .portfolio.full-bg .cluom.current {
      background: rgba(0, 0, 0, 0.3); }
    .portfolio.full-bg .cluom:hover .info {
      color: inherit; }
      .portfolio.full-bg .cluom:hover .info:after {
        height: 100%; }
    .portfolio.full-bg .cluom:hover .more {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0);
      opacity: 1; }
    .portfolio.full-bg .cluom .info {
      padding: 40px 10px 40px 20px;
      color: #fff;
      position: relative;
      z-index: 2;
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s;
      overflow: hidden; }
      .portfolio.full-bg .cluom .info:after {
        content: '';
        position: absolute;
        top: 0;
        left: -2%;
        width: 104%;
        height: 0;
        background: #fff;
        z-index: -1;
        -webkit-transition: all .4s;
        -o-transition: all .4s;
        transition: all .4s; }
      .portfolio.full-bg .cluom .info h6 {
        font-size: 11px;
        font-weight: 400;
        letter-spacing: 4px;
        text-transform: uppercase;
        margin-bottom: 10px; }
      .portfolio.full-bg .cluom .info h5 {
        font-size: 21px; }
    .portfolio.full-bg .cluom .more {
      position: absolute;
      bottom: 50px;
      right: 50px;
      color: #fff;
      font-size: 13px;
      letter-spacing: 1px;
      text-transform: uppercase;
      -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
      transform: translateY(20px);
      opacity: 0;
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s; }
      .portfolio.full-bg .cluom .more i {
        font-size: 10px;
        margin-left: 2px; }
  .portfolio.full-bg .glry-img,
  .portfolio.full-bg .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .portfolio.full-bg .glry-img {
    overflow: hidden; }
    .portfolio.full-bg .glry-img .bg-img {
      -webkit-transform: scale(1.1, 1.1);
      -ms-transform: scale(1.1, 1.1);
      transform: scale(1.1, 1.1);
      opacity: 0;
      -webkit-transition: all .7s;
      -o-transition: all .7s;
      transition: all .7s;
      background-size: cover;
      background-position: center center; }
      .portfolio.full-bg .glry-img .bg-img.current {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        opacity: 1; }

.work-carousel .swiper-slide {
  padding: 0px 15px; }

.work-carousel .swiper-button-next,
.work-carousel .swiper-button-prev {
  color: #000;
  width: 60px;
  height: 60px;
  border-radius: 0;
  border: 0;
  background: #fff;
  opacity: 0;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s; }
  .work-carousel .swiper-button-next:after,
  .work-carousel .swiper-button-prev:after {
    display: none; }

.work-carousel:hover .swiper-button-next,
.work-carousel:hover .swiper-button-prev {
  opacity: 1; }

.work-carousel .content {
  position: relative; }
  .work-carousel .content .item-img {
    position: relative;
    height: 480px;
    line-height: 0; }
  .work-carousel .content:hover .item-ig {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
  .work-carousel .content .cont {
    color: #fff;
    margin-top: 30px;
    text-align: center; }
    .work-carousel .content .cont h6 {
      color: #002546;
      font-size: 12px;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 2px;
      margin-bottom: 10px; }
    .work-carousel .content .cont h4 {
      font-weight: 600;
      font-size: 24px; }

.work-carousel.dark {
  background: #252531 !important;
  color: #fff; }

/* ====================== [ End Work ] ====================== */
/* ====================== [ Start services ] ====================== */
.process .coulmn {
  position: relative; }
  .process .coulmn:after {
    position: absolute;
    content: '';
    width: 75px;
    border-top: 2px dashed #002546;
    top: 75px;
    right: -35px; }

.process .item {
  text-align: center; }
  .process .item .bg-img {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    margin: 0 auto 30px;
    text-align: center;
    position: relative; }
    .process .item .bg-img:after {
      content: '';
      position: absolute;
      top: 7px;
      left: 7px;
      right: 7px;
      bottom: 7px;
      border-radius: 50%;
      background: rgba(0, 0, 0, 0.25); }
    .process .item .bg-img h3 {
      color: #fff;
      font-size: 40px;
      font-weight: 300;
      line-height: 150px;
      position: relative;
      z-index: 3; }

/* ====================== [ End services ] ====================== */
/* ====================== [ Start progress bar ] ====================== */
.skills-circle .skill {
  position: relative; }
  .skills-circle .skill span {
    width: 150px;
    height: 150px;
    line-height: 150px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-75px) translateY(-98px);
    -ms-transform: translateX(-75px) translateY(-98px);
    transform: translateX(-75px) translateY(-98px);
    font-size: 40px;
    font-weight: 300; }
  .skills-circle .skill h6 {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-top: 20px; }

.skills-sec .skill-item {
  margin-bottom: 50px; }
  .skills-sec .skill-item:last-of-type {
    margin-bottom: 0; }

.skills-sec h6 {
  font-size: 13px;
  font-weight: 300;
  font-style: italic;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 10px; }

.skills-sec .skill-progress {
  height: 7px;
  background-color: #f7f7f7;
  position: relative; }
  .skills-sec .skill-progress .progres {
    position: absolute;
    height: 100%;
    width: 0;
    top: 0;
    left: 0;
    background-color: #333;
    -webkit-transition: all 1.5s;
    -o-transition: all 1.5s;
    transition: all 1.5s; }
    .skills-sec .skill-progress .progres:after {
      content: attr(data-value);
      position: absolute;
      right: 10px;
      top: -30px;
      font-size: 20px;
      font-weight: 100; }
    .skills-sec .skill-progress .progres:before {
      content: '';
      width: 1px;
      height: 30px;
      background: #333;
      position: absolute;
      right: 0;
      bottom: 0; }

.play-button {
  position: relative;
  width: 85px;
  height: 85px;
  margin: auto;
  -webkit-transform: scale(1.3);
  -ms-transform: scale(1.3);
  transform: scale(1.3);
  z-index: 4; }

.play-button svg {
  position: absolute;
  width: 100%;
  height: 100%; }

.circle-fill circle {
  opacity: 1;
  fill: rgba(255, 255, 255, 0.1); }

.polygon {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 90px;
  font-size: 35px;
  z-index: 2; }

.play-button svg.circle-fill {
  z-index: 1;
  stroke-dasharray: 322;
  stroke-dashoffset: 322;
  -webkit-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg); }

.play-button:hover svg.circle-fill {
  stroke-dashoffset: 38.5; }

.play-button svg.circle-track {
  z-index: 0; }

.play-button.color {
  color: #002546; }
  .play-button.color .circle-fill circle {
    fill: rgba(177, 151, 119, 0.2); }

/* ====================== [ End progress bar ] ====================== */
/* ====================== [ Start tabs before & after section ] ====================== */
.after-before {
  position: relative;
  color: #fff; }
  .after-before .background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    z-index: -1; }
  .after-before .dotsbg {
    position: relative; }
    .after-before .dotsbg:after {
      content: '';
      background-image: url(../img/line-pattern1.png);
      background-repeat: repeat;
      position: absolute;
      bottom: -60px;
      left: 10%;
      right: 10%;
      height: 40%;
      z-index: -1; }

/* ====================== [ Start tabs before & after section ] ====================== */
/* ====================== [ 20 Start call-action ] ====================== */
.call-action {
  background-color: #020202;
  color: #fff; }
  .call-action.gray {
    background: #f8f8f8; }
    .call-action.gray .content h6 {
      color: #777;
      font-size: 14px;
      font-weight: 500; }
      .call-action.gray .content h6 span {
        color: #777; }
    .call-action.gray .content h2 {
      font-size: 5vw;
      font-weight: 700;
      margin-bottom: 20px;
      -webkit-text-stroke-width: 1px;
      -webkit-text-stroke-color: #333; }
      .call-action.gray .content h2 b span {
        color: #333;
        -webkit-text-stroke-width: 0; }
    .call-action.gray .tlink {
      border-bottom: 1px solid #333; }
  .call-action:before {
    background-image: url(../www.smartinnovates.com/uithemez/archo/img/giphy.html);
    background-repeat: repeat;
    opacity: .04; }
  .call-action.nogif {
    position: relative;
    padding: 80px 0;
    background: #0a0a0a;
    z-index: 2;
    overflow: hidden; }
    .call-action.nogif:before {
      display: none; }
    .call-action.nogif:after {
      content: '';
      height: 0;
      width: 100%;
      position: absolute;
      top: auto;
      right: 0;
      bottom: 0;
      -webkit-transition: height 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
      -o-transition: height 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
      transition: height 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
      background: #0c0c0c;
      z-index: -1; }
    .call-action.nogif:hover:after {
      height: 100%;
      top: 0;
      bottom: auto; }
  .call-action .content h6 {
    color: #002546;
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-bottom: 10px; }
    .call-action .content h6 span {
      color: #002546; }
  .call-action .content h2 {
    font-size: 6vw;
    font-weight: 800;
    margin-bottom: 20px;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #fff;
    color: transparent; }
    .call-action .content h2 span {
      color: transparent; }
    .call-action .content h2 .word {
      margin-right: 15px; }
    .call-action .content h2 b span {
      color: #fff;
      -webkit-text-stroke-width: 0; }
  .call-action .content p {
    font-size: 17px;
    font-weight: 300; }
  .call-action .tlink {
    margin-left: auto;
    border-bottom: 1px solid #eee; }
  .call-action.next {
    position: relative;
    z-index: 2;
    overflow: hidden; }
    .call-action.next:after {
      display: none; }
    .call-action.next:before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      display: block;
      background: #0a0a0a;
      opacity: 1;
      -webkit-transition: all .5s;
      -o-transition: all .5s;
      transition: all .5s; }
    .call-action.next .content h2 {
      font-size: 5vw;
      font-weight: 700; }
      .call-action.next .content h2 b {
        font-weight: 700; }
    .call-action.next .nxt-img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      -webkit-transform: scale(1.4);
      -ms-transform: scale(1.4);
      transform: scale(1.4);
      background-size: cover;
      background-position: center;
      z-index: -1;
      -webkit-transition: all 1s linear;
      -o-transition: all 1s linear;
      transition: all 1s linear; }
    .call-action.next:hover:before {
      opacity: .9; }
    .call-action.next:hover .nxt-img {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1);
      -webkit-transition: all 10s linear;
      -o-transition: all 10s linear;
      transition: all 10s linear; }

.video-wrapper {
  min-height: 500px; }
  .video-wrapper .vid {
    position: relative;
    z-index: 8; }
    .video-wrapper .vid .vid-butn:hover .icon {
      color: #fff; }
      .video-wrapper .vid .vid-butn:hover .icon:before {
        -webkit-transform: scale(0);
        -ms-transform: scale(0);
        transform: scale(0); }
    .video-wrapper .vid .vid-butn .icon {
      color: #212529;
      width: 100px;
      height: 100px;
      border: 1px solid rgba(255, 255, 255, 0.2);
      border-radius: 50%;
      line-height: 100px;
      text-align: center;
      font-size: 17px;
      position: relative;
      -webkit-transition: all .5s;
      -o-transition: all .5s;
      transition: all .5s; }
      .video-wrapper .vid .vid-butn .icon:after {
        content: '';
        position: absolute;
        top: 5px;
        bottom: 5px;
        right: 5px;
        left: 5px;
        border: 1px solid #eee;
        border-radius: 50%;
        z-index: -1; }
      .video-wrapper .vid .vid-butn .icon:before {
        content: '';
        position: absolute;
        top: 5px;
        bottom: 5px;
        right: 5px;
        left: 5px;
        background: #fff;
        border-radius: 50%;
        z-index: -1;
        -webkit-transition: all 0.5s cubic-bezier(1, 0, 0, 1);
        -o-transition: all 0.5s cubic-bezier(1, 0, 0, 1);
        transition: all 0.5s cubic-bezier(1, 0, 0, 1); }

/* ====================== [ End call-action ] ====================== */
/* ====================== [ Start Team ] ====================== */
.team {
  position: relative; }
  .team .team-container {
    width: 140%;
    position: relative; }
    .team .team-container:after {
      content: '';
      position: absolute;
      top: -120px;
      bottom: -120px;
      right: 0;
      width: 80%;
      background: #1e6694;
      z-index: -1; }
  .team .item {
    padding: 0 15px; }
    .team .item .img {
      position: relative;
      overflow: hidden; }
      .team .item .img:hover:after {
        opacity: .5; }
      .team .item .img:hover .social {
        opacity: 1;
        left: 0; }
      .team .item .img:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #111;
        opacity: 0;
        -webkit-transition: all .4s;
        -o-transition: all .4s;
        transition: all .4s; }
      .team .item .img .social {
        position: absolute;
        top: 0;
        left: -40px;
        background-color: #fff;
        padding: 20px 10px;
        z-index: 2;
        opacity: 0;
        -webkit-transition: all .4s;
        -o-transition: all .4s;
        transition: all .4s; }
        .team .item .img .social a {
          display: block;
          font-size: 13px;
          margin-top: 10px;
          color: #002546; }
   .team .item .info {
   position: absolute;
    margin-top: 20px;
    padding: 4px;
    text-align: center;
    top: 32px;
    color: #51bdec;
    margin-left: -0.5px;
    background: #1e6694;
    /* left: 167px; */
}
      .team .item .info h5 {
		  font-family:'Viga-Regular', serif;
        font-size: 18px;
        margin-bottom: 2px; 
		margin-left:5px;}
      .team .item .info span {
        color: #777;
        font-size: 14px; }
  .team .slick-dots {
    bottom: -40px; }
  .team .slick-dots li.slick-active button {
    background: #002546; }
  .team .slick-dots li button {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    opacity: .8; }
    .team .slick-dots li button:before {
      content: '';
      width: 4px;
      height: 4px;
      border-radius: 50%;
      position: absolute;
      top: 4px;
      left: 4px;
      line-height: 1;
      background: #002546;
      opacity: 1; }
  .team .dots-half {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2; }

/* ====================== [ End Team ] ====================== */
/* ====================== [ Start Testimonials ] ====================== */
.testimonials.grid .testim {
  position: relative; }
  .testimonials.grid .testim .slick-track {
    padding-top: 15px; }

.testimonials.grid .item {
  position: relative;
  margin: 0 20px; }
  .testimonials.grid .item .quote-icon {
    position: absolute;
    top: -20px;
    right: 12%;
    width: 10%;
    z-index: 2; }
  .testimonials.grid .item .cont {
    padding: 50px 40px 40px;
    border: 10px solid #f7f7f7;
    border-top: 0;
    position: relative; 
  min-height: 525px;}
    .testimonials.grid .item .cont:after, .testimonials.grid .item .cont:before {
      content: '';
      position: absolute;
      height: 10px;
      background: #f7f7f7;
      top: 0; }
    .testimonials.grid .item .cont:after {
      width: 75%;
      left: 0; }
    .testimonials.grid .item .cont:before {
      width: 5%;
      right: 0; }
    .testimonials.grid .item .cont p {
      font-size: 18px;
      font-weight: 400;
      font-style: normal;
      color: #333; 
    font-family: 'Swiss-721-Condensed-BT_43232', sans-serif;}
  .testimonials.grid .item .info {
    margin-top: 30px;
    padding-left: 0px;
    position: relative; }
    .testimonials.grid .item .info:after {
      content: '';
      width: 0;
      height: 0;
      border-top: 25px solid #f7f7f7;
      border-right: 30px solid transparent;
      position: absolute;
      left: 100px;
      top: -30px; 
    display: none;}
    .testimonials.grid .item .info .author {
      width: 70px;
      height: 70px;
      border-radius: 50%;
      overflow: hidden;
      display: table-cell; 
    display: none;}
      .testimonials.grid .item .info .author img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center; }
    .testimonials.grid .item .info h6 {
      display: table-cell;
      vertical-align: middle;
      padding-left: 0px;
      font-size: 22px;
    color: #1971b8; }
      .testimonials.grid .item .info h6 span {
        color: #002546;
        font-size: 13px;
        font-weight: 400;
        margin-top: 5px;
        display: block; }

.testimonials.grid .lit-box .cont {
  background: #fff;
  -webkit-box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05); }

.testimonials.grid .lit-box .info:after {
  border-top-color: #fff !important; }

.testimonials.grid .navs {
  position: absolute;
  top: 30%;
  left: 0;
  width: 100%; }
  .testimonials.grid .navs span {
    padding: 10px 20px;
    background: #1e6694;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0; }
    .testimonials.grid .navs span:hover {
      background: #002546;
      color: #fff; }
  .testimonials.grid .navs .next {
    left: auto;
    right: 0; }

.testimonials.bg-img .item .cont {
  border-color: rgba(255, 255, 255, 0.15); }
  .testimonials.bg-img .item .cont:after, .testimonials.bg-img .item .cont:before {
    background: rgba(255, 255, 255, 0.15); }
  .testimonials.bg-img .item .cont p {
    color: #fff; 
    letter-spacing: .5px}

.testimonials.bg-img .item .info:after {
  border-top-color: rgba(255, 255, 255, 0.15); }

.testimonials.bg-img .navs span {
  color: #002546; }
  .testimonials.bg-img .navs span:hover {
    background: #002546;
    color: #fff; }

/* ====================== [ End Testimonials ] ====================== */
/* ====================== [ Start Blog ] ====================== */
.blog-grid {
  position: relative; }
  .blog-grid .item .post-img .img {
    overflow: hidden; }
  .blog-grid .item .post-img:hover img {
    -webkit-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1); }
  .blog-grid .item .post-img img {
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s; }
  .blog-grid .item .cont {
    position: relative;
    padding: 40px 30px 0;
    width: 92%;
    margin-left: 8%;
    margin-top: -40px;
    background: #fff; }
  .blog-grid .item .info {
    margin-bottom: 15px; }
    .blog-grid .item .info a {
      color: #777;
      font-size: 11px;
      text-transform: uppercase;
      font-weight: 500;
      letter-spacing: 1px;
      margin-right: 10px; }
      .blog-grid .item .info a:last-of-type {
        margin-right: 0; }
      .blog-grid .item .info a i {
        margin-right: 2px; }
    .blog-grid .item .info .tag {
      color: #002546;
      font-weight: 600;
      float: right; }
  .blog-grid .item h5 {
    font-size: 17px;
    line-height: 1.7;
    margin-bottom: 15px; }
  .blog-grid .item .more {
    color: #002546;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-bottom: 1px solid #002546;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s; }
    .blog-grid .item .more:hover {
      border-color: transparent; }
  .blog-grid.center .item {
    text-align: center; }
    .blog-grid.center .item .cont {
      margin-left: 4%;
      padding: 40px; }
      .blog-grid.center .item .cont h5 {
        font-size: 21px; }

.blog-pg .posts .item .img {
  position: relative; }
  .blog-pg .posts .item .img .info {
    position: absolute;
    right: 0;
    top: 0;
    padding: 15px;
    background: #fff; }
    .blog-pg .posts .item .img .info .date {
      text-align: center;
      color: #002546; }
      .blog-pg .posts .item .img .info .date .num {
        display: block;
        font-size: 30px;
        font-weight: 700;
        margin-bottom: 10px;
        padding-bottom: 10px;
        position: relative; }
        .blog-pg .posts .item .img .info .date .num:after {
          content: '';
          width: 30px;
          height: 1px;
          background: #eee;
          position: absolute;
          bottom: 0;
          left: calc(50% - 15px); }
      .blog-pg .posts .item .img .info .date h5 {
        font-size: 14px;
        text-transform: uppercase;
        letter-spacing: 2px; }

.blog-pg .posts .item .content {
  padding-top: 25px; }
  .blog-pg .posts .item .content .tags {
    margin-bottom: 10px; }
    .blog-pg .posts .item .content .tags a {
      font-size: 12px;
      font-weight: 500;
      color: #002546;
      padding-right: 20px;
      position: relative; }
      .blog-pg .posts .item .content .tags a:after {
        content: '';
        width: 8px;
        height: 2px;
        background: #eee;
        position: absolute;
        right: 4px;
        top: 50%; }
      .blog-pg .posts .item .content .tags a:last-of-type {
        padding-right: 0; }
        .blog-pg .posts .item .content .tags a:last-of-type:after {
          display: none; }
  .blog-pg .posts .item .content h4 {
	      font-family: 'Viga-Regular', serif;
    font-weight: 700;
    line-height: 1.6;
    margin-bottom: 5px; }
  .blog-pg .posts .item .content .more {
    margin-top: 20px;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding-left: 60px;
    position: relative;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s; }
    .blog-pg .posts .item .content .more:after {
      content: '';
      width: 50px;
      height: 1px;
      background: #090909;
      position: absolute;
      left: 0px;
      top: 50%;
      -webkit-transition: all .5s;
      -o-transition: all .5s;
      transition: all .5s; }
    .blog-pg .posts .item .content .more:hover {
      padding-left: 40px; }
      .blog-pg .posts .item .content .more:hover:after {
        width: 30px; }

.blog-pg .posts .pagination {
  margin: 80px auto 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  text-align: center; }
  .blog-pg .posts .pagination span {
    text-align: center;
    margin: 0 2px; }
    .blog-pg .posts .pagination span a {
      width: 50px;
      height: 50px;
      line-height: 50px;
      border: 1px solid #eee;
      font-size: 18px; }
    .blog-pg .posts .pagination span.active a {
      border-color: #002546;
      color: #002546; }

.blog-pg.single .post .title-head {
  text-align: center;
  margin-bottom: 50px; }
  .blog-pg.single .post .title-head h2 {
    margin-bottom: 10px; }
  .blog-pg.single .post .title-head a {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin: 0 10px; }

.blog-pg.single .post .main-img .simpleParallax {
  height: 70vh;
  max-height: 600px; }

.blog-pg.single .post .main-img img {
      width: auto;
    display: block;
    margin: 0 auto;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center center;
  object-position: center center; }

.blog-pg.single .post .content p {
  color: #000;
  font-size: 16px;
  font-family: inherit;
  margin: 30px 0; }

.blog-pg.single .post .content ul li {
  margin: 10px 0; }
  .blog-pg.single .post .content ul li span {
    margin-right: 10px;
    font-weight: 500;
    font-size: 13px; }

.blog-pg.single .post .content .quotes {
  background: #fafafa;
  padding: 30px;
  margin: 30px 0; }
  .blog-pg.single .post .content .quotes p {
    color: #111;
    font-size: 18px;
    font-style: italic; }

.blog-pg.single .post .content .spacial p {
  color: #111;
  font-size: 18px;
  font-weight: 500; }

.blog-pg.single .post .content .share-info {
  margin-top: 20px;
  padding-top: 10px;
  border-top: 1px solid #999;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .blog-pg.single .post .content .share-info .social a {
    font-size: 13px;
    margin-right: 20px; }
  .blog-pg.single .post .content .share-info .tags {
    margin-left: auto; }
    .blog-pg.single .post .content .share-info .tags a {
      font-size: 12px;
      margin: 0 10px; }

.blog-pg.single .post .author {
  padding: 30px;
  margin-top: 40px;
  background: #fafafa; }
  .blog-pg.single .post .author .author-img {
    display: table-cell;
    vertical-align: middle;
    width: 140px; }
  .blog-pg.single .post .author .info {
    display: table-cell;
    padding-left: 40px; }
    .blog-pg.single .post .author .info h6 {
      margin-bottom: 10px;
      font-size: 15px; }
      .blog-pg.single .post .author .info h6 span {
        font-weight: 700;
        text-transform: uppercase;
        margin-right: 10px; }
    .blog-pg.single .post .author .info p {
      padding: 0;
      margin: 0; }
    .blog-pg.single .post .author .info .social {
      margin-top: 15px;
      font-size: 13px; }
      .blog-pg.single .post .author .info .social a {
        margin-right: 15px; }

.blog-pg.single .pagination {
  margin-top: 80px;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .blog-pg.single .pagination span {
    width: 100%;
    padding: 20px;
    border-right: 1px solid #eee;
    border-left: 1px solid #eee;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: 1px; }
  .blog-pg.single .pagination .icon {
    border: 0;
    width: 70px; }

.blog-pg.single .comments-area {
  margin-top: 80px; }
  .blog-pg.single .comments-area .item {
    padding: 30px 0;
    margin: 30px 0;
    border-bottom: 1px solid #eee; }
    .blog-pg.single .comments-area .item.relped {
      margin-left: 100px; }
    .blog-pg.single .comments-area .item .comment-img {
      display: table-cell;
      width: 80px; }
    .blog-pg.single .comments-area .item .info {
      display: table-cell;
      vertical-align: middle;
      padding-left: 40px;
      position: relative; }
      .blog-pg.single .comments-area .item .info h6 {
        font-size: 14px;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-weight: 500; }
        .blog-pg.single .comments-area .item .info h6 span {
          display: block;
          color: #002546;
          font-size: 12px;
          font-weight: 400;
          margin-top: 5px; }
      .blog-pg.single .comments-area .item .info p {
        line-height: 1.5;
        margin-top: 15px; }
      .blog-pg.single .comments-area .item .info .replay {
        position: absolute;
        right: 0;
        top: 0;
        font-size: 13px; }
        .blog-pg.single .comments-area .item .info .replay i {
          margin-left: 5px; }

.blog-pg.single .comment-form {
  margin-top: 80px; }
  .blog-pg.single .comment-form form {
    margin-top: 50px; }
    .blog-pg.single .comment-form form input, .blog-pg.single .comment-form form textarea {
      width: 100%;
      padding: 17px;
      background: #fafafa;
      border: 0; }
    .blog-pg.single .comment-form form textarea {
      height: 140px; }
    .blog-pg.single .comment-form form button {
      cursor: pointer; }

.next-project {
  position: relative;
  padding: 80px 0;
  margin-top: 90px;
  background: #fafafa;
  z-index: 2;
  overflow: hidden; }
  .next-project:before {
    display: none; }
  .next-project:after {
    content: '';
    height: 0;
    width: 100%;
    position: absolute;
    bottom: auto;
    right: 0;
    top: 0;
    -webkit-transition: height 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
    -o-transition: height 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
    transition: height 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
    background: #f5f5f5;
    z-index: -1; }
  .next-project:hover:after {
    height: 100%;
    bottom: 0;
    top: auto; }
  .next-project .content {
    width: 100%; }
    .next-project .content h2 {
      font-size: 90px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 4px;
      margin-bottom: 20px; }
    .next-project .content p {
      font-size: 18px;
      color: #555; }

/* ====================== [ End Blog ] ====================== */
/* ====================== [ Start contact ] ====================== */
.cont-map {
  position: relative;
  z-index: 2; }
  .cont-map .contact-form form {
    position: relative;
    top: -50px;
    right: -50px;
    padding: 60px 30px;
    background: #fff;
    -webkit-box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05);
border: 10px solid #ededec;
    border-radius: 5px; }
    .cont-map .contact-form form input, .cont-map .contact-form form textarea {
      padding: 15px;
      background: #f7f7f7;
      border: 0;
      width: 100%; }
    .cont-map .contact-form form textarea {
      height: 160px; }
  .cont-map .contact-map {
	      z-index: 10;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 63%;
   }
    .cont-map .contact-map .map {
      height: 100%; }
  .cont-map .contact-form,
  .cont-map .contact-map {
    padding: 0; }
  .cont-map .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 30%;
    z-index: -1; }

.contact .info .item {
  padding: 40px 20px;
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; 
  min-height: 222px}
  .contact .info .item .icon {
    font-size: 30px;
    color: #999;
    padding-right: 30px; }
  .contact .info .item .cont h6 {
	      text-transform: none;
	      font-family: 'Viga-Regular', serif;
    font-size: 20px;
    color: #002546;
    margin-bottom: 10px; }
  .contact .info .item .cont p {
    font-size: 13px; }

.contact .map-box {
  padding: 0; }
  .contact .map-box .map {
    height: 100%; }

.contact-form{

position: relative;
   
    z-index: 100;	
}
.contact .form {
  padding: 120px 5%; }
  .contact .form input, .contact .form textarea {
    padding: 15px;
    background: #f7f7f7;
    border: 0;
    width: 100%; }
  .contact .form textarea {
    height: 160px; }

/* ====================== [ End contact ] ====================== */
/* ====================== [ Start Footer ] ====================== */
.main-footer {
  padding: 100px 0 0; }
  .main-footer.dark {
	      padding-bottom: 30px;
    background: #0a0a0a;
    color: #fff; }
  .main-footer .abot p {
    font-size: 13px; }
  .main-footer .abot .social-icon {
    margin-top: 20px; }
    .main-footer .abot .social-icon a{
      width: 45px;
      height: 45px;
      line-height: 45px;
      text-align: center;
      font-size: 13px;
      border: 1px solid rgba(255, 255, 255, 0.1);
      border-radius: 50%;
      margin-right: 3px;
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s; }
      .main-footer .abot .social-icon a:hover{
        border-color: #1e6694;
        color: #1e6694; }
		
		
		
 .navbar .social-icon a {
      width: 35px;
      height: 35px;
      line-height: 35px;
      text-align: center;
      font-size: 13px;
      border: 1px solid #dcdcdc26;
      border-radius: 50%;
      margin-right: 3px;
      -webkit-transition: all .4s;
      -o-transition: all .4s;
      transition: all .4s; }
     .navbar .social-icon a:hover {
        border-color: #1e6694;
        color: #1e6694; }
		
		
  .main-footer .usful-links ul {
    margin: 0; }
    .main-footer .usful-links ul li {
      font-size: 13px;
      margin-bottom: 10px; 
      position: relative;
    }
      .main-footer .usful-links ul li:hover {
        color: #1971b8; }
      .main-footer .usful-links ul li i {
       font-size: 16px;
    color: #1971b8;
    margin-right: 9px; 
    position: absolute;
    left: -25px;}
  .main-footer .fothead h6 {
    color: #d6d6d6;
	 font-family: 'Viga-Regular', serif;
   font-size: 18px;
   text-transform: none;
   letter-spacing: 1px;
    margin-bottom: 30px; }
  .main-footer .fotcont .fothead h6 {
    position: relative;
    padding-bottom: 10px; }
    .main-footer .fotcont .fothead h6:after {
      content: '';
      position: absolute;
      right: 0;
      bottom: 0;
      width: 100%;
      background: rgba(255, 255, 255, 0.1);
      height: 1px; }
  .main-footer .fotcont p {
    font-size: 13px; }
  .main-footer .sub-footer {
    padding: 30px 0;
    margin-top: 50px;
    border-top: 1px solid rgba(255, 255, 255, 0.02); }
    .main-footer .sub-footer p {
      font-size: 13px; }

/* ====================== [ End Footer ] ====================== */
/* ====================== [ Start Responsive ] ====================== */
@media screen and (max-width: 991px) {
  .md-mb10 {
    margin-bottom: 10px; }
  .md-mb20 {
    margin-bottom: 20px; }
  .md-mb30 {
    margin-bottom: 30px; }
  .md-mb40 {
    margin-bottom: 40px; }
  .md-mb50 {
    margin-bottom: 50px; }
  .md-mb60 {
    margin-bottom: 60px; }
  .md-mb70 {
    margin-bottom: 70px; }
  .md-mb80 {
    margin-bottom: 80px; }
  .md-pb10 {
    padding-bottom: 10px; }
  .md-pb20 {
    padding-bottom: 20px; }
  .md-pb30 {
    padding-bottom: 30px; }
  .md-pb40 {
    padding-bottom: 40px; }
  .md-pb50 {
    padding-bottom: 50px; }
  .md-pb60 {
    padding-bottom: 60px; }
  .md-pb70 {
    padding-bottom: 70px; }
  .md-pb80 {
    padding-bottom: 80px; }
  .order2 {
    -webkit-box-ordinal-group: 3 !important;
    -ms-flex-order: 2 !important;
    order: 2 !important; }
  .order1 {
    -webkit-box-ordinal-group: 2 !important;
    -ms-flex-order: 1 !important;
    order: 1 !important; }
  .navbar {
    min-height: 60px; }
    .navbar .navbar-collapse {
      max-height: 440px;
      overflow: auto;
      background: #111;
      text-align: center;
      padding: 10px 15px; }
    .navbar .nav-link {
      margin: 10px auto !important; }
  .navbar .logo {
    margin-left: 15px;
    width: 50px; }
  .nav-scroll .navbar-collapse .nav-link,
  .light .navbar-collapse .nav-link {
    color: #fff !important; }
  .nav-scroll .navbar-collapse .active,
  .light .navbar-collapse .active {
    color: #002546 !important; }
  .light .social-icon a,
  .nav-scroll .social-icon a {
    color: #fff; }
  .navbar .social-icon,
  .navbar .search {
    border: 0;
    padding: 0;
    margin-top: 30px; }
  .navbar .social-icon a {
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%; }
  .navbar .search .search-form {
    display: block;
    position: static;
    height: auto; }
  .navbar .search .search-form form {
    position: static;
    width: 100%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none; }
  .navbar .search .search-form form input {
    padding: 15px;
    width: 100%;
    font-size: 14px; }
  .navbar .search .icon,
  .navbar .search .search-form .close {
    display: none; }
  .navbar-nav .dropdown-menu {
    opacity: 1;
    visibility: visible;
    display: none;
    background: #222;
    text-align: center;
    color: #eee; }
    .navbar-nav .dropdown-menu .dropdown-item {
      color: #eee; }
  .navbar-nav .dropdown-menu.show {
    display: block; }
  .navbar .navbar-nav .nav-link {
    padding: 0; }
    .navbar .navbar-nav .nav-link:hover {
      color: #002546; }
  .slider .caption.center h1 {
    font-size: 40px; }
  .cta__slider-item .media-wrapper .bg-img {
    width: 100%; }
  .about .specialty,
  .about .exp-content,
  .numbers .item,
  .team .slick-slider,
  .about .ab-exp,
  .about .txt-cont,
  .skills-sec .content {
    margin-top: 50px; }
  .services .feat-top {
    width: 100%;
    margin-top: 0;
    padding: 100px 30px 70px; }
    .services .feat-top .item-sm {
      margin-bottom: 30px;
      background: #fff;
      padding: 30px; }
  .portfolio.full-bg .cluom {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    height: 50vh; }
  .process .coulmn:after {
    display: none; }
  .blog-grid .item,
  .skills-circle .skill,
  .process .item,
  .team.tmgrid .item,
  .contact .info .item {
    margin-bottom: 50px; }
  .contact .info {
    padding-bottom: 30px !important; }
  .contact .map-box {
    height: 400px; }
  .blog-grid,
  .skills-circle,
  .process,
  .team.tmgrid {
    padding-bottom: 70px; }
  .team.tmgrid {
    background: #fff; }
  .brands .box-top .item {
    margin: 20px 0; }
  .team {
    background: #1e6694; }
    .team .tit .navs span {
      background: #fff; }
      .team .tit .navs span:hover {
        background: #002546; }
  .team .team-container {
    width: 100%; }
  .about .pat {
    display: none; }
  .cont-map {
    background: #1e6694; }
  .cont-map .contact-form form {
    top: 0;
    right: 0;
    margin: 120px 0; }
  .cont-map .contact-map {
    position: relative;
    height: 400px;
    width: 100%; }
  .cont-map .bg-img {
    display: none; }
  .portfolio .gallery.twsty .three-column {
    width: 50% !important; }
  footer .item {
    margin-bottom: 30px; }
  footer .sub-footer {
    margin-top: 20px; }
  footer .sub-footer .text-left,
  footer .sub-footer .text-right {
    text-align: center !important; } }

@media screen and (max-width: 767px) {
  .sm-mb10 {
    margin-bottom: 10px; }
  .sm-mb20 {
    margin-bottom: 20px; }
  .sm-mb30 {
    margin-bottom: 30px; }
  .sm-mb40 {
    margin-bottom: 40px; }
  .sm-mb50 {
    margin-bottom: 50px; }
  .sm-mb60 {
    margin-bottom: 60px; }
  .sm-mb70 {
    margin-bottom: 70px; }
  .sm-mb80 {
    margin-bottom: 80px; }
  .sm-pb10 {
    padding-bottom: 10px; }
  .sm-pb20 {
    padding-bottom: 20px; }
  .sm-pb30 {
    padding-bottom: 30px; }
  .sm-pb40 {
    padding-bottom: 40px; }
  .sm-pb50 {
    padding-bottom: 50px; }
  .sm-pb60 {
    padding-bottom: 60px; }
  .sm-pb70 {
    padding-bottom: 70px; }
  .sm-pb80 {
    padding-bottom: 80px; }
  h1 {
    font-size: 35px; }
  h2 {
    font-size: 28px; }
  h3 {
    font-size: 24px; }
  h4 {
    font-size: 20px; }
  h5 {
    font-size: 18px; }
  h6 {
    font-size: 16px; }
  .progress-wrap {
    right: 15px;
    bottom: 15px; }
  .navbar .logo {
    width: 60px; }
  .btn-curve {
    padding: 8px 15px; }
    .btn-curve span {
      font-size: 15px;
      letter-spacing: 1px; }
  .section-head h4 {
    font-size: 22px; }
  .pages-header .cont h1 {
    font-size: 40px; }
  .slider .caption.center h1 {
    font-size: 25px; }
    .slider .caption.center h1 br {
      display: none; }
  .slider .social-icon {
    left: 15px;
    bottom: 15px;
    display: none; }
  .slider .swiper-pagination-fraction.top.botm {
    right: 15px;
    bottom: 15px; }
  .slider .swiper-pagination-fraction.top span {
    font-size: 20px; }
  .slider .swiper-pagination-fraction.top .swiper-pagination-current {
    font-size: 25px; }
  .slider .setone.setwo .next-ctrl {
    right: auto;
    left: 70px;
    bottom: 15px;
    top: auto;
    width: 45px;
    height: 45px;
    line-height: 45px; }
  .slider .setone.setwo .prev-ctrl {
    left: 15px;
    bottom: 15px;
    top: auto;
    width: 45px;
    height: 45px;
    line-height: 45px; }
  .slider .parallax-slider .caption h1 {
    font-size: 35px; }
  .slider .setone .swiper-nav-ctrl {
    width: 45px;
    height: 45px;
    line-height: 45px; }
  .slider .setone {
    bottom: 15px;
    right: 15px; }
  .cta__slider-item .caption h1 {
    font-size: 40px; }
  .cta__slider-arrows {
    right: 15px;
    bottom: 15px; }
  .slid-half .swiper-pagination-fraction.top {
    right: auto;
    top: auto;
    left: 15px;
    bottom: 15px; }
  .about .exp-content:after {
    right: 0; }
  .about .exp-img .img {
    width: 100%; }
  .about .exp-content ul {
    display: block; }
  .about .exp-content ul li {
    margin-top: 10px;
    display: inline-block; }
  .about .ab-exp .years-exp {
    height: 300px;
    margin-top: 10px; }
  .services .feat-top {
    padding: 80px 10px 50px; }
  .services .item-sm .numb {
    padding-right: 30px; }
    .services .item-sm .numb:after {
      width: 15px; }
  .brands .box-top .row > div {
    width: 50%; }
  .blog-grid.center .item .cont {
    padding: 30px 20px; }
  .portfolio .gallery.twsty .items {
    width: 100%; }
  .portfolio .filtering span {
    margin: 5px 15px;
    font-size: 12px;
    letter-spacing: 0;
    text-transform: capitalize; }
  .portfolio.full-bg .cluom {
    height: 40vh;
    min-height: 250px; }
  .portfolio .gallery.twsty .three-column {
    width: 100% !important; }
  .blog-pg .posts .item .content {
    position: relative; }
    .blog-pg .posts .item .content .col-10,
    .blog-pg .posts .item .content .col-2 {
      width: 100%;
      max-width: 100%;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
      flex: 0 0 100%; }
    .blog-pg .posts .item .content .col-2 {
      position: absolute;
      right: 0px;
      top: -90px;
      z-index: 3; }
  .blog-pg .posts .item .content .date a {
    padding: 10px;
    background: #fff;
    margin: 0; }
  .blog-pg .posts .item .content .date .num {
    font-size: 25px;
    margin: 0; }
  .blog-pg.single .comments-area .item.relped {
    margin-left: 0px; }
  .blog-pg.single .comments-area .item .info h6 span {
    display: block;
    margin: 10px 0 0 0; } }

@media screen and (max-width: 480px) {
  .section-padding {
    padding: 30px 0;
}
.about-4 .exp-img .img{
  margin: 30px 0;
}
.about .exp-content{
  margin-top: 0;
}
.testimonials .section-head {
  margin: 0px auto 0px;
  padding-top: 50px;
}
  .pages-header .cont .path {
    font-size: 15px; }
    .pages-header .cont .path span {
      margin: 0 10px; }
  .blog-pg.single .post .title-head a {
    letter-spacing: 0;
    margin: 0 7px; }
  .blog-pg .posts .item .img .info {
    padding: 10px; }
  .blog-pg .posts .item .img .info .date .num {
    font-size: 20px; }
  .blog-pg.single .post .content .share-info {
    display: block; }
  .blog-pg.single .post .content .share-info .tags,
  .blog-pg.single .post .content .share-info .social {
    display: block;
    width: 100%;
    text-align: center; }
  .blog-pg.single .post .content .share-info .tags {
    margin-top: 20px; }
  .blog-pg.single .post .author {
    padding: 30px 15px; }
  .blog-pg.single .post .author .author-img {
    display: block;
    width: 120px;
    margin: 0 auto 30px; }
  .blog-pg.single .post .author .info {
    display: block;
    padding: 0;
    text-align: center; }
  .blog-pg.single .comments-area .item .comment-img {
    display: block;
    margin: 0 auto 30px;
    width: 60px; }
  .blog-pg.single .comments-area .item .info {
    display: block;
    padding: 0;
    text-align: center; }
  .blog-pg.single .comments-area .item.relped {
    margin-left: 0px; }
  .blog-pg.single .comments-area .item .info h6 {
    font-size: 14px;
    letter-spacing: 1px; }
  .blog-pg.single .comments-area .item .info .replay {
    top: -25px; } }

/* ====================== [ End Responsive ] ====================== */
.form-group {
    font-size: 13px;
    margin-bottom: 1rem;
}

@media screen and (max-width: 900px) {
	.team .sub-title {
    color: #ffffff;
	}
	.team .sub-title:before {
 
    background: #ffffff;
	}
	.team .playfont {
  
    color: #ffffff;
}
.team p {
    color: #fff;
}
	.logo img{
		width:150px !important;
	}
	
footer .container{
padding-bottom: 230px !important;
}
footer {
   
    background-position: 0% 100% !important;
}
	.sub-title3:before {
   
    left: 15%;
   
}
.sub-title4:before {
   
    left: 24%;
   
}

.main-footer .fothead h6 {
   
    margin-bottom: 4px;
}

.pages-header {
    height: 34vh;
}
}








footer p{
	color:#fff;
}
footer{
	background-image:url(../img/footer.png) !important;
	background-repeat: no-repeat !important;
  
    background-position: 100% 100% !important;

}

.sub-footer{
	background: #100c0b;
    padding: 10px;
}

.addr .fas{
	position: relative;
    top: 0px;
}

.cont .fas{
	position: relative;
    top: 0;
}





.caption h1 {
  font-family: 'Viga-Regular', serif;
  color: #1971b8;
  margin-bottom: 10px;
  line-height: 1.1;
  font-weight: 600;
  font-size: 30px;
}



.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:20px;
	right:10px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	/*box-shadow: 2px 2px 3px #999;*/
  z-index:100;
}
.float-2{
  bottom: 90px;
  background-color: #0098ff;
  display: none;
}
.my-float{
	margin-top:16px;
}
.social-icon a i{
  font-size: 15px;
}
.item-bx:hover h2,
.item-bx:hover p{
  color: #fff;
}
.about-3 .col-lg-6{
  padding: 20px;
}
.about-3 .exp-content p:first-child{
  font-size: 18px;
}
.about-3 .col-lg-6:hover{  
  background: #fff;
  border-radius: 10px;
  transition: .4s ease;
}
.about-3 .exp-content p i{
  font-size: 15px;
  color: #0098ff;
  padding-right: 6px;
}
.about-4 .exp-img .img{
  height: 360px;
}
@media screen and (min-width: 480px) {
  .valign img {
    width: 470px!important;
}
}
.item-bx img{
  margin-bottom: 20px;
  margin-left: 0;
  height: 70px;
  width: auto;
}
.caption p{
  text-align: justify;
}
.caption h2.playfont:nth-child(2){
  padding-bottom: 10px;
}
.quotes{
  background-color: #e5f9ff;
  padding: 60px 30px;
  width: 100%;
}
.light .navbar-nav .nav-link:hover, .nav-scroll .navbar-nav .nav-link:hover{
  color: #0098ff; 
}
.navbar .navbar-nav .nav-link{
  padding: 15px;
  transition: .5s ease;
}
.navbar .navbar-nav .nav-link:hover{
 background-color: #003f54;
 color: #fff;
 border-radius: 3px;
}
.actived{
  background-color: #004a62;
  color: #fff!important;
  border-radius: 3px;
  color: #fff;
}
.cont a{
  margin-left: 0px;
}
.item.usful-links li{
  position: relative;
}
.modal-body img{
  max-width: 440px;
}
.pageloadmodel button.close {
  background: #fff!important;
  padding: 0px 6px!important;
  opacity: 1;
  border-radius: 3px;
  font-size: 20px;
}
/***************************************Banner Section************************************/
body{
  margin: 0;
}
.grid-section {
  position: relative;
  height: 86vh;
  padding: 0px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 0px;
  margin: 0 auto;
  margin-top: 104px;
}

.grid-block {
  background: transparent;
  /* border-radius: 15px; */
  padding: 20px;
  display: flex
;
  align-items: center;
  gap: 20px;
  /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); */
  transition: transform 0.3s ease;
  padding-right: 170px;
  border: 1px solid #e5e5e5;
}

  .grid-block:hover {
      transform: translateY(0px);
  }

  .grid-block.right {
      flex-direction: row-reverse;
      padding-left: 210px;
      padding-right: 20px;
  }

  .block-image {
      flex: 1;
      max-width: 260px;
  }

  .block-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 10px;
      filter: contrast(1.3);
  }

  .block-content {
      flex: 1;
  }

  .block-heading {
    font-size: 1.5rem;
    margin-bottom: 15px;
    color: #333;
    font-family: 'Viga-Regular';
}

  .know-more-btn {
      display: inline-block;
      padding: 10px 20px;
      background: #006f94;
      color: white;
      text-decoration: none;
      border-radius: 5px;
      transition: background 0.3s ease;
  }

  .know-more-btn:hover {
      background: #00516c;
      color: #fff;
  }

  .center-overlay {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      display: flex;
      align-items: center;
      gap: 0px;
      background: rgba(255, 255, 255, 0.95);
      padding: 30px;
      border-radius: 20px;
      box-shadow: 0 15px 40px rgba(0,0,0,0.15);
      z-index: 10;
      max-width: 600px;
  }

  .center-image {
      width: 300px;
      height: 300px;
      border-radius: 50%;
      overflow: hidden;
  }

  .center-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
  }

  .center-text {
      flex: 1;
  }

  .center-text h2 {
      font-size: 2rem;
      margin-bottom: 10px;
      color: #128C7E;
  }

  @media (max-width: 1024px) {
      .grid-section {
          height: auto;
          grid-template-columns: 1fr;
      }
      .grid-block{
        padding-right: 0;
      }
      .grid-block.right {
        padding-left: 0;
      }
      .center-overlay {
          position: static;
          transform: none;
          margin: 20px auto;
          flex-direction: column;
          text-align: center;
      }
      
      .grid-block, .grid-block.right {
          flex-direction: column;
          text-align: center;
      }
      
      .block-image {
          max-width: 100%;
      }
  }
  /* Update center-overlay style */
  .center-overlay {
      flex-direction: column;
      text-align: center;
      background: rgb(229 249 255);
      padding: 20px;
  }

  .center-text {
      margin-top: 0px;
  }

  .center-text p {
      margin: 5px 0;
      color: #333;
      font-size: 1.1rem;
      line-height: 1.8;
      font-weight: bold;
      font-family: math;
      border-bottom: 1px dotted #006f94;
  }
  .grid-block p{
      color: #555;
      font-size: 15px;
      font-weight: 400;
      line-height: 1.5;
      margin: 0;
      padding-bottom: 20px;
      padding-right: 20px;
  
  }
      /* Add these new styles and update grid-block */
  .grid-block:nth-child(2) {
      background: linear-gradient(45deg, #ffdbdb, transparent);
  
  }

  .grid-block:nth-child(3) {
      background: linear-gradient(-45deg, #e2ffe2, transparent);
  }

  .grid-block:nth-child(4) {
      background: linear-gradient(45deg, #e9e9ff, transparent);
  
  }

  .grid-block:nth-child(5) {
      background: linear-gradient(-45deg, #ffe1ff, transparent);
  }

  /* Update image colors to match blocks */
  
  .grid-block:nth-child(2) h3 {
    color:#8d4a4a 
}

.grid-block:nth-child(3) h3 {
    color:#407540 
}

.grid-block:nth-child(4) h3 {
    color:#4d4d7b 
}

.grid-block:nth-child(5) h3 {
    color:#714772 
}
  
  /*
  .grid-block:nth-child(1) .block-image img {
      background: #FFB5B5;
  }

  .grid-block:nth-child(2) .block-image img {
      background: #B5FFB5;
  }

  .grid-block:nth-child(3) .block-image img {
      background: #B5B5FF;
  }

  .grid-block:nth-child(4) .block-image img {
      background: #FFB5FF;
  }

  /* Update button colors to match blocks */
  .grid-block:nth-child(2) .know-more-btn {
      background: #b87171;
  }

  .grid-block:nth-child(3) .know-more-btn {
      background: #77a177;
  }

  .grid-block:nth-child(4) .know-more-btn {
      background: #8585b6;
  }

  .grid-block:nth-child(5) .know-more-btn {
      background: #a67fa7;
  }

  /* Update button hover states */
  .grid-block:nth-child(2) .know-more-btn:hover {
      background: #8d4a4a;
  }

  .grid-block:nth-child(3) .know-more-btn:hover {
      background: #407540;
  }

  .grid-block:nth-child(4) .know-more-btn:hover {
      background: #4d4d7b;
  }

  .grid-block:nth-child(5) .know-more-btn:hover {
      background: #714772;
  }
  /***************************************Banner Section************************************/
 

  .cta-box {
    background: #f9f9f9;
    padding: 30px 30px 10px;
}
.single-post__text {
    font-size: 16px;
    line-height: 1.75;
    color: #666;
    margin-bottom: 76px;
}
.single-post__intro {
    font-size: 24px;
    line-height: 1.666666666666667;
    font-weight: 100;
    margin-bottom: 30px;
}
.single-post__text p {
    margin-bottom: 30px;
}
p a.cta {
    background: #00aeef;
    color: #fff;
    padding: 10px 20px;
    border-radius: 3px;
    box-shadow: 0px 0px 10px 0px #b7b7b7;
    text-transform: capitalize;
    transition: .5s ease;
}
.opa-0{
  opacity: 0;
}
.post .title-head h1{
  font-size: 49px;
}
.posts h4.title{
  font-size: 20px;
}

            .stripe {
            /* diagonal stripes, 20 px wide alternating colors */
            background: #198508;
            border: 1px solid transparent;
            margin: 20px;
            color: #fff;
            padding: 10px;
            text-align: center;
            margin: 0 auto;
            margin-bottom: 100px;
            width: auto;
            border-radius: 10px;
            max-width: 650px;
            position: relative;
        }
        .stripe p{
            font-size: 22px;
            display: inline-block;
            width: auto;
        }
        .stripe p strong{
            font-size: 25px;
        }
        .stripe p i{
            background-color:chocolate;
            color: #fff;
            padding: 20px;
            border-radius: 50%;
            margin-right: 5px;
            height: 60px;
            width: 60px;
            margin-top: 3px;
            display: inline-block;
            position: absolute;
            left: -20px;
            top: -15px;
            animation: pulse 2s infinite;
        }
        @keyframes pulse {
            0% {
                transform: scale(1);
                opacity: 1;
            }
            50% {
                transform: scale(1.1);
                opacity: 1;
            }
            100% {
                transform: scale(1);
                opacity: 1;
            }
        }   
        @media (max-width: 768px) {
            .stripe {
                width: 90%;
                margin: 20px auto;
            }
            .stripe p {
                font-size: 18px;
            }
            .stripe p i {
                height: 40px;
                width: 40px;
                padding: 12px;
                left: -15px;
                top: -10px;
            }
        }










           /* === FLOATING BUTTON CONTAINER === */
    .float-call {
      position: fixed;
      bottom: 90px;
      right: 15px;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 10px;
      z-index: 999;
    }

    /* === NUMBER OPTIONS === */
    .call-options {
      display: flex;
      flex-direction: column;
      gap: 10px;
      align-items: flex-end;
      pointer-events: none;
      opacity: 0;
      transform: translateY(12px) scale(0.96);
      transition: opacity 0.3s ease, transform 0.3s ease;
    }

    .float-call:hover .call-options {
      opacity: 1;
      transform: translateY(0) scale(1);
      pointer-events: all;
    }

    .call-option {
      display: flex;
      align-items: center;
      gap: 12px;
      background: #1a1a22;
      border: 1px solid #2a2a38;
      border-radius: 50px;
      padding: 10px 18px 10px 14px;
      text-decoration: none;
      color: #e8e8f0;
      font-size: 14px;
      font-weight: 500;
      letter-spacing: 0.03em;
      cursor: pointer;
      transition: background 0.2s, border-color 0.2s, transform 0.2s, box-shadow 0.2s;
      box-shadow: 0 4px 20px rgba(0,0,0,0.4);
      white-space: nowrap;
    }

    .call-option:hover {
      background: #23d673;
      border-color: #23d673;
      color: #0a1a10;
      transform: translateX(-4px);
      box-shadow: 0 6px 28px rgba(35, 214, 115, 0.35);
    }

    .call-option:nth-child(1) { transition-delay: 0.04s; }
    .call-option:nth-child(2) { transition-delay: 0.02s; }
    .call-option:nth-child(3) { transition-delay: 0s; }

    .float-call:hover .call-option:nth-child(1) { animation: slideUp 0.3s ease 0.05s both; display: flex;}
    .float-call:hover .call-option:nth-child(2) { animation: slideUp 0.3s ease 0.1s both; display: flex;}
    .float-call:hover .call-option:nth-child(3) { animation: slideUp 0.3s ease 0.15s both; display: flex;}

    @keyframes slideUp {
      from { opacity: 0; transform: translateY(8px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    .call-icon-sm {
      width: 26px;
      height: 26px;
      border-radius: 50%;
      background: rgba(35, 214, 115, 0.15);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: background 0.2s;
    }

    .call-option:hover .call-icon-sm {
      background: rgba(0,0,0,0.15);
    }

    .call-icon-sm svg { width: 13px; height: 13px; fill: #23d673; transition: fill 0.2s; }
    .call-option:hover .call-icon-sm svg { fill: #0a1a10; }

    /* === MAIN BUTTON === */
    .call-btn {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      background: #23d673;
      border: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 6px 30px rgba(35, 214, 115, 0.45), 0 0 0 0 rgba(35, 214, 115, 0.3);
      animation: pulse 2.5s ease-in-out infinite;
      transition: transform 0.2s, box-shadow 0.2s;
      position: relative;
    }

    .call-btn svg { width: 26px; height: 26px; fill: #fff; transition: transform 0.3s; }

    .float-call:hover .call-btn {
      transform: scale(1.08);
      animation: none;
      box-shadow: 0 8px 36px rgba(35, 214, 115, 0.55);
    }

    .float-call:hover .call-btn svg {
      transform: rotate(15deg);
    }

    @keyframes pulse {
      0%, 100% { box-shadow: 0 6px 30px rgba(35,214,115,0.45), 0 0 0 0 rgba(35,214,115,0.3); }
      50%       { box-shadow: 0 6px 30px rgba(35,214,115,0.45), 0 0 0 12px rgba(35,214,115,0); }
    }

    /* label tooltip on main btn */
    .call-btn::after {
      content: "Call Us";
      position: absolute;
      right: 70px;
      background: #1a1a22;
      border: 1px solid #2a2a38;
      color: #aaa;
      font-family: 'DM Sans', sans-serif;
      font-size: 12px;
      padding: 5px 10px;
      border-radius: 6px;
      white-space: nowrap;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.2s;
    }

    .float-call:not(:hover) .call-btn:hover::after {
      opacity: 1;
    }



    /******************16-04-2026******************/

     :root {
    --brand: #1971B8;
    --brand-light: #E8F2FB;
    --brand-mid: #C2DCF4;
    --brand-dark: #0F4E85;
    --site-dark: #111827;
    --site-gray: #F5F7FA;
    --site-text: #1E293B;
    --site-muted: #64748B;
    --site-border: #E2E8F0;
    --rc: 20px;
    --rp: 100px;
  }
  .yt-sec .container{max-width:1360px;margin:0 auto;padding:0 20px;}
    /* YOUTUBE SHORTS */
  .yt-sec{background:var(--site-dark);padding:96px 0;}
  .yt-sec .sec-label{background:rgba(25,113,184,.25);color:#6BB8FF;}
  .yt-sec .sec-title{color:#fff;font-family: 'Viga-Regular', serif;}
  .yt-sec .sec-sub{color:rgba(255,255,255,.5);}

  /* Scrollable track wrapper with fade edges */
  .shorts-scroll-outer{
    position:relative;
  }
  .shorts-scroll-outer::before,
  .shorts-scroll-outer::after{
    content:'';
    position:absolute;
    top:0;bottom:0;width:60px;z-index:3;pointer-events:none;
  }
  .shorts-scroll-outer::before{left:0;background:linear-gradient(to right,var(--site-dark) 10%,transparent);}
  .shorts-scroll-outer::after{right:0;background:linear-gradient(to left,var(--site-dark) 10%,transparent);}

  /* Arrow nav buttons */
  .shorts-nav{
    position:absolute;top:50%;transform:translateY(-50%);
    width:40px;height:40px;border-radius:50%;
    background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);
    color:#fff;font-size:16px;cursor:pointer;z-index:4;
    display:flex;align-items:center;justify-content:center;
    transition:background .2s,border-color .2s;
    backdrop-filter:blur(4px);
    z-index: 9999;
  }
  .shorts-nav:hover{background:var(--brand);border-color:var(--brand);}
  .shorts-nav.s-prev{left:-4px;}
  .shorts-nav.s-next{right:-4px;}

  /* The scrollable row */
  .shorts-track{
    display:flex;
    gap:14px;
    overflow-x:auto;
    scroll-behavior:smooth;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    padding:8px 4px 20px;
    /* hide scrollbar */
    scrollbar-width:none;
  }
  .shorts-track::-webkit-scrollbar{display:none;}

  /* Each shorts card — fixed width, portrait 9:16 */
  .sc{
    flex:0 0 180px;
    scroll-snap-align:start;
    border-radius:18px;
    overflow:hidden;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.1);
    transition:transform .3s,border-color .3s,box-shadow .3s;
  }
  .sc:hover{transform:translateY(-6px);border-color:var(--brand);box-shadow:0 14px 36px rgba(25,113,184,.3);}

  /* 9:16 portrait thumbnail */
  .sthumb{
    position:relative;
    width:100%;
    padding-bottom:177.78%;
    background:#000;
    overflow:hidden;
  }
  .sthumb iframe{
    position:absolute;top:0;left:0;
    width:100%;height:100%;border:none;
     /* prevent accidental click-throughs on scroll */
  }
  /* Tap-to-play overlay */
  .splay-overlay{
    position:absolute;inset:0;
    display:flex;align-items:center;justify-content:center;
    background:rgba(0,0,0,.25);
    cursor:pointer;z-index:2;
    transition:background .2s;
    display:none;
  }
  .splay-overlay:hover{background:rgba(0,0,0,.1);}
  .splay-overlay.hidden{display:none;}
  .splay-btn{
    width:48px;height:48px;border-radius:50%;
    background:#fff;display:flex;align-items:center;justify-content:center;
    font-size:18px;color:var(--brand);
    transition:transform .2s;
    display: none;
  }
  .sc:hover .splay-btn{transform:scale(1.1);}
  .sbadge{
    position:absolute;top:10px;left:10px;
    background:#FF0000;color:#fff;
    font-size:10px;font-weight:700;
    padding:3px 8px;border-radius:4px;
    letter-spacing:.04em;z-index:3;
    display:flex;align-items:center;gap:4px;
  }
  .sinfo{padding:13px 13px 14px;display: none;}
  .stitle{font-family:'Syne',sans-serif;font-size:12.5px;font-weight:600;color:#fff;line-height:1.4;margin-bottom:5px;}
  .smeta{font-size:10.5px;color:rgba(255,255,255,.4);display:flex;align-items:center;gap:5px;}

  /* Dots */
  .shorts-dots{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:4px;}
  .shorts-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.2);border:none;padding:0;cursor:pointer;transition:background .25s,width .3s;}
  .shorts-dot.active{background:var(--brand);width:22px;border-radius:3px;}

  /* Responsive: on large screens show all 6 naturally */
  @media(min-width:1200px){
    .sc{flex:0 0 calc((100% - 70px) / 6);
    flex: 0 0 249px;}
  }
  @media(min-width:768px) and (max-width:1199px){
    .sc{flex:0 0 calc((100% - 42px) / 4);}
  }
  @media(max-width:767px){
    .sc{flex:0 0 320px;}
    .shorts-nav{display:none;}
  }
  
  /* YT strip */
  .yt-strip{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:60px;padding:14px 26px;display:inline-flex;align-items:center;gap:16px;}
  .yt-sub{background:#FF0000;color:#fff;font-weight:700;font-size:13px;padding:8px 20px;border-radius:40px;text-decoration:none;white-space:nowrap;transition:opacity .2s;}
  .yt-sub:hover{opacity:.88;color:#fff;}
  .yt-visit{display:inline-flex;align-items:center;gap:8px;background:var(--brand);color:#fff;font-weight:600;font-size:13.5px;padding:12px 24px;border-radius:var(--rp);text-decoration:none;transition:opacity .2s;    float: right;
    margin-bottom: 30px;}
  .yt-visit:hover{opacity:.9;color:#fff;}
  .sbadge{
    display: none;
  }
  .stripe{
  display: none;
  }