/*
 * File: layout.css
 * Description: Used for positioning and overall structure of site and components
 * Guidelines: Order properties by display, position, box model (margin, border, padding, width, height), float, clear, z-index
 * 
 * TABLE OF CONTENTS
 * -------------------------
 * 1. General
 * 2. [Headers]
 * 3. Links & Buttons
 * 4. Images & Thumbnails
 * 5. Forms
 * 6. Header
 * 7. Footer
 * 8. Main Content + Game Details + News Article Pages + Studio + Profile
 * 9. Drop Down
 * 10. Sidebar
 * 11. Sidebar & Page Components
 * 12. Accordion
 * 13. Bottom Cap
 * 14 Confirmation Box (Facebox)
 * 15. Tabs
 * 16. Media Content
 * 17. Studio Highlights
 * 18. Rating Component
 * 19. Spotlight Component
 * 20. Spore Component
 * 
 * Copyright 2008 Fi (www.f-i.com)
 */

/* GENERAL
================================================== */

/* HEADERS
================================================== */

h1 {
	/* intentially blank */
}
#mainContent h1{
	margin: 0px 0px 3px 0px;
}
span.h1subline {
	display: block;
	margin-top: -5px;
}



/* LINKS & BUTTONS
================================================== */

a.more {
	padding: 2px 23px 2px 0px;
	line-height: 17px; /* prevent cropping of bg image in IE */
}

a.download {
	padding: 4px 20px 4px 0px;
}

a.searchDropArrow {
	width: 18px;
	height: 30px;
}

.btn_confirm_cart_lg_wrapper {
	margin-top: 10px;
	padding-right: 35px;
}

.btn_confirm_cart_lg {
	display: block;
	border: 0;
	padding-bottom: 3px;
	padding-left: 10px;
	min-width: 215px;
	height: 40px;
}

.btn_explore_large,
.btn_explore_small{
	width: 300px;
	height: 52px;
	margin-bottom: 11px;
}
.btn_explore_large span{
	line-height: 46px;
	padding: 1px 24px 1px 0px;
}
.btn_explore_small span {
	line-height: 46px;
	padding: 4px 24px 4px 0px;
}
.btn_Cross{
	height: 15px;
	padding-right: 17px;
}

.btn_ImgPrev,
.btn_ImgNext {
	display: block;
	width: 40px;
	height: 50px;
}


#gameReviewList .btn_Cross {
	width: 15px;
	position: absolute;
	top: -10px;
	left: 172px;
}

#myPlaylist .btn_Cross {
	position: absolute;
	top: 10px;
	right: 10px;
}

.btn_AddToReviewList{
	height: 22px;
	width: 22px;
	display: block;
	float: left;
	margin: 2px 7px 0px 0px;
}

.btn_clearSearch {
	display: block;
	width: 14px;
	height: 14px;
}

#media_search_form .btn_clearSearch {
	position: absolute;
	bottom: 21px;
	right: 72px;
}

.btn_info_sm {
	margin-right: 2px;/* spacing between cart and info button */
}




/* Images & Thumbnails
================================================== */

/* Thumbnail Icons */
.iconVideo {
	display: block;
	width: 38px;
	height: 38px;
	position: absolute;
	top: 46px;
	left: 68px;
}
/* Image overlay */
.imageOverlay{
	width: 590px;
	height: 55px;
	position: relative;
	padding: 15px 20px 0px 20px;
}
/* Video overlay */
.videoOverlay{
	display: block;
	position: absolute;
	height: 35px;
	width: 35px;
	padding: 0px;
	top: 23px;
	left: 36px;
	cursor: pointer;
}
/* AJAX Loader */
#ajax-loader{
	text-align: center;
	position: relative;
}
#ajax-loader img{
	background: none;
	width: 172px;
	height: 49px;
	display: none;
	position: absolute;
}





/* FORMS
================================================== */

input.searchField {
	padding-top: 8px;
	padding-left: 6px;
	border: 0px;
	height: 22px;
}

input.searchSubmit {
	padding: 0px 20px 1px 20px;
	border: 0px;
	height: 22px;
	cursor: pointer;
}
#header_search .submitsd,
#header_search .submitsd_on,
#searchField .submitsd,
#searchField .submitsd_on{
	float: left;
	height: 30px;
	padding-left: 2px;
	cursor: pointer;
}
input.searchGo {
	width: 50px;
	height: 30px;
	border: 0px;
	margin-left: -3px;
}

.c_storelocator input.searchField {
	width: 149px;
}

/* HEADER
================================================== */

body.anchorTop #header {
	margin-top: 0px;
}

#breakingNews {
	padding-top: 8px;
	height: 23px;
}

#breakingNews h6 {
	margin-right: 10px;
	width: 70px;
	height: 16px;
	float: left;
}

#breakingNews p.news {
	padding-top: 2px;
	float: left;
}

#breakingNews a.close {
	display: block;
	margin-top: -2px;
	width: 19px;
	height: 19px;
	float: right;
}

#navigation {
	height: 60px; /* +1px drop shadow that needs to overlay main content */
	margin-bottom: 13px; /* -1px drop shadow that needs to overlay main content */
}


#navigation div.logo {
	width: 94px;
	height: 95px;
	float: left;
	margin-top: -60px;
margin-left: 43px;
	display: inline;
}

#navigation div.logo a {
	display: block;
	width: 94px;
	height: 95px;
}


#utils {
	margin-top: 9px;
	float: right;
	width: 850px;
	padding-left: 0px;
	margin-left: 0px;
}

/* new counter style
#counter {
	margin-right: 11px;
	width: 200px;
	height: 28px;
	float: right;
}
*/

 
#counter {
	margin-right: 4px;
	width: 290px;
	height: 30px;
	float: right;
	padding-left: 0px;
	margin-left: 0px;
}
#counter dt {
	display: none;
}
#counter dd {
	display: block;
	position: relative;
	height: 22px;
	left: 133px;
	padding: 7px 0px 0px 6px;
	width: 150px;
	cursor: pointer;
}


#header_search {
	padding-left: 5px;
	height: 30px;
	float: right;
	
}

#header_search input.searchSubmit {
	height: 30px;
	
}

#header_search input.searchField {
	padding-left: 30px;
	width: 372px;
	float: left;
}




/* ----- Main Menu ----- */
#menu {
	padding-top: 11px;
	margin-left: -10px;
	padding-left: 1px;
	height: 45px;
	overflow: hidden;
	float: left;
	z-index: 1099;
}

#menu li {
	float: left;
	margin-top: 4px;
	margin-left: -1px;
}

#menu li div.sub_nav {
	position: absolute;
	margin-top: 0px;
	padding-right: 22px;
	left: -9999px;
	z-index: 426;
	margin-left: -3px;
	padding-bottom:14px;
}
/* wrapper div for content inside sub menu */
#menu li div.sub_nav div {
	padding-top: 0px;
	padding-left: 5px;
	margin-left: 9px;
	margin-right: 13px;
	border-top: 3px #00304f solid; /* add blue border-top to sub menu wrapper */
}
/* reset inner divs */
#menu li div.sub_nav div div {
	border: none;
	padding: 0px;
	margin: 0px;
}


/* ----- Menu Buttons ----- */
#menu li,
#menu li a {
	display: block;
	height: 38px;
	width: auto;
}

#menu li {
	padding-right: 10px;
}

#menu li a {
	padding: 10px 20px 0px 20px;
	height: 28px;
}

#menu li a span {
	display: block;
	margin: 0;
	padding: 0;
	height: 13px;
}

#menu li.drop a span {
	padding-right: 16px;
}

/* Reset styles for second level nav elements */
#menu li div li,
#menu li div a,
#menu li div a span {
	display: inline;
	margin: 0;
	padding: 0;
	height: auto;
	width: auto;
}

#menu li div li {
	display: block;
	float: none;
}

#menu li div {
	margin: 0;
	padding: 0;
}

/* ----- Menu - Games drop down ----- */
#menu li.games div.sub_nav {
	width: 525px;
}
#menu li.games div.sub_nav div {
	padding-bottom: 10px;
	overflow: hidden;
}

#menu li.games div.sub_nav div div.featuredAreas div.featuredGame {
	margin: 10px 0px 0px 0px;
	padding: 10px 14px 18px 12px;
	padding-left: 13px;
	width: 118px;
	height: 120px;
}

#menu li.games div.sub_nav div div.featuredAreas img {
	margin: auto;
	margin-bottom: 10px;
	margin-top: 10px;
}

#menu li.games div.sub_nav div div.featuredAreas,
#menu li.games div.sub_nav div dl {
	float: left;
	border-top: none;
}

#menu li.games div.sub_nav div div.featuredAreas {
	width: 151px;
	padding-top: 7px;
	padding-right: 5px;
	padding-left: 5px;
	padding-bottom: 0px;
}

#menu li.games div.sub_nav div dl {
	margin-top: 10px;
/*	margin-bottom: 10px; */
	padding: 0px 10px 0px 10px;
	border-left: 1px solid #ddd;
	border-top: 0px;
}


#menu li.games div.sub_nav div dt {
	padding: 10px;
	margin-bottom: 6px;
	width: 125px;
	height: 9px;	
}

#menu li.games div.sub_nav div li a,
#menu li.games div.sub_nav div dd a {
	display: block;
	padding-top: 4px;
	padding-bottom: 1px;
	padding-left: 10px;
	width: 135px;
	height: 19px;
}


/* ----- Menu - Studio drop down ----- */
#menu li.studio div.sub_nav {
	width: 263px;
}

#menu li.studio div.sub_nav div {
	padding: 0px;
	margin-top: 0px;
}

#menu li.studio div.sub_nav div ul li{
	margin-left: 3px;
	margin-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
}

/* item text */
#menu li.studio div.sub_nav li a {
	display: block;
	padding: 7px 5px;
	width: 225px;
	height: 63px;
	overflow: hidden;
}
/* item header */
#menu li.studio div.sub_nav li a span {
	display: block;
	padding: 7px 0px 3px 0px;
}

#menu li.studio div.sub_nav li + li {
	border-top: 1px solid #dedede;
}

#menu li.studio div.sub_nav li img {
	float: left;
}

#menu li:hover div.sub_nav,
#menu li.fakeHover div.sub_nav {
	left: auto;
}







/* DROP DOWN
================================================== */

.drop-default_wrapper, .drop-default_wrapper_Up,
.drop-game_wrapper, .drop-game_wrapper_Up{
	padding-bottom: 13px;
	padding: 0px 5px 14px 2px;
	position: absolute;
	left: -2px;
	visibility: hidden;
	margin: 0px;
}
.drop-default_wrapper_Up{
	padding-top: 7px;
	padding-bottom: 2px;
}
ul.drop-default li span, ul.drop-default_Up li span,
ul.drop-game li span, ul.drop-game_Up li span{
	color: #717171;
	display: block;
	border-top: 1px #e5e5e5 solid;
	width: 126px;
	margin-left: 2px;

}
ul.drop-game li span,
ul.drop-game_Up li span{
	padding: 6px 5px 6px 5px;	
}
ul.drop-default li span,
ul.drop-default_Up li span{
	padding: 6px 3px 6px 5px;
}




