@charset "UTF-8";
/*	CSS Document									*/

/*	Theme Name: GNC Quality Website					*/
/*	File Name: layout_B_screenSmall.css 			*/
/*	Author: Ben Guthrie								*/
/*	Author URI: http://www.TheGuthrieProject.com	*/





/* special attributes for larger screens and windows */
	




/* this changes the number of grid columns down to 1 */
.gridItem,
.gridItem_smallScreensOnly,
.gridItem_largeScreensOnly,
.gridItem_hoverImage,
.gridItem_hoverImage_smallScreensOnly,
.gridItem_hoverImage_largeScreensOnly
	{
	width: 95%;
	margin-bottom: 30px;
	}
#gridContainer 
	{
	top:70px;
	right:3%;
	}	
	
/* turn on special grid items for smaller screens */
.gridItem_smallScreensOnly,
.gridItem_hoverImage_smallScreensOnly, 
.displayOnSmallScreensOnly	{
	display:inline;
	}
.displayBlockOnSmallScreensOnly	{
	display:block;
	}
/* turn off special grid items for larger screens */
.gridItem_largeScreensOnly,
.gridItem_hoverImage_largeScreensOnly
	{
	display:none;
	}



/* adjust portrait grid on 'about us' page */
.Portraits_leftColumn,
.Portraits_rightColumn { 
	width:100%;
	}
.Portraits_rightColumn { 
	margin-left:0%;
	}




/* turn off footer and other elements */
#footer .siteDesign,
/* #footer .copyright,	*/
#footer .social,
.social,
#bigHeading,
#siteContent_fulWidth,
#bigScreenMenu ul ul ul li, 
#awardWatermark_Container,
/* #siteContent_projectPages,	*/
.hidefromSmallScreens, 
.logo_phoneNumber
	{
	display: none;
	}

#footer .copyright
	{
	bottom: 7px;
	}



/* smnaller top aligning logo for small screens */
#logo_container,
#logo_container:hover {
	position:fixed;
	left:0px;
	overflow:hidden;
	top:0px;
	height:50px;
	width: 100%;
	background-color:#324141;
	background: rgba(50, 65, 65, 0.8);
	*border:none;
	*outline:none;
	z-index:8;
}
.logo_image {
	display:none;
}
.logo_image_smallScreens {
	display: block;
	position:absolute;
	left:20px;
	overflow:hidden;
	top:5px;
	*border:none;
	*outline:none;
	z-index:9;
}




/* hide site menu for large screens */
#bigScreenMenu_container { display:none; }
	
/* display site menu for small screens */
.smallScreenMenu 
	{
	display:block;
	top:13px;
	width:180px;
	}




/*	adjust primary site content layout		*/
#siteContent,
#siteContent_with_background {
	position: absolute;
	overflow: auto;
	width:90%;	
	left:0px;
	right:0px;
	top:80px;
	margin:0px;
	padding:5%;
	}
	
#siteContent_fulWidth{
	position: fixed;
	overflow:auto;
	width:100%;	
	margin:0;
	left:0;
	top:80px;
	bottom:100px;
	padding-left:0px;
	padding-bottom:0px;
	}

#siteContent_two_column_layout {
	top:100px;
/*	background:blue;			*/
	}
.leftColumn_wide,
.rightColumn_wide { 
	width:80% !important;
	left:10%;
/*	background-color:green;		*/
	}

.leftColumn_narrow,
.rightColumn_narrow { 
	width:80% !important;
	left:10%;
/*	background-color:orange; 	*/
	}	
	



/*	relocate slideShow and footer Controls & elements	*/
#slideshowNavigation_container {
	left:0;
	right:0;
	bottom:0;
	height:40px;
	width:100%;
	background:#fff;
	}

#portfolio_button {
	left:20px;
	}
#arrow_left {
	left:60px;
	}
#pause_play {
	left:100px;
	}
#arrow_right {
	left:140px;
	}

#projectPopUpButton							/* locates Info button */  
	{	
	left:-10px;
	bottom:-12px;
	}
#projectPopUpDescription
	{
	bottom:50px;
	height:230px;
	padding-left:20px;
	padding-right:20px;
	padding-top:0px;
	padding-bottom:5px;
	}	





/* adjust inset NON-FULLSCREEN slideshow container */
#maximage_Container {
	left:0px;
	right:0px;
	top:60px;
	bottom:50px;
}
#siteContent_projectPages {
	height:20px;
	bottom:45px;
	padding-left:20px;
	padding-right:20px;
/*	background:red;	*/
	}
#siteContent_projectPages h4 {
	padding-top:4px;
	padding-bottom:4px;
	}





/* decrease font sizes */
h1{
	font-size: 25px;
	}
h2{
	font-size: 20px;
	}
h3{
	font-size: 18px;
	}
h4{
	font-size: 15px;
	}
h5{
	font-size: 13px;
	}
p, pre, br, span {
	font-size: 12px;
	line-height: 14px;
	}

.hugeText {
	font-size: 20px;
	line-height: 50px;
	}
.bigText {
	font-size: 14px;
	line-height: 16px;
	}
.mediumText {
	font-size: 12px;
	line-height: 13px;
	}
.smallText {
	font-size: 11px;
	line-height: 12px;
	}
.tinyText {
	font-size: 8px;
	line-height: 9px;
	}