/* ==========================================================================
   FONTS
   ========================================================================== */

@font-face{
	font-family:'dinregular';
	src:url('../fonts/din-regu-webfont.woff2') format('woff2'),
		url('../fonts/din-regu-webfont.woff') format('woff'),
		url('../fonts/din-regu-webfont.ttf') format('truetype');
	font-weight:normal;
	font-style:normal;
}

@font-face{
	font-family:'dinmedium';
	src:url('../fonts/din-medi-webfont.woff2') format('woff2'),
		url('../fonts/din-medi-webfont.woff') format('woff'),
		url('../fonts/din-medi-webfont.ttf') format('truetype');
	font-weight:normal;
	font-style:normal;
}

@font-face{
	font-family:'dinbold';
	src:url('../fonts/din-bold-webfont.woff2') format('woff2'),
		url('../fonts/din-bold-webfont.woff') format('woff'),
		url('../fonts/din-bold-webfont.ttf') format('truetype');
	font-weight:normal;
	font-style:normal;
}


/* ==========================================================================
   Base Project
   ========================================================================== */

.c-cookie-popunder, .loaded .c-cookie-popunder.c-disabled {
    bottom: -250px;
	opacity: 0;
}
.c-cookie-popunder {
	width: 100vw;
	background-color: #0086b2;
	position: fixed;
	z-index: 99;
	opacity: 1;
	transition: bottom 0.7s, opacity 0.7s;
}

.c-cookie-popunder .c-container a {
	color: white;
}

.loaded .c-cookie-popunder {
	bottom: 0px;
}
.c-cookie-popunder .c-container {
	padding-top: 2.5em;
	padding-bottom: 2.5em;
	color: white;
}
@media(max-width: 700px) {
    .c-cookie-popunder .c-container {
        padding-top: 1.5em;
        padding-bottom: 1.8em;
    }
    .c-cookie-popunder .c-col-9 {
        width: 100%;
    }
    .c-cookie-popunder .c-col-3 {
        display: block;
        float: none;
        padding-top: 1em;
        clear: both;
    }
}

html,body {
    height:100%;
}

body {
	background:#fff;
	color:#000;
	font-family:'Arial', 'Helvetica', sans-serif;
	font-size:18px;
	-webkit-tap-highlight-color:transparent;
}


/* links */

a {
    -webkit-transition:color 0.5s ease;
	   -moz-transition:color 0.5s ease;
	    -ms-transition:color 0.5s ease;
	     -o-transition:color 0.5s ease;
	        transition:color 0.5s ease;
}

a,
a:visited {
	text-decoration:underline;
	color:#36aae1;
}

a:focus,
a:hover {
	color:#000;
}


/* forms */

button,
input,
select,
textarea {
	color:#666;
	font-family:inherit;
}

textarea {
	resize:none;
}


/* images */

img {
	vertical-align:bottom;
}


/* HELPERS */

.c-clearfix::after {
	content:'';
	display:table;
	clear:both;
}

.c-ir {
	display:block;
	border:0;
	text-indent:-999em;
	overflow:hidden;
	background-color:transparent;
	background-repeat:no-repeat;
	text-align:left;
	direction:ltr;
}


/* ==========================================================================
   Buttons, Links Icons
   ========================================================================== */

.c-btn {
	display:inline-block;
	margin:0;
	border:0;
	background-color:#36aae1;
	padding:1em 40px;
	text-decoration:none;
	line-height:1;
	color:#fff;
	font-size:20px;
    border-radius:0;
	-webkit-transition:background-color 0.5s ease, border-radius 0.5s ease;
	   -moz-transition:background-color 0.5s ease, border-radius 0.5s ease;
	    -ms-transition:background-color 0.5s ease, border-radius 0.5s ease;
	     -o-transition:background-color 0.5s ease, border-radius 0.5s ease;
	        transition:background-color 0.5s ease, border-radius 0.5s ease;
}

.c-btn:visited {
	color:#fff;
}

.c-btn:hover {
	border-bottom-right-radius:20px;
	border-top-left-radius:20px;
	background-color:#0075aa;
	text-decoration:none;
	color:#fff;
}

.c-btn:active {
    transform:translateY(1px);
}

.c-icon::before,
.c-icon::after {
	position:absolute;
	top:0;
	content:'';
	background-image:url(../img/sprite.png);
	background-image:url(../img/sprite.svg), none;
	background-repeat:no-repeat;
}

.c-icon::before {
	left:0;
}

.c-icon::after {
	right:0;
}

.c-icon {
	position:relative;
}


/* ==========================================================================
   Typografie
   ========================================================================== */

/* din medium */

body,
.c-footer-quicklinks li {
	font-family:'dinregular', 'Arial', 'Helvetica', sans-serif;
	font-weight:normal;
}

/* din bold */

h1, .c-h1,
h2, .c-h2,
h3, .c-h3,
h4, .c-h4,
.c-header-title,
b, strong,
.c-footer-quicklinks,
.c-facts-text,
.c-bruttoenergy-title,
.c-energypercentage-text,
fieldset legend,
.akkordeon .titel{
	font-family:'dinbold', 'Arial', 'Helvetica', sans-serif;
	font-weight:normal;
}

h1, .c-h1,
h2, .c-h2 {
	letter-spacing:0.04em;
}

.c-header-title {
	letter-spacing:0.06em;
}

.c-bruttoenergy-title {
	text-transform:uppercase;
}

.c-row .image-above-title,
.c-row .image-below-text {
    margin-bottom:3.5em;
}

.c-row .image-above-title {
    margin-top:30px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin:0;
	padding:0;
}

h1,
.c-h1 {
	position:relative;
	padding-bottom:1em;
	margin-bottom:1em;
	line-height:1.15;
	font-size:36px;
	text-transform:uppercase;
}

h1:after,
.c-h1:after,
.c-title-section h2:after {
	content:'';
	position:absolute;
	bottom:0;
	left:50%;
	width:350px;
	height:1px;
	margin-left:-175px;
	background-color:#fecc00;
}

h2,
.c-h2 {
	padding-bottom:0.4em;
	margin-bottom:0;
	line-height:1.2;
	font-size:28px;
	text-transform:uppercase;
}

.c-title-section h2 {
	position:relative;
	padding-bottom:0.9em;
	margin-bottom:1em;
}

.c-color-info .c-title-section h2:after {
	background-color:#36aae1;
}

.stoerung .c-title-section h2::after {
    background-color:#fff;
}

h3,
.c-h3,
fieldset legend{
	padding-bottom:0.5em;
	line-height:1.2;
	font-size:22px;
	text-transform:uppercase;
}

h4,
.c-h4 {
	display:block;
	padding-bottom:1em;
	line-height:1.5;
	font-size:16px;
}

.c-content,
.c-footer-rich {
	line-height:1.5;
}

.c-text-block p,
.c-modal-dialog p {
	padding-bottom:1.5em;
}

.c-lead {
	font-size:22px;
	padding-bottom:0;
}

.c-text-block ul {
	margin:0 0 1.5em 0;
	padding:0 0 0 25px;
}

.c-text-block .c-list-no-bullet,
.c-list-no-bullet {
	margin:0;
	padding:0;
	list-style:none;
}

.c-text-block ol {
	margin:0 0 1.5em 0;
	padding:0 0 0 25px;
}

.c-text-block blockquote {
	margin:0;
	padding:0;
}

.c-text-block blockquote p {
	padding-bottom:0;
	font-size:24px;
	font-family:'Georgia', serif;
	font-style:italic;
}

.c-text-block blockquote cite {
	font-size:14px;
	font-style:normal;
}

.c-text-right {
	text-align:right;
}

.c-text-center,
.c-title-main,
.c-title-section {
	text-align:center;
}

.c-lang-list,
.c-footer,
.c-footer-quicklinks li {
	font-size:14px;
}



/* ==========================================================================
   Header
   ========================================================================== */

.c-header {
	background-color:#fff;
}

.c-header-logo {
	position:relative;
	height:100px;
	width:236px;
	float:left;
}

.c-header-logo a {
    display:block;
}

.c-header-logo li {
	padding-top:32px;
	padding-left:36px;
}

.c-header-logo li:first-child {
	padding-left:0;
}

.c-header-title {
	position:relative;
	float:left;
	height:46px;
	margin-top:27px;
	max-width:480px;
	padding-left:32px;
    border-left:solid 2px #86cced;
	font-size:26px;
	line-height:0.9;
	text-transform:uppercase;
}

.c-logo-esb {
	width:77px;
}

.c-logo-bkw {
	width:87px;
}

.c-lang-list,
.c-header-logo ul{
	margin:0;
	padding:0;
	list-style:none;
}

.c-lang-list {
	padding-left:20px;
}

.c-lang-list li,
.c-header-logo li {
	display:inline-block;
}

.c-lang-list {
	position:absolute;
	right:20px;
	top:50%;
	margin-top:-0.5em;
}

.c-lang-list li {
	border-left:solid 1px #000;
	padding-left:10px;
	padding-right:10px;
	line-height:1;
}

.c-lang-list li:first-child {
	border-left:none;
	padding-left:0;
}

.c-lang-list a,
.c-header-title a {
	text-decoration:none;
	color:#000;
}

.c-lang-list a:hover,
.c-lang-list .active a {
	color:#36aae1;
}

/* ==========================================================================
   Mainnav
   ========================================================================== */

.c-main-nav {
	background-color:#36aae1;
	font-size:20px;
	line-height:40px;
	text-align:center;
}

.c-main-nav ul {
	margin:0;
	padding:0;
	list-style:none;
}

.c-main-nav-list ul {
	position:absolute;
	top:40px;
	left:0;
	width:240px;
	background-color:#c2e5f6;
	border-radius:0 0 20px 0;
	text-align:left;
	font-size:18px;
}

.c-main-nav-list li {
	display:inline-block;
	position:relative;
}

.c-main-nav-list a {
	display:block;
	padding:0 20px;
	text-decoration:none;
    -webkit-transition:color 0.2s ease, background-color 0.2s ease;
    -moz-transition:color 0.2s ease, background-color 0.2s ease;
    -ms-transition:color 0.2s ease, background-color 0.2s ease;
    -o-transition:color 0.2s ease, background-color 0.2s ease;
    transition:color 0.2s ease, background-color 0.2s ease;
}

.c-main-nav-list a,
.c-main-nav-list a:visited{
	color:#fff;
}

.c-main-nav-list .active > a,
.c-main-nav-list .child-active > a,
.c-main-nav-list a:hover {
	color:#36aae1;
	background-color:#c2e5f6;
}

.c-main-nav-list li li {
	display:block;
}

.c-main-nav-list li li a,
.c-main-nav-list li li a:visited{
	color:#000;
}

.c-main-nav-list li li a {
	border-top:solid 1px #fff;
}

.c-main-nav-list li li:first-child a {
	border-top:none;
}

.c-main-nav-list li li a:hover,
.c-main-nav-list li .active > a {
	background:none;
	color:#36aae1 !important;
}

.c-main-nav-list ul {
	height:0;
	overflow:hidden;
    opacity:0;
    -webkit-transition:opacity 0.2s ease;
    -moz-transition:opacity 0.2s ease;
    -ms-transition:opacity 0.2s ease;
    -o-transition:opacity 0.2s ease;
    transition:opacity 0.2s ease;
}

.c-main-nav-list li.active ul {
	height:auto;
    opacity:1;
}


/* ==========================================================================
   Content
   ========================================================================== */

.c-color-info {
	background-color:#c2e5f6;
}

.c-color-numbers {
	background-color:#fffacc;
    padding-bottom:3.5em;
}

.c-bottom-nopadding {
	padding-bottom:0;
}

/* mindestabstände unter den col-6-bildern (wenn bild- höher als textblock) */

.c-row figure {
    margin-bottom:30px;
}

@media only screen and (max-width:540px)
{
    .c-row figure {
        margin-bottom:0;
    }
    .c-row figure:first-child {
        margin-bottom:1.5em;
    }
}

.c-history-box .c-row figure {
    margin-top:0;
    margin-bottom:0;
}

.c-history-box p:last-child {
    padding-bottom:0;
}



/* ==========================================================================
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Showroom ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
========================================================================== */

.c-showroom-text {
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	padding-top:3.2em;
	padding-bottom:3.2em;
	text-align:center;
}

.c-showroom h1:after {
	background:none;
}

.c-showroom-img {
    height:550px;
    position:relative;
    overflow:hidden;
    opacity:0.7;
}

.c-showroom-img video {
    background:white;
    min-width:100%;
    min-height:550px;
    object-fit:cover;
    position:absolute;
    bottom:0;
}

.c-btn-showroom,
.c-btn-showroom:visited {
	color:#000;
	padding:0.9em 40px;
	border:solid 3px #000;
	background:none;
}

.c-btn-showroom:hover {
	color:#000;
	background:none;
}

@media only screen and (min-width:960px)
{
    .c-showroom-img video {
        bottom:auto;
        top:-5vw;
    }
}

@media only screen and (min-width:1440px)
{
    .c-showroom-img video {
        top:-12vw;
    }
}


/* ==========================================================================
   facts
   ========================================================================== */

.c-fact {
	overflow:hidden;
}

.c-facts-desc,
.c-energypercentage-desc {
	text-align:center;
	line-height:1.2;
	padding:0 1em 2em 1em;
}

.c-facts-energy-desc {
    padding:0 1em 0.8em 1em;
}

.c-facts-energy-prod,
.c-facts-energy-desc {
    padding-bottom:0.8em;
}

.c-facts-content,
.c-energypercentage-content {
	position:relative;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

.c-facts-img {
	margin-bottom:6px;
}

.c-facts-text,
.c-energypercentage-text {
	line-height:1;
	letter-spacing:0;
}

.c-facts-energy {
	width:226px;
}

.c-facts-energy .c-facts-text {
	font-size:16px;
}

.c-facts-energy .c-facts-text span {
	font-size:30px;
}

.c-facts-energy .odometer {
    transform:translateY(-1px);
}

.c-facts-production {
	width:153px;
}

.c-facts-production .c-facts-text {
	font-size:20px;
}

.c-facts-production .c-facts-text span {
	display:block;
	font-size:30px;
}

.c-facts-visitors {
	width:151px;
}

.c-facts-visitors .c-facts-text {
	position:absolute;
	left:0;
	top:51px;
    right:0;
	font-size:55px;
    text-align:center;
}

.c-facts-water {
	width:211px;
}

.c-facts-water .c-facts-text span {
    font-size:30px;
}

.c-facts-downhill {
	width:170px;
}

.c-facts-downhill .c-facts-text,
.c-facts-turbine .c-facts-text {
	font-size:16px;
}

.c-facts-downhill .c-facts-text span,
.c-facts-turbine .c-facts-text span {
	font-size:30px;
}

.c-facts-turbine {
	width:150px;
}


/* ==========================================================================
   Energy percentage
   ========================================================================== */

.c-energypercentage-content {
	width:210px;
}

.c-energypercentage-text-summer,
.c-energypercentage-text-winter {
	position:absolute;
	display:block;
	top:40%;
}

.c-energypercentage-text-summer span,
.c-energypercentage-text-winter span {
	display:block;
	font-size:38px;
}

.c-energypercentage-text-summer {
	right:100%;
	padding-right:20px;
	text-align:right;
}

.c-energypercentage-text-winter {
	left:100%;
	padding-left:20px;
	text-align:left;
}

.c-energieproduktion {
    padding-bottom:3.5em;
}


/* ==========================================================================
   Swiper
   ========================================================================== */

.swiper-container,
.swiper-wrapper,
.swiper-slide {
	position:relative;
    height:326px;
}

.swiper-slide {
	background-size:cover;
    background-position:center center;
}

.swiper-container .pagination {
	position:absolute;
	bottom:6px;
	left:0;
	width:100%;
	text-align:center;
}

.swiper-pagination-switch {
	display:inline-block;
	margin:0 5px;
	width:14px;
	height:14px;
	border-radius:50%;
	background-color:#fff;
	background-color:rgba(255, 255, 255, 0.6);
}

.swiper-active-switch {
	background-color:#36aae1;
}

@media only screen and (max-width:1080px)
{
    .swiper-container,
    .swiper-wrapper,
    .swiper-slide {
        height:29vw;
        min-height:200px;
    }
}



/* ==========================================================================
   Ratiobox
   ========================================================================== */

.c-ratiobox {
	position:relative;
	height:0;
	display:block;
	overflow:hidden;
}

.c-ratiobox > img,
.c-ratiobox > iframe,
.c-ratiobox > object {
	position:absolute !important;
	top:0;
	left:0;
}

.c-ratiobox > img {
	height:auto;
	width:100%;
}

.c-ratiobox > iframe,
.c-ratiobox > object {
	width:100% !important;
	height:100% !important;
	background-color:#000;
}

.c-ratiobox-16by9 {
	padding-bottom:56.25%;
}

.c-ratiobox-4by3 {
	padding-bottom:75%;
}

/* ==========================================================================
   history
   ========================================================================== */

.c-history-box {
	padding:20px 22px;
	background-color:#fff;
}

.c-history-box:after {
	content:'';
	position:absolute;
	top:100%;
	left:50%;
	margin-left:-1px;
	width:3px;
	height:3.5em;
	background-color:#fff;
}

.c-history-last .c-history-box:after {
	width:0;
	height:0;
	background:none;
}

.c-history-last {
    margin-bottom:3.5em;
}

.history .c-container-wide {
    padding-bottom:3.5em;
}


/* ==========================================================================
   organisation
   ========================================================================== */

.organization .c-content {
    padding-bottom:3.5em;
}


/* ==========================================================================
   kraftwerk-details
   ========================================================================== */

.c-color-info {
    padding-bottom:3.5em;
}

.bruegg .c-color-numbers,
.boezingen .c-color-numbers,
.bruegg .c-color-info,
.boezingen .c-color-info {
    margin-bottom:0;
}


/* ==========================================================================
   impressum + disclaimer
   ========================================================================== */

.imprint .c-content,
.disclaimer .c-content {
    padding-bottom:3.5em;
}


/* ==========================================================================
   Teaser
   ========================================================================== */

.c-teaser-list {
	margin:0;
	padding:0;
	list-style:none;
}

.c-teaser-list > li{
	padding-bottom:3.5em;
}

.c-teaser-item,
.c-teaser-img,
.c-teaser-text {
	position:relative;
	width:100%;
}

.c-teaser-img {
	margin-bottom:1em;
}

.c-teaser-home {
	padding-top:3.5em;
	text-align:center;
}


/* ==========================================================================
   Form
   ========================================================================== */

.c-form-item {
	position:relative;
	width:100%;
	padding-bottom:1.5em;
}

.c-form-send {
	text-align:right;
}

#datum_zeit_auswahl_text {
    display:block;
}

#datum_zeit_auswahl_select {
    display:none;
}

.c-form-standard label {
	display:block;
	padding-bottom:2px;
}

.c-form-text,
.c-form-textarea,
.c-form-select {
	width:100%;
}

.c-form-text,
.c-form-textarea {
	border:solid 2px #fff;
	padding:.5em;
}

.c-form-text:focus,
.c-form-textarea:focus {
	border-color:#36aae1;
}

.c-form-textarea {
	height:140px;
}

.c-form-separator {
	padding-bottom:2em;
}

.mandatorix {
    padding-left:3px;
    font-weight:bold;
    color:#37aae1;
}

.c-form-datepicker {
    background-image:url('/static/bik/img/icon-kalender-input.png');
    background-size:33px 30px;
    background-position:right center;
    background-repeat:no-repeat;
}

.c-form-error .c-form-datepicker {
    background-image:url('/static/bik/img/icon-kalender-input-error.png');
}

.c-form-datepicker::-ms-clear {
    display:none;
}


/* radio + checkbox */

input[type=radio] {
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    border:none;
    border-radius:0;
    font-size:1em;
    width:0;
    width:auto;
    visibility:hidden;
    margin-right:.75em;
    background:transparent;
}

input[type='radio']:checked,
input[type='radio']:not(:checked) {
    background:transparent;
    position:absolute;
    visibility:hidden;
    margin:0;
    padding:0;
}

input[type='radio']:checked + label,
input[type='radio']:not(:checked) + label{
    line-height:25px;
}

input[type='radio']:checked + label::before,
input[type='radio']:not(:checked) + label::before {
    content:' ';
    display:inline-block;
    width:32px;
    height:32px;
    position:relative;
    top:0px;
    background:white;
    margin-right:1em;
    box-shadow:inset 0 0 0 5px white;
    -webkit-transform:translateY(9px);
    -moz-transform:translateY(9px);
    -ms-transform:translateY(9px);
    transform:translateY(9px);
    -webkit-transition:background-color 0.2s ease;
    -moz-transition:background-color 0.2s ease;
    -ms-transition:background-color 0.2s ease;
    -o-transition:background-color 0.2s ease;
    transition:background-color 0.2s ease;
}

input[type=radio]:checked + label::before,
input[type=radio]:not(:checked) + label::before {
    border-radius:30px;
}

input[type='radio']:hover  + label::before {
    background-color:#ddd;
}

input[type='radio']:checked  + label::before {
    background-color:#36abe1;
}

.c-form-standard .c-form-type-radio label {
	display:inline-block;
	padding-bottom:0;
	padding-left:0;
	padding-top:0;
	font-weight:normal;
}

.c-form-standard .c-form-type-radio {
    padding-bottom:0.5em;
}


/* error message*/

.c-form-message-error,
.c-form-error label,
.c-form-error .mandatorix{
	color:#c71218;
}

.c-form-message-error ul {
    margin:0;
    padding:0;
	list-style:none;
}

.c-form-message-error h3.active,
.c-form-message-error li.active {
    display:block;
}

.c-form-message-error a,
.c-form-message-error a:visited,
.c-form-message-error a:hover {
    color:#c71218;
	text-decoration:underline;
}

#form-error-messages {
    display:none;
}

#form-error-messages.has-errors {
    display:block;
    margin-bottom:2.5em;
}

#form-error-messages h3 {
    margin:0;
    padding:0;
}

.c-form-error .c-form-text,
.c-form-error .cube-select {
    border-color:#c71218;
}


/* ==========================================================================
   Footer
   ========================================================================== */

.c-footer {
	color:#303030;
	background-color:#969696;
	overflow:hidden;
}

.c-footer-rich {
	padding-top:1.5em;
}

.c-footer-quicklinks ul,
.c-footer-list-disclaimer,
.c-footer-partner ul {
	margin:0;
	padding:0;
	list-style:none;
}

.c-footer-list-disclaimer {
	padding-top:62px;
}

.c-footer-list-disclaimer li {
	display:inline-block;
	padding-left:14px;
	padding-right:10px;
	border-left:solid 1px #303030;
}

.c-footer-list-disclaimer li:first-child {
	padding-left:0;
	border-left:none;
}

.c-footer-list-disclaimer li:last-child {
	padding-right:0;
}

.c-footer a,
.c-footer a:visited {
	color:#303030;
	text-decoration:none;
}

.c-footer-quicklinks li {
	padding-bottom:0.5em;
}

.c-footer-quicklinks a {
	display:inline-block;
}

.c-footer a:hover {
	color:#000;
}

.c-footer-partner {
	position:relative;
	max-width:420px;
	padding:14px 14px 14px 0;
	background-color:#fff;
	border-radius:0 20px 0 0;
}

.c-footer-partner::before {
	content:'';
	position:absolute;
	top:0;
	right:99.9%;
	width:2000px;
	height:100%;
	background-color:#fff;
}

.c-footer-partner li {
	display:inline-block;
	padding-left:36px;
	padding-bottom:14px;
}

.c-footer-partner li:first-child {
	padding-left:0;
}



/* ==========================================================================
   Offcanvas Navigation
   ========================================================================== */

.c-offcanvas {
	display:none;
	position:fixed;
	left:0;
	right:0;
	top:0;
	bottom:0;
	overflow-y:auto;
	z-index:1;
	-webkit-overflow-scrolling:touch;
	        overflow-scrolling:touch;
}

.c-offcanvas-dialog {
	position:relative;
	min-height:100%;
	width:300px;
	background-color:#fff;
	-webkit-transition:left 0s ease;
	   -moz-transition:left 0s ease;
	    -ms-transition:left 0s ease;
	     -o-transition:left 0s ease;
	        transition:left 0s ease;
}



/* styles offcanvas open/close */

.c-offcanvas-open {
	overflow:visible;
}

.c-offcanvas-open,
.c-offcanvas-open body {
	overflow:hidden;
}

.c-offcanvas-backdrop {
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:1;
	background-color:#000;
	background-color:rgba(0, 0, 0, .8);
}

.c-offcanvas-hidden {
	position:absolute;
	left:-9999em;
	width:0;
	height:0;
}

/* offcanvas buttons open/close */
.c-offcanvas-trigger,
.c-offcanvas-close {
	-ms-touch-action:manipulation; /* IE 10  */
	    touch-action:manipulation; /* IE 11+ */
	position:absolute;
	top:10px;
	right:20px;
	width:40px;
	height:40px;
	border:none;
	background:none;
    -webkit-transition:right 0.3s ease;
    -moz-transition:right 0.3s ease;
    -ms-transition:right 0.3s ease;
    -o-transition:right 0.3s ease;
    transition:right 0.3s ease;
}

.c-offcanvas-trigger {
	display:none;
}

.c-offcanvas-trigger:after,
.c-offcanvas-close:after {
	top:50%;
	margin-top:-10px;
	width:24px;
	height:20px;
	background-position:0 0;
}

.c-offcanvas-close:after {
	margin-top:-10px;
	width:20px;
	height:20px;
	background-position:0 -40px;
}

.c-offcanvas-trigger.open {
    right:-60px;
}



/* ==========================================================================
   Custom styling offcanvas content
   ========================================================================== */

.c-offcanvas-lang {
	padding-left:10px;
	padding-right:20px;
	height:60px;
	padding-top:1.5em;
	font-size:16px;
}

.c-offcanvas-lang,
.c-offcanvas-nav {
	line-height:1;
}

.c-offcanvas-lang ul,
.c-offcanvas-nav ul,
.c-offcanvas-partner ul {
	margin:0;
	padding:0;
	list-style:none;
}

.c-offcanvas-lang a,
.c-offcanvas-lang a:visited {
	display:block;
	color:#000;
	text-decoration:none;
}

.c-offcanvas-lang .active a,
.c-offcanvas-lang a:hover {
	color:#36aae1;
}

.c-offcanvas-lang li {
	display:inline-block;
	border-left:solid 1px #000;
}

.c-offcanvas-lang li:first-child {
	border-left:none;
}

.c-offcanvas-lang a {
	padding:0 6px 0 10px;
}

.c-offcanvas-nav ul ul {
	display:none;
}

.c-offcanvas-nav li.open ul {
	display:block;
}

.c-offcanvas-nav ul ul {
	display:none;
}

.c-offcanvas-nav li.open ul {
	display:block;
}

.c-offcanvas-nav a {
	display:block;
	padding:0.6em 20px 0.5em 20px;
	border-bottom:solid 2px #fff;
	font-size:18px;
	text-decoration:none;
	background-color:#36aae1;
}

.c-offcanvas-nav a,
.c-offcanvas-nav a:visited {
	color:#fff;
}

.c-offcanvas-nav li li a,
.c-offcanvas-nav li li a:visited {
	font-size:16px;
	padding-left:36px;
	color:#000;
	background-color:#c2e5f6;
}

.c-offcanvas-nav .active > a,
.c-offcanvas-nav a:hover,
.c-offcanvas-nav li li.active > a,
.c-offcanvas-nav li li a:hover{
	color:#36aae1;
	background-color:#c2e5f6;
}

.c-offcanvas-arrow:after {
	right:16px;
	top:50%;
	margin-top:-9px;
	width:13px;
	height:19px;
	background-position:0 -100px;
    -webkit-transition:-webkit-transform 0.3s ease;
    -moz-transition:-moz-transform 0.3s ease;
    -ms-transition:-ms-transform 0.3s ease;
    -o-transition:-o-transform 0.3s ease;
    transition:transform 0.3s ease;
}

.c-offcanvas-arrow:hover:after {
	background-position:-50px -100px;
}

.open .c-offcanvas-arrow:after {
    -webkit-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    transform:rotate(90deg);
}

.active .c-offcanvas-arrow:after,
.active .c-offcanvas-arrow:hover:after {
	margin-top:-5px;
	width:19px;
	height:13px;
	background-position:0 -80px;
}

.c-offcanvas-partner {
	padding:2.5em 30px 1em 30px;
	font-size:12px;
	line-height:1.5;
	text-align:center;
}

.c-offcanvas-partner li {
	display:inline-block;
	padding-left:14px;
	padding-right:14px;
}

.c-offcanvas-partner p {
	padding-top:1em;
}


/* ==========================================================================
   Content: Akkordeon
   ========================================================================== */

.c-text-block .akkordeon {
    padding:0;
    border-bottom:solid 1px #36aae1;
}

.c-text-block .akkordeon li {
	list-style:none;
	margin:0;
}

.c-text-block .akkordeon .head {
	display:block;
	color:#36aae1;
    position:relative;
    border-top:solid 1px #36aae1;
	padding:19px 32px 17px 0;
    font-family:"dinbold",sans-serif;
	text-decoration:none;
	line-height:100%;
    text-transform:uppercase;
}

.c-text-block .akkordeon .head svg {
    position:absolute;
    display:block;
    right:1px;
    top:0;
    bottom:0;
    left:auto;
    height:24px;
    width:24px;
    margin:auto;
}

.c-text-block .akkordeon .head svg rect {
    opacity:1;
    fill:#36aae1;
    -webkit-transition:opacity 0.3s ease;
    -moz-transition:opacity 0.3s ease;
    -ms-transition:opacity 0.3s ease;
    -o-transition:opacity 0.3s ease;
    transition:opacity 0.3s ease;
}

.c-text-block .akkordeon .active .head svg .plus {
    opacity:0;
}

.c-text-block .akkordeon .body {
	height:0;
	padding:0;
	overflow:hidden;
}

.akkordeon .body {
    -webkit-transition:all 0.1s linear;
    -moz-transition:all 0.1s linear;
    -ms-transition:all 0.1s linear;
    -o-transition:all 0.1s linear;
    transition:all 0.1s linear;
}

.c-text-block .akkordeon .active .body {
    border-top:solid 1px #36aae1;
	padding:20px 0 32px 0;
}

.c-text-block .akkordeon .body td:first-child {
	font-family:"dinmedium",sans-serif;
	padding-right:20px;
    white-space:nowrap;
}

.akkordeon .body p:last-child {
    margin-bottom:0 !important;
    padding-bottom:0 !important;
}

.akkordeon .body table {
    margin-bottom:1em;
}

@media only screen and (max-width:540px)
{
    .c-text-block .akkordeon .body td:first-child {
        white-space:auto;
    }

    .c-text-block .akkordeon table,
    .c-text-block .akkordeon table tbody,
    .c-text-block .akkordeon table tr,
    .c-text-block .akkordeon table td {
        display:block;
        width:100%;
    }
}



/* ==========================================================================
   Content: Balkendiagramm "Energieproduktion"
   ========================================================================== */

.diagramm-block {
	clear:left;
	margin-top:20px;
	margin-bottom:60px;
}

.diagramm-block:last-child {
	margin-bottom:0;
}

.diagramm-block h3 {
	font-family:"dinmedium",sans-serif;
	font-size:100%;
	line-height:20px;
	float:left;
	clear:left;
}

.diagramm-energieproduktion {
	margin-bottom:20px;
}

.diagramm-energieproduktion:last-of-type {
	margin-bottom:0;
}

.diagramm-zeile::after {
    content:"";
    display:block;
    clear:both;
    font-size:0;
    line-height:0;
    opacity:0;
}

.diagramm-zeile,
.diagramm-balken {
    height:18px;
}

.diagramm-zeile {
    white-space:nowrap;
    margin-bottom:10px;
	margin-left:150px;
}

.diagramm-zeile:last-child{
    margin-bottom:0;
}

.diagramm-balken {
    max-width:0px;
    width:0px;
    background:#ec6426;
}

.diagramm-balken,
.diagramm-label,
.diagramm-counter {
    opacity:0;
    -webkit-transition:opacity 0.5s ease;
    -moz-transition:opacity 0.5s ease;
    -ms-transition:opacity 0.5s ease;
    -o-transition:opacity 0.5s ease;
    transition:opacity 0.5s ease;
}

.ready .diagramm-balken,
.ready .diagramm-label,
.ready .diagramm-counter {
    opacity:1;
}

.ready .diagramm-balken {
    -webkit-transition:max-width 2.5s ease-out, opacity 0.5s ease;
    -moz-transition:max-width 2.5s ease-out, opacity 0.5s ease;
    -ms-transition:max-width 2.5s ease-out, opacity 0.5s ease;
    -o-transition:max-width 2.5s ease-out, opacity 0.5s ease;
    transition:max-width 2.5s ease-out, opacity 0.5s ease;
    -webkit-transition-delay:0.5s;
    -moz-transition-delay:0.5s;
    -ms-transition-delay:0.5s;
    -o-transition-delay:0.5s;
    transition-delay:0.5s;
}

.diagramm-label {
    width:90px;
}

.fr .diagramm-label {
    width:180px;
}

.diagramm-counter {
    width:50px;
    text-align:left;
	padding-left:15px;
}

.diagramm-zeile span {
    font-size:100%;
    display:block;
    float:left;
    line-height:20px;
}

@media only screen and (max-width:650px)
{
	.diagramm-block {
		margin-bottom:40px;
	}
	.diagramm-block h3 {
		float:none;
		margin-bottom:10px;
	}
	.diagramm-zeile {
		margin-left:0;
	}
}



/* ==========================================================================
   Content: Balkendiagramm "Energieproduktion"
   ========================================================================== */

#diagramm-sommer-winter {
	position:relative;
	max-width:460px;
	margin:70px auto 0 auto;
	text-align:center;
	font-size:100%;
}

#diagramm-sommer-winter h3 {
	font-family:"dinregular",sans-serif;
	text-transform:none;
	font-size:100%;
	margin-bottom:5px;
	max-width:155px;
	margin:0 auto 5px auto;
}

#diagramm-sommer-winter .zahl {
	font-family:"dinbold",sans-serif;
	font-size:40px;
	line-height:40px;
	display:block;
}

#diagramm-sommer-winter .label {
	position:absolute;
	top:122px;
	display:table;
	font-family:"dinmedium",sans-serif;
	font-size:95%;
	z-index:10;
}

#diagramm-sommer-winter .label.left {
	left:0;
	text-align:right;
}

#diagramm-sommer-winter .label.right {
	right:0;
	text-align:left;
}

#diagramm-sommer-winter .kreis,
#diagramm-sommer-winter .kreis .half,
#diagramm-sommer-winter .kreis .half::after {
	width:200px;
	height:200px;
}

#diagramm-sommer-winter .kreis {
	position:relative;
	border-radius:100%;
	display:inline-block;
}

#diagramm-sommer-winter .kreis .half {
	position:absolute;
	width:100px;
	height:200px;
	left:0;
	top:0;
	overflow:hidden;
}

#diagramm-sommer-winter .kreis .half::after {
	content:"";
	position:absolute;
	left:0;top:0;
	display:block;
	width:200px;
	height:200px;
	border-radius:100%;
	border:solid 30px #ec6426;
}

#diagramm-sommer-winter .kreis .half.flip {
	z-index:0;
	-webkit-transform:rotate(-0deg);
	-moz-transform:rotate(-0deg);
	-ms-transform:rotate(-0deg);
	transform:rotate(-0deg);
	-webkit-transform-origin:100px 100px;
	-moz-transform-origin:100px 100px;
	-ms-transform-origin:100px 100px;
	transform-origin:100px 100px;
	-webkit-transition:-webkit-transform 2.25s ease-out;
	-moz-transition:-moz-transform 2.25s ease-out;
	-ms-transition:-ms-transform 2.25s ease-out;
	-o-transition:-o-transform 2.25s ease-out;
	transition:transform 2.25s ease-out;
    -webkit-transition-delay:0.5s;
    -moz-transition-delay:0.5s;
    -ms-transition-delay:0.5s;
    -o-transition-delay:0.5s;
    transition-delay:0.5s;
}

#diagramm-sommer-winter .kreis .half.flip::after {
	/* unter 50% links / sommer --> #f59c52 (-180=50%winter bis 0deg=100%winter) */
	border-color:#f59c52;
}

#diagramm-sommer-winter .kreis .half.flip.high::after {
	/* über 0-50% links / sommer --> #ec6426 (-180=0%winter bis 0deg=50%winter)   */
	border-color:#ec6426;
}

#diagramm-sommer-winter .kreis::after {
	content:"";
	display:block;
	left:0;
	top:0;
	right:0;
	bottom:0;
	width:200px;
	height:200px;
	border:solid 30px #f59c52;
	border-radius:100%;
}


/* ==========================================================================
   Content: Animationen
   ========================================================================== */

.svg-orange-light {
	fill:#FFBE84;
}

.svg-orange-full, svg .wasserflasche {
	fill:#FF6418;
}

#tachonadel {
    -webkit-transition:-webkit-transform 3s ease-in-out;
    -moz-transition:-moz-transform 3s ease-in-out;
    -ms-transition:-ms-transform 3s ease-in-out;
    -o-transition:-o-transform 3s ease-in-out;
    transition:transform 3s ease-in-out;
	-webkit-transform-origin:113px 131px;
	-moz-transform-origin:113px 131px;
	-ms-transform-origin:113px 131px;
	transform-origin:113px 131px;
    -webkit-transform:rotate(-90deg);
    -moz-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    transform:rotate(-90deg);
}

.animate #tachonadel {
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-ms-transform:rotate(0deg);
	transform:rotate(0deg);
}

svg .mountain {
	-webkit-transform-origin:113px 131px;
	-moz-transform-origin:113px 131px;
	-ms-transform-origin:113px 131px;
	transform-origin:113px 131px;
    -webkit-transform:scale(1, 0.1);
    -moz-transform:scale(1, 0.1);
    -ms-transform:scale(1, 0.1);
    transform:scale(1, 0.1);
}

.animate svg .mountain {
    -webkit-transition:-webkit-transform 3s ease-in-out;
    -moz-transition:-moz-transform 3s ease-in-out;
    -ms-transition:-ms-transform 3s ease-in-out;
    -o-transition:-o-transform 3s ease-in-out;
    transition:transform 3s ease-in-out;
	-webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-ms-transform:scale(1,1);
	transform:scale(1,1);
}

#zahnrad {
	-webkit-transform-origin:75px 71.2px;
	-moz-transform-origin:75px 71.2px;
	-ms-transform-origin:75px 71.2px;
	transform-origin:75px 71.2px;
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-ms-transform:rotate(0deg);
	transform:rotate(0deg);
}

.animate #zahnrad {
	-webkit-transform:rotate(360deg);
	-moz-transform:rotate(360deg);
	-ms-transform:rotate(360deg);
	transform:rotate(360deg);
    -webkit-transition:-webkit-transform 3s ease-in-out;
    -moz-transition:-moz-transform 3s ease-in-out;
    -ms-transition:-ms-transform 3s ease-in-out;
    -o-transition:-o-transform 3s ease-in-out;
    transition:transform 3s ease-in-out;
}

#drop {
    -webkit-transition:-webkit-transform 3s ease-in-out;
    -moz-transition:-moz-transform 3s ease-in-out;
    -ms-transition:-ms-transform 3s ease-in-out;
    -o-transition:-o-transform 3s ease-in-out;
    transition:transform 3s ease-in-out;

    transform: translate(0px,-50px);
  	-ms-transform: translate(0px,-50px);
  	-webkit-transform: translate(0px,-50px);
  	-o-transform: translate(0px,-50px);
  	-moz-transform: translate(0px,-50px);
}

.animate #drop {
	transform: translate(0px,0px);
	-ms-transform: translate(0px,0px);
	-webkit-transform: translate(0px,0px);
	-o-transform: translate(0px,0px);
	-moz-transform: translate(0px,0px);
}

svg .fenster {
	fill:#FF6418;
	opacity:1;
	-webkit-transition:opacity 0.3s ease;
	-moz-transition:opacity 0.3s ease;
	-ms-transition:opacity 0.3s ease;
	-o-transition:opacity 0.3s ease;
	transition:opacity 0.3s ease;
}

svg .fenster.visible {
	opacity:0;
}



/* ==========================================================================
   Content: CubeSelect dropdown
   ========================================================================== */

.cube-select{
    background-color:#fff;
    background-image:none;
    width:100%;
    margin:0 0 10pt 0;
    padding:0.34em;
    border:solid 2px #fff;
    display:block;
    clear:left;
    font-size:1.0em;
    font-style:normal;
    font-weight:normal;
    line-height:1.42857143em;
    cursor:default;
    position:relative;
    overflow:visible;
}

.cube-select,.cube-select .selected{
    font-weight:normal;
    color:#333;
}

.cube-select .selected{
	margin-right:10px;
	text-align:left;
	display:block;
    white-space:nowrap;
    overflow:hidden;
	text-overflow:ellipsis;
	user-select:none;
	-ms-user-select:none;
	-moz-user-select:none;
	-webkit-user-select:none;
}

.cube-select > .fa.wedge{
    position:absolute;
    right:6px;
	left:auto;
	top:0;
	bottom:0;
	width:24px;
	height:24px;
	margin:auto;
    background-image:url('/static/bik/img/chevron-down.svg');
    background-position:center center;
    background-repeat:no-repeat;
    background-size:24px 24px;
}

.cube-select:hover > .fa.wedge{
    color:#36aae1;
}

.cube-select .options{
    position:absolute;
    top:34px;
    left:-2px;
    right:-2px;
	min-width:100%;
    z-index:65535;
    background-color:#fff;
    overflow-x:hidden;
	overflow-y:hidden;
    border:solid 2px #37aae1;
    border-top:none;
    max-height:0;
    opacity:0;
    box-shadow:0 5px 10px rgba(0,0,0,0.2);
    -webkit-transition:max-height 200ms,opacity 125ms;
    -moz-transition:max-height 200ms,opacity 125ms;
    -ms-transition:max-height 200ms,opacity 125ms;
    -o-transition:max-height 200ms,opacity 125ms;
    transition:max-height 200ms,opacity 125ms;
}

.cube-select.open{
    border-color:#37aae1;
}

.cube-select.open .options{
    opacity:1;
    max-height:200px;
	overflow-y:auto;
}

.cube-select .options a{
    position:relative;
    z-index:21;
    display:block;
    padding:9px 9px 8px 9px;
	text-align:left;
    overflow:hidden;
	text-overflow:ellipsis;
    text-decoration:none;
}

.cube-select .options a.hover{
    background-color:#36aae1;
    color:#fff;
}

.cube-select .options a:active{
    position:relative;
    top:-1px;
}

.cube-select .options a.empty{
	color:rgba(0,0,0,0.5);
}

@media only screen and (max-width:540px)
{
    .cube-select .options {
        border-top:none;
    }
}



/* ==========================================================================
   Content: Datepicker (custom theme cascading pikaday.css)
   Pikaday: Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
   ========================================================================== */

.pika-single {
    z-index:9999;
    display:block;
    position:relative;
    color:#333;
    background:#fff;
    border:1px solid #ccc;
    border-bottom-color:#bbb;
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
}

.pika-single:before,
.pika-single:after {
    content:" ";
    display:table;
}

.pika-single:after { clear:both }

.pika-single.is-hidden {
    display:none;
}

.pika-single.is-bound {
    position:absolute;
    box-shadow:0 5px 15px -5px rgba(0,0,0,.5);
}

.pika-lendar {
    float:left;
    width:240px;
    margin:8px;
}

.pika-title {
    position:relative;
    text-align:center;
}

.pika-label {
    display:inline-block;
    position:relative;
    z-index:9999;
    overflow:hidden;
    margin:0;
    padding:5px 3px;
    font-size:14px;
    line-height:20px;
    font-weight:bold;
    background-color:#fff;
}

.pika-title select {
    position:absolute;
    z-index:9998;
    margin:0;
    left:0;
    top:5px;
    filter:alpha(opacity=0);
    opacity:0;
}

.pika-prev,
.pika-next {
    display:block;
    position:relative;
    outline:none;
    border:0;
    padding:0;
    width:20px;
    height:30px;
    text-indent:20px;
    white-space:nowrap;
    overflow:hidden;
    background-color:transparent;
    background-position:center center;
    background-repeat:no-repeat;
    background-size:75% 75%;
    opacity:.5;
}

.pika-prev:hover,
.pika-next:hover {
    opacity:1;
}

.pika-prev,
.is-rtl .pika-next {
    float:left;
    background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==');
}

.pika-next,
.is-rtl .pika-prev {
    float:right;
    background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=');
}

.pika-prev.is-disabled,
.pika-next.is-disabled {
    cursor:default;
    opacity:.2;
}

.pika-select {
    display:inline-block;
}

.pika-table {
    width:100%;
    border-collapse:collapse;
    border-spacing:0;
    border:0;
}

.pika-table th,
.pika-table td {
    width:14.285714285714286%;
    padding:0;
}

.pika-table th {
    color:#999;
    font-size:12px;
    line-height:25px;
    font-weight:bold;
    text-align:center;
}

.pika-button {
    display:block;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    outline:none;
    border:0;
    margin:0;
    width:100%;
    padding:5px;
    color:#666;
    font-size:12px;
    line-height:15px;
    text-align:right;
    background:#f5f5f5;
}

.pika-week {
    font-size:11px;
    color:#999;
}

.is-today .pika-button {
    color:#33aaff;
    font-weight:bold;
}

.is-selected .pika-button,
.has-event .pika-button {
    color:#fff;
    font-weight:bold;
    background:#33aaff;
    box-shadow:inset 0 1px 3px #178fe5;
    border-radius:3px;
}

.has-event .pika-button {
    background:#005da9;
    box-shadow:inset 0 1px 3px #0076c9;
}

.is-disabled .pika-button,
.is-inrange .pika-button {
    background:#D5E9F7;
}

.is-startrange .pika-button {
    color:#fff;
    background:#6CB31D;
    box-shadow:none;
    border-radius:3px;
}

.is-endrange .pika-button {
    color:#fff;
    background:#33aaff;
    box-shadow:none;
    border-radius:3px;
}

.is-disabled .pika-button,
.is-outside-current-month .pika-button {
    pointer-events:none;
    cursor:default;
    color:#999;
    opacity:.3;
}

.pika-button:hover,
.pika-row.pick-whole-week:hover .pika-button {
    color:#fff;
    background:#ff8000;
    box-shadow:none;
    border-radius:3px;
}

.pika-table abbr {
    border-bottom:none;
    cursor:help;
}

.pika-single.bik-theme {
    font-family:dinregular, sans-serif;
    color:#fff;
    background:#36aae1;
    border:none;
    border-bottom-color:#fff;
    -webkit-transform:translate3d(12px, -10px, 0);
    -moz-transform:translate3d(12px, -10px, 0);
    -ms-transform:translate3d(12px, -10px, 0);
    transform:translate3d(12px, -10px, 0);
    -webkit-transition:all 0.3s ease 0.5s;
    -moz-transition:all 0.3s ease 0.5s;
    -ms-transition:all 0.3s ease 0.5s;
    -o-transition:all 0.3s ease 0.5s;
    transition:all 0.3s ease 0.5s;
}

.pika-single.bik-theme.is-hidden{
    -webkit-transform:scale(0.1, 0.1);
    -moz-transform:scale(0.1, 0.1);
    -ms-transform:scale(0.1, 0.1);
    transform:scale(0.1, 0.1);
}

.bik-theme .pika-lendar {
    margin:0;
}

.bik-theme .pika-label {
    background-color:#36aae1;
}

.bik-theme .pika-prev {
    background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAQAAACGG/bgAAAAQ0lEQVR4Ae3KIQ4AIBTD0N0/IeHGI3UIRA3ut/Zl+ltXc5++htVAmIAwAWECwgSEKbgthEoIlRAqIVRCqINQB9nDgQd7ktwFo6UpWQAAAABJRU5ErkJggg==');
}

.bik-theme .pika-next {
    background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAQAAACGG/bgAAAAP0lEQVQ4y+3TMQoAMAgEwfwfAvvjTZ1uGzuvHhBPPGczEG+FRqqRaqQaqUaqkX6QBmmjacvQ6qEVTjsh+xizebvlaWptGXZAAAAAAElFTkSuQmCC');
}

.bik-theme .pika-table th {
    font-size:10px;
    line-height:15px;
    text-align:center;
    color:rgba(255, 255, 255, 0.5);
    text-transform:uppercase;
    text-align:right;
    padding-right:5px;
}

.bik-theme .pika-button {
    color:#fff;
    background:#36aae1;
    border-radius:0 !important;
    font-size:15px;
    -webkit-transition:background-color 0.1s ease;
    -moz-transition:background-color 0.1s ease;
    -ms-transition:background-color 0.1s ease;
    -o-transition:background-color 0.1s ease;
    transition:background-color 0.1s ease;
}

.bik-theme .pika-week {
    color:#999;
}

.bik-theme .is-today .pika-button {
    color:#fff;
}

.bik-theme .is-selected .pika-button {
    color:#36aae1;
    background:#fff;
    box-shadow:none;
}

.bik-theme .is-disabled .pika-button {
    color:#999;
    opacity:.3;
}

.bik-theme .pika-button:hover {
    color:#fff !important;
    background:#ff8000 !important;
}

.pika-table abbr,
.pika-table abbr[title] {
    border:none;
}

.bik-theme abbr {
    cursor:default;
}



/*
 * Swiper - Mobile Touch Slider CSS
 * http://www.idangero.us/sliders/swiper
 *
 * Vladimir Kharlampidi, The iDangero.us
 * http://www.idangero.us/
 *
 * Copyright 2012-2013, Vladimir Kharlampidi
 * The iDangero.us
 * http://www.idangero.us
 *
 * Licensed under GPL & MIT
 *
*/

/* ===============================================================
Basic Swiper Styles
================================================================*/

.swiper-container {
	margin:0 auto;
	position:relative;
	overflow:hidden;
	direction:ltr;
	-webkit-backface-visibility:hidden;
	-moz-backface-visibility:hidden;
	-ms-backface-visibility:hidden;
	-o-backface-visibility:hidden;
	backface-visibility:hidden;
	z-index:1;
}

.swiper-wrapper {
	position:relative;
	width:100%;
	-webkit-transition-property:-webkit-transform, left, top;
	-webkit-transition-duration:0s;
	-webkit-transform:translate3d(0px,0,0);
	-webkit-transition-timing-function:ease;
	-moz-transition-property:-moz-transform, left, top;
	-moz-transition-duration:0s;
	-moz-transform:translate3d(0px,0,0);
	-moz-transition-timing-function:ease;
	-o-transition-property:-o-transform, left, top;
	-o-transition-duration:0s;
	-o-transform:translate3d(0px,0,0);
	-o-transition-timing-function:ease;
	-o-transform:translate(0px,0px);
	-ms-transition-property:-ms-transform, left, top;
	-ms-transition-duration:0s;
	-ms-transform:translate3d(0px,0,0);
	-ms-transition-timing-function:ease;
	transition-property:transform, left, top;
	transition-duration:0s;
	transform:translate3d(0px,0,0);
	transition-timing-function:ease;
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
}

.swiper-free-mode > .swiper-wrapper {
	-webkit-transition-timing-function:ease-out;
	-moz-transition-timing-function:ease-out;
	-ms-transition-timing-function:ease-out;
	-o-transition-timing-function:ease-out;
	transition-timing-function:ease-out;
	margin:0 auto;
}

.swiper-slide {
	float:left;
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
}


/* IE10 Windows Phone 8 Fixes */

.swiper-wp8-horizontal {
	-ms-touch-action:pan-y;
}

.swiper-wp8-vertical {
	-ms-touch-action:pan-x;
}


/* ==========================================================================
   Content: "Besuchen Sie uns"
   ========================================================================== */

.besucher .c-title-main,
.visit-bruegg .c-title-main {
    margin-bottom:1.0em;
}

.besucher .c-text-block.select-kraftwerk,
.visit-bruegg .c-text-block.select-kraftwerk {
    text-align:center;
    margin-bottom:3.5em;
}

.besucher .select-kraftwerk .c-btn,
.visit-bruegg .select-kraftwerk .c-btn {
    width:150px;
    margin:0 5px 10px 0;
    text-align:center;
    padding-left:0;
    padding-right:0;
    -webkit-transition:background-color 0.5s ease,border-radius 0.5s ease,color 0.5s ease;
    -moz-transition:background-color 0.5s ease,border-radius 0.5s ease,color 0.5s ease;
    -ms-transition:background-color 0.5s ease,border-radius 0.5s ease,color 0.5s ease;
    -o-transition:background-color 0.5s ease,border-radius 0.5s ease,color 0.5s ease;
    transition:background-color 0.5s ease,border-radius 0.5s ease,color 0.5s ease;
}

.besucher .select-kraftwerk .c-btn.inactive,
.visit-bruegg .select-kraftwerk .c-btn.inactive {
    color:rgba(54,170,225,1)!important;
    background-color:rgba(255,255,255,1)!important;
}

.besucher .select-kraftwerk .c-btn.inactive:hover,
.visit-bruegg .select-kraftwerk .c-btn.inactive:hover {
    color:rgba(255,255,255,1)!important;
    background-color:rgba(54,170,225,1)!important;
}

.visitors .select-kraftwerk .c-btn.active,
.visit-bruegg .select-kraftwerk .c-btn.active {
    pointer-events:none!important;
    cursor:default!important;
}


/* ==========================================================================
   Content: Newsmeldungen
   ========================================================================== */

.c-news {
    padding-top:0!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
}

.c-news .c-container {
    padding-top:3.5em;
    padding-bottom:3.5em;
    border-bottom:solid 1px white;
}

.c-news .c-container:last-child {
    border-bottom:none;
}

.c-news.stoerung {
    color:#fff;
    background-color:#ff6419;
}

.c-news h4 {
    font-size:12px;
    color:#60747d;
    text-transform:uppercase;
    padding-bottom:0;
    margin-bottom:5px;
}


/* ==========================================================================
   Content: Google Maps
========================================================================== */

.c-google-maps {
    position:relative;
    height:340px;
    border:none;
    overflow:hidden;
    background-color:#fffacc;
}

.google-map {
    display:block;
    height:100%;
}

.google-map .info-window button {
    background-color:#36aae1;
    color:#fff;
    border:none;
    border-radius:0px;
    margin-top:10px;
    padding:1em 1em;
    display:block;
    width:100%;
	-webkit-transition:background-color 0.5s ease,border-radius 0.5s ease;
	   -moz-transition:background-color 0.5s ease,border-radius 0.5s ease;
	    -ms-transition:background-color 0.5s ease,border-radius 0.5s ease;
	     -o-transition:background-color 0.5s ease,border-radius 0.5s ease;
	        transition:background-color 0.5s ease,border-radius 0.5s ease;
}

.google-map .info-window button:hover {
	border-bottom-right-radius:10px;
	border-top-left-radius:10px;
	background-color:#36aae1;
}



/* ==========================================================================
   Content: Odometer
========================================================================== */

.odometer.odometer-auto-theme, .odometer.odometer-theme-minimal {
  display:-moz-inline-box;
  -moz-box-orient:vertical;
  display:inline-block;
  vertical-align:baseline;
  *vertical-align:auto;
  position:relative;
}
.odometer.odometer-auto-theme, .odometer.odometer-theme-minimal {
  *display:inline;
}
.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-minimal .odometer-digit {
  display:-moz-inline-box;
  -moz-box-orient:vertical;
  display:inline-block;
  vertical-align:baseline;
  *vertical-align:auto;
  position:relative;
}
.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-minimal .odometer-digit {
  *display:inline;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, .odometer.odometer-theme-minimal .odometer-digit .odometer-digit-spacer {
  display:-moz-inline-box;
  -moz-box-orient:vertical;
  display:inline-block;
  vertical-align:baseline;
  *vertical-align:auto;
  visibility:hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, .odometer.odometer-theme-minimal .odometer-digit .odometer-digit-spacer {
  *display:inline;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-minimal .odometer-digit .odometer-digit-inner {
  text-align:left;
  display:block;
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  overflow:hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, .odometer.odometer-theme-minimal .odometer-digit .odometer-ribbon {
  display:block;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, .odometer.odometer-theme-minimal .odometer-digit .odometer-ribbon-inner {
  display:block;
  -webkit-backface-visibility:hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value, .odometer.odometer-theme-minimal .odometer-digit .odometer-value {
  display:block;
  -webkit-transform:translateZ(0);
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, .odometer.odometer-theme-minimal .odometer-digit .odometer-value.odometer-last-value {
  position:absolute;
}
.odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, .odometer.odometer-theme-minimal.odometer-animating-up .odometer-ribbon-inner {
  -webkit-transition:-webkit-transform 2s;
  -moz-transition:-moz-transform 2s;
  -ms-transition:-ms-transform 2s;
  -o-transition:-o-transform 2s;
  transition:transform 2s;
}
.odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-minimal.odometer-animating-up.odometer-animating .odometer-ribbon-inner {
  -webkit-transform:translateY(-100%);
  -moz-transform:translateY(-100%);
  -ms-transform:translateY(-100%);
  -o-transform:translateY(-100%);
  transform:translateY(-100%);
}
.odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, .odometer.odometer-theme-minimal.odometer-animating-down .odometer-ribbon-inner {
  -webkit-transform:translateY(-100%);
  -moz-transform:translateY(-100%);
  -ms-transform:translateY(-100%);
  -o-transform:translateY(-100%);
  transform:translateY(-100%);
}
.odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-minimal.odometer-animating-down.odometer-animating .odometer-ribbon-inner {
  -webkit-transition:-webkit-transform 2s;
  -moz-transition:-moz-transform 2s;
  -ms-transition:-ms-transform 2s;
  -o-transition:-o-transform 2s;
  transition:transform 2s;
  -webkit-transform:translateY(0);
  -moz-transform:translateY(0);
  -ms-transform:translateY(0);
  -o-transform:translateY(0);
  transform:translateY(0);
}
.odometer .odometer-formatting-mark {
display:inline-block!important;
}

.c-btn-webcam {
	padding-left: 74px;
}

.c-btn-webcam::before {
	top: 50%;
	left: 40px;
	margin-top: -9px;
	width: 24px;
	height: 16px;
	background-position: 0 -320px;
}