/*
	Current version: 1.0
	
	Site: Better Bodies - Better Bodies
	Author: Malin Klingsell, malin.klingsell@atrox.se
	Notes: This file contains the rules of the basic structure and navigation of the site.
	------------------------------------------------------------------
*/



html, body, form, fieldset, textarea, input
{
	margin: 0;
	padding: 0;
	font: 92%/1.2 Verdana, Arial, Helvetica, sans-serif;
}
html body
{ 
	font-size: 76%;
}

h1, h2, h3, h4, h5, h6 {font-family: Arial, helvetica, Sans-Serif;font-weight: bold;margin: 1em 0 .5em 0;}
h1 {
		display: block;
		height: 20px;
		background: url(../images/custom/productlist_h1.gif) repeat-x;
		padding: 5px 0 0 0;
		font-size: 1.1em;
		font-weight: bold;
		width: 250px;
		margin: 0 0 10px 0;
		text-align: center;
		text-transform:uppercase;
		color: #fff;
		border: none;
	}
h2 {	
	text-transform: uppercase;
	color:#00aeef;
	font-size: 1.4em; 
	margin: 1em 0 .2em 0;
	}
h3 {font-size: 1.1em;}
h4, h5, h6 {font-size: 1em;}

p {font-size: .916em;padding: 0;margin: 0 0 1.1em 0;}

a {color: #666666;text-decoration: none;font-weight:bold;outline:0;}
	a:hover {color: #00aeef;}

form label {cursor:pointer;position: relative;font-size: .916em;}
input, select, textarea {font-size: 100%;padding: 2px;border: 1px solid #5c5c5c;}
	select{padding: 0;}
	.submit
	{
		background: url(../images/common/submit_bg.gif) repeat-x;
		color: black;
		font-weight: bold;
		border: 1px solid #d09d02;
		border-width: 0 1px 1px 0;
		cursor: pointer;
	}
fieldset {border: none;}

li {margin: 0 0 .5em 0;}

img {border: 0;}


#startPage, #viewPage
{
	background: #000000;
}

#wrapper
{
	margin: 0 auto;
	text-align: left;
	width: 960px;
}
#splashWrapper
{
	position:absolute;
	width: 541px;
	height: 300px;
	top:50%;
	left:50%;
	overflow:hidden;
	margin:-175px auto auto -261px;	
}
#leftColumn
{
	width: 205px;
	float: left;	
	padding: 20px 0 0 0;
}



#view2SubmenuColumn
{
	width: 205px;
	display: block;
	float: left;	
	padding: 0;
	height: auto !important;
	height: 498px;
	min-height: 498px;
}

/* SNIPPET WITH SUBMENU AND SMALL IMAGE  */

#view2LeftColumn
{
	width: 256px;
	display: block;
	float: left;	
	padding: 0;
	height: auto !important;
	height: 498px;
	min-height: 498px;
}
#view2MainContainer
{
	width: 449px;
	padding: 0 20px 20px 30px;
	float: left;	
}

/** END OF: SNIPPET WITH SUBMENU AND SMALL IMAGE  **/

/* SNIPPET WITH SUBMENU AND BIG IMAGE  */

#view2LeftColumnBig
{
	width: 400px;
	display: block;
	float: left;	
	padding: 0;
	height: auto !important;
	height: 498px;
	min-height: 498px;
}
#view2MainContainerSmall
{
	width: 305px;
	padding: 0 20px 20px 30px;
	display: block;
	float: left;	
}

/** END OF: SNIPPET WITH SUBMENU AND BIG IMAGE  **/

/* SNIPPET WITHOUT SUBMENU, WITH SMALL IMAGE  */

#view1LeftColumnSmall
{
	width: 256px;
	display: block;
	float: left;	
	padding: 0;
	height: auto !important;
	height: 498px;
	min-height: 498px;
}
#view1MainContainerBig
{
	width: 654px;
	padding: 0 20px 20px 30px;
	float: left;	
}
/** END OF: SNIPPET WITHOUT SUBMENU, WITH SMALL IMAGE  **/

/* SNIPPET WITHOUT SUBMENU, WITH BIG IMAGE  */

#view1LeftColumnBig
{
	width: 526px;
	display: block;
	float: left;	
	padding: 0;
	height: auto !important;
	height: 468px;
	min-height: 468px;
}

#view1MainContainerSmall
{
	width: 384px;
	padding: 0 20px 20px 30px;
	float: left;	
}

/** END OF: SNIPPET WITHOUT SUBMENU, WITH BIG IMAGE **/

.athleteImg
{
	padding: 25px 0 0 40px;
}
#leftColumn ul.productMenu
{
	margin: 0 0 0 9px;	
}
#header
{
	height: 103px;
	padding: 0;
	width: 960px;
	position: relative;
}
#lang
{

	z-index: 9999;
	display: block;
	position: absolute;
	right: 0;
	top: 24px;
}
#startPage #lang
{
	left: 80px;
	top: 120px;
	position:static !important;
}
	#currentLang
	{
		display: block;
		float: right;
	}
	#lang ul
	{
		float: left;
		width: 100px;
		margin: 0;
		padding: 0;
	}
	#lang ul li
	{
		list-style: none;
	}
	#lang a
	{
		color: white;
		font-size: 11px;
		text-decoration: none;
		font-weight: normal;
	}
		#lang a:hover
		{
			color: #f7941e;
		}
	
	#toggle
	{
		clear:both;
		display:none;
		float: right;
		width: 410px;
		height: 210px;
		padding: 20px 0 0 20px;
		background: black;
		filter:alpha(opacity=90);
		opacity: .9;
		-moz-opacity: .9;
		z-index: 9999;
		
	}
	.visible
	{
		display: block !important;
	}
	.invisible
	{
		display: none;
	}
#headerContainer
{
	width: 956px;
	height: 265px;
	float: left;
	clear: both;
	margin: 4px 0 1px 4px;
}
#mainContainer
{
	width: 960px;
	float: left;	
	background: url(../images/common/submenu_bg.gif) repeat-y;
	height: auto !important;
	height: 400px;
	min-height: 400px;
}

#mainContainer2
{
	width: 750px;
	float: left;	
	padding: 0 2px 0 3px;
	margin: 0 0 0 1px;
}

	#logotype
	{
		background: url(../images/common/betterbodies-logotype.gif) no-repeat;
		height: 44px;
		width: 230px;
		display: block;
		text-indent: -9999px;
		float: left;
		position: relative;
		top: 28px;
		overflow: hidden;
	}
	#startPageLogotype
	{
		margin: 0 0 30px 70px;
		background: url(../images/common/betterbodies-logotype.gif) top center no-repeat;
		height: 44px;
		width: 230px;
		display: block;
		text-indent: -9999px;
	}
	#startPageImg
	{
		display: block;
		float: left;
		clear: both;
		height: 468px;
		overflow: hidden;
		width: 960px;
		z-index: 2;
	}
		#startPageImg object
		{
			z-index:2;
		}
	#chooseLanguage
	{
		width: 110px;
		margin: 20px auto 0 auto;
	}
	#menuItem0_0, #menuItem0_1
	{
		display: none;
	}

	#footer
	{
		display: block;
		width: 960px;
		float: left;
		clear: both;
		color: #4f4f4f;
		font-size: .916em;
		line-height: 1.3em;
	}
	
#productContainer
{
	float: left;
	clear: both;
	margin: 20px 0 0 0;
	min-height: 500px;
	height: auto !important;
	height: 500px;
	background: #fff;
}
#view1Container, #view2Container
{
	float: left;
	clear: both;
	width: 960px;
	overflow-x: hidden;
	margin: 20px 0 0 0;
	min-height: 468px;
	height: auto !important;
	height: 468px;
	background: #fff;
}
#view1Container table, #view2Container table
{
	font-size: .916em;
}
#view2Container
{
	background: #fff url(../images/common/submenu_bg.gif) repeat-y;
}
#container
{
	margin: 17px 0 0 0;
}
/* Primary navigation */
#menuContainer
{
	height: 15px;
	padding: 0;
	margin: 0;
}
#menuContainerProduct, #menuContainerView
{
	height: 19px;
	width: 960px;
	padding: 0;
	margin: 0;
	border-bottom: 1px solid #636363;
}
	#menuContainer li, #menuContainerProduct li, #menuContainerView li
	{
		color: #fff;
		list-style: none;
		float: left;
		font-size: 1em;
		font-weight: bold;
		margin: 0;
	}
		#menuContainer li a, #menuContainerProduct li a, #menuContainerView li a
		{
			color: black;
			color: #fff;
			text-transform:uppercase;
			text-decoration: none;
		}
		
ul#topMenuList
{
	margin: 0;
	padding: 0;
}

ul#topMenuList li div a
{
	text-indent: -9999px;
	display: block;
	height:12px;
	overflow: hidden;
}

/* MENU FOR LANGUAGE "INT" */

.int #menuItem0_2 a
{
	/*background: url(../images/common/topmenu-products.gif) no-repeat;
	width: 60px;*/
}
.int #menuItem0_2.topMenuItemContentSelected a
{
	/*background: url(../images/common/topmenu-products-selected.gif) no-repeat;
	width: 60px;*/
}
.int #menuItem0_3 a
{
	background: url(../images/common/topmenu-products.gif) no-repeat;
	width: 60px;
}
.int #menuItem0_3.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-products-selected.gif) no-repeat;
	width: 60px;
}
.int #menuItem0_4 a
{
	background: url(../images/common/topmenu-members.gif) no-repeat;
	width: 92px;
}
.int #menuItem0_4.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-members-selected.gif) no-repeat;
	width: 92px;
}
.int #menuItem0_5 a
{
	background: url(../images/common/topmenu-pressroom.gif) no-repeat;
	width: 77px;
}
.int #menuItem0_5.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-pressroom-selected.gif) no-repeat;
	width: 77px;
}
.int #menuItem0_6 a
{
	background: url(../images/common/topmenu-company.gif) no-repeat;
	width: 60px;
}
.int #menuItem0_6.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-company-selected.gif) no-repeat;
	width: 60px;
}
.int #menuItem0_7 a
{
	background: url(../images/common/topmenu-contact.gif) no-repeat;
	width: 54px;
}
.int #menuItem0_7.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-contact-selected.gif) no-repeat;
	width: 54px;
}


/* MENU FOR ALL OTHER LANGUAGES */

#menuItem0_2 a
{
	background: url(../images/common/topmenu-localnews.gif) no-repeat;
	width: 76px;
}
#menuItem0_2.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-localnews-selected.gif) no-repeat;
	width: 76px;
}
#menuItem0_3 a
{
	background: url(../images/common/topmenu-retailers.gif) no-repeat;
	width: 57px;
}
#menuItem0_3.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-retailers-selected.gif) no-repeat;
	width: 57px;
}
#menuItem0_4 a
{
	background: url(../images/common/topmenu-athlete.gif) no-repeat;
	width: 84px;
}
#menuItem0_4.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-athlete-selected.gif) no-repeat;
	width: 84px;
}
#menuItem0_5 a
{
	background: url(../images/common/topmenu-products.gif) no-repeat;
	width: 60px;
}
#menuItem0_5.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-products-selected.gif) no-repeat;
	width: 60px;
}
#menuItem0_6 a
{
	background: url(../images/common/topmenu-members.gif) no-repeat;
	width: 92px;
}
#menuItem0_6.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-members-selected.gif) no-repeat;
	width: 92px;
}
#menuItem0_7 a
{
	background: url(../images/common/topmenu-pressroom.gif) no-repeat;
	width: 77px;
}
#menuItem0_7.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-pressroom-selected.gif) no-repeat;
	width: 77px;
}
#menuItem0_8 a
{
	background: url(../images/common/topmenu-company.gif) no-repeat;
	width: 60px;
}
#menuItem0_8.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-company-selected.gif) no-repeat;
	width: 60px;
}
#menuItem0_9 a
{
	background: url(../images/common/topmenu-contact.gif) no-repeat;
	width: 54px;
}
#menuItem0_9.topMenuItemContentSelected a
{
	background: url(../images/common/topmenu-contact-selected.gif) no-repeat;
	width: 54px;
}


/* Active tab */
.topMenuItemContentSelected
{
	float: left;
	margin: 0 14px 0 0;
}
html>body .topMenuItemContentSelected
{
	float: left;
	margin: 0 28px 0 0;
}
	.topMenuItemContentSelected a
	{
		color:#00aeef !important;
	}


/* Inactive tabs */
.topMenuItemLeft, .topMenuItemRight
{

}
.topMenuItemContent
{
	margin: 0 14px 0 0;
	float:left;
}
html>body .topMenuItemContent
{
	margin: 0 28px 0 0;
	float:left;
}
.topMenuItemContent a:hover
{
}


/* Secondary navigation */
.productPage #subMenuContent
{
	margin: 0;
}
#subMenuContent
{
	margin: 15px 0 0 0;
}
#subMenuContent a
{
	font-size: .916em;
}
#subMenuActive
{
	display: none;
}


/* Secondary Navigation - First level */
#subMenuListLvl1 li a.leftMenuSelected
{
	background: url(../images/common/nav_arrow_blue.gif) 0 4px no-repeat;
}
#subMenuListLvl1
{
	width: 186px;
	margin: 0 0 0 9px;
	padding: 0;
}
	#subMenuListLvl1 li 
	{
		border-bottom: 1px solid #d5d5d5;
		list-style: none;
		padding: 8px 0;
		margin: 0 0 0 2px;
	}
	#subMenuListLvl1 li a
	{
		background: url(../images/common/nav_arrow_black.gif) 0 4px no-repeat;
		padding: 0 0 0 10px;
		display: inline-block;
		color: #5c5c5c;
		font-size: .816em;
		font-weight: normal;
	}
		#subMenuListLvl1 a:hover
		{
		}


/* Secondary Navigation - Second level */
#subMenuListLvl2
{
	margin: 5px 0 0 8px;
	padding: 0;
}
	#subMenuListLvl2 li
	{
		border: 0;
		width: 130px;
		display: inline-block;
		padding: 0;
		margin: 0 0 4px 0;
	}
		#subMenuListLvl2 li a
		{
			color: #555;
		}
	#subMenuListLvl2 .leftMenuSelected
	{
		font-weight: normal !important;
	}
	
/* CAROUSEL */
#carousel
{
	display: inline;
	float: left;
	width: 750px;
	height: 480px;
	padding: 0;
	margin: -10px 0 0 0;
	position:relative;
}

/* 
	    root element for the scrollable. 
	    when scrolling occurs this element stays still. 
	*/ 
	
	div.scrollable { 
	 
	    /* required settings */ 
	    position:relative; 
	    overflow:hidden; 
	    width: 750px;
	    height: 480px;
	    float: left;
	} 
	 
	/* 
	    root element for scrollable items. Must be absolutely positioned 
	    and it should have a super large width to accomodate scrollable items. 
	    it's enough that you set width and height for the root element and 
	    not for this element. 
	*/ 
	div.scrollable div.items { 
	    /* this cannot be too large */ 
	    width:20000em; 
	    position:absolute; 
	} 
	 
	/* 
	    a single item. must be floated on horizontal scrolling 
	    typically this element is the one that *you* will style 
	    the most. 
	*/ 
	div.scrollable div.items img { 

	    overflow: hidden;
	    display: inline;
	}

	.prev, .next
	{
		display: inline;
		width: 62px;
		height: 480px;
		float: left;
		cursor: pointer;
		position:absolute;
		z-index:999;
	}
		.prev 
		{
			margin:0;
			background:url(../images/common/prev.png) no-repeat;
			top:0px;
			left:0;
		}
		.next
		{
			margin:0;
			background:url(../images/common/next.png) no-repeat;
			right:0;
		}	


/* Etc */
.right
{
	float: right;
}
.left
{
	float: left;
}
.inputHidden
{
	display: none !important;
	height: 0;
	width: 0;
}
.clearFix
{
	clear: both;
	font-size: 0;
	height: 0;
	line-height: 0.0;
}