/*---[ Details ]---------------------------------------
Site: Open College
Author: Brad Koehler
Contact: brad.koehler@soup.co.uk
Date Created: 04/08/08
Date Modified: 04/08/08
-------------------------------------------------------*/

/*-----------------------------------------------------
Core Elements:
[01] HTML / Body
[02] Anchors
[03] Images
[04] Headings
[05] Lists
[06] Forms
[07] Tables
[08] Phrase Elements
[09] Misc Inline
[10] Misc Block

Site Specific:
[01] Container
[02] Header
[03] Branding
[04] Navigation
[05] Content
[06] Footer
[07] Image Replacements
[08] Clearfixes
[09] Accessible Hide
[10] Misc

Page Specific:
[01] Home
-------------------------------------------------------*/


/*-----------------------------------------------------
Core Elements
-------------------------------------------------------*/
	
/* [01] HTML / Body
-------------------------------------------------------*/
html, body {
	height: 100%;
	margin: 0;
	padding: 0;
	}
	
body {
	color:#5F6062;
	background-color: #FFFFFF;
	background-position: 0 0px;
}



/* [02] Anchors
-------------------------------------------------------*/
a {color:#5F6062;}

a:link{
	text-decoration:none;

}
a:visited {
	text-decoration:none;
}
a:hover{
	text-decoration:underline;
}
a:active {
	text-decoration:none;
}

/* [03] Images
-------------------------------------------------------*/

/* [04] Headings
-------------------------------------------------------*/

/* [05] Lists 
-------------------------------------------------------*/
ul {
	list-style-type:disc;
}

ul.timescale {
	list-style-type:none;
	padding:0;
	margin-top:3px;
}

ul.timescale li{
	padding:9px 10px 8px 9px;
	background-color:#E1E1E1;
	margin-bottom:3px;
}

ul.timescale li h4{
	margin-bottom:0;
	font-size:1em;
}
ul.timescale li p {
	margin-bottom:0;
}
ul.timescale li p a{
	display:block;
}
ul.link-list{
	list-style-type:none;
}
ul.link-list li{
	width:224px;
	padding:0 0 0 10px;
	margin-right:2px;
	display:block;
	float:left;
	background:url(/media/site/images/front-end/bg-link-list-li.gif) 0 5px no-repeat;
	font-weight:bold;
}
ul.link-list li a{
	color:#1BA09B;
}
/* [06] Forms
-------------------------------------------------------*/

/* [07] Tables
-------------------------------------------------------*/

/* [08] Phrase Elements
-------------------------------------------------------*/

/* [09] Misc Inline
-------------------------------------------------------*/

/* [10] Misc Block 
-------------------------------------------------------*/


/*-----------------------------------------------------
Site Specific
-------------------------------------------------------*/

/* [01] Container
-------------------------------------------------------*/
#container {
	width:968px;
	margin:auto;
	position:relative;
	}
	
	
.hr_sep {
	padding: 0;
	margin: 10px 0;
	border-top-width: .5px;
	border-right-width: .5px;
	border-bottom-width: .5px;
	border-left-width: .5px;
	border-top-style: dotted;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #999;
	border-right-color: #999;
	border-bottom-color: #999;
	border-left-color: #999;
	
	}
	
	
/* [02] Header
-------------------------------------------------------*/
#header {
	margin-bottom:16px;
}

#header .contacts,
#header .quick-links{
	float:right;
}

#header .contacts {
	position:absolute;
	top:0; right:0;
}

#header .contacts p{
	display:inline;
	margin-left:16px;
}

#header .contacts p span{
	color:#1BA09B;
	margin-right:3px;
	font-weight:bold;
	font-size:1.1em;
}

#header .quick-links {
	position:absolute;
	top:58px;
	right:0;
}
					
#header .quick-links a{
	font-size:1.2em;
	background:black;
	color:#fff;
	width:118px;
	display:block;
	float:left;
	text-align:center;
	margin:0 0 0 2px;
	padding:3px 0;
}

#header .quick-links a:hover,
#header .quick-links a:visited{
	text-decoration:none;
}

#header .quick-links a.calendar-ql{
	background:#993399;
}#header .quick-links a.gallery-ql{
	background:#C02D3E;
}

#header .image-block {
	clear:both;
	background:#CCC;
	padding:5px 0 5px 5px;
}

#header .image-block img{
	margin:0 5px 0 0;
	display:block;
	float:left;
}
/* [03] Branding
-------------------------------------------------------*/

/* [04] Navigation
-------------------------------------------------------*/
#navigation {
	padding:0;
	list-style-type:none;
}

#navigation li {
	background:#E0E0E0;
	margin-bottom:1px;
	font-weight:bold;
}
#navigation li a {
	display:block;
	padding:4px 0 4px 12px;
	text-decoration:none;	
}

#navigation li a.selected,
#navigation li a:hover {
	background:url(/media/site/images/front-end/branding/buttons/bg-nav-selected-arrow.gif) 95% 6px no-repeat #1BA09B;
	color:#FFF;
	text-decoration:none;
}

#navigation ul {
	padding:0;
	margin:0;
	list-style-type:none;	
}

#navigation ul li{
	background:#EAEAEA;
}

#navigation ul li a{
	color:#999999;
}
	
#navigation ul li a.selected,
#navigation ul li a:hover{
	background:url(/media/site/images/front-end/branding/buttons/bg-subnav-selected-arrow.gif) 95% 6px no-repeat #EAEAEA;
	color:#999999;
	text-decoration:none;
}

/* [05] Content
-------------------------------------------------------*/
#content {
	float:left;
	width:780px;
	margin:0 0 23px 0;
	background:url(/media/site/images/front-end/bg-content-col1.gif) 532px 0 repeat-y;
}

#content h1{
	font-size:1.7em; /* 17px */
	width: 380px;

}

.content-col1 {
	float:left;
	width:524px;
	font-size:1.1em; /* 11px */
	padding-right:9px;
}

.content-col1 h2 {
	display:inline-block;
	font-size:1.5em; /* 15px */
	color:#5F6062;
	margin:0 0 10px 0;
}

.content-col2 {
	float:right;
	width:238px;
	padding-left:7px;
}

div#left-col {
	float:left;
	width:170px;
	margin-right:18px;
	font-size:1.2em; /* 12px */
}

div#left-col #contact-details {
	font-size:0.83em; /* reset font size to 10px (10px/12px =0.833em)*/
}

div#left-col #contact-details h2{
	color:#1BA09B;
	font-size:1.5em; /* 15px from inherited 10px */
}

div#left-col #contact-details h3{
	font-size:1.1em; /* 11px from inherited 10px */
	margin:10px 0 0 0;
}
div#left-col #contact-details p{
	margin-bottom:3px;	
}
div#left-col #contact-details p span{
	color:#1BA09B;
	display:block;
}

.callout {
	margin-bottom:9px;
}

.callout p {
	padding:3px 0 0 9px;
	margin:0;

}

.callout p a {
	color:#FFF;
	padding:3px 15px 4px 4px;
	display:inline-block;
}

.callout div {
	background:#E1E1E1;
	padding-bottom:9px;
}

.callout img{
	margin:0 0 2px 0;
}

.callout h3{
	font-size:1.5em; /* 15px */
	background:#E1E1E1;
	padding:3px 0 3px 9px;
	margin-bottom:2px;
}

/* Callout Colors */

.purple h3 {
	color:#993399;
}

.purple p a {
	background:url(/media/site/images/front-end/branding/buttons/btn-right-arrow-purple.gif) 95% 5px no-repeat #993399;	
}

.red h3 {
	color:#C02D3E;
}

.red p a {
	background:url(/media/site/images/front-end/branding/buttons/btn-right-arrow-red.gif) 95% 5px no-repeat #C02D3E;
}

.blue h3 {
	color:#1A50B8;
}

.blue p a {
	background:url(/media/site/images/front-end/branding/buttons/btn-right-arrow-blue.gif) 95% 5px no-repeat #1A50B8;
}

.callout-text-red {
	padding:14px 15px 12px 15px;
	position:relative;
	margin-bottom:10px;
	color:#FFF;
	background-color: #C02D3E;
	background-image: url(../../media/site/images/front-end/branding/red-corner_alt.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
}

.callout-text-purple {
	padding:14px 15px 12px 15px;
	position:relative;
	background:url(/media/site/images/front-end/branding/purple-corner.gif) bottom right no-repeat #993399;
	margin-bottom:10px;
	color:#FFF;
}

.callout-text-green {
	padding:11px 15px 12px 12px;
	color:#FFF;
	background-repeat: no-repeat;
	background-position: right bottom;
	height: 70px;
	width: 500px;
	background-color: #1BA09B;
	background-image: url(../../media/site/images/front-end/branding/green-corner.gif);
}

.callout-text-green p{
	font-size:0.9em;
}

.callout-left{
	width: 73px;
	display: none;
	float: left;
}

.callout-right{
	width:400px;
	display:block;
	float:left;
	margin-left:0;
}

.page-header p.copy {
	font-size:1.7em;
}
div.two-col-content {
	margin:10px 0;
	background:url(/media/site/images/front-end/bg-content-col1.gif) 259px 0 repeat-y;
}
div.two-col-content div{
	float:left;
	width:253px;
	padding:0 9px 0 0;
}
div.two-col-content div.right{
	padding:0 0 0 9px;
	float:left;
}
div.two-col-content a {
	color:#1BA09B;
	text-decoration:underline;
	}
div.two-col-content em {
	display:block;
}

div.two-col-content h4{
	font-size:1em;
	margin-bottom:0;
}

div#gallery {
	margin:10px 0;
	float:left;
	display:block;
}

div#gallery img{
	/*float:left;*/
	border:1px solid white;
}

.flickr_badge_image {
	width:238px;
 max-width:238px;
	display:block;
 overflow:inline;
}

#flickr_badge_image1, #flickr_badge_image3 {
	float:	left;
 
}

#flickr_badge_image3 {
	clear:both;
}

#flickr_badge_image2, #flickr_badge_image4 {
	float:	right;
}

#flickr_badge_image3 {

}

div.staff-member,
div.news-article,
div.timeline li {
	background:url(/media/site/images/front-end/bg-footer.gif) bottom left repeat-x;
	padding-bottom:10px;
}

div.staff-member img{
	margin-right:20px;
	clear:right;
	float:left;
}

div.staff-member p{
	width:368px;
	float:right;
	}
	
div.news-article {
	margin-top:10px;
}
div.news-article div.news-article-image {
	float:left;
	clear:right;
	margin-right:10px;
}
div.news-article p{
	margin:10px 0;
}
div.news-article p.news-summary{
	margin-top:0;
}
div.news-article span.news-caption {
	font-size:0.9em;
	display:block;
}
p.link {
	margin-top:10px;
}

div.vac-desc {
	border-bottom:1px solid #ccc;
	padding-bottom: 10px;
}
div.vac-desc p.apply {
	margin-top:10px;
	font-weight:bold;
	display:block;
}
div.links,
div.vacancies {
	margin-top: 10px;
}
div.links h4 a {
	text-decoration:none;
}
div.links h4 a:hover {
	text-decoration:underline;
}
.content-col1 p.link {
	margin-bottom: 10px;
}
.content-col1 p a,
.content-col1 li a {
	text-decoration: underline;
	color:#1BA09B;
}
#calendar {
margin:10px 0;
}

p.summary {
	margin:10px 0;
 font-weight:	700;
}

/* [06] Footer
-------------------------------------------------------*/
#footer {
	clear:both;
	width:968px;
	font-size:1.1em; /* 11px */
	text-align:right;
	background:url(/media/site/images/front-end/bg-footer.gif) top left repeat-x;
	padding-top:10px;
}

#footer ul {
	padding:0;
	list-style-type:none;
}

#footer ul li {
	display:inline;
	margin-right:5px;
}

#footer p,
#footer ul li a{
	color:#999999;
}

#footer ul li a{
	text-decoration:none;
	}
#footer ul li a:hover{
	text-decoration:underline;
	}
/* [07] Image Replacements
-------------------------------------------------------*/
.imr {
	display: block;
	text-indent: -9999px;
	}



/* [08] Clearfixes
-------------------------------------------------------*/
/* More info at: http://www.positioniseverything.net/easyclearing.html */
.clearfix:after,
#container:after,
#content:after,
#header .image-block:after,
.callout-text-green:after,
div.two-col-content:after,
ul.link-list:after,
div.staff-member:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
	}
.clearfix,
#container,
#content,
#header .image-block,
.callout-text-green,
div.two-col-content,
ul.link-list,
div.staff-member {

	}

/* [09] Accessible Hide
-------------------------------------------------------*/
.w3c {
	position: absolute;
	display: block;
	height: 0;
	visibility: hidden;
	left: -9999px;
	}

/* [10] Misc
-------------------------------------------------------*/


/*-----------------------------------------------------
Page Specific
-------------------------------------------------------*/

/* [01] Vacancies
-------------------------------------------------------*/

.vacancy-files {
	margin-top: 10px;
}
.vacancy-files ul {
	margin: 5px 0 0;
}
.vacancy-files ul li {
	margin: 0 0 4px;
}