@charset "utf-8";
/* CSS Document */

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Normalize
2.0 General
	2.1 Typography
	2.2 Elements
	2.3 Links
	2.4 Accessibility
	2.5 Alignments
	2.6 Clearings
3.0 Structure
	3.1 Testata
		3.2.1 Logo
		3.2.2 Menus
	3.1.1 divling
	3.2 Contenuto
		3.2.1 mainandlato
		3.2.2 mainnolato
	3.3 Lato
	3.4 Piede
4.0 Forms
5.0 Navigation
6.0 Infinite scroll
7.0 Media
	7.1 Captions
	7.2 Galleries
8.0 Navigation page to page
9.0	Special pages
	9.1 Index
--------------------------------------------------------------*/


/* Reset */

html, body, div, form, fieldset, legend, label
{
	margin: 0;
	padding: 0;	
	overflow:auto;
}

div {
	box-sizing:border-box;
}

table
{
	border-collapse: collapse;
	border-spacing: 0;
}

th, td
{
	text-align: left;
	vertical-align: top;
}

h1, h2, h3, h4, h5, h6, th, td, caption { 
	font-weight:normal;
	margin: 0;
}

p 	{margin: 0;}

img { border: 0; }

ul 	{
	float: none;
	padding: 0px;
	margin: 0px;
	list-style: outside none none;
}

a {
	text-decoration:none;
	}


/*--------------------------------------------------------------
1.0 Normalize  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/

body {
	margin:0px; 
	padding:0px;
	min-height: 100%;
}

#pagina,
#container,
#testata,
#mainandlato,
#mainnolato,
#lato,
#piede {
	overflow:hidden;
} 

/*--------------------------------------------------------------
2.0 General  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/


/*--------------------------------------------------------------
	- 2.1 Typography  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/

@font-face {
    font-family:Robot;
    src: url(robot1.woff);
}

@font-face {
    font-family:Fontawes;
    src: url(fontawesome-webfont.woff);
}

@font-face {
    font-family:Dharma;
    src: url(DharmaGothicE-RegularItalic.woff);
}




body {	
	font-family: Robot,"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 16px;
	color:#2c2e2f;
	line-height: 1.5;
}

h1, h2, h3 {
	font-family: inherit;
	color: #222;
	text-transform: uppercase;
	letter-spacing: 1px;
}

h1 {
	font-size: 34px;
	font-weight: 300;
}

h2 {
	font-size: 28px;
	font-weight: 300;
	margin-bottom:5px;
}

h3 {
	font-weight:bold;
}

.fontawes{
	font-family:Fontawes;
	}
	
	


/*--------------------------------------------------------------
	- 2.2 Elements  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/

p{
	margin-top:0;
	margin-bottom:0;
}

h2 {
	margin:20px 0;
}

h3 {
	border-bottom:8px;
}

a {
	color:#0C0;
}

/* -- BUTTONS -- */



#seemore{
	max-height:30px;
	display:inline-block;
	float:right;
	margin:25px 0;
	padding:8px 8px;
	background-color:#0C0;
	border-radius: 25px;
	border: 2px solid #0C0;
	overflow: hidden;
	font-weight:bold;
	color:#FFF;
	text-transform: uppercase;
	line-height:32px;
	box-shadow: inset 0 0 0 0 #0C0;
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
}

#seemore:hover{
	box-shadow: inset 300px 0 0  0 #060;
}

/* UL */
#features-ul{
	display: inline-block;
	margin: 20px 0 20px 30px;
	}

	#features-ul li{
		padding: 20px 0;
		border-bottom: 1px solid #CCC;;
	}
	
	#features-ul .icons{
		margin-right:10px;
		font-size:26px;
		color:#CCC;
		font-weight:lighter;
		}



.border-bottom{
	border-bottom: 1px solid #CCC;
	min-height:1px;
	margin:6px 0;
}
/*--------------------------------------------------------------
3.0 Structure  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/
#pagina{
}

#container{
	width:90%;
	max-width:1400px;
	margin:auto;
}

/*--------------------------------------------------------------
	- 3.1 Testata  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/
#testata{
	position:fixed;
	z-index:1;
	width:100%;
	max-height:120px;
	top:0;
	padding-bottom:10px;
	background-color:#FFF;
	border-bottom:1px solid #CCC;
}


#testata-spacer{
	margin: 80px 0 0 0;
}

	#topnav{
		width: 100%;
		height: 40px;
		overflow:hidden;
		border-bottom:1px solid #CCC;
		font-size: 14px;
		color: #bababa;
		text-align:right;
		letter-spacing: 1px;
		line-height: 30px;
		font-weight:bold;
		text-align:right;
		}
		
	.topnav-contact{
		display:inline-block;
		margin: 5px 0 5px 15px;
		height:30px;
		background-color:#0C3;
		padding: 0 5px;
		color:#FFF;
	}

	#logo{
		float:left;
		width:30%;
		overflow: hidden;
	}

	  #logofont{
			display:block; 
			margin-top:10px;
			font-size:25px;
			line-height:22px;
			text-decoration:none;
			color:inherit;
			}
			

	#navbar{
		float:left;
		width:70%;
		margin-top:10px;
		text-align:right;
	}


	  #navbar ul{
	  }


		#navbar li {
			display:inline;
		}

		
		#navbar li:first-child {
		}
		
		#navbar li:last-child {
		}
		
		#navbar ul a {
			display:inline-block;
    		padding: 0 0 0 8px;
			text-align: right;
			font-weight:normal;
			text-decoration:none;
			color:rgb(119, 119, 119);
		}
		
				#navbar ul li a::before {
					content: "•";
					margin-right: 10px;
				}	
				
				#navbar li:first-child	a::before{
					content: "";
				}
		
		#navbar ul a:hover {
			color:#0C0;
		}
		
		#toggle-menu {
			display:none;
		}
			

#responsive-navbar{
  display:none;
  }



@media screen and (max-width:820px) {
	#logo{
	  width:70%;
	}
	
		#logofont {
		font-size:19px;
		}
	
	#navbar{
	  width:30%;
	}
	
	
	#navbar ul{
		display: none;
		}
	  
	#navbar li:last-child {
			}

	#toggle-menu{			
			display:inline;
			font-size:24px;
			font-weight:bold;
			color:rgb(119, 119, 119);
	}
	
		
	#responsive-navbar ul {
		margin: 0 auto 30px auto;
		padding: 0;
		width: 200px;
	}

	#responsive-navbar li a {
		display: block;
				background-color: #f1f1f1;
				margin-bottom:5px;
		color: #000;
		padding: 8px 0 8px 16px;
		text-decoration: none;
	}

	#responsive-navbar li a:hover {
		background-color: #555;
		color: white;
	}	
		
		
}

/*--------------------------------------------------------------
	- 3.1 Divling  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/
#divling {
	height:27px; 
	overflow:hidden; 
	text-align:right; 
	padding:1px 5px 0 0; 
	line-height:29px; 
	font-size:90%;
}




/*--------------------------------------------------------------
	- 3.2 Contenuto  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/
#contenuto{
	position:relative;
	margin:30px auto 30px auto;
	background-color:#FFF;
	}
	
#mainandlato{
	position:relative;
	float:left;
	width:67%;
	padding-right:40px;
}

	  @media screen and (max-width: 960px) {
	  #mainandlato{
		  width:100%;
		  padding-right:0;
	  }
	  }	

	#imgprinc{
		width:100%;
		margin: 0 0 30px 0;
		overflow: hidden;
		}

	#imgprinc img{
		max-width:100%;
		}		

#mainnolato{
}

/* **COLONNE ** */
#gruppocol {
	width:100%;
	margin: 0 0 0 0;
	padding:  0 0 0 0;
}

/* 1di2 */

		/*50-50*/
		
		#c1di2, #c2di2 {
			float:left;
			width:50%;
			padding: 0 4%;
		}
		
			  @media screen and (max-width: 500px) {
				  #c1di2, #c2di2 {
					  width:100%;
				  }
			  }
		

		/*33-66*/	
		  
		#c1di2-33-66{
			float:left;
			width:33.3333%;
		}
		
			#c1di2-33-66 img {
				max-width:100%;
				height: auto;
			}	
			
	
		
		#c2di2-33-66 {
			float:left;
			width:66.6666%;
			padding: 0 0 0 2%;
		}
		
			  @media screen and (max-width: 768px) {
			  #c1di2-33-66, #c2di2-33-66 {
				  width:100%;
			  }
			  }	  
	  
	  
		/*66-33*/	
		  
		#c1di2-66-33{
			float:left;
			width:66.6666%;
		}
	
		
		#c2di2-66-33 {
			float:left;
			width:33.3333%;
		}
		
			  @media screen and (max-width: 768px) {
				  #c1di2-66-33, #c2di2-66-33 {
					  width:100%;
				  }
			  }	  
	  

/* 1di3 */

#c1di3, #c2di3, #c3di3 {
	float:left;
	width:33.3333%;
}

	  #c1di3 {
		  padding-right: 14.5px;
	  }

	  #c2di3 {
		  padding: 0 7px;
	  }
	  
	  #c3di3 {
		  padding-left: 14.5px;
	  }	  
 

	  @media screen and (max-width: 768px) {
	  #c1di3, #c2di3, #c3di3{
		  width:100%;
		  margin-top:20px;
		  padding: 0;
	  }
	  }

/* 1di4 */

#c1di4, #c2di4, #c3di4, #c4di4 {
	float:left;
	width:25%;
	padding: 4%;
	
}


	  @media screen and (max-width: 768px) {
	  #1di4, #2di4, #3di4, #4di4 {
		  width:50%;
	  }
	  }
	  
	  @media screen and (max-width: 480px) {
	  #1di4, #2di4, #3di4, #4di4 {
		  width:100%;
	  }
	  }


/*--------------------------------------------------------------
	- 3.3 Lato  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/

#lato{
	position:relative;
	float:left;
	width:33%;
}

	  @media screen and (max-width: 960px) {
	  #lato{
		  width:100%;
		  margin-top:30px;
	  }
	  }
	  
	  

	  
ul#featured-lato{
	display: inline-block;
	margin: 0 0 20px 0;
	padding: 0 0 0 15px;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	border-left: 1px solid #CCC;
	}

	ul#featured-lato li{
		width:100%;
		display:inline-block;
		padding: 20px 0;	
	}
	

	
	ul#featured-lato a{
		display:inline-block;
		width:100%;
		color:#333333;
		border-bottom: 1px solid #CCC;
	}
	
		ul#featured-lato a:last-child {
			border-bottom:none;
		}	
	
		ul#featured-lato a:hover{
			color:#0C0;
		}
	
	
	
	ul#featured-lato .immagine{
		float:left;
		max-width:75px;
		max-height:75px;
		margin-right:10px;
		border: 1px solid #CCC;
		}	
		
		
	ul#featured-lato .titolo{
		font-size:20px;
		font-weight: bold;
		}		  
	  

/*--------------------------------------------------------------
	- 3.4 Piede  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/

#piede{
}

#piedesup{
	background-color: #F5F5F5;
	padding: 30px 0px;
}

#piedeinf{
	padding: 30px 0px;
	background-color: #222;
	color: #DDD;
	font-size: 13px;
	font-weight: 500;
}

		#piedeinf h3{
			color: #919191;
			font-weight: 600;
		}
		
		#piedeinf li {
			color: #FFF;
		}
		

/*--------------------------------------------------------------
	- 9.1 Special pages  ||||||||||||||||||||||||||||||||||||||||||||
--------------------------------------------------------------*/		

/* HOME */	
	
#banner-home {
	margin-top:8px;
	padding: 0 0 80px 0;
	position: relative;
	}

@keyframes moveh2 {
    from {margin-left: -100px; margin-top: -100px;}
    to {margin-left: 0; margin-top: 0;}
}


#banner-home .h2-wrap {
  max-width: 600px;
  margin: 50px 0 0 0;
  padding:20px;
  background-color: rgba(0, 204, 51, 0.9);
  overflow:hidden;
  }		
  
#banner-home .h3-wrap{
	max-width: 600px;
  	margin: 0 0 0 0;
	padding:20px;
	background-color: rgba(0,0,0,.5);
	overflow:hidden;
}
		
	#banner-home h2{
		margin: 0; 
		padding:0;		
		color:#FFF;
		font-size:3rem;
		font-family: Dharma,"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
		text-shadow:15px 5px 20px black;
			animation-name: moveh2;
			animation-duration: 3s;
	}
	
		  @media screen and (max-width: 480px) {
			#banner-home h2{
				font-size:2rem;
			}
		  }	


	#banner-home h3 {
		margin: 0; 
		padding:0;		
		color:#FFF;
		font-family: Robot,"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
		text-shadow:15px 5px 20px black;
			animation-name: moveh2;
			animation-duration: 5s;
	}	

#banner-home .button-wrap{
	max-width: 600px;
  	margin: 0 0 0 0;
	padding:20px;
	overflow:hidden;
	text-align:center;
}

	#banner-home .button-wrap a{
		margin: 0 auto;
		border: 2px solid #fff;
		background: rgba(0,0,0,0.5);
		border-radius: 4px;
		padding: 10px 35px;
		color: #fff;
		font-weight:bold;		
		text-transform: uppercase;
	}

	#banner-home .button-wrap a:hover{
		background:#00CC33;
	}
	
	
/* COMM */

.comm-slideshow{
	padding: 60px 0;
	overflow:hidden;
	background-color:#F8F8F8;
	}

.comm-slideshow li{
	float: left;
	list-style:none; width:100%;
	clear: both; 
	}

.comm-slideshow #c1di2-33-66 img{
	display: block;
	border-radius:50%;
	margin: 0 auto;
}


.comm-slideshow #c2di2-33-66{
	height:150px;
	}

.comm-slideshow .comment{
	display:block;
	font-size: 3em;
	color: #647382;
	}
	
.comm-slideshow .name{
	display:block;
	color: #647382;
	font-weight:bold;
	text-align:center;
	}	
	

#slide1, #slide2, #slide3{

	}
	
.bg-special-dynamic{	
	background-size:cover !important;
	color:#FFF;
	font-size:1.2rem;
	overflow:hidden;
}

.bg-special-dynamic a, .bg-special-dynamic h3{
	color:#FFF;	
}


.bg-special-dynamic #c1di2, .bg-special-dynamic #c2di2{
	padding:30px 0 0 0;
	min-height:400px;
}
	

.bg-special-dynamic img{
	display:none;
	
}

		  @media screen and (max-width: 500px) {
			  .bg-special-dynamic{	
				  background:none!important;
				  	min-height:250px;
					font-size:1rem;	
			  }
			  
			  .bg-special-dynamic #c1di2, .bg-special-dynamic #c2di2{
				  padding:15px 0;
				  min-height:0;
			  }			  
							

			  .bg-special-dynamic, .bg-special-dynamic a, .bg-special-dynamic h3{
				  color:#2c2e2f;	
			  }			  
			  
			  .bg-special-dynamic img{
				  display:block;
			  }			  
							
		  }

/* *************************************** */
.nev{
	/*
	pointer-events:none;
	 position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	*/
	background: none;
	background-image: url('nev-imgs/sn1.png'), url('nev-imgs/sn2.png'), url('nev-imgs/sn3.png');
	z-index:1;
	-webkit-animation: snow 10s linear infinite;
	-moz-animation: snow 10s linear infinite;
	-ms-animation: snow 10s linear infinite;
	animation: snow 10s linear infinite;
}
@keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-moz-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 400px 1000px, 200px 400px, 100px 300px;}
}
@-webkit-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-ms-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}	

/* *************************************** */
