Predložak:Slideshow/style.css

.caixa-flex { display: flex; box-shadow: 0 0 0px rgba( 0, 0, 0, 0.5 ); max-width: 100%; margin: 0 auto; }

.reqport { flex: 1 1 0; }

.slider-container { overflow: hidden; width: 100%; height: 100%; min-height: 30vh; }

.slider-container ul { margin: 0; padding: 0; display: table; table-layout: fixed; height: 100%; list-style: none; }

.slider-container .slideshow-p {

   z-index: 20;
   display: inline;

}

.card { height: 100%; color: #fff; }

.card .background { height: 0; }

.card .background img { position: absolute; width: 100%; height: auto; min-height: 100%; object-fit: cover; }

.card-overlay { overflow: hidden; width: 100%; height: 100%; position: absolute; background: black; opacity: 0; }

.card .content { position: absolute; box-sizing: border-box; padding: 0.25em 0.5em; margin: 0; display: flex; flex-direction: column; height: inherit; width: 100%; }

.card .title { font-size: 150%; font-weight: bold; text-shadow: black 0px 0px 5px; }

.card .description { flex: auto; }

.card .image-link { z-index: 5; position: absolute;

   bottom: 0;
   right: 5px;

}

.card .image-link a { color: #fff; font-size: 75%; text-decoration: underline; float: right; max-width: 100%; overflow: hidden; white-space: nowrap; }

.nomobile.slider-container ul { width: 100%; }

.nomobile.slider-container li { display: table-cell; position: relative; width: 33.33333%; transition: all 400ms ease; border: 1px solid white; border-right: 1px solid #ccc; }

.nomobile.slider-container li:last-child { border-right: 0; }

.nomobile.slider-container ul:hover li { width: 10%; }

.nomobile.slider-container ul:hover li:hover { width: 60%; }

.nomobile.slider-container li:hover .card-overlay { opacity: 0.7; }

.nomobile.slider-container li:hover .show-on-hover { opacity: 1; }

.nomobile .card .show-on-hover { opacity: 0; }

.card > a { position: absolute; width: 100%; height: 100%; z-index: 1; opacity: 0; }

.nomobile ~ .onlymobile { display: none; }

.onlymobile .card { display: table-cell; padding: 0 5px; position: relative; }

.onlymobile .card .image-link a { padding-right: 10px; z-index: 3; }

.onlymobile .card .background img { min-height: inherit; position: relative; vertical-align: baseline; height: 33vw !important; width: 33vw !important; object-fit: cover; background-position: center; }

.onlymobile.slider-container { overflow: inherit; }

.onlymobile.slider-container ul { position: relative;

display:flex;
table-layout:inherit;
flex-wrap: wrap;
justify-content: center;

}

.onlymobile.slider-container ul li { font-size:inherit; /* blank */ }