TheCitadelofRicks/src/test/resources/html/Mensa_normal-week.html

3697 lines
175 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html dir="ltr" lang="de">
<head>
<meta charset="utf-8">
<!--
build by sitepackagebuilder.com
This website is powered by TYPO3 - inspiring people to share!
TYPO3 is a free open source Content Management Framework initially created by Kasper Skaarhoj and licensed under GNU/GPL.
TYPO3 is copyright 1998-2022 of Kasper Skaarhoj. Extensions are copyright of their respective owners.
Information and contribution at https://typo3.org/
-->
<link rel="icon" href="/favicon.ico" type="image/vnd.microsoft.icon">
<title>Mensa Offenburg: Studierendenwerk Freiburg-Schwarzwald</title>
<meta http-equiv="x-ua-compatible" content="IE=edge" />
<meta name="generator" content="TYPO3 CMS" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="robots" content="index,follow" />
<meta property="og:title" content="Mensa Offenburg" />
<meta name="twitter:card" content="summary" />
<meta name="apple-mobile-web-app-capable" content="no" />
<link rel="stylesheet" href="/typo3temp/assets/css/7015c8c4ac5ff815b57530b221005fc6.css?1670149528" media="all">
<link rel="stylesheet" href="/typo3conf/ext/swfr_theme/Resources/Public/Css/theme.min.css?1671460954" media="all">
<link rel="stylesheet" href="/typo3conf/ext/femanager/Resources/Public/Css/Main.min.css?1670504806" media="all">
<link rel="stylesheet" href="/typo3conf/ext/femanager_swfr/Resources/Public/Styles/uploader.css?1670504787" media="all">
<link rel="canonical" href="https://www.swfr.de/essen/mensen-cafes-speiseplaene/mensa-offenburg"/>
</head>
<body class="color-cyan">
<header class="grid grid-cols-1 gap-y-30px container mx-auto lg:mt-40px mb-30px lg:px-30px xl:px-0" x-data="{ megaMenuOpen: 0, width: window.innerWidth, mobileBreakpoint: 768, mobileMenu: false }" @resize.window.debounce.100="width = window.innerWidth;" x-cloak>
<section class="col-span-1 grid-cols-1 grid lg:grid-cols-3 xl:grid-cols-6 gap-x-30px lg:gap-30px xl:gap-y-0">
<!-- Handy und MD -->
<div class="flex lg:hidden col-span-1 mb-20px">
<ul class="flex">
<!--<li class="flex items-center p-10px bg-primary-green cursor-pointer">
<img class="w-20px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/search-stoke_white.svg" width="19" height="20" alt="" />
</li>
<li class="flex items-center p-10px bg-black cursor-pointer">
<img class="w-20px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/contrast-filter.svg" width="20" height="20" alt="" />
</li>-->
</ul>
<div class="flex flex-grow justify-center pt-10px pb-[9px] lg:py-10px px-15px bg-primary-green leading-19px ">
<a class="py-10px px-15px bg-primary-green text-white text-14px" href="/login">Serviceportal</a>
<a class="text-center bg-primary-green text-14px py-10px px-15px flex" href="/login">
<img class="ml-5px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/login.svg" width="23" height="20" alt="" />
</a>
<a class="text-center bg-primary-green text-14px py-10px px-15px flex" href="/registrierung">
<img class="ml-5px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/register.svg" width="26" height="21" alt="" />
</a>
</div>
<div class="flex-none">
<nav class="flex items-center h-full bg-[#EDF8BF]">
<ul class="flex items-end py-10px px-15px">
<a class="text-14px leading-19px pl-10px text-gray-400 mb-0" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg">Deutsch</a>
<a class="text-14px leading-19px pl-10px text-gray-400 mb-0" href="/en/food/mensa-cafeterias-menus/offenburg-/-gengenbach/mensa-offenburg">Englisch</a>
</ul>
</nav>
</div>
</div>
<div class="flex lg:hidden justify-between items-end col-span-1 container px-35px">
<div class="">
<a href="/">
<img class="w-[236px]" alt="Logo des Studierendenwerk Freiburg-Schwarzwald" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/logo_studierendenwerk.svg" width="361" height="97" />
</a>
</div>
<div class="mb-3px mobile__menu-toggle" @click="mobileMenu = !mobileMenu">
<img src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/burger-menu.svg" width="41" height="35" alt="" />
</div>
</div>
<!-- Tablet -->
<div class="hidden lg:block xl:hidden col-span-1 lg:col-span-3 xl:col-span-6 flex justify-center">
<a href="/">
<img class="w-6/12 lg:w-3/12 xl:w-[360px] mx-auto" alt="Logo des Studierendenwerk Freiburg-Schwarzwald" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/logo_studierendenwerk.svg" width="361" height="97" />
</a>
</div>
<div class="hidden lg:flex xl:hidden col-span-1 justify-between items-end ">
<!--<ul class="flex justify-end">
<li class="p-10px bg-primary-green mr-15px cursor-pointer">
<img class="w-20px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/search-stoke_white.svg" width="19" height="20" alt="" />
</li>
<li class="p-10px bg-black cursor-pointer">
<img class="w-20px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/contrast-filter.svg" width="20" height="20" alt="" />
</li>
</ul> -->
</div>
<div class="hidden lg:block xl:hidden col-span-1 lg:col-span-2 ">
<div class="flex justify-between">
<div class="flex mr-30px w-full">
<a class="py-10px px-15px bg-primary-green text-white text-14px" href="/login">Serviceportal</a>
<a class="text-center text-14px py-10px px-15px bg-[#EDF8BF] flex" href="/login">
Login
<img class="ml-5px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/login.svg" width="23" height="20" alt="" />
</a>
<a class="text-center text-14px py-10px px-15px bg-[#EDF8BF] flex" href="/registrierung">
Registrierung
<img class="ml-5px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/register.svg" width="26" height="21" alt="" />
</a>
</div>
<nav>
<ul class="flex py-10px px-15px bg-[#EDF8BF]">
<li class="leading-19px"><a class="text-14px leading-19px pl-10px text-gray-400 mb-0" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg">Deutsch</a></li>
<li class="leading-19px"><a class="text-14px leading-19px pl-10px text-gray-400 mb-0" href="/en/food/mensa-cafeterias-menus/offenburg-/-gengenbach/mensa-offenburg">Englisch</a></li>
</ul>
</nav>
</div>
</div>
<!-- Desktop -->
<div class="hidden xl:flex col-span-1 lg:col-span-3">
<a href="/">
<img class="w-6/12 xl:w-[360px]" alt="Logo des Studierendenwerk Freiburg-Schwarzwald" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/logo_studierendenwerk.svg" width="361" height="97" />
</a>
</div>
<div class="hidden xl:flex col-span-1 lg:col-span-1 justify-end items-end ">
<!-- <ul class="flex justify-end">
<li class="p-10px bg-primary-green mr-15px cursor-pointer">
<img class="w-20px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/search-stoke_white.svg" width="19" height="20" alt="" />
</li>
<li class="p-10px bg-black cursor-pointer">
<img class="w-20px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/contrast-filter.svg" width="20" height="20" alt="" />
</li>
</ul>-->
</div>
<div class="hidden xl:flex col-span-1 lg:col-span-2 items-end justify-between">
<div class="flex">
<a class="py-10px px-15px bg-primary-green text-white text-14px" href="/login">Serviceportal</a>
<a class="text-center text-14px py-10px px-15px bg-[#EDF8BF] flex" href="/login">
Login
<img class="ml-5px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/login.svg" width="23" height="20" alt="" />
</a>
<a class="text-center text-14px py-10px px-15px bg-[#EDF8BF] flex" href="/registrierung">
Registrierung
<img class="ml-5px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/register.svg" width="26" height="21" alt="" />
</a>
</div>
<nav>
<ul class="flex py-10px px-15px bg-[#EDF8BF]">
<li class="leading-19px text-14px pr-10px border-r-1px border-gray-400"><a class="text-14px leading-19px " href="/essen/mensen-cafes-speiseplaene/mensa-offenburg">DE</a></li>
<li class="leading-19px text-14px pl-10px"><a class="text-14px leading-19px text-gray-400" href="/en/food/mensa-cafeterias-menus/offenburg-/-gengenbach/mensa-offenburg">EN</a></li>
</ul>
</nav>
</div>
</section>
<nav class="mega-menu relative col-span-1" @click.outside="megaMenuOpen = 0" x-show="width > mobileBreakpoint || mobileMenu">
<ul class="grid grid-cols-1 lg:grid lg:grid-cols-3 xl:grid-cols-6 gap-x-30px lg:gap-15px xl:gap-x-30px xl:gap-y-0">
<li class="col-span-1 py-10px px-35px lg:py-20px lg:px-20px xl:pt-70px bg-primary-blue text-white flex items-center justify-between lg:items-end cursor-pointer" @click="megaMenuOpen = (megaMenuOpen != 1 ? 1 : 0)">
<a href="#" class="font-bold text-white text-17px xl:text-21px leading-25px uppercase" >Geld</a>
<i class="fa-solid fa-minus block lg:hidden" x-show="megaMenuOpen == 1 && width < mobileBreakpoint"></i>
<i class="fa-solid fa-plus block lg:hidden" x-show="megaMenuOpen != 1 && width < mobileBreakpoint"></i>
</li>
<div id="mega-menu-dropdown-geld-mobile" x-show="megaMenuOpen == 1 && width < mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="mega-menu-dropdown lg:mt-30px mt-20px bg-white w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-35px mx-auto dark:text-white">
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/geld/bafoeg">BAföG</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/bafoeg/was-ist-bafoeg">Was ist BAföG?</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/bafoeg/bafoeg-servicepoint-mit-kurzberatung">BAföG-Servicepoint mit Kurzberatung</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/bafoeg/persoenliche-bafoeg-beratung">Persönliche BAföG-Beratung</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/bafoeg/antraege">Anträge</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/geld/finanzielle-hilfen">Finanzielle Hilfen</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/finanzielle-hilfen/darlehen">Darlehen</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/finanzielle-hilfen/zuschuss">Zuschuss</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/finanzielle-hilfen/stipendien">Stipendien</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/geld/studijob">Studijob</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/jobvermittlung">Jobvermittlung</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/serviceportal">Serviceportal</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/faqs">FAQs</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/jobkurse">Jobkurse</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/babysitterboerse">Babysitterbörse</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/senioren-service-boerse">Senioren-Service-Börse</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/geld/verguenstigungen">Vergünstigungen</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/semesterticket">SemesterTicket</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/wohngeld">Wohngeld</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/rundfunkbeitrags-befreiung">Rundfunkbeitrags-Befreiung</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/kleiderscheine-/-freiburger-tafel-/-kulturwunsch">Kleiderscheine / Freiburger Tafel / KulturWunsch</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/isic-/-ermaessigungen-und-rabatte">ISIC / Ermäßigungen und Rabatte</a>
</ul>
</div>
</div>
</div>
<li class="col-span-1 py-10px px-35px lg:py-20px lg:px-20px xl:pt-70px bg-primary-cyan text-white flex items-center justify-between lg:items-end cursor-pointer" @click="megaMenuOpen = (megaMenuOpen != 2 ? 2 : 0)">
<a href="#" class="font-bold text-white text-17px xl:text-21px leading-25px uppercase" >Essen</a>
<i class="fa-solid fa-minus block lg:hidden" x-show="megaMenuOpen == 2 && width < mobileBreakpoint"></i>
<i class="fa-solid fa-plus block lg:hidden" x-show="megaMenuOpen != 2 && width < mobileBreakpoint"></i>
</li>
<div id="mega-menu-dropdown-essen-mobile" x-show="megaMenuOpen == 2 && width < mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class=" mega-menu-dropdown lg:mt-30px mt-20px bg-white w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-2">
<div class="grid grid-cols-2">
<div class="col-span-2 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene">Mensen, Cafés &amp; Speisepläne</a></div>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg">Freiburg</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/mensa-rempartstrasse">Mensa Rempartstraße</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/mensa-institutsviertel">Mensa Institutsviertel</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/mensa-littenweiler">Mensa Littenweiler</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/mensa-flugplatz">Mensa Flugplatz</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/ausgabestelle-eh-freiburg">Ausgabestelle EH Freiburg</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/musikantine">MusiKantine</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/haus-zur-lieben-hand">Haus zur lieben Hand</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-bohne">Café Bohne</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-cube">Café Cube</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-europa">Café Europa</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-libresso">Café Libresso</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-senkrecht">Café Senkrecht</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/eh-cafe">EH-Café</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/institutscafe">Institutscafé</a></li>
</ul>
</div>
<div class="col-span-2 lg:col-span-1 pt-34px">
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/furtwangen">Furtwangen</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-furtwangen">Mensa Furtwangen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/ohg-furtwangen">OHG Furtwangen</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/offenburg-/-gengenbach">Offenburg / Gengenbach</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg">Mensa Offenburg</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-gengenbach">Mensa Gengenbach</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/kehl">Kehl</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-kehl">Mensa Kehl</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/loerrach">Lörrach</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-loerrach">Mensa Lörrach</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/villingen-schwenningen">Villingen-Schwenningen</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-schwenningen">Mensa Schwenningen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-trossingen">Mensa Trossingen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/k19-cafeteria-schwenningen">K19 - Caféteria Schwenningen</a></li>
</ul>
</div>
<!--</div> -->
</div>
</div>
<div class="col-span-2 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke">Einblicke</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/nachhaltigkeit">Nachhaltigkeit</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/qualitaetssicherung">Qualitätssicherung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/barrierefreiheit">Barrierefreiheit</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/vegetarisches-und-veganes-essen">Vegetarisches und veganes Essen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/allergien-und-unvertraeglichkeiten">Allergien und Unverträglichkeiten</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/kinder-in-der-mensa">Kinder in der Mensa</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/mensafuehrung-/-ein-tag-in-der-mensa">Mensaführung / Ein Tag in der Mensa</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/uniaktiv-pass">UniAktiv-Pass</a></li>
</ul>
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensa-kochbuch">Mensa-Kochbuch</a></div>
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/feedback-und-kontakt">Feedback und Kontakt</a></div>
</div>
<div class="col-span-2 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte">Chipkarte</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/was-ist-die-chipkarte">Was ist die Chipkarte?</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/mensacard">MensaCard</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/aufwerten">Aufwerten</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/autoload">Autoload</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/kaservice">Kartenservice</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/faqs">FAQs</a></li>
</ul>
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering">Campus Catering</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering/catering">Catering</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering/raumangebote">Raumangebote</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering/referenzen">Referenzen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering/kundenkarte">Kundenkarte</a></li>
</ul>
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/gruppenverpflegung">Gruppenverpflegung</a></div>
</div>
</div>
</div>
<li class="col-span-1 py-10px px-35px lg:py-20px lg:px-20px xl:pt-70px bg-primary-sandgreen text-white flex items-center justify-between lg:items-end cursor-pointer" @click="megaMenuOpen = (megaMenuOpen != 3 ? 3 : 0)">
<a href="#" class="font-bold text-white text-17px xl:text-21px leading-25px uppercase" >Wohnen</a>
<i class="fa-solid fa-minus block lg:hidden" x-show="megaMenuOpen == 3 && width < mobileBreakpoint"></i>
<i class="fa-solid fa-plus block lg:hidden" x-show="megaMenuOpen != 3 && width < mobileBreakpoint"></i>
</li>
<div id="mega-menu-dropdown-wohnen-mobile" x-show="megaMenuOpen == 3 && width < mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class=" mega-menu-dropdown lg:mt-30px mt-20px bg-white w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-3">
<div class="grid grid-cols-3 gap-x-30px">
<div class="col-span-3 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime">Wohnheime</a></div>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg">Wohnheime in Freiburg</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheimtutoren">Wohnheimtutoren</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaeuser-campus-technische-fakultaet">Studierendenhäuser Campus Technische Fakultät</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studentensiedlung-am-seepark">Studentensiedlung am Seepark</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaeuser-stuehlinger">Studierendenhäuser Stühlinger</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaeuser-haendelstrasse">Studierendenhäuser Händelstraße</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studentendorf-vauban">Studentendorf Vauban</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-oikos-im-vauban">Studierendenhaus OIKOS im Vauban</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/ulrich-zasius-haus">Ulrich-Zasius-Haus</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-lehener-strasse">Studierendenhaus Lehener Straße</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-kunzenweg">Studierendenhaus Kunzenweg</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-berliner-allee">Studierendenhaus Berliner Allee</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-falkenbergerstrasse-1">Studierendenhaus Falkenbergerstraße</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-offenburg">Wohnheime in Offenburg</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheimtutoren-offenburg">Wohnheimtutoren Offenburg</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-zaehringerstrasse">Studierendenhaus Zähringerstraße</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-goldgasse">Studierendenhaus Goldgasse</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-offenburg/studierendenhaeuser-st-martin-strasse">Studierendenhäuser St.-Martin-Straße</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-furtwangen">Wohnheime in Furtwangen</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheimtutoren-furtwangen">Wohnheimtutoren Furtwangen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-furtwangen/studierendenhaeuser-grosshausberg">Studierendenhäuser Großhausberg</a></li>
</ul>
</div>
<div class="col-span-3 lg:col-span-1 pt-34px">
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-kehl">Wohnheime in Kehl</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-kehl/studierendenhaeuser-kinzigallee">Studierendenhäuser Kinzigallee</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-villingen-schwenningen">Wohnheime in Villingen-Schwenningen</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-villingen-schwenningen/studierendenhaus-schramberger-strasse-30/1">Studierendenhaus Schramberger Straße 28 - 30</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-villingen-schwenningen/studierendenhaus-schramberger-strasse-28-30">Studierendenhaus Schramberger Straße 30/1</a></li>
</ul>
<div class="mb-30px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnen-in-gengenbach">Wohnen in Gengenbach</a></div>
<div class="mb-30px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnen-in-loerrach">Wohnen in Lörrach</a></div>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wp">Wohnportal</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/uebersicht-vertraege">Übersicht Verträge</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/online-bewerbung">Online Bewerbung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/schadensmeldung">Schadensmeldung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/kuendigung">Kündigung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/datei-senden">Datei senden</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/mitteilung-senden">Mitteilung senden</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/uebersicht-anfragen">Übersicht Anfragen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/stammdaten-aendern">Stammdaten ändern</a></li>
</ul>
</div>
<div class="col-span-3 lg:col-span-1 pt-34px">
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/alle-informationen-zum-wohnen-im-wohnheim">Alle Informationen zum Wohnen im Wohnheim</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/baumassnahmen">Baumaßnahmen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/servicepaket-fuer-internationale-studierende">Service Paket</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/mietbuchhaltung">Mietbuchhaltung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/barrierefreies-wohnen">Barrierefreies Wohnen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/zwischenvermietung">Zwischenvermietung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/rund-um-den-mietvertrag">Rund um den Mietvertrag</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheim-abc">Wohnheim ABC</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/schluesselhinterlegung-im-digisafe">Schlüsselhinterlegung im Digisafe</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/schluesselausgabe-fuer-neumieter">Schlüsselausgabe für Neumieter</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/programmzimmer">Programmzimmer</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/online-bewerbung-auf-einen-wohnheimplatz">Online Bewerbung auf einen Wohnheimplatz</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/unser-starterpaket">Unser Starterpaket</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/nachhaltigkeit-und-klimaschutz-im-wohnheim">Nachhaltigkeit und Klimaschutz im Wohnheim</a></li>
</ul>
</div>
</div>
</div>
<div class="col-span-3 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/wohnen/freier-wohnungsmarkt">Freier Wohnungsmarkt</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/freier-wohnungsmarkt/freier-wohnungsmarkt">Freier Wohnungsmarkt</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/serviceportal">Serviceportal</a></li>
</ul>
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/wohnen-fuer-hilfe">Wohnen für Hilfe</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/wohnen-fuer-hilfe">Wohnen für Hilfe</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/wohnpartnerschaften-fuer-nicht-studierende">Wohnpartnerschaften für Nicht-Studierende</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/faqs">FAQs</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/integrative-wohngemeinschaften-iwg">Integrative Wohngemeinschaften (IWG)</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/vermieterliste">Vermieterliste</a></li>
</ul>
<div class="mb-30px"><a class="hover:opacity-50 transition-all" href="/wohnen/faqs-zur-zimmer-und-wohnungssuche">FAQs zur Zimmer- und Wohnungssuche</a></div>
<div class="mb-30px"><a class="hover:opacity-50 transition-all" href="/wohnen/notunterkunft">Notunterkunft</a></div>
</div>
</div>
</div>
<li class="col-span-1 py-10px px-35px lg:py-20px lg:px-20px xl:pt-70px bg-primary-orange text-white flex items-center justify-between lg:items-end cursor-pointer" @click="megaMenuOpen = (megaMenuOpen != 4 ? 4 : 0)">
<a href="#" class="font-bold text-white text-17px xl:text-21px leading-25px uppercase" >Soziales</a>
<i class="fa-solid fa-minus block lg:hidden" x-show="megaMenuOpen == 4 && width < mobileBreakpoint"></i>
<i class="fa-solid fa-plus block lg:hidden" x-show="megaMenuOpen != 4 && width < mobileBreakpoint"></i>
</li>
<div id="mega-menu-dropdown-soziales-mobile" x-show="megaMenuOpen == 4 && width < mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class=" mega-menu-dropdown lg:mt-30px mt-20px bg-white w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/infoladen">Infoladen</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/sozialberatung-1">Sozialberatung</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/psychotherapeutische-beratung">Psychotherapeutische Beratung</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/rechtsberatung-/-mediation">Rechtsberatung und Mediation</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/versicherungen">Versicherungen</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/unsere-kitas">Unsere Kitas</a></div>
<ul>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/u3-kitas">U3 Kitas</a>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/kita-kleine-knoepfe">Kita Kleine Knöpfe</a>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/kita-pusteblume">Kita Pusteblume</a>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/weitere-einrichtungen-in-freiburg">Weitere Kooperationen in Freiburg</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/studieren-mit-kind">Studieren mit Kind</a></div>
<ul>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/infos-1">Infos</a>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/u3-kitas">U3 Kitas</a>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/kinder-in-der-mensa-1">Kinder in der Mensa</a>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/babysitterboerse-1">Babysitterbörse</a>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/wohnen-1">Wohnen</a>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/weitere-hilfen-fuer-familien-1">Weitere Hilfen für Familien</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/studieren-mit-handicap">Studieren mit Handicap</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/internationale-studierende">Internationale Studierende</a></div>
</div>
</div>
</div>
<li class="col-span-1 py-10px px-35px lg:py-20px lg:px-20px xl:pt-70px bg-primary-magenta text-white flex items-center justify-between lg:items-end cursor-pointer" @click="megaMenuOpen = (megaMenuOpen != 5 ? 5 : 0)">
<a href="#" class="font-bold text-white text-17px xl:text-21px leading-25px uppercase">Veranstaltungen</a>
<i class="fa-solid fa-minus block lg:hidden" x-show="megaMenuOpen == 5 && width < mobileBreakpoint"></i>
<i class="fa-solid fa-plus block lg:hidden" x-show="megaMenuOpen != 5 && width < mobileBreakpoint"></i>
</li>
<div id="mega-menu-dropdown-veranstaltungen-mobile" x-show="megaMenuOpen == 5 && width < mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class=" mega-menu-dropdown lg:mt-30px mt-20px bg-white w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/kalender">Kalender</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/kultur/kultur-archiv">Kultur</a></div>
<ul>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/kultur-fuer-studierende">Kultur für Studierende</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/veranstaltungstermine">Veranstaltungstermine</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/musik">Musik</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/musical/-mondo-musiktheater">MONDO Musiktheater</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/infos-mensabar">Infos MensaBar</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/fotowettbewerb">Fotowettbewerb</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/ausstellungen">Ausstellungen</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/studitours">Studitours</a></div>
<ul>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/studitours/faqs-studitours">FAQs Studitours</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/touren-offenburg-und-umgebung">Touren: Offenburg und Umgebung</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/sport">Sport</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/workshops">Workshops</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/internationaler-club">Internationaler Club</a></div>
</div>
</div>
</div>
<li class="col-span-1 py-10px px-35px lg:py-20px lg:px-20px xl:pt-70px bg-primary-purple text-white flex items-center justify-between lg:items-end cursor-pointer" @click="megaMenuOpen = (megaMenuOpen != 6 ? 6 : 0)">
<a href="#" class="font-bold text-white text-17px xl:text-21px leading-25px uppercase" >Internationales</a>
<i class="fa-solid fa-minus block lg:hidden" x-show="megaMenuOpen == 6 && width < mobileBreakpoint"></i>
<i class="fa-solid fa-plus block lg:hidden" x-show="megaMenuOpen != 6 && width < mobileBreakpoint"></i>
</li>
<div id="mega-menu-dropdown-internationales-mobile" x-show="megaMenuOpen == 6 && width < mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class=" mega-menu-dropdown lg:mt-30px mt-20px bg-white w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/ankommen">Vorbereiten und ankommen</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/internationales/ankommen/die-ersten-schritte">Die ersten Schritte</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/icbuddy">Buddy-Programm: Deine erste Orientierung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/internationales/ankommen/unicosmos-das-freiburger-spiel">Unicosmos: Das Freiburger Spiel</a></li>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/netzwerken-freizeit">Netzwerken &amp; Freizeit</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/ic">Internationaler Club</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/veranstaltungen/studitours">Studitours</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/veranstaltungen/sport">Sport und Freizeit</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/internationales/netzwerken-freizeit/aktivitaeten-in-den-wohnheimen">Aktivitäten in den Wohnheimen</a></li>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/deutsch-franzoesische-programme">Deutsch-Französische Programme</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/stimmen">Blogprojekt: Stimmen gegen Rassismus und Populismus</a></li>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/studienreise-china">Studienreise China</a></div>
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/refugees-welcome">Refugees Welcome</a></div>
</div>
</div>
</div>
</ul>
<div id="mega-menu-dropdown-geld" x-show="megaMenuOpen == 1 && width > mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="absolute mega-menu-dropdown mt-30px bg-white border-primary-blue border-30px w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/geld/bafoeg">BAföG</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/bafoeg/was-ist-bafoeg">Was ist BAföG?</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/bafoeg/bafoeg-servicepoint-mit-kurzberatung">BAföG-Servicepoint mit Kurzberatung</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/bafoeg/persoenliche-bafoeg-beratung">Persönliche BAföG-Beratung</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/bafoeg/antraege">Anträge</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/geld/finanzielle-hilfen">Finanzielle Hilfen</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/finanzielle-hilfen/darlehen">Darlehen</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/finanzielle-hilfen/zuschuss">Zuschuss</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/finanzielle-hilfen/stipendien">Stipendien</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/geld/studijob">Studijob</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/jobvermittlung">Jobvermittlung</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/serviceportal">Serviceportal</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/faqs">FAQs</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/jobkurse">Jobkurse</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/babysitterboerse">Babysitterbörse</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/studijob/senioren-service-boerse">Senioren-Service-Börse</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/geld/verguenstigungen">Vergünstigungen</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/semesterticket">SemesterTicket</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/wohngeld">Wohngeld</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/rundfunkbeitrags-befreiung">Rundfunkbeitrags-Befreiung</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/kleiderscheine-/-freiburger-tafel-/-kulturwunsch">Kleiderscheine / Freiburger Tafel / KulturWunsch</a>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/geld/verguenstigungen/isic-/-ermaessigungen-und-rabatte">ISIC / Ermäßigungen und Rabatte</a>
</ul>
</div>
</div>
</div>
<div id="mega-menu-dropdown-essen" x-show="megaMenuOpen == 2 && width > mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="absolute mega-menu-dropdown mt-30px bg-white border-primary-cyan border-30px w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-2">
<div class="grid grid-cols-2">
<div class="col-span-2 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene">Mensen, Cafés &amp; Speisepläne</a></div>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg">Freiburg</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/mensa-rempartstrasse">Mensa Rempartstraße</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/mensa-institutsviertel">Mensa Institutsviertel</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/mensa-littenweiler">Mensa Littenweiler</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/mensa-flugplatz">Mensa Flugplatz</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/ausgabestelle-eh-freiburg">Ausgabestelle EH Freiburg</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/musikantine">MusiKantine</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/haus-zur-lieben-hand">Haus zur lieben Hand</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-bohne">Café Bohne</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-cube">Café Cube</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-europa">Café Europa</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-libresso">Café Libresso</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/cafe-senkrecht">Café Senkrecht</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/eh-cafe">EH-Café</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/freiburg/institutscafe">Institutscafé</a></li>
</ul>
</div>
<div class="col-span-2 lg:col-span-1 pt-34px">
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/furtwangen">Furtwangen</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-furtwangen">Mensa Furtwangen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/ohg-furtwangen">OHG Furtwangen</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/offenburg-/-gengenbach">Offenburg / Gengenbach</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg">Mensa Offenburg</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-gengenbach">Mensa Gengenbach</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/kehl">Kehl</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-kehl">Mensa Kehl</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/loerrach">Lörrach</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-loerrach">Mensa Lörrach</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/villingen-schwenningen">Villingen-Schwenningen</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-schwenningen">Mensa Schwenningen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/mensa-trossingen">Mensa Trossingen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensen-cafes-speiseplaene/k19-cafeteria-schwenningen">K19 - Caféteria Schwenningen</a></li>
</ul>
</div>
<!--</div> -->
</div>
</div>
<div class="col-span-2 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke">Einblicke</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/nachhaltigkeit">Nachhaltigkeit</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/qualitaetssicherung">Qualitätssicherung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/barrierefreiheit">Barrierefreiheit</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/vegetarisches-und-veganes-essen">Vegetarisches und veganes Essen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/allergien-und-unvertraeglichkeiten">Allergien und Unverträglichkeiten</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/kinder-in-der-mensa">Kinder in der Mensa</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/mensafuehrung-/-ein-tag-in-der-mensa">Mensaführung / Ein Tag in der Mensa</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/einblicke/uniaktiv-pass">UniAktiv-Pass</a></li>
</ul>
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/mensa-kochbuch">Mensa-Kochbuch</a></div>
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/feedback-und-kontakt">Feedback und Kontakt</a></div>
</div>
<div class="col-span-2 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte">Chipkarte</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/was-ist-die-chipkarte">Was ist die Chipkarte?</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/mensacard">MensaCard</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/aufwerten">Aufwerten</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/autoload">Autoload</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/kaservice">Kartenservice</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/chipkarte/faqs">FAQs</a></li>
</ul>
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering">Campus Catering</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering/catering">Catering</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering/raumangebote">Raumangebote</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering/referenzen">Referenzen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 hover:ml-5px transition-all" href="/essen/campus-catering/kundenkarte">Kundenkarte</a></li>
</ul>
<div class="mb-10px"><a class="hover:opacity-50 hover:ml-5px transition-all" href="/essen/gruppenverpflegung">Gruppenverpflegung</a></div>
</div>
</div>
</div>
<div id="mega-menu-dropdown-wohnen" x-show="megaMenuOpen == 3 && width > mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="absolute mega-menu-dropdown mt-30px bg-white border-primary-sandgreen border-30px w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-3">
<div class="grid grid-cols-3 gap-x-30px">
<div class="col-span-3 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime">Wohnheime</a></div>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg">Wohnheime in Freiburg</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheimtutoren">Wohnheimtutoren</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaeuser-campus-technische-fakultaet">Studierendenhäuser Campus Technische Fakultät</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studentensiedlung-am-seepark">Studentensiedlung am Seepark</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaeuser-stuehlinger">Studierendenhäuser Stühlinger</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaeuser-haendelstrasse">Studierendenhäuser Händelstraße</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studentendorf-vauban">Studentendorf Vauban</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-oikos-im-vauban">Studierendenhaus OIKOS im Vauban</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/ulrich-zasius-haus">Ulrich-Zasius-Haus</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-lehener-strasse">Studierendenhaus Lehener Straße</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-kunzenweg">Studierendenhaus Kunzenweg</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-berliner-allee">Studierendenhaus Berliner Allee</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-falkenbergerstrasse-1">Studierendenhaus Falkenbergerstraße</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-offenburg">Wohnheime in Offenburg</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheimtutoren-offenburg">Wohnheimtutoren Offenburg</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-zaehringerstrasse">Studierendenhaus Zähringerstraße</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-freiburg/studierendenhaus-goldgasse">Studierendenhaus Goldgasse</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-offenburg/studierendenhaeuser-st-martin-strasse">Studierendenhäuser St.-Martin-Straße</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-furtwangen">Wohnheime in Furtwangen</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheimtutoren-furtwangen">Wohnheimtutoren Furtwangen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-furtwangen/studierendenhaeuser-grosshausberg">Studierendenhäuser Großhausberg</a></li>
</ul>
</div>
<div class="col-span-3 lg:col-span-1 pt-34px">
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-kehl">Wohnheime in Kehl</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/in-kehl/studierendenhaeuser-kinzigallee">Studierendenhäuser Kinzigallee</a></li>
</ul>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-villingen-schwenningen">Wohnheime in Villingen-Schwenningen</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-villingen-schwenningen/studierendenhaus-schramberger-strasse-30/1">Studierendenhaus Schramberger Straße 28 - 30</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheime-in-villingen-schwenningen/studierendenhaus-schramberger-strasse-28-30">Studierendenhaus Schramberger Straße 30/1</a></li>
</ul>
<div class="mb-30px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnen-in-gengenbach">Wohnen in Gengenbach</a></div>
<div class="mb-30px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnen-in-loerrach">Wohnen in Lörrach</a></div>
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wp">Wohnportal</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/uebersicht-vertraege">Übersicht Verträge</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/online-bewerbung">Online Bewerbung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/schadensmeldung">Schadensmeldung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/kuendigung">Kündigung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/datei-senden">Datei senden</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/mitteilung-senden">Mitteilung senden</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/uebersicht-anfragen">Übersicht Anfragen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wp/stammdaten-aendern">Stammdaten ändern</a></li>
</ul>
</div>
<div class="col-span-3 lg:col-span-1 pt-34px">
<div class="mb-5px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnheime/alle-informationen-zum-wohnen-im-wohnheim">Alle Informationen zum Wohnen im Wohnheim</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/baumassnahmen">Baumaßnahmen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/servicepaket-fuer-internationale-studierende">Service Paket</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/mietbuchhaltung">Mietbuchhaltung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/barrierefreies-wohnen">Barrierefreies Wohnen</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/zwischenvermietung">Zwischenvermietung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/rund-um-den-mietvertrag">Rund um den Mietvertrag</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/wohnheim-abc">Wohnheim ABC</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/schluesselhinterlegung-im-digisafe">Schlüsselhinterlegung im Digisafe</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/schluesselausgabe-fuer-neumieter">Schlüsselausgabe für Neumieter</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/programmzimmer">Programmzimmer</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/online-bewerbung-auf-einen-wohnheimplatz">Online Bewerbung auf einen Wohnheimplatz</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/unser-starterpaket">Unser Starterpaket</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnheime/nachhaltigkeit-und-klimaschutz-im-wohnheim">Nachhaltigkeit und Klimaschutz im Wohnheim</a></li>
</ul>
</div>
</div>
</div>
<div class="col-span-3 lg:col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/wohnen/freier-wohnungsmarkt">Freier Wohnungsmarkt</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/freier-wohnungsmarkt/freier-wohnungsmarkt">Freier Wohnungsmarkt</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/serviceportal">Serviceportal</a></li>
</ul>
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/wohnen-fuer-hilfe">Wohnen für Hilfe</a></div>
<ul class="mb-30px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/wohnen-fuer-hilfe">Wohnen für Hilfe</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/wohnpartnerschaften-fuer-nicht-studierende">Wohnpartnerschaften für Nicht-Studierende</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/faqs">FAQs</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/integrative-wohngemeinschaften-iwg">Integrative Wohngemeinschaften (IWG)</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/wohnen/wohnen-fuer-hilfe/vermieterliste">Vermieterliste</a></li>
</ul>
<div class="mb-30px"><a class="hover:opacity-50 transition-all" href="/wohnen/faqs-zur-zimmer-und-wohnungssuche">FAQs zur Zimmer- und Wohnungssuche</a></div>
<div class="mb-30px"><a class="hover:opacity-50 transition-all" href="/wohnen/notunterkunft">Notunterkunft</a></div>
</div>
</div>
</div>
<div id="mega-menu-dropdown-soziales" x-show="megaMenuOpen == 4 && width > mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="absolute mega-menu-dropdown mt-30px bg-white border-primary-orange border-30px w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/infoladen">Infoladen</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/sozialberatung-1">Sozialberatung</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/psychotherapeutische-beratung">Psychotherapeutische Beratung</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/rechtsberatung-/-mediation">Rechtsberatung und Mediation</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/versicherungen">Versicherungen</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/unsere-kitas">Unsere Kitas</a></div>
<ul>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/u3-kitas">U3 Kitas</a>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/kita-kleine-knoepfe">Kita Kleine Knöpfe</a>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/kita-pusteblume">Kita Pusteblume</a>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/weitere-einrichtungen-in-freiburg">Weitere Kooperationen in Freiburg</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/studieren-mit-kind">Studieren mit Kind</a></div>
<ul>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/infos-1">Infos</a>
<li class="arrow-right mb-3px"><a href="/soziales/unsere-kitas/u3-kitas">U3 Kitas</a>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/kinder-in-der-mensa-1">Kinder in der Mensa</a>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/babysitterboerse-1">Babysitterbörse</a>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/wohnen-1">Wohnen</a>
<li class="arrow-right mb-3px"><a href="/soziales/studieren-mit-kind/weitere-hilfen-fuer-familien-1">Weitere Hilfen für Familien</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/studieren-mit-handicap">Studieren mit Handicap</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/soziales/internationale-studierende">Internationale Studierende</a></div>
</div>
</div>
</div>
<div id="mega-menu-dropdown-veranstaltungen" x-show="megaMenuOpen == 5 && width > mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="absolute mega-menu-dropdown mt-30px bg-white border-primary-magenta border-30px w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/kalender">Kalender</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/kultur/kultur-archiv">Kultur</a></div>
<ul>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/kultur-fuer-studierende">Kultur für Studierende</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/veranstaltungstermine">Veranstaltungstermine</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/musik">Musik</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/musical/-mondo-musiktheater">MONDO Musiktheater</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/infos-mensabar">Infos MensaBar</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/fotowettbewerb">Fotowettbewerb</a>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/kultur/ausstellungen">Ausstellungen</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/studitours">Studitours</a></div>
<ul>
<li class="arrow-right mb-3px"><a href="/veranstaltungen/studitours/faqs-studitours">FAQs Studitours</a>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/touren-offenburg-und-umgebung">Touren: Offenburg und Umgebung</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/sport">Sport</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/workshops">Workshops</a></div>
</div>
<div class="col-span-1">
<div class="mb-10px"><a href="/veranstaltungen/internationaler-club">Internationaler Club</a></div>
</div>
</div>
</div>
<div id="mega-menu-dropdown-internationales"x-show="megaMenuOpen == 6 && width > mobileBreakpoint"
x-transition:enter="ease-in-out duration-500"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="ease-in-out duration-500"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="absolute mega-menu-dropdown mt-30px bg-white border-primary-purple border-30px w-full z-30">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px py-5 px-20px mx-auto dark:text-white">
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/ankommen">Vorbereiten und ankommen</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/internationales/ankommen/die-ersten-schritte">Die ersten Schritte</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/icbuddy">Buddy-Programm: Deine erste Orientierung</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/internationales/ankommen/unicosmos-das-freiburger-spiel">Unicosmos: Das Freiburger Spiel</a></li>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/netzwerken-freizeit">Netzwerken &amp; Freizeit</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/ic">Internationaler Club</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/veranstaltungen/studitours">Studitours</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/veranstaltungen/sport">Sport und Freizeit</a></li>
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/internationales/netzwerken-freizeit/aktivitaeten-in-den-wohnheimen">Aktivitäten in den Wohnheimen</a></li>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/deutsch-franzoesische-programme">Deutsch-Französische Programme</a></div>
<ul class="mb-20px">
<li><a class="arrow-right mb-3px hover:opacity-50 transition-all" href="/stimmen">Blogprojekt: Stimmen gegen Rassismus und Populismus</a></li>
</ul>
</div>
<div class="col-span-1">
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/studienreise-china">Studienreise China</a></div>
<div class="mb-10px"><a class="hover:opacity-50 transition-all" href="/internationales/refugees-welcome">Refugees Welcome</a></div>
</div>
</div>
</div>
</nav>
</header>
<main class="section__main col-span-1 lg:col-span-2 mb-60px xl:mb-90px container mx-auto">
<div class="grid grid-cols-2 lg:grid-cols-3 gap-x-30px ">
<section class="section__main col-span-2 px-30px xl:px-0 ">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-x-30px">
<div class="col-span-1 lg:col-span-3 flex items-end pb-20px pl-30px min-h-header bg-colored">
<h1 class="text-white">Mensa Offenburg</h1>
</div>
</div>
<nav class="col-span-1 lg:col-span-3">
<ul class="py-20px flex flex-col lg:flex-row breadcrumb"><li class="flex mr-10px opacity-50"><a href="/essen" target="_top" class="arrow-right font-normal leading-30px mb-0">Essen</a></li><li class="flex mr-10px opacity-50"><a href="/essen/mensen-cafes-speiseplaene" target="_top" class="arrow-right font-normal leading-30px mb-0">Mensen, Cafés & Speisepläne</a></li><li class="flex mr-10px opacity-50"><a href="/essen/mensen-cafes-speiseplaene/offenburg-/-gengenbach" target="_top" class="arrow-right font-normal leading-30px mb-0">Offenburg / Gengenbach</a></li><li class="flex mr-10px"><a href="/essen/mensen-cafes-speiseplaene/mensa-offenburg" target="_top" class="arrow-right font-normal leading-30px mb-0">Mensa Offenburg</a></li></ul>
</nav>
<div id="c137" class="frame frame-default frame-type-textmedia frame-layout-0">
<header>
<h2 class="">
Hygieneregeln
</h2>
</header>
<div class="ce-textpic ce-center ce-above">
<div class="ce-bodytext">
<p>Bitte die geltenden Hygiene- und Corona-Regeln vor Ort beachten.</p>
</div>
</div>
</div>
<div id="c138" class="frame frame-default frame-type-list frame-layout-0">
<h2>Aktueller Speiseplan</h2>
<div x-data="{currentDay: 1, showAllergenes: false, showAllergenesModal: false}" class="section-mensa">
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-y-30px md:gap-30px mb-30px" >
<div class="col-span-1 md:col-span-2 xl:col-span-4">
<div class="bg-light-cyan flex justify-between">
<ul class="flex justiy-start lg:justify-center mx-auto overflow-auto" id="tabsWeekdays" role="tablist">
<li>
<button class="py-10px px-30px mb-0 transition" id="label-mon" type="button" role="tab"
:class="{'bg-primary-cyan text-white hover:bg-lighter-cyan hover:text-primary-cyan' : (currentDay == 1), 'bg-light-cyan text-white hover:bg-primary-cyan hover:text-white': (currentDay != 1) }"
aria-selected="true" x-on:click="currentDay = 1">
Mo 19.12.
</button>
</li>
<li>
<button class="py-10px px-30px mb-0 transition" id="label-tue" type="button" role="tab"
:class="{'bg-primary-cyan text-white hover:bg-lighter-cyan hover:text-primary-cyan' : (currentDay == 2), 'bg-light-cyan text-white hover:bg-primary-cyan hover:text-white': (currentDay != 2) }"
aria-selected="true" x-on:click="currentDay = 2">
Di 20.12.
</button>
</li>
<li>
<button class="py-10px px-30px mb-0 transition" id="label-wed" type="button" role="tab"
:class="{'bg-primary-cyan text-white hover:bg-lighter-cyan hover:text-primary-cyan' : (currentDay == 3), 'bg-light-cyan text-white hover:bg-primary-cyan hover:text-white': (currentDay != 3) }"
aria-selected="true" x-on:click="currentDay = 3">
Mi 21.12.
</button>
</li>
<li>
<button class="py-10px px-30px mb-0 transition" id="label-thu" type="button" role="tab"
:class="{'bg-primary-cyan text-white hover:bg-lighter-cyan hover:text-primary-cyan' : (currentDay == 4), 'bg-light-cyan text-white hover:bg-primary-cyan hover:text-white': (currentDay != 4) }"
aria-selected="true" x-on:click="currentDay = 4">
Do 22.12.
</button>
</li>
<li>
<button class="py-10px px-30px mb-0 transition" id="label-fri" type="button" role="tab"
:class="{'bg-primary-cyan text-white hover:bg-lighter-cyan hover:text-primary-cyan' : (currentDay == 5), 'bg-light-cyan text-white hover:bg-primary-cyan hover:text-white': (currentDay != 5) }"
aria-selected="true" x-on:click="currentDay = 5">
Fr 23.12.
</button>
</li>
<li>
<button class="py-10px px-30px mb-0 transition" id="label-sat" type="button" role="tab"
:class="{'bg-primary-cyan text-white hover:bg-lighter-cyan hover:text-primary-cyan' : (currentDay == 6), 'bg-light-cyan text-white hover:bg-primary-cyan hover:text-white': (currentDay != 6) }"
aria-selected="true" x-on:click="currentDay = 6">
Sa 24.12.
</button>
</li>
</ul>
<a class="next-week px-5px lg:px-20px pt-[14px] pb-[12px] bg-primary-cyan flex items-center" title="eine Woche weiter" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg?tx_speiseplan_pi1%5Baction%5D=show&amp;tx_speiseplan_pi1%5Bcontroller%5D=Speiseplan&amp;tx_speiseplan_pi1%5BweekToShow%5D=1&amp;cHash=facfb6f6729f23084c9b021eb5ac452b"><img class="min-w-15px w-15px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/arrow-right_white.svg" width="34" height="30" alt="" /></a>
</div>
</div>
</div>
<div id="tabsWeekdaysMenu">
<div id="tab-mon" class="menu-tagesplan" role="tabpanel" aria-labelledby="label-mon" x-show="currentDay == 1">
<h3>Montag 19.12.</h3>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-y-30px md:gap-30px mb-30px">
<div class="col-span-1 bg-lighter-cyan py-20px px-15px flex flex-col">
<div class="flex justify-between">
<h5>Essen 1</h5>
<img class="w-30px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/vegetarisch.svg" width="27" height="27" alt="" />
</div>
<small class="extra-text mb-15px">auf Wunsch vegan<br>Gemüselasagne oder<br>Cannelloni mit Gemüse und Käsekruste<br>Tomatensauce<br>Beilagensalat oder Regio-Apfel</small>
<div class="border-t-1px border-light-cyan w-full pt-15px mt-15px flex justify-between">
<div id="accordion-collapse-1-1" class="w-full" data-accordion="collapse" data-active-classes="bg-primary-cyan text-white" data-inactive-classes="text-primary-cyan">
<h4 id="accordion-collapse-heading-1-1">
<button type="button" class="text-14px text-left extra-text text-primary-cyan flex items-center justify-between w-full" data-accordion-target="#accordion-collapse-body-1-1" aria-expanded="false" aria-controls="accordion-collapse-body--1">
<span>Preise + Kennzeichnungen</span>
<img class="w-12px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/plus-cyan.svg" width="12" height="12" alt="" />
</button>
</h4>
<div id="accordion-collapse-body-1-1" class="hidden" aria-labelledby="accordion-collapse-heading-1-1">
<dl class="text-14px mb-20px">
<div class="flex items-end justify-between">
<dt class="price-studierende">Studierende, Schüler</dt>
<dd>3,45 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-mitarbeiter">Beschäftigte</dt>
<dd>4,75 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-gaeste">Gäste</dt>
<dd>6,90 €</dd>
</div>
</dl>
<small class="zusatzsstoffe" x-show="!showAllergenes">Kennzeichnungen/Zusatzstoffe:<br>5</small>
<small class="zusatzsstoffe" x-show="showAllergenes">Kennzeichnungen/Zusatzstoffe:<br> 5<br>enthält Allergene: ML,GlW,Gl,Ei,Se</small>
</div>
</div>
</div>
</div>
<div class="col-span-1 bg-lighter-cyan py-20px px-15px flex flex-col">
<div class="flex justify-between">
<h5>Essen 2</h5>
</div>
<small class="extra-text mb-15px">Grönsaksbullar -Gemüsebällchen oder<br>Köttbullar<br>Pfeffer-Rahmsauce<br>Blumenkohl-Kartoffelpüree<br>Beilagensalat oder Regio-Apfel</small>
<div class="border-t-1px border-light-cyan w-full pt-15px mt-15px flex justify-between">
<div id="accordion-collapse-1-2" class="w-full" data-accordion="collapse" data-active-classes="bg-primary-cyan text-white" data-inactive-classes="text-primary-cyan">
<h4 id="accordion-collapse-heading-1-2">
<button type="button" class="text-14px text-left extra-text text-primary-cyan flex items-center justify-between w-full" data-accordion-target="#accordion-collapse-body-1-2" aria-expanded="false" aria-controls="accordion-collapse-body--1">
<span>Preise + Kennzeichnungen</span>
<img class="w-12px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/plus-cyan.svg" width="12" height="12" alt="" />
</button>
</h4>
<div id="accordion-collapse-body-1-2" class="hidden" aria-labelledby="accordion-collapse-heading-1-2">
<dl class="text-14px mb-20px">
<div class="flex items-end justify-between">
<dt class="price-studierende">Studierende, Schüler</dt>
<dd>3,45 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-mitarbeiter">Beschäftigte</dt>
<dd>4,75 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-gaeste">Gäste</dt>
<dd>6,90 €</dd>
</div>
</dl>
<small class="zusatzsstoffe" x-show="!showAllergenes">Kennzeichnungen/Zusatzstoffe:<br>5,sch,ri,4</small>
<small class="zusatzsstoffe" x-show="showAllergenes">Kennzeichnungen/Zusatzstoffe:<br> 5,sch,ri,4<br>enthält Allergene: ML,GlW,Gl,Ei</small>
</div>
</div>
</div>
</div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
</div>
</div>
<div id="tab-tue" class="menu-tagesplan" role="tabpanel" aria-labelledby="label-tue" x-show="currentDay == 2">
<h3>Dienstag 20.12.</h3>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-y-30px md:gap-30px mb-30px">
<div class="col-span-1 bg-lighter-cyan py-20px px-15px flex flex-col">
<div class="flex justify-between">
<h5>Essen 1</h5>
<img class="w-30px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/vegetarisch.svg" width="27" height="27" alt="" />
</div>
<small class="extra-text mb-15px">Brokkoli-Nussecken<br>Rotweinsauce<br>Kartoffel-Kürbispüree<br>Apfelrotkraut<br>Feldsalat</small>
<div class="border-t-1px border-light-cyan w-full pt-15px mt-15px flex justify-between">
<div id="accordion-collapse-2-1" class="w-full" data-accordion="collapse" data-active-classes="bg-primary-cyan text-white" data-inactive-classes="text-primary-cyan">
<h4 id="accordion-collapse-heading-2-1">
<button type="button" class="text-14px text-left extra-text text-primary-cyan flex items-center justify-between w-full" data-accordion-target="#accordion-collapse-body-2-1" aria-expanded="false" aria-controls="accordion-collapse-body--2">
<span>Preise + Kennzeichnungen</span>
<img class="w-12px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/plus-cyan.svg" width="12" height="12" alt="" />
</button>
</h4>
<div id="accordion-collapse-body-2-1" class="hidden" aria-labelledby="accordion-collapse-heading-2-1">
<dl class="text-14px mb-20px">
<div class="flex items-end justify-between">
<dt class="price-studierende">Studierende, Schüler</dt>
<dd>3,45 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-mitarbeiter">Beschäftigte</dt>
<dd>4,75 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-gaeste">Gäste</dt>
<dd>6,90 €</dd>
</div>
</dl>
<small class="zusatzsstoffe" x-show="!showAllergenes">Kennzeichnungen/Zusatzstoffe:<br>5</small>
<small class="zusatzsstoffe" x-show="showAllergenes">Kennzeichnungen/Zusatzstoffe:<br> 5<br>enthält Allergene: GlW,GlH,ML,NM,Gl,Sf,Se,Nu,NH</small>
</div>
</div>
</div>
</div>
<div class="col-span-1 bg-lighter-cyan py-20px px-15px flex flex-col">
<div class="flex justify-between">
<h5>Essen 2</h5>
</div>
<small class="extra-text mb-15px">Weihnachtsessen<br>Hirschgulasch<br>Rotweinsauce<br>Bauernspätzle<br>Apfelrotkraut<br>Feldsalat</small>
<div class="border-t-1px border-light-cyan w-full pt-15px mt-15px flex justify-between">
<div id="accordion-collapse-2-2" class="w-full" data-accordion="collapse" data-active-classes="bg-primary-cyan text-white" data-inactive-classes="text-primary-cyan">
<h4 id="accordion-collapse-heading-2-2">
<button type="button" class="text-14px text-left extra-text text-primary-cyan flex items-center justify-between w-full" data-accordion-target="#accordion-collapse-body-2-2" aria-expanded="false" aria-controls="accordion-collapse-body--2">
<span>Preise + Kennzeichnungen</span>
<img class="w-12px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/plus-cyan.svg" width="12" height="12" alt="" />
</button>
</h4>
<div id="accordion-collapse-body-2-2" class="hidden" aria-labelledby="accordion-collapse-heading-2-2">
<dl class="text-14px mb-20px">
<div class="flex items-end justify-between">
<dt class="price-studierende">Studierende, Schüler</dt>
<dd>3,45 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-mitarbeiter">Beschäftigte</dt>
<dd>4,75 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-gaeste">Gäste</dt>
<dd>6,90 €</dd>
</div>
</dl>
<small class="zusatzsstoffe" x-show="!showAllergenes">Kennzeichnungen/Zusatzstoffe:<br>5</small>
<small class="zusatzsstoffe" x-show="showAllergenes">Kennzeichnungen/Zusatzstoffe:<br> 5<br>enthält Allergene: Ei,Gl,GlW,ML,Sf</small>
</div>
</div>
</div>
</div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
</div>
</div>
<div id="tab-wed" class="menu-tagesplan" role="tabpanel" aria-labelledby="label-wed" x-show="currentDay == 3">
<h3>Mittwoch 21.12.</h3>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-y-30px md:gap-30px mb-30px">
<div class="col-span-1 bg-lighter-cyan py-20px px-15px flex flex-col">
<div class="flex justify-between">
<h5>Essen 1</h5>
<img class="w-30px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/vegetarisch.svg" width="27" height="27" alt="" />
</div>
<small class="extra-text mb-15px">Gemüsenuggets<br>Mojo Dip<br>Gitterkartoffeln<br>Beilagensalat oder Regio-Apfel</small>
<div class="border-t-1px border-light-cyan w-full pt-15px mt-15px flex justify-between">
<div id="accordion-collapse-3-1" class="w-full" data-accordion="collapse" data-active-classes="bg-primary-cyan text-white" data-inactive-classes="text-primary-cyan">
<h4 id="accordion-collapse-heading-3-1">
<button type="button" class="text-14px text-left extra-text text-primary-cyan flex items-center justify-between w-full" data-accordion-target="#accordion-collapse-body-3-1" aria-expanded="false" aria-controls="accordion-collapse-body--3">
<span>Preise + Kennzeichnungen</span>
<img class="w-12px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/plus-cyan.svg" width="12" height="12" alt="" />
</button>
</h4>
<div id="accordion-collapse-body-3-1" class="hidden" aria-labelledby="accordion-collapse-heading-3-1">
<dl class="text-14px mb-20px">
<div class="flex items-end justify-between">
<dt class="price-studierende">Studierende, Schüler</dt>
<dd>3,45 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-mitarbeiter">Beschäftigte</dt>
<dd>4,75 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-gaeste">Gäste</dt>
<dd>6,90 €</dd>
</div>
</dl>
<small class="zusatzsstoffe" x-show="!showAllergenes">Kennzeichnungen/Zusatzstoffe:<br>5</small>
<small class="zusatzsstoffe" x-show="showAllergenes">Kennzeichnungen/Zusatzstoffe:<br> 5<br>enthält Allergene: GlW,GlG,Gl,ML</small>
</div>
</div>
</div>
</div>
<div class="col-span-1 bg-lighter-cyan py-20px px-15px flex flex-col">
<div class="flex justify-between">
<h5>Essen 2</h5>
<img class="w-30px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/vegan.svg" width="27" height="27" alt="" />
</div>
<small class="extra-text mb-15px">Gebratener Gemüsereis Nasi Goreng<br>Bio Tofu-Erdnusswürfel<br>Beilagensalat oder Regio-Apfel</small>
<div class="border-t-1px border-light-cyan w-full pt-15px mt-15px flex justify-between">
<div id="accordion-collapse-3-2" class="w-full" data-accordion="collapse" data-active-classes="bg-primary-cyan text-white" data-inactive-classes="text-primary-cyan">
<h4 id="accordion-collapse-heading-3-2">
<button type="button" class="text-14px text-left extra-text text-primary-cyan flex items-center justify-between w-full" data-accordion-target="#accordion-collapse-body-3-2" aria-expanded="false" aria-controls="accordion-collapse-body--3">
<span>Preise + Kennzeichnungen</span>
<img class="w-12px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/plus-cyan.svg" width="12" height="12" alt="" />
</button>
</h4>
<div id="accordion-collapse-body-3-2" class="hidden" aria-labelledby="accordion-collapse-heading-3-2">
<dl class="text-14px mb-20px">
<div class="flex items-end justify-between">
<dt class="price-studierende">Studierende, Schüler</dt>
<dd>3,45 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-mitarbeiter">Beschäftigte</dt>
<dd>4,75 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-gaeste">Gäste</dt>
<dd>6,90 €</dd>
</div>
</dl>
<small class="zusatzsstoffe" x-show="!showAllergenes">Kennzeichnungen/Zusatzstoffe:<br>o</small>
<small class="zusatzsstoffe" x-show="showAllergenes">Kennzeichnungen/Zusatzstoffe:<br> o<br>enthält Allergene: Gl,GlW,Se,Sf,So,Sn</small>
</div>
</div>
</div>
</div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
</div>
</div>
<div id="tab-thu" class="menu-tagesplan" role="tabpanel" aria-labelledby="label-thu" x-show="currentDay == 4">
<h3>Donnerstag 22.12.</h3>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-y-30px md:gap-30px mb-30px">
<div class="col-span-1 bg-lighter-cyan py-20px px-15px flex flex-col">
<div class="flex justify-between">
<h5>Essen 1</h5>
<img class="w-30px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/vegan.svg" width="27" height="27" alt="" />
</div>
<small class="extra-text mb-15px">Schupfnudel-Gemüsepfanne<br>Weiße Sauce<br>Beilagensalat oder Regio-Apfel</small>
<div class="border-t-1px border-light-cyan w-full pt-15px mt-15px flex justify-between">
<div id="accordion-collapse-4-1" class="w-full" data-accordion="collapse" data-active-classes="bg-primary-cyan text-white" data-inactive-classes="text-primary-cyan">
<h4 id="accordion-collapse-heading-4-1">
<button type="button" class="text-14px text-left extra-text text-primary-cyan flex items-center justify-between w-full" data-accordion-target="#accordion-collapse-body-4-1" aria-expanded="false" aria-controls="accordion-collapse-body--4">
<span>Preise + Kennzeichnungen</span>
<img class="w-12px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/plus-cyan.svg" width="12" height="12" alt="" />
</button>
</h4>
<div id="accordion-collapse-body-4-1" class="hidden" aria-labelledby="accordion-collapse-heading-4-1">
<dl class="text-14px mb-20px">
<div class="flex items-end justify-between">
<dt class="price-studierende">Studierende, Schüler</dt>
<dd>3,45 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-mitarbeiter">Beschäftigte</dt>
<dd>4,75 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-gaeste">Gäste</dt>
<dd>6,90 €</dd>
</div>
</dl>
<small class="zusatzsstoffe" x-show="showAllergenes">enthält Allergene:<br> Gl,GlW,Se,So</small>
</div>
</div>
</div>
</div>
<div class="col-span-1 bg-lighter-cyan py-20px px-15px flex flex-col">
<div class="flex justify-between">
<h5>Essen 2</h5>
</div>
<small class="extra-text mb-15px">Fischragout<br>Bandnudeln<br>Buntes Marktgemüse</small>
<div class="border-t-1px border-light-cyan w-full pt-15px mt-15px flex justify-between">
<div id="accordion-collapse-4-2" class="w-full" data-accordion="collapse" data-active-classes="bg-primary-cyan text-white" data-inactive-classes="text-primary-cyan">
<h4 id="accordion-collapse-heading-4-2">
<button type="button" class="text-14px text-left extra-text text-primary-cyan flex items-center justify-between w-full" data-accordion-target="#accordion-collapse-body-4-2" aria-expanded="false" aria-controls="accordion-collapse-body--4">
<span>Preise + Kennzeichnungen</span>
<img class="w-12px" src="/typo3conf/ext/speiseplan/Resources/Public/Images/plus-cyan.svg" width="12" height="12" alt="" />
</button>
</h4>
<div id="accordion-collapse-body-4-2" class="hidden" aria-labelledby="accordion-collapse-heading-4-2">
<dl class="text-14px mb-20px">
<div class="flex items-end justify-between">
<dt class="price-studierende">Studierende, Schüler</dt>
<dd>3,45 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-mitarbeiter">Beschäftigte</dt>
<dd>4,75 €</dd>
</div>
<div class="flex items-end justify-between">
<dt class="price-gaeste">Gäste</dt>
<dd>6,90 €</dd>
</div>
</dl>
<small class="zusatzsstoffe" x-show="!showAllergenes">Kennzeichnungen/Zusatzstoffe:<br>nF</small>
<small class="zusatzsstoffe" x-show="showAllergenes">Kennzeichnungen/Zusatzstoffe:<br> nF<br>enthält Allergene: Se,ML,GlW,Gl,Ei,Fi</small>
</div>
</div>
</div>
</div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
<div class="hidden xl:block xl:col-span-1 bg-lighter-green"></div>
</div>
</div>
<div id="tab-fri" class="menu-tagesplan" role="tabpanel" aria-labelledby="label-fri" x-show="currentDay == 5">
<h3>Freitag 23.12.</h3>
<div class="row row-narrow row-buffer row-table">
<div class="col-md-1 bg-beige-hell zusatzangaben">
<i class="glyphicons glyphicons-circle-info"></i>
</div>
<div class="col-md-11 border-beige-hell">
<h4>heute keine Essensausgabe</h4>
</div>
</div>
</div>
<div id="tab-sat" class="menu-tagesplan" role="tabpanel" aria-labelledby="label-sat" x-show="currentDay == 6">
<h3>Samstag 24.12.</h3>
<div class="row row-narrow row-buffer row-table">
<div class="col-md-1 bg-beige-hell zusatzangaben">
<i class="glyphicons glyphicons-circle-info"></i>
</div>
<div class="col-md-11 border-beige-hell">
<h4>heute keine Essensausgabe</h4>
</div>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-y-30px md:gap-30px mb-30px">
<div class="col-span-1 md:col-start-1">
<div class="mb-10px"><small class="text-gray-400 font-bold">Legende</small></div>
<div class="flex mb-2px">
<div class="wunsch-vegan_btn"><small class="text-gray-400 font-normal mb-0">Auf Wunsch vegan</small></div>
</div>
<div class="flex mb-2px">
<div class="vegan_btn"><small class="text-gray-400 font-normal mb-0">Vegan</small></div>
</div>
<div class="flex">
<div class="vegetarisch_btn"><small class="text-gray-400 font-normal mb-0">Vegetarisch</small></div>
</div>
</div>
<div class="col-span-1">
<div class="mb-10px"><small class="text-gray-400 font-bold">Download</small></div>
<div x-show="!showAllergenes">
<div><a download="wochenplan.pdf" class="text-14px font-normal text-gray-400 hover:text-gray-800 transition" title="Wochenplan in Farbe herunterladen" target="_blank" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg?tx_speiseplan_pi1%5Baction%5D=buildPdf&amp;tx_speiseplan_pi1%5Bcolored%5D=1&amp;tx_speiseplan_pi1%5Bcontroller%5D=Speiseplan&amp;tx_speiseplan_pi1%5Bort%5D=651&amp;tx_speiseplan_pi1%5BweekToShow%5D=0&amp;type=99&amp;cHash=3a75b41f21a3627d52ad5a169cab13e2"><span class="text-light-green font-bold mb-0">PDF :</span> Wochenplan farbig</a></div>
<div><a download="wochenplan.pdf" class="text-14px font-normal text-gray-400 hover:text-gray-800 transition" title="Wochenplan in schwarz-weiß herunterladen" target="_blank" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg?tx_speiseplan_pi1%5Baction%5D=buildPdf&amp;tx_speiseplan_pi1%5Bcolored%5D=0&amp;tx_speiseplan_pi1%5Bcontroller%5D=Speiseplan&amp;tx_speiseplan_pi1%5Bort%5D=651&amp;tx_speiseplan_pi1%5BweekToShow%5D=0&amp;type=99&amp;cHash=175bc59de32a03e210ba994a21a1314b"><span class="text-light-green font-bold mb-0">PDF:</span> Wochenplan s/w</a></div>
</div>
<div x-show="showAllergenes">
<div><a download="wochenplan.pdf" class="text-14px font-normal text-gray-400 hover:text-gray-800 transition" title="Wochenplan in Farbe herunterladen" target="_blank" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg?tx_speiseplan_pi1%5Baction%5D=buildPdfAllergenes&amp;tx_speiseplan_pi1%5Bcolored%5D=1&amp;tx_speiseplan_pi1%5Bcontroller%5D=Speiseplan&amp;tx_speiseplan_pi1%5Bort%5D=651&amp;tx_speiseplan_pi1%5BweekToShow%5D=0&amp;type=99&amp;cHash=7c539b1c31d6b93b543462999b085763"><span class="text-light-green font-bold mb-0">PDF:</span> Wochenplan farbig</a></div>
<div><a download="wochenplan.pdf" class="text-14px font-normal text-gray-400 hover:text-gray-800 transition" title="Wochenplan in schwarz-weiß herunterladen" target="_blank" href="/essen/mensen-cafes-speiseplaene/mensa-offenburg?tx_speiseplan_pi1%5Baction%5D=buildPdfAllergenes&amp;tx_speiseplan_pi1%5Bcolored%5D=0&amp;tx_speiseplan_pi1%5Bcontroller%5D=Speiseplan&amp;tx_speiseplan_pi1%5Bort%5D=651&amp;tx_speiseplan_pi1%5BweekToShow%5D=0&amp;type=99&amp;cHash=2a1fe9f6c8219a614bef9505de86fc99"><span class="text-light-green font-bold mb-0">PDF:</span> Wochenplan s/w</a></div>
</div>
</div>
<div class="col-span-1 md:col-span-2">
<div class="mb-10px"><small class="font-bold text-gray-400">Kennzeichnungen/Zusatzstoffe</small></div>
<div class="mb-20px">
<small class="font-normal text-gray-400 mb-20px">
<span class="font-bold text-light-green">nF:</span> aus nachhaltigem Fischfang,
<span class="font-bold text-light-green">o:</span> Hauptzutat der bio-gekennzeich. Komponente ist bio,
<span class="font-bold text-light-green">ri:</span> mit Rindfleisch,
<span class="font-bold text-light-green">sch:</span> mit Schwein,
<span class="font-bold text-light-green">4:</span> mit Farbstoff,
<span class="font-bold text-light-green">5:</span> mit Antioxidationsmittel,
</small>
</div>
<div class="mb-10px">
<small class="font-bold text-gray-400 cursor-pointer hover:text-gray-800" x-show="!showAllergenes" @click="showAllergenesModal = true">Allergiehinweise anzeigen</small>
<small class="font-bold text-gray-400 cursor-pointer hover:text-gray-800" x-show="showAllergenes" @click="showAllergenes = false">Allergiehinweise verbergen</small>
</div>
<div x-show="showAllergenes">
<div class="mb-10px"><small class="font-bold text-gray-400">Allergene</small></div>
<small class="font-normal text-gray-400">
<span class="font-bold text-light-green">Ei:</span> Eier,
<span class="font-bold text-light-green">Fi:</span> Fisch,
<span class="font-bold text-light-green">Gl:</span> GLUTENHALTIGES Getreide,
<span class="font-bold text-light-green">GlG:</span> Gerste,
<span class="font-bold text-light-green">GlH:</span> Hafer,
<span class="font-bold text-light-green">GlW:</span> Weizen,
<span class="font-bold text-light-green">ML:</span> Milch /-erzeugnisse,
<span class="font-bold text-light-green">NH:</span> Haselnuss,
<span class="font-bold text-light-green">NM:</span> Mandel,
<span class="font-bold text-light-green">Nu:</span> SCHALENFRÜCHTE/Nüsse,
<span class="font-bold text-light-green">Se:</span> Sellerie,
<span class="font-bold text-light-green">Sf:</span> Schwefeldioxid/Sulfite,
<span class="font-bold text-light-green">Sn:</span> Senf,
<span class="font-bold text-light-green">So:</span> Soja,
</small>
</div>
</div>
</div>
<div x-show="showAllergenesModal" x-transition:enter="ease-out duration-300" x-transition:enter-start="opacity-0" x-transition:enter-end="opacity-100" x-transition:leave="ease-in duration-200"
x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0" x-description="Background backdrop, show/hide based on modal state." class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity">
<div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
<div class="fixed inset-0 z-10 overflow-y-auto">
<div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
<div x-show="showAllergenesModal" x-transition:enter="ease-out duration-300" x-transition:enter-start="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" x-transition:enter-end="opacity-100 translate-y-0 sm:scale-100"
x-transition:leave="ease-in duration-200" x-transition:leave-start="opacity-100 translate-y-0 sm:scale-100" x-transition:leave-end="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
class="relative transform overflow-hidden bg-white px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-modal-lg sm:p-6" @click.away="showAllergenesModal = false">
<div>
<div class="mx-auto flex h-12 w-12 items-center justify-center rounded-full bg-lighter-cyan">
<!-- Heroicon name: outline/check -->
<svg class="h-6 w-6 text-green-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
</svg>
</div>
<div class="mt-3 text-center sm:mt-5">
<h3 class="text-24px text-primary-cyan" id="modal-title">Allergikerspeiseplan</h3>
<div class="text-left">
<p>Die Angaben über die Inhaltsstoffe der Speisen beruhen auf Rezepturen, einzelnen Zutaten und den Informationen, die wir von den Herstellern und Lieferanten der einzelnen Speisezutaten erhalten. Da die Hersteller selten nur ein Produkt herstellen und vertreiben, kann nie ganz ausgeschlossen werden, dass auch Anteile von nicht aufgeführten Inhaltsstoffen in den Produkten enthalten sind.</p>
<p>Des Weiteren bringt es die handwerkliche Verarbeitung und Behandlung von Lebensmitteln in Großküchen mit sich, dass bei der Zusammenführung der verschiedenen Speisekomponenten eine ungewollte Vermischung auftreten kann und damit verbunden, der Übergang geringer Mengen von weiteren Stoffen, die Allergien und Unverträglichkeiten auslösen können. Diese Spuren sind in der Kennzeichnung nicht berücksichtigt.</p>
<p>Aus diesem Grund müssen Allergiker/innen beachten, dass in den angebotenen Speisen neben den gekennzeichneten noch weitere allergieauslösende Inhaltsstoffe enthalten sein können. Das Studierendenwerk Freiburg schließt daher jegliche Haftung aufgrund von nicht rezeptürlichen Bestandteilen der Speisen aus. </p>
<p>Bitte beachten Sie beim Wochenplan: Die Allergenkennzeichnung kann sich bis zum Ausgabetag ändern, Richtigkeit wird nur im aktuellen Tagesplan gewährleistet.</p>
</div>
</div>
</div>
<div class="mt-5 sm:mt-6 flex justify-between">
<button type="button" class="font-normal px-20px py-10px text-17px text-left text-primary-cyan bg-lighter-cyan focus:ring-4 focus:ring-gray-200 hover:bg-light-cyan transition" data-dismiss="modal" @click="showAllergenesModal = false">Abbrechen</button>
<button type="button" class="font-normal px-20px py-10px text-17px text-left text-white bg-primary-cyan focus:ring-4 focus:ring-gray-200 hover:bg-light-cyan transition" @click="showAllergenesModal = false, showAllergenes = true">Ich habe die Nutzungsbedingungen verstanden und möchte den Allergikerspeiseplan sehen.</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="c139" class="frame frame-default frame-type-textmedia frame-layout-0">
<header>
<h2 class="">
Weitere Infos zur Mensa Offenburg
</h2>
</header>
<div class="ce-textpic ce-center ce-above">
<div class="ce-bodytext">
<p>Direkt auf dem Campus der Hochschule befindet sich die Mensa, sie ist barrierefrei ausgestattet und verfügt über eine Terrasse. Hier kannst du in den warmen Sonnentagen dein Essen oder deinen Kaffee genießen. In der Mensa gibt es täglich zwei frisch zubereitende Menüs, eins davon ist vegetarisch oder vegan. Zusätzliches gibt es noch einen Freeflow-Bereich. Hier kannst du zwischen asiatischem Essen aus dem WOK, einer Grilltheke oder aus der Salatbar frei wählen und deinen Wunschteller selbst zusammenstellen.</p>
<p>Der Servicepoint befindet sich im Gebäude B. Hier kannst du dich bei Fragen oder Anliegen rund um die UniCard melden. Bei Fragen oder Anliegen rund um die Cafeteria und Mensa steht dir das Personal gerne zur Verfügung.</p>
<p>Kostenloses WLAN steht zur freien Verfügung.&nbsp;</p>
</div>
</div>
</div>
<div id="c141" class="frame frame-default frame-type-textmedia frame-layout-0">
<header>
<h2 class="">
Cafeteria Offenburg
</h2>
</header>
<div class="ce-textpic ce-center ce-above">
<div class="ce-bodytext">
<p>Im gleichen Gebäude, direkt nebenan, befindet sich die Cafeteria. Hier hast du eine große Auswahl an frisch belegten Brötchen, Laugengebäck, verschiedene Plunder, leckere Muffins, Donuts, frische Kuchenschnitte und warme Snacks. In unserem Sortiment gibt es auch viele vegetarische und vegane Produkte. Süßigkeiten und Eiscreme sowie natürlich auch eine große Auswahl an warmen und kalten Getränken hat die Cafeteria zu bieten. Auch im Café findest du viele BIO- oder Fairtrade-Produkte.</p>
<p>Der Cafeteria-Raum mit Kaffee-, Snack- und Getränke-Automaten ist bis 21:00 Uhr für dich geöffnet.</p>
</div>
</div>
</div>
<div id="c140" class="frame frame-default frame-type-textmedia frame-layout-0">
<header>
<h2 class="">
Infos zur Barrierefreiheit
</h2>
</header>
<div class="ce-textpic ce-center ce-above">
<div class="ce-bodytext">
<ul> <li>Aufzug</li> <li>Transporthilfe für Tabletts</li> <li>Barrierefreie Toilette im EG</li> </ul>
</div>
</div>
</div>
<div id="c5366" class="frame frame-default frame-type-textmedia frame-layout-0">
<header>
<h2 class="">
Eindrücke aus der Mensa
</h2>
</header>
<div class="ce-textpic ce-center ce-above">
<div class="ce-gallery" data-ce-columns="1" data-ce-images="1">
<div class="ce-outer">
<div class="ce-inner">
<div class="ce-row">
<div class="ce-column">
<figure class="image">
<img class="image-embed-item" alt="Innenraum der Mensa mit Tischen und Stühlen" src="/fileadmin/_processed_/e/0/csm_Mensa_Offenburg_Neubau__1__453ec12a73.jpg" width="600" height="338" loading="lazy" />
</figure>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<aside class="section__right sidebar px-30px lg:px-0 col-span-2 lg:col-span-1">
<div class="bg-lighter-green p-25px lg:p-30px mb-30px">
<div class="flex flex-col items-center">
<img class="w-40px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/sidebar_map.svg" width="384" height="512" alt="" />
<h3 class="mb-20px">Anschrift</h3>
</div>
<div>
<div id="c4981" class="frame frame-default frame-type-textmedia frame-layout-0">
<div class="ce-textpic ce-center ce-above">
<div class="ce-bodytext">
<p class="text-center"><strong>Mensa Offenburg</strong><br> Badstraße 24<br> 77652 Offenburg</p>
</div>
</div>
</div>
</div>
</div>
<div class="bg-lighter-green p-25px lg:p-30px mb-30px">
<div class="flex flex-col items-center">
<img class="w-40px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/sidebar_clock.svg" width="60" height="60" alt="" />
<h3 class="mb-20px">Öffnungszeiten</h3>
</div>
<div>
<div id="accordion-collapse-4985" class="mb-40px" data-accordion="collapse" data-active-classes="bg-colored-light" data-inactive-classes="bg-colored text-white">
<h4 id="accordion-collapse-heading-4985-1">
<button type="button" class="flex items-center justify-between w-full font-normal px-20px py-10px text-17px text-left text-white focus:ring-4 focus:ring-gray-200 transition bg-colored hover:bg-colored-light" data-accordion-target="#accordion-collapse-body-4985-1" aria-expanded="false" aria-controls="accordion-collapse-body-4985-1">
<span>Mensa</span>
<svg data-accordion-icon class="w-6 h-6 shrink-0" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
</button>
</h4>
<div id="accordion-collapse-body-4985-1" class="hidden mb-10px" aria-labelledby="accordion-collapse-heading-4985-1">
<div class="p-5 bg-colored-lighter">
<p><strong>Montag - Freitag</strong><br> 11.00 ­14:00 Uhr</p>
</div>
</div>
<h4 id="accordion-collapse-heading-4985-2">
<button type="button" class="flex items-center justify-between w-full font-normal px-20px py-10px text-17px text-left text-white focus:ring-4 focus:ring-gray-200 transition bg-colored hover:bg-colored-light" data-accordion-target="#accordion-collapse-body-4985-2" aria-expanded="false" aria-controls="accordion-collapse-body-4985-2">
<span>Cafeteria</span>
<svg data-accordion-icon class="w-6 h-6 shrink-0" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
</button>
</h4>
<div id="accordion-collapse-body-4985-2" class="hidden mb-10px" aria-labelledby="accordion-collapse-heading-4985-2">
<div class="p-5 bg-colored-lighter">
<p><strong>Montag - Donnerstag</strong><br> 7.30 15:30 Uhr, Fr 7.30 14:30 Uhr</p>
</div>
</div>
<h4 id="accordion-collapse-heading-4985-3">
<button type="button" class="flex items-center justify-between w-full font-normal px-20px py-10px text-17px text-left text-white focus:ring-4 focus:ring-gray-200 transition bg-colored hover:bg-colored-light" data-accordion-target="#accordion-collapse-body-4985-3" aria-expanded="false" aria-controls="accordion-collapse-body-4985-3">
<span>Ferienzeit</span>
<svg data-accordion-icon class="w-6 h-6 shrink-0" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
</button>
</h4>
<div id="accordion-collapse-body-4985-3" class="hidden mb-10px" aria-labelledby="accordion-collapse-heading-4985-3">
<div class="p-5 bg-colored-lighter">
<p>Eine aktuelle Übersicht der Ferienzeiten gibt es&nbsp;<a href="/essen/mensen-cafes-speiseplaene/ferienzeiten">hier.</a></p>
</div>
</div>
</div>
</div>
</div>
<div id="c5422" class="frame frame-default frame-type-shortcut frame-layout-0">
<div class="bg-lighter-green p-25px lg:p-30px mb-30px">
<div class="flex flex-col items-center">
<img class="w-40px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/sidebar_info.svg" width="192" height="512" alt="" />
<h3 class="mb-20px">Weitere Informationen</h3>
</div>
<div>
<div id="c3437" class="frame frame-default frame-type-textmedia frame-layout-0">
<div class="ce-textpic ce-center ce-above">
<div class="ce-bodytext">
<p><strong>Bezahle EINFACH - SICHER - SCHNELL mit deiner Hochschulkarte</strong></p><ul> <li><a href="/essen/chipkarte/autoload">Autoload</a></li> <li><a href="/kaservice">Kartenservice</a></li> </ul><p><strong>Hygienehinweise</strong></p>
<p>Bitte beachten Sie die geltenden Hygiene- und Corona-Regeln vor Ort.&nbsp;</p>
<p><strong>Nachhaltigkeit</strong></p><ul> <li><a href="/essen/einblicke/nachhaltigkeit">Nachhaltigkeit und Bio-Zertifizierung</a></li> </ul><p><strong>Feedback</strong></p><ul> <li><a href="/essen/mensen-cafes-speiseplaene/anregung-und-kritik">Anregungen und Kritik zu unseren Mensen</a></li> </ul><p><strong>Kinder in der Mensa</strong></p><ul> <li><a href="/essen/einblicke/kinder-in-der-mensa">Für Unter-10-jährige Kinder von Studierenden gibt es einen kostenfreien Kinderteller</a></li> </ul>
</div>
</div>
</div>
</div>
</div>
</div>
</aside>
</div>
</main>
<footer class="footer bg-primary-green py-30px md:py-70px color-lightgreen mt-60px">
<div class="container px-35px xl:px-0 xl:mx-auto">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-30px text-white relative">
<div class="col-span-1">
<div class="mb-50px">
<h3 class="">Kontakt</h3>
<div class="text-16px leading-30px font-normal">
<p class=""><strong>Studierendenwerk Freiburg A. d. ö. R.</strong></p>
<p class="mb-40px">Basler Straße 2<br> 79100 Freiburg</p>
<p class="mb-10px"><strong>Telefon:</strong> +49 (761) 2101-200</p>
<p class="mb-10px"><strong>Telefax:</strong> +49 (761) 2101-303</p>
<p class="mb-10px"><strong>E-Mail:</strong> info@swfr.de</p>
</div>
</div>
<div class="mb-50px md:mb-0">
<div id="c5480" class="frame frame-default frame-type-textmedia frame-layout-0">
<div class="ce-textpic ce-center ce-above">
<div class="ce-bodytext">
<h3>Über das SWFR</h3>
<p><a href="/ueber-das-swfr">Auf der folgenden Seite findest du mehr zu uns und unserer Organisationsstruktur.&nbsp;</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="col-span-1">
<div class="mb-50px">
<h3 class="">Impressum und Datenschutz</h3>
<nav class="mb-50px">
<ul>
<li><a class="arrow-right mb-3px" href="/impressum">Impressum</a></li>
<li><a class="arrow-right mb-3px" href="/datenschutzerklaerung">Datenschutzerklärung</a></li>
</ul>
</nav>
<h3 class="">Barrierefreiheit</h3>
<nav class="mb-50px">
<ul>
<li><a class="arrow-right mb-3px" href="/erklaerung-zur-barrierefreiheit">Erklärung zur Barrierefreiheit</a></li>
<li><a class="arrow-right mb-3px" href="/leichte-sprache">Leichte Sprache</a></li>
<li><a class="arrow-right mb-3px" href="/gebaerdensprache">Gebärdensprache</a></li>
</ul>
</nav>
</div>
</div>
<div class="col-span-1">
<div class="mb-50px">
<h3 class="">Social Media</h3>
<div class="flex lg:flex-wrap xl:flex-nowrap lg:pr-30px mb-30px">
<a target="_blank" href="https://www.instagram.com/studierendenwerk_freiburg/">
<img class="w-30px mr-20px mb-10px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/instagram-brand_white.svg" width="448" height="512" alt="" />
</a>
<a target="_blank" href="https://www.facebook.com/studierendenwerk.freiburg">
<img class="w-30px mr-20px mb-10px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/facebook-brand_white.svg" width="512" height="512" alt="" />
</a>
<a target="_blank" href="https://twitter.com/studentenwerkfr">
<img class="w-30px mr-20px mb-10px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/twitter-brand_white.svg" width="512" height="512" alt="" />
</a>
<a target="_blank" href="https://studierendenwerkfreiburg.wordpress.com/">
<img class="w-30px mr-20px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/wordpress-brand_white.svg" width="512" height="512" alt="" />
</a>
<a target="_blank" href="https://www.youtube.com/KanalSWFR">
<img class="w-40px" src="/typo3conf/ext/swfr_theme/Resources/Public/Images/Icons/youtube-brand_white.svg" width="576" height="512" alt="" />
</a>
</div>
</div>
<div class="mb-50px md:mb-0">
<h3 class="">Jobs/Karriere beim SWFR</h3>
<nav class="mb-50px">
<ul>
<li><a class="arrow-right mb-3px" href="https://www.jobs-studentenwerke.de/studierendenwerk-freiburg-schwarzwald">Stellenangebote</a></li>
<li><a class="arrow-right mb-3px" href="/datenschutz-fuer-bewerberinnen">Datenschutz für Bewerber:innen</a></li>
</ul>
</nav>
<h3 class="">Weiterführendes</h3>
<nav class="mb-50px">
<ul>
<li><a class="arrow-right mb-3px" href="/kommunikation">Kommunikation</a></li>
<li><a class="arrow-right mb-3px" href="/oeffentliche-auftraege-und-laufende-ausschreibungen">Öffentliche Aufträge/Laufende Ausschreibungen</a></li>
<li><a class="arrow-right mb-3px" href="/sitemap">Sitemap</a></li>
</ul>
</nav>
</div>
</div>
<div class="order-5 lg:oder-4 md:absolute left-0 bottom-0 md:w-6/12 lg:w-full">
<p class="text-16px leading-30px font-normal text-[#DFFA77] word-break mb-0 md:pr-20px lg:pr-0">© Studierendenwerk Freiburg A. d. ö. R., 2022. Alle Rechte vorbehalten.</p>
</div>
<div class="col-span-1 lg:row-start-1 lg:col-start-4 order-4 lg:order-5">
<div class="mb-50px md:mb-0">
<h3 class="">Dran bleiben!</h3>
<p class="text-16px leading-30px font-normal mb-20px">Melde dich ganz unverbindlich zu unserem Newsletter an und bleibe immer auf dem Laufenden.</p>
<form class="">
<div class="flex flex-col mb-20px">
<div class="mb-10px">
<label for="vorname" class="sr-only">Vorname</label>
<input type="text" name="vorname" id="vorname" class="block w-full text-14px text-gray-400 leading-19px" placeholder="Vorname *">
</div>
<div class="mb-10px">
<label for="nachname" class="sr-only">Nachname</label>
<input type="text" name="nachname" id="nachname" class="block w-full text-14px text-gray-400 leading-19px" placeholder="Nachname *">
</div>
<div class="mb-10px">
<label for="email" class="sr-only">Email</label>
<input type="text" name="email" id="email" class="block w-full text-14px text-gray-400 leading-19px" placeholder="E-Mail *">
</div>
</div>
<p class="text-16px leading-30px font-normal mb-20px">Bitte klicke alle Newsletter an, die du neu und / oder auch weiterhin erhalten möchtest.</p>
<div class="mb-30px">
<div class="flex checkbox-container mb-10px">
<input type="checkbox" id="ft-studierendenwerk" class="mr-20px mb-5px mt-2px">
<label for="ft-studierendenwerk"><small><strong>Studierendenwerk</strong></small></label>
</div>
<div class="flex checkbox-container mb-10px">
<input type="checkbox" id="ft-club" class="mr-20px mb-5px mt-2px">
<label for="ft-club"><small><strong>Internationaler Club</strong></small></label>
</div>
<div class="flex mb-30px checkbox-container">
<input id="ft-datenschutzerklaerung" type="checkbox" class="mr-20px mb-30px mt-2px">
<label for="ft-datenschutzerklaerung" ><small>Ich habe die Datenschutz&shy;erklärung gelesen und bin damit einverstanden.*</small></label>
</div>
</div>
<div class="bg-white py-20px flex justify-center cursor-pointer">
<input type="submit" value="Anmelden" class="text-[#7E9F00] font-bold text-18px leading-22px">
</div>
</form>
</div>
</div>
</div>
</div>
</footer>
<script src="/typo3conf/ext/swfr_theme/Resources/Public/JavaScript/Src/alpine.min.js?1671460959"></script>
<script src="/typo3conf/ext/swfr_theme/Resources/Public/JavaScript/Src/es6-shim.min.js?1671460959"></script>
<script src="/typo3conf/ext/swfr_theme/Resources/Public/JavaScript/Src/FormValidation.full.min.js?1671460959"></script>
<script src="/typo3conf/ext/swfr_theme/Resources/Public/JavaScript/Dist/scripts.js?1671460959"></script>
<script src="/typo3conf/ext/swfr_theme/Resources/Public/JavaScript/Dist/flowbite.js?1671460959"></script>
<script src="/typo3conf/ext/swfr_theme/Resources/Public/JavaScript/Dist/flatpickr.js?1671460958"></script>
<script src="/typo3conf/ext/swfr_theme/Resources/Public/JavaScript/Dist/swiper.min.js?1671460959"></script>
<script src="/typo3conf/ext/speiseplan/Resources/Public/Scripts/speiseplan.js?1670516554"></script>
<script src="/typo3conf/ext/femanager/Resources/Public/JavaScript/Validation.min.js?1670504806"></script>
<script src="/typo3conf/ext/femanager/Resources/Public/JavaScript/Femanager.min.js?1670504806"></script>
<script src="/typo3conf/ext/serviceportal/Resources/Public/Scripts/serviceportal.js?1671183670"></script>
<script src="/typo3conf/ext/serviceportal/Resources/Public/Scripts/serviceportal.validation.js?1671183670"></script>
<script src="/typo3conf/ext/veranstaltungskalender/Resources/Public/Scripts/veranstaltungskalender.js?1671460936"></script>
<script src="/typo3conf/ext/powermail/Resources/Public/JavaScript/Powermail/Form.min.js?1670489583" defer="defer"></script>
</body>
</html>