body {
       background-color: #000000;
   }

   div {
       height: 10px;

   }

   .button {
       background: url(../SabiasQue/Imagenes/Simbolo14.png) no-repeat center center, #62BC0F;
       background-size: 4em;
       height: 68px;
       width: 68px;
       display: inline-table;
       text-decoration: none;
       position: relative;
       left: 25px;
       top: 10px;
       border-radius: 100%;
       cursor: pointer;
       box-shadow: inset 0 10px 15px rgba(255, 255, 255, .35), inset 0 -10px 15px rgba(0, 0, 0, .05), inset 10px 0 15px rgba(0, 0, 0, .05), inset -10px 0 15px rgba(0, 0, 0, .05), 0 5px 20px rgba(0, 0, 0, .1);
   }

   .button:active {
       box-shadow: inset 0 5px 30px rgba(0, 0, 0, .2);
       background-size: 3.9em;
   }

   .titulo1 {
       font-family: Verdana, Arial, Helvetica, sans-serif;
       color: #006600;
       font-weight: bold;
       font-size: 12px;
   }

   .texto1 {
       font-family: Arial, Helvetica, sans-serif;
       font-size: 10px;
       color: #669933;
   }

   .texto2 {
       font-family: Arial, Helvetica, sans-serif;
       font-size: 9px;
       color: #669933;
   }

   .titulo2 {
       font-family: Verdana, Arial, Helvetica, sans-serif;
       color: #006600;
       font-weight: bold;
       font-size: 9px;
   }

   .style3 {
       font-family: Verdana, Arial, Helvetica, sans-serif;
       color: #FFCC00;
       font-size: 9px;
   }

   .style4 {
       color: #009900
   }

   .style5 {
       color: #FFFFFF;
       font-family: Arial, Helvetica, sans-serif;
       font-weight: bold;
       font-size: 28px;
   }

   .modal-contenido {

       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal {

       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido2 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal2 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal2:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido3 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal3 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal3:target {
       opacity: 1;
       pointer-events: auto;
   }

   .contenedor {
       box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4);
       padding: 15px;
       position: absolute;
       font-size: 12px;
       height: 70%;
       width: 280px;
       margin: 5px;
       background-image: url(../images/bambu.png);
       color: darkgreen;
       font-weight: bold;
       padding-top: 4px;
       margin-left: 15px;

   }

   .modal-contenido4 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal4 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal4:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido5 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal5 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal5:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido6 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal6 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal6:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido7 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal7 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal7:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido8 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal8 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal8:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido9 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal9 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal9:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido10 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal10 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal10:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido11 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal11 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal11:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido12 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal12 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal12:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido13 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal13 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal13:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido14 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal14 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal14:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido15 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal15 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal15:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido16 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal16 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal16:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido17 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal17 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal17:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido18 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal18 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal18:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido19 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal19 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal19:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido20 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal20 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal20:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido21 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal21 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal21:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido23 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal23 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal23:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido24 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal24 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal24:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido25 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal25 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal25:target {
       opacity: 1;
       pointer-events: auto;
   }

   .modal-contenido26 {
       width: 310px;
       padding: 10px 20px;
       height: 350px;
       position: relative;
   }

   .modal26 {
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       left: 400px;
       opacity: 0;
       pointer-events: none;
       transition: all 1s;
   }

   #miModal26:target {
       opacity: 1;
       pointer-events: auto;
   }