@charset "utf-8";
/* mobile Version erlebniswelt muotathal */

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

#event-aktuell p {
	font-size:1.5rem;
}	
	
}

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

#event-aktuell p {
	font-size:1.25rem;
}	
	
}


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

#logo {
    height:auto;

}

#subnavi li {
    z-index: 1992;
    font-size: .9em;
    font-weight: 300;
    text-align: left;
    padding: 0px 5px;
}

#subnavi li.first {
	padding-left:10px;
}

#navi {
    margin-top: 40px;
}
	
ul.mainnavi li {
	letter-spacing:-1px;
}

ul.sitemapnavi li {
	font-size:0.9em;
	font-weight:400;
}

ul.sitemapnavi li ul li {
	font-size:1em;
	letter-spacing:-1px;
}

#event-aktuell p {
	font-size:1rem;
}

#adresse, #labels {
	height:0;
	padding-bottom:3.87%;
}
	
}

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

#logo img {
	width:100%;
	height:auto;
	margin-top:20px;
}

#navi {
    margin-top: 20px;
}

ul.mainnavi li {
	font-size:1em;
}

ul.sitemapnavi li {
	font-size:0.85em;
	font-weight:400;
}

ul.sitemapnavi li ul li {
	font-size:1em;
	letter-spacing:-1px;
}

}

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

.tx-ws-flexslider .caption-text {
    width:94%;
    top: auto;
	bottom:20px;
	font-size:1.5em;
	text-align:right;
	padding:10px 3%;
}

ul.mainnavi li {
	font-size:0.95em;
	letter-spacing:-1px;
}

ul.sitemapnavi li {
	font-size:0.8em;
	font-weight:400;
}

ul.sitemapnavi li ul li {
	font-size:0.85em;
	letter-spacing:-1px;
}

#event-aktuell p {
	font-size:.85rem;
}	

#adresse p {
	font-size:0.85em;
}

}

@media only screen and (max-width:800px) {
		
body {
		background:none;
		background-color:#D5D6DA;
}

#header {
	background-color:#2C3248;
}

#navi-wrapper {
    width: 60%;
    margin: 0 20%;

}

#logo {
	float:left;
	height:auto;
	width:100%;
	text-align:center;
	margin: 0 ;
	padding:10px 0;
}

#logo img {
	position:static;
	height:auto;
	max-width:300px;
	width:100%;
}

.flex-direction-nav {
	display:none;
}

#subnavi, #navi, #sitemap, #gutschein, #buchen, #event-aktuell, #links, #footer-address {
	display:none;
}

#buchen-mobile, #gutschein-mobile, #event-aktuell-mobile {
	display:block;
	float:left;
	width:27.3%;
	margin:4px 1.5%;
	background-color:#b42105;
	text-align:center;
	padding:.5em 1.5%;
	color:#fff;
	font-size:1.1em;
}

#event-aktuell-mobile {
	background-color:#00468C;
}

#buchen-mobile strong, #gutschein-mobile strong, #event-aktuell-mobile strong {
	font-weight:600;
}

#buchen-mobile a, #gutschein-mobile a, #event-aktuell-mobile a,
#buchen-mobile a:visited, #gutschein-mobile a:visited, #event-aktuell-mobile a:visited {
	color:#fff;
	text-decoration:none;
}

/* menu mobile */

.button{width:7.6%;height:40px;position:absolute;left:66%;top:20px;cursor:pointer;z-index: 12399994;background-image:url(../img/bg/mobilemenu_icon.png); background-position:left center;background-size:contain;background-repeat:no-repeat;}
.button:after{display:block;height:auto;}
.button.menu-opened{position:absolute;left:5%;top:10px;background-image:url(../img/bg/mobilemenu_icon_open.png);}
#mobilemenu {position:absolute;	top:0;left:-62.5%;width:100%;height:auto;z-index:999999;}
#mobilemenu.menu-active {-webkit-transition:all .25s ease;-ms-transition:all .25s ease;	transition:all .25s ease;	left:0;}
#mobilemenu,#mobilemenu ul,#mobilemenu ul li,#mobilemenu ul li a,#mobilemenu #head-mobile{border:0;list-style:none;line-height:1;display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
#mobilemenu ul{width:60%;padding:55px 0 20px 0;background-color:rgba(255,255,255,0.95);-webkit-box-shadow: 2px 2px 18px 0 #A8A8A8;box-shadow: 2px 2px 18px 0 #A8A8A8;display:none;}
#mobilemenu ul.submenu_mobile {padding-top:80px;padding-bottom:80px;}
#mobilemenu ul li{width:80%;margin-left:8.33%; position:relative;border-bottom:1px solid #ccc;}
#mobilemenu ul li:last-child {}
#mobilemenu ul.submenu_mobile li{border:none;}
#mobilemenu ul ul li,#mobilemenu li:hover > ul > li{height:auto}
#mobilemenu > ul > li > a{padding:0.5em 0;font-size:1em;text-decoration:none;color:#6b6e6f;font-weight:400;}
#mobilemenu > ul.submenu_mobile > li > a {padding:8px 0;}
#mobilemenu ul li a,#mobilemenu ul ul li a{width:100%;border-bottom:0;padding-left:20px;}
#mobilemenu ul li:last-child, #mobilemenu ul ul li:last-child {	border-bottom:none;}
#mobilemenu > ul > li{float:none}
#mobilemenu ul ul li {background:none;}
#mobilemenu ul ul li a{padding-top:5px;padding-bottom:5px;font-size:1em;text-decoration:none;color:#6b6e6f;font-weight:400;}
#mobilemenu ul ul li:hover > a,#mobilemenu ul ul li.active > a{color:#000}
#mobilemenu ul ul,#mobilemenu ul ul ul{position:relative;left:0;width:100%;margin:0;text-align:left; background:none;-webkit-box-shadow:none;box-shadow:none;padding:0;}
#mobilemenu ul ul li.has-sub > a:before{-webkit-transition:all .75s ease;-ms-transition:all .75s ease;transition:all .75s ease}
#mobilemenu ul ul > li.has-sub:hover > a:before{top:17px;height:0}
#mobilemenu > ul > li.has-sub > a:after,#mobilemenu > ul > li.has-sub > a:before,#mobilemenu ul ul > li.has-sub > a:after,#mobilemenu ul ul > li.has-sub > a:before{display:none}
#mobilemenu #head-mobile{display:block;padding:0 10px;color:#000;}
#mobilemenu .submenu-button{position:absolute;z-index:99;left:0;top:0;display:block;height:100%;width:20px;cursor:pointer;background-image:url(../img/bg/mobilemenu_li_sub-bg.png); background-repeat:no-repeat;background-position:left top 0.5em;}
#mobilemenu .submenu-button.submenu-opened {background-image:url(../img/bg/mobilemenu_li_sub-bg_open.png);}
#mobilemenu li ul .submenu-button{ background-position:left top 0.3em;}
#mobilemenu .submenu-button.submenu-opened:before{display:none}
#mobilemenu ul ul ul li.active a{border-left:none}
#mobilemenu > ul > li.has-sub > ul > li.active > a,#mobilemenu > ul ul > li.has-sub > ul > li.active > a{border-top:none}

/* Inhalte */

#content_all {
	float:left;
	width:100%;
	padding:10px 0 0 0;
	background:none;
	background-color:#CAC7C3;
}


#content {
	float:left;
	width:96%;
	padding:10px 2%;
	margin-left:0;
}

#content h2 {
    font-size: 1.25em;
}

#content .spalte2 #c3.csc-default h2, #content .spalte2 #c3.csc-default h3, #content .spalte2 #c3.csc-default p {
    padding: 0;
}

.spalte1, .spalte2 {
	float:left;
	width:100%;
}

.spalte2 {
	margin-left:0;
}

/* 4-spaltig */

.spalte41, .spalte42, .spalte43, .spalte44 {
	float:left;
	width:47%;
	min-height:240px;
	height:auto;
	margin-bottom:15px;
}

.spalte42, .spalte44 {
	margin-left:3%;
}

.spalte41, .spalte43 {
	margin-left:0;
}

/* aside */

aside {
	float:left;
	width:96%;
	padding:0px 2%;
}

aside a, aside a:visited {
	color:#333;
}

aside a:hover {
	color:#000;
}

#events {
	float:left;
	margin-top:0;
}

#events #c3564, #events #c11 {
	float:left;
	width:48%;
}

#events #c11 {
	margin-left:4%;
}

#content .news-single-item {
	max-width:600px;
}

#events #c10.csc-default p.bodytext {
	padding: 0px 0px 15px 15px;
}

/* events agenda */

.news-list-item {
	height:20px;
	padding:5px 0px;
}

#content .news-list-container .news-list-item h2 {
	float:left;
	min-width:240px;
	padding:0px 5px;
	line-height:20px;
	font-size:16px;
}

#content .news-list-container .news-list-item p {
	float:left;
	min-width:390px;
	line-height:20px;
}

.news-list-item:nth-child(odd) {
	background-color:#E8E8E8;
}

#content .news-list-container .news-list-browse .showResultsWrap {
	font-size:12px;
	margin-top:20px;
}

#content .news-list-container .news-list-browse .browseLinksWrap {
	font-size:12px;
}

/* links */

#booking {
	width:44%;
	height:30px;
	float:left;
	text-align:center;
	margin:12px 3%;
}

#booking img {
	max-width:100%;
	height:auto;
}

#gutschein {
	width:44%;
	height:30px;
	float:left;
	text-align:center;
	background-color:#B31310;
	margin:10px 3%;
}

aside #links #booking a, aside #links #booking a:visited, aside #links #booking a:hover, aside #links #gutschein a, aside #links #gutschein a:visited, aside #links #gutschein a:hover {
	color:#FFF;
	width:120px;
	height:30px;
	font-weight:600;
	text-decoration:none;
	line-height:30px;
}

footer {
	width:96%;
	margin:0 2%;
}

}

/* Bilder */

@media only screen and (max-width:568px) {
	
.tx-ws-flexslider .caption-text {
    width:94%;
    top: auto;
	bottom:10px;
	font-size:1em;
	padding:5px 3%;
}

.button {
    width: 10%;
}

#buchen-mobile, #gutschein-mobile, #event-aktuell-mobile {
	min-height:2.5em;
}

#mobilemenu ul{width:90%;}

#content h5 {
	font-size:1.2em;
	width:160px;
	padding:0;
	height:36px;
	line-height:36px;
}

#content .ce-gallery[data-ce-columns="2"] .ce-column,
#content .ce-gallery[data-ce-columns="3"] .ce-column,
#content .ce-gallery[data-ce-columns="4"] .ce-column,
#content .ce-gallery[data-ce-columns="5"] .ce-column,
#content .ce-gallery[data-ce-columns="6"] .ce-column {
	width:100%;
	margin-right:0;
}

/* subnavi buttons */

.wohnen1, .wohnen2, .wohnen3, .aktiv1, .aktiv2, .aktiv3, .lodge1, .lodge2, .lodge3, .hunde1, .hunde2, .hunde3 {
	float:left;
	max-width:480px;
	width:100%;
}


.wohnen2, .wohnen3, .aktiv2, .aktiv3, .lodge2, .lodge3, .hunde2, .hunde3 {
	margin-left:0;
}

#events #c3564, #events #c11 {
	width:100%;
}

#events #c11 {
	margin-left:0;
}

#events #c3564 img {
	max-width:360px;
}

.tx-powermail .powermail_fieldset .powermail_label{width:36%;font-weight:normal;}
.tx-powermail .powermail_fieldset .powermail_field{width:63%;}
.tx-powermail .powermail_fieldset .powermail_radio_outer,.tx-powermail .powermail_fieldset .powermail_captcha_outer,.tx-powermail .powermail_fieldset .powermail_check_outer,.tx-powermail .powermail_fieldset .powermail_fieldwrap_text,.tx-powermail .powermail_fieldset .powermail_fieldwrap_file_inner ul:not(.parsley-errors-list){width:63%;}

#adresse, #labels {
	width:100%;
	height:auto;
	padding-bottom:0;
}

#akademie, #huskylodge, #huettenhotel {
	float:left;
	width:33.4%;
	margin:0 5% 0 0;
}

#huskylodge {
	width:26.4%;
}

#huettenhotel {
	width:25.1%;
}

#content .frame-layout-3 .ce-left.ce-intext .ce-gallery {
		width:18%;
	margin-right:3%;
}

}



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


#content h1 {
	font-size:18px;
}


/* 4-spaltig */

.spalte41, .spalte42, .spalte43, .spalte44 {
	float:left;
	max-width:100%;
	margin-bottom:15px;
}

.spalte42, .spalte43, .spalte44 {
	margin-left:0;
}

.wohnen1, .wohnen2, .wohnen3, .wohnen4, .aktiv1, .aktiv2, .aktiv3, .aktiv4, .lodge1, .lodge2, .lodge3, .lodge4, .hunde1, .hunde2, .hunde3, .hunde4 {
	float:left;
	max-width:100%;
	margin-left:0;
}

#wetter-wrapper, #events {
	float:left;
	width:100%;
	height:auto;
}

}