/* 
COLOURS
The hex colours for each section are: 

Area					|  Main   | Tint 1  | Tint 2
Teachers UK / homepage	| #ff3300 | #ff6f4d | #ff977d  (Red)
Teachers				| #b490d5 | #cbb2e2 | #dac8ea  (Purple)
Schools					| #f99d0d | #fbbb56 | #fcce86  (Orange)
Vacancies				| #8ed300 | #a9fb00 | #c4ff48  (Green)

PAGE CLASSES
The BODY should have a class of either:
	.teachersUKpage		-- homepage / Teachers UK section
	.teachersPage		-- teachers section
	.schoolsPage		-- schools section
	.vacanciesPage 		-- vacancies section
This is used to set a range of colours below

*/


/* Basic elements */
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.75em;
	color: #000;
}
body {
	background-color: #fff;
	margin: 0;
	padding: 0;
	text-align:center;
}
a:link {
	color: #FF3300;
}
/*a:visited {
	color: #820000;
}*/
a:hover {
	color: #FF6F4D;
}
a:active {
	color: #FF6F4D;
}

h1 {
	font-size: 1.8em;
	font-weight: normal;
}
p {
	line-height: 1.4em;
}



#breadcrumbs {
	font-size: 0.9em;
	padding: 6px 0;
	border-bottom: dashed 1px #000;
	margin-bottom: 25px;
}
#breadcrumbs a {
	text-decoration: none;
}


/* heading colour depends on the section */
/* So does the breadcrumb colour */
.teachersUKpage h1, .teachersUKpage #breadcrumbs a, .teachersUKpage #breadcrumbs { color: #ff3300; }
.teachersPage h1, .teachersPage #breadcrumbs a, .teachersPage #breadcrumbs { color: #b490d5; }
.schoolsPage h1, .schoolsPage #breadcrumbs a, .schoolsPage #breadcrumbs { color: #f99d0d; }
.vacanciesPage h1, .vacanciesPage #breadcrumbs a, .vacanciesPage #breadcrumbs  { color: #8ed300; }

/* so does the breadcrumb rollover colour */
.teachersUKpage #breadcrumbs a:hover { color: #ff6f4d; }
.teachersPage #breadcrumbs a:hover { color: #cbb2e2; }
.schoolsPage #breadcrumbs a:hover { color: #fbbb56; }
.vacanciesPage #breadcrumbs a:hover  { color: #a9fb00; }





/* Main layout parts */
#mainContainer {
	margin: 0 auto;
	text-align: left;
	width: 800px;
}

#commonHeader { /* The common header containing logo and global links */
	position: relative;
	width: 100%; /* IE must have a width in order to respect the relative positioning */
}
#globalLinks {
	position: absolute;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 550px;
	right: 0;
	bottom: 0;
	font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;
}
#globalLinks  li {
	margin: 0;
	padding: 0 0 0 13px;
	float: right;
}

#headerPhoto {
	margin: 10px 0 5px 0;
}
.homepage #headerPhoto {
	margin-bottom: 20px;
}
#mainContent {
	width: 460px;
}
#mainContent2 {
	width: 800px;
}
#copyright {
	background: #ff6f4d;
	text-align: center;
	font-size: 0.9em;
	padding-top: 3px;
	padding-bottom: 3px;
	border-top: 5px solid #ff3100;
	color: #fff;
	clear: both;
	margin: 35px 0 0 0;
}
#copyright a {
	color: #fff;
	text-decoration: none;
}
/* Different colour copyrights for different sections */
/* This is the main colour and Tint 1 */
.teachersUKpage #copyright { background: #ff6f4d;  border-top: 5px solid #ff3100; }
.teachersPage #copyright { background: #cbb2e2;  border-top: 5px solid #b490d5; }
.schoolsPage #copyright { background: #fbbb56;  border-top: 5px solid #f99d0d; }
.vacanciesPage #copyright { background: #a9fb00;  border-top: 5px solid #8ed300; }


/* The phone number within boxouts */
.boxout .phoneNumber {
	font-size: 2em;
	font-weight: bold;
	
}



/* Links which are for navigation (anywhere), rather than inline */
.navLink a { 
	text-decoration: none;
}
.navLink a:link {
	color: #07076a;
}
/*.navLink a:visited {
	color: #820000;
}*/
.navLink a:hover {
	color: #FF6F4D;
}
.navLink a:active {
	color: #FF6F4D;
}





/* The colours and font style of the homepage navigation, and main navigation menus elements */
/* Each has a main colour, and two paler colours */

/* Teachers UK menu */
ul#nav li#navigationTeachersUK a{ /* This is the main colour of the menu */
	background-color: #FF3300;
	color: #000000;
	font-weight: bold;
}
ul#nav li#navigationTeachersUK ul a  { /* This is a paler version used on homepage subnav rollovers, and the background colour for subnav elsewhere */
	background-color:#ff6f4d;
	font-weight: normal;
}
ul#nav li#navigationTeachersUK ul a:hover { /* This is an even paler rollover colour for rollovers on the subnav everywhere but homepage */
	background-color: #ff977d;
}
ul#nav li#navigationTeachersUK ul li ul li a {
	background-image: url(../images/subnav_teachersuk.gif);
	background-repeat: repeat-y;
	background-position: left;
}



/* Teachers menu */
ul#nav li#navigationTeachers a {
	background-color: #b490d5;
	color: #000000;
	font-weight: bold;
}
ul#nav li#navigationTeachers ul a  {
	background-color:#cbb2e2;
	font-weight: normal;
}
ul#nav li#navigationTeachers ul a:hover {
	background-color: #dac8ea;
}
ul#nav li#navigationTeachers ul li ul li a {
	background-image: url(../images/subnav_teachers.gif);
	background-repeat: repeat-y;
	background-position: left;
}

/* Schools menu */
ul#nav li#navigationSchools a {
	background-color: #f99d0d;
	color: #000000;
	font-weight: bold;
}
ul#nav li#navigationSchools ul a {
	background-color:#fbbb56;
	font-weight: normal;
}
ul#nav li#navigationSchools ul a:hover {
	background-color: #fcce86;
	color: #000000;
}	
ul#nav li#navigationSchools ul li ul li a {
	background-image: url(../images/subnav_schools.gif);
	background-repeat: repeat-y;
	background-position: left;
}

/* Vacancies menu */
ul#nav li#navigationVacancies a {
	background-color: #8ed300;
	color: #000000;
	font-weight: bold;
}
ul#nav li#navigationVacancies ul a {
	background-color:#a9fb00;
	font-weight: normal;
	
}
ul#nav li#navigationVacancies ul a:hover {
	background-color:#C4FF48;
	color: #000000;
}
ul#nav li#navigationVacancies ul li ul li a {
	background-image: url(../images/subnav_vacancies.gif);
	background-repeat: repeat-y;
	background-position: left;
}


/* Navigation layout including Son of Suckerfish dropdowns */
#nav, #nav ul {
	padding: 0 0 20px 0;
	margin: 25px 0 0 0;
	list-style: none;
	line-height: 1em;
}
#nav a {
	display: block;
	width: 140px;
	text-decoration: none;
	padding: 4px 10px;
	font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
}

#nav li {
	float: left;
	width: 160px;
}
#nav li ul {
	margin:0;
	position: absolute;
	width: 140px;
	left: -999em;
}


/* The positioning of each menu */
li#navigationVacancies, li#navigationSchools {
	margin-left: 20px;
}
li#navigationTeachers  {
	margin-left: 120px;
}
#nav li ul ul {
	margin: -19px 0 0 160px;
}
#nav li:hover ul ul, #nav li.sfhover ul ul {
	left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul {
	left: auto;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	left: auto;
}
/* arrows for sub menu */
#nav .withSubMenu a  {
	background-image: url(../images/next-arrow.gif);
	background-repeat: no-repeat;
	background-position: right center;
}
#nav .withSubMenu li a {
	background-image: none;
}





/* Boxouts with rounded corners */
#boxoutContainer {
	float: right;
	margin-top: 55px;
}
.boxout {
	width: 300px;
	background-color:#ff0000;
	margin: 3px 0;
	line-height: 1px;
}
.boxoutContent {
	margin: 0 10px;
	padding: 0;
	line-height: 1em;
}
.boxoutTop, .boxoutBottom {
	width: 300px;
	height: 4px;
	line-height: 1px;
	font-size: 1px;
	background-color: inherit;
	background-repeat: no-repeat;
}
.boxoutTop {
	background-image:url(../images/corner_300_top.gif);
	background-position: top;
}
.boxoutBottom {
	background-image:url(../images/corner_300_bottom.gif);
	background-position:bottom;
}
.boxout h2 {
	font-size: 1.4em;
	font-weight: bold;
	margin: 0.3em 0;
	padding: 0;
	color: #000000;
}
.boxout p {
	font-size: 1em;
	margin: 0.3em 0;
	padding: 0;
	color: #000000;
}
.boxout a {
	color: #000000;
}
/* the breadcrumb background colour varies with each section */
.teachersUKpage .boxout { background-color: #ff6f4d; }
.teachersPage .boxout { background-color: #cbb2e2; }
.schoolsPage .boxout { background-color: #fbbb56; }
.vacanciesPage .boxout  { background-color: #a9fb00; }

.teachersPage #mainContent a { color:#A275CA; text-decoration:none;}
.teachersPage  #mainContent a:hover { color:#A275CA; text-decoration:underline;}
.schoolsPage  #mainContent a { color:#F99D0D; text-decoration:none;}
.schoolsPage  #mainContent a:hover { color:#F99D0D; text-decoration:underline;}

.vacanciesPage #mainContent a { color:#8ED300; text-decoration:none;}
.vacanciesPage  #mainContent a:hover { color:#578200; text-decoration:underline;}

.teachersUKpage #mainContent a { color:#FF3300; text-decoration:none;}
.teachersUKpage  #mainContent a:hover { color:#FF3300; text-decoration:underline;}

.square li{list-style-type:square; margin:5px 0 5px 10px;}

#randomhome {float:left; width:100%;}
#homeleft {float:left; width:450px;}
#homenews {
	width:280px;
	height:22em;
	overflow:hidden;
	margin:0 0px 0 0px;
	position:relative;
	float:right;
	padding:10px;
	font-size: 0.9em;
	background-image: url(../images/homepage_search_top.gif);
	background-repeat: no-repeat;
}
#homenews .moreNews {
	background-image: url(../images/homepage_search_bottom.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	background-color:#fff;
	text-align: center;
	padding-bottom: 10px;
	position:absolute;
	bottom:0;
	left:0;
	width:300px;
}
.news_scroller { height:100%; overflow:hidden; position:relative;}
.news_item { display:block; padding-bottom:10px; }
.newsitems { position:relative; }

#homesearch form {
	margin:15px 0px 0 0;
}
#homesearch h2, #homenews h2 {
	margin-top:0;
}
#homesearch h2 a, #homenews h2 a {
	color:#FF3100 !important;
}
#homesearch {
	width:780px;
	clear: both;
	margin: 15px 0px 0px 0px;
	padding:10px;
	font-size: 0.9em;
	background-image: url(../images/homepage_search_top2.gif);
	background-repeat: no-repeat;
	overflow:hidden;
}
.homesearchBottom {
	clear:both;
	width:800px;
	height: 14px;
	background: url(../images/homepage_search_bottom2.gif) no-repeat;
	margin: -10px;
	padding: 0px;
}
.homeformentry {
	float:left;
	width:260px;
	padding:0 0 1em 0;
}

form td, tr, th {margin:0;
padding:0;}



.bigPhone {
	font-size: 2.2em;
	color: #FF3100;
	font-weight: bold;
	float:right;
}
.addresses {
	float: right;
	width: 270px;
}
h4 {
	font-size: 1em;
	color: #FF3300;
	padding: 0px;
	margin: 0px;
}



/* Contact form layout */
.cssForm label, .cssForm input, .cssForm textarea,
.ddfm label, .ddfm input, .ddfm textarea {
	display: block;
	width: 310px;
	float: left;
	margin-bottom: 10px;
}

.cssForm label,
.ddfm label {
	text-align: right;
	width: 165px;
	padding-right: 10px;
}
.recaptcha {
	margin-left: 172px;	
}
.cssForm br,
.ddfm br {
	clear: left;
}
.requiredIcon { /* Form fields which are required */
	color: #990000;
}
.cssForm #submit {
	width: auto;
}
.ddfm .submit input {
	width: auto;
	margin-left: -135px;
	font-size: 1.3em;
}
p.fieldwrap {
	overflow: hidden;	
}
.hiddenLabel {
	visibility: hidden;
}
#homesearch label{
	width: 95px;
	margin-top:4px;
}
#searchForm label  {
	width: 110px
}
#homesearch select{
	font-size: 0.8em;
	width: 150px;
}


.smallPrint {
	font-size: 0.9em;
}
div.smallPrint p {
	margin: -20px 0 0 175px;
}
.searchResults {
	width: 100%;
	clear: both;
}
.searchResults th {
	background-color: #A9FB00;
	font-weight: bold;
	color: #FFFFFF;
	text-align: left;
	padding-top: 3px;
	padding-bottom: 3px;

}
.searchResults td {
	padding: 4px;
}
.resultsRow td {
	padding-top: 0;
	padding-bottom: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;

}
h3 {
	font-size: 1.1em;
	font-weight: bold;
	color: #000000;
}
.UkAreaText {
	width: 475px;
	float: right;
	display: none;
	font-size: 0.9em;
}
.UkAreaText#intro {
	display: block;
}
#nav em {
	font-style: normal;
	text-decoration: underline;
}
.noCSS {
	display: none;
}
.quoteAuthor {
	font-weight: bold;
	padding: 5px 10px;
	background-color: #D4D4D4;
	margin-bottom: 0;
}
.quoteContainer {
	background-color: #eeeeee;
	margin: 20px 0;
	padding-top: 1px;
}
.quoteContainer blockquote {
	font-style: italic;
	margin: 10px;
}
ul.fileList {
	list-style-type: none;
}
.errFld, .ddfmerrors {border: 1px solid #C33; background-color: #F2D2D0; }
.ddfmerrors { width: 200px; }
.errMsg, .errorlist { color: #C33;  font-size: 0.8em;  } 
#searchRefineForm {
	font-size: 0.9em;
	background-color: #E7FFB3;
	float: right;
	padding: 5px 5px 0 5px;
	margin-bottom: 10px;
}
#searchRefineForm select, #searchRefineForm input { font-size: 0.8em; }

#searchRefineForm label { width: 100px; }
#qualityMarkBottom { margin: 15px 0 10px; }
#qualityMark {
	float: right;
	width: 124px;
	margin-top: 2px;
}
#recMark {
	float: right;
	width: 56px;
	margin-top: 2px;
}
h2 {
	color: #659500;
	font-size: 1.3em;
}
.newNumber {
	position:absolute;
	left:215px;
	top:4px;
	width:180px;
	font-size: 1.1em;
	font-weight: normal;
	color:#ff3300;
}