@font-face {font-family: 'NX-Bold';src: url('2AFD88_3_0.eot');src: url('2AFD88_3_0.eot?#iefix') format('embedded-opentype'),url('2AFD88_3_0.woff') format('woff'),url('2AFD88_3_0.ttf') format('truetype');}
@font-face {font-family: 'NX';src: url('2AFD88_4_0.eot');src: url('2AFD88_4_0.eot?#iefix') format('embedded-opentype'),url('2AFD88_4_0.woff') format('woff'),url('2AFD88_4_0.ttf') format('truetype');}

* {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html, body {
	height: 100%;
}

body {
	color: #1D394A;
	font-size: 145%; /*1.1em;*/
	line-height: 1.3em;
}

body, form, input, textarea {
	/*font-family: 'Exo 2', sans-serif;*/
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
}

hr {
	display:block;
	border: none;
	border-bottom: solid 1px #000000;
	display: block;
	margin: 0 auto 0.5em;
	padding: 0.5em;
	
}

.container {
	display: block;
	width: 100%;
	margin-top: 100px;
}

.frame {
	display: block;
	width: 100%;
	padding: 4em 0;
}

.frameHead {
	font-family: 'NX-Bold';
	font-size: 1.8em;
	font-weight: 300;
	text-align: center;
	padding: 0 0 1em;
}

.frame p {
	padding: .5em 0;
}

.inquiryform form p {padding: .2em 0;}

.frameContent {
	margin: 0 auto;
	padding: 0.5em 2em;
	width: 70%;
}

#intro {
	background-color: #1ABADE;
	height: 100px;
	left: 0;
	padding: 20px 0;
	position: fixed;
	text-align: center;
	top: 0;
	width: 100%;
	z-index: 99999;
	box-shadow: 0px 2px 11px -5px rgba(0,0,0,0.2);
	overflow: hidden
}

#remote-support {
	background-color: #FFFFFF;
	border-radius: 0.5em;
	color: #1D394A;
	right: 73%;
	padding: 0.3em 0.5em;
	position: absolute;
	top: 25%;
	box-shadow: -1px -2px 11px -6px, -2px -2px 9px -6px inset
}

#letmedl {
	background-color: #fff;
	border-radius: 1em;
	display: inline-block;
	padding: 0.5em 2em;
	margin: 1em 0;
}

#show-manual {
	display:none;
	background-color: rgba(10%, 73%, 87%, 0.4);
	left: 0;
	position: relative;
	text-align: center;
	top: 0;
	padding: 2em 1em 2em;
	width: 100%;
	height: auto;
	overflow: hidden;
}

#show-manual ul li {
	line-height: 1.2em;
	padding-bottom: 1em;
}

#siteLogo {
	max-width: 180px;
	height: auto;
}


#intro a:hover,#intro a:focus,#intro a:active {
	border: none;
}

#top-phone {
	background-color: #FFFFFF;
	border-radius: 0.5em;
	color: #1D394A;
	left: 73%;
	padding: 0.3em 0.5em;
	position: absolute;
	top: 25%;
	box-shadow: -1px -2px 11px -6px, -2px -2px 9px -6px inset
}

#TOC {
	font-family: 'NX';
	padding: 5em 0 5em;
}

#TOC p {
	text-align: center;
}

#TOC ul.linklist li a {

}

.menu-img {
	max-width: 100px;
	height: auto !important;
}

.odd {
	background-color: #1ABADE;
	background-image: linear-gradient(to left, #FFFFFF -70%, #1ABADE 20%, #1ABADE 80%, #FFFFFF 160%);
}

.even {
	background-color: #ffffff;
	background-image: linear-gradient(to left, #1ABADE -65%, #FFFFFF 10%, #FFFFFF 90%, #1ABADE 165%);
}

.odd .frameHead {
	color: #ffffff;
	text-shadow: -1px -1px 3px rgba(18, 1, 33, 0.3), 1px 1px 3px rgba(255, 255, 255, 0.3);
}

.odd li, .odd p, .odd form label {
	color: #1D394A;
	text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.3), 1px 1px 1px rgba(255, 255, 255, 0.4);
}

.even .frameHead {
	color: #1ABADE;
}

ul {
	list-style: none;
	display: block;
}

.checklist {

}

.checklist li {
	padding: .4em 0;
}

.checklist li:before {
	display: inline-block;
	height: 30px;
	width: 30px;
	background: url("bullet.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
	content: " ";
	position: relative;
	left: -9px;
	top: 5px;
}

.odd .checklist li:before {
	background-position: center bottom;
}

.linklist {
	/*margin: 0 auto;*/
	width: 100%;
}

.linklist li {
	display: inline-block;
	/*line-height: 2em;*/
	width: 32.5%;
	list-style: none;
	vertical-align: top;
	text-align: center;
}

.linklist li a {
	/*width: 33.3%;*/
}

.img-holder {
	display: block;
	text-align: center;
	width: 100% !important;
	padding-bottom: 0.5em;
}

#to-inquiry, .hybutton {
	display: block;
	border: none;
	margin: 3em auto 0;
	color: #ffffff;
	background-color: #1ABADE;
	border-radius: 1em;
	text-align: center;
	padding: .7em .5em;
	width: 45%
}


#to-inquiry:hover,#to-inquiry:focus,.hybutton:hover,.hybutton:focus {
	background: linear-gradient(to bottom, #c1ef95 0%,#89e62c 50%,#93dd00 51%,#94f038 100%);
	border: none;
	color: #fff;
}

a {
	text-decoration:none;
	color: #1ABADE;
	border: none;
	outline: none !important;
}

a:hover {
	color: #1595B2;
	border-bottom: dotted 1px;
}

.anchors {
	display: block;
	position: relative;
	top: -99px;
	visibility: hidden;
}


/************************* form styles ***********************************/

.inquiryform {
	border-top: 4px dotted #FFFFFF;
}

.inquiryform .frameContent > p {
	background-color: rgba(255, 255, 255, 0.4);
	border-radius: 1em;
	padding: 1em;
	text-align: center;
}

form {
	padding-top: 1em;
	margin: 0 auto;
	text-align: center;
	width: 95%;
}

form label {
	display: block;
	font-weight: 300;
	padding: 0 0 0.35em 15%;
	text-align: left;
	/*font-size: 0.9em;*/
}

form input[type="text"],input[type="tel"], form textarea {
	background-color: #FFFFFF;
	border: 0.07em solid rgba(0, 0, 0, 0.1);
	border-radius: 0.5em;
	color: #333333;
	font-size: 1em;
	margin-bottom: 0.3em;
	outline: 0 none;
	padding: 0.5em;
	width: 80%;
	overflow: auto;

}

form .required {
	color: #ffffff;
}



form textarea {
	min-height: 200px;
	max-height: 500px;
	height: 250px;
	resize: vertical;
}

form input[type="submit"],form .submit {
	background: linear-gradient(to bottom, #F5F7F7 0%, #F5F7F7 8%, #FEFEFE 11%, #F7F7F7 30%, #EDEFEF 54%, #E9EAEB 75%, #E4E5E6 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
	border: 0.06em solid rgba(0, 0, 0, 0.4);
	border-radius: 0.5em;
	color: #000000;
	display: block;
	font-size: 0.95em;
	padding: 0.3em 1em;
	position: relative;
	margin: 0 auto;
	text-decoration: none;
	box-shadow: 0.03em 0.03em 0.2em rgba(0, 0, 0, 0.2);
	outline: none;
}

form input[type="submit"]::-moz-focus-inner,form .submit::-moz-focus-inner {
	border: 0;
}

form input[type="submit"]:hover, form input[type="submit"]:focus, form .submit:hover, form .submit:focus {
	background: linear-gradient(to bottom, #c1ef95 0%,#89e62c 50%,#93dd00 51%,#94f038 100%);
	/*linear-gradient(to bottom, #bce5ee 0%, #9BDCED 100%);*/
	box-shadow: none;
	box-shadow: -0.03em -0.03em 0.2em rgba(0, 0, 0, 0.2);
}

#errors {
	padding:10px;
	margin:25px 0px;
	display:block;
	border-radius: 1em;
	background:#FFE6E6;
	display:none;
	text-align: center
}
 
#errors li {
	padding:2px;
	list-style:none;   
}
 
#errors li:before {
	content: ' – ';   
}
 
#errors #info {
	font-weight:bold;
}
 
#errors #info:before {
	content: '';   
}
 
#success {
	border:solid 1px #83D186;
	padding:25px 10px;
	margin:25px 0px;
	display:block;
	border-radius: 1em;
	background:#D3EDD3;
	font-weight:bold;
	display:none;
}
 
#errors.visible, #success.visible {
	display:block;   
}

input:required, textarea:required {
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
	-o-box-shadow:none;
	box-shadow:none;
}

input[type="text"]:focus, input[type="tel"]:focus, textarea:focus {
	box-shadow: 0 0 8px #A7FFFF,inset 0 0 5px #8FCF9F;
	border-color: #89E2F4;
}

#spambar input  {
	width: 50% !important;
}

#spambar label {
	text-align: center;
	padding: 0 0 0.35em 0
}
 
#showcalc {
	background-color: #fff;
	color: #1ABADE;
	font-weight: 500;
}

#showcalc:hover,#showcalc:focus {
	color: #fff;
}

#calcarea {
	display: none;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.4); /*rgba(26, 186, 222, 0.4);*/
	border-radius: 1em;
	padding: 1em;
	margin: 2em 0;
}

#calcarea input {
	width: 4em;
	text-align: center;
	border-radius: 0;
	margin: 0 -0.2em;
	border: 0.06em solid rgba(0, 0, 0, 0.1);
	padding: 0.47em;
	
}

#calcarea form p:first-child {
	padding-bottom: 1.5em;
}

#calcarea label {
	text-align: center;
	padding: 0 0 0.5em;
}

.calcbutton {
	background-color: #1ABADE;
	color: #FFFFFF;
	cursor: pointer;
	display: inline-block;
	font-family: NX-BOLD;
	padding: 0.5em 0;
	width: 2em;
}

.plus {
	border-radius: 0 0.5em 0.5em 0;
}

.minus {
  border-radius: 0.5em 0 0 0.5em;
}

#calcresult {
	display: inline-block;
	padding:  0;
	font-size: 1.3em;
}

#to-form {color: #fff;
padding-top: 1em;
border-bottom: 1px dotted;

}

#to-form:hover, #to-form:focus {color: #fff;
border: none;
}

/************************* FOOTER ******************************************/
#footer {
	padding: 1.5em 0 0;
}

#footer .frameContent div {
	display: inline-block;
	padding-bottom: 2em;
	vertical-align: top;
}

#footer p {line-height: 0.5em;}

#footer .frameContent div:first-child {
	float: left;
}

#foot-rightcol {
	float: right;
}

#foot-supplier {
	display: block;
	float: right;
	padding-left: 1em;
	border: none !important;
}

#foot-supplier img {
	max-height: 70px;
	width: auto !important;
}


/**************************************** MOBILE **************************************/
@media only screen and (max-width: 481px) {

.container {
margin-top: 6.5em;
}

body {
	font-size: 110%;
}

.frameContent {
	padding: 0.5em 1.5em;
	width: 100%;
}

.frameHead {
	font-size: 1.5em;
	line-height: 1em;
}

form {
	width: 100%
}

.frame {
	padding: 2em 0;
}

form input[type="text"], input[type="tel"], form textarea {
	width: 90%;
}
form label {
	padding: 0 0 0.35em 5%;
}

.frameHead {
	line-height: 1.2em;
	padding: 0 0 0.2em;
}

.linklist {
	width: 100%;
	min-width: 100%;
}

.linklist li {
	font-size: 77%;
	line-height: 1.1em;
	padding: .2em;
}

.menu-img {
	max-width: 80px;
	height: auto !important;
}

#TOC .frameContent {padding: 0;}

#TOC {
	padding: 3em 0 2em;
}

.linklist li {
	display: block;
	width: 100%;
	text-align: left;
}

.linklist li a {
	display: block;
	width: 100%;
	padding-left: 1em;
}

.linklist li a span{
	display: inline-block;
	vertical-align: top;
}

.img-holder {
	width: auto !important;
	height: auto !important;
}

.menutitle {
	padding: 1em;
	width: 66%;
}

#to-inquiry {
	margin: 1.5em auto 0;
}

#footer .frameContent div {
	display: inline-block;
	float: none;
	padding-bottom: 0.5em;
}

#footer p {
	line-height: 1em;
}

#foot-supplier {
	display: none !important;
}

#remote-support {
	border-radius: 0;
	left: 0;
	top: 0;
	width: 100%;
}

#show-manual {
padding-top: 4em}

#top-phone {
	border-radius: 0;
	left: 0;
	top: 2.3em;
	width: 100%;
}

#intro {padding: 4.3em 0}

#siteLogo {
	max-width: 150px;
	top: .5em;
}
#top-phone,#remote-support { font-size: 0.8em}

#to-inquiry, .hybutton {
	padding: .7em .5em;
	width: 75%
}

}

/**************************************** TABLETS **************************************/
@media only screen and (min-width: 481px) and (max-width: 767px) {

.container {
margin-top: 6.5em;
}

#remote-support {
	border-radius: 0;
	left: 0;
	top: 0;
	width: 100%;

}

#top-phone {
	border-radius: 0;
	left: 0;
	top:2.2em;
	width: 100%;
}

#intro {padding: 4em 0}

#siteLogo {
	max-width: 150px;
	position:relative;
	top: 0.5em;
}
	
#top-phone, #remote-support { font-size: 0.8em}

.frameContent {
	padding: 1.3em;
	width: 92%;
}

form {
	width: 100%;
}

.frame {
	padding: 2.2em 0;
}

form input[type="text"], input[type="tel"], form textarea {
	width: 85%;
}

.frameHead {
	line-height: 1.2em;
	padding: 0 0 0.5em;
}

.linklist {
	width: 100%;
	min-width: 100%;
}

.linklist li {
	display: block;
	width: 100%;
	text-align: left;
}

.linklist li a {
	display: block;
	width: 100%;
	padding-left: 1em;
}

.linklist li a span{
	display: inline-block;
	vertical-align: top;
}

.img-holder {
	width: auto !important;
	height: auto !important;
}

.menutitle {
	padding: 1em;
	width: 66%;
}

#to-inquiry {
	margin: 1.5em auto 0;
}

#TOC .frameContent {padding: 0;}

#TOC {
	padding: 3em 0 2em;
}

#footer .frameContent div {
	display: inline-block;
	float: none;
	padding-bottom: 0.5em;
}

}

@media only screen and (min-width: 768px) and (max-width: 1310px) {

.frameContent {
	padding: 1.5em;
	width: 80%;
}

#top-phone, #remote-support { font-size: 0.8em}
#remote-support {	line-height: 1em; margin-left: 1em; padding: 0.3em 0.2em}

#TOC .frameContent {padding: 0;}

.linklist {
	width: 100%;
	min-width: 100%;
}

#footer .frameContent div {
	display: inline-block !important;
	float: none !important;
}

#footer .frameContent div {
	padding-right: 1em;
}

}

/************************* basic classes ***********************************/
.text-bold {font-weight: bold;}
.text-italics {font-style: oblique}
.float-right {float: right}
form span.text-italics, #show-manual span.text-italics {opacity: .6}