*{  margin: 0;
   padding: 0;
   box-sizing: border-box;
   list-style: none;
   text-decoration: none;
  }
 body {margin: auto;    
       width: 90%;
       background-color: #eee;
       font-family: Berkshire+Swash,Arial, Helvetica, sans-serif ;
 }
 #cabecera {width: 100%;
   margin: 20px auto;
 }
 #cabecera h1{ font-family: Charm,Arial, Helvetica, sans-serif;} 
 h1 {text-align: center;
   font-size: 3em;
   color: rgb(255, 255, 255);
   background-color: rgb(13, 111, 187);
   margin: 3px auto;
   width: auto;
   border-radius: 10px;
 }
 h2 {font-weight: bold;
   font-size: 1.5em;
   font-family: Merriweather, Arial, Helvetica, sans-serif;
   text-align: left;
 }
 h3 { font-size: 1.1em;
   font-weight: 600;
   text-align: left;
 }
 h4 {font-size: 0.8em;}
 #cabecera ul { margin: 1px auto;
   text-align: center;
 }
 #cabecera ul li {display: inline-block;
   margin: 5px auto; 
   color: rgb(70, 30, 163);
   background-color: rgb(255, 255, 255);
   font-size: 0.7em;
   width: 20%;   
 }
 #menu {float: left;
   width: 26%;
   box-sizing: border-box;
 }
 #menu h2 {color: red; 
  }
 #menu .abrir {color: blue;
   cursor: pointer;
 }
 #menu .cerrar {cursor: pointer;
 }
 #menu ul li {list-style: none;
   text-decoration: none;
   color: rgb(79, 35, 182);
   background-color: rgb(217, 219, 240);
   margin-top: 20px;
   border-radius: 10px;
   text-align: center;
   padding: 10px;
   width: 90%;
 }
 menu ul li a {cursor: pointer;}
 #menu ul li h3 {color: red;
   font-size: 1.3em;}
 #menu ul li:hover {color: red;
 background-color: white;
 }
 .abrir { width: 60%;
 }
 .ventana {visibility: hidden;
  position: absolute;
  top: 120px;
  left: 5%;
  width: 50%;
  font-size: 0.8em;
  font-weight: bold;
  background-color: #eee;
  box-shadow: 15px 15px 15px #111;
 }
 .ventana h3 {font-size: 1.2em;}
 .cerrar {float: right;
    color: white;
    background-color: blue;
    border: 1px solid rgb(238, 98, 98);
    border-radius: 3px;
    width: 15%}
 #principal {float: left;
  width: 45%;
 }
 #principal #novedades h2 {color: blue;
 }
 #principal #novedades h3 {color: rgb(150, 10, 10);
   cursor: pointer;
 }
 #principal #novedades p {color: red;
 }
 #librodigital {margin-top: 30px;
  width: 90%;
 }
 #digital h2 { color: red;
 }
 #digital ul li {text-decoration: none;
  list-style: none;
  color:  rgb(70, 30, 163);
  background-color: rgb(217, 219, 240);
  font-size: 1.1em;
  text-align: center;
  margin-top: 20px;
  border-radius: 10px;
  width: 90%;
  padding: 10px;
 } 
 #digital ul li a {cursor: pointer;
  margin-top: 200px; 
}
 #digital .abrir {cursor: pointer;
 }
 #digital .cerrar {cursor: pointer;}
  #librodigital #digital ul h2:hover {color: red;
   background-color: white;
  }
  #digital ul li:hover { background-color: white;
 }
  #lateral {float: left;
  width: 25%;
  font-size: 0.8em;
 }
 #lateral h3 {color: red;
 }
 #uno{ width: 70%;
     margin-top: 10px;
 }
 #dos {width: 70%;
   margin-top: 10px;
 }
 #lateral p {color: blueviolet;}
  #autores { width: 100%;
clear: both;
margin-top: 15px;
margin-bottom: 15px;

 }
 #autores h3 {color:red;
}
 #autores a {cursor: pointer;}
 #pie {clear: both;
  width: 100%;
  color: blueviolet;
 }
 #pie h3 {color: red;
 }
 @media screen and (max-width:400px){
   #body {width: 100%;}
     #cabecera {width: 100%;}
     h1 {width: 70%;font-size: 1.5em;}
     #cabecera ul li {display: none;}
     #menu{ width: 100%;}
     #menu .ventana {width: 100%;
      z-index: 10;}
     #principal {width: 100%;}
     #digital { position: relative;}
     #lateral {width: 100%;
        margin-top: 20px;}
     #pie {width: 100%;}
} 
@media screen and (min-width:401px) and (max-width:820px){#body {width: 100%;}
     #cabecera {width: 100%;}
     h1 {width: 70%;font-size: 1.5em;}

     #menu{ width: 50%;}
     #menu .ventana {width: 100%;
      z-index: 10;}
     #principal {width: 50%;}
     #lateral {width: 100%;}
     #digital {position: relative;
      z-index: 1;}
      #digital .ventana {width: 100%;}
     #alfa {width: 50%;
           float: left; 
    }    
    #beta {width: 50%;
    float: left;}
    #pie {width: 100%;}
}
@media screen and (mind-width: 821px)