/* blsac.css
	BLSAC website, main CSS
	(c) 2006 David D'Amico
*/



/* main colours:
	background, lighter beige: #F7F2E4
	content container interior: #F7EDD4 to #F7EFDE
	main blue: #004986
	nav background yellow: #F2B314
*/

body {
	/* some setup, our background field and 'bleed' */
	background-color: #F7F2E4;
	margin: 0px;
	
	/* base font attributes for site */
	font-family: helvetica, arial, sans-serif;
	font-size: 14px;
}

/* next font size down */
.smaller {
	font-size: 12px;
}


/* by default none of our images have a border */
img { border: 0px; }

a { color: #004986; text-decoration: none; }
a:hover { text-decoration: underline; }

div.logicalBlock { margin-bottom: 30px; }
div.logicalBlock h1, div.logicalBlock h2,
div.logicalBlock h3, div.logicalBlock h4  { margin-bottom: -10px; }


/* generic style for a text block containing images that
	we want to float to the left */
.genericTextBlockWithImage {
	padding-top: 5px;
}

.genericTextBlockWithImage img {
	float: left;
}
/* end set */


/* this is the main site area, bounded at the top by the
	darker yellow, at the left and right by the blue bars */
#layoutContainer {
	/* centers the layout piece in the browser window */
	margin: 25px auto 0px auto;
	
	/* the size of the layout container */
	width: 800px;
	min-height: 800px;/* TODO correct the height, should just be 100%, OR ELSE should be a minimum size */
	
	/* background information for the layout container --colour field
		plus a gradient across the top 300-400 pixels. */
	/* TODO verify that gradient is showing up */
	background-color: #F7EFDE;
	background-image: url(../imagesCommon/layoutContainer_bgGradient.gif);
	background-repeat: repeat-x;
	
	/* blue bars on either side of the layout container */
	border-left: 13px solid #004986;
	border-right: 13px solid #004986;
	
	
}


/* FORM definitions */
input, textarea, select {
	font-size: 13px;
	font-family: helvetica, arial, sans-serif;
	xborder: 1px solid #004986;
}


/* logo + typemark */
#banner {
	padding-top: 10px;
	margin-left: -10px;
	margin-bottom: 10px;
}


/* =========================================================== */
/* BEGIN navigation styling */
/* generic styling for style free horizontal display lists,
	used here for navigation pieces */
.navigationList, .unstyledList {
	list-style-type: none;
	margin-bottom: 8px;
}


.navigationList li {
	display: inline;
}

.navigationList li a {
	text-decoration: none;
}

/* this one just pulls the navigation chunk up a bit closer to
	the banner --without it, there was a bit too much space
	between them. */
#navigation {
	margin-top: -10px;
}

/* setting the default text size and weight, and the background
	colour for the two navigation bars that extend out from the
	right-most edge of the layout container. The padding-left 
	creates the handsome gap between the bars' left-most edge and
	the layout container's left-most edge. */
.mainNavigationBar {
	font-size: 16px;
	font-weight: bold;
	
	background-color: #F2B314;
	height: 28px;
	padding-left: -20px;
	margin-bottom: 10px;
}

/* we have used two unordered lists to structure the two menu bars.
	here we style the lists. First, overall we don't want to see
	any list decoration */
.mainNavigationBar ul { padding-top: 8px;}

/* display the list items horizontally, and leave space between them */
.mainNavigationBar ul li {
	margin-right: 35px;
}

/* bit of a hack to remove the li indentation from the first menu item,
	so that the menu aligns with the left edge of the logo --the first
	item in each bar is marked as such, and is pulled over to the left */
.mainNavigationBar ul li.liFirst {
	margin-left: -28px;
}

.mainNavigationBar ul li a {
	color: white;
}

.mainNavigationBar ul li a:hover {
	color: #004986;
}

/* the language chooser right below the main nav */
#languager {
	font-size: 11px;
	font-weight: bold;
	text-align: right;
	
	margin-top: -8px;
	margin-right: 5px;
}



/* SUBNAVIGATION */
#subNavigation {
	font-size: 12px;
	font-weight: bold;
	margin-left: -20px;
	margin-bottom: 30px;
}

#subNavigation ul li {}

#subNavigation ul li a {
	color: #8F9479;
	border-right: 2px solid #CBC9B2;
	
	padding-right: 5px;
	margin-right: 10px;
}

#subNavigation ul li a:hover,
#subNavigation .navigationList .activeHeading a {
	color: #F2B314;
	border-right: 2px solid #F2B314;
}


/* SUB-SUBNAVIGATION */
.subSubNavigation {
	width: 100%;
	text-align: center;
	font-size: 11px;
	margin-bottom: 25px;
}

.subSubNavigation ul { margin-right: 50px; }

.subSubNavigation ul li {
	border-right: 1px solid #CBC9B2;
	padding: 2px 5px 0px 0px;
	margin-right: 5px;
}

.subSubNavigation .navigationList .activeHeading a { color: #F2B314; }
/* END navigation styling */
/* =========================================================== */




/* handles any positioning that applies to ALL elements inside the
	layout container */
#layoutInner {
	margin-left: 24px;
	padding-bottom: 50px;
}

/* The content container --the column on the right
 	containing the page's content. This div is just
  	the shell for an inner div, we use two to create
	the two-stage border effect around the content
	area */
#contentContainer {
	width: 730px;
	background-color: white;
	border: 1px solid #CBC9B2;
	margin-top: 20px;
}

/* inner box of the content container --we add an inner box to
	define an interior border */
#contentContainer_inner {
	border: 1px solid #8F9479;
	margin: 5px;
	background-color: #F7F2E6;
}

/* container for the main content text */
#contentText {
	padding-left: 10px;
	padding-right: 20px;
	padding-bottom: 20px;
	margin-top: -10px;
	
	line-height: 20px;
	text-align: left;
}


/* selector for elevated cap in so marked paragraphs --*/
#contentText p.elevatedCapPara:first-letter {
	font-size: 25px;
	font-weight: bold;
	line-height: 20px;
}

/* Some margin styles for the section heading graphic,
 	mostly just to get it positioned correctly*/
#sectionHeader {
	margin: -6px 0px 0px -6px;
}




/* styles for link/description split table
 	used on several pages in the site (marked
	class "linkSplitColumnTable") */
table.linkSplitColumnTable {
	font-size: 12px;
	
	border-collapse: collapse;
	border: 0px;
	
	margin: 10px 0px 20px 0px;
}

table.linkSplitColumnTable caption {
	font-size: 14px;
	font-weight: bold;
	text-align: left;
}

table.linkSplitColumnTable tr td ul.unstyledList li {
	margin-left: -40px;
}

table.linkSplitColumnTable tr {
	border-top: 1px solid #CBC9B2;
}

table.linkSplitColumnTable tr td {
	vertical-align: top;
	padding: 5px 10px 20px 0px;
}

table.linkSplitColumnTable tr td.link {
	width: 150px;
}

table.linkSplitColumnTable tr td.link a,
table.linkSplitColumnTable tr td.link p {
	font-size: 11px;
	font-weight: bold;
}

table.linkSplitColumnTable tr td.link a {
	color: #004986;
}
/* END linkSplitColumnTable */



/* styles for linkSingleList --style
	used for link lists which have no descriptions,
	just the links themselves. This is done as a 
	div containing a heading and an unordered
	list.
*/
div.linkSingleList {
	margin-bottom: 20px;
	width: 400px;
}

div.linkSingleList h1 {
	font-size: 16px;
	
	width: 400px;
	
	border-bottom: 1px solid #8F9479;
	margin-bottom: -10px;
	
}

div.linkSingleList ul {
	margin-left: 0px;
}
/* END linkSingleList */



/* styles for the executive member page, which
	uses a two-column layout, fixed links on the
	left side and changing content on the right.
	We begin with the block as a whole. The negative
	left margin pulls it over to the content container's
	edge, and then we hard set dimensions, particularly
	the height as, for some reason, without a fixed
	height for this block its content fails to stretch
	it open to accomodate its size. */
.executive2Column {
	margin-left: -40px;
	width: 680px;
	height: 850px;
}

/* the left column sits over on the left, has a fixed
 	width, and a gap to its right. */
.executive2Column .executiveLeftColumn {
	float: left;
	width: 200px;
	margin-right: 5px;
}

/* here are the styles for the unordered  list of links
	that the left column contains */
.executive2Column .executiveLeftColumn ul {
	list-style-type: none;
	font-size: 11px;
	font-weight: bold;
	line-height: 13px;
}

.executive2Column .executiveLeftColumn ul li {
	margin-bottom: 14px;
}

.executive2Column .executiveRightColumn {
	float: right;
	width: 455px;
	
}



.executiveBlock {
	background-color: white;
	border: 1px dotted #CBC9B2;
	margin-bottom: 15px;
	margin-top: 6px;
}

.executiveBlock_inner {
	border: 1px solid #8F9479;
	margin: 5px;
	background-color: #f7edd4;
}

/* the main executive brief text flows around to
	the right of the image */
.executiveBlock img {
	float: left;
	margin: 3px 10px 3px 4px;
	border: 1px solid #59554c;
}

.executiveBlock .executiveBrief {
	line-height: 12px;
	padding: 5px;
}

.executiveBlock h1 {
	font-size: 16px;
}

.executiveBlock h2 {
	font-size: 14px;
	line-height: 8px;
}

.executiveBlock h3 {
	font-size: 12px;
	line-height: 13px;
	width: 350px;
}

.executiveBlock h1, .executiveBlock h2, .executiveBlock h3 {
	margin-left: 5px;
}

.executiveBlock .executiveDetail {
	font-size: 12px;
	margin: -10px 20px 25px 10px;
}
/* end executive */



/* BEGIN conferenceEmph, a style used on the events
	page to style the mini-advertisement for the 2007
	conference */
div.conferenceEmph {
	text-align: center;
}

div.conferenceEmph h1 {
	font-size: 24px;
	line-height: 24px;
	
	margin-bottom: -10px;
}

div.conferenceEmph h2 {
	font-size: 18px;
	text-decoration: underline;
}

div.conferenceEmph h2,
div.conferenceEmph h3 {
	margin-bottom: -10px;
}
div.conferenceEmph h4 {
	margin-bottom: -15px;
}

div.conferenceEmph h4.lastItem {
	margin-bottom: 10px;
}
/* END conferenceEmph */



/* BEGIN formTable */
table.formTable {
	margin-bottom: 30px;
}

table.formTable caption {
	text-align: left;
	font-weight: bold;
}

table.formTable td {
	text-align: left;
	vertical-align: top;
}

table.formTable td.labelSide {
	width: 300px;
}
/* END formTable */



/* BEGIN CARTTABLE - Styles for registration page */
table.cartTable {
	border-collapse: collapse;
}

table.cartTable td {
	padding-left: 10px;
	padding-top: 20px;
	padding-bottom: 5px;
	vertical-align: bottom;
	line-height: 12px;
}

table.cartTable td.description {
	font-size: 14px;
	line-height: 15px;
	font-weight: bold;
	padding-right: 20px;
	width: 325px;
}

table.cartTable td.description .detailText {
	margin-top: 5px;
	font-size: 12px;
	line-height: 12px;
	font-weight: normal;
}

table.cartTable td.description .detailText ul {
	margin-top: 2px;
}

table.cartTable td.price {
	width: 200px;
	font-size: 12px;
	text-align: right;
}

table.cartTable td.price h2 {
	font-weight: bold;
	font-size: 28px;
	line-height: 28px;
	margin-bottom: 0px;
}

table.cartTable td.add {
	width: 125px;
	text-align: right;
}

table.cartTable tr
{ border-bottom: 2px grey dotted; }
/* END CARTTABLE */


/* styles for in body-text seqences of photos */
div.photoSequence img {
	margin-bottom: 10px;
	xborder: 1px solid #CBC9B2;
	border: 1px solid #8F9479;
	padding: 2px;
	background-color: white;
}
/* END photoSequence */

div.sponsorGroup {
	width: 100%;
	text-align: center;
}

div.sponsorGroup h4 {
	margin-bottom: 0px;
}
div.sponsorGroup ul {
	padding: 0px;
	margin: 0px;
}
div.sponsorGroup ul li {
	margin-bottom: 5px;
}



/* BEGIN decorative classes */
/* Use for hidden items */
.hidden {
	display: none;
}

/* just what it says, turns stuff red! */
span.red {
	color: red;
}

/* puts a border around an image for emphasis */
img.imgBorder {
	border: 1px solid #CBC9B2;
}

/* underline class */
.underline {
	text-decoration: underline;
}

/* puts a dashed box around a block level
 	item in a palette colour */
.dashedEmphasizedBox {
	border: 2px dashed #CBC9B2;
	padding: 15px;
}
/* END decorative classes */
.registerform_head
{
background: #004986;
font-weight:bold;
font-size: 14px;
color: white;
}
.registerform_tr td {
border-bottom: 1px solid black;
font-size: 12px;
}
.registerform_tr2 td {
border-bottom: 1px solid black;
font-size: 12px;
}
.registerform_tr input {
width: 250px;
}

.registerform_tr3 td {
font-size: 12px;
}
.registerform_tr3 input {
width: 250px;
}


#con_menu_item {
	background-color: #f2b314; 
	width: 160px; 
	height: 17px; 
	color: white; 
	font-weight: bold; 
	text-align: right; 
	padding: 2px 4px 2px 0px;
	font-size: 12px;
	margin-bottom: 2px;
	}
#con_menu {
	border-right: 3px solid #004986;
	width: 164px; 
	}
#con_menu_item a:hover { color: #004986; text-decoration: none; }
#con_menu_item a:link { color: white;}
#con_menu_item a:visited { color: white;}