/**
 * CSS styles for forms generated by yiic.
 *
 * The styles can be applied to the following form structure:
 *
 * <div class="form">
 *     <div class="row">
 *         <label for="inputid">xyz</label>
 *         <input name="inputid" id="inputid" type="text" />
 *         <p class="hint">hint text</p>
 *     </div>
 *     <div class="row">
 *         <label for="inputid">xyz</label>
 *         <input name="inputid" id="inputid" type="text" />
 *         <p class="hint">hint text</p>
 *     </div>
 *     <div class="row buttons">
 *         <label for="inputid">xyz</label>
 *         <input name="inputid" id="inputid" type="text" />
 *         <p class="hint">hint text</p>
 *     </div>
 * </div>
 *
 * The above code will render the labels and input fields in separate lines.
 * In order to render them in the same line, please use the "wide" form as follows,
 *
 * <div class="wide form">
 *     ......
 * </div>
 *
 * @author Qiang Xue <qiang.xue@gmail.com>
 * @link http://www.yiiframework.com/
 * @copyright Copyright &copy; 2008-2010 Yii Software LLC
 * @license http://www.yiiframework.com/license/
*/

div.form-container,
div.edit-form-container,
div.search-form-container,
div.grid-container
{
	padding: 0px;
	margin: 0px 0px 30px 0px;
}

div.form-container span.required,
div.edit-form-container span.required
{
	font-weight: bold;
	color: #C00C00;
}

div.form-container .buttons,
div.edit-form-container .buttons,
div.search-form-container .buttons,
div.grid-container .buttons
{
	height: 35px;
	padding: 0px;
	margin: 0px;
	overflow: visible;
}

div.buttons
{
	overflow: auto;
}

div.buttons [type=submit],
div.buttons [type=reset],
div.buttons [type=button]
{
	border: none;
	cursor: pointer;
	font-family: Arial,Helvetica,sans-serif;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	text-shadow: 1px 1px 0px rgba(0,0,0,0.25);

	-webkit-appearance: none;

	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;

	box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
}

div.buttons .button
{
	margin: 0;
	padding: 6px 16px 6px 16px;
	font-size: 120%;

}

div.buttons .button-extra-large
{
	margin: 0;
	padding: 8px 18px 8px 18px;
	font-size: 180%;
}

div.buttons .button-large
{
	margin: 0;
	padding: 7px 17px 7px 17px;
	font-size: 150%;
}

div.buttons .button-medium
{
	margin: 0;
	padding: 4px 12px 4px 12px;
	font-size: 110%;
}

div.buttons .button-small
{
	margin: 0;
	padding: 3px 9px 3px 9px;
	font-size: 100%;
}

div.buttons .button:hover,
div.buttons .button-extra-large:hover,
div.buttons .button-large:hover,
div.buttons .button-medium:hover,
div.buttons .button-small:hover
{
	text-decoration: none;
}

div.buttons .button:active,
div.buttons .button-extra-large:active,
div.buttons .button-large:active,
div.buttons .button-medium:active,
div.buttons .button-small:active
{
	position: relative;
	top: 1px;
}

div.buttons .button:disabled,
div.buttons .button-extra-large:disabled,
div.buttons .button-large:disabled,
div.buttons .button-medium:disabled,
div.buttons .button-small:disabled
{
	text-decoration: none;
	cursor: default;
}

div.buttons .left
{
	margin-right: 10px;
}

div.buttons .right
{
	margin-left: 10px;
}

/*
Button colours
*/

/* Default */
div.buttons .button, div.buttons .button-extra-large, div.buttons .button-large, div.buttons .button-medium, div.buttons .button-small { background-color: #AACCEE; color: #FFFFFF; }
div.buttons .button:hover, div.buttons .button-extra-large:hover, div.buttons .button-large:hover, div.buttons .button-medium:hover, div.buttons .button-small:hover { background-color: #336699; }
div.buttons .button:disabled, div.buttons .button-extra-large:disabled, div.buttons .button-large:disabled, div.buttons .button-medium:disabled, div.buttons .button-small:disabled { background-color: #AAAAAA; color: #EEEEEE;}
/* White */
div.buttons .button.white, div.buttons .button-extra-large.white, div.buttons .button-large.white, div.buttons .button-medium.white, div.buttons .button-small.white { background-color: #FFFFFF; color: #333333; }
div.buttons .button.white:hover, div.buttons .button-extra-large.white:hover, div.buttons .button-large.white:hover, div.buttons .button-medium.white:hover, div.buttons .button-small.white:hover { background-color: #CCCCCC; }
div.buttons .button.white:disabled, div.buttons .button-extra-large.white:disabled, div.buttons .button-large.white:disabled, div.buttons .button-medium.white:disabled, div.buttons .button-small.white:disabled { background-color: #99B2CC; color: #EEEEEE; }
/* Blue */
div.buttons .button.blue, div.buttons .button-extra-large.blue, div.buttons .button-large.blue, div.buttons .button-medium.blue, div.buttons .button-small.blue { background-color: #336699; color: #FFFFFF; }
div.buttons .button.blue:hover, div.buttons .button-extra-large.blue:hover, div.buttons .button-large.blue:hover, div.buttons .button-medium.blue:hover, div.buttons .button-small.blue:hover { background-color: #000033; }
div.buttons .button.blue:disabled, div.buttons .button-extra-large.blue:disabled, div.buttons .button-large.blue:disabled, div.buttons .button-medium.blue:disabled, div.buttons .button-small.blue:disabled { background-color: #99B2CC; color: #EEEEEE; }
/* Green */
div.buttons .button.green, div.buttons .button-extra-large.green, div.buttons .button-large.green, div.buttons .button-medium.green, div.buttons .button-small.green { background-color: #009933; color: #FFFFFF; }
div.buttons .button.green:hover, div.buttons .button-extra-large.green:hover, div.buttons .button-large.green:hover, div.buttons .button-medium.green:hover, div.buttons .button-small.green:hover { background-color: #006600; }
div.buttons .button.green:disabled, div.buttons .button-extra-large.green:disabled, div.buttons .button-large.green:disabled, div.buttons .button-medium.green:disabled, div.buttons .button-small.green:disabled { background-color: #80CC99; color: #EEEEEE; }
/* Yellow */
div.buttons .button.yellow, div.buttons .button-extra-large.yellow, div.buttons .button-large.yellow, div.buttons .button-medium.yellow, div.buttons .button-small.yellow { background-color: #FFCC00; color: #FFFFFF; }
div.buttons .button.yellow:hover, div.buttons .button-extra-large.yellow:hover, div.buttons .button-large.yellow:hover, div.buttons .button-medium.yellow:hover, div.buttons .button-small.yellow:hover { background-color: #FF9900; }
div.buttons .button.yellow:disabled, div.buttons .button-extra-large.yellow:disabled, div.buttons .button-large.yellow:disabled, div.buttons .button-medium.yellow:disabled, div.buttons .button-small.yellow:disabled { background-color: #FFE680; color: #EEEEEE; }
/* Red */
div.buttons .button.red, div.buttons .button-extra-large.red, div.buttons .button-large.red, div.buttons .button-medium.red, div.buttons .button-small.red { background-color: #CC0000; color: #FFFFFF; }
div.buttons .button.red:hover, div.buttons .button-extra-large.red:hover, div.buttons .button-large.red:hover, div.buttons .button-medium.red:hover, div.buttons .button-small.red:hover { background-color: #990000; }
div.buttons .button.red:disabled, div.buttons .button-extra-large.red:disabled, div.buttons .button-large.red:disabled, div.buttons .button-medium.red:disabled, div.buttons .button-small.red:disabled { background-color: #FEE6E7; color: #EEEEEE; }


div.form-container .errorSummary,
div.edit-form-container .errorSummary,
div.grid-container .errorSummary
{
	border: 5px solid #C00C00;
	padding: 20px 20px 20px 70px;
	margin: 0px 20px 20px 20px;
	background: #FFD4D6 url('../images/icon-error.png') no-repeat 20px 13px;

	box-shadow: 0px 10px 15px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 10px 15px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 10px 15px rgba(0,0,0,0.2);
}

div.form-container .errorSummary p,
div.edit-form-container .errorSummary p
{
	margin: 0px;
	padding: 0px;
	font-weight: bold;
}

div.form-container .errorSummary ul,
div.edit-form-container .errorSummary ul
{
	margin: 0;
	padding: 0 0 0 30px;
}

div.form-container .note,
div.edit-form-container .note,
div.search-form-container .note
{

}

div.form
{
	padding: 15px;
	margin: 0px 0px 20px 0px;
	background-color: rgba(0,0,0,0.05);
}

div.form h3
{
	color:#AAAAAA;
	margin: 0px;
	padding: 0px 0px 10px 0px;
}

div.form p
{
	color:#999999;
	margin: 0px;
	padding: 0px 0px 10px 0px;
}

div.form th
{
	background-color: #CCCCCC;
	color: #FFFFFF;
	padding: 5px;
	font-size: 100%;
	font-weight: bold;
}

div.form th.selected
{
	background-color: #336699 !important;
}

div.form th input[type=checkbox]
{
	padding: 0px;
	margin: 4px;
}

div.form input[type=text],
div.form input[type=password],
div.form input[type=submit], div.grid-form input[type=submit],
div.form input[type=file],
div.form textarea,
div.form select
{
	/*	margin: 0px;*/
	font-size: 100%;
	font-family: Arial,Helvetica,sans-serif;
	font-weight: bold;

	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

div.form input[type=text],
div.form input[type=password],
div.form textarea
{
	padding: 5px;
	border: 1px solid #EEEEEE;
	background-color: #FFFFFF;
}

div.form input[type=text].large-input,
div.form select.large-input
{
	font-size: 130%;
}

div.form input[type=text].extra-large-input,
div.form select.extra-large-input
{
	font-size: 160%;
}

div.form input[type=checkbox]
{
	margin: 10px;
}

div.form select[multiple=multiple]
{
	font-weight: normal;
}

/*
 * Disabled input styles
 */
div.form input:disabled,
div.form textarea:disabled,
div.form select:disabled
{
	color: #CCCCCC;
}

div.form select:disabled option
{
	color: #CCCCCC;
}


/* Styles for a compact (inline) radio button list */
div.form .radio-button-list-vertical
{
	padding: 3px 5px 10px 5px;
}

div.form .radio-button-list-vertical input[type=radio],
div.form .radio-button-list-vertical label
{
	color: #333333;
	display: inline;
}

div.form .radio-button-list-vertical input[type=radio]
{
	margin: 10px 3px 0px 0px;
}

div.form .radio-button-list-vertical label
{
	margin: 10px 0px 0px 0px;
	font-weight: bold;
}

/* Styles for a compact (inline) checkbox list */
div.form .checkbox-list-vertical
{
	padding: 3px 5px 10px 5px;
}

div.form .checkbox-list-vertical input[type=checkbox],
div.form .checkbox-list-vertical label
{
	color: #333333;
	display: inline;
}

div.form .checkbox-list-vertical input[type=checkbox]
{
	margin: 10px 5px 0px 0px;
}

div.form .checkbox-list-vertical label
{
	margin: 10px 0px 0px 0px;
}

div.form input[type=file]
{
	padding: 5px;
	background-color: #FFFFFF;
	border: 1px solid #EEEEEE;
}

div.form select
{
	padding: 4px;
	border: 1px solid #EEEEEE;
}

div.form fieldset
{
	border: 1px solid #DDD;
	padding: 10px;
	margin: 0 0 10px 0;
}

div.form .text
{
	display: block;
	padding: 5px 0px 5px 0px;
	font-weight: bold;
}

div.form td label,
div.form td .label
{
	color: #999999;
	padding: 5px 0px 0px 0px;
}

div.form td label
{
	display: block;
}

div.form .hint
{
	margin: 0;
	padding: 5px 0px 0px 0px;
	font-size: 90%;
	color: #CCCCCC;
}

div.form .delete-existing
{
	padding: 0px;
}

div.form .form-image
{
	padding: 5px 0px;
}

div.form div.error label,
div.form label.error,
div.form span.error
{
	color: #C00C00;
}

div.form .error input,
div.form .error textarea,
div.form .error select,
div.form input.error,
div.form textarea.error,
div.form select.error
{
	background: #FEE;
	border: 1px #C00C00 solid;
}

div.form .success input,
div.form .success textarea,
div.form .success select,
div.form input.success,
div.form textarea.success,
div.form select.success
{
	background: #E6EFC2;
	border: 1px #C6D880 solid;
}

div.form .errorMessage
{
	padding: 5px 0px 0px 0px;
	font-size: 80%;
	font-style: italic;
	color: #C00C00;
}

div.form hr
{
	margin: 10px 0px 10px 0px;
}

.changed .form
{
	background: #FEE;
}

.form-properties
{
	margin: 10px 0px 0px 0px;
	border: 1px #CCCCCC solid;
	background-color: #EEEEEE;
}

div.checkboxlist
{
	overflow: auto;
}

div.checkboxlist div
{
	width: 100%;
}

div.checkboxlist div input[type=checkbox]
{
	float: left;
}

div.fake-input
{
	margin: 0px;
	padding: 5px;
	min-height: 25px;
	border: 1px #EEEEEE solid;
	background-color: #FFFFFF;
}