.carousel-item{width:100%; min-height: 800px; }
#slider1{background: url('../imgs/slide4.jpg') no-repeat; background-size: cover; background-position: center center}
#slider2{background: url('../imgs/slide2.jpg') no-repeat; background-size: cover; background-position: center center}
#slider3{background: url('../imgs/slide3.jpg') no-repeat; background-size: cover; background-position: center center}
#slider4{background: url('../imgs/slide1.jpg') no-repeat; background-size: cover; background-position: center center}

.fade-in {
	font-family: 'Playfair Display', serif; font-weight: 700; font-size:3em; color:var(--coldark);
	text-align: center;
  opacity: 0; 
  animation: fadeIn 1.5s ease-in-out 0.5s forwards; 
}

@keyframes fadeIn {
  from {
    opacity: 0; 
  }
  to {
    opacity: 1; 
  }
}

#evento{margin-top: 2px; min-width: 100%; background-color: var(--coldark); color: #fff; padding-bottom: 30px}
#evento .intro {font-family: 'Playfair Display', serif; font-weight: 700; font-size: 2.4em; text-align: center; padding-top: 20px; padding-bottom: 12px}
#evento .subintro:not(sup) {text-align:center; font-size: 1.6em; padding-bottom: 40px; text-transform: uppercase;}
sup{font-size: 0.5em}
.eventi-container{display: flex; align-items: flex-start; justify-content: center; flex-wrap: wrap;}

.eventi-box{padding:4px 20px 20px 20px; width: 300px}
.eventi-box hr {border-color:#fff; padding-top: 4px; padding-bottom: 4px;}
.ot-data{color: var(--colbright); font-size: 1em; padding-bottom: 12px; font-weight: 500}
.ot-title{font-weight:500; padding-bottom: 12px}
.ot-title h3 {font-size: 1.3em}
.ot-ds{font-size: 0.8em}
.ot-direttore{margin-top:12px; font-size: 0.8em}
.eventi-location{text-align: center; color: #fff; font-family: 'Playfair Display', serif; font-size:1.4em; padding-top:24px }
.location-goto{padding-top: 24px; font-size:0.8em; text-transform:uppercase;}
.location-goto a:link, .location-goto a:visited {color: #ccc}
.location-goto a:hover {color: #fff}

.btn-evento{border:#fff 1px solid; background-color:var(--coldark); color:#fff; font-size: 1.2em; padding: 12px; text-transform: uppercase;}
.btn-evento:hover{background-color:#fff; color: var(--coldark)}

.blog{margin-top: 60px; margin-bottom: 120px;}
.blog-img{position: relative}
.blog h5{font-family: 'Playfair Display', serif; font-size: 2.6em; text-transform: uppercase; padding: 16px; color:var(--coldark)}
.blog-tit{text-align: center; font-weight: 500; font-size: 1em; margin-top: 12px; line-height: 1.1em}
.blog hr {max-width: 80%; margin:12px auto 12px auto}
.blog-tx{font-size: 0.9em}
.blog-tx a:link, .blog-tx a:visited {color: #000 font-weight:500}

.presentazione{margin-top: 60px; margin-bottom: 60px}
.presentazione .col-12 {text-align: justify;}
.presentazione a:link, .presentazione a:visited {color: var(--coldark); text-transform: uppercase;}

.sponsor-title{font-family: 'Playfair Display', serif; font-size: 1.4em; font-weight: 700; text-transform: uppercase; padding: 16px; letter-spacing: 1px; color:var(--coldark)}
.sponsor-title div {max-width: 400px; background: url('../imgs/dot-dark.svg') repeat-x; background-size: 1px 1px; background-position: center; margin: auto;}
.sponsor-title span {background: #fff; padding-left: 16px; padding-right: 16px}
.sponsor img {max-width: 180px; max-height: 180px; margin:auto; padding: 20px}
/* ---------------------------  MEDIA 1400 ----------------------------------- */
@media (max-width: 1400px) {
	.eventi-box{padding:4px 15px 30px 15px; width: 280px}
}
/* ---------------------------  MEDIA 991 ----------------------------------- */
@media (max-width: 991px) {
	.carousel-item{min-height: 700px; }
	#copertina{min-height: 600px;}
	.eventi-box{padding:4px 15px 30px 15px; width: 320px}
	.blog h5{margin-bottom: 30px}
}

/* ---------------------------  MEDIA 767 ----------------------------------- */
@media (max-width: 767px) {
	.carousel-item{width:100%; min-height: 400px; }
	.fade-in{font-size:2.2em;}
	#copertina{min-height: 410px;}
	#evento .intro {font-size: 1.8em; }
	.eventi-box{padding:4px 4px 40px 4px; width: 350px}
	.blog h5{font-size: 2em}
	.blog-cell{margin-bottom: 30px}
}

/* ---------------------------  MEDIA 576 ----------------------------------- */
@media (max-width: 576px) {
	.carousel-item{width:100%; min-height: 350px; }
	.fade-in{font-size:1.8em;}
	#copertina{min-height: 354px;}
}