﻿/*********************************************************************
General styles
*********************************************************************/

html, body {
	margin: 0;
	padding: 0;
}

body {
	font: 100% Arial,Helvetica,san-serif; 
}

a, a:link, a:visited {
	color: white;
	text-decoration: none;
}

img {
	display: block;
	border: none;
}

h1 { font-size: 150%; }
h2 { font-size: 130%; }
h3 { font-size: 130%; }
h4, h5, h6 { font-size: 110%; }

ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

form { margin: 0 }

.float-left { float: left; }
.float-right { float: right; }

/* tinyMCE styles */

.picleft { float: left; margin: 0 0 5px 0; }
.picright { float: right; margin: 0 0 5px 10px; }

/*********************************************************************
Auto expanding floats for compliant browsers
*********************************************************************/

#page-container:after,
#accessibility:after,
#generalinformation:after,
#closebutton:after,
#topnav:after,
#column-container:after,
#rightcol:after,
#tabs:after,
#leftcol:after,
#info-boxes ul:after,
#footer ul:after {
	content: ".";
	height:0;
	display:block;
	clear:both;
	visibility:hidden;
}

/* Some elements still need to be cleared manually... */

.clear-left { clear: left; }

.clear-both { clear: both; }

/***
Main container settings
***/

#page-container {
	width: 905px;
	padding: 0 25px 20px 22px;
	color: white;
}

/*********************************************************************
Layout for left column and content uses the One True Layout
*********************************************************************/

#column-container {
	margin-bottom: 18px;
}

#leftcol {
	float: left;
	width: 220px;
	margin-left: -905px;
	margin-top: 72px;
    padding-top: 38px; /* Remove 22px due to breadcrumbs */
}

#rightcol {
	float: left;
	width: 680px;
	margin-left: 225px;
}

/* Elements in the right column */

#content {
	float: left;
	width: 640px;
}

#info-boxes {
	float: left;
	width: 680px;
}

/*********************************************************************
General classes used through the site
*********************************************************************/

/* gfxtext class allows a background image to appear above some text. 
   It can be used as follows:
   
   <h2 class="gfxtext"><span></span>This text appears beneath a 
   graphic</h2>
   
   Width and height dimensions need to be applied to both the outer and 
   inner elements. The background image is set via the inner SPAN. */

.gfxtext,
#topnav li a {
	display: block;
	margin: 0;
	padding: 0;
	position: relative;
}
.gfxtext, a.gfxtext:visited {
	color: white;
}
.gfxtext span,
#topnav li a span {
	display: block;
	width: 100%;
	background-repeat: no-repeat;
	background-position: top left;
	position: absolute;
	top: 0;
	left: 0;
}
a.gfxtext span,
#topnav li a span {
	cursor: pointer;
}

/* Other general classes */

.bulletwhite {
	padding-left: 13px;
	background: url(../images/colour-schemes/general/bullet.gif) center left no-repeat;
}

/*********************************************************************
Styling for normal body content
*********************************************************************/

#content {
	/*min-height: 541px;*/
	padding: 10px 30px 19px 10px;
	background-color: white;
	color: black;
	font-size: 75%;
}
#content a {
	color: black;
	text-decoration: underline;
}
#content p {
	margin-top: 0;
	line-height: 1.35em;
}
#content h3 {
	margin-bottom: 0;
}
#content ul {
	margin: 1em 1em 1em 1.5em;
	padding: 0;
	list-style-type: disc;
}
#content li {
	margin-bottom: 0.5em;
}

/* Tables */

#content table {
	border-collapse: separate;
	border-spacing: 5px 0;
	margin-left: -5px;
}
#content th { padding: 4px 8px 4px 8px; }
#content td { padding: 4px 8px 4px 8px; }
#content th {
	background-color: #5AA4D5;
	color: white;
	font-size: 105%;
	text-align: left;
}
#content td {
	font-size: 90%;
	border-bottom: solid #ACA899 1px;
}

#rightcol #content img{
	float: none;
}

/*********************************************************************
Styling for body content with blue background (sitemap, contact us, etc.)
*********************************************************************/

#content.nonboxed {
	width: 680px;
	padding: 0;
	color: white;
	background: transparent;
}
#content.nonboxed a {
	color: white;
}

/*********************************************************************
Special styling that appears in page body
*********************************************************************/

/* Column list */

#content div.columnlist {
	float: left;
	margin: 1em 5px 0 0;
}

#content div.columnlist ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#content div.columnlist li {	
	margin: 13px 0 0 0;
	padding-bottom: 8px;
	border-bottom: solid #5AA4D5 1px;
}

#content div.columnlist li p,
#content div.columnlist li h3 {
	margin: 0;
	font-size: 110%;
}

#content div.columnlist h2 {
	background-color: #5AA4D5;
	color: white;
	padding: 0 5px 0 5px;
}

/* Image with caption */

#content div.image-caption p {
	background-color: #4E4855;
	color: white;
	font-size: 80%;
	margin: 0;
	padding: 8px 8px 14px 8px;
}

/*********************************************************************
Tabs
*********************************************************************/

#tabs {
}
#tabs li {
	float: left;
	margin-right: 1px;
	font-weight: bold;
	font-size: 90%;
}
#tabs li.selected span {
	color: #4E4855;
}
#tabs li a, #tabs li span {
	display: block;
	padding: 7px 5px 2px 7px;
}
#tab-overview a, #tab-staff a, #tab-courses a,
#tab-news a, #tab-the-team a {
	width: 89px;
	background: url(../images/general/tab_101px.gif) top left no-repeat;
}
#tab-news-and-events a, #tab-case-studies a,
#tab-facilities a {
	width: 133px;
	background: url(../images/general/tab_146px.gif) top left no-repeat;
}
#tab-overview.selected span, #tab-staff.selected span, #tab-courses.selected span,
#tab-news.selected span, #tab-the-team.selected span {
	width: 89px;
	background: url(../images/general/tab_101px_selected.gif) top left no-repeat;
}
#tab-news-and-events.selected span, #tab-case-studies.selected span,
#tab-facilities.selected span {
	width: 133px;
	background: url(../images/general/tab_146px_selected.gif) top left no-repeat;
}

/*********************************************************************
Skip navigation
*********************************************************************/

#skipnav {
	display: none;
	margin: 0;
	padding: 0;
}
#skipnav li {
	font-size: 70%;
	line-height: normal;
	display: inline;
}

/*********************************************************************
Breadcrumb
*********************************************************************/

#breadcrumb {
	float: left;
	margin: 5px 0 0 0;
}
#breadcrumb li {
	float: left;
	padding: 0 0 0 14px;
	background-repeat: no-repeat;
	background-position: 3px center;
	font-size: 70%;
}
#breadcrumb li.first {
	padding: 0;
	background: none;
}
#breadcrumb li, #breadcrumb li a {
	color: #FFFFFF;
}

/*********************************************************************
Top navigation
*********************************************************************/

#topsearch {
    position: relative;
    left: 29px;
    float:right;
	margin: 35px 0 0 0;
}
/*#topnav {global.css (line 359)
background-color:#FFFFFF;
margin:15px 0 0 -23px;
width:957px;
}*/
#topnav {
	width: 957px; /* A few px larger than needed for Safari Win Beta 3 */
	margin: 15px 0 0 -23px;
	background-color: #FFFFFF;
}
#topnav li {
	float: left;
}
#topnav li a {
	font-size: 70%;
}
#topnav li a, #topnav li a span {
	height: 29px;
}
#topnav li a span:hover,
#topnav li a span.over ,
#topnav li.selected a span {
	background-position: bottom left;
}

/* Settings for gfxtext classes */

#topnav-courses a { width: 77px; }
#topnav-departments a { width: 92px; }
#topnav-student-information a { width: 131px; }
#topnav-gallery a { width: 58px; }
#topnav-about-the-college a { width: 119px; }
#topnav-news a { width: 49px; }
#topnav-events a { width: 55px; }
#topnav-for-employers a { width: 99px; }

/* Contact-Us */
#topnav-contact-us a { width: 78px; }


/* Search form */

#frm-search p {
	margin: 0;
}
#frm-search label {
	/*display: none;*/
	font-family: Helvetica,Arial,san-serif;
    font-size: 0.81em; /*12.9667px*/
    font-weight: bold;
	float: left;
    padding-top: 1px;
}
#frm-search input {
	float: left;
}
#frm-search #searchterm {
	width: 140px;
    height: 16px;
    font-family: Arial,Helvetica,san-serif;
	font-size: 0.69em; /* Safari Win needs font-size to be specified - this value is consistent across IE6&7, FF2, OP9 */
                       /* 11.0333px */
	padding: 3px 3px 0px 3px;
	border: none;
	margin: 0 0 0 5px; /* Overides Safari Win default border */
}

#frm-search #searchsubmit {
	padding-left: 2px;
}

#frm-search button#searchsubmit {
	float: left;
	margin-left: 2px;
	border: 0;
	padding: 0;
	width: 30px;
	height: 19px;
	background: url(../images/colour-schemes/general/button_topnav_search_go.png) no-repeat 0 0;
	text-indent: -9999px;
	cursor: pointer;
}


/*********************************************************************
Hovering menu at the top added by Paul 12/3/2008 for Fogbugz 2749
*********************************************************************/
div.hovermenu {
	display: none; /*start of as not displayed just in case there is a browser which doesn't run the Javascript in mooeffects.js which rolls it open*/
	position: absolute; z-index: 100;
	color: #59a3d4; font-size: 80%; font-weight: bold;
	padding:0; margin:0;
	width: 899px;
}
div.hovermenu ul {
	background: url(../images/colour-schemes/general/whitebackgroundsemi.png) 0 0 no-repeat;
	/*behavior: url(/iepngfix.htc);*/ /*usually for PNG transparency on IE6, not needed as there's already some Javascript for this on this site*/
	width: 899px; height: 144px; /*needed for the backgrounds to look right*/
}
div.hovermenu ul ul {background: none;}
div.hovermenu ul li a {color: #59a3d4;}
div.hovermenu ul li {border-left: 1px solid #59a3d4; float: left; padding: 7px 10px 0 10px;}
div.hovermenu ul li.first {border-left: none;} /*no border on the far left*/
div.hovermenu ul li ul {width: 204px; height: 120px;} /*put the width within the li's padding*/
div.hovermenu ul li ul li {
	height: auto; width: auto; border: none; float: none; /*Override other styles set above*/
	color: black; font-weight: normal;
	padding: 0 0 0 15px; margin: 5px 0 0 0;
	background: url(../images/colour-schemes/general/bulletblack.gif) left 5px no-repeat;
}
div.hovermenu ul li ul li a, div.hovermenu ul li ul li a:visited {color: black; position: relative;}
div.hovermenu #closebutton {clear: both; float: right;}


/*********************************************************************
Graphical headings
*********************************************************************/

/* Masthead items */
/*generalinformation and closebutton added by Paul 12/3/2008 for Fogbugz 2749*/
#accessibility, #generalinformation, #closebutton     {height: 25px; width: 222px; color: white; }
#linksintopright {float: right; width: 300px;} /*Added by Paul 12/3/2008 for Fogbugz 2749*/
#linksintopright a {float: right;} /*Added by Paul 12/3/2008 for Fogbugz 2749*/
#accessibility span, #generalinformation span, #closebutton span { height: 25px; width: 222px; }
#morley-college { font-weight: normal; font-size: 400%; margin: 0; padding-top: 25px;} /*clear:both removed and padding-top added by Paul 12/3/2008 for Fogbugz 2749 so it will shunt down a bit*/
#morley-college a,#morley-college a span { height: 75px; width: 431px; margin-top: 4px; }

/* Page title - background image is specified per template */

#pagetitle {
	font-size: 260%;
	margin: 11px 0 0 0;
	/*margin: 15px 0 15px 0;*/
	min-height: 61px;
    padding: 8px 0px 30px; /* Remove 22px because of breadcrumbs */
}

/* Left nav heading and Tell us what you think? in left nav */

#leftnav-heading,
#text-tell-us-what-you-think {
	height: 26px;
	background-color: white;
	color: #4E4855;
	font-size: 85%;
}
#leftnav-heading span,
#text-tell-us-what-you-think span { 
	height: 26px;
}
#text-tell-us-what-you-think span { background-image: url(../images/general/heading_tell_us_what_you_think.gif); }

#send-to-a-friend { clear: both; display: block; margin-top: 3.9em; }

/*********************************************************************
Info boxes beneath content

The three inner DIVs maintain a consistent minimum height using the 
OneTrueLayout method by Alex Robinson:
http://www.positioniseverything.net/articles/onetruelayout/
*********************************************************************/

#info-boxes {
	overflow: hidden;
	margin-top: 18px;
	font-size: 75%;
}
#info-boxes div {
	float: left;
	width: 222px;
	margin-right: 6px;
	min-height: 100px;
	padding-bottom: 200px;
	margin-bottom: -200px;
}
#info-boxes div.last {
	margin-right: 0;
}
#info-boxes p {
	margin: 4px 5px 0.2em 4px;
}
#info-boxes ul {
	margin: 4px 10px 4px 0;
}
#info-boxes li {
	padding-left: 25px;
	margin: 0 0 0.2em 0;
	line-height: 1em;
	background-repeat: no-repeat;
	background-position: 9px center;
}

#info-boxes #course-guide #community-programme { width: 223px; }
#info-boxes #course-guide #community-programme h3 { margin: 0; }
#info-boxes #course-guide #community-programme a { color: #4E4855; text-decoration: underline; }
#info-boxes #promo { background-color: #4E4855; width: 223px; }

#info-boxes h3, #info-boxes h3 span { height: 24px; margin: 0px; }

/* Content styling for course guide */
#course-guide img { float: right; margin-left: 5px; }
#community-programme img { float: right; margin-left: 5px; }

/* Content syling for promo box */
#promo h3 { margin: 0.2em 4px 0.2em 4px; }
#promo p { margin: 0.2em 4px 0.2em 4px; }

/*********************************************************************
Left nav & poll links
*********************************************************************/

#leftnav {
	margin: 11px 0 36px 0 ;
}

#poll-links {
	padding: 10px 0 7px 0;
	margin: 0;
	list-style-type: none;
	border-top: solid white 1px;
	border-bottom: solid white 1px;
}

#leftnav li, #poll-links li {
	padding-left: 29px;
	margin: 0 0 0.525em 0;
	font-size: 70%;
	line-height: 1em;
	background-repeat: no-repeat;
	background-position: 12px center;
}

/*********************************************************************
Footer
*********************************************************************/

#footer {
	background: url(../images/global/footer_border.gif) top left no-repeat;
	padding-top: 10px;
}

#footer ul {
    float:left;
    width: 456px;
}

#footer h3.footer-address {
	font-size: 70%;
    font-weight:normal;
    float:left;
    margin: 0;
}

#footer li {
	float: left;
	font-size: 70%;
	padding-left: 9px;
	background: url(../images/global/footer_list_spacer.gif) 4px center no-repeat;
}
#footer li.first {
	padding-left: 0;
	background: none;
}
#footer p {
	margin: 0;
	padding: 123px 0 0 0;
	font-size: 65%;
	color: #4E4855;
}
#footer p a { color: #4E4855; text-decoration: underline; }

#morley-badge {
	float: right;
	width: 84px;
	height: 75px;
	font-size: 70%;
}
#morley-badge span { width: 84px; height: 75px; }
