html,body {padding:0; font-family:'Segoe UI',Arial,sans-serif; font-size:19px; color:#222222; line-height:29px; height:100%; background:#fff;}
body {max-width:1900px; min-width:350px; margin:0 auto;}
body.calc {max-width:2200px !important; min-width:1400px;}

img,table {border:0;}
form,label {padding:0; margin:0;}
table {border-collapse:collapse;}
.left {float:left;}
.clear {clear:both !important;}
p {margin:0; padding:0 0 10px 0;}

#all {border-left:1px solid #ccc; border-right:1px solid #ccc; margin:0 auto;}
#page {margin:20px 4% 60px 4%;}
h1 {color:#111; margin:60px 0 45px 0; padding:0; font-size:33px; line-height:40px; letter-spacing:-1px;}
h2 {color:#04579f; margin:40px 0 35px 0; padding:7px 0 7px 25px; border-left:4px solid #04579f; font-size:26px; line-height:30px; letter-spacing:-1px;}
h3 {color:#04579f; margin:20px 0; padding:0; font-size:22px; line-height:24px; text-align:center;}
a {color:#0d5da2;}
a:hover h3,a:hover {color:#bb0000;}

.red {color:#cc0000; font-style:italic; font-weight:bold;}
.blue {color:#0d5da2; font-style:italic; font-weight:bold;}

h1.lined {display:inline-block; text-align:center; background:url(img/line.png) repeat-x left center; padding:0 120px;}
h1.lined span {background:#ffffff; padding:0 20px; white-space:nowrap;}
h1.dck {display:inline-block; padding:20px 0 20px 110px; background:url(img/dock1.png) no-repeat left center; background-size:auto 100%;}

button,#form input[type='submit'] {background:#0d5da2; border-radius:8px; padding:10px 25px; border:0; border-top:1px solid #76bfff; border-bottom:2px solid #003869; color:#fff; font-size:20px; text-transform:uppercase; font-family:'Segoe UI',Arial,sans-serif; cursor:pointer;}
button.yt {background:#d41c1c url(img/yt.png) no-repeat right center; background-size:auto 90%; border-radius:12px; padding:20px 100px 20px 25px; border:0; color:#fff; font-size:25px;}

hr {clear:both; border-bottom:2px solid #0d5da2; box-shadow:3px 3px 7px #75a2c9; margin:35px auto 15px auto;}


header {background:url(img/header.jpg) no-repeat center center; background-size:cover; height:500px; text-align:center; position:relative; overflow:hidden;}
header h1 {margin:0; padding:0; color:#fff; font-size:60px; line-height:62px; text-shadow:2px 2px 4px #000;}
header h1.darkline {position:relative; z-index:2; background:url(img/drk.png); padding:20px 0 30px 0;}
header button {margin-top:65px;}
header iframe {z-index:1;}

#top {position:relative; z-index:2; margin:0 auto 75px auto; display:inline-block; max-width:80%; min-width:50%; text-align:left;}
#menu {padding:13px 30px; border-radius:15px; border-top-left-radius:0; border-top-right-radius:0; background:url(img/wh.png);}
#menu a {color:#0d5da2; text-decoration:none;}
#menu div {margin:0 12px; padding:5px 8px 7px 8px; background:none; border:0; display:inline-block;}
#menu div.active,#menu div:hover {background:#fff; color:#000; padding:5px 8px; border-bottom:2px solid #0d5da2; border-radius:4px;}
#logo {margin-top:9px;}
#menu2 {display:none; background:#0d5da2; padding:17px 3%;}
#menu2 div {display:inline-block; margin:6px 3%;}
#menu2 div a {color:#fff;}
#menu2 div a:hover,#menu2 div.active a {color:#76bfff;}

#menu #lev2menu {display:none; position:absolute; left:50%; width:980px; margin:0 0 0 -475px; top:50px; height:150px; z-index:3; border:0; border-radius:4px; padding:20px 0 0 0; background:none;}
#menu #lev2menu a:hover {color:#bb0000;}
#menu #lev2menu  div {vertical-align:top; box-shadow:1px 1px 4px rgba(0,0,0,0.3); text-align:center; width:19%; background:#fff; padding:15px 0; border:0; margin:0 !important; font-size:14px; line-height:16px; border-radius:8px;}
#lev2menu img {height:90px;}
#menu div.more:hover #lev2menu,#menu div.more #lev2menu:hover {display:block;}

.p1 {padding-left:10%;}
.b1 {margin:200px 0 0 10%;}

#lang {position:absolute; z-index:5; top:20px; right:25px;}
#lang a {text-decoration:none; margin-left:13px;}

.glr_itm {float:left; vertical-align:top; margin:0 1% 25px 1%; border-radius:12px; border:1px solid #0d5da2; border-bottom:4px solid #0d5da2; width:22.5%; min-height:580px; font-size:18px; line-height:24px; overflow:hidden;}
.glr_itm.n4 {clear:both;}
.glr_itm .pic {height:220px;}
.glr_itm .txt {padding:0 30px 30px 30px;}

.instr_itm {margin:0 1% 30px 1%; border-radius:12px; border:1px solid #0d5da2; border-bottom:4px solid #0d5da2; width:47.5%;  position:relative; text-align:center; padding:20px 0;}
.instr_itm img {width:90%;}
a img.yt2,a img.yt {width:110px; position:absolute; top:50%; left:50%; margin:-40px 0 0 -55px;}
a:hover img.yt {display:none;}

#advantages .itm {float:left; width:22%; padding:0 1.5%; vertical-align:top;}
#advantages h3 {text-align:left; padding:10px 0 10px 50px; background:url(img/v.png) no-repeat left center;}

#marina {margin-top:100px; background:url(img/header.jpg) no-repeat center center; background-size:cover; height:350px; text-align:center;}
#marina h1 {padding:100px 0 50px 0; margin:0; color:#fff; font-size:60px; line-height:62px; text-shadow:2px 2px 4px #000;}


#login,#eng {margin-top:40px; float:right; font-size:19px; padding:20px 0 25px 40px; background:url(img/lock.png) no-repeat left center;}
#eng {margin-left:80px; background:url(img/eng.png) no-repeat left center;}
#calc {background:#ccc; margin:0; width:100%; height:950px; overflow:hidden; position:relative;}
.hint_txt {background:#ddd url(img/info.png) no-repeat left center; color:#000; padding:9px 20px 9px 60px; margin-bottom:60px; font-size:17px; line-height:20px;}
.calc_itm {width:21%; float:left; margin:0 2% 30px 2%;}
.calc_itm img {width:100%;}

#form {width:100%; max-width:550px; margin:0 auto;}
#form input {width:96%; margin:15px 0; padding:10px 2% !important;}
#form input[type='submit'] {width:100%; padding:10px 2% !important;}
#form input[type='text'] {border:1px solid #ccc; box-shadow:2px 2px 8px #ddd inset; padding:10px 20px; font-size:19px; border-radius:8px;}
#form textarea {border:1px solid #ccc; box-shadow:2px 2px 8px #ddd inset; padding:10px 2%; font-size:19px; border-radius:8px; height:160px; width:96%; max-width:96%; margin:15px 0; font-family:'Segoe UI',Arial,sans-serif;}


#leftMenu {float:left; width:30%;}
#leftMenu ul {margin:0; padding:0; list-style:none;}
#leftMenu li {margin:4px 0 4px 20px; padding:0; list-style:none;}
.sublabel {margin:20px 0 8px 0;}
.sublabel a {font-weight:bold;}

#pageRight {float:left; width:65%; margin:0 0 40px 5%;}
.prod_itm {width:47%; float:left; margin:50px 1% 0 1%; text-align:center; border-radius:12px; border:1px solid #0d5da2; border-bottom:4px solid #0d5da2;}
.prod_itm img {width:90%;}
iframe {border:none;}

.gallery_itm {width:30%; float:left; cursor:pointer; margin:50px 1.5% 0 1.5%; height:400px; position:relative; text-align:left; border-radius:12px; border:1px solid #0d5da2; border-bottom:4px solid #0d5da2; overflow:hidden;}
.gallery_itm img {width:100%;}
.gallery_itm h4 {position:absolute; padding:0; margin:0; bottom:10px; left:10px; display:inline-block; background:url(img/black.png); padding:3px 10px; color:#fff;}

.videopic {display:inline-block; margin:25px 0; width:500px;  position:relative; text-align:center;}
.videopic.w50 {float:left; width:45%;}
.videopic img {width:100%;}

.w50 {float:left; width:45%; padding-right:5%;}


/*products self */
.img_thumbs {float:left; width:30%; padding:15px 1%; border-radius:15px; box-shadow:2px 2px 9px #75a2c9; margin:20px 4% 30px 0; position:relative; text-align:center; background:#fff url(img/zoom.png) no-repeat; background-position:97% 3%;}
.img_thumbs .big {width:90%; cursor:pointer;}
.img_thumbs .thumbs img {width:80px; border:2px solid #fff;}
.img_thumbs .thumbs img.active {border:2px solid #0d5da2;}
.prod_right {float:left; width:44%;}
.prod_right.w70 {width:60%;}
.colors {float:right; text-align:center; margin-top:140px;}




footer {background:#04579f; padding:60px 5% 50px 5%; width:90%; color:#fff;}
footer a {color:#fff;}
footer a:hover {color:#76bfff;}
footer .logo {float:left;}
footer .cnt {float:left; padding-left:10%;}
footer .materials {float:left; padding-left:10%; text-align:center; width:150px; margin-top:-10px;}
footer .iso {float:left; padding-left:20%;}
footer .adr {padding:10px 0 10px 65px; background:url(img/adr.png) no-repeat left center;}
footer .tel {padding:10px 0 10px 65px; background:url(img/tel.png) no-repeat left center;}
footer .email {margin-top:16px; padding:10px 0 10px 65px; background:url(img/email.png) no-repeat left center;}

#IMGpreview {display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:999;}
#prev_bg {position:fixed; width:100%; height:100%; top:0; left:0;}
#prev {background:#fff url(img/loader.gif) no-repeat center center; padding:10px; position:absolute; top:50%; left:50%; width:300px; height:300px;
	margin:-150px 0 0 -150px; border-radius:0;
}
#prevIMGBut,#nextIMGBut,#closeIMGBut {position:absolute; cursor:pointer;}
#prevIMGBut {top:50%; left:10px; margin-top:-14px;}
#nextIMGBut {top:50%; right:10px; margin-top:-14px;}
#closeIMGBut {top:10px; right:10px;}

#prod1_video {position: relative; width:650px; height: 442px;}

canvas {user-select: none;}

#calc_form {position:absolute; z-index:100; top:150px; left:50%; margin-left:-220px;}
#calc_form input,.txtf {font-size:19px; border:1px solid #ccc; box-shadow:2px 2px 8px #ddd inset; padding:10px 20px; font-size:19px; border-radius:8px; width:400px; margin:15px 0;}
#calc_form textarea {border:1px solid #ccc; box-shadow:2px 2px 8px #ddd inset; padding:10px 2%; font-size:19px; margin:15px 0 0 0; border-radius:8px; height:250px; max-height:250px; width:430px; max-width:430px; font-family:'Segoe UI',Arial,sans-serif;}
#calc_form textarea.two {float:left; margin-right:15px;}
.paddedr {padding-right:35px;}
#loader {position:absolute; left:50%; bottom:-150px;}




@media screen and (max-width:1800px) {
	footer .cnt {padding-left:5%;}
	footer .materials {padding-left:7%;}
	footer .iso {padding-left:7%;}
	#marina h1 {font-size:44px; line-height:46px;} 
}
@media screen and (max-width:1650px) {
	/*prod colors & text*/
	.img_thumbs {width:40%;}
	.prod_right,.prod_right.w70 {width:54%;}
	.colors {float:left; margin:45px 0 0 -15px;}
}
@media screen and (max-width:1450px) {
	.p1 {padding-left:0;}
}
@media screen and (max-width:1300px) {
	footer .cnt {padding-left:50px; width:40%;}
	footer .materials {clear:both; padding:50px 0 0 270px;}
	footer .iso {padding:80px 0 0 130px;}
	#menu div {margin:0 3px;}
	.glr_itm {width:31%;}
	.glr_itm.n4 {clear:none;}
	.glr_itm.n3 {clear:both;}
	#assembl {text-align:center;}
	.p1,.yt {display:block; margin:0 auto; text-align:center; float:none;}
	.yt {margin-top:40px;}
}
@media screen and (max-width:1080px) {
	.w50 {width:100%; padding-right:0;}
	h1.lined {display:inline-block; text-align:center; background:none; padding:0 20px;}
	h1.lined span {background:none; padding:0 0; white-space:normal;}
	#top {width:95%; max-width:95%; margin:0 auto 55px auto;}
	#menu {display:none;}
	#logo {margin-top:25px;}
	header {height:400px;} 
	header h1 {font-size:44px; line-height:46px;} 
	#marina h1 {padding:70px 3% 25px 3%;}
	header h1.darkline {padding:5px 5% 15px 5%;}
	#menu2 {display:block;}
	.gallery_itm {width:46%;}
	a img.yt2,a img.yt {width:80px; position:absolute; top:50%; left:50%; margin:-25px 0 0 -40px;}
	.glr_itm {width:47%; min-height:530px;}
	.glr_itm.n3 {clear:none;}
	.glr_itm.n2 {clear:both;}
	#advantages .itm {width:47%;}
	h1.dck {padding:15px 0 15px 80px; background-size:auto 80%;}
	
	#leftMenu {width:40%;}
	#pageRight {width:54%;}
	.prod_itm {width:97%;}
	
	.img_thumbs {width:100%; margin-top:0;}
	.img_thumbs .big {max-width:450px;}
	.prod_right,.prod_right.w70 {width:60%;}
	.prod_right.nocolors {width:95%;}
	.colors {float:right; margin:0; width:30%;}
	.colors img {width:100%;}
}
@media screen and (max-width:800px) {
	header h1 {font-size:40px; line-height:42px;} 
	footer .cnt {clear:both; padding:40px 0 0 0; width:90%;}
	footer .materials {clear:both; padding:50px 0 0 0;}
	footer .iso {padding:80px 0 0 105px;}
	.gallery_itm {width:97%;}
	.instr_itm {width:97%;}
	header button {margin-top:25px}
	.glr_itm {width:98%; min-height:auto;}
	#advantages .itm {width:98%;}
	.p1 {width:85%;}
	button.yt {border-radius:12px; padding:10px 70px 10px 16px; font-size:22px;}
	h1.dck {padding:10px 0 10px 60px; background-size:auto 66%;}
	#leftMenu {display:none;}
	#pageRight {width:93%;}
	.prod_right,.prod_right.w70 {width:95%;}
	.colors {float:left; clear:both; margin:25px 0 0 0; width:unset;}
	.colors img {width:unset;}
	#prod1_video {width:100%; height:442px;}
	.videopic {margin-left:-10px; max-width:100%;}
	.videopic.w50 {float:none; width:auto;}
}