/*
*************************************************

UNICEF UK Rights Respecting School Award (RRSA)
General Screen Styles

Created by Thomas Hanley
09-07-2009

http://www.rightsrespectingschools.org.uk
http://www.rrsa.org.uk

*************************************************
*/

/* ------------------------------------------------------------------------------
RESET STYLES
--------------------------------------------------------------------------------*/


/* Resets styles then adds basic typographical styling */
/* Based on Eric Meyer's reset styles */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li, 
/* fieldset, form, label, legend, removed as affected form layout */
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	text-decoration: none;
}

body {
    margin: 0 auto;
    position: relative;
    background-color: #fff;
	 color: #666;
	 font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 14px;
    line-height: 1.5; /* Baseline grid of 21px */
    text-align: left;
}	

ol, ul {
	list-style: none;
}

.normal_list {
	list-style-type: circle;
	margin-left: 1em;
	margin-right: 1em;
}

.normal_list li {
	margin-bottom: 1em;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

:focus {
	outline: 0;
}

/* tables may still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

html { min-height: 100%; margin-bottom: 1px; }
/*forces Firefox to always show a scroll bar so that 'page shift' does not occur */

/* ------------------------------------------------------------------------------
END RESET 
--------------------------------------------------------------------------------*/

/* ------------------------------------------------------------------------------
GENERAL SELECTORS / STYLES
--------------------------------------------------------------------------------*/
	
/* basic font sizes */
p, ul, ol, dl, table, address, blockquote, fieldset, pre, form div {
	font-size: 1em;  /* 14px */
}

/* deal with likely inherited shrinkage */
ul p, ol p, table p, dl p, ul ul, ol ol, ul ol, ol ul, address p, blockquote p, form div div, form div p, fieldset div, table form div {
	font-size: 1em;
}
/* @end Font sizes */

/* @group Headings */

h1 {
	font-family: Arial,Helvetica,sans-serif;
	font-size: 1.1428em; 	/* 16px */
	font-weight: lighter;
	margin-bottom: 0.9em;
	color: #666;
}

h2 {
	font-family: Arial,Helvetica,sans-serif;
	font-size: 1em;   		/* 14px */
	font-weight: lighter;
	margin-bottom: 0.625em; 	/* 10px */
	color: #666;
}

.alt_h2 {
	margin: 0 0 1em 0;
	background-color: #eaeaea;
	display: inline;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 1.1428em;
	line-height: 1.3em;
	font-weight: lighter;
	padding: 0.55em;	
}

h3 {
	font-size: 1.1428em;   		/* 16px */
	margin-top: 1.1111em;     	/* 20px */
	margin-bottom: 0.5556em; 	/* 10px */
	color: #645951;
}

h4 {
	font-size: 1em;   		/* 14px */
	margin-top:1.25em;	   		/* 20px */
	margin-bottom: 0.625em; 	/* 10px */
}

/* @end Headings */

/* @group Links */

a:link {
	color: #009cff;	
	background-color: #fff;
	text-decoration: none;
	padding: 0.2em 0.4em 0.2em 0.4em;
}

a:visited {
	color: #ed2790;
	background-color: #fff;
	text-decoration: none;
	padding: 0.2em 0.4em 0.2em 0.4em;
}

a:hover {
	color: #fff; 
	background-color: #0066cc;
	text-decoration: none;
	padding: 0.2em 0.4em 0.2em 0.4em;
}

a:active {
	color: #666;
	background-color: #fff;
	text-decoration: none;
	padding: 0.2em 0.4em 0.2em 0.4em;
}

.short_links a {
	color: #009cff;	
	background-color: #fff;
	text-decoration: none;
	padding: 0 0.3em 0.2em 0.3em;
}

.short_links a:hover {
	color: #fff; 
	background-color: #0066cc;
	text-decoration: underline;
	padding: 0 0.3em 0.2em 0.3em;
}

.text_link a {
	color: #009cff;	
	text-decoration: none;
	padding: 0;
}

.text_link a:hover {
	color: #fff; 
	background-color: #0066cc;
	text-decoration: underline;
	padding: 0;
}

#reg_overview a {
	padding: 0 0.2em 0.1em 0.2em;
}

#reg_overview a:hover {
	padding: 0 0.2em 0.1em 0.2em;
}

.reg_links a:hover {
	padding: 0.2em 0 0.2em 0.4em;
}

/* @end Links */
/* ------------------------------------------------------------------------------
END GENERAL SELECTORS / STYLES
--------------------------------------------------------------------------------*/

/* ------------------------------------------------------------------------------
PAGE STRUCTURE
--------------------------------------------------------------------------------*/
/* --------------------------------
    Header
----------------------------------*/

#header {
	margin: 0 auto;
	width: 760px;
	height: 86px;
	background: #009cff url(../img/header.gif) no-repeat center center;
	}

/* --------------------------------
    Navigation and sub-navigation
----------------------------------*/

#nav_wrapper {
	margin: 0 auto;
	overflow: hidden;
	width: 760px;
	background-color: #0066cc;	
	padding-bottom: 0.1em;
	}

ul.nav {	
	float:left;
	padding: 0.4em 0 0.4em 0.5em; 
}	

ul.nav li {
	display: inline;
	padding: 0 0.2em 0 0;
}	

ul.nav a {
	padding: 0.3em;
	background-color: #fff;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 0.8572em;   		/* 12px */
	font-weight: lighter;
	text-decoration: none;
	color: #333;
}

ul.nav a:hover  {
	font-size: 0.8572em;    		/* 12px */
	font-weight: lighter;
	color: #333;
	background-color: #cfe1ea;
	text-decoration: underline;
}

/* --------------------------------
    Footer
----------------------------------*/
#footer {
	margin: 1em auto 0 auto;
	overflow: hidden;
	width: 760px;
	background-color: #0066cc;	
	}

ul.footer_wrapper {	
	margin-top: -0.3em;
	background-color: #0066cc;	
	padding-bottom: 0.3em;
}	

ul.footer_wrapper li {
	display: inline;
	padding: 0; 

}	

ul.footer_wrapper a {
	background-color: #0066cc;	
	font-family: Verdana, Arial,Helvetica,sans-serif;
	font-size: 0.8572em;   		/* 12px */
	font-weight: lighter;
	text-decoration: none;
	color: #fff;
	padding: 0;
}

ul.footer_wrapper a:hover {
	text-decoration: underline;
	padding: 0;
}


#footer img {
	position: relative;
	top: 0.5em;
	left: 0.8em;
}

.footer_link
{
	margin-left: 0.5em;
	margin-right: 1em;
}

#copyright {
	margin: 0 auto;
	overflow: hidden;
	width: 760px;
	background-color: #cfe1ea;
}

#copyright p {
	float: right;
	padding-right: 1em;
	font-family: Verdana, Arial,Helvetica,sans-serif;
	font-size: 0.7144em;   		/* 12px */
}


/* ------------------------------------------------------------------------------
PAGE COMPONENTS
--------------------------------------------------------------------------------*/

.section {
	margin: 0 auto;
	max-width: 85em;
	overflow: hidden;
	width: 760px;
	padding-top: 1.45em;
	background-color:#fff;
}

.header_box {
	float: left;
	padding: 0.2em 0.5em 0.2em 0.5em;
	background-color: #cfe1ea;
	font-family: Arial,Helvetica,sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	color: #333;

}

.description {
	clear: both;
	margin-bottom: 1em;
	font-family: Arial,Helvetica,sans-serif;
	text-align:left;
	color: #666;
	font-size: 1.1428em;
	line-height: 1.3em;
	font-weight: lighter;
	padding: 0.55em;
	background-color: #eaeaea;
}

/* Alter the default width of the description box */
.width_narrow {
	width: 703px;
}

/* Alter the default width of the description box */
.width_small {
	width: 8em;
	padding: 0.2em 0.65em 0.2em 0.65em;
}

.width_medium {
	width: 14em;
	padding: 0.2em 0.65em 0.2em 0.65em;
}


.container {
	width: 760px;
	overflow: hidden;
}

.text_block {
	float: left;
	width: 32%;
	margin: 0 1.2em 0 0;
	background-color: #eaeaea;
}

.text_block_wide {
	float: left;
	width: 64%;
	margin: 0 1.2em 0 0;
	background-color: #eaeaea;
}


.text_block h2, .text_block_wide h2 {
	text-align: left;
	color: #333;
	padding: 0.52em 0.52em 0.52em 0.7em;
	background-color: #cfe1ea;
	border-bottom: 1px dotted #0066cc;
}

.text_block ul, .text_block_wide ul {
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 0.9em;   		
	line-height: 1.25em;
	text-align: left;
	padding: 0em 0.52em 0.52em 0.8em;
}

.reg_links li a {
	display:block;
	width: 96%;
	margin: 0.5em 0 0.5em 0em;
}

/* --------------------------------
    Contact.html
----------------------------------*/

#contact span {
	padding-left: 2em;
	border: 0;
}

/*------------------------------------------------------------------------------
    FORMS, NOTIFICATIONS & ERRORS
--------------------------------------------------------------------------------*/

#required_wrapper {
	margin-bottom: 1.5em;
}

form {
	margin: 0 0 1em 0;
}

* { 
padding: 0; 
}

fieldset { 
	width: 44em;
	position: relative; 
	padding: 1.6em 1em 1em 0;
	border: 1px solid #cfe1ea;
	margin-bottom: 2em;
}

fieldset ol {  
	padding: 0;
	margin: 0; 
	list-style: none;
}

fieldset p {  
	color: #0e0e0e;  
	margin: 0 0 0.8em 1em;
}

#data_protection {
	margin-bottom: 1em; /*final fieldset needs smaller bottom margin */
}

legend span { 
	position: absolute;
	left: 0;
	color: #000;
	margin: -0.75em 0 0 1em;
	padding: 0.2em 0.4em;
	background-color:#0066CC;
	color: #fff;
}

label {  
	float: left;
	width: 13em;
	color: #0e0e0e;  
	background-color: #fff;
	text-align: right;
}

/* Labels with check boxes: input control sits to left of label so needs this rule */
#head_wrapper label, #email_wrapper label, #terms_wrapper label {
	width: 40em;
	text-align: left;
}

#email_wrapper label, #head_wrapper label {
	margin-bottom: 1em;
}

label img {
	margin-right: 1em;
}

#data_protection label img {
	margin-right: 0.2em;
}

.label_bump {
	background: transparent;
	margin-left: -2em;
	margin-right: 2em;
}

input.text {
	width: 11em;
	margin-bottom:0.3em;
	padding: 0.1em;
	border: 1px solid #0099ff;
}

textarea {
	width: 28em;
	padding: 0.2em;
	border: 1px solid #0099ff;
	margin-bottom: 0.5em;
	font-family: Verdana,Arial,Helvetica,sans-serif;
   font-size: 1em;
}

input.password {
	width: 11em;
	margin-bottom:0.3em;
	padding: 0.1em;
	border: 1px solid #0099ff;
}

input.checkbox, input.radio {
    float: left;
	 display: inline;
	 width: 13px;
    height: 13px;
    padding: 0;
    margin: 0.3em 0.6em 0 1.1em;
    vertical-align: bottom;
    position: relative;
    top: -1px;
}

.dropdown {
	border: 1px solid #0099ff;
	margin-bottom:0.2em;	
	width: 14em;
}

/* generic behaviour for input controls */	

input.short {
	width: 4em;
}

input.medium,
textarea.medium {
	width: 12em;
}

input.long,
textarea.long {
	width: 30em;
}
	
input:focus, textarea:focus {
	background: #fffbcf;
}

.form_hint {
	float: left;
	width: 17em;
	margin-top: -1.5em;
	margin-left: 25em;
	text-align: left;
	font-family: Arial,Helvetica,sans-serif;
}

/* form hint bump: labels without required stars are 2 ems more narrow */
.form_hint2  {
	float: left;
	width: 17em;
	margin-top: -1.5em;
	margin-left: 27em;
	text-align: left;
	font-family: Arial,Helvetica,sans-serif;
}

#sen_block ol {
	float: left;
}

#sen_block li {
		text-decoration: none;
		display: inline;
}

#sen_block label {
	width: auto;
	background: transparent;
}


/* -------------
    Form layout
--------------*/	

#form_01 li, #form_02 li { 
	float: left;
	width: 100%;
	}	

#school_address ol, #school_details ol, #other_address ol {  
	margin-top: 0; 
	margin-bottom: 0;
}

#school_details p {
	margin-top: 0.6em;
	margin-bottom: 0.6em;
}

#number_pupils {
	width: 3em;
}

#pupils .dropdown {
	margin-bottom: 0;
}	
		
#pupils li {
	padding-bottom: 1em;
}
		


#summary_box label {
	margin-top: 0.2em;
}

/* RRSA Partner form */

#rrsa_partner p {
	margin-top: 1em;
	margin-bottom: 0;
}

#experience label {
	float: none;
	color: #0e0e0e;  
}

#experience {
	margin-top: 1em;
	margin-left: 12.75em;
}

	
/* Additional users */
#select_school em {
	font-style:normal;
	font-weight: bold;
} 	

/* Terms and conditions */

html {
    overflow: -moz-scrollbars-vertical;
}

/*
#terms_box {
	background-color: orange;
}
*/

#terms .header_box {
	padding: 0.2em 0.65em 0.2em 0.65em;
}
	
/* ------------------------------------------------------------------------------ 
    RE-USABLE CLASSES & OVERRIDES
--------------------------------------------------------------------------------*/

.hide {
	display: none;
}

.clear {
	clear: both;
}	

.transparent {
	background: transparent;
}

/*re-usable class to add 1em of space above an element to allow for exceptions to general style rules */	
.top_pad {
	margin-top: 1em;
}

.top_pad_form {
	padding-top: 0.5em;
}

.bottom_pad {
	margin-bottom: 1em;
	padding-bottom: 1em;
}

.left_pad {
	margin-left: 1em;
}

.no_left_pad {
	padding-left: 0em;
}

.indent {
	padding: 0 1em 0 1em; 
}

.large {
	font: 1.3em/1.2em arial, helvetica, sans-serif; 
	background-color: #fff;
	padding: 0.4em;
}

.large span {
	background-color: red;
}	
	
.text {
	background-color: #fff;
}

/* ------------------------------------------------------------------------------ 
    ACCOUNT ADMINISTRATION: 1 DECEMBER 2009
--------------------------------------------------------------------------------*/

/* temporarily hide the link to login */

#nav_wrapper #hide a {
	margin-left: 140px;
	background-color: #0066cc;	
	color: #0066cc;
}

#login, #key_contact {
		margin-top: 2em;
		margin-bottom: 2em;
}

#email, #key_email, #head_email {
border:1px solid #0099FF;
margin-bottom:0.3em;
padding:0.1em;
width:16em;
}

#update_login #submit, #edit #submit {
	margin-left: 1em;
}

#edit #vle_user {
		margin-bottom: 1em;
}