* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-decoration: none;
  color: #e22a06;
  background-color: #eeeeee;
}

@font-face {
  src: url(./general/SangBleuSunrise-MediumItalic.otf);
  font-family: test
}

h1 {
  text-transform: uppercase;
  font-family: 'test', 'Josefin Sans', serif;
  font-weight: 400;
  font-style: italic;
  font-size: 6rem;
  line-height: 1;
}

h3 {
  text-transform: uppercase;
  font-family: serif;
  font-weight: 200;
  font-style: italic;
  font-size: 2rem;
  line-height: 0.58;
}

p {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  font-size: 1rem;
}

.line {
  height: 0.2rem;
  margin: auto;
  background: #e22a06;
}

.space {
  height: 2rem;
}

html {
  font-size: 1.1vw;
}

.gridbox {
  height: 100vh;
  width: 100vw;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 66.66666vh 1fr;
      grid-template-columns: 66.66666vh 1fr;
      -ms-grid-rows: auto auto 10rem;
      grid-template-rows: auto auto 10rem;
      grid-template-areas: "bild inhalt" "bild inhalt" "bild footer";
}

.bild {
  position: fixed;
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  grid-area: bild;
  height: 100%;
}

img {
  height: 100%;
}

.presse {
  width: 100%;
  max-width: 720px;
  padding: 2vw;
}

main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.inhalt {
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  -ms-grid-column: 2;
  grid-area: inhalt;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: auto 1fr;
      grid-template-rows: auto 1fr;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  width: 100%;
}

.links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: -2rem;
  margin-top: 2rem;
  margin-left: 2%;
  margin-right: 2%;
}

.socials {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: serif;
  font-weight: 200;
  font-size: 2rem;
  font-style: italic;
  background: none;
  padding: 1rem 2.2rem;
  border-radius: 50%;
  border: 0.24rem solid #e22a06;
  margin: 0.5rem  0.5rem;
  
}

.socials:hover {
  background-color: #e22a06;
  color: #eeeeee;
  cursor: url("./general/feuer.png") 11 22, auto;
  text-decoration: none;
}

footer {
  -ms-grid-row: 3;
  -ms-grid-column: 2;
  grid-area: footer;
  -ms-flex-item-align: end;
      -ms-grid-row-align: end;
      align-self: end;
}

section {
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 2vw;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

a :hover {
  text-decoration: underline;
  cursor: url("./general/feuer.png") 11 22, auto;
}

.filler {
  background-color:#e22a06;
  display: block;
  height: 100rem;
}

@media screen and (max-width: 770px) {
  html {
    font-size: 1.5vw;
    overflow: scroll;
  }
  h3 {
    font-size: 3.1rem;
  }
  p {
    font-size: 2.3rem;
  }
  .gridbox {
    display: block;
  }
  .bild {
    position: relative;
    height: initial;
    padding-bottom: 2rem;
  }
  img {
    width: 100%;
    height: initial;
  }
  .presse {
    width: auto;
  }
  .links{
    margin-bottom: 2rem;
  }
  .socials {
    font-size: 2.5rem;
  }
  footer{
    padding-bottom: 3rem;
  }
}


@media screen and (max-width: 1149px) and (min-width: 771px) {
  h1 {
    font-size: 5.6rem;
  }
  .links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap-reverse;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: center;
    margin-bottom: -2rem;
    margin-top: 2rem;
    margin-left: 2%;
    margin-right: 2%;
  }
  .socials{
    margin: 1rem 2.5rem;
  }

}

@media screen and (min-width: 1510px) {
  html {
    font-size: 16.4px;
    overflow-y: scroll;
  }
  h1 {
    font-size: 7rem;
  }
  .inhalt {
    max-width: 1500px;
  }
}