@media only screen and (min-width: 600px) {
        video#backgroundmobile {
        display:none;
                preload: none;
      }
      video#background {
        display:flex;
        opacity:0.15;
                preload: auto;
      }
      }
      @media only screen and (max-width: 600px) {
        video#backgroundmobile {
        display:flex;
        opacity:0.45;
         preload: auto;
      }
      video#background {
        display:none;
                preload: none;
      }
      }

        #bugreport {
          padding-right:0px;
        }
  /*background*/
/*footer with social media, help it f#cks my brain*/

@media only screen and (max-width: 900px) {
  .right_footer {

  transform: scale(0.8);
  }
}

@media only screen and (max-width: 475px) {
.right_footer {

  transform: scale(0.8);

  }

}
@media only screen and (max-width: 373px) {
  .right_footer {
  transform: scale(0.6);
  }
}
@media only screen and (max-height: 415px) {
  .right_footer {
    transform: scale(0.6);
  }  
}


  /*nav*/
  /*nav*/
  @media only screen and (max-width: 900px) {
    nav ul li a {
      font-size:1.5rem;
        }
        nav ul li {
        list-style: none;
        display: inline-block;
        padding: 40 px 10 px;
        margin-right: 20px;
      
      }
  }

  @media only screen and (max-width: 475px) {
    nav {
      position: fixed;
      top: 60px;
      right: 0px;
      left: 0px;
      display: flex;
      flex: 1;
      width:100%;
      text-align: center;
      text-decoration: none;
      justify-content: center;
    
    }
      nav ul li a {
    font-size:1.2rem;
      }
      nav ul li {
      list-style: none;
      display: inline-block;
      margin-right: 20px;
    margin-left: 5px;
      }
  }

  @media only screen and (max-width: 900px) {
    nav ul li {
      list-style: none;
      display: inline-block;
      padding: 30 px 5 px;

    }

    nav {
      position: fixed;
      top: 60px;
    }
  }

  @media only screen and (max-height: 415px) {
    nav ul li {
      list-style: none;
      display: inline-block;

      margin-right: 40px;
    }
    nav {
      position: fixed;
      top: 40px;
      margin-left: 0px;
    }
    nav ul li a {
      font-size:1.2rem;
        }

  }


  @media only screen and (max-width: 395px) {
    nav ul {
      display: inline-flex;
      margin:0;
    }
    nav ul li {
    list-style: none;
    display: flex;
      margin-right: 17px;
    }
  }


  /*nav*/
        
        /*headline and return to menu*/

        
        @media only screen and (max-width: 321px) and (max-height: 481px) {

          #returntomainpage {
            font-size:1rem;
            bottom:7%;
          }
        }
      @media only screen and (min-width: 353px) and (min-height: 745px) {
        #returntomainpage {
          font-size:1.15rem;
          bottom:9%;
        }

          }


@media only screen and (min-width: 250px) and (min-height: 250px) {

#returntomainpage {
  font-size:1rem;
  bottom:9%;
}
#hireme {
  font-size: 0.5rem;
}
}



@media only screen and (min-width: 1000px) and (min-height: 600px) {
  #returntomainpage {
      font-size: 1.7rem;
      bottom: 12%;
  }
  }



  @media only screen and (min-width: 360px) and (min-height: 400px) {

#returntomainpage {
  font-size: 1.2rem;
  bottom: 10%;
}
#hireme {
  font-size: 0.7rem;
}
  }

  @media only screen and (min-width: 800px) and (min-height: 1000px) {

#returntomainpage {
  font-size:2.2rem;
  bottom:9%;
}
  }

  @media only screen and (min-width: 600px) and (min-height: 600px) {
    #returntomainpage {
      font-size: 1.7rem;
      bottom: 9%;
  }

}

/*headline and return to menu*/


@media only screen and (min-width: 1000px) and (min-height: 600px) {

  #hireme {
    font-size: 0.9rem;
  }
}

/*headline*/

@media only screen and (max-width: 500px) {
#textcont {
  width:100%;
  margin-left: 0;
margin-right: 0;
}

}
@media only screen and (min-width: 500px) {

  h1#headpage {
    left:35%;
  }

}

@media only screen and (min-width: 0px) and (min-height:0px) and (orientation:portrait) {
  #textcont {
    transform:scale(1);
  }
}



@media only screen and (min-width: 1350px) and (min-height:650px) and (orientation:landscape) {
  #textcont {
    transform:scale(1.4);
    top: 35%;
  }
}



@media only screen and (max-width: 500px) {

  h1#headpage {
    left:35%;
  }
}
@media only screen and (max-width: 321px) and (max-height: 481px) {

  h1#headpage {
    font-size: 1.5rem;
  top:22%;
  }
}

@media only screen and (min-width: 0px) {
  h1#headpage {
    font-size: 1.3rem;
  top:22%;
  left:50%;
  }
}

@media only screen and (min-height: 0px) and (orientation:landscape) {
  h1#headpage {
    font-size: 1.6rem;
  top:22%;
  left:50%;
  }
}

@media only screen and (min-height: 353px) and (orientation:landscape) {
  h1#headpage {
    font-size: 1.6rem;
  top:22%;
  left:50%;
  }
}

@media only screen and (min-height: 390px) and (orientation:landscape) {
  h1#headpage {
    font-size: 1.7rem;
    top:22%;
    left:50%;
  }
}

@media only screen and (min-height: 412px) and (orientation:landscape) {
  h1#headpage {
    font-size: 1.8rem;
    left:50%;
    top:22%;
}
}


@media only screen and (min-height: 640px) and (orientation:portrait) {
  h1#headpage {
    font-size: 1.6rem;
  top:20%;
  left:50%;

  }
  .headpage {
justify-content: center;
  }
}


@media only screen and (min-height: 890px) and (orientation:portrait) {
  h1#headpage {
    font-size: 2rem;
}
}

@media only screen and (min-height: 1000px) and (min-width: 1360px) and (orientation:portrait) {

  h1#headpage {
    font-size: 4.5rem;
  top:17%;
  left:32%;

  }
}


@media only screen and (min-height: 1000px) and (min-width: 600px) and (orientation:portrait) {

  h1#headpage {
    font-size: 3.5rem;
  top:17%;
  left:42%;

  }
}



@media only screen and (min-height: 1000px) and (min-width: 700px) and (orientation:portrait) {


  h1#headpage {
    font-size: 3.5rem;
  top:17%;
  left:50%;

  }


}


@media only screen and (min-width: 1024px) and (min-height: 760px) and (orientation:landscape) {
  h1#headpage {
    left: 17.2%;
    top: 15%;
    font-size: 3rem;
  }
}

@media only screen and (min-width: 900px) and (min-height: 590px) and (orientation:landscape) {

  h1#headpage {
    left: 20%;
    top: 15%;
    font-size: 2.5rem;
  }

}
@media only screen and (min-width: 740px) and (min-height: 440px) and (orientation:landscape) {

  h1#headpage {
    left: 50%;
    top: 22%;
    font-size: 2.5rem;
  }
}


@media only screen and (min-width: 1200px) and (min-height: 650px) and (orientation:landscape) {

  h1#headpage {
    left: 50%;
    top: 19%;
    font-size: 3rem;
  }

  #agreement {
    margin-top:15px;
}
}