@import url('https://fonts.googleapis.com/css2?family=Akaya+Kanadaka&family=Harmattan&display=swap');

body{
  padding: 0;
  margin: 0;
  background-color: #e7cebb;
}

h1, h2, h3 {
  font-family: 'Akaya Kanadaka', cursive;
}

p, a, ul, li, h5{
  font-family: 'Harmattan', sans-serif;
}

.contenedor{
  margin: 0 auto;
  width: 800px;
  background-color: white;
}

.cabeza{
  background-color: #d28040;
  color: white;
  text-align: center;
  padding: 10px;
  font-size: 30px;
}
.subtitulo{
  font-size: 15px;
}

.item-menu{
  margin: 0 20px 0 40px;
  display: inline-block;
  padding: 10px;
}
.item-menu a{
  padding: 10px;
  text-decoration: none;
  text-align: center;
  color: black;
}

.menu{
  background-color: white;
  color:black;
  font-size: 20px;
  position: -webkit-sticky ;
  position: sticky;
}

.item-menu a:hover{
  background-color: #d28040;
  text-decoration: none;
  color: white;
}

.inicio{
  background-image: url(../img/mafaldita.jpg);
  margin: 20px;
  height: 316px;
  padding: 10px 300px 10px 20px;
  text-align: justify;
 }

 .personajes{
   margin: 100px auto;
   padding: 30px;
 }

 .personajes-1, .personajes-2, .personajes-3{
   display: flex;
 }
 .division{
   padding: 1px;
   background-color:#ecd398;
 }

 .mafalda, .guille, .felipe, .manolito, .susanita, .miguelito, .libertad, .padres{
   text-align: justify;
   padding: 15px;
 }

 .img-col{
   display: block;
   width: 200px;
   height: 200px;
   margin: auto;
 }

 .historia{
  background-color: #ffb982;
  padding: 30px;
  margin: auto;
  color: white;
  text-align: justify;
 }

 .tiras-animadas{
   padding: 40px;
   margin: auto;
   text-align: justify;
   color:#d28040;
 }
.videos{
  text-align: center;
}

.autor{
  padding: 40px;
  margin: auto;
  text-align: justify;
}
.img-quino{
  display: block;
  width: 700px;
  margin: auto;
}

.pie{
  background-color: #80250c;
  padding: 30px;
  text-align: center;
  color: white;
}

.vinculo {
  text-decoration: none;
  color: #ecd398;
}

.vinculo:hover{
  text-decoration: none;
  color: white;
}

.volver{
  margin: 0 0 0 600px;
  text-align: right;
}
.arriba{
  width: 50px;
  height: 15px;
}
.texto{
  display: inline-block;
}
.texto a {
  text-decoration: none;
  color: #671b0b;
}
.texto :hover{
  text-decoration: none;
  color:#a92104;
}
