@charset "utf-8";

/* Mappa interattiva */

.map-control {
    position: absolute;
	top:92px;
    left:0;
    background-color:#999;
    height: 70px;
    width: 110px;
	z-index:2;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.map-control a {
    height: 18px;
    width: 18px;
    display: block;
    text-indent: -999em;
    position: absolute;
    outline: none;
	border:#FFF 1px solid;
}

.map-control a:hover {
    background: #535353;
    opacity: .4;
    filter: alpha(opacity=40);
}

.map-control a.left {
    left: 39px;
    top: 22px;
	width:20px;
	height:20px;
	background:url(../img/itinerari/left.png)
}

.map-control a.right {
    left: 79px;
    top: 22px;
	width:20px;
	height:20px;
	background:url(../img/itinerari/right.png)
}

.map-control a.up {
    left: 59px;
    top: 2px;
	width:20px;
	height:20px;
	background:url(../img/itinerari/up.png)
}

.map-control a.down {
    left: 59px;
    top: 42px;
	width:20px;
	height:20px;
	background:url(../img/itinerari/down.png)
}

.map-control a.zoom {
    left: 2px;
    top: 8px;
	width:20px;
	height:20px;
	background:url(../img/itinerari/zoom.png)
}

.map-control a.back {
    left: 2px;
    top: 31px;
	width:20px;
	height:20px;
	background:url(../img/itinerari/zoom_out.png)
}

#viewport {
    width: 1000px;
    height: 600px;
    cursor: move;
    overflow: hidden;
	z-index:1;
	position:relative;
	top:-250px;
}

/*
.map-control{
	z-index:2;
	background-color:rgb(255,255,0);
	width:300px;
	height:20px;
	position:absolute;
	top:90px;
}*/



#mappa_interattiva{
	width:100%;
	height:100%;
	position:relative;
	z-index:2;
}

/* SCHEDA PERCORSO */
.scheda_chiudi{
	position:relative;
	top:10px;
	right:10px;
	float:right;
	z-index:1;
}

#icona_scheda_percorso{
	position:relative;
	float:right;
	top:0;
	right:0;
	background-color:#88B564;
	width: 90px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-bottom-left-radius: 5px;
	border-bottom-left-radius: 5px;
	z-index:1;
	text-align:right;
	padding-top:4px;
}
#scheda_percorso{
	z-index:3;
	position:relative;
	float:left;
	left:25%;
	top:2px;
	background:url(../img/icone_mappa/sfondo_percorso.png);
	width:480px;
	height: 593px;
	/*
	background-color:#EFEAD5;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;*/
}


.scheda_titolo_txt{
	font-size:25px;
	color:#00792C;
	float:left;
	width:100%;
	font-family: KlavikaMedium;
}
.scheda_txt{
	padding:15px;
	font-family:FontText;
	font-size:14px;
	color:#481D29;
	text-align:justify;
}
.scheda_sx{
	position:relative;
	float:left;
	top:5px;
}
.scheda_sx ul li{
	display:block;
	padding:5px 0 5px 15px;
}
.scheda_dx{
	position:relative;
	float:left;
	top:5px;
	left:0;
}
.scheda_dx ul li{
	display:block;
	padding:5px 0 5px 30px;
}

.scheda_descrizione{
	position:relative;
	float:left;
	top:10px;
}
.scheda_footer{
	position:absolute;
	bottom:20px;
	width:90%;
	
}
/* DETTAGLIO OGGETTO MAPPA */
#img_zoom{
	position:absolute;
	float:left;
	z-index:2;
}

.freccia_indietro{
	position:absolute;
	z-index:2;
	top:35%;
	left:-40px;
	float:left;
}

.freccia_avanti{
	position:absolute;
	z-index:2;
	top:35%;
	right:-40px;
	float:left;
}

#dettaglio_chiudi{
	position:absolute;
	top:5px;
	right:5px;
	float:right;
	z-index:2;
}

#dettaglio_oggetto{
	display:none;
	position:relative;
	float:left;
	top:20%;
	left:20%;
	background: url(../img/itinerari/sfondo_tappa.png);
	z-index:3;
	width:600px;
	height:346px;	
}
#dettaglio_testo{
	position:relative;
	float:right;
	top:20px;
	right:20px;
	width:59%;
	color:#481D29;
	font-size:16px;
	font-family:FontText;
	text-align:justify;
}
#dettaglio_titolo{
	position:relative;
	float:right;
	top:10px;
	right:20px;
	width:59%;
	color:#481D29;
	font-size:22px;
	font-family:KlavikaBold;
	text-transform:uppercase;
	border-bottom: #481D29 1px dashed;
}
#dettaglio_immagine{
	position:relative;
	float:left;
	margin: 20px 5px 0 15px;
	width:33%;
	color:#481D29;
	font-size:16px;
	font-family:FontText;
	text-align:left;
}
#dettaglio_immagine_video{
	position:relative;
	float:left;
	margin: 20px 5px 0 15px;
	width:55%;
	color:#481D29;
	font-size:16px;
	font-family:FontText;
	text-align:left;
}
#dettaglio_testo_video{
	position:relative;
	float:left;
	top:20px;
	left:10px;
	width:35%;
	color:#481D29;
	font-size:16px;
	font-family:FontText;
	text-align:justify;
}
#dettaglio_titolo_video{
	position:relative;
	float:left;
	top:10px;
	left:10px;
	width:95%;
	color:#481D29;
	font-size:22px;
	font-family:KlavikaBold;
	text-transform:uppercase;
	border-bottom: #481D29 1px dashed;
}
.immagine_scheda{
	height:250px;
	box-shadow: 0 3px 5px #888888;
}
#nav_img{
	position:absolute;
	bottom:2px;
	left:12px;
}
#nav_img img{
	box-shadow: 0 2px 3px #888888;
	height:38px;
	width:38px;
}
.dettaglio_video_titolo{
	font-family:KlavikaBold; 
	font-size:18px;
	color:#481D29;
}
.dettaglio_video_torna{
	font-family:KlavikaMedium; 
	font-size:16px;
	color:#00792C;
	position:absolute;
	bottom:-20px;
}

.fonte_video{
	font-size:13px;
	letter-spacing:-1px;
}

#dettaglio_fonte{
	position:relative;
	color:#FFF;
	bottom:25px;
	height:18px;
	padding:2px;
	background-color:rgb(0,0,0); /* IE < 9 */
	background-color:rgba(0,0,0,.4);
	font-family:FontText;
	font-size:14px;
	text-align:left;
	z-index:2;
}

#dettaglio_fonte_2righe{
	position:relative;
	color:#FFF;
	bottom:52px;
	height:45px;
	padding:2px;
	background-color:rgb(0,0,0); /* IE < 9 */
	background-color:rgba(0,0,0,.4);
	font-family:FontText;
	font-size:14px;
	text-align:left;
	z-index:2;
}


#bottom_nav_oggetto{
	position:absolute;
	bottom:5px;
	left:10px;
	width:20%;
}
#bottom_nav_oggetto img{
	width:30px;
}

#pagine_nav{
	display:none;
	position:absolute;
	bottom:50px;
	right:10px;
}

/* STRUTTURA */
#top_nav_itinerario{
	float:right;
	right:2px;
	position:absolute;
	top:47px;
}

.titolo_itinerario{
	padding-top:8px;
	padding-left:10px;
	color:#3F1A0E;
	float:left;
	font-size:28px;
	font-weight:bold;
	font-family:FontTitle;
	line-height:100%;
	letter-spacing:-1px;
	width:65%;
}

#content_itinerario{
	position:absolute;
	width:1000px;
	top:90px;
	z-index:1;
}
.sfondo_cartina1{
	background:url(../img/itinerario1/Percorso_grande.png);
	height:600px;
}
.sfondo_cartina2{
	background:url(../img/itinerario2/Percorso_grande.png);
	height:600px;
}
.sfondo_cartina3{
	background:url(../img/itinerario3/Percorso_grande.png);
	height:600px;
}
.sfondo_cartina4{
	background:url(../img/itinerario4/Percorso_grande.png);
	height:600px;
}

#percorso_cartina{
	height:600px;
	position:relative;
	top:0;
	left:0;
	right:0;
	z-index:3;
}

.icona_dettagli_tappa{
	max-width: 150px;
	height: auto;
	position:relative;
	background-color: rgb(153,153,153); /* IE < 9 */
	background-color:rgba(153,153,153,.7);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.icona_dettagli{
	display:none;
	max-width: 150px;
	height: auto;
	position:relative;
	background-color:rgb(0,0,0); /* IE < 9 */
	background-color:rgba(0,0,0,.7);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	z-index:2;
}

.icona_scheda{
	float:right;
	position:relative;
	padding:3px;
}
.icona_titolo{
	font-family:FontTitle;
	font-size:12px;
	color:#FFF;
	float:left;
	position:relative;
	padding:5px;
	max-width: 110px;
}