/*  NAVIGATION  */

      nav {
        display: flex;
        justify-content: center;
        background-color: rgb(0, 0, 0);
        position: fixed;
        overflow: hidden;
        /* bottom: 0; */
        width: 100%;
        height: 8.5vh;
        /*
        box-shadow: 0px 0px 8px 5px rgb(0, 0, 0);*/
        z-index: 4;
      }
      
      nav li {
        list-style-type: none;
        margin-right: 0px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 20px;
        
      }
      
      nav li:last-of-type {
        margin-right: 50px;
      }
      
      
      
      nav a {
        color: rgb(28, 173, 137);
        text-decoration: none;
        padding: 10px;
        text-transform: uppercase;
        letter-spacing: 1px;   
      }
    
      nav li a {
        display: inline-box;
        color: rgb(255, 255, 255);
        text-align: left;
        
        /* padding: 14px 16px; */
        text-decoration: none;
        
        margin: 6;
        padding: 0;
      
      }

/*  HOVER NAVIGATION  */
      .glow-on-hover {
        width: 170px;
        height: 55px;
        border: none;
        outline: none;
        color: #fff;
        background: rgb(0, 0, 0);
        cursor: pointer;
        position: relative;
        top: 5px;
        z-index: 0;
        border-radius: 10px;
      }
      
      .glow-on-hover:before {
        content: '';
        background: linear-gradient(45deg, #fff6fd, #f0adf7, #96ffe8, #00ffd5, #00e1ff, #00ffd5, #c2acff, #ffebfb);
        position: absolute;
        top: -2px;
        left:-2px;
        background-size: 400%;
        z-index: -1;
        filter: blur(5px);
        width: calc(100% + 4px);
        height: calc(100% + 4px);
        animation: glowing 20s linear infinite;
        opacity: 0;
        transition: opacity .3s ease-in-out;
        border-radius: 10px;
      }
      
      .glow-on-hover:active {
        color: #000
      }
      
      .glow-on-hover:active:after {
        background: transparent;
      }
      
      .glow-on-hover:hover:before {
        opacity: 1;
      }
      
      .glow-on-hover:after {
        z-index: -1;
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgb(0, 0, 0);
        left: 0;
        top: 0;
        border-radius: 10px;
      }
      
      @keyframes glowing {
        0% { background-position: 0 0; }
        50% { background-position: 400% 0; }
        100% { background-position: 0 0; }
      }
      
/*  BACKGROUND */
    body {

      background-color: black;
    }
    
    .back {
      margin: 0px;
      top: -10vw;
      left: -0vw;
      padding: 0px;
      font-family: Arial, Helvetica, sans-serif;
      background-image: url(../img/backgrounds/alexander-andrews-eNoeWZkO7Zc-unsplash.jpg);
      background-image:no-repeat;
      background-size:1500px;
      width: 100vw;
      height: 100vw;
      background-color: black;
      position: fixed;
      animation-name: rotate;
    animation-duration: 500s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    }

  @keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
  }
  
    li{
    list-style: none;
    display: inline;
  }

    a {
    text-decoration: none;
    color: rgb(255, 255, 255);
    }

    
     

/*  PROCESS AUFLIESTUNG */

.box2 {
        
  padding:400px;
  font-size: 18px;
  font-family: monospace
}

      .day2 {
        position: fixed;
        left: 5vw;
        width: 5vw;
        top: 20vw;
        left: 30vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day1:hover {
      
      font-style: oblique;

  }
      .day1 {
        position: fixed;
        left: 5vw;
        width: 7vw;
        top: 10vw;
        left: 37vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day2:hover {
      
      font-style: oblique;
      }
      .day3 {
        position: fixed;
        
        width: 6vw;
        top: 15vw;
        left: 59vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day3:hover {
      
      font-style: oblique;
      }
      .day4 {
        position: fixed;
        
        width: 5vw;
        top: 19vw;
        left: 69vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      
      .day4:hover {
      
      font-style: oblique;
      }

      .day5 {
        position: fixed;
        
        width: 5vw;
        top: 12vw;
        left: 89vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day5:hover {
      
      font-style: oblique;
      }
      .day6 {
        position: fixed;
        width: 4vw;
        top: 22vw;
        left: 89vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day6:hover {
      
      font-style: oblique;
      }
      .day7 {
        position: fixed;
        width: 12vw;
        top: 15vw;
        left: 4vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }

      .day7:hover {
      
      font-style: oblique;
      }

      .day8 {
        position: fixed;
        width: 4vw;
        top: 30vw;
        left: 6vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day8:hover {
      
      font-style: oblique;
      }
      .day9 {
        position: fixed;
        width: 4vw;
        top: 23vw;
        left: 12vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      
      .day9:hover {
      
      font-style: oblique;
      }
      .day10 {
        position: fixed;
        width: 8vw;
        top: 35vw;
        left: 30vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      
      .day10:hover {
      
      font-style: oblique;
      }
      .day11 {
        position: fixed;
        width: 5vw;
        top: 37vw;
        left: 45vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      
      }
      .day11:hover {
      
      font-style: oblique;
      }
      .day12 {
        position: fixed;
        width: 5vw;
        top: 30vw;
        left: 65vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day12:hover {
      
      font-style: oblique;
      }
      .day13 {
        position: fixed;
        width: 6vw;
        top: 40vw;
        left: 55vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day13:hover {
      
      font-style: oblique;
      }
      .day14 {
        position: fixed;
        width: 7vw;
        top: 45vw;
        left: 75vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day14:hover {
      font-style: oblique;
      }
      .day15 {
        position: fixed;
        width: 9vw;
        top: 25vw;
        left: 49vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day15:hover {
      font-style: oblique;
      }

      .day16 {
        position: fixed;
        width: 6vw;
        top: 9vw;
        left: 73vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day16:hover {
      font-style: oblique;
      }

      .day17 {
        position: fixed;
        width: 7vw;
        top: 39vw;
        left: 19vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day18:hover {
      font-style: oblique;
      }


      .day18 {
        position: fixed;
        width: 5vw;
        top: 35vw;
        left: 89vw;
        border: 3px hidde;
        border-top: none;
        line-height: 250%;
        font-weight: 500;
        text-align: center;
      }
      .day17:hover {
      font-style: oblique;
      }





   
    





