
@font-face {
 font-family:'Calibri';
 src: url("../fonts/calibri.ttf") ;
}
@font-face {
 font-family:'Calibri';
 src: url("../fonts/calibri.eot") ;
}
@font-face {
 font-family:'Calibri';
 src: url("../fonts/calibri.wof") ;
}
@font-face {
 font-family:'Calibri Bold';
 src: url("../fonts/calibrib.ttf") ;
}
@font-face {
 font-family:'Calibri Bold';
 src: url("../fonts/calibrib.eot") ;
}
@font-face {
 font-family:'Calibri Bold';
 src: url("../fonts/calibrib.wof") ;
}
*{
   font-family:'Calibri';
}
h1 , p ,h2,h3{
  margin: 0px;
   font-family:'Calibri';
}
a{
  outline: none;
   font-family:'Calibri';
}
img{
  border:none;
}
body{
    font-size: 100%;
    font-family:'Calibri';
    margin: 0px;
    padding: 0px;
}
/* HEADER MENU*/
#menu {
    background: #fff;
    width: 100%;
    height: 140px;
    position: fixed;
    text-align: center;
    margin: 0px;
    padding: 0px;
    border-top: 10px solid #64666b;
    -webkit-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.5);
    z-index: 1001;
}

#menu a {
    color: #64666b;
    text-decoration: none;
    font-size: 13px;
    font-family:'Calibri';
    outline: none;
    text-transform: uppercase;
}

#menu a:hover {
    color: #ee7400;
}
.menu_logo{
    float: left;
    padding-left: 30px;
    padding-top: 25px;
}
.call{
    float: left;
    margin-left: 520px;
    padding-top: 25px;
}
.call p{
    margin:0px;
    color: #64666b;
    font-size: 17px;
    text-transform: uppercase;
    font-family:'Calibri';
}
.itemsMenu{
    float: left;
    padding-left: 30px;
    position: absolute;
    bottom: -10px;
}
#menu .call a{
    text-decoration: none;
    color: #00a3e1;
    font-size: 24px;
    font-family:'Calibri';
}
.itemsMenu li {
    display:inline;
    padding-right: 35px;
    width:100%;
    margin: 0 auto;
}
.itemsMenu li img{
    vertical-align: middle;
    margin-right: 10px;
}
.iconMenu {
  color: #fff;
  cursor: pointer;
  display: none;
}
.showitems {
  display:block !important;
}
.topMenu{
  width: 100%;
  height: 83px;
  background: #fff;
  overflow: hidden;
}
.call_1{
  display: none;
  padding-bottom: 10px;
}
.call_1 p{
  color: #fff;
  margin: 0px;
  font-size: 17px;
}
.call_1 a{
  color: #00a3e1!important;
  margin: 0px;
  font-size: 20px !important;
}
.baner{
  background: url(../img/baner.png)no-repeat center;
  background-size: cover;
  width: 100%;
  height: 600px;
  overflow: hidden;
}
.baner_text{
  padding-left: 30px;
  padding-top: 175px;
  margin-bottom: 15px;
  float: left;
  text-align: left;
}
.baner_text h1{
  font-size: 39px;
  color: #000000;
  line-height: 50px;
  font-weight: 600px;
  padding-bottom: 10px;
 font-family:'Calibri Bold';
}
.baner_text p{
  font-size: 24px;
  color: #000000;
  line-height: 28px;
  padding-bottom: 30px;
}
.baner_text a{
  display: inline;
  color: #fff;
  background: #4cbee9;
  font-size: 20px;
  text-align: center;
  text-decoration: none;
  padding: 12px 25px 12px 25px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  behavior: url(PIE.htc);
}
.baner_slider{
  float: left;
  width: 700px;
  height: 107%;
  position: absolute;
  background: url(../img/iMac.png)no-repeat;
  background-size: 100%;
  top: 156px;
  padding-top: 21px;
  margin-left: 500px;
}
.con {
  overflow: hidden;
  width: 93%;
  height: 383px;
  border: 2px solid ;
  position: absolute;
  margin: auto;
  margin-left: 21px;
}
.con img {
  height: 100%;
  object-fit: cover;
  position: absolute;
  width: 100%;
}
.coverImage{ 
  background: url(../img/site-after.png);
  height: 100%;
  object-fit: cover;
  position: absolute;
  width: 50%;
}
.handle {
  width: 90px;
  height: 100%;
  position: absolute;
  left: 49%;
  margin-left: -41px;
  margin-right: -45px;
  background: url(../img/drag.png)left;
}
.handle:after {
  display: block;
  width: 60px; 
  height: 380px;
  position: absolute;
  left: -36px; top: 0; bottom: 0;
  margin: auto;
}
#telefon {
  position: absolute;
  height: 275px;
  width: 128px;
  right: 15%;
  top: 287px;
}
#telefon img{width: 135px;}
#blackskrin {display: none;}
.clear{clear: both;}
.viewport span{
  text-align: center;
  display: block;
  color: #4dbcff;
  padding-bottom: 5px;
}

/* Get_a_powerful*/

.Get_a_powerful h2{
  font-size: 22px;
  color: #64666b;
  margin: 41px 0px 41px 0px;
}
.like{background: url(../img/like.png)no-repeat top;
  padding-top: 28px;
}
 .heart{
  background: url(../img/heart.png)no-repeat top;
  padding-top: 28px;
 }
 .shop{
  background: url(../img/shop.png)no-repeat top;
  padding-top: 28px;
 }
.like, .heart ,.shop{
  display: inline-block;
}
.like p, .heart p, .shop p{
  font-size: 15px;
  color: #64666b;
  text-align: center;
  margin-bottom: 25px;
  font-weight: 600;
}
.like img{ margin-left: 22px;}
.heart img{ margin-left: 20px;}
.shop img{ margin-left: 13px;}
.Get_a_powerful_text{
  text-align: -webkit-center;
  margin-bottom: 33px;
}
.Get_a_powerful_text h3{
  color: #64666b;
  font-weight: 300;
  font-size: 15px;
  line-height: 18px;
  text-align: center;
}
.container, .container2, .container1, .container3, .container4, .container5{
  width: 100%;
  max-width: 1026px;
  margin: 0 auto;
  overflow: hidden;
}
.container5{width: 981px;}
.container6{
  width: 100%;
  max-width: 1220px;
  margin: 0 auto;
  overflow: hidden;
}
.container7{
  height: 144px;
  width: 100%;
  max-width: 1220px;
  margin: 0 auto;
}

/* how-it-works*/

#how-it-works{
  background: #4cbee9;
  width: 100%;
  height: 457px;
}
.wr {
  height: 457px;
  width: 100%;
  overflow: hidden;
  margin-left: 4%;
}
 .wr h2 {
  padding: 37px 0px 35px 312px;
  font: normal 24px "Calibri";
  color: #fff;
}
.kart {
  position: absolute;
  margin: 0px 0 0 180px;
  z-index: 101;
}
#how-it-works .green {
    border: 5px solid #7cc242;
    border-radius: 6px 6px 6px 6px;
    width:61px;
    height: 44px;
    text-align: center;
    position: absolute;
    margin-top: 149px;
    margin-left: 453px;
    display: block;
    cursor: pointer;
    z-index: 201;
}
.green::after {
    content: '';
    position: absolute;
    right: 5px;
    top: 10px;
    border: 8px solid transparent;
    border-left: 22px solid #7cc242;
   }
.green:hover {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
    background: #fff;   
}
#how-it-works .container #frame {
  margin: 0 0 0 281px;
  height: 343px; 
  width:607px;
  height: 315px;
  z-index: 1;
}
#closevideo {
  margin: -2px 0 0 178px;
  display: none;
  border: 2px solid #64666b;
  width: 607px;
  height: 343px;
}
 #closevideo a img {
  position: absolute;
  margin: -26px 0 0 606px;
} 
#closevideo a{
font-family:'Calibri Bold';
 font-size:14px; 
 font-weight:bold;
  color:#000;
}

/*GALARY*/

#gallery{
  width: 100%;
  height: auto;
}
#gallery h2{
  color: #64666b;
  font-size: 24px;
  font-family: Calibri, sans-serif;
  font-weight: 600;
  text-align: center;
  margin-top: 28px;
  margin-bottom: 7px;
}
#gallery h3{
  color: #64666b;
  font-size: 15px;
  font-family:'Calibri';
  font-weight: 300;
  text-align: center;
  margin-bottom: 15px;
}
.popap1, .popap2, .popap3, .popap4, .popap5, .popap6, .popap7, .popap8, .popap9, .popap10, .popap11, .popap12 {
    width: 218px;
    height: 195px;
    border: 1px solid #ededed;
    overflow: hidden;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    behavior: url(PIE.htc);
}
.popap1:before, .popap2:before, .popap3:before, .popap4:before, .popap5:before, .popap6:before, .popap7:before, .popap8:before, .popap9:before, .popap10:before, .popap11:before, .popap12:before{
    background: url(../img/hover.png) rgba(0, 0, 0, 0.2) no-repeat center center;
    display: none;
    width: 222px;
    top: 0px;
    height: 199px;
    bottom: 0;
    right: 0;
    left: 0px;
    position: absolute;
    content: "";
}
.popap1:hover:before{
    display: block; 
    content: " ";
    margin-top: 20px;
}
.popap2:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 247px;
}
.popap3:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 491px;
}
.popap4:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 736px;
}
.popap5:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 981px;
}
.popap6:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 1226px;
}
.popap7:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 1471px;
}
.popap8:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 1716px;
}
.popap9:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 1960px;
}
.popap10:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 2206px;
}
.popap11:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 2450px;
}
.popap12:hover:before{
    display: block; 
    content: " ";
    margin: 20px 0 0 2696px;
}
.slider_img{position: relative;}

@-moz-document url-prefix()
{
  .mobile_slider_img { 
    position: absolute;
    margin-bottom: 0;
    margin-left: -50px !important;
    margin-right: 0;
    margin-top: 81px !important; }
}
.mobile_slider_img{
    position: absolute;
    bottom:-39px;
    margin-left: -49px;
   }
.ie10 .mobile_slider_img {
    position: absolute;
    margin-left: -50px !important;
    margin-top: 81px !important;
}
.ie10 .more_than.medium-offset-2{
  margin-left: 18.66%;
}
_:-ms-lang(x), .mobile_slider_img { 
    position: absolute;
    margin-bottom: 0;
    margin-left: -50px !important;
    margin-right: 0;
    margin-top: 81px !important; 
  }
.wrap ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
/*FEaTuRe*/

.feature_top{
  background: url(../img/web_desing.png)no-repeat center;
  background-size: cover;
  width: 100%;
  height: 83px;
  margin-top: 29px;
}

.feature_top h2{
  color: #fff;
  font-size: 24px;
   font-family:'Calibri';
  text-align: center;
  padding-top: 25px;
  line-height: 16px;
}
.feature_mail, .facebook{
  border-bottom: 1px solid #000;
  padding-top: 40px;
}
.search{padding-top: 40px;}
.feature_mail h2, .facebook h2, .search h2{
  font-size: 24px;
  color: #64666b;
  padding-bottom: 10px;
  font-weight: 300;
  font-family:'Calibri';
  text-align: left;
}
.feature_mail p, .facebook p, .search p{
  font-size: 16px;
  color: #64666b;
  font-family:'Calibri';
  padding-bottom: 44px;
  text-align: left;
}
.feature_mail img, .search img{
  float: left;
  padding-right: 25px;
  padding-bottom: 20px;
}
.facebook img{
  float: right;
}
.more_than{
  width: 100%;
  height: auto;
  background:#f8f8f8;
  overflow: hidden;
}
.more_than h2{
  text-align: center;
  color: #64666b;
  font-size: 24px;
  font-family:'Calibri';
  padding: 30px 0px;
}
.business_mail{
  float: left;
  width: 268px;
  height: 350px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
  margin-bottom: 31px;
  border-top: 11px solid #4cbee9
}
.web_analytics, .ongoing{
  float: left;
  width: 268px;
  height: 350px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
  margin-bottom: 31px;
  border-top: 11px solid #4cbee9
}
.business_mail h2, .web_analytics h2, .ongoing h2{
  color: #4cbee9;
  font-size: 16px;
  font-family:'Calibri';
  padding:24px 0px 54px 0px;
  text-align: center;
}
.web_analytics h2{padding:24px 0px 39px 0px;}
.ongoing h2{padding:24px 0px 28px 0px;}
.ongoing img{padding-bottom: 18px!important;}
.business_mail img, .web_analytics img, .ongoing img{padding-bottom: 50px;}
.web_analytics img{padding-bottom: 34px;}
.web_analytics p{padding-bottom: 42px!important;}
.business_mail p, .web_analytics p, .ongoing p{
  font-size: 15px;
  font-family:'Calibri';
  color: #64666b;
  text-align: center;
  padding: 0% 14%;
    padding-bottom: 20px;
}

/* Web Design*/

#web_design{
  background: #f8f8f8;
  width: 100%;
  height: auto;
  overflow: hidden;
}
.web_design_top{
  background: url(../img/web_desing.png)no-repeat center;
  background-size: cover;
  height: 85px;
  width: 100%;
}
.web_design_top h2{
  color: #fff;
  font-size: 24px;
   font-family:'Calibri';
  text-align: center;
  padding-top: 25px;
  line-height: 16px;
}
.column{
  margin-top: 44px;
}
.plan1, .plan2, .plan3{
  width:300px;
  height:570px;
  float: left;
  border-top: 9px solid #4cbee9;
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
  margin-bottom: 53px;
}
.plan3{
  margin-right: 0px!important;
}
.plan1 h2, .plan2 h2, .plan3 h2{
  color: #4cbee9;
  font-size: 16px;
  font-family:'Calibri';
  text-align: center;
  padding: 20px 0px 28px 0px;
}
.plan1 img, .plan2 img, .plan3 img{
  padding-left: 30px;
  padding-bottom: 43px;
}
.plan1 p, .plan2 p, .plan3 p{
  background: url(../img/ok.png) no-repeat left top;
  padding-left: 25px;
  margin-left: 21px;
  color: #64666b;
  font-size: 15px;
  line-height: 18px;
  text-align: left;
  font-family:'Calibri';
}
.plan1 span, .plan2 span, .plan3 span{
  color: #64666b;
  font-size: 16px;
  padding-top: 46px;
}
.plan1 h3, .plan2 h3, .plan3 h3{
  display: inline;
  color: #64666b;
  font-size: 26px;
  line-height: 25px;
  font-weight: 600;
  font-family:'Calibri';
}
.price{
  padding-left: 25px;
  text-align: left;
}
.plan3 h4{
  margin: 0px;
  color: #64666b;
  font-size: 15px;
  line-height: 17px;
  font-family:'Calibri';
  font-weight: 500;
  margin-left: 20px;
  margin-bottom: 20px;
}
#plan1 ,#plan2 ,#plan3{padding-bottom: 30px;}
#plan1{padding-bottom: 13px;}
#plan2{padding-bottom: 20px;}
.web_design_text h2{
  font-size: 30px;
  font-family:'Calibri';
  color: #444444;
  font-weight: 600;
}
.web_design_text a{
  font-size: 36px;
  font-family:'Calibri';
  color: #444444;
  font-weight: 600;
  text-decoration: none;
}
.web_design_logo{
  margin-top: 50px;
  margin-bottom: 49px;
}
.web_design_logo img{
  padding-right: 24px;
}
.web_design_logo h2{
  font-size: 18px;
  font-family:'Calibri';
  color: #444444;
  padding-left: 80px;
}
.web_design_logo h3{
  font-size: 18px;
   font-family:'Calibri';
  color: #444444;
  font-weight: 600;
  padding-top: 49px;
  margin-bottom: 35px;
}
/*FOOTER*/
#footer{
 background: url(../img/footer.png) no-repeat center;
 background-size: cover;
 width: 100%;
 height: 1080px;
 margin-bottom: 10px;
}
.footer_menu{
  padding-top: 83px;
}
.footer_call{
  padding-top: 39px;
}
.footer_call a{
  color: #dadbdc;
  font-size: 11px;
  font-family:'Calibri';
  text-decoration: none;
}
.footer_menu a{
  text-decoration: none;
  color: #ffffff;
  font-size: 12px;
  padding-left: 26px;
  font-family:'Calibri';
}
.footer_menu p{
  color: #929396;
  font-size: 11px;
  font-weight: 700;
  margin-top: 39px;
}
#back_to_top {
  width: 132px;
  border-radius: 30px;
  border:2px solid #979797;
  text-align: center;
  background: url(../img/back_to_top.png) no-repeat 9px 13px #fff;
  text-decoration: none;
  color: #000;
  font-size: 12px;
  font-weight: 600;
  padding: 12px 30px 12px 30px;
  font-family:'Calibri';
}
.slider_gallery{
  position: relative;
  width: 1178px;
  margin-left: 60px;

}
.swiper-slide{
  margin-right: 15px!important;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  margin-left: -296px;
  z-index: 1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  -ms-transition-property: -ms-transform;
  transition-property: transform;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
video{
  width:607px;
  height:343px;
}

  /* MODAL */

#overlay {
  position: fixed;
  bottom: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 208px;
  z-index: 999;
  -webkit-animation: fade .6s;
  -moz-animation: fade .6s;
  animation: fade .6s;
  overflow: hidden;
}
.popup {
  top: 0%;
  bottom: 0px;
  right: 0;       
  font-size: 14px;
  margin: auto;
  width: 338px;
  height: 208px;
  min-width: 131px;
  max-width: 447px;
  position: absolute;
  border: 2px solid #f68d39;
  background: #fff;
  z-index: 1000;
  -webkit-animation: fade .6s;
  -moz-animation: fade .6s;
  animation: fade .6s;
}
.popup h2{
  font-size: 26px;
  color: #000;
  padding: 12px 20px 8px 20px;
  font-family:'Calibri';
}
.popup span{
  font-size: 24px;
 color: #013482;
  font-family:'Calibri Bold';
  display: block;
  text-align: center;
}
.popup a{
  font-size: 24px;
  color: #f68d39;
  font-family:'Calibri Bold';
  display: block;
  text-align: center;
  line-height: 20px;
}
.close {
  top: 6px;
  right: 6px;
  position: absolute;
  border: none;
  cursor: pointer;
  outline: none;
  background: url(../img/close_popap.png) no-repeat right top;
}
.close:hover{
  background: url(../img/close_popap.png) no-repeat right top;
}
/* BANER SLIDER */

  @media screen and (max-width: 1190px) {
  .con{ height: 335px;}
  .baner_slider{ padding-top: 23px;  height: 118%;  width: 622px; margin-left: 460px;}
  #telefon{ top: 200px;}
}
@media screen and (max-width: 1110px) {
  .con{ height: 329px;}
  .baner_text h1{ line-height: 27px; font-size: 24px;}
  .baner_text p{ font-size: 16px; line-height: 19px;}
}
@media screen and (max-width: 1030px) {
   .con{ height: 310px;}
   #telefon{top: top: 168px;; right: 11%;}
   .baner_slider{height: 110%; width: 584px; margin-left: 306px;}
}
@media screen and (max-width: 990px) {
  .con{ height: 292px;}
  .baner_slider{ padding-top: 23px; width: 567px; margin-left: 306px;}
}
@media screen and (max-width: 900px) {
  .con{height: 268px;}
  .baner_slider{ padding-top: 20px; width: 514px; margin-left: 300px;}
  .handle{background: url(../img/drag.png)center no-repeat;background-size: 77%;}
}
@media screen and (max-width: 860px){
  .con{height: 216px; margin-left: 14px;}
  .baner_slider{padding-top: 14px; top: 100px; right: 25%; width: 50%;  height: 60%;}
  .baner_text{text-align: center; margin-top: 340px;  padding: 0; float: none; }
  .coverImage{background-size: cover;}
  #telefon img{width: 90px;}
  #telefon{top:130px;right: 2%;}
}
@media screen and (max-width: 820px){
  .con{height: 213px; margin-left: 14px;}
}
@media screen and (max-width: 770px){
  .con{height: 203px; margin-left: 14px;}
  .baner_slider{padding-top: 14px; top: 100px; right: 25%; width: 50%;  height: 35%;}
}
@media screen and (max-width: 750px){
  .baner_slider{ width: 56%; top: 100px;  right: 22%;  height: 80%; padding-top: 15px;}
  .con{ height: 211px;}
  .baner_text{margin-top: 350px;}
}
@media screen and (max-width: 700px){
  .con{ height: 199px;}
  .baner_slider{padding-top: 14px;}
  #telefon img{ width: 77px;}
  .handle{background-size: 60%;}
}
@media screen and (max-width: 650px){
  .con{ height: 183px;}
  .baner_slider{padding-top: 14px;}
}
@media screen and (max-width: 600px){
  .con{height: 175px; margin-left: 10px;}
  .baner_slider{padding-top: 9px;}
  #telefon img{ width: 60px;}
  #telefon{right: -6%;}
  .baner_text{margin-top: 325px;}
}
@media screen and (max-width: 550px){
  .con{height: 182px;}
  .baner_slider{ height: 66%; width: 65%; right: 16%;}
  #telefon img{width: 67px;}
}
@media screen and (max-width: 500px){
  .baner_slider{height: 51%;width: 69%;}
  .baner_slider{ right: 14%;}
  .footer_menu a{padding-left:0px; display: block; padding-top: 10px;}
}
@media screen and (max-width: 460px){
  .con{height: 169px;}
  #telefon{right: -9%;top: 99px;}
}
@media screen and (max-width: 420px){
  .baner_slider{right: 11%;width: 72%;}
  .con {height: 159px;}
}
@media screen and (max-width: 390px){
  .con{height: 153px;}
  }
@media screen and (max-width: 380px){
  .baner_slider{right: 30px; width: 82%;}
  .con{height: 165px;}
  .baner_slider{ height: 45%;}
}
@media screen and (max-width: 330px){
  .baner_slider{right: 30px; width: 82%;}
  .con{height: 143px;}
  .baner_slider{ height: 45%;}
}
@media screen and (max-width: 320px){
  .con{ height: 147px;}
  #telefon{right: -13px; top: 82px;}
  .baner_slider{padding-top: 7px;}
}

/* MEDIA HEADER MENU*/

@media screen and (max-width: 860px) {
    #menu a{color: #fff;font-size: 16px;text-transform: initial;
    display: block;}
    #menu{height: 70px;}
    #menu a:hover { border-bottom: none; }
    .iconMenu img{float: right;padding-top: 15px;padding-right: 20px;}
    .itemsMenu li {display:block;padding:7px 0;}
    .menu_logo{padding-top: 5px;}
    .call_1{display: block !important;}
    .itemsMenu.showitems{background: #64666b; width: 100%; text-align: left; top: 61px;
    height: 255px;}
    .itemsMenu {display:none;}
    .call{display: none;}
    .iconMenu { display:block;}
    }   
}
@media screen and (max-width: 1060px) {
    .call{ margin-left: 430px;} 
    .call_1{ display: none;}
}
@media screen and (max-width: 1070px) {
    .call{margin-left: 325px;} 
    .call_1{ display: none;}
}
@media screen and (max-width: 870px) {
    .call{margin-left: 224px;} 
    .call_1{ display: none;}
}
@media screen and (max-width: 394px) {
     #menu a{width: 233px;}
}

/*GALLERY*/
@media screen and (max-width: 1260px) {
    .slider_gallery{ width:1136px; }
}
@media screen and (max-width: 1205px) {
  .swiper-container {width: 775px;}
  .slider_gallery {width: 935px; margin-left: 151px;}
  .swiper-wrapper { margin-left: -296px!important;}
}


/*HOW IT WORK*/
@media screen and (max-width: 1024px) {
  .container1{margin-left: 25px;     width: 979px;}
}
@media screen and (max-width: 930px) {
  .container1{width: 841px;margin-left: -65px; }
}
@media screen and (max-width: 800px) {
  .container1{ width: 789px;margin-left: -105px;}
}
@media screen and (max-width: 760px) {
  .container1{ width: 792px;margin-left: -127px;}
  video{width:607px;height:343px;}
}
@media screen and (max-width: 680px) {
  .container1{width: 789px;margin-left: -145px;}
}
@media screen and (max-width: 660px) {
  .container1{width: 600px;margin-left: -115px;}
  .kart img{ width: 500px;}
  .kart{ width: 500px;}
  #closevideo{width: 500px;}
  #closevideo a img{margin: -26px 0 0 502px;}
  #how-it-works .green{ width: 51px; height: 36px; margin-top: 123px; margin-left: 404px;}
  .green::after{right: -1px;top: 6px;}
  .wr h2{padding: 37px 0px 35px 255px;}
  video{width:500px;height:343px;}
}
@media screen and (max-width: 660px) {
  .container1{width: 683px;margin-left: -108px;}
}
@media screen and (max-width: 570px) {
  .container1{width: 683px;margin-left: -140px;}
}
@media screen and (max-width: 550px) {
  .container1{width: 600px;margin-left: -115px;}
  .kart img{ width: 410px;}
  .kart{ width: 410px;}
  #closevideo{width: 410px;}
  #closevideo a img{margin: -26px 0 0 411px;}
  #how-it-works .green{ width: 43px;height: 31px;margin-top: 100px; margin-left: 364px;}
  .green::after{right: -5px;top: 3px;}
  .wr h2{padding: 37px 0px 35px 220px;}
  video{width:410px;height:343px;}
}
@media screen and (max-width: 490px) {
  .container1{width: 531px;margin-left: -100px;}
  .kart img{ width: 330px;}
  .kart{ width: 330px;}
  #closevideo{width: 330px; height:187px;}
  #closevideo a img{margin: -26px 0 0 330px;}
  #how-it-works .green{ width: 36px;height: 23px;margin-top: 82px;margin-left: 327px;border: 3px solid #7cc242;}
  .green::after{right: 2px;top: 5px;border: 5px solid transparent;border-left: 12px solid #7cc242;}
  .wr h2{padding: 37px 0px 35px 199px;font-size: 19px}
  video{width:330px;height:187px;}
}
@media screen and (max-width: 490px) {
  .container1 {margin-left: -145px;}
    }
@media screen and (max-width: 420px) {
  #how-it-works{height: 345px;}
  .container1{width: 462px; margin-left: -110px;}
  .kart img{ width: 280px;}
  .kart{ width: 280px;}
  #closevideo{width: 280px; height:158px;}
  #closevideo a img{margin: -26px 0 0 263px;}
  #how-it-works .green{ width: 30px;height:20px;margin-top: 69px;margin-left: 305px;border: 2px solid #7cc242;}
  .green::after{right: 4px;top: 5px;border: 3px solid transparent;border-left: 9px solid #7cc242;}
  .wr h2{padding: 37px 0px 35px 180px;}
  video{width:280px;height:158px;}
}
@media screen and (max-width: 375px) {
  .container1{margin-left: -127px}
}
@media screen and (max-width: 360px) {
  .container1{width: 448px; margin-left: -142px;}
}
@media screen and (max-width: 330px) {
  .container1{ margin-left: -178px;}
}
/*FEATURE*/
@media screen and (max-width: 680px) {
  .feature_mail img{float: none; padding-right: 56px;}
  .facebook img{float: none; padding-right: 56px;}
  .search img{float: none; padding-right: 56px;}
}
@media screen and (max-width: 640px) {
  .feature_mail img{padding-right: 0px;}
  .facebook img{padding-right: 0px;}
  .search img{padding-right: 0px;}
}

/*More than*/
@media screen and (max-width: 1030px) {
  .business_mail ,.web_analytics ,.ongoing {width: 100%;
    display: block;}
}
/*Web Design*/

@media screen and (max-width: 1030px) {
 .plan1, .plan2, .plan3{float:none;  width: auto;}
}
@media screen and (max-width: 700px) {
.web_design_text a{font-size: 22px;}
.web_design_text h2{ font-size: 22px;}
}
@media screen and (max-width: 400px) {
.plan1, .plan2,.plan3{height: 600px;}
 .web_design_top h2{font-size: 16px;}
 #plan3{padding-bottom: 30px;}
 #plan1, #plan2{padding-bottom: 0px;}
}
@media screen and (max-width: 350px) {
  .plan1, .plan2,.plan3{height: 665px;}
}

/* Slider*/
@media screen and (max-width: 1190px) {
 .container5{width: 736px;margin-left: 18%;}
  .buttons2{ margin: -159px 0 0 768px!important;}
}
@media screen and (max-width: 1150px) {
 .container5{margin-left: 13%;}
}
@media screen and (max-width: 960px) {
 .container5{width: 490px;margin-left: 23%;}
.buttons2{ margin: -159px 0 0 520px!important;}
}
@media screen and (max-width: 800px) {
 .container5{margin-left: 17%;}
}
@media screen and (max-width: 760px) {
 .container5{margin-left: 14%;}
}
@media screen and (max-width: 680px) {
 .buttons2{margin: -159px 0 0 271px!important;}
 .container5{width: 246px; margin-left: 29%;}
}
@media screen and (max-width: 445px) {
 .buttons2{margin: -159px 0 0 250px!important;}
 .container5{width: 246px; margin-left: 23%;}
}
@media screen and (max-width: 390px) {
 .buttons2{margin: -159px 0 0 220px!important;}
 .container5{width: 246px; margin-left: 18%;}
 .popap1 img, .popap2 img, .popap3 img, .popap4 img, .popap5 img, .popap6 img, .popap7 img, .popap8 img, .popap9 img, .popap10 img{
  width: 195px;
}
.mobile_slider_img{width: 70px!important; margin: 81px 0px 0 -54px;
}
.buttons2 img{width: 38px;
}
.buttons1 img{width: 38px;}
.popap1:before, .popap2:before, .popap3:before, .popap4:before, .popap5:before, .popap6:before, .popap7:before, .popap8:before, .popap9:before, .popap10:before{
  width: 194px;
  }
}
.footer_menu .footer_href_color{
  padding-left: 0px;
  color:#929396;
  font-size: 11px;
}
/* POPAP */
@media screen and (max-width: 500px) {
 #overlay {bottom: 0;left: 0;display: none;width: 100%;}
.popup {top: 13%; right: 18%; width: 300px; height: 180px; }
.popup h2{ font-size: 22px;}
.popup span{ font-size: 19px;}
.popup a{font-size: 19px;}
}
@media screen and (max-width: 440px) {
  .popup { right: 15%; }
}
@media screen and (max-width: 400px) {
  .popup { right: 13%; }
}
@media screen and (max-width: 370px) {
  .popup { right: 10%; }
}
@media screen and (max-width: 340px) {
  .popup { right: 6%; }
}
@media screen and (max-width: 320px) {
  .popup { right: 3%; }
}
?
/* FOOTER */
@media screen and (max-width: 600px){
  
  .footer_menu a{padding-left:0px; display: block; padding-top: 10px;}
}