* {box-sizing:border-box}

/* Slideshow container */
#panel-explora-imagenes, #panel-explora-librotop{position: relative; width: 100%; overflow: hidden; margin-bottom: 10px;}
.ts-slider-explora-container {max-width: 270px; height: 180px; position: relative;  margin: auto;}
#ts-slider-librotop{display: flex; flex-wrap: wrap; position: relative; margin: auto; justify-content: center;}

#panel-explora-imagenes .ts-mySlides{height: 100%;}
#panel-explora-librotop .ts-mySlides{width:30%; height: 100%; margin: 0 5px; display: none;}
#panel-explora-librotop .ts-mySlides.ts-mySlide-centro,
#panel-explora-librotop .ts-mySlides.ts-mySlide-left,
#panel-explora-librotop .ts-mySlides.ts-mySlide-right {display: block;}
@media (max-width: 900px) {
	#panel-explora-librotop .ts-mySlides.ts-mySlide-left,
	#panel-explora-librotop .ts-mySlides.ts-mySlide-centro{width: 45% !important; display: block !important;}
	#panel-explora-librotop .ts-mySlides.ts-mySlide-right{width: 0% !important;display: none !important;}
}
@media (max-width: 650px) {
	/*#panel-explora-librotop .ts-mySlides{display: none !important;}*/
	#panel-explora-librotop .ts-mySlides.ts-mySlide-centro{width: 100% !important; display: block !important;}
	#panel-explora-librotop .ts-mySlides.ts-mySlide-left,
	#panel-explora-librotop .ts-mySlides.ts-mySlide-right{display: none !important;}
}

/* Next & previous buttons */
#panel-explora-imagenes .prev, .next {cursor: pointer; position: absolute; top: 50%; width: auto; margin-top: -22px; padding: 16px; color: white; font-weight: bold; font-size: 18px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none;}
#panel-explora-librotop .prev, .next {cursor: pointer; position: absolute; top: 50%; width: auto; margin-top: -22px; padding: 16px; color: white; font-weight: bold; font-size: 18px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none;}

/* Position the "next button" to the right */
#panel-explora-imagenes .next {right: 0;  border-radius: 3px 0 0 3px;}
#panel-explora-librotop .next {right: 0;  border-radius: 3px 0 0 3px;}

#panel-explora-imagenes .next, .prev {text-decoration: none; color: white;}
#panel-explora-librotop .next, .prev {text-decoration: none; color: white;}

/* On hover, add a black background color with a little bit see-through */
#panel-explora-imagenes .prev:hover, #panel-explora-imagenes .next:hover {background-color: rgba(0,0,0,0.8);}
#panel-explora-librotop .prev:hover, #panel-explora-librotop .next:hover {background-color: rgba(0,0,0,0.8);}

/* The dots/bullets/indicators */
#panel-explora-imagenes .dot,#panel-explora-librotop .dot {cursor: pointer; height: 10px; width: 10px; margin: 0 2px; background-color: #bbb; border-radius: 50%; display: inline-block; transition: background-color 0.6s ease;}

.active, .dot:hover {background-color: #717171 !important;}

/* Fading animation */
.ts-fade {animation-name: fade; animation-duration: 1.5s;}
@keyframes ts-fade {from {opacity: .4} to {opacity: 1}}