GOOGLE
<style>
img {
max-width: 100%;
vertical-align: middle;
}
.trigger {
display: none;
}
.slider, .slider-wrapper {
position: relative;
height: 250px;
}
.slide {
width: 100%;
overflow: hidden;
/*position: absolute;*/
height: 100%;
left: 0;
top: 0;
z-index: 5000;
opacity: 0;
transition: opacity .5s ease-in-out;
}
.slide-img {
height: auto;
object-fit: fill;
display: block;
margin: 0 auto;
}
.slide-figure {
height: 100%;
position: relative;
margin: 0;
}
.slide-caption {
position: absolute;
bottom: 30%;
width: calc(100% - 1rem);
color: white;
text-align: center;
left: 50%;
}
.trigger:checked + .slide {
z-index: 999;
opacity: 1;
}
.slider-nav {
width: 100%;
text-align: center;
margin: 1rem 0;
}
.slider-nav__item {
display: inline-block;
}
.slider-nav__label {
font-size: 13px;
background-color: #333;
display: block;
height: 2em;
line-height: 2em;
width: 2em;
text-align: center;
border-radius: 50%;
color: white;
cursor: pointer;
transition: background-color .25s, color .25s ease-in-out;
}
.slider-nav__label:hover,
.slider-nav__label:active,
.slider-nav__label:focus {
background-color: gray;
color: black;
}
}
</style>
Copyright © 1945 -