html { background-color: #cc9900; 
		font-size: 100%;
	}


BODY {
	background-color: white; MARGIN: 10px; border: 12px #884049 solid;
	FONT-WEIGHT: normal; FONT-SIZE: 14px; 
	FONT-FAMILY: Verdana,geneva,Helvetica,sans-serif;
}

#tavola {
	width: 100%; 
	height: 100%;
	display:table;
	table-layout: fixed;
}

.riga {
	display:table-row
}



#sinistra, #destra{
	background-color: white;  
	border: 2px #884049 solid;
	height:100%; display:table-cell
}

#sinistra {
	width: 30%; 
	vertical-align: top;

}
#destra {width:70%;
	vertical-align: top;
	text-align:center;
	clear:both;
}


.divnumeri, .divnumerievidenz {
	background-color: #fde4bd;
display:inline-block;
width:23%;
margin: 0 auto;
 }


.divnumerievidenz  {
	background-color: #ffaa33;
}


.divnumeri A, .divnumerievidenz  A{
background-size: 100%;
display:inline-block;
}


.divnumeri A{
  background-image: url(./cantiorfici.jpg);
  background-repeat: no-repeat;
  background-position: center;
}





.divnumeri A:hover{
  background-image: none;
display:inline-block;
}



.numeri {
	resize: both;
	width:97%
}


.intesta {width:100%;
	background-color: #FFaa33; 
	border-bottom: 3px solid #884049; 
		overflow: hidden;
}

#campanafaenza {
	max-width: 90%; 
	margin-top: 0px ;
clear:both;
}

#spaziotesto{
}



#numerodestra {
float:right;
display:block;
padding: -15px;
margin: -15px 5px -5px 0px;
	max-height: 80px;
}

.intestasin {width:100%;
	background-color: #FFaa33; 
	border-bottom: 3px solid #884049; 
  background-image: url(./sfondo.jpg);
  background-repeat: no-repeat;
  background-position: center;
background-size: 100%;
}

.intestasin img{max-width:20%;
}


.riquadroimmagine{
	resize: both;
	max-width: 50%; 
	float: left;
	margin-top: 0px;
	margin-right: 4px;
	text-align:left;
}

.riquadromappa{
	resize: both;
	max-width: 70%; 
	float: left;
	margin-top: 0px;
	margin-right: 4px;
	text-align:left;
}


.immagineprincipale {
	max-width: 100%; 
	float: left;
	resize: both;
}

#comune {
display: block-inline;
font-size: 130%;
}

#cookies {
display: none;
}


#comune img{
	resize: both;
	max-width: 20%; 
	float: left;
	margin-top: 0px;
}



#Testocanti{
margin-top: 0px;
	text-align: left;
	font-size: 130%;
	line-height: 1.4;
	padding-left: 5px;
	padding-right: 5px;
}

#Testocanti:first-letter {
    FONT-SIZE: 300%;
	float:left;
	line-height: 100%;
	margin-right: 3px;
	padding-top: 6px;
	padding-bottom: 0px;
	font-weight:bold;
}

#commento{
	border-top: 3px solid #884049; 
	padding: 0px 5px 5px 5px ;
	width: 100%; 
	float: left;
	text-align: left;
	font-size: 120%;
	line-height: 1.5;
}
#commento P{
		padding-right: 5px;
}


.didascalia{
	padding: 0px 0px 0px 5px ;
}

.didascalia, .didascalia2{
	padding: 5px ;
background-color: #fde4bd;
border-top: 2px #bf9e70 solid;
border-bottom: 2px #bf9e70 solid;
text-align:left;
clear:both;
}

.didascalia A, .didascalia2 A{
color: black;
}


#map {
	top: 0px:
	left: 0px;
	border: 1px #884049 solid;
	width: 705px;
	height: 587px;
	max-width:100%;
	background: url(./mappa.jpg) no-repeat;
	background-size: contain;
	resize: both;
}


#map ul {
	width: 100%;
	height: 100%;
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}


#map li {
	width: 30px;
	height: 30px;
	position: absolute;
}


#map a {
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
}


#map a span{
	width: 10em;
	padding: 0.4em;
	background: #9e2e00;
	color: #fff;
	border-radius: 6px;
	position: absolute;
	top: -1000em;
}

#map a:hover span, #map li.sivede a span {
	top: 0;
	left: 25px;
}




#r1{top: 63%;	left: 75%;}
#r2{left: 10.5%; top: 73.76%	}
#r3{left: 10.2%; top: 49.2%;	}
#r4{left: 16.5%; top: 34%;	}
#r5{left: 10%; top: 33.5%;	}
#r6{top: 3.5%;	left: 47%;}
#r7{left: 85.5%; top: 77%;	}
#r8{left: 87%; top: 66%;	}
#r9{left: 48%; top: 45%;	}
#r10{left: 53.5%; top: 47%;	}
#r11{left: 51.5%; top: 52.8%;	}
#r12{left: 33.4%; top: 46.5%;	}
#r13{left: 50%; top: 70%;	}
#r14{left: 43%; top: 71%;	}


.lista{
text-align:left;
	line-height: 1.4;
padding-left:5px;
}

.lista A, .classelink A{
text-decoration:none;
color: black;
}

.lista A:hover, .classelink A:hover  {
background-color: #fde4bd;
color: black;
}

.classelink {
	padding: 4px;
	margin:  -1px ;
border-top: 2px #bf9e70 solid;
border-bottom: 2px #bf9e70 solid;
border-collapse:collapse;
font-weight:bold;
text-align: left
}



#tornasu{
	background-color: #884049; MARGIN: 0 auto ; 
	border-top: 10px #884049 solid;
		FONT-WEIGHT: bold; FONT-SIZE: 14px; 
	FONT-FAMILY: Verdana,geneva,Helvetica,sans-serif;
	width: 100%; text-align: center; display:none;
}

#tornasu A{
	text-decoration: none;
	color: white;
}


@media only screen and (max-width: 800px) {

.riquadromappa{
	max-width: 100%; 
	margin-top: 0px;
	margin-right: 0px;
}
}


@media only screen and (max-width: 700px) {

.riquadroimmagine{
	max-width: 100%; 
	margin-top: 0px;
	margin-right: 0px;
}
}




@media only screen and (max-width: 550px) {

#riga, #sinistra, #destra
{	display: block; width: auto; margin: 0 auto; border: 0px;
}

#tavola 
{	display: inline; width: 100%; 	margin: 0 auto; 
}

.intesta {
	border-top: 3px solid #884049; 
}

.intestasin {width:100%;
  background-image: url(./sfondo3.jpg);
}

#numerodestra {
	max-width: 15%;
margin: -5px -5px -10px 0px;
}
#map {
	width: 100%;
}


#tornasu{
display:block;
}

#comune, #cookies2 {
display: none;
}

#cookies {
display: block;
}


}