/* Amapola common*/

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

figure.mdl-1-1-image-imgcarousel > h2 {
	position: absolute;
	top: 3%;
	left: 0;
	right: 0;
	display: block;
background: none;
padding: 0;
border-radius: 0;
border: none;
z-index: 29;
color: rgba(255,255,255,1.00);
margin: 0;
width: 100%;
	
}

figure.mdl-1-1-image-imgcarousel > 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);
	
}

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

  position: relative;
  animation: carous 16s infinite;
	animation-direction: alternate;
	animation-delay: 2s;
	animation-timing-function: ease-in-out;
}
.imgcarousel div {
	display: inline-block;
	position: relative;
	margin: 0;
}
.imgcarousel div img {
	display: inline-block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.imgcarousel div h2 {
	position: absolute;
	bottom: 35%;
	left: 0;
	right: 0;
	display: block;
background: none;
padding: 0;
border-radius: 0;
border: none;
z-index: 29;
color: rgba(255,255,255,1.00);
margin: 0;
width: 100%;
}
.imgcarousel div #art-lnk,
.imgcarousel 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;
color: rgba(255,255,255,1.00);
margin: 0;
width: 100%;
}
	
/* need a step for each slide */
@keyframes carous {
  0%   { transform: translateX(0); }
  10%  { transform: translateX(0); }
  30%  { transform: translateX(-25%); }
  40%  { transform: translateX(-25%); }
  60%  { transform: translateX(-50%); }
  70%  { transform: translateX(-50%); }
  90% { transform: translateX(-75%); }
  100% { transform: translateX(-75%); }
}


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

	
}

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

	
}