@import url('boilerplate/reset.css');
@import url('boilerplate/typography.css');
@import url('boilerplate/forms.css');

body { margin: 0; padding: 0; }
html, body, #viewport { position: absolute; width: 100%; height: 100%; overflow: hidden; }
#outerWrapper { position: absolute; width: 100%; height: 100%; overflow: auto; }
#wrapper { position: relative; min-width: 980px; min-height: 625px; width: 100%; height: 100%; }
#wrapper.progetto { min-height: 580px; }
#outer_nav { position: absolute; top: 5px; width: 98%; background-color: transparent;}
	#home_link { position: absolute; position: absolute; width: 120px; height: 22px; top: 0; left: 20px;  }
	#home_link a { display: block; width: 100%; height: 100%; background: white url('images/homelink.gif') no-repeat left center; text-indent: -1000em;}
	#contacts_link { position: absolute; width: 120px; height: 22px; top: 0; right: 0; }
	#contacts_link a { display: block; width: 100%; height: 100%; background: white url('images/contactslink.gif') no-repeat right center; text-indent: -1000em;}
	
#footer { position: absolute; bottom: 5px; width: 100%; background-color: transparent; }
	#footer p { margin: 0 20px; color: #666; font-size: 10px; text-align: center; }
	#footer a { color: #666; font-weight: bold; }
	#footer a:hover { color: #FFD100; }
	
#panels_container {}
.panel { position: relative; float: left; height: 100%; }

.horizon { position: absolute; width: 100%; height: 1px; top: 50%; overflow: visible; }
.horizon .content_wrapper { position: absolute; width: 800px; height: 500px; top: 50%; left: 50%; margin: -270px 0 0 -400px; }

.navigation { position: absolute; width: 350px; left: 50px; }
.content { position: absolute; width: 270px; right: 50px; padding-top: 45px;}
.content h1 { padding-left: 35px; font-size: 20px; color: #333; }
.content span.subtitle { text-transform: lowercase; color: #333; }
.content p { font-size: 11px; padding-left: 35px; background-repeat: no-repeat; background-position: 0 2px; }
.nav { }

.content_wrapper a.nav  { display: block; position: absolute; font-size: 20px; font-weight: bold; color: #666; }
.portfolio_link { display: block; width: 46px; height: 50px; background: transparent url('images/portfoliolink.gif') no-repeat center center; text-indent: -1000em;}

#home .content_wrapper, #home_static .content_wrapper { }
#home .noi_link, #home_static .noi_link { top: 375px; left: -55px; }
#home .voi_link, #home_static .voi_link { top: 105px; left: -150px; }
#home .loro_link, #home_static .loro_link { top: 195px; left: 115px; }
#home .portfolio_link, #home_static .portfolio_link { top: 30px; left: 40px; }
#home_xmas .content_wrapper, #home_static_xmas .content_wrapper{ width: 900px; height: 580px; margin: -290px 0 0 -450px; }

#noi {}
#noi .content { padding-top: 20px; padding-top: 20px; }
#noi .content p { background-image: url('images/bullet_noi.gif');}
#noi .navigation { height: 100%; background: white url('images/home_symbol.gif') no-repeat 10px 120px; }
#noi .noi_link { display: none; }
#noi .voi_link { top: 90px; left: 10px; }
#noi .loro_link { top: 175px; left: 265px; }
#noi .portfolio_link { top: 50px; left: 265px; }

#voi {}
#voi .content p { background-image: url('images/bullet_voi.gif');}
#voi .navigation { height: 100%; background: white url('images/tetra.jpg') no-repeat 0 120px; }
#voi .noi_link { top: 400px; left: 120px; }
#voi .voi_link { display: none; }
#voi .loro_link { top: 175px; left: 250px; }
#voi .portfolio_link { top: 60px; left: 240px; }


#loro { margin: 0; margin-right: 292px; }
#loro .content p { background-image: url('images/bullet_loro.gif');}
#loro .navigation { height: 100%; background: white url('images/world.jpg') no-repeat 0 120px; }
#loro .noi_link { top: 405px; left: 85px; }
#loro .voi_link { top: 90px; left: -20; }
#loro .loro_link { display: none; }
#loro .portfolio_link { top: 60px; left: 240px; }


#portfolio { overflow: visible; }
#portfolio h1 { margin-left: 0; margin-left: 380px; font-size: 28px; color: #666; }
#portfolio .content_wrapper { position: absolute; width: 100%; height: 300px; left: 0; margin-left: 0; margin-top: -140px; overflow: hidden; }
#portfolio_content { margin-top: inherit; margin: 30px 0 0 0; width: 100%; height: 200px; overflow: hidden; overflow: hidden; }

#portfolio .navigation { position: absolute; width: 200px; height: 200px; top: -280px; left: 75%; background: transparent url('images/portfolio_nav.gif') no-repeat center center; }
#portfolio .navigation a.nav { display: block; position: absolute; font-size: 10px; font-size: 10px; font-weight: bold; color: #666; }
#portfolio .noi_link { top: 160px; left: 94px; }
#portfolio .voi_link { top: 28px; left: 33px; }
#portfolio .loro_link { top: 69px; left: 165px; }

#portfolio_detail { position: absolute; width: 300px; top: 130px; left: 380px; }
#portfolio_detail h3 { font-size: 12px; margin: 0; padding: 0; color: #333;}
#portfolio_detail p { font-size: 10px; color: #333; }
#events { margin: 0 0 0 300px; padding: 0; list-style: none; }
#events li a { text-decoration: none; font-weight: bold; color: black; font-size: 14px; text-shadow: 0px 3px 3px #000000; text-transform: lowercase;
}
#events li a:hover { color: red; }
#events li a.activeEvent { color: red; }


/*#moon { position: absolute; width: 564px; height: 560px; top: 50%; left: -282px; margin-top: -270px; background: transparent url('images/moon.png') no-repeat top left; }*/
#moon { position: absolute; width: 564px; height: 560px; top: 50%; left: -282px; margin-top: -270px; background: transparent url('images/disco.png') no-repeat top left; }

/* Styles for the processed elements */
#pf_container { position: absolute; }
#pf_container ul { list-style: none; margin: 0; padding: 0; }
#pf_container ul li { display: inline; position: relative; padding: 0; margin: 0 20px 0 0; }
#pf_container ul li img { }
#pf_container li.filler { }

#contacts {}
#contacts .content { padding-top: 0; color: #666; }
#contacts .content a { color: #666; }


/* PROGETTI */
#progetto .navigation { position: absolute; width: 200px; height: 200px; top: -330px; left: 56%; background: transparent url('images/portfolio_nav.gif') no-repeat center center; }
#progetto .navigation a.nav { display: block; position: absolute; font-size: 10px; font-size: 10px; font-weight: bold; color: #666; }
#progetto .noi_link { top: 160px; left: 94px; }
#progetto .voi_link { top: 28px; left: 33px; }
#progetto .loro_link { top: 69px; left: 165px; }

#progetto h1 { position: relative; left: -80px; margin: 0; padding: 0;}
#progetto p { margin: 1em 0;}

.progtext { width: 550px; font-size: 11px; }
.progtext dl { cear: both; width: 500px;}
.progtext dl dt { float: left; width: 85px; }
.progtext dl dd { float: left; width: 385px; margin-left: 0; clear: right; }

#progetto .descrizione { font-weight: bold; }
#progetto .descrizione p { margin-top: 0; padding-top: 0; }
#progetto .infoprezzi { font-weight: bold;  width: 500px; }
#progetto .info { width: 500px;}
#progetto .related .nav { position: relative; font-size: 12px; display: inline; }
#progetto .related_entries { margin-left: -28px; }
#progetto a.relatedprog { }
#progetto a.relatedprog img {}
#progetto .downloadlink { display: block; font-weight: bold; color: red; }

#progetto .progimages { position: absolute; width: 200px; top: 40px; right: 0; margin: 0 -50px 0 0; }
#progetto .progimages .small { font-size: 9px; line-height: 1.2em; }

#progetto .imageoverlay { position: absolute; left: 380px; bottom: -85px; }

#progetto #portfolionav { display: block; width: 48px; height: 52px; top: -5px; right: -50px; text-indent: -10000em; background: white url('images/portfoliolink_disco.gif') no-repeat center center;}

#home_logo.nav { position: relative; }

/* FUNCTIONAL  CLASSES */

.current { display: block; }
.next { display: block; }
.invisible { display: none; }

.lightgray { color: #666666; }

.clear { clear: both; }