/* 	UKCSI website
	HTML and CSS by Leon Paternoster (leon.paternoster@icsmail.co.uk)
*/


/* CONTENTS

	1. Basic settings and reset
	2. Layout
	3. Universal typography (base elements and site wide additional classes)
	4. Header
	5. Home page
	6. Results page
	7. About page
	8. Subscriptions page (labelled 'Add your organisation' in nav menu. 'Subscribe' is our internal term, 'Add...' means more
	9. Contact page
	10. Further information
	11. Footer
	
*/

/* 	1. BASIC SETTINGS AND RESET */

/* 	Set some selector margins and padding to 0 to make broswer rendering predictable
	A full reset is overkill
*/

body, ul, ol, p, h1, h2, h3, h4, h5, h6, fieldset, dd {
	margin:  0;
	padding: 0;
}

/* Some basic settings */

body {
	background-color: #FFF;
	color: #333;
	font-family: 'helvetica neue', arial, calibri, 'lucida grande', 'trebuchet ms', 'deja vu sans', sans-serif;
	line-height: 24px;
	font-size: 100%;
	width: 960px;
	margin: 0 auto 22px auto;
}

a img {
	border: none;
}

/*	2. LAYOUT
	6 column grid
	30px margins
	
	Implement by adding a class and direction to an element
	
	The last column(s) in a row must have the class 'last' added to it,
	e.g. 'left three' and 'left three last' (six columns to a page).
	If you don't add 'last' the width of the columns will exceed the container's width:
	and that's not good.
*/

.one {
	width: 135px;
}

.two {
	width: 300px;
}

.three {
	width: 465px;
}

.four {
	width: 630px;
}

.five {
	width: 795px;
}

.six {
	width: 960px;
}

.clear {
	clear: both;
}

.left {
	float: left;
	margin-right: 30px;
	display: inline;
	overflow: hidden;
}

.right {
	float: right;
	margin-left: 30px;
	display: inline;
	overflow: hidden;
}

.last {
	margin-right: 0;
	margin-left: 0;
}

/*	3. UNIVERSAL TYPOGRAPHY */

a:link {
	color: #006B48;
}

a:visited {
	color: #888;
}

a:hover, a:active {
	color: #424C47;
}

p, ul, ol, dd {
	margin-bottom: 11px;
}

li {
	list-style-position: inside;
	margin-left: 48px;
}

abbr {
	border-bottom: 1px dotted #AAA;
	cursor: help;
}

.call {
	padding: 8px 8px;
	background-color: #006B48;
	color: #FFF;
	text-decoration: none;
	border: none;
	text-align: center;
	text-shadow: 1px 1px 1px #333;
	font-size: 21px;
	margin: 12px 0 24px 0;
	-webkit-border-radius: 10px 10px 10px 10px;
	-webkit-box-shadow: 2px 2px #DFDFDF;
	-moz-border-radius: 10px 10px 10px 10px;
	-moz-box-shadow: 2px 2px #DFDFDF;
	-o-border-radius: 10px 10px 10px 10px;
	-o-box-shadow: 2px 2px #DFDFDF;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 2px 2px #DFDFDF;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;	
}

a.call_to_action:link, a.call_to_action:visited {
	padding: 8px 8px;
	background-color: #006B48;
	color: #FFF;
	text-decoration: none;
	border: none;
	-webkit-border-radius: 10px 10px 10px 10px;
	-webkit-box-shadow: 2px 2px #DFDFDF;
	-moz-border-radius: 10px 10px 10px 10px;
	-moz-box-shadow: 2px 2px #DFDFDF;
	-o-border-radius: 10px 10px 10px 10px;
	-o-box-shadow: 2px 2px #DFDFDF;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 2px 2px #DFDFDF;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;	
}

a.call_to_action:hover {
	background-color: #424C47;
}

.img_link {
	color: #FFF;
	border: none;
	text-decoration: none;
}

.doc_link {
	background-image: url(images/report.png);
	background-repeat: no-repeat;
	padding-left: 28px;
	font-weight: bold;
}

.email {
	background-image: url(images/mail.png);
	background-repeat: no-repeat;
	padding-left: 28px;
	background-position: left center;
}

.print {
	background-image: url(images/printer.png);
	background-repeat: no-repeat;
	padding-left: 28px;
	background-position: left center;
}

.highlight {
	background-color: #DFDFDF;
	border: 1px solid #9F90AB;
	padding: 21px;
	width: 256px;
	margin-top: 11px;
}

.shove_up {
	margin-top: 55px;
}

.breadcrumb {
	padding: 10px;
	border: 1px solid #9F90AB;
	background-color: #DFDFDF;
}

/*	4. HEADER */

.mob {
	border-bottom: 1px dotted #DFDFDF;
	margin-bottom: 11px;
	color: #AAA;
}

.mob a:link, .mob a:visited, .mob a:hover {
	font-size: 12px !important;
	color: #AAA !important;
	text-decoration: none !important;
}

.logo {
	margin-bottom: 12px;
	text-align: right;
}

.site-title {
	font-size: 24px;
	font-weight: normal;
	line-height: 48px;
}

.site-title a:link, .site-title a:visited, .site-title a:hover, .site-title a:active {
	color: #006B48;
	text-decoration: none;
}

.nav {
	overflow: hidden;
	background-color: #424C47;
	width: 960px;
}

.nav li {
	display: inline;
	float: left;
	width: 164px;
	border-right: 1px solid #FFF;
	text-align: center;
	color: #FFF;
	background-color: #424C47;
	margin-left: 0;
	font-size: 14px;
}

.nav li a:link, .nav li a:visited {
	color: #FFF;
	display: block;
	text-decoration: none;
	border-bottom: none;
	padding: 5px 0 6px 0;
}

li.current {
	padding: 5px 0 6px 0;
	margin-left: 0;
}

.nav li a:hover, li.current {
	background-color: #006B48;
}

/*	5.HOME PAGE */

	/* Lead */

.results_lead {
	padding-top: 10px;
	border-top: 1px dotted #9F90AB;
	overflow: hidden;
}

.results_lead h1, .about_section h1 {
	font-size: 36px;
	line-height: 44px;
	letter-spacing: -1px;
	text-shadow: 1px 1px 1px #DFDFDF;
	margin-bottom: 11px;
}

.results_lead p {
	margin-bottom: 22px;
}

.results_lead object {
	margin-bottom: 0;
}

.teaser {
	font-size: 12px;
	background-image: url(images/report.png);
	background-repeat: no-repeat;
	padding-left: 28px;
}

/*	6. RESULTS PAGE */

.headlines {
	padding-top: 10px;
	border-top: 1px dotted #9F90AB;
	overflow: hidden;
}

.headlines h1 {
	font-size: 36px;
	line-height: 44px;
	letter-spacing: -1px;
	text-shadow: 1px 1px 1px #DFDFDF;
	margin-bottom: 11px;
}

.headlines h2 {
	margin: 16px 0 6px 0;
}

.results .headlines ul li {
	list-style-type: none;
	list-style-image: url(images/new_pin.jpg);
	margin-bottom: 11px;
}

.headlines ul.sectoral_list li {
	list-style-image: none;
	list-style-type: disc;
	padding: 0;
}

.headlines img {
	display: block;
	margin: 0 auto 11px auto;
	border: 1px solid #DFDFDF;
	-webkit-box-shadow: 5px 5px 5px #CFCFCF;
	-moz-box-shadow: 5px 5px 5px #CFCFCF;
	-o-box-shadow: 5px 5px 5px #CFCFCF;
	box-shadow: 5px 5px 5px #CFCFCF;
}

.download_results {
	padding-top: 10px;
	border-top: 1px dotted #9F90AB;
}

.download_results h1 {
	font-size: 18px;
	margin-bottom: 11px;
}

/*	7. ABOUT PAGE */

#about_contents, .about_section {
	padding-top: 10px;
	border-top: 1px dotted #9F90AB;
}

#about_contents h1 {
	font-size: 18px;
}

#about_contents li {
	margin-left: 11px;
}

.about_section h2, .about_section h3, .about_section dt {
	margin: 16px 0 6px 0;
}

.about_section h2 {
	font-size: 21px;
}

.about_section h3, .about_section dt {
	font-size: 18px;
	color: #888;
}

.about_section dd {
	margin-left: 48px;
	margin-bottom: 0;
	list-style-type: circle;
}

/*	8. SUBSCRIPTIONS PAGE */

.subs_info, .subs_actions {
	padding-top: 10px;
	border-top: 1px dotted #9F90AB;
}

.subs_info h1 {
	font-size: 36px;
	line-height: 44px;
	letter-spacing: -1px;
	text-shadow: 1px 1px 1px #DFDFDF;
	margin-bottom: 11px;
}

.subs_info h2, .subs_info h3 {
	margin: 16px 0 6px 0;
}

.subs_info h2 {
	font-size: 21px;
}

.subs_info h3, .subs_info dt {
	font-size: 18px;
	color: #888;
}

.subs_actions h1 {
	font-size: 18px;
	margin: 0;
}

/*	9. CONTACT PAGE */

.contact_info h1 {
	font-size: 36px;
	line-height: 44px;
	letter-spacing: -1px;
	text-shadow: 1px 1px 1px #DFDFDF;
	margin-bottom: 11px !important;
}

.contact_info h2, .subs_info h3 {
	margin: 16px 0 6px 0;
}

.contact_info h2 {
	font-size: 21px;
}

.contact_info h3, .subs_info dt {
	font-size: 18px;
	color: #888;
}

/*	10. FURTHER INFORMATION */

.further_information {
	padding-top: 10px 0 11px 0;
	border-top: 1px dotted #9F90AB;
	overflow: hidden;
}

.further_information h2 {
	margin: 15px 0 7px 0;
	font-size: 16px;
}

.further_information p {
	color: #888;
	font-size: 12px;
	line-height: 18px;
}

.transcript h1 {
	margin-bottom: 22px;
	line-height: 1.25em;
}

.transcript p {
	width: 630px;
}

/*	11. FOOTER */

#footer {
	clear: both;
	padding-top: 10px;
	border-top: 1px dotted #9F90AB;
	color: #888;
	font-size: 12px;
	line-height: 16px;
	overflow: hidden;
}

#footer p {
	margin-bottom: 0;
}

.footer_links {
	margin-bottom: 11px;
}

.footer_links li {
	display: inline;
	margin-right: 22px;
	margin-left: 0;
}

.footer_links li a:link, .footer_links li a:visited, .footer_links li a:hover {
	text-decoration: none;
	color: #888;
}

.footer_links li a:hover {
	color: #424C47;
}

.sitemap h1 {
	margin: 22px 0;
}

.sitemap ul li ul li {
	margin-left: 22px !important;
}
