.caption0 { 
    position: absolute;
    color: #eee; 
    font: bold 12px Georgia; 
    background-color: #222;  
    top: 93%; 
    left: 15px;
 }
   .span3 .caption0 { 
  	padding:0px;
    font-size: 6px;
	top: 78%;
	left: 0px;
 }
@media screen and (max-width: 820px) {
.caption0 { 
    position: absolute;
    color: #eee; 
    font: bold 7px Georgia; 
    background-color: #222;  
    top: 85%; 
    left: 0px;
 }
} 
.caption0w { 
    position: absolute;
    color: black; 
    font: bold 12px Georgia; 
    background-color: white;  
    top: 93%; 
    left: 15px;
 }
   .span3 .caption0w { 
  	padding:0px;
    font-size: 6px;
	top: 78%;
	left: 0px;
 }
@media screen and (max-width: 820px) {
.caption0w { 
    position: absolute;
    color: black; 
    font: bold 7px Georgia; 
    background-color: white;  
    top: 85%; 
    left: 0px;
 }
} 
 .caption1 { 
    position: absolute;
    color: #eee; 
    font: bold 12px Georgia; 
    background-color: #222;  
    top: 90%; 
    left: 8px;
 }
   .span3 .caption1 { 
  	padding:0px;
    font-size: 6px;
	top: 78%;
	left: 0px;
 }
@media screen and (max-width: 620px) {
	.caption1 { 
    position: absolute;
    color: #eee; 
    font: bold 7px Georgia; 
    background-color: #222;  
    top: 85%; 
    left: 0px;
 }
}
 .caption1w { 
    position: absolute;
    color: black; 
    font: bold 12px Georgia; 
    background-color: white;  
    top: 90%; 
    left: 8px;
 }
   .span3 .caption1w { 
  	padding:0px;
    font-size: 6px;
	top: 78%;
	left: 0px;
 }
@media screen and (max-width: 620px) {
	.caption1w { 
    position: absolute;
    color: black; 
    font: bold 7px Georgia; 
    background-color: white;  
    top: 85%; 
    left: 0px;
 }
}
 .caption2w { 
    color: black;
	background-color: white;  
	padding-top:4px;
    font: bold Georgia;
	 font-size: 12px;
	text-align: center;
 }
  .span3 .caption2w { 
  	padding:0px;
    font-size: 6px;
 }
@media screen and (max-width: 620px) {
   .caption2w { 
    color: black;
	background-color: white; 
	padding-top:4px;
    font: bold 8px Georgia; 
	text-align: center;
 }
}
 .caption2 { 
    color: #eee;
	background-color: #222;  
	padding-top:4px;
    font: bold Georgia;
	 font-size: 12px;
	text-align: center;
 }
  .span3 .caption2 { 
  	padding:0px;
    font-size: 6px;
 }
@media screen and (max-width: 620px) {
   .caption2 { 
    color: #eee;
	background-color: #222; 
	padding-top:4px;
    font: bold 8px Georgia; 
	text-align: center;
 }
}
 .mySlides {
	 display:none; 
	 width:100%;
	 }
	 
 .background {
	 background-color: black;
 }
 
#img1 {
	border-radius: 6px;
}
 #img {
    width: 100%;
    margin: auto;
  }
#img2 {
	
} 
 
#style1 {
	 box-shadow: 0 8px 8px 0 rgba(8, 7, 7, 0.73), 0 6px 20px 0 rgba(0, 0, 0, 0.65);
	 border-radius: 6px;
	 border: 1px solid black;
	 }
#style2 {
	-webkit-box-shadow: 0 28px 16px -26px black;
	-moz-box-shadow: 0 28px 16px -26px black;
	box-shadow: 0 28px 16px -26px black;
	border:1px solid #ccc;
	padding:5px;
	margin-bottom:30px;
	 }
#style0 {
	
	 }
	 
.carousel.fade {
  opacity: 1;
}
.carousel.fade .item {
  -moz-transition: opacity ease-in-out .7s;
  -o-transition: opacity ease-in-out .7s;
  -webkit-transition: opacity ease-in-out .7s;
  transition: opacity ease-in-out .7s;
  left: 0 !important;
  opacity: 0;
  top:0;
  position:absolute;
  width: 100%;
  display:block !important;
  z-index:1;
}
.carousel.fade .item:first-child {
  top:auto;
  position:relative;
}
.carousel.fade .item.active {
  opacity: 1;
  -moz-transition: opacity ease-in-out .7s;
  -o-transition: opacity ease-in-out .7s;
  -webkit-transition: opacity ease-in-out .7s;
  transition: opacity ease-in-out .7s;
  z-index:2;
}	 
	 
.immagine { 
    background-color: black;
	position: relative;
}

.zoom:hover{
/**adjust scale to desired size, 
add browser prefixes**/
-ms-transform: scale(1.5);    
-moz-transform: scale(1.5);  
-webkit-transform: scale(1.5);  
-o-transform: scale(1.5);  
transform: scale(1.5);    
position:relative;
z-index:100; 	
}

.zoom {      
-webkit-transition: all 0.55s ease-in-out;    
-moz-transition: all 0.55s ease-in-out;    
transition: all 0.5s ease-in-out;     
cursor: -webkit-zoom-in;      
cursor: -moz-zoom-in;      
cursor: zoom-in; 
} 

/* Slideshow container */
.mySlides-contentainer{
  position: relative;    
}

/* Caption text */
.text {
  color: grey;
  font-size: 15px;
  padding: 8px 12px;
  
  bottom: 8px;
  width: 100%;
  text-align: center;
}
.span3 .text { 
  	padding:0px;
    font-size: 6px;
 }
 /* On smaller screens, decrease text size */
@media screen and (max-width: 620px) {
  .text {font-size: 10px}
} 

/* The dots/bullets/indicators 
.dot102 {
  height: 3px;
  width: 2%;
  margin: 0 0px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}
*/
.dot {
  height: 3px;
  width: 2%;
  margin: 0 0px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}
@media screen and (max-width: 620px) {
.dot {
  height: 2px;
  width: 8px;
  margin: 0 1px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}
}

@media screen and (max-width: 420px) {
.dot {
  height: 2px;
  width: 4px;
  margin: 0 0px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}
}

.dotact {
  background-color: blue;
}

@-webkit-keyframes fade { /* Safari 4.0 - 8.0 */
  0% {opacity: 0}
  20% {opacity: 1}
  80% {opacity: 1}
  100% {opacity: 0}
}

@keyframes fade {
	0% {opacity: 0}
	20% {opacity: 1}
	80% {opacity: 1}
	100% {opacity: 0}
}