body { width: 100%; height:100%; padding:0px; margin:0px;
	letter-spacing: 1px;
    background: url(images/fon.jpg) left top 0 fixed repeat; 
	-moz-background-size: auto 100%; /* Firefox до 4.0 */
   -webkit-background-size: auto 100%; /* Safari и Chrome */
   -o-background-size: auto 100%; /* Opera до версии 10.53 */
  background-size: auto 100%; /* CSS3 */
}
img { border:0px}
table, html { height:100%; }

#all { width: 100%; height:100%; 
	padding: 0px; margin:0px;
	background: url(images/fon.jpg) right top 0 fixed no-repeat; 
	-moz-background-size: auto 100%; /* Firefox до 4.0 */
   -webkit-background-size: auto 100%; /* Safari и Chrome */
   -o-background-size: auto 100%; /* Opera до версии 10.53 */
  background-size: auto 100%; /* CSS3 */ }

#center { display:inline-block; width:100%; position: relative; top:0px; left:0;  margin:0; 
   }
   
#center span { text-align:center; font-family: "Istok Web", sans-serif; font-size: 38%; letter-spacing: 2px; font-style:italic;  }  

#center h1, #center h2 { font-family: "KellySlab", serif; font-size: calc(3vw + 1.2vh); text-align:center; color: #ff0000; padding: 0; margin:0;
} 

#links { width:100%; background: #EAEAEA; font-family: "KellySlab", serif; font-size: calc(0.9vw + 1.2vh);
  text-align:center; color: #ff0000; padding:0px; display:inline-block; margin-top:130px; 
  -moz-box-shadow: 0px 2px 3px #969696;
	-webkit-box-shadow: 0px 2px 3px #969696;
	box-shadow: 0px 2px 3px #969696;
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=145, Strength=3); }
	
#links a { letter-spacing:3px;  }

#links a:link { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}   
#links a:visited { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}
	
#links a:hover { text-transform: none; text-decoration: underline; color: #ff0000; letter-spacing:1px;
	} 	
  
#text { width:100%; padding:0; margin:0;}  
#data { padding:0; margin:0; }
#datatext { width:38%; margin: 0 auto; 
-moz-box-shadow: 0px 0px 2px #969696;  
	-webkit-box-shadow: 0px 0px 2px #969696;
	box-shadow: 0px 0px 2px #969696;
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=90, Strength=3); padding:10px; font-family: "Istok Web", sans-serif; background:#ffffff; overflow-y: auto; }
	
#data h1{ font-size: 24px; line-height:150%;
  font-family: "Istok Web", sans-serif;
  color: #222; padding:10px; text-align:left; background:#FFF; margin:0 0 20px 0; 
}
#data span { font-size: 18px; line-height:130%;
  font-family: "Istok Web", sans-serif;
  color: #222; padding:0 10px; text-align:left; font-weight:normal; 
}
	
#datatext p { font-size: 16px; line-height:150%;
  font-family: "Istok Web", sans-serif;
  color: #222; padding:0 10px; text-align:justify; text-indent:25px
}

#datatext img { width:62%; height:auto; }

#datatext ol { background:#eee2d8; padding-top:5px; padding-bottom:5px; }	

#datatext a { letter-spacing:1px; font-family: "Istok Web", sans-serif; line-height:150%; font-weight: bold; 
  }

#datatext a:link { text-transform: none;  text-decoration: none; border-bottom: 1px solid #222; letter-spacing:1px; color: #222;
	}   
#datatext a:visited { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}
	
#datatext a:hover { text-transform: none; text-decoration: none; color: #ff0000; letter-spacing:1px;
	} 

#datatext span { display:inline-block; margin-left:15px;  }

#links { background:url(images/links.png) center no-repeat; width:264px; height:54px; display:block; margin:auto auto; 
-moz-box-shadow: none;  
	-webkit-box-shadow: none;
	box-shadow: none;
	filter: none; }	
	
.stroke {
    text-shadow: #fff 1px 1px 0, #fff 0 0 2px;
;   }

#data .center { text-align:center; }
 
.shadow { -moz-box-shadow: 2px 2px 3px #969696;
	-webkit-box-shadow: 2px 2px 3px #969696;
	box-shadow: 2px 2px 3px #969696;
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=145, Strength=3); } 
   
#text h1 { font-family: "KellySlab", serif; 
  font-size: calc(3vw + 2vh); text-align:center; color: #ff0000; padding: 0 10px;
}   
#text h2 { font-family: "KellySlab", serif; text-align: left; color:#222; font-size: calc(1.8vw + 1.2vh); background:url(images/wheel.png) left top no-repeat; padding: 10px 0 10px 55px ; }

#text h3 { font-size: 120%; }

#text a { letter-spacing:1px;  }

#text a:link { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}   
#text a:visited { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}
	
#text a:hover { text-transform: none; text-decoration: underline; color: #ff0000; letter-spacing:1px;
	} 

.less { font-size: calc(2vw + 1.5vh); }

.less_less { font-size: calc(1.5vw + 0.5vh); display:inline-block; margin-top:10px; }

.less_less a, .less_less a:link, .less_less a:visited, .less_less a:hover  { letter-spacing:0px; font-weight:bold; text-align:center; color: #222;  }

#fulltext { width:62%; margin: 0 auto; 
-moz-box-shadow: 0px 0px 2px #969696;  
	-webkit-box-shadow: 0px 0px 2px #969696;
	box-shadow: 0px 0px 2px #969696;
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=90, Strength=3); padding:10px; font-family: "Istok Web", sans-serif; background:#ffffff;  }
	
	
#fulltext p { font-size: 16px; line-height:150%;
  font-family: "Istok Web", sans-serif;
  color: #222; padding:0 10px; text-align:justify; text-indent:25px
}

#fulltext img { margin:10px -10px; }

#fulltext ol { background:#eee2d8; padding-top:5px; padding-bottom:5px; }	

#fulltext a { letter-spacing:1px; font-family: "Istok Web", sans-serif; line-height:150%; font-weight: bold; 
  }

#fulltext a:link { text-transform: none;  text-decoration: none; border-bottom: 1px solid #222; letter-spacing:1px; color: #222;
	}   
#fulltext a:visited { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}
	
#fulltext a:hover { text-transform: none; text-decoration: none; color: #ff0000; letter-spacing:1px;
	} 

#fulltext span { display:inline-block; margin-left:15px;  }	

#book p { padding:0 5px; background:#f3f3f3; margin:0 0 10px 0; }


#pred { border:1px solid #ff0000; }
#pred h3 { text-align:center; margin:0; padding:10px 0 0 0; color:#ff0000 }
#pred a { letter-spacing:1px; font-family: "Istok Web", sans-serif; margin:0px; padding:0px; }
#pred a:link { text-transform: none;  text-decoration: underline; letter-spacing:1px; color: #222;
	}   
#pred a:visited { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}	
#pred a:hover { text-transform: none; text-decoration: none; color: #ff0000; letter-spacing:1px;
	} 



	
body { scrollbar-face-color: #FFF; scrollbar-arrow-color: #666; }


#contents { margin: auto 0; display:inline-block; left:7%; top:200px; height:60%; width:80%; position:fixed; background-color:#FFF; overflow-y: auto; text-align:justify; padding:10px; }

#contents h2 { margin: 5px 0px 10px 0px; font-size:150%; font-family: "KellySlab", serif; }

#contents p { margin: 5px 0px 10px 20px; font-size:100%; font-family: "Istok Web", sans-serif; line-height:150%; } 

#contents a { letter-spacing:1px;  }

#contents a:link { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}   
#contents a:visited { text-transform: none; text-decoration: none; letter-spacing:1px; color: #222;
	}
	
#contents a:hover { text-transform: none; text-decoration: underline; color: #ff0000; letter-spacing:1px;
	} 
	
#footer { display: inline-block; position: fixed; bottom:0; left:0; width:100%; background-color: rgba(0, 0, 0, 0.4); font-size: calc(0.9vw + 0.6vh); font-family: "Istok Web", sans-serif; color:#ffffff; }

#footer a { color:#ffffff; border-bottom:1px solid #ffffff; text-decoration: none; }

#footer p {
	text-align: center; letter-spacing: 1px; margin:0; line-height:1.2; padding:15px 0;
}

 
#nav { 
	margin: 0 0 20px 0; padding:0px;
	overflow: hidden;
	display:inline-block;
	position:relative; width:100%; 
}

#nav ul {
	list-style: none; width:100%;
	overflow: hidden; text-align:center; padding:0; margin:0;
}

#nav li {
	display:inline-block; 
	text-align:center;
	
	margin:5px 10px; 
	padding:10px 5px;
	}
	
.red { color: #ff0000; border-radius:10px; /*немного css3*/
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border:1px solid #ff0000; }

#nav li a {
	font-family: "KellySlab", serif; text-align: left; color:#222; font-size: calc(1vw + 0.6vh); background:url(images/wheel.png) left center no-repeat; padding: 10px 0 10px 55px;  
	-moz-background-size: auto 80%; /* Firefox до 4.0 */
   -webkit-background-size: auto 80%; /* Safari и Chrome */
   -o-background-size: auto 80%; /* Opera до версии 10.53 */
  background-size: auto 80%; /* CSS3 */
	}


/*АКТИВНОЕ СОСТОЯНИЕ*/
#nav li a:hover {
	text-decoration: underline; color: #ff0000; letter-spacing:1px; }
	
@media only screen and (max-width : 1400px),
only screen and (max-device-width : 1400px){
	
	#nav li a {
	font-family: "KellySlab", serif; text-align: left; color:#222; font-size: calc(1vw + 0.6vh);  padding: 10px 0 10px 35px;  
	}
#datatext { width:62%; margin: 0 auto; }
  
	
}
	

@media only screen and (max-width : 1000px),
only screen and (max-device-width : 1000px){ 
#fulltext { width:90%; margin: 0 auto; }
#datatext { width:90%; margin: 0 auto; }
#nav li a {
	font-family: "KellySlab", serif; text-align: left; color:#222; font-size: calc(1vw + 0.6vh); padding: 10px 0 10px 25px;  
	}
 
 }


@media only screen and (max-width : 880px),
only screen and (max-device-width : 880px){
	#nav li a {
	font-family: "KellySlab", serif; text-align: left; color:#222; font-size: calc(1vw + 0.6vh); padding: 10px 0 10px 25px;  
	}
	

}
@media only screen and (max-width : 280px),
only screen and (max-device-width : 280px){

#links { background:url(images/links.png) center no-repeat;
-moz-background-size: 80% auto; /* Firefox до 4.0 */
   -webkit-background-size: 80% auto; /* Safari и Chrome */
   -o-background-size: 80% auto; /* Opera до версии 10.53 */
  background-size: 80% auto; /* CSS3 */}
}