html {font-family: 'Nunito Sans', sans-serif; font-weight: 400; font-size: 16px; color: #333333}
body {margin: 0; padding: 0; text-align: center}
a {color: #C6312F}
a:hover {text-decoration: none}
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: 900; line-height: 1.2; font-size: 3.3rem; margin: 0 0 30px 0}
h2 {font-weight: 900; line-height: 1.2; font-size: 2.4rem; margin: 0 0 30px 0; color: #C6312F}
h3 {font-size: 1.5rem; font-weight: 900}



.head {background-color: #FFFFFF; position: relative; z-index: 100}
.head a {color: #333333}
.head-in {width: 96%; max-width: 1180px; margin: 0 auto; text-align: left; display: flex; justify-content: space-between; align-items: center; padding: 16px 0}
.logo {display: inline-block; background: url("../images/logo.jpg") left top no-repeat; width: 225px; height: 70px; flex: 0 0 auto; background-size: 100% auto}
.menu {margin: 0; padding: 0; display: flex; justify-content: flex-end}
.menu li {list-style-type: none; text-transform: uppercase; font-size: 0.85rem; line-height: 1.3; font-weight: 600; border-right: 2px dotted #E0E0E0}
.menu li:last-child {border: none}
.menu li a {display: block; margin: 0 11px; padding-top: 3px; text-decoration: none; text-align: center; border-bottom: 3px solid #FFFFFF}
.menu li a:hover, .menu li.active a {border-bottom: 3px solid #C6312F}
.menu li.with-submenu a {background: url("../images/arrow_down.png") right center no-repeat}

.menu-in {width: 96%; max-width: 1220px; margin: 0 auto; text-align: left}
.menu-whole2 {background-color: #C6302F; box-shadow: rgba(0, 0, 0, 0.2) 3px 3px 3px; position: relative; z-index: 90}
.menu2 {margin: 0; padding: 0; display: flex}
.menu2 li {list-style-type: none; font-size: 0.85rem; line-height: 1.3; font-weight: 600; border-right: 1px solid #990000}
.menu2 li:last-child {border: none}
.menu2 li a {display: block; padding: 18px 20px; color: #FFFFFF; text-decoration: none; transition: all 0.2s ease-out; letter-spacing: 0}
.menu2 li a:hover, .menu2 li.active a {background-color: #FFFFFF; color: #C6302F}
.mobile-menu2 {display: none}

.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-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: 1180px; margin: 0 auto; text-align: left}
@keyframes popin {
	from {opacity: 0; transform: scale(0)}
  to {opacity: 1; transform: scale(1)}
}
.slider-text-in h2 {text-transform: uppercase; color: #333333; font-size: 3.2rem}
.slider-text-in h2 span {color: #C6312F}
.slider-text-in p {color: #333333; font-weight: 600; font-size: 1.8rem; margin: 0 0 40px 0}
.slider-text-width {max-width: 600px; animation: popin .5s ease-in-out .4s forwards; opacity: 0}

.pozadi {background-color: rgba(255, 255, 255, 0.4); padding:2em;}

.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 !important; transition: background 0.2s ease-out}
.button:hover {background-color: #E43A37}

.main {width: 96%; max-width: 1180px; margin: 0 auto; text-align: left; padding: 70px 0}
.main a {font-weight: 800}
.news-whole h2 {text-align: center; font-size: 3.2rem}
.news {display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; max-width: 920px; margin: 0 auto}
.news > a {display: flex; text-decoration: none; flex-wrap: wrap; align-items: flex-start; margin-bottom: 65px; font-weight: 400; width: 100%}
.ns-image {width: 307px; margin-right: 45px; border: 1px solid #CCCCCC; max-height:200px; overflow:hidden; background:#fff;}
.ns-image:hover {border: 1px solid #D2232A}
.ns-image img {/*width: 100%; */display: block; max-height:200px; margin:0 auto}
.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}
.ns-text h3:hover {text-decoration: none}
.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}
.button-arrow:hover {text-decoration: underline}
.ns-text .button-arrow {float: right}

.fotogalerie-news { float:right; margin-left:1em;}
.fotogalerie-news a {display: inline-block; border: 1px solid #CCCCCC; padding: 10px 20px}
.fotogalerie-news a:hover {border: 1px solid #D2232A}

.grey {background-color: #F2F2F2}
.grey.white {background-color: #FFFFFF}
.slogan {max-width: 700px; margin: 0 auto; padding-bottom: 90px; text-align: center}
.slogan h2 {font-weight: 600; color: #666666; font-size: 2.8rem; margin-bottom: 20px}
.slogan h2 span {font-weight: 900; color: #C6312F; font-size: 3.2rem}
.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: cover}
.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}

.main .offer {margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start}
.main .offer li {width: 140px; flex: 0 0 auto; list-style-type: none; margin: 0 3px 35px 3px; text-align: center; line-height: 1.3; background-image: none; padding: 0}
.offer li a {text-decoration: none; font-weight: 400}
.offer li a:hover {text-decoration: underline}
.offer-image {display: block; margin: 0 auto 15px auto; width: 100px; height: 120px; box-sizing: border-box; background-color: #FFFFFF; border-radius: 5px; border: 1px solid #666666; overflow: hidden; position: relative; z-index: 30}
.offer-image:hover {border: 1px solid #D2232A}
.offer-image img {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 5px}

.contact-us {margin: 0 auto; 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% - 550px)}
.contact-us-text span {display: block; color: #333333}
.contact-us form {margin: 0 0 0 20px; width: 530px}
.contact-us form input[type=text] {background-color: #C0C1C1; border: none; border-radius: 5px; width: 310px; margin-right: 35px; height: 50px; box-sizing: border-box; padding: 10px; text-align: center; color: #FFFFFF; font-size: 1rem; font-weight: 600; font-family: 'Nunito Sans', sans-serif}
.contact-us form input[type=text]::-webkit-input-placeholder {color: #FFFFFF !important}
.contact-us form input[type=text]:-moz-placeholder {color: #FFFFFF !important; opacity:  1}
.contact-us form input[type=text]::-moz-placeholder {color: #FFFFFF !important; opacity:  1}
.contact-us form input[type=text]:-ms-input-placeholder {color: #FFFFFF !important}
.contact-us form input[type=submit] {width: 175px; border: none; color: #FFFFFF; height: 50px; background-color: #C6312F; cursor: pointer; border-radius: 5px; font-weight: 600; font-family: 'Nunito Sans', sans-serif; font-size: 1rem; transition: background 0.2s ease-out}
.contact-us form input[type=submit]:hover {background-color: #E43A37}

.footer {background-color: #bbb; color: #000; display: flex; flex-wrap: wrap; align-items: stretch}
.footer a {color: #CCCCCC}
.footer .footer-right a { color:#1e1e1e}
.footer-left, .footer-right {width: 50%}
.footer-left {text-align: right}
.footer-right {background-color: #C0C1C1}
.footer-left-in, .footer-right-in {text-align: left; width: 590px; display: inline-block; box-sizing: border-box; padding: 70px 0 30px 0}
.footer-left-in {padding-right: 30px}
.footer h2 {font-size: 2.5rem; /*color: #FFFFFF; */ margin-bottom: 25px}
.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}


.main.subpage-top, .main.main2 {padding: 35px 0 20px 0}
.navigation {margin-bottom: 50px; line-height: 1.5; font-size: 0.9rem}
.detail-top .navigation {margin-bottom: 15px}
.navigation a {text-decoration: none; vertical-align: middle; font-weight: 400}
.navigation span {vertical-align: middle}
.navigation a:hover {text-decoration: underline}
.navigation a:after {content: ""; display: inline-block; vertical-align: middle; width: 6px; height: 16px; margin: 0 9px 0 14px; background: url("../images/nav_sep.png") center center no-repeat}
.login { position:absolute; right:30px; top:20px; width:32px; height:32px; text-align:Center; padding:10px;}
.login:hover { background:#eee; border-radius:32px; }
.search-h:after {content: ""; display: block; clear: both}
.search {float: right; width: 360px; height: 50px; margin: 10px 0 0 20px}
.search2 {float: unset}
.search div {display: flex}
.search input[type=text] {width: calc(100% - 120px); box-sizing: border-box; height: 50px; padding: 10px 5%; border: 1px solid #CCCCCC; border-right: none; border-top-left-radius: 5px; border-bottom-left-radius: 5px; font-size: 1rem; color: #666666; font-weight: 600; font-family: 'Nunito Sans', sans-serif}
.search input[type=text]::-webkit-input-placeholder {color: #666666 !important}
.search input[type=text]:-moz-placeholder {color: #666666 !important; opacity:  1}
.search input[type=text]::-moz-placeholder {color: #666666 !important; opacity:  1}
.search input[type=text]:-ms-input-placeholder {color: #666666 !important}
.search input[type=submit] {width: 120px; border: none; color: #FFFFFF; height: 50px; background-color: #C6312F; cursor: pointer; border-top-right-radius: 5px; border-bottom-right-radius: 5px; font-weight: 600; font-family: 'Nunito Sans', sans-serif; font-size: 1rem; transition: background 0.2s ease-out}
.search input[type=submit]:hover {background-color: #E43A37}
.search-h h1 {margin: 0}
.cols {display: flex; flex-wrap: wrap; align-items: flex-start}
.colleft {width: 270px; margin-right: 30px; flex: 0 0 auto}
.colright {width: calc(100% - 300px)}
.main .menu-left {margin: 0 0 30px 0; padding: 30px 20px 20px 20px; background-color: #FFFFFF}
.main .menu-left li {list-style-type: none; line-height: 1.4; font-size: 1.1rem; background-image: none; padding: 0; margin: 0}
.menu-left li a {color: #333333; text-decoration: none; font-weight: 400}
.menu-left li a:hover {text-decoration: underline; color: #C6312F}
.menu-left li.active > a {color: #C6312F; font-weight: 900}
.menu-left li ul {padding: 5px 0 5px 20px; margin: 0}
.product-list a {background-color: #FFFFFF; display: flex; flex-wrap: wrap; align-items: flex-start; margin-bottom: 30px; text-decoration: none; padding: 25px; font-weight: 400}
.product-image {width: 218px; box-sizing: border-box; margin-right: 25px; border: 1px solid #CCCCCC; text-align: center; padding: 10px; flex: 0 0 auto; height: 205px}
.product-image:hover {border: 1px solid #D2232A}
.product-image img {display: block; margin: 0 auto; max-width: 100%; max-height: 100% !important}
.product-text {width: calc(100% - 243px); color: #666666}
.product-text h2 {text-align: left; font-weight: 900; line-height: 1.3; color: #C6312F; margin: 0 0 12px 0; text-decoration: underline; font-size: 1.1rem; text-transform: uppercase}
.product-text h2:hover {text-decoration: none}
.product-text p {margin-bottom: 20px}
.product-text .perex, .detail-text .perex {font-weight: 900; color: #333333; font-size: 1.1rem}
.product-text .button-arrow {margin-top: 10px}

h2.center {text-align: center; margin-bottom: 50px}
.detail-grey .main {padding: 40px 0}
.detail {background-color: #FFFFFF; padding: 25px 25px 40px 25px}
.detail-in {display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; padding-bottom: 50px}
.detail-image {background-color: #FFFFFF; display: flex; justify-content: center; align-items: center; box-sizing: border-box; width: 45%; padding: 20px; box-sizing: border-box; margin-bottom: 40px; border: 1px solid #CCCCCC}
.detail-image img {max-width: 100%; margin: 0 auto; display: block}
.detail-text {width: 52%; background-color: #FFFFFF; text-align: left; margin-bottom: 40px}
.detail-text h2 {font-size: 1.2rem; line-height: 1.2; margin-bottom: 30px}
.detail-text .perex {font-weight: 900}
.detail-text h3 {font-weight: 900; line-height: 1.2; font-size: 1.2rem; margin: 0 0 30px 0; color: #C6312F}
.detail-text p {margin-bottom: 25px}
.detail-text ul, .main ul {margin: 0; padding: 0 0 30px 0}
.detail-text ul li, .main ul li {list-style-type: none; line-height: 1.5; margin-bottom: 5px; padding-left: 15px; background: url("../images/list3.png") left 10px no-repeat}
.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}
.download {line-height: 1.5}
.download span, .download a {display: inline-block; vertical-align: top; text-decoration: none}
.download .d-title {width: 300px; text-decoration: underline}
.download .d-title:hover {text-decoration: none}
.download .d-file {color: #333333}
.download .d-file.pdf {padding-left: 25px; background: url("../images/ico_pdf.png") left center no-repeat}
.categories.gallery {padding: 40px 0 0 0}
.categories.gallery a, .categories.gallery a:nth-child(5n) {box-shadow: none; border: 5px solid #FFFFFF; box-sizing: border-box; width: calc(25% - 25px); margin: 0 30px 30px 0}
.categories.gallery a:nth-child(4n) {margin-right: 0}
.categories.gallery a:hover {border: 5px solid #D2232A}

#formular-kontakt input, #formular-kontakt textarea {
	width: 450px;
  max-width:100%;
  padding:10px 15px;
	box-sizing: border-box; height: 40px; padding: 10px 15px; border: 1px solid #CCCCCC; border-radius: 5px; font-size: 1rem; color: #666666; font-weight: 600; font-family: 'Nunito Sans', sans-serif
}

#formular-kontakt textarea {
	height: 150px
}

#formular-kontakt dt {
	display: block;
	margin-bottom: 5px
}

#formular-kontakt dd {
    display: block;
    margin-inline-start: 0px;
    margin-bottom:30px;
}

#formular-kontakt #error {
  color:Red;
  font-weight:bold;
}

#error {
  color:Red;
  font-weight:bold;
}

.price {
  font-size:24px;
  margin-bottom:20px;
  
}
.price strong {
 color:#C6312F;
}

#formular-kontakt #message {
  color:green;
  font-weight:bold;
}

#formular-kontakt button {
	border: none;
	font-size: 1rem; font-weight: 600; font-family: 'Nunito Sans', sans-serif; cursor: pointer
}


/* vega */
.grey.darker {background-color: #E8E8E8}
.main.liquids {padding: 0 0 1px 0; max-width: 1300px; width: calc(100% - 100px)}
.liquids-bg1 {background-image: linear-gradient(to bottom,#f1f4f7 0%,#c3cbd2 100%); padding: 60px 20px 80px 20px; display: flex; flex-wrap: wrap; box-sizing: border-box; position: relative; z-index: 30}
.liquids-bg1.margin {margin-bottom: 80px}
.liquids-bg1.margin:after, .liquids-bg2:after {display: block; content: ""; position: absolute; left: 0; bottom: -30px; width: 100%; height: 30px; background: url("../images/vega/shadow.png") center top no-repeat; background-size: 100% auto}
.lb1-left {padding: 0 15px; box-sizing: border-box; width: 50%; text-align: center}
.lb1-left img {max-height: 600px; max-width: 80%}
.lb1-right {padding: 0 15px; box-sizing: border-box; width: 50%; max-width: 500px}
.lb1-right h2, .lb2-col2 h2, .applications h2 {text-align: left; font-weight: 600; color: #333333; font-size: 1.8rem; margin-bottom: 20px}
.lb1-right h3 {font-weight: 600; font-size: 1.3rem; line-height: 1.3; margin: 0 0 20px 0}
.lb1-right p, .lb2-col2 p {margin-bottom: 20px}
.lb1-right ul {margin: 0 0 20px 0; padding: 0 0 0 40px}
.lb1-right ul li {line-height: 1.5}
.lb1-right h4 {font-size: 1rem; line-height: 1.4; margin: 0 0 20px 0}
.lb1-right p strong {font-weight: 600}
.liquids-bg2 {padding: 45px 0 0 0; background-color: #434c52; color: #FFFFFF; margin-bottom: 80px; position: relative; z-index: 30}
.liquids-bg2 a {color: #FFFFFF}
.liquids-bg2-cols {display: flex; flex-wrap: wrap; padding: 0 20px 40px 20px}
.lb2-col1 {padding: 0 15px; box-sizing: border-box; width: 33.3333%; text-align: center}
.lb2-col1 img, .lb2-col3 img {max-height: 350px; max-width: 80%; margin-bottom: 40px}
.lb2-col2 {padding: 0 15px; box-sizing: border-box; width: 41.6666%}
.lb2-col3 {padding: 0 15px; box-sizing: border-box; width: 25%; text-align: center}
.img-desc {font-style: italic; opacity: 0.8; max-width: 90%; margin: 0 auto}
.lb2-col1 .img-desc {color: #999999}
.lb2-col2 h2 {color: #FFFFFF}
.lb2-col2 h3 {font-weight: 400; font-size: 1.1rem; line-height: 1.3; margin: 0 0 20px 0}
.lb2-col2 ul {margin: 0; padding: 0}
.lb2-col2 ul li {list-style-type: none; margin-bottom: 10px; line-height: 1.3; padding-left: 15px; background: url("../images/vega/list.png") left 7px no-repeat}
.applications {padding: 25px 35px 40px 35px; background-color: #57616B}
.applications h2 {color: #FFFFFF; margin-bottom: 30px; font-size: 1.7rem}
.app-block-whole {margin-bottom: 10px}
.app-link {margin: 0; font-size: 1.2rem; font-weight: 400; line-height: 1.3}
.app-link a {display: block; padding: 11px 10px 10px 45px; text-decoration: none; background: #4E5760 url("../images/vega/plus.png") 10px 11px no-repeat; transition: all 0.2s ease-out}
.app-link a:hover {background-color: rgba(0,0,0,0.2)}
.app-link.active a {background: rgba(0,0,0,0.2) url("../images/vega/minus.png") 10px 11px no-repeat}
.app-block {padding: 15px 0 10px 0; background-color: rgba(0,0,0,0.1); box-sizing: border-box; display: none}
.app-block-in {display: flex; flex-wrap: wrap}
.app-col1, .app-col2, .app-col3 {padding: 0 15px; box-sizing: border-box; width: 33.3333%}
.app-col2 {text-align: center}
.app-col2 img {max-width: 100%; margin-top: 20px}
.app-block p {font-size: 0.9rem; margin: 0 0 20px 0}
.app-block h4 {font-size: 1.2rem; margin: 0 0 10px 0; line-height: 1.3; font-weight: 400}
.app-block h5 {font-size: 0.9rem; margin: 0 0 5px 0; line-height: 1.3; font-weight: 700}
.app-block .app-col3 p {margin-bottom: 10px}
.vega-video {position: relative; z-index: 1; max-width: 500px; overflow: hidden; padding: 0; margin-bottom: 15px}
.vega-video video {display: block; margin: 0; padding: 0; width: 100%}
.vega-video .video-play-overlay {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: url('../images/vega/video-play-overlay.png'); background-repeat: no-repeat; background-size: contain; opacity: .9; transition: all 200ms; z-index: 3; transform: scale3d(1, 1, 1);}
#leftNav {position: fixed; top: 50%; margin: 0; padding: 0; margin-left: -40px; width: 120px; margin-top: -35px}
#leftNav li {width: 20px; height: 20px; box-sizing: border-box;	list-style-type: none; margin-bottom: 5px; border-radius: 50%; padding: 0; background-image: none}
#leftNav li a {display: block; width: 20px; height: 20px; box-sizing: border-box; border: 4px solid #bbb; border-radius: 50%}
#leftNav li a:hover {background-color: #FFFFFF}
#leftNav li a.active {background-color: #FDFADA; border-color: #FFEB00}
.button-how {display: inline-block; background-color: #1678C3; color: #FFFFFF; padding: 8px 12px; text-decoration: none; border-radius: 2px; line-height: 1.3; transition: all 0.2s ease-out}
.button-how:hover {background-color: #1267a8}
.arrow-down {position: absolute;
bottom: 0;
left: 50%;
margin-left: -20px;
width: 60px;
height: 60px;
background-size: 30px;
animation-name: bounce;
animation-duration: 3s;
animation-iteration-count: infinite;
cursor: pointer;
background-position: center;
background-repeat: no-repeat;
background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0yOTMuNzUxLDQ1NS44NjhjLTIwLjE4MSwyMC4xNzktNTMuMTY1LDE5LjkxMy03My42NzMtMC41OTVsMCwwYy0yMC41MDgtMjAuNTA4LTIwLjc3My01My40OTMtMC41OTQtNzMuNjcyICBsMTg5Ljk5OS0xOTBjMjAuMTc4LTIwLjE3OCw1My4xNjQtMTkuOTEzLDczLjY3MiwwLjU5NWwwLDBjMjAuNTA4LDIwLjUwOSwyMC43NzIsNTMuNDkyLDAuNTk1LDczLjY3MUwyOTMuNzUxLDQ1NS44Njh6Ii8+DQo8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMjIwLjI0OSw0NTUuODY4YzIwLjE4LDIwLjE3OSw1My4xNjQsMTkuOTEzLDczLjY3Mi0wLjU5NWwwLDBjMjAuNTA5LTIwLjUwOCwyMC43NzQtNTMuNDkzLDAuNTk2LTczLjY3MiAgbC0xOTAtMTkwYy0yMC4xNzgtMjAuMTc4LTUzLjE2NC0xOS45MTMtNzMuNjcxLDAuNTk1bDAsMGMtMjAuNTA4LDIwLjUwOS0yMC43NzIsNTMuNDkyLTAuNTk1LDczLjY3MUwyMjAuMjQ5LDQ1NS44Njh6Ii8+DQo8L3N2Zz4=);
}

@-webkit-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
	40% {
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
}
	60% {
    -moz-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
}
}

@keyframes bounce { 
	0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
	40% {
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
}
	60% {
    -moz-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
}
}



@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){
	.slider-text-in h2 {font-size: 2.4rem}
	.slider-text-in p {font-size: 1.5rem}
}

@media(max-width:1460px){
	.menu li {margin-left: 0}
}

@media(max-width:1300px){
	.menu-whole2 .menu-in {text-align: center}
	.menu2 {display: none; position: absolute; left: 0; top: 62px; width: 100%; text-align: center; background-color: #C6302F; border-top: 1px solid #990000; box-sizing: border-box; padding: 10px; box-shadow: rgba(0, 0, 0, 0.2) 3px 3px 3px}
	.menu2 li {border: none; font-size: 1rem}
	.mobile-menu2 {display: inline-block; color: #FFFFFF; font-weight: 700; padding: 15px 55px 15px 0; background: url("../images/mobile_menu2.png") right center no-repeat; text-decoration: none; font-size: 1.5rem}
}

@media(max-width:1250px){
  .slider-text-in h2 {font-size: 1.8rem}
	.slider-text-in p {font-size: 1.1rem}
	.slider-text-in {max-width: 400px; margin: 0 0 0 2%}
}

@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}
	.menu {display: none; position: absolute; right: 0; top: 47px; width: 250px; 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}
	.contact-us {padding: 0}
	.contact-us-text {width: 100%; margin-bottom: 25px}
	.contact-us form {margin-left: 0}
  .login { right:60px; top:-4px;}
}

@media(max-width:1100px){
	.categories.gallery a, .categories.gallery a:nth-child(4n), .categories.gallery a:nth-child(5n) {width: calc(33.3333% - 20px); margin: 0 30px 30px 0}
	.categories.gallery a:nth-child(3n) {margin-right: 0}
}

@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}
	.footer h2 {font-size: 2rem}
	.colleft {width: 100%; margin: 0 0 10px 0}
	.colright {width: 100%}
}

@media(max-width:850px){
	.ns-image {width: 100%; max-width: 307px; margin: 0 auto 30px auto}
	.ns-text {width: 100%}
	.news > a {margin-bottom: 50px}
	.news > a:last-child {margin: 0}
	.navigation {margin-bottom: 25px}
	.search-h h1 {clear: both}
	.search-h .search {margin: 0 0 20px 0}
}

@media(max-width:800px){
	.categories.gallery a, .categories.gallery a:nth-child(3n), .categories.gallery a:nth-child(4n), .categories.gallery a:nth-child(5n) {width: calc(50% - 15px); margin: 0 30px 30px 0}
	.categories.gallery a:nth-child(2n) {margin-right: 0}
	.offer-text {padding: 60px 0; font-size: 2.2rem}
	.offer-text-in {max-width: 90%}
	.lb1-left, .lb1-right, .lb2-col1, .lb2-col2, .lb2-col3, .app-col1 {width: 100%; max-width: none}
	.lb1-left, .lb2-col1, .lb2-col2, .app-col1 {margin-bottom: 20px}
	.liquids-bg1 {padding-top: 50px}
	.app-col2, .app-col3 {width: 50%}
	#leftNav, .arrow-down {display: none}
	.main.liquids {width: 100%}
	.liquids-bg1 {padding: 60px 0 15px 0}
	.lb1-right h2, .lb2-col2 h2, .applications h2 {font-size: 1.6rem}
	.lb1-right h3 {font-size: 1.2rem}
	.liquids-bg2-cols {padding: 0 0 30px 0}
	.applications {padding: 20px 15px 30px 15px}
}

@media(max-width:780px){
	.footer-left, .footer-right {width: 100%}
	.footer-left-in, .footer-right-in {padding: 50px 2% 30px 2%}
	.main {padding: 50px 0}
	.breadcrumb.main {padding: 10px 15px}
	.phone-text {display: none}
	.head {background-image: none}
	h2.center {margin-bottom: 30px}
	h1 {font-size: 3.5rem}
	.subpage-h h1 {padding: 50px 20px}
	.slogan {padding-bottom: 40px}
	.slogan h2, .slogan h2 span {font-size: 2rem}
	.slider-text-in p {text-shadow: rgba(255, 255, 255, 1) 0 0 4px}
}

@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}
	.contact-us form input[type=text] {margin-right: 20px; width: calc(100% - 145px)}
	.contact-us form input[type=submit] {width: 120px}
	.news-slider ul {width: calc(100% - 80px)}
	.news-left h2 {margin: 0 0 20px 0; width: 100%} 
	h1, .news-whole h2 {font-size: 2.7rem}
	.slider ul li {height: 450px}
	.slider-text-in h2 {font-size: 1.4rem}
	.slider-text-in p {font-size: 1rem}
	.offer-text {padding: 50px 0; font-size: 1.8rem}
	.offer-text-in {max-width: 100%}
	.offer li {width: 120px}
	.slider-text-in {margin: 0 4%}
	.product-image {margin: 0 auto 25px auto}
	.product-text {width: 100%}
	.app-col2, .app-col3 {width: 100%}
	.app-col2 {margin-bottom: 30px}
	.app-col2 img {margin: 0}
}

@media(max-width:560px){
	.categories.gallery a, .categories.gallery a:nth-child(3n), .categories.gallery a:nth-child(4n), .categories.gallery a:nth-child(5n) {width: 100%; margin: 0 0 30px 0}
	.categories.gallery a:nth-child(2n) {margin-right: 0}
	.categories.gallery {padding-bottom: 10px}
	.button {padding: 14px 20px}
	.menu-whole {padding: 2px 0 3px 0}
	.menu {top: 45px}
	.slogan {padding-bottom: 20px}
	.slogan h2, .slogan h2 span {font-size: 1.7rem}
}

@media(max-width:420px){
	.head-top {font-size: 1rem; padding: 5px 0}
	.head-top .phone {margin: 0; padding: 0; background-image: none}
	.search {width: 100%}
	.fotogalerie-news {float: none; margin: 0 0 30px 0}
}

@media(max-width:400px){
	.footer-col {width: 100%; margin: 0 0 30px 0}
	.footer-right-in .footer-col:last-child {margin: 0}
	.contact-us form input[type=text] {width: 100%; margin: 0 0 15px 0}
	.contact-us form input[type=submit] {display: block; margin: 0 auto}
}


@media(min-width:1301px){
	.menu2 {display: flex !important}
}

@media(min-width:1181px){
	.menu {display: flex !important}
}

