@charset "utf-8";

/*	Import elementi */
	@import url("header.css");
	@import url("footer.css");

/*	Import font (Abhaya Libre per titoli e bottoni, Afacad Flux per i testi) */
	@import url("https://fonts.googleapis.com/css2?family=Abhaya+Libre:wght@400;500;600;700;800&family=Afacad+Flux:wght@100..1000&display=swap");

/*	Impostazione variabili */

	* {

	/*	COLOR PALETTE IN ORDINE DI IMPORTANZA */
		--Palette2: #000000;
		--Palette1: #bf0509;
		--Palette4: #8f0407; /* Solitamente l'HOVER di Palette1 */
		--Palette3: #bf0509; /* Solitamente l'HOVER di Palette2 */

	/*	DIMENSIONI FISSE (misurate dal Figma a 1920px, dove 1rem = 18px) */
		--Header_Height: 6.45rem;

	/*	PAGINA */
		--Page_Background_Color: #f8f8f8;
		--Page_Title_Color: #000000;
		--Page_Text_Color: #222222;
		--Link_Text_Color: var(--Palette1);

	/*	LOGHI */
		--Logo_Light: url(/repository/files/202610291035496AE3137584C2F870372260.png);
		--Logo_Dark: url(/repository/files/202610281736366AE2249402D83721925583.png);

	/*	FONTS */
		--Font_Normal: "Afacad Flux","Arial","Helvetica";
		--Font_Condensed: "Afacad Flux","Arial Narrow","Helvetica Condensed";
		--Font_Title: "Abhaya Libre","Georgia","Times New Roman",serif;

	/*	HEADER */
		--Header_Background_Color: #ffffff;
		--Header_Background_Border_Color: #ffffff;
		--Header_Text_Color: #000000;

		--Header_Font: var(--Font_Title);
		--Header_Search_Box_Font: var(--Font_Normal);
		--Header_Menu_Font: var(--Font_Title);

		--Header_Menu_Buttons_Text: #ffffff;
		--Header_Menu_Buttons_Background: #000000;
		--Header_Menu_Buttons_Text_Hover: #ffffff;
		--Header_Menu_Buttons_Background_Hover: var(--Palette1);

		--Header_SubMenu_Background: #000000;
		--Header_SubMenu_Buttons_Text: #ffffff;
		--Header_SubMenu_Buttons_Background: transparent;
		--Header_SubMenu_Buttons_Text_Hover: #ffffff;
		--Header_SubMenu_Buttons_Background_Hover: var(--Palette1);

	/*	FOOTER */
		--Footer_Background: #000000;
		--Footer_Text_Color: #ffffff;
		--Footer_Text_Font_Size: 0.9rem;
		--Footer_Titles_Font_Size: 1.5rem;
		--Footer_Link_Color: #ffffff;
		--Footer_Link_Underline: none;
		--Footer_Logo_Height: 4rem;

	/*	SCROLLBARS */
		--Scrollbars_Width: 0.6rem;
		--Scrollbars_Color:#000000;
		--Scrollbars_Background:#dddddd;

	/*	ROTOR (a tutta larghezza, subito sotto l'header) */
		--Rotor_OffsetTop: var(--Header_Height);
		--Rotor_MaxWidth:unset;
		--Rotor_MaxHeight:unset;

	/*	BOX EVENTI */
		--Box_Evento_Background_Color: transparent;
		--Box_Evento_Border_Color: #000000;
		--Box_Evento_Hover_Color: #d0001a;
		--Box_Evento_Titles_Color: #000000;
		--Box_Evento_Titles_Font: var(--Font_Title);
		--Box_Evento_Title_FontSize: 2.2rem;
		--Box_Evento_Subtitle_FontSize: 1.1rem;
		--Box_Evento_Authors_Color: #666666;
		--Box_Evento_Authors_Font: var(--Font_Normal);
		--Box_Evento_Button_Font: var(--Font_Normal);
		--Box_Evento_Button_Text_Color: #d0001a;
		--Box_Evento_Button_Background: #ffffff;
		--Box_Evento_Date_Color: #000000;
		--Box_Evento_Date_Font: var(--Font_Normal);
		--Box_Evento_Date_FontSize: 1.1rem;
		--Box_Evento_Abstract_Color: #666666;
		--Box_Evento_Abstract_Font: var(--Font_Normal);
		--Box_Evento_Abstract_FontSize: 0.9rem;

	/*	BOX NOTIZIA VERTICALE */
		--Notizia_Background: #ffffff;
		--Notizia_Titles_Color: #000000;
		--Notizia_Titles_Font: var(--Font_Title);
		--Notizia_Title_FontSize: 1.9rem;
		--Notizia_Subtitle_FontSize: 1.2rem;
		--Notizia_Button_Font: var(--Font_Normal);
		--Notizia_Button_Text_Color: #ffffff;
		--Notizia_Button_Background: var(--Palette1);
		--Notizia_Abstract_Color: var(--Page_Text_Color);
		--Notizia_Abstract_Font: var(--Font_Normal);
		--Notizia_Abstract_FontSize: 1rem;

	}


/*	Regole CSS comuni */
	HTML, BODY {
		margin:0;
		padding:0;
		border:0;
		width:100%;
		font-family: var(--Font_Normal);
		background-color: var(--Page_Background_Color);
	}
	
	A, A:visited, A:active { color:var(--Link_Text_Color); }

	.NotVis {
		position: absolute;
		left:-5000vw;
		top:-5000vw;
	}

/*	Spinner */

	@-webkit-keyframes Spin {
		from {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
		to {
			-webkit-transform: rotate(359deg);
			transform: rotate(359deg);
		}
	}
	@keyframes Spin {
		from {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
	to {
			-webkit-transform: rotate(359deg);
			transform: rotate(359deg);
		}
	}
	#SpinnerOverlay {
		display: none;
		position: fixed;
		left:0;
		top:0;
		width:100%;
		height: 100vh;
		z-index: 12000;
		overflow: hidden;
		overscroll-behavior: contain;
		background-color: #ffffffdd;
	}
	#SpinnerOverlay .Spinner {
		position: absolute;
		left:50%;
		top:50%;
		margin-left:calc(-3.5rem - 0.75rem);
		margin-top:calc(-3.5rem - 0.75rem);
		display: block;
		height: 7rem;
		width: 7rem;
		border-radius: 50%;
	}
	#SpinnerOverlay .Spin1 {
		border: 1.5rem #e0e0e0 solid;
		border-top: 1.5rem var(--Palette2) solid;
		-webkit-animation: Spin 1s infinite linear;
		animation: Spin 1s infinite linear;
	}
	#SpinnerOverlay .Spin2 {
		border: 1.5rem transparent solid;
		border-top: 1.5rem var(--Palette1) solid;
		-webkit-animation: Spin 1.5s infinite linear;
		animation: Spin 1.5s infinite linear;
	}



/*	Settaggio scrolbars */

	::-webkit-scrollbar {
		-webkit-box-shadow: none;
		width: var(--Scrollbars_Width);
		background-color:var(--Scrollbars_Background);
	}
	 
	::-webkit-scrollbar-track {
		-webkit-box-shadow: none;
		-webkit-border-radius: 0;
		border-radius: 0;
		background-color:transparent;
	}
	 
	::-webkit-scrollbar-thumb { 
		-webkit-box-shadow: none; 
		-webkit-border-radius: 0;
		border-radius: 0;
		background: var(--Scrollbars_Color);
		border:none;
	}
	::-webkit-scrollbar-thumb:window-inactive {
		background: var(--Scrollbars_Color);
	}





/*	-------------------------------------------------------------------------- */
/*	Mobile sino a 480 portrait (la maggior parte dei mobile) 
/*	-------------------------------------------------------------------------- */
	@media screen and (max-width: 440px) {

		* {
			--Header_Height: 4.5rem;

			--Box_Evento_Title_FontSize: 2rem;
			--Box_Evento_Subtitle_FontSize: 1.2rem;
			--Box_Evento_Date_FontSize: 1.1rem;
			--Box_Evento_Abstract_FontSize: 1.05rem;
		}

		HTML {
			font-size: 3.6vw;
		}
		/* Offset = header (4.5rem) + 5rem di respiro */
		.Container {
			display: block;
			max-width: 92vw;
			margin-left: auto;
			margin-right: auto;
			margin-top: calc(var(--Header_Height) + 5rem);
			margin-bottom: 2.5rem;
			color: var(--Page_Text_Color);
		}
		.Container H1.PageTitle {
			display: block;
			margin: 0;
			padding: 0;
			margin-bottom: 1.5rem;
			margin-top: -2rem;
			line-height: 1.1em;
			font-size: 3.1rem;
			font-family: var(--Font_Title);
			font-weight: 700;
			color: var(--Page_Title_Color);
			text-align: left;
		}
		.Container H2.PageSubtitle {
			display: block;
			margin: 0;
			padding: 0;
			margin-bottom: 1.5rem;
			line-height: 1.2em;
			font-size: 1.6rem;
			font-family: var(--Font_Normal);
			font-weight: 400;
			color: var(--Page_Text_Color);
			text-align: left;
		}

	}

/*	-------------------------------------------------------------------------- */
/*	Desktop sino a 1366 (la maggior parte dei notebook) 
/*	-------------------------------------------------------------------------- */
	@media screen and (min-width: 441px) and (max-width: 1366px) {

		HTML {
			font-size: 1.32vw;
		}

		/* Offset = header (6.45rem) + 3rem di respiro; larghezza = card evento del Figma (1200px) */
		.Container {
			display: block;
			max-width: 66.7rem;
			margin-left: auto;
			margin-right: auto;
			margin-top: calc(var(--Header_Height) + 3rem);
			margin-bottom: 5.5rem;
			color: var(--Page_Text_Color);
		}
		.Container H1.PageTitle {
			display: block;
			margin: 0;
			padding: 0;
			margin-bottom: 1.0rem;
			line-height: 1em;
			font-size: 3.5rem;
			font-family: var(--Font_Title);
			font-weight: 700;
			color: var(--Page_Title_Color);
			text-align: left;
		}
		.Container H2.PageSubtitle {
			display: block;
			margin: 0;
			padding: 0;
			margin-bottom: 1.5rem;
			line-height: 1em;
			font-size: 1.9rem;
			font-family: var(--Font_Normal);
			font-weight: 400;
			color: var(--Page_Text_Color);
			text-align: left;
		}
		
	}

/*	-------------------------------------------------------------------------- */
/*	Schermi sopra i 1366 (solitamente fullHD) 
/*	-------------------------------------------------------------------------- */
	@media screen and (min-width: 1367px) {

		HTML {
			margin:0px;
			padding:0px;
			width:100%;
			height:100%;
			font-size: 18px;
		}

	/*	------------------------------------------------------------- */
		/* Offset = header (6.45rem) + 3rem di respiro; larghezza = card evento del Figma (1200px) */
		.Container {
			display: block;
			max-width: 66.7rem;
			margin-left: auto;
			margin-right: auto;
			margin-top: var(--Header_Height);
			margin-bottom: 5.5rem;
			padding-top: 3rem;
			color: var(--Page_Text_Color);
		}
		.Container H1.PageTitle {
			display: block;
			margin: 0;
			padding: 0;
			margin-bottom: 3.0rem;
			line-height: 1em;
			font-size: 3.5rem;
			font-family: var(--Font_Title);
			font-weight: 700;
			color: var(--Page_Title_Color);
			text-align: left;
		}
		.Container H2.PageSubtitle {
			display: block;
			margin: 0;
			padding: 0;
			margin-bottom: 1.5rem;
			margin-top: -2rem;
			line-height: 1em;
			font-size: 1.9rem;
			font-family: var(--Font_Normal);
			font-weight: 400;
			color: var(--Page_Title_Color);
			text-align: left;
		}
		
	}