@import url('https://fonts.googleapis.com/css?family=Roboto');
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit;	margin: 0; outline: 0; padding: 0; vertical-align: baseline;}
html {overflow-y: scroll;}
body {font-family:"Roboto", Arial; line-height:1.5; font-size:16px; background-color:#fdfdfd; min-width: 320px;}
article, aside, details, figcaption, figure, footer, header, main, nav, section {display: block;}
ol,ul {list-style: none;}
table {border-collapse: separate;border-spacing: 0;}
caption, th,td {font-weight: normal; text-align: left;}
a {text-decoration: none;}
a:hover, a:active {outline: 0;}
input:hover, input:active {outline: 0;}
input::-moz-focus-inner {  border: 0;  }
a img {border: 0;}
em {font-style: italic;}
sub, sup {font-size: 60%;line-height: 0;position: relative;vertical-align: baseline;}
sup {top: -0.5em;}
sub { bottom: -0.25em;}
strong {font-weight:bold;}
h2 {padding-bottom: 20px;}
h3 {padding-bottom: 20px;}
i {font-style: italic;}
* {box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.div {display:block; float:left; width:100%;}
.padding10 {padding:10px;}
.padding20 {padding:20px;}
.ml0 {margin-left: 0px;}
.ml10 {margin-left:10px;}
.ml20 {margin-left:20px;}
.ml30 {margin-left:30px;}
.ml40 {margin-left:40px;}
.ml50 {margin-left:50px;}
.ml60 {margin-left:60px;}
.ml70 {margin-left:70px;}
.ml80 {margin-left:80px;}
.ml90 {margin-left:90px;}
.ml100 {margin-left:100px;}
.mr0 {margin-right: 0px;}
.mr10 {margin-right:10px;}
.mr20 {margin-right:20px;}
.mr30 {margin-right:30px;}
.mr40 {margin-right:40px;}
.mr50 {margin-right:50px;}
.mr60 {margin-right:60px;}
.mr70 {margin-right:70px;}
.mr80 {margin-right:80px;}
.mr90 {margin-right:90px;}
.mr100 {margin-right:100px;}
.mb0 {margin-bottom: 0px;}
.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb60 {margin-bottom:60px;}
.mb70 {margin-bottom:70px;}
.mb80 {margin-bottom:80px;}
.mb90 {margin-bottom:90px;}
.mb100 {margin-bottom:100px;}
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}
.mt60 {margin-top:60px;}
.mt70 {margin-top:70px;}
.mt80 {margin-top:80px;}
.mt90 {margin-top:90px;}
.mt100 {margin-top:100px;}
.pl0 {padding-left: 0px;}
.pl10 {padding-left:10px;}
.pl20 {padding-left:20px;}
.pl30 {padding-left:30px;}
.pl40 {padding-left:40px;}
.pl50 {padding-left:50px;}
.pl60 {padding-left:60px;}
.pl70 {padding-left:70px;}
.pl80 {padding-left:80px;}
.pl90 {padding-left:90px;}
.pl100 {padding-left:100px;}
.pr0 {padding-right: 0px;}
.pr10 {padding-right:10px;}
.pr20 {padding-right:20px;}
.pr30 {padding-right:30px;}
.pr40 {padding-right:40px;}
.pr50 {padding-right:50px;}
.pr60 {padding-right:60px;}
.pr70 {padding-right:70px;}
.pr80 {padding-right:80px;}
.pr90 {padding-right:90px;}
.pr100 {padding-right:100px;}
.pb0 {padding-bottom: 0px;}
.pb10 {padding-bottom:10px;}
.pb20 {padding-bottom:20px;}
.pb30 {padding-bottom:30px;}
.pb40 {padding-bottom:40px;}
.pb50 {padding-bottom:50px;}
.pb60 {padding-bottom:60px;}
.pb70 {padding-bottom:70px;}
.pb80 {padding-bottom:80px;}
.pb90 {padding-bottom:90px;}
.pb100 {padding-bottom:100px;}
.pt10 {padding-top:10px;}
.pt20 {padding-top:20px;}
.pt30 {padding-top:30px;}
.pt40 {padding-top:40px;}
.pt50 {padding-top:50px;}
.pt60 {padding-top:60px;}
.pt70 {padding-top:70px;}
.pt80 {padding-top:80px;}
.pt90 {padding-top:90px;}
.pt100 {padding-top:100px;}
.clearfix:after {content:" ";visibility:hidden;display:block;height:0;clear:both;font-size:0;clear:both;}
.fl{float:left;}
.fr{float:right;}
.w5{width:5%;}
.w10{width:10%;}
.w15{width:15%;}
.w20{width:20%;}
.w25{width:25%;}
.w30{width:30%;}
.w33{width:33.33%;}
.w35{width:35%;}
.w40{width:40%;}
.w45{width:45%;}
.w50{width:50%;}
.w55{width:55%;}
.w60{width:60%;}
.w65{width:65%;}
.w66{width:66.66%;}
.w70{width:70%;}
.w75{width:75%;}
.w80{width:80%;}
.w85{width:85%;}
.w90{width:90%;}
.w95{width:95%;}
.w100{width:100%;}
.wa {width:auto;}
.textaligncenter {text-align:center;}
.textalignright {text-align:right;}
.textalignleft {text-align:left;}
.posrel {position: relative;}
.backgroundCover {background-size: cover;}
.wrap {display:block; float:none; width:100%; max-width:1200px; margin:0 auto;}
.hidden {display: none;}
.overflowHidden {overflow: hidden;}
.site-header {background-color:#ffffff; padding:20px 0px;}
.transition {-webkit-transition: all 250ms ease; -moz-transition: all 250ms ease; -o-transition: all 250ms ease; -ms-transition: all 250ms ease; transition: all 250ms ease;}
.headerWrapper {background-color: #f5f5f5; padding:20px;}
.langWrapper {position: relative; height: 100%;}
.langWrapper .langLink {display: inline-block; float: left; opacity: 0.5;}
.langWrapper .langLink:hover {opacity: 0.7;}
.langWrapper .langLink.active, .langWrapper .langLink:hover.active {opacity: 1;}
.footerWrapper {background-color: #24272e; padding:5px 0px; text-align: center; color: #c2c2c1; font-size: 14px;}
main.home .homeSeparator {left: 50%; height: 100%; width: 10px; margin-left: -5px; background-color: #f5f5f5; position: absolute;}
.circleBox {display: inline-block; float: none; padding:10px 20px; border-radius: 8px;}
.circleBox h3 {color: #ed1c24; font-size: 30px; padding-bottom: 40px; line-height: 1.5;}
.circleBox .circleWrapper {display: inline-block; width: 370px; height: 370px; border:2px solid #a1a1a1; border-radius: 200px; background-color: #fff; box-shadow: 0px 9px 14px #ccc; overflow: hidden; position: relative;}
.circleBox .circleWrapper .image {position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; background-size: cover; background-position: center;}
.circleBox:hover {background-color: #f5f5f5;}
.circleBox:hover .circleWrapper .image {transform: scale(0.9);}
.breadcrumbs {position: relative; float: left; width: 100%; padding:5px 10px; font-size: 13px; color: #aaa; background-color: #f5f5f5;}
.breadcrumbs a {color: #848484;}
.breadcrumbs a:hover {color: #4e94ce;}
.bodyWrapper img {max-width: 100%;}
main.home .bodyWrapper .w50 {height: 100%;}
main.dosingMachines .bodyWrapper .w25 {height: 100%;}
main.dosingMachines .bodyWrapper .w25 {border-right: 5px solid #f5f5f5;}
main.dosingMachines .bodyWrapper .w25 {border-left: 5px solid #f5f5f5;}
main.preCalcSelect .bodyWrapper h2 {font-size: 20px;}
.button {color: #fff; background-color: #4e94ce; border:1px solid #4e94ce; padding:10px 70px; display: inline-block;}
.button:hover {background-color: transparent; color: #4e94ce; padding: 8px 65px;}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
/* Firefox */
input[type=number] { -moz-appearance: textfield; }
.form { width: 100%; max-width: 1140px; display: inline-block; float: none; color: #666;}
.form .imgWrapper {text-align: center;}
.form .imgWrapper .overlayText {position: absolute; width: 100%; height: auto; left:-17px; color: #4d95d0;}
.form.sts8081label .imgWrapper .overlayText.labelbar {top:0px;}
.form.sts8081label .imgWrapper .overlayText.label {top:38%;}
.form.sts8081label .imgWrapper .overlayText.container {top:63%;}
.form.sts8082labels .imgWrapper .overlayText.labelbar {top:0px;}
.form.sts8082labels .imgWrapper .overlayText.labelFront {top:29%;}
.form.sts8082labels .imgWrapper .overlayText.labelBack {top:49%;}
.form.sts8082labels .imgWrapper .overlayText.container {top:63%;}
.form .imgWrapper img {display: inline-block; float: none;}
.form .fieldsWrapper .fieldRow {clear: both; float: left; width: 100%;}
.form .fieldsWrapper .fieldRow .fieldWrapper {width: auto; display: inline-block; float: none;}
.form .fieldsWrapper .fieldRow .fieldWrapper .beforeField {margin-right: 10px; line-height: 70px; font-size: 30px; position: absolute; top: 0px; left: -70px;}
.form .fieldsWrapper .fieldRow .fieldWrapper .field {width: 240px; height: 70px; padding:10px; line-height: 50px; background-color: #eee; border:0px; box-sizing: border-box; font-size: 30px; color: #444; text-align: center; box-shadow: none !important;}
@keyframes scaleAnimation {
  	0%   {transform: scale(0.8); opacity: 0;}
  	50%  {transform: scale(1.1); opacity: 0.5;}
  	100% {transform: scale(1); opacity: 1;}
}
.form .fieldsWrapper .fieldRow .fieldWrapper .errorWrapper {color: #fff; font-size: 16px; font-weight: bold; text-align: center; background-color: #ed1c24; border-radius: 20px; position: absolute; width: 200px; top:60px; left: 50%; margin-left: -100px; display: none; transform: scale(1); }
.form .fieldsWrapper .fieldRow .fieldWrapper .errorWrapper.animate {animation-name: scaleAnimation;
  animation-duration: 0.2s; transition: all 0.2s;}
.form .fieldsWrapper .fieldRow .customError {color: #fff; font-size: 14px; text-align: left; font-weight: bold; border-radius:5px; margin-top: 10px; background-color: #ed1c24;  display: block; line-height: 1.3; padding:5px; display: none;}
.form .fieldsWrapper .fieldRow .customError.animate {animation-name: scaleAnimation;
  animation-duration: 0.2s; transition: all 0.2s;}
.form .fieldsWrapper .fieldRow .fieldWrapper .afterField {margin-left: 10px; line-height: 70px; font-size: 24px; position: absolute; top: 0px; right: -60px;}
.form .resultsWrapper .resultRow .label .descr {color: #9e9e9e;}
.form .resultsWrapper .resultRow .resultWrapper .result {color: #4d95d0; font-size: 48px; line-height: 1;}
.importantInfo {margin-bottom: 20px; padding:0px 40px;}
.importantInfo > div {padding:10px; background-color: #ed1d24; color: #fff; font-size: 14px; line-height: 1.5; text-align: left; border-radius: 6px;}
.importantInfo .importantIcon {background-image: url('images/important.png'); display: inline-block; float: left; width: 12px; height: 34px; margin-right: 15px; margin-left: 5px; margin-top: 3px;}
.form.sts8101label .imgWrapper .overlayText.labelbar {top:0px;}
.form.sts8101label .imgWrapper .overlayText.label {top:63%;}
.form.sts8102labels .imgWrapper .overlayText.labelbar {top:0px;}
.form.sts8102labels .imgWrapper .overlayText.labelFront {top:48%;}
.form.sts8102labels .imgWrapper .overlayText.labelBack {top:81%;}


@media all and (max-width: 1680px){
	main.dosingMachines .bodyWrapper .circleBox h3 {font-size: 24px; padding-bottom: 10px;}
	main.dosingMachines .bodyWrapper .circleBox .circleWrapper {width: 300px; height: 300px; }
}

@media all and (max-width: 1380px){
	main.dosingMachines .bodyWrapper .circleBox .circleWrapper {width: 250px; height: 250px; }
}

@media all and (max-width: 1180px){
	main.dosingMachines .bodyWrapper .circleBox h3 {font-size: 16px; padding-bottom: 5px;}
	main.dosingMachines .bodyWrapper .circleBox .circleWrapper {width: 200px; height: 200px; }
}

@media all and (max-width: 980px){
	main.dosingMachines .bodyWrapper .w25 {width: 50%; height: 50%;}
	main.dosingMachines .bodyWrapper .w25.wrapper-1, main.dosingMachines .bodyWrapper .w25.wrapper-2 {border-bottom: 5px solid #f5f5f5;}
	main.dosingMachines .bodyWrapper .w25.wrapper-3, main.dosingMachines .bodyWrapper .w25.wrapper-4 {border-top: 5px solid #f5f5f5;}
	.form .imgWrapper img {width: 160px;}
	.form .imgWrapper {padding-right: 20px;}
	.form .imgWrapper .overlayText {left: -24px;font-size: 14px;}

}

@media all and (max-width: 860px){
	.headerWrapper {padding:10px;}
	.footerWrapper {font-size: 12px;}
	.logoWrapper img {height: 70px;}
	.langWrapper .langLink img {height: 28px;}
	.bodyWrapper .circleBox h3 {font-size: 16px; padding-bottom: 5px;}
	.bodyWrapper .circleBox .circleWrapper {width: 200px; height: 200px; }
	main.home .homeSeparator {display: none;}
	main.home .bodyWrapper > .w50 {float: left; width: 100%; height: 50%; border-bottom: 5px solid #f5f5f5;}
	main.home .bodyWrapper > .w50:last-child {border-bottom: 0px;}
	.form .imgWrapper {width: 40%;}
	.form .fieldsWrapper {width: 60%; margin-top: 0px !important; padding-right: 50px;}
	.form .resultsWrapper {width: 100%; margin-top: 0px !important; padding-top: 50px; text-align: center;}
	.form .resultsWrapper > .div {float: none; display: inline-block; width: auto;}
	.form .resultsWrapper .resultRow {width: auto; margin-right: 50px; max-width: 160px;}
	.form .resultsWrapper .resultRow:last-child {margin-right: 0px;}
	.form .resultsWrapper .resultRow .label {height: 60px; padding-bottom: 0px; margin-bottom: 10px; }
	.form .resultsWrapper .resultRow .label.offset {line-height: 40px;}
	.form .resultsWrapper .resultRow .resultWrapper .result {font-size: 40px;}
	.form .resultsWrapper .resultRow .resultWrapper {padding-bottom: 20px;}
	.importantInfo > div {line-height: 36px;}
}

@media all and (max-width: 720px){
	.form .resultsWrapper .resultRow .label {font-size: 14px;}
	.form.sts8082labels .resultsWrapper .resultRow {width: 25%; padding:0px 10px; margin:0px; max-width: 100%;}

}

@media all and (max-width: 640px){
	.form .fieldsWrapper {padding-left: 0px; padding-right: 0px;}
	.form .fieldsWrapper .fieldRow {padding-bottom: 40px;}
	.form .fieldsWrapper .fieldRow .label {font-size: 14px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .field {width: 140px; padding:5px; height: 50px; line-height: 40px;font-size: 24px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .beforeField, .form .fieldsWrapper .fieldRow .fieldWrapper .afterField {line-height: 50px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .beforeField {font-size: 24px; left: -50px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .afterField {font-size: 20px; right: -45px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .errorWrapper {font-size: 12px; top:40px; margin-left: -65px; width: 130px;}
	.form.sts8082labels .fieldsWrapper .fieldRow {padding-bottom: 30px;}
	.form .resultsWrapper {padding-top: 0px;}
	.form .resultsWrapper .resultRow .resultWrapper .result {font-size: 30px;}
	.form .resultsWrapper .resultRow .div {display: block; float: none; width: auto;}
	.importantInfo {margin-top: 20px;}
	.importantInfo > div { line-height: 1.5; max-width: 300px; float: none; margin: 0 auto; }
}

@media all and (max-width: 510px){
	main.preCalcSelect .bodyWrapper .button {margin:10px 0px; clear: both;}
	.form.sts8082labels .resultsWrapper .resultRow {width: 50%; padding:10px;}
	.form.sts8082labels .resultsWrapper .resultRow .div {padding-bottom: 20px;}
	.form.sts8082labels .resultsWrapper .label.offsetStop1 {line-height: 60px;}
	.form.sts8082labels .resultsWrapper .label.offsetStop2 {line-height: 60px;}
}

@media all and (max-width: 490px){
	main.dosingMachines .bodyWrapper .circleBox h3 {font-size: 14px;}
	main.dosingMachines .bodyWrapper .circleBox .circleWrapper {width: 150px; height: 150px; }
}

@media all and (max-width: 400px){
	.langWrapper .langLink img {height: 25px;}
	.langWrapper .langLink.mr20 {margin-right: 10px;}
	main.dosingMachines .bodyWrapper .circleBox .circleWrapper {width: 130px; height: 130px; }
	.form .imgWrapper {width: 50%; padding-right: 30px;}
	.form .imgWrapper .overlayText {font-size: 11px;}
	.form .fieldsWrapper .fieldRow .label {font-size: 11px;}
	.form .fieldsWrapper {width: 50%;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .field {width: 100px; padding:5px; height: 40px; line-height: 30px;font-size: 18px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .beforeField, .form .fieldsWrapper .fieldRow .fieldWrapper .afterField {line-height: 40px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .beforeField {font-size: 20px; left: -40px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .afterField {font-size: 16px; right: -35px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .errorWrapper {top: 33px;}
	.form .resultsWrapper .resultRow .label {font-size: 14px;}
	.form .resultsWrapper .resultRow {margin-right: 40px;}
	.form .resultsWrapper .resultRow:last-child {margin-right: 0px;}
	.importantInfo {padding:0px;}
}

@media all and (max-width: 350px){
	main.dosingMachines .bodyWrapper .circleBox h3 {font-size: 12px;}
	main.dosingMachines .bodyWrapper .circleBox .circleWrapper {width: 110px; height: 110px; }
	.form {max-width: 300px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .beforeField {font-size: 12px; left: -30px;}
	.form .fieldsWrapper .fieldRow .fieldWrapper .afterField {font-size: 12px; right: -25px;}
	.form.sts8082labels .fieldsWrapper .fieldRow {padding-bottom: 20px;}
}