/**
 * Common front-end style elements
 *
 * @package 	DigiCMS v3.x
 * @file		style/shared/common.css
 * @version		3.0.0
 * @author		Digitalization
 * @email		info@digitalization.nl
 * @link		http://www.digitalization.nl/
 * @copyright	All code copyright 2009,2010 by Digitalization
 */

/* GENERAL *********************************************************************************************************************/

.clear {
	clear: 				both;
}

.no_clear {
	clear:				none;
}

.float {
	float:				left;
}

.no_float {
	float:				none;
}

/* MESSAGES ********************************************************************************************************************/

/* Messages */
p.message {
	font-style:			italic;
}

/* Error messages */
p.error {
	color:				red;
}

/* ABBREVATIONS AND ACRONYMS ***************************************************************************************************/

abbr, acronym, span.help {
  	border-bottom: 		1px dotted #333;
  	cursor: 			help;
}

/* FORM ELEMENTS ***************************************************************************************************************/

fieldset {
	padding:			10px;
}

/* Labels */
label.label {
	width:				165px;
	float:				left;
	clear:				left;
	height:				18px;
	padding-top:		4px;
	margin-right:		10px;
}

label.large {
	width:				225px;
	float:				left;
	clear:				left;
	height:				18px;
	padding-top:		4px;
	margin-right:		10px;
}

label.radio {
	float:				left;
	margin-left:		5px;
	margin-bottom:		2px;
}

label.checkbox {
	float:				left;
	margin-left:		5px;
	margin-bottom:		2px;
}

label.missing {
	color:				red;
}

label.after {
	float:				left;
	margin-left:		5px;
	height:				15px;
	padding-top:		5px;
	font-size:			10px;
	color:				gray;
}

/* Input elements common properties */
input, select, textarea, button, option {
	font-family: 			Arial, Helvetica, sans-serif;
	color: 					#000000;
	font-size: 				12px;
	margin-bottom: 			1px;
	margin-top: 			1px;
	float:					left;
}

/* Textarea */
textarea {
	border: 				1px solid #aaaaaa;
	width: 					419px;
	height: 				120px;
	padding: 				2px;
 	clear:					left;
 	line-height:			15px;
	resize:					none;
}

textarea.small {
	width:					244px;
	height:					92px;
}

/* Selectbox and options */
select {
 	border: 				1px solid #aaaaaa;
	width: 					250px;
	height: 				20px;
	padding: 				1px;
}

select.large {
	width:					425px;
}

select.medium {
	width:					170px;
}

select.small {
	width:					60px;
}

option {
	padding: 				1px;
	padding-left: 			5px;
}

optgroup {
	font-family: 			Arial, Helvetica, sans-serif;
	color: 					#000000;
	font-size: 				12px;
	font-style:				normal;
}
optgroup option {
	padding-left: 			10px;
}

option.bordered {
	border-bottom:			1px solid black;
	padding-bottom: 		3px;
}

/* Text type inputs */
input.regular, input[type='text'], input[type='password']  {
 	border: 				1px solid #aaaaaa;
	width: 					244px;
	height: 				14px;
	padding: 				2px;
}

input.small {
	width: 					54px;
}

input.medium {
	width: 					164px;
}

input.large {
	width: 					419px;
}

/* File input */
input.file, input[type='file'] {
	width: 					231px;
	padding: 				2px;
}

/* Checkboxes and radio buttons */
input[type='checkbox'], input[type='radio'] {
	margin-top:				1px;
	margin-left: 			4px;
	clear:					both;
}

input.no_clear {
	clear:					none;
}

/* Buttons (too specific, interferes with site CSS often, so just here as a reference) */
/*button, input.submit, input[type='submit'], a.button {
	border: 				3px double 	#999999;
	border-top-color: 		#cccccc;
	border-left-color: 		#cccccc;
	background:				#ffffff url(../../images/system/button_bg.gif) repeat-x;
	cursor:					pointer;
	padding-top:			1px;
	padding-bottom:			1px;
	padding-left:			10px;
	padding-right:			10px;
	font-size:				11px;
	font-weight: 			bold;
	margin-right:			10px;
	-moz-border-radius:		5px;
  	-webkit-border-radius:	5px;
}

a.button, a.button:hover {
	color:					black;
	display:				inline-block;
	text-decoration:		none;
	float:					left;
	margin-top:				1px;
}*/

/* EXTRA FORM ELEMENTS ************************************************/

/* Form container, fixed width fixed IE floating problems... */
div.form_container {
	width:				425px;
}

/* A generic vertical spacer */
div.spacer {
	clear:				left;
	height:				22px;
}

/* This sub-container is to keep multi-line values aligned properly */
div.input_container, div.input_container_wide {
	float:				left;
}
div.input_container_wide {
	width:				100%;
}

/* Div placeholder to put some contents after in input element */
div.after_input {
	float:				left;
	margin-left:		5px;
	height:				20px;
	padding-top:		4px;
}

div.after_input img.digicon {
	float:				none;
}

/* Div placeholder to put under an input element. Both must be contained in an input container. */
div.under_input {
	clear:				left;
	float: 				left;
	margin-top: 		3px;
}

div.under_input select, div.under_input input {
	float:				none;
}

div.under_input img.digicon {
	margin-top:			2px;
}

div.under_input a.digicon {
	margin-top:			2px;
}

/* This small div is used as a filler between small and medium inputs */
div.fill {
	float:				left;
	width:				2px;
	font-size:			2px;
}

/* Note after an input */
div.note {
	float:				left;
	margin-left:		5px;
	height:				17px;
	padding-top:		5px;
	font-size:			10px;
	color:				gray;
}

/* Editor instances are placed in this div */
div.editor_container {
	clear:				left;
}

/* Upload limits warning */
div.upload_limits {
	font-size:			11px;
	font-weight:		bold;
}

/* This div holds the property title when viewing an item */
div.property {
	clear:				left;
	float:				left;
	width:				165px;
	margin-right:		10px;
	height:				20px;
}

/* This div holds the value when viewing an item */
div.value {
	float:				left;
	width:				500px;
}

div.side_by_side_left div.value, div.side_by_side_right div.value {
	width:				250px;
}

/* EXTRA ELEMENTS ************************************************/

/* Benchmark and error divs */
div#benchmark, div#errors {
	font-family: 		Verdana;
	font-size: 			11px;
	position:			absolute;
	left: 				50%;
	top: 				50%;
	padding: 			20px;
	margin-left: 		-470px;
	width: 				900px;
	margin-top: 		-250px;
	height: 			450px;
	overflow: 			auto;
	z-index:			101;
	border:				3px solid black;
	background:			white;
}