/**
 * *****************************************************************************
 * style.css
 * *****************************************************************************
 *
 * Theme Name: BHO-2019
 * Theme URI: https://bergbahnen-hindelang-oberjoch.de
 * Author: tow | Studio Neo | greiter-cie | Markus Pezold
 * Author URI: http://greiter-cie.de
 * Description: WordPress Theme für die Bergbahnen Hindelang-Oberjoch AG | Design & Konzept: Studio Neo GmbH | Betreuung: Greiter & Cie. GmbH.
 * Text Domain: bho-2019
 * Version: 0.1
 * License: Custom Theme - no GPL License
 * License URI: http://greiter-cie.de
 * Tags: excellent
 *
 * Greiter & Cie. GmbH
 * Unternehmenskommunikation
 * Am Bachtelweiher 6
 * D-87437 Kempten (Allgäu)
 * Germany
 *
 * http://www.greiter-cie.de
 * info[at]greiter-cie.de
 *
 * black forever - internetlösungen
 * Buchenberger Weg 8
 * D-87439 Kempten
 * Germany
 *
 * https://black-forever.de
 * markus.pezold[at]black-forever.de
 *
 * @creation:   2015
 * @updated:    11.12.2019
 * @version:    0.1
 *
 * @client:             Bergbahnen Hindelang-Oberjoch AG
 * @clientwebsite:      https://bergbahnen-hindelang-oberjoch.de
 * @project:            WordPress Installation
 *
 * Stylesheets:
 * @author:			    Markus Pezold | www.studioneo.de
 * @authorwebsite:      greiter-cie.de | black-forever.de | studioneo.de
 *
 * © 2016-19 greiter.cie / black-forever.de for Bergbahnen Hindelang-Oberjoch AG
 * © 2015-16 www.studioneo.de
 *
 * *****************************************************************************
 */


body,
html {
	color: #4d4d4d;
	height: 100%; width: 100%;
}

/**
 * *****************************************************************************
 * 1. Primary styles
 *
 * Project-Colors:
 * petrol/blue   #0053a6; (RGB )
 *
 * ******************************************************************************
 */

/**
 * *****************************************************************************
 * 1.1 Basics & Theme Structure
 * -----------------------------------------------------------------------------
 */

/* aligns */
.centered, .center { text-align: center; }
.right { text-align: right;}
.right { float: right; }

/* colors */
.white, .white:hover { color: #fff; }
.petro, .petro:hover { color: #0053a6; }

.bg-white {
	background-color: #fff;
}

.bg-white-border {
	background-color: #fff;
	border: 1px solid #0053a6;
}

.bg-petrol,
.bg-blue {
	background-color: #0053a6;
}

/* margins & paddings */
.mtop1 { margin-top: 1rem;}
.mtop3 { margin-top:3rem;}

.ptop0 { padding-top:0; }
.pt16 { padding-top:16px; }

.respad { padding:0; }
.resmar { margin:0; }

/* widths */
.row { max-width: 1440px; }
.fullwidth { max-width: 100%; }
.80p { width: 80%; }

/* max-widths */
.mw1440 { max-width: 1440px; }
.mx800 { max-width: 800px; }
.mx750 { max-width: 750px; }
.mx700 { max-width: 700px; }
.mx510 { max-width: 510px; }
.mx210 { max-width: 230px; }
.mx250 { max-width: 250px; }
.mx50p { max-height: 50px; }
.mx32p { max-height: 32px; }

/* font sizes */
.smaller { font-size:smaller; }
.fs07 { font-size: .7rem; }


.img-u {font-size: .55rem;}


/* borders hrs */
.top-border-p1 { border-top: 1px solid #cacaca; }
.top-border-p1.petrol { border-top: 1px solid  #0053a6; border-bottom: 0px; background-color: #0053a6; height: 1px;}

.top-border-p2 { border-top: 2px solid #cacaca; }
.top-border-p2.petrol { border: 2px solid #0053a6; background-color: #0053a6; height: 2px; }

.top-border-p3 { border-top: 3px solid #cacaca; }
.top-border-p3.petrol { border: 3px solid #0053a6; background-color: #0053a6; height: 3px; }

embed, iframe, object, video {
    margin-bottom: 1.75em;
    max-width: 100%;
    vertical-align: middle;
}

.video-block {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.video-block iframe,
.video-block object,
.video-block embed,
.video-block video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#cookie-notice {
	background-color: rgba(0,0,0,0.8) !important;
}

#cookie-notice.cn-bottom {
	min-height: 70px;
	border-top: 2px solid #fff;
}

.cookie-notice-container {
	padding: 25px;
}

.cookie-notice-container a {
	color: #fff;
	text-decoration: underline;
}

.cookie-notice-container a:hover,
.cookie-notice-container a:focus {
	text-decoration: none;
}

.cookie-notice-container a.cn-button {
	padding: 1em;
	border: 1px solid #fff;
	color: #fff;
	text-decoration: none;
	background-color: #0053a6;
	font-weight: normal;
	font-size: 14px;
}

.cookie-notice-container a.cn-button:hover,
.cookie-notice-container a.cn-button:focus {
	color: #0053a6;
	text-decoration: none;
	background-color: #fff;
}

@media all and (max-width: 1500px) {
	#cn-notice-text {
		display: block;
		margin: 2em 0;
	}
}



/**
 * *****************************************************************************
 * 1.2 Typography
 * -----------------------------------------------------------------------------
 */

p { font-size: 16px; font-size: 1rem; color: #4d4d4d}

p.img-caption,
p.download-link {
	margin: 1em 0;
}

h1, h2, h3, h4, h5 { font-weight: bold; padding:0; margin:0;}

h1 { font-size: 1.5rem; color: #0053a6; }

h1.headline,
h2.headline {
	font-size: 32px;
	font-size: 2rem;
	font-weight: normal;
	text-transform: uppercase;
	color: #0053a6;
	margin-bottom: 1em;
}

.headline2 {
	font-size: 1rem;
	color: white;
	padding:0 3rem 0 1rem;
	line-height: 3.3rem;
}

.page-template-template-page-2nd .column h1,
.page-template-template-page-2nd .column h2 {
	font-size: 1.5rem;
	color: #0053a6;
	margin: 1.5em 0; 
}

.page-template-template-page-2nd .column h3 {
	font-size: 1.25rem;
}

.page-template-template-page-2nd .column h4 {
	font-size: 1rem;
	font-weight: bold;
}

a { color: #0053a6; font-weight: bold; }
a:hover,
a:focus { text-decoration: underline; }

main ul {
	margin: 1rem 0;
	padding: 0;
}

main li {
	margin: 0.5rem;
}


/**
 * *****************************************************************************
 * 1.3 Header & Navigation
 * -----------------------------------------------------------------------------
 */

.logo {float: left; height: 100px; padding: 1rem 1rem 1rem 3rem;}

.admin-bar body { padding-top: 32px; }
.admin-bar .banner { margin-top: -32px; }

.nav-anker { position: fixed; right: 0; z-index: 9998;}
.nav-container { padding:0; margin:0; height: 100%; width: 100%;}
.nav-content { z-index: 1000; position: fixed; width: 100%; max-width: 100%; border-bottom: 1px solid #0053a6; padding:0; margin:0!important; background-color: white; }

#main-nav {
	float: right;
	display: block;
	margin: 2rem auto 0 auto;
	font-weight: normal;
}

#main-nav li {
	display: inline-block;
}

#main-nav a {
	font-weight: normal;
	color: #0a0a0a;
	padding: 1rem;
}

#main-nav a:hover,
#main-nav a:focus {
	text-decoration: none;
}

#main-nav .sub-menu { padding: 2rem;}
#main-nav .sub-menu li { display: block }
#main-nav .sub-menu a { color: white; }
#main-nav .sub-menu a:hover,
#main-nav .sub-menu a:focus { text-decoration: underline; }

#main-nav .menu-item { text-align: center; }
#main-nav .sub-menu .menu-item {
	width: auto;
	text-align: left;
}

#main-nav .current-menu-item, #main-nav .current_page_item,
#main-nav .current-menu-item a, #main-nav .current_page_item a,
#main-nav .current_page_parent a, #main-nav .current_page_ancestor a { font-weight: bold;}
#main-nav .current-menu-item li a, #main-nav .current_page_item li a { font-weight: normal;}
#main-nav .sub-menu .current-menu-item, #main-nav .sub-menu .current_page_item { color: white; text-decoration: underline;} /* FF Bug!? */

/* Slicknav Mobile */

 .slicknav_menu { display:none; }

/* Breadcrumb */

.breadcrumbs {
	display: table;
	margin: 2em auto;
	font-weight: normal;
	text-transform: uppercase;
}

.breadcrumbs a {
	color: #0a0a0a;
	font-weight: normal;
}

/* Arrow-Down */

.arrow-down {
	display: none;
	position: absolute;
  	bottom: -50px;
  	left: 50%;
  	margin-left:-15px;
  	width: 30px;
  	height: 30px;
  	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0yOTMuNzUxLDQ1NS44NjhjLTIwLjE4MSwyMC4xNzktNTMuMTY1LDE5LjkxMy03My42NzMtMC41OTVsMCwwYy0yMC41MDgtMjAuNTA4LTIwLjc3My01My40OTMtMC41OTQtNzMuNjcyICBsMTg5Ljk5OS0xOTBjMjAuMTc4LTIwLjE3OCw1My4xNjQtMTkuOTEzLDczLjY3MiwwLjU5NWwwLDBjMjAuNTA4LDIwLjUwOSwyMC43NzIsNTMuNDkyLDAuNTk1LDczLjY3MUwyOTMuNzUxLDQ1NS44Njh6Ii8+DQo8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMjIwLjI0OSw0NTUuODY4YzIwLjE4LDIwLjE3OSw1My4xNjQsMTkuOTEzLDczLjY3Mi0wLjU5NWwwLDBjMjAuNTA5LTIwLjUwOCwyMC43NzQtNTMuNDkzLDAuNTk2LTczLjY3MiAgbC0xOTAtMTkwYy0yMC4xNzgtMjAuMTc4LTUzLjE2NC0xOS45MTMtNzMuNjcxLDAuNTk1bDAsMGMtMjAuNTA4LDIwLjUwOS0yMC43NzIsNTMuNDkyLTAuNTk1LDczLjY3MUwyMjAuMjQ5LDQ1NS44Njh6Ii8+DQo8L3N2Zz4=);
  	background-size: contain;
}

.page-template-template-summer .arrow-down {
	bottom: 20px;
}

.arrow-down:hover {
	cursor: pointer;
}

.bounce {
  -moz-animation: bounce 2s infinite;
  -webkit-animation: bounce 2s infinite;
  animation: bounce 2s infinite;
}

.info-highlight-link {
	font-weight: normal;
}
.info-highlight-link:hover {
	color:#ffffff;
}
.info-highlight {
	background-color: #0053a6;
	color:#ffffff;
	clear:both;
	text-align: center;
	padding:0.5rem;
}

.info-highlight span {
	font-weight:bold;
}

.breadcrumbs {
	margin-top:3rem;
}

/**
 * *****************************************************************************
 * 1.4 Infobox (Header)
 * -----------------------------------------------------------------------------
 */

.infobox-container {
	display: none;
}

.infobox-mobile,
.infobox-mobile .infobox-container {
	display: block;
}

.infobox {
	background-color: #0053a6;
	background-color: rgba(0, 83, 166, 0.8);
	margin: 0;
	padding: 2rem;
	min-height: 300px;
}

.infobox h2 {
	margin: 0;
	font-size: 1rem;
	color: #fff;
	text-transform: none;
	text-align:center;
}

.infobox h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: normal;
	color: #fff;
	text-transform: none;
}

.infobox p {
	color: #fff;
	font-weight: normal;
	margin: 0;
}

/**
 * *****************************************************************************
 * 1.4.1 Infobox - Weather
 * -----------------------------------------------------------------------------
 */

.infobox .weather {
	padding: 1em 0;
}

.weather p.temperature {
	margin-top: 0.5rem;
}

.weather.snow-report {
	background: transparent url(assets/icons/weather/schneeflocke.png) no-repeat scroll center center;
	border-top: 1px solid #fff;
	padding: 1em 0 0 0;
}

.weather-future h2 {
	display: none;
}

.weather-future h3.small {
	font-size: 0.8rem;
}

.weather-future p {
	font-size: 0.8rem;
	font-weight: normal;
}

.weather-future .day-after-tomorrow {
	border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
}

/**
 * *****************************************************************************
 * 1.4.2 Infobox - Webcam & Status
 * -----------------------------------------------------------------------------
 */

.infobox .webcams {
	padding: 1em 0;
    border-top: 1px solid #fff;
}

.webcams .webcam {
	padding: 0;
	margin: 0;
}

.webcams .webcam a {
	display: block;
}

.webcams .webcam img {
	width: 100%;
	height: auto;
}

.webcams #webcam1 {
	padding-right: 0.5em;
	border-right: 1px solid #fff;
}

.webcams #webcam2 {
	padding-left: 0.5em;
}

.infobox .webcam-url {
	float: left;
    margin: 1em auto 0 auto;
    text-align: center;
    width: 100%;
}

.webcam-url a {
	color: #fff;
	text-decoration: none;

}

.webcam-url a:hover,
.webcam-url a:focus {
	text-decoration: underline;
}



/**
 * *****************************************************************************
 * 1.x.x LiveCams
 * -----------------------------------------------------------------------------
 */

section.livecam,
section.livecam-section {
	padding: 2em 0;
}

.livecam-container {
  position: relative;
  height: 0;
  overflow: hidden;
}

/* Aspect Ratio */
.livecam-container-ratio {
  padding-bottom: 62.5%;
}

.livecam-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0 !important;
  border: 1px solid #fff;
  background-color: #fff;
}

section.livecam h1.headline {
	color: #fff;
	text-transform: none;
}

section.live-section {
	padding: 1em 0;
}

.webcam-section a {
	display: block;
}

.webcam-box img,
.webcam1 img,
.webcam2 img {
	width: 100%;
	height: auto;
}

.webcam1 p,
.webcam2 p {
	margin: 0;
	padding: 1em;
	text-align: left;
	color: #fff;
}



section.status-section {
	padding: 1em 0;
}

section.status-section h2 {
	color: #0053a6;

}

.status-section .status-box img {
	float: right;
	vertical-align: middle;
}

.status {
	margin: 2rem auto;
	padding: 2rem;
}

.statusbox {
	background-color: #0053a6;
	background-color: rgba(0, 83, 166, 0.8);
	margin: 1rem 0;
	padding: 1rem 2rem;
}

.statusbox h2 {
	margin: 0;
	font-size: 1rem;
	font-weight: bold;
	color: #fff;
	text-transform: none;
}

.statusbox p {
	margin: 0;
	font-size: 1rem;
	font-weight: normal;
	color: #fff;
}

.status.lifts {}
ul.lifts {
	list-style: none;
	margin: 3em 0;
}

.lift {
	margin: 1em 0;
	padding: 0;
	text-align: left;
}

.status.skiruns {}
ul.skiruns {
	list-style: none;
	margin: 1.5em 0 2em 0;
}

.skirun {
	margin: 1em 0;
	padding: 0;
	text-align: left;
}

.status.huts {}
ul.huts {
	list-style: none;
	margin: 3em 0
}

.hut {
	margin: 1em 0;
	padding: 0;
	text-align: left;
}

.status-icon {
	display:inline-block;
    background-color: #888;
    height: 16px;
    width: 16px;
    border-radius: 8px;
    -moz-border-radius:8px;
    -webkit-border-radius: 8px;
	line-height: 20px;
}

.status-icon.closed {
	background-color: #888;
}

.status-icon.open {
	background-color: #008000;
}

.status-icon.none {
    display: none;
}

li .status-icon {
	margin-right: 1em;
}


/**
 * *****************************************************************************
 * 1.x.x
 * -----------------------------------------------------------------------------
 */

a.teaser-link:hover .image-badge h2,
a.teaser-link:focus .image-badge h2,
.image-badge h2 a:hover,
.image-badge h2 a:focus { text-decoration: underline; }

.image-badge h2 {
	font-size: 32px;
	font-size: 2rem;
	line-height: 1.4;
	font-weight: normal;
	text-transform: none;
	background-color: #0053a6;
	padding: 0.5em 1em 0.5em 0.5em;
	color: white;
}
.image-badge h2 a { color: #fff; }

a.teaser-link:hover .image-badge h2,
a.teaser-link:focus .image-badge h2,
.image-badge h2 a:hover,
.image-badge h2 a:focus { text-decoration: underline; }


.badge-div-right {
	position: absolute;
	right: 0;
	margin-top: 5rem;
}

.badge-div-left {
	position: absolute;
	left: 0;
	margin-top: 5rem;
}

.badge-div {
	position: absolute;
	margin-top: 5rem;
	max-width: 80%
}

.banner { border-bottom: 70px solid #0053a6;}

a.teaser-link:hover h2.box-headline,
a.teaser-link:focus h2.box-headline { text-decoration: underline; }

.text-block {
	margin: 16px auto;
	margin: 1rem auto;
	max-width: 900px;
}

h2.box-headline .status-icon {
    float: right;
    height: 24px;
    width: 24px;
    border-radius: 12px;
    -moz-border-radius:12px;
    -webkit-border-radius: 12px;
    margin: 3px;
}

.box-text {
	font-weight: normal !important;
	margin-top: 1rem;
	padding: 0 .5rem;
}


#pistenplan { padding: 1rem; z-index: 9999;}


/**
 * *****************************************************************************
 * 1.x.x News List
 * -----------------------------------------------------------------------------
 */

.news-list h2 { font-size: 1.5rem; font-weight: bold; text-transform: uppercase; color: #0053a6; margin: 1.5rem 0;}
.news-list p { font-weight: normal; }
.news-list a, .news-list a:hover { color: #0053a6; }

.news-list .column:last-child:not(:first-child),
.news-list .columns:last-child:not(:first-child) {
    float: left;
}

.news-item { margin: 1em 0; border: 1px solid #0053a6; }
.news-item h3 { font-size: 1rem; background-color: #0053a6; padding: 1.25em; height: 85px; text-transform: none; }
.news-item h3 a { color: #fff; }
.news-item h3 a:hover,
.news-item h3 a:focus { color: #fff; text-decoration: underline; }

.news-teaser { padding: 1rem; }
.news-teaser p.date { font-size: 0.875rem; color: #0053a6; }
.news-teaser p { color: #0053a6; }
.news-teaser a { font-size: 0.875rem; font-weight: bold; color: #0053a6; }
.news-teaser a:hover,
.news-teaser a:focus { text-decoration: underline; }
.news-pic {
	max-width: 610px;
	width: auto;
	height: auto;
	background-color: #fafafa;
}

.news-pic img {
	width: 610px;
}

.news-petroleum { background-color: #0053a6; height: 100%; }
.news-petroleum p, .news-petroleum h3 {color: white;}

.news-white {
	background-color: white;
	border: 1px #0053a6 solid;
}

.news-white p, .news-white h3 {color: #0053a6;}
.news-petroleum, .news-white {padding: 2rem;}

.news-petroleum h2,
.news-white h2 { font-size: 1.5rem; text-transform: none; margin-bottom: 1rem;}

.news-petroleum h2 {
	color: #fff;
}

.news-white h2 {
	color: #0053a6;
}

.news-petroleum p,
.news-white p {
	font-weight: normal; font-size: 0.875rem;
}

.news-badge {
	font-size: 2rem;
	line-height: 2rem;
	text-transform: none;
	background-color: #0053a6;
	padding: .75rem 3rem .5rem 1.5rem;
	color: white;
}

/**
 * *****************************************************************************
 * 1.x.x Single News
 * -----------------------------------------------------------------------------
 */

.single-news h1.headline,
.single-news h2.headline {
	font-size: 32px;
	font-size: 2rem;
	font-weight: normal;
	text-transform: uppercase;
	color: #0053a6;
	margin-bottom: 1em;
}

.single-news .news-intro {
	margin: 0 0 2em 0;
}

.single-news .news-intro p {
	font-size: 1.125rem;
}

.single-news p {
	font-size: 1rem;
	font-weight: normal;
}

.single-news h2 {
	font-size: 1.125rem;
	font-weight: normal;
	color: #0053a6;
}

.single-news h3 {
	font-size: 1rem;
	font-weight: bold;
}

.single-news h4 {
	font-size: 1rem;
	font-weight: normal;
	color: #0053a6;
}


/**
 * *****************************************************************************
 * 1.x.x Teaser Box
 * -----------------------------------------------------------------------------
 */

.teaser-box.text {
	padding: 2rem;
}

.teaser-box .bg-petrol {
	height: 100%; /* evtl. nicht notwendig */
	color: #fff;
}

.teaser-box h1,
.teaser-box h2 {
	font-size: 1.5rem;
	font-weight: normal;
	text-transform: none;
	margin-bottom: 1rem;

}

.teaser-box.bg-petrol h1,
.teaser-box.bg-petrol h2 {
	color: #fff;
}

.teaser-box.bg-white-border h1,
.teaser-box.bg-white-border h2 {
	color: #0053a6;
}

.teaser-box.bg-petrol p {
	color: #fff;
}

.teaser-box.bg-petrol p:last-child {
	margin-bottom: 0;
}

.teaser-box.bg-petrol a {
	color: #fff;
}

.teaser-box.bg-white-border a {
	color: #0053a6;
}

.teaser-box h2.box-headline {
	color: #fff;
	font-size: 1.5rem;
	line-height: 1.5;
	font-weight: normal;
	padding: 0.5em 1em;
	background-color: #0053a6;
	max-width: 690px;
}

/**
 * *****************************************************************************
 * 1.x.x Text Box (display-3er-boxen) - Content or Teaser
 * -----------------------------------------------------------------------------
 */

.three-boxes .column:nth-child(3n+4) {
	clear: left;
}

.text-box {
	margin: 2rem auto;
	max-width: 610px;
}

.text-box h2.box-headline {
	color: #fff;
	font-size: 1.5rem;
	line-height: 1.5;
	font-weight: normal;
	padding: 0.5em 1em;
	background-color: #0053a6;
	max-width: 690px;
}

a.text-box-link {
	color: #fff;
}

a.text-box-link:hover,
a.text-box-link:focus {
	text-decoration: underline;
	color: #fff;
}

.text-box-content {
	padding: 1rem;
}

.text-box-content h3 {
	font-size: 1rem;
	margin: 0.5rem 0;
	color: #4d4d4d
}

.text-box ul {
	font-size: 14px;
	font-size: 0.875rem;
}

.text-block h2 { font-size: 1.5rem; font-weight: normal; margin: 2rem 0 1rem 0;  }

.text-block .sub-content {
	margin: 1rem auto;
	padding: 1rem;
	max-width: 450px;
	border: 1px #444 solid;
}

.text-block .opening-box {
	margin: 1rem auto;
	padding: 1rem;
	max-width: 450px;
	border: 1px #444 solid;
}

.opening-box h2 {
	font-size: 1.5rem;
	font-weight: normal;
}






 /**
 * *****************************************************************************
 * 1.x.x Layout Preise
 * -----------------------------------------------------------------------------
 */

.preiseinfo-winter p {font-size: 1.2rem!important;}

.preise tr, .preise td {color: white; font-size: .8rem; border: 1px white solid; border-left: none; border-right:none; border-top: none;}
.preise thead, .preise tbody {border: none; }
.preise thead {line-height: 1;}
.preise thead img {padding-bottom: 0.75rem;}
.preise-footer { padding: 2rem 0; background-color: #0053a6; }
.preise-footer p { font-weight: normal; color: white; }
.preise-ff {float: right; margin-bottom: -6rem;}
.s-preise-ff {float: right; margin-bottom: -3.3rem;}
.preise-aw {float: right; margin-bottom: -3.5rem;}
.preise-h1-wrapper {margin-top: 2rem;  padding: 2rem 0; background-color: #0053a6;}
.preise {max-width: 700px; margin: 0 auto; margin-top: 3rem; width:100%;}
.preise-b-r {border-right: 1px white solid !important;}
.preise-wrapper {padding: 2rem 0; background-color: #0053a6;}
.preise-inner {padding:0 .5rem; margin: 0 auto; max-width: 700px;}
td.price {text-align:center;}

 /**
 * *****************************************************************************
 * 1.x.x Layout Partner
 * -----------------------------------------------------------------------------
 */

.partner p {color: white; font-size: 1rem; line-height:2rem; margin:0;}

.partner p.box-headline {
	color: #fff;
	font-size: 1rem;
	line-height: 1.5;
	font-weight: normal;
	padding: 0.5em 1em;
	background-color: #0053a6;
	max-width: 690px;
}

.partner .border-to-top {
    border-width: 1px;
    border-style: solid;
    -webkit-border-image:
      -webkit-gradient(linear, 0 100%, 0 0, from(#0053a6), to(rgba(0, 0, 0, 0))) 1 100%;
    -webkit-border-image:
      -webkit-linear-gradient(bottom, #0053a6, rgba(0, 0, 0, 0)) 1 100%;
    -moz-border-image:
      -moz-linear-gradient(bottom, #0053a6, rgba(0, 0, 0, 0)) 1 100%;
    -o-border-image:
      -o-linear-gradient(bottom, #0053a6, rgba(0, 0, 0, 0)) 1 100%;
    border-image:
      linear-gradient(to top, #0053a6, rgba(0, 0, 0, 0)) 1 100%;
      border-top: none; border-bottom: none;
}

.partner a {
	display: block;
}

.partner a:hover,
.partner a:focus {
	text-decoration: none;
}

.partner a:hover .box-headline,
.partner a:focus .box-headline {
	text-decoration: underline;
}

/**
 * *****************************************************************************
 * 1.x.x Kontaktformular
 * -----------------------------------------------------------------------------
 */

.contact-form { position: relative; margin-top: 4rem; }
.contact-form input { margin: 0 }
.contact-form label,
.contact-form button {text-align: center; font-weight: bold; text-transform: uppercase;}
.contact-form button { position: absolute; right:0; }

.result-ok {text-align: center; font-weight: bold; margin: 2rem auto;}

.ksend {
	background: #0053a6;
	color: #fff;
	padding: 0.5rem 1rem;
	font-weight: bold;
	border: none;
}

span.wpcf7-not-valid-tip {
    color: #B80000;
    display: block;
    font-size: 1em;
    font-weight: normal;
}

div.wpcf7-validation-errors {
	border: none;
}

div.wpcf7-response-output {
	color: #B80000
}

div.wpcf7-mail-sent-ok {
	color: #398f14 !important;
}


/**
 * *****************************************************************************
 * 1.x.x Footer
 * -----------------------------------------------------------------------------
 */

footer {
	padding: 5rem 2rem;
	text-transform: uppercase;
}

footer .column { padding: 1rem; }

footer p,
footer a,
footer a:hover,
footer li {font-weight: bold; color: #0053a6; font-size: .75rem;}


footer .footer-logo {
	padding: 0 1rem;
}

.footer-logo p {
	font-size: 0.5rem;
	font-weight: normal;
	margin: 1em 0;
}

footer .address,
footer .address p {
  font-weight: bold;
  font-size: .75rem;
  color: #0053a6;
  text-transform: uppercase;
}

footer .address .opening p {
	margin: 1em 0;
	text-transform: none;
}

footer input[type="text"] {
	max-width: 290px;
	background-color: #e5edf6;
	color: #80a8d0;
	box-shadow: none;
	border: 1px solid #0053a6;
	font-size: 0.8rem;
	font-weight: bold;
}

#signup input { margin: 0 auto 1rem; }

footer input[type="checkbox"],
footer input.privacy {
	margin-bottom: 0;
}

footer .privacy {
	font-weight: normal;
	text-transform: none;
}

footer .privacy a {
	text-decoration: underline;
}

footer .privacy a:hover,
footer .privacy a:focus {
	text-decoration: none;
}

footer .button {
	background: #0053a6;
	color: #fff;
	padding: 0.5rem 1rem;
	font-weight: bold;
	border: none;
}






.perm-menu { float: right; }

.perm-menu li {
	display: block;
	padding: 0;
	margin-bottom: 1em;
}

.perm-menu li.menu-item {
	text-align: right;
	width: auto;
}

.perm-menu li.imprint {
	margin-top: 3em;
}

.perm-menu li.menu-item a {
	padding: 0;
	color: #0053a6;
}

.perm-menu li.menu-item a:hover,
.perm-menu li.menu-item a:focus {
	text-decoration: underline;
}


/**
 * *****************************************************************************
 * 2. Media queries for responsive design.
 *
 * These follow after primary styles so they will successfully override.
 *
 * *****************************************************************************
 */


@media only screen and ( max-width: 40rem ) {

	.nav-anker { position: absolute; }
	.nav-content { position: relative; }

  	.ib-mobile {
  		display:block;
		margin: 2rem auto;
		background: white;
		width: 320px;
		box-shadow: 10px 10px 10px -4px rgba(0,0,0,0.75);
	}

	.logo { height: 75px; }

	h2 {font-size: 1rem;}

	.box {
		margin: 1rem 0;
	}

	.weather .today {
		margin: 0.5em 0;
	}

	.weather.snow-report {
    	background: rgba(0, 0, 0, 0) url("assets/icons/weather/schneeflocke.png") no-repeat scroll center 1em;
    	padding: 5em 0 1em 0;
		border-bottom: 1px solid #ffffff;
	}

	.weather.snow-report .snow-height {
		margin: 0.5em 0;
	}

	.weather-future h2 { display: block }
	.weather-future .column {
		margin: 1em 0 0 0;
		border: none;
	}

	.webcams .webcam,
	.webcams #webcam1,
	.webcams #webcam2 {
		margin: 1em 0;
		padding: 0;
		border: none;
	}

	.webcams .webcam img {
		width: auto;
	}

	.webcam-section .teaser-box,
	.webcam-section .webcam-box {
		margin: 1em 0;
	}


	.badge-div-right { margin-top: 4rem; }
    .badge-div-left { margin-top: 5rem; }
    .badge-div { margin-top: 5rem; }

  	.hide-s {display:none;}

  	.preise td, .preise tr {font-size: .5rem;}
  	.preise thead {font-size: .5rem;}
  	.preise-footer p {font-size: .6rem;}
  	th.rotate { white-space: nowrap; }
 	th.rotate > div { transform: rotate(270deg); width: 28px; }

	.preise .icon {max-height: 25px;}
    .preise-ff {margin-bottom:-2.2rem;}
    .s-preise-ff {margin-bottom: -2.2rem;}
    .preise-aw {margin-bottom: -1rem;margin-left: 1rem;}

	.preiseinfo-winter p {
		font-size: .75rem!important;
	}

  	.menu-menu-1-container { display: none; }

  	.news-petroleum, .news-white {
  		margin-top: 1rem;
		padding: 1rem; }

	.news-m1 { margin-top: 1rem; }

	footer {
		padding: 1rem 2rem;
		text-transform: uppercase;
	}

}


@media only screen and (min-width: 800px) {

	.infobox-mobile { display: none; }
	.infobox-mobile .infobox-container {
		display: none;
	}

	.infobox-container {
		display: block;
		position: absolute;
		bottom: 0;
		left: 5em;
		/*width: 400px; */
		width: 560px;
		top:140px;
	}

	.infobox {
		display: block;
		background-color: #0053a6;
		background-color: rgba(0, 83, 166, 0.8);
		margin: 0;
		padding: 2rem 2rem 0 2rem;
		min-height: 300px;
	}

	.infobox h2 {
		margin: 0;
		font-size: 1rem;
		color: #fff;
		text-transform: none;
		text-align: center;
	}

	.infobox h3 {
		margin: 0;
		font-size: 1rem;
		font-weight: normal;
		color: #fff;
		text-transform: none;
	}

	.infobox p {
		color: #fff;
		font-weight: normal;
		margin: 0;
	}

	.infobox .weather {
		padding: 1em 0;
	}

	.weather p.temperature {
		margin-top: 0.5rem;
	}

	.weather.snow-report {
		background: transparent url(assets/icons/weather/schneeflocke.png) no-repeat scroll center center;
		border-top: 1px solid #fff;
		padding: 1em 0 1em 0;
	}

	.weather-future h3.small {
		font-size: 0.8rem;
	}

	.weather-future p {
		font-size: 0.8rem;
		font-weight: normal;
	}

	.statusbox {
		background-color: #0053a6;
		background-color: rgba(0, 83, 166, 0.8);
		margin: 1rem 0;
		padding: 1rem 2rem;
	}

	.statusbox h2 {
		margin: 0;
        font-size: 14px;
		font-size: 0.875rem;
		font-weight: bold;
		color: #fff;
		text-transform: none;
	}

	.statusbox p {
		margin: 0;
        font-size: 14px;
		font-size: 0.875rem;
		font-weight: normal;
		color: #fff;
	}

	.webcam-section .teaser-box,
	.webcam-section .webcam-box {
		margin: 1em 0;
	}


}

@media only screen and (min-width: 1280px) {

	#main-nav {
		float: none;
		margin: 2rem auto 0 auto;
		width: 980px;
	}

	#main-nav li a {
		padding: 1rem;
	}

}


@media only screen and ( max-width: 1280px ) {

    .slicknav_menu { display:block; }
    #main-nav { display:none !important; }
	.hide-breadcrumbs { display:none; }

	#News h2, h2 { font-size: 1rem;}

	.menu-item {
		width: auto;
		text-align: left;
	}

	.menu-item { width: auto; }
	.menu-item.long { width: auto; }

}

@media only screen and ( max-height: 820px ) {

    .infobox .row.weather-future {
        display: none;
    }

}

/**
 * *****************************************************************************
 * 3. Keyframes & Animations.
 *
 * use for arrow-down
 *
 * *****************************************************************************
 */

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-15px);
  }
  60% {
    transform: translateY(-5px);
  }
}

/**
 * *****************************************************************************
 * 4. Fixes
 *
 * 
 *
 * *****************************************************************************
 */
.moved-box>div>.column {
	padding:0rem !important;
}