html {
  font-size: 1em;
  line-height: 1.5em;
  font-family: "Verdana", Helvetica, sans-serif;
}

body {
  margin: 0;
  background: #f3f3f3;
}

.encabezado {
  text-align: center;
  background: #006699;
  border-bottom: 0.1em solid silver;  
  padding: 0.5em;
  }


.footer-principal {
  text-align: center;
  background: #006699;
  border-bottom: 0.1em solid silver;  
  padding: 1em;
  }

.principal {
  max-width: 900px;
  margin: auto;
  padding: 1em;
}

.caja1, .caja2, .caja4 {
  background: #fff;
  border: 0.1em solid gray;
  padding: 1em;
  margin: 1em;
  box-shadow: 0 0 0.1em 0.01em black;
} 


.caja3 {
  background: #fff;
  border: 0.08em solid gray;
  padding: 1em;
  margin: 1em;
  box-shadow: 0 0 0.1em 0.01em black;
  border-radius: 15px;
} 

.caja1 h2 {
  font-family: 'Verdana', sans-serif;
  color: darkblue;
  text-shadow: 0.03em 0.03em 0.01em #000;
  letter-spacing: 0.03em;
}
.caja1 p, ol {
  font-family: 'Verdana', sans-serif;
  color: darkblue;
}

.caja2 h1 {
  font-family: 'Verdana', sans-serif;
  color: darkblue;
  text-shadow: 0.03em 0.03em 0.01em #000;
  letter-spacing: 0.03em;
}

.caja2 h2 {
font-family: 'Roboto', sans-serif;
font-size: 1.2em;
text-align:center;
color: darkblue;
}

.caja2 p {
  text-align: justify;
  font-family: 'Roboto', sans-serif;
  font-size: 0.9em;
  color: darkblue;
  }

.caja3, .caja4 h2 {
  font-family: 'Verdana', sans-serif;
  color: darkblue;
  text-shadow: 0.03em 0.03em 0.01em #000;
  letter-spacing: 0.03em;
}

.articulo {
  margin-top: 2em;
}

.solucion h2 { font-size: 1.5em; }

.solucion h3 {
  font-family: 'Tahoma', sans-serif;
  font-size: 1em;
  color: darkblue;  
}

.texto {
  text-align: center;
  font-family: 'Arial', sans-serif;
  font-size: 0.7em;
  color: black;
  }

  #enunciado{    
    background: rgba(241,231,103,0.66);
    background: -moz-linear-gradient(left, rgba(241,231,103,0.66) 0%, rgba(250,198,80,0.66) 41%, rgba(254,182,69,0.78) 61%, rgba(254,182,69,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(241,231,103,0.66)), color-stop(41%, rgba(250,198,80,0.66)), color-stop(61%, rgba(254,182,69,0.78)), color-stop(100%, rgba(254,182,69,1)));
    background: -webkit-linear-gradient(left, rgba(241,231,103,0.66) 0%, rgba(250,198,80,0.66) 41%, rgba(254,182,69,0.78) 61%, rgba(254,182,69,1) 100%);
    background: -o-linear-gradient(left, rgba(241,231,103,0.66) 0%, rgba(250,198,80,0.66) 41%, rgba(254,182,69,0.78) 61%, rgba(254,182,69,1) 100%);
    background: -ms-linear-gradient(left, rgba(241,231,103,0.66) 0%, rgba(250,198,80,0.66) 41%, rgba(254,182,69,0.78) 61%, rgba(254,182,69,1) 100%);
    background: linear-gradient(to right, rgba(241,231,103,0.66) 0%, rgba(250,198,80,0.66) 41%, rgba(254,182,69,0.78) 61%, rgba(254,182,69,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645', GradientType=1 );
    padding:1.5em 0;
  }
  #enunciado h1, h2 {
    font-family:helvetica;
    text-align:center;
    color:rgb(20,20,100);
    text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15);
  }
  #enunciado p{
   padding: 1em;
   color: whitesmoke;
   font-family: Arial;
   text-shadow: 6px -6px 3px gray, 2px 2px 1px blue;
   font-size: 1.5em;
  }
  footer{
    margin-top:3em;
    display: block;
  }
  footer img{
    background:gray;
    border-radius: 50%;
    padding: 0.2em;
  }