﻿@media (max-width: 900px) {
	
	html, html >body {min-width: 0;}
	
	body #outerWrap, body #outerWrap #innerWrap, body #outerWrap #innerWrap_bg, body #outerWrap #foot {
		min-width:360px; max-width:900px; width: 100%; box-sizing: border-box;
	}	
	
	#leftCol {
		padding-right: calc(100vw - 921px);
	}
	
	#midCol, #midCol.noRightCol {
		width: 630px;
	}	
	
	table.shelf { width: 100%;	max-width:670px;}
	div.bookshelf_top { width:100%;	max-width:670px;}
	div.bookshelf { width:100%;		max-width:670px;}
	div.separa {width:100%; 	max-width:670px;}
	div.separa-bottom {width:100%; 	max-width:670px;}	
	
	#menu {
		background-image:none; background-color: #73216D; border-radius: 2px; margin-left: calc(100vw - 670px); width: 650px;		
	}
	
	#menu >ul >li:first-child {display:none;} /* Hide "Home" button in mobile version*/	

	#menu .panel,  #menu #panelISOPub.panel{
		width: 630px;
	}
	
	#menu .panel a.isopub {display: none;}
	
	div.ipad{
		box-sizing: border-box;
		margin-left:auto;
		margin-right:auto;
		float: none;
		width: 85vw;
		max-width: 432px;
		height: calc(85vw * (563/432));
		max-height: 563px;
		background-size: cover;
	}
	
	div.ipad_item {
		box-sizing:border:box;
		width: 50%;
		height: 40vw;
		max-height: 180px;
	}	
	
	div.ipad_icon {
		width: 100%;
		height:auto;
		padding:0 5px 6px 5px;		
		box-sizing: border-box;
	}	
	
	div.ipad_icon img {
		margin-left: auto;
		margin-right: auto;
	}	
	/**/
		
	div.ipad div.ipad_text {
		line-height: 0.95;
	}	
	
}

@media (max-width: 853px) {
	
	
	body #outerWrap #innerWrap_bg, body #outerWrap #innerWrap, body #outerWrap #foot {
		background: none;
	}
	
	#menu ul >li.hiddenpanel div.panel {
		left: -9999px;
   }

	#menu ul li:hover.hiddenpanel > a {
		color: #fff;
	}   
	
	#innerWrap_bg, #innerWrap, #foot {
		background: none;
	}
	
	
	#menu {
		width:100%; margin-left:0;
	}
	
	#menu .panel,  #menu #panelISOPub.panel{
      width: 95vw; 
	   box-sizing: border-box;
	}

	#menu .panel >ul {
      width: 45%; 
	}

	#menu #panelISOPub.panel >ul, #menu #panelISOPub.panel >ul.last{
      /*float: none;*/
	  width: 30%;
	  box-sizing: border-box;
   }
	
	#menu .panel a.isopub {display: none;}
	
	
	#midCol.noRightCol {  width: calc(100vw - 40px); box-sizing:border-box;}
	
	#rightCol {
		padding: 9px 0 0 20px ;
	}	
	
}

@media (max-width: 700px) {

}

@media (max-width: 620px) {
	
}

@media (max-width: 470px) {
	
}
	
@media (max-width: 435px) {
}

@media (max-width: 400px) {
}
