/**
* VVM Templates
*
* Central stylesheet - layout "vvm"
*
* @copyright       Copyright 2016, Verkehrsunternehmens-Verbund Mainfranken GmbH - VVM
* @license         CC-BY 2.0 (http://creativecommons.org/licenses/by/2.0/),
*                  YAML-CDL (http://www.yaml.de/license.html)
* @link            http://www.vvm-info.de/
* @version         1.1.5
*/

/* Google Font API */
/*@import url('https://fonts.googleapis.com/css?family=Lato');*/

/* import core styles | Basis-Stylesheets einbinden */
@import url('../yaml/core_1/base.css');

/* import screen layout | Screen-Layout einbinden */
@import url('../yaml/navigation_1/hlist.css');
@import url('../yaml/forms_1/gray-theme.css');

@import url('../yaml/screen_1/typography.css');
@import url('../yaml/screen_1/screen-fullpage-layout.css');

/* import print layout | Druck-Layout einbinden */
@import url('../yaml/print/print.css');

/* import meanmenu */
@import url('meanmenu.css');
@import url('custom_meanmenu.css');

/* import megamenu */
@import url('megamenu.css');
@import url('custom_megamenu.css');


/*****************************************************
* Custom fonts
*****************************************************/
@font-face {
	font-family: MetaWeb-Normal;
	src: url("../fonts/metaweb-normal.woff") format("woff");
}
@font-face {
	font-family: MetaScWeb-Normal;
	src: url("../fonts/metascweb-normal.woff") format("woff");
}
@font-face {
	font-family: MetaWeb-Bold;
	src: url("../fonts/metaweb-bold.woff") format("woff");
}
@font-face {
	font-family: MetaScWeb-Bold;
	src: url("../fonts/metascweb-bold.woff") format("woff");
}
h1,h2,h3,h4,h5,h6, 
body { 
	font-family: MetaWeb-Normal, sans-serif;
	line-height: 1.5;
}
b, strong { 
/*	font-family: MetaWeb-Bold, sans-serif;*/
}


/*****************************************************
* Colors
*
* black             rgb(0,0,0)       #000000
* white             rgb(255,255,255) #FFFFFF
* cherry-red        rgb(227,6,19)    #E30613
* brownish-grey     rgb(102,102,102) #666666
* cool-grey         rgb(182,185,195) #B6B9C3
* dark grey         rgb(169,169,169) #a9a9a9
* grayish pink      rgb(188,181,185) #BCB5B9
* light grey        rgb(212,212,212) #D4D4D4
* lighter grey      rgb(242,242,242) #F2F2F2
* bluish            rgb(34,136,165)  #2288A5
* cool-blue         rgb(78,159,183)  #4E9FB7
*****************************************************/
.black {
	color: rgb(0,0,0);
}


/*****************************************************
* Orientation
*****************************************************/
.left {
	float: left;
}
.right {
	float: right;
}
.centered {
	margin: 0 auto;
}
.block {
	width: 100%;
}


/*****************************************************
* Base formatting 
* Box-model: 25 230 18 230 18 230 18 230 25
*****************************************************/
body {
	/* Base font-size: 13px = 1em */
	font-family: MetaWeb-Normal, sans-serif;
	font-size: 81.25%;
	color: rgb(102,102,102);
	margin: 60px auto;
    -moz-font-feature-settings:"lnum" 1;
    -moz-font-feature-settings:"lnum=1";
    -ms-font-feature-settings:"lnum" 1;
    -o-font-feature-settings:"lnum" 1;
    -webkit-font-feature-settings:"lnum" 1;
    font-feature-settings:"lnum" 1;
    font-variant-numeric: lining-nums;
}
header {
	/* For debugging only */
	display: block;
}
.ym-grid {
	margin-bottom: 20px;
}
.ym-wrapper {
	max-width: 78.769230769em;
	margin: 0 auto;
}
.ym-wbox {
	padding: 1.538461538em 1.230769231em;
}
/* Border around all */
nav.main .ym-wrapper, main .ym-wrapper, nav.sitemap .ym-wrapper, footer .ym-wrapper {
	border: 1px solid rgb(188,181,185);
}
nav.main .ym-wrapper, main .ym-wrapper, nav.sitemap .ym-wrapper {
	border-bottom: none;
}
main .ym-wrapper, nav.sitemap .ym-wrapper, footer .ym-wrapper {
	border-top: none;
}
/* Delete border around all */
body > * .ym-wrapper {
	/* border: none;*/
}
/* Patch focus of chrome */
:focus {
	outline: -webkit-focus-ring-color none;
}


/*****************************************************
* Header
*****************************************************/
header, footer, nav, .ym-hlist {
	background: none;
	color: rgb(0,0,0);
}


/*****************************************************
* Logo
*****************************************************/
.logo {
	z-index: 10001; /* More than 9999 to cover megamenu */
	position: absolute;
	width: 254px;
	height: 240px;
	background: transparent url('../images/vvm_wabe_ecke_schatten_rgb.svg') no-repeat left top; /* Orig. size: 600x407px */
	background-size: 252px auto; /* Two pixel overhead for clean cut off */
	left: 0;
	top: 0;
}
a.logo {
	display: inline-block;
	color: transparent;
	background: transparent url('../images/vvm_logo_ecke_rgb.svg') no-repeat left top;
	background-size: 145px 99px;
	background-size: 241px 161px;
	z-index: 2;
}
a.logo:hover, a.logo:focus {
	background-color: transparent;
}


/*****************************************************
* Main
*****************************************************/
nav.main {
	line-height: 0; /* Fix bottom gap */
}
nav.main .weather_wrapper {
	line-height: 1.5; /* Undo fix */
}


/*****************************************************
* Navigation
*****************************************************/
nav.main .ym-wrapper {
	background: rgb(255,255,255) no-repeat center bottom;
	background-size: 1024px auto;
	height: auto;
}
li.indent {
	margin-left: 245px; /* 240px logo size */
}
.level3 .header-image, .level2 .header-image {
	margin-top: 60px
}
/*
nav.main.level3 .ym-wrapper {
	background-size: 1024px 180px;
	height: 240px;
}
*/
nav.main.noimage .ym-wrapper {
	height: 185px;
}
nav.main .gradient {
	position: absolute;
	top: 0;
	width: 100%;
	height: 89px;
	background-image: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0));
}
.header-image {
	z-index: -1;
	width: 100%;
	height: auto;
	position: relative;
	left: 0;
	top: 0;
}
.level2 .header-image {
	width: 50%;
	left: 50%;
}
.megamenu {
	z-index: 3;
}


/*****************************************************
* Search
*****************************************************/
a#search-icon {
	width: 16px;
	height: 16px;
	margin-top: -9px;
	border: 8px solid rgba(34,136,165,0);
	text-indent: -9999em;
	background: transparent url('../images/icon_search.svg') no-repeat right top;
	background-size: contain;
	-webkit-transition: background-color 2s ease;
	-moz-transition: background-color 2s ease;
	-o-transition: background-color 2s ease;
	-ms-transition: background-color 2s ease;
	transition: background-color 2s ease;
}
.megamenu_light_bar a#search-icon {
	background-image: url('../images/icon_search_invert.svg');
}
a#search-icon:hover {
	background-color: rgb(34,136,165);
}
.megamenu_light a#search-icon:hover {
	background-image: url('../images/icon_search.svg');
}
#search-box {
	width: 404px;
	height: 50px;
	background: rgb(34,136,165);
}
#search-boxTODODODODO {
	border: 4px solid rgb(34,136,165);
}
#search-terms {
	width: 394px;
    box-shadow: none;
	border: 1px solid rgb(212,212,212);
}
.ym-searchform {
	float: left;
	padding: 5px;
}


/*****************************************************
* Sitemap
*****************************************************/
nav.sitemap .ym-wrapper {
	background-color: rgba(153,153,153,.7);
}
nav.sitemap .ym-grid {
	margin-bottom: 0;
}
nav.sitemap, nav.sitemap a, nav.sitemap a.arrow {
	color: rgb(255,255,255);
}
nav.sitemap li {
	list-style-type: none;
	margin-left: 0;
	line-height: 2.6em;
}
nav.sitemap ul, nav.sitemap ol, nav.sitemap dl {
	margin-bottom: 0;
}
nav.sitemap .ym-gl:first-of-type {
	border-right: 1px solid rgb(255,255,255);
}
.logo-white {
	width: 88px;
	height: 44px;
	background: transparent url('../images/vvm-logo_white.svg') no-repeat left top;
	background-size: 88px 44px;
	margin-bottom: .615384615em;
}


/*****************************************************
* Footer
*****************************************************/
footer .ym-wrapper {
	background: rgb(34,136,165);
}
footer, footer a {
	color: rgb(255,255,255);
}
footer .ym-wbox {
	padding: .423076923em 1.5em;
}


/*****************************************************
* Content
*****************************************************/

/* Headlines */
h1 {
	font-size: 2.307692308em;
	font-weight: 400;
}
h2 {
	font-size: 1.846153846em;
	font-weight: 400;
	margin: 2.1em 0 0.2em 0;
}
h3 {
	font-size: 1.461538462em;
	margin: 1.5em 0 0.2em 0;
}
h4 {
	font-size: 1.230769231em;
	margin: 0 0 0.4em 0;
}
h5 {
	font-size: 1.153846154em;
	margin: 0 0 0.2em 0;
}
h6 {
	font-size: 1em;
	margin: 0 0 0.4em 0;
}
.ym-grid .ym-grid h3 {
	/* Nested h3 */
	margin: 0.2em 0 0.2em 0;
}
.content h3.subtitle {
	color: rgb(169,169,169);
	margin: 0.5em 0 -0.35em 0;
	text-transform: uppercase;
}
.ym-cbox {
	padding-bottom: 3em;
}

/* Lists */
ul {
    list-style-type: none;
}
.ym-cbox ul li, .result-list ul li {
    list-style: none;
    line-height: 2em;
}
.ym-cbox ul li:before, .result-list ul li:before {
    content: "\2022 ";
    color: rgb(34,136,165);
    font-size: 1em;
	margin-left: -1em;
	margin-right: 0.25em;
}

/* Paragraph */
p {
	margin: 0 0 .5em 0;
}
p.black {
	margin-top: 1.5em;
}
.price {
	margin-bottom: 0;
	color: rgb(0,0,0);
	text-align: right;
	font-size: 1.461538462em;
	line-height: 1em;
}
a, a:hover, a:focus {
	color: rgb(34,136,165);
}
a.arrow {
	display: inline-block;
	background: url('../images/arrow_red.svg') no-repeat left 1px;
	background-size: 13px 10px;
	padding-left: 1.461538462em;
}
a:hover, a:focus, 
a.arrow:hover, a.arrow:focus {
	text-decoration: underline;
	background-color: transparent;
}
p.black,
p a.arrow, ul a.arrow, .vbox .content-wrapper a.arrow {
	color: rgb(0,0,0);
}
p a.arrow {
	color: rgb(0,0,0);
	background-position: left 3px;
}
a.arrow.external {
	background-image: url('../images/arrow_red_external.svg');
	background-size: 10px auto;
	background-position: 3px 3px;
}
.sitemap a.arrow {
	background-image: url('../images/arrow_white.svg');
}
/* Spacer */
.leftspace1 { margin-left: 10px; }
.leftspace2 { margin-left: 20px; }
.leftspace3 { margin-left: 30px; }
.leftspace4 { margin-left: 40px; }
.leftspace5 { margin-left: 50px; }
.leftspace6 { margin-left: 60px; }
.leftspace7 { margin-left: 70px; }
.leftspace8 { margin-left: 80px; }
.leftspace9 { margin-left: 90px; }

span.linie {
	color: rgb(0,0,0);
}
.bus, .tram, .zug {
	padding: 0 0 25px 80px;
	margin-left: 0;
}
.bus {
	background: url('../images/icon_bus.svg') no-repeat left top; /* Orig. size: 90x67px */
	background-size: 45px 34px;
	background-position-x: 10px;
}
.tram {
	background: url('../images/icon_tram.svg') no-repeat left top; /* Orig. size: 114x75px */
	background-size: 57px 38px;
	background-position-x: 1px;
}
.zug {
	background: url('../images/icon_zug.svg') no-repeat left top; /* Orig. size: 116x84px */
	background-size: 58px 42px;
}
span.bubble-red {
	display: inline-block;
	width: 20px;
	height: 20px;
	position: relative;
	top: -2px;
	left: 5px;
	margin-right: -10px;
	padding-left: 0;
	line-height: 20px;
	text-align: center;
	background: url('../images/bubble-red.svg') no-repeat left top; /* Orig. size: 43x43px */
	background-size: contain;
	color: rgb(255,255,255);
	font-family: Arial, sans-serif;
	font-size: 10px;
}
span.bubble-white {
	display: inline-block;
	width: 36px;
	height: 36px;
	margin: 1px;
	line-height: 34px;
	text-align: center;
	background: url('../images/bubble-white.svg') no-repeat left top; /* Orig. size: 43x43px */
	background-size: contain;
	color: rgb(102,102,102);
	font-size: 15px;
}
.content .ym-grid:last-child {
	margin-bottom: 0;
}


/* Images */
img.alignright {
	float: right;
	margin: 0 0 1em 1em;
}
img.alignleft {
	float: left;
	margin: 0 1em 1em 0;
}
img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Results */
.result, .result-list {
	padding-bottom: 12px;
	border-bottom: 1px solid rgb(212,212,212);
}
.result {
	font-size: 1.153846154em;
	margin-top: 30px;
	padding: 10px 0 0 0;
	border-top: 1px solid rgb(212,212,212);
}
.no.result {
	border-bottom: 0;
}
.no.result p {
	display: none;
	visibility: hidden;
}
.result-list h1, .result-list h2, .result-list h3, .result-list h4, .result-list h5, .result-list h6 {
}
.result-list-toggle-top {
    margin-left: -26px;
	padding: 9px 0 3px 26px;
	color: white;
	background: rgb(34,136,165);
	border-bottom: 1px solid rgb(255,255,255);
}
.result-list-toggle-top h3 {
	color: white;
	display: inline;
	padding-right: 12px;
}
.result-list-toggle-top .switch, 
.result-list-toggle-bottom .switch {
    position: relative;
	float: right;
    width: 23px;
    height: 14px;
    background: url('../images/arrow-closed.svg') no-repeat center center;
	background-size: 23px 14px;
	text-indent: -9999em;
    margin: 6px 10px;
}
.result-list-toggle-bottom .switch {
    background-color: rgb(212,212,212);
    width: 30px;
    height: 30px;
    margin: 0;
    padding: 0;
    margin-top: -44px;
	-webkit-transition: transform 0.5s ease;
	-moz-transition: transform 0.5s ease;
	-o-transition: transform 0.5s ease;
	-ms-transition: transform 0.5s ease;
	transition: transform 0.5s ease;
}
.switch.open {
	transform: rotate(180deg);
}
.result-list-wrapper {
	display: block;
	padding-top: 10px;
}
.result-list {
	padding-bottom: 20px;
}
.result-list-wrapper .result-list:last-child {
	border-bottom: 0;
	margin-bottom: 1em;
}
.result-list-wrapper .result-list:first-child {
	border-bottom: 1px solid rgb(212,212,212);
}
.closed {
	display: none;
	overflow: hidden;
}
.hidden {
	display: none;
	visibility: hidden;
}
.result-list-wrapper ul li {
	line-height: 1.4em;
	padding-bottom: 0.5em;
}
.result-list.ym-clearfix {
	margin-bottom: 20px;
}
.result-list img.left {
	margin-right: 20px;
}


/* Mutli-column content */
p.twocol, ul.twocol {
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	-webkit-column-gap: 2em;
	-moz-column-gap: 2em;
	column-gap: 0em;
}
p.twocol {
		display:flex;
}

.panel .twocol .ym-gl, .panel .twocol .ym-gr, 
.twocol .ym-gl, .twocol .ym-gr, 
.panel .threecol .ym-gl, .panel .threecol .ym-gr, 
.threecol .ym-gl, .threecol .ym-gr {
	padding: 0 1.5em;
}
.panel .threecol .ym-gl:first-child, 
.threecol .ym-gl:first-child {
	padding-left: 0;
}
.panel .threecol .ym-gr:last-child, 
.threecol .ym-gr:last-child {
	padding-right: 0;
}
.twocol li, .threecol p {
	-webkit-column-break-inside: avoid;
	-moz-column-break-inside: avoid;
	column-break-inside: avoid;
	break-inside: avoid;
}
.ruler .ym-gl {
	border-right: 1px solid rgb(212,212,212);
}
.result-list .twocol a.arrow {
	/* Fix two columns for small links */
	min-width: 48%;
}


/* Panel */
.panel {
	background: rgb(242,242,242);
	margin: 30px 0 20px 0;
	padding: 15px;
}
.panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6 {
	margin-top: 0;
}
.panel .ym-gl {
	padding: 0 10px;
}
.panel .ym-gl:first-child {
	padding-left: 0;
}
.panel .ym-gr {
	padding-left: 10px;
}


/* Special elements */
div.talk {
	background: url('../images/icon_kontakt_blau.svg') no-repeat center top;
	background-size: 97px auto;
	width: 100%;
	height: 93px;
}


/*****************************************************
* Boxes
*****************************************************/

/* All Boxes */
.vbox .ym-gbox, .ibox .ym-gbox, .cbox .ym-gbox {
	margin-left: .692307692em;
	margin-right: .692307692em;
	position: relative;
	background-size: cover;
}

/* Boxen mit 345px Hoehe */
.h345.vbox .ym-gbox, .h345.cbox .ym-gbox, .h345.ibox .ym-gbox {
	min-height: 345px;
}
.ym-grid .h345.vbox .ym-gbox {
	min-height: 303px; /* Remove padding */
}

/* VVM box */
.ym-grid .vbox .ym-gbox {
	border: 1px solid rgb(212,212,212);
	line-height: 1.25;
	padding: 1.538461538em 1.153846154em;
	min-height: 260px;
}
.vbox, .vbox a,
.vbox input, .vbox select, .vbox textarea {
	color: rgb(102,102,102);
}
.vbox .ym-gbox h3 {
	text-align: center;	
	margin: 0 0 0.65625em 0;
}
.vbox ul {
	clear: both;
}
.vbox ul li {
	list-style-type: none;
	float: left;
	margin-right: 20px;
}
.vbox .ym-gbox .content-wrapper {
	display: block;
	position: absolute;
	left: 0;
	bottom: 0px;
	width: 100%;
	padding: 1em 1.153846154em;
	width: 90%; /* Incorrect padding calculation of browsers*/
}
.vbox ul {
	margin: 0;
}
.vbox ul li {
	line-height: 1;
}
.vbox .content-wrapper ul li:first-child {
	margin: 0 0 0 5px;
}

/* Image box */
.ibox .ym-gbox {
	height: 130px;
	text-align: center;
	background-size: 230px auto;
background-size: cover;
}
.ibox .ym-gbox h3 {
	line-height: inherit;
	margin: 0;
}
.ibox, .ibox h3, .ibox a {
	color: rgb(255,255,255);
}
.fundsachen, .netze, .freizeit, .kontakt, .veranstaltungen {
	display: inline-block;
	width: 50px;
	height: 50px;
	margin: 2.230769231em auto 0 auto;
	background: transparent url('../images/icon_fundsachen.svg') no-repeat center center; /* Orig. size: 600x575px */
	background-size: 50px 48px;
}
.fundsachen {
	background-image: url('../images/icon_fundsachen.svg');
}
.netze {
	background-image: url('../images/icon_netze.svg');
}
.freizeit {
	background-image: url('../images/icon_freizeit.svg');
}
.kontakt {
	background-image: url('../images/icon_kontakt_weiss.svg');
}
.kontakt_blau {
	background-image: url('../images/icon_kontakt_blau.svg');
}
.veranstaltungen {
	background-image: url('../images/icon_veranstaltungen.svg');
}
.ibox a, .teaser .ym-gbox .gradient {
	/* Cover with radial gradient */
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;	
	background-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,0.0), rgba(0,0,0,0.5), rgba(0,0,0,0.8));
}

/* Custom box */
.cbox .ym-gbox {
	padding: 1.538461538em 1.153846154em;
	padding: 0 1.153846154em;
	min-height: 302px;
}
.ym-gbox .gradient {
	/* Cover with linear gradient */
	display: block;
	position: absolute;
	left: 0;
	bottom: 0px;
	width: 100%;
	min-height: 50%;	
	background-image: linear-gradient(to bottom, rgba(0,0,0,0.0), rgba(0,0,0,0.8));
	padding-top: 50px;
}
.ym-gbox .content-wrapper {
	padding: 1.230769231em 1em 1.230769231em .769230769em;
}
.cbox, .cbox h3, .cbox a {
	color: rgb(255,255,255);
	margin: 0 0 0.65625em 0;
}
.cbox a.arrow {
	margin-top: .692207692em;
}

/* Question box */
.qbox.vbox .ym-gbox {
	min-height: 220px;
	border: none;
	text-align: center;
/*	margin-top: 1.5em;*/
	z-index: 10003;
}
.vbox .ym-gbox .content-wrapper {
	padding: 1.5em 1.153846154em;
}
.qbox.vbox .ym-gbox a {
	color: rgb(34,136,165);
}
.qbox.vbox .ym-gbox a.arrow {
	color: rgb(0,0,0);
}
.qbox.upper {
	margin-top: -56px;
}
.qbox hr {
	width: 60px;
	margin: 0 auto;
	color: black;
	border-top: 1px solid black;
	margin-top: 15px;
	padding-bottom: 15px;
}
.cbox.upper .ym-gbox {
	margin-top: -76px;
	z-index: 10005;
}
.lower {
	margin-bottom: 20px;
}


/* Teaser box */
.teaser {
	margin: 2em 0 0 0;
}
.teaser .ibox:first-child .ym-gbox {
	margin-left: 0;
}
.teaser .ibox:last-child .ym-gbox {
	margin-right: 0;
}
.teaser .ym-gbox .gradient {
	height: 100%;
	padding-top: 0;
}
.teaser .ibox a {
	background: none;
	height: auto;
	min-height: 20%;
}
.teaser .ibox .ym-gbox h3 {
	font-size: 1.7em;
}
.teaser .ym-gbox {
	/* 2016-05-31 Patch for stand alone elements */
    max-width: 193px;
}

/* Teaser subnavigation */
.subnavigation {
	width: 60px;
	float: right;
}
.subnavigation a.prev, 
.subnavigation a.next {
	display: block;
	width: 30px;
	height: 30px;
	text-indent: -9999em;
	cursor: pointer;
}
.subnavigation a.prev {
	float: left;
	background: url('../images/arrow_left.svg') no-repeat left top;
	background-size: 30px 30px;
}
.subnavigation a.next {
	float: right;
	background: url('../images/arrow_right.svg') no-repeat right top;
	background-size: 30px 30px;
}


/*****************************************************
* Tabs
*****************************************************/
.ui-tabs-nav {
	display: inline-block;
	margin: 0;
	padding: 0;
}
.ui-tabs-nav li a {
	color: rgb(102,102,102);
}
.ui-tabs-nav li.ui-tabs-active a {
	padding-bottom: 3px;
	border-bottom: 3px solid rgb(34,136,165);
	color: rgb(0,0,0);
}
.ui-tabs-active a:hover {
	text-decoration: none;
}
.ui-tabs-panel {
	padding: 20px 10px;
	margin: -5px 0 0 -10px;
}
.ui-tabs-nav .ui-corner-top:first-child {
/*	margin-left: -10px;*/
    padding-left: 10px;
}
.vbox .ui-tabs-nav .ui-corner-top:first-child {
    padding-left: 20px;
}
ul.ui-tabs-nav li {
	border-right: 1px solid rgb(102,102,102);
	margin: 0;
	padding: 0 20px;
}
ul.ui-tabs-nav li:last-child {
	border-right: none;
}
.ui-tabs-nav li {
	list-style-type: none;
	float: left;
	margin-right: 20px;
}
ul.ui-tabs-nav li a:hover {
	text-decoration: none;
}
ul.ui-tabs-nav li:before {
	content: '';
}

/*****************************************************
* Buttons
*****************************************************/
button {
	display: block;
	margin: 0 auto 2px auto;
	padding: .923076923em 2.350346154em;
	border: 0;
	color: rgb(255,255,255);
	background-color: rgb(34,136,165);
	-webkit-appearance: none;
	-webkit-transition: background-color 0.5s ease;
	-moz-transition: background-color 0.5s ease;
	-o-transition: background-color 0.5s ease;
	-ms-transition: background-color 0.5s ease;
	transition: background-color 0.5s ease;
}
button:hover {
	cursor: pointer;
	background-color: rgb(78,159,183);
}
button:focus, buton:active {
	background-color: rgb(78,159,183);
	box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.9);
}
button.full {
	width: 100%;
	padding: .923076923em .1em;
}
button::-moz-focus-inner {
	/* Firefox Button Height Fix */
	margin-top: -1px; 
	margin-bottom: -1px; 	
}
.ym-gbox button.full:last-of-type {
	margin-bottom: 1em;
}
.ym-gbox .button-wrapper {
	position: absolute;
	bottom: 1.692307692em;
	left: 0;
	width: 100%
}


/*****************************************************
* Forms
*****************************************************/
/* Basics */
form {
	margin: 0 auto;
	line-height: 1.6;
}
fieldset {
	margin: 0;
	padding: 0;
	border: none;
}
legend {
	font-weight: bold;
}

/* Labels */
label {
	display: inline-block;
}
label{
	margin: 0;
}
input, select, textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border:none;
	border-radius: 0;
	font-size: 1em;
	width: 100%;
	-webkit-box-sizing: border-box;	
	-moz-box-sizing: border-box;
	box-sizing: border-box;
} 

/* Input & Textarea */
input, textarea {
	background-color: rgb(255,255,255);
	border: 1px solid rgb(212,212,212);
	padding: 12px 11px 10px 11px;
	box-shadow: inset -2px 2px 2px 0 rgba(0,0,0,0.3);
	-webkit-transition: color 0.5s ease, border-color 0.5s ease;
	-moz-transition: color 0.5s ease, border-color 0.5s ease;
	-o-transition: color 0.5s ease, border-color 0.5s ease;
	-ms-transition: color 0.5s ease, border-color 0.5s ease;
	transition: color 0.5s ease, border-color 0.5s ease;
}
textarea {
	resize: vertical;
}
input:hover, input:active, input:focus,
textarea:hover, textarea:active, textarea:focus {
	color: rgb(0,0,0);
	border-color: rgb(102,102,102);
}

/* Select */
select {
	width: 100%;
	line-height: 22px;
	border: 1px solid rgb(212,212,212);
	padding: .75em 1em .5em 1em;
	padding-right: 25px;
	box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.5);
	background: rgb(255,255,255) url('../images/dropdown-pfeil.svg') no-repeat right center;
	background-size: 14px 19px;
	background-position : calc(100% - 10px) center;
	-webkit-transition: color 0.5s ease, border-color 0.5s ease;
	-moz-transition: color 0.5s ease, border-color 0.5s ease;
	-o-transition: color 0.5s ease, border-color 0.5s ease;
	-ms-transition: color 0.5s ease, border-color 0.5s ease;
	transition: color 0.5s ease, border-color 0.5s ease;
}
select:hover, select:active, select:focus {
	color: rgb(0,0,0);
	border-color: rgb(102,102,102);
}
/* Hide browser-styling in IE10 */
select::-ms-expand {
	display: none;
}
/* Hide custom-icons in lower versions of Internet Explorer (<IE10). */
.lt-ie10 select { 
	background-image: none;
}

/* Checkboxes and Radio buttons */
/* graceful degradation for IOE */
	input[type='checkbox'],
	input[type='radio'] {
	width: auto;
	float: left;
	margin-right: .75em;
	background: transparent;
	border: none;
}
/* better styling only for modern browsers. To identify them, check for pseudoclass (:checked, :not(:checked)) */
/* hide standard inputs */
input[type='checkbox']:checked,
input[type='checkbox']:not(:checked),
input[type='radio']:checked,
input[type='radio']:not(:checked) {
	background: transparent;
	position: relative;
	visibility: hidden;
	display: none; /* Fix for firefox */
	margin: 0;
	padding: 0;
}
input[type='checkbox'] + label,
input[type='radio'] + label {
	cursor: pointer;
}
/* add custom inputs with ::before */
input[type='checkbox']:checked + label::before, 
input[type='checkbox']:not(:checked) + label::before,
input[type='radio']:checked + label::before,
input[type='radio']:not(:checked) + label::before {
	content: ' ';
	display: inline-block;
	width: 17px;
	height: 17px;
	position: relative;
	top: 4px;
	border: 2px solid rgb(34,136,165);
	background: rgba(255,255,255,0);
	margin-right: 0.5em;
	box-shadow: inset 0 1px 1px 0 rgba(0,0,0,.1);
}
input[type=radio]:checked + label::before,
input[type=radio]:not(:checked) + label::before {
	border-radius: 30px;
}
input[type='checkbox']:hover  + label::before,
input[type='radio']:hover  + label::before {
	background: rgb(212,212,212);
	box-shadow: inset 0 0 0 2px rgb(255,255,255);
}
input[type='checkbox']:checked  + label::before,
input[type='radio']:checked  + label::before {
	background: rgb(34,136,165);
	box-shadow: inset 0 0 0 2px rgb(255,255,255);
}
input[type='radio']:checked  + label::before {
/*	border: 2px solid rgb(34,136,165);*/
}
input#reset {
	width: auto;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	font-size: 1.153846154em;
	line-height: 40px;
	text-align: left;
	color: rgb(34,136,165);
	cursor: pointer;
}
input#reset:hover, input#reset:focus {
	text-decoration: underline;
}
/* Better label positioning */
form hr {
	border-bottom: 1px solid rgba(102,102,102,0.7);
}
input[type='checkbox']:checked + label, 
input[type='checkbox']:not(:checked) + label,
input[type='radio']:checked + label,
input[type='radio']:not(:checked) + label {
    padding-left: 30px;
}
input[type='checkbox']:checked + label::before, 
input[type='checkbox']:not(:checked) + label::before,
input[type='radio']:checked + label::before,
input[type='radio']:not(:checked) + label::before {
	margin-right: -21px;
	left: -30px;
}
label.onoffswitch-label {
	padding-left: 0 !important;
}


/*****************************************************
* On/Off FlipSwitch
*****************************************************/
.onoffswitch {
	position: relative;
	width: 60px;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select: none;
}
.onoffswitch-checkbox {
	display: none;
}
.onoffswitch-label {
	display: block;
	overflow: hidden;
	cursor: pointer;
	border: 2px solid rgb(34,136,165);
	border-radius: 20px;
	line-height: 34px;
}
.onoffswitch-inner {
	display: block;
	width: 200%;
	margin-left: -100%;
	transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
	display: block;
	float: left;
	width: 50%;
	height: 30px;
	padding: 0;
	line-height: 30px;
	box-sizing: border-box;
}
.onoffswitch-inner:before {
	content: "";
	padding-left: 10px;
	background-color: #2288A5;
	color: #FFFFFF;
}
.onoffswitch-inner:after {
	content: "";
	padding-right: 10px;
	background-color: rgb(169,169,169);
	color: #FFFFFF;
	text-align: right;
}
.both .onoffswitch-inner:after {
	background-color: #2288A5;
}
.onoffswitch-switch {
	display: block;
	width: 28px;
	margin: 1px;
	background: #FFFFFF;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 26px;
	border: 2px solid rgb(34,136,165);
	border-radius: 20px;
	transition: all 0.3s ease-in 0s; 
	box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.75);
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
	margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
	right: 0px; 
}
.onoffswitch input[type='checkbox']:checked + label::before, 
.onoffswitch input[type='checkbox']:not(:checked) + label::before {
	display: none;
}
.onoffswitch-label-before, .onoffswitch-label-after {
	line-height: 42px;
}


/*****************************************************
* Weather
*****************************************************/
.weather_wrapper {
	z-index: 2;
    position: absolute;
	right: 0px;
    top: 45px;
	width: 170px;
	height: 225px;
	background: url('../images/weather_background.png') no-repeat right top;
	background-size: 170px 225px;
	overflow: hidden;
	font-family: Arial, sans-serif;
	color: rgb(34,136,165);
}
.weather_wrapper .weather.today {
	position: absolute;
	left: 35px;
	top: 80px;
	width: 90px;
	height: 52px;
}
.weather_wrapper .weather.today .temprature {
	float: left;
	font-size: 22px;
}
.weather_wrapper .weather.today .icon {
	float: left;
}
.weather_wrapper .weather.tomorrow {
	position: absolute;
	left: 97px;
	top: 156px;
	width: 52px;
	height: 42px;
	opacity: 0.8;
    text-align: right;
}
.weather_wrapper .weather.tomorrow .icon {
	width: 25px;
	height: 25px;
}

/*****************************************************
* Autocomplete
*****************************************************/

.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
    max-height: 100px;
    overflow-y: auto;
    overflow-x: hidden;
}
.ui-menu {
	list-style: none;
	padding: 0;
	margin: 0;
	display: block;
	outline: none;
}
.ui-menu .ui-menu {
	position: absolute;
}
.ui-menu .ui-menu-item {
	position: relative;
	margin: 0;
	padding: 3px 1em 3px .4em;
	cursor: pointer;
	list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}

.ui-menu .ui-menu-divider {
	margin: 5px 0;
	height: 0;
	font-size: 0;
	line-height: 0;
	border-width: 1px 0 0 0;
}
.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
	margin: -1px;
}

.ui-autocomplete.ui-widget-content {
	border: 1px solid rgb(212,212,212);
	background: #ffffff;
}

/* Interaction states
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
}

.ui-autocomplete.ui-widget-content .ui-state-focus{
	border: 1px solid #999999;
	background-color: rgb(34,136,165);
	font-weight: normal;
	color: #ffffff;
}
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
	color: #ffffff;
	text-decoration: none;
}

/*****************************************************
* Datepicker
*****************************************************/
.ui-datepicker {
	width: 14.7em;
	padding: .2em .2em 0;
	display: none;
	background: white;
	border: 1px solid rgb(212,212,212);
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 45%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
	width: 95%;
	margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}

/*****************************************************
* Popup für Mobile Hinweis
*****************************************************/

#mb_popup{
	z-index:10004;
	position: fixed;
	margin: 0 auto;
	width:90%;
	max-width: 400px;
	max-height:550px;
	top:0;
	right: 0;
	bottom: 0;
	left:0;
	overflow:hiden;
	background: rgb(34,136,165);
	color: #fff;
	text-align: center;
	display:none;
	box-shadow: 5px 5px 3px #888;
	-moz-box-shadow: 5px 5px 3px #888;
	-webkit-box-shadow: 5px 5px 3px #888;
}

#mb_popup img {
	margin: 25px auto;
	width: 50%;
}

#mb_popup h1,#mb_popup h2,#mb_popup h3,#mb_popup h4{
	color: #fff;

}

.w200{
	width: 200px;
}

#mb_popup ul{
	list-style-type:none;
	text-align:left;
}

#mb_popup ul li{
	background: url('../images/haken-weiss.png') no-repeat; 
	background-position: 0 3px;
	padding-left: 15px;
}

#mb_popup a{
		color: #fff;
}

#mb_popup a#mb_pop_cancel{
	background: url('../images/pfeil-weiss.png')  no-repeat;
	padding-left: 15px;
}

 .mb_pop_button-wrapper{
	margin: 25px auto;
	width: 80%;
	text-align:center;
}
	
#mb_popup button{
	display: inline-block;
	background-color:#fff;
	color: rgb(34,136,165);
	font-weight:bold;
	margin-left: 10px;
	text-align:center;
	border-radius: 3px;
}

/******** Ende Popup für Mobile Hinweis  ********************/