@charset "utf-8";
/*==============================================================================
BACKENDERO SCREEN CSS

# CONTENT OF CSS
-------------------------
01. LIBRARIES IMPORT
02. GLOBAL
03. TYPOGRAPHY AND COLORS
04. LINKS
05. HEADERS
06. TABLES
07. FORMS
08. NAVIGATION
09. STRUCTURE
10. LOGIN
11. OTHER
==============================================================================*/

/* LIBRARIES IMPORT
==============================================================================*/
@import url("reset.css");

/* GLOBAL
==============================================================================*/
.noscreen {
	display: none;
}

.cleaner {
	clear: both;
	line-height: 0px;
	font-size: 0px;
}

.floatleft {
	float: left;
}

.floatright {
	float: right;
}

.nofloat {
	float: none;
}

.textleft {
	text-align: left;
}

.textright {
	text-align: right;
}

.textcenter {
	text-align: center;
}

.textjustify {
	text-align: justify;
}
 
.bold {
	font-weight: bold;
}

.italic {
	font-style: italic;
}

.underline {
	border-bottom: 1px solid;
}

.imgleft {
	float: left;
	margin: 4px 10px 4px 0;
}

.imgright {
	float:right;
	margin: 4px 0 4px 10px;
}
 
.nopadding {
	padding: 0;
}

.noindent {
	margin-left: 0;
	padding-left: 0;
}

.nobullet {
	list-style: none;
	list-style-image: none;
}

/* TYPOGRAPHY AND COLORS
==============================================================================*/
body {
	font-size: small;
	font-family: arial, tahoma, verdana, sans-serif;
	text-align: center;
	color: #242424;
	background: #ffffff url(../design/web-bg.gif) repeat-x;
}

p {
	line-height: 1.4em;
}

p, ul, ol {
	padding: 0 0 1.25em 0;
}
 
ul, ol {
	padding: 0 0 1.25em 2.5em;
	line-height: 1.5em;
}

ul {
	list-style-type: disc;
}

ol {
	list-style-type: decimal;
}

small {
	font-size: 0.85em;
}

.highlight {
	background: #ffc;
}

/* LINKS
==============================================================================*/
a {
	color: #f6570b;
}

a:hover {
	color: #f6570b;
}

/* HEADERS
==============================================================================*/
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}
 
h1 {
	float: left;
	padding: 0 0.25em 0.1em 0;
	font-size: 2em;
}

h1 a {
	color: #fff;
	text-decoration: none;
}

h1 a:hover {
	color: #fff;
	text-decoration: none;
}

h2 {
	float: left;
	padding: 0 0 1em 0;
	letter-spacing: 0;
	font-size: 2em;
	color: #f6570b;
}
 
h3 {
	font-size: 1.8em;
	padding: 1em 0;
	color: #f6570b;
}

h4 {
	font-size: 1.4em;
	padding: 1em 0;
	color: #6e6e6e;
}

h5 {
	font-size: 1.2em;
	font-weight: bold;
	padding: 1em 0;
	color: #8d8d8d;
}

h6 {
	font-size: 1em;
	font-weight: bold;
	padding: 1em 0;
	color: #8d8d8d;
}

/* TABLES
==============================================================================*/
table {
	margin: 0 0 0 0;
	border-spacing: 1px;
	border: 1px solid #cccccc;
	width: 100%;
}

th, td, caption {
	padding: 0.5em;
}


caption {
	color: #fff;
	background: #007592;
}

th, th a, th a:hover {
	color: #fff;
	font-weight: bold;
	text-align: center;
	background: #6e6e6e;
}

th a.asc {
	padding-right: 10px;
	background: url(../design/sort-asc.gif) 100% 50% no-repeat;
}

th a.asc:hover {
	background: url(../design/sort-desc.gif) 100% 50% no-repeat;
}

th a.desc {
	padding-right: 10px;
	background: url(../design/sort-desc.gif) 100% 50% no-repeat;
}

th a.desc:hover {
	padding-right: 10px;
	background: url(../design/sort-asc.gif) 100% 50% no-repeat;
}

td {
	background: #f0f0f0;
}

tr.odd td {
	background: #f7f7f7;
}

/* FORMS
==============================================================================*/
form {
  width: 100%; 
}

form label, form .textbox, select, textarea, form .container {
  display: block;
  float: left;
  width: 200px;
  margin: 3px 0;
  padding: 2px 5px;
}

form .container {
	width: auto;
}

form .textbox, select, textarea, checkbox {
	border: 1px solid #cccccc;	
}

form select {
  width: 214px;
}

form textarea {
  height: 200px;
}

form label {
  width: 105px;
  padding-right: 15px;
  text-align: right;
}

form .container label {
  float: none;
  display: inline;
  width: auto;
  padding: 0 1em 0 0;
  text-align: left;
}

form br {
  clear: left;
}

form input.submit {
  padding: 1em;
}

form fieldset {
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid #cccccc;
}

form legend {
  padding: 0.5em;
  color: gray;
  font-weight: bold;
  background: #E8E8E8;
}

form fieldset.noframe {
  padding: 0;
  margin-bottom: 0;
  border: none;
}

form input.radio {
  width: 15px;
  margin-left: 160px;
}

form .formbutton {
	float: right;
	padding: 0.5em 1em;
	margin-bottom: 10px;
}

form .readonly{
	color: #6e6e6e;
	background: #f0f0f0;
}

form .instructions {
	padding: 0.5em;
	margin: 10px 0;
	border: 1px solid #ededb3;
	background: #ffffcc;
}

/* widths and heights inputs */
form .wider {
	width: 610px;
}

form .wide {
	width: 450px;
	font-size:  
}

form select.wide {
	width: 460px;
}

form .narrow {
	width: 110px;
}

form select.narrow {
	width: 120px;
}

form .narrower {
	width: 50px;
}

form input.short{
    width: 150px;
}

form textarea.short {
	height: 75px;
}

form textarea.long {
	height: 400px;
}

form .require {
	color: #ff0000;
}

form small {
	color: #aeaeae;
}

form .container {
	padding: 0 0 5px 0;
	line-height: 2em;
}

/* NAVIGATION
==============================================================================*/

/* hidden navigation */
#hmenu a { 
	position: absolute;
	left: -9999px;
}

/* main menu */
#menu {
	overflow: hidden;
	float: left;
	margin: 0 0 0 0;
	padding: 0;
	height: 31px;
}

#menu li {
	display: inline;
}

#menu a {
	float: left;
	margin-right: 7px;
	padding: 0 0 0 4px;
	text-decoration: none;
	line-height: 35px;
	cursor: pointer;
	background: #9c9c9c url("../design/menu-leftbg.gif") left -31px no-repeat;
}

#menu a span {
	float: left;
	display: block;
	background: url("../design/menu-rightbg.gif") right -31px no-repeat;
	padding: 0 10px 0 6px;
	color: white;
}

#menu a.blue {
	background-color: #008ae2;
	background-position: left -62px; 
}

#menu a.blue span {
	background-position: right -62px; 
}

#menu a.green {
	background-color: #90af31;
	background-position: left -93px; 
}

#menu a.green span {
	background-position: right -93px; 
}

#menu a.lightgreen {
	background-color: #00FF66;
	background-position: left -93px;
}

#menu a.lightgreen span {
	background-position: right -93px;
}

#menu a.orange {
	background-color: #ff8a00;
	background-position: left -124px; 
}

#menu a.orange span {
	background-position: right -124px; 
}

#menu a.red {
	background-color: #ff4800;
	background-position: left -155px; 
}

#menu a.red span {
	background-position: right -155px; 
}

#menu a:hover, #menu a.selected, #menu a:hover span, #menu a.selected span {
	color: #242424;
	background: #ffffff url("../design/menu-leftbg.gif") left 0 no-repeat;
}
#menu a:hover span, #menu a.selected span {
	background: url("../design/menu-rightbg.gif") right 0 no-repeat;
}

/* submenu on right side */
#submenu {
	float: left;
	padding: 0;
	width: 170px;
	line-height: 1em;
	list-style-type: none;
}

#submenu li {
	margin-bottom: 5px;
}

#submenu li.selected {
	position: relative;
	left: -1px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	background: #ffffff;
}

#submenu a {
	display: block;
	padding: 1em 10px;
	border-top: 1px solid #f0f0f0;
	border-right: 1px solid #f0f0f0;
	border-bottom: 1px solid #f0f0f0;
	width: 149px;
	text-decoration: none;
	font-weight: bold;
	color: #6e6e6e;
	background: #f0f0f0;
}

#submenu a:hover {
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	color: #f6570b;
	background: #ffffff;
}

#submenu li.selected a, #submenu li.selected a:hover {
	border: none;
	background: none;
}

/* STRUCTURE
==============================================================================*/
#main, #headcontainer, #header, #menu, #content, #footer {
	width: 980px;
}

#main {
	margin: 0 auto;
	padding: 0;
	text-align: left;
}

#headcontainer {
	background: #434343 url(../design/web-bg.gif) repeat-x; 
}

#header {
	padding: 19px 0;
	height: 42px;
}

#header img {
	float: left;
	margin-right: 10px;
	border: 1px solid #ffffff;
}

#toptools {
	height: 24px;
	line-height: 24px;
	text-align: right;
}

#toptools, #toptools a {
	color: #CCCCCC;
}

#content {
	margin-top: 20px;
}

#content-narrow {
	float: left;
	width: 780px;
	padding: 5px 29px 20px 0;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
}

#footer {
	clear: both;
	border-top: 1px solid #CCCCCC;
	padding: 10px 0;
	color: #999999;
}

#footer a {
	color: #999999;
}

#footer span {
	padding: 0 0.5em;
	color: #cccccc;
}

/* LOGIN
==============================================================================*/
body.login {
	border-top: 10px solid #f6570b;
	background: none;
}

#loginbox {
	margin: 100px auto 0 auto;
	padding: 15px;
	border: 1px solid #CCCCCC;
	background: #f6f6f6 url("../design/login-bg.gif") 0 top repeat-x;
	width: 212px;
	text-align: center;
}

#loginbox h1 {
	float: none;
	margin: 0.5em 0;
	padding: none;
	color: #f6570b;
	font-size: x-large;
}

#loginbox a.logotype {
	margin: 0 auto;
	width: 50px;
	display: block;
	border: 1px solid #dfdfdf;	
}

#loginbox .logotype img {
	border: 4px solid #ffffff;	
}

#loginbox form {
	text-align: left;
}

#loginbox .textbox {
	margin: 5px 0;
	font-size: large;
}

#loginbox form label, #loginbox form input  {
	display: inline;
	float: none;
}

#loginbox form label {
	padding-left: 0;
}

#loginbox form .rememberme {
	color: #999999;
}

#loginbox form .formbutton {
	padding: 0.5em 1em;
	float: right;
}

/* OTHER
==============================================================================*/
/* buttons */

.button {
	display: block;
	margin-left: 7px;
	padding: 0 0 0 4px;
	border: 0;
	font-weight: bold;
	color: #6e6e6e;
	text-decoration: none;
	line-height: 32px;
	cursor: pointer;
	background: #f0f0f0 url("../design/button-leftbg.gif") left 0 no-repeat;
}

.button:hover {
	color: #242424;
}

.button span.in {
	display: block;
	padding: 0 10px 0 6px;
	background: url("../design/button-rightbg.gif") right 0 no-repeat;
}

.button span.icon {
	padding: 0 0 0 23px;
	background-position: left 50%;
	background-repeat: no-repeat;
}

.button span.icon.add {
	background-image: url("../design/icons/add.png")
}

.button span.icon.remove {
	background-image: url("../design/icons/remove.png")
}

.button span.icon.delete {
	background-image: url("../design/icons/delete.png")
}

/* status massages */
.message-good, .message-bad, .message-info  {
	padding: 10px 10px 10px 40px;
	margin-bottom: 10px;
	background-position: 7px 7px;
	background-repeat: no-repeat;
}

.message-good {
	border: 1px solid #cae49c;
	color: #516f1b;
	background-color: #f3ffd0;
	background-image: url(../design/icons/accept-big.png)
}

.message-good a {
	color: #516f1b;
}

.message-bad {
	border: 1px solid #ffdede;
	color: #ce0000;
	background-color: #fff1f1;
	background-image:  url(../design/icons/exclamation-big.png);
}

.message-bad a {
	color: #ce0000;
}

.message-info {
	border: 1px solid #ededb3;
	background-color: #ffffcc;
	background-image:  url(../design/icons/information-big.png);
}

.paging-nav a, .paging-nav span, .paging-info {
	border: 1px solid #dcdcdc;
	padding: 0.1em 0.2em;
	background: #f0f0f0;
	color: #242424;
	text-decoration: none;
}

.paging-nav a:hover {
	background: #dcdcdc;
}


.paging-nav span {
	border: 1px solid #f6570b;
	background: #f6570b;
	color: #fff;
	font-weight: bold;
}

/* gallery */
.imgbox {
	float: left;
	display: inline; /* IE double margin bug*/
	margin: 0 16px 15px 0;
	padding: 4px;
	width: 102px;
	border: 1px solid #cccccc;
	text-align: center;
	background: #f0f0f0;
}

.imgbox h4 {
	padding: 3px;
	margin-bottom: 2px;
	font-size: x-small;
	color: #6e6e6e;
}

.imgbox a.thumb img {
	display: block;
	border: 1px solid #6e6e6e;
}

.imgbox span {
	display: block;
	margin-top: 10px;
	padding: 3px 0;
	background: #f9f9f9;
}

.imgbox.unactive h4 {
	background: #ff4800;
	color: #fff;
}

.imgbox.main h4 {
	background: #90af31;
	color: #fff;
}