

/* ---------------------------------------------------- */
/*                      ELEMENTI FLE                   */
/* ---------------------------------------------------- */

/* ---------------------------------------------------- */
/*   Blocco allineato con centratura orizzontale     */
/* ---------------------------------------------------- */

/*Usato in: slide-1a*/
/* due blocchi da 50% */
/*https://the-echoplex.net/flexyboxes/?display=flex&flex-direction=row&flex-wrap=nowrap&justify-content=flex-start&align-items=flex-start&align-content=center&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=50%25&align-self%5B%5D=center&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=50%25&align-self%5B%5D=center*/
.contenitore-blc-centrato {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    }

.elm-blc-centrato-sx {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 50%;
    -ms-flex: 0 1 50%;
    flex: 0 1 50%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }

.elm-blc-centrato-dx {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 50%;
    -ms-flex: 0 1 50%;
    flex: 0 1 50%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }



/* OPZIONE a .contenitore-blc-centrato due blocchi da 55 e 45 */

.elm-blc-centrato-66 {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 66%;
    -ms-flex: 0 1 66%;
    flex: 0 1 66%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }

.elm-blc-centrato-33 {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 33%;
    -ms-flex: 0 1 33%;
    flex: 0 1 33%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }






/* --------------------  FLEX CON SPACE BETWEEN --------------------  */


/*Usato in: testata-statica-i*/
/* due blocchi con spazio centrale */
/*https://the-echoplex.net/flexyboxes/?display=flex&flex-direction=row&flex-wrap=nowrap&justify-content=space-between&align-items=flex-start&align-content=center&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=center&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=center*/



/* ------------------------------ */
/*        CONTENITORE 1           */
/* ------------------------------ */

.contenitore-blc-centrato-spc-btw {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    }




/* ------------------------------------------ */
/*        INTERNI A CONTENITORE 1             */
/* ------------------------------------------ */
 
/* BLOCCHI INTERNI AL CONTENITORE 1 CENTRATI IN VERTICALE */

/* due elementi allineati alle estremità destra e sinistra */

.elm-blc-centrato-dx-auto  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }

.elm-blc-centrato-sx-auto  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }


/* 4 elementi allineati a sinistra con una larghezza del 20% e l'ultimo tutto a destra */

.elm-blc-centrato-dx-20  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 20%;
    -ms-flex: 0 1 20%;
    flex: 0 1 20%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }

.elm-blc-centrato-sx-auto  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }



/* 3 elementi */
/* da modificare e ridurre solo a uno */
.elm-blc-centrato-dx-30  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 30%;
    -ms-flex: 0 1 30%;
    flex: 0 1 30%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }

.elm-blc-centrato-sx-30  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 30%;
    -ms-flex: 0 1 30%;
    flex: 0 1 30%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }

/*blocco centrato opzionale*/ 
.elm-blc-centrato-ctr-30 {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 30%;
    -ms-flex: 0 1 30%;
    flex: 0 1 30%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }



/* 2 elementi 66 e 33 */
/* da modificare e ridurre solo a uno */
.elm-blc-centrato-dx-66  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 66%;
    -ms-flex: 0 1 66%;
    flex: 0 1 66%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
      max-width: 64%;
  min-width: 64%;
    }

.elm-blc-centrato-sx-33  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 33%;
    -ms-flex: 0 1 33%;
    flex: 0 1 33%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
      max-width: 32%;
  min-width: 32%;
    }



/* BLOCCHI INTERNI AL CONTENITORE 1 ALLINEATI IN ALTO */

/* 2 elementi 66 e 33 */
/* da modificare e ridurre solo a uno */
.elm-blc-top-dx-66  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 66%;
    -ms-flex: 0 1 66%;
    flex: 0 1 66%;
    -webkit-align-self: start;
    -ms-flex-item-align: start;
    align-self: start;
      max-width: 66%;
  min-width: 64%;
    }

.elm-blc-top-sx-33  {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 33%;
    -ms-flex: 0 1 33%;
    flex: 0 1 33%;
    -webkit-align-self: start;
    -ms-flex-item-align: start;
    align-self: start;
      max-width: 32%;
  min-width: 32%;
    }



/* OPZIONE b.contenitore-blc-centrato due blocchi da 50 e 50 */
/* il seguente blocco può essere sostituito da elm-blc-centrato-sx e -dx */
.elm-blc-centrato-50 {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 50%;
    -ms-flex: 0 1 50%;
    flex: 0 1 50%;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    }






/* ---------------------------------------------------- */
/*        Due elementi con immagine e testo             */
/* ---------------------------------------------------- */

/*Usato in: blocco-2-elm-img-txt-i */
.blocco-2-elm-img-txt-i {width:100%; 
   display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;


}
.blocco-2-elm-img-txt-i .elm-2-img-txt-i-sx {max-width: 50%; width:  45%;  -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 48%;
    -ms-flex: 0 1 48%;
    flex: 0 1 48%;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto; padding:4px 4px 4px 0px; margin-top:24px;  }
.blocco-2-elm-img-txt-i .elm-2-img-txt-i-dx {max-width: 50%; width: 45%;  -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 48%;
    -ms-flex: 0 1 48%;
    flex: 0 1 48%;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;padding:4px 0px 4px 4px;  margin-top:24px;  }
.blocco-2-elm-img-txt-i .elm-img {width: 100%; height: 16vw; background-color: #eee; border-radius: 12px; line-height: 1; min-height: 220px;}
.blocco-2-elm-img-txt-i .elm-cat { }
.blocco-2-elm-img-txt-i .elm-tit { }
.blocco-2-elm-img-txt-i .elm-txt,.blocco-2-elm-img-txt-i .elm-txt p  { }





/* ---------------------------------------------------- */
/*                    Lista video                       */
/* ---------------------------------------------------- */

#listavideolat .video-cont {
	display: inline-block;
    position: relative;
    width: 220px;
	height: 160px;
	border-radius: 12px;
 }

#listavideolat a.filtro {
	border-radius: 12px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	z-index: 999;
}

#listavideolat iframe {
	border-radius: 12px;
/*
    position: absolute;
    top: 0;
    left: 0;
*/
    width: 100%;
    height: 100%;
}
#listavideolat .blocco-txt {
	display: inline-block;
	width: calc(100% - 250px);
	vertical-align: top;
 }