@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,500,700&subset=cyrillic-ext,latin);
@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:700&subset=cyrillic-ext,latin);
@import url(https://fonts.googleapis.com/css?family=PT+Sans:400,700&subset=latin,cyrillic);

body {
  color: #5a5a5a;
}
.pad {
	padding: 45px 0 75px 0;
}
.pad1 {
	padding: 25px 0 25px 0;
}
.mt35{
margin-top: 35px;
}
.wd {
width: 40%;
text-align: center;
}

.wrapz {
background:#BA0000;
color:#ffffff;
text-align: center;
padding:25px 25px 25px 25px;
}

.wrap1 {
  background: url("../img/bg4.jpg") no-repeat center center;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	color: #fff;

}
.wrap1 h6 {
color: #fff;

}

.wrap2 {

	 background: url("../img/bg4.jpg") no-repeat center center;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	color: #fff;
}
.wrap3 {
  background: #f9f9f9;
	color: #999;
	padding: 25px 0 25px;
	font-size: 11px;
	font-family: 'Roboto', sans-serif;
text-transform: uppercase;
}
.wrap3 a {
color: #777;
}
.wrap4 {
  background: #F2F6F7;
	color: #333;

}

.wrap5 {
background: url("https://neato.ua/img/neatobotvac85.jpg") no-repeat center center;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #fff;
    padding: 45px 0 45px;
}
.wrapd5 {
background: url("https://neato.ua/img/d3_d5.jpg") no-repeat center center;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #fff;
    padding: 45px 0 45px;
}
.wrap75 {
background: url("https://neato.ua/img/neatobotvac75.jpg") no-repeat center center;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #fff;
    padding: 45px 0 45px;
}
.wrap70 {
background: url("https://neato.ua/img/neatobotvac70.jpg") no-repeat center center;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #fff;
    padding: 45px 0 45px;
}


.wrapDS {
background: url("https://neato.ua/img/bg_black.jpg") no-repeat center center;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #fff;
    padding: 45px 0 45px;
}
.wrapDS.banner3{
background: url("https://neato.ua/img/banner3h.jpg") no-repeat center center;
}

.wrapconnected {
background: url("https://neato.ua/img/bg_connected.jpg") no-repeat center center;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #fff;
    padding: 45px 0 45px;
}


.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}






.ch {
background: rgba(36,31,37, 0.35);


}

.bgl {
background: rgba(36,31,37, 0.55);


}

.ch1 {
background: rgba(65,93,133, 0.65);

}


h2 {
font-size: 18px;
	font-family: 'Roboto', sans-serif;
margin-top: 0px;
text-transform: uppercase;
color: #555;
margin-bottom: 15px;
font-weight: 500;

}
h6 {
font-size: 18px;
font-weight: bold;
font-family: 'PT Sans', sans-serif;
text-transform: uppercase;
color: #777;

}
.subtext {
color: #777;
padding-bottom: 55px;
font-size: 12px;
text-transform: uppercase;
width: 40%;
margin: 0 auto;
}

.sep {
border-bottom: 2px solid #FF5868;
width: 20%;
margin: 0 auto;
margin-top: 20px;
margin-bottom: 20px;
}

.sep1 {
border-bottom: 2px solid #FF5868;
width: 20%;

margin-top: 20px;
margin-bottom: 20px;
}

.cn {
margin: 0 auto;
}


/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 20;
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper > .container {
  padding-right: 0;
  padding-left: 0;
}
.navbar-wrapper .navbar {
  padding-right: 15px;
  padding-left: 15px;
}
.navbar-wrapper .navbar .container {
  width: auto;
}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.tzs {
  height: auto;
z-index: 1;
    overflow: hidden;

}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;

}

/* Declare heights because of positioning of img element */
.carousel .czs{
  height: auto;
 background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
      overflow: hidden;

}
.carousel-inner > .item > img {
  position: relative;
  top: 0;
  left: 0;
  min-width: 100%;
  height: auto;

}

.overlay {
 background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    pointer-events: none;
	    overflow: hidden;

}

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-3 {
  margin-bottom: 20px;
  text-align: center;
}
.marketing h2 {
  font-weight: normal;
}
.marketing .col-lg-3 p {
  margin-right: 10px;
  margin-left: 10px;
    text-align: center;

}


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 80px 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -1px;

}



/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {

  /* Navbar positioning foo */
  .navbar-wrapper {
    margin-top: 20px;
  }
  .navbar-wrapper .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .navbar-wrapper .navbar {
    padding-right: 0;
    padding-left: 0;
  }

  /* The navbar becomes detached from the top, so we round the corners */
  .navbar-wrapper .navbar {
  }

  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 20px;
    font-size: 21px;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 992px) {
  .featurette-heading {
    margin-top: 40px;
  }
}


.icos {
font-size: 38px;
color: #ccc;

margin-top: 10px;
padding: 27px 0 0 25px;
}



 .icos:hover {

cursor: pointer;
}
.icos1 {
font-size: 58px;
color: #FC611E;

margin-top: 10px;
padding: 16px 0 0 17px;
}
.icos2 {
font-size: 58px;
color: #A2B400;

margin-top: 10px;
padding: 16px 0 0 17px;
}
.icos3 {
font-size: 58px;
color: #2EAEB7;


margin-top: 10px;
padding: 16px 0 0 17px;
}
.icos4{
font-size: 58px;
color: #FC9F1E;


margin-top: 10px;
padding: 16px 0 0 17px;
}

.icx {
font-size: 58px;
color: #7EB9FD;

}
.mute{
color: #777;

}


@media (max-width: 768px) {

	.pad1 {
	padding: 25px;
	}
	.pad {
	padding: 15px;

}




.nav-tabs li a{ font-size: 13px; margin-top: 30px;}
    #quote-carousel .carousel-indicators {
        bottom: -20px !important;
    }
    #quote-carousel .carousel-indicators li {
        display: inline-block;
        margin: 0px 5px;
        width: 15px;
        height: 15px;
    }
    #quote-carousel .carousel-indicators li.active {
        width: 20px;
        height: 20px;
    }
}

.otziv {
 background: #f7f7f7;
padding: 80px;

}
.btn-tap {
  color: rgba(255,255,255, 0.85);
  background-color: transparent;
  border: 2px solid rgba(255,255,255, 0.85);
  border-radius: 4px;
   -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
	font-family: 'Roboto', sans-serif;
font-weight: 400;
font-size: 15px;

}
.btn-tap:hover,
.btn-tap:focus,
.btn-tap:active,
.btn-tap.active,
.open .dropdown-toggle.btn-more {
  color: #FF5868;
  background-color: #transparent;
  border-color: #FF5868;
    border-radius: 7px;
}

.btn-more {
  color: #fff;
  background-color: #77A0B2;
  border-bottom: 5px solid #77A0B2;
  border-radius: 2px;
   -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;

}
.btn-more:hover,
.btn-more:focus,
.btn-more:active,
.btn-more.active,
.open .dropdown-toggle.btn-more {
  color: #fff;
  background-color: #5182A9;
  border-color: #5182A9;
    border-radius: 2px;
}
.btn-more1 {
  color: #2EAEB7;
  background-color: transparent;
  border: 2px solid #2EAEB7;
  border-radius: 3px;
   -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
	padding: 10px;
}
.btn-more1:hover,
.btn-more1:focus,
.btn-more1:active,
.btn-more1.active,
.open .dropdown-toggle.btn-more1 {
  color: #fff;
  background-color: #5182A9;
  border-color: #5182A9;
    border-radius: 2px;
}

.btn-more2 {
  color: #fff;
  background-color: #A9CF55;
  border-bottom: 5px solid #7E993D;
  border-radius: 2px;
   -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;

}
.btn-more2:hover,
.btn-more2:focus,
.btn-more2:active,
.btn-more2.active,
.open .dropdown-toggle.btn-more2 {
  color: #fff;
  background-color: #7E993D;
  border-color: #7E993D;
    border-radius: 2px;
}
.cir {
background: rgba(114,172,207, 0.25);
width: 180px;
height: 180px;
border-radius: 50%;
padding-top: 15px;
cursor: pointer;
border: 10px solid rgba(114,172,207, 0.25);
 -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
	margin-top: 60px;
	color: #fff;
	margin-bottom: 40px;
}
.cir:hover {
border: 10px solid rgba(255,255,255, 0.35);
background: rgba(114,172,207, 0.25);

}

.cir2 {
background: #DB282A;;
width: 180px;
height: 180px;
border-radius: 50%;
padding-top: 15px;
cursor: pointer;
border: 10px solid #F52D2F;
 -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
	margin-top: 60px;
	color: #fff;
}
.cir2:hover {
border: 10px solid transparent;
background: rgba(114,172,207, 0.25);

}
.icn {
font-size: 58px;
color: #fff;
}
.cn {
text-align: center;
}
footer {
background: #333;
color: #ccc;

padding: 40px 0 20px;
}
footer a {
color: #fff;
text-transform: uppercase;
font-size: 12px;
}

footer  li {
list-style: none;
padding-bottom: 7px;
}
.sepf {border-bottom: 1px solid #444;
margin: 15px 0 15px;
}

.br {
border: 1px solid #ddd;
}

.ff {
color: #fff;
font-size: 45px;
font-family: 'Roboto', sans-serif;

}
.ff2 {
color: #fff;
font-size: 45px;
font-family: 'Roboto', sans-serif;

}
.lead1 {
    font-size: 16px;
	font-family: 'Roboto', sans-serif;
font-weight: 400;
color: #777;
  }
   .buy {
 font-size: 14px;
 color: #86B3C7;
 border: 2px solid #86B3C7;
 padding: 7px 15px  7px 15px;
 border-radius: 4px;
 	font-family: 'Roboto', sans-serif;
font-weight: 400;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
 }

  .buy:hover{
  text-decoration: none;
  background: #86B3C7;
  color: #fff;
   border: 2px solid #86B3C7;
  }

  .icc {
  color: #ddd;
  }
  .mutt {
  text-transform: uppercase;
  color: #FE7B5F;
  font-size: 11px;
  font-weight: bold;
  }
  .price {
  color: #19CFD3;
  margin: 25px 0 25px;
  }
  /* Main carousel style */
.tovar {
    width: 100%;

}
.cont-slider > .item > img {

display: block;
  width: 100% \9;
  max-width: 100%;
  height: auto;
}

.cont-slider > .item  {

/*height: 100%;*/
}


/* Indicators list style */
.article-slide .carousel-indicators {

    left: 0;
    margin-left: 5px;
    width: 100%;
	position: relative;

  z-index: 15;
  list-style: none;

}
/* Indicators list style */
.article-slide .carousel-indicators li {
    border: medium none;
    border-radius: 0;
  text-align: center;
    height: 54px;
    margin-bottom: 5px;
    margin-left: 0;
    margin-right: 5px !important;
    margin-top: 40px;
    width: 100px;
}
/* Indicators images style */
.article-slide .carousel-indicators img {

    height: 54px;
    left: 0;
    width: 100px;
}
/* Indicators active image style */
.article-slide .carousel-indicators .active img {
    border: 2px solid #86B3C7;
    opacity: 0.7;
}

.param {
color: #999;
font-size: 12px;
padding-right: 10px;
font-style: italic;
margin-bottom: 35px;
}
.block1 {
display: block;
padding: 15px;
  line-height: 1.42857143;
  background-color: #ffffff;
  border: 1px solid  #fff !important;
color: #FF5868;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.block1:hover,
.block1:focus,
.block1.active {
  cursor: pointer;
border-color:  #86B3C7 !important;
}
.back-to-top {
    position: fixed;
    bottom: 2em;
    right: 0px;
    text-decoration: none;
    color: #fff;
    background-color: #86B3C7;
    font-size: 22px;
    padding: 1em;
    display: none;
}

.back-to-top:hover {
    background-color:#FF5868;
	color: #fff;
}

.brd {
color: #BAC5C8;
font-size: 16px;
}

.brd a {
color: #37B1D0
}

  .m1 {

  margin-left: -250px;
  margin-top: -50px;
  }
@media (max-width:  768px) {
.navbar-collapse {
border: none;
background: #86B3C7;
margin-left: 30px;
  padding-right: 35px;
  padding-left: 0px;
  margin-top: 35px;
  border-radius: none;
  min-width: 250px;
  color: #fff;
position: relative;
}
    .m1 {

  margin-left:20px;
  margin-top: 5px;
  }
.navbar-default .navbar-nav > li > a {
  color: #fff;
}

}

@media (max-width: 968px) {
.ff {font-size: 18px;}




  .lead {
    font-size: 12px;

  }

  h6 {margin-top: 35px;}

  .pad {
  padding: 45px 20px 45px;

  }
  .tzs {
 height: auto;
  overflow: hidden;

  }

.carousel .czs{
  overflow: hidden;
 height: auto;
  }

  .carousel-inner > .item > img {

 height: auto;;
     overflow: hidden;

  }
    .m1 {

  margin-left:20px;
  margin-top: none;
  }

  .btn-lg {

  font-size: 12px;
  padding: 5px;
  margin-bottom: 15px;
  }

  .carousel-caption {
  text-align: center;

  }
  .mbb {
  margin-bottom: 25px;
  }

  .subtext {
  width: 80%
  }

  .carousel-caption {
  top: 10%;
  }

  .search {
  margin-bottom: 40px;
  }

  }
  .q {
  font-size: 16px;
  color: #333;
  border-bottom: 1px solid #eee;
  padding-bottom: 7px;
  }

    .q a{
	color: #666;
	}

	  .q a:hover{
	  text-decoration: none;
	  color: #63BFD5;
	  }


	    .s {
  font-size: 14px;
  color: #333;
  padding-bottom: 7px;
  }

  .s i {
  padding-right: 10px;
  }

    .s a{
	color: #444;
	}

	  .s a:hover{
	  text-decoration: none;
	  color: #63BFD5;
	  }
.search {
  width: 100%;
  position: relative;
  margin-top: 50px;
}
.search:before {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  line-height: 40px;
  font-family: 'FontAwesome';
  content: '\f002';

  text-align: center;
  color: #ddd;
  border-radius: 25px;
  -webkit-font-smoothing: subpixel-antialiased;
  font-smooth: always;
}

.searchTerm {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  border: 2px solid #ddd;
  padding: 15px;
  height: 40px;
  border-radius: 25px;
  outline: none;
}

.searchButton {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  opacity: 0;
  cursor: pointer;
}

.mt45 {

margin-top: 45px;
}
.mb45 {

margin-bottom: 45px;
}

.mt35 .form-control {
  color: #5a5a5a;
}