
body{
    margin: 25px;
    background: #8C31F9;
}
.titulo{
    text-align: center;
    font-size: 40px;
}
p{
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
.span1{
    color: red;
    background: white;
}
.span2{
    text-decoration-line: underline;
    font-weight: bold;
    font-style: italic;
}
.span3{
    color: red;
    background: white;
    font-weight: bold;
}

.hr1{
    max-width: 40rem;
    margin: 0 auto;
    border: 0.5rem solid red;
    border-radius: 20px;
    margin-top: 40px;
}
/*Si se desconfigura al añadir más lineas ponerle un class a cada y hacer lo siguiente ^1*/
.hr2{
    max-width: 40rem;
    border: 0.5rem solid red;
    border-radius: 20px;
    margin-top: 23rem;                    /*^1 Ajustar margin-top para bajarla tanto sea necesario*/
}
.hr3{
    max-width: 40rem;
    border: 0.5rem solid blue;
    border-radius: 20px;
    margin-top: 28rem;
}

.cobalto{
    color: red;
    font-size: 50px;
    text-shadow: 0.2rem 0.2rem black;
}

.caja1{
    width: 40%;
    padding: 10px;
    float: left;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 20px;
}
.caja2{
    width: 11%;
    border: 4px solid red;
    padding: 10px;
    float: left;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 20px;
}
.caja3{
    width: 40%;
    padding: 10px;
    float: left;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 20px;
}
.bloquecobre{
    float: left;
}
.cobre{
    color: red;
    font-size: 50px;
    text-shadow: 0.2rem 0.2rem black;
}
.cajacobre{
    width: 80%;
    padding: 10px;
    float: left;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 15px;
}
.imgcobre{
    width: 15%;
    border: 4px solid red;
    padding: 10px;
    float: right;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 35px;
}
.bloquehierro{
    float: left;
}
.hierro{
    color: red;
    font-size: 50px;
    text-shadow: 0.2rem 0.2rem black;
}
.cajahierro{
    width: 80%;
    padding: 10px;
    float: right;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 15px;
}
.imghierro{
    width: 15%;
    border: 4px solid red;
    padding: 10px;
    float: right;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 35px;
}