/*
 * ENWOR CSS
 */

/* Whitelabel CSS */

/*
 * Schriftart
 */

/* normal | normal */

@font-face {
	font-family: 'PTSans';
	src: '../fonts/PTS55F-webfont.eot?#iefix';
	src:
        url('../fonts/PTS55F-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PTS55F-webfont.svg#PTSans') format('svg'),
        url('../fonts/PTS55F-webfont.woff2') format('woff2'),
        url('../fonts/PTS55F-webfont.woff') format('woff'),
        url('../fonts/PTS55F-webfont.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/* normal | italic */

@font-face {
	font-family: 'PTSans';
	src: '../fonts/PTS56F_W-webfont.eot?#iefix';
	src:
        url('../fonts/PTS56F_W-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PTS56F_W-webfont.svg#PTSans') format('svg'),
        url('../fonts/PTS56F_W-webfont.woff2') format('woff2'),
        url('../fonts/PTS56F_W-webfont.woff') format('woff'),
        url('../fonts/PTS56F_W-webfont.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
}

/* bold | normal */

@font-face {
	font-family: 'PTSans';
	src: '../fonts/PTS75F_W-webfont.eot?#iefix';
	src:
        url('../fonts/PTS75F_W-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PTS75F_W-webfont.svg#PTSans') format('svg'),
        url('../fonts/PTS75F_W-webfont.woff2') format('woff2'),
        url('../fonts/PTS75F_W-webfont.woff') format('woff'),
        url('../fonts/PTS75F_W-webfont.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

/* bold | italic */

@font-face {
	font-family: 'PTSans';
	src: '../fonts/PTS76F_W-webfont.eot?#iefix';
	src: url('../fonts/PTS76F_W-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PTS76F_W-webfont.svg#PTSans') format('svg'),
        url('../fonts/PTS76F_W-webfont.woff2') format('woff2'),
        url('../fonts/PTS76F_W-webfont.woff') format('woff'),
        url('../fonts/PTS76F_W-webfont.ttf') format('truetype');
	font-weight: bold;
	font-style: italic;
}

/* normal | normal */

@font-face {
	font-family: 'HelveticaNeueStdRoman';
	src: '../fonts/HelveticaNeueLTStd-Roman_gdi.eot?#iefix';
	src:
        url('../fonts/HelveticaNeueLTStd-Roman_gdi.eot?#iefix') format('embedded-opentype'),
        url('../fonts/HelveticaNeueLTStd-Roman_gdi.svg#HelveticaNeueStdRoman') format('svg'),
        url('../fonts/HelveticaNeueLTStd-Roman_gdi.woff2') format('woff2'),
        url('../fonts/HelveticaNeueLTStd-Roman_gdi.woff') format('woff'),
        url('../fonts/HelveticaNeueLTStd-Roman_gdi.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/*
 * Body
 * - Hintergrundfarbe
 */

body {
    background-color: #ffffff;
	font-family: 'Open Sans', Arial;
	color: #2a2a2a;
}

/* Hintergrundbild auf Login-Seite */
body.background-login {
	background-image: url('../img/enwor-Startseite.jpg');
}

/* Linie auf der Startseite ausblenden */
.back-to-top .border-bottom {
    border-bottom: 0 none;
}

/* Linkfarbe */

a,
a.underlined,
.nav_secondary .nav-item a,
.widget.widget-radio .widget_extra .widget-extra-item,
.new-registration .register-cta,
.password-forgotten, .card-button {
	color: #0083c5;
}

/* Label-Farbe: #666 */

.checker-label,
.form label {
	color: #666;
}

/* Table-Head-Farbe: #666 */

.table-verbrauch .table-head td,
.table-status .table-head td,
.table-wrapper .table-head td {
	color: #2a2a2a;
}

/* TD-Farbe: #666 */

.table-verbrauch td,
.table-status td,
.table-wrapper td {
	color: #2a2a2a;
}

/*
 * Header-Linie
 * - Linienh�he: 5px
 * - Linienfarbe: #fff
 */

.header {
	border-top: #ffffff 5px solid;
}

/*
 * Logo
 * - Breite
 * - H�he
 * - Bild (@1x, @2x)
 */

.header_logo .logo-image {
	background-image: url('../img/Logo_170x60_SWUeP.png'); /* Logo @1x */
	width: 170px; /* Logo Breite */
	height: 60px; /* Logo H�he */
}


/*
 * Navigation
 * - Hintergrundfarbe
 * - Trenner
 * - Logout-Eintrag (< Desktop)
 * - Sub-Navigation Hintergrundfarbe
 */

.nav_main {
	background-color: #e4e6e6; /* Navigation Hintergrundfarbe Desktop */
	font-family: 'Open Sans', Arial;
	color: #3b3a3c;
	text-transform: none; 
}

.desktop .nav_main .level-1 > li:hover > a {
	color: #e02124; /* Navigation, Schriftfarbe, Hover-State */
	text-transform: none;
}

.nav_main .level-1 > li > a {
	color: #3b3a3c; /* Navigation, Schriftfarbe */
	text-transform: none;
}

.nav_main .level-1 {
	border-top: 1px solid #ffffff; /* Border der Navigation: #01bae7 */
	text-transform: none;
}

.nav_main .level-1 .level-2 {
	background-color: #fff; /* Sub-Navigation Hintergrundfarbe */
	text-transform: none;
}

.nav_main .level-1 .level-2 > li a {
	color: #3b3a3c; /* Sub-Navigation, Schriftfarbe */
	text-transform: none;
}

.nav_main .level-1 .level-2 > li:hover a {
	color: #e02124;
	text-transform: none;
}

/*
 * Buttons
 * - Schriftfarbe
 * - Hintergrundfarbe
 */

.button {
	background: #e4e6e6; /* Button Hintergrundfarbe */
	color: #3b3a3c; /* Button Schriftfarbe */
}

.button:hover {
    background-color: #e4e6e6;
    color: #e02124;
}

.button.button-inverted {
    background-color: #e4e6e6;
    color: #3b3a3c;
    padding: 11px 10px;
}

.button.button-inverted:hover {
    background-color: #e4e6e6;
    color: #e02124;
}

.button.button-secondary {
    background-color: #e4e6e6;
    color: #3b3a3c;
}

.button.button-secondary:hover {
    background-color: #e4e6e6;
    color: #e02124;	
}

.styled-radio .radio-label {
    background-color: #e4e6e6;
	border: 0;
	color: #3b3a3c;
}

.styled-radio .radio-label:hover {
	border: 0;
    background-color: #e4e6e6;
    color: #e02124;
}

/*
 * Radio-Buttons Active State
 */

.styled-radio input[type=radio]:checked + label {
    background-color: #e4e6e6;
	border: 0;
	color: #e02124;
}

.styled-radio input[type=radio]:checked + label:hover {
    background-color: #e4e6e6;
	border: 0;
	color: #e02124;
}


/*
 * Eingabefelder
 * - Date-Input, Hintergrundfarbe
 * - Date-Input, Icon-Farbe
 */

fieldset.date-field .add-on {
	background-color: #878a89; /* Date-Input, Hintergrundfarbe */
}

fieldset.date-field .add-on:before {
	color: #fff; /* Datei-Input Icon-Farbe */
}

/* Farbe der Balken im Abschlags-Widget */
.widget_bars .bar.gas {
    background: #fdc102;
}
.widget_bars .bar.strom {
    background: #e01c24;
}

.widget_bars .bar.wasser {
    background: #1158a5;
}

.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.active,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled:hover.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active[disabled],
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active.disabled:hover[disabled] {
	background-color: #878a89;
}

/*
 * Headlines
 */

h1 {
	color: #666;
	font-size: 18px;
	line-height: 20px;
}

.widget_headline {
	color: #666;
}

h2 {
	font-size: 18px;
}

.table-verbrauch .anzeige-verbrauch {
    background: rgba(0, 0, 0, 0) linear-gradient(to right, #878a89 0%, #878a89 100%) repeat scroll 0 0;
    height: 30px;
    margin: 6px 0;
    padding: 6px;
}

/*
 * Progressleiste (Vertragswechsel)
 */

.progress-item {
	background-color: #fff;
}

.progress-item span,
.progress-item:before {
	color: #3b3a3c;
}

.progress-item.selected {
	background-color: #878a89;
}

.progress-item.selected span,
.progress-item.selected:before {
	color: #fff;
}

.progress-item.last:after {
	background-image: url(../img/img-progress-after.png);
}

.progress-item.done span, .progress-item.done, .progress-item.done::before {
    color: #ffffff;
    background: #878a89;
}

.info-toggle,
.question-toggle { /* Hintergrundfarbe */
	background-color: #878a89;
}

@media all and (min-width: 481px) and (max-width: 768px) {

body {
	background-color: #fff; /* Hintergrundfarbe Tablet */
}

}

@media all and (max-width: 1060px) {

.nav_main,
.nav_main .level-1 {
	background-color: #e4e6e6; /* Navigation Hintergrundfarbe Tablet */
	font-family: 'Open Sans', Arial;
	color: #3b3a3c;
	text-transform: none;
}

.nav_main .level-1 > li {
	border-bottom: 1px solid #05689b; /* Navigation Trenner-Farbe */
	font-family: 'Open Sans', Arial;
	color: #3b3a3c;
	text-transform: none;
}

.nav_main .level-1 > li.sublist.sublist-login {
	background-color: #e4e6e6; /* Navigation Logout-Farbe */
	font-family: 'Open Sans', Arial;
	color: #3b3a3c;	
	text-transform: none;
}

.nav_main .level-1 > li:hover > a {
	font-family: 'Open Sans', Arial;
	color: #e02124;	
	text-transform: none;
}

.nav_main .level-1 > li > a {
	font-family: 'Open Sans', Arial;
	color: #3b3a3c;	
	text-transform: none;
}

.nav_main .level-1 .level-2 > li a {
	font-family: 'Open Sans', Arial;
	color: #3b3a3c;	
	text-transform: none;
}

.nav_main .level-1 .level-2 > li:hover a {
	font-family: 'Open Sans', Arial;
	color: #e02124;
	text-transform: none;
}

}

@media all and (max-width: 768px) {

.header_logo .logo-image {
	background-image: url('../img/Logo_340x120_SWUeP.png'); /* Logo Retina @2x */
}

}

@media all and (max-width: 480px) {

body {
	background-color: #fff; /* Hintergrundfarbe Mobile */
}

.nav_main,
.nav_main .level-1 {
	background-color: #e4e6e6; /* Navigation Hintergrundfarbe Mobile */
	text-transform: none;
}

.nav_main .level-1 > li:hover > a {
	font-family: 'Open Sans', Arial;
	color: #e02124;
	text-transform: none;
}

.nav_main .level-1 .level-2 > li a {
	font-family: 'Open Sans', Arial;
	color: #3b3a3c;	
	text-transform: none;
}

.nav_main .level-1 .level-2 > li:hover a {
	font-family: 'Open Sans', Arial;
	color: #e02124;
	text-transform: none;
}

}