/***********************************************************************
************************************************************************
Project:		Sagomm - www.sagomm.it
Version:		1.0
Last Change:	23/11/2009
Agency:			Web Agency Meta Line - metaline.it
Author:			Matteo Casonato (Wikimaki)
***********************************************************************/
@charset "utf-8";

@import "form.css";
@import "../js/sifr/sifr.css";
@import "../js/colorbox/colorbox.css";

/* RESET
**************************************************/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
address, caption, cite, code, dfn, em, th, var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
q:before, q:after { content: ''; }
abbr, acronym { border: 0; }
html { font-size: 100%; }
a { outline: none; }
legend { display: none; }
.left { clear: left; float: left; }
.right { clear: right; float: right; }
.center { text-align: center; }
.clear { clear: both; height: 1%; overflow: hidden; }
.hidden { display: none; }

/* STRUTTURA
**************************************************/
body { background-color: #F1F0EC; background-image: url(images/bck.gif); background-repeat: repeat-x; min-width: 940px; }
html, body { height: auto; height: 100%; max-height: 100%; min-height: 100%; }

/* NAVBAR
**************************************************/
#navbar { background-color: #005DAA; color: #fff; height: 100%; left: -30px; min-height: 550px; min-width: 220px; position: fixed; top: 0; width: 260px; z-index: 80; }
	#header { position: absolute; right: 15px; top: 15px; }
	#nav { position: absolute; right: 0; top: 90px; width: 230px; }
		#nav ul { list-style: none outside; margin: 0; padding: 0; }
			#nav ul li { border-bottom: 1px solid #2E7AB9; font-size: 0px; height: 1%; overflow: hidden; position: relative; }
				#nav ul li a { color: #fff; display: block; line-height: 13px; font-size: 13px; padding: 8px 20px 8px 0; overflow: hidden; text-align: right; text-decoration: none; }
			#nav li.accordion {}
				#nav li.accordion li { border: none; }
					#nav li.accordion li a { font-size: 11px; font-weight: normal; padding: 0 20px 5px 0; }
						#nav li.accordion li a:hover { background: none; }
				#nav li.accordion span { background-image: url(images/arrows.gif); background-position: 0 -20px; background-repeat: no-repeat; cursor: pointer; display: block; height: 20px; left: 10px; position: absolute; text-align: left; text-indent: -9999em; top: 5px; width: 19px; z-index: 90; }
					#nav li.accordion span.active { background-position: 0 0; }
				#nav li.accordion div { display: none; }
					#nav li.accordion div.active { display: block; }

/* MAIN
**************************************************/
#wrapper { margin-left: 260px; position: relative; width: 720px; }
#main { padding: 20px 0; position: relative; width: 100%; }

#spot .cycle, #spot .item { height: 290px; width: 330px; }
#spot { float: right; margin-top: -60px; position: relative; width: 315px; }
	#spot .cycle { overflow: hidden; position: relative; }
		#spot .item {}

#category { margin: 50px 0 20px 0; overflow: hidden; }
	#category dl { float: left; }
		#category dl dt {}
			#category dl dt a { background-position: 50% 0; display: block; text-indent: -9999em; }
			#category dl dt span { color: #2E7AB9; display: block; font-weight: bold; margin: 10px auto; padding: 0 14px; }
		#category dl dd { color: #485555; line-height: 130%; padding: 0 14px; }
	#category dl.prodotti01 a { background-image: url(images/prodotti-cassetti.png); }
	#category dl.prodotti02 a { background-image: url(images/prodotti-catene.png); }
	#category dl.prodotti03 a { background-image: url(images/prodotti-complementi.png); }
	#category dl.prodotti04 a { background-image: url(images/prodotti-sezioni.png); }
	#category dl.prodotti05 a { background-image: url(images/prodotti-decori.png); }
	#category.col5 dl { margin: 0 2px; width: 138px; }
		#category.col5 dl dt a { height: 138px; width: 138px; }
		#category.col5 dl dt a:hover { background-position: 50% -138px; }
	#category dl.cassetti01 a { background-image: url(images/prodotti-cassetti-versioni.png); }
	#category dl.cassetti02 a { background-image: url(images/prodotti-cassetti-tipologia.png); }
	#category dl.cassetti03 a { background-image: url(images/prodotti-cassetti-speciali.png); }
	#category.col3 dl { margin: 0 6px; width: 226px; }
		#category.col3 dl dt a { height: 226px; width: 226px; }
		#category.col3 dl dt a:hover { background-position: 50% -226px; }

#products { padding-top: 8px; overflow: hidden; position: relative; width: 99.9%; }
	#products dl { float: left; overflow: hidden; padding: 10px 10px; width: auto; }
		#products dt {}
			#products dt strong { font-weight: bold; }
			#products dt a { border-color: #C5C1B4; border-style: solid; border-width: 8px; display: block; float: left; overflow: hidden; }
				#products dt a:hover { border-color: #96C5E7; }
				#products dt img { float: left; }
		#products dd { clear: both; padding-top: 10px; }

#documents { position: relative; }
	#documents dl { float: left; margin: 0; overflow: hidden; padding: 15px 10px; width: 46%; }
	#documents.news dl { width: 100%; }
		#documents dt strong { display: block; font-weight: bold; line-height: 120%; padding: 15px 0 10px; }
		#documents dt img { float: left; margin: 0 10px 0 0; }
		#documents dt a { color: #444; text-decoration: none; }
		#documents dd { font-size: 75%; line-height: 100%; overflow: hidden; }

/* FOOTER
**************************************************/
#footer { bottom: 0; color: #CDE2F3; height: 180px; left: 10px; margin-top: 175px; min-width: 220px; position: fixed; text-align: right; width: 260px; z-index: 85; }
	#footer a { color: #CDE2F3; font-weight: normal; }
	#footer .vcard { font-size: 0.7em; line-height: 130%; text-align: left; }
		#footer .vcard .org { font-weight: bold; margin-bottom: 5px; text-transform: uppercase; }
		#footer .vcard .type { font-weight: bold; text-transform: uppercase; }
	#footer ul { font-size: 0.7em; list-style: none; margin: 10px 0 0 0; padding: 0; }
		#footer ul li { line-height: 130%; list-style-position: outside; text-align: left; }
	#footer ul.flag { font-size: 85%; list-style: none; margin: 10px 0 0 0; padding: 0; }
		#footer ul.flag li { float: left; margin-right: 5px; }
		#footer ul.flag li a { background-image: url(images/flags.png); background-repeat: no-repeat; display: block; height: 13px; overflow: hidden; text-indent: -9999em; width: 18px; }
			#footer ul.flag li.flagIT a { background-position: 0 0; }
			#footer ul.flag li.flagEN a { background-position: 0 -13px; }
			#footer ul.flag li.flagDE a { background-position: 0 -26px; }
			#footer ul.flag li.flagFR a { background-position: 0 -39px; }
			#footer ul.flag li.flagES a { background-position: 0 -52px; }

/* TEXT
**************************************************/
body { color: #444; font-family: Arial, Helvetica, sans-serif; font-size: 100%; }
h1, h2 { font-family: "Trebuchet MS", Arial, sans-serif; }
pre, code, tt { font-family: "Andale Mono", "Lucida console", monospace; }

h1, h2, h3, h4, h5, h6, p { font-size: 100%; font-weight: normal; line-height: 100%; }

h1 { color: #4F5454; font-size: 3.4em; letter-spacing: -4px; margin-bottom: 5px; text-transform: uppercase; }
h2 { color: #2E7AB9; font-size: 1em; font-weight: bold; line-height: 140%; margin-bottom: 15px; text-transform: uppercase; }
h3 { color: #2E7AB9; font-size: 0.85em; font-weight: bold; margin: 20px 0 10px 0; text-transform: uppercase; }
h4 {}
h5 {}
h6 {}

p { color: #485555; font-size: 0.8em; line-height: 170%; margin: 5px 0 10px 0; }
dt, dd, ul, ol { font-size: 0.8em; line-height: 100%; }
dt { text-transform: uppercase; }

a { color: #005DAA; font-weight: bold; text-decoration: none; }
	a:focus, a:hover { text-decoration: underline; }

ul, ol { list-style-position: inside; }

em { font-style: italic; }

/* TEMPLATE
**************************************************/
body.nav01 #nav li.nav01 a, #nav li.nav01 a:hover, body.nav02 #nav li.nav02 a, #nav li.nav02 a:hover,
body.nav03 #nav li.nav03 a, #nav li.nav03 a:hover, body.nav04 #nav li.nav04 a, #nav li.nav04 a:hover,
body.nav05 #nav li.nav05 a, #nav li.nav05 a:hover, body.nav06 #nav li.nav06 a, #nav li.nav06 a:hover,
body.nav07 #nav li.nav07 a, #nav li.nav07 a:hover, body.nav08 #nav li.nav08 a, #nav li.nav08 a:hover,
body.nav09 #nav li.nav09 a, #nav li.nav09 a:hover, body.nav10 #nav li.nav10 a, #nav li.nav10 a:hover { background-color: #2E7AB9; }

body.nav03b #nav li.nav03b a, body.nav03c #nav li.nav03c a, body.nav03d #nav li.nav03d a,
body.nav03e #nav li.nav03e a, body.nav03f #nav li.nav03f a { font-weight: bold; }

body.nav03b #nav li.nav03 span, body.nav03b #nav li.nav03 div,
body.nav03c #nav li.nav03 span, body.nav03c #nav li.nav03 div,
body.nav03d #nav li.nav03 span, body.nav03d #nav li.nav03 div,
body.nav03e #nav li.nav03 span, body.nav03e #nav li.nav03 div,
body.nav03f #nav li.nav03 span, body.nav03f #nav li.nav03 div,
body.nav04b #nav li.nav04 span, body.nav04b #nav li.nav04 div,
body.nav04c #nav li.nav04 span, body.nav04c #nav li.nav04 div { display: block; }

body#tpl1024 {}
	body#tpl1024 #wrapper {}

body.nav01 { background-position: 0 470px; }
body.nav02 { background-position: 0 350px; } body.nav02 #main img.right { margin-top: -60px; }
body.nav03 { background-position: 0 350px; }
	body.nav03b1, body.nav03b2, body.nav03b3, body.nav03c, body.nav03d, body.nav03e, body.nav03f,
	body.nav05 { background-image: none; }
body.nav04 { background-position: 0 248px; } body.nav04 #main img.right { margin-top: -60px; }
body.nav05 { background-position: 0 190px; }
body.nav06 { background-position: 0 176px; }

/* COMPONENTI VARI
**************************************************/
.col { height: 1%; overflow: hidden; }
	.col .first { float: left; margin-right: 50px; width: 45%; }
	.col .last { float: left; width: 45%; }

/* MAP
**************************************************/
#map { background: url(images/load.gif) 50% 50% no-repeat #E5E5E5; border: 5px solid #B7D6EE; height: 400px; width: 330px; }
	#map #mapBalloon {}
		#map #mapBalloon small, #map #mapBalloon big { display: block; font-size: 11px; }
		#map #mapBalloon big { padding-top: 8px; }
		#map #mapBalloon strong { font-size: 11px; text-transform: uppercase; }
		#map #mapBalloon form { margin-top: 5px; }
			#map #mapInput { width: 160px; }
			#map #mapSubmit { background: #005DAA; border: none; color: #fff; cursor: pointer; font-size: 0.75em; font-weight: bold; margin-left: 5px; padding: 3px 10px; text-align: center; text-decoration: none; text-transform: uppercase; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; }