/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
* { font-family: 'Montserrat'; } */

:root {
	--light-yellow: #ffffcc;
}

.bg-light-yellow { background-color: var(--light-yellow) !important; }
.text-outline-color-yellow { -webkit-text-stroke-color: var(--yellow) !important; }

/* -- header -- */
header .navbar-brand img { max-height: 55px; }
/* ------- */

/* -- chisiamo -- */
.box-shadow-visione { box-shadow: 0 0 15px -3px white; }
.interactive-banner-style-02:not(:hover) .readmore { display: none; }
.interactive-banner-style-02:hover .readless { display: none !important; }
/* ------- */

/* -- spazi -- */
.popover { --bs-popover-max-width: min(100%, 500px); }
.popover-header { padding: 0 0 0 12px; background: var(--base-color); }
.popover-body { max-height: 300px; overflow-y: auto !important; }

.swiper-pagination-bullet { margin: 0 10px !important; transition: all linear .1s; }
.swiper-pagination-bullet:hover { opacity: .7; }
.swiper-pagination-bullet:hover, .swiper-pagination-bullet-active {
	background: var(--base-color);
	box-shadow: 0 0 6px -1px black;
	transform: scale(1.4);
}
/* ------- */

/* -- eventi -- */
.hover-box:hover .feature-box-content { opacity: 0; }
.feature-box:hover { cursor: pointer; }
/* ------- */


/* ----------------------------------------------------------------
	Stazione meteo - CSS originario di meteopiemonte.com
-----------------------------------------------------------------*/

.content-wrap {
	position: relative;
	padding: 80px 0;
	overflow: hidden;
}

.cursor-pointer { cursor: pointer; }
#page-title p { line-height: 1; }
#header-wrap { z-index: 99999; }


.wdg-weather {
	display: inline-block;
	position: relative;
	width: 100%;
	background: #000000c7;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 0 10px rgb(0 0 0 / 26%);
}
.wdg-weather:not(.h-100) { height: 200px; }
.wdg-weather.h-100 { min-height: 80px; }

.content-part {
	z-index: 3;
	display:grid;
	align-content: center;
	justify-content: center;
	position: relative;
	width: 100%;
	color: #fff !important;
}
.content-part:not(.h-100) { height: 200px; }
.content-part.h-100 { min-height: 80px; }

.content-part h6,
.content-part h3,
.content-part h4{
   margin: 8px 5px;
   color: #fff;
}
.wdg-weather figure {
	display: inline-block;
	position:absolute;
	width: 100%;
	left: 0;
	right: 0;
	top:0;
}
.wdg-weather:not(.h-100) figure { height: 200px; }
.wdg-weather.h-100 figure { min-height: 80px; }

.wdg-weather figure img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	opacity: 0.3;
}


.rain{
    height: 100vh;
    background-image: url(/images/img_animated/rain.png);
    animation: rain 0.3s linear infinite;
	position: absolute;
	z-index: 2;
	left: 0;
	right: 0;
	width: 100%;
	top:0;
}
@keyframes rain {
    0%{
        background-position: 0% 0%;
    }
    100%{
        background-position: 20% 100%;
    }
}
.rain::before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(/images/img_animated/lightining.png);
    top: -100px;
    transform: rotate(180deg);
    animation: lightining 4s linear infinite;
    opacity: 1;
	left: 0;
	right: 0;
	width: 100%;
	top:0;

}
@keyframes lightining {
    0%{
        opacity: 0;
    }
    20%{
        opacity: 0;
    }
    21%{
        opacity: 1;
    }
    25%{
        opacity: 0;
    }
    30%{
        opacity: 0;
    }
    31%{
        opacity: 1;
    }
    35%{
        opacity: 0;
    }
    100%{
        opacity: 0;
    }
}




.sunny {
	position: absolute;
	top:5px;
	left: 10px;
	width: 5rem;
	height: 5rem;
	margin-top: 4rem;
  }
  
  .sunny:before,
  .partly_cloudy__sun:before {
	content: "";
	position: absolute;
	height: 80%;
	width: 80%;
	top: 10%;
	right: 10%;
	border-radius: 50%;
	z-index: 2;
	background-color: #f1c40f;
	background-image: radial-gradient(#f1c40f, #f39c12);
	box-shadow: 0 0 25px #917508;
  }
  .sunny:after,
  .partly_cloudy__sun:after {
	content: "";
	position: absolute;
	height: 100%;
	width: 100%;
	border-radius: 50%;
	z-index: 1;
	background-color: #f39c12;
	will-change: opacity, transform;
	animation: fadeIn 2s linear infinite reverse, scaleDown 2s linear infinite reverse;
  }
  
  .cloudy {
	position: relative;
	width: 5rem;
	height: 5rem;
  }
  
  .cloudy:before,
  .partly_cloudy__cloud:before,
  .rainy__cloud:before,
  .thundery__cloud:before {
	content: "";
	position: absolute;
	height: 40%;
	width: 40%;
	top: 30%;
	right: 0%;
	border-radius: 50%;
	border-bottom-left-radius: 0;
	z-index: 2;
	background-color: #ecf0f1;
	background-image: radial-gradient(#ecf0f1, #bdc3c7);
	box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
  }
  .cloudy:after,
  .partly_cloudy__cloud:after,
  .rainy__cloud:after,
  .thundery__cloud:after {
	content: "";
	position: absolute;
	height: 60%;
	width: 70%;
	top: 10%;
	right: 30%;
	border-radius: 50%;
	border-bottom-right-radius: 0;
	z-index: 1;
	background-color: #ecf0f1;
	background-image: radial-gradient(#ecf0f1, #bdc3c7);
	box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
  }
  
  .partly_cloudy {
	position: relative;
	width: 5rem;
	height: 5rem;
  }
  .partly_cloudy__sun {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
  }
  .partly_cloudy__cloud {
	position: absolute;
	width: 60%;
	height: 60%;
	top: 40%;
	z-index: 2;
	will-change: transform;
	-webkit-animation: translateUp 2s linear infinite alternate;
			animation: translateUp 2s linear infinite alternate;
  }
  
  .rainy,
  .thundery {
	position: relative;
	width: 5rem;
	height: 5rem;
  }
  .rainy__cloud,
  .thundery__cloud {
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 2;
  }
  .rainy__cloud:before,
  .thundery__cloud:before {
	background-color: #95a5a6;
	background-image: radial-gradient(#95a5a6, #7f8c8d);
  }
  .rainy__cloud:after,
  .thundery__cloud:after {
	background-color: #95a5a6;
	background-image: radial-gradient(#95a5a6, #7f8c8d);
  }
  .rainy__rain,
  .thundery__rain {
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 1;
	overflow: hidden;
  }
  .rainy__rain:before,
  .thundery__rain:before {
	content: "";
	position: absolute;
	height: 80%;
	width: 20%;
	top: 20%;
	right: 50%;
	z-index: 1;
	background-image: linear-gradient(transparent, #94cdd1);
	will-change: opacity, transform;
	-webkit-animation: fadeIn 1s ease-out infinite reverse, scaleUp 1s ease-out infinite;
			animation: fadeIn 1s ease-out infinite reverse, scaleUp 1s ease-out infinite;
  }
  .rainy__rain:after,
  .thundery__rain:after {
	content: "";
	position: absolute;
	height: 60%;
	width: 20%;
	top: 40%;
	right: 20%;
	z-index: 1;
	opacity: 0;
	background-image: linear-gradient(transparent, #94cdd1);
	will-change: opacity, transform;
	-webkit-animation: fadeIn 2s ease-out 0.4s infinite reverse, scaleUp 2s ease-out 0.4s infinite;
			animation: fadeIn 2s ease-out 0.4s infinite reverse, scaleUp 2s ease-out 0.4s infinite;
  }
  
  .thundery__cloud:before {
	background-color: #4d5656;
	background-image: radial-gradient(#4d5656, #393c3c);
	-webkit-animation: thunder 4s linear 0.02s infinite alternate;
			animation: thunder 4s linear 0.02s infinite alternate;
  }
  .thundery__cloud:after {
	background-color: #4d5656;
	background-image: radial-gradient(#4d5656, #393c3c);
	-webkit-animation: thunder 4s linear infinite alternate;
			animation: thunder 4s linear infinite alternate;
  }
  .thundery__rain:before {
	-webkit-animation: fadeIn 0.5s ease-out infinite reverse, scaleUp 0.5s ease-out infinite;
			animation: fadeIn 0.5s ease-out infinite reverse, scaleUp 0.5s ease-out infinite;
  }
  .thundery__rain:after {
	-webkit-animation: fadeIn 0.75s ease-out 0.2s infinite reverse, scaleUp 0.75s ease-out 0.2s infinite;
			animation: fadeIn 0.75s ease-out 0.2s infinite reverse, scaleUp 0.75s ease-out 0.2s infinite;
  }
  
  @-webkit-keyframes fadeIn {
	0% {
	  opacity: 0;
	}
	100% {
	  opacity: 1;
	}
  }
  
  @keyframes fadeIn {
	0% {
	  opacity: 0;
	}
	100% {
	  opacity: 1;
	}
  }
  @-webkit-keyframes scaleDown {
	0% {
	  transform: scale(1);
	}
	100% {
	  transform: scale(0.8);
	}
  }
  @keyframes scaleDown {
	0% {
	  transform: scale(1);
	}
	100% {
	  transform: scale(0.8);
	}
  }
  @-webkit-keyframes translateUp {
	0% {
	  transform: translatey(15%);
	}
	100% {
	  transform: translatey(0);
	}
  }
  @keyframes translateUp {
	0% {
	  transform: translatey(15%);
	}
	100% {
	  transform: translatey(0);
	}
  }
  @-webkit-keyframes scaleUp {
	0% {
	  transform: scaley(0);
	}
	100% {
	  transform: scaley(1);
	}
  }
  @keyframes scaleUp {
	0% {
	  transform: scaley(0);
	}
	100% {
	  transform: scaley(1);
	}
  }
  @-webkit-keyframes thunder {
	0% {
	  box-shadow: 0 0 25px #fff;
	}
	2% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	49% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	50% {
	  box-shadow: 0 0 25px #fff;
	}
	52% {
	  box-shadow: 0 0 25px #f7db6e;
	}
	53% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	69% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	70% {
	  box-shadow: 0 0 25px #fff;
	}
	71% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	75% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	76% {
	  box-shadow: 0 0 25px #fff;
	}
	77% {
	  box-shadow: 0 0 25px #a8d3f0;
	}
	78% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	100% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
  }
  @keyframes thunder {
	0% {
	  box-shadow: 0 0 25px #fff;
	}
	2% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	49% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	50% {
	  box-shadow: 0 0 25px #fff;
	}
	52% {
	  box-shadow: 0 0 25px #f7db6e;
	}
	53% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	69% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	70% {
	  box-shadow: 0 0 25px #fff;
	}
	71% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	75% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	76% {
	  box-shadow: 0 0 25px #fff;
	}
	77% {
	  box-shadow: 0 0 25px #a8d3f0;
	}
	78% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
	100% {
	  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
	}
  }


  
@keyframes clouds-loop-1 {
	to {
	  background-position: -1000px 0;
	}
  }
  .clouds-1 {
	background-image: url("/images/img_animated/clouds_2.png");
	animation: clouds-loop-1 20s infinite linear;
  }
  
  @keyframes clouds-loop-2 {
	to {
	  background-position: -1000px 0;
	}
  }
  .clouds-2 {
	background-image: url("/images/img_animated/clouds_1.png");
	animation: clouds-loop-2 15s infinite linear;
  }
  
  @keyframes clouds-loop-3 {
	to {
	  background-position: -1579px 0;
	}
  }
  .clouds-3 {
	background-image: url("/images/img_animated/clouds_3.png");
	animation: clouds-loop-3 17s infinite linear;
  }
  .clouds {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
	opacity: 0.4;
	pointer-events: none;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	right: 0;
	height: 100%;
  }
  
  .clouds-1,
  .clouds-2,
  .clouds-3 {
	background-repeat: repeat-x;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 500px;
  }

  .sunny-div{
	background: #b3aeae !important;
  }
  .raing-div{
	background: #181818 !important;
  }
  .raing-div figure img{
	opacity: 0.6;
  }
  .raing-div .rain::before{
     display: none;
  }

.snow{
    height: 100vh;
    background-image: url(/images/img_animated/snow.png);
    animation: snow 3.3s linear infinite;
	position: absolute;
	z-index: 2;
	left: 0;
	right: 0;
	width: 100%;
	top:0;
}
@keyframes snow {
    0%{
        background-position: 0% 0%;
    }
    100%{
        background-position: 20% 100%;
    }
}
.snow::before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(/images/img_animated/snow.png);
    top: -100px;
    transform: rotate(180deg);
    animation: lightining 4s linear infinite;
    opacity: 1;
	left: 0;
	right: 0;
	width: 100%;
	top:0;

}

	.button-post {
		margin: 10px 0 0 0;
	}
	
	.webcam-img {
		max-height: 450px;
	}
	
	
	/*******************************************************************
						Pagina Previsioni Location 
	*******************************************************************/
		
	.weekly-div .col {
		margin-bottom: 25px;
	}
	
	.weather-day {
		/*Bk 2023-08-03
		background: rgb(58 157 190 / 55%);
		box-shadow: 0 0 10px rgb(0 0 0 / 26%);
		*/
		width: 100%;
		border-radius: 8px;
		color: #fff;
		padding: 30px 0px 0px 0px;
		justify-content: center;
		text-align: center;
		position: relative;
		background: #3a9dbe !important;
		border: 3px solid #dfeff5;
		box-shadow: 0 0 5px 0px black;
	}
	
	.weather-day h4 {
		color: #fff;
		margin: 0;
		/* margin-bottom: 25px; */
	}
	
	.weather-riep {
		/*Bk 2023-08-03
		min-height: 150px;
		color: #fff;
		padding: 0 30px;
		background: rgb(58 157 190 / 55%);*/
		border: 3px solid var(--yellow);
		align-content: center;
		border-radius: 8px;
		justify-content: center;
		text-align: center;
		position: relative;
		margin-bottom: 10px;		
		min-height: initial;
		color: black !important;
		padding: 10px;
		background: var(--light-yellow) !important;
	}
	.weather-riep:not(.col-2) { width: 100%; }
	.weather-riep img { max-width: 40px; }
	.weather-riep p > span { display: block; }
	@media(min-width:682px;max-width:991px){
		.weather-riep img { max-width: 30px; }
		.weather-riep p > span { display: inline; }
	}
	
	.weather-riep h2, .weather-riep h5 {
		font-weight: 600 !important;
	}
	
	.weather-riep h2 {
		font-size: 30px !important;
	}
	
	.weather-riep h5 {
		font-size: 0.875rem !important;
	}
	
	.weather-riep h5, h6 {
		margin: 0;
	}
	
	.icon-wheather-riep {
		text-align: center;
		max-height: 60px;
	}
	
	.weather-riep sup, .weather-riep sub {
		font-size: 14px;
	}

	.img-responsive .icon-tday { 
		max-height: 150px;
	}
		
	.mp-widdate {
		margin: 0;
	}
	
	.mp-widdata {
	  padding: 5px;
	  font-size: 16px;
	}
	.mp-widdata.mp-tmin {
		/*Bk 2023-08-03
	  background: #338BD7;
	  color: #fff;
		*/
		background: #dfeff5;
		color: #3a9dbe;
		font-weight: bold;
	}
	.mp-widdata.mp-tmax {
		/*Bk 2023-08-03
		background-color: #ffa435;
		*/
		color: #fff;
		background-color: #be4b3a;
		font-weight: bold;
	}
	.mp-widdata.mp-prp {
		font-weight: bold;
	}

	.altri-giorni {
			position: absolute;
			bottom: 3px;
			width: 100%;
			z-index: 9999;
		}
		.altri-giorni p { white-space: nowrap; }
		@media(max-width:500px){
			.altri-giorni * { font-size: .9rem; }
		}
		@media(max-width:400px){
			.altri-giorni * { font-size: .8rem; }
		}
		.altri-giorni i { font-size: 1.1rem; }	
		
	/*******************************************************************
							Pagina Webcam
	*******************************************************************/
		
	.webcam-title { margin: 20px 0 5px 0 !important; }
		
	.webcam-img img {
		height: 230px;
		width: 100%;
		object-fit: cover;
	}
		
	.webcam-title {
		margin: 20px 0 0 0 !important;
		background: #3A9DBE;
		color: #fff;
		font-family: 'Lato', sans-serif;
		font-size: 1.2em;
		padding: 3px 11px;
	}
	.container-popup .lead { line-height: 1.5rem; }
	.loader-iframe {
		background-image: url("/images/loading.gif");
		background-size: initial;
		background-repeat: no-repeat;
		background-position: center;
	}
	
	
	
	/********************************************************
				Pagina previsioni
	********************************************************/
	.wdg-weather { height: 230px !important; }
	.wdg-weather:not(.h-100) figure { height: 230px; }
	.wdg-weather:not(.h-100) .content-part { height: 230px; }
	
	.altri-giorni .bi-thermometer-snow { color: #3a9dbe; }
	.altri-giorni .bi-thermometer-sun { color: #be4b3a; }
	
	.lead.descr-previsione {
		line-height: 1.8rem !important;
		font-size: 1.1rem;
	}
	
	a.wdg-weather:hover { box-shadow: 0 0 12px 0 black; }
	#container-pagina-previsioni .weather-day { background: #343434 !important; }
	#container-pagina-previsioni .flex-control-nav { padding: 10px; }
	#container-pagina-previsioni .flex-control-nav li {
		width: 15px;
		height: 15px;
	}
	#container-pagina-previsioni .flex-control-nav li a {
		background: #dfeff5;
		border: 2px solid #3a9dbe;
	}
	#container-pagina-previsioni .flex-control-nav li:hover a, .flex-control-nav li a.flex-active {
		background-color: #3a9dbe;
		border: 1px solid white;
		box-shadow: 0 0 3px 0px black;
	}
	#container-pagina-previsioni .mfp-counter { display: none; }
		
	.nav-previsioni-gioni .nav-link.active { font-weight: bold; }
	.nav-previsioni-gioni .canvas-tabs .nav-link.active, .nav-previsioni-gioni .canvas-tabs .nav-tabs .nav-item.show .nav-link, .nav-previsioni-gioni  .canvas-tabs.nav-tabs .nav-link.active, .canvas-tabs.nav-tabs .nav-tabs .nav-item.show .nav-link { padding-top: calc(var(--bs-nav-link-padding-y) + 3px); padding-bottom: calc(var(--bs-nav-link-padding-y) + 3px); }
	@media(max-width:500px){ .nav-previsioni-gioni .nav-item { display: block; width: 100%; } }
	
	
	
	/********************************************************
				Pagina previsioni e previsioni-localita
	********************************************************/
	.owl-carousel .owl-nav [class*=owl-] { opacity: 1 !important; }
	.owl-previsioni .oc-item { padding: 3px; }
	
	
	/********************************************************
				Pagina allerte meteo
	********************************************************/
	@media(min-width:575px){
		.border-top-lg-0 { border-top: 0 !important; }
		.mb-575px-0 { margin-bottom: 0 !important; }
		.navlink-giorno .testo-gg { display: inline; }
		.navlink-giorno .numero-gg { display: none; }
	}
	@media(max-width:575px){
		.mb-575px-0 { margin-bottom: 10px !important; }
		.navlink-giorno .testo-gg { display: none; }
		.navlink-giorno .numero-gg { display: inline; }
		.tabs { flex-direction: inherit;border-bottom: 0; }
	}
	
	.icon-allerta {
		height: 40px;
		position: relative;
		top: -2px;
		margin-right: 5px;
	}
	.icon-allerta.p-2 { padding: 6px !important; }
	
	#navs-allerte .nav-item { position: relative; }
	#navs-allerte .navlink-allerta { padding-left: 40px; }
	.canvas-tabs .navlink-allerta.active, .canvas-tabs .nav-tabs .nav-item.show .nav-link, .canvas-tabs.nav-tabs .navlink-allerta.active, .canvas-tabs.nav-tabs .nav-tabs .nav-item.show .navlink-allerta { padding-top: calc(var(--bs-nav-link-padding-y) + 1px); padding-bottom: calc(var(--bs-nav-link-padding-y) + 1px); }
	
	.allerta-presente {
		position: absolute;
		top: 2px;
		left: 2px;
		/*background-color: white;*/
		padding: 0px 6px 1px 5px;
		border-bottom-right-radius: 50%;
		font-size: 1.2rem;
	}
	
	@media(max-width:575px){
		.navlink-giorno:not(.active) { background: #f4f4f4; }
	}
	
	
	
	/********************************************************
				Lightbox della previsione
	********************************************************/
	.mfp-bg { z-index: 999999; }
	.mfp-wrap { z-index: 999999; }
	
	/********************************************************
				Pagina delle stazioni meteo
	********************************************************/
	.icon-direzione-vento {
		width: 28px;
		height: 28px;
		position: absolute;
		font-size: 1.7rem;
		color: black;
	}
		
	.icon-direzione-vento.N { top: 28px; left: 1px; transform: rotate(90deg); }
	.icon-direzione-vento.S { bottom: 32px; right: 18px; transform: rotate(270deg); }
	.icon-direzione-vento.E { top: 8px; right: 39px; transform: rotate(180deg); }
	.icon-direzione-vento.W { top: -4px; left: 23px; }
	.icon-direzione-vento.SE { bottom: 19px; right: 36px; transform: rotate(225deg); }
	.icon-direzione-vento.SW { bottom: 28px; left: 11px; transform: rotate(315deg); }
	.icon-direzione-vento.NE { top: 24px; right: 28px; transform: rotate(135deg); }
	.icon-direzione-vento.NW { top: 16px; left: 18px; transform: rotate(45deg); }
	
	.icon-direzione-vento.NNW { top: 22px; left: 13px; transform: rotate(67.5deg); }
	.icon-direzione-vento.NNE { top: 26px; right: 20px; transform: rotate(112.5deg); }
	.icon-direzione-vento.SSW { bottom: 30px; right: 3px; transform: rotate(292.5deg); }
	.icon-direzione-vento.SSE { bottom: 26px; right: 31px; transform: rotate(242deg); }
	
	.icon-direzione-vento.WNW { top: 10px; left: 20px; transform: rotate(33deg); }
	.icon-direzione-vento.WSW { bottom: 24px; left: 17px; transform: rotate(337.5deg); }
	.icon-direzione-vento.ENE { top: 20px; right: 32px; transform: rotate(157.5deg); }
	.icon-direzione-vento.ESE { bottom: 14px; right: 38px; transform: rotate(208deg); }
	
	
	.leaflet-bar-horizontal {
		width: fit-content;
		display: flex;
		flex-wrap: wrap;
		margin: 0 !important;
	}
	.info.legend {
		margin-left:0 !important;
		max-width: min(400px, 100%);
	}
	.info.legend img {
		width: 100%;
		max-width: 45px;
	}
	@media(max-width:400px){
		.info.legend img { max-width: 30px; }
	}
	@media(max-width:380px){
		.info.legend img, .info.legend .w-25 { display: none; }
	}
	
	
	.filter-dati,
	.filter-dati a {
		width: 45px !important;
		height: 45px !important;
		background: white;
	}
	.filter-dati a:hover,
	.filter-dati.active a { background: #e8e6e6; }
	
	.box-dettagli-stazione {
		box-shadow: 0 0 8px 0 black;
		position: relative;
	}
	.box-dettagli-stazione h2 { font-weight:900 }
	.box-dettagli-stazione .btnClose {
		position:absolute;
		top: 10px;
		right: 10px;
	}
			
	.custom-marker-pin {
		width: 35px;
		height: 35px;
		border-radius: 50% 50% 50% 0;
		background: black;
		position: absolute;
		transform: rotate(-45deg);
		left: 50%;
		top: 50%;
		margin: -20px 0 0 -25px;
		z-index: 2;
	}
	.custom-marker-pin::after {
		content: '';
		/*width: 27px;
		height: 27px;
		margin: 4px;*/
		width: 29px;
		height: 29px;
		margin: 3px;
		background: #fff;
		position: absolute;
		border-radius: 50%;
	}
	.custom-div-icon span {
		position: relative;
		top: 8px;
		margin-left: -4px;
		text-align: center;
		display: block;
		width: 27px;
		font-size: .7rem;
		z-index: 3;
	}
	.custom-div-icon span > b { font-weight: 800; }
	
	.custom-div-icon { --colore-info: #36deff; }
	.custom-div-icon .text-info { color: var(--colore-info) !important; }
	.custom-div-icon .bg-info { background-color: var(--colore-info) !important; }

	.custom-marker-pin.temp::after{
		background: #fb6423;
	}

	.custom-map-pin {
		font-size: .7.72rem;
		font-weight: 800;
	}
	
	.span-su-due-righe { top:5px !important;  line-height:1; }
	
	.imgnews { max-width: min(450px, 50%) !important; }
	@media(max-width:761px){
		.imgnews { max-width: 100% !important; }
	}
	.news-contenuto p { margin-bottom: 15px !important; }
	
	.bg-icon {
		display: block;
		position: absolute;
		bottom: -60px;
		right: -50px;
		font-size: 210px;
		color: rgba(var(--cnvs-contrast-rgb),.1)
	}
	.bg-primary-chiaro { background-color: #34495e; }
	.section-storico .fbox-outline .fbox-icon a {
		border: 3px solid #3A9DBE;
		padding: 0.25rem;
		border-radius: 50%;
	}
	.section-storico .fbox-icon { width: 90px; height: 65px; }

/*--- pulsanti allerta sopra la mappa in /previsioni/ ---*/
.div-container-pulsanti-allerte { position: absolute; top: 20px; left: 10px; z-index: 10; width:60%; height: 40px; }

.icona-allerta { background: #c35958; border: 1px solid black; border-radius: 8px; cursor: pointer; display: inline-block; width: 40px; height: 40px; }
.icona-allerta > div { width:100%; height: 100%; }
.icona-allerta:hover > div { background: initial; background-color: white; }
.icona-allerta.icona-neve > div { position: relative; width: 74%; height: 74%; top: 14%; left: 14%; }


.icona-piogge > div { background: url(/images/icons/allerte/piogge.svg) no-repeat center / contain; mask: url(/images/icons/allerte/piogge.svg) no-repeat center / contain; -webkit-mask: url(/images/icons/allerte/piogge.svg) no-repeat center / contain; }
.icona-grandine > div { background: url(/images/icons/allerte/grandine.svg) no-repeat center / contain; mask: url(/images/icons/allerte/grandine.svg) no-repeat center / contain; -webkit-mask: url(/images/icons/allerte/grandine.svg) no-repeat center / contain; }
.icona-neve > div { background: url(/images/icons/allerte/neve.svg) no-repeat center / contain; mask: url(/images/icons/allerte/neve.svg) no-repeat center / contain; -webkit-mask: url(/images/icons/allerte/neve.svg) no-repeat center / contain; }
.icona-temperature > div { background: url(/images/icons/allerte/temperature.svg) no-repeat center / contain; mask: url(/images/icons/allerte/temperature.svg) no-repeat center / contain; -webkit-mask: url(/images/icons/allerte/temperature.svg) no-repeat center / contain; }
.icona-vento > div { background: url(/images/icons/allerte/vento.svg) no-repeat center / contain; mask: url(/images/icons/allerte/vento.svg) no-repeat center / contain; -webkit-mask: url(/images/icons/allerte/vento.svg) no-repeat center / contain; }
/*---*/

.testo-backlink { font-size: .7rem; line-height: .9rem !important; }

.jumbotron p.lead{ font-size: 12px; margin: 0; }

