@import "vars.less";

*{margin: 0; padding: 0; outline: none;}

html{width: 100%; font-family: @fontText, sans-serif; font-size: @font; color: @color; -webkit-text-size-adjust: 100%;}
body{width: 100%; padding-top: 1px; margin-top: -1px; overflow-x: hidden;}

html.fixed, body.fixed, .bg.fixed{position: fixed; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; overflow: hidden;}

img{border: 0; line-height: 0;}

a{
  text-decoration: underline;
  text-decoration-skip-ink: none;
  color: @linkColor;
  .transition();
  &:hover {
    text-decoration: underline;
    color: @linkHoverColor;
  }
}

b, strong{font-family: @fontBold; font-weight: normal;}
i{font-family: @fontItalic; font-style: normal;}

span.no-link{
  display: inline;
  color: @color;
  border-bottom: 1px dashed;
  cursor: pointer;
  .transition();
  .user-select(none);
  &:hover {
    color: @linkHoverColor;
  }
}

button{border: inherit; outline: none;}

.table{display: table;}
.row{display: table-row;}
.cell{display: table-cell;}

.clear{clear:both;}
.overflow{overflow: hidden;}
.fl{float: left;}
.fr{float: right;}
.ib{display: inline-block;}
.helper{display: inline-block; width: 0; height: 100%; margin-right: -0.2em; vertical-align: middle;}
.center{text-align: center;}

.html_format{
  line-height: 22px;
  p{padding-top: 25px;}
  p:first-child{padding: 0;}
  h1,h2,h3,h4,h5,h6{
    margin: 25px 0 10px; line-height: normal;
    &:first-child{margin-top: 0;}
  }
  h1{font-size: @h1; font-family: @fontBold;}
  h2{font-size: @h2; font-family: @fontBold;}
  h3{font-size: @h3; font-family: @fontBold;}
  h4{font-size: @h4; font-family: @fontBold;}
  h5{font-size: @h5; font-family: @fontBold;}
  h6{font-size: @font; font-family: @fontBold;}
  ul{list-style: none;}
  ul{
    padding-top: 10px;
    li{position: relative; padding-left: 20px;}
    li:first-child{margin-top: 0;}
    li:before{content: ''; position: absolute; left: 0; top: 10px; width: 12px; height: 1px; background: @linkHoverColor;}
  }
  ol{list-style: none; counter-reset: item;}
  ol{
    padding-top: 10px;
    li{position: relative; padding-left: 20px;}
    li:first-child{margin-top: 0;}
    li:before{content: counter(item)'.'; counter-increment: item; position: absolute; left: 0; top: 0;}
  }
  table{width: 100%; border-collapse: collapse;}
  td{padding: 5px 10px; vertical-align: top;}
  th{padding: 15px 5px; vertical-align: middle; text-align: center; font-weight: normal;}
  td, th{border: 1px solid #a6a6a6; .border-box();}
}

h1, h2, h3, h4, h5, h6{font-size: inherit; font-family: inherit; font-weight: normal;}

.rouble{font-family: Rouble;}

.wrapper{position: relative; width: 100%; max-width: 1190px; margin: 0 auto; padding: 0 10px; .border-box();}

.owl-carousel{display: block;}
.owl-dots{position: absolute; left: 0; bottom: 0; width: 100%; text-align: center;}
.owl-dot{display: inline-block; width: 15px; height: 15px; margin: 0 3px; background: @buttonColor; border: 1px solid @color; border-radius: 50%; .border-box(); .transition();}
.owl-dot.active{background: @color;}
.slider-arrow{width: 14px; height: 24px; .bg("slider-arrow.png"); background-size: cover;}

.popup{position: absolute; left: 50%; display: none; width: 556px; max-width: 90%; margin-left: -448px; padding: 45px 75px; background: @buttonColor; .border-box(); .box-shadow(0px 3px 10px 0px rgba(0,0,0,0.2)); z-index: 10;}
.popup__name{text-align: center; font-size: 28px;}
.popup__buttons{width: 360px; max-width: 100%; margin: 40px auto 0;}
.popup__buttons .button{width: 165px; height: 50px; padding: 0; line-height: 50px; .box-shadow(none);}
.popup__buttons .button.no{background: #24a7ee;}
.popup__buttons .button.no:before{border-color: #24a7ee;}
.popup__close{position: absolute; right: 15px; top: 15px; cursor: pointer; .user-select(none);}
.popup-bg{display: none; .fixedBlock(); z-index: 9;}

.header{position: absolute; left: 0; top: 75px; width: 100%; height: 55px; line-height: 55px; background: @buttonColor; .box-shadow(0px 0px 3px 0px rgba(0,0,0,0.6)); z-index: 3;}
.header--fixed{position: fixed;}
.header__menu{position: relative;}
.header__menu_left, .header__menu_right{margin-left: -35px; text-align: left;}
.header__menu_right{text-align: right;}
.header__logo{position: absolute; left: 50%; top: -55px; margin-left: -88px;}
.header__logo--mobile{display: none;}
.header__logo img{max-width: 100%;}
.header__menu_item{display: inline-block; margin-left: 35px; text-transform: uppercase;}
.header__menu_item{
  a{position: relative; color: @color; text-decoration: none;}
  a:after{content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 2px; background: @linkHoverColor; .transition();}
  a:hover{
    color: @linkHoverColor;
    &:after{width: 100%;}
  }
  &.active a:after{width: 100%;}
}

.header__menu_burger, .header__menu_phone{position: relative; display: none; width: 65px; height: 65px; margin-top: 2px; border: 2px solid @color; border-radius: 50%; .border-box();}
.header__menu_burger{
  span:before, span:after{content: ''; display: block;}
  span, span:before, span:after{position: absolute; width: 35px; height: 3px; .transition-property(transform); .transition-timing-function(ease); .transition-duration(.15s); border-radius: 3px; background-color: @color;}
  span{left: 12.5px; top: 29px; .transition-timing-function(cubic-bezier(.55,.055,.675,.19)); .transition-duration(75ms);}
  span:before{top: -10px; .transition(~"top 75ms ease .12s, opacity 75ms ease");}
  span:after{bottom: -10px; .transition(~"bottom 75ms ease .12s, transform 75ms cubic-bezier(.55,.055,.675,.19)");}
  &.active{
    span{.transition-delay(.12s); .transition-timing-function(cubic-bezier(.215,.61,.355,1)); .rotate(45deg)};
    span:before{top: 0; .transition(~"top 75ms ease, opacity 75ms ease .12s"); opacity: 0;}
    span:after{bottom: 0; .transition(~"bottom 75ms ease, transform 75ms cubic-bezier(.215,.61,.355,1) .12s"); .rotate(-90deg);}
  }
}
.header__menu_phone{background: url(/images/tpl/phone.png) center center no-repeat; background-size: 26px 26px;}
.header__title{display: none; margin-top: 32px; line-height: normal; text-align: center; text-transform: uppercase; font-size: @h4; font-family: @fontBold;}

.header__menu_mobile{position: fixed; left: 0; right: 0; top: 115px; bottom: 0; display: none; background: @buttonColor; border-top: 3px solid #e6e6e6; overflow-y: auto;}
.header__mmenu_item{line-height: 43px; text-align: center; text-transform: uppercase; font-size: @font; border-bottom: 1px solid #e6e6e6;}
.header__mmenu_item a{display: block; padding: 0 15px; text-decoration: none; color: @color;}
//.header__mmenu_item.active a{color: @buttonColor; background: @color;}

.footer{line-height: 40px; background: @color;}
.footer__copyright{float: left; text-transform: uppercase; font-size: @h6; color: @buttonColor;}
.footer__creator{float: right; text-align: center; line-height: normal; font-size: 13px;}
.footer__creator{
  a{display: block; text-decoration: none; color: @buttonColor;}
  span{display: block; margin: 4px 0 2px;}
  img{max-width: 70px;}
}

.container{min-height: calc(@winHeight); overflow-x: hidden;}
.content{padding: 250px 0 30px;}
.title{font-size: @h1; font-family: @fontBold;}
.subtitle{margin-top: 5px;}
.check{display: inline-block; width: 21px; height: 20px; .bg("check.png"); background-size: cover;}

.slide{position: relative; display: block; width: 100%; height: calc(@winHeight); min-height: 420px;}
.slide--mod{height: 100vh;}
.slide .wrapper{height: 100%;}
.slide__content{position: relative; display: inline-block; width: 98%; vertical-align: middle; text-align: center; text-transform: uppercase; color: @buttonColor; z-index: 1;}
.slide__content--coop{padding: 55px 100px; text-transform: none; color: @color; background: rgba(255, 255, 255, 0.8); .border-box();}
.slide__content_title{font-size: @h1; font-family: @fontBold;}
.slide__content_title--mod{font-size: @h3;}
.slide__content_subtitle{margin-top: 25px; font-size: @h3;}
.slide__shadow{.fullBlock(); background: rgba(0, 0, 0, 0.6);}
.slide__video{.fullBlock(); overflow: hidden;}
.slide__video iframe{position: absolute; left: 50%; top: 50%; .transform(translateX(-50%) translateY(-50%)); width: 100%; min-width: 100%; min-height: 100%; height: calc(250vh);}

.coop__title{text-transform: uppercase; font-size: @h3; font-family: @fontBold;}
.coop__text{margin-top: 10px; line-height: 28px;}

.about{padding: 70px 0 0;}
.about__title{text-align: center; text-transform: uppercase; font-size: @h2; font-family: @fontBold;}
.about__companies{margin-top: 60px; text-align: center;}
.about__companies_list{margin-left: -215px; margin-top: -120px;}
.about__companies_item{display: inline-block; width: 240px; margin-left: 215px; margin-top: 120px; vertical-align: middle;}
.about__companies_item img{max-width: 100%;}
.about__credo{position: relative; width: 100%; margin-top: 90px; padding-top: 38%; background: url(/images/tpl/about-img6.jpg) center center; background-size: cover;}
.about__credo_container{position: absolute; left: 50%; top: 50%; width: 440px; height: 96px; margin-left: -220px; margin-top: -48px; text-align: center;}
.about__credo_title{text-transform: uppercase; font-size: @h3; font-family: @fontBold;}
.about__credo_content{font-size: @h4;}

.video{.fullBlock(); z-index: 1;}
.video__outer{position: relative; width: 100%; padding-top: 50%;}
.video iframe{.fullBlock();}
.video__play{position: absolute; left: 50%; top: 50%; width: 237px; height: 168px; margin-left: -118px; margin-top: -84px; .bg("video-play.png"); background-size: cover; opacity: .7; cursor: pointer; .transition(); .user-select(none);}
.video__play:hover{opacity: 1;}

.birds .wrapper{position: relative;}
.birds__content{position: absolute; left: 0; top: 0;}
.birds__content_title{font-size: @h1; font-family: @fontBold;}
.birds__content_subtitle{margin-top: 5px;}
.birds__content_text{margin-top: 5px;}
.birds__slider{position: relative; height: 630px;}
.birds__slider_list{width: auto;}
.birds__slider_list.owl-carousel .owl-item img{display: inline; width: auto;}
.birds__slider_item{position: absolute; width: 230px; text-align: center; font-size: @h4;}
.birds__slider_item{
  span{display: block; margin-top: 10px; .transition();}
  a{.fullBlock();}
  &:hover span{color: @linkHoverColor;}
}
.birds__slider_img img{max-width: 97%; vertical-align: bottom;}
.birds__slider_arrows{display: none;}
.birds__slider_aleft, .birds__slider_aright{position: absolute; top: 50%; margin-top: -22px; padding: 10px; cursor: pointer; z-index: 1;}
.birds__slider_aleft{left: 0;}
.birds__slider_aright{right: 0; .rotate(180deg);}

.birds__slider_item:nth-child(1){left: 0; top: 160px;}
.birds__slider_item:nth-child(2){left: 280px; top: 15px;}
.birds__slider_item:nth-child(3){left: 835px; top: 253px;}
.birds__slider_item:nth-child(4){left: 400px; top: 353px;}
.birds__slider_item:nth-child(5){left: 600px; top: 15px;}

.bird__left, .bird__right{width: 48%;}
.bird__img{max-width: calc(~"100% - 210px");}
.bird__img img{max-width: 100%;}

.bird__nav{width: 200px;}
.bird__nav_list{margin-top: -25px;}
.bird__nav_item{position: relative; margin-top: 25px; .transition();}
.bird__nav_item{
  img{max-width: 50px;}
  span{display: inline-block; width: calc(~"100% - 60px"); margin-left: 5px;}
  img, span{vertical-align: middle;}
  &:hover{color: @linkHoverColor;}
  a{.fullBlock();}
}
.bird__nav_button{display: none; text-align: center; text-transform: uppercase; font-size: @h6;}
.bird__nav_button{
  span, .slider-arrow{display: inline-block; vertical-align: middle;}
  .slider-arrow{margin-left: 10px; .rotate(-90deg);}
}
.bird__nav_close{position: fixed; right: 10px; top: 10px; display: none; width: 30px; height: 30px; cursor: pointer; .user-select(none);}
.bird__nav_close{
  &:before, &:after{content: ''; position: absolute; left: 0; top: 14px; width: 30px; height: 3px; border-radius: 3px; background: @color; .rotate(45deg);}
  &:after{left: auto; right: 0; .rotate(-45deg);}
}

.bird__title{font-size: @h2; font-family: @fontBold;}
.bird__content{margin-top: 15px;}
.bird__content{
  h1,h2,h3,h4,h5,h6{margin-bottom: 0; font-family: @fontText;}
  ul{margin-left: -15px;}
  li{display: inline-block; width: 150px; margin-left: 15px;}
}
.bird__phones{margin-top: 20px;}
.bird__phones_title{font-size: @h5; font-family: @fontBold;}
.bird__phones_list{margin-top: 10px;}
.bird__phones_item{margin-top: 5px;}
.bird__phones_item{
  a{position: relative; padding-left: 18px; text-decoration: none; color: @color;}
  a:hover{color: @linkHoverColor;}
  a:before{content: ''; position: absolute; left: 0; top: 3px; width: 12px; height: 13px; .bg("phone.png"); background-size: cover;}
}
.bird__characteristics{margin-top: 20px;}
.bird__characteristics_title{font-size: @h2;}
.bird__characteristics_string{margin-top: 10px;}
.bird__characteristics_string{
  .fl{margin-right: 5px;}
  .fr{margin-left: 5px;}
  .overflow{position: relative; top: 14px; min-height: 1px; .linear-gradient-left(@color, @color, 10%, rgba(255, 255, 255, 0), 20%); background-position: top; background-size: 10px 1px; background-repeat: repeat-x;}
}
.bird__doc{margin-top: 15px;}
.bird__doc_item{position: relative; height: 34px; margin-top: 10px; padding-left: 40px;}
.bird__doc_item{
  &:before{content: ''; position: absolute; left: 0; top: 0; width: 33px; height: 34px; .bg("doc-icon.png"); background-size: cover;}
  &.pdf:after{content: 'PDF'; position: absolute; left: 2px; top: 16px; line-height: normal; font-size: 11px; color: @linkHoverColor;}
  a{.fullBlock();}
}
.bird__doc_name{display: inline-block; max-width: 98%; vertical-align: middle; text-decoration: underline; text-decoration-skip-ink: none; color: @linkColor; .transition();}
.bird__doc_item:hover .bird__doc_name{color: @linkHoverColor;}

.meat{margin-top: 20px;}
.meat__table{position: relative; overflow: hidden;}
.meat__table_inner{width: 100%; overflow-x: auto;}
.meat__table_container{width: 880px; margin: 0 auto;}
.meat__table{
  td, th{
    background: @buttonColor;
    &:first-child{width: 145px;}
  }
  td .check{display: block; margin: 0 auto;}
  th{
    div{height: 80px;}
    div:after{content: ''; display: inline-block; width: 1px; height: 100%; vertical-align: bottom;}
    div img{max-width: 98%; vertical-align: bottom;}
  }
  p{padding: 7px 0;}
}
.meat__table_clone{position: absolute; left: 0; top: 0; display: none;}
table.meat__table_clone{width: 880px;}

.contacts{margin-bottom: -30px;}
.contacts__map{position: relative; height: 565px; margin-top: 55px;}
.contacts__map{
  #map{.fullBlock();}
  .wrapper{position: relative;}
}
.contacts__panel{position: absolute; left: 0; top: 35px; width: 345px; padding: 15px 30px; background: rgba(255, 255, 255, 0.9); .border-box(); z-index: 1;}
.contacts__panel_list{margin-top: -10px;}
.contacts__panel_item{margin-top: 10px;}
.contacts__panel_title{font-family: @fontBold;}
.contacts__panel_string{margin-top: 5px;}
.contacts__panel_address{line-height: 24px;}
.contacts__phone{
  text-decoration: none; color: @color;
  &:hover{text-decoration: none; color: @linkHoverColor;}
}

.manufactures{
  .slide:first-child {
    .slide__content_title{font-size: 50px;}
    .slide__content_subtitle{font-size: 22px;}
  }
  .slide__content_title{font-size: 41px;}
  .slide__content_subtitle{font-size: @h5;}
}
.manufactures__switcher{position: fixed; right: 70px; top: 50%; display: none; padding: 10px 5px; background: rgba(255, 255, 255, 0.3); border: 1px solid rgba(0, 0, 0, 0.6); border-radius: 40px; .transform(translateY(-50%));}
.manufactures__switcher.show{display: block;}
.manufactures__switcher_list{margin-top: -15px;}
.manufactures__switcher_item{width: 25px; height: 25px; margin-top: 15px; border: 1px solid @color; border-radius: 50%; cursor: pointer; .transition(); .border-box(); .user-select(none);}
.manufactures__switcher_item.active{background: @buttonColor;}

.error__container{position: absolute; left: 50%; top: 50%; width: 570px; height: 570px; margin-left: -285px; margin-top: -285px; text-align: center; color: @buttonColor;}
.error__container_content{position: relative; display: inline-block; max-width: 98%; vertical-align: middle; z-index: 1;}
.error__container_title{font-size: 150px; font-family: @fontBold;}
.error__container_text{font-size: @h3;}
.error__container_text{
  a{color: @buttonColor;}
  a:hover{text-decoration: none;}
}