/* Amapola common*/

li.mdl-1-1-flyto-carousel-cntnr {
    width: 100%;
    background-color:rgba(21,74,119,1.00);
	overflow: hidden;
}
figure.mdl-1-1-flyto-carousel {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    color: rgba(10,75,150,1.00);
    text-align: center;
}
figure.mdl-1-1-flyto-carousel > img {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

figure.mdl-1-1-flyto-carousel > h2 {
	position: absolute;
	top: 3%;
	left: 0;
	right: 0;
	display: block;
background: none;
padding: 0;
border-radius: 0;
border: none;
z-index: 29;
font-family: 'Sansita', sans-serif;
font-size: clamp(1.6rem, 0.9600rem + 3.2000vw, 4.8rem)!important;
font-weight: bold;
font-style: italic;
color: rgba(255,255,255,1.00);
margin: 0;
width: 100%;
text-align: center;
text-transform: capitalize;
text-shadow: -0.04em -0.04em 0 rgba(21,74,119,1.00), 0.04em -0.054em 0 rgba(21,74,119,1.00), -0.04em 0.04em 0 rgba(21,74,119,1.00), 0.04em 0.04em 0 rgba(21,74,119,1.00);
	
}

figure.mdl-1-1-flyto-carousel > h3 {
	position: absolute;
	bottom: 2%;
	left: 5%;
	right: 5%;
	display: block;
font-family: 'carnaslight';
font-size: clamp(0.55rem, 0.4400rem + 0.5500vw, 1.1rem)!important;
font-weight: 300;
color: rgba(21,74,119,0.65);
margin: 0;
display: inline-block;
padding: 0 2.5% 0 2.5%;
	background:  var(--clr-white);
	
}

.carousel {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 0; 
	width: 1100%;
	height: 100%;
	div {
		width: 110%;
		display: inline-block;
		max-width: 65%;
		margin-right: 0;
	}

  position: relative;
  animation: wiper 32s infinite;
	animation-direction: alternate;
	animation-delay: 2s;
	animation-timing-function: ease-in-out;
}
.carousel div {
	display: inline-block;
	position: relative;
	height: 50%;
	width: 100%;
	border: .9vw solid rgba(255,255,255,1.00);
	margin: 30% 15% 10% 15%;
}
.carousel div p {
	display: inline-block;
	width: 100%;
	height: 100%;
	object-fit: cover;
    margin: 0;
}
.carousel div p img {
	display: inline-block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.carousel div h2 {
	position: absolute;
	bottom: 35%;
	left: 0;
	right: 0;
	display: block;
background: none;
padding: 0;
border-radius: 0;
border: none;
z-index: 29;
font-family: 'Sansita', sans-serif;
font-size: clamp(1.25rem, 0.4730rem + 1.6892vw, 2.5rem) !important;
font-weight: bold;
font-style: italic;
color: rgba(255,255,255,1.00);
margin: 0;
width: 100%;
text-align: center;
text-transform: capitalize;
text-shadow: -0.04em -0.04em 0 rgba(21,74,119,1.00), 0.04em -0.054em 0 rgba(21,74,119,1.00), -0.04em 0.04em 0 rgba(21,74,119,1.00), 0.04em 0.04em 0 rgba(21,74,119,1.00);
}
.carousel div #art-lnk,
.carousel div a.art-lnk {
	position: absolute;
	bottom: 5%;
	left: 0;
	right: 0;
	display: block;
background: none;
padding: 0;
border-radius: 0;
border: none;
z-index: 29;
font-family: 'Sansita', sans-serif;
font-size: clamp(1.25rem, 0.4730rem + 1.6892vw, 2.5rem) !important;
font-weight: bold;
font-style: italic;
color: rgba(255,255,255,1.00);
margin: 0;
width: 100%;
text-align: center;
text-transform: capitalize;
text-shadow: -0.04em -0.04em 0 rgba(21,74,119,1.00), 0.04em -0.054em 0 rgba(21,74,119,1.00), -0.04em 0.04em 0 rgba(21,74,119,1.00), 0.04em 0.04em 0 rgba(21,74,119,1.00);
}
	
/* need a step for each slide */
@keyframes wiper {
  0%   { transform: translateX(0); }
  4.75%  { transform: translateX(0); }
  9.5%  { transform: translateX(-9.091%); }
  14.25%  { transform: translateX(-9.091%); }
  19%  { transform: translateX(-18.182%); }
  23.75%  { transform: translateX(-18.182%); }
  28.5%  { transform: translateX(-27.273%); }
  33.25%  { transform: translateX(-27.273%); }
  38%  { transform: translateX(-36.364%); }
  42.75%  { transform: translateX(-36.364%); }
  47.5%  { transform: translateX(-45.455%); }
  52.25%  { transform: translateX(-45.455%); }
  57%  { transform: translateX(-54.546%); }
  61.75%  { transform: translateX(-54.546%); }
  66.5%  { transform: translateX(-63.637%); }
  71.25%  { transform: translateX(-63.637%); }
  76%  { transform: translateX(-72.728%); }
  80.75%  { transform: translateX(-72.728%); }
  85.5%  { transform: translateX(-81.819%); }
  90.25%  { transform: translateX(-81.819%); }
  95%  { transform: translateX(-90.91%); }
  100%  { transform: translateX(-90.91%); }
}


@media (min-width:768px) and (max-width:979px) {

	
}

@media (min-width:980px) and (max-width:1151px) {

	
}