html, body {
    margin: 1px;
    height: 100%;
    max-height: 500%;
}
body{
    font-family: sans-serif;
    background: #3BB3C2;
} 

#pagina{
    margin: 0 auto;
    width:100%;
    max-width: 950px;
    background: #fff;
}

header{
    margin: 0 auto;
    max-width:100%;
    
  }
#headuser{
    width:100%;
    
  }


a{text-decoration: none;  
}
#reg{
    color: aliceblue;


}

#logo{
    
    width: 35%;    
    margin: 0 auto;
} 


#logoizq{
    width: 50%;
    padding: 5px; 
    margin-left: 25%;
    display: inline-block;
} 
#logoatras{
    width: 30%;
    padding: 2px; 
    margin-left: 2%;
    margin-top: 2%;
     display: inline-block;
    vertical-align: top;
} 

nav{
    width: 100%;
 
}

#menu{
    width: 50%;
    margin: 0 auto;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: center;
}

#ranking{
    width: 28%;
    padding: 5px;
    background: #42d600;
    color: aliceblue;
    border-radius: 20px;
    display: inline-block;
}
#reglas{
    width: 26%;
    padding: 5px;
    background: #ff6565;
    color: aliceblue;
    border-radius: 20px;
    display: inline-block;
}
#usuarios{
    width: 36%;
    padding: 5px;
    background: #ffce00;
    color: aliceblue;
    border-radius: 20px;
    display: inline-block;
   
}

#ranking:hover {
    background: #37b200;
    font-weight: bold;
}
#reglas:hover {
    background: #fd3434;
    font-weight: bold;
}
#usuarios:hover {
    background: #ffa700;
    font-weight: bold;
}
section{
    width: 100%;
    display: inline-block;
     vertical-align: top;
}
#espacio{
    width: 100%;
    max-height: 10px;
    display: inline-block;
    vertical-align: top;
}
#bienvenido{
    width: 50%;
    margin: 0 auto;
}

#btnjugar{
    width: 25%;
    background: #ff5555;
    color: aliceblue;
    border-radius: 30px;
    margin: 0 auto;
    padding: 5px;
    text-align: center;
    font-size: 2rem;
    font-weight:bold;
    display:inline-block;
    margin-left: 36%;
}



footer{
    text-align: center;
    font-size: 0.8rem;
    background: #0f535c;
    color: aliceblue;
    padding: 5px;  
   
    
}
#btnunjugador{
    width: 35%;
    display: inline-block;
    vertical-align: top;
    margin-left: 33%;
}
#btnmultijugador{
    width: 40%;
    display: inline-block;
    vertical-align: top;
    margin-left: 30%;
}