html {font-family: 'Nunito', sans-serif; font-weight: 400; font-size: 16px; color: #333333}
body {margin: 0; padding: 0; text-align: center}
a {color: #C6312F}
a img {border: none}
img {max-width: 100%}
strong {font-weight: 900}
p {margin: 0 0 30px 0; line-height: 1.5}
h1 {font-weight: 700; line-height: 1.2; font-size: 5rem; margin: 0 0 25px 0}
h2 {font-weight: 900; line-height: 1.2; font-size: 3.2rem; margin: 0 0 25px 0; color: #C6312F}


.head {background: #1E1E1E url("../images/bg_head.png") center top no-repeat; color: #CCCCCC; position: relative; z-index: 100}
.head a {color: #CCCCCC}
.head-in {width: 96%; max-width: 1620px; margin: 0 auto; text-align: left; display: flex; justify-content: space-between; align-items: center}
.logo {display: inline-block; background: #1E1E1E url("../images/logo.png") left top no-repeat; width: 283px; height: 78px; margin: 5px 0; flex: 0 0 auto}
.head-right {text-align: right}
.head-top {padding: 5px 0; line-height: 1.4; color: #666666; font-size: 1.2rem}
.head-top .lang a { color:#666666;}
.head-top .lang a.active { color:#fff;}
.head-top .phone {display: inline-block; margin-left: 12px; padding-left: 26px; background: url("../images/ico_phone.png") left center no-repeat; color: #FFFFFF}
.head-top .phone span {color: #666666}
.menu {margin: 0; padding: 0; display: flex; justify-content: flex-end}
.menu li {list-style-type: none; margin-left: 30px; text-transform: uppercase; font-size: 0.9rem; line-height: 1.4}
.menu li a {display: block; padding: 15px; text-decoration: none}
.menu li a:hover, .menu li.active a {color: #FFFFFF}
.menu li.with-submenu a {background: url("../images/arrow_down.png") right center no-repeat}

.slider {position: relative; z-index: 50}
.slider ul {margin: 0; padding: 0}
.slider ul li {list-style-type: none; position: relative; z-index: 50; width: 100%}
.slider ul li img {display: block; width: 100%}
.slider-cover {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url("../images/slider_cover.png") left top no-repeat; background-size: 100% 100%}
.slider-text {position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; color: #FFFFFF}
.slider-text a {color: #FFFFFF}
.slider-text-in {width: 96%; max-width: 1620px; margin: 0 auto; text-align: left}
.slider-text-in p {line-height: 1.3; font-weight: 800; font-size: 2.6rem; margin: 0 0 80px 0}
.slider-text-in p span {color: #C6312F}

.button {display: inline-block; text-decoration: none; line-height: 1.4; color: #FFFFFF; padding: 14px 40px; background-color: #C6312F; border-radius: 5px; font-weight: 600; transition: background 0.2s ease-out}
.button:hover {background-color: #E43A37}

.main {width: 96%; max-width: 1620px; margin: 0 auto; text-align: left; padding: 70px 0}
.news {display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center}
.news-slider-left, .news-slider-right {display: inline-block; width: 14px; height: 21px; flex: 0 0 auto}
.news-slider-left {float: left; background: url("../images/slider_left.png") left top no-repeat}
.news-slider-right {float: right; background: url("../images/slider_right.png") left top no-repeat}
.news-left {width: 400px; flex: 0 0 auto}
.news-left h2 {margin-bottom: 60px}
.news-left .button {padding: 14px 20px; box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 4px}
.news-slider {width: calc(100% - 420px); display: flex; align-items: center; justify-content: space-between}
.news-slider ul {width: calc(100% - 240px); margin: 0; padding: 0}
.news-slider ul li {list-style-type: none}
.news-slider ul li > a {display: flex; text-decoration: none; flex-wrap: wrap; align-items: flex-start}
.ns-image {width: 307px; margin-right: 45px; border: 1px solid #CCCCCC}
.ns-image img {width: 100%; display: block}
.ns-text {color: #737373; width: calc(100% - 354px)}
.ns-text:after {content: ""; display: block; clear: both}
.ns-text .ns-date {color: #3F3F3F; line-height: 1.3}
.ns-text p {line-height: 1.3}
.ns-text h3 {font-weight: 800; line-height: 1.3; color: #C6312F; margin: 0 0 12px 0; text-decoration: underline; font-size: 1.15rem}
.button-arrow {display: inline-block; padding-right: 25px; background: url("../images/arrow_right.png") right center no-repeat; text-decoration: none; color: #000000; text-transform: uppercase; line-height: 1.3; font-weight: 600; font-size: 1.05rem}
.ns-text .button-arrow {float: right}

ul.news-in { list-style-type: none}
ul.news-in li { display:flex; margin-bottom:2em;}
ul.news-in li .ns-text {display: inline-block;}

.grey {background-color: #F2F2F2}
.slogan {margin: 15px 0 85px 0; background-color: #FFFFFF; text-align: center; padding: 50px; font-weight: 900; font-size: 2.5rem; line-height: 1.3; color: #C6312F}
.slogan span {color: #000000}
.categories {display: flex; flex-wrap: wrap; align-items: stretch; padding-bottom: 30px}
.categories a {display: inline-block; text-decoration: none; width: calc(20% - 36px); margin: 0 45px 45px 0; background-color: #FFFFFF; box-shadow: rgba(0, 0, 0, 0.2) 3px 3px 4px}
.categories a:nth-child(5n) {margin-right: 0}
.cat-image {position: relative; z-index: 30; height: 0; padding-top: 75%}
.cat-image img {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: contain}
.cat-title {display: inline-block; color: #333333; padding: 14px 50px 14px 20px; background: url("../images/arrow_right.png") right 20px center no-repeat; font-weight: 600; line-height: 1.3; font-size: 1.1rem}
.center {text-align: center}
.categories a:hover {background-color: #C6312F; color: #FFFFFF}
.categories a:hover .cat-title {color: #FFFFFF; background-image: none}

.offer {background: url("../images/bg_offer.jpg") left center no-repeat; background-size: cover}
.offer-text {width: 96%; max-width: 1620px; margin: 0 auto; text-align: left; padding: 110px 0 150px 0; color: #FFFFFF; font-weight: 900; line-height: 1.3; font-size: 3.4rem}
.offer-text-in {max-width: 820px}
.offer-text a {color: #FFFFFF}
.offer-text p {line-height: 1.3; margin: 0}

.contact-us {margin: 0 auto; max-width: 820px; padding: 20px 0; display: flex; flex-wrap: wrap; align-items: center}
.contact-us-text {color: #999999; font-weight: 900; font-size: 2.2rem; line-height: 1.3; width: calc(100% - 180px)}
.contact-us-text span {display: block; color: #333333}

.footer {background-color: #1E1E1E; color: #CCCCCC; display: flex; flex-wrap: wrap; align-items: stretch}
.footer a {color: #CCCCCC}
.footer-left, .footer-right {width: 50%}
.footer-left {text-align: right}
.footer-right {background-color: #111111}
.footer-left-in, .footer-right-in {text-align: left; width: 810px; display: inline-block; box-sizing: border-box; padding: 70px 0 30px 0}
.footer-left-in {padding-right: 30px}
.footer h2 {font-size: 1.6rem; color: #FFFFFF; margin-bottom: 40px}
.footer-left p {font-size: 0.9rem; margin-bottom: 20px}
.footer-left p strong {display: block; color: #FFFFFF; font-size: 1rem}
.footer-left a {color: #FFFFFF}
.footer-left a.link-red {color: #C3302E}
.footer .phone, .footer .email {margin: 0 0 25px 10px; font-weight: 900; font-size: 1.4rem; line-height: 1.3; color: #FFFFFF; padding-left: 35px}
.footer .phone span {color: #666666}
.footer .phone {background: url("../images/ico_phone.png") left center no-repeat}
.footer .email {background: url("../images/ico_email.png") left center no-repeat}
.footer-right-in {display: flex; flex-wrap: wrap; padding-left: 35px}
.footer-col {width: 48%; max-width: 250px; margin-right: 2%; padding-bottom: 20px}
.footer ul {margin: 0; padding: 15px 0 0 0}
.footer ul li {line-height: 1.4; font-size: 1.1rem; font-weight: 600; padding-left: 20px; list-style-type: none; background: url("../images/list.png") left 10px no-repeat; margin-bottom: 12px}
.footer ul li a {text-decoration: none}
.footer ul li a:hover {color: #FFFFFF}


.subpage-h {background: url("../images/slider_image.jpg") center center no-repeat; background-size: cover; color: #FFFFFF}
.subpage-h a {color: #FFFFFF}
.subpage-h h1 {padding: 80px 50px; margin: 0; background-color: rgba(0, 0, 0, 0.3)}
.subpage-h .likeh1 {padding: 80px 50px; margin: 0; background-color: rgba(0, 0, 0, 0.3); font-weight: 700; line-height: 1.2; font-size: 5rem; margin: 0 0 25px 0; }
.likeh2 {font-weight: 900; line-height: 1.2; font-size: 3.2rem; margin: 0 0 25px 0; color: #C6312F}
h2.center {text-align: center; margin-bottom: 50px}
.likeh2.center {text-align: center; margin-bottom: 50px}
.detail {display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; padding-bottom: 20px}
.detail-image {background-color: #FFFFFF; display: flex; justify-content: center; align-items: center; width: 65.5%; padding: 20px; box-sizing: border-box; margin-bottom: 30px}
.detail-image img {max-width: 100%; margin: 0 auto; display: block}
.detail-text {width: 32%; background-color: #FFFFFF; box-sizing: border-box; padding: 25px 30px 5px 30px; text-align: left; margin-bottom: 30px}
.detail-text h2 {font-size: 1.2rem; line-height: 1.2; margin-bottom: 30px}
.detail-text ul {margin: 0; padding: 0}
.detail-text ul li {list-style-type: none; line-height: 1.5; margin-bottom: 25px}
.detail-infos {text-align: left}
.detail-infos-col {width: 49%}
.detail-infos ul {margin: 0; padding: 0}
.detail-infos ul li {list-style-type: none; line-height: 1.5; padding-left: 20px; background: url("../images/list2.png") left 8px no-repeat}
.categories.gallery {padding: 40px 0 0 0}
.categories.gallery a {box-shadow: none; border: 5px solid #FFFFFF; box-sizing: border-box}
.categories.gallery a:hover {border: 5px solid #D2232A}
.breadcrumb {
  background:#fff;
  margin-top:30px;
	display: inline-block;
  padding:10px 15px;
  line-height:1.5;
  text-align:left;
	box-sizing: border-box;
}

.breadcrumb ul  {
list-style: none;
  margin: 0; 
  padding: 0;
}

.breadcrumb ul li {
display: inline;
}

.breadcrumb ul li+li:before {
  padding: 8px;
  color: black;
  content: "/\00a0";
}


#formular-kontakt input, #formular-kontakt textarea {
  width:100%;
  padding:5px;
}

#formular-kontakt dd {
    display: block;
    margin-inline-start: 0px;
    margin-bottom:1em;
}

#formular-kontakt #error {
  color:Red;
  font-weight:bold;
}

#formular-kontakt #message {
  color:green;
  font-weight:bold;
}

.video {
  float:left;
  margin-right:2em;
}

.video h2 {
  font-size:1.5em;
}

.video-clear {
  clear:both;
}

.video2 {
  float:left;
  margin-right:2.8em;
  border: 5px solid #FFFFFF;
}

.video-clear {
  clear:both;
}



@media(max-width:1680px){
	.footer-left-in, .footer-right-in {width: 100%}
	.footer-left-in {padding-left: 4%}
}

@media(max-width:1580px){
	.news-left {width: 300px}
	.news-slider {width: calc(100% - 320px)}
	.news-slider ul {width: calc(100% - 140px)}
}

@media(max-width:1500px){
	.categories a, .categories a:nth-child(5n) {width: calc(25% - 30px); margin: 0 40px 40px 0}
	.categories a:nth-child(4n) {margin-right: 0}
}

@media(max-width:1460px){
	.menu li {margin-left: 0}
}

@media(max-width:1180px){
	.news-left, .news-slider {width: 100%}
	.news-left {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin-bottom: 40px}
	.news-left h2 {margin: 0}
	.slider-text-in p {font-size: 2rem; margin: 0 0 40px 0}
	.menu {display: none; position: absolute; right: 0; top: 47px; width: 200px; padding: 10px 0; background-color: #FFFFFF; border: 1px solid #111111}
  .menu li, .menu li:last-child {display: block; margin: 0}
  .menu li a, .menu li:last-child a, .menu > li:hover > a, .menu > li.active > a {display: block; padding: 10px 20px; color: #000000}
  .menu > li.with-submenu > a {background-image: none}
  .menu-whole {text-align: right; position: relative; z-index: 50; padding-top: 5px}
  .mobile-menu {display: inline-block; width: 42px; height: 35px; background: url("../images/mobile_menu.png") left top no-repeat}
}

@media(max-width:1100px){
	.categories a, .categories a:nth-child(4n), .categories a:nth-child(5n) {width: calc(33.3333% - 20px); margin: 0 30px 30px 0}
	.categories a:nth-child(3n) {margin-right: 0}
	.slogan {font-size: 2rem}
}

@media(max-width:1060px){
	.slider ul li {height: 530px; overflow: hidden; position: relative; z-index: 50}
  .slider ul li img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover}
	.offer-text {padding: 100px 0 100px 0; font-size: 2.8rem}
	.detail-image, .detail-text, .detail-infos-col {width: 100%}
  .detail-infos-col {margin-bottom: 30px}
}

@media(max-width:850px){
	.ns-image {width: 100%; max-width: 307px; margin: 0 auto 30px auto}
	.ns-text {width: 100%}
}

@media(max-width:800px){
	.categories a, .categories a:nth-child(3n), .categories a:nth-child(4n), .categories a:nth-child(5n) {width: calc(50% - 15px); margin: 0 30px 30px 0}
	.categories a:nth-child(2n) {margin-right: 0}
	.offer-text {padding: 60px 0; font-size: 2.2rem}
	.offer-text-in {max-width: 90%}
}

@media(max-width:780px){
	.footer-left, .footer-right {width: 100%}
	.footer-left-in, .footer-right-in {padding: 50px 2% 30px 2%}
	.contact-us {padding: 0}
	.contact-us-text {width: 100%; margin-bottom: 25px}
	.main {padding: 50px 0}
	.breadcrumb.main {padding: 10px 15px}
	.slogan {margin: 0 0 50px 0; padding: 20px; font-size: 1.7rem}
	.phone-text {display: none}
	.head {background-image: none}
	h2.center {margin-bottom: 30px}
	h1 {font-size: 3.5rem}
	.subpage-h h1 {padding: 50px 20px}
}

@media(max-width:580px){
	.main, .head-in, .slider-text-in, .offer-text {width: 92%}
	.footer-left-in, .footer-right-in {padding: 50px 4% 30px 4%}
	.footer-col {padding-bottom: 0}
	.footer ul {padding: 0}
	.contact-us-text {font-size: 1.6rem}
	.slogan {font-size: 1.3rem}
	.news-slider ul {width: calc(100% - 80px)}
	.news-left h2 {margin: 0 0 20px 0; width: 100%} 
	h2 {font-size: 2.7rem}
	.slider ul li {height: 400px}
	.slider-text-in p {font-size: 1.6rem; margin: 0 0 30px 0}
	.offer-text {padding: 50px 0; font-size: 1.8rem}
	.offer-text-in {max-width: 100%}
}

@media(max-width:560px){
	.categories a, .categories a:nth-child(3n), .categories a:nth-child(4n), .categories a:nth-child(5n) {width: 100%; margin: 0 0 30px 0}
	.categories a:nth-child(2n) {margin-right: 0}
	.categories {padding-bottom: 10px}
	.button {padding: 14px 20px}
	.logo {width: 150px; height: 45px; background-size: 100% auto}
	.menu-whole {padding: 2px 0 3px 0}
	.menu {top: 45px}
}

@media(max-width:420px){
	.head-top {font-size: 1rem; padding: 5px 0}
	.head-top .phone {margin: 0; padding: 0; background-image: none}
}

@media(max-width:400px){
	.footer-col {width: 100%; margin: 0 0 30px 0}
	.footer-right-in .footer-col:last-child {margin: 0}
}


@media(min-width:1181px){
	.menu {display: flex !important}
}



.poptavkalink {
  max-width:100%;
  background:#c72f2f;
  color:#fff;
  padding:12px;
  margin-bottom:20px;
  text-align:center;
}
.poptavkalink a {
  background:#930d0d;
  border-radius:3px;
  text-align:center;
  padding:10px;
  font-weight:bold;
  margin-left:20px;
  padding-left:20px;
  padding-right:20px;
  color:#fff;
  text-decoration:none;
  display:inline-block;
}

.poptavkalink a:hover {
  text-decoration:underline;
  background:#6c0000
}