body{
/* background-color: rgb(59, 56, 56); */
background-image: url("imagenes/Gemini_Colash.png");
background-size: cover;
   /* background-image: 
    linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.66)), 
    url("imagenes/leon.jpg"); 
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100vh;
  margin: 0;  */
} 
#general{
    margin: 20px auto;
    width: 450px;
    background-color: rgb(255, 224, 168);
    height: 550px;
    border-radius: 10px; 
}
header{
    display: flex;

}
header p{
    display: block; 
    margin: 0px auto;
    margin-top: 20px;
    font-family:Arial;
    font-size: 20px;
    color: rgb(174, 116, 8);
    font-weight: bold;
}
#iniciar{
    background-color:rgb(80, 80, 251);
    /* border: 2px solid rgb(80, 80, 251); */
    border: 0px;
    border-radius: 10px;
    height: 30px;
    cursor: pointer;
    font-family: Arial;
    font-weight: bold;
    color: white;
}
#iniciar:hover{
    background-color:rgb(26, 26, 92); 
    color: rgb(255, 201, 100);
}
#resultados{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 10px;
}
#resultados div{
    text-align: center;
    font-family:fantasy;
} 
#imagen{
    display: flex;
    /* border: 1px solid gray;  */
    border-radius: 20px;
    width: 80%;
    height: 250px;
    margin: 0px auto;
}
#imagen img{
    width: 100%;
    border: 1px solid rgb(251, 211, 136);
    border-radius: 20px;
}
#respuesta{
    display: flex;
    flex-direction: column;
    align-items: center;
    /*justify-content:space-evenly;
    margin-top: 40px; */
} 
#respuesta button{
    font-size: 20px;
    font-weight: bold;
    background-color:rgb(254, 185, 57);
    border: 0px;
    border-radius: 15px; 
    cursor: pointer;
    margin-top: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 80%;
    
}
#respuesta button:hover{
    background-color: rgb(144, 97, 11);
    color: white;
}
.respA::before {
    content: "A) "; 
    color: black;
  
}
.respB::before {
    content: "B) "; 
     color: black;
}
.respC::before {
    content: "C) "; 
    color: black; 
}
.acierto::before {
    content: "✔ "; 
    color: rgb(217, 255, 161);
  
}
.fallo::before {
    content: "✖ "; 
     color: yellow;
}
