body {
font-family: Arial, sans-serif;
margin: 0px;
background-color: #044724;
}



header#hd1 {
top: 0%;
/* Asegura que el encabezado esté en la parte superior */
width: 100%;
/* Asegura que el encabezado ocupe todo el ancho de la pantalla */
z-index: 1000;
background-image: url('../../4insumos/img/banner.jpg');
background-size: cover;
background-position: center;
max-width: 100%;
height: 10%;
}


#hd1 {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}



.lgo-1 {
display: flex;
align-items: center;
}

.log-img-1 {
height: 100px;
margin-right: 10px;
margin-left: 10px;
}

.nava2 {

display: flex;
}

.nava2 a {
display: flex;
align-content: space-between;
}

.nava2 a:hover {
color: white;
}

.nav-link {
background-color: rgba(0, 0, 0, 0.377);
border-radius: 20px;
text-decoration: none;
color: #9e9e9e;
font-weight: 600;
padding: 10px;
margin: 10px;
}

h1 {
color: #9e9e9e;
}

p {
color: #400403;
}

.tit {
font-size: 20px;
}

.info-libreria a:hover {
color: #631f2b;
}


section h1 {
color: #9e9e9e;
font-size: 200%;
margin-left: 75px;
margin-top: 10px;
}

.info-libreria {
display: flex;
align-items: center;
width: 100%;
}


.icons {
width: 10%;
text-align: center;
border: solid 1px rgb(29, 29, 29);
background-color: #631f2b;
font-weight: 600;
border-radius: 20px;
padding: 3px;
margin: 5px;
}

.icons a {

text-decoration: none;
color: #9e9e9e;
}


.icons:hover {
color: #f56913;
background-color: rgba(0, 0, 0, 0.13);
}

/* carrusel */

.carousel-container {
position: relative;
max-width: 1920px;
margin: 50px auto;
overflow: hidden;
background-color: #025d31;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
padding: 15px;
box-sizing: border-box;
}


.subir {
color: #9e9e9e;
background-color: #631f2b;
border-radius: 20px;
font-weight: 600;
}


.carousel {
display: flex;
overflow: hidden;
}

.carousel-track {
display: flex;
transition: transform 0.5s ease-in-out;
}

.book-card {
flex: 0 0 16.6667%;
box-sizing: border-box;
padding: 20px;
text-align: center;

}

.book-card img {
max-width: 100%;
height: 300px;
display: block;
margin: 0 auto 10px;
object-fit: cover;
}

.carousel-button {
position: absolute;
top: 45%;
transform: translateY(-50%);
background-color: rgba(0, 0, 0, 0.5);
color: white;
border: none;
padding: 20px;
cursor: pointer;
z-index: 1;
font-size: 2em;
}

.carousel-button.prev {
left: 20px;
}

.carousel-button.next {
right: 20px;
}

.carousel-button:hover {
background-color: rgba(0, 0, 0, 0.7);
}






.pdf-button {
background-color: #007bff; /* Color de fondo del botón */
color: white; /* Color del texto del botón */
border: none; /* Sin borde */
border-radius: 5px; /* Bordes redondeados */
padding: 10px 20px; /* Espaciado interno del botón */
font-size: 14px; /* Tamaño de la fuente */
cursor: pointer; /* Cursor tipo mano al pasar sobre el botón */
transition: background-color 0.3s, transform 0.2s; /* Transiciones para efectos de hover */
display: inline-block; /* Alineación de bloque en línea */
text-align: center; /* Centrando el texto */
margin-top: 10px; /* Espaciado superior del botón */
}

/* Estilo al pasar el ratón sobre el botón */
.pdf-button:hover {
background-color: #0056b3; /* Color de fondo del botón al pasar el ratón */
transform: scale(1.05); /* Escala ligeramente el botón al pasar el ratón */
}

/* Estilo al hacer clic en el botón */
.pdf-button:active {
background-color: #004494; /* Color de fondo al hacer clic */
transform: scale(0.95); /* Efecto de presionar el botón */
}


/*BARRA DE PAGINACIÓN*/
.pagination {
font-weight: 600;
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
}

.pagination select {
padding: 5px;
/*background-color: aqua#036b34*/;
border: 1px solid #ddd;
margin-left: 5px;
}

.pagination-item {
background-color: #036b34;
font-weight: 600;
margin: 0 5px;
padding: 5px 10px;
border: 1px solid #ddd;
border-radius: 3px;
cursor: pointer;
}

.pagination-item:hover{
color: white;
}

.pagination-item.active {
background-color: #036b34;
} 
/*FIN BARRA DE PAGINACIÓN*/

/*FOOTER*/
.footer-container {
background-color: #036b34;
font-weight: 600;
color: #fff;
padding: 20px 0;
margin-top: 50px;
}

.container {
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 20px;
max-width: 1200px;
margin: 0 auto;
}

.left {
display: flex;
flex-direction: column;
}

.right {
display: flex;

}

.right-top,
.right-bottom {
display: flex;
flex-direction: column;
align-items: flex-end;
}

.language-select {
display: flex;
align-items: center;
border: 1px solid #ccc;
padding: 5px 10px;
border-radius: 5px;
margin-top: 10px;
}

.language-select .icon {
margin-right: 5px;
}

.language-select .text {
margin-right: 10px;
}

.footer-links {
text-decoration: none;
text-align: center;
padding: 20px;
}

.footer-links a {
color: #007bff;
text-decoration: none;
}

.footer-links a:hover {
text-decoration: none;
color: white;
}

.back-to-top {
position: fixed;
bottom: 20px;
right: 20px;
background-color: #007bff;
color: #fff;
padding: 10px;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.back-to-top:hover {
background-color: #0056b3;
}


.kronos-1 {
margin-left: 15%;
width: 30%;
}

.ran_pag {
background-color: black;
}

.con_li {
padding-inline: 3%;
padding-left: 3%;
padding-right: 3%;
height: 55%;
width: 44%;
block-size: auto;
}

.im_ba {
display: inline;
max-width: 100%;
}

footer {
padding: 100px;
}

.caca {
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
}

.container {
display: flex;
flex-wrap: wrap;
}

.cuadro {
margin: 5px;

}


@media (max-width: 768px) {
.con_li {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

.navbar-nav {
    text-align: center;
}

.modal-dialog {
    max-width: 90%;
    margin: auto;
}

.caca,
.container {
    flex-direction: column;
}
}

.botonaso {
text-decoration: none;
}
/*FIN FOOTER*/