/*  bonatticaricatori.it
    ---------------------------------------------------------------------------------------------------------
	Copyright 2008: 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



DIMENSIONI IMG
IMG NEWS DI PRIMA PAGINA: 170x170 GIF colori 32-64
IMG DELLE PAGINE: 380x... JPG qualit? 50
IMG SEZIONI CONTENUTE NELL'SWF: 600x190 JPG qualit? 45


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-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: #444; text-align: center; /* CENTRO SU IE */ line-height: 1.2em; /* 16x1.0=16px */ z-index: 1;}

#container {width: 850px;/* 850px MISURA CONTENITORE PRINCIPALE */ margin: 0 auto; /* CENTRO SU ALTRI BROWSER */ padding-bottom: 50px; 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 */


/* 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: #801;}
a:visited  {color: #801;}
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: #801; display: block;}

/* CONTENUTI */
#content {background: url(content_background.gif) top left no-repeat; padding: 10px 10px 0px 10px; background-size: 100% auto; text-align: left; clear: both;}

/* INDEX */
#index img {width: 70%; height: auto; float: left; clear: both; position: relative; margin-left: 15%;}
#index {width: 100%; height: 100%; float: left; clear: both;}

/* HEADER */
#header {width: 850px; height: 145px;}

#logo {width: 850px; height: 115px; background: url(logo.gif) 0px 0px no-repeat; background-size: 100% auto;}

#navbar {width: 850px; height: 28px; overflow: hidden; margin-top: 7px;}
#navbar h1 {font-size: 135%; text-align: center;}
#navbar h1 a {padding: 0% 3% 0% 3%;}
#navbar h1 a:hover {background: url(pointer.gif) 12px 5px no-repeat; padding: 0% 3% 0% 3%;}

#footer {width: 850px; height: 20px; background: url(content_background.gif) bottom left no-repeat; background-size: 100% auto;  clear: both;}
#footer h1 {font-size: 100%; text-align: center; padding-top: 30px; color: #801;}
#footer h1 a {padding: 1%;}


/* TOOLTIPS */
.tool-tip {
	color: #FFF;
	width: 129px;
	z-index: 13000;
}
 
.tool-title {
	font-weight: bold;
	font-size: 11px;
	margin: 0;
	color: #801;
	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 {width: 25% !important; margin: 0px -70px 0px 35px; position: relative; padding: 0px 0px 0px 35px; float: left; clear: none;}

#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;}
#content ul li h2 {color: #801; font-size: 105%; margin: 10px;}
#content ul li a {width: 100%; font-size: 90%; margin-top: 10px; display: block;}
#content ul li .miniature {width: 110px; height: 110px; 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 h3 {width: 360px; height: 270px; font-size: 80%; color:#555; position: relative; float: left; clear: both; margin: 0px 5px 5px 0px; border: 1px #801 solid;}
#content h3 span {width: 100%; height: 100%; position: absolute;}*/

#content h4 {width: 270px; height: 360px; font-size: 80%; color:#555; position: relative; float: left; clear: both; margin: 0px 5px 5px 0px; border: 1px #801 solid;}
#content h4 span {width: 100%; height: 100%; position: absolute;}

#content h5 {width: 360px; height: 270px; font-size: 80%; color:#555; position: relative; float: right; clear: both; margin: 0px 0px 5px 5px; border: 1px #801 solid;}
#content h5 span {width: 100%; height: 100%; position: absolute;}

#content h6 {width: 270px; height: 360px; font-size: 80%; color:#555; position: relative; float: right; clear: both; margin: 0px 0px 5px 5px; border: 1px #801 solid;}
#content h6 span {width: 100%; height: 100%; position: absolute;}

#content .miniature {width: 100px; height: 100px; font-size: 50%; color:#555; position: relative; float: left; margin: 4px 4px 4px 0px;}
#content .miniature span {width: 100%; height: 100%; position: absolute;}

#content .random {width: 360px; height: 480px; font-size: 80%; color:#555; position: relative; float: right; clear: both; margin: 0px 0px 5px 5px; border: 1px #801 solid;}
#content .random span {width: 100%; height: 100%; position: absolute;}

#content .adobe {width: 340px; height: auto; color:#FFF; background-color: #801; float: right; clear: both; margin: 5px 0px 5px 5px; border: 1px #801 solid; text-align: center; padding: 10px;}
#content .adobe a {color: #FEF505;}
#content .adobe i {padding-right: 25px;}
#content .adobe b {color: #FEF505;}

/**/
.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: #801; text-align: center; font-size: 110%; margin-bottom: 20px;}
.content_prodotti_sx b, .content_prodotti_dx b {color: #801;}

.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: 219px; height: 25px; margin-bottom: 10px; margin-right: 10px; float: left;}
.select2 {width: 390px; height: 25px; margin-bottom: 10px;}
.input {width: 210px; color: #999; font-size: 18px; margin-bottom: 10px; margin-right: 5px; float: left;}
.input_dx {width: 210px; color: #999; font-size: 18px; margin-bottom: 10px; margin-right: 15px; float: right;}
.input2 {width: 439px; color: #999; font-size: 18px; margin-bottom: 10px; margin-right: 5px;}
.input3 {width: 380px; color: #999; font-size: 18px; margin-bottom: 10px;}
textarea {width: 444px; color: #999; font-size: 18px; margin-bottom: 10px; height: 150px;}
.button {margin-right: 10px;}
#contact_form h2 {float: left; margin-bottom: 10px;}

#content_contatti {
	width: 340px;
	height: auto;
	padding: 5px 10px 10px 10px;
	margin: 0px 0px 5px 5px;
	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;
}


img[alt="Mappa"] {width: 100%; float: left; clear: both;}



/* COOKIES */
form[id*="cookie-"], div#notice-cookies {width: 98%; height: auto; padding: 1%; margin: 0px 0px 20px 0px; display: block; z-index: 999999; overflow: hidden;}
form#cookie-consent-actions {background: url('/com/icon/nerino_85.png') repeat; float: left; clear: both; border-bottom: 2px #cf1616 solid; color: #FFF; font-size: 100%; text-align: center; border-radius: 0px 0px 0px 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px; -o-border-radius: 0px; position: fixed; top: 0px; left: 0px;}
form[id*="cookie-"] b {color: #69B36C;}
form[id*="cookie-"] a, form[id="cookie-refuse-actions"] b {color: #cf1616;}
form[id*="cookie-"] a:hover {color: #fd0303;}
form[id*="cookie-"] button {margin-bottom: 0px; font-size: 100%;}
form[id*="cookie-"] button[value="refuse"] {background-color: #cf1616; color: #e8e615;}
form[id*="cookie-"] button[value="refuse"]:hover {background-color: #fd0303;}

div#notice-cookies {font-size: 100%; border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -o-border-radius: 6px; text-align: center;}

form#cookie-accept-actions, form#cookie-refuse-actions {background: url('/com/icon/nerino_85.png') repeat; color: #FFF; text-align: center;}

div#notice-cookies[class="accept"] {background-image: none; background-color: #458458; color: #FFF;}
div#notice-cookies[class="refuse"] {background-image: none; background-color: #cf1616; color: #e8e615;}














/* COMPUTER */
@media (max-width: 1361px) {

}

/* TABLET ORIZZONTALE */
@media (max-width: 1180px) {
a:hover, a:active, nav a:hover, nav a:active, b:hover, b:active, strong:hover, strong:active, span:hover, span:active, li:hover, li:active, input:hover, input:active, button:hover, button:active {text-transform: inherit; text-decoration: inherit; background-color: inherit; color: inherit; border-color: inherit;}
}

/* TABLET VERTICALE */
@media (max-width: 1023px) {
html, body {height: auto !important;}
h1, h2, h3, h4, h5, h6 {font-size: 140%;}
div#header, div#navbar, div#logo, div#footer, div#content_contatti, div[class*="content_prodotti"] {width: 96%; height: auto; margin: 0px; padding: 9px 2% 9px 2%; float: left; clear: both; position: relative; top: 0px; right: 0px; bottom: 0px; left: 0px; overflow: hidden;}
div#header, div#footer {text-align: center;}
div#container, div#content, div#index {float: left; clear: both; overflow: hidden;}
div#container, div#content, div#index {width: 96%; height: auto; margin: 0px; padding: 9px 2% 9px 2%; float: left; clear: both; position: relative; right: 0px; bottom: 0px; left: 0px;}
div#index {background-size: 80% auto;}
div#footer a[href*="legal.php"] {width: 100%; height: auto; margin: 0px; padding: 0px; float: left; clear: both; text-align: center; position: static; left: 0px; top: 9px;}
div#footer a[href*="legal.php"] span {display: block; clear: right; font-size: 0%; height: 0px;}
div#footer a[class="clean"] {width: 100%; margin: 5px 0px 9px 0px; float: left; clear: both; position: relative; top: 0px; right: 0px; bottom: 0px; left: 0px;}
div#logo {height: 100px;}



div[class*="content_prodotti"] {height: 430px; margin-bottom: 9px;}


select, textarea {width: 98%; float: left; clear: both;}
.input {width: 98%; float: left; clear: both;}
.input_dx {width: 98%; float: left; clear: both;}
.input2 {width: 98%; float: left; clear: both;}
.input3 {width: 98%; float: left; clear: both;}
div#header {overflow: visible;}
div#header .flags {width: 130px !important; height: 20px; margin: 0px; float: right; position: absolute; z-index: 10; right: 10px; bottom: -50px;}
}

/* CELLULARE BIG ORIZZONTALE */
@media (max-width: 680px) {
#index img {width: 100%; margin-left: 0%;}
#index .flags {float: none; clear: both; width: auto; margin: 0 auto; margin-top: 20px;}
div.random {display: none;}
}

/* CELLULARE BIG VERTICALE - CELLULARE STANDARD ORIZZONTALE */
@media (max-width: 480px) {

}

/* CELLULARE STANDARD VERTICALE */
@media (max-width: 320px) {

}