/**
stylesheet for guides pages, created by Rachel Andrew 
requires standard foe stylesheet for header and footer.
champion


*/
/* counteracting crazy font set in points */
#wrapper p, #wrapper ol, #wrapper ul, #wrapper td, #wrapper th, #wrapper blockquote, #wrapper div, #guidingtop div,
#wrapper h1, #wrapper h2, #wrapper h3, #wrapper h4 {
	font-family: Helvetica, Arial,sans-serif;
	font-size: 1em;
}

#wrapper .hilite {
	color: #74c200;
	font-weight: bold;
}

#wrapper strong.hilite {
	color: #336600;
	font-weight: bold;
}

#wrapper .error {
	color: #ff0000;
	font-weight: bold;
}

input { vertical-align:middle; }

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

#wrapper h3 {
	color: #336600;
}

/* level 3 heading with no space between in and following para */
#wrapper h3.subhead {
	margin: 0;
	padding: 0;
	color: #418200;
	font-size: 90%;
}

#wrapper #content h3.subhead + p {
	margin-top: 0;
	padding-top: 0;
}

/* level 3 used as a caption for other elements */
#wrapper h3.caption {
	background-image: url(/girlguidinguk/images/content2-rule.png);
	background-repeat: no-repeat;
	background-position: bottom left;
	width: 471px;
	font-size: 110%;
	color: #336600;
	padding: 0 0 10px 0;
}

/* wrapper for my cols */
#wrapper {
	width:644px; 
	margin-right:auto; 
	margin-left:auto; 
	margin-top:10px;  
	text-align:left;  
	padding: 0;
	
}

#guidingtop {
	width:647px; 
	margin-right:auto; 
	margin-left:auto; 
	margin-top:10px; 
	text-align:left;  
	position: relative;
}

#guidingtop .inner {
	background-image: url(/girlguidinguk/images/photo1.jpg);
	background-repeat: no-repeat;
	height: 200px;
}

#guidingtop .photo3 {
	background-image: url(/girlguidinguk/images/photo3.jpg);
}

#guidingtop .photo2 {
	background-image: url(/girlguidinguk/images/photo2.jpg);
}

#guidingtop .news {
	background-image: url(/girlguidinguk/images/photo-news.jpg);
}

#guidingtop .inner .champion {
	background-image: url(/girlguidinguk/images/header-arrow2.png);
	background-repeat: no-repeat;
	position: relative;
	height: 85px;
	width: 280px;
	position: absolute;
	top: -9px;
	left: -6px;
}

#guidingtop .inner .champion div {
	padding: 17px 0px 0px 10px;
	color: #fff;
	font-size: 100%;
	font-weight: bold;
	line-height: 1.2;
}

#guidingtop .inner .champion div span {
	font-size: 140%;
	display: block;
	font-weight: bold;
}

#guidingtop .inner .gguk {
	position: absolute;
	top: -5px;
	right: -6px;
}

#guidingtop #loginbar {
	background-color: #336600;
	color: #fff;
	margin: 2px 0 0 0;
	padding: 0 100px 0 100px;
	min-height: 32px;
	position: relative;
}

#guidingtop #loginbar img.login {
	position: absolute;
	top: 0;
	left: 0;
}

#guidingtop #loginbar input.logout {
	position: absolute;
	top: 0;
	right: 0;
}

#guidingtop #loginbar div.welcome {
	margin: 0 0 0 -90px;
	font-size: 95%;
	padding: 0.7em 0 0 0;
}

#guidingtop #loginbar img.register {
	position: absolute;
	top: 0;
	right: 0;
}

#guidingtop #loginbar form {
	font-size: 80%;
	padding: 0.4em 0 0 0;
}

#guidingtop #loginbar form input.text {
	width: 112px;
}

/**
*
* styles for col1
*/
#col1 {
	width: 138px;
	float: left;
	margin-right: 10px;
}

#wrapper #col1 h3 {
	font-size: 90%;
	margin: 0;
	padding: 0;
}

#wrapper #col1 ul {
	list-style: none;
	font-size: 85%;
	margin: 0;
	padding: 0;
}

#content {
	float: left;
	background-color: #fff;
	color: #000;
}

#content h1 {
	background-image: url(/girlguidinguk/images/h1-bg.png);
	background-repeat: no-repeat;
	width: 335px;
	min-height: 41px;
	font-size: 130%;
	font-weight: normal;
	color: #fff;
	padding: 10px 0 0 10px;
	margin: 0;
}

#wrapper #content div.error-arrow, #wrapper #content h1.error-arrow {
	background-image: url(/girlguidinguk/images/content2-h1-bg.png);
	background-repeat: no-repeat;
	width: 470px;
	min-height: 44px;
	font-size: 130%;
	font-weight: normal;
	color: #fff;
	padding: 9px 0 0 7px;
	margin: 0;
}

.wrapper2col {
	background-image: url(/girlguidinguk/images/wrapper-bg.gif);
}

#wrapper #content h1.big {
	background-image: url(/girlguidinguk/images/content2-h1-bg.png);
	background-repeat: no-repeat;
	width: 470px;
	min-height: 44px;
	margin: 0;
	padding: 0px 0 0 0px;
}

#content h1.underlined {
	background-image: url(/girlguidinguk/images/h1-underlined.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
	font-size: 130%;
	color: #74c200;
	padding: 0 0 10px 0;
	min-height: 1em;
	margin: 0.2em 0 10px 0;
}

#content h2 {
	background-image: url(/girlguidinguk/images/h2-bg.gif);
	background-repeat: no-repeat;
	width: 335px;
	min-height: 31px;
	font-size: 130%;
	font-weight: normal;
	color: #fff;
	padding: 10px 0 0 10px;
	margin-left: -5px;
}

#content h2.light {
	background-image: url(/girlguidinguk/images/h1-bg.png);
}

#content h2.underlined {
	background-image: url(/girlguidinguk/images/content2-rule.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
	width: 471px;
	font-size: 130%;
	color: #74c200;
	padding: 0;
	margin: 0 0 -2px 0;
}

.wrapper3col #content{
	width: 347px
}

.wrapper2col #content {
	width: 496px;
	background-color: transparent;
}

#content .inner {
	margin: 6px 0 6px 15px;
	padding-right: 5px; /* sg */
}

.wrapper3col #content .inner {
	margin: 6px 0 6px 10px;
}

#content p {
	font-size: 90%;
}

#content p.size8 {
	font-size: 8pt;
}

#content p.intro {
	font-weight: bold;
	margin-top: 0.8em;
}

#content p.helptext {
	margin: 0;
	padding: 0;
}

#content div.unitname a:link, #content div.unitname a:visited{
	color: #74c200;
	font-size: 130%;
	text-decoration: underline;
}

#content table {
	width: 465px;
	border-collapse: collapse;
	margin: 0 0 1em 0;
}

#wrapper #content th, #wrapper #content td {
	font-size: 90%;
	padding: 0.5em 0 0.5em 0.3em;
}

#wrapper #content td.image {
	padding: 5px 0px 0px 5px;
}

#wrapper #content td a:link, #wrapper #content td a:visited {
	text-decoration: underline;
}

#wrapper #content tr.odd {
	background-color: #e3f3cc;
}

#col3 {
	width: 154px;
	float: right;
	margin-left: 10px;
	margin-right: -17px;
}

#wrapper #col3 h3 {
	font-size: 90%;
	margin: 0;
	padding: 0;
}

#wrapper #col3 h4 {
	font-size: 90%;
	margin: 0;
	padding: 0;
}

#wrapper #content div.challenge {
	padding: 10px 0 20px 0;
	font-size: 95%;
	background-image: url(/girlguidinguk/images/content2-rule.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
}

ul.challengelist {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 472px;
}
#wrapper #content ul.challengelist li {
	padding: 10px 0 20px 0;
	font-size: 95%;
	background-image: url(/girlguidinguk/images/listing-odd-bg.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
}

#wrapper #content ul.challengelist li.even {
	background-image: url(/girlguidinguk/images/listing-even-bg.gif);
	background-color: #e3f3cc;
}

#wrapper #content ul.challengelist li .skip {
	float: right;
	width: 120px;
}

#wrapper #content ul.challengelist li span, #wrapper #content div.challenge span {
	color: #74c200;
}

#wrapper #content ul.challengelist li .skip a:link, #wrapper #content ul.challengelist li .skip a:visited {
	text-decoration: underline;
}

#wrapper #content ul.challengelist h2, #wrapper #content div.challenge h2 {
	color: #000;
	background-image: none;
	min-height: 1em;
	margin: 0;
	padding: 0 0 0.2em 0;
}

#wrapper #content ul.challengelist p {
	margin: 0;
	padding: 0;
}

/* well done*/

.welldone {
	background-image: url(/girlguidinguk/images/welldone.gif);
	background-repeat: no-repeat;
	height: 250px;
	position: relative;
	text-align: center;
	margin-bottom: 1.5em;
}

#wrapper #content .welldone h2 {
	background-image: none;
	color: #6788be;
	position: absolute;
	top: 170px;
	left: 0;
	width: 475px;
	text-align: center;
}

#wrapper #content .welldone .total{
	font-size: 130%;
	color: #fff;
	position: absolute;
	top: 215px;
	left: 0;
	width: 475px;
	text-align: center;
}

/* various boxes etc.*/

.textbox {
	margin: 0 0px 0 0;
}

.unit-home-box {
	margin: 0 0 1em 0;
}

.box1 {
	background-image: url(/girlguidinguk/images/sidebox1-top.gif);
	background-repeat: no-repeat;
	padding-top: 6px;
}

.box1 .inner {
	background-color: #fff;
	color: #336600;
	padding: 6px 10px 4px 10px;
}
.box1 .innergraph {
	background-color: #fff;
	color: #336600;
	padding: 0px 0px 0px 0px;
}

.pencilbox1 {
	margin: 0 0 1em -8px;
}

#col1 .pencilbox1 {
	margin: 0 -8px 1em -8px;
}

.pencilbox1 .inner {
	background-image: url(/girlguidinguk/images/pencilbox1.gif);
	background-repeat: no-repeat;
	min-height: 65px;
}

/* font sizing on these elements is in pixels. Less than ideal but necessary given the design and the fact that we are having to counteract font sizes set in points!
Users agents that scale pixels could of course stil break these and user agents that do not but have no zoom control will be unable to resize, however gicen then default style sheet is set in points this is the situation anyway. */
#wrapper #col3 .pencilbox1 h4.top, #wrapper #col3 .pencilbox2 h4.top,
#wrapper #col1 .pencilbox1 h4.top {
	color: #74c200;
	padding: 10px 0 0 12px;
	margin: 0;
	font-size: 13px;
}

#wrapper #col3 .pencilbox2 h4.top {
	color: #0a9a34;
}

#wrapper .pencilbox1 div.bottom, #wrapper .pencilbox2 div.bottom, #wrapper .pencilbox3 div.bottom {
	color: #fff;
	padding: 12px 0 0 20px;
	font-weight: bold;
}

#wrapper .pencilbox2 div.selector,
#wrapper .pencilbox3 div.selector {
	min-height: 30px;
	padding: 6px 6px 0 0;
	text-align: center;
}

#wrapper .pencilbox2 div.selector select,
#wrapper .pencilbox3 div.selector select {
	font-size: 11px;
	margin-top: 2px;
}

#wrapper .pencilbox1 .inner div,
#wrapper .pencilbox2 .inner div,
#wrapper .pencilbox3 .inner div {
	font-size: 14px;
}

#wrapper div.vs {
	text-align: center;
	margin-right: 10px;
}

.pencilbox2 {
	margin: 0 0 0 -8px;
}

.pencilbox2 .inner {
	background-image: url(/girlguidinguk/images/pencilbox2.gif);
	background-repeat: no-repeat;
	min-height: 90px;
}

.pencilbox3 {
	margin: 0 0 1em -8px;
}

.pencilbox3 .inner {
	background-image: url(/girlguidinguk/images/pencilbox3.gif);
	background-repeat: no-repeat;
	min-height: 65px;
}

.contentbox {
	background-color: #e8f5d6;
	background-image: url(/girlguidinguk/images/content2-box-top.png);
	background-repeat: no-repeat; 
	padding: 5px 0 0 0;
	margin: 0 0 1em 0;
	width: 465px;
}

.contentbox .boxinner {
	background-image: url(/girlguidinguk/images/content2-box-bottom.png);
	background-repeat: no-repeat;
	background-position: bottom left;
	padding: 10px 0px 20px 5px;
}

.contentbox .details {
	background-color: #fff;
	width: 256px;
	margin: 0.8em 0 0.8em 0;
	background-image: url(/girlguidinguk/images/details-box-top.gif);
	background-repeat: no-repeat;
	padding: 10px 0 0 0;
}

.contentbox .details ul {
	margin: 0;
	padding: 0 0 10px 0;
	list-style: none;
	background-image: url(/girlguidinguk/images/details-box-bottom.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
}

#wrapper .contentbox .details li {
	font-size: 90%;
	line-height: 1.9;
}

#wrapper .contentbox p,
#wrapper .contentbox div.labellike {
	padding: 0.5em 0 0.5em 0;
}

#wrapper .getstarted {
	margin: 1em 0 1em 0;
	width: 132px;
	background-color: #fff;
	padding: 10px 2px 4px 6px;
}

#wrapper .getstarted h4 {
	margin: 0;
	padding: 0;
	font-size: 90%;
	line-height: 1;
}

#wrapper .getstarted p {
	font-size: 85%;
}

.getstarted img {

	float: left;
	margin: 0 2px 0 0;
	
}

.getstarted a img {

	float: left;
	margin: 0 0px 0 0;
	
}

/* navlist is the list with graphic lines under */

#wrapper #col1 ul.navlist {
	margin: 0.8em 0 0.4em 0;
}

ul.navlist li {
	font-weight: bold;
	background-image: url(/girlguidinguk/images/navlistbg.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
	padding: 2px 0 8px 0;
	float: left;
	width: 100%;
}

ul.navlist li.last {
	background-image: none;
}

ul.navlist li a:link, ul.navlist li a:visited {
	color: #003300;
	float: left;
	width: 90px;
}

ul.navlist li span a:link, ul.navlist li span a:visited {
	font-weight: normal;
	float: right;
	width: 40px;
	padding: 0 4px 0 0;
}

ul.navlist li a:hover {
	text-decoration: none;
}

#wrapper .box1 li {
	border-bottom: 1px solid #b9e07f;
	padding: 0 0 0.4em 0;
	margin: 0 0 0.4em 0;
}

#wrapper .box1 li img {
	margin: 0 0 0.2em 0;
}

#wrapper .box1 li img, #wrapper .box1 li a:link, #wrapper .box1 li a:visited {
	display: block;
}

#wrapper .box1 a:link, #wrapper .box1 a:visited {
	text-decoration: underline;
}

#wrapper .box1 .more {
	font-size: 85%;
}

/* the box on the homepage */
.levels-box {
	margin:  0 0 1em -5px;
	padding: 0;
}

.levels-box .levels-inner {
	background-image: url(/girlguidinguk/images/levels-box-top.gif);
	background-repeat: no-repeat;
	padding: 16px 16px 0 16px;
	margin: 0;
}

#wrapper .levels-box h2 {
	font-size: 130%;
	margin: 0 0 0.4em 0;
	padding: 0 0 8px 0;
	color: #418200;
	background-image: url(/girlguidinguk/images/divider.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
	min-height: 1em;
}

.levels-box ul {
	list-style: none;
	margin: 0 0 0 10px;
	padding: 0;
}

.levels-box li {
	padding: 0 0 0.5em 60px;
	min-height: 60px;
}

.levels-box li.level1 {
	background-image: url(/girlguidinguk/images/level1.gif);
	background-repeat: no-repeat;
}

.levels-box li.level2 {
	background-image: url(/girlguidinguk/images/level2.gif);
	background-repeat: no-repeat;
}

.levels-box li.level3 {
	background-image: url(/girlguidinguk/images/level3.gif);
	background-repeat: no-repeat;
}

.levels-box li.level4 {
	background-image: url(/girlguidinguk/images/level4.gif);
	background-repeat: no-repeat;
}

#wrapper .levels-box li p {
	margin: 0;
	padding: 0;
	font-size: 100%;
}

#wrapper .levels-box ul h3 {
	font-size: 95%;
	font-weight: bold;
	margin: 0;
	padding: 0;
}

/* photo gallery listing */
ul.gallery {
	margin: 3em 0 0 0;
	padding: 0;
	list-style: none;
}

ul.gallery li {
	float: left;
	margin: 0 8px 6px 0;
}

.challengedetails {
	
	width: 460px;
}

.challengelevel1, .challengelevelcake, .challengelevelsweets, .challengelevelnutcracker, .challengelevelrock {

	background-repeat: no-repeat;
	background-position: top center;
	float: right;
	width: 100px;
	text-align: center;
	font-size: 90%;
	font-weight: bold;
	padding-top: 62px;
	margin-top: 31px;
	
}

.challengelevelsweets {
	background-image: url(/girlguidinguk/images/level2.gif);
}
.challengelevelcake {
	background-image: url(/girlguidinguk/images/level1.gif);
}
.challengelevelnutcracker {
	background-image: url(/girlguidinguk/images/level3.gif);
}
.challengelevelrock {
	background-image: url(/girlguidinguk/images/level4.gif);
}

.challengedetails ul {
	list-style: none;
	margin: 0;
	padding: 2em 0 3em 0;
}

#wrapper #content .challengedetails li {
	font-size: 120%;
	color: #74c200;
}

/* forms*/



form.forms label,
#wrapper form.forms div.labellike {
	display: block;
	color: #336600;
	font-weight: bold;
	font-size: 100%;
	padding: 0.3em 0 0.3em 0;
}

form.forms label.opt {
	color: #000;
	font-weight: bold;
	font-size: 90%;
	padding: 0.3em 0 0.3em 0;
}

form.forms label span {
	font-weight: normal;
}

form.forms .checks {
	text-align: right;
	padding-top: 0.5em;
}

form.forms .checks label {
	float:left;
	/* width: 400px; */
	/* width: 500px; */
	text-align: left;
}

form.forms .inline label{
	float: none;
	display: inline;
	padding: 0;
}

form.forms .text {
	width: 200px;
	border: 0;
	padding: 0.1em;
}

form.forms table .text {
	width: 160px;
	margin-right: 15px;
}

#wrapper #content form.forms th, #wrapper #content form.forms td {
	padding: 0 0 2px 0;
	vertical-align: top;
}

form.forms .largetext {
	width: 430px;
	border: 0;
	padding: 0.1em;
	margin: 0 0 0.8em 0;
}

form.forms select {
	margin: 0 0 0.8em 0;
}


form.forms .smalltext {
	width: 100px;
	border: 0;
	padding: 0.1em;
}

form.forms .tinytext {
	width: 2em;
	border: 0;
	padding: 0.1em;
}

form.challengeform label {
	color: #000;
	font-size: 95%;
	font-weight: bold;
}

form.challengeform .tinytext {
	width: 2em;
	border: 1px solid #336600;
	padding: 0.2em;
	margin-right: 20px;
}

form.challengeform .contentbox label {
	font-weight: normal;
}

form.challengeform .checks, form.challengeform .checkstext  {
	text-align: right;
	/*
	padding-bottom: 0.4em;
	*/
	padding: 10px 5px 0px 0px; 

    height: 40px;/* sg */
	
	vertical-align:middle;/* sg */

	}

form.challengeform .checks label, form.challengeform .checkstext label {
	float: left;
	text-align: left;
	max-width: 400px;
	/* border: 1px solid red; */
	padding: 5px 1px 5px 1px; /* sg */
}

form.challengeform div.radios {
	padding-bottom: 2em;
}

form.challengeform .checkstext label {
	width: 250px;
}

form.challengeform .contentbox .tinytext {
	border: 0;
	margin: 0;
}

form.challengeform .text {
	width: 14em;
	border: 0;
	padding: 0.2em;
}

#wrapper #content form.challengeform div.labellike {
	font-weight: bold;
	color: #336600;
	padding: 0.6em 0 1em 0;
}

ul.choices {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.choices li {
	padding-bottom: 1.2em;
}

ul.choices li a:link, ul.choices li a:visited, ul.choices li a:hover  {
	color: #000;
	border-bottom: 1px solid #336600;
	font-weight: bold;
	text-decoration: none;
}



ul.patrols {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.patrols li {
	padding-bottom: 1.2em;
}

form.forms ul.patrols label {
	display: inline;
	font-size: 90%;
	color: #336600;
}

/* steven added dataentry */
ul.dataentry {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.dataentry li {
	padding-bottom: 1.2em;
}

form.forms ul.dataentry label {
	display: inline;
	font-size: 90%;
	font-weight: normal;
	color: #000;
}

ul.agreements {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.agreements li {
	border-bottom: 1px solid #999;
	clear: left;
	float:left;
	width: 100%;
	padding: 0.2em 0 0.2em 0;
	text-align: right;
}

ul.agreements li.last {
	border-bottom: 0;
}

form.forms ul.agreements label {
	float:left;
	font-size: 90%;
	color: #000;
	font-weight: normal;
	width: 410px;
	text-align: left;
}

form.forms div.cols {
	float: left;
	width: 220px;
	padding-bottom: 0.6em;
}

.clear {
	clear: both;
	height: 1px;
	font-size: 1px;
}

#content div.footer {
	clear: both;
	text-align: center;
	padding-top: 1em;
	min-width: 60%
}

#content div.footer p {
	max-width:90%
}