#guitarra{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

#pentagrama{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

#esfera{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

#negrita1{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

#negrita2{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

#silencio{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

#semicorchea{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

#corchea{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

svg, g{
    transform-origin: unset unset;
}

#_1{
    opacity: 1;
}

#_2{
    opacity: 0;
}

#murciélago{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

#mundo{
    transform-origin: 50% 50%;
    transform-box: fill-box;
}

#sol{
    transform-origin: 50% 50%;
    transform-box: fill-box;
}


.obra{
  width: 75%;
  height: 75%;
  margin: auto;
  align-self: center;
}

.boton{
   display: flex;
   align-items: center;
   justify-content: center;
   padding-top: 1rem;
   padding-bottom: 1rem;
   scale: 150%;
}

.confirm {
    background-color: #156a29;
    
 }

.confirm :hover{ 
    background-color: #121212; 
  }
 
h1{
    font-family: 'Rye', cursive;
    scale: 1.2;
    padding-bottom: 30px;
    padding-top: 3rem;
    color:#156a29;
    
}

p{
    font-size: 25px;
    color: #121212;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.titulo{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
    padding-top: 3rem;
    margin-lef:2%;
    margin-right: 2%;
}
.contenedor {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;

}

#hilo2{
    opacity: 0;
}

#piernas{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}
#gato2{
    transform-origin: 50% 50%;
    transform-box: fill-box;

}

/*keyframes:[
    {translateX:50},
    {translatey: 0}
]