/* COLORS 1 : VARIABILI *****************************************************************/
/* blu: 003355; grigiochiaro: 929292 - arancio: fb5005*/

:root {
	--base: #003355;
	--base2: #fb5005;
	--pagina-fondo: #ffffff;					/* fondo pagina 						*/
	--pagina-testo: #333333;					/* testo pagina 						*/
	--header-fondo: #778899; 					/* fondo barra header 					*/
	--header-fondo-home: rgba(0,28,56,0.8);	/* fondo barra header home				*/
	--menu-fondo: #778899; 						/* fondo tasti menu 					*/
	--menu-fondo-hover: #ffffff; 				/* fondo tasti menu hover 				*/
	--menu-link: #fff;						/* link del menu 						*/
	--menu-link-hover: #fb5005;					/* link hover del menu 					*/
	--titolo-head-fondo: #fb5005;				/* fondo barra titolo pag.interne		*/
	--titolo-head: #f1f1f1;						/* testo titolo pag.interne 			*/
	--mininav-fondo: #003355; 					/* fondo mininav 	d54926	d69126		*/ 
	--mininav-testo: #fb5005;					/* mininav testo						*/
	--mininav-link: #f1f1f1;					/* mininav link							*/
	--mininav-link-hover: #fb5005;				/* mininav link hover					*/
	--footer-fondo: #003355;					/* fondo footer 						*/
	--footer-testo: #ffffff;					/* footer testo							*/
	--footer-link: #dddddd;						/* footer link							*/
	--footer-link-hover: #ffffff;				/* footer link hover					*/
	--btn-chiaro-fondo: #xxx;
	--btn-chiaro-hover: #xxx;
	--btn-scuro-fondo: #003355;
	--btn-scuro-hover: #fb5005;
	--domanda-fondo: rgba(0,0,0,0.05);
	--domanda-fondo-hover: rgba(0,0,0,0.03);
	--toggle-header-fondo: #d0d7e0;
	--toggle-content-fondo: #e4e9ef;	
	--link: #777;
	--link-hover: #44a0e9; /* come base + chiaro? */
	
	/* da nero a bianco */
	--grigio-0: #000000;
	--grigio-1: #101010;
	--grigio-2: #202020;
	--grigio-3: #303030;
	--grigio-4: #404040;
	--grigio-5: #505050;
	--grigio-6: #606060;
	--grigio-7: #707070;
	--grigio-8: #808080;
	--grigio-9: #909090;
	--grigio-a: #aaa;
	--grigio-b: #bbb;
	--grigio-c: #ccc;
	--grigio-d: #ddd;
	--grigio-e: #eee;
	--grigio-f: #fff;
	
	--bianco-trasp-01: rgba(255,255,255,0.1);
	--bianco-trasp-02: rgba(255,255,255,0.2);
	--bianco-trasp-03: rgba(255,255,255,0.3);
	--bianco-trasp-04: rgba(255,255,255,0.4);
	--bianco-trasp-05: rgba(255,255,255,0.5);
	--bianco-trasp-06: rgba(255,255,255,0.6);
	--bianco-trasp-07: rgba(255,255,255,0.7);
	--bianco-trasp-08: rgba(255,255,255,0.8);
	--bianco-trasp-09: rgba(255,255,255,0.9);
	--bianco-trasp-10: rgba(255,255,255,1.0);
	
	--nero-trasp-01: rgba(0,0,0,0.1);
	--nero-trasp-02: rgba(0,0,0,0.2);
	--nero-trasp-03: rgba(0,0,0,0.3);
	--nero-trasp-04: rgba(0,0,0,0.4);
	--nero-trasp-05: rgba(0,0,0,0.5);

}


@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,700;1,400;1,700&display=swap');
body { font-family: Roboto, Helvetica, Arial, sans-serif; }
html {font-size: 16px}
h1, h2, h3, h4, h5, h6, .menu-link, .sub-menu-container .menu-item .menu-link { font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0px; }
h1, h2, h3, h4, h5, h6 {color:var(--pagina-testo);}
.iconecheck {font-size: 1.5rem; color:#fb5005;}

/*#wrapper {background-color: var(--pagina-fondo); color:var(--pagina-testo); }  sfondo/testo pagine */
#wrapper {background-image:url('img/sfondo_pagina.jpg'); color:var(--pagina-testo); } /* sfondo/testo pagine */

/* HEADER / MENU ***********************************************************/
#header { border-bottom: 0px; }
#header-wrap { background-color: var(--header-fondo) }
.sticky-header #header-wrap { background-color:var(--header-fondo); }
.menu-link {}
a.menu-link { 
	background-color: var(--menu-fondo);
	color: var(--menu-link)!important;
	border-bottom:6px solid var(--menu-link-hover);
}
a.menu-link:hover {
	background-color: var(--menu-fondo-hover);
	color: var(--menu-link-hover)!important;
	border-bottom:6px solid var(--menu-link-hover)!important;
	/* transition:0.4s; */
}

.sub-menu-container {padding:0px!important; background-color: var(--menu-fondo);}
.sub-menu-container .menu-item .menu-link {background-color: var(--menu-fondo); color: var(--menu-link);}
.sub-menu-container .menu-item .menu-link:hover {background-color: var(--menu-fondo); color: var(--menu-link-hover);}

/* CUSTOM HOMEPAGE */
.homepage #header-wrap { background-color:var(--header-fondo-home);}
.homepage .sticky-header #header-wrap {background-color:var(--header-fondo-home);}
.homepage a.menu-link { background-color:transparent }
.homepage a.menu-link:hover { background-color:rgba(255,255,255,.15) }

.footer-home { background-color: var(--header-fondo-home)!important; border-top: 1px solid rgba(255,255,255,.15)!important; }
/* video: nasconde slider e sostituisce div , solo per mobile */
#slider { display: block!important; }
.mobile { display: none!important; }
/* FINE HOMEPAGE */

/* TITOLO HEAD *************************************************************/
.titolo-head { background-color: var(--titolo-head-fondo) }
.titolo-head { background-image:url('img/sfondo_header2b.jpg'); xmargin-top:1rem; xmargin-bottom:1rem; padding-top:8rem; padding-bottom:8rem; align-content: center;}
.titolo-head-box { background:#778899a8; padding:2rem; width: fit-content; margin: 0 auto; min-width: 30%;}
.titolo-head .tipopagina { color: var(--grigio-f); opacity: 0.85!important; }
.titolo-head h1 { color: var(--grigio-f) }

/* VIDEO HIGHLIGHTS ********************************************************/
.mfp-bg { background: var(--nero); opacity: 0.85!important; }

/* MININAV *****************************************************************/
.mininav { 
	background-color: var(--base); 
	color: var(--mininav-testo); 
	text-align:center;
	margin-top:0rem; 
	border-top:6px solid var(--base2);
	border-bottom-left:
}
.mininav a { 
	color: var(--mininav-link); 
	border: 0px solid var(--mininav-link); 
	border-bottom: 0px solid var(--mininav-link); 
	padding:1.0rem; 
	margin:0;
}
.mininav a:hover { 
	color: var(--mininav-link-hover);
	border: 0px solid var(--mininav-link-hover);
	border-bottom: 0px solid var(--mininav-link-hover);
}

/* TOPICS ********************/
#section-topics .item:not(:first-of-type) { border-top: 2px solid var(--grigio-7); }
#section-topics .item h2 { color: var(--base); }
#section-topics .argomento { text-align: center; } /* solo per le icone check */
#section-topics .argomento img { border: 0px solid rgba(0,0,0,0.1); }
.indice a { color:var(--link);}
.indice a:hover { color:var(--link-hover);}

/* INTERVISTE ****************/
.intervista .dottore .nome { color: var(--base) } /* titolo e nome */
.intervista .dottore .affiliazione { color: var(--grigio-8) }
.intervista .dottore .lingua { color: var(--grigio-8) } /* lingua intervista */
.intervista .dottore .domanda { background-color: var(--domanda-fondo); border-left: 0px solid #ccc; border-top: 1px solid #ddd; }
.intervista .dottore .domanda:hover {background-color: var(--domanda-fondo-hover); color: var(--link-hover);} /* come domanda , meno schiarito */
/*.intervista .dottore .domandaincorso { background-color: #ddd; border-left: 5px solid red; }*/
.intervista .dottore span.domandatime { color: var(--grigio-8) }

/* PODCASTS **************************************** */
.podcast {}
.podcast .bg-podcast { background-color: var(--xxx); border: 1px solid #ddd; } /* div colonna singolo podcast */

/* SUMMARIES INDICE ***************************************************************/

#section-summaries .item { border-top: 1px solid var(--grigio-e); x-background-color: var(--xxx); color: var(--xxx); }
#section-summaries h2 {}
#section-summaries .item .sx { x-background: var(--xxx); }
#section-summaries .item .sx img { x-background-color: var(--xxx); border: 2px solid var(--xxx); }
#section-summaries .item .sx .slidekits { x-background-color: var(--xxx); color: var(--xxx); }
#section-summaries .item .sx .slidekits .button {
	background-color: var(--mininav-fondo);
	color: var(--mininav-testo);
	border-left:0px solid var(--base);
}
#section-summaries .item .sx .slidekits .button:hover {
	background-color: var(--base);
	color: var(--grigio-f);
}
#section-summaries .item .dx { x-border-left: 1px solid #C00; }
#section-summaries .item .dx h3 {}
#section-summaries .item .dx div { color: var(--grigio-8); }
#section-summaries .item .nofiletto { border-left: 0px; }
#section-summaries .item a { color:var(--link);}
#section-summaries .item a:hover { color:var(--link-hover);}

/* SUMMARIES PAGINE SINGOLE ***************************************************************/
#section-summaries .postcontent h1 { color: var(--base); }
#section-summaries .postcontent h4 { color: var(--grigio-8); font-size:.9rem; font-style:italic;}
#section-summaries .postcontent .toggle {}
#section-summaries .postcontent .toggle .toggle-header { background-color:var(--toggle-header-fondo); }
#section-summaries .postcontent .toggle .toggle-bg {}
#section-summaries .postcontent .toggle .toggle-content { background-color: var(--toggle-content-fondo); }

/* SUMMARIES SIDEBAR ********************** */
#section-summaries .sidebar h4 {font-size: 0.9rem}
#section-summaries .sidebar .sidebar-post {	border-bottom: 1px solid var(--grigio-e); }
#section-summaries .sidebar a { color:var(--link-hover);}
#section-summaries .sidebar a:hover { color:var(--link);}

/* FOOTER ***************************************************************/
#footer { background-color: var(--footer-fondo); color: var(--footer-testo); padding:20px 0px;} /* come titolo-head o mininav */
#footer a { color: var(--grigio-a); font-size: 1rem;}
#footer a:hover { color: var(--grigio-f); }

/* LOGIN ***************************************************************/
#login {
	height: 100%;
	background-color: var(--base);
	background-image: url("img/sfondo_login2.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
#login .content{padding-top:10%;}
#login .larghezza{max-width:380px;} /* larghezza logo + 100px + 16px*/
#login .logo {padding:0px 8px 0px 8px;}
#login .form-widget{
	padding: 50px;
	padding-bottom: 10px;
	background-color: rgba(0,0,0,0.20);
	color: var(--grigio-a);
	border: 3px solid var(--grigio-f);
}
#login label{color:var(--grigio-f);}
#login .msg{color:var(--grigio-f);}
#login .btn-login {
	background-color:var(--btn-scuro-fondo);
	color:var(--grigio-d);
}
#login .btn-login:hover {
	background-color: var(--btn-scuro-hover);
	color:var(--grigio-f);
}

@media (max-width: 991.98px) { /* colore sfondo header/footer mobile */
	#header-wrap {background:var(--header-fondo)!important; opacity:1!important;}
	.footer-home {background:var(--footer-fondo)!important; opacity:1!important;}
	.footer-home-div{position:relative;}
	#slider {display: none!important;}
	.mobile {display: block!important; }
	.mobile .mobile-text {padding: 20px; }
	.mobile h3, .mobile h4 {color:var(--base); line-height:1.5rem!important; padding-top:2rem; padding-bottom:2rem;}
}