@font-face {
    font-family: myFirstFont;
    src: url(../fonts/LobsterTwo-Regular.ttf);
}
@font-face {
    font-family: myFirstFont;
    src: url(../fonts/LobsterTwo-BoldItalic.ttf);
    font-weight: bold;
}
html {margin:0;
	height: 100%;
	min-height: 100%;
}

body {background: #000; /* For browsers that do not support gradients */
  background: -webkit-radial-gradient(circle, rgba(255,255,255,0),rgba(0,0,0,1)); /* Safari */
  background: -o-radial-gradient(circle, rgba(255,255,255,0),rgba(0,0,0,1)); /* Opera 11.6 to 12.0 */
  background: -moz-radial-gradient(circle, rgba(255,255,255,0),rgba(0,0,0,1)); /* Firefox 3.6 to 15 */
  background: radial-gradient(circle, rgba(255,255,255,0),rgba(0,0,0,1)); /* Standard syntax */
  background-repeat: no-repeat;
  background-attachment: fixed;
	margin:0;
	padding:0;
	font-family: Georgia, Times New Roman, serif;
	color:#ffffff;
	font-size: 75%;
	height: 100%;
	min-height: 100%;
}

h1 {font-family: myFirstFont;
	color:#ab012d;
	font-size: 1.6em;
	font-weight: normal;
	margin:0;
}

h2 {font-family: myFirstFont;
	font-size: 1.6em;
	font-weight: bold;
}

h3 {
	font-size: 1em;
	font-weight: bold;
}

h4 {
	font-size: 0.9em;
	font-weight: bold;
}

p {
	font-family: Georgia,Times New Roman, serif; font-size:1.1em;font-weight: 200; padding:10px;margin:0;background-color:#fff;
}

a, a:link, a:visited {padding:0 2px 0 2px;color:#a8712e;text-decoration:none;background-color:inherit;}
a:hover {color: #000000;background-color:inherit;}
a:active {color: #0000aa;background-color:inherit;}
form {background-color: #CCCC99;color:inherit;}
td, th {font-family: Georgia,Verdana, Arial, Helvetica, sans-serif;font-size: 1.1em;}
hr {color:#896636;background-color:inherit;}

img {border:1px solid transparent;box-shadow: 0 0 10px #aaa;padding:5px;background-color: rgba(255,255,255,0.3);}
figcaption {font-size: 0.8em;color:#000;clear: both;display: table-caption; caption-side: bottom}
figure.fotoDX figcaption{margin: -1em 0 1em 14px;}
figure.fotoCN figcaption{margin: 0 0 1em 0;}
figure.fotoSX figcaption{margin: -1em 14px 1em 0;}
figure{text-align:center;display:table}
/*figcaption:before {content: "."; display: block; height: 0; clear: both; visibility: hidden;}*/

#container {border:1px solid transparent;
    display: -webkit-flex; /* Safari */
    display: flex;
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    flex-wrap: wrap;
	position:relative;
	top: 0; 
	width: 100%;
	min-height: 100%;
	height: 100%;
}

#container:after {content: "."; display: block; height: 0; clear: both; visibility: hidden; }

header {position:relative;height:auto; margin-top:0; width:100%; z-index:10}
header #logo a {margin:0 0 0 0;display:block;width:100%;height:100%;float:left;background: url(../images/logo.png) no-repeat center top ;background-size: auto auto;}
header span {visibility:hidden}

header #logo {position:relative;z-index:3;height:153px;padding:3.0em 0.3em 0 0}

header:after {content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#camera_index {position:absolute;z-index:2;left:0;top:206px;margin:0 0 0 0;float:left; width:100%;}
#camera_index img {width:97%;}

footer {float:left;
position:relative;
top:-10px;
text-align:center;
height:140px;
	width: 100%;
	margin:0;
}
#center {
position:relative;
top:0;
width: 100%;
padding:0 0 0 0;
margin:0 0 0 0;
box-sizing: border-box;z-index:9}

#address, #disclaimer {font-family: Georgia, Times New Roman, serif;
position:relative;text-align:center;
top:30px;
color:#fff;
background-color:inherit;
font-size:0.85em;
padding:0 2px 0 2px;
margin:0;
width:99%;
height:auto;
line-height: 1.2;
}
#disclaimer {width:100%;margin-top:2em;  padding: 0.3em 0 0.3em 0}

#address a, #address a:link, #address a:visited, #disclaimer a, #disclaimer a:link, #disclaimer a:visited {border: 1px solid transparent; font-weight:bold;padding:0 2px 0 2px;text-decoration:none;color:#ffe4c4;background-color:inherit;}
#address a:hover, #disclaimer a:hover {border: 1px solid black; color:#ffffff; text-shadow:2px 2px #999,-2px 2px #999,2px -2px #999,-2px -2px #999,2px 0 #999,-2px 0 #999,0 2px #999,0 -2px #999;}
#address a:active, #disclaimer a:active {color:#0000aa; background-color:#ffffff}


section {
background: url(../images/content_sfo.png);
border:8px solid rgba(255,255,255,0.3);
border-radius: 4px;
top:0;
left:0;
min-height:360px;
width:100%;
color:#000000;
font-size:1.1em;
text-align:justify;
box-sizing: border-box;}

* html section {  /* This is the Tan hack */ height:360px}

section:before {content: "."; display: block; height: 0; clear: both; visibility: hidden; }
section:after {content: "."; display: block; height: 0; clear: both; visibility: hidden; }
section .area {padding:0;margin:30px 16px 36px 16px;}
section h1 {font-size:2.2em;width:100%; background: url(../images/rigabianca.gif) no-repeat right 0.6em; background-size: 1120px 3px; margin-left:0;text-shadow:2px 2px #fff,-2px 2px #fff,2px -2px #fff,-2px -2px #fff,2px 0 #fff,-2px 0 #fff,0 2px #fff,0 -2px #fff,0px 0px 8px #222;padding:0;color:#000;}
section h2 {text-align:center;margin-left:0;text-shadow:2px 2px #fff,-2px 2px #fff,2px -2px #fff,-2px -2px #fff,2px 0 #fff,-2px 0 #fff,0 2px #fff,0 -2px #fff,0px 0px 8px #222;padding:0;color:#000;}
section ul, section ol {font-size:1.1em;font-weight: 200; padding-top:10px;padding-bottom:20px;margin:0;background-color:#fff;}
section ol li ul li {list-style-type:disc;font-size:0.9em;}

nav {font-family: myFirstFont;font-size:2.2em;
    display: -webkit-flex; /* Safari */
    display: flex;
    -webkit-justify-content: center; /* Safari 6.1+ */
    justify-content: center;
    -webkit-align-items: flex-start; /* Safari 7.0+ */
    align-items: flex-start;
    -webkit-flex-wrap: nowrap; /* Safari 6.1+ */
    flex-wrap: nowrap;
    }
    
nav#menu { z-index:5;height:auto;  width:100%; margin:2px 0 0 0 ; padding:0; position:relative; top:0; right:0; text-align:center;}
nav#social { z-index:4;height:auto; width:100%; margin:2px 0 0 0 ; padding:0; position:relative; top:0; right:0; text-align:center; }
nav#lavoro { z-index:6;height:auto;  width:100%; margin:2px 0 0 0 ; padding:0; position:relative; top:0; right:0; text-align:center;}

nav#menu ul,
nav#social ul,
nav#lavoro ul {margin:0; padding:0; width:100%}
nav#menu li {display: block; list-style:none; margin:5px auto 5px auto; width:100%;}
nav#menu li.selected {width:100%; color:#fff; padding:5px 25px 5px 25px; margin:0; background:#ab012d;box-sizing: border-box;}
nav#menu a,
nav#menu a:link,
nav#menu a:visited {display: inline-block ; padding:5px 25px 5px 25px; margin:0; color:#fff; text-shadow:0px 0px 8px #222;width:100%; box-sizing: border-box;
    -webkit-transition: background-color 1s; /* Safari */
    transition: background-color 1s;}
nav#menu a:hover {background-color:#d58096;color:#fff;text-shadow:none;}
nav#menu a:active {background-color:#000;color:#f26522;}

nav#social ul li {display: inline-block ;list-style:none; padding:0; margin:5px 5px 5px 5px; width:39px; height:39px; }
nav#social a span {display:none}
nav#social ul li a,
nav#social ul li a:link,
nav#social ul li a:visited {display: inline-block ;padding:0; margin:0; width:100%;height:100%; box-sizing: border-box; background: no-repeat 0 0 }
nav#social ul li a:hover {background-position: 0 -39px}
nav#social ul li a.disabled {background-position: 0 -78px; cursor:default;}

nav#social ul li:first-child a  {background-image: url(../images/bot_FB.png)}
nav#social ul li:nth-child(2) a {background-image: url(../images/bot_TW.png)}
nav#social ul li:nth-child(3) a {background-image: url(../images/bot_GP.png)}
nav#social ul li:nth-child(4) a {background-image: url(../images/bot_IG.png)}
nav#social ul li:last-child a   {background-image: url(../images/bot_PE.png)}

html>body, html>body#container {
	height: auto;
 }
nav#lavoro ul {position:absolute; width:239px ; height:210px ;background: url(../images/Bollo_Job.png) no-repeat 0 0; background-size: 239px 210px}
nav#lavoro ul li {display: inline-block ;list-style:none; padding:0; }
nav#lavoro ul li a {display: inline-block ;padding:0; margin:0; box-sizing: border-box; width:239px ; height:210px; }
nav#lavoro a span {display:none}

/*foto*/
.fotoCN {width:100%;text-align:center;position:relative; left:0; float: left; margin:0.3em 0.6em 0.3em 0;}
.fotoSX {width:100%;text-align:center;position:relative; left:0; float: left; margin:0.3em 0.6em 0.3em 0;}
.fotoDX {width:100%;text-align:center;position:relative; right:0; float: right; margin:0.3em 0 0.3em 0.6em;}
.fotoCN img,.fotoSX img,.fotoDX img, figure img {margin:5px auto 5px auto;border:1px solid transparent;width:96%}
.fotoCN p,.fotoSX p,.fotoDX p {margin-top:-5px;background:none;text-shadow:2px 2px #fff,-2px 2px #fff,2px -2px #fff,-2px -2px #fff,2px 0 #fff,-2px 0 #fff,0 2px #fff,0 -2px #fff,0px 0px 8px #222;text-align:center;font-size:0.8em}
.fotoSX img {position:relative;left:0;float: left; margin:5px 0 5px 0;}
.fotoDX img {position:relative;right:0;float: right; margin:5px 0 5px 0;}

.fotoSX a, .fotoSX a:link, .fotoSX a:visited,
.fotoCN a, .fotoCN a:link, .fotoCN a:visited,
.fotoDX a, .fotoDX a:link, .fotoDX a:visited {background:none;padding:0;display:block;top:0;left:0;width:100%}

.fotoSX a:hover, .fotoSX a:active,
.fotoCN a:hover, .fotoCN a:active,
.fotoDX a:hover, .fotoDX a:active {padding:0;background:none;top:0;left:0}
a:hover img {border:1px solid #999;}

/*
.fotoSX,
.fotoDX {clear:both;position:relative;min-height:160px;height:auto;padding:4px 0 4px 0;margin-bottom:10px;}
*/
.fotoSX:after,
.fotoDX:after {content: "."; display: block; height: 0; clear: both; visibility: hidden; }


table {width:100%;border:1px solid #999; border-collapse: collapse;}
tr:nth-child(odd) {background: #ffe4c4;}
tr:nth-child(even) {background: #fff;}
td {padding: 2px 8px 2px 8px;}
td:first-child {font-weight:bold}
td:nth-child(even), td:last-child { text-align:center}

/*gallery*/
video {width:100%; height:auto; box-shadow: 0 0 10px #999; background-color: rgba(255,255,255,0.5);padding:5px;	border-radius: 4px;box-sizing: border-box;}
#gallery div {height:auto;
    display: -webkit-flex; /* Safari */
    display: flex;
    -webkit-justify-content: center; /* Safari 6.1+ */
    justify-content: center;
    -webkit-align-items: flex-start; /* Safari 7.0+ */
    align-items: flex-start;
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    flex-wrap: wrap;
    }
#gallery div figure {margin:0 0 20px 0;width:auto; height:auto;}

/*promo*/
#promo div {height:auto;
    display: -webkit-flex; /* Safari */
    display: flex;
    -webkit-justify-content: center; /* Safari 6.1+ */
    justify-content: center;
    -webkit-align-items: flex-start; /* Safari 7.0+ */
    align-items: flex-start;
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    flex-wrap: wrap;
    }
#promo div figure {margin:0 0 20px 0;width:auto; height:auto;}

/*home*/

#home, #home_2, #home_3, #home_promo {height:auto;
    display: -webkit-flex; /* Safari */
    display: flex;
    -webkit-justify-content: space-around; /* Safari 6.1+ */
    justify-content: space-around;
    -webkit-align-items: flex-start; /* Safari 7.0+ */
    align-items: flex-start;
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    flex-wrap: wrap;
    }

#home div, #home_2 div, #home_3 div, #home_promo div {width:100%;}
#home figure, #home_2 figure, #home_3 figure, #home_promo figure {margin:auto;width:100%; height:auto;}
#home figure img, #home_2 figure img, #home_3 figure img, #home_promo figure img {width:100%;}
#home figure, #home_2 figure, #home_3 figure, #home_promo figure {display:inline-block;margin:5px auto 5px auto}
#home figure figcaption, #home_2 figure figcaption, #home_3 figure figcaption, #home_promo figure figcaption {display:block}
#home h2, #home_2 h2, #home_3 h2 {text-shadow: none; width:100%;}
#home h1, #home_2 h1, #home_3 h1 {width:100%; text-align:center}
nav#menu li#home_promo {position:absolute; bottom:auto;top:160px; right:0px; z-index: 100;width:150px;}
nav#menu li#home_promo a {background: url(../images/GiftCard.png) no-repeat 0 0; background-size:100%;width:150px;height:154px;display:block;}
nav#menu li#home_promo a span {visibility:hidden}

/*chisono*/
#box {width:100%; background:#fff }
#chisono article#products {
    width:100%;
    -webkit-justify-content: center;
    justify-content: center;
    }
#chisono article figure {margin:0;width:100%;}
#products h2 {width: 100%;}
#products p {background-color:transparent; width: 100%; text-align:center}
#products div {margin:0; text-align:center}
#products div a {background-repeat: no-repeat;background-position: center 0 ;text-align:center;display:block; width:220px; height:220px;margin:5px auto 5px auto; }
#products div a:hover {background-position:center -220px ;}
#products div a span {display:none}
#farmagan a {background-image: url(../images/prodotti/farmagan.png)}
#barba a {background-image: url(../images/prodotti/barba.png)}
#barbermind a {background-image: url(../images/prodotti/barbermind.png)}
#bluebeard a {background-image: url(../images/prodotti/bluebeard.png)}
#drk a {background-image: url(../images/prodotti/drk.png)}
#fawcett a {background-image: url(../images/prodotti/fawcett.png)}
#mrbear a {background-image: url(../images/prodotti/mrbear.png)}
#proraso a {background-image: url(../images/prodotti/proraso.png)}
#reuzel a {background-image: url(../images/prodotti/reuzel.png)}
#solomon a {background-image: url(../images/prodotti/solomon.png)}
#suavecito a {background-image: url(../images/prodotti/suavecito.png)}

/*dove sono*/
#dovesono {}
#googleMap {width:97%;height:400px;}
#googleMap img {box-shadow: none; background-color: transparent;}
.prova {box-shadow: 0 0 10px #aaa; background-color: rgba(255,255,255,0.3);padding:5px;}
#tariffe {display:table; background: #fff; width:100%; padding: 3px; box-sizing: border-box; text-align:left;}
#tariffe h3 {font-size: 1.6em; background: #ffe4c4; padding:3px; margin-bottom:2px}
#tariffe h4 {font-size: 1.2em; padding:3px; margin:10px 0 2px 0}
#tariffe p {padding: 3px; }
#tariffe p span {float: right; font-weight: bold; font-style: italic}
#mappetta iframe {width:97%;height:800px;}

/*icontatti*/
#icontatti h2, 
#icontatti h3 {width:100%;text-align: center;padding:0}
#icontatti h4,
#icontatti h5,
#icontatti p,
#icontatti ul {margin:0 0 1em 0;text-align: center;}
#icontatti a, #icontatti a:link, #icontatti a:visited {font-weight:bold;padding:0 4px 0 4px;}
#icontatti a:hover {color:#ffffff; text-shadow:2px 2px #999,-2px 2px #999,2px -2px #999,-2px -2px #999,2px 0 #999,-2px 0 #999,0 2px #999,0 -2px #999;}
#icontatti a:active {color:#0000aa; background-color:#ffffff}
#icontatti figcaption {display:none}

/*stili popup*/
#popup {color:inherit;padding:0;margin:0;text-align: center;}
#popupimg img {box-shadow: 0 0 10px #999; background-color: rgba(255,255,255,0.5);padding:5px;margin:5px 0 5px 0;}
#putext {color:#000000;margin:-20px 0 10px 0;padding:10px 0 5px 0;text-align:center;}
#pubuttons {height:30px;text-align:center}
#close,
#print {box-shadow: 0 0 10px #999; background-color: rgba(255,255,255,0.5);font-weight:bold;padding:0;height:20px;font-family: myFirstFont;border:1px solid silver;margin:1em 2em 0 2em; font-size:1.1em}
#popup form {background-color:transparent;color:inherit;padding:0;margin:0}
#popup h3 {margin:0.3em 0 0.6em 0;text-shadow:2px 2px #fff,-2px 2px #fff,2px -2px #fff,-2px -2px #fff,2px 0 #fff,-2px 0 #fff,0 2px #fff,0 -2px #fff,0px 0px 8px #222;}
span.cook a {font-weight:bold;font-size: 1.2em}
span.footercook a {font-size:1em}

/*Info Window della mappa*/
#content,
#content h1, 
#content h2,
#content p {font-size:0.9em;padding:0;margin:0;text-align:center},
#content p {font-family: Georgia;}

#content {}
#content h1 {font-family: myFirstFont;font-size:2em;font-weight:bold}
#content h2 {font-family: myFirstFont;font-size:1.6em;text-shadow:none;margin-bottom:0.3em}
#content a, #content a:link, #content a:visited {font-weight:bold;padding:0 2px 0 2px;text-decoration:none;color:#a8712e;background-color:inherit;}
#content a:hover {color:#ffffff; text-shadow:2px 2px #999,-2px 2px #999,2px -2px #999,-2px -2px #999,2px 0 #999,-2px 0 #999,0 2px #999,0 -2px #999;}
#content a:active {color:#0000aa; background-color:#ffffff}