/*  marzolla.it
    ---------------------------------------------------------------------------------------------------------
	Copyright 2009: Piero Marchetti e Simone Marchetti
	Design, XMTML and CSS: Simone Marchetti (www.cleanandgreen.net - www.314.it - www.marchetti.ws)
	Software PHP and MySQL: Piero e Susanna Marchetti (www.cleanandgreen.net - www.314.it - www.marchetti.ws)
	JavaScript tools: Valerio Proietti (www.mootools.net) - iBegin iBox (www.ibegin.com/labs/ibox) 
	iCSS 1.0 (31/12/2009)
    ---------------------------------------------------------------------------------------------------------
*/

/*
COLORI SITO
ARANCIO: #EA1

VERDINO: #A0D0A8
ARANCINO: #E6925C
ROSSINO: 
ROSINO: #F2C4AC
AZZURRINO: #9CD3E8
GIALLINO: 
GRIGINO: #BEC0C0
BLUETTINO: #8093BE


MODELLO A CASCATA
selettore {
	widht: ;
	height: ;
	background: url() 0px 0px no-repeat;
	margin: ;
	border: ;
	padding: ;
	font-family: ;
	font-size: ;
	font-weight: ;
	texy-decoration: ;
	color: ;
	text-align: ;
	line-height: ;
	list-style: ;
	float: ;
	clear: ;
	position: ;
	display: ;
	overflow: ;
	cazzivari: ;
}

VARIE
CONVERSIONE EM>PX si fa dividendo i PIXEL in 16 parti (visivamente i conti tornano dividendo i PIXEL in 12 parti)
Per le propriet ! MARGIN - PADDING - BORDER l'ordine delle misure Ë sempre TOP - RIGHT - BOTTOM - LEFT
*/


/* HTML , BODY e CONTENITORE PRINCIPALE */
html, body {
	width: 100%; height: 100%; background-color: #BC0109;/* background-image: url('background.gif');*/ margin: 0; 
	font-family: "Lucida Grande", "Lucida Sans", san-serif, Arial, Helvetica; font-size: 0.85em; /* MISURA IN EM PER IE */
	color: #DDD; text-align: center; /* CENTRO SU IE */ line-height: 1.2em; /* 16x1.0=16px */ z-index: 1;}

#container {width: 750px;/* 850px MISURA CONTENITORE PRINCIPALE */ margin: 0 auto; /* CENTRO SU ALTRI BROWSER */ text-align: left;}

/* HACK IE e SELETTORE UNIVERSALE */
html>/**/body {font-size: 12px;} /* ESCLUDE IE DA QUESTA REGOLA FISSANDO IN PIXEL SU: SA FF OP CA */
* {/*text-shadow: #000000 0 0 0px;*/} /* SELETTORE UNIVERSALE - PER UNIFORMARE IL TESTO ANCHE SU SAFARI - NON PUO ESSERE VALIDATA */

body {height: 100%;}

/* SELETTORI ED OGGETTI - Definisco margini, padding e bordi di selettori e oggetti */
hr {margin: 10px 0px 10px 0px; padding: 0px; clear: both;}
input, select, textarea {margin: 0px; padding: 0.15em; font-family: "Lucida Grande", "Lucida Sans", san-serif, Arial, Helvetica; /* PER FF */ font-size: 95%;}
div, span, p, a, h1, h2, h3, h4, h5, h6, ol, ul, li, dl, dt, dd, blockquote, strong, b, i, object, embed, img {margin: 0px; border: 0px; padding: 0px; font-size: 100%; text-decoration: none; list-style: none;}
a, h1, h2, h3, h4, h5, h6, b {font-weight: bold;}
h1, h2, h3, h4, h5, h6 {font-size: 110%; text-align: left;}

/* LINK - Definisco lo stile ed il colore dei link */
a:link {color: #6F1501;}
a:visited  {color: #6F1501;}
a:hover {color: #444;}
a:active {color: #888;}


/* TITOLI - Titoli colorati con gradient sfumato */
h1 {color: #000; line-height: 1.2em; margin-bottom: 10px; font-size: 160%; position: relative;}
h1 span {width: 75%; height: 18px; background: url('gradient_glossy.png') repeat-x !important; background/*IE*/: none; position: absolute; display: block;}
h1 strong {font-size: 60%; font-weight: normal; font-style: italic; color: #6F1501; display: block;}


/* CONTENUTI */
#content {background: url('content_alfaromeo.gif') center center no-repeat; padding: 10px 10px 0px 10px; text-align: left; clear: both; text-align: justify;}

/* INDEX */
#index {width: 640px; height: 480px; background: url('homeit.gif') top center no-repeat; margin: 0 auto;}

/* HEADER */
#header {width: 750px; height: 200px;}

#logo {width: 144px; height: 165px; background: url('logo.png') 0px 0px no-repeat; position: absolute; margin: 20px 0px 0px 580px;}
span a {display: block; margin: 0 auto;}
span a:hover {display: block; margin: 0 auto;}
#logoindex {width: 250px; height: 250px; background: url('marzolla_index.gif') center center no-repeat;}
#logoindex2 {width: 400px; height: 40px; background: url('marzolla_index2.gif') center center no-repeat;}

#navbar {width: 750px; height: 25px; margin-top: 5px;}
#navbar a, #navbar h1, #navbar h2, #navbar h3, #navbar h4, #navbar h5 {height: 23px; float: left; background-image: url('menu.gif');}
#navbar h1 a {width: 95px; background-position: 0px 0px;}
#navbar h1 a:hover, #navbar h1 {width: 95px; background-position: 0px -27px;}
#navbar h2 a {width: 250px; background-position: -95px 0px;}
#navbar h2 a:hover, #navbar h2 {width: 250px; background-position: -95px -27px;}
#navbar h3 a {width: 185px; background-position: -345px 0px;}
#navbar h3 a:hover, #navbar h3 {width: 185px; background-position: -345px -27px;}
#navbar h4 a {width: 125px; background-position: -530px 0px;}
#navbar h4 a:hover, #navbar h4 {width: 125px; background-position: -530px -27px;}
#navbar h5 a {width: 95px; background-position: -655px 0px;}
#navbar h5 a:hover, #navbar h5 {width: 95px; background-position: -655px -27px;}

#footer {width: 750px; height: 32px; background: url('footer.gif') bottom left no-repeat; margin-top: 15px; clear: both;}
#footer h1 {font-size: 100%; text-align: center; padding-top: 8px; color: #BC0109;}
#footer h1 a:link {padding: 1%; color: #BC0109;}
#footer h1 a:visited {padding: 1%; color: #BC0109;}
#footer h1 a:hover {padding: 1%; color: #6F1501;}
#footer h1 a:active {padding: 1%; color: #888;}


/* TOOLTIPS */
.tool-tip {
	color: #FFF;
	width: 129px;
	z-index: 13000;
}
 
.tool-title {
	font-weight: bold;
	font-size: 11px;
	margin: 0;
	color: #6F1501;
	border-bottom: 1px #555 solid;
	padding: 4px;
	background: url("tooltip2.png") top left;
	text-align: center;
}
 
.tool-text {
	font-size: 10px;
	padding: 4px;
	color: #555;
	background: url("tooltip2.png") bottom right;
	text-align: center;
}


/* UTILITA' */
#content blockquote {background-color: yellow; border: 1px #444 dotted; padding: 10px; float: left; clear: both; /*-moz-border-radius: 5px; -webkit-border-radius: 5px; NON VENGONO VALIDATI*/}
.hr_fantasma {margin: 0px; border: 0px #F0EFE1 solid; color: #F0EFE1; clear: both;}

.flags {width: 32px !important; width/*IE*/: 35px; height: 20px; margin-top: 2.8em; margin-left: 808px; float: right; overflow: hidden; position: absolute; z-index: 10;}
.flags_hover {width: 130px; height: 20px; margin-top: 2.8em; margin-left: 712px; float: right; position: absolute; z-index: 10;}
#ita, #eng, #fra, #deu, #spa, #por {width: 27px; height: 19px; background: url(flags.png) no-repeat; float: left; margin-left: 5px; display: block;}
#index .flags {margin-top: 550px; position: static; padding: 1px 80px 0px 35px;}
#index #ita {margin-left: 30px;}
#ita {background-position: 0px -95px;}
#eng {background-position: 0px -76px;}
#fra {background-position: 0px -57px;}
#deu {background-position: 0px -38px;}
#spa {background-position: 0px -19px;}
#por {background-position: 0px 0px;}

#clean {background: url(cleanandgreen.png) 5px 2px no-repeat; white-space: pre;}

/*#content ul {width: 460px;}
#content ul li {height: 110px; padding-left: 110px;}
#content ul li h2 {color: #F7DB00; font-size: 105%; margin-bottom: 5px;}
#content ul li a {font-size: 90%; margin-top: 10px; display: block;}*/

#content ul {width: 100%;}
#content ul li {height: auto;}
#content ul li h2 {color: #F7DB00; font-size: 105%; margin: 0px 10px 10px 10px;}
#content ul li a {font-size: 90%; margin-top: 0px; display: block;}
#content ul li .miniature {width: 100px; margin: 0px 10px 10px 0px; display: block;}
#content ul li h1 {color: #444; font-size: 100%; font-weight: normal;}


/* IMAGE REPLACEMENT - IMMAGINI DEL SITO CON TESTO NASCOSTO - E TESTO CHE SEGUE L'IMMAGINE */
#content .miniature_sx {width: 200px; height: 150px; font-size: 50%; color:#555; position: relative; float: left; margin: 10px 10px 5px 0px;}
#content .miniature_sx span {width: 100%; height: 100%; position: absolute;}

#content .miniature_dx {width: 200px; height: 150px; font-size: 50%; color:#555; position: relative; float: right; margin: 10px 0px 5px 10px;}
#content .miniature_dx span {width: 100%; height: 100%; position: absolute;}

#content .miniature_news {width: 165px; height: 120px; font-size: 50%; color:#555; position: relative; float: left; margin-right: 10px;}
#content .miniature_news span {width: 100%; height: 100%; position: absolute;}
#content .miniature_news_box {width: 750px; height: 120px; margin-bottom: 20px; clear: both;}

.random {width: 750px; height: 200px; position: relative; float: right; clear: both; margin-bottom: 10px;}
.random span {width: 100%; height: 100%; position: absolute; z-index: 0;}
.random div {width: 100%; height: 100%; background: url('header_corner.gif') bottom left no-repeat; position: absolute; z-index: 100;}
.random p {width: 200px; height: 200px; background: url('bianchino_50.png') repeat; position: relative; z-index: 0; float: right;}

/**/
.content_prodotti_sx, .content_prodotti_dx {
	width: 390px;
	height: 430px;
	background-color: #F8F7F0;
	border-bottom: 1px #FFF solid;
	border-right: 1px #FFF solid;
	text-align: left;
	padding: 10px;
	margin-bottom: 9px;
}

.content_prodotti_sx {float: left;}
.content_prodotti_dx {float: right;}
.content_prodotti_sx h2, .content_prodotti_dx h2 {color: #6F1501; text-align: center; font-size: 110%; margin-bottom: 20px;}
.content_prodotti_sx b, .content_prodotti_dx b {color: #6F1501;}

.icona_video {background: url(icona_video.png) 0px 0px no-repeat; padding: 5px; white-space: pre;}
.icona_bullone {background: url(icona_bullone.png) 0px 0px no-repeat; padding: 5px; white-space: pre;}
.icona_assistenza {background: url(icona_assistenza.png) 0px 0px no-repeat; padding: 5px; white-space: pre;}
.icona_pdf {background: url(icona_pdf.png) 0px 0px no-repeat; padding: 4px; margin-left: 12px; white-space: pre;}
.icona_trattore {background: url(icona_trattore.png) 0px 0px no-repeat; padding: 5px; white-space: pre;}

#content .content_prodotti_sx p, #content .content_prodotti_dx p {width: 390px; height: 390px; font-size: 80%; color:#999; position: relative; clear: both; border: 0px; margin: 0px;}
#content .content_prodotti_sx p span, #content .content_prodotti_dx p span {width: 100%; height: 100%; position: absolute;}

.youtube {margin-top: 10px;}

#toggle1, #toggle2, #toggle3, #toggle4, #toggle5, #toggle6, #toggle7, #toggle8, #toggle9, #toggle10,
#toggle11, #toggle12, #toggle13, #toggle14, #toggle15, #toggle16, #toggle17, #toggle18, #toggle19, #toggle20,
#toggle21, #toggle22, #toggle23, #toggle24, #toggle25 {width: 380px;}


#fx_slide1, #fx_slide2, #fx_slide3, #fx_slide4, #fx_slide5, #fx_slide6, #fx_slide7, #fx_slide8, #fx_slide9, #fx_slide10,
#fx_slide11, #fx_slide12, #fx_slide13, #fx_slide14, #fx_slide15, #fx_slide16, #fx_slide17, #fx_slide18, #fx_slide19, #fx_slide20,
#fx_slide21, #fx_slide22, #fx_slide23, #fx_slide24, #fx_slide25 {width: 100%; margin-left: 12px; margin-bottom: 7px; font-size: 11px;}


select {width: 160px; height: 25px; margin-bottom: 10px; margin-right: 10px; float: left;}
.select2 {width: 344px; height: 25px; margin-bottom: 10px;}
.input {background: url('bianchino_85.png') repeat; width: 160px; color: #999; font-size: 18px; margin-bottom: 10px; margin-right: 5px; float: left;}
.input_dx {background: url('bianchino_85.png') repeat; width: 160px; color: #999; font-size: 18px; margin-bottom: 10px; margin-right: 10px; float: right;}
.input2 {background: url('bianchino_85.png') repeat; width: 340px; color: #999; font-size: 18px; margin-bottom: 10px; margin-right: 5px;}
.input3 {background: url('bianchino_85.png') repeat; width: 340px; color: #999; font-size: 18px; margin-bottom: 10px;}
textarea {background: url('bianchino_85.png') repeat; width: 340px; color: #999; font-size: 18px; margin-bottom: 10px; height: 150px;}
.button {margin-right: 10px;}
#contact_form h2 {float: left; margin-bottom: 10px;}

#content_contatti {
	background: url('bianchino_85.png') repeat;
	width: 344px;
	height: 370px;
	padding: 5px 10px 30px 10px;
	margin: 0px 0px 5px 5px;
	color: #BC0109;
	text-align: left;
}

#content_contatti h2 {text-align: left; color: #444; margin-bottom: 10px;}

#content_login {
	height: auto;
	text-align: left;
}

#content_login h2 {text-align: left; color: #444;}

/* GOOGLE 404 */
#goog-wm h3 {
  width: 810px;
  height: 100px;
  font-size: 100%;
  padding: 5px;
  border: 3px solid #aebd63;
  position: relative;
  float: none;
  clear: none;
  margin: 0px 0px 10px 0px;
}
