/* Contenitore della gallery con dimensioni fisse */
.polaroid-gallery {
    position: relative;
    height: auto; /* L'altezza si adatta */
    margin: 20px auto;
	padding 23px;
}
.polaroid-gallery {
    display: grid;
    gap: 10px; /* Spazio tra le immagini */
}

/* Layout a 2 colonne quando la larghezza dello schermo è maggiore di 600px */
@media (min-width: 550px) {
    .polaroid-gallery {
        grid-template-columns: repeat(2, 1fr);
		 width: 70%;  /* 2 colonne  */   
    }
}

/* Layout a 1 colonna quando la larghezza dello schermo è minore di 600px */
@media (max-width: 549px) {
    .polaroid-gallery {
        grid-template-columns: 1fr;
		 width: 85%;  /* 1 colonna */   
    }
}

/* Rimuove lo sfondo alle arrows */

.blog_slider.flat .blog_slider_header .slick-arrow:hover {
	background-color: transparent !important;
}
.blog_slider.flat .blog_slider_header .slick-arrow {
	background-color: transparent !important;}

/* Stile base per le card polaroid */
.polaroid {
    width: 100%;
    height: auto;
    padding: 3%;
    background: white;
    box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
    border-radius: 13px;
    overflow: hidden;
    transform: rotate(var(--rotate-angle, 0deg));
    transform-origin: center;
}
    

/* Wrapper per l'immagine */
.polaroid-wrapper .img-wrapper {
    width: calc(100% - 20px);
    height: calc(100% - 60px);
    margin: 0 auto;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.polaroid-wrapper .img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.polaroid-wrapper .img-wrapper a {
	text-decoration:none;
}

/* Overlay e nome evento */
/* .photo-overlay {
/*     position: absolute;
/*     bottom: 45px;
/*     right: 13px;
/*     background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
/*     color: white;
/*     padding: 3px 8px;
/*     font-size: 10px;
/*     border-radius: 5px;
/* }
*/
.photo-overlay {
    position: absolute;
    bottom: 38px;
    right: 19px;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
    color: white;
    padding: 13px 13px;
    font-size: 18px;
    border-radius: 5px;
    font-family: 'Figtree';
}

.event-name {
    position: static;
    /* bottom: 10px; */
    /* left: 10px; */
    font-size: 23px;
    font-weight: bold;
    color: #333;
    font-family: 'Figtree';
    text-align: center;
    padding-top: 13px;
	
}

/* Posizionamento e rotazione per ciascuna card */
.polaroid-gallery .polaroid:nth-child(1) {
    --rotate-angle: -10deg;
    animation: floating1 4s infinite ease-in-out;
}
.polaroid-gallery .polaroid:nth-child(2) {
    --rotate-angle: 10deg;
    animation: floating2 3.5s infinite ease-in-out;
}
.polaroid-gallery .polaroid:nth-child(3) {
    --rotate-angle: -5deg;
    animation: floating3 4.2s infinite ease-in-out;
}
.polaroid-gallery .polaroid:nth-child(4) {
    --rotate-angle: 3deg;
    animation: floating4 3.8s infinite ease-in-out;
} 

/* Animazioni */
@keyframes floating1 {
    0% { transform: translateY(-1px) rotate(var(--rotate-angle, 0deg)); }
    50% { transform: translateY(4px) rotate(var(--rotate-angle, 0deg)); }
    100% { transform: translateY(-1px) rotate(var(--rotate-angle, 0deg)); }
}
@keyframes floating2 {
    0% { transform: translateY(3px) rotate(var(--rotate-angle, 0deg)); }
    50% { transform: translateY(-3px) rotate(var(--rotate-angle, 0deg)); }
    100% { transform: translateY(3px) rotate(var(--rotate-angle, 0deg)); }
}
@keyframes floating3 {
    0% { transform: translateY(2px) rotate(var(--rotate-angle, 0deg)); }
    50% { transform: translateY(5px) rotate(var(--rotate-angle, 0deg)); }
    100% { transform: translateY(2px) rotate(var(--rotate-angle, 0deg)); }
}
@keyframes floating4 {
    0% { transform: translateY(-3px) rotate(var(--rotate-angle, 0deg)); }
    50% { transform: translateY(4px) rotate(var(--rotate-angle, 0deg)); }
    100% { transform: translateY(-3px) rotate(var(--rotate-angle, 0deg)); }
}
/* Aggiungi una transizione per un effetto fluido */
.polaroid {
    transition: transform 0.9s ease-in-out;
}

/* Al passaggio del mouse, pausa l'animazione, aumenta la scala e porta la card in primo piano */
.polaroid:hover {
    animation-play-state: paused;
    transform: scale(1.3) rotate(var(--rotate-angle, 0deg));
    z-index: 10;
}

.img-wrapper {
    width: calc(100% - 1px);
    height: calc(100% - 23px);
}

.polaroid-wrapper .polaroid {
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
    background: white !important; 
}

.polaroid-wrapper .img-wrapper {
    width: 100%; /* Imposta una larghezza adeguata */
    height: 300px; /* Regola l'altezza in base alle esigenze */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.comuni-slider   .polaroid-wrapper .img-wrapper,
.polaroid-wrapper .blog_slider_ul .img-wrapper{
    height: 80px;
    border-radius: 8px;
}

.comuni-slider   .polaroid-wrapper .photo-overlay,
.polaroid-wrapper .blog_slider_ul .photo-overlay{
    display: none;
}
.comuni-slider   .polaroid-wrapper .event-name,
.polaroid-wrapper .blog_slider_ul .event-name{
    display: none;
}
.polaroid-wrapper .blog_slider_ul .polaroid-wrapper{
    margin-left: -25px;
}
.polaroid-wrapper .blog_slider .blog_slider_ul li .item_wrapper .image_frame {
    margin-left: 0px;
}
@media (min-width:450px){
.home.page-template-default .blog_slider_ul .img-wrapper{
    height: 400px;
} 
}

.comuni-slider .mcb-item-heading-inner {
    min-height: unset !important;
}
/** polaroid mobile home **/
@media (max-width:1050px){

    .home  .polaroid-wrapper .img-wrapper{
        height: 80px !important;
        border-radius: 8px;
    }
    .home.page-template-default .blog_slider_ul .img-wrapper {
        height: 130px !important;
    }
   
    .home  .polaroid-wrapper .photo-overlay{
    display: none;
}
    .home .polaroid-wrapper .event-name{
        display: none;
    }
}

@media (max-width: 767px) {
    .polaroid.hide-mobile {
        display: none;
    }
}

/** addatta montagne home desktop */
@media (min-width: 767px) {
#montagne_home{
    margin-left: -20px;
}
}


/** adatta slider time line mobile **/
@media (max-width: 767px) {
.wpex.horizontal-timeline.ex-multi-item:hover .ex_s_lick-next {
    transform: translate(-27px, 0px) !important;
} 


 .wpex.horizontal-timeline.ex-multi-item .ex_s_lick-next {
    transform: translateX(-27px) !important;
    -webkit-transform: translateX(-27px) !important;
 
}
.wpex.horizontal-timeline.ex-multi-item .ex_s_lick-prev {

    transform: translateX(-2px) !important;
    -webkit-transform: translateX(-2px) !important;
  
}
}