/* @override http://localhost/picsengine3/dev/admin/public/css/others.css */

/* @group page */
#head {
	background: #1b1b1b;
	overflow: auto;
	padding: 10px;
}
#head h1 {
	float: left;
	color: #FFF;
	font: 20px "Trebuchet MS";
	font-weight: normal;
	overflow: auto;
}
#head h1 a {
	color: #777777;
	font-size: 11px;
	text-decoration: none;
}
#head h1 a:hover {
	color: #FFFFFF;
}
#head h1 a, #head h1 span {
	float: left;
	clear: left;
}
#logo {
	clear: right;
	float: right;
	display: block;
	width: 86px;
	height: 23px;
	background: url('../src/logo.gif') no-repeat;
}
#logo span {
	display: none;
}

#page {
	overflow: auto;
}
.left {
	float: left;
	width: 500px;
	padding: 20px;
	overflow: auto;
}
.left h2 {
	color: #FFF;
}
.left ul {
	padding: 5px 0 5px 10px;
	list-style-position: inside;
}
.left p {
	clear: left;
	white-space: normal;
	overflow: hidden;	
}
.right {
	float: left;
	width: 250px;
	padding-top: 20px;
	overflow: auto;
}
.right h3 {
	color: #FFF;
}
/* @end */



/* @group buttons */

a.button, a.button span, a.button:hover {
	display: block;
	height: 36px;
	text-decoration: none;
}
a.button:hover { color: #FFF; }
a.button {
	float: left;
	font-size: 12px;
	color: #FFF;
	background: url('../src/button_left.png') no-repeat;
}
a.button span {
	float: left;
	background: url('../src/button_right.png') no-repeat top right;
}
a.button span span {
	margin: 0 10px 0 10px;
	padding: 5px 6px 0 6px;
	height: 31px;
	background: url('../src/button_center.png') repeat-x;
}
a.button:active, .button.active { background: url('../src/button_active_left.png') no-repeat; }
a.button:active span, .button.active span { background: url('../src/button_active_right.png') no-repeat top right; }
a.button:active span span, .button.active span span { background: url('../src/button_active_center.png') repeat-x; }

a.button.disabled { cursor: default; color: #808080; }

.button_next_previous {
	display: block;
	height: 36px;
	overflow: auto;
}
.button_next_previous a.previous, .button_next_previous a.next {
	display: block;
	float: left;
	width: 41px;
	height: 36px;
	background: url('../src/button_previous.png') no-repeat;
}
.button_next_previous a.next { background: url('../src/button_next.png') no-repeat; }
.button_next_previous a:active.previous { background: url('../src/button_active_previous.png') no-repeat; }
.button_next_previous a:active.next { background: url('../src/button_active_next.png') no-repeat; }

/* @end */



/* @group inputs */

.input {
	background: url('../src/input_left.png') no-repeat;
	height: 24px;
}
.input div {
	background: url('../src/input_right.png') no-repeat top right;
	height: 24px;
}
.input div div {
	float: left;
	display: inline;
	margin: 0 10px 0 10px;
	padding-right: 1px;
	background: url('../src/input_center.png') repeat-x;
}
.input div div input {
	background: transparent;
	border: 0;
	margin: 0 -10px 0 -10px;
	padding: 4px;
	color: #FFF;
	font-size: 12px;
}

/* @end */


/* @group form */
.form {
	overflow: auto;
	padding: 20px 0 10px 0;
}
.form label {
	clear: left;
	float: left;
	font-size: 12px;
	color: #FFF;
	width: 200px;
	text-align: right;
	padding: 4px 10px 10px 0;
}
.form label span {
	font-size: 11px;
	color: #5e5e5e;
}
.form .value {
	float: left;
	padding-bottom: 5px;
}
.form .value input {
	width: 250px;
}

.error {
	float: left;
	width: 400px;
	color: #FFF;
	font-size: 12px;
	text-align: right;
	padding-top: 5px;
	padding-right: 10px;
}
/* @end */