.donateform {
	position: relative;
	display: block;
	min-height: 32rem;
}
.donateform input[type=text],
.donateform select {
	display: inline-block;
	box-sizing: border-box;
	width: auto;
	line-height: 1.50rem;
	height: 1.50rem;
	padding: .10rem .35rem;
}
.donateform .fieldrow input[type=text],
.donateform .fieldrow select
{
	width: 100%;
}
.donateform .fieldrow .field {
	width: 65%;
	max-width: 20rem;
}
.donateform a.button, .donateform input[type=submit] {
	display: inline-block;
	padding: .25rem 1rem;
	line-height: 1.5rem;
	height: 1.5rem;
}
.donateform .fieldrow.error {
	color: red;
}
.donateform .fieldrow.error input,
.donateform .fieldrow.error select {
	color: red;
	border-color: red;
	background: rgba(250,250,230,.75);
}


.donate-progress {
	position: relative;
	display: block;
	width: 100%;
}
.donate-progress:after {
	position: absolute;
	display: block;
	background: #e9e8e5;
	content: '';
	height: 5%;
	top: 22%;
	left: 12.5%;
	right: 12.5%;
	z-index: 1;
}

.donate-progress > div {
	display: table;
	position: relative;
	width: 100%;
	z-index: 10;
}
.donate-progress > div > a {
	display: table-cell;
	width: 25%;
	vertical-align: top;
	text-align: center;
	text-decoration: none;
	cursor: default;
	color: #b5b1a8;
}
.donate-progress .icon {
	display: inline-block;
	width: 4rem;
	height: 3rem;
	background: url("/assets/images/progress.png") no-repeat;
}
.donate-progress .text {
	text-align: center;
	margin: auto;
	width: 60px;
	font-size: 12px;
	color: inherit;
	font-weight: 400;
}

.donateform.step-1 .donate-progress > div > .progress-step-0:hover
{ cursor: pointer; color: #333; }

.donateform.step-2 .donate-progress > div > .progress-step-0:hover,
.donateform.step-2 .donate-progress > div > .progress-step-1:hover
{ cursor: pointer; color: #333; }

.donateform.step-3 .donate-progress > div > .progress-step-0:hover,
.donateform.step-3 .donate-progress > div > .progress-step-1:hover,
.donateform.step-3 .donate-progress > div > .progress-step-2:hover
{ cursor: pointer; color: #333; }

.donate-progress .progress-step-0 .icon {
	background: url("/assets/images/progress-donate.png") no-repeat;
	background-position: 10px 0px;
}
.donateform.step-0 .donate-progress .progress-step-0 .icon { background-position: 10px -77px; }

.donate-progress .progress-step-1 .icon { background-position: -60px 0px; }
.donateform.step-1 .donate-progress .progress-step-1 .icon { background-position: -60px -77px; }

.donate-progress .progress-step-2 .icon { background-position: -136px 0px; }
.donateform.step-2 .donate-progress .progress-step-2 .icon { background-position: -136px -77px; }

.donate-progress .progress-step-3 .icon { background-position: -206px 0px; }
.donateform.step-3 .donate-progress .progress-step-3 .icon { background-position: -206px -77px; }

.donateform.step-0 .donate-progress .progress-step-0 .text,
.donateform.step-1 .donate-progress .progress-step-1 .text,
.donateform.step-2 .donate-progress .progress-step-2 .text,
.donateform.step-3 .donate-progress .progress-step-3 .text
{ color: #333; }

.donate-step {
	display: none;
	position: relative;
	margin: 1.5rem auto;
}
.donate-step > div {
	display: block;
	position: relative;
	margin: 0;
}
.donate-step-0 > div,
.donate-step-summary > div {
	margin-left: 10%;
}

.fieldrow-cc_expiration .field {
	white-space: nowrap;
}
.fieldrow-cc_expiration .field select {
	width: 49.25%;
}
.donate-step header {
	display: block;
	position: relative;
	padding: 0 0 .5rem 0;
	margin: .75rem 0;
	border-bottom: dotted #d8d8d6 2px;
}
.donate-step header h3 {
	display: block;
	position: relative;
	margin: 0;
	font-size: 1.05rem;
	text-transform: uppercase;
	font-weight: 300;
}
.donate-step .edit-step {
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	font-weight: 300;
	font-size: .75rem;
	text-decoration: none;
}
.donate-step .edit-step span {
	padding: 0 3px;
}
.donate-step .edit-step:hover span {
	background: #ccc;
}

.donation-types {
	display: block;
	position: relative;
}
.donation-types label {
	display: block;
	position: relative;
	margin: .25rem 0;
}
.donation-types label .donation-type-amount {
	width: 5rem;
	margin: 0 .25rem;
	display: none;
}
.donation-types label.selected .donation-type-amount {
	display: inline-block;
}

.donate-step-0 > div >  label {
	display: block;
	margin: .75rem 0;
}
input[type=checkbox] {
	vertical-align: middle;
}

.donateform footer {
	display: block;
	position: relative;
	margin: 2.5rem auto;
}
.donateform footer .recaptcha-container {
	display: none;
	position: relative;
	margin: 0 auto 1.5rem auto;
}
.donateform.step-3 footer .recaptcha-container {
	display: block;
}
.donateform footer .g-recaptcha > div {
	margin: 0 auto;
}

.donateform footer .ftbtns {
	display: table;
	position: relative;
	width: 98%;
	margin: 0 auto;
}
.donateform footer .ftbtns > div {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}
.donateform footer .ftbtns > div:first-child {
	width: 8rem;
	text-align: left;
}

.donateform footer .ftbtns > div:last-child {
	width: 8rem;
	text-align: right;
}
.donateform footer .button {
	text-decoration: none;
	font-size: .90rem;
	font-weight: 400;
	display: none;
}

.donateform.step-0 footer .button.next {
	display: inline-block;
}
.donateform.step-1 footer .button.prev,
.donateform.step-1 footer .button.next,
.donateform.step-2 footer .button.prev,
.donateform.step-2 footer .button.next {
	display: inline-block;
}
.donateform.step-3 footer .button.prev {
	display: inline-block;
}
.donateform.step-3 footer .button.submit {
	display: inline-block;
}


.donateform footer .form-error-msg {
	padding: 0 .5rem;
}
.donateform footer .form-error-msg > div {
	display: block;
	color: red;
	border: dotted red 2px;
	padding: .50rem;
	background: rgba(250,250,230,.75);
	border-radius: 1rem;
}

.donateform.step-3 .edit-step {
	display: block;
}

.donateform dl {
	display: block;
	position: relative;
	break-inside: avoid;
}
.donateform dt {
	font-size: .85em;
	padding-top: .35rem;
	line-height: 1rem;
	color: #b5b1a8;
	-webkit-column-break-after: avoid;
	break-after: avoid;
}
.donateform dt:after {
	content: ':';
}
.donateform dd {
	margin-bottom: .25rem;
}

.donate-step-3 > div.donate-step-summary {
	margin: 0 0 2.5rem 0;
}
.donate-step-3 > div.donate-step-summary > div {
	column-count: 2;
}

.donateform .form-message {
	margin: 1.5rem 0;
	padding: .75rem 1.25rem;
	border: dotted #b3025a 1px;
	background: rgba(250,250,230,.75);
}

@media (max-width: 768px){
	.donateform .fieldrow .field {
		width: 100%;
		max-width: none;
	}
}