/*--------------------------------------------------------------------------

WayaheadILP - Basic Style Sheet

Version:	1.0
Author:		Aaron / Danny 
Website:	http://ilp.wayahead.local - http://ilp.wayahead.dev

*** Last Modify Date: 09/04/2009 ( Aaron ) ***

--------------------------------------------------------------------------*/


/* =Global 
--------------------------------------------------------------------------*/

* { margin: 0; padding: 0; } 

html { height: 100%; margin-bottom: 0.01em; } /* forces v-scroll bar in all browsers */
body { line-height: 1.4; }

.clearme { clear: both; }
.hideme { display: none !important; } /* visibility: hidden; could be used here instead depends what you need */
.left { float: left; }
.right { float: right; }

acronym { speak: normal; }
abbr { speak: spell-out; }

p { display: block; }


/* =Typography
 *
 * Use this section for general type styles
--------------------------------------------------------------------------*/

html { font-size: 100.01%; }
body { font-size: 1em; font-family: Arial, Verdana, Sans-Serif; padding-top: 10px; }

#p-content { }
#s-content { }

#footer { font-size: 0.75em; }



/* Freeform - normally we have freeform wrapped inside a container of some sort */

.freeform { font-size: 0.75em; color: #7F7F7F; margin-bottom: 10px; padding-left: 9px; padding-right: 9px; }

.freeform p { margin: 0 0 9px 0; clear: both; display: block; }
.freeform ul { margin: 0 0 10px 15px; }
.freeform ol { margin: 0 0 10px 30px; } /* needs slightly bigger left margin than ul */

.freeform li { margin: 0 0 4px 0; }

.freeform ul li 
{
	list-style: none; 
	background: url(/img/bullet.gif) 0 50% no-repeat; 
	padding-left: 15px;
}
.freeform a, .freform a:hover { }

.freeform h2 { color: #2c2c2c; }
.freeform h3, .freeform h4, .freeform h5 { color: #3a3a3a; }
 
.freeform img { margin: 5px; }
/* CSS3 selectors, for the good browsers */
.freeform img[align=left] { margin-left: 0; }
.freeform img[align=right] { margin-right: 0; }


/* =Headings
--------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 { font-family: "Trebuchet MS", Arial, Sans-Serif; display: block; font-weight: normal; }

h1 { margin: 0 0 9px 0; font-size: 1.38em; }
#p-content h1 { color: #474747; }

h2 { margin: 0 0 5px 0; font-size: 1.50em; }
#p-content h2 { color: #2c2c2c; }

h3 { margin: 0 0 9px 0; font-size: 1.33em; color: #3a3a3a }
h3.stage { font-size: 0.93em !important; color: #474747; position: relative; clear: both; }
h3.stage strong 
{
	display: block; 
	position: absolute;
	right: 22px;
	top: 4px;
	font-family: Arial, Trebuchet MS, Sans-Serif;
	font-size: 0.80em;
	color: #7f7f7f; 
	text-align: right;
	width: 100px; 
}

h4 { margin: 0 0 9px 0; font-size: 1.17em; }

h5 { margin: 0 0 9px 0; font-size: 1em; }


/* =Links
 * 
 * LVHA ( :link / :visited / :hover / :active ) - important due to the way CSS handles cascade / ordering.
--------------------------------------------------------------------------*/

a { }
a:link { }
a:visited { }
a:hover, a:active, a:focus { }

a img { border: none; }


/* =Access Keys / Jumps
--------------------------------------------------------------------------*/


/* =Forms
--------------------------------------------------------------------------*/

fieldset { border: none; font-size: 1em; }
legend { display: none; }
label { cursor: pointer; }

input, select, textrea { font-family: inherit; font-size: 1em; }

fieldset ol { list-style: none; }

/* Hierarchy Picker */

#categorylistHierarchyPicker { padding: 5px 0px; clear: both; width: 459px; }
#categorylistHierarchyPicker fieldset { width: 459px !important; border: 0 !important; }
#categorylistHierarchyPicker legend 
{
	display: block; 
	font-weight: bold; 
	margin-bottom: 4px; 
	width: 200px; 
	color: #7f7f7f;
}


#categorylistHierarchyPicker fieldset ol { width: 459px !important; }

#categorylistHierarchyPicker fieldset li { width: 459px !important; }

#categorylistHierarchyPicker fieldset li select
{
	width: auto !important; 
	padding: 2px !important; 	
	border-top: 1px solid #ACADB2; 
	border-right: 1px solid #DBE0E6; 
	border-bottom: 1px solid #E2E9EF; 
	border-left: 1px solid #E2E2EA;
	padding: 3px;
	color: #7f7f7f !important;
	font-size: 1em;
}

fieldset#categorylistSelections 
{
	position: relative;
	padding-left: 142px;
	top: -22px;
	width: 250px !important;
	text-align: left;
	border: 1px solid red;
	/*margin-left: 140px; margin-top: -21px; width: auto !important; float: left; clear: both; text-align: left;*/ 
}


fieldset#categorylistSelections .hierarchyButton { clear: both; float: left; width: auto; display: inline; position: relative;  }

#categorylistSelections p { color: #B90E07; font-weight: bold; }
#categorylistSelections p#categorylistNoMessage { color: #7f7f7f; font-weight: normal; }

#categorylistHierarchyPicker ul#categorylistList 
{
	width: 459px !important; 
	vertical-align: middle;
}
#categorylistHierarchyPicker ul#categorylistList li { margin: 0 0 5px 0; }
#categorylistHierarchyPicker ul#categorylistList input 
{
	float: left !important;
	margin-right: 5px; 
	vertical-align: middle; 
	position: relative;
	display: inline;
	margin-top: 4px; 
}
#categorylistHierarchyPicker ul#categorylistList label 
{
	width: 350px !important; 
	clear: none; 
	float: none !important;
	display: inline;
	position: relative;
	padding: 0;
}

.hierarchyPicker { border: 0; }

.hierarchyPicker ol { border: 0 !important; background: none !important; }


#categorylistNewFS legend { margin: 0; padding: 0px 0 0 140px; color: #7F7F7F; }
#categorylistNewFS .hierarchyButton { margin-left: 140px; }
#categorylistNewFS ol { padding-left: 0 !important; }
#categorylistNewFS ol#formHeirarchyControl { padding-top: 6px; margin-bottom: 0px; }




/* Colour Scheme Picker */

.colour-scheme-picker
{
	list-style: none;	
}

.colour-scheme-picker li 
{
	float: left;
	display: block;
	position: relative;
	width: 68px;
	height: 68px;
	overflow: hidden;
}

.colour-scheme-picker li.active, .colour-scheme-picker li:hover
{
	background: url(/img/customise_colours/on_bg.gif) repeat-x top left;
}

.colour-scheme-picker input 
{ 
	position: absolute;
	top: 50%;
	left: 50%;
}

.colour-scheme-picker label 
{ 
	position: absolute;
	top: 10px;
	left: 10px;
	width: 68px;
	height: 68px;
	background: green;
	text-indent: -9999em;	
}

#green-purple-label { background: url(/img/customise_colours/green_purple.png) no-repeat top left; }
#turquoise-orange-label { background: url(/img/customise_colours/turquoise_orange.png) no-repeat top left; }
#red-blue-label { background: url(/img/customise_colours/red_blue.png) no-repeat top left; }
#orange-blue-label { background: url(/img/customise_colours/orange_blue.png) no-repeat top left; }
#light-green-purple-label { background: url(/img/customise_colours/light_green_purple.png) no-repeat top left; }
#orange-turquoise-label { background: url(/img/customise_colours/orange_turquoise.png) no-repeat top left; }
#blue-red-label { background: url(/img/customise_colours/blue_red.png) no-repeat top left; }
#blue-orange-label { background: url(/img/customise_colours/blue_orange.png) no-repeat top left; }
#purple-light-green-label { background: url(/img/customise_colours/purple_light-green.png) no-repeat top left; }

.full-pod-content .colour-scheme-picker li { height: 85px; }
.full-pod-content .colour-scheme-picker input { top: 65px; }



/* Generic Form
----------------------------- */

.requiredfield { font-size: 0.75em; color: #7f7f7f; text-align: right; width: 639px; margin: 0 0 6px 0; }
.requiredfield strong { font-weight: normal; }

.validation-summary
{
	border: 1px solid #eb7f7f; 
	padding: 9px; 
	color: #ba0d06; 
	font-size: 0.93em; 
	background-color: #edcdce; 
	background-image: url(/img/error_bg.png); 
	background-position: top left; 
	background-repeat: repeat-x ;
	margin: 0 0 12px 0;
	font-family: Trebuchet MS, Arial, Sans-Serif;
	width: 620px;
	float: left;
	clear: both;
}
.signedout .validation-summary { width: 424px !important; }

.error-message
{
	font-size: 0.93em;
	clear: both;
	margin: 0 17px 12px 17px;
	font-family: Trebuchet MS, Arial, Sans-Serif;
	width: auto;
	display: block;
	padding: 9px;
	background-position: top left; 
	background-repeat: repeat-x ;
	background-image: url(/img/error_bg.png); 
}

#site-message
{
	font-size: 0.93em;
	clear: both;
	font-family: Trebuchet MS, Arial, Sans-Serif;
	width: auto;
	display: none;
	background-position: top left; 
	background-repeat: repeat-x ;
	background-image: url(/img/error_bg.png); 
}

.full-pod-content .external #site-message { margin: 0 !important; }

.green 
{		
	background-color: #daedcf;		
	border: 1px solid #246d14; 
	color: #246d14;	 
	display: block !important;
	padding: 9px;
	margin: 0 17px 12px 17px;


}

.red, .error-message
{
	background-color: #EECECF;		
	border: 1px solid #B90E07; 
	color: #B90E07;	 
	display: block !important;
	margin: 0 17px 12px 17px;
	padding: 9px;
}

#site-message .green p { padding-left: 30px; background: url(/img/icons/status_green.gif) left center no-repeat; }
#site-message .red p { padding-left: 30px; background: url(/img/icons/status_red.gif) left center no-repeat; }

.form-error-message { width: 264px; margin: 0 0 0 143px; color: #ba0d06; padding: 2px 0 0 0; float: left; clear: both; display: block; }

/* Register Section */

fieldset.registration,
fieldset.registration ol, 
fieldset.registration li, 
#change-password fieldset.sameline ol, 
#change-password fieldset.sameline li,
#forgotten fieldset.sameline ol, 
#forgotten fieldset.sameline li,
#reset fieldset.sameline ol,
#reset fieldset.sameline li
{ width: 418px !important; position: relative; display: inline; z-index: 1; } /* Reset widths for Homepage signed-out */

div#change-password fieldset.sameline p.formFieldHelpCustom { margin-top: 4px !important; float: none; margin-left: 145px; width: 265px }

fieldset.registration p.formFieldHelpCustom 
{
	/*display: block !important; 
	padding: 3px !important; 
	float: right !important; 
	width: 264px !important;
	margin: 0 10px 0 0 !important;
	font-size: 0.91em !important; 
	clear: both;
	position: relative;*/
		display: block !important; 
	padding: 3px !important; 
	float: right !important; 
	width: 264px !important;
	margin: 0 10px 0 0 !important;
	font-size: 0.91em !important; 
	clear: both;
	position: relative;
}
fieldset.registration #terms-conditions, fieldset.registration #terms-conditions .freeform { width: 418px; }

#terms-conditions { clear: both; float: left; width: 617px; padding-top: 10px; }
#terms-conditions .freeform { font-size: 1em !important; padding-left: 0 !important; width: 617px; }

.terms-conditions-checkbox { clear: both; } 
.terms-conditions-checkbox input { float: left; clear: none; margin: 2px 6px 0 0; } 
.terms-conditions-checkbox label { float: left; clear: none !important; margin: -2px 0 0 0; width: 360px !important; } 

.retype-email-container { padding: 9px 0 4px 0; }

/* Sameline Basics */

fieldset.sameline 
{
	float: left; 
	clear: both;
	width: 620px;
	font-size: 0.75em;
	border: none;
} 

 
fieldset.sameline ol 
{
	float: left; 
	clear: both; 
	width: 615px; 
	margin: 2px 0 8px 0;
	padding: 12px 9px 3px 14px;
	width: 617px; 
	border: 1px solid #ccc; 
	background: #fff url(/img/forms/grey_gradient_bg.gif) top left repeat-x;
}


fieldset.sameline li 
{
	float: left; 
	clear: both;
	 width: 615px; 
	 color: #7f7f7f; 
	 margin: 0 0 9px 0;
	 position: relative; 
	 list-style: none;
}

fieldset.sameline li label, p.custom 
{
	float: left; 
	clear: both; 
	display: block; 
	width: 130px; 
	color: #7f7f7f; 
	margin-right: 12px; 
	padding: 3px 0 0 0; 
	vertical-align: middle;
	position: relative;
}
p.custom { position: relative; top: 12px; }

div.user-upload-agreement { width: 615px; float: left; clear: both; vertical-align: middle; }
fieldset.sameline div.user-upload-agreement input { float: left; margin-right: 6px; margin-top: 4px; }
fieldset.sameline div.user-upload-agreement label { width: 430px; clear: none; }

fieldset.sameline .formFieldText, 
fieldset .textbox, 
fieldset.sameline textarea.formFieldTextArea,
fieldset.sameline select.formFieldDropDown, 
fieldset.sameline select.formFieldDropDownNonSized
{
	width: 254px;
	border-top: 1px solid #ACADB2; 
	border-right: 1px solid #DBE0E6; 
	border-bottom: 1px solid #E2E9EF; 
	border-left: 1px solid #E2E2EA;
	padding: 3px;
	color: #7f7f7f;
	font-size: 1em;
	overflow: visible !important;
	font-family: Arial, Trebuchet MS, Sans-Serif; /* for Text Area */
}
textarea#summary, textarea#interests { height: 202px; }

fieldset.sameline select.formFieldDropDown { width: 262px; }
fieldset.sameline select.formFieldDropDownNonSized { width: 83px !important; }

fieldset.sameline p.formFieldHelpCustom 
{
	float: right;
	font-size: 0.91em; 
	color: #afaeae;
	/*margin-top: -18px; */
	position: relative; 
	width: 200px; 
}

#password, #newpassword { margin-bottom: 9px; position: relative; }  
.buttons { float: left; clear: both; width: 639px; }


/* My ILP - Customise Site and CV */

fieldset.my-ilp { }

fieldset.my-ilp h3 { clear: both; font-size: 1em; font-weight: bold; font-family: Arial, Trebuchet MS, Sans-Serif; }

fieldset.my-ilp ol li label { clear: both; width: 600px; }

fieldset.my-ilp ol li div li { margin-bottom: 6px; position: relative; }

fieldset.my-ilp ol li div label { clear: none; font-weight: normal; }
fieldset.my-ilp ol li div input { vertical-align: middle; padding: 4px 0 0 0; position: relative; display: inline; }

fieldset.my-ilp #customisecv-list-1 { width: 165px; float: left; clear: none; }
fieldset.my-ilp #customisecv-list-2 { width: 170px; float: left; clear: none; }
fieldset.my-ilp #customisecv-list-3 { width: 165px; float: left; clear: none; }
fieldset.my-ilp #customisecv-list-4 { width: 115px; float: left; clear: none; }

#customisecv-list-1 ul { float: left; width: 165px; }
#customisecv-list-1 li { float: left; width: 165px; }
#customisecv-list-1 li input { float: left; margin: 6px 6px 0 0; }
#customisecv-list-1 li label { float: left; width: 135px; clear: none; margin: 0; }

#customisecv-list-2 ul { float: left; width: 165px; }
#customisecv-list-2 li { float: left; width: 165px; }
#customisecv-list-2 li input { float: left; margin: 6px 6px 0 0; }
#customisecv-list-2 li label { float: left; width: 135px; clear: none; margin: 0; }


#customisecv-list-3 ul { float: left; width: 155px; }
#customisecv-list-3 li { float: left; width: 155px; }
#customisecv-list-3 li input { float: left; margin: 6px 6px 0 0; }
#customisecv-list-3 li label { float: left; width: 135px; clear: none; margin: 0; }


#customisecv-list-4 ul { float: left; width: 114px; }
#customisecv-list-4 li { float: left; width: 114px; }
#customisecv-list-4 li input { float: left; margin: 6px 6px 0 0; }
#customisecv-list-4 li label { float: left; width: 95px; clear: none; margin: 0; }

/* Colours */

fieldset.my-ilp ol #colourscheme-list { clear: both; float: left; width: 617px; } 
fieldset.my-ilp ol li label { font-size: 1em; font-weight: bold; } 

fieldset.my-ilp ol #colourscheme-list li { width: 68px; float: left; margin: 0; clear: none; position: relative; display: inline; }
fieldset.my-ilp ol #colourscheme-list li label { position: relative; width: 68px; display: inline; }

/* Edit Picture */

fieldset.sameline fieldset#pictureExistingFS { margin: 0 0 12px 0; border: 0 !important; position: relative; float: left; clear: both; width: 615px; }
fieldset.sameline fieldset#pictureExistingFS legend { display: block; float: left; width: 100px; }
fieldset.sameline fieldset#pictureExistingFS img { border: 1px solid #CCCCCC; margin-bottom: 5px; float: left; clear: both; margin: -13px 0 5px 142px; }
fieldset.sameline fieldset#pictureExistingFS input { clear: both; float: left; margin-left: 141px; }


/* =LayoutStructure
--------------------------------------------------------------------------*/

#skip-to
{
	position: absolute;
	top: -9999em;
	left: -9999em;
}

#sitecontainer 
{ 
	margin: 0 auto 10px auto;
	width: 964px;
	background: url(/img/sitecontainer_bg.gif) repeat-y top left;
}

#top-curve { background: url(/img/body_top.gif) no-repeat top left; height: 9px; overflow: hidden; }
#bottom-curve { background: url(/img/body_bottom.gif) no-repeat top left; height: 9px; clear: both; overflow: hidden; }

#header { margin: 0 9px; float: left; clear: both; width: 488px; height: 155px; overflow: hidden; }

#header a { margin: 0 0 0 7px; width: 290px; height: 155px; overflow: hidden; float: left; clear: both; text-indent: -9999em; }

a.header 
{
	margin-left: -19px; 
	margin-bottom: 12px; 
	width: 488px; 
	height: 150px; 
	float: left; 
	clear: none; 
	display: block;
} 

#navigation 
{	
	margin: 0 17px 20px 17px;
	float: left;
	width: 930px;
	list-style: none;		
}

#p-content 
{ 
	margin: 0 0 0 9px;
	padding: 10px 20px; 
	float: left;
	width: 448px;	
}

body.signedout #p-content { padding-top: 1px !important; }
 
.external { margin-bottom: 13px !important; position: relative; clear: both; }

#s-content 
{ 
	margin: 0 9px 0 0;
	padding: 351px 0 0 0;
	float: right;
	width: 447px;
	background: url(/img/signedout_banner.gif) no-repeat top right;
	position: relative; 
	display: inline;
}

#footer 
{ 
	margin: 0 auto;
	padding-bottom: 60px;
	width: 930px;
}


/* =Shared Styles
 *
 * If you find your re-using the same styles on certain elements 
 * put them here
--------------------------------------------------------------------------*/

.maximised, 
.minimised,
.maximised-educational,
.minimised-educational,
.maximised-work,
.minimised-work,
.maximised-comment,
.minimised-comment,
.close
{ display: block; width: 16px; height: 16px; }

.maximised,
.maximised-educational,
.maximised-work,
.maximised-comment
{ background: url(/img/buttons/minimise.png) no-repeat top left; }

.minimised,
.minimised-educational,
.minimised-work,
.minimised-comment
{ background: url(/img/buttons/maximise.png) no-repeat top left; }

.max-min-grey { background: url(/img/buttons/maximise_grey.png) top left no-repeat !important; }

.maximised span, .minimised span, .customise span, .customise-nojs span, .add span, .more span { display: none; }

.close-tab { position: absolute; top: 3px; right: 8px; }
.close-pod { position: absolute; top: 10px; right: 10px; }

#media-content .customise { float: right; clear: both; margin: 0 !important; }
.customise, .customise-nojs
{	
	margin: 0 0 0 185px;
	display: block;	
	overflow: hidden;
	width: 113px;
	height: 33px;		
	background: url(/img/buttons/customise.png) no-repeat top right;	
}

.customise:hover, .customise-nojs { background-image: url(/img/buttons/customise_on.png); }

.add
{
	margin: 0 0 0 375px;
	display: block;
	width: 75px;
	overflow: hidden;
	height: 33px;
	background: url(/img/buttons/add.png) no-repeat top right;
}

.add:hover { background-image: url(/img/buttons/add_on.png); }


.half .customise { margin: 0 0 0 337px; }

.more
{
	margin-left: 214px;
	display: block;
	width: 84px;
	height: 31px;
	overflow: hidden;
	background: url(/img/buttons/more.png) top left no-repeat;
}

.more:hover { background: url(/img/buttons/more_on.png) top left no-repeat; }

.half .more { margin: 0 0 0 366px; }


/* TODO: Make this one image */


/* =header
--------------------------------------------------------------------------*/


/* =navigation
--------------------------------------------------------------------------*/

#navigation li { float: left; }
#navigation li a { display: block; float: left; height: 35px; overflow: hidden; text-indent: -9999em; }
#navigation li a:hover, #navigation li a.active { background-position: 0 -35px; }


#nav-home
{
	background: url(/img/nav/home.gif) no-repeat top left;
	width: 78px;
}

#nav-my-files
{
	background: url(/img/nav/my_files.gif) no-repeat top left;
	width: 86px;
}

#nav-educational
{
	background: url(/img/nav/educational_experience.gif) no-repeat top left;
	width: 189px;
}

#nav-work
{
	background: url(/img/nav/work_experience.gif) no-repeat top left;
	width: 143px;
}

#nav-comments
{
	background: url(/img/nav/comments.gif) no-repeat top left;
	width: 184px;
}

#nav-cvs-invitations
{
	background: url(/img/nav/cvs.gif) no-repeat top left;
	width: 146px;
}

#nav-resources
{
	background: url(/img/nav/resources.gif) no-repeat top left;
	width: 104px;
}



/* =p-content
--------------------------------------------------------------------------*/



/* TODO: My Photo, the overlayed span causes problems in IE with the slide effect */

.photo-overlay
{	
	padding: 16px 0;
	margin: 0 auto;
	width: 249px;
	height: 198px;
}


.photo-overlay span  
{
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 249px; 
	height: 198px; 
	background: url(/img/picture_border_toplayer.gif) no-repeat top left;
}
.photo-overlay img {  }


/* =s-content
--------------------------------------------------------------------------*/

#signin
{
	margin: 0 0 3px 0;
	background: url(/img/signin_bg.gif) no-repeat top left;
	min-height: 75px;
	font-size: 0.94em;
	color: #5e3907;
}

#signin h2
{	
	margin: 0 0 0 17px;
	float: left;	
	width: 68px;
	line-height: 5em;	
	font-size: 1em;
	font-family: "Trebuchet MS", Arial, Sans-Serif;	
	
}

#signin fieldset
{
	float: left;
	width: 352px;	
	overflow: hidden;
	display: inline;
	height: 74px;	
}

#signin fieldset ol
{
	float: left;
	width: 256px;
	padding: 10px 0;
	position: relative;	
}

#signin fieldset li { margin: 0 0 8px 0; position: relative; width: 256px; display: inline; float: left; clear: both; }

#signin fieldset label { margin: 0 5px 0 0; display: block; float: left; width: 70px; text-align: right; font-size: 0.93em; }

#signin fieldset .textbox { padding: 2px; width: 167px; font-size: 0.93em; }

#btn-signin { margin: 20px 0 0 0; float: right; }

#forgotten-password { margin: 0 10px 10px 0; font-size: 0.75em; text-align: right; display: block; }

#forgotten-password a { color: #7F7F7F; }
#forgotten-password a:hover { text-decoration: none; }

#register, #back-top-prospectus
{
	font-size: 0.94em;
	color: #5E3807;
	width: 447px;
	margin: 0 0 30px 0;
	padding: 0 0 6px 0;
}

#register { background: url(/img/register_bottom.gif) bottom left no-repeat; margin-bottom: 15px }
#back-top-prospectus { background: url(/img/back_to_prospectus_bottom.gif) bottom left no-repeat; }

.registercontent, .back-top-prospectus-content
{
	padding: 8px 10px 3px 10px;
	
}
.registercontent { background: url(/img/register_top.gif) no-repeat top left; }
.back-top-prospectus-content { background: url(/img/back_to_prospectus_top.gif) no-repeat top left; }

#register h2, #back-top-prospectus h2 { font-size: 1em; margin: 0; color: #fff; }
#register p, #back-top-prospectus p { font-size: 0.81em; width: 320px; color: #fff;}

#register #btn-register, #back-top-prospectus #btn-back-top-prospectus { margin-top: 10px; float: right; }

#homepage-icons { float: left; margin: 0 0 15px 0; }
#homepage-icons li { display: inline; float: left; }


/* =footer
--------------------------------------------------------------------------*/

#footer { color: #9b9b9b; }
#footer ul { float: left; width: 600px; margin-top: 7px }
#footer ul li { color: #9b9b9b; display: inline; font-size: 0.93em; }
#footer ul li a { font-size: 1em; padding: 0 4px; color: #9b9b9b; }

#footer p { float: right; width: 107px; margin-top: 7px }

#footer a:hover { text-decoration: none; }

#visit-prospectus { float: right; vertical-align: middle; margin-right: 13px }

/* Viewport overlays
---------------------------------------------------------------- */

#modalOverlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: #000;
	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	z-index: 10000;
}

* html 	#modalOverlay {
	position: absolute;
}

/* Fix for IE6 select z-index issue */
#modalFix {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	z-index: 9999;
}

/* Underlay */

#windowUnderlay { 
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: #fff;	
}

* html #windowUnderlay { 
	position: absolute;
}

/* Windows
---------------------------------------------------------------- */

.mocha {
	position: absolute;
	top: 0;
	left: 0;
	display: none;
	overflow: hidden;					
	border: 10px solid #777777;
}

.mocha.isFocused {	
}	

.mochaOverlay {
	position: absolute;
	top: 0;
	left: 0;	
}
	
.mochaTitlebar {
	width: 100%;
	overflow: hidden;	
	background: transparent url(/img/section_top_customise.png) top left no-repeat;
	height: 46px;
	padding: 0;
	margin: 0;
}

.mochaTitlebar h3 {								
	font-weight: bold;
	height: 40px;
	line-height: 40px;
	padding: 0 0 0 15px;
	color: #888;
	font-family: "Trebuchet MS";
	font-weight: normal;
	color: #FFF;
}

.mocha.isFocused .mochaTitlebar h3 {
	color: #FEFEFE;
}

.mochaToolbarWrapper {
	width: 100%; /* For IE */
	position: relative;
	height: 29px;
	background: #f1f1f1;	
	overflow: hidden;
	border-top: 1px solid #d9d9d9;
}

div.mochaToolbarWrapper.bottom {
	border: 0;
	border-bottom: 1px solid #d9d9d9;
}

.mochaToolbar {
	width: 100%; /* For IE */
	border-top: 1px solid #fff;
}

.mochaContentBorder {
	border-top: 1px solid #dadada;
	border-bottom: 1px solid #dadada;
}

.mochaContentWrapper { /* Has a fixed height and scrollbars if required. */
	font-size: 1em;
	overflow: auto;
}
	
.mochaContent {
	padding: 10px 12px;
	font-size: 1em;			
}

.mocha .handle {
	position: absolute;
	background: #0f0;
	width: 3px;
	height: 3px;
	z-index: 2;
	opacity: .0;
	filter: alpha(opacity=0);
	-moz-opacity: .0;
	overflow: hidden;
	font-size: 1px; /* For IE6 */
}

.mocha .corner { /* Corner resize handles */
	background: #f00;
	width: 10px;
	height: 10px;
}

.mocha .cornerSE { /* Bottom right resize handle */
	background: #f00;
	width: 20px;
	height: 20px;
}

.mochaCanvasHeader {
	position: absolute;
	top: 0;
	left: 0;
	background: transparent;
	z-index: -1;
	display: none;
	overflow: hidden;
}

.mochaControls {
	position: absolute;
	width: 52px;
	top: 8px;
	right: 8px;
	height: 14px;
	z-index: 4;
	background: transparent;
}

.mochaCanvasControls {
	position: absolute;	
	top: 8px;
	right: 8px;	
	z-index: 3;
	background: transparent;
}

/*
	To use images for these buttons:
	1. Set the useCanvasControls window option to false.
	2. If you use a different button size you may need to reposition the controls.
	   Modify the controlsOffset window option.		
	2. Add background images to each button.

*/
.mochaMinimizeButton, .mochaMaximizeButton, .mochaCloseButton {
	float: right;
	width: 14px;
	height: 14px;
	font-size: 1px;	
	cursor: pointer;
	z-index: 4;
	background: #f00;
	margin-left: 5px;
}

.mochaMinimizeButton {
	margin-left: 0;
}

.mochaMaximizeButton {
}

.mochaCloseButton {			
}

.mochaSpinner{
	visibility: hidden;	
	position: absolute;
	bottom: 7px;
	left: 6px;
	width: 16px;
	height: 16px;
	background: url(../images/spinner.gif) no-repeat;
}

.mochaIframe {
	width: 100%;
}  
		
/* Fix for IE6 select z-index issue */
.zIndexFix {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	filter: mask();
	width: 100px;
	height: 100px;
	border: 1px solid transparent;
}

/* Modals */

.modal2 {
	border: 8px solid #fff;		
}

.modal2 .mochaContentBorder {
	border-width: 0px;
}
	
/* Window Themes */

.mocha.no-canvas {
	background: #f1f1f1;
	border: 2px solid #555;	
}

.mocha.no-canvas .mochaTitlebar {
	background: #f1f1f1;	
}

.mocha.transparent .mochaTitlebar h3 {
	color: #fff;
	display: none;
}

.mocha.notification .mochaTitlebar {
	opacity: .0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
}

.mocha.notification .mochaContentBorder {
	border-width: 0px;
}

.mocha.notification .mochaContentWrapper {
	text-align: center;
	font-size: 1em;
	font-weight: bold;
}			

