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


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	/*border: 0;*/
	font-size: 100%;	
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}


@font-face{
	font-family:OpenSansSemibold;
	src:url('../font/Open_Sans/OpenSans-Semibold.ttf');
}

@font-face{
	font-family:OpenSansLight;
	src:url('../font/Open_Sans/OpenSans-Light.ttf');
}

@font-face{
	font-family:OpenSansRegular;
	src:url('../font/Open_Sans/OpenSans-Regular.ttf');
}

*{	
	font-size: 16px;
	font-weight:400; /* 300 light - 400 normal - 600 SemiBold - 700 Bold - 800 ExtraBold */
	font-style:normal;
	text-decoration:none;	
	padding:0;
	margin:0;
}

body{ font-family: OpenSansSemibold,arial,sans-serif;color:#0164a5; background:#fff;line-height: 1.5;}
      
a{ text-decoration:none; color:#000000}

a:active { color: #000000;}      
      
a:hover{ color: red;}

div#topnav {  
  height:40px;
  background-image:url('../bg_nav.jpg');  
  color:#FFF;
  font-size:16px;
  vertical-align:middle;
  text-decoration:none;
  margin-left: auto;
  margin-right: auto;
}

.link_topnav {   
  color:#FFF;
  font-size:16px;
  vertical-align:middle;
  text-decoration:none;
}

.menu
           {
	        border:none;
	        border:0px;
	        margin:0px;
	        padding:0px;	        
			background-color:#0999d5;
			font-weight:bold;
			font-size:small;   
			color: white;         	                            
	        }
	            


.btn-responsive-menu
{
display:                none;
padding:                5px;
cursor:                 pointer;
color:                  #000000;
background:             #fff;
-webkit-border-radius:  4px;
-moz-border-radius:     4px;
border-radius:          4px;
}

.icon-bar 			
{
display:                 block;
width:                   20px;
height:                  3px;
margin:                  5px;
background-color:        #6e6d6c;
-webkit-border-radius:   2px;
-moz-border-radius:      2px;
border-radius:           2px;
}

.show{display:block!important;}

.pulsante {
 outline: none;
 cursor: pointer;
 text-align: center;
 text-decoration: none;
 font: bold 12px Arial, Helvetica, sans-serif;
 color: #fff;
 padding: 10px 20px;
 border: solid 1px #0076a3;
 background: #0095cd;
 
 background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
 background: -webkit-linear-gradient(top,  #00adee,  #0078a5);
 background: -moz-linear-gradient(top,  #00adee,  #0078a5);
 background: -ms-linear-gradient(top,  #00adee,  #0078a5);
 background: -o-linear-gradient(top,  #00adee,  #0078a5);
 
 -moz-border-radius: 8px;
 -webkit-border-radius: 8px;
 border-radius: 8px;  
}


/**********************************************************************************************************************************/

#top {height: 100px; width:50%;} 
#top img{ max-width:100%;height:auto; padding-left: 10px;} 


#top2 img{max-width:100%;height:auto;} 

.line {
    border-top: 1px solid #cacaca;
}

#contenuto {height: 520px; background-color: #e0eaee;}

#LogIn{ position:relative; top:40px; width: 340px;  height: 150px; background-color: #ffffff;}
.LogIn{ padding: 1em 2em 2em; line-height: 2; margin: auto; border-radius: 10px; text-shadow: 0px 1px 1px #fff; border: 1px solid #6e6d6c;}

#titoloLogIn{text-align:center;}
.CampiLogIn{padding: 5px 5px 5px;}

#footer  {height: 30px; background-color: #0999d5;}

.testo  {font-weight: 400; font-size: 1.2em;}
.testo_bold  {font-weight: 600; font-size: 1em;}

.testo_menu  {font-weight: 400; font-size: 1em;}

.testo_footer  {font-weight: 400; font-size: 1.2em; color:#ffffff;}

.TestoSqlInjection{ font-size: 2em;}

.cella{font-weight: 400; font-size: 1em; float: left; min-height: 22px;  line-height: 2; margin-top: 1px; border-radius: 10px;  border: 1px solid #6e6d6c; text-align:left;}
.cella a{color: #ffffff;}
.cella a:hover{color: red;}

.cella2{font-weight: 400; font-size: 1em; float: left; min-height: 22px;  line-height: 2; margin-top: 1px; border-radius: 10px; border: 1px solid #6e6d6c; text-align:left;}
.cella2 a{color: #ffffff;}
.cella2 a:hover{color: red;}

.sfondo_ListView{background-color: #0999d5;}

.sfondo_ListViewItemTemplate
{        	
	background-color: #ABCDEF;   
	color: #000000;                  	
}

.sfondo_ListViewAlternatingItemTemplate
{        	
	background-color: #ffffff;   
	color: #000000;                  	
}

.linea_bluOriz{margin-top: 0em; width: 100%; height: 20px; background-image: url(/shalom/img/linea-blu.png); background-repeat:repeat-x; float: left;}



/********************************************************************************************************************************/
@media only screen and (min-width: 320px) and (max-width: 479px) {  /* HVGA (old iPhones, small Androids) */      
    #top {height: 50px;}      
    
    #contenuto {height: 435px; background-color: #e0eaee;}
    
    #LogIn{ position:relative; top:40px; width: 200px;  height: 150px; background-color: #ffffff;}
    
    #navigation{display:none;} 
    #menuResponsive{display:none;}     
    .btn-responsive-menu
    {
        display:      block;
        position:     absolute; 
        top:          0px; 
        right:        20px; 
    }
    
    
       
        
                                                                                  
    .TestoSqlInjection{ font-size: 0.5em;}         
    .testo  {font-weight: 400; font-size: 0.5em;}
    .testo_bold  {font-weight: 800; font-size: 0.5em;}      
    .testo_footer  {font-weight: 400; font-size: 0.7em;}    
    
     .td_nome{ width:22%} /* Elenco_anagrafe */
     .td_zona{ width:22%} /* Elenco_anagrafe */
     
     .td_marca{ width:22%} /* InSchedaCliente */
     .td_matricola{ width:22%} /* InSchedaCliente */
     .td_lett_att{ width:20%} /* InSchedaCliente */  
     .td_consumo{ width:10%} /* InSchedaCliente */ 
     .td_consumo_annuo{ width:8%} /* InSchedaCliente */    
     
     .nome{ width:35%}           
                                                                                                                               
}


@media only screen and (min-width: 480px) and (max-width: 768px) { /* Tablet o Smart Phone in orizzontale*/   
    #top {height: 70px;}   
    
    #contenuto {height: 180px; background-color: #e0eaee;}
    
    #LogIn{ position:relative; top:20px; width: 320px;  height: 100px; background-color: #ffffff;}
    
    #navigation{display:none;} 
    #menuResponsive{display:none;} 
    .btn-responsive-menu
    {
        display:      block;
        position:     absolute; 
        top:          0px; 
        right:        20px; 
    }      
        

                                                                      
    .TestoSqlInjection{ font-size: 0.8em;}      
    .testo  {font-weight: 400; font-size: 0.8em;}
    .testo_bold  {font-weight: 600; font-size: 0.8em;}    
    .testo_footer  {font-weight: 400; font-size: 0.8em;}  
    
    .testo_menu  {font-weight: 400; font-size: 1.5em;}     
    
    .nome{ width:30%}      
    .td_nome{ width:22%} /* Elenco_anagrafe */  
    .td_marca{ width:22%} /* InSchedaCliente */ 
    .td_matricola{ width:22%} /* InSchedaCliente */  
    .td_lett_att{ width:18%} /* InSchedaCliente */     
    .td_consumo{ width:9%} /* InSchedaCliente */ 
    .td_consumo_annuo{ width:8%} /* InSchedaCliente */                                                                                                                 
}


@media only screen and (min-width: 769px) and (max-width: 1024px) { /* PC */    
    .TestoSqlInjection{ font-size: 1.5em;}     
    
    #contenuto {height: 580px; background-color: #e0eaee;}
    
    #LogIn{ position:relative; top:20px; width: 350px;  height: 200px; background-color: #ffffff;}  
    
    .TestoSqlInjection{ font-size: 1em;}      
    .testo  {font-weight: 400; font-size: 1em;}
    .testo_bold  {font-weight: 700; font-size: 1em;}    
    .testo_footer  {font-weight: 400; font-size: 1em;}  
    
    .testo_menu  {font-weight: 400; font-size: 1.5em;}         
    
    #menuResponsive{display:none;} 
    .cella{display:none;}    
    .cella2{display:none;}      
    
    .td_nome{ width:12%}  /* Elenco_anagrafe */   
    .td_marca{ width:12%} /* InSchedaCliente */      
    .td_matricola{ width:12%} /* InSchedaCliente */     
    .td_lett_att{ width:15%} /* InSchedaCliente */   
    .td_consumo{ width:7%} /* InSchedaCliente */      
    .td_consumo_annuo{ width:12%} /* InSchedaCliente */                                                                                    
}


@media only screen and (min-width: 1025px)  and (max-width: 1366px){ /* PC */      
                                                                        
    #menuResponsive{display:none;} 
    .cella{display:none;}     
    .cella2{display:none;}    
    
    .td_nome{ width:10%}  /* Elenco_anagrafe */  
    .td_zona{ width:5%}   /* Elenco_anagrafe */
    
    .td_marca{ width:25%} /* InSchedaCliente */
    .td_matricola{ width:25%} /* InSchedaCliente */
    .td_lett_att{ width:10%} /* InSchedaCliente */
    .td_consumo{ width:6%} /* InSchedaCliente */
    .td_consumo_annuo{ width:9%} /* InSchedaCliente */

}


@media only screen and (min-width: 1367px) { /* PC */    
                                             
    #menuResponsive{display:none;} 
    .cella{display:none;}     
    .cella2{display:none;}   
    
    .td_nome{ width:10%} /* Elenco_anagrafe */  
    .td_zona{ width:8%}  /* Elenco_anagrafe */
    
    .td_marca{ width:25%} /* InSchedaCliente */
    .td_matricola{ width:25%} /* InSchedaCliente */
    .td_lett_att{ width:10%} /* InSchedaCliente */
    .td_consumo{ width:6%} /* InSchedaCliente */
    .td_consumo_annuo{ width:9%} /* InSchedaCliente */
}