html, body {
		min-width: none;
	}

	#outerWrap, #innerWrap, #innerWrap_bg, #foot {
		min-width:360px; max-width:900px; width: 100%; box-sizing: border-box;
	}	
	
	#outerWrap {
		margin: 0 auto;
	}
	
	#rightCol {
		float: right; padding-left:0;
	}
	
	#pad {
		clear: both;
	}
	
	#menu .panel ul li ul.submenu li a{
		font-size: 95%;
	}	
	
     /*Nine Dates with Content and Coffee*/	
	#tblDates p a.reg_txt::before, #tblOneColDates p a.reg_txt::before {
		content: '•';
		width: 3px;
		display: inline-block;
		color: black;
	}
	#tblDates p a.reg_txt, #tblOneColDates p a.reg_txt{
		text-indent: -3px;
		/*padding-left:5px;*/
		display: block;
	}
	

@media (max-width: 900px) {
	
	body { min-width: 360px;	}
	
	#outerWrap, #innerWrap, #innerWrap_bg, #foot {
		min-width:360px; max-width:900px; width: 100%; box-sizing: border-box;
	}	
	
	#innerWrap, #innerWrap_bg, #foot { background-position: calc(100vw - 900px) top ; }
	
	html { min-width: 0px}
	
	#leftCol {  
	   -webkit-padding-left: calc(100vw - 854px);
	   padding-left: calc(100vw - 854px);
	}

	#menu {
		background-image:none; background-color: #73216D; border-radius: 2px; margin-left: calc(100vw - 710px);
	}
	
	a.home {margin-left: calc(100vw - 675px);}
	
	div.sizing {right: 5px; left:auto;}
	p.char, form#keywordform {right: 5px;}
	p.char {margin-top:3px;}
	div.foot-bookmarking, #foot {padding-right:5px;}

	div#subheader-upperlayer-left, div#subheader-upperlayer-right {
		width: auto;
	}
	
	#rightCol {
		padding-left: 0px;
		padding-right: 5px;
		float:right;
	}
		
}

@media (min-width: 853px) {
	#menu .panel ul.submenu {
		display: none;
	}
}

@media (max-width: 853px) {
	
	#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 >ul >li:first-child {display:none;} /* Hide "Home" button in mobile version*/	
	
	#leftCol { display:none; }
	#midCol {   width: calc(100vw - 210px);}
	#midCol.noRightCol {  width: calc(100vw - 25px);}
	
	div#subheader-upper {height: 60px;}
		
	a.home {margin-top: 5px; margin-left: 15px; width: 62.5px; height:50px; background: url(/20210324230503oe_/https://www.iso.cuhk.edu.hk/english/images/home/cuhk_sq_logo.png) no-repeat; background-size:contain;}
	div#ISO-home { top: 9px; left: 90px; width: 88px; height:40px; background: url(/20210324230503oe_/https://www.iso.cuhk.edu.hk/english/images/home/iso_sq_icon.png) no-repeat right top; /*background-size:contain;*/ display:block; cursor:pointer; padding-left: 10px; border-left: 1px solid #73216d;}	

	form#keywordform {top: 24px;}
	
	div.sizing {top: 42px; line-height:1.1;}

	#menu .panel,  #menu #panelISOPub.panel{
      width: 95vw; 
	   box-sizing: border-box;
	}

	#menu .panel >ul {
      width: 45%; 
	}

	#menu .panel >ul, #menu .panel >ul.last{
      /*float: none;*/
	  width: 45%;
	  box-sizing: border-box;
   }
	
	#menu #panelISOPub.panel >ul, #menu #panelISOPub.panel >ul.last{
      /*float: none;*/
	  width: 30%;
	  box-sizing: border-box;
   }
	
	#menu .panel a.isopub {display: none;}
	
   #foot >ul >li >a, #foot >p >span {
	   white-space: nowrap;
	   display: inline-block;
   }
   
	/*#foot >p >span + span::before
    {
	   content: '　';
	   display: inline;
   }*/
   
}

@media (max-width: 700px) {

	
	#midCol {
		width: 100%; box-sizing: border-box;
	}
		
	/*re-style jquery.tabs.css*/
	#midCol .tabs-nav .tabs-selected a span {
		padding-top: 6px;
	}
	
	#rightCol {
		padding-left: 20px;
		float:left;
	}

}

@media (max-width: 620px) {
	
	#midCol, #rightCol {width:100%; box-sizing: border-box;/*padding: 15px 0 0 0;*/}
	#rightCol {padding-top: 10px;}
	
	
	#menu ul li a {
		/*font-size: 90%;*/
		line-height: 23px;
		padding-left: 8px;
		padding-right: 14px;
	}	
	#menu ul li:hover > a.sub {
		background: none;
	}
}

@media (max-width: 470px) {
	
	#menu ul li a {
		/*font-size: 80%;*/
	}	
	
	ul.tabs-nav {
		letter-spacing: -0.05em;
	}
}
	
@media (max-width: 450px) {
	#menu ul li a {
		/*letter-spacing: -.02em;*/
		padding-left: 8px;
		padding-right: 8px;
	}	
	
	#menu ul li:hover > a.sub {
		background: none;
	}
}

@media (max-width: 400px) {
	#menu >ul >li >a {
		/*letter-spacing: -.025em;*/
		padding-right: 6px;
		padding-left: 6px;
		/*text-decoration: underline;*/
	}	

	/*#menu >ul >li + li::before {
		content: "|";
		float:left;
		display: inline-block;
		color: white;
		padding-right:3px;
		
	}	*/
	
	
	
}