/**
	JISC Casper (c) 2008 JISC Collections
	Stylesheet Provided by Polaris Digital
	http://polaris-digital.com
	
	Written by Sam Clark
	
	Document Version	: 1.0
	CSS Version			: 2.1
	
	Provides all SCREEN css styles throughout
	JISC Casper
	
**/

/**	=========================================== **
	
	Global Styles

 **	=========================================== **/

html, body
{
	position: relative;
	margin:0;
	padding:0;
	font-size:1em;
	font-family:"Myriad Pro", Verdana, Arial, sans-serif;
	color:rgb(79,79,79);
	background:rgb(255,255,255);
}

.clearFloats
{
	clear: both;
}

.floatLeft
{
	float:left;
}

.floatRight
{
	float:right;
}

.alignRight
{
	text-align:right;
}

.alignLeft
{
	text-align:left;
}

.alignCentre
{
	text-align:center;
}

a
{
	color:rgb(241,115,31);
	text-decoration:none;
}

a:hover
{
	text-decoration: underline;
}

h1, h2, h3, h4, h5, h6
{
	margin:10px 0;
	font-weight:bold;
}

abbr, acronym
{
	border-bottom:none;
	cursor:text;
}

.spacing p
{
	line-height:1.5em;
}

.h1Fake
{
	
}

.h2Fake
{
	font-size:135%;
	margin:10px 0;
	font-weight:bold;
}

/**	=========================================== **
	
 	Colours

 **	=========================================== **/

.blue
{
	color: rgb(67,110,178);
}

.orange
{
	color:rgb(241,115,31);
}

/**	=========================================== **
	
 	Site Icons

 **	=========================================== **/


.icon
{
	padding-left:20px;
	padding-top:4px;
	padding-bottom:4px;
	display: block;
}

.iconFile
{
	background:url('../images/icons/file.png') no-repeat left center;
}

.iconWebFile
{
	background:url('../images/icons/file-web.png') no-repeat left center;	
}

.iconAccessibility
{
	background:url('../images/icons/accessible.png') no-repeat left center;	
}

.iconRSSOrange
{
	background:url('../images/icons/rss-orange.png') no-repeat left center;
	font-size:90%;
}


/**	=========================================== **
	
	Accessibity Styles

 **	=========================================== **/

.accessible
{
	padding: 0;
	margin: 0;
	text-indent: -999em;
	display: block;
	height: 0px;
	width: 0;
	overflow: hidden;
}

/**	=========================================== **
	
	Left boxes

 **	=========================================== **/

.blueBox a
{
	color: rgb(67,110,178);
}

.blueBox a.btn
{
	border:1px solid rgb(67,110,178);
	background:rgb(117,168,251) url('../images/btn_blue.jpg') bottom center repeat-x;
	color:rgb(230,230,248);
	padding:5px;
	font-family:Arial, sans-serif;
	text-decoration:none;
}

.blueBox a.btn:hover
{
	color:rgb(255,255,255);
	border:1px solid rgb(50,64,88);
}

.blueBox h2
{
	color: rgb(67,110,178);	
	margin:30px 0 0;
}

.blueBox div
{
	border-top:rgb(142,170,204) 8px solid;
	border-bottom:rgb(142,170,204) 8px solid;
	padding:10px;
}

.blueBox div p:last-child
{
	margin-bottom:5px;
}

.orangeBox a
{
	
}

.orangeBox h2
{
	color:rgb(241,115,31);
}

.orangeBox div
{
	background:rgb(241,230,193);
	padding:10px;
}

.orangeBox div fieldset
{
	border:none;
	padding:0;
	margin:0;
}

.orangeBox div fieldset legend
{
	text-indent:-999em;
	display: block;
	height:0px;
	width:0px;
	padding:0;
	margin:-20px;
}

/**	=========================================== **
	
	Page Layout Positioning and Style

 **	=========================================== **/

div#pageFrame
{
	position:relative;
	width: 900px;
	margin: 0 auto;
	padding: 0;
	border-top: 1px solid rgb(255,255,255);
}

/**	=========================================== **
	
	Page Header Logo and Links

 **	=========================================== **/
 
div#pageHeader
{
	border: none;
	padding: 0;
	margin: 20px 0;
}

div#pageHeader p#jiscCasperSiteLogo a
{
	width: 300px;
	height: 0px;
	display: block;
	padding: 103px 0 0 0;
	background: url('../images/jisc-casper-logo.jpg') top left no-repeat;
	overflow: hidden;
	float:left;
	margin: 0;
}

div#pageHeader ul#headerNavigation
{
	padding: 0;
	margin: 0;
	float: right;
}

div#pageHeader ul#headerNavigation li
{
	display: inline;
	list-style:none;
	float:left;
}

div#pageHeader ul#headerNavigation li a
{
	font-size: 70%;
	color: rgb(67,110,178);
	padding-right: 20px;
}


/**	=========================================== **
	
	Page Menu and Links

 **	=========================================== **/

div#topMenu
{
	margin:10px 0 0;
	padding:0;
	border-bottom:3px solid rgb(241, 230, 193);
	background: rgb(230,230,230);
	min-height:20px;
}

div#topMenu ul#mainMenu
{
	background:rgb(84,84,84);
	color:rgb(255,255,255);
	padding:6px 10px 4px 10px;
	margin:0;
	float:left;
}

div#topMenu ul#mainMenu li
{
	list-style: none;
	display:inline;
	padding:10px 0;	
}

div#topMenu ul#mainMenu li a
{
	color:rgb(255,255,255);
	margin:0 20px 0 0;
}

div#topMenu ul#mainMenu li a:hover
{
	text-decoration:none;
	color: rgb(241, 230, 193);
}

div#topMenu div#helpLink
{
	float:right;
	padding:6px 10px 4px 10px;
	margin:0;
	
	font-size:90%;
}

/**	=========================================== **
	
	Page Content

 **	=========================================== **/

div#contentFrame
{
	border-right:1px solid rgb(139, 146,152);
	border-bottom:1px solid rgb(139, 146,152);
	border-left:1px solid rgb(230,230,230);
	margin:0;
	padding:1em 1em;
}

div#contentFrame div.singleColumn
{
	width:700px;
	margin:20px auto;
}

div#contentFrame div.twoColumn
{
	font-size:90%;
}

div#contentFrame div.twoColumn h3
{
	font-weight:100;
	font-size:130%;
}

div#contentFrame div.twoColumn .leftColumn
{
	width:45%;
	float:left;
}

div#contentFrame div.twoColumn .rightColumn
{
	width:45%;
	float:right;
}

div#contentFrame div.twoColumn .roundedBackground
{
	background:rgb(255,255,255) url('../images/bk_latestnews.png') top right no-repeat;	
	width:43%;
	padding-right:2%;
}


div#contentFrame div.pageRow
{
	margin:0;
	padding:10px 0;
}

div#contentFrame div.lowestRow
{
	margin-top:20px;
	border-top:rgb(228,232,235) 8px solid;
}

div#contentFrame div.lowestRow ul
{
	margin-bottom:40px;
}

div#contentFrame div.lowestRow h2
{
	color:rgb(67,110,178);
	font-weight:100;
	font-size:130%;
	border-bottom:1px solid rgb(142,170,204);
}

div#contentFrame div.lowestRow .rightFrame h2
{
	font-size:120%;
}

div#contentFrame div.lowestRow .rightFrame h2+p.floatRight
{
	margin-top:-30px;
}


div#contentFrame div.pageRow div.rightFrame
{
	width:600px;
	margin-right:1em;
	float:right;
}

div#contentFrame div.pageRow div.rightFrame p, div#contentFrame div.pageRow div.rightFrame ul, div#contentFrame div.pageRow div.rightFrame ol
{
	font-size:90%;
}

div#contentFrame div.pageRow div.rightFrame ul, div#contentFrame div.pageRow div.rightFrame ol
{
	list-style-image: url('../images/icons/jisc-bullet.png');
	margin:0;
	padding:10px 20px;
}

div#contentFrame div.pageRow div.rightFrame ul li, div#contentFrame div.pageRow div.rightFrame ol li
{
	margin:10px 5px;	
}


div#contentFrame h1+h2
{
	font-weight:100;
	color:rgb(241,115,31);
	font-size:135%;
	padding:0;
}



div#contentFrame div.pageRow div.leftFrame
{
	width:200px;
	float:left;
	font-size:90%;
}

div#contentFrame div.pageRow div.leftFrame ul.linkList
{
	margin:0;
	padding:0;
}

div#contentFrame div.pageRow div.leftFrame ul.linkList li
{
	list-style:none;
	padding:5px 0;
	font-size:90%;
}

div#contentFrame div.pageRow div.leftFrame ul.linkList li a
{
	color:rgb(67,110,178);
}

/**	=========================================== **
	
	Forms

 **	=========================================== **/

form#loginSmall p
{
	margin:10px 0;
	font-size:80%;
}

form#loginSmall input
{
	border:1px solid rgb(241,115,31);
	background:rgb(255,255,255);
	padding:5px;
	font-family:Arial, sans-serif;
	font-size:130%;
}

form#loginSmall .inputBtn
{
	background:url('../images/btn_black.jpg') bottom center repeat-x;
	color:rgb(255,255,255);
}

form#loginSmall .inputBtn:hover
{
	color:yellow;
}

form#loginSmall .inputText:hover
{

}

form#loginSmall .inputText:focus
{
	border:1px solid rgb(255,125,51);
	background:rgb(240,240,240);
}

form#loginSmall .inputText
{
	width:168px;
}


.error
{
	color:red;
}

form .error
{
	color: red;
	font-size: 80%;
}

form p.error
{
	padding: 0.2em 0;
}

form#register
{
	border-bottom:rgb(66,109,178) 1px solid;
}

form#register span.required
{
	display:block;
	height:0px;
	width:0px;
	overflow:hidden;
}

form#register fieldset
{
	border:none;
	padding:20px 0;
	margin:0;
	position:relative;
}

form#register fieldset legend
{
	text-indent:-999em;
	display: block;
	height:0px;
	width:0px;
	padding:0;
	margin:-20px;	
}

form#register fieldset.first
{
	background:rgb(215,226,245);
	color:rgb(66,109,178);
}

form#register fieldset.second
{
	background:rgb(230,237,250);
	color:rgb(66,109,178);
}

form#register fieldset.third
{
	background:rgb(237,242,252);
	color:rgb(66,109,178);
}

form#register fieldset.final
{
	background:rgb(247,249,252);
	margin:0 0 20px 0;
}


form#register fieldset input.textbox, form#register fieldset input.password
{
	margin:10px 0;
	font-family:Verdana, Arial, sans-serif;
	font-size:130%;
	border:1px dotted rgb(66,109,178);
	padding:5px;
}

form#register fieldset input.textbox:focus, form#register fieldset input.password:focus
{
	border:2px solid rgb(66,109,178);
	background:rgb(255,249,189);
}

form#register fieldset input.btn
{
	border:1px dotted rgb(67,110,178);
	background:rgb(117,168,251) url('../images/btn_blue.jpg') bottom center repeat-x;
	color:rgb(255,255,255);
	padding:10px;
	font-family:Arial, sans-serif;
	text-decoration:none;
	font-size:160%;
	cursor:pointer;
}


form#register fieldset input.btn:hover
{
	color:rgb(50,64,88);
	border:1px solid rgb(50,64,88);
}


form#register fieldset div.twoColumn div.leftColumn
{
	width:40%;
	padding-left:20%;
}

form#register fieldset span.wedge
{
	display:block;
	position:absolute;
	top:-20px;
	left:20px;
	width:100px;
	height:50px;
	margin:0;
	padding:0;
}

form#register fieldset.first span.wedge
{
	background:url('../images/glyphs/part1.png') top center no-repeat;
}

form#register fieldset.second span.wedge
{
	background:url('../images/glyphs/part2.png') top center no-repeat;
}

form#register fieldset.third span.wedge
{
	background:url('../images/glyphs/part3.png') top center no-repeat;
}

form#register fieldset.final span.wedge
{
	background:url('../images/glyphs/part4.png') top center no-repeat;
}

form#register h2
{
	font-weight:100;
	color:rgb(66,109,178);
	margin:20px 0;
	width:100%;
	border-bottom:rgb(66,109,178) 1px solid;
}

form#register fieldset div.twoColumn div.rightColumn h3
{
	margin:20px 0 0 0;
	font-size:160%;
}

form#register fieldset div.twoColumn div.wide
{
	padding-left:20%;
	padding-right:5%;	
}

form#register fieldset div.twoColumn div.leftColumn p
{
	margin:20px 0 20px 0;
	font-size:110%;
}

form#register fieldset div.twoColumn div.rightColumn
{
	width:30%;
	padding-right:5%;
	font-size:80%;
	margin:0 0 20px 0;
}

/**	=========================================== **
	
	Latest News Styles

 **	=========================================== **/

div.latestNews
{
	background:rgb(255,255,255) url('../images/bk_latestnews.png') top right no-repeat;
	width:600px;
	margin:20px 0;
	padding:20px 0;
	border-bottom:1px solid rgb(240,240,240);
}

div.latestNews div.calendarDate
{
	min-width:40px;
	text-transform:uppercase;
	color:rgb(255,255,255);
	font-weight:bold;
	margin:10px 20px 0 0;
	font-family:Arial, sans-serif;
}

div.latestNews div.calendarDate .month
{
	font-size:80%;
	background:url('../images/calendar/back_red.jpg') top repeat-x rgb(232,62,62);
	padding:2px;
}

div.latestNews div.calendarDate .dayDate
{
	background:url('../images/calendar/back_black.jpg') top repeat-x rgb(128,130,133);
	font-size:140%;
	text-align:center;
	padding:3px 0;
}

div.latestNews div.story
{
	width:500px;
	padding:0 10px;
}

div.latestNews div.story h3, div.latestNews div.story h3 a
{
	font-weight:100;
	color:rgb(185,9,55);
	text-decoration:none;
}

div.latestNews div.story h3 a:hover
{
	text-decoration:underline;
}

div.latestNews div.story p, div.latestNews div.story ul
{
	line-height:1.2em;
	font-size:90%;
}


/**	=========================================== **
	
	Footer Styles

 **	=========================================== **/


div#footer
{
	font-size:70%;
	background:rgb(250,250,250);
	width:880px;
	margin:40px auto;
	padding:10px;
	border-bottom:1px solid rgb(230,230,230);
	border-top:1px solid rgb(230,230,230);
}

div#footer a.polarisDigital
{
	display:block;
	height:0;
	overflow:hidden;
	width:115px;
	padding:24px 0 0 0;
	background:url('../images/icons/polarisdigital.png');
}

div#footer a.jiscCollections
{
	display:block;
	height:0;
	overflow:hidden;
	width:150px;
	padding:50px 0 0 0;
	background:url('../images/icons/jisccollections.png');
}