body {
	text-align: center;
	font-size: 0.90em;
	font-family: "Helvetica Neue", Arial, sans-serif;
	
}


/* COLOR */
.green {color: #799730;}
.blue {color: #729998;}
.light_blue {color: #5c94b8;}
.acqua {color: #CAD5DA;}
.orange{color: #dd4627;}
.yellow{color: #f4b230;}
.grey_txt{color: #b3b3b3; font-size: 16px;}

.base {color: #b3b3b3;}
.base_big {color: #b3b3b3; font-size: 36px;}



.container {
	text-align: left;
	font-size: 1em;
	position: relative;
	margin: 0 auto;
	width: 980px;

	font-family: "Helvetica Neue", Arial, sans-serif;

	
}
.menu_top .logo {
	float: left;
	height: 45px;
	margin: 2px 3px 0 0;
	
	
}
.footer {
	position: relative;
	text-align: left;
	width: 980px;
	margin:  20px auto 0 auto;
	font-size: 0.8em;
}
.footer a{color: #000;}
.footer a:hover {color: #666;}
.menu_top {
	position: relative;
	width: 980px;
	height: 45px;
	margin: 20px auto 0 auto;	
	
}

.menu_top ul {
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	
}
.menu_top li{
display: inline;
margin: 0;
padding: 0;
list-style-type: none;
}

.menu_top ul li a{
	margin: 0;
	padding: 0;
	list-style: none;
	height: 80px;
	width: 90px;
	line-height: 5em;
	margin: 0 20px 0 0;
	text-decoration: none;
	color: #000;
	font-size: 1.05em;
	position: relative;
	float: left;
	text-align: center;
	
}
.menu_top ul.contact {float: right;}
.menu_top ul.contact li a {color: #666;}

.menu_top ul li a:hover{color: #5c94b8;}
.menu_top ul li a.active, .menu_top ul.contact li a.active{background: url(../images/hover.png) top center no-repeat}


/* Menu RIGHT */
.menu_right {
	width: 240px;
	float: right;
	margin-top: 50px;
}
.menu_right h1 {
	display: block;
	margin: 0 0 5px 0;
	padding: 0;
	font-size: 14px;
	color: #000;
	font-weight: normal;
}

.menu_right h1.green {color: #799730;}
.menu_right h1.orange{color: #dd4627;}
.menu_right h1.blue {color: #729998;}

.menu_right h1.sq_azzurro {
	padding: 0 0 0 20px;	
	background: url(../images/azzurro.gif) no-repeat left center;
}
.menu_right h1.sq_orange {
	padding: 0 0 0 20px;	
	background: url(../images/orange.gif) no-repeat left center;
}
.menu_right h1.sq_green {
	padding: 0 0 0 20px;	
	background: url(../images/green.gif) no-repeat left center;
}
.menu_right ul{
	list-style: none;
	margin: 0 0 20px 0;
	padding: 0;
}
.menu_right ul li a{
	color: #666;
	text-decoration: none;
	display: block;
	padding: 1px 0;
}
.menu_right ul li a:hover{color: #000; text-decoration: underline;}
.menu_right ul li a.active {color: #000; text-decoration: underline;}

.menu_right img {margin: 0 10px 10px 0;}
.container .content .comand  {float: right; width: 100px; height: 46px; margin: 0;}


.container .content .comand a:hover img {filter:alpha(opacity=50);-moz-opacity: 0.5; opacity: 0.5;}


/* content */
.container .content {
	width: 550px;
	float: left;
	margin: 50px 0 0 135px;
	height: 500px;
	height: auto !important;
	min-height: 500px;
	
	
}
.container .content.large {width: 650px;}
.container .content.large td a.map {color:#808080; margin-left: 10px; }
.container .content.large table { margin-bottom: 20px; }
td a.contatto {color: #000; font-size: 36px; text-decoration: none; margin: 0;}
td a.contatto:hover {text-decoration: underline;}
/******************************************
*************** PROGETTI *****************
*******************************************/

/* Ref position project left= +135px  top=+110px 

am= area mamme ar= area ragazzi ag= area giovani - l'ordine è riferito alla posizione nel menù right*/

.container .content a.project {
	position: absolute; cursor: pointer;}

.container .content a.project.mammarsupio {
	top: 85px;
	left: 250px;
	width: 155px;
	height: 155px;
	background: url(../images/mammarsupio.jpg) no-repeat top left;
}
.container .content a.project.meno9 {
	top: 250px;
	left: 135px;
	width: 105px;
	height: 105px;
	background: url(../images/meno9.jpg) no-repeat top left;
}
.container .content a.project.playshop {
	top: 365px;
	left: 135px;
	width: 105px;
	height: 105px;
	background: url(../images/playshop.jpg) no-repeat top left;
}
.container .content a.project.abbraccio {
	top: 85px;
	left: 135px;
	width: 105px;
	height: 105px;
	background: url(../images/abbraccio.jpg) no-repeat top left;
}
.container .content a.project.criticalcity {
	top: 200px;
	left: 415px;
	width: 155px;
	height: 155px;
	background: url(../images/criticalcity.jpg) no-repeat top left;
}
.container .content a.project.greenstorm {
	top: 85px;
	left: 415px;
	width: 105px;
	height: 105px;
	background: url(../images/greenstorm.jpg) no-repeat top left;
}
.container .content a.project.play2plan {
	top: 200px;
	left: 580px;
	width: 105px;
	height: 105px;
	background: url(../images/play2plan.jpg) no-repeat top left;
}
.container .content a.project.amaze {
	top: 365px;
	left: 250px;
	width: 155px;
	height: 155px;
	background: url(../images/amaze.jpg) no-repeat top left;
}
.container .content a.project.getaway {
	top: 85px;
	left: 530px;
	width: 40px;
	height: 40px;
	background: #729998;
}
.container .content a.project.evai {
	top: 530px;
	left: 415px;
	width: 105px;
	height: 105px;
	background: url(../images/evai.jpg) no-repeat top left;
}
.container .content a.project.natix {
	top: 365px;
	left: 530px;
	width: 155px;
	height: 155px;
	background: url(../images/natix.jpg) no-repeat top left;
}
.container .content a.project.perbimbi {
	top: 480px;
	left: 415px;
	width: 40px;
	height: 40px;
	background: #e81e26;
}


.container .content a.project:hover {background-position: top right;}
.container .content a.project.hovered {background-position: top right;}

/******************************************
************ PROGETTI PAGINA ***************
*******************************************/

span.title {color: #CAd5DA; font-size: 72px; display: block; line-height: 60px; margin-bottom: 15px;}
span.subtitle {color: #808080; font-size: 36px; display: block; line-height: 36px; margin-bottom: 10px;}
span.data {color: #666; font-size: 14px; display: block;}

.content .testi {width: 440px;}
.content .testi a {color: #000;}
.content .testi a:hover {text-decoration: none;}


.content .video {position: relative; width: 440px; border: 1px solid #ccc; margin: 15px 0 10px 0;}
.content .gallery {position: relative; width: 440px; height: 270px; border: 1px solid #ccc; margin: 15px 0 10px 0;}


/******************************************
************ PERSONE ***************
*******************************************/


.container .content a.people {
	position: absolute; cursor: pointer;}

.container .content a.people.raf {
	top: 85px;
	left: 415px;
	width: 155px;
	height: 155px;
	background: url(../images/raffaella.jpg) top left no-repeat;
}

.container .content a.people.duc {
	top: 200px;
	left: 135px;
	width: 155px;
	height: 155px;
		background: url(../images/duccio.jpg) top left no-repeat;
}

.container .content a.people.mat {
	top: 85px;
	left: 135px;
	width: 105px;
	height: 105px;
	background: url(../images/matteo.jpg) top left no-repeat;
}
.container .content a.people.rom {
	top: 85px;
	left: 580px;
	width: 105px;
	height: 105px;
	background: url(../images/romina.jpg) top left no-repeat;
}

.container .content a.people.empty1 {
	top: 85px;
	left: 250px;
	width: 40px;
	height: 40px;
	background: #bed641;
}
.container .content a.people.dav {
	top: 200px;
	left: 300px;
	width: 105px;
	height: 105px;
	background: url(../images/davide.jpg) top left no-repeat;
}
.container .content a.people.empty2 {
	top: 250px;
	left: 530px;
	width: 40px;
	height: 40px;
	background: #bed641;
}
.container .content a.people.ale {
	top: 250px;
	left: 580px;
	width: 105px;
	height: 105px;
	background: url(../images/alessia.jpg) top left no-repeat;
}

.container .content a.people.ver {
	top: 365px;
	left: 415px;
	width: 105px;
	height: 105px;
	background: url(../images/veronica.jpg) top left no-repeat;
}

.container .content a.people.jac {
	
	
	top: 485px;
	left: 530px;
	width: 155px;
	height: 155px;
		background: url(../images/jacopo.jpg) top left no-repeat;
}

.container .content a.people.rel {
	top: 530px;
	left: 135px;
	width: 105px;
	height: 105px;
	background: url(../images/reli.jpg) top left no-repeat;
}
.container .content a.people.empty3 {
	top: 365px;
	left: 645px;
	width: 40px;
	height: 40px;
	background: #bed641;
}
.container .content a.people.empty4 {
	top: 645px;
	left: 365px;
	width: 40px;
	height: 40px;
	background: #bed641;
}
.container .content a.people.aug {
	
	top: 365px;
	left: 250px;
	width: 155px;
	height: 155px;
		background: url(../images/augusto.jpg) top left no-repeat;
}
.container .content a.people.mar {
	top: 645px;
	left: 415px;
	width: 105px;
	height: 105px;
	background: url(../images/marcella.jpg) top left no-repeat;
}
.container .content a.people.ele {
	top: 530px;
	left: 300px;
	width: 105px;
	height: 105px;
	background: url(../images/elena.jpg) top left no-repeat;
}

.container .content a.people:hover{background-position: top right;}
.container .content a.people.hovered {background-position: top right;}

.container .content .big_picture .name {
	color: #000; 
	font-size: 72px; 
	position: absolute; 
	top: 352px; 
	text-align: left; 
	left: 130px; 
	z-index: 100;
	line-height: 72px;
	
	
}
	
.container .content .big_picture {text-align: right; width: 440px; height: 430px;}

.stepcarousel{
position: relative; /*leave this value alone*/
border: 0;
overflow: scroll; /*leave this value alone*/
width: 440px;
height: 270px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin:0; /*margin around each panel*/
width: 440px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

/* Easy Slider */

.stepcarousel.slide{
position: relative; /*leave this value alone*/
border: 0;
overflow: scroll; /*leave this value alone*/
width: 980px;
height: 320px; /*Height should enough to fit largest content's height*/
}


.stepcarousel.slide .belter{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel.slide .panel_slide{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin:0; /*margin around each panel*/
width: 980px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}
 .panel_slide.home {
float: left; /*leave this value alone*/

margin:0; /*margin around each panel*/
width: 980px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
height: 320px;
background: url(../images/bg_slide_home.jpg) no-repeat bottom right;
}

span.big_title{ 
		display: block;
		color: #f4b230;
		font-size: 60px; 
		padding-left: 135px;
		
		}	
 span.big_title_home{ 
		display: block;
		color: #5c94b8;
		font-size: 60px; 
		padding-left: 135px;
		
		}			
 span.desc { 
		display: block;
		color: #808080;
		font-size: 30px; 
		line-height: 32px;
		padding-left: 135px;
		height: 140px;
		
		}
 span.desc img.next_idee { 
		float: right;
		margin: 10px 100px 0 0;
		
		}							

/* Easy Slider */
	#slider { 
		float: left;
		
		width:980px;
		height:200px;
		overflow:hidden; 
		
		}
	#slider ul, #slider li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider li{ 
		
		width:980px;
		height:200px;
		overflow:hidden; 
		}
	span#prevBtn a{ 
	background: url(../images/prev.png) no-repeat;
		position: relative;
		width: 40px;
		height: 18px;
		float: left;
		margin: 0 0 0 135px;
		
	}
	span#nextBtn a {
		background: url(../images/next.png) no-repeat;
		position: relative;
		width: 40px;
		height: 18px;
		float: right;
		margin: 0 135px 0 0;
	}					

/* // Easy Slider */
			
			
a.home { 
		position: absolute;
		background: url(../images/next_home.png) no-repeat; 
		width: 96px;
		height: 65px;
		top: 240px;
		left: 135px;
		}