﻿/*
	- Seitenlayout ist Header, Footer und Inhalt 2 spaltig. Die linke Spalte wird bei Bedarf per BG-Image visuell in voller Höhe dargestellt
	- Das Browserfenster wird immer in der Höhe ausgefüllt und scrollt bei Bedarf, wenn mehr
	  Inhalt da ist, als ins Fenster passt
	- Die Hauptnavi sind Tabs, die sich nach dem sliding-door-Prinzip dynamisch an den Inhalt anpassen,
	  die bei Bedarf leicht überlappen und wo der aktive Tab immer hervorsteht.
	- Unternavi ist eine Auflistung im linken Bereich

	Hinweise zur Layout Breite:
		- aus .page_margins width und .page padding links u.rechts ergibt sich die verfügbare Breite
		- der Inhalt der rechten Spalte muss 740px breit sein, der Inhalt der linken Spalte 200px
			-> um das zu erreichen, kann man mit #col1 width und #col2 margin-left spielen (beide Werte müssen immer gleich sein)
		
*/
html {
	/*margin-bottom:1px;*/
}
body, html {
	height:100% !important;
	background-color:#f0f0f0;
	padding:0;
	font-family:/*Segoe UI, */Arial;
	font-size:11px;
}

body 
{
	/* der Scrollbalken kommt jetzt von einem DIV direkt im Body, 
	das alle anderen Elemente einschließt, 
	außer der Ext-Maske, die damit über den Scrollbalken geht */
	overflow:hidden; 
}

body div#scroller 
{
	zoom:1;
	position:relative !important;
	width:100%;
	height:100%;
	overflow-x: auto;
	overflow-y: auto;
	/*margin-bottom:1px;*/
}

form {
	height:0;
	margin:0;
	padding:0;
}

.page_margins {
	/*background:#FFFFFF url("images/shadows_margin_blue_col.gif?1");*/
	background: linear-gradient(90deg, #E6E6E6 0 240px, white 240px);
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	position:relative !important;
	height:auto !important;
	min-height:100%;
	width:1000px;
	margin: auto;
}

.wide-screen .page_margins,
.wide-screen #footer
{
	width: 96%;
	min-width: 1000px;
	max-width: 2020px;
}

.page {
	padding:0 0px 30px 0px;
	zoom:1;
}

#header {
	position:relative;
	background:#fff url("images/Claim_LAI.png") no-repeat 97% 50px;
	height:175px;
	overflow:hidden;
}

#main {
	clear:both;
}

#col1 {
	float:left;
	width:240px;
}
#col1_content {
	position:relative;
	border-top:2px solid white;
	padding:10px 5px 10px 12px;
	background-color:#545454;
	color:white;
	text-align:left;
}

#col2 {
	margin-left:240px;
	position:relative!important;
	zoom:1;
}
#col2_content {
	border-top:2px solid white;
	padding:30px 20px 10px 20px;
	text-align:left;
	font-family:Arial, Sans-Serif;
	font-size:12px;
	line-height:18px;
}

.error_page #col2_content{
	color:#990000;
}

.user_info {
	position:absolute;
	right:3px;
	top:1px;
	font-family:Arial;
	font-size:11px;
}

#footer {
	position:relative !important;
	height:30px;
	width:1000px;
	clear:both;
	margin: -30px auto 0 auto;
	/*left:50%;
	margin-left:-500px;*/
}

#footer_content {
	position:relative;
	border-top:2px solid white;
	background-color:#e6e6e6;
	color:#545454;
	text-align:left;
}
#footer_content td {
	font-family:arial;
	font-size:11px;
	text-align:center;
}
#footer_content a.normal, #footer_content a.normal:hover, #footer_content a.normal:visited, #footer_content a.normal:active,
#footer_content .normalLinks a, #footer_content .normalLinks a:hover, #footer_content .normalLinks a:visited, #footer_content .normalLinks a:active {
	color:#545454;
}

.clearfix {
	display:block;
}

/*********************************/

.page_heading {
	font-size:11px;
	font-weight:bold;
	font-family:arial;
	color: #545454;
}

/*********************************/
/* Main Navi als Tabs */		
.navi_main .tab_wrap {
	float:left;
	position:relative;
	height:36px;
	font-family:Segoe UI, Arial, Sans-Serif;
	font-size:15px;
	font-weight:bold;
	color:red;
	/*padding:10px 15px 0 5px;*/
	margin-right:-10px;
	overflow:visible;
	cursor:pointer;
}
.navi_main .tab_inner_left {
	background:url('images/inactive_tab_left.gif') no-repeat right top;
	height:36px;
	width:12px;
	float:left;
}
.navi_main .tab_inner_right {
	background:url('images/inactive_tab_right.gif') no-repeat right top;
	height:36px;
	float:left;
	padding:12px 25px 0 3;
	color:#000099;
}
.navi_main .tab_inner_right span {
	zoom:1;
/*	filter:alpha(opacity=80);*/
	-moz-opacity:0.85;
	opacity:0.85;
}

.navi_main .active {
	z-index:1000;
	cursor:default;
}
.navi_main .active .tab_inner_left {
	background:url('images/active_tab_left.gif') no-repeat right top;
}
.navi_main .active .tab_inner_right {
	background:url('images/active_tab_right.gif') no-repeat right top;
	color:#d3d2e5;
	padding-top:9px;
}

.navi_main .disabled {
	cursor:default;
}
.navi_main .disabled .tab_inner_right {
	color:#656565;
}

/********************************************************/
/* Main Navi als Liste*/

ul.navi_main {
	list-style:none;
	font-weight:normal;
	font-family:Arial;
	font-size:11px;
}
li.navi_main {
	margin:7px 0 0 10px;
	font-weight:normal;
}
li a.navi_main, li a:visited.navi_main {
	color:white;
	text-decoration:none;
}
li a:hover.navi_main {
	color:#f1a500;	
}
li.active a.navi_main, li.active a:visited.navi_main {
	color:white;
	font-weight:bold;
}
li.disabled a.navi_main, li.disabled a:visited.navi_main {
	color:#999;
	cursor:default;
}
li.disabled a:hover.navi_main {
	color:#999;
	text-decoration:none;
}
/********************************************************/
.navi_sub ul {
	list-style:none;
	font-weight:normal;
	font-family:Arial;
	font-size:11px;
}
.navi_sub li {
	margin:7px 0 0 10px;
	font-weight:normal;
}
.navi_sub li a, .navi_sub li a:visited {
	color:white;
	text-decoration:none;
}
.navi_sub li a:hover {
	color:#f1a500;	
}
.navi_sub li.active a, .navi_sub li.active a:visited {
	color:#f1a500;
	font-weight:bold;
}
.navi_sub li.disabled a, .navi_sub li.disabled a:visited {
	color:#999;
	cursor:default;
}
.navi_sub li.disabled a:hover {
	color:#999;
	text-decoration:none;
}

/********************************************************/

/* normale Listen */
ul.normal {
	list-style:square outside;
}
ul.normal li {
	margin:2px 0 2px 15px;
}

/* normale Listen */
ol.normal {
	list-style:decimal outside;
}
ol.normal li {
	margin: 2px 0 5px 20px;
}

/* normale Links */
a.normal, a.normal:hover, a.normal:visited, a.normal:active,
.normalLinks a, .normalLinks a:hover, .normalLinks a:visited, .normalLinks a:active {
	color:#44599f; text-decoration:none;
}
a.normal:hover, .normalLinks a:hover { 
	text-decoration:underline;
}

/* normaler Text in Tabellen*/
table.normal td {
	font-family:Arial;
	font-size:12px;
}

/* Sonstiges */
.info_box {
	margin-top:20px;
	margin-left:0px;
	margin-right:10px;
	padding:15px;
	font-size:12px;
	line-height:150%;
	border:0px none;
	display:none;
}

body .netzbetreiberpanel .x-panel-body {
	background-color:#F9F9F9!important;
}

#piaInfoCheckedSuppliers .x-panel-body {
	background-color:#F0F0F0!important;
}

body .nutzungsbedingungen .x-panel-body {
	background-color:white!important;
}

/********************************************************/
/* Ext-Anpassungen                                      */
/********************************************************/

.fieldset-wrap .x-fieldset {
	background-color:transparent;
	border-width:0px !important;
	margin-bottom:15px;
}

.fieldset-wrap .x-panel-body {
	background-color:transparent!important;
}

.fieldset-wrap legend {
	padding-left: 10px;
	padding-top: 2px;
}

.ext-ie .fieldset-wrap legend {
	padding-left: 6px;
	padding-top: 2px;
}

.password-fieldset legend, .ext-ie .password-fieldset legend {
	padding-left: 0px!important;
}
.password-fieldset {
	border-width: 1px!important;
}

.fieldset-wrap {
	background:#E6E6E6 url("images/box_15x15_gray.gif") no-repeat;
}

.x-tip-header-text img {
	display:none;
}

/********************************************************************/
/* Ext Buttons umstylen */
.x-panel-btns .x-btn-left {background:none; width:0px; display:none;}
.x-panel-btns .x-btn-right {background:none; width:0px; display:none;}

/* Farben der Buttons */
.x-panel-btns .x-btn-center {
	background:#0458b9; /*padding:1px!important;*/ 
	border:1px solid #0458b9!important; border-bottom:1px solid #0458b9!important; border-right:1px solid #0458b9!important;
}

.x-panel-btns .x-item-disabled .x-btn-center {
	background-color:#ddd!important;
	border:1px solid #eee!important; border-bottom:1px solid #eee!important; border-right:1px solid #eee!important;
}
.x-panel-btns .x-item-disabled * {
	color: white!important;
}

/*.ext-ie .x-btn-center {padding:0px!important; }*/
.x-panel-btns .x-btn-center .x-btn-text { 
	font-size:11px;
	font-weight:normal;
	color:#fff;
	font-family:verdana, sans-serif;
	padding-left: 3px!important;
	padding-right:3px!important;
}

.x-panel-btns .x-btn-over .x-btn-center { background-color:#03448f; }
.x-panel-btns .x-btn-pressed .x-btn-center,
.x-panel-btns .x-btn-click .x-btn-center {
	background-color:#03448f; border:1px solid #03448f; border-top:1px solid #03448f; border-left:1px solid #03448f;
}
.x-panel-btns .x-panel-btns .x-btn-pressed .x-btn-text,
.x-panel-btns .x-btn-click .x-btn-text, 
.x-panel-btns .x-btn-over .x-btn-text {
	color:white;
}

.x-panel-btns .ux-btn-vertical-center-icon .x-btn-center .x-btn-text {
	background-position:-200px center!important; /* Enso möchte keine Icons in den Buttons, also wegschieben*/
}

.x-panel-btns .x-btn-text-icon .x-btn-center .x-btn-text {
	background-position:-200px center!important; /* Enso möchte keine Icons in den Buttons, also wegschieben */
}

.x-panel-btns .x-btn-center .x-btn-text {
	padding-top:3px!important;
	padding-bottom:3px!important;
}

/*Toolbars*/
.x-toolbar {
	/*background:#909FD3 none;*/
}
.x-toolbar .ytb-text {
	/*color:#003466;*/
}
.x-toolbar .x-btn-over .x-btn-center {
	/*background:#003466 none;*/
}
.x-toolbar .x-btn-click .x-btn-center, .x-toolbar .x-btn-pressed .x-btn-center, .x-toolbar .x-btn-menu-active .x-btn-center {
	/*background-image:none;*/
}

/*SplitButton*/
.x-panel-btns .x-btn-menu-arrow-wrap .x-btn-center button {
	height:19px;
}

.x-panel-btns .x-btn-menu-arrow-wrap .x-btn-center button {
	background:transparent url('images/btn-arrow.gif') no-repeat scroll left 3px;
}
.x-btn-with-menu .x-btn-center em {
	background:transparent url('images/btn-arrow.gif') no-repeat scroll right 3px;
}


/* die "Weiter" und "Zurück" Knöpfe noch bissl extra machen */
.button-next .x-btn-center, .button-next .x-btn-focus .x-btn-center {background:#0458b9 url('images/button_bg_weiter.gif?3') no-repeat center right;}
.button-next .x-btn-center .x-btn-text {padding-right:14px!important;}
.button-next .x-btn-over .x-btn-center {background:#03448f url('images/button_bg_weiter_hover.gif?3') no-repeat center right;}
.button-next .x-btn-over .x-btn-text {color:#fff;}

.button-back .x-btn-center, .button-back .x-btn-focus .x-btn-center {background:#0458b9 url('images/button_bg_zurueck.gif?3') no-repeat center left;}
.button-back .x-btn-center .x-btn-text {padding-left:14px!important;}
.button-back .x-btn-over .x-btn-center {background:#03448f url('images/button_bg_zurueck_hover.gif?3') no-repeat center left;}
.button-back .x-btn-over .x-btn-text {color:#fff;}



.x-panel-header {
	background: #545454 none;
	color: White;
}
