/* COLORS */

:root {
      --lmh-red: #e50043;
      --lmh-hover: #a37f5d;
      --bs-border-radius-pill: 1rem;
}

/* FONTS */

@font-face {
	font-family: "Impact";
	src: url("fonts/impact.eot"); /* IE9 Compat Modes */
	src: url("fonts/impact.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ 
      url("fonts/impact.svg") format("svg"), /* Legacy iOS */ 
      url("fonts/impact.ttf") format("truetype"), /* Safari, Android, iOS */ 
      url("fonts/impact.woff") format("woff"), /* Modern Browsers */ 
      url("fonts/impact.woff2") format("woff2"); /* Modern Browsers */
	font-weight: normal;
	font-style: normal;
}
body {
      background-image: url(images/sackerl_bgrnd_bottom.jpg);
      background-position: center top;
      background-size: 1320px auto;
      background-color: var(--lmh-red);
      background-repeat: repeat-y;
}
@media (min-width: 576px) {
      body {
            background-size: 540px auto;
      }
}
@media (min-width: 768px) {
      body {
            background-size: 720px auto;
      }
}
@media (min-width: 992px){
      body {
            background-size: 960px auto;
      }
}
@media (min-width: 1200px) {
      body {
            background-size: 1140px auto;
      }
}
@media (min-width: 1400px) {
      body {
            background-size: 1320px auto;
      }
}

.topbgrnd {
      background-image: url(images/sackerl_bgrnd_top.jpg);
      background-position: center top;
      background-repeat: no-repeat;
      background-color: var(--lmh-red);
      display: block;
      max-width: 1320px;
      background-size: 1320px auto;
      margin-left: auto;
      margin-right: auto;
      height: 362px;
}

/* HEADLINES */

h1, h2, h3 {
      font-family: 'Impact', serif;
      line-height: 1em;
      text-transform: uppercase;  
}

h1 {
      font-size: 6.3em;
	color: var(--lmh-red);
}
h2 {
      font-size: 1.8em;
}
h3 {
      font-size: 5em;
      color: var(--lmh-red); 
}

h2 + p {
      min-height: 4.5em;
}

/* LINKS */

a:hover {
      --bs-link-color-rgb: var(--lmh-hover);
      opacity: .7;
}
a {
      color: var(--lmh-red);
      text-decoration: underline;
}
.reflinks {
      font-size: .8em;
      list-style: none;
      padding-left: 0px;
      overflow-wrap: break-word;
}

/* STOERER */

.stoerer {
      background-color: var(--lmh-red);
      color: #fff;
      border-radius: 50%;
      width: 17em;
      height: 17em;
      float: right;
      padding: 2.6em;
      text-align: center;
      rotate: 10deg;
      display: flex;
      align-items: center;
}
.stoerer a {
      font-family: 'Impact', serif;
      font-weight: 400!important;
      width: 14em;
      height: 10em;
      color: #fff;
      text-decoration: none;
      display: block;
      margin-left: auto;
      margin-right: auto;
}
.stoerer a:after {
      display: block;
      text-align: center;
      content: url(images/icn_cursor.svg);
}
.stoerer.small {
      width: 15em;
      height: 15em;     
}


/* BUTTONS */

.btn-primary {
      font-family: 'Impact', serif;
      text-transform: uppercase;
      letter-spacing: 0.05rem;
      --bs-btn-color: var(--lmh-red);
      --bs-btn-bg: #fff;
      --bs-btn-border-color: #fff;
      --bs-btn-hover-color: #fff;
      --bs-btn-hover-bg: var(--lmh-red);
      --bs-btn-hover-border-color:var(--lmh-red);
      --bs-btn-focus-shadow-rgb: 49,132,253;
      --bs-btn-active-color: #fff;
      --bs-btn-active-bg: var(--lmh-red);
      --bs-btn-active-border-color: var(--lmh-red);
      --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
      --bs-btn-disabled-color: #fff;
      --bs-btn-disabled-bg: var(--lmh-red);
      --bs-btn-disabled-border-color: var(--lmh-red);
      transition: width .5s ease-in;
}

.btn-primary:hover {
      /*
      width: 100%;
      transition: width .5s ease-in;
      */
}

.btn-secondary {
      font-size: .9em;
      text-transform: uppercase;
      letter-spacing: 0.05rem;
      --bs-btn-color: #000;
      --bs-btn-bg: transparent;
      --bs-btn-border-color: transparent;
      --bs-btn-hover-color: #fff;
      --bs-btn-hover-bg: transparent;
      --bs-btn-hover-border-color: transparent;
      --bs-btn-focus-shadow-rgb: 130,138,145;
      --bs-btn-active-color: #fff;
      --bs-btn-active-bg: #565e64;
      --bs-btn-active-border-color: #51585e;
      --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
      --bs-btn-disabled-color: #fff;
      --bs-btn-disabled-bg: #6c757d;
      --bs-btn-disabled-border-color: #6c757d;
}

.btn a {
      text-decoration: none;
}
.btn:hover a {
      color:#fff;
}

.modal-body .btn {
      border: 2px solid var(--lmh-red);
}

/* NEWSLETTER */
.newsletter {
      border: 4px solid var(--lmh-red);   
      border-radius: 25px;   
}
.newsletter h2 {
      color: var(--lmh-red);
}

/* FOOTER */
.footer {
      padding-top: 3em;
}

/* MISC */

li {padding-bottom: .5em;}

#lmh-sticker {
      font-size: 6em;
      height: 2em;
      rotate: -15deg;
}
.text-align-right {
      text-align: right;
}
.text-align-center {
      text-align: center;
}
.indent {
      padding-left: calc(16.66666667% - var(--bs-gutter-x));
      padding-right: calc(16.66666667% - var(--bs-gutter-x));
}

.modal-header {
      align-items: flex-start;
}

.modal-header.p-4 {
      padding-bottom: 1rem !important;
}

/* ANIM */
.col {
      --animate-delay: 1s;
}

/* ICONS */

.icn:before {
      display: block;
      text-align: center;
      max-width: 100%;
      padding-bottom: .5em;
}

.icn-leistbar:before {
      content: url(images/icn_leistbar.svg);
}
.icn-qualitaet:before {
      content: url(images/icn_qualitaet.svg);
}
.icn-nettobrutto:before {
      content: url(images/icn_nettobrutto.svg);
}
.icn-flaeche:before {
      content: url(images/icn_flaeche.svg);
}
.icn-spenden:before {
      content: url(images/icn_spenden.svg);
}
.icn-newsletter:before {
      content: url(images/icn_newsletter.svg);
}
.icn-pdf:before {
      display: inline-block;
      padding-bottom: .5em;
}
.icn-pdf:before {
      width: 1.5em;
      height: 1.5em;
      content: "";
      background: url("images/icn_pdf.svg") no-repeat 0 0;
      background-size: 100%;
      margin-right: .5em;
      vertical-align: middle;
}


/* BOOTSTRAP */

.modal {
      --bs-modal-width: 70%;
      --bs-modal-padding: 1rem;
      --bs-modal-bg: var(--bs-body-bg);
      --bs-modal-border-color: var(--bs-border-color-translucent);
      --bs-modal-border-width: var(--bs-border-width);
      --bs-modal-border-radius: var(--bs-border-radius-lg);
}
.bg-body-secondary {
      --bs-bg-opacity: .8;
      background-color: rgba(229,0,67,.3)!important;
}

/* FORM */

input {
      border-radius: 15px;
      border: 2px solid var(--lmh-red);
      padding: 5px;
      max-width: 100%;
}

/* COOKIE */

#cookiecontainer.hide {
	display: none;
}

#cookiecontainer:not(.show) {
  display: none;
}

/* RESPONSIVE */

@media (max-width: 575px) {
      /*
      body {
            hyphens: auto;
            -webkit-hyphens: auto;
            -ms-hyphens: auto;
            hyphenate-limit-chars: 8 4 4;
            hyphenate-limit-lines: 3;
            -webkit-hyphenate-limit-chars: 8 4 4;
            -webkit-hyphenate-limit-lines: 3;
            -ms-hyphenate-limit-chars: 8 4 4;
            -ms-hyphenate-limit-lines: 3;
      }
      */
      .topbgrnd {
            max-width: 575px;
            background-size: 575px auto;
            height: 157px;
      }
      #lmh-sticker {
            font-size: 4em;
            height: 2em;
            margin-left: -.3em;
      }

      h1 {
            font-size: 2.5em;
            hyphens: manual;
      }
      h3 {
            font-size: 2em!important;
      }
      h2 + p {
            min-height: auto!important;
      }
      .btn-primary {
            width: 100%;
      }
      .modal {
            --bs-modal-width: 100%;
      }
      .py-5 {
            padding-top: 2rem !important;
            padding-bottom: 2rem !important;
      }
      .indent {
            padding-left: 2rem;
            padding-right: 2rem;
      }
}

@media (min-width: 576px) {
      .topbgrnd {
            max-width: 540px;
            background-size: 540px auto;
            height: 148px;
      }
      h1 {
            font-size: 3em;
      }
      h2 {
            font-size: 1.3em;
            min-height: 6em;
      }
      h2 + p {
            min-height: 6em;
      }
      .p-4 {
            padding: 3rem !important;
      }
}
@media (min-width: 768px) {
      .topbgrnd {
            max-width: 720px;
            background-size: 720px auto;
            height: 197px;
      }
      h1,#lmh-sticker {
            font-size: 3.7em;
      }
      h2 {
            font-size: 1.3em;  
      }
      h3 {
            font-size: 5em;
      } 
      h2 + p {
            min-height: 6em;
      }
      .btn-primary {
            letter-spacing: 0rem;
      }
}
@media (min-width: 992px){
      .topbgrnd {
            max-width: 960px;
            background-size: 960px auto;
            height: 263px;
      }
      .indent {
            padding-left: 10em;
            padding-right: 10em;
      }
      h1,#lmh-sticker {
            font-size: 6.2em;
      }
      h2 {
            font-size: 1.7em;
            min-height: auto;
      }
      h3 {
            font-size: 5em;
      } 
      h2 + p {
            min-height: 8em;
      }
      .btn-primary {
            letter-spacing: 0.05rem;
      }
}
@media (min-width: 1200px) {
      .topbgrnd {
            max-width: 1140px;
            background-size: 1140px auto;
            height: 312px;
      }
      .indent {
            padding-left: 12em;
            padding-right: 12em;
      }
      h2 + p {
            min-height: 6em;
      }
}
@media (min-width: 1400px) {
      .topbgrnd {
            max-width: 1320px;
            background-size: 1320px auto;
            height: 362px;
      }
      .indent {
            padding-left: 12em;
            padding-right: 12em;
      }
      h1,#lmh-sticker {
            font-size: 6.7em;
      }
      h2 {
            font-size: 1.55em;
      }
      h3 {
            font-size: 5em;
      } 
      h2 + p {
            min-height: 4.5em;
      }
}