/* CSS Document */
html, body {
	margin:0;
	padding:0;
	font-family: Arial, Helvetica, sans-serif;
	border:0px solid yellow;
}

div.osnova {
/*    margin: 0 auto;	*/
    margin: 0px auto;
    width: 100%;
    text-align: center;
    max-width: 100%; /* контейнер не превышает 90% ширины экрана */
    min-width: 300px;
	border:0px solid green;
}

.left_column{ position: fixed; top:0px; left:0px; width:12.5%; height:100%; background: url(../images/white_prozr.png) repeat top center; z-index:200; overflow:auto; }
.logo {
    max-width: 80%;
    height: auto;
    padding: 10px 0px 0px 0px; /* небольшие оступы для изображений */
}

.logo_mobile{ display:none; position:absolute; top:0%; left:12.5%; width:87.5%; height:50px; background: url(../images/white_prozr.png) repeat top center; border:0px solid green; }

/* left 13 94 */

.str_left{ position:absolute; top:95%; left:44%; width:5%; height:5%; z-index:10; border:0px solid green; }
.str_right{ position:absolute; top:95%; left:63%; width:5%; height:5%; z-index:10; border:0px solid green; }

.str_left img { max-width:100%; max-height:100%; padding: 0px 0px 0px 0px; }
.str_right img { max-width:100%; max-height:100%; padding: 0px 0px 0px 0px; }

.nums{ position:absolute; top:95%; left:12.5%; width:87.5%; height:5%; text-align:center; border:0px solid green; }
.nums a{ color:#7a6858; text-decoration:none; font-style:italic; font-weight:bold; font-size: 14px; line-height:14px; margin:0px 5px; padding:0px; } 
.nums span {
	padding: 0px 5px;
	border: 3px solid #ffffff;
	background-color:#FFFFFF;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	opacity: 0.5;
}
.nums a:hover{ color:#000000; }
.nums span:hover{ opacity: 0.9; }

.nums_active{ color:#000000; }
.nums_active span{ opacity: 0.9; }


.menu{ text-align:left; margin-top:40%; }
.menu ul{ list-style:none; padding-left:0px; border:0px solid green; }
.menu li{ margin-left:10%; margin-right:10%; border:0px solid green; }

.menu a{ color:#666666; text-decoration:none; font-size:14px; line-height:26px; }
.menu a:hover{ text-decoration:underline; }
.menu b{ font-size:16px; line-height:30px; }

.menu_sub > ul {
  opacity:0;
  height:0px;
  visibility:hidden;
  -webkit-transition: all 3s linear;
  -moz-transition: all 3s linear;
  -o-transition: all 3s linear;
  transition: all 3s linear;
}
.menu_sub:hover > ul {
  opacity:1;
  height:100%;
  visibility:visible;
  -webkit-transition: all 2s linear;
  -moz-transition: all 2s linear;
  -o-transition: all 2s linear;
  transition: all 2s linear;
}

.menu_sub li{ border-bottom:1px solid #c6c7c6; }
.menu_sub li.last_line{ border-bottom:none; }


.menu_short{ display:none; }
.lines {
    /*max-width: 80%;*/
    height: auto;
    padding: 10%; /* небольшие оступы для изображений */
	cursor:pointer;
}

.menu_short_show{ position:fixed; top:0%; left:12.5%; width:40%; height:100%; background: url(../images/white_prozr.png) repeat top center; z-index:100; overflow:scroll; border:0px solid green; }
.menu_short_show{ display:none; }
.menu_short_show{ text-align:left; }
.menu_short_show ul{ list-style:none; padding-left:0px; margin:1% 10% 10% 10%; border:0px solid green; }
.menu_short_show li{ margin: 4px 10% 0px 10%; padding:0px; border:0px solid green; }
.menu_short_show li li{ margin: 0px 10% 0px 10%; }

.menu_short_show b{ font-size:13px; line-height:20px; padding:0px; margin:0px; }
.menu_short_show a{ color:#666666; text-decoration:none; font-size:12px; line-height:12px; }
.menu_short_show a:hover{ text-decoration:underline; }

.main_field{ position:absolute; top:0px; left:12.5%; width:87.5%; height:100%; /* background: url(../images/white_prozr.png) repeat top center; padding:2%;*/ text-align:left; border:0px solid green; }
.main_index{ position:absolute; top:0px; left:12.5%; width:87.5%; height:100%; padding:2%; text-align:left; border:0px solid green; }
.arts_field{ position:absolute; top:5%; left:22.5%; width:67.5%; height:80%; background: url(../images/white_prozr.png) repeat top center; padding:2%; text-align:left; border:0px solid green; }

.more_info{ position: fixed; bottom:0px; right:0px; width:150px; height:40px; text-align:right; line-height:40px; padding-right: 2%; z-index: 10; 
  background: -webkit-gradient(linear, left top, right top, color-stop(-10%,rgba(255,255,255,0)), color-stop(51%,rgba(255,255,255,0.9)), color-stop(100%,rgba(255,255,255,0.9)));
  background: -webkit-linear-gradient(left,  rgba(255,255,255,0) -10%,rgba(255,255,255,0.9) 51%,rgba(255,255,255,0.9) 100%);
  background: -o-linear-gradient(left,  rgba(255,255,255,0) -10%,rgba(255,255,255,0.9) 51%,rgba(255,255,255,0.9) 100%);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255,255,255,0)), color-stop(51%, rgba(255,255,255,0.9)), to(rgba(255,255,255,0.9)));
  background: -webkit-linear-gradient(left, rgba(255,255,255,0) -10%, rgba(255,255,255,0.9) 51%, rgba(255,255,255,0.9) 100%);
  background: -o-linear-gradient(left, rgba(255,255,255,0) -10%, rgba(255,255,255,0.9) 51%, rgba(255,255,255,0.9) 100%);
  background: linear-gradient(to right,  rgba(255,255,255,0) -10%,rgba(255,255,255,0.9) 51%,rgba(255,255,255,0.9) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#e6ffffff',GradientType=1 );
  border:0px solid green; 
}

.more_info1{ line-height: 35px; vertical-align:top; padding-bottom: 5px; }


.book4_body{ /* float:right; */ text-align:left; }
.book4_body table{ border-collapse:separate; padding: 4px 0px; }
.book4_body table tr td{ padding: 4px 0px; }
.book4_body input{ width:500px; height:25px; margin:5px; border:1px solid #a7a7a7; }
.book4_body span{ color:#fe5d00; }
.book4_body textarea{ width:500px; height:70px; margin:5px; border:1px solid #a7a7a7; }

.testim { width:100%; }
.testim div { width:19%; height:auto; text-align: center; margin:5px; padding-bottom:20px; border: 0px solid #CCCCCC; vertical-align:sub; float: left; }
.testim div img { width:100%; height:auto; }

.testim_text{ width:100%; clear:both; }
.testim_text b{ font-style:normal; }
.testim_text a{ color: #666666; }

.testim_text div{ float:left; width:30%; height:420px; padding:2% 5%; margin:0.8% 1%; border:1px solid #b4b4b4; font-size:13px; }
.testim_text div{ background:url(../images/qwo_left.jpg) no-repeat 0.4% 15%, url(../images/qwo_right.jpg) no-repeat 99.6% 95%; }
.testim_text div span{ color:#000000; font-weight:bold; font-style:normal; font-size:200%; }


.video { width:100%; }
.video div { width:24%; height:auto; text-align: center; margin:5px; padding-bottom:20px; border: 0px solid #CCCCCC; vertical-align:sub; float: left; }
.video div img { width:100%; height:auto; }


@media screen and (min-width: 2000px) {
	.testim_text div{ height:300px; }
}

@media screen and (max-width: 2000px) {
	.testim_text div{ height:360px; }
}

@media screen and (max-width: 1600px) {
	.testim_text div{ height:400px; }
}

@media screen and (max-width: 1400px) {
	.str_left{ left:42%; }
	.str_right{ left:65%; }
	.testim_text div{ width:48%; height:290px; padding:2% 6%; }
}

@media screen and (max-width: 1300px) {
	.testim div { width:205px; height:200px; }
	.video div { width:205px; height:200px; }
}

@media screen and (max-width: 1100px) {
	.str_left{ left:40%; }
	.str_right{ left:67%; }
	.testim_text div{ height:350px; padding:2% 7%; }
	.testim_text div{ background:url(../images/qwo_left.jpg) no-repeat 0.4% 15%, url(../images/qwo_right.jpg) no-repeat 99.6% 95%; }
}

@media screen and (max-width: 1000px) {
	.menu a{ font-size:12px; line-height:22px; }
	.menu b{ font-size:14px; line-height:26px; }
	.str_left{ left:38%; }
	.str_right{ left:69%; }

	.book_out4{ width:100%; }
	.book4_body input{ width:100%; height:30px; }
	.book4_body textarea{ width:100%; height:50px; }

	.testim_text div{ width:98%; height: auto; }
	.testim_text div{ background:url(../images/qwo_left_sm.jpg) no-repeat 0.4% 50px, url(../images/qwo_right_sm.jpg) no-repeat 99.6% 95%; }
}

@media screen and (max-width: 800px) {
}

@media screen and (max-width: 767px) {
	.menu{ display:none; }
	.menu_short{ display: block; }

	.logo_pc{ display:none; }
	.logo_mobile{ display:block; }
	.logo{ padding-top:5px; }
	.lines {
	    padding: 50px 10px 10px 12px; /* небольшие оступы для изображений */
	}
}
@media screen and (max-width: 750px) {
	.nums{ position:absolute; top:95%; left:12.5%; width:87.5%; height:5%; text-align:center; border:0px solid green; }
	.nums a{ font-size: 12px; line-height:12px; }
	.nums span {
		border: 3px solid #ffffff;
		border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		-khtml-border-radius: 10px;
	}
	.str_left{ left:34%; }
	.str_right{ left:72%; }
}
@media screen and (max-height: 680px) {
/*
	.book4_body{ float:right; }
*/
	.book4_body #a1{ float:left; }
}
@media screen and (max-width: 650px) {
	.str_left{ left:30%; }
	.str_right{ left:76%; }
	.testim_text div{ padding:2% 10%; }
}

@media screen and (max-width: 800px) {
}

@media screen and (max-width: 500px) {
	.str_left{ left:13%; }
	.str_right{ left:94%; }
	.left_column { width: 16%; }
	.main_field { left: 16%; width: 84%; }
	.menu_short_show{ width:60%; }
	.testim_text div{ padding:2% 15%; }
	.testim_text div{ background:url(../images/qwo_left_sm.jpg) no-repeat 0.4% 40px, url(../images/qwo_right_sm.jpg) no-repeat 99.6% 95%; }
}

@media screen and (max-height: 600px) {
	.str_left img { max-height:80%; }
	.str_right img { max-height:80%; }
}