/* CSS Document */
/* this document controls the mobile side of the library website */
/* -------------For sizing containers into columns   ------*/
.w-thirds {
	width:30%;
	float:left;
	min-width:200px;
	max-width:600px;
	padding-right:10px;
}
.w-half {
	float:left;
	width:46%;
	min-width:300px;
	max-width:800px;
	padding-right:10px;
}
.w-twothirds {
	float:left;	
	width:65%;
	min-width:200px;
	max-width:600px
}
.w-quarter {
	float:left;	
	width:24%;
	min-width:150px;
	max-width:400px
}
/* all styles for standard desktop here */
#mobile-banner h1 {
	padding-left:0px;
	padding-right:5px;
	padding-top:5px;
	margin:0px;
	color: #7AB800;	
	font-size:18px;
	font-weight:bold;
}
#mobile-banner img {
	padding-left:0px;
	padding-top:5px;
	padding-bottom:5px;
}
.mobile-menu a, .mobile-menu a:link, .mobile-menu a:visited,.mobile-menu a:active{
	font-weight:bold;
	font-size:15px;
	text-decoration:none;
	padding-left:10px;
	padding-right:10px;			
	padding-top:-5px;
	padding-bottom:-5px;
}
.mobile-menu .green-line {padding:10px 0px}
#mobile-footer, #mobile-footer a {
	text-align:center;
	background-color:#FFF;
	text-decoration:none;
}
#mobile-footer-grey, #mobile-footer-grey a {
	color: #FFF;
	text-align:center;
	background-color:#808080;
	text-decoration:none;
}
#mobile-banner { display:none }
#mobile-LibrarySearchbox { display:none; padding:0px }
#mobile-LibrarySearchbox .hlabel { padding:10px; font-weight: normal; font-size: 18px; color: #7AB800;}
#mobile-footer {display: none}
#mobile-footer-grey {display: none}
#mobile-crumb {display:none }
.menu-mobile {display:none }
.menu-mobile h1 {padding:0px}
.mobile-on {display: none }
.mobile-off {display: block} 

@media  screen and (min-width: 768px) and (max-width: 959px) {
/* styles for tablet portrait here */ 
body {
	background-color: #FFFFFF;
}}

@media screen and (max-width: 767px) {
/* styles for mobile portrait here */
body { background-color: #FFFFFF;margin-left:5px; margin-right:5px; max-width:757px;}
#noprint {display: none}
.noprint {display: none}
#fullwidth { width: 100%; float: none;}
#maintable { width: 100%; }
#mobile-banner {display: block;}
#mobile-footer { display: block ;}
#mobile-footer-grey {display: block;}
#LibrarySearchbox {display: none ;}
#mobile-LibrarySearchbox {display: block ;}
.container { width:100%; max-width:none; min-width:0px;padding:0px;} /* homepage only */
.content { width:100%; max-width:none; min-width:0px;padding:0px;} /* homepage only */
.subjectlist { display:none; }
.img-right {display:none;}
.img-left {display:none;}
.w-half { width:100%; max-width:none; min-width:0px;}
.w-thirds { width:100%; max-width:none; min-width:0px;}
.w-quarter { width:100%; max-width:none;min-width:0px; }
.w-special-left { width:100%; max-width:none; min-width:0px;}
.w-special-right { width:100%; max-width:none; min-width:0px; float:left}
.w-special { width:100%; max-width:none; min-width:0px;}
#chat-box { display: block; float: left; padding-right:10px; }
.block-1 { width:100%; max-width:none; min-width:0px; padding:0px}
.block-2 { width:100%; max-width:none; min-width:0px; padding:0px }
.menubar { width:100%; }
.menu-left { text-align: left; width:100%; float: left;}
.menu-right { text-align: left; width:100%; float: left;}
.menu-mobile { display: block; text-align: left; width:100%; float: left;}
.menu-bar {line-height:20px}
.mobile-on {display: block }
.mobile-off {display: none} 
}
@media screen and (min-width: 480px) and (max-width: 767px) {
/* styles for mobile landscape here */
body { background-color: #FFFFFF; margin-left:5px; }
#mobile-banner {display: block;}
#mobile-footer { display: block ;}
#mobile-footer-grey { display: block ;}
#noprint {display: none}
.noprint {display: none}
#fullwidth { width: 100%; float: none;}
#LibrarySearchbox {display: none ;}
#mobile-LibrarySearchbox {display: block ;}
.subjectlist { display:none; }
#maintable { width: 100%; }
.img-right {display:none;}
.img-left {display:none;}
.container { width:100%; max-width:none; min-width:0px; padding:0px;} /* homepage only */
.content { width:100%; max-width:none; min-width:0px; padding:0px;} /* homepage only */
.w-half { width:50%; max-width:300px; min-width:50px;}
.w-thirds { width:50%; max-width:300px; min-width:50px;}
.w-quarter{ width:50%; max-width:300px; min-width:50px;}
.w-special-left { width:50%; max-width:300px; min-width:50px;}
.w-special-right { width:50%; max-width:300px; min-width:50px; float:left; }
.menu-left { text-align: right; width:45%; float: left;}
.menu-right { text-align: left; width:45%; float: right;}
.menu-mobile { display: block; text-align: right; width:45%; float: left;}
.menu-bar {line-height:20px}
#chat-box { display: block; float: right; padding:10px }
.mobile-on {display: block }
.mobile-off {display: none} 
}