@font-face {font-family: "OpenSans-Regular";
    font-weight: normal;
    font-style: normal;
	src: local('Open Sans'), local('OpenSans-Regular'),
	url("../fonts/OpenSans-Regular.woff") format("woff"),
	url("../fonts/OpenSans-Regular.ttf") format("truetype");}
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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;}
* html .clear {height:1%;}
*{-webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;}
  
body {margin: 0; padding:0; background: url("../images/fon-site.jpg") no-repeat fixed; background-size: cover; 
color: #000; font-family:"OpenSans-Regular", serif;}
.cd-content {width:1100px; margin:0 auto; background-color: rgba(255,255,255,0.95); padding:10px; text-align:center;}
h2 {font-size: 17px; font-weight: bold; text-align: center; color:#2D5E94;}
a {color: #FFF; font-weight:bold; text-decoration: none;}
a:hover {color: #393939;}
#wrapper {position: relative; overflow: hidden;}
#inner-wrapper {width: 960px; margin: 0 auto;}
#content {padding: 20px 5px; font-weight:bold; font-size:16px;}
.plus {width:180px; margin: 10px 40px; float:left;}
#ex1 {min-height:350px;}
#title {font-size:31px; width:100%; display:block; text-align:center; font-weight:bold; padding: 35px 0px 10px 0px; color:#2D5E94;}
.cleaner {width:100%; height:110px;} 
.blvozm {width:490px; float:left; padding:10px;}

.effect-layla h2 { color:#FFFFFF; font-weight:bold;}
.zayvka input {border:2px solid #81BDFF; width:230px; float:left; padding: 5px 10px 0px 55px; color:#2D5E94; margin:-10px 10px;
border-radius:25px; height: 50px;}
.zayvka {background-color: rgba(240,248,255,0.5); border:2px solid #FFFFFF; padding:10px; margin:10px; height: 110px;}
.zayvka button {background: none; border: none; font-size: 18px; color: #2D5E94; position: relative; display:block;
text-decoration: none; margin: 20px auto; text-decoration:none; text-align:center; width:150px; letter-spacing: 2px;
border-bottom: 2px solid transparent;}
.zayvka button:hover, .zayvka button:focus{outline: none; border-bottom: 2px solid #81BDFF;}
.zayvka button::before, .zayvka button:after{position: absolute; top: 50%; left: 50%; width: 70px; height: 70px; border-radius: 50%;
border: 12px double rgba(0,0,0,0.1); content: ''; opacity: 0;
-webkit-transform: translateX(-50%) translateY(-50%) scale(0.2);
-moz-transform: translateX(-50%) translateY(-50%) scale(0.2);
transform: translateX(-50%) translateY(-50%) scale(0.2);}
.zayvka button:after{width: 60px; height: 60px; border-width: 6px;
-webkit-transform: translateX(-50%) translateY(-50%) scale(0.8);
-moz-transform: translateX(-50%) translateY(-50%) scale(0.8);
transform: translateX(-50%) translateY(-50%) scale(0.8);}
.zayvka button:hover:before, .zayvka button:hover:after{
-webkit-animation: pulsate 1.2s infinite;
-moz-animation: pulsate 1.2s infinite;
-ms-animation: pulsate 1.2s infinite;
animation: pulsate 1.2s infinite;}

.zakon {float: left; padding: 15px;}
.zakon a {color:#0E1A52; font-weight:bold; text-decoration: underline;}
.name-user {background: #FFFFFF url("../images/user.png") no-repeat 10px;}
.mail {background: #FFFFFF url("../images/email.png") no-repeat 10px;}
#telephone, #telephone2 {background: #FFFFFF url("../images/telephone.png") no-repeat 10px;}

@-webkit-keyframes pulsate{
30% {opacity: 1; -webkit-transform: translateX(-50%) translateY(-50%) scale(1);}
100% {opacity: 0.3; -webkit-transform: translateX(-50%) translateY(-50%) scale(0.5);}
}
@-moz-keyframes pulsate{
30% {opacity: 1; -moz-transform: translateX(-50%) translateY(-50%) scale(1);}
100% {opacity: 0.3; -moz-transform: translateX(-50%) translateY(-50%) scale(0.5);}
}
@-ms-keyframes pulsate{
30% {opacity: 1; -ms-transform: translateX(-50%) translateY(-50%) scale(1);}
100% {opacity: 0.3; -ms-transform: translateX(-50%) translateY(-50%) scale(0.5);}
}
@-keyframes pulsate{
30% {opacity: 1; transform: translateX(-50%) translateY(-50%) scale(1);}
100%{opacity: 0.3; transform: translateX(-50%) translateY(-50%) scale(0.5);}
}

#ex3 {min-height:800px;}
#ex3 h2 {font-size:20px;}
#ex3 .fadeInUp img {float:left; margin-right:15px;}
#ex3 .fadeInUp {height:220px;}

#ex4 .bounceIn {width:240px; margin:10px; float:left;}
#ex4 .text {text-align:center; border-bottom:1px solid #2D5E94; min-height: 100px; margin: 10px 0px;}

#navigation {margin:-45px 0px 0px 180px;}
.head-content {height: 85px; background-color: #FFFFFF; border-bottom:1px solid #2D5E94;}
#header {height: 85px; width:1100px; margin:0 auto;}

@media screen and (min-width: 641px) {
button.menu {display: none;}
#navigation > ul {margin-left: 124px; padding: 0; list-style-type: none;}
#navigation > ul:after {content: " "; display: block; line-height: 0; height: 0; width: 100%; clear: both;}
#navigation > ul > li {float: left;}
#navigation > ul > li + li {margin-left: 5px;}
#navigation > ul > li > a {height:40px; display: block; font-size:14px; font-weight:bold; color: #2D5E94; padding: 15px 5px;
	-webkit-transition: all .3s;
	   -moz-transition: all .3s;
	    -ms-transition: all .3s;
	     -o-transition: all .3s;
	        transition: all .3s;
}
#navigation > ul > li > a:hover { }
#navigation.fixed {position: fixed; top: 0; width: 1100px; margin:0 auto; height: 40px; font-size:14px;
background: #FFFFFF url("../images/logo-small.png") no-repeat left top;}
}

@media screen and (max-width: 1025px) {
body {background: #FFFFFF;}
#navigation {margin: -55px 0px 0px 180px;}
.head-content {height: 85px; background-color: #FFFFFF; border-bottom: none;}
}

@media screen and (max-width: 769px) {
#navigation {margin: -50px 0px 0px 180px;}
.head-content {height: 85px; background-color: #FFFFFF; border-bottom: none;}
#navigation {width: 100%;}
#navigation > ul > li > a {padding: 0px 9px;}
}

@media screen and (max-width: 640px) {
.movie {display:none;}
button { background:none; border: none;}
button.menu::before {content: '\2261 Меню';	font-size: 22px; font-family:"OpenSans-Regular", serif; color:#004368; width:150px;}
button.menu[aria-expanded="true"]::before {content: '× (закрыть меню)';}
nav ul {list-style: none; width: 100%; margin: 0; padding: 0; display: none;}
[aria-hidden="false"] {display: block;}
#navigation ul { background-color:rgba(255,255,255,1.00);}
#navigation ul li {width:210px; height:40px; padding: 10px; margin:5px;}
#navigation ul li a {padding: 10px; color: #2D5E94; font-size:15px; font-weight:bold; border-bottom:1px solid #FFFFFF;
line-height:1.1;}

#navigation {margin: 10px 0px 0px 30px;}
#navigation.fixed {position: fixed; top: 0; width: 100%; margin:0 auto; border-radius: 0px; height: 40px; font-size:14px;
background: #FFFFFF !important;}
}

@media screen and (max-width: 440px) {
#logo img {width:90%;}
.information {float: left !important;}
.head-content {height: 180px;}
.plus {width: 100%; margin: 10px; float: none;}
.blvozm {width: 100%; padding: 7px;}
#ex4 .bounceIn {width: 100%; margin: 10px; float: none;}
.cd-content, #header {width: 100% !important;}
#ex4 .bounceInUp img, .firstform {display:none;}
#navigation {margin: 80px 0px 0px 0px; background-color:#F0F8FF;}
#navigation ul li a { display:block; background-color: #FFFFFF;}
#ex3 .fadeInUp {height: 100%;}
#ex1, #ex3 {min-height: 100%;}
#ex3 .fadeInUp img {float: none;  margin: 0;}
.information .phone, .information .mail {float: none !important;}
.zayvka input {width:100%; margin:5px;}
}

#navigation {position:absolute; z-index: 500; height: 40px; font-size:14px; padding: 0px 20px; }
#navigation.fixed a, #navigation.fixed a:hover {background: #FFFFFF; padding: 0px; color:#2D5E94; padding: 10px;}

.information {float: right; margin-top: 8px;}
.information .phone, .information .mail {font-weight:bold; float:left;}
.information .phone {min-height:42px; min-width:45px; padding: 0px 0px 0px 27px; margin: 0px 25px 0px 0px; font-size: 18px;
background: url("../images/phone.png") no-repeat top left; font-weight:bold;}
.information .mail {min-height:22px; min-width:31px; padding: 0px 0px 0px 37px; font-size: 18px;
background: url("../images/mail.png") no-repeat top left; font-weight:bold;}

.separator {clear: both; overflow: hidden; height: 50px;}
.section {padding: 2rem;height: 30rem;position: relative;text-align: center;}
.section:nth-child(2n+2) {background-color: #eee;}
.section .label {position: absolute;padding: .375rem;box-sizing: border-box;
color: #999;border: 1px solid #999;top: 0;left: 2rem;background-color: #fff;height: 2rem;}

strong {font-weight:bold; color:#092543;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';	content: none;}
table {border-collapse: collapse; border-spacing: 0;}
.video {width:620px; height:535px;}
.video img {z-index:10; position: absolute; padding: 10px;}
.movie .v2 {position: absolute; margin: 170px 0px 0px 10px; z-index: 80;}
.movie {height:520px; width:1100px; margin:0 auto;}
#video_background {width: 600px; z-index:1; overflow: hidden; margin:25px 0px 0px 15px;}

.rw-words{ margin:0px 0px 0px -135px; width:400px; text-align:center; font-size: 34px; position: absolute; font-weight: bold;
display: inline; text-indent: 10px; z-index:100;}

.rw-words-1 span {margin-top: 260px; width: 400px;
	position: absolute;
	opacity: 0;
	overflow: hidden;
	color: #000000;
	-webkit-animation: rotateWord 18s linear infinite 0s;
	-moz-animation: rotateWord 18s linear infinite 0s;
	-o-animation: rotateWord 18s linear infinite 0s;
	-ms-animation: rotateWord 18s linear infinite 0s;
	animation: rotateWord 18s linear infinite 0s;
}
.rw-words-1 span:nth-child(2) {
    -webkit-animation-delay: 3s; 
	-moz-animation-delay: 3s; 
	-o-animation-delay: 3s; 
	-ms-animation-delay: 3s; 
	animation-delay: 3s; 
	color: #000000;
}
.rw-words-1 span:nth-child(3) {
    -webkit-animation-delay: 6s; 
	-moz-animation-delay: 6s; 
	-o-animation-delay: 6s; 
	-ms-animation-delay: 6s; 
	animation-delay: 6s; 
	color: #000000;	
}
.rw-words-1 span:nth-child(4) {
    -webkit-animation-delay: 9s;
	-moz-animation-delay: 9s; 
	-o-animation-delay: 9s; 
	-ms-animation-delay: 9s; 
	animation-delay: 9s; 
	color: #000000;
}
@-webkit-keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; -webkit-transform: translateY(-30px); }
	5% { opacity: 1; -webkit-transform: translateY(0px);}
    17% { opacity: 1; -webkit-transform: translateY(0px); }
	20% { opacity: 0; -webkit-transform: translateY(30px); }
	80% { opacity: 0; }
    100% { opacity: 0; }
}
@-moz-keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; -moz-transform: translateY(-30px); }
	5% { opacity: 1; -moz-transform: translateY(0px);}
    17% { opacity: 1; -moz-transform: translateY(0px); }
	20% { opacity: 0; -moz-transform: translateY(30px); }
	80% { opacity: 0; }
    100% { opacity: 0; }
}
@-o-keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; -o-transform: translateY(-30px); }
	5% { opacity: 1; -o-transform: translateY(0px);}
    17% { opacity: 1; -o-transform: translateY(0px); }
	20% { opacity: 0; -o-transform: translateY(30px); }
	80% { opacity: 0; }
    100% { opacity: 0; }
}
@-ms-keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; -ms-transform: translateY(-30px); }
	5% { opacity: 1; -ms-transform: translateY(0px);}
    17% { opacity: 1; -ms-transform: translateY(0px); }
	20% { opacity: 0; -ms-transform: translateY(30px); }
	80% { opacity: 0; }
    100% { opacity: 0; }
}
@keyframes rotateWord {
    0% { opacity: 0; }
    2% { opacity: 0; transform: translateY(-30px); }
	5% { opacity: 1; transform: translateY(0px);}
    17% { opacity: 1; transform: translateY(0px); }
	20% { opacity: 0; transform: translateY(30px); }
	80% { opacity: 0; }
    100% { opacity: 0; }
}