/* Reset all code */
/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.Code licensed under the BSD License:http://developer.yahoo.net/yui/license.txt version: 2.8.0r4
*/
html{color:#000;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;}
legend{color:#000;}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}

/* Base styles set */
/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved. Code licensed under the BSD License:http://developer.yahoo.net/yui/license.txtversion: 2.8.0r4
*/

h1{font-size:2.7em;}
h2{font-size:2.4em;}
h3{font-size:1.8em;}
p,ul li, ol li{font-size:1.3em;}
h1,h2,h3{margin:1em 0;}
h1,h2,h3,h4,h5,h6,strong,dt{font-weight:bold;}
optgroup{font-weight:normal;}
abbr,acronym{border-bottom:1px dotted #000;cursor:help;}
em{font-style:italic;}
del{text-decoration:line-through;}
blockquote,ul,ol,dl{margin:1em;}
ol,ul,dl{margin-left:3em;}
ol li{list-style:decimal outside;}
ul li{list-style:disc outside;}
dl dd{margin-left:1em;}
th,td{border:1px solid #000;padding:.5em;}
th{font-weight:bold;text-align:center;}
caption{margin-bottom:.5em;text-align:center;}
sup{vertical-align:super;}
sub{vertical-align:sub;}
p,fieldset,table,pre{margin-bottom:1em;}
button,input[type="checkbox"],input[type="radio"],input[type="reset"],input[type="submit"]{padding:1px;}
/* clearfix */
.clearfix:after {content: ".";display:block;clear:both;visibility:hidden;line-height:0;height:0;}
.clearfix {display:inline-block;}
html[xmlns] .clearfix {display:block;}
* html .clearfix {height:1%;}

.error,
span.field-with-errors input,
span.field-with-errors select,
span.field-with-errors textarea {
background: #FFEEEE !important;
border: 1px solid #C98F8F !important;
color: #543434 !important;
}
 
.success {
background: #EEFFEE;
border: 1px solid #8FC98F;
color: #1C301C;
}

body {
	font: 62.5% "Helvetica Neue", Helvetica, Arial, sans-serif;
	background: #f3f3f3;
	color: #333;
}
a, a:visited {
	text-decoration: none;
	color: #03f;
}
a:hover {
	text-decoration: underline;
}
div#wrapper {
	margin: 40px auto;
	width: 900px;
	padding: 30px;
	background: #fff;
	-moz-box-shadow: rgba(102,102,102, 0.14) 0 0 7px;
	position: relative;
}
div#wrapper h1 {
	margin: 0 0 0.25em 0;
	font-weight: lighter;
	font-size: 22px;
	font: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
div#wrapper h2 {
	margin: 1em 0 0.25em 0;
	font-weight: lighter;
	font-size: 18px;
	font: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
a#logo {
	display: block;
	width: 222px; height: 122px;
	position: absolute;
	background: url(/images/donations/logo.png) no-repeat;
	top: -40px; left: 721px;
	text-indent: -9999px;
	outline: none;
}
a#back {
	position: absolute;
	top: -27px; left: 20px;
	font-size: 12px;
}
div#header {
	border-bottom: 2px solid #ccc;
	margin-bottom: 20px;
	width: 75%;
}

form div.field {
	margin: 18px 0;
}
label, input, select, textarea {
	font-size: 1.5em;
}
textarea {
	max-height: 75px;
}
form label {
	display: block;	
	padding-bottom: 3px;
	font-size: 1.5em;
}
form ul {
	list-style: none;
	margin: 0; padding: 0;
}
form ul li {
	list-style: none;
	margin: 6px 0;
}
form ul.belongs-to li {
	float: left;
	width: 30%;
	margin-right: 3%;
}
input[type=radio], input[type=checkbox] {
	margin-right: 5px;
}

form input[type=text],
form input[type=password],
textarea {
	background: #fff;
	border: 1px solid #ccc;
	padding: 4px;
}
form input.placeholder-active {
	color: #888;
}
form div.field.checkbox label {
	display: inline;
}
form div.field ul label {
	display: inline;
	font-size: 1em;
}
form div.field.nested {
	margin: 5px 0 0 0;
}
form div.field.nested label {
	font-size: 1.3em;
}
form p.help {
	font-size: 1.1em;
	color: #777;
	margin: 5px 0 0 0;
}
form fieldset {
	margin: 20px 0;
	padding: 0 20px;
	border-top: 1px solid #ccc;
}
form fieldset legend {
	font-size: 1.2em;
	padding: 0 10px;
}
form div.error ul {
	padding-left: 20px;
	list-style: disc;
}
form div.error ul li {
	list-style: disc;
}
span.currency {
	font-size: 2em;
	padding-right: 10px;
}
input#donation_amount {
	width: 80px;
	text-align: right;
	font-size: 1.8em;
}
input#donation_first_name {
	width: 140px;
}
form#new_donation ul.belongs-to {
	width: 600px;
}
div.validations {
	padding: 0 20px 10px 20px;
}
input[type=submit].disabled {
	opacity: 0.5;
}

input#user_password_confirmation {
	margin-top: 10px;
}
input#user_emergency_contact_name {
	width: 160px;
}

.left { float: left; }
.right { float: right; }

div#accounts-show div.campaigns {
	width: 610px;
}
div#accounts-show div.aside {
	width: 310px;
}

div#accounts-show div.total-raised {
	background: #dbffdb;
	border: 1px solid #0c3;
	-moz-border-radius: 3px;
	font-size: 6em;
	line-height: 1.8em;
	font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
}

div#accounts-show ul.campaigns {
	list-style: none;
	margin: 10px 0; padding: 0;
}
div#accounts-show ul.campaigns li {
	list-style: none;
}
div#accounts-show ul.campaigns h3 {
	font-weight: normal;
	margin: 0 0 10px 0;
	font-size: 20px;
}
div#accounts-show ul.campaigns li > p {
	font-size: 1em;
	margin: 5px 0;
}

div.progress-bar {
	float: right;
	width: 188px;
	margin-top: 4px;
}
div.progress-bar div.bar {
	height: 17px;
	width: 100%;
	background: url(/images/donations/progress-bg.png) repeat-x;
	-moz-border-radius: 12px;
	margin-bottom: 6px;
}
div.progress-bar div.bar div.progress {
	height: 17px;
	-moz-border-radius: 12px;
}
div.progress-bar span {
	display: block;
	text-align: center;
}
div.progress-bar span.raised {
	float: left;
}
div.progress-bar span.target {
	float: right;
}
div#direct_debit_plus_information {
	max-height: 175px;
	overflow: auto;
	border: 1px solid #ccc;
	padding: 8px;
	margin-top: 0;
}
div#direct_debit_plus_information img {
	float: right;
	margin: 0 0 15px 15px;
}


body {
	font: 62.5% Arial, Helvetica sans-serif;
	background: #f3f3f3;
	color: #333;
}
a, a:visited {
	text-decoration: none;
	color: #03f;
}
a:hover {
	text-decoration: underline;
}
div#wrapper {
	margin: 40px auto;
	width: 900px;
	padding: 30px;
	background: #fff;
	-moz-box-shadow: rgba(102,102,102, 0.14) 0 0 7px;
	position: relative;
}
div#wrapper h1 {
	margin: 0 0 0.25em 0;
	font-weight: lighter;
	font-size: 22px;
	font: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
div#wrapper h2 {
	margin: 1em 0 0.25em 0;
	font-weight: lighter;
	font-size: 18px;
	font: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
a#logo {
	display: block;
	width: 222px; height: 122px;
	position: absolute;
	background: url(/images/donations/logo.png) no-repeat;
	top: -40px; left: 721px;
	text-indent: -9999px;
	outline: none;
}
div#small-links {
	position: absolute;
	top: -27px; left: 20px;
	font-size: 12px;
}
div#header {
	border-bottom: 3px solid #00529E;
	margin-bottom: 20px;
	width: 75%;
}

form div.field {
	margin: 18px 0;
}
label, input, select, textarea {
	font-size: 1.5em;
}
textarea {
	max-height: 75px;
}
form label {
	display: block;	
	padding-bottom: 3px;
	font-size: 1.5em;
}
form ul {
	list-style: none;
	margin: 0; padding: 0;
}
form ul li {
	list-style: none;
	margin: 6px 0;
}
form ul.belongs-to li {
	float: left;
	width: 30%;
	margin-right: 3%;
}
input[type=radio], input[type=checkbox] {
	margin-right: 5px;
}

form input[type=text],
form input[type=password],
textarea {
	background: #fff;
	border: 1px solid #ccc;
	padding: 4px;
}
form input.placeholder-active {
	color: #888;
}
form div.field.checkbox label {
	display: inline;
}
form div.field ul label {
	display: inline;
	font-size: 1em;
}
form div.field.nested {
	margin: 5px 0 0 0;
}
form div.field.nested label {
	font-size: 1.3em;
}
form p.help {
	font-size: 1.1em;
	color: #777;
	margin: 5px 0 0 0;
}
form fieldset {
	margin: 20px 0;
	padding: 0 20px;
	border-top: 1px solid #ccc;
}
form fieldset legend {
	font-size: 1.2em;
	padding: 0 10px;
}
form div.error ul {
	padding-left: 20px;
	list-style: disc;
}
form div.error ul li {
	list-style: disc;
}
span.currency {
	font-size: 2em;
	padding-right: 10px;
}
input#donation_amount {
	width: 57px;
	text-align: right;
	font-size: 1.8em;
}
input#donation_first_name {
	width: 140px;
}
form#new_donation ul.belongs-to {
	width: 600px;
}
div.validations {
	padding: 0 20px 10px 20px;
}
input[type=submit].disabled {
	opacity: 0.5;
}

input#user_password_confirmation {
	margin-top: 10px;
}
input#user_emergency_contact_name {
	width: 160px;
}

.left { float: left; }
.right { float: right; }

div#accounts-show div.campaigns {
	width: 610px;
}
div#accounts-show div.aside {
	width: 310px;
}

div#accounts-show div.total-raised {
	background: #dbffdb;
	border: 1px solid #0c3;
	-moz-border-radius: 3px;
	font-size: 6em;
	line-height: 1.8em;
	font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
}

div#accounts-show ul.campaigns {
	list-style: none;
	margin: 10px 0; padding: 0;
}
div#accounts-show ul.campaigns li {
	list-style: none;
}
div#accounts-show ul.campaigns h3 {
	font-weight: normal;
	margin: 0 0 10px 0;
	font-size: 20px;
}
div#accounts-show ul.campaigns li > p {
	font-size: 1em;
	margin: 5px 0;
}

div.progress-bar {
	float: right;
	width: 188px;
	margin-top: 4px;
}
div.progress-bar div.bar {
	height: 17px;
	width: 100%;
	background: url(/images/donations/progress-bg.png) repeat-x;
	-moz-border-radius: 12px;
	margin-bottom: 6px;
}
div.progress-bar div.bar div.progress {
	height: 17px;
	-moz-border-radius: 12px;
}
div.progress-bar span {
	display: block;
	text-align: center;
}
div.progress-bar span.raised {
	float: left;
}
div.progress-bar span.target {
	float: right;
}
div#direct_debit_plus_information {
	max-height: 175px;
	overflow: auto;
	border: 1px solid #ccc;
	padding: 8px;
	margin-top: 0;
}
div#direct_debit_plus_information img {
	float: right;
	margin: 0 0 15px 15px;
}

/* Participation Views */

a#logo {
	background: url(/images/participations/top-logo.png) no-repeat;
}

div#header {
	margin-bottom:35px;
}

div#header h1 {
	font-family: 'Open Sans', sans-serif;
	font-size:34px;
}

.first-block, .third-block, .second-block {
	background: #f0f0f0;
	padding:20px;
	position:relative;
	font-family: 'Open Sans', sans-serif;
}

.first-block {
	margin-bottom:20px;
	z-index:3;
	border-bottom:1px solid #CDCDCD;
}

.second-block {
	background:#FFFFFF;
	z-index:2;
	border-bottom:1px solid #CDCDCD;
}
.white-arrow, .grey-arrow {
	background: url(/images/participations/white-arrow.png) no-repeat;
	position:absolute;
	bottom:-17px;
	left:50%;
	margin-left:-18px;
	display:block;
	width:36px;
	height:17px;
}

.grey-arrow {
	background: url(/images/participations/grey-arrow.png) no-repeat;
}

div#wrapper .first-block h2 {
	text-align:center;
	font-size:22px;
	color:#212121;
	margin:0 0 0.5em 0;
}

div#wrapper .first-block p {
	color:#212121;
	font-size:18px;
	line-height:23px;
}

div#wrapper .first-block span {
	color:#00529E;
}

div#wrapper form h2 {
	margin:0 0 0.5em 0;
	font-size:22px;
	color:#00529E;
}

form .left-form, form .right-form {
	float:left;
	width:430px;
}

form .qm_form_field {
	margin-bottom:15px;
}

form input[type=text], form input[type=password], form textarea {
	width:380px;
	height:30px;
	line-height:30px;
	padding:4px 12px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	-khtml-border-radius: 7px;
	border-radius: 7px;
	border: 3px solid #f0f0f0;
	color: #535353;
}

form ::-webkit-input-placeholder { 
  color: #535353;
}
form :-moz-placeholder { 
  color: #535353;
}
form ::-moz-placeholder { 
  color: #535353;
}
form :-ms-input-placeholder { 
  color: #535353;
}

form .qm_form_field.dateselect {
	min-height:31px;
	padding-top:13px;
}

form .qm_form_field.dateselect label {
	width:150px;
	float:left;
	color: #535353;
	padding:0 0 0 15px;
}

form textarea {
	height:90px;
}

form .qm_form_field.checkbox input {
	float:left;
	margin:3px 10px 15px 0;
}

form .third-block label {
	color:#212121;
	font-size:15px;
}

form .third-block input[type=text], form .third-block input[type=password], form .third-block textarea {
	border: 3px solid #CDCDCD;
}

form .qm_form_field.how-much {
	margin-top:15px;
}

form .qm_form_field.how-much label,
form .qm_form_field.sponsorship label {
	float:left;
	font-size:18px;
	margin-right:15px;
	line-height:44px;
}

form .qm_form_field.how-much input[type=text] {
	width:28px;
}

form .qm_form_field p.help-text {
	font-style:italic;
	color:#999;
	font-size:13px;
	margin:10px 0 0 0;
}

form .qm_form_field p.help-text a {
	color:#1ea4fa;
}

form input[type="submit"] {
	background: #1ea4fa;
	border: 1px solid #286BB8;
	color: #fff;
	padding: 1em 2em;
	font-size: 14px;
	text-align: center;
	-webkit-border-radius: 4px;
	-moz-border-radius: 7px;
	-ms-border-radius: 7px;
	-o-border-radius: 7px;
	border-radius: 7px;
	display: block;
	-webkit-box-shadow: inset 0 1px 1px rgba(255,255,255,0.5),0 1px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0 1px 1px rgba(255,255,255,0.5),0 1px rgba(0,0,0,0.2);
	box-shadow: inset 0 1px 1px rgba(255,255,255,0.5),0 1px rgba(0,0,0,0.2);
	margin:0 auto;
}

div#wrapper .account-page h2 {
	margin:0 0 0.5em 0;
	font-size:22px;
	color:#212121;
}

.account-page .first-block {
	padding:20px 320px 20px 20px;
}

.account-page .first-block .info {
	text-align:center;
}

.donation-total {
	position:absolute;
	top:0px;
	right:0px;
	bottom:-1px;
	left:600px;
	background:#1ea4fa;
	text-align:center;
	padding-top:20px;
}

.donation-total.complete {
	background:#22D18D;
}

div#wrapper .first-block .donation-total p {
	color:#FFFFFF;
	font-size:22px;
	position:absolute;
	top:70%;
	margin-top:-14px;
	text-align:center;
	left:0px;
	right:0px;
}

.donation-total small {
	color: #dddddd;
	font-size: 14px;
	top: 80%;
	text-align: center;
}

div#wrapper .first-block a {
	color:#1ea4fa;
}

.account-page form {
	display:block;
	width:355px;
	margin:0 auto;
}

.account-page .qm_form_field.donation label {
	float:left;
	font-size:18px;
	margin-right:8px;
	line-height:46px;
}

.account-page form .left-form {
	width:245px;
}

.account-page form .right-form {
	width:110px;
}

.account-page .qm_form_field.donation input {
	width:28px;
	border: 3px solid #CDCDCD;
	height:34px;
}

.account-page .qm_form_field input[type="submit"] {
	margin:0px;
}

.account-page table {
	border-collapse:collapse;
	width:100%;
	font-size:18px;
	background:#f0f0f0;
}

.account-page table th {
	text-align:left;
	font-weight:normal;
	color:#00529E;
}

.account-page table td,
.account-page table th {
	border: 3px solid #CDCDCD;
}
div.first-block div.login-block {
	float: right;
	border: 1px solid #aaa;
	padding: 10px 20px;
	background: #fff;
	margin-left: 20px;
}
div.first-block div.login-block h3 {
	font-family: 'Open Sans', sans-serif;
	font-weight: lighter;
	font-size: 2em;
	border-bottom: 1px solid #aaa;
}
div.first-block div.login-block p {
	font-size: 16px!important;
}
