

/* base-form.css
****************************************************************
****************************************************************
****************************************************************/


/* Bugfixes
****************************************************************/

.form
{
	/* http://code.google.com/p/chromium/issues/detail?id=139613 */
	-webkit-transform: translate3d(0,0,0);
}


/* Forms
****************************************************************/

.article .header .form dl dt
{
	font-weight: bold;
}

.form p.error, .form label.error, .form span.required
{
	color: #DD0000;
}

.form p.success, .form label.success
{
	color: #00A550;
}

.form label.error
{
	/* 11pt '' */
	font-size: 11px;
	font-size: 1.1rem;
}

.form dd.message label.error
{
	/* line:24px * 2/3 */
	line-height: 16px;
	line-height: 1.6rem;
	display: block;
	/* (line:24px * 1/6) 0 */
	padding: 4px 0;
	padding: .4rem 0;
}

.form ul
{
	list-style-type: none;
	padding-left: 0;
}

.form dl dd
{
	margin: 0;
}

.form dl dd.multiple
{
	/* -margin:20px / 4 */
	margin-right: -20px;
}

.form .input-wrapper,
.form .textarea-wrapper,
.form .select-wrapper
{
	display: block;
	/* 1px ((margin:20px / 2) + 1px) */
	padding: 1px 11px;
	padding: .1rem 11px;
	/* 0 (margin:20px / 4) */
	margin: 0 -5px;
	margin: 0 -5px;
}

.form .input-wrapper.inline,
.form .textarea-wrapper.inline,
.form .select-wrapper.inline
{
	display: inline-block;
}

.form .select-wrapper
{
	/* ((margin:20px / 4) + 1px) */
	padding-left: 6px;
	padding-right: 6px;
}

/* (grid:100px * x) - (margin:20px / 2) */
.form .select-wrapper-mini   { max-width: 40px;  /* x = 1/2 */ }
.form .select-wrapper-small  { max-width: 90px;  /* x = 1 */ }
.form .select-wrapper-medium { max-width: 190px; /* x = 2 */ }
.form .select-wrapper-large  { max-width: 390px; /* x = 4 */ }

/* (grid:100px * x) - margin:20px */
.form .input-wrapper-mini   { max-width: 30px;  /* x = 1/2 */ }
.form .input-wrapper-small  { max-width: 80px;  /* x = 1 */ }
.form .input-wrapper-medium { max-width: 180px; /* x = 2 */ }
.form .input-wrapper-large  { max-width: 380px; /* x = 4 */ }

.form .text-wrapper,
.form .checkbox-label-wrapper
{
	display: block;
	/* 0 (margin:20px / 4) */
	padding-right: 5px;
	/* line:24px */
	min-height: 24px;
	min-height: 2.4rem;
}

.form .checkbox-label-wrapper
{
	/* 0 (margin:20px / 2) */
	padding-right: 10px;
}

.form .input-wrapper input,
.form .select-wrapper select,
.form .textarea-wrapper textarea,
.form .textarea-wrapper .textarea
{
	display: block;
	width: 100%;
	/* 0 (margin:20px / 4) */
	padding: 0 5px;
	/* 0 ((-margin:20px / 4) - 1px) */
	margin: 0 -6px;
	border: 1px solid #BBBBBB;
	border-top-width: .1rem;
	border-bottom-width: .1rem;
	background-color: white;
	-o-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	/* line:24px - ((1px + 1px) * 2) */
	line-height: 20px;
	line-height: 2.0rem;
	min-height: 20px;
	min-height: 2.0rem;
	/* 14 pt 'English' */
	font-size: 14px;
	font-size: 1.4rem;
	font-family: Helvetica, Arial, sans-serif;
}

.form .input-wrapper input:disabled,
.form .select-wrapper select:disabled,
.form .textarea-wrapper textarea:disabled,
.form .textarea-wrapper .textarea:disabled
{
	background-color: #EEEEEE;
	border-color: #EEEEEE;
	color: black;
}

.form .input-wrapper input
{
	/* line:24px - ((1px + 1px) * 2) */
	height: 20px;
	height: 2.0rem;
}

.form .select-wrapper select
{
	padding: 0;
	margin: 0 -1px;
}

.form .textarea-wrapper textarea,
.form .textarea-wrapper .textarea
{
	height: auto;
	/* line:24px */
	line-height: 24px;
	line-height: 2.4rem;
	/* ((line:24px / 2) - (1px + 1px)) */
	padding-top: 10px;
	padding-top: 1.0rem;
	padding-bottom: 10px;
	padding-bottom: 1.0rem;
	resize: vertical;
}

.form .compact input,
.form .compact select,
.form .compact textarea,
.form .compact .textarea
{
	/* 12pt 'pica' */
	font-size: 12px;
	font-size: 1.2rem;
}

.form .compact textarea,
.form .compact .textarea
{
	/* ((line:24px / 4) - (1px + 1px)) */
	padding-top: 4px;
	padding-top: .4rem;
	padding-bottom: 4px;
	padding-bottom: .4rem;
	/* line:24px * 2/3 */
	line-height: 16px;
	line-height: 1.6rem;
}

.form .input-wrapper input:focus,
.form .select-wrapper select:focus,
.form .textarea-wrapper textarea:focus
{
	border-color: #DD7777;
	outline: none;
	-o-box-shadow: 0 0 3px #BB0000;
	-moz-box-shadow: 0 0 3px #BB0000;
	-webkit-box-shadow: 0 0 3px #BB0000;
	box-shadow: 0 0 3px #BB0000;
}

.form .checkbox-wrapper input
{
	margin: 0.3em 0.3em 0 0;
}

.form input[disabled='disabled'],
.form select[disabled='disabled'],
.form textarea[disabled='disabled']
{
	background-color: #EEEEEE;
	color: black;
}

.form dl dd,
.form ul li,
.form table td
{
	overflow: hidden;
}

.form dl dd .left,
.form ul li .left,
.form table td .left
{
	float: left;
	clear: none;
	display: inline;
	margin-right: 0;
}

.form .button-wrapper
{
	display: inline-block;
}

.form .button-wrapper input,
.form .button-wrapper button
{
	display: block;
	outline: none;
	/* line:24px - (1px * 2) */
	height: 22px;
	height: 2.2rem;
	line-height: 22px;
	line-height: 2.2rem;
	/* 0 (margin:20px - 1px) */
	padding: 0 19px;
	margin: 0;
	text-align: center;
	/* 14 pt 'English' */
	font-size: 14px;
	font-size: 1.4rem;
	font-family: Helvetica, Arial, sans-serif;
	color: white;
	border: solid 1px #990000;
	border-width: .1rem;
	background: #BB0000;
	background: -moz-linear-gradient(top, #DD0000 0%, #990000 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #DD0000), color-stop(100%, #990000));
	background: -webkit-linear-gradient(top, #DD0000 0%, #990000 100%);
	background: -o-linear-gradient(top, #DD0000 0%, #990000 100%);
	background: -ms-linear-gradient(top, #DD0000 0%, #990000 100%);
	background: linear-gradient(top, #DD0000 0%, #990000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DD0000', endColorstr='#990000', GradientType=0);
}

.form .button-wrapper input:hover,
.form .button-wrapper button:hover
{
	border-color: #880000;
	background: #AA0000;
	background: -moz-linear-gradient(top, #CC0000 0%, #880000 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CC0000), color-stop(100%, #880000));
	background: -webkit-linear-gradient(top, #CC0000 0%, #880000 100%);
	background: -o-linear-gradient(top, #CC0000 0%, #880000 100%);
	background: -ms-linear-gradient(top, #CC0000 0%, #880000 100%);
	background: linear-gradient(top, #CC0000 0%, #880000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CC0000', endColorstr='#880000', GradientType=0);
}

.form .button-wrapper input:active,
.form .button-wrapper button:active
{
	border-color: #990000;
	background: #BB0000;
	background: -moz-linear-gradient(top, #990000 0%, #DD0000 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #990000), color-stop(100%, #DD0000));
	background: -webkit-linear-gradient(top, #990000 0%, #DD0000 100%);
	background: -o-linear-gradient(top, #990000 0%, #DD0000 100%);
	background: -ms-linear-gradient(top, #990000 0%, #DD0000 100%);
	background: linear-gradient(top, #990000 0%, #DD0000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#990000', endColorstr='#DD0000', GradientType=0);
}

.form p
{
	overflow: hidden
}


/* Payment
****************************************************************/

.form .payment-type
{
	/* line:24px * 1.5 */
	line-height: 36px;
	line-height: 3.6rem;
}

.form .payment-type .message
{
	/* line:24px */
	line-height: 24px;
	line-height: 2.4rem;
}

.form .payment-type input
{ margin-left: 10px; }

.form .payment-type input:first-child
{ margin-left: 0; }

.form .payment-type label img
{ margin-bottom: -10px; }

.form .input-wrapper-month select { width: 80px; }
.form .input-wrapper-year select  { width: 60px; }


/* Misc Alternate Form Styles
****************************************************************/
/*
.form .input-wrapper-alt-a1 input
{ border-bottom-style: dashed; }

.form .input-wrapper-alt-a2 input
{ border-top-style: dashed; }

.form .input-wrapper-alt-a3 input
{ border-right-style: dashed; }

.form .input-wrapper-alt-a4 input
{ border-left-style: dashed; }
*/


/* Alternate Form Style 'A'
****************************************************************/

.form-alt-a dl dt
{
	position: absolute;
	/* grid:100px + (margin:20px / 2) */
	width: 110px;
	text-align: right;
	white-space: nowrap;
}

.form-alt-a dl dt.full
{
	/* override */
	position: relative;
	width: auto;
	text-align: left;
}

.form-alt-a dl dd
{
	/* grid:100px + margin:20px + (margin:20px / 2) */
	padding-left: 130px;
	/* margin:20px / 2 */
	padding-right: 10px;
	/* 0 (-margin:20px / 2) */
	margin: 0 -10px;
}

.form-alt-a .button-wrapper
{
	float: right;
	display: inline;
	/* margin:20px / 2 */
	margin-left: 10px;
}


/* Alternate Form Style 'B'
****************************************************************/

.form-alt-b
{
	/* grid:100px / 2 */
	padding-right: 50px;
}

