/* цвет заднего фона */
body {
	background-color:#FFFFFF;
}

/* это само содержимое */
#container {
	line-height:1.6em;
	background-color:#FFFFFF;
	margin:auto;
	width:1200px;
	height:auto;
	color:#666;
	font-size:16px;
}

#logo {
	float:none;
	width:1200px;
	height:120px;
	padding-top:1px;
	background-image:url(images/logo.gif);
	z-index:2;
}	

#rasshifrovka {
	width:1200px;
	color:#333333;
	text-align:center;
	border-bottom:#EEAA77 4px solid;
	margin-bottom:10px;
	font-size:13px;
	z-index:4;
}

#navigation {
	width: 180px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	line-height: 1.6em;
	color: #668;
	margin-left:20px;
	float:left;
	z-index:5;
}

#navigation ul {
			margin-left: 0;
			padding-left: 0;
			list-style-type: none;			
			width: 150px;
			font-size:14px;
			z-index:5;
}

#navigation a {
	display: block;
	padding: 5px;
	width: 180px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #666;
	z-index:5;
}

#navigation a:link, #navlist a:visited {
	color:#666666;
	text-decoration: none;
	z-index:5;
}
		
#navigation a:hover {
	background: #000000 url("images/arrow.gif") 98% 50% no-repeat;
	background-color: #FFFFCC;
	color:#394922;
	z-index:5;
}

#texnavlist {
	font-size:14px;
	text-align: center;
	margin:0px 8px 0px 8px;
	padding-top:15px;
	padding-bottom:10px;
	line-height: 1em;
}

#h1 {
	text-align: center;
	color:#661;
}

#h2 {
	color:#661;
}

#h3 {
	color:#661;
}

#h4 {
	color:#661;
}

#content {
	width: 940px;
	margin-left: 240px;
	margin-bottom:auto;
	color: #333333;
	text-align: justify;
	text-indent: 25px;
	font-size: 16px;
}

#content p {
		line-height: normal;
		margin:0px;
}

#content li {
		line-height: normal;
		margin:0px;
}

#map {
	float:none;
	width:auto;
	height:500px;
	padding-top:1px;
	
	z-index:2;
}	

#footer {
	background-color:#EEAA77;
	color:#FFF;
	font-size:13px;
}


@media (min-aspect-ratio: 16/9) {
     #trailer > video { height: 300%; top: -100%; }
 }
 @media (max-aspect-ratio: 16/9) {
     #trailer > video { width: 300%; left: -100%; }
 }
 /* Если есть поддержка object-fit (Chrome/Chrome для Android, Safari в iOS 8 и Opera), используем его: */
 @supports (object-fit: cover) {
     #trailer > video {
         top: 0; left: 0;
         width: 100%; height: 100%;
         object-fit: cover;
     }
 }

var video =  document.getElementById(element);
video.addEventListener('click',function(){
	  video.play();
},false);

var ua = detect.parse(navigator.userAgent);
if ( ua.os.family === 'Android' ) {
	video.setAttribute( 'controls','controls' );
}