@charset "UTF-8";
/* Das ist ein aus "main.scss" generiertes CSS-Dokument. SCSS oder SASS ist eine umfangreichere CSS-Erweiterungssprache. Dieses CSS sind aber die finalen Styles, was hier geändert wird, erscheint auf der Seite. Meldet euch am Besten bei Chris (c.dietz@hbksaar.de), wenn hieran etwas geändert werden soll :)  */
/* VARIABLEN */
/* GLOBAL CSS-RESET */
* {
  margin: 0;
  padding: 0; }

/* CSS */
body {
  font-family: "degular", Helvetica, Arial, sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 16px;
  color: #000;
  line-height: 1.8em;
  -webkit-hyphens: manual;
  -moz-hyphens: manual;
  -ms-hyphens: manual;
  -o-hyphens: manual;
  hyphens: manual; }

::selection {
  background: #000;
  color: #fff; }

h1, h2 {
  font-size: 1.5em;
  font-weight: 700;
  margin-bottom: .5em; }

h2 {
  -webkit-transition: ease-out .5s;
  -moz-transition: ease-out .5s;
  -o-transition: ease-out .5s;
  transition: ease-out .5s; }
  h2:hover {
    -webkit-transition: ease-out 1s;
    -moz-transition: ease-out 1s;
    -o-transition: ease-out 1s;
    transition: ease-out 1s; }

p, li {
  font-size: 1.5em;
  font-weight: 500;
  margin-bottom: .5em; }

p a {
  color: #000; }
  p a:hover {
    color: #fff;
    cursor: ne-resize; }

i {
  font-style: italic; }

b {
  font-weight: 700; }

main {
  margin-top: 3em; }
  main section {
    position: relative;
    z-index: 5; }
  main .text-box {
    position: absolute;
    top: 35%;
    z-index: 10;
    text-align: center; }
  main h2 {
    font-weight: normal;
    line-height: .875em;
    color: #fff;
    position: relative;
    z-index: 11;
    font-size: 3em; }

main, footer {
  margin-bottom: 3em; }

footer {
  margin-top: 3em;
  margin-bottom: 3em; }

footer a {
  color: #000; }

footer a:hover {
  color: #fff;
  cursor: ne-resize; }

nav {
  font-size: 1.1em;
  text-align: center;
  margin-top: 5em; }

li {
  list-style-type: none; }

li.left {
  width: 10%; }

li.right {
  width: 60%; }

#type {
  margin-top: 3em;
  text-align: center; }
  #type img {
    transform: rotate(-4deg); }

#dance-floor-link h2 {
  transform: rotate(4deg); }

#dance-floor-link:hover h2 {
  transform: rotate(-12deg); }

#chill-floor-link h2 {
  transform: rotate(-12deg); }

#chill-floor-link:hover h2 {
  transform: rotate(-3deg); }

#chatroom-link h2 {
  transform: rotate(5deg); }

#chatroom-link:hover h2 {
  transform: rotate(-8deg); }

#info {
  margin-top: 8em; }

#about {
  margin-top: 8em; }

#paypal {
  text-align: center;
  color: #000;
  width: 180px;
  height: 180px;
  /* padding-top: 3.75em;
  font-size: 1em;
  line-height: 1.5em;
  background-image: url("../img/ui/Sommerfest2020_Circle-white.svg");
  background-repeat: no-repeat;
  background-size: 100%;
  animation: rotation 10s infinite ease; */
  z-index: 10; }

#paypal:hover {
  /* color: $white;
  background-image: url("../img/ui/Sommerfest2020_Circle.svg"); */
  cursor: ne-resize; }

/* @keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
} */
#schriftzug {
  text-align: center;
  width: 85%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5em;
  margin-bottom: 5em; }

#form {
  text-align: center;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1em; }

.indent {
  margin-left: 1.5em; }

.no-link-style {
  text-decoration: none; }

.arrow:after {
  background-size: .75em;
  background-repeat: no-repeat;
  background-position: bottom;
  background-image: url("../img/ui/sommerfest2020_arrow-nw.svg");
  width: 1em;
  height: 1em;
  display: inline-block;
  content: ""; }

.arrow.bold:after {
  background-image: url("../img/ui/sommerfest2020_arrow-nw_bold.svg") !important; }

.heart:after {
  background-size: 1em;
  background-repeat: no-repeat;
  background-position: bottom;
  background-image: url("../img/ui/sommerfest2020_heart.svg");
  margin-left: .3em;
  width: 1em;
  height: 1em;
  display: inline-block;
  content: ""; }
