/* CSS Document */

/*
@media (min-width: 576px) {}
@media (min-width: 768px) {}
@media (min-width: 992px) {}
@media (min-width: 1200px) {}
*/

/* @import url('https://fonts.googleapis.com/css2?family=Encode+Sans+Semi+Condensed:wght@400;700&display=swap');  colors1 */
/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&display=swap');  colors2 */
 
html, body { height: 100%; }

/* body { font-family: 'Montserrat', Arial, Helvetica, sans-serif; } */
ul, ol { padding-left: 0px; }
#wrapper {} /* colors-css */
/*
#wrapper .clearfix .breaking-news {
	scroll-behavior: smooth;}
}
*/
/* .container {max-width: 1170px!important;} */

/* HEADER / MENU ***********************************************************/
#logo { border-right: 0px!important; } /* bordo separatore, a destra del logo */
/*
#logo .standard-logo { padding: 0px 8px 8px 8px !important; max-width: 100%!important; }
#logo .retina-logo { padding: 0px 8px 8px 8px !important; max-width: 100%!important; }
*/
.menu-container { border-right: 0px!important; } /* bordino a destra (dopo la bandiera..) */
.bandiera { max-width: 20px; height: auto; } /* bandierina scelta lingua*/
.submenu li { font-style: italic }
.menu-link {}

/* VIDEO HIGHLIGHTS ********************************************************/
/* videohighlights misure finestra modale (mpf: magnific popup) */
.mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 80vw; }
.mfp-bg {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1042;
	overflow: hidden;
	position: fixed;
}


/* *************************** SEZIONI *************************************************************************** */
#section-download, #section-topics, #section-interviste, #section-podcasts, #section-summaries, #section-altro { 
	padding-top: 3rem;
	font-size: 1.125rem;
}
#download_testo {
	color: #0D6F96;
	font-size: 33px;
    transition: background ease-in-out 0.3s, padding ease-in-out 0.3s;  
	text-transform: uppercase;
	font-weight: 500;
}
#download_btn button {
	float: none;
	border: none;
	cursor: pointer;	
	/* Arrotondo */
	/*border-radius: 0px 50px 50px 0px; 
	-moz-border-radius: 0px 50px 50px 0px; /* firefox 
	-webkit-border-radius: 0px 50px 50px 0px; /* safari, chrome */
	
	background: #17A5DD;
	color: #FFFFFF;
	font-size: 18px;
    transition: background ease-in-out 0.3s, padding ease-in-out 0.3s;  
	text-transform: uppercase;
	padding-top: 12px;
	padding-bottom: 10px;
	padding-left: 11px;
	padding-right: 11px;
	
}
#download_btn button:hover {
	background: #3DBBEB;
	color: #FFFE72;
	padding-left: 20px;
	padding-right: 20px;
}

/* TOPICS ********************/
#section-topics .item:not(:first-of-type) {padding-top: 20px;}
#section-topics .item:last-of-type {padding-bottom: 20px;}
#section-topics .item h2 {font-size: 1.5rem; line-height: normal; margin-bottom: 0.5rem;} 
#section-topics .argomento {padding-top: 12px;}
#section-topics .argomento img {}

/* INTERVISTE ********************/
.intervista .dottore .nome { font-size: 1.2rem; margin: 10px 0px 0px 0px; } /* titolo e nome */
.intervista .dottore .affiliazione { font-size: 0.9rem; font-weight: 300; line-height: 1.2rem; padding-bottom: 0px; margin-bottom: 14px; }
.intervista .dottore .lingua { font-size: 0.8rem; margin: 10px 0px 0px 0px; } /* lingua intervista */
/* tasti domanda */
.intervista .dottore .domanda { 
	font-size: 1rem; padding: 10px; margin-bottom: 5px; 
}
.domanda ul, .domanda ol { 
	margin-bottom: 4px;
	padding-left: 18px;
	padding-top: 10px;
}
.intervista .dottore .domanda:hover { cursor: pointer; }
.intervista .dottore .domandaincorso {}
.intervista .dottore span.domandatime { font-size: 0.7rem;}

/* PODCASTS **************************************** */
.podcast { margin-bottom:2rem; }
.podcast .bg-podcast { } /* div colonna singolo podcast */

/* SUMMARIES INDICE ******************************** */
#section-summaries .item { padding: 10px; margin: 0px; padding-bottom: 20px; }
#section-summaries h2 { font-size: 1.5rem; line-height: normal; color: var(--base); }
#section-summaries .item .sx { text-align: left; }
#section-summaries .item .sx img { text-align: left; }
#section-summaries .item .sx .slidekits { padding: 0px 8px; }
#section-summaries .item .sx .slidekits a { margin:0px 2px!important;  }

#section-summaries .item .sx .slidekits .button { 
	margin-top: .3rem !important; 
	padding: 6px 10px !important;
	
	display: inline-block;              /* fondamentale per ::after */
	position: relative;

	transform: rotate(10deg);
	transition: transform 200ms ease-out;
	//transition: transform 180ms cubic-bezier(.18,.89,.32,1.28);
}

#section-summaries .item .sx .slidekits .button:hover {
    transform: rotate(0deg) scale(1.2);
}

#section-summaries .item .sx .slidekits .button::after {
	content: "PDF";

	position: absolute;

	left: 50%;
	transform: translateX(-50%) translateY(2px) scale(.75);
    bottom: -6px;         

	background: var(--scritta-pdf);
	color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
	
    padding: 4px 4px 2px 4px;
    border-radius: 2px;
	
	opacity: 0;
	pointer-events: none;               /* così non disturba l’hover */
	
	transition: opacity 200ms ease-out, transform 200ms ease-out;
	
}

#section-summaries .item .sx .slidekits .button:hover::after {
    opacity: 1;
	transform: translateX(-50%) translateY(-4px) scale(1);

/*	animation-name: appariPDF;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-fill-mode: both;
	animation-play-state: paused;
	animation-timing-function: ease-in-out;
*/	
	//animation: bouncePDF 500ms ease-out 1;
	animation-name: appari_da_sopra_PDF;
	animation-duration: 200ms;
	animation-iteration-count: 1; /* 1, 2, 3... o infinite */
	animation-timing-function: ease-out;
}

@keyframes appari_da_sopra_PDF {
	0% {
		transform: translateX(-50%) translateY(-16px) scale(.15);
	}
	
	100% {
		transform: translateX(-50%) translateY(-4px) scale(1);
	}
}
@keyframes appari_da_sotto_PDF {
	0% {
		transform: translateX(-50%) translateY(6px) scale(.55);
	}
	
	100% {
		transform: translateX(-50%) translateY(-6px) scale(1);
	}
}
@keyframes bouncePDF {
    0%   { transform: translateX(-50%) translateY(6px) scale(.85); }
    //60%  { transform: translateX(-50%) translateY(-6px) scale(1.05); }
    100% { transform: translateX(-50%) translateY(0) scale(1); }
}
#section-summaries .item .dx {}
#section-summaries .item .dx h3 {}
#section-summaries .item .dx div { xfont-size: 1rem;}
#section-summaries .item .nofiletto {}

/* SUMMARIES PAGINE SINGOLE ********************** */
#section-summaries .postcontent { color: var(--base); }
#section-summaries .postcontent h1 { margin: 0px; font-size: 1.3rem; line-height: normal; color: var(--base); font-weight: 700;  }
#section-summaries .postcontent .toggle { margin-bottom: 5px;  }
#section-summaries .postcontent .toggle .toggle-header { color: var(--base);  }
#section-summaries .postcontent .toggle .toggle-icon { color:  var(--gotoTop); }
#section-summaries .postcontent .toggle .toggle-bg {}
#section-summaries .postcontent .toggle .toggle-content { padding: 12px 28px 10px 36px; color: var(--pagina-testo) }
#section-summaries .postcontent .toggle-content ul { margin-bottom: 0px; }

/* SUMMARIES SIDEBAR ********************** */
#section-summaries .sidebar .sidebar-post {
	padding-top: 15px; 
	padding-bottom: 15px; 
	font-size: .9rem;
}


/* FOOTER ********************************************* */
#footer { font-size: 1rem; padding: 10px; border-top:0px; border-bottom: 0px;}
/*#footer .homepage {position: fixed; left: 0; bottom: 0; width: 100%;}*/
#footer span, #footer a { padding: 0 0.5em; }
#footer a { font-size: 1rem;}
#footer a:hover {}
#footer .sx { text-align: left; }
#footer .dx { text-align: right; }
#footer .logosponsor { max-height: 80px; width: auto; }

/* Testo sponsor → Neue Haas Grotesk Display Pro */
#footer .logosponsor_label { 
	display: inline-block; 
	text-align: left; 
	vertical-align: middle;
	text-transform: uppercase;
	font-weight: 500;  /* Regular */
	line-height: 1.4;
}
/* ===========================
   APPLICAZIONE AI TUOI ELEMENTI
   =========================== */

/* Powered by → Myriad Pro */
#footer .text-nowrap:first-of-type {
  font-weight: 400; /* Regular */
  font-size: 16px;
}

/* Link Privacy / Cookie → Myriad Pro Medium */
#footer .text-nowrap:last-of-type a {
  text-decoration: none;
  color: inherit;
  font-size: 18px;
}
	

/* Evita che il wrapper parta trasparente */
/*.page-transition #wrapper {
  opacity: 1 !important;
}
*/

html, body {
  height: 100%;
  margin: 0;
}

#wrapper {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

#footer {
  margin-top: auto; /* spinge il footer in fondo */
}

/* BREAKPOINT RESPONSIVE */

@media all and (max-width: 1200px) {
	#footer .sx, #footer .dx { text-align: center; }
	#footer .sx { xmargin: 0px; }
	#footer .dx { xmargin: 20px 0px; }
	#footer .logosponsor { max-width: 290px; height: auto;}
	#footer .logodx { max-width: 156px; height: auto;}
	}

@media all and (max-width: 992px) {
	#footer .sx, #footer .dx { text-align: center; }
	#footer .sx { xmargin: 0px; }
	#footer .dx { xmargin: 20px 0px; }
	#footer .logosponsor { max-width: 200px; height: auto;}
	#footer .logodx { max-width: 100px; height: auto; }
	.item .sx {text-align: left; padding-left: 0px;}
	.item .dx {padding-left: 0px; }
	/*#footer .logosponsor { max-width: 50%; height: auto;}*/
	}

@media all and (max-width: 768px) {
	#footer .sx, #footer .dx { text-align: center; }
	#footer .sx { xmargin: 0px; margin-bottom: 15px;}
	#footer .dx { xmargin: 20px 0px; }
	#section-topics {padding-left:20px; padding-right:20px;}
	.item .sx { text-align: left; padding-left:0px; }
	.item .dx { padding-left: 0px; }
	/*#footer .logosponsor { max-width: 50%; height: auto;}*/
	}
@media all and (max-width: 384px) {
	#footer .logosponsor_label { text-align: center; }
	}