/* @override http://council-ideabox.site/style/form.css */

/******* CSS1 *******/
/* Non table layout */
fieldset p {
	margin:2px 0; padding:0 0 0 150px;
	font-size:12px; line-height:24px; clear:left;
}
fieldset p label {
	margin-left:-150px; width:150px;
	float:left; display: inline;
	color:#333; font-weight: bold; line-height:24px;
}
fieldset p span {
	color:#333; font-size:12px;
	margin-left:6px; line-height:1.2em;
}

/* Field set */
fieldset {
	padding:10px; margin:0 0 15px;
	background:#F7F7F7;
	border:1px solid #CCC;
	border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;
}
fieldset legend {
	font-size:12px;
}

/* Field icons */
input.mail {
	background:#FFF url(images/mail.png) no-repeat left;
	padding-left:21px;
}
input.phone {
	background:#FFF url(images/phone.png) no-repeat left;
	padding-left:21px;
}
input.postalcode {
	background:#FFF url(images/postalcode.png) no-repeat left;
	padding-left:21px;
}
input.yen {
	background:#FFF url(images/yen.png) no-repeat left;
	padding-left:21px;
	text-align:right;
}

/* Search field */
input.search {
	background:#FFF url(images/search.png) no-repeat left;
	padding-left:21px;
}
input.init { color:#AAA; }

/* Switch button */
input.switch {
	position:absolute; left:-9999px;
}
label.switchOff,
label.switchOn {
	width:auto; float:none; margin-left:auto; font-weight:normal;
	padding:3px 0 3px 55px;
	background-position:left;
	background-repeat:no-repeat;
}
label.switchOff { background-image:url(images/switch-off.gif) }
label.switchOn { background-image:url(images/switch-on.gif) }

/* Large Button */
button {
	margin:0 3px 0 0; padding:0; width:180px;
	border-width:1px; border-style:solid;
	border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;
	border-color:#707070;
	background:#F7F7F7 url(images/large-button.png) top repeat-x;
}
button h6 {
	margin:0; padding:7px;
	font-size:16px; font-weight:normal; color:#333;
	line-height:1em;
}
button p {
	margin:0; padding:3px; width:175px;
	font-size:10px;
}
button:hover {
	border-color:#3C7FB1; 
	background:#EAF6FD url(images/large-button-hover.png) top repeat-x;
}

/******* CSS2 *******/
/* Button */
.button,
input[type="button"],
input[type="submit"] {
	display:block;
	border-width:1px; border-style:solid;
	border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px;
	border-color:#707070;
	background:url(images/button.png) center repeat-x;
}
input[type="button"]:hover,
input[type="submit"]:hover {
	border-color:#3C7FB1;
	background:url(images/button-hover.png) center repeat-x;
}
input[type="button"][disabled]:hover,
input[type="submit"][disabled]:hover {
	border-color:#707070;
	background:url(images/button.png) center repeat-x;
}

/* Text box */
input[type="text"],
input[type="password"] {
	background-color:#FFF;
	border-width:1px; border-style:solid;
	border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px;
	border-color:#ABADB3 #DBDFE6 #E3E9EF #E2E3EA;
}
input[type="text"]:hover,
input[type="text"]:focus,
input[type="password"]:hover,
input[type="password"]:focus {
	border-color:#5794BF #B7D5EA #C7E2F1 #C5DAED;
}

/* Selector */
select {
	-webkit-appearance:none; line-height:22px;
	border-width:1px; border-style:solid;
	border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px;
	border-color:#ABADB3 #DBDFE6 #E3E9EF #E2E3EA;
	background:#FFF url(images/select.png) right no-repeat;
}
select:hover {
	border-color:#5794BF #B7D5EA #C7E2F1 #C5DAED;
	background-image:url(images/select-hover.png);
}

/* Checkbox and radio button */
/*
input[type="checkbox"],
input[type="radio"] {
	position:absolute; left:-9999px;
}
label.checkOff,
label.checkOn,
label.radioOff,
label.radioOn {
	width:auto; float:none; margin-left:auto; font-weight:normal;
}
label.checkOff[class],
label.checkOn[class],
label.radioOff[class],
label.radioOn[class] {
	padding:1px 0 1px 17px;
	background-position:left; background-repeat:no-repeat;
}
label.checkOff[class] { background-image:url(images/check-off.gif) }
label.checkOff[class]:hover { background-image:url(images/check-off-hover.gif) }
label.checkOn[class] { background-image:url(images/check-on.gif) }
label.checkOn[class]:hover { background-image:url(images/check-on-hover.gif) }
label.radioOff[class] { background-image:url(images/radio-off.gif) }
label.radioOff[class]:hover { background-image:url(images/radio-off-hover.gif) }
label.radioOn[class] { background-image:url(images/radio-on.gif) }
label.radioOn[class]:hover { background-image:url(images/radio-on-hover.gif) }
*/

.switch button { background-color : #FFFFFF; cursor : pointer; }
.switch button  p { color : #000000; font-weight:normal; }

.switch .selected { background-color : #006699 }
.selected  p { color : #FFFFFF; font-weight:bold; }