/* CSS Document */

/*////////////////////////////////////
 CSIP CSS VERSION 1.0
 AUTHOR: RIK ABEL (RIK@HEADSHIFT.COM)
 LAST UPDATED: 08/04/2008 BY ROWAN PURDY rowan.purdy@csip.org.uk
 
	CONTENTS:
	
	0. GLOBAL ELEMENTS
	1. LINKS
	2. LAYOUT
	3. NAVIGATION
	4. TYPOGRAPHY
	5. LISTS
	6. FORMS
	7. IMAGES
	8. MISCELLANEOUS
	9. PHOTOSTRIP
	10. CALENDAR
	11. BLOG STYLING
	12. GOOGLE co-op search results
	
	
	/////////////////////////////
	
	COLOURS:
	
	about-csip (formerly our-initiatives, About Us): #58782F ( 80%: #799357 | 60%: #9BAE81 | 40%: #BCC9AB | 20%: #DFE4D6)
	regional development centres (formerly our-regions, We Work): #B6D27B (80%: C5DB95 | 60%: D3E4AD | 40%: E2EDCA | 20%: F0F6E4)
	national-programmes (formerly our-initiatives, We Do): #98B8C7 (80%: ADC5D6 | 60%: C3D6E2 | 40%: D6E2EB | 20%: EBF2F6)
	news-and-events News And Events: #BF013F (80%: CD3363 | 60%: DA678B | 40%: E699B1 | 20%: F2CCD8)
	Resources: #481165 (80%: 674081 | 60%: 8F70A1 | 40%: B49FC1 | 20%: DACFE0)
	supporting-delivery Delivery: #E1B457 (80%: E8C375 | 60%: EFD299 | 40%: F4E1BA | 20%: FAF0DC)
	
	
////////////////////////////////////*/


/*//////////////////// 
  =GLOBAL ELEMENTS
////////////////////*/

/* global whitespace reset - saves a lot of time and bother with box-model hacks by setting margin and padding to 0 for EVERYTHING. See explanation here: http://leftjustified.net/journal/2004/10/19/global-ws-reset/ */

* { 
	margin: 0;
	padding: 0;
	}
	
body {
	text-align: center; /* centres page in IE */
	font: 80%/135% 	Arial, Helvetica, sans-serif; /* all font-sizes are set relative to this base font-size */
	color: #000;
	margin-bottom: 25px;
	background: #fff url(/img/rip/swoosh.jpg) 49% 0 no-repeat;
	}
	
.none,
.hide {
	display:none;
	}
	


/*//////////////////// 
  =LINKS
////////////////////*/

#content a:link,
#content a:visited,
#fullwidthloggedin a:link,
#fullwidthloggedin a:visited {
	color: #003399;
	text-decoration: underline;
	}
	
#content a:hover,
#content a:visited:hover {
	color: #ff0000;
	background-color: #ffc;
	}
	
#footer a:link,
#footer a:visited {
	color: #003399;
	text-decoration: none;
	}
	
#footer a:hover {
	text-decoration: underline;
	}
	
a.subon {
	background-color: #fff;
	}
	
#footer a span.rss, #rsshelp a span.rss {

	width: 30px;
	border: 1px solid #fc9;
	border-color: #FC9 #630 #330 #F96;
	background-color: #f60;
	padding: 1px 3px;
	color: #fff;
	font-weight: bold;
	font-size: 80%;
	margin-right: 3px;
	}
	
	
/*//////////////////// 
  =LAYOUT
////////////////////*/
	
#container {
	text-align: left; /* override centering of text above */
	margin: 0 auto; /* center content in page */
	width: 770px;
	background: transparent url(/img/rip/smallswoosh.jpg) bottom left no-repeat;
	position: relative;
	border-bottom: 1px solid #dadada;
	padding-bottom: 130px;
	}
	
#titlebar { /* where the logos go */
	text-align: left;
	width: 770px;
	height: 80px;
	overflow: auto;
	}
	
#titlebar img#logo {
	float: right;
	margin-top: 17px; /* positions logo so it matches background swoosh */
	border: 0;
	}
	
#fullwidthloggedin {
	float: left;
	width: 360px;
	margin-top: 20px;
	clear: left;
	color: #ccc;
	}
	
#photostrip {
	width: 770px;
	height: 125px;
	margin-bottom: 10px;
	text-align: left;
	}
	

	
#searchbox {
	width: 165px;
	height: 125px;
	float: right;
	background: transparent url(/img/rip/searchbottom.gif) bottom left no-repeat;
	}
	
#nav {
	float: left;
	width: 145px;
	color: #333;
	}
	
#content {
	float: left;
	width: 420px;
	margin-left: 20px;
	margin-bottom: 20px;
	}

#contentwide {
	float: left;
	width: 595px;
	margin-left: 30px;
	margin-bottom: 20px;
	}
	
#rightside {
	float: right;
	display: block;
	width: 165px;
	}

.sidebox,
.links {
	width: 165px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	background: #DCDCDC url(/img/rip/165_roundbottom.png) bottom left no-repeat;
	}
	
* html .sidebox,
* html .links {
	background-image: url(/img/rip/165_roundbottom.gif);
	}
	
.sidepad
{ /* adds side padding to boxes without having to worry about IE getting it wrong */
	padding: 0 10px;
	}
	
#content .sidepad,
#content .inner {
	padding-bottom: 10px;
	}
	

#footer {
	display: block;
	padding-bottom: 5px;
	padding-top: 5px;
	float: none;
	clear: both;
	width: 770px;
	text-align: center;
	color: #999;
	font-size: 0.9em;
	margin-top: 10px;
	}
	
	
#doh {
	width: 770px;
	float: none;
	clear: both;
	display: block;
	margin-top: 10px;
	font-size: 0.9em;
	line-height: 1.2em;
	color: #999;
	text-align: left;
	
}


#doh img {
	margin-left: 3px;
	float: right;
	}
	
	
/* special boxes and columns */


.leftinner { /* creates a half-width left hand column */
	float: left;
	width: 200px;
	}
	
.rightinner { /* creates a half-width right hand column */
	float: right;
	width: 200px;
	}
	
.smallborderbox,
.smalltintbox,
.bigborderbox,
.bigtintbox,
.newsflash  {
	padding-bottom: 10px;
	margin-bottom: 10px;
	overflow: auto;
	}

.smallborderbox .sidepad,
.smalltintbox .sidepad,
.bigborderbox .sidepad,
.bigtintbox .sidepad,
.newsflash .sidepad,
.newsflash .inner {
	overflow: auto;
	} 

	
.smallborderbox h4,
.smalltintbox  h4 {
	font-size: 1.2em;
	color: #fff;
	padding: 5px 10px;
	background: #999 url(/img/rip/200_roundtop.png) 0 0 no-repeat;
	margin-bottom: 0;
}

.bigborderbox h4,
.bigtintbox  h4,
.newsflash h4 {
	font-size: 1.2em;
	color: #fff;
	padding: 5px 10px;
	background: #999 url(/img/rip/420_roundtop.png) 0 0 no-repeat;
	margin-bottom: 0;
}


.smallborderbox .sidepad,
.bigborderbox .sidepad,
.newsflash .sidepad,
.newsflash .inner {
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	padding-top: 5px;
	}
	
.smallborderbox .sidepad,
.bigborderbox .sidepad,
.newsflash .sidepad,
.newsflash .inner,
.bigtintbox .sidepad,
.bigtintbox .inner,
.smalltintbox .sidepad,
.smalltintbox .inner {
	padding-top: 5px;
	}

* html .smallborderbox h4,
* html .smalltintbox  h4 {
	background-image: url(/img/rip/200_roundtop.gif);
	}
	
* html .bigborderbox h4,
* html .bigtintbox  h4,
* html .newsflash h4 {
	background-image: url(/img/rip/420_roundtop.gif);
	}
	
.smallborderbox /* boxes with a border line and white background */
 {
	background: url(/img/rip/200_borderbottom_home.gif) bottom left no-repeat;
	}

.bigborderbox,
.newsflash /* boxes with a border line and white background */
 {
	background: url(/img/rip/420_borderbottom_home.gif) bottom left no-repeat;
	}
	
.smalltintbox 
 {
	background: #DCDCDC url(/img/rip/200_roundbottom.png) bottom left no-repeat;
	}
	
* html .smalltintbox {
	background-image: url(/img/rip/200_roundbottom.gif);
	}
	
.bigtintbox 
 {
	background: #DCDCDC url(/img/rip/420_roundbottom.png) bottom left no-repeat;
	}
	
* html .bigtintbox {
	background-image: url(/img/rip/420_roundbottom.gif);
	}


/*//////////////////// 
  =NAVIGATION (top level)
////////////////////*/

#nav ul {
	list-style-type: none;
	}
	
.box { /* this class applies bottom rounded corners to nav */
	width: 145px;
	background: url(/img/rip/box-bottom5.png) bottom left no-repeat;
	display: block;
	margin-bottom: 5px;
	}
	
	
* html #nav .box {
	background-image: url(/img/rip/box-bottom5.gif);
	}
	
.box2 { /* this applies top rounded corners */
	background: url(/img/rip/box-top5.png) top left no-repeat;
	display: block;
	}
	
* html .box2 {
	background-image: url(/img/rip/box-top5.gif);
	}
	
.dkgreen { /* colour classes apply background colours to the links. These can be changed of course... */
	background-color: #597730;
	}
	
.blue {
	background-color: #9EBAC8;
	}
	
.ltgreen {
	background-color: #B6D379;
	}
	
.red {
	background-color: #BF013F;
	}
	
.purple {
	background-color: #471064;
	}
	
	
.sand {
	background-color: #E5B455;
	}
	
.grey {
	background-color: #999;
	}
	


#nav ul a {
	display: block;
	color: #000;
	text-decoration: none;
	background-color: #fff; /* setting background to white obscures some of bg, creating 'tablet' effect */
	padding: 5px 4px 5px 2px;
	margin-left: 10px;
	}

#nav ul a:hover,
#nav ul a.on,
.home #nav ul li a#homelink,
.about-csippage #nav ul li a#aboutlink,
.national-programmespage #nav ul li a#whatlink,
.regional-development-centrespage #nav ul li a#howlink,
.news-and-eventspage #nav ul li a#newslink,
.resourcespage #nav ul li a#reslink,
.supporting-deliverypage #nav ul li a#suplink

 {
	background-color: transparent; /* reveals underlying background colour of list element */
	color: #fff;
	}
	
#nav ul a.on {
	font-weight: bold;
	}
	
#nav ul a.on:hover {
	text-decoration: underline;
	}
	

	
/*//////////////////// 
  =TYPOGRAPHY
////////////////////*/

#titlebar h1 {
	display: none;
	}

#content h2 {
	color: #999;
	border-bottom: 2px solid #999;
	padding-bottom: 4px; 
	font-size: 1.6em;
	line-height: 1em;
	font-weight: bold;
	}
	
	
 h3 {
	color: #666;
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 0.5em;
	}
	
h4 {
	color: #999;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 0.25em;
	}
	
.sidebox h4,
.links h4 {
	background: #999 url(/img/rip/165_roundtop.png) 0 0 no-repeat;
	color: #fff;
	font-size: 1.2em;
	padding: 5px 10px;
	border-bottom: 1px solid #fff;
	margin-bottom: 0;
	}
	
* html .sidebox h4,
* html .links h4 {
	background-image: url(/img/rip/165_roundtop.gif);
	}
	
#content p {
	margin-bottom: 0.5em;
	}
	

	
.sidepad,
.inner {
	line-height: 1.4em;
	}
	

#contentwide h2 {
	color: #999;
	border-bottom: 2px solid #999;
	padding-bottom: 4px; 
	font-size: 1.6em;
	line-height: 1em;
	font-weight: bold;
	}
	
	
 h3 {
	color: #666;
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 0.5em;
	}
	
h4 {
	color: #999;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 0.25em;
	}
	
.sidebox h4,
.links h4 {
	background: #999 url(/img/rip/165_roundtop.png) 0 0 no-repeat;
	color: #fff;
	font-size: 1.2em;
	padding: 5px 10px;
	border-bottom: 1px solid #fff;
	margin-bottom: 0;
	}
	
* html .sidebox h4,
* html .links h4 {
	background-image: url(/img/rip/165_roundtop.gif);
	}
	
#contentwide p {
	margin-bottom: 0.5em;
	}
	

	
.sidepad,
.inner {
	line-height: 1.4em;
	}
	
span.posted
 {
	color: #666;

	}
	
div.comments-head {
	color: #666;
	margin-top: 5px;
	}
	
span.posted hr {
	display: none;
	}

.crumbtrail {
	color: #666;
	font-size: 90%;
	padding: 3px 10px;
	background: #fff url(/img/rip/diagogrey.gif) 0 0 repeat;
	border-bottom: 1px solid #999;
	margin-bottom: 1em;
	}
	
#content .newsflash h4 {
	display: block;
	color: #fff;
	background: #999 url(/img/rip/420_roundtop.png) 0 0 no-repeat;
	padding: 3px 10px;
	margin-bottom: 0;
	}
	
* html #content .newsflash h4 {
	background-image: url(/img/rip/420_roundtop.gif);
	}
	
.newsflash .sidepad {
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	padding-top: 10px;
	}
	
.newsflash {
	margin-top: 10px;
    padding-bottom: 10px;
	background: #fff url(/img/rip/420_flashbottom.gif) bottom left no-repeat;
	}
	
* html .newsflash  .sidepad {
	padding-bottom: 10px;
	}
	
/*//////////////////// 
  =SUBNAV & LISTS
////////////////////*/


#content ul {
	margin-bottom: 0;
	padding-bottom: 0;
	}

	
#content  ul li {
	margin-left: 15px;
	padding: 0 0 4px 15px;
	background: transparent url(/img/rip/bullet.gif) no-repeat 0 4px;
	list-style-type: none;
	}
	
#content  ol li {
	margin-left: 10px;
	padding: 0 0 4px 10px;
	}
	
.sidebox ul,
.links ul {
list-style-type: none;
	}
	
.sidebox ul li a,
.links ul li a {
	color: #000;
	display: block;
	padding: 2px 4px 2px 12px;
	border-bottom: 2px solid #fff;
	text-decoration: none;
	}

#contentwide ul {
	margin-bottom: 0;
	padding-bottom: 0;
	}

	
#contentwide  ul li {
	margin-left: 15px;
	padding: 0 0 4px 15px;
	background: transparent url(/img/rip/bullet.gif) no-repeat 0 4px;
	list-style-type: none;
	}
	
#contentwide  ol li {
	margin-left: 10px;
	padding: 0 0 4px 10px;
	}
	
.sidebox ul,
.links ul {
list-style-type: none;
	}
	
.sidebox ul li a,
.links ul li a {
	color: #000;
	display: block;
	padding: 2px 4px 2px 12px;
	border-bottom: 2px solid #fff;
	text-decoration: none;
	}
/* 2 levels deep */
 #rightside .sidebox ul li ul li a{
	 padding-left: 22px;
	 font-size: 95%;
	}
/* 3 levels deep */
  #rightside .sidebox ul li ul li ul li a{
	 padding-left: 32px;
	 font-size: 95%;
	}
/* 4 levels deep */
  #rightside .sidebox ul li ul li ul li ul li a{
	 padding-left: 42px;
	 font-size: 95%;
	}
/* 5 levels deep */
  #rightside .sidebox ul li ul li ul li ul li ul li a{
	 padding-left: 52px;
	 font-size: 95%;
	}
	
.sidebox li a:hover,
.sidebox li a:visited:hover,
.links li a:hover,
.links li a:visited:hover {
	background-color: #999;
	color: #fff;
	}
	
.sidebox li.sub2,
.links li.sub2  {
	font-size: 88%
	}
	
.sidebox li.sub3,
.links li.sub3  {
	font-size: 85%
	}
	
.sidebox li.sub2 a,
.links li.sub2 a {
	padding-left: 18px;
	}
	
.sidebox li.sub3 a,
.links li.sub3 a {
	padding-left: 24px;
	}
	
.sidebox ol {
	margin-left: 5px;
	}
	
.sidebox ol li {
	padding: 0 0 4px 0;
	margin-left: 10px;
	line-height: 1.25em;
	} 


.sidebox a.subon,
.links a.subon {
	background-color: #fff;
	font-weight: bold;
	}
	
.sidebox a.subon:hover,
.links a.subon:hover {
	color: #fff;
	background-color: #999;
}

li.resource a {
	background:  url(/img/rip/resource_ic.gif) 3px 3px  no-repeat;
	}
	
li.news a {
	background:  url(/img/rip/news_ic.gif) 3px 3px  no-repeat;
	}
	
li.person a {
	background:  url(/img/rip/person_ic.gif) 3px 3px  no-repeat;
	
	}

	
/*//////////////////// 
  =FORMS
////////////////////*/

	
.searchit {
	width: 140px;
	border: 1px solid #ccc;
	margin-bottom: 10px;
	background: #fff url(/img/rip/inputshadow.gif) 0 0 no-repeat;
	}
	
label {
	cursor: pointer;
	cursor: hand;
	}
	
.searchit:focus {
	background-color: #ffc;
	background-image: url(/img/rip/inputshadowon.gif);
	}
	
#searchbox  label {
	display: block;
	background: transparent url(/img/rip/searchboxtop.png) 0 0 no-repeat;
	padding: 5px 10px;
	color: #fff;
	font-size: 1.3em;
	font-weight: bold;
	}
	
* html #searchbox label {
	background-image: url(/img/rip/searchboxtop.gif);
	}
	
#searchbox .sidepad {
	border-left: 1px solid #dadada;
	border-right: 1px solid #dadada;
	padding:  10px;
	background-color: #fff;
	}

/*//////////////////// 
  =IMAGES
////////////////////*/


img {
	border: 0;
	}
	
.sidepad img {
	float: left;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-top: 5px;
	}

/*//////////////////// 
  =MISCELLANEOUS
////////////////////*/

#content hr {
	display: none;
	}
	
.clearthis {
	clear: both;
	font-size: 1px;
	color: #fff;
	line-height: 1px;
	margin: 0;
	}
	
/*//////////////////// 
  =PHOTOSTRIP STUFF
////////////////////*/

ul#photos {
	list-style:none;
	}
	
ul#photos li {
	display: block;
	width: 89px;
	height: 105px;
	margin-right: 10px;
	float: left;
	font-size: 90%;
	font-weight: bold;
	line-height: 1em;
	}

ul#photos li img {
	z-index: 1;
	display: block;
	}
	
ul#photos li  a {

	color: #000;
	text-decoration: none;
	display: block;
	padding: 10px 5px 9px 5px;
	z-index: 10;
	height: 19px;
	margin-top: -7px;
	}

* html ul#photos li a {
	padding-bottom: 7px;
	}

ul#photos li  a:hover,
.about-csippage a#aboutphotolink,
.national-programmespage a#whatphotolink, 
.regional-development-centrespage a#howphotolink, 
.news-and-eventspage a#newsphotolink, 
.resourcespage a#resphotolink, 
.supporting-deliverypage a#supphotolink  {
	background: url(/img/rip/photolink.png) bottom left no-repeat;
	z-index: 10;
	color: #fff;
	border-top: 1px solid #fff;
	}
	

* html ul#photos li  a:hover,
* html .about-csippage a#aboutphotolink,
* html .about-csippage a#aboutphotolink,
* html .national-programmespage a#whatphotolink, 
* html .regional-development-centrespage a#howphotolink, 
* html .news-and-eventspage a#newsphotolink, 
* html .resourcespage a#resphotolink, 
* html .supporting-deliverypage a#supphotolink {
	background-image: url(/img/rip/photolink.gif);
	}
	
ul#photos li  a#aboutphotolink:hover,
.about-csippage a#aboutphotolink
 {
	background-color: #597730;
	}

ul#photos li  a#whatphotolink:hover,
.national-programmespage a#whatphotolink {
	background-color: #99BACE;
	}

ul#photos li a#howphotolink:hover,
.regional-development-centrespage a#howphotolink {
	background-color: #B6D379;
	}
ul#photos li  a#newsphotolink:hover,
.news-and-eventspage a#newsphotolink {
	background-color: #C0003E;
	}
	
ul#photos li  a#resphotolink:hover,
.resourcespage a#resphotolink {
	background-color: #431063;
	}
	
ul#photos li a#supphotolink:hover,
.supporting-deliverypage a#supphotolink {
	background-color: #E4B453;
	}
	
/*//////////////////////

	=calendar
	
//////////////////////*/

div#calendar {
	margin: 5px 10px;
	}
	
tr.day td {
	font-weight: bold;
	color: #fff;
	}
	

tr.heading td a {
	color: #fff;
	font-weight: bold;
	}
	
td.today {
	background-color: #fff;
	}
	
/*//////////////////// 
  =BLOG ENTRIES
////////////////////*/

ul.blogentries {
	margin-top: 10px;
	}
	
li.mtentry {
	margin-bottom: 1em;
	border-bottom: 1px solid #ccc;
	font-size: 0.9em;
		color: #666;
	}
	
li.mtentry br {
	display: none;
	}

a.blogentrytitle {
	font-size: 1.2em;
	display: block;
	margin-bottom: 5px;
	}
	
#content a.blogentrytitle {
		text-decoration: none;
		}
	
div.posted {
	margin-top: 5px;
	margin-bottom: 5px;
	color: #888;
	font-size: 90%;
	background: #fff url(/img/rip/diagogrey.gif) 0 0 repeat;
	}
	
div.kcitem {
	border-bottom: 1px solid #dedede;
	margin-top: 5px;
	margin-bottom: 5px;
	}
	
div.kcitem p.date {
	display: inline;
	}
	
p span.date,
p.date {
	font-size: 0.9em;
	color: #666;
	}
	
div.kcitem p.date {
	margin: 0;
	}
p.itemsummary {
	margin-top: 0;
	}
	
p.itemlink {
	font-size: 1.1em;
	margin-bottom: 0;
	}

/*//////////////////// 
  =12. GOOGLE co-op search results
////////////////////*/

#google_results iframe {
        width: 400px;
}