@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Ubuntu+Condensed');
body {
	 background-color: #FCF6E7;
	margin:0;
	color: #253454; 
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
}
.topnav {
  overflow: hidden;
	margin:0 auto;
	width: 100%;
    max-width: 1000px;
	min-width: 380px;
	background-color: #466291;/*темнее #3B5288; */
	height: auto;
	text-align: center;
}
.topnav a {
  float: left;
  display: block;
  color: #FFFFFF; /* бежевый #FCF6E6;*/
  text-align: center;
  padding: 12px; 
 text-decoration: none;
  font-size: 18px;
 font-family: 'Ubuntu Condensed', sans-serif;
}
.topnav a:hover {
  background-color: #FCF6E6;
  color: #253454;
}
.active {
  background-color: #AC4033;
  color:#FCF6E6;
}
.topnav .icon {
  display: none;
}

@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}
/* end top nav
--------------------------------------------------------*/
 h1{
   	padding: 20px; 
	/*font-family: 'Ubuntu Condensed', sans-serif;*/
	 font-family: 'Roboto', sans-serif;
    letter-spacing: 1px;
	color: #CC3300;
	text-align: center;
	font-size: 22px;
	line-height: 1.2;
	}
	h2 {
		padding:20px 0 0 0;
   font-size: 20px;
	font-family: 'Ubuntu Condensed', sans-serif;
     color:  #253454;
	letter-spacing: 1px;
     text-align:center;
  	}
h4 {font-size: 19px;
    /*  color:  #253454;*/
   letter-spacing: 0.1em;
   text-align:center;
   font-weight:normal;
   margin: 10px 0;
   }
   h3 {font-size: 20px;
	font-family: 'Ubuntu Condensed', sans-serif;
     text-align: left;
    color: #000000;
    font-weight: 500;
	letter-spacing: 1px;
    line-height: 1.6;
	margin: 20px 0 5px 0;
}
ul ol {
	padding: 10px;
}
p {
	 text-indent: 30px;
}
.pad50 {
	padding-left: 50px;
	font-size: 14px;
}
.ind250 {padding-left: 250px;
	font-size: 15px;}
 .parag {
	 margin-left: 30px;
}
.parag100 {
	margin: 10px 10px 10px 100px;
}
.poem {
padding: 10px 10px 10px 100px;
}
.poem p {
	font-size: 16px;
	line-height: 1em;
	 font-family: 'Ubuntu Condensed', sans-serif;
}
.ann {  width:75%;
		max-width:610px;
		min-width:380px;
		margin-bottom: 15px;
        padding: 10px;
		font-family: 'Ubuntu Condensed', sans-serif;	
	 float:right;
	    text-align:justify;
        /*clear: both;*/
}
@media only screen and (max-width: 380px) { 
.ann { 
width: 100%;
	} 
	.ann2 { 
width: 100%;
	} 
	.epig { 
width: 100%;
	} 
	.poem {
padding: 0;
}
}
	 	  .ann2 {
		float:right;
		width: 600px;
		margin-left: 300px; 
	   text-align:left;
	   padding:15px 0;
	    font-style: italic;
		text-align:justify;}
.epig {
	width: 60%;
	max-width:610px;
min-width:380px;
	float: right;
	text-align:right; 
	padding:1%;
	font-style: italic;
	font-size: 15px;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
}
 img { -ms-interpolation-mode: bicubic; }/*повышает качество картинки за счет использовани¤ бикубического метода интерполяции.*/
 img a {
	 border: 0;}
 img  {
margin: 5px;
}
@media only screen and (max-width: 480px) { 
img { 
width: 100%; 
height: inherit;
} 
}
.clear, .clearfloat {
	clear: both;
padding: 0; 
	height: 3px;
}
.boxShadow {
  width: 80%;
  max-width: 550px;
  margin: 2em auto;
  padding: 1em;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
}
.contentmain {
	margin: 0 auto;
	width: 96%;
	max-width: 940px!important;
	min-width: 380px;
	background-color: #FFF;
	padding: 2%;
	text-align:justify;
	/*overflow: hidden; для работы на компе*/
	color: #333333;
 	line-height: 1.6em;
	/* box-shadow: 0 0 10px 5px rgba(221, 221, 221, 1); - тень с двух сторон
	 font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "sans-serif";
	font-size: 16px;
	color: #666666;#898989;*/
/*	height: 100vh;  the height is equal to the viewport height */
}

@media (max-width: 380px) {
.contentmain {
  max-width: 100%;
padding: 0!important;
}
}
/*
@ media (min-width: 1000px) {
   { max-width: 1000px // Prevent your content scaling to infinity
  }
}*/

.contentmain a:link, .contentmain a:visited {
	color:#333;
	font-size: 16px;
	line-height: 1.6em;
	text-decoration: underline;
}
.contentmain a:hover {
	text-decoration: none;
	color: #364B78;
}
	.toptitle {
	width: 99%;
	max-width: 1000px;
	min-width: 380px;
	height: 255px;
	margin: 0 auto;
	padding: 0;
    text-align: center;
    background-image:url(im/polemic.jpg); 
	background-position: center top;
	background-repeat: no-repeat;
			}
@media (min-width: 380px) {
.toptitle {
  max-width: 100%; 
	padding: 0!important;
  }
}
.toptitle h2{
	padding: 5px 0;
color: #f2f2f2;
	font-size: 20px;
	letter-spacing: 2px;
	font-weight: 500;
	font-family: 'Ubuntu Condensed', sans-serif;	
}
.sole {
margin: 0 auto;
	padding: 0;
	width: 100%;
	max-width: 1000px;
	min-width: 380px;
	height: auto;
	}
@media screen and (max-width: 380px) {
  .sole {
	  width: 100%;
    padding: 0px 0px !important; 
  }
}
.itemright {
	float:right;
	width:  80px;
	height: auto;
}
.itemleft {
	float:left;
	width:  100px;
	height: auto;
}
.footer {
width: 100%;
height:60px;
padding-top: 10px;
 border-top: 1px solid #CCC; 
background-color: #466291;
  /* position: fixed;
   left: 0;
   bottom: 0;*/
   text-align: center;
			}

.picright, .picleft, .piccnt {
	padding: 10px;
	margin: 1px;/*5px;*/
	width:auto;
	color:#306596;
	font-size: 15px;
	font-style:italic;
	line-height: 1.2em;
	text-align:center;
}
.picright {
float:right;	
}
.picleft {
	float:left;
}
.piccnt {
	margin:0 auto;
}
.picright a, .picleft a, .piccnt a {
	font-style: italic;
	font-size: 15px;
	}
.picright a:link, .picleft a:link, .piccnt a:link, .picright a:visited, .picleft a:visited, .piccnt a:visited {
font-size: 15px;
	color:#306596;
text-decoration: underline;
}
.picright a:hover, .picleft a:hover, .piccnt a:hover {
	color:#000;
text-decoration: none;	
}
.teaz {
	float:left;
/*	padding: 20px 0 0 0;
	margin-top:40px 0;*/
}
.red {
	color: red;
}
.pad250 {
padding: 10px 10px 10px 250px;
	font-size: 15px;
}
.redb {
	color: #FF0000;
	font-weight: bold;
}
.red {
	color: #FF0000;
	}
/*
@media screen and (max-width: 380px) {
 .pad250 {
	  width: 100%;
    padding: 0px 0px !important; 
  }
}*/
 .ogl{ 
padding: 10px;
float:left;
width:auto;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
	 font-size: 14px;
}
div.fancybox {
    text-align: center;
	display: block;
}
div.fancybox a {
	text-decoration: none;
}
/*---------------Lantratov----*/
.thumbnail_wl{  
position: relative;  
z-index: 0;  
}  
.thumbnail_wl:hover{  
background-color: silver;  
z-index: 50; 
}  

p .thumbnail_wl span {
	text-indent:0;}
	
.thumbnail_wl span{ /*CSS for enlarged image*/  
position: absolute;  
background-color: #FFF;
padding: 2px;
left: -1000px;  
border: 1px solid #ccc;  
visibility: hidden; 
text-decoration: none;  
min-width: 245%;
 
margin:7px;}
  
.thumbnail_wl span img{ /*CSS for enlarged image*/  
border-width: 0;  
padding: 2px;
width: 300px;
}  
.thumbnail_wl:hover span{ /*CSS for enlarged image on hover*/  
visibility: visible;  
top: -29px;
left:40px;/*position where enlarged image should offset horizontally */  
}