body {
      background:#212121; margin:0;padding:0;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	  }
#header{
  background:url(i/fon.jpg) #000000 repeat-x;
  padding:0px;
  margin:0px;
  height:220px;
  width:100%;
}
#header .name {
  background:url(i/title.jpg) no-repeat;
  float:left;
  width:500px;
  height:100px;
 }
#header .foto {
  background:url(i/title1.jpg) no-repeat;
  float:right;
  width:400px;
  height:200px;
 }

.topmenu {list-style:none;margin:-31px 0px 0px 0px;height:36px;float:left;font-size:14px;}
HTML*.topmenu {margin:-30px 0px 0px 180px;position:absolute;}
.topmenu li {float:left;margin:0px 5px 0px 0px;padding:6px 14px;background:#444A4F;border:#C2B87A 1px solid;text-decoration:none;font-family:Tahoma;}
.topmenu li a {color:#FFFF00;font-weight:bold;text-decoration:none;font-family:Tahoma;}
.topmenu .checked {background:#212121;border-bottom:1px #212121 solid;}
.topmenu .checked a {color:#C2B87A;text-decoration:underline;}



#footer {
 
  background:url(i/footer.jpg) #212121 no-repeat left;
  height:80px;
  color:#C0C0C0;
  padding:4px;
}
#footer span{color:#C0C0C0;text-decoration:none;}
#footer a:hover {color:#C0C0C0;}
.clear {clear:both;}

#menu2 {margin-left:100px;list-style:none;}

#ads {border-right:#6C634A 1px dashed;}

#center {
  border:#C2B87A 1px solid;max-width:100%;
}
#content{
    max-width:70%;
	padding:20px 10px 20px 20px;
    color:#C0C0C0;
 }

#right{
  padding:20px 20px 20px 0px;
  width:25%;
  border-left:#6C634A 1px dashed;
 }

.nav {
   margin:5px 10px;
   padding:5px 5px 5px 10px;
   border-bottom:1px #83A3B4 dashed;
   border-top:1px #83A3B4 dashed;
   list-style:none;
   }
.nav li {margin:10px 0;}
.nav a,.nav a:active,.nav a:visited,.nav a:link {
   color:#C0C0C0;
   font-weight:normal; 
   text-decoration:none;
   font-size:0.9em;
   }
.nav a:hover {text-decoration:underline;}
.nav ol li a, .nav ol li a span{font-size:0.9em;margin-left:4px;font-weight:normal;line-height:1.5em;}

.nav1 {
   margin:0px;
   padding:5px;
   list-style:none;
   }
.nav1 li {margin:0px 0px 10px 10px;}
.nav1 a,.nav1 a:active,.nav1 a:visited,.nav1 a:link {
   color:#99CCFF;
   font-size:0.9em;
   font-weight:bold;
   text-decoration:none;
   }
.nav1 a:hover {text-decoration:underline;}
.nav1 div li a, .nav1 div li a span{font-size:0.9em;margin-left:4px;}

.nav img, .nav1 img {margin-right:4px;}

.nad {margin:10px 20px;}
.nad img {margin:0px 20px;}

td, th {color:#C0C0C0;}

.page {padding:0px 10px 10px 10px;color:#E2C597;}
.page table {margin-top:20px;font-size:13px;}
.page td {padding:2px 5px;}
.page .ultra th {color:#ffcc00;padding:5px;}
.page .ultra td {padding:10px;}

.page img {margin:15px;}
.page table td img {margin:0;}
.page a, .page ul li a {color:#C0C0C0;}
.page form input {padding:5px 8px;}

.page figure {
      padding:10px;
	  display: block;
      margin: 0 10px 10px 0;
      text-align: center; 
}
.page figure.right {float:right;}

.page figure figcaption {color:#999;}



blockquote {margin:15px 0 15px 0;color:#ccc;border-left:2px #999999 solid;padding-left:15px;font-size:14px;}


a:active,a:hover {color:red;}
b {font-weight:bold;border:none;}
p {text-align:justify;margin:3px 12px;}
h1 {font-size:20pt;}
h2 {margin:20px 0px 10px 0px;font-size:18pt;font-family: Lato, sans-serif;font-weight:normal;}
h3 {margin:20px 0px 10px 0px;font-size:16pt;font-family: Lato, sans-serif;font-weight:normal;}
h4 {font-size:14pt;font-weight:normal;}
h5 {color:#808080;margin-bottom:10px;text-align:center;border-bottom:1px #808080 solid;}
li,ol,ul {margin:0 5px 0 10px;}

ul,ol {padding:0;}
ol {margin:5px 5px 0 25px;}
.page ul {padding-left:30px;}
.page ul li {
    margin:10px 0px;
	}   
.page ol {counter-reset: point;list-style:none;}
.page ol li {
    font: normal 14px Tahoma;
	margin:10px 0px;
	padding-left:30px;
	position: relative;
 }   
.page ol li:before {
	content: counter(point); 
	counter-increment: point 1; 
	position: absolute;
    font: normal 12px Tahoma;
	left:0;
	padding-top:2px;
	border:1px #E2C597 solid;
	width: 22px;
	height: 22px;
	color: #E2C597;
	text-align: center;
	-moz-border-radius: 50px;
	-webkit-border-radius: 50px;
	border-radius: 50px;
    box-sizing: border-box;
	}

i {font-style:italic;}
img {border:0px;}

.ctbl {background-color:silver;border:silver 1px solid;width:126pt;}
.righter {font-weight:normal;margin:5px 25px;text-align:right;}
#hr {background:#00CC66;margin:10px 3px;height:1px;}
#hr hr {display:none;}
#panels {width:180px! important;padding:5px;margin:0;}

.small {color:#C0C0C0; margin:3px;}
#pan {
    margin:0 0 0 5px;
	padding:0 10px 10px 10px;    
    display: none;
}
.panel {COLOR: #C0C0C0; font-size:15pt; font-weight: bold;padding:5px 20px; text-decoration:none;display:block;font-family:sans-serif;}
.panel a{COLOR: #C0C0C0; font-size:13pt; font-weight: bold;padding:5px 20px; text-decoration:none;display:block;}
.panel2 {COLOR: #C0C0C0; font-size:13pt; font-weight: bold;padding:5px 20px;display:block;}
.panel2 a{COLOR: #C0C0C0; font-size:13pt; font-weight: bold;padding:5px 20px;display:block;}
.panel3, .panel3 a{COLOR:#C0C0C0; font-size:12pt; font-weight: bold;padding:5px 10px 0 0;display:block;}

.select {color:red;}
.select1 {font-weight:bold; color:#CC3300;text-decoration:underline;}
.select2 {font-weight:bold; color:#C0C0C0;}
.select3 {
       padding:10px; 
	   color:#CC0000;
       border:solid #A22B39 1px;
	   }
strong{font-weight:bold;color:#fff;}

fieldset {
   border:#996600 1px solid;
   color:#C0C0C0;
   font:13px/1 arial;
   margin:0;
   padding:10px;
}
fieldset a {color:#0099FF;}
.intro{
       padding:10px; 
	   color:#C0C0C0;
	   font-weight:normal;
	   border:dashed #006699 1px;
	   background-color:#E7F7FA;
	   }
#oglav {display:block;margin-left:20px;}

.dalee {color:#C0C0C0;font-weight:bold;text-decoration:none;}
 
#next a{
   padding:5px 10px;
   color:#C0C0C0;
   font-weight:bold; 
   text-decoration:none;
   display: block;
	text-align: right;
   	float: right;
	margin:6px 0;
    }

#prev a{
   padding:5px 10px;
   color:#C0C0C0;
   font-weight:bold; 
   text-decoration:none;
   display: block;
	text-align: right;
   	float: left;
	margin:6px 0;
    }

#paginat {margin:20px auto;font-size:14pt;}
#paginat a, #paginat b {font-size:14pt;margin:0 10px;}

#bottom {width:500px;}
#bottom td a{text-decoration:none;}
#bottom a b{color:#FF0099;}
#prav {display:block;height:80px;overflow:hidden;}

.genres {margin:5px 0;color:#C0C0C0;font-weight:bold;}
.genres a{color:#C0C0C0;border:1px #C0C0C0 solid;padding:3px 5px;margin:3px;text-decoration:none;background:#4e4e4e;}
.genres b {color:#ff6600;}

.metro {background:url(i/metro.jpg) no-repeat;height:30px;padding:4px 0 0 16px;font-weight:bold;color:#993300;}
.tags {color:#C0C0C0;}
#tags {padding:15px;
   margin:0 6px 0 10px;
   border-bottom:1px #83A3B4 dashed;
   list-style:none;}
#tags span {margin:0px 2px;color:#C0C0C0;}
#tags a {color:#C0C0C0;text-decoration:none;}

#last {margin:10px;color:#E2C597;}
#last .panel3 {display:block;margin:5px 10px;}

#brands {margin:10px 0px 20px 0px;line-height:1.5em;color:#336666;}
#brands a {margin-right:3px;}


.box {
	border: 1px solid #fff;
	background:#fff;
	cursor: pointer;
	height: 200px;
	float: left;
	margin: 10px;
	padding: 0;
	position: relative;
	overflow: hidden;
	width: 200px;
	
}
.box img {
	position: absolute;
	margin:0;
	left: 0;
		-webkit-transition: all 300ms ease-out;
		-moz-transition: all 300ms ease-out;
		-o-transition: all 300ms ease-out;
		-ms-transition: all 300ms ease-out;	
	transition: all 300ms ease-out;
}

/* Обшие стили подписей */
.box .caption {
	background-color: rgba(0,0,0,0.8);
	position: absolute;
	color: #fff;
	z-index: 100;
		-webkit-transition: all 300ms ease-out;
		-moz-transition: all 300ms ease-out;
		-o-transition: all 300ms ease-out;
		-ms-transition: all 300ms ease-out;	
		transition: all 300ms ease-out;
	left: 0;
}


/** Подпись 1: Простая **/
.box .simple-caption {
	height: 60px;
	width: 200px;
	display: block;
	bottom: -60px;
	text-align: center;
}

.box .scale-caption p {
	-webkit-transition-delay: 500ms;
	-moz-transition-delay: 500ms;
	-o-transition-delay: 500ms;
	-ms-transition-delay: 500ms;	
	transition-delay: 500ms;
}

/** Простая подпись. Событие :hover **/
.box:hover .simple-caption {
	-moz-transform: translateY(-100%);
	-o-transform: translateY(-100%);
	-webkit-transform: translateY(-100%);
	opacity: 1;
	transform: translateY(-100%);
}

.box:hover .simple-caption p {text-align:left;font-weight:normal;}



@media screen and (max-width: 900px) {
      #header{height:120px;overflow:hidden;}
      #header .foto {visibility:hidden;}
    
    }

@media screen and (max-width: 700px) {
      body {margin: 0;}
      #header {display:none;}
      #center {margin:40px 0px 0px 0px;padding:0;border:none;}
	  #right {display:none;}
	  #conent {margin:5px;padding:0;}
	  .page {margin:0;padding:0;}
      .box .simple-caption {
			height: 60px;
			width: 200px;
			display: block;
			bottom: -60px;
			text-align: left;
            -moz-transform: translateY(-100%);
	        -o-transform: translateY(-100%);
	        -webkit-transform: translateY(-100%);
	        opacity: 0.7;
	        transform: translateY(-100%);
        }
     .topmenu {margin:-33px 5px 20px 5px;clear:both;z-index:1000;}
     .topmenu li {margin:2px 5px 0px 0px;}
     .page img, .page p img {max-width:90%;float:none;}
	 
	}