html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}
input:focus, textarea:focus {outline:none;}
/* Clear Floats */
.clearfix:before,  
.clearfix:after {content:""; display:table; clear:both;}

.center			{text-align:center;}

.rosso			{background-color:#841919;}
.carminio		{background-color:#671730;}
.magenta		{background-color:#782542;}
.mattone    {background-color:#802d2d;}
.petrolio		{background-color:#1e3034;}
.indaco			{background-color:#373866;}
.nero				{background-color:#1f1f1f;}
.prugna			{background-color:#4d2241;}
.fucile			{background-color:#384240;}
.azzurro		{background-color:#1c5fbd;}
.avio				{background-color:#2f334d;}
.rosa				{background-color:#deb8d4;}
.blu				{background-color:#191625;}
.bottiglia	{background-color:#283b38;}
.bianco			{background-color:#ffffff;}

.overlay		{mix-blend-mode:soft-light;}
.luminosity	{mix-blend-mode:soft-light;}

body, html 	{min-height:100vh; margin:0; padding:0; text-shadow:1px 1px 0 white;}
body 				{height:100%; font:1.2rem "Trebuchet Ms", Helvetica, Arial, sans-serif; color:#666; background:url('../imgs/bg_silk.jpg') no-repeat center center / cover;}
#container	{position:relative; max-width:980px; min-height:100%; height:100%; margin:0 auto; /*display:table;*/}
header 			{clear:left; max-width:980px; overflow:hidden;}
nav					{position:relative; margin-top:90px;}
a 					{text-decoration:none; color:inherit;}
a.u					{border-bottom:1px dotted;}
section			{clear:left; overflow:hidden; margin-bottom:40px; padding:10px;}

#logo				{float:left; width:271px; height:65px; margin:50px 60px 30px 20px; background:url('../imgs/logo.svg') no-repeat 0 0 / contain;}
#menu				{position:relative; height:45px; list-style:none; color:#B8B5B9;}
#menu li 		{float:left; margin-right:10%; text-shadow:1px 1px 0 white;}
#menu li:nth-child(3) {margin-right:0;}
#menu li.here {color:#666;}
#menu li a  {transition:color .15s ease-in-out;}
#menu li a:hover {color:#333;}
img.bodies	{height:220px;}
#menu-sep		{position:absolute; top:100%; right:0;}


h1 					{font-size:26px; color:#969696;}
h2 					{font-size:20px; margin-bottom:30px; color:#969696;}

section.cookie-policy h2,
section.cookie-policy h3 {margin:10px 0; color:black;}
section.cookie-policy p,
section.cookie-policy li {margin:5px 0; font-size:15px;}
section.cookie-policy a {font-weight:bold; color:#666; border-bottom:1px dotted;}
section.cookie-policy p.nb {padding:20px; margin:0; border:1px solid;}

div.home		{width:100%; min-height:400px; background:url('../imgs/stretching.png') no-repeat bottom right; color:#969696;}
div.home p	{font-size:17px; line-height:1.6em;}
div.home .first {float:left; font-size:60px; height:50px; width:40px; line-height:60px;}

.fancybox-nav {width:60px;}
.fancybox-nav span {visibility:visible; opacity:0.5;}
.fancybox-nav:hover span {opacity:1;}
.fancybox-next {right:-60px;}
.fancybox-prev {left:-60px;}

div.couple	{position:relative; float:left; height:220px; min-width:230px; margin:60px 10px 10px 25px; padding:20px 10px 10px; border:1px solid #ccc; text-align:center; cursor:pointer;}
.couple h5	{position:absolute; top:-12px; left:20px; font-size:16px; padding:2px 5px; margin:0; background-color:#dcdcdc; /*border:1px dashed white;*/ display:inline-block; z-index:15;}
.couple > a img		{opacity:0.5; transition:opacity .15s ease-in-out;}
.couple:hover a img {opacity:1;}

div.scheda			{max-width:387px; background-color:white; display:none;}
div.img-cont		{position:relative; max-width:387px; clear:both; transition: background-color 300ms linear; cursor:pointer;}
div.scheda img 	{margin:0 0 20px 0; max-width:100%; display:block;}
div.scheda img.over {position:absolute; top:0; left:0;  mix-blend-mode: multiply;}
div.scheda img.overlay,
div.scheda img.luminosity {position:absolute; top:0; left:0;}
div.desc					{clear:both;}
div.scheda h6			{margin:0; font-size:12px;}
div.scheda p			{font-size:12px; margin:0 0 10px;}
div.scheda p:last-child {padding-left:5px;}

div.scheda span		{position:relative; width:30px; height:30px; border:1px solid white; box-shadow:0 0 5px rgba(0,0,0,.5); margin:5px 5px 0 0; display:inline-block; z-index:8050;}
div.scheda span.selected {box-shadow:0 0 5px 4px black;}

div.scheda h4 span {width:auto; height:auto; font-size:80%; font-style:italic; box-shadow:none; margin-left:5px; display:inline-block;}

/*#contact					{width:600px; margin:0 auto;}*/
form#contatti			{margin:0 auto; width:500px; padding:20px;}
form#contatti p		{margin-bottom:10px;}
input[type=text]	{border:none; width:420px; height:20px; padding:2px 5px; margin-right:-5px; font-size:14px; background-color:transparent; border-bottom:1px dotted #ccc;}
input#dati				{margin-left:-20px;}
textarea					{width:100%; height:150px; font:14px "Trebuchet MS",arial,sans-serif; padding:2px 5px; margin-bottom:10px; border:1px dotted #ccc; resize:none;}
label							{width:75px; font-size:14px; display:inline-block; cursor:pointer;}
label.checkBox		{width:100%; border:none; padding-left:20px; margin-bottom:20px; font-size:12px;}

input#preview,
input#cancella,
input#invia,
input#modifica,
input#ok				{border:none; background-color:#ccc; border-right:2px solid #aaa; border-bottom:2px solid #aaa; border-radius:5px; cursor:pointer; 
								float:right; font-weight:bold; margin:0 2px 0 20px; padding:5px 10px; text-shadow:1px 1px 0 white;
								transition:color .25s ease-in-out; transition:background-color .25s ease-in-out;}
input#preview:hover,
input#cancella:hover,
input#invia:hover,
input#modifica:hover,
input#ok:hover		{background-color:#666; color:white; text-shadow:none;}

#error					{float:left; font-size:14px; font-weight:bold;}

p.previewMitt		{font-size:80%; margin-bottom:15px;}
p.mess					{font-size:90%; margin-bottom:15px;}
p#OK						{margin:30px auto 0; text-align:center;}
input#ok				{float:none;}


footer 			{clear:left; width:100%; height:100px; background:url('../imgs/sep_menu.png') no-repeat center top / 130%;}
footer p		{text-align:center; font-size:14px; height:100px; width:100%; line-height:100px;}


@media screen and (max-width:980px) and (orientation:portrait){
	
	body	{font-size:2.7rem;}
	#container {max-width:91%;}
	#logo	{clear:both; width:850px; height:210px; background-size:80%; background-position:center 0;}
	nav		{clear:both;}
	
	#menu	{width:80%; margin:0 auto; padding-bottom:40px;}
	#menu li {margin-right:9%;}
	#menu-sep	{position:relative; top:20px; height:20px; display:block; width:100%;}
	section		 {padding:40px;}
	section h1 {font-size:50px;}
	section h2 {font-size:40px;}
	section p	 {font-size: 35px!important;}
	
	div.home   {padding-bottom:60px;}
	div.home .first	{font-size:120px; height:100px; width:90px; line-height:110px;}
	
	div.couple		{float:none; height:600px; text-align:center;}
	div.couple h5	{top:-40px; font-size:46px;}
	div.couple > a img {height:100%; opacity:1;}
	div.scheda		{max-width:900px; height:auto;}
	div.scheda img{width:900px;}
	div.scheda h6	{font-size:36px;}
	div.scheda p	{font-size:28px;}
	div.scheda span {width:50px; height:50px;}
	div.img-cont	{max-width:100%; border-width:2px;}
	.fancybox-title {font-size:30px;}
	
	form#contatti	{width:100%;}
	label					{font-size:37px; width:175px;}
	input[type=text] {height:30px; font-size:25px;}
	textarea			{height:300px; font-size:25px; margin-top:50px;}
	label.checkBox {font-size:22px;}
	
	input#preview,
	input#cancella,
	input#invia,
	input#modifica,
	input#ok			{font-size:30px;}
	
	#error				{font-size:27px; width:567px;}
	
	footer p	{font-size:60%;}
	
}

@media screen and (max-width:980px) and (orientation:landscape){

	div.scheda		{max-width:800px; max-height:100%;}
	div.scheda h4	{margin-bottom:20px;}		
	div.scheda p	{font-size:8px;}
	div.img-cont	{float:left; margin-right:20px; max-height:350px;}
	div.desc			{clear:none;}

}

