/************************************************************************************
Aspetto di base
*************************************************************************************/

body {
	font-family: 'Dosis', verdana, sans-serif; color:#333; font-size:12px;
	margin: 0px;}


a ,a:hover,a:link,a:visited,a:active{text-decoration:none;}

h1, h2, h3{ font-weight:100; padding:0px; margin:0px ;}
h1 { font-size:28px; color:#555 }
h2 { font-size:21px;  }
h3 { font-size:16px; }

#logo {     color:#063;
	 padding:0px 0px 0px; 
}
#logo img{ max-width:75%    ;  float:left; 
}

.footsx { width: 69.0%; text-align:left; margin-top:20px; margin-bottom:20px; display:block; padding-left:0%    }
.footdx { width: 29.0%; text-align: right;  margin-top:20px; margin-bottom:20px;  display:block;padding-right:0% }
h1.right{text-align: right; text-transform:uppercase;color:#999; margin-top:10px }
.imgresp {-ms-interpolation-mode:bicubic; max-width:100%;width:100%; margin:0}


/************************************************************************************
Struttura  img{-ms-interpolation-mode:bicubic; max-width:96%; margin:2%}
*************************************************************************************/
#page {
	padding: 0px;
	width: 960px;
	margin: 0px auto;
}
#header { display:block; padding:0px 0%;
	min-height: 120px;color:#ccc;
}


#footer {font-size:11px;letter-spacing:0px;
	clear: both; margin-top:10px; padding-top:20px; border-top:1px solid #999; display:block
}

#footer a{ color:#000 
}

#footer a:hover{ color:#666 
}

.txthome { text-transform:uppercase;font-weight: 200;  font-size:32px; text-align:right }
.txthome span{ color:#999 }
.txt  {  text-align: right; font-size:14px; margin-left:13%; margin-top:20px; line-height:18px}
.txt2  {  text-align: left; font-size:14px; margin-left:13%; margin-top:20px; line-height:18px}
 .txt_all_right {  text-align: right; font-size:14px; margin-left:12%; margin-top:20px; line-height:18px}
.txt_all_right a, .txt a { color:#555}
.txt_all_right a:hover, .txt a:hover { color:#000; text-decoration:underline}

 .txt_all_left {  text-align: left; font-size:14px; margin-left:12%; margin-top:10px; line-height:18px}
.txt_all_left a { color:#555}
.txt_all_left a:hover { color:#000; text-decoration:underline}
.lang   { font-size:15px;  padding:26px  6px 0 0; text-align:right; display:block; }
.lang a { color:#000 }
.lang a:hover { text-decoration:underline }
/* border & guideline (you can ignore these) */



/************************************************************************************
Menù pc, tablet e mobile
*************************************************************************************/

.boxmenu {padding:0px 0 0 0px; display: block; float:right;   }
nav, ul, li, a  {margin: 0; padding: 0;}
 
.container { font-size:15px;
     text-transform: uppercase;
     
    margin: 4px auto 0px; 
}
.toggleMenu {
    display:  none;
    background: #666;
    padding: 10px 15px 10px; margin:0px 0% 0px 0px;margin-right:2px;
    color: #fff;
}

.toggleMenu:visited {
    display:  none;
    background: #666;
    color: #fff;
}

.toggleMenu:hover {
    display:  none; background-color:#999
    
  
}
.nav {
    list-style: none;
     *zoom: 1;
      color:#333; width:100%;z-index:9999;
}
.nav:before,
.nav:after {
    content: " "; 
    display: table; 
}
.nav:after {
    clear: both;
}
.nav ul {
    list-style: none;
    width: 9em;
}
.nav a {
    width:auto; padding:10px 4px;
    color:#333;
}
.nav li {
    position: relative;
}
.nav > li {
    float: left;
    
}
 
.nav > li > a {
    display: block;
}
.nav li  ul {
    position: absolute;
    left: -9999px;
}
 
.nav li a:hover { text-decoration:underline
  
}

 

@media screen and (max-width: 890px) {
 .nav a {
    width:auto; padding:10px 4px;
    color:#333;  
}
    
}

@media screen and (max-width: 960px) {
	.lang   { font-size:15px;  padding:20px  1px 0 0; text-align:right; display:block; }.container { font-size:14px;
    
}
	.boxmenu {padding:0px 0 0 0px;    }
   .nav   { position:absolute; z-index:50;
      width:60% ; right:0;
     -webkit-box-shadow: 0px 1px 3px #666666;
  -moz-box-shadow: 0px 1px 3px #666666;
  box-shadow: 0px 1px 3px #666666; margin-right:8px;
  max-width:250px; z-index:9999;
}
 .nav a { text-align:left;
    padding: 10px 15px; 
    color:#333; background-color:#eee; color:#000;opacity:0.9;
  filter:alpha(opacity=90); 
}
.nav li a:hover {
  color:#333; text-decoration:none; background-color:#fff
}
.txthome {  font-size:26px;  }
.active {
        display: block;
    }
    .nav > li {
        float: none;border-bottom: 0px solid #ccc;
    }
    .nav > li > .parent {
        background-position: 95% 50%;
    }
   
    .nav ul {
        display: block;
        width: 100%;
    }
   .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
    }
 
.nav li a:after { float:right; font-size:14px;color:#999;  
	text-shadow: 0px 0px 2px #fff;
	content:'>';
}

}
@media screen and (max-width: 320px) {
.nav   { position:absolute; 
      margin:5px 5% 5px 0% ; width:95% ;
      
}	 
#footer { text-align:center }
	 
 .toggleMenu {
   
     
    
     
}

#page {
	padding: 0 1%;
	width: 98%; min-width:300px;
	margin: 0px auto;
}
}



/************************************************************************************
blocchi responsive
*************************************************************************************/
 .blocco  {content:"";
	display: block;
	float:left;
	 	
	display:table;width: 100%;
} 
.blocco:after {
	clear:both;
}
.res{ display: block;
	float:left;
	margin: 0% 0% 2% 2%;  }
.res:first-child { margin-left: 0; }

.s_4 p { padding:8px 12px; }
.s_4 h3{ padding:8px 12px 0px;  }
    .s_1 { width: 6.5%; }
	.s_2 { width: 15.0%; }
	.imggallery { width: 18.4%; background-color:#666; min-height:50px; }
	.imggallery img{ max-width:100%;  }
	.s_3 { width: 23.5%; }
	.s_4 {width: 32.0%; }
	.s_5 { width: 40.5%; }
	.s_6 { width: 49.0%; }
	.box { width: 23.5%; text-transform:uppercase; font-size:16px;  }
	.box a {display:block; margin:0 5%}
	.box a div{display:inline-block; float:right; margin:2% 0 0 0%; width:56%; color:#333; text-align:left;}
	.box a div span{ color:#999 }
	.box a:hover div span{  color:#000 }
	.box a div{display:inline-block; float:right; padding:0 0 0 0%;  color:#000}
	.box a  img{max-width:33%;
	opacity:1;
  filter:alpha(opacity=100); 
}
	
	.box a:hover img{ /* Old WebKit, Google Chrome & Safari 6+ */
	opacity:0.7;
  filter:alpha(opacity=70); 
 }
 
 .box2 { width: 23.5%; text-transform:uppercase; font-size:16px;  }
	.box2 a {display:block; margin:0 5%}
	.box2 a div{display:inline-block; float:right; margin:2% 0 0 0%; width:56%; color:#333; text-align:left;}
	
	.box2 a:hover div span{  color:#000 }
	.box2 a div{display:inline-block; float:right; padding:0 0 0 0%;  color:#000}
	.box2 a  img{max-width:80%;
	opacity:1;
  filter:alpha(opacity=100); 
}
	
	.box2 a:hover img{ /* Old WebKit, Google Chrome & Safari 6+ */
	opacity:0.7;
  filter:alpha(opacity=70); 
 }
 
 
	.contsx { width: 40.5%;  }
	.contdx { width: 57.5%; }
	.s_7 { width: 57.5%; }
	.s_8 { width: 66.0%; }
	.s_9 { width: 74.5%; }
	.s_10 { width: 83.0%; }
	.s_11 { width: 91.5%; }
	.s_12 { width: 100%; }

/************************************************************************************
tutti i moduli
*************************************************************************************/
.modulo_input{ padding:10px; background-color:#fff; margin:20px }
.modulo_input div{ vertical-align:top; line-height:24px}
 

textarea {background-color:#efefef;background-color:#eee; border:1px solid #eee;padding:3px;  width:70%}
textarea:hover {outline-width:0;  background-color:#fff; border:1px solid #ccc;}
textarea:focus {outline-width:0;   background-color:#ddd;  border:1px solid #eee;}

input[type="text"] {background-color:#efefef;background-color:#eee; border:1px solid #eee;padding:3px;  width:70%}
input[type="text"]:hover{outline-width:0;   background-color:#fff;  border:1px solid #eee;}
input[type="text"]:focus{outline-width:0;  background-color:#ddd; border:1px solid #ccc;}


input[type="submit"]  { display:inline; background-color:#333; color:#CCC;  border:0px;  border:1px solid #333;width:100px }
input[type="submit"]:hover  { background-color:#000; color:#fff;  border:0px;  border:1px solid #333; }

input[type="password"] {background-color:#efefef;background-color:#eee; border:1px solid #eee;padding:3px;  width:70%}
input[type="password"]:focus {outline-width:0;   background-color:#fff;  border:1px solid #eee;}
input[type="password"]:hover {outline-width:0;  background-color:#eee; border:1px solid #ccc;}



/************************************************************************************
messaggi
*************************************************************************************/



.msg_error{ font-size:12px; color:#b21e1f; background-image:url(../img/icone/no.png); background-repeat:no-repeat; background-position:12px 8px; padding:20px 20px 20px 60px; border-top:2px solid  #b21e1f; border-bottom:2px solid  #b21e1f; margin:20px;  background-color:#fff;}
.msg_attention{ font-size:12px; color:#27509a; background-image:url(../img/icone/at.png); background-repeat:no-repeat; background-position:12px 8px; padding:20px 20px 20px 60px; border-top:2px solid  #27509a; border-bottom:2px solid  #27509a; margin:20px; background-color:#fff;}
 
.msg_complete{ font-size:12px; color:#2a992e; background-image:url(../img/icone/ok.png); background-repeat:no-repeat; background-position:12px 8px; padding:20px 20px 20px 60px; border-top:2px solid  #2a992e; border-bottom:2px solid  #2a992e; margin:20px; background-color:#fff;}



/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 980px or less */
@media screen and (max-width: 960px) {
	
	#page {
		width: 98%; margin:1%
	}


}

/* for 700px or less */
@media screen and (max-width: 700px) {
	#puls_menu { 
   display: block; color:#000;
  
 }
#header { display:block;  
	height:auto;color:#ccc;  
}.txthome {  font-size:32px;  }
.box {   font-size:16px;  }
 .footsx, .footdx { width: 96.0%; float:none; text-align:center }
 	.contsx {  width:96%; margin:2%; display:block;}
	.contdx {  width:96%; margin:2%; display:block;}
}

/* for 480px or less */
@media screen and (max-width: 480px) {
.s_1,.s_2, .s_3, .s_4,.s_5, .s_6,.s_7,.s_8 ,.s_9,.s_10 ,.s_11 ,.s_12 { width:96%; margin:2%; display:block; }
	
.box {width:96%; margin:2%;text-align:center; display:block;  text-transform:uppercase; font-size:20px;  }
.box a img{max-width:50%;  }
.res:first-child { margin-left: 2%; }
 .box2 a  img{max-width:100%;
	opacity:1;
  	}
  .box2 {width:96%; margin:2%;text-align:center; display:block;  text-transform:uppercase; font-size:20px;  }
 
}