/* CSS Document */
/*!
 * dsignPOETRY labs.
 * CSS: 8002-infinite-rotating.css
 * File In Use: https://www.dsignpoetry.com
 * Version: 16.03.06
 * Theme Author: DoggieStudio dsignPOETRY labs - Another DoggieStudio Production Since 1984 ★ (adps1984 foundation) ★
 * Orign Fit: Bootstrap 5.3.x & Unify 3.2.2
 * 
 * Copyright © 1984-2023 dsignPOETRY (DP) and DoggieStudio (DS) licensed by adps1984 foundation. All rights reserved.
 *
 * Date: 2023.03.12 (BS update)
 *
 * Included: Bootstrap 5.3.x
*/
/* -------------------------------------------------------------------------------------------------------------------------
   Lets Begin The Experimental Item 8002
** ------------------------------------------------------------------------------------------------------------------------- */
body {
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	background-color: darkblue;
	margin: 0;
	min-height: 100vh;
	display: grid;
	place-content: center;
	overflow: hidden;
}
/* number of images*/
.gallery {
 --s: 280px;
  /* control the size 280px default */
  --d: 15s;
	/* animation duration 15s default */
	display: grid;
	width: var(--s);
	aspect-ratio: 1;
	overflow: hidden;
	padding: calc(var(--s) / 20); /* 20 default */
	border-radius: 50%; /* 50 default */
	position: relative;
	clip-path: circle(49.5%); /* 49.5% default *//* to avoid a few glitch caused by overflow: hidden */
}
.gallery::after {
	content: "";
	position: absolute;
	inset: 0;
	padding: inherit;
	border-radius: inherit;
	background: repeating-conic-gradient(#ffffff 0 30deg, #000000 0 60deg);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}
.gallery > img {
	grid-area: 1/1;
	width: 100%;
	height: 100%; /* 100 default in Chrome 92% fit */
	object-fit: cover;
	border-radius: inherit;
	transform-origin: 50% 196.1902200082%;
}
.gallery::after, .gallery > img {
	animation: m var(--d) infinite cubic-bezier(0.5, -0.2, 0.5, 1.2);
}
.gallery > img:nth-child(2) {
 animation-delay: calc(-0.1111111111* var(--d));
}
.gallery > img:nth-child(3) {
 animation-delay: calc(-0.2222222222* var(--d));
}
.gallery > img:nth-child(4) {
 animation-delay: calc(-0.3333333333* var(--d));
}
.gallery > img:nth-child(5) {
 animation-delay: calc(-0.4444444444* var(--d));
}
.gallery > img:nth-child(6) {
 animation-delay: calc(-0.5555555556* var(--d));
}
.gallery > img:nth-child(7) {
 animation-delay: calc(-0.6666666667* var(--d));
}
.gallery > img:nth-child(8) {
 animation-delay: calc(-0.7777777778* var(--d));
}
.gallery > img:nth-child(9) {
 animation-delay: calc(-0.8888888889* var(--d));
}
 @keyframes m {
 0%, 3% {
 transform: rotate(0);
}
 9.1111111111%, 14.1111111111% {
 transform: rotate(-40deg);
}
 20.2222222222%, 25.2222222222% {
 transform: rotate(-80deg);
}
 31.3333333333%, 36.3333333333% {
 transform: rotate(-120deg);
}
 42.4444444444%, 47.4444444444% {
 transform: rotate(-160deg);
}
 53.5555555556%, 58.5555555556% {
 transform: rotate(-200deg);
}
 64.6666666667%, 69.6666666667% {
 transform: rotate(-240deg);
}
 75.7777777778%, 80.7777777778% {
 transform: rotate(-280deg);
}
 86.8888888889%, 91.8888888889% {
 transform: rotate(-320deg);
}
 98%, 100% {
 transform: rotate(-360deg);
}
}