
/* CSS Document */
@-ms-viewport {
width: device-width;
}

@viewport {
width: device-width;
}

.showonmobil{
display: none!important;
}


.hideonmobil{
display: block!important;
}	

.mobilbutton{
width: 40px;
margin: auto 0px;
cursor: pointer;
}

.mobilbutton:before,
.mobilbutton:after,
.mobilbutton div {
background: rgb(var(--umbergrot));
content: "";
display: block;
height: 4px;
border-radius: 2px;
margin: 7px 0;
}

.mobilbutton:hover {
cursor: pointer;
}

.mod_mobile_menu{
display: none;
}



@media only screen and (max-width: 1150px) {

}



@media only screen and (max-width: 960px) {



#header .inside{
	height: 60px;
}

#navwrapper{
	min-height: 45px;
}

#headerbox .inside h1, #headerbox .inside h2{
width: 90%;
max-width: 90%;
}

#headerbox .inside h1{
font-size: 2.5rem;
padding-bottom: 1rem !important;
padding-top: 1rem !important;
margin-bottom: 1rem;
}

#headerbox .inside h2{
font-size: 1.6rem;	
margin-top: 1rem;
}

#main .inside {
max-width: 92%;
margin: 0rem 4% 0rem 4%;
}


#footer .inside{
max-width: 92%;
margin: 0rem 4% 0rem 4%;	
}

#headerbox .inside{
padding: 0rem 0px;	
}

#main .mod_article.fullwidth{
margin-left: -4%;
max-width: calc(100% + 8%);
width: calc(100% + 8%);
padding: 50px 0px 50px 0px;
}

#main .mod_article.fullwidth .inside{
	max-width: 92%;
}

.video_container, .video_container > video{
width: 100%;
height: auto;
}

#headerbox .fullwidth.rezept_detail .inside::after{
max-width: 94%;
width: 94%;
font-size: 2.5rem;
}

p.back{
	margin-left: auto;
	margin-right: auto;
}

#header .mod_navigation{
display: none;
}

.mod_mobile_menu{
display: block;
}

.mobile_menu .social{
	padding: 20px 0px 20px 0px;
}

.mobile_menu .social a{
margin-right: 20px;	
}

#header .mod_mobile_menu {
width: 100%;
height: 100%;
max-width: 45px;
min-height: 45px;
display: flex;
justify-content: flex-end;
align-items:center;
align-content: center;
position: absolute;
top: 0;
right: 0;
z-index: 95;
}

.mobile_menu_trigger{
width: 50px;
height: auto;
vertical-align: middle;
margin-right: 12px;
}


.mobile_menu .inner{
background-color: rgb(var(--umbergrot));
color: #FFFFFF;
margin: 0px 0px;
padding: 0px 0px 0px 0px;
overflow: auto;
}




.mobile_menu .inner ul,.mobile_menu .inner ul li,  .mobile_menu .inner .servicenav{
margin: 0px 0px;
padding: 0px 0px;
list-style-type: none;
color: #FFFFFF;
display: block;
width: 100%;
text-align: left;
font-size: 0.85rem;
background-color: rgb(var(--umbergrot));
}

.mobile_menu .inner ul li{
line-height: 55px;
border-bottom: solid 1px #ffffff;
}

.mobile_menu li.submenu_show>ul {
border-top: solid 1px #ffffff;
}


.mobile_menu .inner ul.level_2,.mobile_menu .inner ul.level_2 li{
background-color:rgba(255, 255, 255,0.5);
}



.mobile_menu .inner ul li a,  .mobile_menu .inner ul li strong{ 
color: #FFFFFF;
text-decoration: none;
font-size: 0.85rem;
margin: 0;
line-height: 55px;
padding: 0px 0px 0px 12px;
display: block;
cursor: pointer;

}


.mobile_menu .inner ul.level_2 li a,  .mobile_menu .inner ul.level_2 li strong{ 
color: rgb(var(--umbergrot));

}


.mobile_menu .inner ul li.submenu > a.submenu::after, .mobile_menu .inner ul li.submenu > strong.submenu::after{

content:"\25B8";
position: relative;
font-weight: 600;
width: 55px;
height: 55px;
line-height: 55px;
color: #FFFFFF;
text-decoration: none;
font-size: 35px;
margin: 0px 0px;
padding: 0px 0px;
float: right;
text-align: center;
vertical-align: middle;
}


.mobile_menu .inner ul li.submenu.submenu_show > a.submenu::after,.mobile_menu .inner ul li.submenu.submenu_show > strong.submenu::after{
content:"\25BE";
position: relative;
font-weight: 600;
width: 55px;
height: 55px;
line-height: 55px;
color: #FFFFFF;
text-decoration: none;
font-size: 35px;
margin: 0px 0px;
padding: 0px 0px;
float: right;
text-align: center;
vertical-align: middle;
}



.mobile_menu .inner ul li:hover, .mobile_menu .inner ul li a:hover,  .mobile_menu .inner ul li strong:hover, .mobile_menu .inner ul li.submenu_show{
background-color: rgb(var(--umbergrot));
color: #ffffff!important;
}


.mobile_menu .inner ul li a.active, .mobile_menu .inner ul li.active > strong , .mobile_menu .inner ul li.active > a, .mobile_menu .inner ul li.forward strong{
color: rgb(var(--umbergrot))!important;
text-decoration: none;
background-color: rgba(255,255,255,1);
}

.mobile_menu .inner ul li.active > a, .mobile_menu .inner ul li.active > strong, .mobile_menu .inner ul  li.trail > a, .mobile_menu .inner ul  li.trail > strong {
color: rgba(255,255,255,1);
}


.mobile_menu .inner ul.level_1 > li.active > strong, .mobile_menu .inner ul.level_1 > li.trail > a, .mobile_menu .inner ul.level_1 > li.trail > a > span {
background-color: rgb(var(--umberggrau));
color: rgba(255,255,255,1)!important;
}


.mobile_menu .inner .topaction{
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
justify-content: flex-start;
align-self: flex-start;
margin: 25px 0px;
}

.mobile_menu .inner .topaction .action {
display: block;
background-color: transparent;
margin: 12px auto 12px auto;
width: 90%;
}

.mobile_menu .inner .topaction .action.fullbutton > a.button-link {
display: block;
background-color: #f39a19;
color: #FFFFFF;
border-radius: 5em;
border: solid 1px #f39a19;
padding: 10px 25px;
font-size: 0.95rem;
}

.mobile_menu .inner .topaction .action > a.button-link {
border-radius: 5em;
border: solid 1px #ffffff;
display: block;
color: #ffffff;
font-size: 0.95rem;
text-decoration: none;
padding: 10px 25px;
text-align: center;
}


.maphinweis{
	width: 90%;
	padding: 0px 0px 0px 0px;
	height: fit-content;
}

.maphinweis p {
  font-weight: 500;
}

.maphinweis .gbutton{
	max-width: unset;
}

}


@media only screen and (max-width: 740px) {

}


@media only screen and (max-width: 680px) {



.showonmobil{
display: block!important;
}


.hideonmobil{
display: none!important;
}	 	


h2, h2.ce_headline{
font-size: 1.8rem;
}

#main h4, #main h4.ce_headline{
	padding-bottom: 0;
}

#main .ce_text br{
	display: none;
}


#main .ce_text p{
margin-bottom: 24px;
}

#main .ce_text p:last-of-type{
margin-bottom: 0px;
}

.mod_newslist.rezept-teaser{
gap: 0px;
flex-direction: column;
}

.mod_newslist.rezept-teaser .layout_latest{
width: 100%;
max-width: 100%;
}

.rs-columns.sameheight{
flex-direction: column;
}


.widget.widget-submit button.submit{
	width: 100%;

}

.rs-columns.sameheight .rs-column{
width: 100%;
max-width: 100%;
}


.mainfooter .rs-columns.flex-column{
flex-direction: column;	

}

.rs-columns.flex-column .rs-column{
	border-bottom: solid 1px #ffffff;
padding-bottom: 25px;
margin-bottom: 25px;
}

.rs-columns.flex-column .rs-column:last-of-type{
border-bottom: 0;
padding-bottom: 0px;
margin-bottom: 0px;
}

.mainfooter .linkbutton > a, .mainfooter a.linkbutton {
  background-color: rgb(var(--umbergbeige));
  
}

.mod_eventlist.foodtruck .event time span{
padding-right: 0px;
}

#footer .subfooter{
padding: 20px 0px;
width: calc(100% + 8%);
max-width: calc(100% + 8%);
max-height: unset;
margin-left: -4%;
}




#footer .subfooter-content{
flex-direction: column-reverse;
}


#footer .social{
padding-bottom: 25px;	
margin: 0px auto;
}

#footer .social > a:first-of-type{
	margin-left: 0px;
}

#header .insidewrapper #logo{
width: 60%;
}


.image_container.float_right, .image_container.float_left{
display: block;
width: 100%;
float: none;
clear: both;
margin: auto auto auto auto;
}

.termin-box .event{
max-width: calc((100% / 2) - 50px);
}


.hinweis-saison{
	width: calc(100% - 2rem);
max-width: unset;
padding-top: 70px;
background-size: 50px 50px;
background-position: center 10px;
}


.hinweis-saison p{
	margin-left: 0px;
}

.termin-box .empty{
	max-width: unset;
}

.image-teaserbox .ce_image h3, .image-teaserbox .ce_image h2{
	font-size: clamp(1rem, 7.333vw, 2.4rem);
}


.image-teaserbox.mobil-column .ce_image h3{
		font-size: clamp(1rem, 4.333vw, 2rem);
}

.image-teaserbox.rs-columns {
  display: flex;
flex-direction: column;
align-content: stretch;
justify-content: flex-start;
  align-items: stretch;
}

.image-teaserbox div.rs-column {
  width: 100% !important;
}

.image-teaserbox .rs-column, .image-teaserbox .rs-column.rs-subcolumn .rs-column .rs-columns .rs-column, .image-teaserbox .rs-column:last-of-type{
border-left: 0px;
}

.image-teaserbox .rs-column:last-of-type{
border-bottom: 0px;	
}

.image-teaserbox .image-teaserbox{
flex-direction: row;
}

.image-teaserbox .rs-column.rs-subcolumn > .rs-column{
border-bottom: 3px solid rgb(255, 255, 255);
}


.image-teaserbox .rs-subcolumn{
  display: flex;
flex-direction: column-reverse;
}

.image-teaserbox .rs-subcolumn .image-teaserbox .rs-column{
width: calc(100% / 2)!important;
}

.image-teaserbox.rs-columns.mobil-column{
	flex-direction: row;
}
.mod_cfg_instagram .item{
width: calc((100% / 2) - 1px);	
}

.social-links{
max-width: calc(100% - 2rem);
width: 100%;
}

.social-links ul{
margin-top: 1rem;
}

.social-liste ul{
margin: 0px 0px 0px 0px;
width: 100%;
flex-direction: column;
}

}