/* ----------------------------------- */
/*                                     */
/*           CSS FOR SWFTA             */
/*                                     */
/*           1. Globals                */
/*           2. Header                 */
/*           3. Navigation             */
/*           4. Content                */
/*              4.1. Staff             */
/*           5. Footer                 */
/*           6. Logos                  */
/*                                     */
/* ----------------------------------- */

html, body, ul, ol, li, p, 
h1, h2, h3, h4, h5, h6, 
form, a { 
margin: 0; 
padding: 0; 
border: 0; 
}

.tobechecked {
	background-color: #FFFF66;
	}

/* ----------------------------------- */
/*         1. GLOBAL ELEMENTS          */
/* ----------------------------------- */

body  {
	margin: 0; 
	padding: 0; 
	font-size: 100%;
	font-family: Helvetica, Arial, sans-serif;	
	text-align: center;
	}
		
#all { 
	background: #e2e0d3 url('images/bkg_pics/all_bkg_swirl.png') top center repeat-y;
	}	

#the_rest {	
	margin: 0 auto; /* This is to get the container centered in Firefox, Netscape, etc */
	width: 950px; 
	padding: 0;
	text-align: left;
	}
	
div.clear {
	clear: both;
	margin: 0; 
	padding: 0;
	}	
	
a {
	color: #0066CC;
	}
	
a:hover {
	color: #3399FF;
	}
	
.align_right {
	text-align: right;
	font-size: 80%;
	}
				
	
/* ----------------------------------- */
/*              2. Header              */
/* ----------------------------------- */

#header {
	height: 241px; /* Height includes #menu */
	background: #c6c2a9 url('images/bkg_pics/header_bkg_swirl.png') top center no-repeat; 
	width: 100%;
}

#head_bkg{
	width: 950px;
	height: 200px;
	margin: 0 auto;
	padding: 0;
	background: #ffffff url('images/header_pics/swfta_header_bkg.png') top right no-repeat;
	border-bottom: 1px solid #cccccc;
	border-top: 10px solid #333333;
	}
	
#swfta_logo {
	float: left;
	height: 196px;
	width: 350px;
	/* background-color: #00FFCC; */
}

#swfta_logo h1 {
	display: none;
}

#swfta_feature {
	float: right;
	height: 200px;
	width: 330px;
}

#swfta_feature p {
	padding: 80px;
}

/* ----------------------------------- */
/*            3. Navigation            */
/* ----------------------------------- */

#menu {	
	width: 950px;
	height: 40px;
	margin: 0 auto; 
	background-color: #333333; 
}

/****
Adapted from:
TJK_keyBoardDropDown
Pure CSS Drop Down Menu [TJK_keyBoardDropDown] v1.2
****/

/* zeroing padding/margin for all elements */

#menu ul,
#menu ul * { margin:0; padding:0;}

/* "Master" UL (the whole Menu) */

#menu ul {
	position: relative;
	width: 950px;
	max-width: 100%;
	float: left;
	margin: 0px;
}

/* sub-menu ULs */

#menu ul li ul {
	width: 135px !important;/* leaves room for padding */
	cursor: default;
	position:absolute;
	height: auto;
	display: none;
	left: -10px;
	padding: 8px 0px 0px 10px;
}

/* All LIs */

#menu ul li {
	position: relative;
	width: 130px;
	cursor: pointer;
	float: left;
	list-style-type: none;
	font-weight: bold;
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;	
	text-align: left;
}

/* sub-menu LIs */

#menu ul li ul li {
	/* Removed => ( width: 140px; *FF* ) */
	padding: 0;	
	font-size: 80%;
}

/* All anchors */

#menu ul li a {
	width: 115px; /* Ensures the hover colour shows the full width */
	cursor: default;
	color: #ffffff;
	text-decoration: none;
	display: inline; /* Was (display: block;) */
	float: left;
	padding: 0 7px 0 7px;
	border-left: 3px solid #666666;
	height: 40px;
	line-height: 40px;
}

/* sub-menu Anchors */

#menu ul li ul li a {
	width: 115px; /* Ensures the hover colour shows the full width */
	position: relative !important; /* ie Mac */
	cursor: pointer !important;
	line-height: 30px;
	height: 30px;
	font-weight: normal;
	color: #ffffff;
	background-position:0 50% !important;
}

/* :hover and stuff */

#menu ul li a:hover, #menu ul li a:focus, #menu ul li a:active {
	color:#ffffff;
	background-color: #666666;
	border-left: 3px solid #cccccc;
	}

/* move the declarations from the rule below the one above if you want a background swap on *all* anchors, including the top level ones */

#menu ul ul a:hover, #menu ul ul a:focus, #menu ul ul a:active {
	color:#fff !important;
	background-color: #666666;
	}

/* display and z-index for the sub-menus */

#menu ul li:hover ul, #menu ul li.msieFix ul {
	display: inline; /* Was (display: block;) */
	z-index: 10;
	top:2em !important;
	}

/* safari: users can keep sub-menus up by from sub-menus to next top level  */
/* didn't find a solution for users going back from the last one. I prefer  */
/* to leave it like that vs. taking the last sub-menu *out of* the wrapper  */

#menu ul li#item1 {z-index:7;}
#menu ul li#item2 {z-index:6;}
#menu ul li#item3 {z-index:5;}
#menu ul li#item3 {z-index:4;}
#menu ul li#item5 {z-index:3;}
#menu ul li#item6 {z-index:2;}
#menu ul li#item7 {z-index:1;}


/* Keeping current menu accessible to JAWS */

.item1 #menu ul li#item1 ul,
.item2 #menu ul li#item2 ul,
.item3 #menu ul li#item3 ul,
.item4 #menu ul li#item4 ul,
.item5 #menu ul li#item5 ul,
.item6 #menu ul li#item6 ul,
.item7 #menu ul li#item7 ul { display:block; top:-1000px; }


/* background colors */

#item1,#item1 li a, 
#item2,#item2 li a, 
#item3,#item3 li a, 
#item4,#item4 li a, 
#item5,#item5 li a, 
#item6,#item6 li a, 
#item7,#item7 li a {background-color:#333333;}

/* "trigger" and "msieFix" classes */

#menu ul li.msieFix a {}


/* If JS is OFF we need to style the links in the sub-menu of the current page     */
/* so they are accessible to keyboard users. Using a class on each link would let  */
/* us stick each link in the same place, but we would have to plug a lot of        */
/* attributes in the markup and many rules here, so...                             */

.item1 #menu ul li#item1 ul li a:focus,
.item1 #menu ul li#item1 ul li a:active,
.item2 #menu ul li#item2 ul li a:focus,
.item2 #menu ul li#item2 ul li a:active,
.item3 #menu ul li#item3 ul li a:focus,
.item3 #menu ul li#item3 ul li a:active,
.item4 #menu ul li#item4 ul li a:focus,
.item4 #menu ul li#item4 ul li a:active,
.item5 #menu ul li#item5 ul li a:focus,
.item5 #menu ul li#item5 ul li a:active,
.item6 #menu ul li#item6 ul li a:focus,
.item6 #menu ul li#item6 ul li a:active
.item7 #menu ul li#item7 ul li a:focus,
.item7 #menu ul li#item7 ul li a:active {position:absolute !important;top:1028px !important;}



/* ----------------------------------- */
/*              4. Content             */
/* ----------------------------------- */

#main /* This is the main container*/
{
	clear: both;
	width: 950px;
	background: #ffffff url('images/bkg_pics/swfta_corners_main.png') bottom left no-repeat ; 
	/* margin: 0 auto; */
	padding: 0 0 20px 0;
}

#main ul {
	display: list-item;
	margin: 0 0 0 20px;
}

#content /* This is the left column */
{
	float: left;
	width: 585px;
	margin: 25px 0 0 25px;
	background-color: #ffffff;
	padding: 0 0 40px 0;
}

#content h2 {
	margin: 0;
	padding: 0;
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;
	border-bottom: 2px solid #ccdf8e;
}

#content h3 {
	margin: 20px 0 0 0;
	padding: 0;
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;	
}

#content p {
	padding: 10px 0 5px 0;
	line-height: 20px;
	}

#content ul {
	margin: 10px 0 0 40px;
}

#content dl {
	font-size: 80%;
	margin: 0px 0 10px 30px;
	padding: 0;
}

#content dt {
	color: #333333;
	font-size: 110%;
	margin: 10px 0 0 0;
	padding: 0;
	font-weight: bold;
}

#content dd {
	margin: 0px 0 0 0px;
	padding: 0;
}

#content table {
	font-size: 80%;
	margin: 10px 0 0 0px;
	padding: 0;
	}
	
#content th, td{
	vertical-align: top;
	border-top: 1px solid #cccccc;
	padding: 5px;
	
}

#content th {
	background-color: #F4F4F4;
	}	
	
#content th.centre, td.centre {
	text-align: center;
}	

/* ===== Hide/Show DVD details ===== */

.commenthidden {display:none}
.commentshown {display:inline}

/* ===== Hide/Show DVD details ===== */

a.hide_show, a:hover.hide_show {
	text-decoration: none;
	line-height: 30px;
	border: 1px solid #cccccc;
	background-color: #F4F4F4;
	padding: 2px;
	}

#content table tr td a.dvd_toggle {
	text-align: right;
	}

img.content_img {
	float: left;
	margin: 20px 20px 20px 0px;
	padding: 5px;
	background-color: #e2e0d3;
	border: 1px solid #c6c2a9;
	}

#highlights /* This is the right column */
{
	float: right;
	width: 280px;
	margin: 100px 20px 0 0; 
	padding:  0px 0 10px 0px;
	display: inline; /* Fixes the Internet Explorer 5/6 bug that doubles up the margin */
	background: #93be1f url('images/bkg_pics/swfta_corners_highlights_bot.png') bottom right no-repeat; 
}

#highlights h2 {
	display: none;
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;	
	}

#dvd_avail {
	/*background-color: #fff;*/
	padding: 0 0 0px 0;
	margin: 0 0 20px 0;
	background: url('images/bkg_pics/swfta_corners_highlights_top.png') top right no-repeat;

}

#dvd_avail h3 {
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;
	border-bottom: 1px dotted #999999;
	color: #000000;
	font-size: 100%;	
	font-weight: bold;
	text-transform: uppercase;
	padding: 10px 10px 15px 20px;

}

#dvd_avail a {
	font-weight: bold;
	text-align: left;
	margin: 10px 0 20px 20px;
	padding-left: 16px;
	background: url('images/bkg_pics/arrow_bullet.png') no-repeat 0 center; 
}

#spacer {
	height:20px;
}
	
#section_menu {
	width: 280px;
	margin: 0px 0 10px 0px;
	padding: 0px;
	/*background: url('images/bkg_pics/swfta_corners_highlights_top.png') top right no-repeat;*/
	}
	
#section_menu h3 {	
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;
	border-bottom: 1px dotted #999999;
	color: #000000;
	font-size: 100%;	
	font-weight: bold;
	text-transform: uppercase;
	padding: 10px 10px 2px 20px;
	}
	
#section_menu ul {		
	padding: 10px 10px 10px 0px;
	list-style: none;
	}	
	
#section_menu li {	
	font-size: 90%;	
	font-weight: bold;
	line-height: 25px;
	background: url('images/bkg_pics/arrow_bullet.png') no-repeat 0 center; 
	padding-left: 16px;
	}	
	
#highlights a, #section_menu a{	
	text-decoration: none;
	color: #00398A;
	border-bottom: 2px dotted #ffffff;
	}	
	
#highlights a:hover, #section_menu a:hover {	
	text-decoration: none;
	color: #00398A;
	border-bottom: 2px solid #00398A;
	background-color: #E0EBBA;
	}		

/* Feature */

div.feature { 
	width: 280px;
	margin: 0px 0 10px 0px;
	padding: 0px 0 0px 0px;
	}				
	
div.feature h3 {	
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;
	color: #000000;
	font-size: 100%;	
	font-weight: bold;
	text-transform: uppercase;	
	padding: 7px 10px 2px 10px;
	border-bottom: 1px dotted #999999;
	}	
	
div.feature p {
	margin: 0px;
	padding: 10px 10px 10px 20px;
	font-size: 90%;	
	color: #333333;
	}	
	
div.feature ul { 
	list-style: none;
	}		
	
div.feature ul li p { 
	padding: 10px 10px 0px 0px;
	}	
	
p.signature	 {
	float: right;
	font-weight: bold;
	}

/* Video Feature */

div.video {
	width: 280px;
	margin: 10px 0 20px 0px;
	padding: 0;
	background-color: #93be1f;
	}	
	
div.video h3 {	
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;
	color: #000000;
	padding: 7px 10px 2px 10px;
	margin: 0 0 20px 0;
	border-bottom: 1px dotted #999999;
	/* background: url('images/bkg_pics/swfta_video_bkg_top.png') top center no-repeat; */
	font-size: 100%;	
	font-weight: bold;
	text-transform: uppercase;	
	}
		

/* ----------------------------------- */
/*             4.1. Staff              */
/* ----------------------------------- */

.staff	{
	clear: both;
	margin-left: 20px;
	padding: 10px 0 0 0;
	}

.mugshot {
	float: left;
	padding: 0 10px 10px 0;
	margin: 0px;
	}

.mugshot img	{
	padding: 5px;
	}
	
.bio	{
	width: 440px;
	float: right;
	}

.bio h4	{
	margin: 0 0 0 0;
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;	
	}

.bio p	{
	padding-left: 0px;
	font-size: 80%;
	margin: 2px 0 0 0;
	}
	

/* ----------------------------------- */
/*             5. Footer               */
/* ----------------------------------- */

#footer
{
	clear: both;
	/* margin: 0 auto; */
	padding: 20px 0 30px 0px;
	width: 950px;
	height: 350px;
	background: #93be1f url('images/bkg_pics/swfta_corners_footer.png') bottom left no-repeat ; 
	text-align: left;
}

#footer h2 {
	margin: 10px 20px 10px 30px;
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;
	font-size: 110%;
	font-weight: bold;
	text-transform: uppercase;
	border-bottom: 1px solid #ccdf8e;	
	}
	
#footer h3 {	
	font-family: Gill, 'GillSans', 'Gill Sans','Trebuchet MS', sans-serif;
	color: #000000;
	font-size: 100%;	
	font-weight: bold;
	text-transform: uppercase;
	border-bottom: 1px solid #ccdf8e;
	}	
	
#contact_form {
	float: left;
	width: 400px;
	margin: 5px 70px 0 60px;
}

#contact_form input, #contact_form textarea {
	font-size: 80%;
}

#contact_form textarea { 
	border: 1px solid #ffffff;
	width: 300px;
	height: 80px;
}

#contact_form label { 
	float:none;
	display:block;
	padding: 10px 0 2px 0;
	font-size: 80%;
	font-weight: bold;
	}

#contact_form input.field {
	line-height:17px;
	border: 1px solid #ffffff;
	width: 300px;
	}
	
#contact_form input.button {
	margin: 10px 0 0 0;
}

#contact_info {
	width: 300px;
	float: left;
	margin: 5px 0 0 0;
}

#address {
	padding: 20px 0 0 0;
	font-size: 90%;
	}
	
#contact_info p {
	padding: 10px 0 0 0;
	font-size: 90%;
	}
	
/* ----------------------------------- */
/*             6. Logos                */
/* ----------------------------------- */

#associates {
	margin: 0px auto;
	height: 40px;
	width: 950px;
	padding: 20px 0 20px 0;
	background: #ffffff url('images/bkg_pics/swfta_corners_associates.png') bottom left no-repeat ; 
}

#associates h2 {
	display: none;
	}

#associates ul {
	display: inline;
	list-style: none;
	}

#associates li {
	margin: 0px 0 0 0;
	padding: 0px;
	display: inline; /* Repeated for IE5/Win */
	list-style-type: none; /* Repeated for IE5/Win */
	font-size: 0; /* This is to stop the nav bar breaking up when the font-size is increased in IE */
	}

#associates a {
	float: left;
	text-align: right;
	text-decoration: none;
	margin: 0 12px 0 0;
	height: 40px;
	color: #ffffff;
	background-position:0 0;
}

#associates a:hover{
	background-position: 0 -40px;
	color: #ffffff;
}

#associates .UoPLogo {background:url('images/demo_sponsor_logos/uop_logo.png') no-repeat ; width:40px; 
margin-left: 330px }/* Aligns the pictures to the centre - Will need changing if using other size pictures */

#associates .PCCLogo {background:url('images/demo_sponsor_logos/pcc_logo.png') no-repeat; width:55px; margin-left: 20px; }
#associates .SWSLogo {background:url('images/demo_sponsor_logos/sws_logo.png') no-repeat; width:102px; margin-left: 20px; }
/* (Not in use) #associates .MLALogo {background:url('images/demo_sponsor_logos/mla_logo.png') no-repeat; width:40px; margin-left: 20px; } */