:root {
	--color-a-300:hsl(2, 95%, 20%);
	--color-a-200:hsl(2, 95%, 30%);
	--color-a-100:hsl(2, 75%, 35%); 
	--color-b-200:hsl(2, 50%, 60%);
	--color-b-100:hsl(2, 50%, 85%);
}

body { font-family: 'Roboto', sans-serif; margin:0; padding:0; color:#333;letter-spacing:0.02em; line-height:1.4em }

/*100% height*/
html, body { min-height: 100%; width: 100%; }
#body-wrapper {display:flex; flex-direction:column; height: 100%;font-family: 'Inter', sans-serif; background:#fff; min-height:100vh}
#content-wrapper { flex:1 1 0; }
/**/

.tab-div { display: none} /* CHIUDO TAB MENU PRINCIPALE */
#content-container { display:flex; flex-direction:column; margin: 0 auto}	
.title-container {max-width:1140px; margin:20px auto; padding: 0 12px;}	

aside {flex-grow: 1; order: 1;padding-top:20px ; position: relative;}
main {flex-grow: 1;order: 2; }

/*TIPOGRAFIA*/
a { text-decoration: none; color:var(--color-a-300) }
a:hover { color:var(--color-a-300) }
#header-wrapper {line-height: 1.2em; position: sticky;	top: 0;	left: 0;	z-index: 100;	right: 0;	background: #fff;	box-shadow: 0 0 7px 5px rgba(151, 151, 151, 0.5);}
#header-container {position: relative; display: flex; align-items: center; justify-content: center;}
#footer-wrapper a, #footer-wrapper h3 { text-decoration: none; color:#fff}
.menu-foo {display: none;}
.prefoo {text-align: center;}
.prefoo .prefoo-title{background-color: #e4e4e4; color: var(--color-a-200); padding: 12px 0; margin-top: 12px;}

ul { list-style-type: square; }
a img { border:0}
h1,h2,h3,h4,h5,h6 { letter-spacing:0.05em;line-height: 1.4em; margin:0; color:var(--color-a-300);font-family: 'Bebas Neue', cursive; }
h1 {font-size:1.7rem; margin: 5px 0}
h2 {font-size:1.5rem;}
h3 {font-size:1.4rem;}
h4 {font-size:1.2rem;}
h5 {font-size:1rem; font-family: 'Inter', sans-serif;}
h6 {font-size:1rem; font-family: 'Inter', sans-serif;}

.d-box-taxo {display:none;}
/*LOGHI*/
#logos-box {align-items:center; max-width: 900px; margin:34px 6px 12px 0; width: 170px;}
#logo-prj img { width:100%}
#logo-prj { flex: 1 0 150px; padding:0;  width:100%;   text-align: center; max-width: 220px;  }
#logo-prj img{display: block;width: 100%; box-sizing: border-box;}
#logo-prj a {display: block; width: 100%;}
.partner {width: 140px; margin-top: 33px; margin-left: 8px;}
/*TITOLI*/
.titolopagina {font-weight: normal;}
.titolopagina2 { font-weight: normal;}
.titlebar { font-size:200%; color:#444; padding:16px 8px 8px 8px; border-bottom:1px dotted   #ccc }
.titlebar a { float:right;font-size:70%; }

/**/

/* MENU */
.menu-btn span {background: var(--color-a-300) !important;}
.menu-btn a {color: #fff;}
#menu-header-container { display: none}
	/*colori dropdown menu*/
	#menu-header .dropdown .dropdown-menu {background:var(--color-a-100) !important;}
	#menu-header .nav-item .dropdown-menu.active .arrow { border-bottom: 15px solid var(--color-a-100) !important;}
	#menu-header .dropdown .dropdown-menu .dropdown-item {color: #fff !important;}
	#menu-header .dropdown .dropdown-menu .dropdown-item:hover {    background: var(--color-a-300);  }
	#menu-header .dropdown .dropdown-menu .dropdown-item.dropdown-item-liv2:hover {background: var(--color-b-100);}
	#menu-header .dropdown .dropdown-menu .dropdown-item.open {background: var(--color-a-200);}
	#menu-header .dropdown .dropdown-menu .dropdown-item.dropdown-item-liv2.open { background: var(--color-a-200);}
	#menu-header .dropdown-menu .box-liv2 { background: var(--color-a-200); }
	#menu-header .btn-toggle-liv2 i { color: #fff;}
	#menu-header-container .navbar {font-size: 120%;}
	#menu-header-container .navbar li a {position: relative;}
	#menu-header-container .navbar-nav >  li > a:after {content: ""; height: 2px; width: 0; position: absolute; bottom:0; left:50%;transform: translate(0 -50%); background: var(--color-a-300); transition:all .4s ease }
	#menu-header-container .navbar-nav > li:hover > a:after { width: 100%; left: 0}
	

/*menu-mobile*/
#mobile .circleburger  .menu {	background: var(--color-a-100); box-shadow: 0 0 0 0 var(--color-a-100), 0 0 0 0 var(--color-a-100); right: -96px; top: -96px; border-radius: 30% 30% 30% 26%; }
#mobile .circleburger  .hamburger {	top: 118px; left: 20px; width: 22px; }
#mobile .circleburger .menu-container {	background:var(--color-a-100);   }
#mobile .circleburger .open-menu-link {	background: var(--color-a-300);  }
#mobile .circleburger .menu.open {    box-shadow: 0 0 0 100vw var(--color-a-100), 0 0 0 100vh var(--color-a-100);}  
#mobile .circleburger .open-menu-link {background: var(--color-a-300);}
/**/

/* FINE MENU */

#formsearch { margin:0;padding: 0}
#formsearch div { margin:0;}
#search input[type="text"] {
    background: url(/layout/common/image/search-dark.png) no-repeat 8px 3px #fff;
    border: 1px solid #d1d1d1;    font: bold 12px Arial,Helvetica,Sans-serif;
    color: #bebebe;    width: 120px;    padding: 5px 15px 5px 35px;    border-radius: 10px;
    text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;  transition: all 0.7s ease 0s;  }

#search input[type="text"]:focus {  width: 160px;  }
.buttonsearch { display:none}

/* MENU livello 2  */
aside .menu {margin:0 10px; }
aside .menu {margin-bottom:20px;} /*marx*/
aside .menu li span.group-menu { background:#f3f3ef url(/layout/econ/img/treline-black.png) center right no-repeat }
aside .menu li span.group-menu-opened { background:#f3f3ef url(/layout/econ/img/treline-black.png) center right no-repeat }
aside .menu ul, aside .menu ul li { margin:0; padding:0; list-style-type:none}
aside .menu a, aside .menu span.group-menu, aside .menu span.menu-group {display:block; border-bottom:1px solid var(--color-a-300); text-decoration:none; padding:6px 0 6px 15px; cursor:pointer;background:#f3f3ef;color:var(--color-a-300); margin-bottom:5px; }
aside .menu span.menu-group { display:block;  }
aside .menu ul.liv2 a {margin:0 0 5px 15px; background:#f3f3ef;}
aside .menu li a:hover, aside .menu ul.liv2 li a:hover, aside .menu li span:hover  { background-color:#e9e9e5;}
aside .menu li a.selected {background-color:var(--color-a-300) !important; color: #fff;text-shadow: 1px 1px 1px rgba(250, 250, 250, 0.2);}
aside .menu li a.selected span:hover {background-color:var(--color-a-300) !important;}
aside .menu span {  cursor:pointer; }
aside fieldset { border: none; }
aside legend { display: none} 	

aside .navmenu, aside .navmenu li { margin: 0; padding: 0; list-style-type: none; display: inline;}
#content-container aside .navmenu a { display: block; padding: 6px 12px; background: var(--color-a-300); color:#fff;margin:1px 0 ;}
#content-container aside .navmenu a:hover { background-color:var(--color-a-200); transition: all .25s ease-in-out; ;}
#content-container aside .open-menu-link { display: none;}

/**/

/***  FOOTER   ***/
.partner-logo {width: 180px; height: auto;}
#footer-wrapper{ color:#fff; margin-top: 0;margin: 0; box-shadow: 0 0 15px 0 #a6a6a6;position: relative; background: linear-gradient(90deg, var(--color-a-200) 49%, #fff 50% );}
#footer-container {  text-align: center;  position:relative; background: var(--color-a-200); max-width: 1440px;  margin: 0 auto; }
.subfooter-container {max-width: 1400px; margin: 0 auto;}
#footer-container a { color: #fff;}
footer, .subfooter-container {display: block; }
#subfooter {background:  rgba(79, 79, 79, 0.6); position: absolute; width: 100%; left: 0; bottom: 0;}
#boxinfouni div {padding: 24px 12px 130px 12px;}
.subfooter-container {padding: 12px; }
#footer-box #dep-address { padding: 24px;}
#dep-address h3 {margin-top: 0; color: #fff;}
.disclaimer {flex: 1 0 70%; margin-bottom: 24px; display: block; text-align: center;}
.privacy_disclaimer {color: #fff; text-decoration: underline;}
#twittericon  { background: url(/layout/romedialogues/img/tw.svg) center center no-repeat; }
#instagramicon { background: url(/layout/romedialogues/img/ig.svg) center center no-repeat;}
#linkedinicon { background: url(/layout/romedialogues/img/lk.svg) center center no-repeat;}
#youtubeicon { background: url(/layout/romedialogues/img/yt.svg) center center no-repeat;}
 
#social-box {display: flex; flex-wrap: wrap; justify-content: center; flex: 0 0 30%;}
.socialicon {	height: 40px; width: 40px; border-radius: 50%; box-shadow: 0px 0px 8px rgba(0,0,0,0.3);display: inline-block;  background-color:var(--color-a-300); margin: 0 5px; }
.socialicon:hover { background-color:rgba(255,255,255,0.4) !important}
.socialicon span { display: none; }

#boxinfouni {background: #fff;clip-path: polygon(0% 0%, 50% 9%, 100% 0px, 100% 100%, 0% 100%)}
#logo-economia img { width:230px; display: inline-block; background: #fff; padding: 12px;}

.box-item-container h1:first-child,   .box-item-container h2:first-child,   .box-item-container h3:first-child,   .box-item-container h4:first-child,   .box-item-container h5:first-child,   .box-item-container h6:first-child,   .box-item-container p:first-child {margin: 0 !important; }
.box-item-container .titolo{ padding: 12px 14px}
.box-item-container { border-top: 0 !important; position: relative;}
.box-item-container .descrizione{ padding: 12px}



#boxlinks a {color: #444;display: block;text-align:right; padding:0 20px 3px 0}
#boxlinks a:hover { text-decoration: underline; color: #000}
#top .topleft, #top .topright { display: none}
#top { background:var(--color-a-200); height: 44px}

.hamburgher-menu{display:block; z-index:1000;}
.hamburgher-menu { font-size: 90%}
.hamburgher-menu .selected { color:var(--color-a-300)}
.hamburgher-menu .menuitem { border-bottom:1px dotted #ccc;  }
.hamburgher-menu .menu-title { background: var(--color-a-300); height:44px }
.hamburgher-menu a, .hamburgher-menu span{ color:var(--color-a-300)}
.hamburgher-menu a:hover{ color:var(--color-a-300)}

/*.top-container,#footer-container,#tab { max-width: 1140px; margin: 0 auto}*/
#tab-wrapper {background: var(--lightblue); box-shadow: 0 2px 4px rgba(120, 120, 120, 0.5); }
.tab-div { margin:0;   padding: 10px}
.tab-div .container  { margin:0 auto; max-width: 1440px}
.tab-div:before, .tab-div:after { content: ""; display: table; clear: both;  }

#topbar { background: #903 !important; color: #fff}


/*modifiche boxhp*/
.box-item-container .descrizione {	padding: 12px;}
.box-item-container .titolo {	padding: 12px 14px;}

#oc-246 {background:#eee}

/*MEDIAQUERIES*/
@media (min-width: 720px){
	#logos-box {margin: 34px 24px 18px 0;}
	#logo-prj {max-width: 280px;}
	.partner {width: 200px;}
}
@media (min-width: 830px) {
	#aside-container {position: sticky; top: 160px}
	#boxlinks { flex: 1 0 44%;}
	#boxinfouni {  line-height: 1.4em;   box-shadow: 0 2px 4px rgba(255, 255, 255, 0.5);  }
	#boxinfouni div {color: var(--color-a-300); text-align: right; padding: 12px; }
	#boxlinks a { text-align: left; margin-left:6%	}
	.disclaimer {margin: 0; text-align: left;}
	/* GESTIONE COLONNA SX*/
	#content-container { flex-direction:row }
	#body-wrapper {display:flex; flex-direction:column}	
	#content-wrapper {flex:1 1 0; }
	aside {flex-grow: 0;flex-basis: 285px; order: 1;padding-top:50px }
	main {flex-grow: 1;flex-basis: 0;order: 2; }
	.mind-toggle-menu { display: none}
	.h0 { color: #fff; text-align: center; text-shadow: 2px 2px 1px rgb(50, 50, 50); display: block;}
	.subfooter-container {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;padding: 12px 24px; }
    footer { display:flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap;}
    footer #footer-box {flex: 0 0 50%;align-self: center; padding-bottom:  70px; text-align: left;}
    footer #boxinfouni { flex: 0 0 50%; margin: 0;clip-path: polygon(8% 0, 100% 0, 100% 100%, 0% 100%); padding-bottom: 70px}
	#social-box {justify-content: flex-end; }

}

@media (min-width: 950px) {
	#header-container {margin: 24px auto; 	max-width: 1440px; padding: 0 12px; box-sizing: border-box;	   }
	.tab_millefoglie_wrapper {	position: absolute;	left: 0;	right: 0;   }
	#menu-header-container {	position: relative;   }
	#menu-header-container .navbar-nav {padding: 0; margin: 0;}
	#menu-header-container ul.navbar-nav {justify-content: flex-end; padding-right: 36px; }
	#menu-header-container .navbar-nav li .nav-link {padding: 12px; margin: 0 12px;}
	/**/

	#menu-header-container { display: block}
	#menu-header { height: auto; background: transparent;font-family: 'Oswald', sans-serif; margin: 0 6px;flex: 1 0 50%; }
	
	.partner {margin: 0; flex: 0 0 150px; width: 150px }
	#mobile { display: none}
	.social-wrapper {top: -10px; right: 12px; margin: 0;}
	.socialicon {height: 32px; width: 32px;}
	#boxinfouni div {text-align: center;}
}

@media (min-width: 1000px) {
	#logos-box {margin: 0; flex: 0 0 320px; width: 320px}
	#logo-prj {max-width: 320px;}

}

