/* slider.css */



.mySlides {
	width: 30%;
	box-shadow: 9px 9px 9px 7px rgba(16,21,199,0.51);
}

.mySlides p {
	width:80%;
	height:70px;
	margin-left: auto;
	margin-right: auto;
	text-align:center;
}


/* ------- sliding ------- */
/* Calculator for Images: https://unused-css.com/blog/css-only-background-slider/ */

.slider {
 overflow: hidden;
 width: 100%; /*100vw;*/
 height: 100%; /*100vh;*/
 position: relative;
}
 
.slider .slide {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background-size: cover;
 background-position: center;
 animation: slider 32s infinite;
}
 
.slider .slide:nth-child(1) {
   background-image: url('images/20220508_170814.jpg');
   animation-delay: 0s;
}

.slider .slide:nth-child(2) {
   background-image: url('images/IMG_7067.jpg');
   animation-delay: -4s;
}

.slider .slide:nth-child(3) {
   background-image: url('images/IMG_6661.jpg');
   animation-delay: -8s;
}

.slider .slide:nth-child(4) {
   background-image: url('images/IMG_6165.jpg');
   animation-delay: -12s;
}

.slider .slide:nth-child(5) {
   background-image: url('images/IMG_6215.jpg');
   animation-delay: -16s;
}

.slider .slide:nth-child(6) {
   background-image: url('images/IMG_6265.jpg');
   animation-delay: -20s;
}

.slider .slide:nth-child(7) {
   background-image: url('images/IMG_6355.jpg');
   animation-delay: -24s;
}

.slider .slide:nth-child(8) {
   background-image: url('images/IMG_7071.jpg');
   animation-delay: -28s;
}



@keyframes slider {
 0%, 10%, 100% {
   transform: translateX(0);
   animation-timing-function: ease;
 }
 13% {
   transform: translateX(-100%);
   animation-timing-function: step-end;
 }
 97% {
   transform: translateX(100%);
   animation-timing-function: ease;
 }
}