@charset "utf-8";
/* CSS Document */

/* RESET */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,th { font-size: 1em; font-weight: normal; font-style: normal; }
/* ul,ol { list-style: none; } */
img { border: none;}
caption,th { text-align: left; }
table {border-spacing: 0; }
a  { color:#CCC;}
a:visited { color:#CCC;}
a:active { color:#CCC;}

/* LAYOUT */
.clear { clear:both; }
.clearer { clear: both; display: block; margin: 0; padding: 0; height: 0; line-height: 1px; font-size: 1px; }

/* *************************************************************************************************************************** */
/* ******************************************** BASE ************************************************************************* */
/* *************************************************************************************************************************** */

body {font-family: 'Open Sans Condensed', Arial, Helvetica, sans-serif;font-size:14px; background:url(../images/bg.jpg) center top no-repeat fixed;}
div#wrapper {width:820px; margin:0 auto;} 
div#title {width:805px; height:20px; background: url(../images/bg-box.png) left top repeat; padding:5px 5px 5px 10px;  color:#CCC;}
div#title h1{color:#CCC; font-size:12px; margin:0; padding:0;}
div#header {width:820px;margin:30px 0 30px 0;} 
div#logo {width:346px; float:left;} 

div#identity {width:760px; height:281px; background:url(../images/identity.png) center center no-repeat; margin-bottom:15px; padding:25px 30px 20px 30px; color:#CCC;}
div#col1 {width:250px; float:left; margin:20px 0 0 0;} 
div#col2 {width:250px; float:left; margin:20px 0 0 20px;} 

div#portfolio {width:790px; height:206px; background:url(../images/portfolio-io.png) center center no-repeat; margin-bottom:50px; padding:100px 30px 20px 0; color:#CCC;}
div#portfolio li { margin-left:35px;}

div#footer {width:805px; height:40px; background: url(../images/bg-box.png) left top repeat; padding:10px 5px 10px 10px;color:#CCC;}
div#credits {width:400px; float:left;}
div#social {width:150px; float:right; margin-top:4px;}

div#link {width:815px; height:45px; background:#000 url(../images/bg-box.png) left top repeat; margin:1px 0 30px 0; padding:10px 5px 10px 0;color:#CCC;}
div#link a{ margin-left:30px;}

div#boxGen {width:790px; background: url(../images/bg-box.png) left top repeat; padding:10px 20px 10px 10px;color:#CCC;margin-bottom:50px; }
div#coldx{ width:370px; float:right;}
div#colsx{ width:370px; float:left;}

.boxPortfolio{width:820px; background: url(../images/bg-box.png) left top repeat; margin-bottom:30px; }
.boxPortfolio p{color:#CCC;padding:10px 10px 10px 10px;}
.titolo {font-family: 'Lobster', Arial, Helvetica, sans-serif; font-size:18px;color:#ccc;}


.galleryBlock {width:250px; height:320px; padding:10px; float:left; background: url(../images/bg-box.png) left top repeat; color:#ccc;}
.primo {margin:0 5px 5px 0;}
.secondo {margin:0 0 5px 0;}


/* *************************************************************************************************************************** */
/* ******************************************* jQuery Desaturate ************************************************************* */
/* *************************************************************************************************************************** */

 /* jQuery Desaturate */
.gallery { list-style: none; overflow:hidden; margin:0 -30px 0 0;}
.gallery li{ float:left; padding:4px; background:#fff; margin:0 30px 0 0; overflow:hidden;}
.gallery a { border:0; width:194px; height:194px; background:#fff; display:block; position:relative;}
.dimensione194 {width:194px; height:194px;}
.dimensione240 {width:240px; height:194px;}
.gallery img { border:none;}
.gallery span { position:absolute; width:194px; height:194px; top:0; left:0; overflow:hidden; cursor:pointer; }
.gallery .clear { background:none; border:0; clear:both; display:block; float:none; font-size:0; margin:0; padding:0; overflow:hidden; visibility:hidden; width:0; height:0; }
/* jQuery Desaturate */


/* jQuery Desaturate */
.galleryPort { list-style: none; overflow:hidden; margin:0 -30px 0 0;}
.galleryPort li{ float:left; padding:4px; background:#fff; margin:0 30px 0 0; overflow:hidden;}
.galleryPort a { border:0; width:240px; height:194px; background:#fff; display:block; position:relative;}
.galleryPort img { border:none;}
.galleryPort span { position:absolute; width:240px; height:194px; top:0; left:0; overflow:hidden; cursor:pointer; }
.galleryPort .clear { background:none; border:0; clear:both; display:block; float:none; font-size:0; margin:0; padding:0; overflow:hidden; visibility:hidden; width:0; height:0; }
/* jQuery Desaturate */

/* *************************************************************************************************************************** */
/* ******************************************** slide *********************************************************************** */
/* *************************************************************************************************************************** */

.eDiv{overflow: hidden; border-left:#333 1px dotted;}
.eDiv p{ padding:10px;}
.hiddenElement{display:none;}
.chiudi{margin-left:10px;}
.chiudi a{ color:#C00;}
.copy{ font-size:11px; color:#000;}

.eDiv li { margin-left:30px;}

/* *************************************************************************************************************************** */
/* ******************************************** nivoSlide ******************************************************************** */
/* *************************************************************************************************************************** */


.banner { height:475px; background:url(../scripts/nivoSlider/ombra.png) center bottom no-repeat; margin-bottom:30px;} 
.theme-default #slider {
    margin:0 auto 0 auto;
    width:820px; /* Make sure your images are the same size */
    height:429px; /* Make sure your images are the same size */
}
.theme-pascal.slider-wrapper,
.theme-orman.slider-wrapper {
    margin-top:150px;
}


/* *************************************************************************************************************************** */
/* ************************************ MENU ****************************************************************************** */
/* *************************************************************************************************************************** */

.menu {position:relative; height:35px; width:330px; float:right;margin-top:60px;}
.menu ul {list-style:none; z-index:10; position:absolute; z-index:100; padding:9px 5px; }
.menu li {float:left;}
.menu a, .menu a:active, .menu a:visited, .menu a:hover {font-family: 'Lobster', Arial, Helvetica, sans-serif; font-size:18px;text-decoration:none; color:#000; padding:10px;}
#slide {position:absolute; top:8px; height:24px; background:#CCC; z-index:10}

/* *************************************************************************************************************************** */
/* ************************************ TABELLE ****************************************************************************** */
/* *************************************************************************************************************************** */

.tariffe {
  border-collapse: collapse;

  font: normal 11px verdana, arial, helvetica, sans-serif;
  color:#000;
  background:#eee;
  }
.tariffe td, th {
  border-top: 1px dashed #fff;
  border-bottom: 1px dashed #fff;
  padding: .8em;
  color: #000;
  }
.tariffe tr td {
  text-align: center;
  }
.odd {
  background:#ddd;
  }
.tariffe  tbody tr:hover {
  background:#F60;
  }
.tariffe tbody tr:hover th,
.tariffe tbody tr.odd:hover th {
  background:#F60;
  }

  
/* *************************************************************************************************************************** */
/* ************************************ tecnica sostituzione img ************************************************************* */
/* *************************************************************************************************************************** */
/* 
// aggiungi cursor:pointer; text-decoration:none; se link

SU SOSTITUISCI UN TESTO CON IMG

<div id="nomediv" class="replace">xxxxx<span>&nbsp;</span></div>
div#nomediv, div#nomediv span { font-size:9px;height:26px;width:136px;background:url(images/image.gif) no-repeat;}

*************************************************************************************************************************** 

SU SOSTITUISCI UN LINK TESTUALE CON IMG
<div id="nomediv" class="replace"><a href="dddd">xxxxx<span></span></a></div> // non si mette lo spazio nello SPAN
div#nomediv, div#nomediv span {font-size:9px;height:26px;width:136px;background:url(images/image.gif) no-repeat;cursor:pointer; text-decoration:none;}
div#nomediv, div#nomediv a:hover span {font-size:9px;height:26px;width:136px;background:url(images/image.gif) no-repeat;cursor:pointer; text-decoration:none;}

*************************************************************************************************************************** 

NOTA:
per usare una sola img per HOVER costruire una img e duplicarla in altezza della stessa dimensione, se ha 30px, diventa 60, con dentro i 2 stadi ON-OFF
Volendo si possono mettere anche ACTIVE e VISITED
Il codice cambia cosi:

OFF > background:url(../images/menu-home.png) 0 0 no-repeat
ON > background:url(../images/menu-home.png) 0 -30 no-repeat // sis posta di 30 px in altezza

div#nomediv, div#nomediv span {font-size:9px;width:49px; height:30px;background:url(images/image.gif) 0 0 no-repeat;cursor:pointer; text-decoration:none;}
div#nomediv, div#nomediv a:hover span {font-size:9px; width:49px; height:30px;background:url(images/image.gif) 0 -30px no-repeat;cursor:pointer; text-decoration:none;}

*************************************************************************************************************************** 

DA METTERE SEMPRE
.replace
.replace span

*************************************************************************************************************************** 

*/

.replace{position:relative;margin:0;padding:0;/* hide overflow:hidden from IE5/mac */overflow:hidden;/* */}
.replace span{display:block;position:absolute;top:0;left:0;z-index:1; /* for opera5 and 6 */}