/* FunnelDisplay Font */
@font-face {
  font-family: "FunnelDisplay";
  src: url("/fileadmin/fonts/best/FunnelDisplay-Regular.woff2") format("woff2"),
    url("/fileadmin/fonts/best/FunnelDisplay-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "FunnelDisplay";
  src: url("/fileadmin/fonts/best/FunnelDisplay-Light.woff2") format("woff2"),
    url("/fileadmin/fonts/best/FunnelDisplay-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "FunnelDisplay";
  src: url("/fileadmin/fonts/best/FunnelDisplay-Medium.woff2") format("woff2"),
    url("/fileadmin/fonts/best/FunnelDisplay-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "FunnelDisplay";
  src: url("/fileadmin/fonts/best/FunnelDisplay-SemiBold.woff2") format("woff2"),
    url("/fileadmin/fonts/best/FunnelDisplay-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "FunnelDisplay";
  src: url("/fileadmin/fonts/best/FunnelDisplay-Bold.woff2") format("woff2"),
    url("/fileadmin/fonts/best/FunnelDisplay-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "FunnelDisplay";
  src: url("/fileadmin/fonts/best/FunnelDisplay-ExtraBold.woff2") format("woff2"),
    url("/fileadmin/fonts/best/FunnelDisplay-ExtraBold.woff") format("woff");
  font-weight: 800;
  font-style: normal;
}

/* HostGrotesk Font */
@font-face {
  font-family: "HostGrotesk";
  src: url("/fileadmin/fonts/best/HostGrotesk-Regular.woff2") format("woff2"),
    url("/fileadmin/fonts/best/HostGrotesk-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "HostGrotesk";
  src: url("/fileadmin/fonts/best/HostGrotesk-Light.woff2") format("woff2"),
    url("/fileadmin/fonts/best/HostGrotesk-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "HostGrotesk";
  src: url("/fileadmin/fonts/best/HostGrotesk-LightItalic.woff2") format("woff2"),
    url("/fileadmin/fonts/best/HostGrotesk-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: "HostGrotesk";
  src: url("/fileadmin/fonts/best/HostGrotesk-Medium.woff2") format("woff2"),
    url("/fileadmin/fonts/best/HostGrotesk-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "HostGrotesk";
  src: url("/fileadmin/fonts/best/HostGrotesk-Bold.woff2") format("woff2"),
    url("/fileadmin/fonts/best/HostGrotesk-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "HostGrotesk";
  src: url("/fileadmin/fonts/best/HostGrotesk-BoldItalic.woff2") format("woff2"),
    url("/fileadmin/fonts/best/HostGrotesk-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: "HostGrotesk";
  src: url("/fileadmin/fonts/best/HostGrotesk-ExtraBold.woff2") format("woff2"),
    url("/fileadmin/fonts/best/HostGrotesk-ExtraBold.woff") format("woff");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "HostGrotesk";
  src: url("/fileadmin/fonts/best/HostGrotesk-ExtraBoldItalic.woff2") format("woff2"),
    url("/fileadmin/fonts/best/HostGrotesk-ExtraBoldItalic.woff") format("woff");
  font-weight: 800;
  font-style: italic;
}

/* Standard-Styles */
body {
  font-family: "HostGrotesk", sans-serif;
  font-weight: normal;
}

h1,
h2,
h3 {
  font-family: "FunnelDisplay", sans-serif;
  font-weight: bold;
}

em {
  font-family: "HostGrotesk";
  font-style: italic;
}

strong {
  font-family: "HostGrotesk";
  font-weight: bold;
}

/*
* {
  outline: 1px solid red;
}*/

:root {
  --besttuerkis: #00727d;
  --besttechgreen: #00ffff;
  --bestblack: black;
  --bestwhite: white;
}

body {
  max-width: 100vw;
}

.powermail_create {
  padding: 0 2.5rem;
}

.text-small {
  font-size: 1.2rem;
}

.text-big {
  font-size: 2rem;
  line-height: 1.1;
}

.text-huge {
  font-size: 3.5rem;
  line-height: 1.1;
}

@media (max-width: 570px) {
  .text-huge {
  font-size: 2.5rem;
  }
}

.jumbotron .container {
  padding-top: 30px;
}

.breadcrumb {
  display: none;
}

/* Formular Änderungen */

.powermail_fieldset {
  margin: 0;
  padding: 0;
}

.powermail_legend {
  font-size: 2.1rem;
  line-height: 1.1;
}

.powermail_create p {
  color: var(--bestwhite);
}

.powermail_fieldset {
  border: none !important;
}

.tx-powermail .powermail_fieldset .powermail_field_error,
.tx-powermail .powermail_fieldset div.error {
  background-color: transparent;
  color: var(--bestwhite);
}

.powermail_fieldwrap_type_submit {
  margin-bottom: -0.7rem;
}

.control-label {
  display: none;
}

.form-control {
  color: var(--bestwhite);
  background-color: transparent;
  border: 4px solid var(--besttechgreen);
  border-radius: 0px;
  font-size: 1.5rem;
}

.form-control::placeholder {
  color: var(--bestwhite);
}

.form-control:focus {
  color: var(--bestwhite);
  background-color: transparent;
  border: 4px solid var(--bestwhite);
  border-radius: 0px;
}

.powermail_fieldwrap_absenden .btn {
  background: transparent;
  text-transform: unset;
  border: none;
  font-size: 1.5rem;
  float: right;
}

.powermail_fieldwrap_absenden .btn:hover {
  background: transparent;
  transform: scale(1.1);
  border: none;
  color: var(--besttechgreen) !important;
}

h1 {
  font-size: 2.4rem;
}

h2 {
  font-size: 1.8rem;
}

h3 {
  font-size: 1.5rem;
}

h4 {
  font-size: 1.4rem;
}

h5 {
  font-size: 1rem;
}

h6 {
  font-size: 0.9rem;
}

/* p skalieren, aber weniger stark als Überschriften */
p {
  font-size: 1.2rem;
}

/*Header entfernen*/
.jumbotron::before,
#main-navbar {
  display: none;
}

/*Überschriften einfärben*/
#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content h6 {
  color: var(--bestblack) !important;
  font-weight: bold !important;
}

.muheader {
  box-shadow: unset;
}

/*blauer Hintergrund - deaktiviert Sofia 18.02.2026 (laut Marie's Ticket)
body {
  background-color: var(--besttechgreen);
}*/

@media (min-width: 460px) {
  .dreier-box-margin {
    margin-right: 20px;
  }
}

.best-box {
  flex: 1;
  background-color: var(--besttuerkis) !important;
  padding: 1rem;
  color: var(--besttechgreen);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 40px 100%, 0 calc(100% - 40px));
}

@media (max-width: 576px) {
  .best-anmeldung{
    padding-left: 0;
    padding-right: 0;
  }
}

@media (max-width: 576px) {
  .best-box{
    width: 90vw;
    word-break:break-word;
  }
}

.best-box .content {
  margin: 0;
  padding: 0;
}

.best-header {
  clip-path: polygon(0 0,
      100% 0,
      100% calc(100% - 40px),
      calc(100% - 40px) 100%,
      0 100%);
}

