body  {
  background: #f6fafc;
  color: #23262b;
  font-family: Arial, sans-serif;
  margin: 0 auto;
  padding: 0;
  max-width: 1024px;
  line-height: 1.7em;
}
    .container  {
  margin: 10px;
  border-radius: 11px;
  padding: 1em;
}
    h1 {
  color: #fff;
  font-size: 1.5em;
  text-align: center;
  background-color: #868686;
  padding: 5px;
}
.seccion {
  background-color: #daeeff;
  padding: 1em;
  border-left: 4px solid #0673ff;
}
    h2 {
  color: #0673ff;
  font-size: 1.3em;
  margin: 5px 4%;
}
    .concepto  {
  background: #e6f1fb;
  border-left: 4px solid #3584e4;
  padding: 1em;
  border-radius: 7px;
  margin-bottom: 13px;
}
    .ejemplo {
      background: #e7fbe7;
      border-left: 4px solid #39b263;
      padding: 11px 15px;
      border-radius: 6px;
      margin-bottom: 16px;
      font-size: 1em;
    }
    .esquema {
  padding: 1em 4%;
  background-color: #f6fafc;
  border: 1px inset gray;
}
.boton-back {
    float: right;
    text-decoration: none;
    background-color: #3b88c3;
    font-size: 1.1em;
    padding: 1px 9px;
    color: #fff;
    border-radius: 1em;
    border: 1px solid;
}
    .boton {
  background: #bfe5f9;
  color: #00913f;
  border: none;
  border-radius: 5px;
  padding: 7px 12px;
  cursor: pointer;
  margin-top: 1.5em;
  font-size: 1.1em;
  transition: background 0.2s;
  font-weight: bold;
  float: right;
  margin-right: 1%;
  margin-bottom: 1em;
}
    .boton:hover {
  background: #8eff95;
  color: #ff3131;
}
   .oculto {
      display: none;
    }
    code, pre  {
  padding: 2px 12px;
  border-radius: 8px;
  font-family: 'Consolas', 'Courier New', monospace;
  font-size: 1em;
  background-color: black;
  color: #ffffff;
  border: 1px groove black;
}
    .ejercicios {
  background: #fff8e6;
  border-left: 4px solid #e6b245;
  padding: 9px;
  border-radius: 7px;
  margin-bottom: 16px;
}
    ul, ol {
  padding: 2em;
  background-color: wheat;
  border-radius: 1em;
  margin: 1em;
}
li  {
  margin-bottom: 10px;
  padding: 5px 4%;
  background-color: #c6ffd2;
  border-radius: 1em;
}
    .clean {
      clear:both;
    }   
 .nota {
      color: #2d8570;
      font-size: 0.97em;
      margin-top: 8px;
    }
    
  .enunciado {
  font-weight: bold;
  font-size: 1.08em;
  padding: 1em;
  background-color: #ffc3c3;
  border-radius: 8px;
}
  
    .resolucion {
      background: #e7fbe7;
      border-left: 4px solid #3bbf50;
      padding: 10px 15px;
      border-radius: 6px;
      margin-bottom: 10px;
      font-size: 1.03em;
    }
  
    .simbolo {
      font-size: 1.25em;
      vertical-align: middle;
      margin-right: 7px;
    }
  .pasos {
      background: #e7fbe7;
      border-left: 4px solid #3bbf50;
      padding: 12px 16px;
      border-radius: 6px;
      margin-bottom: 16px;
      font-size: 1.02em;
    }  
    .resalta {
      color: #2d8570;
      background: #fffae3;
      border-left: 4px solid #ffe066;
      padding: 7px 12px;
      border-radius: 5px;
      margin-bottom: 10px;
      margin-top: 7px;
      display: block;
      font-size: 0.98em;
    }