/*================================================================
Style Sheet for layout

Define layout and backgrounds for:
  - Body
  - Wrapper
  - Header
  - Sidebar
  - Content
  - Footer
  ( Navigation is defined in nav.css )
  
  ***  NO TYPOGRAPHY STYLES HERE PLEASE  ***
================================================================*/


/* BODY 
----------------------------------------------------------------*/


body {margin:0; padding:0; font-family:arial, helvetica, sans-serif; font-size:12px; background: url(/images/backgrounds/bkg_mt_black_stripe.gif) repeat top #000;}
.main{margin:0 auto; padding:0; width:975px; text-align:left; padding:0;}


/* HEADER
----------------------------------------------------------------*/


/* Header Wrapper */

#nav {width:800px; height:73px; position:relative; margin:0 auto; background:url(/images/header/BKG_nav_bg_short.jpg) 0 0 repeat-x; z-index:1000;}
#nav h1, #nav h2 {margin:0; padding:0; display:block; text-indent:-9999px; position:absolute; border:none; text-decoration:none; font-size:1px;}
#nav h1 {width:311px; height:86px; left:-50px; top:0; background:url(/images/header/ART_MT_header_logo.gif) 0 0 no-repeat; z-index:1; }
#nav h1 a {width:311px; height:86px; display:block;}
#nav h1 a:hover {background:none;}
#nav h2 {width:73px; height:11px; right:0px; top:2px; background:url(/images/header/art_mt_url.gif) 0px 0px no-repeat;}

/* Social Buttons */

#nav ul#social_buttons {margin:0; padding:3px 5px 0 90px; display:block; height:26px; background:url(/images/header/BKG_social_nav.gif) 0 0 no-repeat; position:absolute; right:0; top:54px; border-right:1px solid #3b3d3d;}
#nav ul#social_buttons li {margin:0; padding:0 4px 0 0; float:left; list-style:none; font-size:1px; }
#nav ul#social_buttons li a {width:18px; height:18px; display:block; text-indent:-9999px; outline:none; background:url(/images/header/BTN_social_nav.gif);}

#nav ul#social_buttons li#rss a {background-position:0 0;}
#nav ul#social_buttons li#rss a:hover {background-position:0 -18px;}
#nav ul#social_buttons li#facebook a {background-position:-18px 0;}
#nav ul#social_buttons li#facebook a:hover {background-position:-18px -18px;}
#nav ul#social_buttons li#youtube a {background-position:-36px 0;}
#nav ul#social_buttons li#youtube a:hover {background-position:-36px -18px;}
#nav ul#social_buttons li#twitter a {background-position:-54px 0;}
#nav ul#social_buttons li#twitter a:hover {background-position:-54px -18px;}


/* SEARCH
----------------------------------------------------------------*/


#nav form {margin:0; padding:0; width:145px; height:37px; position:absolute; top:16px; right:0; border-right:1px solid #6b6b6b;}
#nav input#search_bar {margin:0; padding:2px; width:100px; height:16px; background:#ffffff; border:solid #000000; border-width:1px 0 1px 1px; position:absolute; top:7px; left:10px;}
#nav input#search_bar {font-size:11px; color:#666666;}
#nav input#search_button {margin:0; padding:0; width:20px; height:20px; border:none; position:absolute; top:7px; left:116px; background:#ffffff; border:solid #000000; border-width:1px 1px 1px 0;}



/* HOMEPAGE
----------------------------------------------------------------*/


/* Homepage Pods Container */
#pods {width:800px; margin:15px 0 0 50px;}
#pods p {margin:0; padding:0;}
#pods p a {text-decoration:none;}
#pods p a:hover {background:none; text-decoration:none; color:#cc0000;}
#pods p.view_all {position:absolute; bottom:0; right:5px; font-size:11px; background:url(/images/icons/ICN_whitesquares.jpg) 0 5px no-repeat; padding-left:12px;}

/* Update Icon */
#pod_products img.updated {position:absolute; left:75px; top:7px;}
#pod_culture img.updated {position:absolute; left:65px; top:7px;}
 
/* Products Pod */
#pod_products {width:266px; height:200px; float:left; background:url(/images/homepage/BKG_product_grayswoosh.jpg) 0 26px no-repeat; position:relative;}
#pod_products h2 {margin:0; padding:0; width:266px;}
#pod_products h2 a {height:26px; display:block; text-indent:-9999px; background:url(/images/homepage/hdr_homepage_careers.gif) 0 0;}
#pod_products h2 a:hover {background:url(/images/homepage/hdr_homepage_careers.gif) 0 -28px;}
#pod_products img {position:absolute; top:35px; left:5px;}
#pod_products p.header {position:absolute; top:110px; left:10px; text-transform:uppercase; font-weight:bold;}
#pod_products ul {position:absolute; top:132px; left:10px; margin:0; padding:0;}
#pod_products li {float:left; list-style:none; font-size:11px; background:url(/images/icons/ICN_redarrow_box.jpg) 0 0 no-repeat; margin:0 5px 5px 0; padding:0 0 0 18px;}
#pod_products li a {text-decoration:none; font-weight:normal;}
#pod_products li a:hover {background:none; text-decoration:none; color:#cc0000;}

/* Culture Pod */
#pod_culture {width:267px; height:200px; float:left; background:url(/images/homepage/BKG_resources_gray.jpg) 0 26px no-repeat; position:relative;}
#pod_culture h2 {margin:0; padding:0; width:267px;}
#pod_culture h2 a {height:26px; display:block; text-indent:-9999px; background:url(/images/homepage/hdr_homepage_careers.gif) -266px 0;}
#pod_culture h2 a:hover {background:url(/images/homepage/hdr_homepage_careers.gif) -266px -28px;}
#pod_culture .feature {width:246px; height:71px; margin:5px 0 5px 12px; background:url(/images/homepage/BKG_resources_feature.jpg); overflow:hidden;}
#pod_culture .feature p {font-size:11px;}
#pod_culture .feature p.header {margin:5px 0 0 15px; line-height:14px;}
#pod_culture .feature p.description {margin:0 0 20px 15px; color:#999999; line-height:14px;}
#pod_culture .feature img {float:right; margin:8px 8px 0 10px;}

/* Newsletter Pod */
#pod_newsletter {width:267px; height:200px; float:left; background:url(/images/homepage/BKG_resources_gray.jpg) 0 26px no-repeat; position:relative;}
#pod_newsletter h2 {margin:0; padding:0; width:267px;}
#pod_newsletter h2 a {height:26px; display:block; text-indent:-9999px; background:url(/images/homepage/hdr_homepage_careers.gif) -533px 0;}
#pod_newsletter h2 a:hover {background:url(/images/homepage/hdr_homepage_careers.gif) -533px -28px;}





/* PRODUCT PAGE
----------------------------------------------------------------*/


/* Main content */

#product_main{
	background-color: #000000;
	border-top: 1px solid #454545;
	border-left: 1px solid #454545;
	border-right: 1px solid #454545;
	border-bottom: 1px solid #454545;
}

.contentholder {
	padding: 10px;
}

.productlist {
	margin: 4px 5px 0px 7px;
}

/* Side bar */

#sidebar {
	background-color: #252525;
	border: 1px solid #454545;
}

.sidebar_header {
	background-color: #414141;
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 5px;
	text-transform:uppercase;
	margin-bottom: 10px;	
	font-size: 11px;
}

.sidebar_content {
	color: #c2c2c2;
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	padding-left: 15px;
	padding-right:10px;
	margin-bottom:10px;
}

.sidebar_content a:link, .sidebar_content a:visited {
	text-decoration:none;
	}

.sidebar_contenttitle {
	color: #ba1f0a; 
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	border-bottom: 1px solid #454545;
	margin: 5px 5px 5px 0px;

}

.sidebar_contenttitle a:link, .sidebar_contenttitle a:visited {color: #ba1f0a;}

.sidebar_producttitle {
	color: #ffffff; 
	font-family: Arial, Helvetica, sans-serif;
	margin: 3px 5px 3px 0px;

}

.sidebar_newsheadlines {
	padding: 4px 0px;
	border-bottom: 1px solid #454545;
}

a.buy_button {display:block; margin-bottom:5px;}
a.buytton:hover {background:none;}

/* Musclebuilders, Fat Burners, Stacks content */

#prd_category {
	width: 615px; /* -- Same width as Sub Menu in global.css -- */
	height: 300px;
	text-align: left;
	overflow: auto;
}

/* Athlete Sidebar */

.sidebar_athletetitle {
	color: #c2c2c2; 
	font-family: Arial, Helvetica, sans-serif;
	margin: 5px 5px 2px 0px;
	font-weight: normal;
	text-transform: none;

}

.sidebar_athletecontent {
	color: #ffffff;
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0px 10px 10px 15px;
	font-weight: bold;	
	text-transform: uppercase; 

}

.sidebar_athletesupptitle {
	color: #ffffff;
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;	
	font-style: italic;
}

/* PRODUCT PAGE NAVIGATION
----------------------------------------------------------------*/

	#product_nav {
		width:630px;
		margin:0;
		padding:0;
		}
	#product_nav li {
		float:left;
		list-style:none;
		text-align:center;
		text-transform:uppercase;
		font-size:11px;
		}
	
	#product_nav li a {
		width:157px;
		height:20px;
		display:block;
		padding-top:6px;
		background: url(/images/products/main/BTN_product_tab.jpg);
		background-position: 0 0;
		text-decoration:none;
		}
	#product_nav a:hover {
		background-position: 0 52px;
		color:#9a9898;
		}
	#product_nav li.product_nav_selected {
		width:157px;
		height:20px;
		display:block;
		padding-top:6px;
		text-align:center;
		text-transform:uppercase;
		font-weight:bold;
		font-size:11px;
		background: url(/images/products/main/BTN_product_tab.jpg);
		background-position: 0 26px;
		}


/* DISTRIBUTORS
----------------------------------------------------------------*/
div.distributorintl_container{
	border-bottom: 1px solid #252525; 
	background-color:#000000; 
	width:610px;
}

.distributorintl_container div{
	width:103px; 
	float:left; 
	padding: 5px 0px 5px 2px;
	color: #CECECE;
	font-size:11px;
}

div.distributorintl_title {
	width:105px; 
	float:left; 
	color:#ffffff;
	font-size:12px;
	font-weight:bold;
}



div.distributor_container{
	border-bottom: 1px solid #252525; 
	background-color:#000000; 
	width:610px;
}

.distributor_container div{
	width:150px; 
	float:left; 
	padding: 5px 0px 5px 2px;
	color: #CECECE;
	font-size:11px;
}

div.distributor_title {
	width:150px; 
	float:left; 
	color:#ffffff;
	font-size:12px;
	font-weight:bold;
}


/* SITEMAP
----------------------------------------------------------------*/
div.sitemap {
	width:191px; 
	float:left; 
	padding: 0 5px 5px 5px;
}

/* WHERE TO BUY
----------------------------------------------------------------*/
div.wheretobuy {
	width:200px; 
	float:left; 
	padding: 0px;
}

/* PRODUCT SECTIONS - MUSCLEBUILDERS, FAT BURNERS, STACKS
----------------------------------------------------------------*/
div.product_container{
	background-color:#000000; 
	width:610px;
	float: left;
	border-bottom: 1px solid #252525;
	padding:5px 0px;
	
}

.product_image_container{
	width:100px; 
	float:left; 
	padding: 5px 0px 5px 2px;
	color: #CECECE;
	font-size:11px;
}

.product_content_container{
	width:370px; 
	float:left; 
	padding: 5px 0px 5px 2px;
	font-size:12px;
}

.product_links_container{
	float:left; 
	padding: 20px 0px 5px 2px;
	color: #CECECE;
	font-size:11px;
}

.product_title {
	color: #ffffff; 
	font-family: Arial, Helvetica, sans-serif;
	margin: 3px 0px 2px 0px;
	text-transform: none;
	font-size:13px;
	font-weight: bold;
}

.product_tagline {
	color: #c2c2c2; 
	font-family: Arial, Helvetica, sans-serif;
	margin: 3px 0px 5px 0px;
	font-weight: normal;
	text-transform: none;
	font-size:11px;
	font-weight: bold;
}

.product_text {
	color: #ffffff; 
	font-family: Arial, Helvetica, sans-serif;
	margin: 3px 0px 5px 0px;
	padding-right: 12px;
	text-transform: none;
	font-size:11px;
}

.morelinks {
	color: #c2c2c2; 
	font-family: Arial, Helvetica, sans-serif;
	margin: 3px 0px 5px 0px;
	padding: 3px 0px 3px 5px;
	text-transform: none;
	font-size:11px;
	text-transform: uppercase;
	border: 1px solid #454545;
	font-weight: bold;
	background-color: #252525;
}

.product_image_stack {width:185px; float:left;}

.product_content_stack {
	width:285px; 
	float:left; 
	font-size:12px;
}
.product_links_stack{
	float:left; 
	color: #CECECE;
	font-size:11px;
}

/* LIGHTBOX
----------------------------------------------------------------*/

#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(/images/icons/ICN_blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/images/icons/ICN_prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/images/icons/ICN_nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #FFFFFF;
	margin: 0 auto;
	line-height: 1.4em;
	height:3em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; background:#FFFFFF; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 0;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0;	}	

#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	
	

/* wallpaper footer
----------------------------------------------------------------*/
.wallpaper {
	color: #CECECE;
	font-size:11px;
	text-decoration:none;
	line-height:12px;
	padding: 10px 50px;
	text-align: left;
}

.border {border: 1px solid #252525;}

.results {width:260px; float:left; border-right:#454545 1px solid; padding-left:20px;}
.results ul {margin:0 0 10px 0px; padding:0; list-style:none;}
.results li {margin-top:5px;}
