@charset "UTF-8";
/* Reset
-----------------------------------------------------------*/
article, aside, details, figcaption, figure, footer, header, hgroup, hr, menu, nav, section {
  display: block;
}

a, hr {
  padding: 0;
}

abbr, address, article, aside, audio, b, blockquote, body, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, em, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, p, pre, q, samp, section, small, span, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, ul, var, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  font-style: normal;
  vertical-align: baseline;
  background: 0 0;
  font-weight: normal;
  font-style: normal;
}

ins, mark {
  background-color: #ff9;
  color: #000;
}

body {
  line-height: 1;
}

ul, ol {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:after, blockquote:before, q:after, q:before {
  content: "";
  content: none;
}

a {
  margin: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: 0 0;
}

ins {
  text-decoration: none;
}

mark {
  font-style: italic;
  font-weight: 700;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

hr {
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
}

input, select {
  vertical-align: middle;
}

/* Schriften
-----------------------------------------------------------*/
@font-face {
  font-family: "DroidSerif";
  src: url("webfonts/DroidSerif-Regular-webfont.eot");
  src: url("webfonts/DroidSerif-Regular-webfont.eot?iefix") format("eot"), url("webfonts/DroidSerif-Regular-webfont.woff") format("woff");
}
/* oswald-700 - latin */
@font-face {
  font-display: swap;
  font-family: "Oswald";
  font-style: normal;
  font-weight: 700;
  src: url("webfonts/oswald-v49-latin-700.woff2") format("woff2");
}
/* roboto-300 - latin */
@font-face {
  font-display: swap;
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  src: url("webfonts/roboto-v30-latin-300.woff2") format("woff2");
}
/* roboto-500 - latin */
@font-face {
  font-display: swap;
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  src: url("webfonts/roboto-v30-latin-500.woff2") format("woff2");
}
/* Grundgerüst
-----------------------------------------------------------*/
html {
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 101%;
}

body {
  font-family: "Oswald", sans-serif;
  font-family: "DroidSerif", sans-serif;
  color: #000;
  font-size: 16px;
  font-size: 19px;
  overflow-x: hidden;
}

.content-wrapper {
  position: relative;
}

.main {
  position: relative;
}

.frame {
  margin: 0 auto;
  width: 94%;
  max-width: 1100px;
  position: relative;
  font-family: "Roboto", sans-serif;
  font-weight: 500;
}

.smallFrame {
  /* 	width: 100%; */
  max-width: 700px;
}

.frame.padding-bottom {
  padding-bottom: 4em;
}

.main {
  background: url(../img/dot.svg) repeat-x left bottom;
  background-size: 5px auto;
  padding-bottom: 2.5em;
}

/* Allgemeine Formatierungen
-----------------------------------------------------------*/
img {
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid #f7a430;
}

h1, h2, h3 {
  text-transform: uppercase;
  font-family: "Oswald", sans-serif;
  color: #f7a430;
  font-size: 2.5em;
  line-height: 1.1em;
  text-align: center;
  margin: 1em 0 0.5em 0;
}

h1 {
  /* 	margin-top: 1em; */
}

h2 span {
  display: block;
  text-transform: none;
}

h3 {
  font-size: 1.25em;
  text-align: left;
}

h4 {
  background: #f7a430;
  text-transform: uppercase;
  font-family: "Oswald", sans-serif;
  text-align: center;
  color: #fff;
  padding: 0.5em;
  margin: 2em 0;
}

p {
  line-height: 1.35em;
  padding-bottom: 1.35em;
  font-family: "Roboto", sans-serif;
  text-align: left;
}

p:last-child {
  padding-bottom: 0;
}

/* Struktur
-----------------------------------------------------------*/
.seetal, .luzern {
  position: relative;
  background-image: url(../img/home-seetal-2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.luzern {
  background-image: url(../img/home-luzern.jpg);
}

.seetal .frame, .luzern .frame {
  display: flex;
  justify-content: flex-end;
}

.logosammlung svg {
  height: 38vh;
  width: auto;
  display: block;
}

.seetal .logosammlung svg {
  padding: 4.5em 0 1.5em 0;
}

.luzern .logosammlung svg {
  padding: 1.5em 0 4.5em 0;
}

.home-text-wabe {
  z-index: 10;
  position: absolute;
  top: 50%;
  width: 40%;
  background-image: url(../img/home-text-bg.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-size: contain;
  background-size: 100% 100%;
  background-position: center center;
  transform: translateY(-50%);
  width: 30em;
  left: 15%;
  font-size: 0.95em;
  padding: 1em;
}

.home-text-wabe .content {
  padding: 0 4em;
}

.home-text-wabe .content h1 {
  font-family: "Oswald", sans-serif;
  font-size: 2.5em;
  line-height: 1.1em;
  text-align: center;
  margin: 0 0 0.2em 0;
}

.home-text-wabe .content p {
  font-family: "DroidSerif", sans-serif;
  text-align: center;
  font-size: 1.2em;
}

/* Spezifische Formatierungen
-----------------------------------------------------------*/
/* Header
-----------------------------------------------------------*/
.mainImg {
  position: relative;
}

.mainImg img {
  width: 100%;
  position: relative;
}

.logo {
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 31%;
  border: none;
}

.banner {
  text-align: center;
  max-width: 250px;
  width: 60%;
  margin: 4.5em auto;
}

#stoerer {
  position: absolute;
  top: -8em;
  left: -2%;
  width: 18%;
  border: none;
  -webkit-filter: drop-shadow(3px 4px 4px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(3px 4px 4px rgba(0, 0, 0, 0.4));
  -ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=4, OffY=4, Color='#444')";
  filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=4, OffY=4, Color='#444')";
}

/* Spezifische Formatierungen
-----------------------------------------------------------*/
.abstandUnten {
  margin-bottom: 1.35em;
}

.txt-small {
  font-size: 0.8em;
}

.red {
  color: #cb1d27;
}

/* Du bist
-----------------------------------------------------------*/
body.body-dubist h1,
body.body-dubist h2,
body.body-dubist h3 {
  color: #cb1d27;
}

.dubist {
  display: none;
  position: absolute;
  min-height: 110vh;
}

/* Punkte Navigation
-----------------------------------*/
.punkteNav li {
  display: inline-block;
  margin: 0 0.5em 0.5em 0;
}

.punkteNav a {
  background: #f7a430;
  background: #cb1d27;
  color: #f7a430;
  color: #fff;
  font-family: "Oswald", sans-serif;
  display: inline-block;
  padding: 0.5em 0.4em;
  border-radius: 6px;
  border: none;
}

/* Footer
-----------------------------------------------------------*/
.siteFooter {
  font-weight: 500;
  padding: 3em 0 3em 0;
  margin: 0 0 0 0;
  color: #fff;
  background: #f7a430;
}

.siteFooter h3 {
  color: #fff;
  margin: 0 0 1em 0;
}

.siteFooter p {
  font-weight: 500;
}

.siteFooter .flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  justify-content: stretch;
}

.siteFooter .flex-item {
  align-self: stretch;
  align-self: flex-end;
  flex: 1 1 auto;
  position: relative;
}

.flex-item:not(:last-child):after {
  content: "";
  display: block;
  height: 3.5rem;
  width: 1px;
  background: #fff;
  bottom: 0;
  right: 1.5em;
  position: absolute;
}

.siteFooter .logoLink {
  height: 2em;
  width: auto;
}

.partnerLink {
  font-family: "Oswald", sans-serif;
  text-transform: uppercase;
  font-size: 0.9em;
}

/* Formular
-----------------------------------------------------------*/
/* Main Navigation
-----------------------------------------------------------*/
.mainNav {
  text-align: center;
  padding: 1.25em 0;
}

.mainNav li {
  display: inline-block;
  margin: 0 0.5em;
  font-family: "Oswald", sans-serif;
  text-transform: uppercase;
  line-height: 1.75em;
  position: relative;
}

.mainNav li a {
  border-bottom: none;
}

.mainNav li span {
  cursor: pointer;
  display: block;
}

.mainNav ul ul {
  display: none;
  position: absolute;
  left: 0;
  z-index: 100;
  background: #f6f6f0;
  padding: 0.25em 0;
  border-top: 3px solid #f7a430;
}

.mainNav ul ul li {
  display: block;
  margin: 0 0 0 0;
  /* 	padding: 0 0.25em 0 0.25em; */
}

.mainNav li:hover > ul {
  display: block;
}

.mainNav ul ul li a {
  display: block;
  margin: 0 0;
  border-bottom: 2px solid #808080;
  white-space: nowrap;
  text-align: left;
  padding: 0.3em 0.75em 0.2em 0.75em;
  min-width: 175px;
}

.body-home .mainNav li#btn01,
.mainNav li a:hover {
  color: #f7a430;
  border-bottom: 3px solid #f7a430;
}

.body-nuenegg .mainNav li#btn04 span,
.body-ottenhusen .mainNav li#btn04 span,
.body-ballwil .mainNav li#btn04 span,
.body-nuenegg .mainNav li#btn08 a,
.body-ottenhusen .mainNav li#btn09 a,
.body-ballwil .mainNav li#btn10 a {
  color: #f7a430;
}

/*-----------------------------------------------------------------------------------
-------------------------------------------------------------------------------------
MediaQueries
-------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------*/
@media screen and (max-width: 1350px) {
  .home-text-wabe {
    left: 2em;
  }
} /* Ende 1200 */
@media screen and (max-width: 1200px) {
  body {
    font-size: 18px;
  }
} /* Ende 1200 */
@media screen and (max-width: 1000px) {
  body {
    font-size: 16px;
  }
  .logosammlung svg {
    margin-right: -2.5em;
  }
  .flex-item:not(:last-child):after {
    right: 1.5em;
  }
} /* Ende 1000 */
@media screen and (max-width: 830px) {
  .siteFooter .flex {
    display: block;
  }
  .siteFooter .flex-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    padding: 0 0 1em 0;
    margin: 0 0 1em 0;
  }
  .flex-item:not(:last-child):after {
    content: none;
  }
  .siteFooter .logoLink {
    height: 3em;
  }
} /* Ende 830 */
@media screen and (max-width: 910px) {
  .home-text-wabe {
    position: static;
    width: auto;
    transform: none;
    width: auto;
  }
  .home-text-wabe .content {
    padding: 1em 1em 2em 1em;
  }
  .seetal .frame, .luzern .frame {
    display: block;
  }
  .logosammlung svg {
    margin: 0 auto;
    height: auto;
    width: 90%;
  }
  /* Navigation
  -----------------------------------------------------------*/
  nav.mainNav {
    position: static;
    width: 100%;
    display: block;
    z-index: 100;
    background: #fff;
    width: 100%;
    text-align: right;
    padding: 0;
    min-height: 45px;
  }
  nav.mainNav > ul {
    display: none;
    /* 	display: block; */
    background: #fff;
    margin: 2.35em 0 0 0;
    padding-bottom: 1em;
    position: relative;
    width: 100%;
  }
  nav.mainNav ul li {
    float: none;
    display: block;
    margin: 0 1em;
    padding: 0.25em 0;
  }
  nav.mainNav ul ul {
    position: static;
    display: block;
  }
  .mainNav ul ul {
    background: transparent;
    padding: 0.25em 0;
    border-top: none;
  }
  .mainNav ul ul li {
    /*
    	display: block;
    	margin: 0 0 0 0;
    */
    /* 	padding: 0 0.25em 0 0.25em; */
  }
  /*
  .mainNav li:hover > ul {
  	display: block;
  }
  */
  .mainNav ul ul li a {
    /*
    	display: block;
    	margin: 0 0;
    */
    border-bottom: 1px solid #808080;
    /* 	white-space: nowrap; */
    text-align: right;
    padding: 0.3em 0em 0.2em 0.75em;
    min-width: 0;
  }
  nav.mainNav label {
    display: block;
    line-height: 45px;
    padding: 0 0 0 2em;
    position: absolute;
    top: 0;
    right: 1em;
    background: url(../img/navIcon.svg) no-repeat left center;
    background-size: 40% 40%;
  }
  nav.mainNav input[type=checkbox]:checked ~ ul {
    display: block;
    position: absolute;
    z-index: 10;
  }
  .mainNav li, input[type=submit], label {
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
  }
} /* Ende 910 */
@media screen and (max-width: 500px) {
  #stoerer {
    top: -6.5em;
    width: 24%;
  }
} /* Ende 500 */
/* Advanced Checkbox Hack Navigation
-----------------------------------------------------------*/
body {
  -webkit-animation: bugfix infinite 1s;
}

@-webkit-keyframes bugfix {
  from {
    padding: 0;
  }
  to {
    padding: 0;
  }
}
.mainNav input[type=checkbox] {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.mainNav label {
  display: none;
  cursor: pointer;
  user-select: none;
}

/* Clearfix
-----------------------------------------------------------*/
.group:after {
  content: "";
  display: table;
  clear: both;
}