body{
 
  /*background:#fced7d;:#F5BB27;*/
 /*background:#D6B260;*/
 background-color:#ffffdb; /* color que le gusta apaulina */
  /*  background:burlywood; */
  /*  font-family: Baskerville, Baskerville Old Face, Garamond, Times New Roman, serif; */
  font-family:  Arial, Helvetica, sans-serif;
  font-size: 1.2em;
  cursor:url("imagenes/alfil5.png"), auto ;

}


.global{
  display:flex;
   
}

.prin{
  border:3px solid #2b3e50; 
  display:block;  
  padding:15px 70px;
  padding-bottom: 70px;
  text-align:justify;
  /* height:80%; */
}

.box{
  margin:10px 15px;
  width:150px;
  height:148px;
  /* Esto le da a la caja la propiedad para que sea rodeada por el texto */
  float:left;
  
  border: 2px solid black;
}

.box img{

border-radius:0px;
width:100%;
height:100%;  
}


.navmenu2 ul li a img{
  border:2px solid black;
  border-radius:8px;
  margin-left:auto;
  margin-right:auto;
}

.navmenu2 ul li img{
  border:2px solid black;
  border-radius:8px;
  margin-left:auto;
  margin-right:auto;
}

.navmenu{

  display:block;
}

.navmenu img{

  width:300px;
  height:200px;
  border:1px solid black;
  border-radius:8px;
  margin-left:auto;
  margin-right:auto;
}

.navmenu ul{
  list-style-type:none;
  padding:20px 5px;
/*  border:1px solid green; */
  
  
}


.navmenu ul li a{
  display:flex;
  justify-content:center;
  align-items:center;
  height:35px;
  width:150px;
  /* color de los elementos del menu */
  /*  background:#864f4f; */
  /*  background:#a22035;  */
  background:aliceblue;  
  color:black;
  border-radius: 8px;
  box-shadow:10px 7px 3px black;
  transition: all 0.5s;
  margin:10px;
  text-decoration: none;
  font-weight:bold;
  font-family: Arial, Helvetica, sans-serif;
  cursor:url("imagenes/alfil7.png"), auto ;
  
  /*  text-decoration:none; */
}

.navmenu ul li a:hover{
  transform:translateX(5px);
  /*   background:#cced7a;*/
  background:#C70039;
  color:white;
}

/*a:visited {
  color: forestgreen;
}*/


h1 {
  color: black;
  /*sombra del texto en el titulo*/
  text-shadow: 2px 2px darkgray;
  text-align:left;
}

 table, th, tr, td {
 border: 1px solid black;
 }


.galeria{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
}

.galeria img {

  margin:10px;
  width:300px;
  height:250px;
  border-radius:8px;
  
}


.galeria a img {

  margin:10px;
  width:300px;
  height:250px;
  border-radius:8px;
  border:solid 2px black;
}

/*slider*/


.slider-wrapper{

  position:relative;
  max-width: 1000px;
  margin: 0 auto;

}
.slider {

  display: flex;
  aspect-ratio: 16 /9;
  overflow-x: hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior: smooth;
  box-shadow: 0.25rem .5rem #21212126;
  border-radius: .5rem;
  
}

.slider img{

  flex:1 0 100%;
  scroll-snap-align:start;
  object-fit:cover;
}


.slider-nav{
  display:flex;
  column-gap:1rem;
  position:absolute;
  bottom:1.25rem;
  left:50%;
  transform:translateX(-50%);
  z-index: 1;
  }

.slider-nav a {
  width:.5rem;
  height:.5rem;
  border-radius:50%;
  background-color:red;
  opacity:.50;
  transition: opasity ease 250ms;
}


/* menua hamburguesa */


.navbar{
  display:flex;
  justify-content:flex-end;
  background-color:#313D59;
  position:relative;
  padding:16px 64px;
}

.nav-links{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  color:black;
  transition:all 0.5s ease;
}

.nav-links li{
  margin-left:24px;
}

.nav-links  a{
  text-decoration: none;
  color:#ffffff;
  font-size: 14px;
  padding:8px 23px;  
}


.nav-links  a:hover{
  background-color:#345FC2;
  border-radius: 2px;
}


.menu-icon{

  display:none;
  flex-direction: column;
  cursor:pointer;
  margin-left:auto;
  position:relative;
  z-index:1;

}

.menu-icon .line{
  width:30px;
  height:3px;
  background-color:gray;
  margin: 5px 0;
  transition:all 0.3s ease;
}


#menu-toggle{

  display:none;
}

/* fin menu hamburguesa */


/* paginade libros botosnes*/

.galerialibros {
  display:flex;
  margin-bottom: 30px;
  justify-content:center;
}


.galerialibros li {
  list-style-type:none;
  display:flex;
}

.galerialibros li a {
 
    justify-content: center;
    align-items: center;
    height:25px;
    width: 250px;
    /* color de los elementos del menu */
    /*  background:#864f4f; */
    /*  background:#a22035;  */
    background: aliceblue;
    color: black;
    border-radius: 8px;
    box-shadow: 10px 7px 3px black;
    transition: all 0.5s;
    margin: 15px;
    text-decoration: none;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    cursor: url("imagenes/alfil7.png"), auto;
    font-size: 1.0em;
  padding: 5px;
  text-align:center;

  }


  .galerialibros li a:hover {
    
    transform: translateX(10px);
    /*   background:#cced7a;*/
    background: #C70039;
    color: white;

  }



  @media screen and (max-width:780px){

    body{
      color:black;
      background:#ffffdb;
      font-family:  Arial, Helvetica, sans-serif;    
      font-size: 1em;
    }


    .global{
      display:inline;
      
    }

    .prin{
      border:1px solid #2b3e50; 
      display:block;
      padding:5px;
      text-align:justify;
    }


    .navmenu2{

      display:flex;
      
    }


    .navmenu2 h3{
      display:none;

    }

    .navmenu2 ul{
      display:flex;
      list-style-type:none;
      padding:3px 5px;;

    }


    .navmenu2 ul li img{
      width:80px;
      height:50px;
      margin: 3px;
      border: solid 1px black;
    }

    .navmenu2 ul li a img{
      width:80px;
      height:50px;
      margin: 3px;
      border: solid 1px black;
    }


    

    .navmenu{
      display:flex;
    }


    .navmenu ul{
      display:flex;
      list-style-type:none;
      padding:3px 5px;;

    }

    
    .navmenu ul li a
    {
      display:flex;
      margin: 3px;
      width:75px;
      list-style-type: none;
      list-style-image: none;
      background:none;
      text-decoration:none;
      box-shadow:none;
      font-size:0.9em;
    }


    .navmenu ul li img{
      width:80px;
      height:50px;
      margin: 5px;
      
    }


    .navmenu ul li a:hover{
      transform:translateX(5px);
      /*   background:#cced7a;*/
      background:red;
      color:white;
    }

    .box{
      margin:10px 15px; 
      border:0px solid black;
      width:30%;
      height:11%;
      /* Esto le da a la caja la propiedad para que sea rodeada por el texto */
      float:left; 
      
      
    }



    .galeria img {
      
      width:80%;
      height:60%;
      border-radius:8px;
    }


    /* menu hamburguesa */

    
    .navbar{
      padding:16px;
      
    }

    .menu-icon{
      display:flex;
    }

    .nav-links{
      position:absolute;
      top:70px;
      right:0;
      width:100%;
      height:0;
      overflow:hidden;
      flex-direction:column;
      background-color:gray;
      text-align:left;
      transition:heigth 0.5s ease; 
    }

    .nav-links li{
      margin:0;
      padding:20px 0;
      width:100%;
    }

    .nav-links a{
      width:100%;
      padding:10px 20px;
    }
    
    #menu-toggle:checked + .menu-icon + .nav-links{

      height:100vh;

    }



  }
