/* SVN FILE: $Id: framework.form.css 3124 2011-12-07 20:13:44Z dwu $ */
/**
 * IPRO Framework Global CSS
 * 2009 David Wu, IPRO
 */
  
/* Forms specific css
*/

/**
 * Submit input buttons and link buttons are standardized
 */ 
input.button, a.button {
	z-index: 10;
	position: relative;
	display: inline-block; 
	margin: 0px;
	padding: 3px 5px;
	font: 14px Arial, Sans-serif;

	border:3px double #A6C9E2;
	padding:2px;
	color: #666;
	
	text-transform: capitalize;
	background: white;
	text-decoration: none;
}

/*
* the same buttons as the above but with margins
*/
input.button.spaced, a.button.spaced {margin:3px;}
.align_right {float:right;clear:right;}
.align_left {float:left;clear:left;}

input.button:hover, a.button:hover {
	cursor:pointer;
	border:3px double #FFF;
	background: transparent url(/css/theme/images/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 0 center;
	padding:2px;
	color: #FFF;
}

fieldset {
	padding: 10px 15px 10px 15px;
	border: solid 1px #CCC;
	margin-bottom: 1.6em;
}
input, select {
	font-size: 12px;
}

/**
 * Wrapper div for submit buttons
 */
.submit-buttons {
	padding-top: 5px;
}

/**
 * Add a parent class of .stack if you want labels to 
 * appear ABOVE the input box
 */
.stack .input label, .stack .input.radio label.label {
	float: none;
	width: 100%;
	text-align: left;
	padding-top: 5px;
}

/**
 * By default labels appear to the left of inputs using the standard
 * CakePHP form helper.
 */
.input label, .input.radio label.label, .no-stack .input label, .no-stack .input.radio label.label  {
	padding-right: 5px;
	width: 20%;
	display: block;
	float: left;
	text-align: right;
	padding-top: 0px;
}



.input {
	overflow: hidden;
	padding-bottom: 5px;
}

.input input, .input select {
	width: 70%;
	margin-left: 0;
}

.stack .input input, .stack .input select {
	width: 95%;
}

.input.checkbox input {
	margin-left: 5px;
}

.input.checkbox input, .input.radio input {
	width: auto;
}


.longlabel .input label, .longlabel .input.radio label.label, .longlabel  .no-stack .input label, .longlabel .no-stack .input.radio label.label  {
	width: 30%;
}

.longlabel .input input, .longlabel .input select {
	width: 60%;
}

/**
 * Some quick classes to format the size of inputs
 */
.auto, .input .auto {
	width: auto !important;
}
.tiny, .input .tiny {
	width: 10%;
}

.short, .input .short, .quarter-size {
	width: 25%;
}

.medium, .input .medium, .half-size {
	width: 50%;
}

.long, .input .long {
	width: 75%
}

.input.checkbox label, .input.radio label {
	float: none;
	display: inline;
}

.input.checkbox {
	margin-left: 20%;
}

.stack .input.checkbox {
	margin-left: 0;
}

.input.radio label, .input.checkbox label {
	padding-left: 3px;
}


select {
	width: 75%;
}

/** 
 * Cake date fields
 */
.input.date select{
	width: auto;
}

/**
 * A list of checkboxes 
 */
.checkbox-list {
	margin-left: 20%;
}
.checkbox-list.no-indent {
	margin-left: 0;
}
.checkbox-list div.checkbox-list {
	margin-left: 0px;
	overflow: hidden;
}
.checkbox-list .checkbox-option {
	width: 33%;
	float: left;
}

.input.radio fieldset label, .input.radio fieldset input {
	float: left;
	text-align: left;
}
.input.radio fieldset label {
	width: 30%;
	padding-left: 2px;
	height: 25px;
}


label {
	font-weight: bold;
}



/* !Validation errors appear with this style when they fail 
 * while using jquery validator
 */
.input label.error {
	width: 100%;
	text-align: left;
	margin-left: 20%;
	padding-left: 5px;
	color: #990000;
}
.input.error {
	background: #FF9900;
}

div.error-message, label.form-error {
	color:  #990000;
}

.input label.form-error {
	width: auto;
	clear: left;
}

.asterisk {
	color: #990000;
}


/* !Prefilled fields
 * Use this when displaying fields that have "default" data that the 
 * user overrides.
 */
.sampleprefill {
	color: #666666;
}

/* !Input Brick
 * stacked liquid brick layout for form input used to augment float-left
 */
.input-brick {
	padding: 10px;
	width: 430px;
	height: 150px;
	margin: 5px;
	border: 1px solid #ddd;
	background-color: #fff;
}

.input-brick div {
	background-color: #fff;
	padding: 5px;
}

.input-brick label {
	width: 115px;
}

.sim_validate_response {
	padding: 5px;
	margin: 5px;
	background-color: transparent;
}

/* !CKEditor styles */
.input.textarea .cke_wrapper {
	width: 71%;
}
.stack .input.textarea .cke_wrapper {
	width: 95%;
}

/* !OpenID Styles
 */
#openid_logo {
	position: relative;
	top: 7px;
	background-color: #fff;
	padding: 2px;


	border: 1px solid #B2C7D7;
}
