section.cinerama.progressive {
	overflow: hidden;
	margin-bottom: 60px;
}
ul.cinerama.progressive,
ol.cinerama.progressive,
nav.cinerama.progressive,
section.cinerama.progressive > .freccia-giu,
ol.cinerama.progressive > li,
ul.cinerama.progressive > li,
ul.cinerama.progressive .porta-cartello,
.progressive .girardengo,
.progressive .cartello > div,
.progressive .girardengo > a {
	display:flex;
	display:-webkit-flex;
}
ul.cinerama.progressive {
	margin: 0;
	padding: 0;
	height: 100%;
	position: relative;
	left: 0;
}
section.cinerama.progressive > .freccia-giu {
	position: absolute;
	width: 60px;
	left: calc(50% - 30px);
	bottom: 0;
	height: 30px;
	margin: 0;
	padding: 0 0 60px 0;
	box-sizing: content-box;
}

section.cinerama.progressive > .freccia-giu {
    animation: ProgressiveFrecciaGiu 2s ease infinite;
    -webkit-animation: ProgressiveFrecciaGiu 4s ease infinite;
    -moz-animation: ProgressiveFrecciaGiu 4s ease infinite;
}
@keyframes ProgressiveFrecciaGiu {
  0%, 100% {
    padding-bottom: 60px;
  }
  80% {
    padding-bottom: 10px;
  }
}

ol.cinerama.progressive {
	position: absolute;
	right: 0;
	left: 92px;
	bottom: 0;
	height: 40px;
	padding:0;
	padding-bottom: 10px;
	margin: 0;
	align-items: center;
	-webkit-align-items: center;
}

nav.cinerama.progressive {
	cursor: pointer;
	position: absolute;
	width: 15px;
	left: 52px;
	bottom: 0;
	height: 40px;
	margin: 0;
	align-items: center;
	-webkit-align-items: center;
	padding: 0;
    padding-bottom: 10px;
	margin-left: 10px;
}
ol.cinerama.progressive.niente,
nav.cinerama.progressive.niente {
	display:none;
}

ol.cinerama.progressive > li {
	cursor: pointer;
	height: 10px;
	width: 10px;
	border-radius: 5px;
	background-color: white;
	margin: 0 7px;
	border: 1px solid white;
	align-items: center;
	justify-content: flex-end;
	-webkit-align-items: center;
	-webkit-justify-content: flex-end;
	position: relative;
	}
ol.cinerama.progressive > li.attivo {
	cursor: default;
	background-color:transparent;
	}
ul.cinerama.progressive > li:nth-child(1) > article > div.foto {
    opacity: 0.45;
}
ul.cinerama.progressive > li.apparso:nth-child(1) > article > div.foto {
	transition: opacity 5s ease;
    opacity: 1;
}

ul.cinerama.progressive > li {
	align-items: center;
	justify-content: flex-end;
	-webkit-align-items: center;
	-webkit-justify-content: flex-end;
	position: relative;
	height: 100%;
	overflow:hidden;
}
ul.cinerama.progressive > li > article > div.foto {
	position: absolute;
}

ul.cinerama.progressive .porta-cartello {
	align-items: flex-end;
	-webkit-align-items: flex-end;
	margin: auto;
	position: relative;
	flex-flow: column;
	justify-content: center;
	-webkit-flex-flow: column;
	-webkit-justify-content: center;
}

.progressive .cartello p {
	font-size: inherit;
    margin-bottom: 6px;	
}

.progressive .cartello p > img {max-width: 100%;}

ul.cinerama.progressive .cartello {
	border-bottom-width: 16px;
	border-bottom-style: solid;
	box-sizing: border-box;
	background-color: white;
}

ul.cinerama.progressive > li.attivo .cartello {
    -webkit-animation-name: CartelloProgressive;
    animation-name: CartelloProgressive;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: 1;
    animation-duration: 0.3s;
    animation-timing-function: linear;
    animation-iteration-count: 1;
}

@keyframes CartelloProgressive {
	0% { transform: scaleX(-1); }
	25% { transform: scaleX(-0.5); }
	50% { transform: scaleX(0); }
	75% { transform: scaleX(0.5); }
	100% { transform: scaleX(1); }
}

.progressive .girardengo > a {
    width: 100%;
    text-decoration: none;
	color: black;
}
.progressive .girardengo > a::before {
	content: 'leggi';
	display: block;
	width: 45px;
	height: 26px;
	margin-top: 5px;
}

.progressive .girardengo > a::after {
	content: '';
	display: inline-block;
	width: 70px;
	height: 26px;
	background-image:url(../../../uploads/2020/02/link_barra.png);
	background-size: 70px 4px;
	background-repeat: repeat-x;
	background-position: 0;
	margin-left: -8px;
	margin-top: 2px;
}
nav.progressive a.freccia-dx {
	background-image:url(../../../uploads/2020/02/freccia_destra.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;	
	height: 28px;
	width: 15px;
	margin: 0;
	padding: 0;
	}

.progressive .girardengo > a:hover:after {

    animation: Girardengo 0.4s ease 1;
    -webkit-animation: Girardengo 0.4s ease 1;
    -moz-animation: Girardengo 0.4s ease 1;
    -o-animation: Girardengo 0.4s ease 1;
}
@keyframes Girardengo {
  0% {
    background-position: 0px;
  }
  100% {
    background-position: 85px;
  }
}

.progressive .cartello > div {
	flex-flow:column nowrap;
	-webkit-flex-flow:column nowrap;
}
.progressive .freccia-giu.ferma {
    opacity: 0;
    transition: opacity 1s linear;
}


.progressive .cartello p {
	font-family: Helvetica, sans-serif;
}

ul.cinerama.progressive > li > article > div.foto {
	-webkit-animation-duration: 4s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-duration: 4s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: 1;
	-moz-animation-fill-mode: forwards;
	animation-duration: 4s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	--durata-animazione:4000; /*4s*/
	width: 100%;
	height: 100%;
}

@keyframes Progressive1 {
    from { transform: translate(0, 0); }
    to { transform: translate(3%, -4%); }
}
@keyframes Progressive2 {
    from { transform: translate(0, 0); }
    to { transform: translate(-4%, 3%); }
}
@keyframes Progressive3 {
    from { transform: perspective(0) translate3d(0,0,0); }
    to { transform: perspective(300px) translate3d(-20px, 0, 30px); }
}
ul.cinerama.progressive li:nth-child(3n+1) > article > div.foto {
	width: 103.2%;
	left: -3.2%;
	height: 104.2%;
}
ul.cinerama.progressive li.attivo:nth-child(3n+1) > article > div.foto {
	-webkit-animation-name: Progressive1;
	animation-name: Progressive1;
}
ul.cinerama.progressive li:nth-child(3n+2) > article > div.foto {
	width: 104.2%;
	right: -4.2%;
	top: -3.2%;
	height: 104.2%;
}
ul.cinerama.progressive li.attivo:nth-child(3n+2) > article > div.foto {
	-webkit-animation-name: Progressive2;
	animation-name: Progressive2;
}
ul.cinerama.progressive li:nth-child(3n) > article > div.foto {
	-webkit-animation-timing-function: ease-out;
	animation-timing-function: ease-out;
	width:calc(100% + 20px);
}
ul.cinerama.progressive li.attivo:nth-child(3n) > article > div.foto {
	-webkit-animation-name: Progressive3;
	animation-name: Progressive3;
}

/*solo una slide non anima*/
ul.cinerama.progressive li.attivo:nth-child(1):nth-last-child(1) > article > div.foto {
	-webkit-animation-name: none;
	animation-name: none;
}
ul.cinerama.progressive > li > span.modifica {
	top:0;
	bottom:unset;
}
ul.cinerama.progressive .porta-cartello {
	max-width:1280px;
	margin: auto;
	padding: 10px;
	height: 100%;
	width: 100%;
}
ul.cinerama.progressive .cartello {
	width: calc(50vw - 10px);
	height: auto;
	padding: 10px;
	font-size:12px;
	min-height: calc(50vw - 10px);
	position:relative;
	}
.progressive .cartello > div {
	padding-bottom: 20px;
	position:static;
	}

.progressive .girardengo {
	height: 30px;
	margin: 10px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: white;
}
.progressive .cartello p {
	z-index: 40;
}
.progressive .cartello p.girardengo {
	z-index: 41;
}