/*!
Theme Name: Vega
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: vega
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Vega is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/

Tags: one-column, two-columns, right-sidebar, grid-layout, flexible-header, custom-header, custom-colors, custom-menu, featured-image-header, featured-images, footer-widgets, full-width-template, theme-options, translation-ready,
*/


/* ----------------- THEME ADDITIONAL CSS ------------------ */

*,*:before,*:after{
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box
}

html,body{
	  position:relative;
	  font-family: 'Open Sans', sans-serif;
	  font-weight:500;
	  -webkit-font-smoothing:antialiased;
	  -moz-font-smoothing:antialiased;
	  -o-font-smoothing:antialiased;
	  overflow-x:hidden
}

html{
	height:100%
}

.brand.img{
	max-width:60px;
}

.before-animate{
	overflow:hidden!important;
	width:100%;
	height:100%
}

.size-1{
	font-family: 'Open Sans', sans-serif;
	font-size:88px;
	font-weight:900;
	word-spacing:100vh
}

.size-2{
	font-family: 'Open Sans', sans-serif;
	font-size:69px;
	font-weight:900;
}

.bg-holder{
	position:absolute;
	top:0;
		left:0;
	width:100%;
	height:100%;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center;
}

*.show-on-hover,*:hover .hide-on-hover{
	display:none;
}

*:hover .show-on-hover{
	display:block;
}

.ajax-form{
	position:relative;
}

.menu-full{
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:1000;
}

.menu-full.is-active{
	display:block
}
.menu-full .menu-close,.menu-full .menu-bg{
	position:absolute;
	top:0;
	height:100%;
	z-index:1
}

.menu-full .menu-close{
	left:0;
	width:100%;
	z-index:2
}

.menu-full .menu-bg{
	width:0;
	left:50%;
	background-color:#000;
	-webkit-transition:width 0.25s;
	transition:width 0.25s;
	-webkit-transform:skewX(-45deg) translateX(-50%);
	transform:skewX(-45deg) translateX(-50%)
}

.menu-full.is-active .menu-bg{
    width:calc(100vw + 100vh)
}

.menu-full>.inner{
    position:relative;
    width:100%;
    height:100%;
    z-index:3
}

.menu-full ul{
   position:relative;
   list-style:none;
   padding:0;
   margin:0;
   text-align:center;
   max-width:420px;
   z-index:3;
   top: 20%;
   left: 36%;
}

.menu-full ul li{
	display:inline-block;
	margin-bottom:12px;
	opacity:0;
	-webkit-transition:opacity 0.4s;
	transition:opacity 0.4s
}

.menu-full.is-active ul li{
	opacity:1;
	-webkit-transition-delay:0.25s;
	transition-delay:0.25s
}

.menu-full.is-active ul li:last-of-type{
    margin-bottom:0
}

.menu-full ul li a{
   color:#fff;
   font-family: 'Open Sans', sans-serif;
   font-weight:700;
   font-size:28px !important;
   text-transform:uppercase;
   letter-spacing:15px;
   display:inline-block;
   overflow:hidden;
   position:relative;
   margin-bottom: -36px;text-decoration: none;
}

.menu-full ul li a:after{
   content:'';
   display:block;
   position:absolute;
   right:100%;
   bottom:11px;
   width:100%;
   height:2px;
   background-color:#fff;
   -webkit-transition:right 0.6s;
   transition:right 0.6s;
}

.menu-full ul li a:hover:after{
    right:-100%;
}

.menu-full ul li:last-of-type a{
    letter-spacing:20px;
}

.menu-full ul li a:hover{
    text-decoration:none !important;
}

@media screen and (max-width:680px){
    .menu-full ul li a{
       font-size:calc(14px + 4vw)
    }
}

.header{
   position:fixed;
   top:0;
   left:0;
   width:100%;
   z-index:3;
   pointer-events:none;
}

.header a,.header span{
    cursor:pointer;
    pointer-events:auto
}

.before-animate .header{
    margin-top:-120px;
    opacity:0;
    transition:margin 0.8s,
    opacity 1.2s;
    transition-delay:0.5s;
}

.after-animate .header{
    margin-top:0;
    opacity:1;
    transition:margin 0.8s,
    opacity 1.2s;
    transition-delay:0.5s
}

.header .brand{
    position:relative;
    display:block;
    width:231px;
    height:45px;
    margin-top:5px;
    padding:10px 30px;
    text-align:center;
    -webkit-transition:background-color 0.4s,margin 0.4s,width 0.4s;
    transition:background-color 0.4s,margin 0.4s,width 0.4s
}

.header .logo-white,.header .logo-black{
    position:absolute;
    top:10px;
    left:30px;
    max-width:unset;
    -webkit-transition:opacity 0.2s;
    transition:opacity 0.2s;
    height: 50px;
}

.header.header-mini .brand{
    background-color:transparent;
    margin-top:0;
    padding:10px;
    width:45px
}

.header .logo-black,.header .logo-n-black{
    opacity:0;
}

.header.header-mini .logo-white{
    opacity:0!important;
}

.header.header-mini .logo-black{
    display:block;
}

.header.header-mini .logo-n-black{
    opacity:1;
}

.header ul{
    list-style:none;
    padding-left:0;
    padding-top:15px;
    padding-right:30px;
    /*margin:0;*/
    opacity:1;
    transition:padding 0.4s;
    margin-top: -53px;
}

.header ul li{
    position:relative;
    text-align:right;
    /*margin-bottom:10px;*/
}

.header ul li a{
    text-decoration: none;
}

.header.header-mini ul{
	padding-right:15px;
}

.header.header-mini ul li{
	display:none;
}

.header .toggle-menu{
	display:none;
	width:45px;
	height:45px;
	padding-top:17px;
	padding-left:12px;
	background-color:#E94345;
	cursor:pointer;
	pointer-events:auto;
	overflow:hidden;
}

.toogle-menu-icon , .logo-m-black{
    display:block;
}

.header .toggle-menu>.inner{
	width:21px;
}

.header .toggle-menu>.inner div{
	position:relative;
	width:100%;
	height:1px;
	margin-bottom:4px;
	background-color:#fff;
}

.header .toggle-menu>.inner div:last-of-type{
	margin-bottom:0;
}

.header .toggle-menu>.inner div:after{
    content:'';
    display:block;
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;
    background-color:#E94345;
    -webkit-animation:toggleMenu 2s infinite;
    animation:toggleMenu 2s infinite;
}

.header .toggle-menu>.inner div:nth-of-type(2):after{
	animation-delay:0.4s;
}

.header .toggle-menu>.inner div:nth-of-type(3):after{
	animation-delay:0.6s;
}

@keyframes toggleMenu{
	from{left:-100%}to{left:100%}
}

@-webkit-keyframes toggleMenu{
	from{left:-100%}to{left:100%}
}

.header.header-mini .toggle-menu{
	display:block;
}

.header ul li:last-of-type{
	margin-bottom:0;
}

.header ul li a,.header ul li span{
	position:relative;
	color:#fff;
	font-family: 'Open Sans', sans-serif;
	font-size:15px;
	font-weight:700;
	letter-spacing:0px;
	text-transform:uppercase;
	-webkit-transition:color 0.2s;
	transition:color 0.2s;
}

.header ul li a:before,.header ul li span:before{
	content:'';
	position:absolute;
	top:calc(50% - 1px);
	right:100%;
	width:12px;
	height:2px;
	margin-right:15px;
	background-color:#E94345;
}

.header ul li a:hover,.header ul li span:hover{
	color:#E94345;
	text-decoration:none !important;
}

.header[theme=black-black].logo-white,.header[theme=black-white].logo-white,.header[theme=white-black].logo-black,.header[theme=white-white].logo-black{opacity:0}.header[theme=black-black].logo-black,.header[theme=black-white].logo-black,.header[theme=white-black].logo-white,.header[theme=white-white].logo-white{
	opacity:1;
}

.header[theme="black-white"] ul li a, .header[theme="black-white"] ul li span, .header[theme="white-white"] ul li a, .header[theme="white-white"] ul li span {
    color: #000;
}

.header[theme=black-black] ul li a,.header[theme=black-black] ul li span,.header[theme=white-black] ul li a,.header[theme=white-black] ul li span{
	color:#000;
}

@media screen and (max-width:767px){
  .header .brand{
      background-color:#fff0;
      margin-top:0;
      padding:10px;
      width:45px;
  }

  .header .logo-white{
      opacity:0!important;
  }

  .header .logo-black{
      display:none;
  }

  .header .logo-n-black{
      opacity:1;
  }

  .header ul{
      padding-right:15px;
  }

  .header ul li{
      display:none;
  }

  .header .toggle-menu{
		display:block;
  }

  .header .toggle-menu1{
		display:block;
  }
}

.hero{
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	height:100%;
	background-color:#fff;
	z-index:1;
}

.hero .front,.hero .back{
	position:relative;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:flex;
	width:100%;
	height:100%;
}

.hero .front{
	position:absolute;
	top:0;
	right:0;
	z-index:1;
}

.before-animate .hero .front{
	margin-top:120px;
	opacity:0;
	-webkit-transition:right 0.8s cubic-bezier(1,.4,.7,1),top 0.8s cubic-bezier(1,.4,.7,1),opacity 1.4s,margin 100s;
	transition:right 0.8s cubic-bezier(1,.4,.7,1),top 0.8s cubic-bezier(1,.4,.7,1),opacity 1.4s,margin 100s;
}

.after-animate .hero .front{
	margin-top:0;
	opacity:1;
	-webkit-transition:right 0.8s cubic-bezier(1,.4,.7,1),top 0.8s cubic-bezier(1,.4,.7,1),opacity 1.4s,margin 0.8s;
	transition:right 0.8s cubic-bezier(1,.4,.7,1),top 0.8s cubic-bezier(1,.4,.7,1),opacity 1.4s,margin 0.8s;
}

.hero .front h1{
	position:absolute;
	top:50%;
	right:calc(43% - 280px);
	width:560px;
	color:#000;
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	transform:translateY(-50%);
}

.hero .back a{
	color:inherit;
}

.hero .back>.bb{
	position:relative;
	height:100%;
}

.hero .back>.bb:first-of-type{
	display:-webkit-box;
	display:-moz-box;display:-ms-flexbox;
	display:-webkit-flex;
	display:flex;
	align-items:center;
	background-color:#E94345;
	width:50%;
}

.hero .back>.bb:first-of-type .inner{
	position:relative;
	opacity:0;
	left:0;
	width:35vw;
	max-width:560px;
	color:#fff;
	margin-left:10%;
}

.hero .back>.bb:first-of-type .inner:before{
	content:'';
	display:block;
	position:absolute;
	bottom:calc(100% + 15px);
	left:0;
	width:30px;
	height:3px;
	background-color:#fff;
}

.scroll-guide{
	position:absolute;
	left:50%;
	top:100vh;
	white-space:nowrap;
	-webkit-transform-origin:left top 0;
	transform-origin:left top 0;
	-webkit-animation-name:bounce;
	animation-name:bounce;
	-webkit-animation-duration:4s;
	animation-duration:4s;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-iteration-count:infinite;
	animation-iteration-count:infinite;
}

.scroll-guide div{
	display:inline-block;
	vertical-align:middle;
	width:48px;
	height:3px;
	margin-right:10px;
	background-color:#E94345;
}

.scroll-guide span{
	color:#E94345;
	font-family: 'Open Sans', sans-serif;
	font-size:13px;
	font-weight:700;
	letter-spacing:1px;
}

@media screen and (max-width:768px){
  .toogle {
		  margin-left: 42px !important;
		  display: block !important;
		  margin-top: -36px !important;
   }

   .header .toogle1 {
 		  display: none;
    }

  .hero .front h1{
		width:auto!important;
		font-size:calc(11px + 10vw);
		right:unset!important;
		left:0!important;
		text-align:center;
   }

   .hero .front h2{
   		width:auto!important;
   		font-size:calc(11px + 10vw);
   		right:unset!important;
   		left:10% !important;
   		text-align:center;
    }

  .hero .back>.bb:first-of-type{
		align-items:flex-end;
		width:90%;
  }

  .hero .back>.bb:first-of-type .inner{
		width:100%;
		padding-right:6%;
		padding-bottom:10%;
		margin-left:5%;
  }

  .menu-full ul li{
		margin-bottom:7px;
  }

  .maits-services-wrap{
    height: 800px !important;
    width: 100%;
    position: relative;
    top: 10% !important;
    bottom: 12%;
    margin-left: 0px;
  }


  #words .maits-services .website{
    display: none;
    position: absolute !important;
    background-color: #ff0000;
    height: 100% !important;
    left: 0px !important;
    top: 0px !important;
    right: 0px !important;
  }

  #words .maits-services .website p{
    color: transparent;
  }

  #words .maits-services .website h1{
    color: transparent;
  }

  #words .maits-services #online-marketing{
    display: none;
    position: absolute !important;
    height: 100% !important;
    left: 0px !important;
    top: 0px !important;
    right: 0px !important;
  }

  #words .maits-services #it-services{
    display: none;
    position: absolute !important;
    height: 100% !important;
    left: 0px !important;
    top: 0px !important;
    right: 0px !important;
  }
  
}

.footer{
	position:relative;
	padding:25px 0;
	color:#fff;
}

.copyright strong{
  margin-left:3px;
}

.footer .form-wrap{
  margin-bottom:40px;
  max-width:356px;
}

.footer>.container>.row:last-of-type{
  font-size:11px;
  margin-top:20px;
}

.footer h5{
  margin-top:20px;
  margin-bottom:15px;
  font-family: 'Open Sans', sans-serif;
  font-weight:700;
  font-size:16px;
}

.footer a{
  color:inherit;
}

.footer p{
  margin-bottom:5px;
}

.footer ul{
  list-style:none;
  padding:0;
  margin:0;
}

.footer ul li{
  display:inline-block;
  margin-bottom:5px;
  margin-right:15px;
}

.footer ul li:last-of-type{
  margin-right:0;
}

.footer ul li a:hover{
  color:#E94345;
}

.footer ul li img{
  max-width:40px;
  max-height:20px;
  object-fit:contain;
}

.footer .form-wrap{
  padding-top:15px;
}

.footer .inputGroup label{
  left:0;
  color:#fff;
}

.footer .inputGroup input,.footer .inputGroup textarea{
  padding-left:0;
  border-bottom-color:#fff;
  color:#fff;
}

.footer .inputGroup .inputBar:before,.footer .inputGroup .inputBar:after{
  background:#fff;
}

.footer form button{
  color:#fff;
  border-color:#fff;
}

@media screen and (min-height:516px){
  .footer{
    height:100vh
  }

  .footer>.container{
    height:100%
  }

  .footer>.container>div:first-of-type{
    height:calc(100% - 21px)
  }

  .footer>.container>div:nth-of-type(2){
    height:21px
  }
}

@-webkit-keyframes bounce{
    70%,89%,97%,from,to{
    -webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
    animation-timing-function:cubic-bezier(.215,.61,.355,1);
    -webkit-transform:translate3d(0,-10px,0) rotate(-90deg);
    transform:translate3d(0,-10px,0) rotate(-90deg)
  }

  76%,77%{
    -webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);
    animation-timing-function:cubic-bezier(.755,.05,.855,.06);
    -webkit-transform:translate3d(0,-40px,0) rotate(-90deg);
    transform:translate3d(0,-40px,0) rotate(-90deg)
  }

  94%{
    -webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);
    animation-timing-function:cubic-bezier(.755,.05,.855,.06);
    -webkit-transform:translate3d(0,-25px,0) rotate(-90deg);
    transform:translate3d(0,-25px,0) rotate(-90deg)
  }

  99%{
    -webkit-transform:translate3d(0,-14px,0) rotate(-90deg);
    transform:translate3d(0,-14px,0) rotate(-90deg)
  }
}

@keyframes bounce{
  70%,89%,97%,from,to{
    -webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
    animation-timing-function:cubic-bezier(.215,.61,.355,1);
    -webkit-transform:translate3d(0,-10px,0) rotate(-90deg);
    transform:translate3d(0,-10px,0) rotate(-90deg)
  }

  76%,77%{
    -webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);
    animation-timing-function:cubic-bezier(.755,.05,.855,.06);
    -webkit-transform:translate3d(0,-40px,0) rotate(-90deg);
    transform:translate3d(0,-40px,0) rotate(-90deg)
  }

  94%{
    -webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);
    animation-timing-function:cubic-bezier(.755,.05,.855,.06);
    -webkit-transform:translate3d(0,-25px,0) rotate(-90deg);
    transform:translate3d(0,-25px,0) rotate(-90deg)
  }

  99%{
    -webkit-transform:translate3d(0,-14px,0) rotate(-90deg);
    transform:translate3d(0,-14px,0) rotate(-90deg)
  }
}

[display-type=fade-up]{
  position:relative;
  top:100px;
  opacity:0;
  transition:top 1s,opacity 1s
}

[display-type=fade-up].fade-up{
  top:0;
  opacity:1
}

@media screen and (min-width:768px){
  [display-delay]:nth-of-type(1){
    transition-delay:0s
  }

  [display-delay]:nth-of-type(2){
    transition-delay:0.4s
  }

  [display-delay]:nth-of-type(3){
    transition-delay:0.8s
  }
}

*:focus{
  outline:none
}

.stage-indicator,.stage-background{
  pointer-events:none;
}


.hero{
  pointer-events:none
}

.section{
  position:relative;
}

.main *{
  background-color:transparent!important
}

.stage-indicator,.stage-background{
  position:absolute;
  top:0;
  left:0
}

.stage-indicator .stage,.stage-indicator .stage .stage-item{
  position:relative
}

.stage-background{
  position:fixed;
  width:50%;
  height:100%;
  background-image: url('../images/back-image2.png');
  background-repeat: no-repeat;
}

.stage-background .color-background{
  width:100%;
  height:100%;
  background-color:#E94345 !important;
}

#words{
  width:100%;
  height:100vh;
  margin-top:120vh;
}

#words>.inner{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%
}

#words.fixed>.inner{
  position:fixed
}

#words h4{
  font-family: 'Open Sans', sans-serif;
  font-weight:900;
  color:#E94345
}

#words h5{
  font-family: 'Open Sans', sans-serif;
  font-weight:900;
  font-size:68px;
  line-height:68px;
  text-transform:uppercase;
  width:100%;
  margin:0;
  position:absolute;
  top:0;
  left:0;
  transition:opacity 0.5s
}

#words .wrap{
  padding:0 20px;
  max-width:100%
}

#words .wrap>ul{
  margin-top:50px
}

#words ul{
  position:relative;
  list-style:none;
  margin:0 0 5% 0;
  padding:0
}

#words ul li{
  position:relative;
  cursor:pointer;
}

#words ul li:hover h5{
  opacity:.1
}

#words ul ul{
  opacity:0;
  transition:opacity 0.5s
}

#words ul li:hover ul{
  opacity:1
}

#words ul ul li{
  display:inline-block;
  font-family: 'Open Sans', sans-serif;
  font-weight:700;
  margin-right:10px
}

#words ul ul li:last-of-type{
  margin-right:0;
}

#words .wrap .maits-services{
  max-width: 100% !important;
}
.services {

    margin-bottom: 5%;

}
/*
===================
==================
==================
=============================================

No greater than 900px, no less than 400px */
/*@media (max-width:1514px) and (min-width:768px) {
  #words .maits-online{
    min-height: 104px !important;
    margin-bottom: 2px;
  }
}*/

@media screen and (min-width:1520px){
  #words .maits-online{
    min-height: -6px !important;
    margin-bottom: 2px;
  }
}

/*
===================
==================
==================
=============================================

No greater than 900px, no less than 400px */

@media screen and (min-width:768px){
  #words div{
    min-height:68px
  }

  #words .maits-online{
    min-height: 104px;
    margin-bottom: 2px;
  }

  .maits-services-bottom {
    padding-top: 50px;
  }

  .services-bottom {
      padding-top: 37px;
  }
}

@media screen and (max-width:767px){
  #words h5{
    position:relative;
    font-size:calc(8vw + 4px);
    line-height: calc(11vw + 4px);
  }

  #words h5 + div{
    display:none!important
  }
}

#projects{

  background-color:#000000 !important;
  height:100vh;
  width: 100%;
  padding-top: 100px;
}


#projects>.inner{
  /*max-width:950px;*/
  width: 100%;
  padding:0 25px;
  margin-left: 67px;
}

#projects h4{
  color:#fff;
  font-family: 'Open Sans', sans-serif;
  font-weight:900
}

#projects h4:nth-of-type(1){
  margin-bottom:30px
}

#projects h4:nth-of-type(2){
  margin-top:30px
}

#projects h5{
  font-size:76px;
  font-family: 'Open Sans', sans-serif;
  font-weight:800;
  text-transform:uppercase;
  color:#d81a1d;
}

#projects a h5{
  -webkit-transition:color 1.2s;
  transition:color 1.2s
}

#projects a:hover h5{
  color:#000;
}

#projects a{
  color:inherit;
}

#projects a:hover{
  text-decoration:none;
}

@media screen and (max-width:767px){
  #projects h5{
    font-size:calc(11vw - 8px)
  }
}
/*media screen and (min-width:769px){.hero .back>.bb:first-of-type .inner{width:calc(50vw - 220px)}}*/
@media screen and (min-width: 769px){
    .hero .back>.bb:first-of-type .inner {
        width: calc(74vw - 220px);
    }
}
.content{
  position:relative;
  margin-top:200vh;
  height:100vh
}

.copyright{
  color:#fff;
  font-size:11px;
  text-align:right;
  margin:0;
  padding-bottom:30px;
  background-color:transparent!important;
  /*margin-left: 1100px;*/
}

.theme-vega{
  color:#bababa;;
  font-size:14px;
  font-weight: bold;
  text-align:right;
  margin-top: -22px;
  padding-bottom:30px;
  background-color:transparent!important;
  /*margin-left: 1100px;*/
}


.header ul li.dropdown.dropdown-menu.dropdown-item::before{
    content:"\f001" !important;
}

.align{
    text-align: right;
    content:"\f001" !important;
    border: 0px transparent !important;
}

.dropdown-link{
    position: relative;
    color:#000;
    font-family: 'Open Sans', sans-serif;;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0px;
    text-transform: uppercase;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
    text-decoration: none;
    left: 55px;
    top: -4px;
}

.dropdown-link::before{
    content: '';
    position: absolute;
    top: calc(50% - 1px);
    right: 100%;
    width: 12px;
    height: 2px;
    margin-right: 15px;
    background-color: #E94345;
}

.header a:hover {
    color:#000 !important;
    text-decoration: none !important;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: #16181b;
    text-decoration: none;
    background-color: transparent !important;
}

.dropdown-menu {
    background-color: transparent !important;
    background-clip: padding-box;
    border: none !important;
}

@media screen and (max-width:767px){
    .link-hide{
        visibility: hidden;
    }
}

@media screen and (min-width:767px){
    .dropdown-link{
        visibility: visible !important;
    }
}

.header .toggle-menu {
    display: none;   
    width: 53px;
    height: 45px;
    margin-left: 0px;
    margin-top: 14px;
    padding-top: 0px;
    padding-left: 0px;
    background-color: transparent !important;
    position: relative;
    left: 11px;
}


.toogle-menu-icon{
    height: 40px !important;
    width: 40px !important;
}

.logo-n-black
{
    height: 40px !important;
    width: 40px !important;
    background-color: transparent !important;
    margin-left: 2px;
}

.size-1 {
    font-family: 'Open Sans', sans-serif;
    font-size: 80px;
    font-weight: 900;
    word-spacing: 0vh !important;
}

.color-background {
    background-image: url('images/slide-1.png');
}


#words {
    width: 100%;
    height: 100vh;
    margin-top: 120vh;
    margin-bottom: 0vh;

}

.main{
    background-image: url('../images/info-image.jpg') center center;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
}

.services-bottom{
    position: relative;
    bottom: 20px;
    /*padding-top: 70px;*/
}

/*.maits-services-bottom{
  padding-top: 70px;
}*/

.more-style {
    border-radius: 10px !important;
    background-color: transparent !important;
    color: white !important;
    margin-left: 201px !important;
    height: 30px !important;
    line-height: 1px !important;
    font-weight: bold !important;
    border: 3px solid white !important;
}

.more-style1 {
    border-radius: 20px !important;
    background-color: transparent !important;
    color: white !important;
    margin-left: 20px !important;
    height: 56px !important;
    /*line-height: 1px !important;*/
    font-weight: bold !important;
    border: 1px solid white !important;
    font-size: 22px !important;
    width: 187px !important;
}

.more-style1:hover{
    color: white;
    text-shadow: 1px 1px 1px #000;
}

#words .wrap {
    padding-top: 80px;
    padding-bottom: 80px;
    padding-left: 3px;
    padding-right: 10px;
}

.what-we-do {
    font-weight: bolder;
    letter-spacing: 0px;
    font-size: 16px;
}

@media screen and (max-width:1115px){
    #words h5 {
        font-size: 58px;
    }

    .what-we-do {
        font-weight: bolder;
        letter-spacing: 0px;
        font-size: 13px;
    }


}

@media screen and (max-width:768px){
  .maits-services-bottom {
    padding-top: 50px;
    }

    .services-bottom{
        top: -50px !important;
    }

    #words .maits-online{
        margin-bottom: -60px !important;
    }
}


@media screen and (max-width:990px){
    .menu-full ul{
       left: 26%;
    }

    .maits-services-wrap{
    /*  background-image: url('../images/imac-macbook-pro-apple.png');
      background-repeat: no-repeat;
      background-size: 100% 100%;
      height: 600px !important;
      width: 100%;
      position: relative;
      margin-top: 0px !important;
      bottom: 12%;
      margin-left: 0px !important;*/
    }

    #words .maits-services #website{
      display: none;
      position: absolute;
      height: auto;
      /*left: 50px !important;
      top: 50px !important;
      right: 50px !important;*/
    }

    #words .maits-services #online-marketing{
      display: none;
      position:absolute;
      width: auto;
      height: auto;
      /*left: 50px !important;
      top: 50px !important;
      right: 50px !important;*/
    }

    #words .maits-services #it-services{
      display: none;
      position: absolute;
      width: auto;
      height: auto;
      /*left: 50px !important;
      top: 50px !important;
      right: 50px !important;*/
    }

    #words .maits-online {
        min-height:85px !important;
        margin-bottom: -48px !important;
    }

    .services-bottom {
        position: relative;
        bottom: 20px;
        padding-top: 50px !important;
        padding-bottom: 40px;
    }

    .maits-services-bottom {
        padding-top: 75px;
    }

    .what-we-do {
        font-weight: bolder;
        letter-spacing: 0px;
        font-size: 13px;
    }

    .copyright {
        margin-left: 60% !important;
    }

    .theme-vega {
    		margin-left: 60% !important;
    }

    .size-1 {
        font-size: 55px;
        left: 347px !important;
    }

    .more-style {
         margin-left: 0px;
    }

    .text-top{
      top: 35% !important;
      width: 499px !important;
      left: 30% !important;
    }

    .support-width1 {
        padding-left: 37px !important;
        padding-right: 40px !important;
    }

    .support-width2 {
        padding-left: 37px !important;
        padding-right: 40px !important;
    }

    .services-details2{
        padding-left: 37px !important;
        padding-right: 40px !important;
    }

    .services-details1 {
        padding-left: 40px;
        padding-right: 40px !important;
    }

    .hero .front h1 {
        width: 350px;
        color: #000;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        transform: translateY(-50%);
    }
}

@media screen and (max-width: 660px){
    .font{
      margin-top: -585px !important;
    }

    .buiness {
        left: 34% !important;
        top: 88% !important;
    }
}

@media screen and (max-width: 560px){
    .hero .back>.bb:first-of-type .inner {
          width: 100%;
          padding-right: 6%;
          margin-left: 5%;
          position: relative;
          top: -51px;
          bottom: 64px;
    }

    .support-width {
        padding-left: 55px;
        padding-right: 152px !important;
    }

    .support-max-width{
        max-width: 465px;
    }

    .support-width-text h4 {
        padding-left: 54px !important;
        padding-right: 143px !important;
        font-size: 38px !important;
    }

    .support-end-text p {
        padding-left: 53px !important;
        padding-right: 185px !important;
    }

    .support-end-text::before {
        left: 53px !important;
    }

    .support-end-button {
        margin-left: 53px;
    }

    .support-width-img{
          height: 300px;
          width: 300px !important;
          
    }
    
    #words .maits-services #website{
      top: 300px;
      background-image: url('../images/website.png') !important;
      height: 300px !important;
      width: 300px !important;
      background-repeat: no-repeat;
      background-position: center center !important;
      margin-bottom: -400px !important;
    }
    
    #words .maits-services #online-marketing{
      top: 150px;
      background-image: url('../images/online-marketing.png') !important;
      height: 300px !important;
      width: 300px !important;
      background-repeat: no-repeat;
      background-position: center center !important;
      margin-bottom: -400px !important;
    }
    
    #words .maits-services #it-services{
      top: 150px;
      background-image: url('../images/it-services.png') !important;
      height: 300px !important;
      width: 300px !important;
      background-repeat: no-repeat;
      background-position: center center !important;
      margin-bottom: -400px !important;
    }
    
    
    #words {
        margin-bottom: -78vh;
    }

    .services-text{
        word-spacing: 0px;
        font-size: 12px !important;
        color: #ffffff;
    }

    .services-backup > img{
        height: 35px;
        width: 35px;
        margin-bottom: 7px;
        margin-right: 14px;
    }

    .margin{
        float: right;
        position: relative;
        height: 30px;
        width: 25px;
    }

    .services-contact {
         margin-left: -5px;
     }

     .maits-services-wrap{
       height: 800px !important;
       width: 100%;
       position: relative;
       top: 10% !important;
       bottom: 12%;
       margin-left: 0px;
     }
}

@media screen and (max-width:768px){
  .menu-full ul{
     top: 0;
     left: 18%;
  }

  .menu-full ul li{
    margin-bottom:3px;
  }

    .wrap{
        margin-top: -22px !important;
    }

    .images-top{
      position: relative;
      top: 0px;
    }

    #words .wrap {
       padding-top: 40px;
       padding-bottom: 1px;
       padding-left: 91px;
       padding-right: 10px;
    }

    .copyright {
        margin-left: 0% !important;
    }

    .theme-vega {
    		margin-left: 0% !important;
    }

    .hero .back>.bb:first-of-type .inner {
        width: 100%;
        padding-right: 6%;
        padding-bottom: -23px;
        margin-left: 5%;
        position: relative;
        top: -106px;
        bottom: 40px;
    }

    .support-width {
        width: 600px !important;
    }

    .support-max-width{
      max-width: 465px;
    }
}

@media screen and (max-width:700px){
    #words .wrap {
        padding-top: 40px;
        padding-bottom: 16px;
        padding-left: 88px;
        padding-right: 10px;
    }

    .support-width {
      padding-left: -10px;
      padding-right: 109px;
    }

    .support-max-width{
      max-width: 465px;
    }

    .support-width-text h4 {
        padding-left: 3px;
        padding-right: 34px;
        font-size: 38px !important;
    }

    .support-end-text p {
        padding-left: 3px;
        padding-right: 109px;
    }

    .support-end-button {
      margin-left:54px !important;
    }
}

@media screen and (max-width:434px){
    .what-we-do {
        font-size: 12px;
    }

    #words .wrap {
        padding-left: 67px !important;
    }

    #words h4 {
        margin-left: -75px;
    }

    #words .wrap > ul {
        margin-left: -75px;
    }

    #words h5 {
        font-size: 34px;
    }

    #projects > .inner {
          margin-left: -21px;
    }

    .support-width {
      padding-left: 84px;
      padding-right: 246px !important;
          }

    .support-width-text h4 {
        padding-left: 84px !important;
        padding-right: 244px !important;
        font-size: 27px !important;
    }

    .support-end-button {
        margin-left: 87px !important;
    }

    .support-end-text::before {
          left: 83px !important;
      }

    .support-end-text p {
      padding-left: 90px !important;
      padding-right: 257px !important;

      }

    .menu-full ul li a {
      font-size: 23px !important;
    }

    .logo-left {
      margin-left: -23px !important;
    }

    .toogle {
      margin-left: 16px !important;
      display: block !important;
      margin-top: 25px !important;
     }

     .buiness {
         left: 16% !important;
     }

     #maits-logo {
        height: 70px !important;
        margin-top: 100px;
        margin-left: -58px;
      }

     #words .maits-services #website{
       display: none;
       position: absolute;
       height: auto;
       left: 0px !important;
       top: 0px !important;
       right: 0px !important;
     }

     #words .maits-services .website{
       display: none;
       position: absolute;
       height: auto;
       left: 0px !important;
       top: 0px !important;
       right: 0px !important;
       background-position: center center;
     }

    
     #words .maits-services #online-marketing{
       display: none;
       position: absolute;
       height: auto;
       left: 0px !important;
       top: 0px !important;
       right: 0px !important;
       background-position: center center;
     }

     #words .maits-services #it-services{
       display: none;
       position: absolute;
        height: auto;
       left: 0px !important;
       top: 0px !important;
       right: 0px !important;
       background-position: center center;
     }
     
    

     .services-text{
         word-spacing: 0px;
         font-size: 10px !important;
         color: #ffffff;
     }

     .services-backup > img{
         height: 25px;
         width: 25px;
         margin-bottom: 7px;
         margin-right: 0px;
     }

     .margin{
         float: right;
         position: relative;
         height: 30px;
         width: 20px;
     }

     .services-details2 ul {
         position: relative;
         left: -72px;
         padding-bottom: 150px;
         margin-right: -82px;
      }

      .hero .front h2{
      		left:5% !important;
       }

       .maits-services-wrap {
           /*background-image: url('../images/iphone.png') !important;
           background-repeat: no-repeat;
           background-size: 100% 100%;
           height: 100%;
           width: 100%;
           position: relative;
           margin-top: 16%;
           bottom: 12%;
           margin-left: 0px;*/
       }


}

@media screen and (max-width:380px){
    
    .menu-full ul{
         top: 0;
         left: 2% !important;
      }    
  #words .maits-services #website{
    /*left: 18px !important;
    /*top: 35px !important;
    right: 16px !important;*/
  }

  #words .maits-services #design{
    /*left: 18px !important;
    /*top: 35px !important;
    right: 16px !important;*/
  }

  #words .maits-services #development{
    /*left: 18px !important;
    /*top: 35px !important;
    right: 16px !important;*/
  }

  #words .maits-services #online-marketing{
    /*left: 18px !important;
    /*top: 35px !important;
    right: 16px !important;*/
  }

  #words .maits-services #it-services{
    /*left: 18px !important;
    /*top: 35px !important;
    right: 16px !important;*/
  }

}

@media screen and (max-width:344px){
  #words .maits-services #website{
    padding-right: 1% !important;
  }
}

@media screen and (max-width:280px){
  #words .maits-services #website{
    padding-right: 1% !important;
  }
}

@media screen and (max-width:826px){
    #words .wrap {
        padding-left: 12px;
    }
}

@media screen and (max-width:1530px){
    .copyright {
        margin-left: 78%;
    }

    .theme-vega {
    		margin-left: 78%;
    }
}

@media screen and (max-width:1330px){
    .copyright {
        margin-left: 75%;
    }

    .theme-vega {
    		margin-left: 75%;
    }

    .support-end-button {
        margin-left: 352px;
    }
}

@media screen and (max-width:1160px){
    .copyright {
        margin-left: 70%;
    }

    .theme-vega {
    		margin-left: 70%;
    }
}

@media screen and (min-width:1530px){
    .copyright {
        margin-left: 80%;
    }

    .theme-vega {
    		margin-left: 80%;
    }
}

@media screen and (max-width:374px){
    .footer-copyright-text {
        font-size: 10px !important;
    }

    .footer-maits-text {
        font-size: 10px !important;
    }

    .theme-vega {
        font-size: 12px;
    }
}

.footer-copyright-text{
    color:#bababa;
    font-weight: bold;
    font-size: 15px;
    letter-spacing: -1px;
}

.footer-maits-text{
    color:#ffffff;
    font-weight: bold;
    font-size: 15px;
    letter-spacing: -1px;
}

#support>.inner{
    /*max-width:950px;*/
    width:100%;
    padding:0 25px;
    margin-left: 67px;
}

#support h4{
    color: #212529;
    font-size: 38px;
    font-family: 'Open Sans', sans-serif;

}

#support h4:nth-of-type(1){
    margin-bottom: 6px;
  }

#support h4:nth-of-type(2){
    margin-top:30px
}

#support h5{
    font-size:76px;
    font-family: 'Open Sans', sans-serif;
    font-weight:800;
    text-transform:uppercase;
    color:#d81a1d;
}
#support a h5{
    -webkit-transition:color 1.2s;
    transition:color 1.2s
}

#support a:hover h5{
    color:#000
}

#support a{
    color:inherit
}

#support a:hover{
    text-decoration:none;
}


.support-width-img{
  width:500px;
}

.support-width{
    width:500px;
}



.support-width-text{
    position: relative;
    top: 14px;
    font-weight: bold;
    margin-bottom: 50px;
}

.support-width-text h4{
    font-weight: bold;
    font-size: 50px;
    color:#212529;
}

.support-end-text::before{
    content: '';
    display: block;
    position: relative;
    margin-bottom: 24px;
    left: 0;
    width: 30px;
    height: 3px;
    background-color: #212529;
}

.support-end-text p{
    font-size: 22px;
    margin-bottom: 30px;
    width: 617px;
}

.support-end-button{
    border-radius: 13px !important;
    background-color: transparent !important;
    color: #d81a1d !important;
    margin-left: 474px !important;
    height: 40px !important;
    line-height: 1px !important;
    border: 2px solid #d81a1d !important;
    margin-bottom: 70px !important;
    width: 128px !important;
    z-index: 3 !important;
}

.support-end-button:hover{
    box-shadow: 1px 1px 1px #d81a1d !important;
    border: 2px solid #d81a1d !important;
    color: #d81a1d !important;
}

.support-max-width{
    text-align: left;
    padding-right: 40px !important;
    padding-left: 98px !important;
}


@media screen and (max-width:767px){
  #support h5{
    font-size:calc(11vw - 8px)
  }
}

@media screen and (max-width:1042px){
  .support-width{
      width:800px;
  }

  .support-max-width{
    max-width: 820px;
  }
}

@media screen and (max-width:990px){
  .support-width{
      width:630px;
  }

  .support-max-width{
    max-width: 650px;
  }

}

@media screen and (max-width:1190px){
  .support-width{
      width:630px;
  }

  .support-max-width{
    max-width: 650px;
  }

  .text-top{
    top: 46% !important;
    left: 44% !important;
  }

}

.contact{
  background-color:#d81a1d !important;
  padding-top: 50px;
  padding-bottom: 50px;
}

.contact p{
  font-size: 30px;
  color: white;
  text-align: center;
}



@media screen and (max-width:716px){
    .more-style1 {
        margin-left: 5px;
        margin-top: 20px;
    }
}

.index-main{
  background-image: url('../images/info-image.jpg');
  background-position: 5% 95%;
  background-repeat: no-repeat;
  width: 100%;
  height: auto !important;
  background-size: cover;
}

#support {
  background-image: url('../images/support1.jpg');
  background-repeat: no-repeat;
  width: 100%;
  height: auto;
  padding-top: 100px;
  margin-top: -4px;
}

.index-footer{
  background-image: url('../images/footer.jpg');
  background-repeat: no-repeat;
  width: 100%;
  height: auto !important;
}

.maits-services{
  max-width: 100% !important;
}

/*#maits-logo{
  background-image: url('../images/Maits_logo_web.png');
  height: 50px;
  background-repeat: no-repeat;
  background-position: center center;
}*/

.maits-services p{
  text-align: justify;
}

#words .maits-services #website{
  display: none;
  position: relative;
  background-color: #ff0000;
  /*height: auto;
  left: 40px;*/
  top: -120px;
  right: 40px;
  background-image: url('../images/website.png');
  height: 401px;
  width: 401px;
  background-repeat: no-repeat;
  background-position: center center !important;
  margin-bottom: -350px;
}

/*#words .maits-services #design{
  display: none;
  position: absolute;
  background-color: #ff0000;
  width: auto;
  height: auto;
  left: 40px;
  top: 20px;
  right: 40px;

}

#words .maits-services #development{
  display: none;
  position: absolute;
  background-color: #ff0000;
  width: auto;
  height: auto;
  left: 40px;
  top: 20px;
  right: 40px;

}*/

#words .maits-services #online-marketing{
  display: none;
  position: relative;
  background-color: #ff0000;
  /*height: auto;
  left: 40px;*/
  top: -170px;
  right: 40px;
  background-image: url('../images/online-marketing.png');
  height: 401px;
  width: 401px;
  background-repeat: no-repeat;
  background-position: center center !important;
  margin-bottom: -350px;
}

#words .maits-services #it-services{
  display: none;
  position: relative;
  background-color: #ff0000;
  /*height: auto;
  left: 40px;*/
  top: -240px;
  right: 40px;
  background-image: url('../images/it-services.png');
  height: 401px;
  width: 401px;
  background-repeat: no-repeat;
  background-position: center center !important;
  margin-bottom: -350px;
}

.maits-services-wrap{
/*  background-image: url('../images/imac-macbook-pro-apple.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  height: 100%;
  width: 100%;
  position: relative;
  margin-top: 16%;
  bottom: 12%;
  margin-left: 0px;*/
}

.words {
  box-shadow: 0px 10px 10px 42px #ffffff;
  transition: box-shadow 0.6s linear;
  margin-top: 0.5em;
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 20px;
  width: 98%;
}




/* --------------------------------------------------------------------
------------------------ IT SERVICES PAGE STARTS ----------------------
-------------------------------------------------------------------- */


.size-3{
  font-family: 'Open Sans', sans-serif;
  font-size:70px;
  font-weight:900;
}

.color-white{
  color: #ffffff !important;
}

.color-red{
  color: red !important;
}

.color-dark-red{
  color: #d81a1d;
}

.color-d-red{
  color: #f40b16;
}

.color-text{
  color:#db171b;
  font-weight: bold;
  margin-right: 5px;
}

.text-top{
  position: absolute;
  font-family: 'Open Sans', sans-serif;
  font-size:60px !important;
  font-weight:900 !important;
  word-spacing:0vh;
  top: 70% !important;
  width: 499px !important;
  left: 53%;
}

/* ------------------------------------------------------------ */
/* ----------   HEADER1 CSS FOR IT SERVICES PAGE -------------- */


/* --------- FOR logo-white1 FOR SERVICES PAGE ---------*/
.logo-left{
  left: 50px !important;
}

.header .logo-white1,.header .logo-black{
    position:absolute;
    top:10px;
    left:30px;
    max-width:unset;
    -webkit-transition:opacity 0.2s;
    transition:opacity 0.2s;
    height: 50px;
}

.header.header-mini .logo-white1{
    opacity:0!important;
}

.header[theme=black-black].logo-white1,.header[theme=black-white].logo-white1,.header[theme=white-black].logo-black,.header[theme=white-white].logo-black{opacity:0}.header[theme=black-black].logo-black,.header[theme=black-white].logo-black,.header[theme=white-black].logo-white1,.header[theme=white-white].logo-white1{
  opacity:1;
}

.header .logo-white1{
    opacity:1!important;
}

.background{
  position:fixed;
  width:50%;
  height:100%;
  background-image: url('../images/web-design_banner.jpg');
  background-repeat: no-repeat;
  background-position: center center;
}

.it-services-wrap p::before {
    content: '';
    display: block;
    position: absolute;
    bottom: calc(100% + 15px);
    left: 46%;
    width: 30px;
    height: 3px;
    background-color: #fff;
}


.it-services-wrap1 p::before {
    content: '';
    display: block;
    position: absolute;
    bottom: calc(100% + 15px);
    left: 49%;
    width: 30px;
    height: 3px;
    background-color: #fff;
    top: -60px;
}

#it-services-content{
  background-color: #2c2c2c !important;
  width: 100%;
  height: 100% !important;
  padding-top: 90px;
  padding-bottom: 200px;

}

#it-services-content1{
  background-color: #2c2c2c !important;
  width: 100%;
  height: 100% !important;
  padding-top: 90px;
  padding-bottom: 200px;

}

.it-services-wrap{
  padding-top: 0px !important;
}

.align-center{
  text-align: center !important;
}

.text-margins{
  margin-top: 14px;
  margin-bottom: -51px !important;
}

.text-margins1{
  margin-top: -33px;
  margin-bottom: 100px !important;
}

.img-margin{
  margin-left: 10%;
}

.my-row
{
    height: auto;
}

.services-1{
  display: block;
  background-image: url('../images/service1.png') !important;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 82% ;
  height: 100%;
}

.services-2{
  display: block;
  background-image: url('../images/services2.png') !important;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 82% ;
  height: 100%;
}

.services-3{
  display: block;
  background-image: url('../images/services3.png') !important;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 82% ;
  height: 100%;
}

.services-4{
  display: block;
  background-image: url('../images/services4.png') !important;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 82% ;
  height: 100%;
}

.services-5{
  display: block;
  background-image: url('../images/service5.png') !important;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 82% ;
  height: 100%;
}

.services-6{
  background-image: url('../images/service6.png') !important;
  display: block;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 82% ;
  height: 356px !important;
}

.services-text{
  text-transform: uppercase;
  font-weight: bold;
  position: relative;
  top: 50%;
  bottom: 20%;
  font-size: 12px;
}

#approach{
  background-image: url('../images/it-services-banner1.png') !important;
  background-color: #d81a1d;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center center;
  width: 100%;
  height: 980px;
  padding-top: 100px;
  margin-top: -17%;
}

#approach p{
  font-size: 25px;
  font-weight: bold;
  color: white;
  text-align: center;
  text-transform: uppercase;
  position: relative;
  margin-top: -478px;
}

.text-size{
  font-size: 30px;
  font-weight: bold;
}

.benefits-text-size{
  font-size: 45px;
  font-weight: bold;
  margin-top: -56px;
  margin-bottom: 100px;
}

.text-size1{
  font-size: 16px;
  font-weight: bold;
  margin-top: 30px;
}

#it-services-content1 h1{
  position: relative;
}

#it-services-content1 h2{
  position: relative;
}

#it-services-content1 p{
  position: relative;
  color: #6f6f6f;
  text-align: left;
  margin-top: 34px;
  line-height: 19px;
  font-size: 14px;
}

.arrow-image{
  background-image: url('../images/arrow1.png') !important;
  background-repeat: no-repeat;
  background-position: center;
  height: 12px;
  width: 12px;
  padding-left: 46px;
}

.recovery-image{
  position: relative;
  left: 110% !important;
  margin-top: -47px;
}

.service-section{
  border-bottom: 1px solid #6f6f6f;
  padding-bottom: 42px;
}

.service-section1{
  border-bottom: 1px solid #6f6f6f;
  padding-bottom: 42px;
  padding-top: 70px;
}


#it-services-benefit{
  background-image: url('../images/it-services-benefits.png') !important;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
  width: 100%;
  height: 770px;
  padding-top: 30px;
  margin-top: -10%;
}

.benefit-margin{
  margin-left: 22%;
}

.benefit-text{
  text-align: center;
  font-size: 23px;
  margin-top: 44px;
  margin-bottom: 44px;
}

#it-services-contact{
  background-color: #000000 !important;
  width: 100%;
  height: 100% !important;
  padding-top: 90px;
  padding-bottom: 200px;
}

.it-services-footer{
  background-color: #000000 !important;
  width: 100%;
  height: 300px !important;
}

.it-services-footer h1 p{
   text-align: center !important;
}

.contact-text-size{
  font-size: 45px;
  font-weight: bold;
  margin-top: -143px;
}

.contact-p{
  margin-top: -72px;
}

.contactus-button {
  border-radius: 3px !important;
  background-color: transparent !important;
  color: white !important;
  margin-left: 0px !important;
  height: 50px !important;
  line-height: -1px !important;
  border: 1px solid white !important;
  font-size: 18px !important;
  width: 330px !important;
}

.contactus-button:hover{
    color: white !important;
    text-shadow: 1px 1px 1px #000 !important;
}

.contact-margin{
  margin-right: 1%;
  margin-top: -1%;
}

@media screen and (max-width:576px){
  .menu-full ul{
     left: 12%;
  }

  .services-1{
    background-size: 50% !important;
    margin-top: 60px;
  }

  .services-2{
    background-size: 50% !important;
  }

  .services-3{
    background-size: 50% !important;
  }

  .services-4{
    background-size: 50% !important;
    margin-top: -5px !important;
    height: 390px !important;
  }

  .services-5{
    background-size: 50% !important;
    margin-top: -5px !important;
    height: 390px !important;
  }

  .services-6{
    background-size: 50% !important;
    margin-top: -2px !important;
  }

  .text-margins1{
    margin-bottom: -22px !important;
  }

  .services-text{
    top: 50% !important;
    font-size: 22px !important;
  }

  .text-margins1{
    margin-top: 55px !important;
    margin-bottom: 38px;
  }

  .it-services-wrap1 p::before {
      left: 47% !important;
      top: 20px !important;
  }

  #it-services-content1 p{
    left: -3%;
    width: 420px !important;
  }

  #it-services-content1 h1{
    left: -3%;
    width: 300px !important;
  }

  .service-section{
    padding-bottom: 0px;
  }

  .service-section1{
    padding-bottom: 0px;
  }

  #it-services-benefit{
    width: 100%;
    height: 1170px;
    padding-top: 60px;
    margin-top: -10%;
  }

  .benefits-text-size {
    font-size: 45px;
    font-weight: bold;
    margin-top: -49px;
    margin-bottom: 14px;
  }

  .benefit-margin {
    margin-left: 35% !important;
  }

}

@media screen and (max-width:434px){
  .menu-full ul{
     left: 4%;
  }

  .services-text{
    top: 50% !important;
    font-size: 20px !important;
  }

  .services-1 {
    background-size: 50% !important;
    margin-top: 20px !important;
  }

  .services-2{
    margin-top: -107px !important;
  }

  .services-3{
    margin-top: -107px !important;
  }

  .services-4{
    margin-top: -107px !important;
  }

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

  .services-6{
    margin-top: -107px !important;
  }

  .text-margins1{
    margin-top: 30px !important;
    margin-bottom: 38px;
  }

  .it-services-wrap1 p::before {
      left: 47% !important;
      top: -4px !important;
  }

  #it-services-content1 p{
    left: -3%;
    width: 350px !important;
  }

  .benefit-margin {
    margin-left: 32% !important;
  }
}

@media screen and (max-width:992px){
  .services-1{
    height: 400px;
  }

  .services-2{
    height: 400px;
  }

  .services-3{
    height: 400px;
  }

  .services-4{
    height: 255px;
    margin-top: -46px;
  }

  .services-5{
    height: 255px;
    margin-top: -46px;
  }

  .services-6{
    height: 255px;
    margin-top: -97px;
  }

  .text-margins1{
    margin-top: 33px;
    margin-bottom: 38px;
  }

  .it-services-wrap1 p::before {
      left: 48%;
      top: -10px;
  }
}

@media screen and (max-width:380px){
  .menu-full ul{
     left: -1%;
  }

  .services-1{
    margin-top: -44px !important;
  }

  .services-2{
    margin-top: -144px !important;
  }

  .services-3{
    margin-top: -144px !important;
  }

  .services-4{
    margin-top: -144px !important;
  }

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

  .services-6{
    margin-top: -144px !important;
  }

  .services-text{
    top: 50% !important;
    font-size: 13px !important;
  }

  .it-services-wrap1 p::before {
      left: 46% !important;
      top: -49px !important;
  }

  .text-margins1{
    margin-top: -8px !important;
    margin-bottom: 38px;
  }

  #approach p{
    font-size: 18px !important;
  }

  #it-services-content1 p{
    left: -3%;
    width: 310px !important;
  }

  .benefit-margin {
    margin-left: 28% !important;
  }
}


@media screen and (max-width:990px){
  .services-text{
    top: 50%;
    font-size: 20px;
  }

  #it-services-content1 p{
    left: -3%;
  }

  #it-services-content1 h1{
    left: -3%;
  }

  #it-services-content1 h2{
    left: -3%;
  }

  .recovery-image {
      left: 50% !important;
    }

  .benefit-margin{
      margin-left: 29%;
  }

  #approach {
    background-size: cover !important;
  }

  #it-services-benefit {
    background-size: cover !important;
  }
}

@media screen and (max-width:670px){
  #it-services-content1 p{
    left: -3%;
    width: 500px;
  }

  #it-services-content1 h1{
    left: -3%;
    width: 500px;
  }

  #it-services-content1 h2{
    left: -3%;
  }

  .recovery-image {
    visibility: hidden;
  }
}


@media screen and (max-width:768px){
  .services-text{
    top: 50%;
    font-size: 14px;
  }

  .services-4{
    margin-top: -104px;
  }

  .services-5{
    margin-top: -104px;
  }

  .services-6{
    margin-top: -151px;
  }

  .text-margins1{
    margin-top: -17px;
    margin-bottom: -16px !important;
  }

  .it-services-wrap1 p::before {
      left: 47%;
      top: -54px;
  }

  #approach p{
    font-size: 20px;
  }

  .recovery-image {
      left: 60% !important;
    }

   .benefit-margin{
     margin-left: 21%;
   }

}

/* --------------------------------------------------------------------
------------------------ IT SERVICES PAGE ENDS ------------------------
----------------------------------------------------------------------*/

/* --------------------------------------------------------------------
------------------------ WEB DESIGN PAGE STARTS -----------------------
----------------------------------------------------------------------*/

.web-design-body{
  background-color: #171717;
}

.color-black{
  color:#171717;
}

.hero .front h2 {
    position: absolute;
    top: 50%;
    right: calc(43% - 357px);
    width: 687px;
    color: #000;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
}

.hero .front p::before {
    content: '';
    display: block;
    position: absolute;
    bottom: calc(100% + 15px);
    left: 0;
    width: 30px;
    height: 3px;
    background-color: #fff;
}

.buiness{
  color: white;
  position: relative;
  top: 78%;
  left: 51%;
  font-size: 20px;
}

.toogle1{
  margin-left: 0px;
  display: none;
  margin-top: 6px !important;
}

.logo-m-black
{
    height: 40px !important;
    width: 40px !important;
    background-color: transparent !important;
    margin-left: 2px;
}

.header .logo-black,.header .logo-m-black{
    opacity:0;
}

.header.header-mini .logo-m-black{
    opacity:1;
}

.blog-background{
  height:980px !important;
  background-image: url('../images/support1.jpg');
  background-repeat: no-repeat;
  background-position: center center;
}