#contenido{
	   width:60%;
    height:75%;
   
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-color: black;
     border-style: solid;
      border-radius: 1rem ;



}
#title{
	font-size: 3rem;
	font-weight: bold;
	text-align: center;
}
p{
	font-family: calibri;
	font-size: 1.5rem;

}
#body{

	align-items: center;
	background-color: #c3e4cd;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%230efcd7' fill-opacity='0.4' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
	
}

#index{

background-color: #e4e4c3;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='72' viewBox='0 0 36 72'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23a5bc70' fill-opacity='0.4'%3E%3Cpath d='M2 6h12L8 18 2 6zm18 36h12l-6 12-6-12z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	margin-left: 25%;
  justify-content: center;
  
}
object{
	width: 100%;
    height: 100%;
}
.ejercicio{
	padding: 10px;

 
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

}

#contenido{
	background-color: #c3e4cd;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%230efcd7' fill-opacity='0.4' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
}
div{


	position: absolute;
	  flex-direction: column;
    justify-content: center;
    align-items: center;

   

}

/* Ejercicio tipo 3 */
#ejercicio3{
	z-index:1;
	top:5%;
	
	margin-left: 150px;
	font-size:1rem;
}
#ejercicio3_2{
	z-index: 2;
	top: 10%;
	left:48%;
}
#usuario3{
	width: 50px;
	height: 30px;
	font-size: 1.5rem;
}
#ejercicio1{
z-index: 2;
top: 10%;
	left:48%;
	font-size: 1.3rem;
}
#ejercicio1_2{
	z-index: 2;
	top: 10%;
	margin-left:35%;
}
#usuario1{
	z-index: 2;
	top: 10%;
	width: 2rem;
	height: 2rem;
	font-size: 1.5rem;
}
#ejercicio2{
z-index: 1;
	top: 0%;
	left:50%;
	font-size: 2rem;
}
#ejercicio2_2{
	z-index: 2;
	top: 0%;
	margin-left:150px;
	font-size: 4rem;
}
#ejercicio2_3{
	z-index: 2;
	top: 0%;
	margin-left:300px;
	font-size: 4rem;
}
#usuario2{
	z-index: 2;
	top: 0px;
	left:80px ;
	width: 25px;
	height: 20px;
	font-size:1rem;
}

            button{

                background-color: blueviolet;
                color: white;
                font-size: 20px;
                text-align: center;
                font-weight: bolder;
                padding: 3px;
                border: solid 2px black;

            }
            button:hover{ /* Estilo que se activa al pasar el puntero sobre el boton */
                background-color: lightcoral;
                font-size: 22px;
                border: groove 4px red;
            }