/*************************************************************************
	Angulo Website
	Developed by Peter Lewis - Twobelowzero (c) 2010
	MODULE: 		forms.css
	PURPOSE:	FORM rules for website
*************************************************************************/

/* ###############   FORMS - GENERAL   ############### */
legend {
	display:none;
}
form, fieldset {
	margin:0;
	padding:0;
	border:0;
	outline: 0;
	clear:both;
}
fieldset {
	width:100%;
	margin:10px 0 20px;
}
input,
textarea,
select {
	float:left;
	padding:1px 5px 2px;
	margin:6px 0 0;
	width:300px;
	border:1px solid #d7d7d7;
	font:13px/16px Arial, Helvetica, sans-serif;
	color:#716558;
}
select {
	padding:1px;
	width:312px;
}
input:hover,
input:focus {
	background-color: #FFF;
}
input.empty,
textarea.empty {
	color:#AB9E8E;
}
label {
	float:left;
	clear:both;
	text-align:right;
	color:#716558;
	width:180px;
	line-height:21px;
	margin:6px 5px 0;
}
.checkbox input,
.radio input {
	width:auto;
	margin-right:10px;
	margin-top:4px;
}
label.checkbox,
label.radio {
	text-align:left;
}

/* ###############   BUTTONS - DEFAULT   ############### */
button.disabled {
	cursor:default;
}
button {
	border:none;
	background:none;
	clear:both;
	width:auto;
	overflow:visible;
	text-align:center;
	white-space:nowrap;
	float:right;
	margin:8px 0 0;
	cursor:pointer;
}
button,
button span,
button em {
	line-height:32px;
	padding:0;
	color:#FFF;
	font-weight:bold;
	font-style:normal;
}
button.small,
button.small span,
button.small em {
	line-height:26px;
	font-weight:normal;
}
button span,
button em {
	display:block;
	margin:0;
}
button span {
	padding-left:10px;
	background:#A42238 url(/themes/site_themes/angulo/images/big-button.png) no-repeat scroll left top;
}
button em {
	padding-right:10px;
	background:transparent url(/themes/site_themes/angulo/images/big-button.png) no-repeat scroll right top;
	font-size:100.01%;
	font-weight:bold;
	text-transform:uppercase;
}
button.small span {
	background:#A42238 url(/themes/site_themes/angulo/images/small-button.png) no-repeat scroll left top;
}
button.small em {
	background:transparent url(/themes/site_themes/angulo/images/small-button.png) no-repeat scroll right top;
}
button:hover span { background-color:#e76e34; background-position:0px -32px; }
button:hover em { background-position:100% -32px; }
button.disabled:hover span { background-color:#A42238; background-position:0px 0px; }
button.disabled:hover em { background-position:0px 0px; }
button.small:hover span { background-position:0px -26px; }
button.small:hover em { background-position:0px -26px; }


.content .text-block form .full-width {
	width:auto;
	margin:0 0 0 190px;
	clear:both;
	display:block;
}
.price {
	color:#E66E31;
	font-size:140%;
	float:right;
}
#captcha-question {
	text-align:left;
	float:left;
	line-height:21px;
	margin:6px 0 0 2px;
}


/* ###############   SEARCH   ############### */
#sitesearch {
	float:right;
	z-index:2;
	margin-top:-30px;
	width:230px;
}
#sitesearch fieldset {
	margin:0;
}
#sitesearch label {
	display:none;
}
#sitesearch input {
	border:1px solid #E3E3E3;
	color:#E3E3E3;
	width:180px;
    float:left;
}
#sitesearch input:hover,
#sitesearch input:focus {
	color:#746F6B;
}
#sitesearch button {
	border:1px solid #E3E3E3;
	color:#746F6B;
    float:right;
    margin-top:-20px;
    position:relative; 
    z-index:3;
}


/* ###############   NEWSLETTER   ############### */
#newsletter form {
	padding:3px 0 0; 
}
#newsletter label {
	width:48px;
	margin-left:0;
}
#newsletter input {
	width:150px;
	border:1px solid #d7d7d7;
	background-color: #F4EEE6;
}
#newsletter form a {
	float:left;
	font-size:11px;
	line-height:23px;
	color:#736357;
	text-decoration:none;
	margin:10px 0 0 52px;
}
#newsletter form a:hover {text-decoration:underline;}

#newsletter button,
#newsletter button span,
#newsletter button em {
	line-height:23px;
	clear:none;
}
#newsletter button span {
	background:#32740F url(/themes/site_themes/angulo/images/brown-button.png) no-repeat scroll left top;
}
#newsletter button em {
	background:transparent url(/themes/site_themes/angulo/images/brown-button.png) no-repeat scroll right top;
}
#newsletter button:hover span { background-color:#e76e34; background-position:0px -24px; }
#newsletter button:hover em { background-position:100% -24px; }
#newsletter button.disabled:hover span { background-color:#A42238; background-position:0px 0px; }
#newsletter button.disabled:hover em { background-position:100px 0px; }


#newsletter #send-to-friend {
	display:block;
	background: transparent url(/themes/site_themes/angulo/images/send-to-friend.png) no-repeat;
	height:67px;
	overflow:hidden;
	text-indent:-9999px;
	margin:22px 0 0 38px;
}
#newsletter #send-to-friend:hover { background-position:0 -67px; }


/* ###############   REGISTER, LOGIN & UPDATE FORMS   ############### */
#newsletter-toggle-label {
	text-align:left;
	width:auto;
	margin: 0 0 0 167px;
}
.content .text-block p.agreement {
	clear:both;
	float:none;
	display:block;
	padding:20px 0 0;
	text-align:center;
	margin:0;
}
.content .text-block .password-reminder {
	clear:both;
	float:left;
	margin:14px 0 0 190px;
}
.content .text-block #login-form button,
.content .text-block #change-password,
.content .text-block #user-details-form button,
.content .text-block #register-form button {
	clear:right;
	margin-right:109px;
}
#sign-in-page #show-register {
	display:none;
}
#sign-in-page #show-register a {
	margin-right:112px;
}
#change-password {
	display:none;
}
#logout-form {
	float:right;
	margin-left:40px;
	margin-top:-62px;
	position:absolute;
}


/* ###############   CONTACT FORM   ############### */
#contact-form {
	margin-bottom:20px;
}
#contact-form .datepicker-label {
	background: transparent url(/themes/site_themes/angulo/images/calendar-icon.gif) no-repeat right 2px;
	padding-right:20px;
	cursor:pointer;
	width:477px;
}
#contact-form .datepicker-label input {
	margin:0 0 0 1px;
	float:none;
	width:280px;
}
#contact-form #newsletter-label {
	margin-left:190px;
	text-align:left;
	width:360px;
}
#contact-form #newsletter-signup {
	float: none;
	width:20px;
}
#contact-form .option-group {
	margin:0 80px 0 0;
	width:auto;
clear:none;
}
#contact-form .option-group label {
	width:80px;
	cursor:pointer;
	clear:none;
}
#contact-form .option-group input {
	width:20px;
	height:21px;
	margin-right:50px;
}
#contact-form #captcha-question {
	margin-left:33px;
}
#contact-form .actions a {
	margin:15px 0 0 190px;
	float:left;
}
#contact-form button {
	margin-right:110px;
}


/* ###############   BOOKING - TUITION/LESSONS   ############### */
fieldset.additional {
	background-color:#F1EEE9;
	padding:10px;
}
fieldset.additional ul {
	margin:0;
	padding-left:20px;
}
fieldset.additional h5,
fieldset.additional p {
	margin:0;
}
.content .left,
.content .right {
	width:306px;
	margin-bottom:10px;
}
.content .left {
	border-right:2px solid #F3F3F3;
	float:left;
}
.content .right {
	float:right;
	clear:none;
}
.book-lesson-form .packages {
	margin:10px 0;
}
.book-lesson-form .packages label {
	float:none;
	font-size:18px;
	font-weight:bold;
	text-transform:uppercase;
	width:auto;
	margin:0;
}
.book-lesson-form .box {
	margin:10px;
	padding:10px 10px 0;
	background-color:#F3F3F3;
	border:1px solid #D9D9D9;
	cursor:pointer;
}
.book-lesson-form .packages p {
	margin:0.5em 0 10px;
}
.book-lesson-form .packages input {
	width:20px;
	float:right;
	margin:5px 0 0;
	cursor:pointer;
}
.book-lesson-form .activities {
	border:none;
}
.book-lesson-form .activities p {
	font-weight:bold;
	margin:0;
}
.book-lesson-form .activities span {
	font-weight:normal;
	color:#E66E31;
}
.book-lesson-form .activities label {
	width:auto;
	margin-top:3px;
}
.book-lesson-form .activities #other-activity-label {
	margin-left:7px;
}
.book-lesson-form .activities input {
	width:22px;
	margin-top:4px;
}
.book-lesson-form .activities textarea {
	width:276px;
	height:33px;
	margin:2px 0 10px 8px;
}
.book-lesson-form .options input {
	width:75px;
}
.book-lesson-form .options select {
	width:87px;
}
.content  .text-block .book-lesson-form .price {
	clear:both;
	margin:10px 20px 10px 0;
}


/* ###############   BOOKING - KIT   ############### */
#kit-prices input {
	width:88px;
}
#kit-prices select {
	width:100px;
}
#kit-prices .price {
	margin:10px 16px 0;
}
#kit-prices .options input {
	width:25px;
}
#kit-prices .options label {
	width:285px;
	text-align:left;
}


/* ###############   BOOKING - CLINICS   ############### */
#ui-datepicker-div {
	font-size:90%;
}
.ui-datepicker-trigger {
	cursor:pointer;
}
.book-clinic-form #people {
	width:50px;
}



/* ###############   BOOKING - SIDE MODULE   ############### */
.sidebar #login-module form {
	background:transparent url(/themes/site_themes/angulo/images/sideblock.gif) no-repeat scroll 0 100%;
	margin:0 0 8px;
	overflow:hidden;
	padding:0 0 12px;
}
.sidebar #login-module input {
	width:195px;
	float:right;
}
.sidebar #login-module label {
	width:70px;
	margin-right:0;
}
.sidebar #login-module button {
	clear:none;
}
.sidebar #login-module .password-reminder {
	float:left;
	clear:both;
	margin:14px 0 0;
}
.sidebar .booking .date fieldset {
	margin:0;
}
.sidebar .booking .date {
	border:1px solid #DADADA;
	margin:10px 0 0;
	padding:5px 5px 5px 10px;
}
.sidebar .booking .date p {
	color:#716558;
	margin:0;
	clear:left;
	float:left;
	width:130px;
}
.sidebar .booking #booking-dates-form .remove-date {
	display:none;
	float:right;
	margin:0;
}
.sidebar .booking .remove-item {
	display:none;
	float:right;
	margin:0;
	line-height:1.2em;
}
.sidebar .booking .date h4 {
	margin:1px 0 2px;
}
.sidebar .booking .date img {
	float:right;
	padding-top:5px;
}
.sidebar .booking #booking-dates-form div {
	display:block;
	min-height:18px;
	width:200px;
}


/* ##########   IFRAME   ########## */
#iFrame label {
	width: 120px;
}
#iFrame input, #iFrame textarea, #iFrame select {
	width:230px;
}


/* ###############   VALIDATION   ############### */
#contact-form label.error,
#newsletter label.error,
#login-form label.error,
#forgot-password-form label.error,
#register-form label.error,
#emailfriendForm label.error,
label.error {
	color:#BF0449;
	margin:0 0 5px;
	text-align:right;
	line-height:16px;
	width:502px;
}
#newsletter label.error,
#login-form label.error {
	width:100%;
}
#sitesearch label.error {
	line-height:16px;
	margin:28px 0 0;
	position:absolute;
	width:230px;
	text-align:left;
}
#emailfriendForm label.error {
	width:375px;
}
#sitesearch input.error,
#newsletter input.error,
#contact-form input.error,
#contact-form textarea.error,
#login-form input.error,
#register-form input.error,
form input.error,
form select.error {
	border:1px solid #BF0449;
	margin-bottom:0;
}
.form-success {
	clear:both;
	display:none;
	font-weight:bold;
	color:#E66E31;
}
#newsletter .form-success {
	color:#736357;
}
#login .form-success,
#register .form-success {
	text-align:center;
	margin-top:50px;
}