/* Medium Devices, Desktops */
@media only screen and (max-width: 992px) {
	.wrapper{
		widht:700px;	
        padding: 10px  10px  10px  10px;		
	}
	.header {
		background-image: url(../images/header.jpg);      	
	}
	.top_menu {
		background: red;/*#64f1eb */
	}
	.sideLeft {
		background: #eaeaea;
		width: 100%;
		margin-top: 4px;
		float: none;
        text-align: center;		
	}
		.left-menu {
  margin:3px 1px 1px 1px;
  padding: 4px 4px 4px 4px;
  display: inline-block;
  width: none;
  max-width: 260px;
  height: auto;
  /*border: 1px solid #000;*/
  border-radius: 5px;
  text-align: center;
  background-color: #c5c5c5;  
  font-family: "ArialNarrowRegular", "Arial";
}
  .left-menu span{
  word-break: break-word;
}
.left-menu:hover, .active {
    background: #f4e393;
    text-decoration: none; 
}	
	
	.content {
		width:100%;
		background: #fof1ef;
	}
	.book-scroll {  	
	width: 42%;	
	height: 380px;			
}
#book-scroll1 {
	width: 37%;
	height: 450px;	
}	
	.footer {
		width: 100%;
        margin-left:0px;		
		margin-top: 4px;
	}
   .gl{
	width: 40%;
	box-shadow: 10px 10px  8px #c3c3c3;
}


}
/* Small Devices, Tablets */
@media only screen and (max-width: 768px) {
	.wrapper{
		width: 450px;
		padding: 10px  10px  10px  10px;
	}
	.header {	    
		box-sizing: border-box;
		padding: 34px 0px 0px 0px;		
		background-size: 450px 120px;
		height: 120px;		
		float: none;
		width:100%;
	}
.info_kant{	    
	margin: 10px 0px 0px 90px;/*сверху|справа| снизу| слева|*/
	padding:1px 1px 1px 1px;  /*сверху|справа| снизу| слева|*/
	width: 218px;
	height: 25px;
	font-size:.85em;
	font-family:"AnnabelleRegular", "Annabelle";
    /*background: blue; */
}

.info_kant_r{	     	  
	/*float: left;*/
	margin:0px 0px 0px 250px;/*сверху|справа| снизу| слева|*/	
	width: 70px;	
	text-align: right;
	font-size:0.9em;
	font-family:"AnnabelleRegular", "Annabelle";	
	/*background-color: green;*/
}	
	
	.top_menu {
		background: #5ab37f;
		width: 100%;
		height: 25px;		
	}
	.knopka {
		display: block; /*7:40*/
	}
	
	.sideLeft {
		background: #eaeaea;
		width: 100%;
		margin-top: 4px;
		float: none;
        text-align: center;		
		
	}
	.left-menu {
  margin:3px 1px 1px 1px;
  padding: 4px 4px 4px 4px;
  display: inline-block;
  width: none;
  max-width: 260px;
  height: auto;
  /*border: 1px solid #000;*/
  border-radius: 5px;
  text-align: center;
  background-color: #c5c5c5;  
  font-family: "ArialNarrowRegular", "Arial";
}
 
 .left-menu span{
  word-break: break-word;
}
.left-menu:hover, .active {
    background: #f4e393;
    text-decoration: none; 
}	
	
	
	.content {
		background: #f9f7f8;
        width: 100%;	        
		height: 450px;
		float: none;
		margin-bottom: 0px;
	}
	
	.book-scroll {  	
	margin-left: 0px;
	width: 95%;	
	height: 380px;			
}
#book-scroll1 {
	width: 83%;
	height: 450px;	
}	

	
	.footer {
		width: 100%;
        margin-left:0px;		
		margin-top: 4px;
	}
	.gl{
	width: 80%;
	box-shadow: 5px 5px  4px #c3c3c3;
}
}

/* Small Devices, Tablets 7:56*/
@media only screen and (max-width: 480px){
	.wrapper {
		width: 320px;
	}
	.header {
		padding: 22px 0px 0px 0px;		
		background-size: 320px 80px;
		height: 80px;	
	}
	
	.info_kant{	    
	margin: 5px 0px 0px 60px;/*сверху|справа| снизу| слева|*/
	padding:1px 1px 1px 1px;  /*сверху|справа| снизу| слева|*/
	width: 170px;
	height: 17px;
	font-size:.55em;	
    /*background: blue; */
}

.info_kant_r{	 
	margin:0px 0px 0px 150px;/*сверху|справа| снизу| слева|*/			
	font-size:0.55em;	
}	
	.top_menu {
		background: #328e8d;
	}
	.sideLeft {		
		text-align: center;	
		
	}
	.left-menu {		
		text-height: 10px;
	}
/*	.content {background: yellow; /*#f9f7f8*}*/
	.book-scroll {  	
	margin-left: 0px;
	width: 95%;	
	height: 250px;			
}

#book-scroll1 {
	width: 95%;
	height: 350px;	
}

.glscroll{   	
    margin: 7px;	
	float: left;
	display: inline-block;
	box-sizing: border-box;
}


.OtAvtora {		
	margin:0px 5px;/*сверху|справа| снизу| слева|*/
	padding:0px 10px 10px 30px;		
	box-sizing: border-box; /*margin + width   - рассчет элемента за счет margin и width. Padding на размер элемента не влияет*/
	font-family: "ArialNarrowRegular", "Arial";	
}
.gl{
	width: 100%;
	box-shadow: 5px 5px  4px #c3c3c3;
}
}