/*	Making sure that when images are used in links they don't get a border. 'Cos that's rubbish.
*/
a img {
	border: none;
	text-decoration: none;
}
/* Rule that adds a little icon to all links with a target="_blank" attribute, to show that the link opens in a new window */
#mainContentBanner a[target="_blank"], #mainContentRight a[target="_blank"]
{
	background:transparent url(../page_graphics/new_window.png) no-repeat scroll right center;
	padding-right: 11px;
}

/* Controls the Headings' font sizes */
h1
{
	font-size: 1.6em;
}
h2
{
	font-size: 1.3em;
}

/*	Simple selector that's used to hide something. It only contains one rule, so I guess you could
	use inline CSS but I think it's better practice to do it like this.
*/
.hidden {
	display: none;
}

/*	The block quote is used to insert a quote in the middle of a page.
*/
blockquote {
	background: #E7E9FA;
	background: url(../page_graphics/quote.png) top left no-repeat;
	border: #CCC solid 1px;
	padding-left: 4em;
	
	text-indent: 1em;
	font-size: 1.1em;
}
blockquote cite {
	text-align: right;
	display: block;
	margin-right: 13px;
}

/* Rule used to remove the bullets and indenting from an unordered list */
ul.noBullets { list-style: none; padding-left:1em; }

/*	Used in error pages, pink background
*/
#errorMessage * {padding-left: 25px; background: url(../page_graphics/message_error.gif) left center no-repeat;
	padding-top: 5px;	padding-bottom: 5px; }
#errorMessage {
	text-align: center;
	border: 1px red solid;
	background-color: #ffc0cb;
	
	margin-right:30px;
	margin-left: 5px;
	margin-top: 13px;
	margin-bottom: 13px;
	
	padding: 5px 5px;
	font-size: 120%;
}
/*	Information message
*/
#infoMessage * {padding-left: 25px; background: url(../page_graphics/message_info.gif) left center no-repeat;
	padding-top: 5px;	padding-bottom: 5px; }
#infoMessage {
	text-align: center;
	border: 1px blue solid;
	background-color: #D2DCFF;
	
	margin-right:30px;
	margin-left: 5px;
	margin-top: 13px;
	margin-bottom: 13px;
	
	padding: 5px 5px;
	font-size: 120%;
}
/*	Success message
*/
#successMessage * {padding-left: 25px; background: url(../page_graphics/message_success.gif) left center no-repeat;
	padding-top: 5px;	padding-bottom: 5px; }
#successMessage {
	text-align: center;
	border: 1px green solid;
	background-color: #D7FFD7;
	
	margin-right:30px;
	margin-left: 5px;
	margin-top: 13px;
	margin-bottom: 13px;
	
	padding: 5px 5px;
	font-size: 120%;
}
/*	Warning message
*/
#warningMessage * {padding-left: 25px; background: url(../page_graphics/message_warning.gif) left center no-repeat;
	padding-top: 5px;	padding-bottom: 5px; }
#warningMessage {
	text-align: center;
	border: 1px orange solid;
	background-color: #FFFFC1;
	
	margin-right:30px;
	margin-left: 5px;
	margin-top: 13px;
	margin-bottom: 13px;
	
	padding: 5px 5px;
	font-size: 120%;
}
.normalMessage {
	margin-left: 23px;
	margin-right: 35px;
}

/*	Rule used for putting a little "new" next to something to draw attention to the fact that something's changed
*/
sup.newAttention {
	color: red;
	text-decoration: none;
	
	font-family: "Comic Sans MS", cursive;
}

/*	Global rules for font etc and the gray background	*/
body {
	font-family:Arial, Helvetica, sans-serif;
	background-color: #999999;
	font-size: 73%;
	height: 100%;
}

.insertImage {
	margin: 4px;	
	float: left;
}

#containerIncludingShadow {
	margin: 0px auto;
	width:935px;
	background:url(../page_graphics/background.png) top repeat-y;
	margin-top: -18px;
	min-height: 100%;
}

#header {
	background: url(../page_graphics/top.png) top no-repeat;
	/*	Setting the minimum height so that you'll always be able to
		see the rounded corners */
	min-height: 30px;
	
	/*	Setting padding so that content appears inside the shadow
	*/
	padding: 22px 22px 0px 22px;
	margin: 0px;
}
#header .menu {
	margin: 5px 5px;
	text-align: right;
	vertical-align: bottom;
}

#contactAndSearchContainer {
	margin-right:3px;
	margin-top:0px;
	width:309px;
	height:100px;
	float:right;
}

#contactTitle
{
	width: 148px;
	height: 30px;
	
	margin-right: 3px;
	margin-bottom: 5px;
	
	float:left;
	
	background: #cc0031;
	color: white;
	
	text-align: right;
	font-size: 1.3em;
}
#contactTitle p {
	margin-top: 0px;
	padding-right: 2px;
}
#contactTitle:hover {
	cursor: pointer;
}

#searchTitle
{
	width:148px;
	height: 30px;
	
	margin-right: 3px;
	margin-bottom: 5px;
	
	float:left;
	
	background: #cc0031;
	color: white;
	
	text-align: right;
	font-size: 1.3em;
	
	float:Right;
}
#searchTitle p {
	margin-top: 0px;
	padding-right: 2px;
}

#contactDetail
{
	width:154px;
	height: 60px;
	font-size:90%;
	float:left;
}
#searchDetail
{
	width:154px;
	height: 60px;
	font-size:80%;
	float:right;
	text-align:center;
}

#mainContent {
	background: none;
	height: auto;
}
#mainContent #mainContentBanner {
	margin-left: 13px;
}

#mainContentLeft {
	/*	Setting padding so that content appears inside the shadow
	*/
	margin-left: 13px;
	padding-left: 3px;
	padding-top:5px;
	
	width: 250px;
	float: left;
}
#mainContentLeft h2 {
	font-size: 1.2em;
	font-weight: bold;
	padding-left: 2px;
}
#mainContentLeft .menu {
	/*	Removing the bullet point from the list items
	*/
	list-style-type: none;
	
	/*	Removing the default indentation of a list
	*/
	padding-left: 0px;
	
	/*	Fixing a margin bug in IntEx
	*/
	margin-left:0px;
}
#mainContentLeft .menu .menuItem {
	/*	Menu that appears in the left hand section of the page
	*/		
	background: none;
	
	/*	Make the margin 0 as we want the menu items to touch each other
	*/
	margin: 0px;
	padding: 5px;
}
#mainContentLeft .menu .menuItem h3 {
	padding: 0px;
}
/*	Selector for the items in the side menu for the page
*/
#containerIncludingShadow #mainContent #mainContentLeft a {	
	/*	This is just really so that we don't have to add a <br />
		after every link.
	*/
	display: block;
	
	margin-top: 12px;	
	margin-left: 16px;
	padding: 5px 0px 5px 16px;
	
	text-decoration: none;	
	font-weight: bold;
	
	color: black;
}
#containerIncludingShadow #mainContent #mainContentLeft .smallLink {
	padding: 0px;
	margin: 0px;
	
	font-weight: normal;
	color: blue;
	text-decoration: underline;
}

#mainContentRight {
	font-size: 1.0em;
	
	margin-left: 275px;
	margin-right: 29px;
	margin-top: 0px;	
	
	padding-right: 3px;
	padding-top: 0px;
	
	width: auto;
}
#mainContentRight h2 {
	margin-top: 16px;
}
#mainContentRight h3 {
	font-size: 1em;
}

.quote {
	font-style:italic;
}

.imageCaption {
	font-size: 0.85em;
}

.noBorder {
	border: none;
}
.noBorder:hover {
	border: none;
}

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

#footer {
	width: 935px;
	background: url(../page_graphics/bottom.png) bottom no-repeat;
	text-align: center;
	height:125px;
}
#footerLinks {
	margin: 0 22px 0 13px;
	border-top: 2px solid #cccccc;
	padding: 10px 10px;
	font-size: 0.75em;
}
#footerLinks a {
	padding: 5px 7px 5px 5px;
}
#footerLinks a.divide {
	border-right: 2px solid #cccccc;
	padding: 5px 7px 5px 5px;
}

#footerLogos {
	margin: 0 22px 0 13px;
	border-top: 2px solid #cccccc;
	
	padding: 5px 5px;
}
#containerIncludingShadow #header #contactAndSearchContainer #search_detail #searchForm label {
	color: #FFF;
}

div.vacancy {
	background: none;
	
	border-top: 1px gray solid;
	border-bottom: 1px gray solid;
	
	margin-top: 23px;
	margin-bottom: 23px;
}
div.vacancy .vacancyTitle {
	border-bottom: 1px #CCC solid;
}
div.vacancy .vacancyTitle h2{
	margin-top: 10px;
}

#sitemapLinks a
{
	display: block;
}
