@charset "UTF-8";
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) Template for designing a screen layout
 * (de) Gestaltungsvorlage für die Erstellung eines Screenlayouts
 *
 * @copyright       Copyright 2005-2007, Dirk Jesse
 * @license         CC-A 2.0 (http://creativecommons.org/licenses/by/2.0/),
 *                  YAML-C (http://www.yaml.de/en/license/license-conditions.html)
 * @link            http://www.yaml.de
 * @package         yaml
 * @version         3.0.2
 * @revision        $Revision: 1.16 $
 * @lastmodified    $Date: 2020/03/04 10:59:56 $
 */

@media all
{
 /*------------------------------------------------------------------------------------------------------*/

 /**
  * Design of the Basic Layout | Gestaltung des YAML Basis-Layouts
  *
  * @section layout-basics
  */

  /* Page margins and background | Randbereiche & Seitenhintergrund */
body {
	background:#fff;
}
  /* Layout: Width, Background, Border | Layout: Breite, Hintergrund, Rahmen */
#page_margins{

}
#page{
	width:100%;
	min-width:950px;
}

  /* Design of the Main Layout Elements | Gestaltung der Hauptelemente des Layouts */
#header{
	background: #f6f6f6;
	box-shadow: 0 3px 3px #e2e0df;
	height:59px;
	width:100%;
	display:block;
	position:relative;
	z-index:100;
	margin-bottom: 24px;
}
#header.devstage {
	background-color: #f6f6f6;
	background-image: repeating-linear-gradient(45deg, transparent, transparent 25px, rgba(255,255,255,.8) 25px, rgba(255,255,255,.8) 50px);
}
#header #logo{
	height: 59px;
	float:left;
	position: relative;
	z-index: 5;
	overflow: hidden;
}
#header #logo a,
#header #logo > img{
	margin: 14px 8px 0 20px;
	display:block;
}
#header #logo > a > img {
	width: 83px;
	height: 32px;
}

#stageinfo{
	text-align: center;
	padding-top: 18px;
	padding-right: 110px;
	color: red;
	font-size: 20px;
	text-transform: uppercase;
}
.devstage #stageinfo{
	color: #f59c00;
}

#main{
	margin: 0;
	padding: 0;
}

 /*------------------------------------------------------------------------------------------------------*/

 /**
  * Formatting of the Content Area | Formatierung der Inhaltsbereichs
  *
  * @section layout-main
  */

#col1 {
	width: 330px;
	float:left;
	margin-left:10px;
	overflow: hidden;
}	
#navigation{
	/* margin-right: 12px; Version 2*/
	margin-right: 18px;
	font-size: 12px;
}
#navigation > div:first-of-type {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
#navigation #wo_bin_ich + #autoabmeldung {
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
#navibaum{
	padding:10px;
}
#navigation div.reiter a{
	min-width:0;
}
.Medienbrowser + .reiter + #navibaum {
	background: #f6f6f6 none repeat scroll 0 0;
	border-radius: 0 10px 10px;
}
#autoabmeldung{
	margin: 0 0 20px;
	background-color: #f6f6f6;
	border-radius: 10px;
	padding: 5px 0;
}
#benutzerinfo{
	border:1px solid #e0e0e0;
	padding: 5px 0 5px 5px;
	margin: 0 0 10px;
	background-color: #F8F8FC;
	overflow: hidden;
}
#col3 {
	margin-left: 362px;
	margin-right:20px;
}

 /*------------------------------------------------------------------------------------------------------*/

 /**
  * Design of Additional Layout Elements | Gestaltung weiterer Layoutelemente
  *
  * @section layout-misc
  */
p.autoabmeldung{
	background: rgba(0, 0, 0, 0) url("../../img/autoabmeldung.svg") no-repeat scroll left center;
	background-size: 40px auto;
	margin: 3px 8px;
	padding: 5px 0 5px 54px;
}
#autoabmeldung p:not(:first-child){
	margin-left: 62px;
}
#autoabmeldung .button{
	margin: 5px 0;
}
img.login{
	margin: 5px 3px 0 2px;
	cursor: pointer;
}
ul#wo_bin_ich{
	list-style:none;
	border-radius: 10px 0 10px 10px;
	margin: 0 0 15px 0;
	padding: 5px 0 5px 50px;
	background-size: 35px;
}
#wo_bin_ich.Medienbrowser {
	border-radius: 10px;
}
ul.CMS{
	background: #f6f6f6 url(../../img/cms_off.svg) no-repeat 8px 6px;
	background-size: 40px !important;
}
ul.CRM{
	background: #f6f6f6 url(../../img/crm_off.svg) no-repeat 10px 4px;
}
ul.EnWG-Tool{
	background: #f6f6f6 url(../../img/enwg_off.svg) no-repeat 10px 5px;
}
ul.Newsletter{
	background: #f6f6f6 url(../../img/newsletter_off.svg) no-repeat 10px 4px;
}
ul.Mitgliederbereich{
	background: #f6f6f6 url(../../img/mitglieder_off.svg) no-repeat 10px 4px;
}
ul.Tarifrechner{
	background:#f6f6f6 url(../../img/tarifrechner_off.svg) no-repeat 10px 4px;
}
ul.Systemverwaltung{
	background: #f6f6f6 url(../../img/systemsteuerung_off.svg) no-repeat 10px 5px;
}
ul.Smart{
	background: #f6f6f6 url(../../img/smart_off.svg) no-repeat 10px 4px;
}
ul.Q-Pool{
	background: #f6f6f6 url(../../img/qpool_off.svg) no-repeat 10px 4px;
}
ul.VBZ{
	background: #f6f6f6 url(../../img/vbz_off.svg) no-repeat 10px 4px;
}
ul.Stromspar-Analyse{
	background:#f6f6f6 url(../../img/stromsparanalyse_off.svg) no-repeat 10px 4px;
}
ul.Mobile{
	background: #f6f6f6 url(../../img/mobile_off.svg) no-repeat 10px 4px;
}
ul.Abfuhrkalender{
	background: #f6f6f6 url(../../img/abfuhr_off.svg) no-repeat 10px 4px;
}
ul.Webshop{
	background: #f6f6f6 url(../../img/webshop_off.svg) no-repeat 10px 4px;
}
ul.Marktplatz{
	background: #f6f6f6 url(../../img/marktplatz_off.svg) no-repeat 10px 4px;
}
ul.Formularcenter{
	background: #f6f6f6 url(../../img/formularcenter_off.svg) no-repeat 10px 4px;
}
ul.Monitoring{
	background: #f6f6f6 url(../../img/monitoring_off.svg) no-repeat 10px 4px;
}
ul.Social{
	background: #f6f6f6 url(../../img/social_off.svg) no-repeat 10px 4px;
}
ul.Volltextsuche{
	background: #f6f6f6 url(../../img/volltext_off.svg) no-repeat 10px 4px;
}
ul.Statistik{
	background: #f6f6f6 url(../../img/statistik_off.svg) no-repeat 10px 4px;
}
ul.Vertrieb{
	background: #f6f6f6 url(../../img/vertrieb_off.svg) no-repeat 10px 4px;
}
ul.Änderungsaufträge{
	background: #f6f6f6 url(../../img/vertrieb_off.svg) no-repeat 10px 4px;
}
ul.Intranet{
	background: #f6f6f6 url(../../img/intranet_off.svg) no-repeat 10px 4px;
}
ul.E-Mail.Server{
	background: #f6f6f6 url(../../img/mailserver_off.svg) no-repeat 10px 4px;
}
ul.Weitere{
	background: #f6f6f6 url("../../img/aktiv_feature.jpg") no-repeat scroll 18px 10px;
	background-size: 20px !important;
}
ul.Medienbrowser{
	background-color:#f6f6f6;
}

ul#wo_bin_ich li{
   list-style:none;
   margin-left: 0;
}
ul#wo_bin_ich.Medienbrowser > li:first-child{
	padding: 10px;
}
ul#wo_bin_ich li span{
   display:block;
   padding: 8px 0 8px 12px;
   font-size: 13px;
   font-weight:bold;
}
ul#wo_bin_ich a {
	color: #3b3b3b;
}
ul#wo_bin_ich a:hover {
	text-decoration: underline;
}

#ZeitBisAbmeldung,
ul#wo_bin_ich li #ZeitBisAbmeldung{
   display:inline;
   padding:0px;
   font-weight:bold;
}

.block{
	background: #f6f6f6;
	border-radius: 10px;
	overflow:hidden;
	display:block;
	margin-bottom:10px;
	padding: 10px 0;
}
.reiter + .block,
.reiter + form .block:first-of-type,
.reiter + ul#wo_bin_ich {
	border-radius: 0 10px 10px 10px;
}
#neuAccount #reiterDiv {
	border-top-left-radius: 0;
}
.block_hinweis{
	border:4px solid #f59c00;
	overflow:hidden;
	display:block;
	margin-bottom:10px;
}
.block_hinweis .error{
	color: #f59c00;
}

div.eine_spalte{
   width:100%;
}
div.zwei_spalten{
   margin-right:0;
   margin-left:0;
   width:49%;
   height:380px;
}
div.zwei_spalten.kennzahl{
   height:135px;
}

div.reiter{
	white-space:nowrap;
	padding-right: 23px;
	height: 43px;
	overflow: hidden;
	position: relative;
}
div.reiter .reiter_content {
	overflow-x: auto;
	overflow-y: hidden;
	width: 100%;
	height: 100%;
	padding-bottom: 20px;
}

div.reiter span{
	margin-right:2px;
	display:inline-block;
	overflow:hidden;
}
div.reiter span.reiter{
	padding-top: 5px;
}
div.reiter a{
	background: #ececec;
	border-radius: 10px 10px 0 0;
	color:#000;
	display:block;
	float:left;
	height:38px;
	line-height:38px;
	padding:0 15px;
	text-align: center;
	text-decoration:none;
	min-width: 125px;
}
div.reiter span.reiterAktiv a{
	padding-top: 5px;
	font-size: 13px;
	font-weight: 700;
}
div.reiter a:hover,
div.reiter span.reiterAktiv a:hover,
div.reiter span.reiterAktiv a{
	background:#f6f6f6;
}
.right{
	float:right;
	clear:none;
	margin-left:0;
}
.left{
	float:left;
	clear:none;
	margin-right:0;
}

#reiter_button {
	background: #f59c00 url("../../img/pfeil-rechts.png") no-repeat scroll center center / 5px auto;
	border-radius: 0 10px 10px 0;
	display: block;
	height: 38px;
	position: absolute;
	right: 0;
	top: 5px;
	width: 18px;
	cursor: pointer;
}

fieldset.left input.vorschau,
fieldset.left a.left.zwischenablage {
	height: 20px;
	box-sizing: border-box;
}
.left.zwischenablage {
	background: white;
	padding: 3px 44px 3px;
	border-radius: 5px;
}
.left.zwischenablage img {
	width: 15px;
}
.left .inputOutputFrame{
	display:inline;
}

.webpage_element,
.website_element{
	padding:2px;
	display:block;
	overflow:hidden;
}
.WPEBlock .webpage_element {
	padding: 0;
}
.webpage_element .right input{
	margin-right: 20px;
}
.webpage_element .right input:last-of-type {
	margin-right: 15px;
}
.webpage_element a,
.website_element a,
.id,
.name{
	float:left;
	padding-right:5px;
	font-size:12px;
}
.name{
	width:110px;
	line-height:25px;
}
.id{
	width:40px;
	text-align:right;
	line-height:25px;
}
* html .bearbeiten_container{
	position:relative;
	width:100%;
}
.bearbeiten_container{
	margin-bottom: 10px;
}
.bearbeiten_container > fieldset.formElements {
	padding-top: 0;
	padding-bottom: 0;
}
.bearbeiten_container table tr th:first-child,
.bearbeiten_container table tr td:first-child {
	padding-left: 15px;
}
.bearbeiten_container table iframe{
	width: 100% !important;
	border:1px solid #e0e0e0;
}
.c33r,
.c33l{
	width: 23.5%;
	margin: 0 2% 25px 0;
	float: left;
}
.subcolumns > div:nth-child(4n):not(.c33l_crm) {
	margin-right: 0;
}
.c33l_crm,
.c33r_crm {
	margin: 0 1.5% 10px 0;
	width: 32.333%;
}

.inaktiv{
	filter:alpha(opacity=30);
	opacity: 0.3;
	-moz-opacity:0.3;
}
.subcolumn{
	display:inline-block;
	overflow:hidden;
}
.inaktiv h1{
	background:#fff url(../../img/admin_h1_inaktiv.gif) repeat-x bottom;
}
.inaktiv a h1{
	color:#333;
}
.c33r a,
.c33l a{
	display:block;
	border-radius: 10px;
	background: #f6f6f6;
	height:180px;
	text-decoration:none;
	overflow: hidden;
}

.c33l_crm{
	float:left;
}
.c33r_crm{
	float:right;
	margin-right: 0;
}

.c33r_crm,
.c33l_crm{
	display:block;
	background: #f6f6f6;
	height:230px;
	border-radius: 10px;
}

.c33r_crm .crm_content,
.c33l_crm .crm_content{
	height:155px;
	overflow:auto;
}

.c33r a:hover,
.c33l a:hover{
	background: #f6f6f6;
}
.c33r a span,
.c33l a span{
	border:none;
	width:80px;
	height:80px;
	background-position:0 0;
	display:block;
	margin: 18px auto 10px;
	background-repeat: no-repeat;
	border-radius: 50%;
	transition: all 0.2s ease-in-out;
	background-position: center;
	width: 94px;
	height: 94px;
}
.c33r a:hover span,
.c33l a:hover span{
	background-color: #f59c00;
}
a#crm span{
	background-image: url(../../img/crm_off.svg);
	background-size: 70px auto;
}
a#crm:hover span{
	background-image: url(../../img/crm_on.svg);
}
a#cms span{
	background-image: url(../../img/cms_off.svg);
}
a#cms:hover span {
	background-image: url(../../img/cms_on.svg);
}
a#enwg span{
	background-image: url(../../img/enwg_off.svg);
	background-size: 68px auto;
}
a#enwg:hover span {
	background-image: url(../../img/enwg_on.svg);
}
a#last_viewer span{
	background-image: url(../../img/lastviewer_off.svg);
	background-size: 70px auto;
}
a#last_viewer:hover span{
	background-image: url(../../img/lastviewer_on.svg);
}
a#smp span{
	background-image: url(../../img/smart_off.svg);
}
a#smp:hover span{
	background-image: url(../../img/smart_on.svg);
}
a#newsletter span{
	background-image: url(../../img/newsletter_off.svg);
}
a#newsletter:hover span{
	background-image: url(../../img/newsletter_on.svg);
}
a#mitgliederbereich span{
	background-image: url(../../img/mitglieder_off.svg);
}
a#mitgliederbereich:hover span{
	background-image: url(../../img/mitglieder_on.svg);
}
a#systemverwaltung span{
	background-image: url(../../img/systemsteuerung_off.svg);
	background-size: 68px auto;
}
a#systemverwaltung:hover span{
	background-image: url(../../img/systemsteuerung_on.svg);
}
a#features span{
	background-image: url(../../img/features_off.png);
}
a#features:hover span{
	background-image: url(../../img/features_on.png);
}
a#umfrage span{
	background-image: url(../../img/umfrage_off.svg);
	background-size: 70px auto;
}
a#umfrage:hover span{
	background-image: url(../../img/umfrage_on.svg);
}
a#umzugscheck span{
	background-image: url(../../img/umzug_off.svg);
	background-size: 90px auto;
}
a#umzugscheck:hover span{
	background-image: url(../../img/umzug_on.svg);
}
a#abfuhrkalender span{
	background-image: url(../../img/abfuhr_off.svg);
	background-size: 70px auto;
}
a#abfuhrkalender:hover span{
	background-image: url(../../img/abfuhr_on.svg);
}
a#gewerbecheck span{
	background-image: url(../../img/gewerbecheck_off.svg);
}
a#gewerbecheck:hover span{
	background-image: url(../../img/gewerbecheck_on.svg);
}
a#qpool span{
	background-image: url(../../img/qpool_off.svg);
}
a#qpool:hover span{
	background-image: url(../../img/qpool_on.svg);
}
a#vbz span{
	background-image: url(../../img/vbz_off.svg);
}
a#vbz:hover span{
	background-image: url(../../img/vbz_on.svg);
}
a#stromverbrauch span{
	background-image: url(../../img/stromsparanalyse_off.svg);
}
a#stromverbrauch:hover span{
	background-image: url(../../img/stromsparanalyse_on.svg);
}
a#mobile_app span{
	background-image: url(../../img/mobile_off.svg);
}
a#mobile_app:hover span{
	background-image: url(../../img/mobile_on.svg);
}
a#tarifrechner span{
	background-image: url(../../img/tarifrechner_off.svg);
	background-size: 65px auto;
}
a#tarifrechner:hover span{
	background-image: url(../../img/tarifrechner_on.svg);
}
a#webshop span{
	background-image: url(../../img/webshop_off.svg);
	background-size: 70px auto;
}
a#webshop:hover span{
	background-image: url(../../img/webshop_on.svg);
}
a#marktplatz span{
	background-image: url(../../img/marktplatz_off.svg);
}
a#marktplatz:hover span{
	background-image: url(../../img/marktplatz_on.svg);
}
a#formularcenter span{
	background-image: url(../../img/formularcenter_off.svg);
	background-size: 65px auto;
}
a#formularcenter:hover span{
	background-image: url(../../img/formularcenter_on.svg);
}
a#monitoring span{
	background-image: url(../../img/monitoring_off.svg);
}
a#monitoring:hover span{
	background-image: url(../../img/monitoring_on.svg);
}
a#socialmedia span{
	background-image: url(../../img/social_off.svg);
}
a#socialmedia:hover span{
	background-image: url(../../img/social_on.svg);
}
a#volltextsuche span{
	background-image: url(../../img/volltext_off.svg);
	background-size: 70px auto;
}
a#volltextsuche:hover span{
	background-image: url(../../img/volltext_on.svg);
}
a#statistik span{
	background-image: url(../../img/statistik_off.svg);
}
a#statistik:hover span {
	background-image: url(../../img/statistik_on.svg);
}
a#vertrieb span{
	background-image: url(../../img/vertrieb_off.svg);
	background-size: 75px auto;
}
a#vertrieb:hover span {
	background-image: url(../../img/vertrieb_on.svg);
}
a#aenderungsauftraege span{
	background-image: url(../../img/vertrieb_off.svg);
}
a#aenderungsauftraege:hover span{
	background-image: url(../../img/vertrieb_on.svg);
}
a#intranet span{
	background-image: url(../../img/intranet_off.svg);
}
a#intranet:hover span {
	background-image: url(../../img/intranet_on.svg);
}
a#emailserver span{
	background-image: url(../../img/mailserver_off.svg);
	background-size: 75px auto;
}
a#emailserver:hover span {
	background-image: url(../../img/mailserver_on.svg);
}
a#anrufe span{
	background-image: url(../../img/anrufe_off.svg);
}
a#anrufe:hover span {
	background-image: url(../../img/anrufe_on.svg);
}

#navi_on_off{
	display:block;
	height: 48px;
	width: 18px;
	border-radius: 0 10px 10px 0;
	background: #f59c00 url(../../img/pfeil.png) no-repeat center;
	background-size: 5px auto;
	display:block;
	position:absolute;
	right: 0;
	top:0px;
	height: 44px;
	border-left: 10px solid #f6f6f6;
}
#navi_on_off.reiter {
	top: 43px;
}
#navi_off #navi_on_off{
	background: #f59c00 url(../../img/pfeil-rechts.png) no-repeat center;
	background-size: 5px auto;
	right: 0;
}
#navi_off #col1{
	width: 20px;
	overflow:hidden;
	margin-left: 0;
}
#col1_content.clearfix::after {
    content: none;
}
#navi_off #navigation{
	visibility:hidden;
	height:500px;
}
#navi_off #wo_bin_ich{
	display:none;
}
#navi_off #col3{
	margin-left:32px;
}
.admin_login #navi_on_off,
.admin_sessionExpired #navi_on_off{
	display:none !important;
}
.admin_login #col1,
.admin_sessionExpired #col1{
	display:none;
}
.admin_login #col3,
.admin_sessionExpired #col3{
	margin:0;
	text-align:center;
}
.admin_login #col3 .block,
.admin_sessionExpired .block{
	margin:70px auto 0 auto;
	text-align:left;
	width: 600px;
}
.admin_login #col3 .block.login {
	width: 400px;
}
.admin_login #col3 .block p,
.admin_sessionExpired #col3 .block p {
    margin: 5px 15px 15px 15px;
}
.admin_login form[name="Login"] .input {
	margin-right: 0;
	float: right;
}
.admin_login #col3 .block .input input{
	width: 200px;
}
.admin_login form[name="Login"] .label {
	width: auto;
}

.scrollbar{
	width:100%;
	overflow:auto;
}
.contextMenu table{	
	width:auto !important;
	margin:0;
	padding:0;
}

/*** Seitendarstellung in iFrame ***/

body.DarstellungOhneRahmen{
    background:#fff;
}

body.DarstellungOhneRahmen.no-margin #col3 {
	margin: 0px;
}

.DarstellungOhneRahmen #page_margins,
.DarstellungOhneRahmen #page{
    width:auto;
    min-width:450px;
    padding:0;
    margin:0; 
    background:transparent;
}

.DarstellungOhneRahmen #main{
    padding:0;
    margin:0;
    background:transparent;
}

.DarstellungOhneRahmen #header,
.DarstellungOhneRahmen #brotkrumen,
.DarstellungOhneRahmen #col1,
.DarstellungOhneRahmen #col2,
.DarstellungOhneRahmen #footer{
    display:none;
    width:0;
}

.DarstellungOhneRahmen #col3 {
    float: none;
    margin:20px;
    width: auto;
}

/***********************/
/*** Aufrufprotokoll ***/
/***********************/
td.aufrufprotokoll-aufrufparameter {
    word-wrap: break-word !important;
    word-break: break-all !important;
    white-space: normal !important;
    width: 200px !important;
    display: block !important;
}

}