@charset "utf-8";

@font-face 
{
    font-family: narrow; /* Гарнитура */
    src: url(fonts/AR80N.svg); /* Для IOS */
    src: local(narrow), url('fonts/MyriadPro-Cond.otf'); /* Для остальных  */	
}
.narrow {font-family:narrow}

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
html * { max-height:999999px; }
body {margin-top:0.5em}
img {max-width:100%}
video {width:100%}

h1 {text-align:center; clear:both}
h3{color: #555; text-align:left}
h4{color: navy; margin:2px 0; text-align:left}
h5{margin:2px 0; text-align:left; font-size:1em}
h2{
	color: #006; clear:both;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", monospace; text-align:left
}

a{color:navy; 
  font-weight: bold;
  text-decoration: none;}
a:hover{
	color: navy;
	text-decoration: underline;
}
a:link {
  	font-weight: bold;
	color: navy}
.link {
  	font-weight: bold;
	color: navy}

dd{	margin-left: 4%;
	text-align: left;}
dt{color:black; 
    text-decoration: none;
	font-style:italic;}  
	
table {table-layout:fixed; box-sizing:border-box; text-align:left}
tr:hover {background-color:#eeeeee}
td {vertical-align:top}
th {vertical-align: middle; text-align:center}

div {box-sizing:border-box}

/* breadcrumb */
.breadcrumb a , a.breadcrumb {background:rgba(220,220,220,0.5); border-radius: 12px; 
padding:0.1em 0.5em; margin: 0.2em; box-shadow: 2px 2px 4px rgba(0,0,0,.5);
line-height:1.3em; margin-bottom:0.2em; display:inline-block; text-align:left}
.breadcrumb a:hover {box-shadow:0 0 0 0; text-decoration:none}
.breadcrumb > table {border-spacing:1em;}
.breadcrumb td {padding:3px 6px 3px 0px}

/* main part */
.maintext {margin-left: 4%;}

.main > div {display:inline-block; vertical-align:top; }
.main > table {display:inline-block; vertical-align:top; padding:0em 0.8em; }
div.main {width:98%; position:relative;}
div.main {border-bottom:thick solid lightgray;} /* linea divisoria gragia */

/* style per menu */
.menu { box-sizing:border-box;}
.menu td a {background:rgba(220,220,220,0.5); border-radius: 4px; padding:0.4em 0.3em; box-shadow: 2px 2px 4px rgba(0,0,0,.5); line-height:1.5em; display:inline-block; margin-bottom:0.3em; width:100%}
.menu a:hover {box-shadow:0 0 0 0}
.menu tr:hover {background-color:transparent}
.menu table {border-spacing:0.7em; max-width:80%}
.menu td {padding:3px 6px 3px 0px}
.menu > img {display:block}
div.menu, nav.menu  {width:16em; margin:0 1em 0 0.3em}
nav {display:inline-block; vertical-align:top; }

	/* nuovo [dal 09/2017] stile menu: attaccato, per mobili: nascosto */
nav.menu_main {position:relative; margin-left:0.5em; margin-top:1em}
.menu_main  a {display: table-row;  width:100%;  }
.menu_main  a  > span {display:block; padding:0.5em; border-bottom: 1px solid white;border-top: 1px solid white;background:rgba(220,220,220,0.5);}
.menu_main  a:hover {background:#CFF; color:#630; text-decoration:none}
.menu_main  a > span:hover {border-bottom: 1px solid gray; border-top: 1px solid gray;}
.menu_main img {width:3em; float:left;} 
.menu_main > span {display:none; cursor:pointer } /* <-- Immagine ||| menu */
.menu_main > div {transition: all 1s}

/* style per parte centrale*/
div.centro  {width:55%; text-align:justify;  margin:0 0.3em}
div.centro ul li {text-align:left;}

/* style per parte destra */
.destra {
	font-size: x-small;
	font-stretch:condensed;
	text-align:right;
	list-style-type: none;
	font-family: "Courier New", monospace;
	}
div.destra 	{max-width:12.5em; margin:0 0 0 2.5em; padding-right:0; }
.destra a {color: blue; text-decoration:underline; font-weight:normal }
.destra a:hover {
	color: red;
	text-decoration: underline; font-weight:bold;
}

/* tabella a strisce */
.tabella_zebra tr:nth-of-type(even) { background-color:#EEE; }
.tabella_zebra tr:nth-of-type(odd) { background-color: #DDD; }
.tabella_zebra td {padding:1px 5px; border: solid 2px #CCCCCC}
.tabella_zebra th {padding:1px 5px; border: solid 2px #CCCCCC}
.tabella_zebra {border-collapse: collapse; text-align:left}

/* ombra  con la lente e senza--->  */
.ombra {box-shadow: 2px 2px 4px rgba(0,0,0,.5), -1px -1px 2px rgba(0,0,0,.5); }
.ombra:hover {box-shadow:0 0 0 0; cursor:url(http://italiano-perevod.ru/immagini/zoom.png), pointer}

.ombra2, a>img {box-shadow: 2px 2px 4px rgba(0,0,0,.5), -1px -1px 2px rgba(0,0,0,.5); border-radius:3px}
.ombra2:hover {box-shadow:0 0 0 0; cursor:pointer}
a>img :hover {box-shadow:0 0 0 0; cursor:pointer}
a.ombra2 {display:inline-block;}

/* non ricordo che cos'è :( */
.blocco {position:relative;}


/*per i sprite*/
.sprite
{position:absolute; width:10%; font-size:small; margin:0; padding:0; border:0; line-height:0.8em}
.sprite a:hover{color: red;	text-decoration:underline;}

/* vari */
.news {
	margin-left: 4%; 
	font-style:oblique;}

.nome_foto {font-size: x-small; font-style:normal; color: navy;
			text-decoration:none; font-weight:bold; text-align:center}
.nome_foto a:hover{text-decoration: none;}

.documenti a {font-style:normal; color: black;
			text-decoration:none; font-weight:bold; }
			
/* piccoli div slittabili */
div.bludo  {text-align:center; display:inline-block; width:11em; margin-bottom:2em}
div.bludo  img {width:70%; box-shadow: 0.3em 0.3em 0.5em rgba(0,0,0,.5); border: solid; border-radius:1em}
div.bludo  img:hover {box-shadow:0 0 0 0}
.bludo a:hover {text-decoration:none; color:red}

/* stile per piatti, menu, ricette */
.bluda div {text-align:center; display:inline-block; width:11em; margin-bottom:2em}
.bluda div img {width:70%; box-shadow: 0.3em 0.3em 0.5em rgba(0,0,0,.5); border: solid; border-radius:1em}
.bluda div img:hover {box-shadow:0 0 0 0}
.bluda a:hover {text-decoration:none; color:red}
video {width:99%}

/*cornice_ombra - descrizione in cornice come su pagina di Mosca*/
.cornice_ombra {padding: 0.5em 1em; box-shadow: 0.3em 0.3em 0.5em rgba(0,0,0,.5); border: solid navy; border-radius:1em}

.letterine {font-size:smaller}

/* freccia torna su */		
#torna_su {width:3em; position:fixed; bottom:-3px; right:1.5em; display:none;margin:0; padding:0}
		
/* pronuncia e suoni */		
img.suono_link, .suono_link img, suono img {width:3em; box-shadow: 0px 0px 6px rgba(0,0,0,.8); border-radius: 10px; margin-left: 0.2em; margin-right:0.2em}
img.suono_link:hover {box-shadow:0px 0px 1px rgba(0,0,0,1); background-color:#CCC;cursor: pointer}
.suono_link img:hover {box-shadow:0px 0px 1px rgba(0,0,0,1); background-color:#CCC;cursor: pointer}

/* Note */
.nota_segno>img {width: 2em; height:2em; margin:auto; padding:0; border:0}
div.nota_segno {border: 1px solid black; display: inline-block; padding:0.1em 0.4em; text-align:center; margin:0; height:2.4em; }
div.nota_info {border: 1px solid black; display:inline-block; padding:0.2em 0.4em; margin:0; text-align:left; min-height:2.4em; vertical-align: top; }

.nota_translator {font-size:smaller; font-family:  monospace, "Courier", "Verdana"}

/* commenti e risposte */
div.commento {font-family: "Tahoma", "Geneva"; font-size:80%; margin-top:0.3em}
div.risposta {font-style:italic; font-size:80%; margin-left:1em}

/* Descrizione strutturale di un sito da vedere, ristorante, ecc.*/
.strutturale h4 {font-size:100%; display:inline; color:black}

/* elenco tipo servizi (per esempio all'aeroporto): icona e dopo testo*/
ul.servizi {list-style:none; padding:0; }
.servizi li {display:inline-block;margin-bottom:0.5em; width:100%}
.servizi img {width:2em; margin-right:1em; float:left}
.servizi li span {vertical-align: middle}

/*  -  immagini flottanti nel testo -*/
.float_sx {margin:0em 1em 1em 0em; float:left; width:15em}

/*  -  Galleria di immagini e foto grandi -*/
div.galleria_big {text-align:left}
.galleria_big a
	{
		display:inline-block; text-align:center; font-size:80%;
		margin:0.5em; width:15em; vertical-align:top;
	}
.galleria_big a:hover {text-decoration:none}

/*  -  Galleria di immagini e foto molto grandi -*/
div.galleria_xxl {text-align:left}
.galleria_xxl a
	{
		display:inline-block; text-align:center; font-size:80%;
		margin:0.5em 1em; width:21em; vertical-align:top;
	}

/*  tabelle - frasario */
.frasario td {border-bottom: 1px groove #CCC; padding:3px; text-align:left; vertical-align:middle}
.frasario th {border: 2px solid black; border-radius: 3px;}
table.frasario img {width:60%; height:1.2em; box-shadow: 0px 0px 4px rgba(0,0,0,.5); border-radius: 10px; display:block; margin: 4px auto 4px auto;}
table.frasario img:hover {cursor:pointer} 

/*  vari evidenziatori */
div.importante, p.importante {
	background-color:rgba(230,236,236,1.00); 
	padding: 0.5em;
	font-family:'Colibri', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', Verdana, sans-serif;
				}
.plus {
    padding: 0.5em;
    margin-top: 3%;
    background-color: #edf6ed;
}				
.minus {
    padding: 0.5em;
    margin-top: 3%;
    background-color: #f5e9ea;
}
ul.plusminus li {
    line-height: 1.53em;
    background: url(immagini/spunta.png) left center no-repeat;
    padding: 10px 0px 10px 35px;
    list-style: none;
    border-bottom: 1px dotted #D1D6E7;
}

/*  -  canzoni   -*/
table.canzone td {text-align:left;width:50%; padding-bottom:5px}
table.canzone tr {margin-bottom:15px}
table.canzone td:nth-of-type(odd) 
	{
		border-right:black 1px solid; 
		font-family:'Calibri', 'Helvetica', 'Lucida Console', Monaco, 'Courier New', monospace;
	}
table.canzone td:nth-of-type(even) 
	{
		padding-left:0.5em; font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; 
	}



/*  -  schermi con larghezza >= 481 -*/
@media (min-width : 481px)
	{
		.mobile {display:none}
		img.mobile {display:none}		
	}

/*  -  schermi con larghezza < 1380 -*/
@media (max-width : 1380px)
	{
		div.destra 	{max-width:10.5em; margin:0 0 0 1.5em; }
		div.menu {width:13.2em;margin:0 0.8em 0 0.2em}
	}

/*  -  piccoli schermi smartphone, larghezza < 480px -*/
@media (max-width : 480px)
	{
		body {font-family:sans-serif}
		
		div.main {margin:0; padding:0}
		div.centro {width:98%;} 
		div.destra {width:98%} 
		div.menu {width:98%}
		.menu table {max-width:100%; border-spacing:0em}
		.menu td a {margin:0em 0.2em 0.5em;}
		
		.desktop {display:none}
		img.desktop {display:none}
		
		.menu_main > span {display:block; line-height:3em; vertical-align:central;}
		.menu_main > div {opacity:0;}
		
		nav.menu_angolo {position:fixed; top:0em; right:0em;}
		
		.destra {font-size: small;}
		div.destra {max-width:90%; }
		
		.maintext {margin-left:0px;}
		
		.mobile_meno {font-family:narrow}	
		.mobile_meno td {padding:1px}
		
		table.canzone {font-size:90%}
		
		img.pixel_image, video.pixel_image {width:95%}

	}

@media (max-height: 370px)
	{
		body {font-family:sans-serif}
		.menu_main > span {display:block; line-height:3em; vertical-align:central;}
		.menu_main > div {opacity:0; }

	}
