*
{
   

  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  background: #272727;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  position: relative;
  z-index: 1;
}


.visible {
     visibility: visible;
            opacity: 1;
            transition-delay: 1s;
            transition: opacity 1s linear;
            position: absolute;
top: 65px;
left: 150px;
color: white;
font-size: 200%;

width:auto;
}




.hidden {
  visibility: hidden;
  transition-delay: 2s;
  opacity: 0;
  
  transition: visibility 0s 2s, opacity 1s linear;
  position: absolute;
top: 65px;
left: 150px;
color: white;
font-size: 200%;
width: auto;
}


  #wrapper > div
  {
      background: none repeat scroll 0 0 transparent;
      
      border-radius: 1000px;
      font-family: 'Racing Sans One', cursive;
      
  }

a:link {
    color: white;
    background-color: transparent;
    text-decoration: none;
  }

  a:visited {
    color: white;
  }
  
  a:hover {
    color: rgba(255, 255, 255, 0.74);
    background-color: transparent;
    text-decoration: none;
  }

  
  body {
    margin: 0;
    
    font-family: helvetica , sans-serif;
    font-size: 20px;
  }
  
  #myVideo {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%; 
    min-height: 100%;
    z-index: -10;
  }
  
  .content {
    position: fixed;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    color: #f1f1f1;
    width: 100%;
    padding: 20px;
  }
  


  
.menu-btn {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 50px;
  left: 50px;
  width: 80px;
  height: 80px;
  cursor: pointer;
  transition: all .5s ease-in-out;
  /* border: 3px solid #fff; */
}
.menu-btn__burger {
  width: 50px;
  height: 6px;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(255,101,47,.2);
  transition: all .5s ease-in-out;
  position: absolute;
  z-index: 99;
}
.menu-btn__burger::before,
.menu-btn__burger::after {
  content: '';
  position: absolute;
  width: 50px;
  height: 6px;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(255,101,47,.2);
  transition: all .5s ease-in-out;
  z-index: 99;
}
.menu-btn__burger::before {
  transform: translateY(-16px);
}
.menu-btn__burger::after {
  transform: translateY(16px);
}
/* ANIMATION */
.menu-btn.open .menu-btn__burger {
  transform: translateX(-50px);
  background: transparent;
  box-shadow: none;
}
.menu-btn.open .menu-btn__burger::before {
  transform: rotate(45deg) translate(35px, -35px);
}
.menu-btn.open .menu-btn__burger::after {
  transform: rotate(-45deg) translate(35px, 35px);
}