/* ============================================================================
= BASICS
============================================================================ */

body {
	font-family: Arial, Verdana, Helvetica, Geneva, sans-serif;
	font-size: 0.75em;
	color: #000;
	background-color: #fff;
	margin: 0;
}



/* ============================================================================
= COMMON DEFINITIONS
============================================================================ */

div.layoutmargin {
	position: relative;
	margin: 0 auto;
	width: 952px;
}



/* ============================================================================
= AREAS
============================================================================ */

div#headerbg {
	position: absolute;
	top: 0;
	left: 0;
	height: 150px;
	width: 100%;
	z-index: 0;
	background: #eeeeee url(../images/header_bkgrnd.gif) repeat-x bottom left;
}

div#layout {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1;
}

div#body {
	position: relative;
	background: #f8b465 url(../images/body_bkgrnd.gif) repeat-x bottom left;
}



/* ============================================================================
= CONTENT
============================================================================ */

div#mainbody {
	/*position: relative;*/  /* IE6 ??? */
	z-index: 0;
	background: #fff url(../images/content_bkgrnd.gif) repeat-y top left;
}

div#content {
	padding: 15px 0px;
}

div#content.single {
	padding: 15px 15px;
}

div#content table.widthfullabs {
	width: 535px;
}

div#content table.widthfullperc {
	width: 100%;
}

div#content h1 {
	font-size: 1.5em;
	color: #FF8B02;
	font-weight: bold;
	margin: 0 0 20px 0;
}

div#content h2 {
	font-size: 1.167em;
	font-weight: bold;
	color: #606060;
	margin: 15px 0 8px 0;
}

div#content p {
	margin: 8px 0;
}

div#content div#report h2 {
	margin-top:0px;
}



/* ============================================================================
= MAIN BODY COLUMNS
============================================================================ */

div#leftcol {
	width: 204px;
	color: #606060;
	font-size: 0.913em;
}

div#leftcol h3 {
	font-size: 1.083em;
	font-weight: bold;
	border-bottom: 1px solid #c0c0c0;
	margin: 20px 0 8px 0;
	color: #606060;
}

div#leftcol p {
	margin: 8px 0;
}

div#leftcol a {
	color: #606060;
	font-weight: bold;
}

div#leftcol table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 1em;
	width: 100%;
}

div#leftcol table.statistic th {
	font-weight: normal;
	font-size: 1em;
	color: #606060;
	text-align: left;
}

div#leftcol table.statistic td {
	font-weight: normal;
	text-align: right;
	font-size: 1em;
	color: #606060;
}

div#rightcol {
	float: right;
	width: 184px;
	color: #606060;
	font-size: 0.913em;
}

div#rightcol h3 {
	font-size: 1.083em;
	font-weight: bold;
	border-bottom: 1px solid #c0c0c0;
	margin: 20px 0 8px 0;
	color: #606060;
}

div#rightcol h3.highlight {
	background:#F8B465;
	padding:1px 3px;
}

div#rightcol p {
	margin: 8px 0;
}

div#rightcol a {
	color: #606060;
	font-weight: bold;
}

div#rightcol select {
	font-size: 1em;
	width: 160px;
	padding: 1px 3px;
	border: 1px solid #c0c0c0;
}



/* ============================================================================
= MAIN NAVIGATION
============================================================================ */

div#navigation {
	font-size: 1.083em;
	padding-top: 16px;
}

div#navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

div#navigation a {
	text-decoration: none;
	display: block;
}

div#navigation a.on {
	color: #fff;
	background-color: #ff8b02;
}

div#navigation a.off, div#navigation a.first {
	background: transparent url(../images/filler.gif) no-repeat top right;
}

div#navigation a:hover {
	color: #fff;
	background-color: #f8b465;
}


/* FIRST LEVEL */
div#navigation ul li {
	/*height: 15px;*/  /* IE6 ??? */
}

div#navigation ul a {
	border-top: 1px solid #c0c0c0;
	font-weight: bold;
	padding: 4px 10px;
}

div#navigation ul a.first {
	border-top: 0;
}


/* SECOND LEVEL */
div#navigation ul ul a {
	border-top: 0;
	font-weight: normal;
	padding: 2px 10px 2px 20px;
	font-size: 0.913em;
}


/* HIDE NAV */
div.linecontainer {
	margin-top: 3px;
	text-align: center;
}

div.linebutton {
	width:90%;
	font-size:0.9em;
	text-align:center;
	cursor:pointer;
	background: transparent url(../images/doubleline.gif) repeat-x bottom left;
	padding:0px;
}

span.linelabel {
	background-color: #fff;
	padding:0 5px;
}

div#calendar {
	padding: 5px 2px 0px 2px;
}


/* NAV ELEMENTS */
iframe#calendar {
	width:172px;
	height:155px;
	border:0;
	padding:3px;
}

div.treebox {
	width: 180px;
	OVERFLOW-y: hidden;
	OVERFLOW-x: auto;
	border:1px solid #DDD;
	padding-bottom:20px;
}



/* ============================================================================
= LEFT AND RIGHT BOXES
============================================================================ */

div.leftbox {
	padding-right: 4px;
	margin-top: 10px;
	margin-bottom: 10px;
	min-height: 150px;
	background: transparent url(../images/bleft_border.gif) repeat-y top right;
}

div.leftbox#navigation {
	margin-top: 0px;
}

div.leftbox div.inner {
	padding: 10px;
	min-height: 150px;
	background: transparent url(../images/bleft_bkgrnd.gif) no-repeat bottom right;
	overflow: hidden;
}

div.leftbox div.footer {
	position: relative;
	right: -4px;
	height: 13px;
	background: transparent url(../images/bleft_footer.gif) no-repeat bottom right;
}

div.rightbox {
	padding-left: 4px;
	margin-bottom: 20px;
	min-height: 180px;
	background: transparent url(../images/bright_border.gif) no-repeat top left;
}

div.rightbox div.inner {
	padding: 10px;
	min-height: 180px;
	background: transparent url(../images/bright_bkgrnd.gif) no-repeat bottom left;
}

div.rightbox div.footer {
	position: relative;
	left: -4px;
	height: 13px;
	background: transparent url(../images/bright_footer.gif) no-repeat bottom left;
}



/* ============================================================================
= SHORTCUTS AND BOTTOM
============================================================================ */

div#shortcuts {
	position: relative;
	z-index: 1;
	margin-top: 16px;
}


/* LOGIN BAR */
div.sclogin {
	height: 35px;
	background: #f2f2f2 url(../images/shortcuts_bkgrnd_small.gif) no-repeat top left;
	padding-top: 8px;
	padding-bottom: 4px;
}

div.sclogin input {
	background: #fff url(../images/sc_login_input.gif) no-repeat top left;
	width: 131px;
	height: 15px;
	color: #000;
	vertical-align: text-bottom;
	padding: 3px;
	margin-bottom: 1px;
	font-size: 0.913em;
	border: 0;
}

div.sclogin input.button {
	margin-top: 2px;
	margin-left: 10px;
	width: 87px;
	height: 25px;
	border: 0;
	cursor: pointer;
}

div.sclogin div#menu3 {
	top: 3px;
}


/* USER MENU BAR */
div.scuser {
	height: 68px;
	background: #f2f2f2 url(../images/shortcuts_bkgrnd_big.gif) no-repeat top left;
	padding: 1px;
}

div.scuser div#userlogout {
	position: absolute;
	top: 38px;
	left: 16px;
}

div.scuser div#userinfo {
	position: absolute;
	top: 11px;
	left: 19px;
	color: #606060;
	overflow: hidden;
	width: 210px;
}

/* tab management */
div.scuser div#management_de, div.scuser div#management_en {
	position: relative;
	cursor: pointer;
	float: right;
	width: 180px;
	height: 68px;
}

div.scuser div#management_de {
	background: transparent url(../images/_language/de/sc_user_management.gif) no-repeat top left;
}

div.scuser div#management_de.on {
	background: transparent url(../images/_language/de/sc_user_management_on.gif) no-repeat top left;
}

div.scuser div#management_de.on2 {
	background: transparent url(../images/_language/de/sc_user_management_on2.gif) no-repeat top left;
}

div.scuser div#management_de.off {
	cursor: default;
	background: transparent url(../images/_language/de/sc_user_management_off.gif) no-repeat top left;
}


div.scuser div#management_en {
	background: transparent url(../images/_language/en/sc_user_management.gif) no-repeat top left;
}

div.scuser div#management_en.on {
	background: transparent url(../images/_language/en/sc_user_management_on.gif) no-repeat top left;
}

div.scuser div#management_en.on2 {
	background: transparent url(../images/_language/en/sc_user_management_on2.gif) no-repeat top left;
}

div.scuser div#management_en.off {
	cursor: default;
	background: transparent url(../images/_language/en/sc_user_management_off.gif) no-repeat top left;
}

/* tab reseller */
div.scuser div#reseller {
	position: relative;
	float: right;
	width: 180px;
	height: 68px;
	background: transparent url(../images/sc_user_reseller.gif) no-repeat top left;
}

div.scuser div#reseller.on {
	background: transparent url(../images/sc_user_reseller_on.gif) no-repeat top left;
}

div.scuser div#reseller.on2 {
	background: transparent url(../images/sc_user_reseller_on2.gif) no-repeat top left;
}

div.scuser div#reseller div#customer {
	width: 160px;
	color: #606060;
	padding: 10px 0 0 11px;
	font-weight: bold;
	overflow: hidden;
}

div.scuser div#reseller div#package {
	width: 160px;
	color: #606060;
	padding:15px 0 0 11px;
	font-weight: bold;
	overflow: hidden;
}

/* tab status */
div.scuser div#status_de, div.scuser div#status_en {
	position: relative;
	cursor: pointer;
	float: right;
	width: 180px;
	height: 68px;
}

div.scuser div#status_de {
	background: transparent url(../images/_language/de/sc_user_status.gif) no-repeat top left;
}

div.scuser div#status_de:hover, div.scuser div#status_de.on {
	background: transparent url(../images/_language/de/sc_user_status_on.gif) no-repeat top left;
}

div.scuser div#status_de.off {
	cursor: default;
	background: transparent url(../images/_language/de/sc_user_status_off.gif) no-repeat top left;
}

div.scuser div#status_en {
	background: transparent url(../images/_language/en/sc_user_status.gif) no-repeat top left;
}

div.scuser div#status_en:hover, div.scuser div#status_en.on {
	background: transparent url(../images/_language/en/sc_user_status_on.gif) no-repeat top left;
}

div.scuser div#status_en.off {
	cursor: default;
	background: transparent url(../images/_language/en/sc_user_status_off.gif) no-repeat top left;
}

/* tab reporting */
div.scuser div#reporting_de, div.scuser div#reporting_en {
	position: relative;
	cursor: pointer;
	float: right;
	width: 180px;
	height: 68px;
}

div.scuser div#reporting_de {
	background: transparent url(../images/_language/de/sc_user_reporting.gif) no-repeat top left;
}

div.scuser div#reporting_de:hover, div.scuser div#reporting_de.on {
	background: transparent url(../images/_language/de/sc_user_reporting_on.gif) no-repeat top left;
}

div.scuser div#reporting_de.off {
	cursor: default;
	background: transparent url(../images/_language/de/sc_user_reporting_off.gif) no-repeat top left;
}

div.scuser div#reporting_en {
	background: transparent url(../images/_language/en/sc_user_reporting.gif) no-repeat top left;
}

div.scuser div#reporting_en:hover, div.scuser div#reporting_de.on {
	background: transparent url(../images/_language/en/sc_user_reporting_on.gif) no-repeat top left;
}

div.scuser div#reporting_en.off {
	cursor: default;
	background: transparent url(../images/_language/en/sc_user_reporting_off.gif) no-repeat top left;
}

/* tab register*/
div.sclogin div#register {
	position: relative;
	float: right;
	width: 180px;
	height: 35px;
	top: -7px;
}

/* tab menu layout */
div.scuser div#menu1 {
	top: 68px;
}

div.scuser div#menu2 {
	top: 3px;
}

div.scuser div#menu2 input {
	width: 155px;
	border: 1px solid #A0A0A0;
}

div.scuser div#menu2 div#reseller_account {
	width: 155px;
	padding: 2px 0px 2px 0px;
	font-weight: bold;
	overflow: hidden;
}

div#shortcuts div.menu {
	position: absolute;
	left: 4px;
	z-index: 2;
	width: 158px;
	padding: 0px 7px 0 7px;
	background: #fff url(../images/sc_user_overlay_management.gif) no-repeat top left;
	overflow: hidden;
}

div#shortcuts div.menu ul {
	width: 155px;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

div#shortcuts div.menu li {
	list-style-type: none;
}

div#shortcuts div.menu a {
	display: block;
	text-decoration: none;
	padding: 4px 10px 4px 13px;
	color: #000;
	border-top: 1px solid #c0c0c0;
}

div#shortcuts div.menu a:hover {
	color: #fff;
	background-color: #FF8B02;
}

div#shortcuts div.menu a.menuitem {
	background: #fff url(../images/square.gif) no-repeat 3px 4px;
}

div#shortcuts div.menu a.menuitem:hover {
	background: #FF8B02 url(../images/square_white.gif) no-repeat 3px 4px;
}

div#shortcuts div.menuheader {
	position: relative;
	margin-top: 0px;
	left: -7px;
	width: 172px;
	height: 5px;
	background: #fff url(../images/sc_user_overlay_header.gif) no-repeat bottom left;
}

div#shortcuts div.menufooter {
	position: relative;
	margin-top: 3px;
	left: -7px;
	width: 172px;
	height: 5px;
	background: #fff url(../images/sc_user_overlay_bottom.gif) no-repeat bottom left;
}

div#bottom {
	height: 11px;
	margin-bottom: 40px;
	background: transparent url(../images/bottom_bkgrnd.gif) no-repeat top left;
}



/* ============================================================================
= TITLE
============================================================================ */

div#title {
	background: transparent url(../images/title_bkgrnd.jpg) no-repeat top left;
	height: 87px;
}

div#title div#logo {
	top: 8px;
	left: 5px;
	position: absolute;
	overflow: hidden;
	text-align: center;
}

div#title div#poweredby {
	position: absolute;
	cursor: pointer;
}



/* ============================================================================
= FOOTER
============================================================================ */

div#footer {
	background-color: #fff;
}

div#footer p {
	text-align: center;
	margin: 0px;
	padding: 10px;
	font-size: 0.913em;
	line-height: 1.333em;
}

div#footer a {
	color: #000;
	text-decoration: none;
}

div#footer a:hover {
	text-decoration: underline;
}



/* ============================================================================
= AND THE REST
============================================================================ */

div.clear {
	clear: both;
	height: 1px;
	font-size: 1px;
	line-height: 1px;
}

.center { text-align: center; }
.left { text-align: left; }
.right {	text-align: right; }