@charset "UTF-8";
/* CSS Document */

/* Cancer Research Wales CSS - www.octopus-creative.co.uk */


* {
	margin: 0;
	padding: 0;
}

body {
	font-family: "Lucida Grande", Lucida, Arial, sans-serif;
	font-size: 13px;
	line-height: 1.3em;
	color: #333;
	background-color: #fff;
}




/* Global positions */

#signin {
	font-size: 90%;
	width: 100% ;
	height: 20px;
	padding-top: 5px;
	background: #dedcdd; 
}

#nav {
	font-size: 90%;
	width: 100% ;
	height: 25px;
	text-align: center; 
	padding-top: 10px;
	border-bottom: 1px solid #ccc;
	background: #e2e2e2 url(../images/bg_nav.jpg) bottom left repeat-x; 
}

#container {
	display: block; 
	width: 780px; 
	background: #fff url(http://www.crw.org.uk/images/bg_content_top.jpg) top left no-repeat; 
	text-align: left; 
	margin: 0 auto; 
	padding: 10px 0;
}

#head {
	width: 780px;
	margin: 20px auto 0 auto; 
	color: #fefefe;
	background: #fff url(../images/bg_head_repeat.gif) top left repeat-y; 
}

#columnleft {
	width: 500px;
	float: left;
}

#columnright {
	width: 269px;
	float: right;
}

#footer {
	font-size: 90%;
	width: 780px; 
	margin: 0 auto; 
	padding-top: 10px;
	background: #fff url(../images/bg_footer.gif) top left repeat-x; 
}

.clearer {
	display: block;
	clear: both;
	font-size: 1px;
}




/* Global styles */

p {
	margin: 0;
	padding: 0 0 0.2em 0;
}

p.signin {
	font-family: "Lucida Grande", Lucida, Arial, sans-serif;
	font-size: small;
	line-height: 1.3em;
	color: #333;
}

p.signin a:link, p.signin a:visited {
	color: #333;
	text-decoration: underline;
}

p.signin a:hover {
	color: #666;
	text-decoration: none;
}

h1, h2, h3, h4 {
	font-weight: 200;
	padding-bottom: 0.2em;
	line-height: 1.0em;
}

h1 {
	font-size: 140%;
	font-weight: 700;
}

h2 {
	font-size: 120%;
}

h3, h4 {
	font-size: 110%;
}

em {
	font-style: normal;
	font-weight: bold;
	color: #333;
}




/* Sign in styles */

#signin a:link, #signin a:visited {
	color: #000;
}

#signin a:hover {
	color: #333;
}

#signin em {
	font-weight: 700;
	font-style: normal;
}

#signin a.login {
	display: block;
	text-align: center;
	color: #fff;
	width: 50px;
	height: 18px;
	padding: 1px 2px 2px 2px;
	background: #343434; 
	border: 1px solid #000;
	text-decoration: none;
}




/* Nav styles */

#nav ul {
	list-style: none;
	margin: 0 auto;
	font-weight: 700;
}

#nav ul li {
	float: left;
}

#nav ul li a:link, #nav ul li a:visited {
	display: block;
	color: #666;
	background: #f1f1f1; 
	padding: 0.3em 1em;
	text-decoration: none;
	border-top: 1px solid #c6c6c6;
	border-right: 1px solid #c6c6c6;
	border-bottom: 1px solid #c6c6c6;
}

#nav ul li a:hover {
	color: #fefefe;
	background-color: #ccc;
}

#nav ul li a.over:link, #nav ul li a.over:visited {
	display: block;
	color: #002e62;
	background-color: #fff;
	padding: 0.3em 1em;
	text-decoration: none;
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #fff;
}




/* Head styles - left */

#head .headleft {
	position: relative;
	width: 500px;
	height: 220px;
	float: left;
	background: url(../images/bg_head_left.gif) top right no-repeat;
}

#logo a:link, #logo a:visited {
	position: absolute;
	bottom: 0;
	right: 15px;
	text-indent: -1000em;
	background: url(../images/button_donate_off.gif) no-repeat top left;
	width: 120px;
	height: 120px;
	display: block;
	overflow: hidden; /* For nested divs in Safari */
}

/*  IE 5 hack \*/
#logo a {
	overflow: hidden;
}
/* end hack */ 
	
#logo a:hover {
	background: url(../images/button_donate_on.gif) no-repeat top left;
}

#head .headleftsub {
	position: relative;
	width: 500px;
	height: 120px;
	float: left;
	background: url(../images/bg_head_leftsub.gif) top right no-repeat;
}





/* Head styles - right */

#head .headright {
	width: 249px;
	float: right;
	background: url(../images/bg_head_right.gif) top right no-repeat;
	padding: 30px 10px 10px 10px;
}

#head .headright .field {
	border: 1px solid #069;
	width: 200px;
}

#head .headright .button {
	padding: 3px;
	border: 1px solid #999;
	background: #CCC;
}

#head .headrightsub {
	width: 269px;
	float: right;
	background: url(../images/bg_head_right.gif) top right no-repeat;
}

#head .headrightsub h1 {
	padding: 100px 0 0 10px;
}

#head .headclearer {
	width: 780px;
	height: 20px;
	background: #fff url(../images/bg_head_clearer.gif) top left no-repeat;
	display: block;
	clear: both;
	font-size: 1px;
}




/* Column left styles */

#columnleft p, #columnleft h1, #columnleft h2 {
	padding-left: 10px;
}

#columnleft a:link, #columnleft a:visited {
	color: #39c;
	font-weight: 700;
}

#columnleft a:hover {
	color: #002e62;
	text-decoration: none;
}

#columnleft h1 {
	font-size: 115%; 
	color: #002e62;
	padding-bottom: 0.8em;
}

#columnleft h2 {
	font-size: 115%; 
	color: #002e62;
	padding-bottom: 0.8em;
}

#columnleft p.first {
	font-size: 140%; 
	color: #a7d860;
	background: url(../images/bg_arrow_green.gif) top left no-repeat; 
	margin-left: 10px;
	padding: 0 0 10px 15px;
}

#columnleft h1.intro {
	font-size: 145%; 
	color: #97cd50;
}

#columnleft img.right {
	float: right; 
}

#columnleft img.weatherlottery {
	float: right; 
	padding: 0 0 10px 20px;
}

#columnleft img.left {
	padding-left: -10px;
}

#columnleft .shop {
	padding-bottom: 20px;
}

#columnleft .shop img.left {
	float: left;
	padding: 0 10px 10px 0;
}





/* Column left styles - Donating */

#columnleft .donating {
	width: 498px; 
	margin: 0 0 11px 0;
	padding: 10px 0;
	border: 1px solid #ccc;
	background: #fff url(../images/happy_kids.jpg) bottom right no-repeat; 
}

#columnleft .donating p, #columnleft .donating h1 {
	padding-right: 180px;
}

#columnleft .donating h1.first {
	padding-right: 0;
}




/* Column left styles - Gallery */

#float {
	float: left;
	padding: 5px;
	margin: 3px;
	border: 1px solid #CCC;
	width: 148px;
	height: 103px;
	text-align: center;
}

#float p {
	text-align: left;
}



/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 

/* Column left styles - Promotion */

#columnleft .promotion {
	width: 488px; 
	height: 186px;
	border: 1px solid #ccc;
	margin: 11px 0;
	padding: 10px 10px 10px 0;
	background: #df8bbb url(../images/bg_capitol.gif) top right no-repeat; 
}

#columnleft .promotion p {
	color: #521958;
	padding-right: 250px;
}

#columnleft .promotion a:link, #columnleft .promotion a:visited {
	color: #fff;
}

#columnleft .promotion a:hover {
	color: #002e62;
}

#columnleft .promotion h1 {
	font-size: 140%; 
	background: none; 
	color: #fff;
	padding-right: 250px;
}

#columnleft .promotion h2 {
	font-size: 105%; 
	color: #521958;
	font-weight: 700;
}




/* Column left styles - Promotion - James Bond */

#columnleft .jamesbond {
	position: relative;
	width: 478px; 
	height: 166px;
	border: 1px solid #ccc;
	padding: 10px;
	background: #000 url(http://www.crw.org.uk/promo_jamesbond/jamesbond.jpg) top left no-repeat; 
}

#columnleft .jamesbond a:link, #columnleft .jamesbond a:visited {
	position: absolute;
	top: 135px;
	left: 65px;
	display: block;
	width: 133px;
	height: 16px;
	color: #fff;
	padding-left: 5px;
	background: url(http://www.crw.org.uk/promo_jamesbond/arrow.gif) top left no-repeat; 
	text-decoration: none;
}

#columnleft .jamesbond a:hover {
	color: #000;
}




/* Column left styles - Promotion - Australia */

#columnleft .australia {
	position: relative;
	width: 478px; 
	height: 105px;
	border: 1px solid #ccc;
	padding: 180px 10px 10px 10px;
	background: #000 url(http://www.crw.org.uk/promo_australia/bg_australia.jpg) top left no-repeat; 
}

#columnleft .australia p {
	color: #daae14;
}

#columnleft .australia h1 {
	color: #fcf2bb;
	font-size: 140%;
}

#columnleft .australia em {
	color: #fcf2bb;
	font-weight: 700;
}

#columnleft .australia a:link, #columnleft .australia a:visited {
	color: #fff;
}

#columnleft .australia a:hover {
	color: #daae14;
	text-decoration: none;
}




/* Column left styles - Promotion - St.David's */

#columnleft .stdavid {
	position: relative;
	width: 478px; 
	height: 195px;
	border: 1px solid #ccc;
	padding: 10px;
	color: #fff;
	background: #000 url(http://www.crw.org.uk/promo_stdavid/stdavid_festival.jpg) top right no-repeat; 
}

#columnleft .stdavid p {
	padding-right: 250px; 
}

#columnleft .stdavid h1 {
	font-size: 128%;
	color: #f00; 
	padding-top: 15px;
}

#columnleft .stdavid a:link, #columnleft .stdavid a:visited {
	color: #fff;
}

#columnleft .stdavid a:hover {
	color: #333;
	text-decoration: none;
}




/* Column left styles - Promotion - Fishing */

#columnleft .fishing {
	position: relative;
	width: 478px; 
	height: 195px;
	border: 1px solid #ccc;
	padding: 10px;
	color: #fff;
	background: #aca8aa url(../promo_fishing/fishing_competition.jpg) top right no-repeat; 
}

#columnleft .fishing p {
	padding-right: 180px; 
}

#columnleft .fishing h1 {
	font-size: 128%;
	color: #fff; 
	padding-top: 15px;
	padding-right: 110px;
}

#columnleft .fishing a:link, #columnleft .fishing a:visited {
	color: #fff;
}

#columnleft .fishing a:hover {
	color: #333;
	text-decoration: none;
}




/* Column left styles - Promotion - Pink-a-blue */

#columnleft .pinkblue {
	position: relative;
	width: 478px; 
	height: auto;
	border: 1px solid #ccc;
	padding: 5px 5px 15px 5px;
	color: #002e60;
	background: #f3b9d4 url(../promo_pinkblue/pink-a-blue-balloons.jpg) bottom right no-repeat; 
}

#columnleft .pinkblue p {
	padding-left: 5px;
	padding-right: 265px; 
}

#columnleft .pinkblue h1 {
	font-size: 128%;
	padding: 5px 230px 8px 5px;
}

#columnleft .pinkblue a:link, #columnleft .pinkblue a:visited {
	color: #002e60;
}

#columnleft .pinkblue a:hover {
	color: #fff;
	text-decoration: none;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 




/* Column left styles - Supporters */

#columnleft .supporters {
	position: relative;
	width: 488px; 
	border: 1px solid #ccc;
	margin: 11px 0;
	padding: 10px 10px 10px 0;
}

#columnleft .supporters h1 {
	font-size: 140%; 
	background: url(../images/bg_arrow_green.gif) top left no-repeat; 
	color: #a7d860;
	margin-left: 10px;
	padding-left: 15px;
	padding-bottom: 0.6em;
}

#columnleft .supporters h2 {
	font-size: 105%; 
	color: #002e62;
	font-weight: 700;
}

#columnleft .supporters img {
	float: right;
	padding: 0 0 10px 10px;
}




/* Column left styles - Buy at */

#columnleft .buyat {
	float: left;
	width: 233px; 
	height: 180px;
	border: 1px solid #ccc;
	padding: 5px;
	background: url(../images/bg_buyat.jpg) bottom left no-repeat; 
}

#columnleft .buyat p, #columnleft .buyat h1 {
	padding-left: 90px;
}




/* Column left styles - Just giving */

#columnleft .justgiving {
	float: right;
	width: 233px; 
	height: 180px;
	border: 1px solid #ccc;
	padding: 5px;
}

#columnleft .justgiving img {
	padding: 0 0 10px 6px;
}

#columnleft .links {
	width: 488px; 
	margin: 11px 0;
	padding: 5px;
	background: #fff url(../images/bg_footer.gif) top left repeat-x; 
}

#columnleft .links img {
	padding-right: 10px;
}




/* Column left styles - No Cards */

#columnleft .cards {
	position: relative;
	width: 498px; 
	height: 126px;
	border: 1px solid #ccc;
	margin: 11px 0;
	padding: 0;
}

#columnleft .cards img {
	border: 0;
}




/* Column left styles - Event */

#columnleft .event {
	width: 488px; 
	margin: 11px 0;
	padding: 0 0 20px 0;
	background: #fff url(../images/bg_footer.gif) bottom left repeat-x; 
}

#columnleft .eventblank {
	width: 488px; 
	margin: 11px 0;
	padding: 0 0 20px 0;
	background: none; 
}

#columnleft .event h2, #columnleft .eventlast h2 {
	color: #0096db;
}

#columnleft .event img.left {
	float: left; 
	padding: 0 10px 10px 0;
}

#columnleft .eventlast {
	width: 488px; 
	margin: 11px 0 0 0;
	padding: 0 0 10px 0;
	background: none; 
}

#columnleft .field, #columnleft .eventlast .field {
	border: 1px solid #ccc;
	width: 249px;
	height: 18px;
	margin: 0 0 10px 0;
}

#columnleft .button, #columnleft .eventlast .button {
	padding: 3px;
	border: 1px solid #999;
	background: #CCC;
}




/* Column left styles - Volunteer */

#columnleft .volunteer {
	width: 498px; 
	margin: 0 0 11px 0;
	padding: 10px 0 0 0;
	border: 1px solid #ccc;
	background: #fff url(../images/volunteer_01.jpg) bottom right no-repeat; 
}

#columnleft .volunteer p, #columnleft .volunteer h1 {
	padding-right: 180px;
}




/* Column right styles */

#columnright h1 {
	font-size: 120%;
	background: url(../images/bg_arrow_green.gif) top left no-repeat; 
	padding: 0 0 10px 20px;
	color: #a7d860;
}

#columnright img {
	padding-bottom: 10px;
}




/* Column right styles - events */

.detail {
	position: relative;
}

#more a:link, #more a:visited {
	text-indent: -1000em;
	background: url(../images/button_more_detail_off.gif) no-repeat top left;
	width: 80px;
	height: 80px;
	margin-left: 10px;
	display: block;
	overflow: hidden; /* For nested divs in Safari */
}

/*  IE 5 hack \*/
#more a {
	overflow: hidden;
}
/* end hack */ 
	
#more a:hover {
	background: url(../images/button_more_detail_on.gif) no-repeat top left;
}




/* Column right styles - updates */

#columnright .updates {
	width: 247px;
	border: 1px solid #ccc;
	color: #fff;
	background-color: #a7d860;
	margin-bottom: 10px;
	padding: 10px;
}

#columnright .updates p {
	font-weight: 700;
}

#columnright .updates .field {
	border: 1px solid #73bb2b;
	width: 200px;
}

#columnright .updates .button {
	padding: 3px;
	border: 1px solid #999;
	background: #CCC;
}




/* Column right styles - funding */

#columnright .funding {
	width: 267px;
	border: 1px solid #ccc;
	background: #a7d860 url(../images/bg_funding.gif) bottom right no-repeat;
	margin-bottom: 10px;
}

#columnright .funding p {
	padding: 0 10px 10px 10px;
	color: #fefefe;
}

#columnright .funding h1 {
	padding: 10px 10px 4px 10px;
	color: #fefefe;
	background: none;
}

#columnright .funding a:link, #columnright .funding a:visited {
	color: #fefefe;
	background: url(../images/bg_arrow_white.gif) center left no-repeat;
	padding-left: 10px;
	font-weight: 700;
}

#columnright .funding a:hover {
	color: #67b532;
	text-decoration: none;
}




/* Column right styles - smallchange */

#columnright .smallchange {
	width: 262px;
	height: 108px;
	border: 1px solid #ccc;
	background: #fff url(../promo_smallchange/bg-smallchange.jpg) bottom right no-repeat;
	margin-bottom: 10px;
	padding: 10px 0 5px 5px
}

#columnright .smallchange a:link, #columnright .smallchange a:visited {
	color: #38a1f4;
}

#columnright .smallchange a:hover {
	color: #1f156b;
}


/* Column right styles - video */

#columnright .video {
	width: 267px;
	border: 1px solid #ccc;
	margin-bottom: 10px;
}




/* Column right styles - just giving */

#columnright .justgiving {
	width: 267px;
	border: 1px solid #ccc;
	background: #dfdfdf;
	margin-bottom: 10px;
}

#columnright .justgiving p {
	padding: 0 10px 10px 10px;
	color: #fefefe;
}

#columnright .justgiving h1 {
	padding: 10px 10px 4px 10px;
	color: #002e62;
	background: none;
}

#columnright .justgiving a:link, #columnright .justgiving a:visited {
	color: #666;
	background: url(../images/bg_arrow_grey.gif) center left no-repeat;
	padding-left: 10px;
	font-weight: 700;
}

#columnright .justgiving a:hover {
	color: #999;
	text-decoration: none;
}

#columnright .justgiving img.logo {
	padding: 5px 0 0 5px;
}




/* Column right styles - volunteer */

#columnright .volunteer {
	width: 267px;
	border: 1px solid #ccc;
	background: #1199d2 url(../images/bg_volunteer.gif) center right no-repeat;
	margin-bottom: 10px;
}

#columnright .volunteer p {
	padding: 0 10px 10px 10px;
	color: #fefefe;
}

#columnright .volunteer h1 {
	padding: 10px 10px 4px 10px;
	color: #fefefe;
	background: none;
}

#columnright .volunteer a:link, #columnright .volunteer a:visited {
	color: #fefefe;
	background: url(../images/bg_arrow_white.gif) center left no-repeat;
	padding-left: 10px;
	font-weight: 700;
}

#columnright .volunteer a:hover {
	color: #015cad;
	text-decoration: none;
}




/* Column right styles - projects */

#columnright .projects {
	width: 249px;
	padding: 10px;
	margin-bottom: 10px;
}

#columnright .projects .detail {
	padding: 10px 0 20px 0;
	background: #fff url(../images/bg_footer.gif) bottom left repeat-x; 
}

#columnright .projects h1 {
	color: #a7d860;
	padding-bottom: 0;
}

#columnright .projects h2 {
	color: #002147;
}

#columnright .projects h3 {
	color: #0097d6;
}

#columnright .projects a:link, #columnright .projects a:visited {
	display: block;
	float: right;
	width: 80px;
	height: 80px;
	background: #fff url(../images/button_more_detail_off.gif) top left no-repeat; 
	padding: 0 0 0 10px;
}

#columnright .projects a:hover {
	background: #fff url(../images/button_more_detail_on.gif) top left no-repeat; 
}




/* Column right styles - generic */

#columnright .generic {
	width: 247px;
	border: 1px solid #ccc;
	margin-bottom: 10px;
	padding: 10px;
}

#columnright .generic p {
	color: #666;
}

#columnright .generic h1 {
	color: #002e62;
	background: none;
	margin: 0;
	padding: 0 0 4px 0;
}

#columnright .generic a:link, #columnright .generic a:visited {
	color: #39c;
	background: url(../images/bg_arrow_white.gif) center left no-repeat;
	font-weight: 700;
}

#columnright .generic a:hover {
	color: #002e62;
	text-decoration: none;
}

#columnright .generic img.picright {
	float: right;
	padding: 5px 0 0 10px;
}



/* Column right styles - patron */

#columnright .patron h1 {
	margin-left: 10px;
	padding: 0 10px 0 20px;
}




/* Footer styles */

#footer .list {
	width: 100%;
	clear: both;
}

#footer p {
	color: #666;
}

#footer a:link, #footer a:visited {
	color: #333;
	text-decoration: underline;
}

#footer a:hover {
	color: #c7c7c6;
	text-decoration: none;
}

#footer ul {
	list-style: none;
}

#footer ul li {
	float: left;
	border-right: 1px solid #ccc;
}

#footer ul li a:link, #footer ul li a:visited {
	display: block;
	width: auto;
	color: #39c;
	padding: 0 0.6em;
	text-decoration: none;
}

#footer ul li a:hover {
	color: #002e62;
	text-decoration: underline;
}

#footer ul li a.first:link {
	padding: 0 0.6em 0 0;
}