/**
 * Responsive 4 Layout
 * by Linda http://www.thinkenduser.com
 *
 */
.corsivo{
font-style: italic;
}
.grass{font-weight:bold}/*grassetto*/

.centrato {
  display:block;
  margin:0,auto;
  width: 360px;
  
}
/* #menu_alto, menu orizzontale per sezioni all'intenrno di #content, esempio in fauna.htm */
#menu-alto{width:90%;}	  

#menu-alto ul>li {display:inline;padding-left:0.1em;padding-right:0.1em;}	 
 .intesta{font-weight:bold;}
 #menu-alto ul>li a{font-size:18px;}
/*fine #menu_alto*/
 
#menu{display:none;visibility:hidden;}

#hamburger{ /*div im prima pagina con informativa fatturazione elettronica non visibile sui grandi schermi */
/*display:visible;*/
display: block;
margin:0 auto;;width:180px;
text-align:center
}
#esteso a{/*hamburger esteso*/
	font-size:18px;/*aggiunto con parvum il 17/12/23*/
  color:blue
  margin:20em;
  width:96%;
  
}
#esteso li.mn {width:92%;
			   border-bottom:solid 1px #000;
			   border-bottom-color:greenwidth:92%;
			  }
#esteso li ul.hidden {position:relative;
					  background-color:#012746; /*colore sfondo logo regione*/
					  top:-7px;
					  border:solid 3px green; 
					  width:98%}

#esteso li .hidden li a{
  color:#fff;
  font-weight:bold;
}
#esteso li .hidden li{border-bottom:solid 1px gray;}

.apri {
cursor:pointer;
position:relative;
top:-7px;
float:right;
margin-right:0.5em;
vertical-align:middle;
width:12px;
border:solid 1px green;
padding:0.5em;}

.apri a{color:black !important;}

 
    #esteso li.mn a{color:green;}
   /*#esteso li .hidden li:hover{background-color:yellow;}*/
 
.freccia{margin-right:5px;
visibility:hidden;
width:16px;
position:relative;
top:-2px;
} 
#esteso li .hidden li:hover img.freccia{visibility:visible}
#esteso li .hidden li a{display:inline}

.cham{
    width: 35px;
    height: 5px;
    background-color: black;
    margin: 6px 0;
}
}


/*font-family: 'Titillium Web' da Google fonts
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web&display=swap');
*/





h2{
color:#000;
font-weight:bold;
font-size:140%;
margin:30px 0 5px 20px;
}
.h2_in_medio{
text-align:center;
}

h3,h4,5{
color:#000;
font-weight:bold;
font-size:130%;
margin: 50px 0 5px 20px;
}





/*logo added by me*/
#logo{
	width:100px;
	height:auto;
	background-image: url('../copertine/lago_maggio_2021.jpg'); 
	background-size: cover;	
}
#logo_orig{
text-align:left;
float:left;
width:100%;
margin:0 0 10px 0;
padding:0;
background:#06263F;/*#06263F;#1a1e21;*/
color:#fff;
border-top:solid 1px #242527; 
background-image: url('../copertine/lago_maggio_2021.jpg'); 
background-size: cover; background-position: center; 
width: 100%; 
height:auto;
padding-top: 56.25%; /* Questo mantiene il rapporto 16:9 */ 
position: relative; 
}

#header{
text-align:center;
font-weight:bold;
float:left;
width:100%;
margin:0 0 0 0;
padding:0;
/*background:#fff *//*#1a1e21;*/;
/*color:#fff;*/
border-top:solid 0px #242527; 
/*quanto segue sotto e aggiunto da me
height:134px;
background-image: url("../../nbanner10.jpg");
	background-repeat: no-repeat;
	background-position: 0px 0px;  */
}

#container{
text-align:left;
display:table;
width:100%;
margin:0 auto;
padding:0;
background:#fafafa;
}

#content{
/*float:left;*/
text-align:justify;
display:table;
width:100%;
margin:0px auto 0px 0px;
background:#fff;
color:#222;/*è una sfumatura molto scuro di grigio*/
padding:0;
border:solid 1px #eee;/*è una sfumatura molto chiara di grigio.*/
/*border-top:solid 10px #242527; è una sfumatura molto scuro di blu-turchese*/
box-shadow: 5px 5px 10px 2px #333333;/*è una sfumatura scuro di grigio*/
	-webkit-box-shadow: 5px 5px 10px 2px #333333;
	-moz-box-shadow: 5px 5px 10px 2px #333333;
}

#content p{
line-height:150%;
margin:10px 20px 5px 20px;
}
#content ul>li {word-break: break-word;}	
#menu ul>li a{

}
.didascalia{font-size:18px;
			display:block;
			margin:0 auto;
			
			text-align:center;}
#sidebar{

float:left;
text-align:left;
display:table;
width: 60%/*35%;*/;
margin:10px 0 10px 20px;
background:#fff;
color:#222;
padding:0;
border:solid 1px #eee;
display:none;
}

.title{
font-size:110%;
margin:20px 0 2px 20px;
font-weight:normal;
background:#bc6128 /*#fff;*/;
color:#fff /*#555;*/;
/*added by me*/
border:solid 1px #000;
text-align:center;
}

ul{
padding: 0;
margin: 10px 0 20px 0;
list-style:none;
}

ul li{
margin:5px 5px 10px 22px;
}
/*class verdino and
the specifications of the <li> tag  and <a> tag 
of the <div> sidebar 
were added by me
*/ 

.verdino{ 
margin-top: 0px;
background-color: #EEF3DC;
margin-left:20px;
border:solid 1px #000;
}
div#sidebar li {
	border-top: 1px solid #E0E0E0;
	padding-bottom: 5px;
	padding-top: 2px;
	padding-right: 2px;
	padding-left: 0px;

}

div#sidebar a{
color:black;
text-decoration:none;
}
div#sidebar a:hover{
color:blue;
text-decoration:underline;
}
/*End additions made by me*/

#menu{
text-align:left;
float:left;
width:100%;
background: #141517;
color:#fff;
padding:0;
margin:0;
border-bottom:solid 1px #37383A;
font-size:120%;
}
#menu ul{
padding:0;
margin:0;
list-style:none;
}
#menu li{
display:inline;
padding:0;
margin:10px 0 10px 0;
}
#menu a{
display:inline-block;
text-decoration:none;
padding:10px 20px;
margin:0;
color:#fff;
background:inherit;
}
#menu a:hover{
background:#444;
color:#fff;

}
#div-menu-sezione{
clear:both;

display:block;
width:360px;
	
	
margin:0 auto;

box-shadow: 5px 5px 10px 2px #333333;
	-webkit-box-shadow: 5px 5px 10px 2px #333333;
	-moz-box-shadow: 5px 5px 10px 2px #333333;
	

}

#menu-sezione{
background-color: 	#FAFAD2; /*Giallo originale: #FBF5BF* cod gialli: https://www.rapidtables.org/it/web/color/Yellow_Color.html/	
border:solid 1px #000;
padding:0.5em;
/*display:block;
text-align:left;
float:left;
width:92%;

color:#000;
padding:0.1em;
margin:auto;
border:solid 1px #37383A;
font-size:100%;
*/
}
/*
#menu-sez li{
display:inline;
padding:0;
margin:10px 0 10px 0;
position:static;
}
#menu-sez a{
display:inline-block;
text-decoration:none;
padding:10px 20px;
margin:0;
color:blue;
background:inherit;
}
*/
#menu-sez a:hover{
/*background:#444;
color:#fff;
width:100%;*/
}

#footer{
float:left;
width:100%;
margin:10px 0 0 0;
padding:0;
background:#1a1e21;
color:#fff;
border-top:solid 1px #242527;
}
#footer div{
padding:10px;
}
div#footer a,a:link, a:visited{color:white}
#footer a{
color:#fff;
text-decoration:none;}
#footer a:hover{
color:#fff;
text-decoration:underline;}

//regole per <img /> e eventualmente <div>
.mpbper{width:90%}
.mob{max-width:260px; min-width:200px;
border:double 1px #000;
margin-bottom:10px;}
.mob1{width:280px;
border:double 1px #000;
border-left:0px;
}
.mob2{width:310px;
border:double 1px #000;
border-left:0px;
}
.lago-500{width:280px;margin:auto}/*imposta a 280px per i disp mob-- mentre per i fissi essa e 500px*/
/*.mob definisce max grandezza per le immagini in content */
.menu_sx_color {
	border-left: solid 3px #000;
}
li.menu_sx_color:hover {
	border-left: solid 4px green;
}
.menu_sx {
	text-align: center;
	padding: 0.1em;
	border: solid 1px #000;
	border-bottom: 0px;
	color: white;
	background-color: #bc6128;
	padding-left: 0.2em;
}


/*giochi*/
.content-centrale{border:double 3px #000;
    width:305px; height:206;
    border-bottom:solid 3px red;
  background-image:url(../../giochi/puzzle/general.png);margin:auto;float:left}
  
.pezzi-tavolo{
  width:80px;
  height:60px;
  }
.div-pezzi-tavolo{
  float:left;
}  
.content-pezzi{
  float:left;
  width:245px;
  margin:auto
}
.sfondo{
 float:left;
 width:99px;
 height:74px;
 border:solid 1px red;
}
sfondo.img{width:93px}
.img-sf{
float:left;
width:97px;
} 
.copertina{width:280px;
padding:2px;border:solid 1px #000;

}
.mappa{width:96%;height:280px;}

/*PRIMA PAGINA*/
#fattur{ /*div im prima pagina con informativa fatturazione elettronica non visibile sui grandi schermi */
/*display:visible;*/
display: block;
margin:0 auto;;width:180px;
text-align:center
}
img#fatturaz img.copertina{
  display: block;
  margin:0 auto;
  margin-bottom:0px;
}
div#english{
float:left
}
.trail, .w357{width:280px;border:double 3px #000; padding:0.25em;}
div#content a{
color:blue;
text-decoration:none;
}
.img96perc{
width:96%;
display:block;
margin:auto;
}
.mappe{
max-width: 88%;
     max-height: 88%;
     margin: 0 auto;
}
#menu-no-script{
display:block;
text-align:left;
float:left;
width:100%;
background:#141517;
color:#fff;
padding:0;
margin:0;
border-bottom:solid 1px #37383A;
font-size:120%;
}
#menu-no-script ul{
padding:0;
margin:0;
list-style:none;
}
#menu-no-script li{
display:inline;
padding:0;
margin:10px 0 10px 0;
}
#menu-no-script a{
display:inline-block;
padding:10px 20px;
//padding-bottom:1  3px; 
margin:0;
color:#fff;
background:inherit;
text-decoration:underline;
}
#menu-no-script a:hover{
/*background:#444;*/
background:#CC6600;/*#444;*/ /*ADDED BY ME*/
color:#fff;

}
/*le due classi seguenti posizionano ripsettivamente un div
  (responsiva) a cui deve essere impostato il max-width inline e 
   un'altro elemento (responimg), ad esempio img, contenuto
  nel div responsiva. La 1a classe e senza bordo 
 */
.responsiva {border:solid 0px #000;padding:0.25em;display:block;margin:0 auto;}
.responimg {width:96%;padding:0.4em;border:solid 1px #000;display:block;margin:0 auto;}

body{
background:#F0F2EE;
color:#2d2d2d;


margin:0;
}
#content {
font-family: Verdana,"Century Gothic",'Titillium Web', sans-serif;
font-size:24px;/*carattere del font  #content p*/
}
#wrapper{
display:table;
margin:0;

width:98%;
max-width: 98%;
height:auto;
background:#fafafa;
border:solid 1px red;
padding:2px;
}
h1{
font-size: 28px;/*290%;*/;
text-align:center;
/*margin:30px 0 30px 20px;*/  
font-weight:bold;


}