@font-face {
  font-family: "icons";
  src: local(standart-icons), url(fonts/standart-icons.ttf);
}

html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  color: black;
  font-size: 15px;
  font-family: Arial;
  line-height: 1.2;
}

h1, .h1, h2 { 
  font-size: 200%; 
  text-align: center; 
  font-weight: normal; 
  color: white; 
}
h1 { color: white; background: #65b400; padding-top: 5px; }
h1:after { 
  content: ""; 
  display: block; 
  position: absolute;
  width: 0; 
  height: 0; 
  left: 50%;
  margin-left: -630px;
  border-left: 630px solid transparent;
  border-right: 630px solid transparent;
  border-top: 30px solid #65b400;
}
h2 { color: black; }
.h1:after { 
  content: ""; 
  display: block; 
  width: 0; 
  height: 0; 
  margin: 0 auto;
  border-left: 120px solid transparent;
  border-right: 120px solid transparent;
  border-top: 10px solid white;
}
h3 { font-size: 133%; font-weight: normal; margin-top: -20px; }
h4 { text-align: center; font-size: 133%; margin: 20px 0; }

p { margin: 10px 0; text-align: left; }

ul { padding-left: 10px; }

a { color: #8c8e90; }
a:hover { color: #65b400; text-decoration: none; }
.non { text-decoration: none; }
.non:hover { text-decoration: underline; }

.left { float: left; }
.right { float: right; }
.center { text-align: center; }
.bigtext {  font-size: 133%;  }
.white { color: white !important; }
.gray { display: inline-block; padding: 3px 30px; margin: 10px 0 5px 0; background: #b4b6b7; }
.w50 { width: 50%; }

.but { 
  display: inline-block;
  padding: 5px 20px;
  color: white;
  background: #b4b6b7;
  text-decoration: none;
  font-size: 133%;
}
.but:hover { background: #65b400; color: white; }

sub {   
  display: inline-block;
  margin: 0 5px;
  text-decoration: none;
  font-family: "icons", sans-serif;
  font-size: 18px;
}

.logo { position: absolute; z-index: 3; top: 40px; left: 50%; margin-left: -91px; }

header>div, nav>div, section>div, footer>div, .unslider-wrap li > div {
	position: relative;
  width: 98%;
  max-width: 1260px;
	min-width: 1000px;
	margin: 0 auto;
}
section>div { overflow: hidden; }
#first { margin-top: -25px; }

header { color: white; background: #65b400; padding: 5px; text-align: center; }
header span { position: absolute; top: 0; left: 0; }
header a, header a:hover { color: white; }
label { position: relative; }
label a { text-decoration: none; border-bottom: 1px dashed white; }
label a:hover { border: none; }
.submenu {
  background: #b4b6b7; 
  position: absolute;
  left: 30px;
  top: 19px;
  z-index: 4;
  height: 0;
  padding: 5px;
  white-space: nowrap;
  text-align: left;
  line-height: 20px;
  overflow: hidden;
  opacity: 0;
  transition: 0.5s;
}
.submenu a {  color: white; }
label:hover .submenu { opacity: 1; height: 60px; }

nav { 
  position: absolute; 
  z-index: 3; 
  top: 50px; 
  left: 0; 
  width: 100%;
  color: white;
}
nav span { 
  position: absolute; 
  top: -12px; 
  left: 10px; 
  padding: 2px 100px 2px 10px;
  background: #b4b6b7; 
  cursor: pointer;
}
nav i { letter-spacing: -5px; font-style: normal; margin-right: 5px; }
nav.in .menu { display: none; }
nav.in .phone { margin-top: -12px; }

.menu { width: 260px; padding: 10px 0; background: rgba(101,180,0,.8); }
.menu a { 
	display: block;
	width: 220px;
  padding: 10px 0;
	color: white;
	text-align: center;
	text-decoration: none;
  font-size: 133%; 
  border-bottom: 1px solid #b4b6b7;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
}
.menu a:hover, .menu a.active { color: black; background: rgba(255,255,255,.7); }

.phone { 
  float: right; 
  margin-top: 20px; 
  padding: 5px 20px; 
  color: white;
  background: #b4b6b7; 
  text-decoration: none;
  font-size: 133%; 
}
.phone:hover { color: white; background: #65b400 }

.fix {  position: fixed !important; top: 10px; }
.fix .menu { display: none; }
.fix .phone { display: none; }

.show { 
  padding: 10px 0 !important; 
  opacity: 1 !important; 
  height: auto !important; 
  transition: .5s;
}
.show a { 
  visibility: visible !important; 
  padding: 10px 0 !important; 
  opacity: 1 !important; 
  height: auto !important;
  border-bottom: 1px solid #b4b6b7 !important;
  transition: .5s;
}

.hex {
  position: relative;
  float: right;
  margin: 140px 0;
  width: 300px;
  height: 310px;
  padding: 0 30px;
  color: white;
  background: rgba(101,180,0,.7);
  text-align: center;
}
.hex:before, .hex:after {
  content: "";
  position: absolute;
  left: 0;
  width: 0;
  height: 0;
  border-left: 180px solid transparent;
  border-right: 180px solid transparent;
}
.hex:before { top: -50px; border-bottom: 50px solid rgba(101,180,0,.7);  }
.hex:after { bottom: -50px; border-top: 50px solid rgba(101,180,0,.7);  }

.hex p, .tpap p { text-align: center; }
.hex a { display: inline-block;
  padding: 5px 20px;
  color: white;
  background: #b4b6b7;
  text-decoration: none;
  font-size: 133%;  }
.hex a:hover { background: #00B204; }

.assortiment {
  float: left !important;
  margin: 60px 50px 60px 0 !important;
  height: auto !important;
  min-height: 50px;
  padding: 10px 30px !important;
}

.assimg { float: right; margin-top: -15px; }
.assimg img { display: block; margin: 10px auto; }

#inromb { position: relative; overflow: hidden; margin: 2% 0; }
#inromb:before, #inromb:after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 50%;
  margin-left: -640px;
  width: 0;
  height: 0;
  border-left: 640px solid white;
  border-right: 640px solid white;
}
#inromb:before { border-bottom: 64px solid transparent;  }
#inromb:after { bottom: 0; border-top: 64px solid transparent;  }

.fotoimg { width: 30%; float: right; margin: 10px; box-shadow: 5px 5px 3px 3px #b4b6b7; }

.sovet { background: url(foto/fon2.jpg); background-size: cover; }

.trap {
  position: relative;
  margin: 90px 30px;
  width: 300px;
  height: 300px;
  padding: 30px;
  color: white;
  background: rgba(101,180,0,.7);
  text-align: center;
}
.trap:before, .trap:after {
  content: "";
  position: absolute;
  left: 0;
  width: 0;
  height: 0;
  border-left: 360px solid transparent;
}
.trap:before { top: -40px; border-bottom: 40px solid rgba(101,180,0,.7);  }
.trap:after { bottom: -40px; border-top: 40px solid rgba(101,180,0,.7);  }

.tovar { float: left; width: 30%; padding: 0 1.5% 3% 0;  }
.tovar li { font-size: 133%; } 
.tovar a { color: #65b400; text-decoration: none; }
.tovar a:hover { color: black; text-decoration: underline; }

ul { list-style: none; margin: -5px 0 20px 10px; }
li { padding: 5px 5px 5px 20px; background: url(images/rombik.png) no-repeat left center; }

.news a { 
  position: relative; 
  height: 380px; 
  padding-bottom: 30px;
  background: #65b400; 
  color: white; 
  text-decoration: none;
}
.news a:hover { background: #00B204;  }
.news a:hover b { text-decoration: underline; }
.news p { padding: 5px 10px; text-align: center; }
.news img, .fotogal img { width: 100%; }
.fotogal img { max-height: 220px; margin-bottom: 20px; }
.fotogal { z-index: 2; }

.news a:nth-child(3n):before, .news a:nth-child(3n+1):before, .news a:nth-child(3n+2):before,
.news a:nth-child(3n):after, .news a:nth-child(3n+1):after, .news a:nth-child(3n+2):after
 {
  content: "";
  position: absolute;
  z-index: 2;
  left: 0;
  width: 0;
  height: 0;
}
.news a:nth-child(3n):before { 
  top: 0; 
  border-right: 300px solid transparent; 
  border-top: 20px solid white;
}
.news a:nth-child(3n):after { 
  bottom: 0; 
  border-right: 300px solid transparent; 
  border-bottom: 20px solid white;
}
.news a:nth-child(3n+1):before { 
  top: 0; 
  border-left: 300px solid transparent; 
  border-top: 20px solid white;
}
.news a:nth-child(3n+1):after { 
  bottom: 0; 
  border-left: 300px solid transparent; 
  border-bottom: 20px solid white;
}
.news a:nth-child(3n+2):before { 
  top: 0; 
  height: 20px;
  width: 100%;
  background: white;
}
.news a:nth-child(3n+2):after { 
  bottom: 0; 
  height: 20px;
  width: 100%;
  background: white;
}

#maps { 
  position: relative; 
  padding-top: 60px;
  margin-bottom: -60px;
  color: white; 
  background: #65b400; 
  overflow: hidden;
}
#maps:before, footer:before { 
  content: ""; 
  display: block; 
  position: absolute;
  z-index: 2;
  width: 0; 
  height: 0;
  top: 0; 
  left: 50%;
  margin-left: -1000px;
  border-left: 1000px solid white;
  border-right: 1000px solid white;
  border-bottom: 50px solid transparent;
}
#maps p { margin: 10px 20px; }
#maps a, footer a { text-decoration: none; }

#maps .bigtext > a { color: white; border-bottom: 1px dashed white; cursor: pointer; }
#maps .bigtext > a:hover { color: white; border: none; }
.on { padding: 5px 20px; color: black; background: #b4b6b7; }
.on:hover { color: black }

.box { width: 100%; display: none; position: relative; height: 350px; }
.box div { position: absolute; z-index: 3; width: 100%; height: 350px; }

footer { 
  position: relative;
  height: 30px; 
  padding: 75px 0 10px 0; 
  overflow: hidden; 
  color: white; 
  background: #65b400; 
}

.icons { float: right; margin-right: 10%; }
.icons a { 
  display: inline-block; 
  position: relative; 
  padding: 2px 3px;
  margin: 0 10px;
  background: white; 
  color: #65b400;
  text-decoration: none; 
  transition: .5s;
}
.icons a:before, .icons a:after {
  content: "";
  position: absolute;
  left: 0;
  width: 0;
  height: 0;
  border-left: 17px solid transparent;
  border-right: 17px solid transparent;
  transition: .5s;
}
.icons a:before { top: -8px; border-bottom: 8px solid white;  }
.icons a:after { bottom: -8px; border-top: 8px solid white;  }
.icons a:hover { color: white; background: #b4b6b7; }
.icons a:hover:before { border-bottom: 8px solid #b4b6b7;   }
.icons a:hover:after { border-top: 8px solid #b4b6b7;   }

.intrlogo { 
  display: block; 
  float: right;
  width: 100px; 
  height: 20px; 
  margin: 0 10px 0 20px; 
  padding: 4px 10px 6px 30px; 
  font: 10pt Arial; 
  background: url('http://intrid.ru/madein/white.png'); 
  color: #2f4452; 
  text-decoration: none
}
.intrlogo:hover { color: #395363; }

#top { position:relative; height: 160px; overflow: hidden; }
#top:before, #top:after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 50%;
  margin-left: -2000px;
  width: 0;
  height: 0;
  border-left: 2000px solid transparent;
  border-right: 2000px solid transparent;
}
#top:before { top: 10px; border-top: 150px solid #b4b6b7; }
#top:after { top: 0; border-top: 150px solid white; }

.unslider { position:relative; left: 0; margin: -60px 0 0 0; width: 100%; z-index: 0; overflow: hidden; }
 .unslider-wrap{position:static;left:0;top:0;margin:0;padding:0; height: 100%}
.unslider-wrap li { float:left;left:0;top:0;margin:0;padding:0;z-index:0;width: 100%;height: 100%; 
  list-style:none; background-position: center center; background-repeat: no-repeat; background-size: cover; }
.unslider-wrap li > div { height: 100%;  opacity: 0; transition: .5s ease-out 0.5s; }
.unslider-wrap li.unslider-active > div {  opacity: 1; }

.unslider-arrow {
    position: absolute;
    left: 0;
    z-index: 3;
    top: 50%;
    display: block;
    width: 40px;
    height: 50px;
    cursor: pointer;
    opacity: .5;
    background: #65b400 url(images/sprite-icons.png) center bottom no-repeat;
    transition: .5s;
}
.unslider-arrow:hover {  opacity: 1; }
.unslider-arrow.prev {  border-radius: 0 10px 10px 0; }
.unslider-arrow.next {
  left: auto;
  right: 0;
  background-position: center -197px;
  border-radius: 10px 0 0 10px;
}
.unslider-nav {
  position: absolute;
  left: 45%;
  bottom: 0;
  z-index: 5;
}
.unslider-nav ol { list-style: none; text-align: center; }
.unslider-nav ol li {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 4px;
  background: #0f78cb;
  border-radius: 50%;
  overflow: hidden;
  text-indent: -999em;
  border: 1px solid white;
  cursor: pointer;
}
.unslider-nav ol li.unslider-active {
  background: #fe9627;
  cursor: default;
}

.unslider ul li:nth-child(1) {background-image: url(foto/fon1.jpg)}
.unslider ul li:nth-child(2) {background-image: url(foto/fon2.jpg)}
.unslider ul li:nth-child(3) {background-image: url(foto/fon3.jpg)}
.unslider ul li:nth-child(4) {background-image: url(foto/fon4.jpg)}
.unslider ul li:nth-child(5) {background-image: url(foto/fon5.jpg)}
.unslider ul li:nth-child(6) {background-image: url(foto/fon6.jpg)}

.bx-wrapper { position: relative; display: inline-block; margin-top: 50px; }

.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 50%;
  margin-top: -25px;
  border: none;
  width: 40px;
  height: 50px;
  text-indent: -9999px;
  z-index: 3;
  background-color: #b4b6b7;
  background-image: url(images/sprite-icons.png);
  background-repeat: no-repeat;
  opacity: .5;
  transition: .5s;
}
.bx-wrapper .bx-controls-direction a:hover { opacity: 1; }
.bx-wrapper .bx-controls-direction a.disabled { display: none; }
.bx-wrapper .bx-next { right: -45px; border-radius: 0 10px 10px 0; background-position: center -197px; }
.bx-wrapper .bx-prev { left: -45px;  border-radius: 10px 0 0 10px; background-position: center bottom; }

.feed a { text-align: center; text-decoration: none; color: black; }
.feed a b { display: block; }
.feed a:hover { color: #b4b6b7; }
.feed a:hover b { text-decoration: underline; }
.feed img { margin: 10px; width: 97%; transition: .5s; }
.feed a:hover img { width: 100%; margin: 0 5px 10px 5px; }

.otzyvy { padding: 20px 0; background: #b4b6b7; }
.otzyvy span { display: block; float: left; width: 27%; height: 380px; margin: 0 3%; text-align: center; }
.otzyvy span img { margin: 10px; width: 190px; transition: .5s; border: 10px solid #65b400; border-radius: 50%; }
.otzyvy span:hover img { width: 200px; margin: 0 5px 10px 5px; }

.feedback { 
  position: relative;
  font: italic 110% Arial;
  padding: 10px; 
  margin: 30px 0 15px 0;
  background: #e4e6e7; 
  border-radius: 10px;
  }
.feedback:after { 
  content: '';
  display: block;
  position: absolute; 
  bottom: -20px; 
  border: 10px solid transparent; 
  border-top: 10px solid #e4e6e7;
}

input, textarea { 
  padding: 10px 20px; 
  color: #353b47; 
  border: 1px solid #c0c9d0; 
  border-radius: 2px;
  font: 133% Arial, sans-serif;
  margin-bottom: 10px;
}
.feed { margin-bottom: 20px; }
.feed textarea { float: right; width: 65%; height: 117px; }
.feed input { width: 25%; }
input[type=submit] { cursor: pointer; background: #b4b6b7; }
input[type=submit]:hover { background: #65b400; }
.feed input[type=submit] { float: right; }

#callme { padding: 5% 10%; text-align: center; }
#callme input[type=text], #callme textarea { width: 80%; }

.tab { padding-left: 100px; }
.tab span { display: inline-block; width: 100px; margin-left: -100px; color: #65b400; }

.tovtab { margin-bottom: 50px; }
.tovtab td { padding: 5px 20px; }
.tovtab tr td:last-child { font-size: 133%;  }
.tovtab tr:hover { background: white; }


/* contact form */
.letter { float: right; width: 50%; height: 480px; margin: 0 0 0 10px; padding: 10px 0px; color: #333333; background: white url('http://cms.intrid.ru/images/letter.jpg'); }
.letter img { float: right; margin: 20px 30px 20px 0; }
.letter input, .letter textarea { font-size: 16px; padding: 5px 8px; color: #777777; border: 1px #eeeeee inset; 
margin-bottom: 0; }
.letter input { width: 45%; }
.letter p { margin: 20px 0 10px 40px; text-align: left; font-size: 14px; }
p.ip { margin: -10px 40px 50px 120px; text-align: left; color: #777777; font-size: 12px; }
p.ip span { display: inline-block; width: 100px; height: 20px; margin: 0px 20px; padding: 5px 10px; color: black; font-size: 16px; border: 1px #333333 solid; }
.letter h5 { text-align: center; margin: 10px; font-size: 20px; font-weight: bold; }
.letter textarea { width: 85%; height: 100px; margin: 10px 40px; }
.letter input[type="submit"] { display: block; margin: 0px auto 0px auto; padding: 5px 15px; color: white; background: #214f68; border-radius: 5px; }
.letter input[type="submit"]:hover { cursor: pointer; box-shadow: 0px 0px 5px #333333; }
.letter a { color: #777777; }
/* end form */