/**
* Template Name: Multi - v4.9.1
* Template URL: https://bootstrapmade.com/multi-responsive-bootstrap-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
  font-family: "Inter", sans-serif;
}

a {
  color: #ed502e;
  text-decoration: none;
}

a:hover {
  color: #f1775d;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero {
  width: 100%;
  height: 960px;
  background-color: rgba(4, 12, 21, 0.8);
  overflow: hidden;
  position: relative;
}

#hero .carousel,
#hero .carousel-inner,
#hero .carousel-item,
#hero .carousel-item::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

#hero .carousel-item {
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}

#hero .carousel-item::before {
  content: "";
}

#hero .carousel-container {
  display: flex;
  align-items: center;
  position: absolute;
  bottom: 0;
  top:0;
  left: 50px;
  right: 50px;
}

#hero h2 {
  color: #000;
  margin: 0;
  font-size: 100px;
  line-height: 104px;
  font-weight: 800;
  background-image: url(../../images/ct.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-background-clip: text;
  opacity: 1;
  -webkit-text-fill-color: transparent;
}
#hero h2 em { color:#ff5a64;}

#hero p {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
  color: #fff;
  margin-top: 10px;
}
#hero h2 span {

  }

@media (min-width: 1200px) {
  #hero p {
    width: 50%;
  }
}

#hero .carousel-inner .carousel-item {
  transition-property: opacity;
  background-position: center top;
}

#hero .carousel-inner .carousel-item,
#hero .carousel-inner .active.carousel-item-start,
#hero .carousel-inner .active.carousel-item-end {
  opacity: 0;
}

#hero .carousel-inner .active,
#hero .carousel-inner .carousel-item-next.carousel-item-start,
#hero .carousel-inner .carousel-item-prev.carousel-item-end {
  opacity: 1;
  transition: 0.5s;
}

#hero .carousel-inner .carousel-item-next,
#hero .carousel-inner .carousel-item-prev,
#hero .carousel-inner .active.carousel-item-start,
#hero .carousel-inner .active.carousel-item-end {
  left: 0;
  transform: translate3d(0, 0, 0);
}

#hero .carousel-control-next-icon,
#hero .carousel-control-prev-icon {
  background: none;
  font-size: 30px;
  line-height: 0;
  width: auto;
  height: auto;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50px;
  transition: 0.3s;
  color: rgba(255, 255, 255, 0.5);
  width: 54px;
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#hero .carousel-control-next-icon:hover,
#hero .carousel-control-prev-icon:hover {
  background: rgba(255, 255, 255, 0.3);
  color: rgba(255, 255, 255, 0.8);
}

#hero .carousel-indicators li {
  cursor: pointer;
  background: #fff;
  overflow: hidden;
  border: 0;
  width: 1px;
  height: 35px;
  opacity:1;
  transition: 0.3s;
}

#hero .carousel-indicators li.active {
  opacity: 1;
  background: #ed502e;
}

#hero .btn-get-started {
  font-weight: 400;
  font-size:26px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 20px 60px;
  border-radius: 200px;
  transition: 0.5s;
  line-height: 1;
  color: #fff;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  background: linear-gradient(to right, #5d3efd 0%, #21d6a4 100%);
  margin-top: 40px;
}

#hero .btn-get-started:hover {
  background: linear-gradient(to right,  #22d6a4 0%,#5e3dfd 100%);
  color:#fff;
}

@media (max-width: 992px) {
  #hero {
    height: 100vh;
  }

  #hero .carousel-container {
    text-align: center;
    top: 74px;
  }
}

@media (max-width: 768px) {
  #hero h2 {
    font-size: 30px;
  }
}

@media (min-width: 1024px) {

  #hero .carousel-control-prev,
  #hero .carousel-control-next {
    width: 5%;
  }
}

@media (max-height: 500px) {
  #hero {
    height: 120vh;
  }
}

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #fff;
}

#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 30px);
  left: calc(50% - 30px);
  border: 6px solid #ed502e;
  border-top-color: white;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  -webkit-animation: animate-preloader 1s linear infinite;
  animation: animate-preloader 1s linear infinite;
}

@-webkit-keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 996;
  background: #ed502e;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: all 0.4s;
}

.back-to-top i {
  font-size: 28px;
  color: #fff;
  line-height: 0;
}

.back-to-top:hover {
  background: #f06f54;
  color: #fff;
}

.back-to-top.active {
  visibility: visible;
  opacity: 1;
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
  transition: all 0.5s;
  z-index: 997;
  padding: 15px 0; position: absolute; top: 50px; z-index: 99; 
}

#header.header-scrolled {
  padding: 12px 0;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}

#header .logo {
  font-size: 26px;
  margin: 0;
  padding: 0;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

#header .logo a {
  color: #0b2341;
}

#header .logo img {
  max-height: 40px;
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation 
*/
.navbar {
  padding: 0;
}

.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}

.navbar li {
  position:unset;
}

.navbar a,
.navbar a:focus {

  align-items: center;
  justify-content: space-between;
  padding: 10px 15px 10px 15px;
  font-size: 18px;
  white-space: nowrap;
  transition: 0.3s;
  font-weight:700;
  color: #111;
 
}
.navbar ul ul a { font-weight: 400; color: #111;}

.navbar a i,
.navbar a:focus i {
  font-size: 12px;
  line-height: 0;
  margin-left: 5px;
}

.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover>a { 
   background: linear-gradient(to right, #5d3efd 0%, #21d6a4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.navbar .getstarted,
.navbar .getstarted:focus {
  background: #ed502e;
  padding: 8px 20px;
  margin-left: 30px;
  border-radius: 4px;
  color: #fff;
}

.navbar .getstarted:hover,
.navbar .getstarted:focus:hover {
  color: #fff;
  background: #ef6445;
}

.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 14px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s; width: 1100px; left: -100px; border-radius: 25px; padding: 50px;
}

.navbar .dropdown ul li {
  min-width: 200px; float: left; width: 33.33%;
}

.navbar .dropdown ul a {
  padding: 15px 0;
  text-transform: none; float: left; width: 25%; font-size: 15px; color: #333;
}
.navbar .dropdown ul ul a {padding: 10px 0;}

.navbar .dropdown ul a i {
  font-size: 14px; margin-right: 5px;
}

.navbar .dropdown ul a:hover,
.navbar .dropdown ul .active:hover,
.navbar .dropdown ul li:hover>a {
  color: #ed502e;
}

.navbar .dropdown:hover>ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}

.navbar .dropdown .dropdown:hover>ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}

@media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }

  .navbar .dropdown .dropdown:hover>ul {
    left: -100%;
  }
}

/**
* Mobile Navigation 
*/
.mobile-nav-toggle {
  color: #0b2341;
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
}

.mobile-nav-toggle.bi-x {
  color: #fff;
}

@media (max-width:1300px) {
  .mobile-nav-toggle {
    display: block;
  }

  .navbar ul {
    display: none;
  }
}

.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: rgba(4, 12, 21, 0.9);
  transition: 0.3s;
  z-index: 999;
}

.navbar-mobile .mobile-nav-toggle {
  position: absolute;
  top: 15px;
  right: 15px;
}

.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 55px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding: 10px 0;
  background-color: #fff;
  overflow-y: auto;
  transition: 0.3s;
}

.navbar-mobile a,
.navbar-mobile a:focus {
  padding: 10px 20px;
  font-size: 15px;
  color: #0b2341;
}

.navbar-mobile a:hover,
.navbar-mobile .active,
.navbar-mobile li:hover>a {
  color: #ed502e;
}

.navbar-mobile .getstarted,
.navbar-mobile .getstarted:focus {
  margin: 15px;
}

.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 20px;
  padding: 10px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}

.navbar-mobile .dropdown ul li {
  min-width: 200px;
}

.navbar-mobile .dropdown ul a {
  padding: 10px 20px;
}

.navbar-mobile .dropdown ul a i {
  font-size: 12px;
}

.navbar-mobile .dropdown ul a:hover,
.navbar-mobile .dropdown ul .active:hover,
.navbar-mobile .dropdown ul li:hover>a {
  color: #ed502e;
}

.navbar-mobile .dropdown>.dropdown-active {
  display: block;
}



/*Our Css*/

#header .logo img { max-height:none;}
.email { float:right;}
.email a { font-weight: 400;
    font-size: 20px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 1px;
    border-radius: 200px;
    transition: 0.5s;
    line-height: 1;
    color: #fff;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s; background: linear-gradient(to right, #5d3efd 0%, #21d6a4 100%); } 
.email a span { padding: 12px 60px; border-radius: 150px; float: left; line-height: normal; }
.email a span:hover {background: #111; color: #fff;}
.email a img { margin-right:10px;}
.fixed-top { position:relative;}
.carousel-indicators { display:block; height:105px; width:1px; margin-left:15px; top:40%;}
.subscribe { float:left; width:100%; margin-top:-75px; position:relative; z-index:1; }
.scb { float:right; width:60%; height:150px; background:#ff5a64; border-radius:10px; padding:40px;}




#flexiselDemo1, #flexiselDemo2, #flexiselDemo3 {
display:none;
}

.nbs-flexisel-container {
    position:relative;
    max-width:100%;
}
.nbs-flexisel-ul {
    position:relative;
    width:99999px;
    margin:0px;
    padding:0px;
    list-style-type:none;   
    text-align:center;  
}

.nbs-flexisel-inner {
    overflow:hidden;
    float:left;
    width:100%;
}

.nbs-flexisel-item {
    float:left;
    margin:0px;
    padding:0px;
    cursor:pointer;
    position:relative;
}
.nbs-flexisel-item img {
    max-width: 100%;
    cursor: pointer;
    position: relative;

}

.nbs-flexisel-nav-left,
.nbs-flexisel-nav-right {
    width: 26px;
    height: 76px; 
    position: absolute;
    cursor: pointer;
    z-index: 100;
    opacity: 1;
}

.nbs-flexisel-nav-left {
    left: -75px;
    background:url(../../images/arrow1.png)
}

.nbs-flexisel-nav-right {
    right:-70px;
    background: url(../../images/arrow2.png) no-repeat;
}
.nbs-flexisel-item a { float:left; width:100%;}



.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp
{
	padding: 0;
	margin: 0;
	border: 0;
	outline: none;
	vertical-align: top;
}

.fancybox-wrap {
	position: absolute;
	top: 0;
	left: 0;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	z-index: 8020;
}

.fancybox-skin {
	position: relative;
	background: #f9f9f9;
	color: #444;
	text-shadow: none;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
}

.fancybox-opened {
	z-index: 10002;
}

.fancybox-opened .fancybox-skin {
	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	   -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.fancybox-outer, .fancybox-inner {
	position: relative;
}

.fancybox-inner {
	overflow: hidden;
}

.fancybox-type-iframe .fancybox-inner {
	-webkit-overflow-scrolling: touch;
}

.fancybox-error {
	color: #444;
	font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
	margin: 0;
	padding: 15px;
	white-space: nowrap;
}

.fancybox-image, .fancybox-iframe {
	display: block;
	width: 100%;
	height: 100%;
}

.fancybox-image {
	max-width: 100%;
	max-height: 100%;
}

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
	background-image:url(../../images/fancybox_sprite.png);
}
.fancybox-nav:hover span {}

#fancybox-loading {
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -22px;
	margin-left: -22px;
	background-position: 0 -108px;
	opacity: 0.8;
	cursor: pointer;
	z-index: 8060;
}

#fancybox-loading div {
	width: 44px;
	height: 44px;
	background: url(../../images/fancybox_loading.gif) center center no-repeat;
}

.fancybox-close {
	position: absolute;
	top: 15px;
	right: 15px;
	width: 36px;
	height: 36px;
	cursor: pointer;
	z-index: 8040;
}

.fancybox-nav {
	position: absolute;
	top: 0;
	width: 40%;
	height: 100%;
	cursor: pointer;
	text-decoration: none;
	background: transparent url(blank.gif); /* helps IE */
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	z-index: 8040;
}

.fancybox-prev {
	left: 0;
}

.fancybox-next {
	right: 0;
}

.fancybox-nav span {
	position: absolute;
	top: 50%;
	width: 36px;
	height: 34px;
	margin-top: -18px;
	cursor: pointer;
	z-index: 8040;
	visibility: hidden;
}

.fancybox-prev span {
	left: 10px;
	background-position: 0 -36px;
}

.fancybox-next span {
	right: 10px;
	background-position: 0 -72px;
}

.fancybox-nav:hover span {
	visibility: visible;
}

.fancybox-tmp {
	position: absolute;
	top: -99999px;
	left: -99999px;
	max-width: 99999px;
	max-height: 99999px;
	overflow: visible !important;
}

/* Overlay helper */

.fancybox-lock {
    overflow: visible !important;
    width: auto;
}

.fancybox-lock body {
    overflow: hidden !important;
}

.fancybox-lock-test {
    overflow-y: hidden !important;
}

.fancybox-overlay {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	display: none;
	z-index: 10001;
	background:rgba(0, 0, 0, 0.8);
}

.fancybox-overlay-fixed {
	position: fixed;
	bottom: 0;
	right: 0;
}

.fancybox-lock .fancybox-overlay {
	overflow: auto;
	overflow-y: scroll;
}

/* Title helper */

.fancybox-title {
	visibility: hidden;
	font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
	position: relative;
	text-shadow: none;
	z-index: 8050;
}

.fancybox-opened .fancybox-title {
	visibility: visible;
}

.fancybox-title-float-wrap {
	position: absolute;
	bottom: 0;
	right: 50%;
	margin-bottom: -35px;
	z-index: 8050;
	text-align: center;
}

.fancybox-title-float-wrap .child {
	display: inline-block;
	margin-right: -100%;
	padding: 2px 20px;
	font-family: "Open Sans",sans-serif;
	color: #FFF;
	font-weight: 600;
	line-height: 24px;
	white-space: nowrap;
	font-size:16px;
	text-transform:capitalize;
}

.fancybox-title-outside-wrap {
	position: relative;
	margin-top: 10px;
	color: #fff;
}

.fancybox-title-inside-wrap {
	padding-top: 10px;
}

.fancybox-title-over-wrap {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	padding: 10px;
	background: #000;
	background: rgba(0, 0, 0, .8);
}

#fancybox-buttons {
	position: fixed;
	left: 0;
	width: 100%;
	z-index: 8050;
}

#fancybox-buttons.top {
	top: 10px;
}

#fancybox-buttons.bottom {
	bottom: 10px;
}

#fancybox-buttons ul {
	display: block;
	width: 166px;
	height: 30px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	border: 1px solid #111;
	border-radius: 3px;
	-webkit-box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
	   -moz-box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
	        box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
	background: rgb(50,50,50);
	background: -moz-linear-gradient(top, rgb(68,68,68) 0%, rgb(52,52,52) 50%, rgb(41,41,41) 50%, rgb(51,51,51) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(68,68,68)), color-stop(50%,rgb(52,52,52)), color-stop(50%,rgb(41,41,41)), color-stop(100%,rgb(51,51,51)));
	background: -webkit-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%);
	background: -o-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%);
	background: -ms-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%);
	background: linear-gradient(to bottom, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#222222',GradientType=0 );
}

#fancybox-buttons ul li {
	float: left;
	margin: 0;
	padding: 0;
}

#fancybox-buttons a {
	display: block;
	width: 30px;
	height: 30px;
	text-indent: -9999px;
	background-color: transparent;
	background-image: url('fancybox_buttons.png');
	background-repeat: no-repeat;
	outline: none;
	opacity: 0.8;
}

#fancybox-buttons a:hover {
	opacity: 1;
}

#fancybox-buttons a.btnPrev {
	background-position: 5px 0;
}

#fancybox-buttons a.btnNext {
	background-position: -33px 0;
	border-right: 1px solid #3e3e3e;
}

#fancybox-buttons a.btnPlay {
	background-position: 0 -30px;
}

#fancybox-buttons a.btnPlayOn {
	background-position: -30px -30px;
}

#fancybox-buttons a.btnToggle {
	background-position: 3px -60px;
	border-left: 1px solid #111;
	border-right: 1px solid #3e3e3e;
	width: 35px
}

#fancybox-buttons a.btnToggleOn {
	background-position: -27px -60px;
}

#fancybox-buttons a.btnClose {
	border-left: 1px solid #111;
	width: 35px;
	background-position: -56px 0px;
}

#fancybox-buttons a.btnDisabled {
	opacity : 0.4;
	cursor: default;
}


#fancybox-thumbs {
	position: fixed;
	left: 0;
	width: 100%;
	overflow: hidden;
	z-index: 8050;
}

#fancybox-thumbs.bottom {
	bottom: 2px;
}

#fancybox-thumbs.top {
	top: 2px;
}

#fancybox-thumbs ul {
	position: relative;
	list-style: none;
	margin: 0;
	padding: 0;
}

#fancybox-thumbs ul li {
	float: left;
	padding: 1px;
	opacity: 0.5;
}

#fancybox-thumbs ul li.active {
	opacity: 0.75;
	padding: 0;
	border: 1px solid #fff;
}

#fancybox-thumbs ul li:hover {
	opacity: 1;
}

#fancybox-thumbs ul li a {
	display: block;
	position: relative;
	overflow: hidden;
	border: 1px solid #222;
	background: #111;
	outline: none;
}

#fancybox-thumbs ul li img {
	display: block;
	position: relative;
	border: 0;
	padding: 0;
	max-width: none;
}



/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	   only screen and (min--moz-device-pixel-ratio: 1.5),
	   only screen and (min-device-pixel-ratio: 1.5){

	#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
		background-image: url(fancybox_sprite@2x.png);
		background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/
	}

	#fancybox-loading div {
		background-image: url(fancybox_loading@2x.gif);
		background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/
	}
}




/** owl Start **/
      .owl-carousel, .owl-carousel .owl-item {
        -webkit-tap-highlight-color: transparent;
        position: relative
      }
      .owl-carousel {
        display: none;
        width: 100%;
        z-index: 1
      }
      .owl-carousel .owl-stage {
        position: relative;
        -ms-touch-action: pan-Y;
        touch-action: manipulation;
        -moz-backface-visibility: hidden
      }
      .owl-carousel .owl-stage:after {
        content: ".";
        display: block;
        clear: both;
        visibility: hidden;
        line-height: 0;
        height: 0
      }
      .owl-carousel .owl-stage-outer {
        position: relative;
        overflow: hidden;
        -webkit-transform: translate3d(0, 0, 0)
      }
      .owl-carousel .owl-item, .owl-carousel .owl-wrapper {
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0)
      }
      .owl-carousel .owl-item {
        min-height: 1px;
        float: left;
        -webkit-backface-visibility: hidden;
        -webkit-touch-callout: none
      }
      .owl-carousel .owl-item img {
        display: block;
        width: 100%
      }
      .owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled {
        display: none
      }
      .no-js .owl-carousel, .owl-carousel.owl-loaded {
        display: block
      }
      .owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev {
        cursor: pointer;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
      }
      .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
        background: 0 0;
        color: inherit;
        border: none;
        padding: 0!important;
        font: inherit
      }
      .owl-carousel.owl-loading {
        opacity: 0;
        display: block
      }
      .owl-carousel.owl-hidden {
        opacity: 0
      }
      .owl-carousel.owl-refresh .owl-item {
        visibility: hidden
      }
      .owl-carousel.owl-drag .owl-item {
        -ms-touch-action: pan-y;
        touch-action: pan-y;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
      }
      .owl-carousel.owl-grab {
        cursor: move;
        cursor: grab
      }
      .owl-carousel.owl-rtl {
        direction: rtl
      }
      .owl-carousel.owl-rtl .owl-item {
        float: right
      }
      .owl-carousel .animated {
        animation-duration: 1s;
        animation-fill-mode: both
      }
      .owl-carousel .owl-animated-in {
        z-index: 0
      }
      .owl-carousel .owl-animated-out {
        z-index: 1
      }
      .owl-carousel .fadeOut {
        animation-name: fadeOut
      }
      @keyframes fadeOut {
        0% {
          opacity: 1
        }
        100% {
          opacity: 0
        }
      }
      .owl-height {
        transition: height .5s ease-in-out
      }
      .owl-carousel .owl-item .owl-lazy {
        opacity: 0;
        transition: opacity .4s ease
      }
      .owl-carousel .owl-item .owl-lazy:not([src]), .owl-carousel .owl-item .owl-lazy[src^=""] {
        max-height: 0
      }
      .owl-carousel .owl-item img.owl-lazy {
        transform-style: preserve-3d
      }
      .owl-carousel .owl-video-wrapper {
        position: relative;
        height: 100%;
        background: #000
      }
      .owl-carousel .owl-video-play-icon {
        position: absolute;
        height: 80px;
        width: 80px;
        left: 50%;
        top: 50%;
        margin-left: -40px;
        margin-top: -40px;
        background: url(owl.video.play.png) no-repeat;
        cursor: pointer;
        z-index: 1;
        -webkit-backface-visibility: hidden;
        transition: transform .1s ease
      }
      .owl-carousel .owl-video-play-icon:hover {
        -ms-transform: scale(1.3, 1.3);
        transform: scale(1.3, 1.3)
      }
      .owl-carousel .owl-video-playing .owl-video-play-icon, .owl-carousel .owl-video-playing .owl-video-tn {
        display: none
      }
      .owl-carousel .owl-video-tn {
        opacity: 0;
        height: 100%;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
        transition: opacity .4s ease
      }
      .owl-carousel .owl-video-frame {
        position: relative;
        z-index: 1;
        height: 100%;
        width: 100%
      }

      .owl-theme .owl-nav {
        margin-top: 10px;
        text-align: center;
        -webkit-tap-highlight-color: transparent; position: absolute; top: -105px; right: 120px; }
        .owl-theme .owl-nav [class*='owl-'] {
          color: #FFF;
          font-size: 14px;
          margin: 5px 10px;
          padding: 4px 7px;
          background: #D6D6D6;
          display: inline-block;
          cursor: pointer;
          border-radius: 3px; }
          .owl-theme .owl-nav [class*='owl-']:hover {
            background: #869791;
            color: #FFF;
            text-decoration: none; }
        .owl-theme .owl-nav .disabled {
          opacity: 0.5;
          cursor: default; }
      
      .owl-theme .owl-nav.disabled + .owl-dots {
        margin-top: 10px; }
      
      .owl-theme .owl-dots {
        text-align: center;
        -webkit-tap-highlight-color: transparent; }
        .owl-theme .owl-dots .owl-dot {
          display: inline-block;
          zoom: 1;
          *display: inline; }
          .owl-theme .owl-dots .owl-dot span {
            width: 10px;
            height: 10px;
            margin: 5px 7px;
            background: #D6D6D6;
            display: block;
            -webkit-backface-visibility: visible;
            transition: opacity 200ms ease;
            border-radius: 30px; }
          .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
            background: #869791; }

            .owl-nav .owl-prev { background: url(../../images/icsArrow1.png) left top no-repeat !important; width: 77px; height: 14px;}
            .owl-nav .owl-next { background: url(../../images/icsArrow2.png) left top no-repeat !important; width: 77px; height: 14px;}
            .owl-nav span { display: none;}

      /** owl End **/

.headerRight a { color: #fff; margin-right: 25px; font-weight: 200; font-size: 18px;}
#hero h2 span { display: block;}
#hero h2 { font-weight: 700;}
#hero p { width: 100%; font-size: 24px; font-weight: 200; color: #333; line-height: 42px; margin-top: 30px;}
.bannerCon a { color: #fff; font-size: 26px; padding: 20px 70px; border-radius: 200px; background: linear-gradient(to right,  rgba(94,61,254,1) 0%,rgba(33,214,163,1) 100%); float: left; margin-top: 30px;}
.bannerCon a:hover {background: linear-gradient(to right,  rgba(33,214,163,1) 0%,rgba(94,61,254,1) 100%);}

.company { float: left; width: 100%; padding: 100px 0;}
.heading { float: left; width: 100%;}
.heading h3 {font-size: 110px; -webkit-text-stroke: 1px #000; color: #fff; font-weight: 800; opacity: 0.3; font-family: Roboto, Arial, Helvetica, sans-serif; margin-left: 75px;}
.heading h1 { font-size: 72px; font-weight: 700; color: #333; margin-top: -70px; position: relative;}
.heading h2 { font-size: 72px; font-weight: 700; color: #333; margin-top: -70px; position: relative;}
.heading p { font-size: 26px; color: #333; margin-top: 15px;}
.com1 { float: left; width: 96%; margin: 20px 2%; text-align:center; transition-duration: 2s; border-radius: 35px; padding: 50px 30px; background: url(../../images/zsOp.png) right bottom no-repeat; height: 430px; box-shadow: 0 0 7px #eee;}
.com1 h5 {background: linear-gradient(to right, #5d3efd 0%, #21d6a4 80%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 28px; font-weight: 700; margin-top: 50px;}
.com1 h6 { font-size: 20px; font-weight: 700; color: #333; margin-top: 15px;}
.com1 img { max-width: 100%;}
.webDesign { float: left; width: 100%;}
.webDesign .heading { text-align: center; width: 100%;}
.webDesign .heading h2 { margin-left: 0;}
.gal { float: left; width: 100%; padding:0 10px; margin-top: 30px;}
.gal .gal1 { float: left; width: 33.33%; padding: 0 10px;}
.gal1Top { float: left; width: 100%; position: relative; height: 440px; border-radius: 15px; overflow: hidden; margin: 10px 0;}
.gal1Top img { width: 100%; height: 100%; object-fit: cover;}
.gt { position: absolute; width: 100%; left: 0; bottom: 0; border-radius: 0 0 15px 15px; background: linear-gradient(0deg,  rgba(127,39,255,1) 0%,rgba(127,39,255,0) 100%); height: 50%;}
.gt h4 { position: absolute; bottom: 40px; left: 40px; color: #fff; font-size: 36px; font-weight: 500;}
.gt:hover {background: linear-gradient(45deg,  rgba(94,61,254,0.9) 0%,rgba(33,214,164,0.9) 100%) !important; height: 100%;}
.gal1Top.gal1Top2 { height: 655px;}
.bg2 .gt {background: linear-gradient(0deg,  rgba(255,137,17,1) 0%,rgba(255,137,17,0) 100%);}
.bg3 .gt {background: linear-gradient(0deg,  rgba(220,134,134,1) 0%,rgba(220,134,134,0) 100%);}
.bg4 .gt {background: linear-gradient(0deg,  rgba(92,75,153,1) 0%,rgba(92,75,153,0) 100%);}
.bg5 .gt {background: linear-gradient(0deg,  rgba(159,112,253,1) 0%,rgba(159,112,253,0) 100%);}
.bg6 .gt {background: linear-gradient(0deg,  rgba(191,49,49,1) 0%,rgba(191,49,49,0) 100%);}
.seoRank .heading { width: 100%; text-align: center;}
.seoRank .heading h3 { margin-left: 0;}
.seoRank { float: left; width: 100%; background: #f2f5fa; padding: 100px 0 0; margin-top: 120px;}
.seoRank .heading h3 { color: #f2f5fa;}
.seoRank ul { margin: 0px 0 -100px 0; padding: 0; list-style-type: none; text-align: center;}
.seoRank ul li { display: inline-block; width: 31%; margin: 35px 1% 0; text-align: center; background: #fff; padding:50px 25px 25px; box-shadow: 0 0 8px #ccc; height: 515px;}
.seoRTop { float: left; width: 100%;}
.seoRBtm { float: left; width: 100%; margin-top: 50px;}
.com1:hover { background-position: top right;}
.tattooB .heading { text-align: center;}
.tattooB { float: left; width: 100%; margin-top: 180px;}
.tbs { float: left; width: 100%; margin: 60px 0;}
.tbsLeft { float: left; width: 43%; padding: 100px 100px 0;}
.tbsRight { float: right; width: 57%; padding-left: 25px;}
.tbsRight img { width: 100%; border: 1px solid #ccc;}
.tbsLeft .heading { text-align: left;}
.tbsLeft .heading h3 { font-size: 100px;}
.tbsLeft .heading h4 {font-size: 48px; font-weight: 700; color: #333; margin-top: -60px; position: relative;}
.tbsLeft .heading p { font-weight: 300; font-size: 24px;}
.tbs.tbs2 .tbsLeft { float: right;}
.tbs.tbs2 .tbsRight { float: left;}
.tbs.contantNew .tbsRight img { width: 48%; margin-right: 0; margin-left: 2%; float: left;}
.tsg { float: left; width: 100%; margin-top: 40px;}
.tsg .heading { width: 100%; text-align: center;}
.tsgLogo { float: left; width: 100%;}
.tsgLogo img { max-width: 100%;}
.iot { float: left; width: 96%; text-align: center; background:#5c40fc; height: 236px; padding-top: 60px; margin-left: 2%;}
.iot h2 { font-size: 60px; font-weight: 900; color: #fff;}
.iot h5 { color: #fff; font-size: 19px; font-weight: 300;}
.tsg2 { float: left; width: 100%; margin-top: 40px;}
.tsg2.tsg3 .iot { float: left; width: 96%; text-align: center; background:#333333; height: 236px; padding-top: 60px; margin-left: 2%;}
.result { float: left; width: 100%; margin-top: 100px; margin-bottom: 40px;}
.result .heading { width: 100%; float: left; text-align: center;}
.result .heading h3 { margin-left: 0;}
.result p { font-size: 24px; font-weight: 300; text-align: center; line-height: 46px; margin-top: 20px; float: left; width: 100%;}
.seoRank ul li img { max-width: 100%;}


.navbar .dropdown .dropdown { position: relative;}
.navbar .dropdown .dropdown ul { left: 0 !important; top:50px !important; width:400px; left: -10% !important; }
.navbar .dropdown .dropdown ul li { width: 100%; min-width: auto;}
.navbar .dropdown ul a { width: 100%;}
.navbar .dropdown .dropdown ul {padding: 15px 40px;}

.howWe.forMobile { display: none;}
.navbar .dropdown .dropdown { position: relative;}
.navbar .dropdown .dropdown ul { left: 0 !important; top:50px !important; width:400px; left: -10% !important; }
.navbar .dropdown .dropdown ul li { width: 100%; min-width: auto;}

.sidemenu {
            height: 100%;
            width: 0;
            position: fixed;
            top: 0;
            right: 0;
            background-color: #111;
            overflow-x: hidden;
            transition: 0.5s;
            padding-top: 60px;     list-style-type: none; 
        }
        .sidemenu ul { margin: 0; padding: 30px 30px 30px; list-style-type: none;}
        .sidemenu ul li { margin: 10px 0; float: left; width: 100%;}
        .sidemenu ul li img { margin-right: 7px;}

        .sidemenu a {
          text-decoration: none;
          color: #aaa;
          transition: all 0.3sease; font-size: 15px; 
        }

        .sidemenu a:hover {
            color: #f1f1f1;
        }
        .open-btn {
            font-size: 30px;
            color: #111;
            border: none;
            position: absolute;
            top: 19px;
            right: 70px;
            cursor: pointer;
            border-radius: 5px; background: none;
        }

        .close-btn {
            position: absolute;
            top: 20px;
            left: 25px;
            font-size: 36px;
            color: #818181;
            text-decoration: none;
        }
        .sidemenu a.close-btn { font-size: 40px; color: #fff;}
        .sidemenu ul li .togalMenu a {width: 100%;
          margin-bottom: 20px;
          display: block;
          color: #fff;
          font-size: 18px; }
          .sidemenu ul li .togalMenu {
            width: 100%;
    margin-top: 0;
    border-top: 2px solid;
    border-image-source: linear-gradient(to left, #21d6a4, #5d3efd);
    border-image-slice: 1;
    padding-top: 25px;
          }

.sidemenu ul li .togalMenu img.sidebar-add {margin-top: 26px;}
.mMenu { display: none;}
.togleDots { position: absolute; top: 35px; right: 70px;}


.form { float: left; margin-top: 120px; width: 100%; position: relative;}
      .form .container { background: #fafafc; border-radius: 35px; min-height: 200px; padding: 60px;}
      .form .heading.heading2 { text-align: left;}
      .form .heading.heading2 h2 b { text-align: left;}
      .form .heading h2 span { color: #fafafc;}
      .ctd { float: left; width: 100%; margin-top: 40px;}
      .ctd ul { margin: 0; padding: 0; list-style-type: none;}
      .ctd ul li { float: left; width: 100%; margin: 7px 0;}
      .ctd ul li a { font-size: 16px; color: #333;}
      .ctd.phoneNo ul li a { margin-left: 15px;}
      .ctd h5 { font-size: 20px; font-weight: 600; color: #333;}
      .ctd.emailId ul li a { margin-right: 15px;}
      .ctd.socalMedia ul li { float: left; margin-right: 15px; width: auto;}
      .forms form { float: left; width: 100%;}
      .forms form fieldset {float: left; width: 100%; margin: 15px 0;}
      .forms form fieldset input { width: 100%; height: 60px; border: none; border-bottom: 1px solid #aaa; background: none; font-size: 18px; font-weight: 400; outline: none;}
      .forms form fieldset select { width: 100%; height: 60px; border: none; border-bottom: 1px solid #aaa; background: none !important; font-size: 18px; box-shadow: none !important; font-weight: 400; outline: none !important; color: #777; appearance: none; -moz-appearance: none; -webkit-appearance: none; background: url(../../images/form-arrow.png) 99% center no-repeat !important;}
      .forms form fieldset textarea { width: 100%; height: 120px; border: none; border-bottom: 1px solid #aaa; background: none; font-size: 18px; font-weight: 400; outline: none;}
      .forms form fieldset input.submitBtn { border: none; background: linear-gradient(to right, #5d3efd 0%, #21d6a4 100%); font-weight: 400; color: #fff; border-radius: 200px;}

      .form::after { position: absolute; content: ""; left: 0; top: 100px; background: url(../../images/f1.png) left top no-repeat; width: 116px; height: 188px;}

      .calTo { float: left; width: 100%; margin-top: 150px; }
      .calTo .container {min-height: 250px; background: linear-gradient(to right, #5d3efd 0%, #21d6a4 100%); border-radius: 35px;}
      .calTo .ctA { float: left; width: 100%; padding: 50px 80px;}
      .ctaLeft { float: left; margin-top: 12px;}
      .ctaRight { float: left;}
      .ctaRight a { }
      .ctaLeft h3 { font-size: 50px; color: #fff; font-weight: 300; }
      .ctaRight a:hover {background: linear-gradient(to right, #22d6a4 0%, #5e3dfd 100%); color: #fff;}





      footer { float: left; width: 100%; background: #F7F7F7; margin-top: 120px; padding: 70px 0 40px;}
      .fl { float: left; width: 100%; margin-top: 50px; padding-right: 40px;}
      .fl form { height: 56px; width: 100%; background: #333b4b; border-radius: 200px; margin-top: 30px;} 
      .fl form input { width: 75%; background: none; height: 56px; border: none; border-radius: 200px 0 0 200px; padding-left: 25px; color: #fff; float: left; outline: none;}
      .fl form input.newsBtn { width: 25%; float: right; height: 56px; background: url(../../images/newsBtn.png) center center no-repeat; text-indent: 99999999999px;}
      .fl h5 { color: #000; font-size: 20px; font-weight: 600;}
      .footerMenu { float: left; padding:0 25px; width: 25%;}

      .footerMenu ul { margin: 7px 0 0 0; padding: 0; list-style-type: none; float: left; width: 100%;}
      .footerMenu ul li { float: left; margin: 10px 0; width: 100%;}
      .footerMenu ul li a { float: left; font-size: 16px; color: #333; text-decoration: none;}
      .footerMenu ul li a:hover { background: linear-gradient(to right, #5d3efd 0%, #21d6a4 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;}
      .footerMenu h5 { color: #000; font-size: 20px; font-weight: 600;}
      .fm { margin:20px 0; float: left;}
      .footerMenu.footerMenu1 { width: 28%;}
      .footerMenu.footerMenu2 { width: 28%;}
      .footerMenu.footerMenu3 { width: 19%;}
      .footerMenu.footerMenu4 { width: 25%;}
      .footerBtm { float: left; width: 100%; margin-top: 30px;}
      .fbLeft { float: left;}
      .fbRight { float: right;}
      .fbLeft p { color: #333; font-weight: 300; font-size: 16px;}
      .footerLogo { margin-top: 20px;}
      .forms form fieldset input.submitBtn:hover {background: linear-gradient(to right, #22d6a4 0%, #5e3dfd 100%); color: #fff;}



.headerUp { float: left; width: 100%; height: 42px; background: #5B42FA;}
header#header.fixed-top.header-scrolled { top: 0;}
.huLeft { float: left; margin-top: 11px; width: 35%;}
.huLeft h6 { font-size: 15px; color: #ccc; font-weight: 300;}
.huLeft a { display: inline-block; color: #fff; margin-left: 10px; font-weight: 600;}
.huLeft a:hover { color: #22d5a5;}
.huRight { float: right;}
.huCenter { float: left; margin-right: 100px; margin-top: 6px;}
.hucRIght { float: right;}
.hucRIght a { font-size: 13px; font-weight: 500; border-radius: 150px; padding: 5px 25px; margin-top: 6px; float:left; background: #21d6a4; color: #000;}

.textSliderWrap {
  height: 30px;
  overflow: hidden;
  position: relative; text-align: left;
}

.textSliderSlides {
  position: relative;
  height: 100%;
}

.textSlide {
  position: absolute;
  width: 100%;
  height: 100%;
  align-items: left;
  justify-content: left;
  font-size: 13px;
  transform: translateY(100%);
  opacity: 0;
  transition: all 0.5s ease; color: #ddd; font-weight: 300;
}
.textSlide span { color: #fff; font-weight: 400; margin-right: 5px;}
.textSlide b { margin-right: 10px; background: #22d4a6; color: #0b8a69; padding: 5px 5px; float: left; line-height: 10px; font-weight: 700; font-size: 10px; border-radius: 5px;}

.textSlide.activeText {
  transform: translateY(0);
  opacity: 1;
}

.textSlide.prevText {
  transform: translateY(-100%);
  opacity: 0;
}

.textSliderControls {
  margin-top: 10px;
}

.fbRight img { filter: brightness(0) saturate(100%) invert(50%);}

.fl ul { margin: 10px 0 0 0; padding: 0; list-style-type: none;}
.fl ul li { float: left; width: 100%; margin: 10px 0;}
.fl ul li a { color: #333;}
.fl ul li a:hover {background: linear-gradient(to right, #5d3efd 0%, #21d6a4 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}








      

@media (max-width:1900px) {
#hero h2 { font-size: 90px; line-height: 100px;}
#hero p {font-size: 22px; line-height: 38px;}
.bannerCon a { font-size: 22px;}
.com1 h5 {font-size: 22px;}
.com1 h6 { font-size: 18px;}
.com1 {height: 350px;}
.heading h3 {font-size: 90px;}
.heading h1 {font-size: 60px;}
.heading h2 {font-size: 60px;}
.gt h4 {font-size: 28px;}
.webDesign .heading h3 { margin-left: 0;}
.heading p {font-size: 22px;}
.seoRank ul li { height: auto;}
.tbsLeft .heading h3 {font-size: 82px; margin-left: 0;}
.tbsLeft .heading h4 { font-size: 36px;}
.tbsLeft .heading p { font-size: 20px;}
.iot h2 {font-size: 48px;}
.iot h2 sup {font-size: .45em; margin-right: 10px;}
.iot h5 { font-size: 17px;}
.result p { font-size: 20px; line-height: 38px;}

.navbar a, .navbar a:focus {font-size: 16px; padding: 10px 15px 10px 15px;}
.navbar a, .navbar a:focus {font-size: 18px; padding: 10px 23px 10px 23px;}

.headerUp .container { width: 100%; max-width: 100%;}

.email a {font-size: 18px;}
.email a span {padding: 12px 35px;}
.open-btn {right: 25px;}
 #header .container {
    width: 100%;
    max-width: none;
    padding: 0 25px;
  }

 .email {
    margin-right: 50px;
  }


}

@media (max-width:1700px) {
.navbar a, .navbar a:focus {font-size: 18px; padding: 10px 20px 10px 20px;}
.navbar a i, .navbar a:focus i {margin-left: 0;}
.huLeft {width: 45%;}

.hrtLeft {padding: 60px 190px 100px 60px;}
.hrtRight {padding: 60px;}
.hrtRight ul li {margin: 10px 0;}
.email a span { padding: 12px 20px; font-size: 15px;}
.navbar a, .navbar a:focus {font-size: 18px; padding: 10px 15px 10px 15px;}
.navbar a i, .navbar a:focus i {margin-left: 0;}
}

@media (max-width:1500px) {
.navbar a, .navbar a:focus {font-size: 16px; padding: 10px 13px 10px 13px;}
}

@media (max-width:1366px) {
#hero h2 {font-size: 60px; line-height: 60px;}
#hero { height: 700px !important;}
#hero p {font-size: 18px; line-height: 32px;}
.bannerCon a {font-size: 20px;}
#hero .carousel-container { display: inline-block !important; top: 150px;}
.heading h3 {font-size: 72px; margin-left: 0;}
.heading h1 {font-size: 48px; margin-top: -50px;}
.heading h2 {font-size: 48px; margin-top: -50px;}
.heading p {font-size: 18px; margin-top: 10px;}
.com1 h5 {font-size: 18px;}
.com1 h6 {font-size: 15px;}
.gt h4 {bottom: 25px; font-size: 24px;}
.gal1Top {height: 300px;}
.gal1Top.gal1Top2 {height: 445px;}
.tbsLeft .heading h3 { font-size: 72px;}
.tbsLeft .heading p { font-size: 18px;}
.result p { font-size: 18px; line-height: 32px; margin-top: 10px;}
.iot h2 { font-size: 40px;}
.iot {padding-top: 75px;}

.company {padding: 90px 0;}
.seoRank { margin-top: 90px; padding-top: 90px;}
.tattooB { margin-top: 160px;}
.result { margin-top: 90px;}

.navbar a, .navbar a:focus { font-size: 15px; padding: 10px 12px 10px 12px;}
.navbar .dropdown ul {width: 960px;}


}

@media (max-width:1300px) {
.togleDots {display: none;}
.navbar { padding: 0; position: absolute; top: 35px; right: 25px;}
.navbar.navbar-mobile { position: fixed; right: 0;}
.mMenu button { top: 0 !important;}

#navbar { display: none;}
#cssmenu ul.open ul.open {top: 0;}
#cssmenu ul ul li a { font-size: 14px;}
.mMenu .button {right: 0;}
.navbar { padding: 0; position: absolute; top: 35px; right: 25px;}
.navbar.navbar-mobile { position: fixed; right: 0;}

.mMenu { display:block;}

nav{position:relative;width:100%;}
      #cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #head-mobile{border:0;list-style:none;line-height:1;display:block;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
      #cssmenu:after,#cssmenu > ul:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
      #cssmenu #head-mobile{display:none}
      #cssmenu{}
      #cssmenu > ul{margin:0;}
      #cssmenu > ul > li{float:left}
      #cssmenu > ul > li > a{text-transform: uppercase;padding:16px 25px;font-size:16px;text-decoration:none;color:#111111;font-weight:600; font-family: "Lato", sans-serif;}
      #cssmenu > ul > li:hover > a,#cssmenu ul li.active a{}
      #cssmenu > ul > li:hover,#cssmenu ul li.active:hover,#cssmenu ul li.active,#cssmenu ul li.has-sub.active:hover{}
      #cssmenu ul li.active a{border:none;}
      #cssmenu > ul > li.has-sub > a{padding-right:30px}
      #cssmenu > ul > li.has-sub > a:after{position:absolute;top: 24px;
        right: 16px;
        width: 8px;
        height: 1px;
        display: block;
        background: #000;
        content: '';
        transform: rotate(44deg);}
      #cssmenu > ul > li.has-sub > a:before{position:absolute;top: 21px;
        right: 14px;
        display: block;
        width: 1px;
        height: 8px;
        background: #000; transform: rotate(40deg); content:'';-webkit-transition:all .25s ease;-ms-transition:all .25s ease;transition:all .25s ease}
      #cssmenu > ul > li.has-sub:hover > a:before{}
      #cssmenu ul ul{position:absolute;left:-9999px; z-index: 9999; margin: 0; padding: 0; padding: 15px 0 25px; background: #003e6a;}
      #cssmenu ul ul li{height:0;-webkit-transition:all .25s ease;-ms-transition:all .25s ease;transition:all .25s ease}
      #cssmenu ul ul li:hover{}
      #cssmenu li:hover > ul{left:auto}
      #cssmenu li:hover > ul > li{height:auto;}
      #cssmenu ul ul ul{margin-left:-350px;top:0; background: #000; width: 350px;}
      #cssmenu ul ul li a{padding: 8px 25px 6px;width:450px;font-size:15px;text-decoration:none;color:#ddd;font-weight:400; line-height: 24px;}
      #cssmenu ul ul li:last-child > a,#cssmenu ul ul li.last-item > a{border-bottom:0}
      #cssmenu ul ul li:hover > a,#cssmenu ul ul li a:hover{color:#fafafa}
      #cssmenu ul ul li.has-sub > a:after{position:absolute;top:16px;right:11px;width:8px;height:2px;display:block;background:#ddd;content:''}
      #cssmenu ul ul li.has-sub > a:before{position:absolute;top:13px;right:14px;display:block;width:2px;height:8px;background:#ddd;content:'';-webkit-transition:all .25s ease;-ms-transition:all .25s ease;transition:all .25s ease}
      #cssmenu ul ul > li.has-sub:hover > a:before{}
      #cssmenu ul ul li.has-sub:hover,#cssmenu ul li.has-sub ul li.has-sub ul li:hover{background:none;}
      #cssmenu ul ul ul li.active a{border-left:1px solid #000}
      #cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active> a{border-top:1px solid #000}


nav{width:100%;}
  #cssmenu{width:100%}
  #cssmenu ul{width:100%;display:none}
  #cssmenu ul li{width:100%;}
  #cssmenu ul li a { color: #fff;}
  #cssmenu ul li a:hover {}
  #cssmenu ul li:hover{}
  #cssmenu ul ul li,#cssmenu li:hover > ul > li{height:auto}
  #cssmenu ul li a,#cssmenu ul ul li a{width:100%;border-bottom:0}
  #cssmenu > ul > li{float:none}
  #cssmenu ul ul li a{padding-left:25px}
  #cssmenu ul ul li{background:#f3f3f3!important;}
  #cssmenu ul ul li:hover{}
  #cssmenu ul ul ul li a{padding-left:35px}
  #cssmenu ul ul li a{color:#000;background:none}
  #cssmenu ul ul li:hover > a,#cssmenu ul ul li.active > a{color:#000}
  #cssmenu ul ul,#cssmenu ul ul ul{position:relative;left:0;width:100%;margin:0;text-align:left}
  #cssmenu > ul > li.has-sub > a:after,#cssmenu > ul > li.has-sub > a:before,#cssmenu ul ul > li.has-sub > a:after,#cssmenu ul ul > li.has-sub > a:before{display:none}
  #cssmenu #head-mobile{display:block;padding:23px;color:#ddd;font-size:12px;font-weight:700}
  .button{width:55px;height:46px;position:absolute;right:13px;top:0;cursor:pointer;z-index: 12399994; background: url(../../images/dToggle.png) center center no-repeat;}
  .button:after{position:absolute;top:22px;right:20px;display:block;height:4px;width:20px;border-top:2px solid #dddddd;border-bottom:2px solid #dddddd;content:''}
  .button:before{-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;position:absolute;top:16px;right:20px;display:block;height:2px;width:20px;background:#ddd;content:''}
  .button.menu-opened:after{-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;top:23px;border:0;height:2px;width:19px;background:#fafafa;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}
  .button.menu-opened:before{top:23px;background:#fafafa;width:19px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}
  #cssmenu .submenu-button{position:absolute;z-index:99;right:0;top:0;display:block;border-left:1px solid #fff;height:46px;width:46px;cursor:pointer}
  #cssmenu .submenu-button.submenu-opened{background:none;}
  #cssmenu ul ul .submenu-button{height:46px;}
  #cssmenu .submenu-button:after{position:absolute;top:22px;right:19px;width:8px;height:2px;display:block;background:#ddd;content:''}
  #cssmenu ul ul .submenu-button:after{top: 17px; right: 19px;}
  #cssmenu .submenu-button.submenu-opened:after{background:#fafafa}
  #cssmenu .submenu-button:before{position:absolute;top:19px;right:22px;display:block;width:2px;height:8px;background:#ddd;content:''}
  #cssmenu ul ul .submenu-button:before{top: 14px; right: 22px;}
  #cssmenu .submenu-button.submenu-opened:before{display:none}
  #cssmenu ul ul ul li.active a{border-left:none}
  #cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active > a{border-top:none}
  .button::before { display: none;}
  .button::after { display: none;}
  .button.menu-opened {background: url(../../images/dCross.png) center center no-repeat;}
  .headerTop { margin-right: 65px;}
  .headerBtm { height: 0;}
  .logo {margin-top: 15px;}
  #cssmenu ul.open {
    position: absolute;
    top: 6px;
    width: 100%;
    left: 0;
    z-index: 9999999;
    padding: 0;
    background: linear-gradient(to bottom,  rgba(92,63,252,1) 0%,rgba(39,205,170,1) 100%);

  }
  #cssmenu ul ul li .submenu-button::before {background: #000;}
  #cssmenu ul ul li .submenu-button::after {background: #000;}
  #cssmenu ul ul li .submenu-button.submenu-opened::after { background: #000;}
  #cssmenu ul.open ul.open { position: relative; }
  #cssmenu ul.open ul.open ul.open li {background: #ccc !important;}
  #cssmenu ul.open ul.open { position: relative; }
  #cssmenu ul.open ul.open ul.open li {background: #ccc !important;}
  #cssmenu { margin-right: 0;}

  .mMenu {
    width: 100%;
    position: absolute;
    right: 0;
  }
  #cssmenu ul.open {top: 70px;}
  #header .logo {z-index: 99; position: relative;}
  .email { position: relative; z-index: 99;}
  .mMenu button { top: 0 !important;}

  #navbar { display: none;}
  #cssmenu ul.open ul.open {top: 0;}
  #cssmenu ul ul li a { font-size: 14px;}

  .mMenu .button {right: 0;}
header#header.fixed-top.header-scrolled { position: absolute;}
.huCenter {margin-right: 50px;}
.huCenter img {width: 300px;}

.open-btn {
    display: none;
  }

#cssmenu .button {top: -2px;}

}

@media (max-width:1200px) {
#hero h2 {font-size: 48px;}
#hero p {font-size: 16px; line-height: 30px; margin-top: 15px;}
.bannerCon a {padding: 15px 40px; font-size: 16px; margin-top: 15px;}
#hero { height: 610px !important; text-align: left;}
#hero .carousel-container { text-align: left; top: 130px;}
.heading h3 { font-size: 60px;}
.heading h1 {font-size: 36px; margin-top: -40px;}
.heading h2 {font-size: 36px; margin-top: -40px;}
.heading p { font-size: 16px;}
.gt h4 {font-size: 20px;}

.tbsLeft .heading h3 { font-size: 60px;}
.tbsLeft .heading p { font-size: 16px;}
.result p { font-size: 16px;}
.company {padding: 70px 0;}
.seoRank { margin-top: 70px; padding-top: 70px;}
.tattooB { margin-top: 140px;}
.tbs {margin: 40px 0;}
.result { margin-top: 70px;}


}
@media (max-width:1100px) {}
@media (max-width:1024px) {
.heading h3 { font-size: 48px;}
.heading h1 {font-size: 30px; margin-top: -30px;}
.heading h2 {font-size: 30px; margin-top: -30px;}
.heading p { font-size: 15px;}
.company .col-3 { width: 50%;}
.gt h4 {font-size: 16px;}
.gal1Top {height: 200px;}
.gal1Top.gal1Top2 {height: 300px;}
.gt h4 {left: 20px; bottom: 15px;}
.seoRank ul li {width: 47%; margin-top: 20px;}
.tbsLeft .heading h3 { font-size: 40px;}
.tbsLeft .heading h4 {font-size: 30px; margin-top: -30px;}
.tbsLeft {padding: 0px 20px 0;}
.tbsRight {width: 50%;}
.tbsLeft {width: 50%;}
.tsg2 .col-3:first-child { width: 100%; text-align: center;}
.tsg2 .col-3 { width: 33.33%;}
.result p { font-size: 15px;}
.company {padding:50px 0;}
.seoRank { margin-top: 50px; padding-top: 50px;}
.tbs {margin: 20px 0;}
.result { margin-top: 50px;}

.headerUp { height: 90px;}
.huLeft { width: 100%; text-align: center;}
.huRight { width: 100%;}
#header { top: 90px;}

.textSlide {justify-content:center; text-align: center;}
.textSlide b { float: none; display: inline-block;}

}
@media (max-width:1023px) {}
@media (max-width:991px) {
#hero h2 {font-size: 36px; line-height: 42px;}
#hero p { font-size: 15px; line-height: 26px;}
#hero {height: 560px !important;}
#hero .carousel-container { left: 15px; right: 15px;}
.headerRight a {font-size: 15px;}
.tattooB { margin-top: 120px;}

}
@media (max-width:960px) {}
@media (max-width:900px) {}
@media (max-width:850px) {}
@media (max-width:800px) {}
@media (max-width:768px) {}
@media (max-width:767px) {
.headerRight a span {display: none;}
.headerRight a {margin-right: 8px;}
.gal .gal1 { width: 100%;}
.gal1Top { height: 400px;}
.gal1Top.gal1Top2 { height: 400px;}
.tbsLeft .heading h4 {font-size: 24px;}

.tbsRight {width:100%; padding: 0 15px;}
.tbsLeft {width:100%;}
.iot h5 {font-size: 15px;}
.iot h2 {font-size: 30px;}
.iot {height: 150px; padding-top: 40px;}
.tsg2.tsg3 .iot {height: 160px; padding-top: 40px;}
.company {padding:30px 0;}
.gal { margin-top: 10px;}
.seoRank { margin-top: 30px; padding-top: 30px;}
.tattooB { margin-top: 110px;}
.tbs {margin: 10px 0;}
.result { margin-top: 30px; margin-bottom: 10px;}

}
@media (max-width:700px) {
.seoRank ul li {width: 100%; margin:5px 0;}
}
@media (max-width:640px) {
#hero h2 { font-size: 30px; line-height: 36px;}
}
@media (max-width:600px) {
.tsg2 .col-3 { width: 100%; margin: 5px 0;}
.tsg2 { margin-top: 0;}

.textSliderWrap { height: 43px;}
.textSlide b { margin-right: 5px;}
.headerUp {height: 140px;}
#header { top: 140px;}
.huCenter { margin-right: 0; width: 100%; text-align: center;}
.hucRIght { width: 100%; text-align: center; margin-top: 8px;}
.hucRIght a { float: none; display: inline-block;}

#header .logo {width: 200px;}
#header .logo img { width: 100%;}
.email a span { font-size: 15px; padding: 8px 18px;}
.navbar {top: 25px; right: 15px;}
.email {margin-right: 45px;}
#header .container {padding: 0 10px;}
}
@media (max-width:570px) {
#hero { height: 620px !important;}
.company .col-3 { width: 100%;}
.com1 { height: auto; padding: 30px 30px;}
.com1 h5 {margin-top: 20px;}
.gal1Top { height: 300px;}
.gal1Top.gal1Top2 { height: 300px;}
.gal .gal1 { padding: 0;}
.gal1Top {margin: 5px 0;}
}
@media (max-width:520px) {}
@media (max-width:480px) {
  #hero { height: 660px !important;}
  #header .logo img { width: 210px;}
  #hero .carousel-container {top: 100px;}
   #header .logo {
    width: 175px;
  }
  .email a span {padding: 8px 15px;}
  #header .logo img { width: 100%;}
}
@media (max-width:420px) {
  #hero { height: 700px !important;}
}














