@media only all and (max-width: 700px) {

  /* for 700px or less */


body {
-ms-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
  }


.frame-outer {
margin: 0;
width: 100%;
border: none;
box-shadow: none;
  }


h1 {
font-size: 1.35rem;
  }


h1 span {

  }


h2 {
font-size: 1rem;
  }


h3 {
font-size: 1.25rem;
  }


h3 br {
display: none;
  }


h4 {

  }


#logo {
padding: 0.8rem 5%;
  }


#logo img {
width: 100px;
  }


/* Header mobil: erst das Video, darunter der Titel (blauer Block) */
#header {
height: auto;
display: flex;
display: -webkit-flex;
flex-direction: column;
-webkit-flex-direction: column;
  }


.header-tint,
.header-schraege {
display: none;
  }


.header-title {
position: relative;
top: auto;
left: auto;
width: 100%;
padding: 2.2rem 5% 2.2rem 5%;
background-color: #213f73;
z-index: 3;
-webkit-order: 2;
order: 2;
-webkit-transform: none;
transform: none;
-webkit-animation: none;
animation: none;
  }


/* Video über dem Titel, schwarze Ränder werden weiter abgeschnitten */
#video {
position: relative;
top: auto;
left: auto;
height: 220px;
z-index: 1;
-webkit-order: 1;
order: 1;
-webkit-transform: scale(1.3);
transform: scale(1.3);
  }


.header-title h2 {
margin: 0.5rem 0 1rem 0;
  }


.button-gold a,
.button-gold a:link,
.button-gold a:visited {
font-size: 0.8rem;
padding: 0.55rem 1.4rem;
  }


.content {
padding: 2rem 5%;
  }


.intro {
padding: 1.5rem 6%;
  }


.karte {
margin-top: 3rem;
padding: 2.6rem 6% 1.5rem 6%;
  }


.karte-label {
padding: 0.65rem 1.6rem;
  }


.karte-label h3 {
font-size: 1.1rem;
  }


ul.spalten {
-webkit-column-count: 1;
column-count: 1;
  }


ul.benefits li {
width: 100%;
  }


#footer {
padding: 2rem 5% 1.5rem 5%;
  }


.kontakt .left,
.kontakt .right {
width: 100%;
  }


.kontakt-text {
padding: 1.5rem 6%;
  }


.kontakt-bild {
min-height: 180px;
  }


.footer-bottom {
display: block;
text-align: center;
  }


.footer-logo {
margin: 0 auto 1rem auto;
padding: 0;
border: 0;
  }


.box-left {
width: 100%;
margin-bottom: 1rem;
float: none;
  }


.box-right {
width: 100%;
float: none;
  }


.flex {
display: block;
  }


.left,
.right {
width: 100%;
  }


.left {
margin-bottom: 1rem;
  }


.kontakt .left {
margin-bottom: 0;
  }


.hide {
display: block;
  }


.hide_m {
display: none;
  }


}
.refnr {}

.apply {}