* {
    margin: 0;
    padding: 0;
    display:block;
}


body {
    margin: 0 auto;
    text-align: center;
    background-color: beige;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}



#gen, #number {
    font-size: 1.8 em;
    padding-bottom: 10px;
}

/* Estilos del nav */

header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 35px;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 10;
}

.nav-bar {
  display: flex;
  justify-content: space-between;
  padding: 0.4em;
  font-size: 1.15em;

}


.menu {
  display: flex;
  width: 100%;
  justify-content: space-around;
  font-weight: bold;
    margin-top: -8px;
}



.menu li {
  list-style: none;
}

.menu a {

  color: #fff;
  text-decoration: none;
  padding: 4.5px 20px;
  border-radius: 2px;
   z-index: 999;
  cursor: pointer;
}



.menu .active, .active, .logo-brand {
  color: #84f714;
}

.menu li:hover a {
  background-color: #7fe421e7;
  color: #000;
}

.wrapper {
  width: 100%;
  height: 100%;
  background: radial-gradient(100% 225% at 0% 0%, #1a1d0cbb 0%, #17250cf8 100%), radial-gradient(100% 225% at 100% 0%, #000000ec 0%, #21df348f 100%), linear-gradient(180deg, #707211c5 0%, #a9c545c5 100%), radial-gradient(100% 120% at 75% 0%, #3b962077 0%, #050c06ce 100%), linear-gradient(310deg, #13d896ab 0%, #2f3f2165 50%);
    background-blend-mode: overlay, color-dodge, color-burn, color-dodge, normal;
  color: #fff;
    display: flex;
}


#main {
    text-align: center;
    align-items: center;
    padding: 40px;   
}