/****************
 
 * FOGLIO DI STILE PER LE ANIMAZIONI DELLE  MINIATURE COLLEGATO
 * AL FILE -miniature.php - che è incluso nella Head del php - miniature.php -
 * crea tutti gli ID e calcola i tempi e le durate dell'animazione
!!! NON MODIFICARE !!!

*****************/

/***** BULLETS *****/
/* /calculate autoplay */
/*
.csslider1 > .content {
   margin-top: 5px;
   margin-left:0;
   margin-right:0;
}*/


.csslider1 > .cs_bullets {
	position: relative;
	left: 0;
   min-width: 100%;
	z-index: 6;
	font-size: 0;
	line-height: 8pt;
	text-align: center;
   overflow: hidden;
   
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
    
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
   
}
/*
.csslider1 > .content > .cs_bullets > div {
	margin-left: 2%;
   margin-bottom: 1%;
	width: 93%;
   min-height: 80px;
   height: auto;
   display: inline-block;
   color: #000000;
   background-color: rgba(255, 255, 255, 0.6);
   vertical-align: top;
   box-shadow: 5px 5px 10px rgba(56, 71, 76, 0.8);
}
*/
.csslider1 > .cs_bullets > label {
	position: relative;
	display: inline-block;
	cursor: pointer;
}
.csslider1 > .cs_bullets > span {
   text-align: justify;
   
}
/*
.csslider1 > .content > .content > .cs_bullets > label > .cs_thumb {
	visibility: hidden;
	position: absolute;
	opacity: 0;
	z-index: 1;
	line-height: 0;
	left: -64px;
	top: -48px;
}
*/
/****** BULLETS *****/
.csslider1 > .cs_bullets {
	top: 0px;
	margin-top: 0px;
   background-color:rgba(249, 249, 249, 0.8);
   border-bottom: 2px solid rgba(56, 71, 76, 0.8);
   margin-left: 0;
}

.csslider1 > .cs_bullets > div > h5 {
   padding: 15px;
   background-color:rgba(56, 71, 76, 0.8);
   color: #ffffff;
}
.csslider1 > .cs_bullets > label {
	padding: 0px;
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   opacity:1;
   z-index: 1;
   /*
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	border: 2px solid #fff;
	*/
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	
}

.csslider1 > .cs_bullets > label:hover
{
	opacity:1;
  transform: scale(0.8,0.8);
}
/*
.csslider1 > .content > .cs_bullets > label img {
	border: 3px solid #D03A79;
}

.csslider1 > .content > .cs_bullets > label > .cs_thumb {
	overflow: hidden;
	height: 0px;
	opacity: 1;
	margin-top: -13px;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	
}
.csslider1 > .content > .cs_bullets > label > .cs_thumb:before {
	content: '';
	position: absolute;
	width: 0; 
	height: 0; 
	left: 50%;
	top: 52px;
	margin-left: -2px;
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	
	border-top: 7px solid #D03A79;
}
.csslider1 > .content > .cs_bullets > label:hover > .cs_thumb {
	height: 59px;
	visibility: visible;
}


.csslider1 > .content > .cs_bullets > label:hover

.csslider1 > #cs_slide1_0:checked ~ .cs_bullets > label.num0,
.csslider1 > #cs_pause1_0:checked ~ .cs_bullets > label.num0,
.csslider1 > #cs_slide1_1:checked ~ .cs_bullets > label.num1,
.csslider1 > #cs_pause1_1:checked ~ .cs_bullets > label.num1,
.csslider1 > #cs_slide1_2:checked ~ .cs_bullets > label.num2,
.csslider1 > #cs_pause1_2:checked ~ .cs_bullets > label.num2,
.csslider1 > #cs_slide1_3:checked ~ .cs_bullets > label.num3,
.csslider1 > #cs_pause1_3:checked ~ .cs_bullets > label.num3

{
	opacity:1;
   transform: scale(0.8,0.8);
}
*/

/* calculate autoplay */
/*
@-webkit-keyframes bullet {
   /*
	0%, 24.99%	{ border: 2px solid rgba(255,255,255,0); background: #D03A79; }
	25%, 100% { border: 2px solid #fff; background: transparent; }
	*/
   /*
   0%, 24.99%	{ opacity:1; }
	25%, 100% { opacity:0.3; }
}
@-moz-keyframes bullet {
	0%, 24.99%	{ opacity:1; }
	25%, 100% { opacity:0.3; }
}
@-ms-keyframes bullet {
	0%, 24.99%	{ opacity:1; }
	25%, 100% { opacity:0.3; }
}
@-o-keyframes bullet {
	0%, 24.99%	{ opacity:1; }
	25%, 100% { opacity:0.3;}
}
@keyframes bullet {
   0%, 24.99%	{ opacity:1; }
	25%, 100% { opacity:0.3;}
   /*
	0%, 24.99%	{ border: 2px solid rgba(255,255,255,0); background: #D03A79; }
	25%, 100% { border: 2px solid #fff; background: transparent; }
	  
}


.csslider1 > #cs_play1:checked ~ .cs_bullets > label.num0 {
	-webkit-animation: bullet 16000ms infinite -2000ms;
	-moz-animation: bullet 16000ms infinite -2000ms;
	-ms-animation: bullet 16000ms infinite -2000ms;
	-o-animation: bullet 16000ms infinite -2000ms;
	animation: bullet 16000ms infinite -2000ms;
	
}
.csslider1 > #cs_play1:checked ~ .cs_bullets > label.num1 {
	-webkit-animation: bullet 16000ms infinite 2000ms;
	-moz-animation: bullet 16000ms infinite 2000ms;
	-ms-animation: bullet 16000ms infinite 2000ms;
	-o-animation: bullet 16000ms infinite 2000ms;
	animation: bullet 16000ms infinite 2000ms;
	
}
.csslider1 > #cs_play1:checked ~ .cs_bullets > label.num2 {
	-webkit-animation: bullet 16000ms infinite 6000ms;
	-moz-animation: bullet 16000ms infinite 6000ms;
	-ms-animation: bullet 16000ms infinite 6000ms;
	-o-animation: bullet 16000ms infinite 6000ms;
	animation: bullet 16000ms infinite 6000ms;
	
}
.csslider1 > #cs_play1:checked ~ .cs_bullets > label.num3 {
	-webkit-animation: bullet 16000ms infinite 10000ms;
	-moz-animation: bullet 16000ms infinite 10000ms;
	-ms-animation: bullet 16000ms infinite 10000ms;
	-o-animation: bullet 16000ms infinite 10000ms;
	animation: bullet 16000ms infinite 10000ms;
	
}
*/
   
   
.csslider1 > #cs_play1:checked ~ .cs_bullets > label,
.csslider1 > .pause:checked ~ .cs_bullets > label {
  	-webkit-transition: none;
  	-moz-transition: none;
  	-ms-transition: none;
  	-o-transition: none;
  	transition: none;
  	
}

/* stop */

.csslider1 > .slide:checked ~ .cs_bullets > label {
	-webkit-animation: none;
	-moz-animation: none;
	-ms-animation: none;
	-o-animation: none;
	animation: none;
}
