/* CSS Document for the Markup of the Equaity and Human Rights Commission */

/* ----------------------------------------------------------- Utilities and globals */
a {
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}
a:focus {
	color: #000;
}
input:focus, textarea:focus {
	background-color: #ffcc33;
}
.hide {
	position: absolute;
	margin-left: -9000px; 
	top: 0;
}
.welsh {
	padding-right: 1em;
}
.english {
	padding-right: 1em;
}
.downloadDoc{
	background: url(../images/wordDocumentIcongif.gif);
	background-repeat: no-repeat;
	background-position: right top;
	padding-right: 1.5em;
}
.downloadPdf { 
	background-image: url(../images/pdfDocumentIcon.gif); 
	background-repeat: no-repeat;
	background-position: right top;
	padding-right: 1.5em;
}
.ruler {
	margin: 1em auto;
	width: 70%;
}
.image {
	float: right; 
	padding: 0.3em;
	margin: 0 10% 5% 0.6em; /* ----------------	THIS MEASUREMENT NEEDS TO BE IN EMS TO WORK IN IE6 */
	background-color: #cecece;
} 
/* ----------------------------------------------------------- Forms markup */
.inputform p {
	margin-left: 0;
	margin-right: 0;
	padding: 0;
}
.inputform fieldset, .inputformLong fieldset {
	margin: 1.5em 8% 1.5em 2%;
	border: 0;
	padding: 0;
}
.inputform legend, .inputformLong legend {
	font-size: 1.3em;
	font-weight: bolder;
	margin-left: 2em;
}
.inputform label {
	width: 35%;
	float: left;
	clear: both;
}
.oneofflabels {
	width: 90%;
	float: left;
	display: block;
}
.inputform textarea, .inputformLong textarea {
		/*width: 60%;*/
	font-family: "Trebuchet MS", Verdana, Arial;
	font-size: 1em;
}
.radio, .checkbox, .submit {
	width: auto;
	margin-left: 12%;
}
.checkboxlong {
	height: 2.8em;
	width: 3em;
	display: block;
	float: left; 
}
.radio {
	float: left;
	margin-right: 1em;
}
.checkboxTable {
	margin-left: 12%;
}
.checkboxTable label {
	float: none;
	margin-left: 12%;
	font-size: 1.4em;	
}
.textbox, .textbox15em {
	width: 60%;
	margin: 0;
	font-family: "Trebuchet MS", Verdana, Arial;
	font-size: 1em;
}
.textbox15em {
	height: 15em;
}
.textbox15emLong {
	width: 100%;
	margin: 0;
	font-family: "Trebuchet MS", Verdana, Arial;
	font-size: 1em;
	height: 25em;
}
.labelheight {
	height: 5em;
	margin-top: 2em;
	margin-bottom: 2em;
}
/* ----------------------------------------------------------- CSS markup */
body {
	font-family: "Trebuchet MS", Verdana, Arial;
	font-size: 62.5%;
	margin: 0;
	padding: 0;
	overflow: visible;
}
#wrapper {
	width: 95%;
	margin: 11em auto 0 auto;
}
	#branding { 
		height: 7.5em;
		background-color: #464646;
		background-image: url(../images/logo.gif);
		background-position: center left;
		background-repeat: no-repeat; 
		margin: 2em auto;
	}
	#mainNav {
		width: 23%;
		float: left;
		padding: 0.3em 0.5em;
	}
		#mainNav ul {
			margin: 0px;
			padding: 0px;
			list-style-type: none;
		}
		#mainNav ul li {
		}
		#mainNav ul li a {
			text-decoration: none;
			height: 2.4em;
			width: 95%;
			display: block;
			margin: 0.2em auto 0.2em 0;
			padding: 0.8em 0 0 1em;
			font-weight: bolder;
			font-size: 1.4em;
		}
		#mainNav ul li a:hover {
			text-decoration: none;
			font-weight: bolder;
		}
#content {
	width: 75%;
	float: right;
}
#mainContent {
	width: 66%;
	float: left;
}
	#mainContent h1 {
		padding: 5% 0 5% 8%;
		width: 85%;
		font-size: 2.6em;
	}
	#mainContent h2 {
		padding: 5% 0 5% 8%;
		width: 85%;
		font-size: 2.6em;
	}
	#mainContent h3 {
		width: 85%;
		font-size: 1.6em;
		margin: 4% 8% 4% 12%;
	}
	#mainContent p {
		margin: 4% 8% 4% 12%;
		max-width: 52em;
		font-size: 1.4em;
	}
	#mainContent ul {
		/*margin: 4% 8% 4% 20%;*/
		margin: 0 8% 0 7em;
		list-style-type: disc;
		list-style-position: outside;
		/*max-width: 70%;*/
		font-size: 1.4em;
		padding: 0;
	}
	#mainContent ul li {
		margin: 0;
		padding: 0;
	}
	.mainContentImage {
		float: right;
		margin-right: 15%;
		padding: 0 0 2em 2em;
	}
	#mainContent img {
		padding: 0.5em;
	}
#secondaryContent {
	width: 33.5%;
	float: right;
	padding: 5% 0 6em 0;
	background-position: top right;
	background-repeat: no-repeat;
}
#secondaryContent h2, #secondaryContent h3, #secondaryContent h4, #secondaryContent p, #secondaryContent ul {
	margin: auto 15%;
}
#secondaryContent h2, #secondaryContent h3  {
	margin-top: 2%;
	margin-bottom: 2%;
	font-size: 1.6em;
}
#secondaryContent h2  {
	padding-bottom: 1em;
}
#secondaryContent h4 {
	font-size: 1.4em;
	font-weight: bolder;
}
#secondaryContent p, #secondaryContent ul {
	font-size: 1.4em;
}
#secondaryContent ul { 
	margin: 1.5em 10% 0 25%;
	padding: 0;
} 
#footer {
	height: 3em;
	margin: 2em 0 2em 0;
	padding: 1em 0 1em 0;
	clear: both;
}
	#footer ul {
		font-size: 1.4em;
		list-style-type: none;
		margin: 1em 0;
		padding: 1em 1em 1em 0;
	}
		#footer ul li {
			float: left;
			display: block;
		}
		#footer ul li a {
			margin: 0 1em 0 1em;
		}
#controlBar {
	width: 100%;
	height: 7.5em;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	background-position: 95% 50%;
	background-repeat: no-repeat;	
	clear: both;
}
	.accessibility {
		margin: 0 2%;
		padding: 1% 0;
	}
	.accessibility p {
		margin: 0.3em 2em 0 0;
		font-size: 1.2em;
	}
	.accessibility ul {
		list-style-type: none;
		margin: 0.3em 0 0 0;
		padding: 0;
	}
	.accessibility li {
		float: left;
		/*height: 1.5em;*/
		margin: 0 0.3em;
		font-size: 1.2em;
	}
		.greyBox {
			border: 1px solid #000;
			background-color: #cecece;
			display: block;
			padding: 0.3em 0.6em;
		}
			.greyBox a {
				font-weight: bolder;
				color: #000;
			}
		.yellowBox {
			border: 1px solid #000;
			background-color: #ffcc00;
			display: block;
			padding: 0.3em 0.6em;
		}
			.yellowBox a {
				font-weight: bolder;
				color: #000;
			}
		.blueBox {
			border: 1px solid #000;
			background-color: #0066cc;
			display: block;
			padding: 0.3em 0.6em;
		}
			.blueBox a {
				font-weight: bolder;
				color: #fff;
			}
		.appClosingDate {
			padding: 0 0 0 2em;
			float: left;
			font-weight: bolder;
		}