/* CSS Document */
  .cgopage {
	border: solid 1px green;
	background-color:#fff;
    display: block;

    margin:0 auto;
    padding:0.45em;
	margin-top: 25px;
	margin-bottom: 35px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	text-align: center;
  }	
.greenB{
font-weight:bold;
color:green;
}
 
#menu-sez {
	box-shadow: 5px 5px 10px 2px #333333;
	-webkit-box-shadow: 5px 5px 10px 2px #333333;
	-moz-box-shadow: 5px 5px 10px 2px #333333;
	margin:1em;width:98%;
} 
#menu-sez li img {
border:none;
vertical-align:middle;
}

/*@media screen and (min-width: 850px) {*/
@media screen   
  and (max-width: 659px) {
  .gopage {
	border: solid 1px green;
	width: 270px;
    display:block;
	margin:auto;
	margin-top: 25px;
	margin-bottom: 35px;
	height: 450px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	text-align: center;
  }
}
@media screen   
  and (min-width: 660px) 
  and (max-width: 720px) {
  .gopage {
	border: solid 1px green;
    float:left;
	margin: 6px;
	width: 270px;	
	height: 450px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	text-align: center;
  }
}
@media screen and (min-width: 721px) {
.gopage {	
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    float: left;
    height: 450px;
    margin: 20px;
    text-align: center;
	width: 270px;
	}
}
@media screen   
  and (min-width: 781px) 
	 and (max-width: 900px) {  
  .gopage {	  
	  margin:30px;
  }	  
  }  

	.formG{margin-top:1em;width:80%;height:75px;margin:0 auto;
				box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
	/*classe per i link dei titoli (la parte iniziale in grassetto) dei box*/
	.gopage-p-a {font-weight:bold;color:#000 !important; } 
	/*
	.gopage_tit a:hover{color:green;text:underline;} 
	*/
	/*********************************************************************/
	.img-gopage{
	margin:0.2em;;width:95%;padding:2px;
	}


	#div-menu-sez a{color:blue;
	
	}
   
img#guida{
display:block;
margin:0 auto;
}
.ombra{
box-shadow: 5px 5px 10px 2px #333333;
	-webkit-box-shadow: 5px 5px 10px 2px #333333;
	-moz-box-shadow: 5px 5px 10px 2px #333333;
	
}	

/*https://www.andreapacchiarotti.it/archivio/menu-responsivo.html*/
/* Regole di reset */
#menu ul{margin: 0;padding:0;list-style-type:none}

/*MENU PRINCIPALE*/
/* Lista in orizzontale. inline-block è come inline, ma può avere altezza e larghezza; relative occorre al sottomenu */
#menu li{display:inline-block;position:relative}

/* Menu. Cambiando center l'oriento a destra o sinistra */
#menu{width:100%;background-color:#000;border-radius:6px;
/*text-align:center;
customer*/
color:#fff;
font-weight:bold;
}

/* Link menu. Cambiando 80px posso scrivere voci più lunghe */
 li.mn a {display:block;padding:0px 0px;width:80px;color:#fff; /*font:bold 12px Arial*/;
text-decoration:none;border-right:0px solid #ccc}

/* Link menu hover 
a:hover{color:#C8C8C8}*/

/* SOTTOMENU PRINCIPALE da #CC6600 a AD5700*/
#menu ul .hidden{border:solid 2px #CC6600;border-bottom:solid 3px #CC6600;border-left:solid 3px #CC6600}
#menu li .hidden{display:block; position:absolute;top:100px; left:0;
background-color:#012746;visibility:hidden;margin-left:-5px;/*border-right:none*/}

/* Link sottomenu */
#menu li .hidden li a{width:180px;border-bottom:1px solid #ccc}

/* Animazione al passaggio sopra agli elementi del menu */
#menu li:hover .hidden{margin-top:-55px;visibility:visible}

/* TRIGRAMMA */
/* Stile e invisibilità */
.showMenu{ width:40px;border:1px solid black;margin:auto;
color:#000;text-align:center;font-size:30px;
margin-bottom:10px;display:none}

/* Invisibilità checkbox. Il checkbox va nascosto in ogni caso e il menu comparirà quando esso verrà selezionato tramite click sull'etichetta */
#menu input[type=checkbox]{display:none}

/* La tilde alt126 permette di selezionare tutti gli elementi B presenti in un insieme A;
qui sta a significare che mostra il menu quando la checkbox viene selezionata. */
input[type=checkbox]:checked ~ #menu{display:block}


/*CSS caricato alle risoluzioni inferiori a 768px*/
@media screen and (max-width: 489px) {
.gopage {
	width: 270px;
	margin: 0 auto;
	margin-top: 25px;
	margin-bottom: 25px;
	height: 450px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	text-align: center;
}

#menu{border-radius:0;text-align:center;display:none}

/* Rendo gli elementi dei menu elementi di blocco */
ul li{display:block}

/* Imposto la larghezza massima di menu e links */
#menu li .hidden li,#menu li .hidden li a, ul li,ul li a{padding-right:0;
padding-left:0;width:100%;border-right:none}

/* Mostro il sottomenu solo al passaggio del mouse */
#menu li .hidden li{display:none}
#menu li:hover .hidden li{display:block}

/* Resetto la posizione degli elementi del menu. static è il valore di default.
Gli elementi sono mostrati in ordine, come appaiono nel flusso del documento */
#menu li{position:static}

/* Resetto la posizione del sottomenu e lo mostro */
#menu li .hidden{position: static;visibility:visible}

/* Nessuna animazione al passaggio del mouse */
#menu li:hover .hidden{margin:0}

/* Colore di sfondo agli elementi del menu e del sottomenu */
#menu li{background-color:#3E3E3E}
#menu li .hidden li{background-color:darkblue}

/* Mostro il pulsante del menu nella versione mobile*/
.showMenu{display:block}
}