/*** CSS 3.0 ***/
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* dunp scpl 
/* Agenzia di comunicazione - www.dunp.it - info@dunp.it - +39.064066184 - Via Giuseppe Rosaccio 6 - 00156 Roma
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*
 OMBRA TESTI
   (orizzontale verticale blur colore)
   text-shadow:1px 1px 0 #333; filter:dropshadow(color=#333,offx=1,offy=1); 

 OMBRA ELEMENTI GENERALE
   (orizzonale verticale blur spread colore)
   box-shadow:(inset) 2px 2px 5px 0px #333; -webkit-box-shadow.....; -mox-box-shadow........;

 OMBRA DIREZIONALE
   (orizzonale verticale blur spread colore)
   TOP: box-shadow: 0 -4px 2px -2px rgba(0,0,0,0.4); -webkit-box-shadow.....; -mox-box-shadow........;
   RIGHT: box-shadow: 4px 0 2px -2px rgba(0,0,0,0.4); -webkit-box-shadow.....; -mox-box-shadow........;
   BOTTOM: box-shadow: 0 4px 2px -2px rgba(0,0,0,0.4); -webkit-box-shadow.....; -mox-box-shadow........;
   LEFT: box-shadow: -4px 0 2px -2px rgba(0,0,0,0.4); -webkit-box-shadow.....; -mox-box-shadow........;

 GLOW
   (orizzonale verticale blur spread colore)
   ESTERNO SFUMATO: box-shadow:0 0 10px 2px #333; -webkit-box-shadow.....; -mox-box-shadow........;
   ESTERNO NETTO: box-shadow:0 0 0 10px #333; -webkit-box-shadow.....; -mox-box-shadow........;
   INTERNO SFUMATO: box-shadow:inset 0 0 10px 2px #333; -webkit-box-shadow.....; -mox-box-shadow........;
   INTERNO NETTO: box-shadow:inset 0 0 0 10px #333; -webkit-box-shadow.....; -mox-box-shadow........; 
   
 GRADIENTS
   (proprietà di background: colore 1 -> colore 2)
   LINEARE: background: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
   RADIALE: background: linear-gradient(45deg, #f06, #CCC);
   RADIALE: background: radial-gradient(center 0, circle farthest-corner, rgba(0,0,0,0.15), rgba(0,0,0,0));

 STONDATURA GENERALE: border-radius:5px; -webkit-border-radius:.....; -moz-border-radius:.....;
 STONDATURA SINGOLA: border-radius:5px 5px 5px 5px; -webkit-border-radius:.....; -moz-border-radius:.....;
 CERCHIO: border-radius:50%; -webkit-border-radius:.....; -moz-border-radius:.....;
 OVALI: border-radius:20px/60px; -webkit-border-radius:.....; -moz-border-radius:.....;
 TRANSIZIONI: transition:all 0.3s ease-out;
 ELEMENTI A:HOVER .q{background:url(../img/ico/social.png) 0 0 no-repeat;} .q a:hover{background-position:0px -40px;}
 AGGIUNGERE behavior:url(../pie.htc); nelle classi o id con proprietà stondatura e/o ombra*/
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*** CSS Document ***/
body{font-family:Verdana, Arial, Helvetica, sans-serif; margin:0; height:auto; width:auto; background:#fff;}
 a img{border:none;} hr{border:#CCC 1px solid;} dt,dd{margin:0; padding:0;} 
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*** principali ***/
.header1 { width:100%; height:72px; background:url(../img/bg/1_bg.html)}
.header2 {width:1010px; height:70px; margin:-32px auto 0 auto; background:url(../img/bg/2_bg.html);}
.main {width:100%; margin:0 auto;width:980px;}
.footer {width:100%; height:45px; margin:0; padding:0; background:url(../img/bg/1.html);}
.ombra {width:980px; margin:0 auto; background:url(../img/bg/ombra.png); height:30px; position:absolute; z-index:99999999999; left:50%; margin-left:-500px;}
.rotate {float:left;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out;}
.rotate:hover {transform:rotate(110deg);-ms-transform:rotate(110deg); /* IE 9 */-webkit-transform:rotate(110deg); /* Safari and Chrome */ -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out;}

.rotate2 {float:left;-webkit-transition:all 2.5s ease-in-out; -moz-transition:all 2.5s ease-in-out; -o-transition:all 2.5s ease-in-out; transition:all 2.5s ease-in-out; -ms-transition:all 2.5s ease-in-out;}
.rotate2:hover {transform:rotate(360deg);-ms-transform:rotate(360deg); /* IE 9 */-webkit-transform:rotate(360deg); /* Safari and Chrome */ -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; margin:0; padding:0;}
.pulsante {-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; color:#666;}
.pulsante a:hover {-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; color:#999;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*** CLASSI ***/
.b1 {background:#3E3B34; border:1px #000000 solid; padding:10px; transition:all 0.3s ease-out;} .b1:hover {background:#2F2D26; transition:all 0.3s ease-out;}
.b2 {background:#2F2D26; border:1px #000000 solid; padding:10px; transition:all 0.3s ease-out;} .b2:hover {background:#3E3B34; transition:all 0.3s ease-out;}
.b3 {background:#222222; padding:10px; border:1px #000000 solid; margin-top:10px; transition:all 0.3s ease-out;} .b3:hover {background:#3E3B34; transition:all 0.3s ease-out;}
.in, .in2 {width:980px; height:auto; margin:0 auto;}
.c1 {width:310px;float:left} .c1a {width:220px;float:left} .c2 {width:460px;float:left} .c3 {width:630px;float:left} .cd {width:20px;height:5px;float:left} .clear {clear:both;}
.input {background:#FFF url(../img/bg/bg_input.html) no-repeat scroll left top; border:1px solid #DADADA; -webkit-border-radius:5px; border-radius:5px; color:#555; 
font-family:Verdana,Arial,Helvetica,sans-serif; font-size:13px; margin:2px 0 0; padding:4px; width:auto;}
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* FLOAT + IMG + HR */
.fl_sx{float:left;} .fl_dx{float:right;} .i{border:0;} .i_sx{border:0;float:left;} .i_dx{border:0;float:right;} .i_s_10{border:0;float:left;margin-right:10px;} .i_d_10{border:0;float:right;margin-left:10px;} .hr{width:auto;height:1px;background:#DADADA;margin:10px 0;}
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ALTRO */
ul.menu_sez a {width:auto; height:auto;  text-decoration:none;}
ul.menu_sez {list-style:none; list-style-position:inherit; margin:0; padding:0; z-index:1000; float:left; width:auto;}
ul.menu_sez * {margin:0; padding:0; z-index:1000;}
ul.menu_sez a {display:block; text-decoration:none; z-index:1000; padding:6px;} 
ul.menu_sez li {position:relative; float:left; z-index:1000;}
ul.menu_sez li a:hover { color:#FFF;} 
ul.menu_sez ul {position:absolute; top:30px; left:0px; display:none; opacity:0; list-style:none; z-index:1000;}
ul.menu_sez ul li {position:relative; border:1px solid #666666; width:170px; margin:0; z-index:1000; color:#EEE;}
ul.menu_sez ul li a {display:block; padding:10px; background:url(../img/bg/1.html); z-index:1000;}
ul.menu_sez ul li a:hover {background:#51A0D3; z-index:1000; color:#FFF; }
ul.menu_sez ul ul {left:150px; top:-1px; z-index:1000;}
ul.menu_sez .menulink {padding:0px; width:auto; z-index:1000;}
ul.menu_sez .menulink:hover, ul.menu_sez .menuhover {z-index:1000;}
ul.menu_sez .sub {background-color:#efefef; z-index:1000;}
ul.menu_sez .topline {border-top:1px solid #999; z-index:1000;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* pulsanti */

.m:hover { opacity:0.8}
.m2 {background:url(../img/bg/3_bg.html); padding:10px 20px; opacity:1}
.m3 {background:url(../img/bg/1.html); padding:10px 10px; text-align:center;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out;}
.m3:hover { background:url(../img/bg/3_bg.html); color:#EEE; -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; }


/* ---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* menu */
.menu { float:right;}
.pul_menu { padding:18px 16px;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; float:left;}
.pul_menu:hover { background:#E9E9E9; color:#328B52;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out;}
.verde { cursor:pointer;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out;}
.verde:hover { background:#1E753F;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out;}
.mov { cursor:pointer;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; float:left;}
.mov:hover { margin-top:15px; opacity:0.9;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out; -o-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out;}
#ff { width:30px; height:30px; position:absolute; left:50%; margin-left:-170px; background:url(../img/icone/nav.html) 0 0 no-repeat; top:30px; cursor:pointer;}
.invia {text-align:center; padding:7px 20px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -o-border-radius:5px; -ms-border-radius:5px; display:inline-block; background:#333; color:#fff; transition:all 0.3s ease-out; border:none; cursor:pointer; float:left; margin-right:0px; font-size:14px; border:1px solid #666;}
.invia:hover {transition:all 0.3s ease-out; background:#FFF;color:#333; }

/* -----------------EFFETTO SU IMMAGINI E ANIMAZIONI----------------------------------------------------------------------------------------------------------------------------------------- */
ANIMAZIONI----------------------------------------------------------------------------------------------------------------------------------------- */
[data-liffect="zoomIn"] {opacity: 0;position: relative;-webkit-animation: zoomIn 2000ms ease both;-webkit-animation-play-state: paused;-moz-animation: zoomIn 600ms ease both;-moz-animation-play-state: paused;-o-animation: zoomIn 600ms ease both;-o-animation-play-state: paused;animation: zoomIn 600ms ease both;animation-play-state: paused;}
[data-liffect="zoomIn"].play{-webkit-animation-play-state: running;-moz-animation-play-state: running;-o-animation-play-state: running;animation-play-state: running;}
@-webkit-keyframes zoomIn {0% { opacity: 0; -webkit-transform: scale(2.0); } 100% { opacity: 1; -webkit-transform: scale(1); -webkit-transform:rotate(360deg); }}
@-moz-keyframes zoomIn {0% { opacity: 0; -moz-transform: scale(2.0); }100% { opacity: 1; -moz-transform: scale(1); -moz-transform:rotate(360deg); }}
@-o-keyframes zoomIn {0% { opacity: 0; -o-transform: scale(2.0); }100% { opacity: 1; -o-transform: scale(1);-o-transform:rotate(360deg); }}
@keyframes zoomIn {0% { opacity: 0; transform: scale(2.0); } 100% { opacity: 1; transform: scale(1);transform:rotate(360deg); }

