@charset "utf-8";
/* CSS Document */
body, html {
	margin: 0;
	padding: 0;
	
	font-family: "Roboto", sans-serif;
	font-weight: 400;
	font-style: normal;
	background-color:#000;
	overflow-y: auto;
}
	
.menu {
    position: fixed;
    top: 0;
    /*right: -400px;
    width: 400px;*/
	right: 0;
	width: 90vw;
	max-width: 400px;
    /*height: 100%;*/
	height: 100vh;
    background: #FFF;
    overflow-y: auto; /* Aggiungi scroll verticale */
    transition: transform 0.3s ease;
    z-index: 999;
  	transform: translateX(100%);
}

@media (max-width: 768px) {
    .menu {
        width: 100vw;
        max-width: 100vw;
    }
}

.no-scroll {
    overflow: hidden; /* Blocca lo scroll quando il menu è aperto */
}

	
#menu-btn {
	/*position: fixed;
	top: 50px;
	right: 50px;
	text-align: center;*/
	color: white;
}
	
#menu-btn2 {
	/*position: fixed;
	top: 50px;
	right: 50px;
	text-align: center;*/
	color: white;
}

.menu.open {
	/*right: 0;*/
	transform: translateX(0);
}
	
.il_footer {
	position: fixed;
	bottom: 0;
	left: 0;
	height: auto;
	background-color:#333;
	width:100%;
	z-index: 995;
}
	
.cabecera {
	position: fixed;
	top: 0;
	height: auto;
	background-color:#333;
	width:100%;
	z-index: 990;
}
	
.cabecera_pie {
	color:#FFF;
	text-decoration:none;
	background-color:#333;
}
	
.cabecera_link {
	color:#FFF;
	font-weight:bold;
	font-size:18px;
	text-decoration:none;
}
.cabecera_link:hover {
	color:#ccc;
	font-weight:bold;
	font-size:18px;
	text-decoration:none;
}
.cabecera_link_attivo {
	color:#666;
	font-weight:bold;
	font-size:18px;
	text-decoration:none;
}
.cabecera_link_attivo:hover {
	color:#ccc;
	font-weight:bold;
	font-size:18px;
	text-decoration:none;
}
	
.cabecera_link_m {
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
}
.cabecera_link_m:hover {
	color:#ccc;
	font-weight:bold;
	text-decoration:none;
}



.ximena_titulo{
	font-weight:400;
	font-size:28px;
	color:#FFF;
	text-decoration:none;
}
.ximena_titulo:hover{
	font-weight:400;
	font-size:28px;	
	color:#FFF;
	text-decoration:none;
}

.ximena_text_bot{
	font-weight:400;
	font-size:28px;
	color:#FFF;
	text-decoration:none;
}
.ximena_text_bot:hover{
	font-weight:400;
	font-size:28px;	
	color:#FFF;
	text-decoration:none;
}

.ximena_texto{
	font-weight:400;
	font-size:14px;	
	color:#FFF;
	text-decoration:none;
}
.ximena_texto:hover{
	font-weight:400;
	font-size:14px;	
	color:#FFF;
	text-decoration:none;
}

.texto_footer{
	font-weight:400;
	font-size:18px;
	color:#FFF;
}
	
.menu_link {
	color:#333;
	font-weight:300;
	text-decoration:none;
}
.menu_link:hover {
	color:#ccc;
	font-weight:300;
	text-decoration:none;
}

/*.cabecera {
            display: flex;
            justify-content: space-between;
            align-items: right;
            flex-wrap: wrap;
        }
        .cabecera_pie {
                width: 100%;
                white-space: normal;
                word-wrap: break-word;
                margin-top: 1rem;
                text-align: center;
        }
        @media (max-width: 576px) {
            .cabecera {
                flex-direction: column;
                align-items: flex-start;
            }
            .cabecera_links {
                width: 100%;
                text-align: right;
                margin-bottom: 1rem;
            }
            .cabecera_pie {
                width: 100%;
                white-space: normal;
                word-wrap: break-word;
                margin-top: 1rem;
                text-align: center;
            }
        }*/

/* Per i bottoni foto delle liste*/
.foto_bot_liste {
	width: 300px; /* Specifica la larghezza desiderata del div */
	height: 300px; /* Specifica l'altezza desiderata del div */
	overflow: hidden; /* Nascondi eventuali parti dell'immagine che eccedono il contenitore */
	display: flex;
	justify-content: center;
	align-items: center;
}
.foto_bot_liste img {
	width: 100%;
	height: auto;
}

/* Per i bottoni foto delle publicazioni*/
.foto_bot_publi {
	width: 300px; /* Specifica la larghezza desiderata del div */
	height: 500px; /* Specifica l'altezza desiderata del div */
	overflow: hidden; /* Nascondi eventuali parti dell'immagine che eccedono il contenitore */
	display: flex;
	justify-content: center;
	align-items: center;
}
.foto_bot_publi img {
	width: 100%;
	height: auto;
}

.social-icon {
  font-size: 24px; /* Imposta la dimensione dell'icona */
  color: #FFF; /* Imposta il colore dell'icona */
}

.carousel-item img {
	width: 100%;
	height: 100vh;
	object-fit: cover;
}

.carousel-item {
	height: 100vh;
}
	
.content {
	position: absolute;
	top: 70%;
	left: 50%;
	transform: translate(-50%, -70%);
	width: 100%;
	text-align: center;
	color: white;
}

.subtitulo_port {
	font-size:22px;
}

/* QUESTO È PER LE ICONE DE FOOTER */
.icon-large_footer {
    font-size: 20px; /* default size */
}

@media (min-width: 768px) {
    .icon-large_footer {
        font-size: 30px; /* size for tablets */
    }
}

@media (min-width: 992px) {
    .icon-large_footer {
        font-size: 40px; /* size for desktops */
    }
}



.fade-in {
  opacity: 0;
  transition: opacity 3s ease-out;
}

.fade-in.visible {
  opacity: 1;
  transition: opacity 3s ease-in-out;
}

.slide-in {
  opacity: 0; /* Inizialmente invisibile */
  transition: opacity 1.5s ease, transform 1.5s ease; /* Transizioni per rendere l'effetto più fluido */
}

.slide-in.active {
  opacity: 1; /* Rende l'elemento visibile */
  transform: translate(0, 0); /* Anima lo spostamento dell'elemento */
}

.from-right {
  transform: translateX(100px); /* Spostamento iniziale dalla destra */
}

.from-left {
  transform: translateX(-100px); /* Spostamento iniziale dalla sinistra */
}


.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.roboto-thin-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.roboto-light-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.roboto-regular {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.roboto-regular-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.roboto-medium-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.roboto-bold {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.roboto-bold-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.roboto-black {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.roboto-black-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: italic;
}