@font-face {
  font-family: ib; /* Имя шрифта */
  src: url(../fonts/Intro-Black.otf); /* Путь к файлу со шрифтом */
}
@font-face {
  font-family: pp; /* Имя шрифта */
  src: url(../fonts/Posterizer_KG_Rounded.woff); /* Путь к файлу со шрифтом */
}
* { margin:0; padding:0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; outline:none; outline-style:none;}
li { list-style:none;}
a img { border:none;}
a { text-decoration:none;}
html,body { width: 100%;height: 100%;}
canvas { position:fixed; top:0; left:0; z-index:99999; pointer-events:none;}
body { background:#17476B url(../img/bg.jpg) no-repeat 50% 50%; background-size:auto 100%; background-attachment:fixed; font-family:"Trebuchet MS", Helvetica, sans-serif; min-width:360px; overflow-x:hidden;} 
.wraper { position:relative; height: 100%; width: 100%;}

.wraper > div { position:relative;left:0; width: 100%; height: 100%; display: table;}
.wraper > div.block1 { top:0%; padding-bottom: 80px;}
.block1_box { display: table-cell; vertical-align: middle; font-size:0; color:#FFF;}
.logo { text-align: center; margin-bottom: 20px;}
.logo img { max-width:100%; height:auto; width:auto;}
@media (max-width: 460px){ 
.logo { text-align: center; margin-bottom: 10px; padding:0 20px;}
.logo img { max-width:100%; height:auto; width:100%;}
}
.motto { background:url(../img/bgmotto.png) no-repeat 50% 50%; text-align: center; padding:15px 0 15px 0;}
.motto h6 { font:21px/120% ib; text-transform: uppercase; padding-bottom: 2px;}
.motto p {font-size:13.78px; line-height: 110%; letter-spacing:-0.3px; padding-right: 17px;}
.hfooter { text-align: center; padding-top: 15px;}
.hfooter p { font-size:16px;}
.strdown { display: block !important; width: 100%; position:absolute; bottom:10%; left:0;}
.strdown > a{ background:url(../img/strelka.png) no-repeat 50% 50%; width: 34px;height: 34px; display: block; margin:0 auto;}
.strdown > p { text-align: center; color:#FFF; font-size: 16px; line-height: 100%; text-transform: uppercase; margin-bottom: 10px;}

.wraper > div.block2 { padding-top:0px;overflow:hidden; }
div.block2_box { display: table-cell; vertical-align: middle;} 
.strup  { display: block !important; width: 100%; position:absolute; top:10%; left:0;}
.strup > a { background:url(../img/strelka1.png) no-repeat 50% 50%; width: 34px;height: 34px; display: block; margin:0 auto;}

.feedback { background:url(../img/bgform.png) no-repeat 50% 50%; width: 430px; height: 310px; margin:0 auto; position:relative;}
@media (max-width: 460px){ 
.feedback { background:url(../img/bgform.png) no-repeat 50% 50%; width: 100%; height: 310px; margin:0 auto; position:relative;}
}
.mail { background:url(../img/mail.png) no-repeat 50% 50%; width: 134px; height: 105px; position:absolute; bottom:-30px; right:-60px;}
.feedback form { font-size:0; padding:5px 30px;}
.feedback form h6 { background:url(../img/mailbg.png) no-repeat 50% 50%; text-align: center; font:bold 16px/100% pp; margin-bottom: 20px; text-transform: uppercase; color:#046C97; padding:7px 0 15px; margin-top: 10px;}
.feedback form input { padding:10px 8px; background:#5586B5; color:#FFF; font-size:14px;font-family:"Trebuchet MS", Helvetica, sans-serif; border:dashed 1px #FFF;}
.feedback form input.i50 { width:48%; margin-right:4%; display: inline-block; vertical-align: middle;}
.feedback form input.i50.er { margin-right: 0;}
.feedback form input[type="submit"] { cursor:pointer; display: block; margin:0 auto; background:#98CC16 url(../img/ok.png) no-repeat 20px 50%; padding:10px 20px 10px 60px;font-family:"Trebuchet MS", Helvetica, sans-serif; font-size:18px; font-weight:bold; text-transform: uppercase; border:none;}
.feedback form input[type="submit"]:hover {background:#ACE02A url(../img/ok.png) no-repeat 20px 50%;} 
.feedback form textarea { resize:none; display: block; width: 100%; font-size:14px;font-family:"Trebuchet MS", Helvetica, sans-serif; border:dashed 1px #FFF; background:#5586B5; margin: 15px 0; height:100px; padding:10px 8px; color:#FFF; font-size:14px;font-family:"Trebuchet MS", Helvetica, sans-serif; }
.footer { margin-top: 30px; top:300px; position:absolute; width:100%;}
.footer p { text-align: center; font:19px/100% pp; text-transform: uppercase; color:#FFF; position:relative;}
.footer p span { text-align: center; position:absolute; left:0; right:0; margin:0 auto; padding:20px 0 20px 50px;}
.footer p > a { position:absolute; left:0; right:0; background:url(../img/vk.png) no-repeat 50% 50%; width:45px; height:45px; margin:0 auto; top:10px;}
.feedback > p { font:22px/100% ib; text-transform:uppercase; color:#FFF; text-align: center; padding-top: 30px; display: none;}

.bg { display: block; position:absolute; width: 100%; left:0; z-index:-1;top:45%;}
.bg1 { background:url(../img/1.png) no-repeat 50% 50%; height: 415px;} 
.bg2 { background:url(../img/2.png) no-repeat 50% 50%; height: 299px; margin-top: 120px;}
.bg3 { background:url(../img/3.png) no-repeat 50% 50%; height: 274px; margin-top: 70px;}
.bg4 { background:url(../img/4.png) no-repeat 50% 50%; height: 387px; margin-top: 80px;}