@charset "UTF-8";
@font-face {
	font-family: 'Napo';
	src: url('Napo-Regular.eot');
	src: url('Napo-Regular.eot?#iefix') format('embedded-opentype'),
		url('Napo-Regular.woff') format('woff'),
		url('Napo-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}@font-face{font-family:'icomoon';src:url('fonts/icomoon.eot');src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'), url('fonts/icomoon.woff') format('woff'), url('fonts/icomoon.ttf') format('truetype'), url('fonts/icomoon.svg#icomoon') format('svg');font-weight:normal;font-style:normal}
 html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}
body {
font:normal 100% 'Napo';
	padding:0;
	margin:0;
}
#wrap{max-width:98%;margin-top:2%;padding:0.3em;background:linear-gradient(white,azure);
	background-repeat: repeat;}
header{width:100%;background:linear-gradient(white,azure);
	background-repeat: repeat;clear:both}
	
a{text-decoration:none}ol,ul{list-style:none}

#logo{
	width: 21%;
	height: 110px;
	float: left;
	color: red;
	font-size: 1em;
	font-family: 'Satisfy', cursive;
	position: absolute;
	top: 0px;
	left: 0px;
	text-align: center;
	font-weight: bolder;
	z-index:1000;
	
	background-image: url(images/sfondo.png);
	background-repeat: no-repeat;
}

.nav-bar{width:70%;height:3.90em;border:#8691d3 solid .1em;margin:0 auto;padding:2px;}
ul li{list-style:none}
#nav{margin:0 auto;margin-top:0;z-index:10000;position: absolute; top:0px;left:22%;}
#nav > a{display:none}#nav li{position:relative}#nav li a{color:#fff;display:block}#nav li a:active{background-color:#c00 !important}#nav span:after{width:0;height:0;border:transparent solid .5em;border-bottom:none;border-top-color:#933;content:'';vertical-align:middle;display:inline-block;position:relative}#nav > ul{height:3em;background-color:#000066}#nav > ul > li{width:8em;height:100%;float:left}#nav > ul > li > a{height:100%;font-size:.9em;line-height:3em;text-align:center}#nav > ul > li:not(:last-child) > a{border-right:1px solid #cc470d}#nav > ul > li:hover > a,#nav > ul:not(:hover) > li.active > a{background-color:#900}#nav li ul{background-color:#36f;display:none;position:absolute;top:100%}#nav li:hover ul{display:block;left:0;right:0}#nav li:not(:first-child):hover ul{left:-1px}#nav li ul a{font-size:.9em;border-top:1px solid #e15a1f;padding:.5em}#nav li ul li a:hover,#nav li ul:not(:hover) li.active a{background-color:#900}.clearfix::after{content:'';display:table;clear:both}
.clear{clear:both}
video{max-width:90%;width:60em; height:auto;margin:auto 0;padding:1em;margin:0.50em;}
h1, h2, h3, h4 {font-family: "Napo";font-style:italic;color:#0083d1;}
h1 {font-size:140.6%;line-height:0.90em;text-align: center;clear:both; 
margin:0 auto;padding:0.80em;font-weight: bolder;color:white; background-color:#F30;}
h2 {font-size:130.6%;line-height:0.90em;text-align:center;clear:both;
margin:0.90em 0;padding:3px;font-weight:bolder;}
h3{font-size:x-large;line-height:0.90em;text-align:center;margin:0.56em 0;}
h4{font: normal 0.90em;text-align:center;font-style:italic;}
p{font-family:"Napo";
font-size:1.10em;font-style:italic;line-height:1.2em;text-indent:0.50em;
margin:1.556em 0;padding:0 6.25%;color:#636363}
hr{border:1px dashed;height:.10em;color:#32b0eb}
.color{
	width:99%;
	height: auto;
	font-family: "Napo";font-style:italic;color:#10074c;
	background-color: #32b0eb;
	font-size:130.6%;line-height:0.90em;text-align:center;clear:both;
margin:0px;margin-left:0.10em;padding:3px;font-weight:bolder;}

.alignleft{float:left;padding:15px 15px 15px 0}
.alignright{float:right;padding:15px 0 15px 15px}
.clearfloat{clear:both;height:0;font-size:1px;line-height:0}
section {
	width:98%;
	margin:0 auto;
	margin-top:0.50em;
	padding: 0.50em;
	border-left:0.20em inset red;
border-bottom:0.20em inset blue;	
background:linear-gradient(white,azure);
	background-repeat: repeat;}
#content {
	width:99%;
	margin:0 auto;
	margin-top:0.50em;
	padding: 0.50em;
	background:linear-gradient(white,azure);
	background-repeat: repeat;}
.verde{
	float: left;
	width: 32%;
	height: auto;
	margin-right: 0.10em;
	margin-left: 0.10em;
padding: 0.10em;
	border-left: 0.20em inset red;
	border-bottom: 0.20em inset blue;
	background: linear-gradient(white,azure);
	background-repeat: repeat;
}			
.rosa{
float:left;
width:32%;
height: auto;
margin-right: 0.10em;
margin-left: 0.10em;
padding: 0.10em;
border-left:0.20em inset red;
border-bottom:0.20em inset blue;		
background:linear-gradient(white,azure);
	background-repeat: repeat;}	
.giallo{
float:left;
width:32%;
height: auto;
margin-right: 0.10em;
margin-left: 0.10em;
padding: 0.10em;
border-left:0.20em inset red;
border-bottom:0.20em inset blue;	
background:linear-gradient(white,azure);
	background-repeat: repeat;}	
	.sampleMovie{max-width:18.75em; height:14em;margin-left:0px;padding:0px;float:left;}
.innercontent, footer {
	width:99%;
	height: auto;
margin-right: 0.10em;
margin-left: 0.10em;
padding: 0.10em;
border-left:0.20em inset red;
border-bottom:0.20em inset blue;	
background:linear-gradient(white,azure);
	background-repeat: repeat;}	
	.inner {
	width:49%;
	height: auto;
	float: left;
margin-right: 0.10em;
margin-left: 0.10em;
padding: 0.10em;
border-left:0.20em inset red;
border-bottom:0.20em inset blue;	
background:linear-gradient(white,azure);
	background-repeat: repeat;}	
#copy{text-align:right;font-size:small;font-family:"Courier New",Courier,monospace;padding:2px}
img
{
	max-width:100%;
	height:auto;
	margin:0 auto
}
.alignleft .alignright .dimensione
{
	display:block;
	transition-duration:1s;
	-ms-transition-duration:1s;
	-webkit-transition-duration:1s;
	-moz-transition-duration:1s;
	-o-transition-duration:1s;
	transition-property:transform;
	-ms-transition-property:-ms-transform;
	-webkit-transition-property:-webkit-transform;
	-moz-transition-property:-moz-transform;
	-o-transition-property:-o-transform;
	overflow:hidden
}
.alignleft:hover, .alignright:hover, .dimensione:hover
{
	-ms-transform:scale(1.25,1.25);
	-webkit-transform:scale(1.25,1.25);
	-moz-transform:scale(1.25,1.25);
	-o-transform:scale(1.25,1.25)
}
ul .b {list-style-type:square;}
.cl-effect-10  {
	position: relative;
	z-index: 1;
}

.cl-effect-10 a {
	overflow: hidden;
	margin: 0 15px;
}

.cl-effect-10 a span {
	display: block;
	padding: 10px 10px;
	background: #0f7c67;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}

.cl-effect-10 a::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	padding: 5px 10px;
	width: 50%;
	height: 50%;
	background:linear-gradient(white,azure);
	background-repeat: repeat;
	color: #0f7c67;
	content: attr(data-hover);
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform: translateX(+5%);
}

.cl-effect-10 a:hover span,
.cl-effect-10 a:focus span {
	-webkit-transform: translateX(100%);
	-moz-transform: translateX(100%);
	transform: translateX(100%);
}

.cl-effect-10 a:hover::before,
.cl-effect-10 a:focus::before {
	-webkit-transform: translateX(0%);
	-moz-transform: translateX(0%);
	transform: translateX(0%);
	background: #0083d1;
}




@media only screen and (max-width:62.5em){
#logo{
	width: 18.85%;
	float: left;
	color: red;
	font-size: 1em;
	font-family: 'Satisfy', cursive;
	margin-left:1%;
	margin-top: 1%;
	text-align: center;
}
nav{
float:right;
width:72%;						
margin-top:0%;						
margin-right:2%;					

}	 #nav{width:100%;position:static;margin:0}img{max-width:99%;height:auto;margin:0 auto}}@media only screen and (max-width:40em){
#logo{
	width: 16%;
	float: left;
	color: red;
	font-size: 1em;
	font-family: 'Satisfy', cursive;
	margin-left:1%;
	margin-top: 1%;
	text-align: center;
}
nav{
float:right;
width:70%;						
margin-top:0%;						
margin-right:2%;					

}	

#nav{position:relative;top:auto;right:auto}#nav > a{width:3.125em;height:3.125em;text-align:left;text-indent:-9999px;background-color:#e15a1f;position:relative}#nav > a:before,#nav > a:after{position:absolute;border:#fff solid 2px;top:35%;left:25%;right:25%;content:''}#nav > a:after{top:60%}#nav:not(:target) > a:first-of-type,#nav:target > a:last-of-type{display:block}#nav > ul{height:auto;display:none;position:absolute;left:0;right:0}#nav:target > ul{display:block}#nav > ul > li{width:100%;float:none}#nav > ul > li > a{height:auto;text-align:left;padding:0 .833em}#nav > ul > li:not(:last-child) > a{border-right:none;border-bottom:1px solid #cc470d}#nav li ul{position:static;padding:1.25em;padding-top:0}}
@media only screen and (min-width:240px) and (max-width:320px)
{
	.verde{
float:left;
width:100%;	
margin: 0 auto;
margin-top:6.25%;		
}				
.rosa{
float:left;
width:100%;	
margin: 0 auto;
margin-top:6.25%;			
}
.giallo{
float:left;
width:100%;	
margin: 0 auto;
margin-top:6.25%;				
}

#wrap{
width:100%;
max-width:20em;				
background:#fff;
height:200px;		
}
section, .innercontent{
width:100%;
max-width:320px;
float:left;
background:#fff;
margin:0 auto;	}
p {
	font-size:0.9375em;				
	line-height:1.25em;				
	margin:0 auto;		
}
h1, h2, h3, h4 {
	width:100%;
	font-size:0.9375em;					
	text-align:center;
	border-right:0
	
}
footer{
font-size:0.80em;					
height:30px; 
padding-top:2%;					
}
}
@media only screen and (min-width: 321px) and (max-width: 480px)
{
	

.verde{

width:100%;	
margin-top:auto;		
}				
.rosa{

width:100%;	
margin-top: auto;				
}
.giallo{

width:100%;	
margin-top: auto;			
}
#wrap{
width:100%;
max-width:20em;				
background:#fff;
height:200px;		
}
section, .innercontent{
width:100%;
max-width:480px;
float:left;
background:#fff;
margin:0 auto;	}
p {
	font-size:0.9375em;				
	line-height:1.25em;				
	margin:0 auto;		
}
h1, h2, h3, h4 {
	width:100%;
	font-size:0.9375em;					
	text-align:center;
	border-right:0
	
}
footer{
font-size:0.80em;					
height:30px; 
padding-top:2%;					
}
}
@media only screen and (min-width: 481px) and (max-width: 680px)
{
	
.verde{

width:100%;	
margin-top:auto;		
}				
.rosa{

width:100%;	
margin-top: auto;				
}
.giallo{

width:100%;	
margin-top: auto;			
}
#wrap{
width:100%;
max-width:20em;				
background:#fff;
height:200px;		
}
section, .innercontent{
width:100%;
max-width:680px;
float:left;
background:#fff;
margin:0 auto;	}
p {
	font-size:0.9375em;				
	line-height:1.25em;				
	margin:0 auto;		
}
h1, h2, h3, h4 {
	width:100%;
	font-size:0.9375em;					
	text-align:center;
	border-right:0
	
}
footer{
font-size:0.80em;					
height:30px; 
padding-top:2%;					
}
}
@media screen and (min-width:1900px)
{
.verde{
float:left;
width:33.333%;
background:linear-gradient(white,#6F6);	
border:#8691d3 solid .1em;margin:0 auto;padding:2px;border-radius:10px;box-shadow:5px 5px 10px 2px #8691d3;		
}				
.rosa{
float:left;
width:33.333%;	
background:linear-gradient(white,#FFD1DC);
border:#8691d3 solid .1em;margin:0 auto;padding:2px;border-radius:10px;box-shadow:5px 5px 10px 2px #8691d3;			
}
.giallo{
float:left;
width:33.333%;
background:linear-gradient(white,#FF6);
border:#8691d3 solid .1em;margin:0 auto;padding:2px;border-radius:10px;box-shadow:5px 5px 10px 2px #8691d3;				
}
}