/*
	--------------------------------------------------
	STRUCTURE STYLES
	--------------------------------------------------
	Client:	
	Author:	
	Date:	Month, Year
		
*/

/* structure.css are the styles for the DIVs in a website and should not contain
any typographic or content-related styles for a site. The styles within are strictly
used to create the layout/structure of the website and, as such, this style sheet 
will (almost) never need to be altered by the client or back-end programmers. */

/* ----- comment styles well for better reference later! ----- */
/* ----- try to lay this out in the following sections and from top to bottom on pages ----- */


/* ===================================================================================== STYLES FOR ALL PAGES */


/* ===== Background Wrappers For Site ===== */

#background {
	background: url(../images/structure/content_bg.jpg) repeat-y top center;
}

#background .upper {
	background: url(../images/structure/upper_bg.jpg) repeat-x;
}

#background .head {
	background: url(../images/structure/head_bg.jpg) no-repeat top center;
}

#background .upperContent {
	background: url(../images/structure/upper_content_bg.jpg) no-repeat center 201px;
}

.home #background .upperContent {
	background: url(../images/structure/upper_content_home_bg.jpg) no-repeat center 201px;
}


/* ===== Main Wrapper For Site ===== */

#uber {
	position: relative;
	margin: auto;
	width: 977px;
}


/* ===== Header ===== */

#header {
	float: left;
	margin: 0;
	padding: 0;
	width: 977px;
	height: 201px;
}


/* ===== Search ===== */

#search {
	position: relative;
	float: right;
	display: block;
	margin: 0;
	padding: 0;
	top: 4px;
	right: 0;
	width: 156px;
	height: 20px;
	background: url(../images/structure/searchBox.jpg) no-repeat 0 0;
}

#search form { display: inline; }

#search .searchText {
	position: absolute;
	padding: 0;
	top: 3px;
	left: 5px;
	border: none;
	width: 124px;
	background: transparent;
	font-size: 11px;
	color: #004B8E;
}

#search .gobutton {
	position: absolute;
	top: 0;
	right: 0;
	width: 20px;
	height: 20px;
}


/* ===== Top Navigation ===== */

#topNav {
	float: right;
	margin: 0;
	padding: 6px 14px 5px 14px;
	width: 500px;
	height: 1.2em;
	text-align: right;
	font-size: 12px;
	color: #FFF;
	overflow: hidden;
}


/* ===== Logo ===== */

#logo {
	float: left;
	margin: 0;
	padding: 34px 0 0 0;
	width: 217px;
	height: 70px;
	overflow: hidden;
}

#tagLine {
	float: right;
	padding: 40px 0 0 0;
	width: 500px;
	height: 47px;
	font: normal 18px/22px Georgia, "Times New Roman", Times, serif;
	color: #FFF;
	overflow: hidden;
}


/* ===== Main Navigation ===== */

#mainNav {
	position: absolute;
	float: left;
	clear: both;
	top: 139px;
	margin: 0;
	padding: 0;
	width: 977px;
	background: url(../en/images/structure/mainNav.jpg);
	z-index: 1000;
}


/* ===== Main Content Container ===== */

#mainContainer {
	position: relative;
	float: left;
	width: 1001px;
}

#main {
	position: relative;
	float: left;
	width: 977px;
	min-height: 384px;
	height: auto !important;
	height: 381px;
}


/* ===== Footer ===== */

#footer {
	float: left;
	margin: 0;
	padding: 0 0 20px;
	width: 100%;
}

#footer .content {
	background: url(../images/structure/content_bg.jpg) repeat-y center top;
}

#footer .top {
	height: 5px;
	background: url(../images/structure/accreditations_top_shadow.jpg) no-repeat center top;
}

#footer #accreditations {
	margin: auto;
	padding: 17px 0 5px 45px;
	width: 977px;
}

#footer #accreditations img {
	padding-left: 90px;
	padding-right: 90px;
}

#footer #accreditations img.last {
	padding-right: 0;
}

#footer .base {
	height: 32px;
	background: url(../images/structure/content_base.jpg) no-repeat center top;
}

#footer_signoff {
	margin: auto;
	padding: 0 50px;
	width: 927px;
	font: normal 11px/14px Verdana, Geneva, sans-serif;
	color: #00386A;
}

#footerText {
	float: left;
	overflow: hidden;
}

#footerNav {
	float: left;
	margin: 0;
	padding: 0;
	text-align: left;
	overflow: hidden;
}

#esol {
	float: right;
	margin: 0px 0px 0px 0px;
	background: transparent url(../en/images/structure/esolutionsgroupLogo.gif);
}

#esol a {
	display: block;
	width: 171px;
	height: 17px;
}

#esol img {
	display: block;
	width: 0;
}




/* ===================================================================================== STYLES HOME PAGE */

#main .content {
	float: left;
	margin: 0;
	padding: 3px 0 0;
	width: 977px;
	background: url(../images/structure/home_shadowBelowNav.jpg) no-repeat 0 0;
}


/* ===== Banner ===== */

#homepageBannerContainer {
	float: left;
	position: relative;
	margin: 0;
	padding: 0 11px 0 0;
	width: 568px;
	height: 381px;
	background: url(../images/structure/home_bannerimage_shadow.jpg) no-repeat right top;
	overflow: hidden;
}

#homepageBanner {
	border: 1px solid #FFF;
	border-top-width: 1px;
	border-right-width: 2px;
	border-bottom-width: 2px;
	border-left-width: 4px;
	width: 562px;
	height: 378px;
}

#homepageBannerContainer .overlay {
	position: absolute;
	padding: 73px 49px 10px 30px;
	top: 213px;
	left: 0;
	width: 500px;
	height: 85px;
	background: url(../images/structure/home_banner_overlay.png) no-repeat 0 0;
	overflow: hidden;
	z-index: 100;
}

#callouts {
	float: left;
	padding: 19px 0 0 13px;
	width: 364px;
	height: 361px;
	overflow: hidden;
}


/* ===== Left Content ===== */

#contentLeft {
	float: left;
	padding: 10px;
	width: 739px;
	border-right: solid 1px gray;
}


/* ===== Right Content ===== */

#contentRight {
	float: left;
	width: 180px;
	padding: 10px 0 10px 10px;
}




/* ===================================================================================== STYLES FOR CONTENT PAGES */


/* ===== Actions and Breadcrumbs ===== */

#actionsContainer {
	position: relative;
	float: left;
	margin: 0;
	padding: 28px 50px 8px 50px;
	width: 877px;
	height: 32px;
	background: url(../images/structure/actionsContainer_bg.jpg) repeat-x 0 0;
	font: 11px/14px Georgia, "Times New Roman", Times, serif;
	color: #474747;
}
/*
#breadcrumbs {
	float: left;
	padding: 0;
	width: 680px;
	height: 18px;
	overflow: hidden;
}

#actions {
	position: relative;
	float: right;
	padding: 0;
	width: 170px;
	height: 18px;
	text-align: right;
	overflow: hidden;
}
*/
#breadcrumbs {
	float: left;
	padding: 0;
	width: 575px;
	height: 18px;
}
#actions {
	position: relative;
	float: right;
	padding: 0;
	width: 285px;
	height: 18px;
	text-align: right;
}
#actions form { display: inline; }


/* ===== Sub Nav ===== */

#subNavContainer {
	float: left;
	margin: 0 0 20px 1px;
	padding: 0;
	width: 277px;
	background: url(../images/structure/subNav_bg_vert.jpg) repeat-y right top;
}

#subNavContainer .top,
#subNavContainer .base {
	float: left;
	width: 277px;
	height: 3px;
	background: url(../images/structure/subNav_top.jpg) no-repeat right top;
	overflow: hidden;
}

#subNavContainer .base {
	background-image: url(../images/structure/subNav_bottom.jpg);
}


/* ===== Interior Layout ===== */

.mainInterior {
	background: #FFF;
}

#contentInt {
	float: left;
	padding: 0 0 0 11px;
	width: 676px;
	background: url(../images/structure/int_bg_shade.jpg) no-repeat 11px 0;
	overflow: hidden;		
}

/* -- This is a full width interior - used when there is no sub navigation on the page -- */

#contentInt.wide {
	width: 955px;
	background: #FFF url(../images/structure/int_bg_shade_wide.jpg) no-repeat 11px 0;
}

#pageTitle {
	width: 676px;
	padding: 0;
	margin: 0;
	background: url(../images/structure/pageTitle_underline.jpg) no-repeat left bottom;
}

.wide #pageTitle {
	width: 955px;
	background-image: url(../images/structure/pageTitle_underline_wide.jpg);
}

#contentInt .content {
	padding: 30px 30px 0;
	width: 616px;
	background: none;
}

#contentInt.wide .content {
	width: 895px;
}