/*
Theme Name: customthemename
Author: Plamen Georgiev
Description: Custom theme
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: customthemename
*/

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:2; font-size:16px; background-color:#0B5CE1; min-width: 320px; height: 100vh;}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
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;}
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;}
.grHidden{display:none;}
.grVisible{display:block;}
.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;}
.posrel {position: relative;}
.backgroundCover {background-size: cover;}
.wrap {display:block; float:none; width:100%; max-width:1200px; margin:0 auto;}
.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;}
img {max-width: 100%; height: auto;}

#calculatorWrapper {width: 375px; height: 600px; background-image: url('../images/background.jpg'); background-repeat: no-repeat; background-size: cover; margin: 0 auto; max-width: 100%;}
#calcStepHome .header {margin-top: 30px; background-color: rgba(255,255,255,0.4); padding:10px 10px;}
#calcStepHome .header .logo {float: left; height: 50px; width: auto;}
#calcStepHome .header .title {color: #000; float: right; line-height: 50px; font-size: 24px;}
#calcStepHome .langWrapper { padding-top: 60px; text-align:center; margin-bottom: 50px;}
#calcStepHome .langWrapper a {display: inline-block; padding:5px; margin:0px 20px;}
#calcStepHome .langWrapper a img {height: 40px; width: auto; display: block; opacity: 0.4;}
#calcStepHome .langWrapper a.active img {opacity: 1;}
#calcStepHome .langWrapper a:hover {background-color: rgba(0,0,0,0.5);}
#calcStepHome .langWrapper a:hover img {opacity: 1;}
#calcStepHome .body {padding:20px 40px; color: #fff; font-size: 20px; text-align: center;}
#calcStepHome .mashineName {color: #fff; font-size: 34px; text-align: center; line-height: 30px;}
.buttonWrapper {position: absolute; bottom: 10px; padding:0px 10px; z-index: 1;}
.buttonWrapper .button {background-image: url('../images/button.png'); background-size: 100% 100%; color: #fff; text-align: center; padding:10px 0px; opacity: 0.9; font-weight: bold;}
.buttonWrapper .button:hover {opacity: 1; color: #000;}
.izmereteWrapper, .izchislenoWrapper {color: #fff; padding-left: 20px; font-size: 20px; padding-top: 10px;}
.fieldImagesBody {padding-top: 10px; color: #fff;}
.fieldImagesBody .lentaImg {width: 100px;}
.fieldImagesBody .krugImg {width: 100px;}
.fieldImagesBody .labelWrap {font-size: 14px;}
.fieldImagesBody .fieldWrap {line-height: 50px;}
.fieldImagesBody .fieldWrap input {font: inherit; display: inline-block; width: 80px; background-color: #fff; border:0px; height: 30px; line-height: 20px; padding:5px 10px; font-weight: bold; margin:0px 5px; text-align: center; font-weight: bold; font-size: 16px;}
.resultatWrapper {color: #fff; padding-top: 20px;}
.resultatWrapper > div {padding-bottom: 30px;}
.resultatWrapper .label {line-height: 1.5; margin-top: 8px;}
.resultatWrapper .fieldWrapper {line-height: 50px;}
.resultatWrapper .fieldWrapper input {font: inherit; display: inline-block; width: 80px; background-color: #fff; border:0px; height: 30px; line-height: 20px; padding:5px 10px; font-weight: bold; margin-right:5px; text-align: center; font-weight: bold; font-size: 16px; }
#calcStepLabel1 .fieldImagesBody .line_l0 { position: absolute; background-image: url('../images/l1_l0.png'); background-size: 100% 100%; width: 45px; height: 22px; top: 50%; left: 50%; margin-left: -54px; margin-top: -88px; }
#calcStepLabel1 .fieldImagesBody .line_l { position: absolute; background-image: url('../images/l1_l.png'); background-size: 100% 100%; width: 50px; height: 35px; top: 50%; left: 50%; margin-left: -54px; margin-top: -25px;  }
#calcStepLabel1 .fieldImagesBody .line_d { position: absolute; background-image: url('../images/l1_d.png'); background-size: 100% 100%; width: 62px; height: 7px; top: 50%; left: 50%; margin-left: -66px; margin-top: 103px;  }
#calcStepLabel2 .fieldImagesBody .line_l1 {position: absolute; background-image: url('../images/l2_l1.png'); background-size: 100% 100%; width: 48px; height: 74px; top: 50%; left: 50%; margin-left: -54px; margin-top: -189px;}
#calcStepLabel2 .fieldImagesBody .line_l0 {position: absolute; background-image: url('../images/l2_l0.png'); background-size: 100% 100%; width: 48px; height: 23px; top: 50%; left: 50%; margin-left: -54px; margin-top: -90px;}
#calcStepLabel2 .fieldImagesBody .line_l2 {position: absolute; background-image: url('../images/l2_l2.png'); background-size: 100% 100%; width: 47px; height: 51px; top: 50%; left: 50%; margin-left: -54px; margin-top: -42px;}
#calcStepLabel2 .fieldImagesBody .line_d {position: absolute; background-image: url('../images/l2_d.png'); background-size: 100% 100%; width: 63px; height: 4px; top: 50%; left: 50%; margin-left: -68px; margin-top: 103px;}
.errorWrapper {position: absolute; bottom: 10px; width: 94%; left: 3%; background-color: rgba(195,170,190,0.8); z-index: 2; min-height: 140px; padding:0px 10px;}
.errorWrapper .closeErroWrapper {position: absolute; right: -8px; top: -11px; width: 40px; height: 40px; background-image: url("../images/close.png"); background-size: 100% 100%; cursor: pointer; opacity: 0.9;}
.errorWrapper .closeErroWrapper:hover {opacity: 1; width: 42px; height: 42px; margin-top: -1px; margin-left: 1px;}
.errorWrapper .errorContent {color: #510000; font-weight: bold;}

/*Media Queries for mobile, tablet, desktops*/

@media all and (max-width: 400px){
	#calculatorWrapper {width: 320px; height: 530px;}
	.buttonWrapper .button {padding:5px 0px; font-size: 14px; opacity: 1; font-weight: 400;}
	#calcStepHome .langWrapper {margin-bottom: 10px; padding-top: 40px;}
	.izmereteWrapper, .izchislenoWrapper {font-size: 14px;}
	.fieldImagesBody {padding-top: 0px;}
	#calcStepHome .header .title {font-size: 20px;}
	.fieldImagesBody .labelWrap {font-size: 11px;}
	.fieldImagesBody .fieldWrap {font-size: 11px; padding-bottom: 25px;}
	.resultatWrapper .fieldWrapper {font-size: 11px;}
	.resultatWrapper .label {font-size: 14px;}
	#calcStepLabel1 .fieldImagesBody .line_l0 { background-image: url('../images/l1_l0_m.png'); width: 31px; height: 21px; margin-left: -38px; margin-top: -81px; }
	#calcStepLabel1 .fieldImagesBody .line_l { background-image: url('../images/l1_l_m.png'); width: 35px; height: 35px; margin-left: -39px; margin-top: -18px; }
	#calcStepLabel1 .fieldImagesBody .line_d { background-image: url('../images/l1_d_m.png'); width: 45px; height: 9px; margin-left: -51px; margin-top: 104px; }
	#calcStepLabel2 .fieldImagesBody .line_l1 {background-image: url('../images/l2_l1_m.png'); width: 32px; height: 74px; margin-left: -38px; margin-top: -182px;}
	#calcStepLabel2 .fieldImagesBody .line_l0 {background-image: url('../images/l2_l0_m.png'); width: 33px; height: 25px; margin-left: -38px; margin-top: -84px;}
	#calcStepLabel2 .fieldImagesBody .line_l2 {background-image: url('../images/l2_l2_m.png'); width: 32px; height: 51px; margin-left: -38px; margin-top: -38px;}
	#calcStepLabel2 .fieldImagesBody .line_d {background-image: url('../images/l2_d_m.png'); width: 45px; height: 7px; margin-left: -50px; margin-top: 104px;}
	.errorWrapper {min-height: 100px;}
}