body { background-color: #fff; color: #000; }
#analisi { 
    background-color: white;
    border: 2px solid #999999;
    border-radius: 4px 4px 4px 4px;
    color: black;
    padding: 2px; }



body {
    font-family: verdana, arial, helvetica, sans-serif;
    font-size:   13px;
    line-height: 13px;
    background-color: #555;
    /*  background-image:url("../../images/sfondo_login.jpg");*/
    background-size: 100%;
    background-repeat: no-repeat;


}

pre {
    background-color: #eee;
    padding: 10px;
    font-size: 11px;
    color: black;
}

/*a {  
    color:yellow;}*/
/*a:visited {  
    color:yellowgreen; }*/
/*a:hover { color: #fff;}*/

div.field, div.actions {
    margin-bottom: 10px;
}

#notice {
    color: red;
    text-decoration: blink;
    font-weight: bold; 
}

#flash_error {
    padding: 2px;
    background-color: red;
    display: table;
}

.field_with_errors {
    padding: 2px;
    background-color: red;
    display: table;
}
.foto{
    background-color: black;
}

#error_explanation {
    width: 450px;
    border: 2px solid red;
    padding: 7px;
    padding-bottom: 0;
    margin-bottom: 20px;
    background-color: #f0f0f0;
}

#error_explanation h2 {
    text-align: left;
    font-weight: bold;
    padding: 5px 5px 5px 15px;
    font-size: 12px;
    margin: -7px;
    margin-bottom: 0px;
    background-color: #c00;
    color: #fff;
}

#error_explanation ul li {
    font-size: 12px;
    list-style: square;
}


/* Home Page style */

#banner {

    background-color: rgba(0,0,0,0.5);
    color:white;
    border-bottom: 3px solid #555555;

}

.allert_restore {
    border: 1px solid  #ff0000;
    border-radius: 4px;
    background-color: #fefefe;
    color: #000000;
    font-weight: bold;
    font-variant: small-caps;
}
/*#banner a {

    background-color: #000;
    color:yellow;


}
#banner a:visited {

    background-color: #000;
    color: yellow;   

}*/
#corpo {
    /*background-color: #222;*/
    background-color: rgba(0,0,0,1);
    border-top: 0x solid white;
    border-bottom: 0px solid white;
    position:absolute;
    color:white;
    /*   box-shadow: white 0.5em 0.5em 0.3em;
       padding-left: 9px; */
    float: none;
    width: 99%;    
}
input[type="text"], input[type="number"], input[type="submit"], input[type="button"], textarea, select {

    background-color : #f2f2f2;
    color: black;
}

#corpo_form_vano {
    /*background-color: #222;*/
    background-color: rgba(0,0,0,1);
    border-top: 0x solid white;
    border-bottom: 0px solid white;
    color:white;
    padding-left: 9px;
    float: left;
    width: 55%;
}

#corpo p {
    padding-left: 10px;
}

/*#corpo a {
    background-color: #dedad5;
    border: 2px solid #999;
    border-radius: 4px;
    padding: 2px;
    box-shadow: #938381 0.25em 0.25em 0.15em;
}*/
#populates_dett_action{
    background-color: #DEDAD5;
    border: 2px solid #999999;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0.25em 0.25em 0.15em #938381;
    padding: 2px;
}

.cad {
    background-color: #dedad5;
    border: 2px solid #999;
    border-radius: 4px;
    padding: 2px;
    box-shadow: #938381 0.25em 0.25em 0.15em;
    text-align: center;
    font-size: 14px;

}

/*
#corpo a:visited { color: #8087ff; }
#corpo a:hover { color: #fff; background-color:#000; }*/

#corpo h1 {
    padding-left: 9px;
}

#corpo h4 {
    padding-left: 9px;
}

#corpo td {
    padding: 3px;
    /* text-align: center;*/
}

#login_signin {
    text-align: right;
    background: url("/assets/img/bg.png") repeat scroll 0 0 #373737;
    /*padding: 3px;*/
    border: 1px solid black;
    /*border-radius: 9px;*/
    /*box-shadow: #444 0.25em 0.25em 0.1em;*/
}

#user_locators {

}

#sidebar-menu-rilev {
    font-size: 14px;
    caption-side : bottom;

}


#sidebar-menu-rilev  tr {
    padding: 3px;
    width : 200px;
    caption-side : bottom; 
}

#sidebar-menu-rilev  td {
    padding: 1px;
    padding-bottom: 5px;
   
    border-bottom: 10px trasparent;
    color:white;
    align:  center;

}

#sidebar-menu-rilev  h6 {
    line-height: 250%;
    width : 300px;
    text-align: justify;
    font-size: 13px;
}

#scaffmenu table {
    font-family: verdana,arial,helvetica,sans-serif;
    font-size: 13px;
    line-height: 18px;
    background-color: #000000;
    border-top: 0px solid white;
    border-bottom: 2px solid white;
    color: white;
}

#edit_populate_62 {
    padding: 10px;
    width: 600px;
}

.field{
    padding: 10px;
    border: 1px solid #000000;
    border-radius: 12px;
    box-shadow: #444 0.15em 0.15em 0.05em;
    font: 12px Verdana, Arial, Helvetica, sans-serif;
    background-color: #888;
    width: 600px;
}

.pari {
    background-color: transparent;
    border: 0px solid #000;
    font: 12px Verdana, Arial, Helvetica, sans-serif;

}
.dispari {

}
.parif {
    background-color: transparent;
    border: 0px solid #000;
    font: 12px Verdana, Arial, Helvetica, sans-serif;

}
.disparif {
    padding: 10px;
    border: 1px solid #000000;
    border-radius: 6px;
    box-shadow: #333 0.15em 0.15em 0.05em;
    font: 12px Verdana, Arial, Helvetica, sans-serif;
    background-color: #888;
}

#campi_puntuale {
    border: 1px solid #000000;
    border-radius: 12px;
    box-shadow: #ccc 0.15em 0.15em 0.05em;
    font: 12px Verdana, Arial, Helvetica, sans-serif;
    background-color: #777;
}
.nome{
    font-size: 15px;
    font-weight: bold;
}

#nome{
    font-size: 30px;
    font-style: italic;
}

.filtro th{
    font-family: verdana,arial,helvetica,sans-serif;
    font-size: 11px;
    line-height: 18px;
    background-color: rgba(248,248,250,0.3);
    border-bottom: 2px solid black;
    border-right: 2px solid black;
    border-radius: 8px;
}

/*.record tr:nth-child(even) {
    background: #CCC;
    border-bottom: 2px solid black;}*/

.record tr:nth-child(odd) {
    background:#7D7D7D;

}


.record tr:nth-child(odd) td {
    border-bottom: 2px solid black;
    border-radius: 3px;

}
.record tr:nth-child(even) {
    background: #404040;

}


.record tr:nth-child(even) td {
    border-bottom: 2px solid black;
    border-radius: 3px;

}

#titplan {
    font-family: verdana,arial,helvetica,sans-serif;
    font-size: 13px;
    line-height: 18px;
    color: white;
    background-color: rgb(0,0,0);
    border: 0px solid #666;
    border-radius: 12px;
    /* max-width: 75%;
     max-height: 75%;*/
    text-align: center;
    padding: 15,15,15,15;
}

.google_analisi {
    color:black;
}

#java_foto {
    font-family: verdana,arial,helvetica,sans-serif;
    font-size: 13px;
    line-height: 18px;
    color: white;
    background-color: rgb(0,0,0);
    border: 0px solid #666;
    border-radius: 12px;
    /* max-width: 75%;
     max-height: 75%;*/
    text-align: center;
    padding: 15,15,15,15;
    float: right;
}

div.autocomplete {
    position:absolute;
    width:250px;
    background-color:white;
    border:1px solid #888;
    margin:0;
    padding:0;
}
div.autocomplete ul {
    list-style-type:none;
    margin:0;
    padding:0;
}
div.autocomplete ul li.selected { background-color: #ffb;}
div.autocomplete ul li {
    list-style-type:none;
    display:block;
    margin:0;
    padding:2px;
    height:32px;
    cursor:pointer;
}

.infoplan{

    min-width: 250px;
    max-width: 250px;
    border-right-style: solid;
    border-left-style: solid;
    border-bottom-style: solid;
    border-top-style: solid;
    border-right-width: 1px;
    border-left-width: 1px;
    border-bottom-width: 1px;
    border-top-width: 1px;
    border-right-color: white;
    border-left-color: white;
    border-bottom-color: white;
    border-top-color: white;
}

.infoplan th{

    text-align: center;
    border-bottom-style: groove;
    border-bottom-width: 1px;
    border-bottom-color: #b7b7b7;
    min-width: 250px;
    max-width: 250px;
}

.infoplan td:nth-child(odd){

    text-align: right;
    font-weight: bold;
    width: 75px;
}

.infoplan td:nth-child(even){

    text-align: left;
}

.infoplan tr{

    /*    margin-right: 1px;
        margin-left: 1px;
        margin-bottom: 1px;
        margin-top: 1px;
        padding-right: 1px;
        padding-left: 1px;
        padding-bottom: 1px;
        padding-top: 1px;*/
}

/* Gestionne della autocoimpletamento.js */
div.suggestions {
    -moz-box-sizing: border-box;
    /*box-sizing: border-box;*/
    border: 1px solid black;
    position: absolute;
}
div.suggestions div {
    cursor: default;
    padding: 0px 3px;
    background-color: #eef;
}
div.suggestions div.current {
    background-color: #6580D8;
    color: white;
}


.allarm_message {
    font-size: 16px;
    color:black;
    font-weight: bold;
    background-color: #ff0000;
    opacity: 0.7; /* Safari, Opera */
    -moz-opacity:0.70; /* FireFox */
    filter: alpha(opacity=70); /* IE */
    border: 5px solid #000;
    border-radius: 10px;
    text-align: center;
    vertical-align: middle;
    margin: 1px;
    position: absolute;
    left: 50%;
    top: 50%;
    /* width: 600px;
     height: 400px;*/
    margin-left: -150px;
    margin-top: 100px;
     box-shadow: #FFF5EE 0.25em 0.25em 0.1em;
}

.allarm_message_null {
    font-size: 14px;
    color:black;
    font-weight: bold;
    background-color: #45d840;
    border: 1px solid #ffe900;
    border-radius: 10px;
    text-align: center;
    vertical-align: middle;
    margin: 1px;
}

.sttb {
    background-color: transparent;
    background-image: none;
    border-style: none;
}
.sttr {
    background-color: transparent;
    background-image: none;
    border-style: none;
}
.sttd {
    background-color: transparent;
    background-image: none;
    border-style: none;
}
.stdv {
    background-color: transparent;
    background-image: none;
    border-style: none;
    margin: 0;
    padding: 0;
}
.sta:link, .sta:hover, .sta:active, .sta:visited {
    background-color: transparent;
    background-image: none;
    border-style: none;
    display: block;
    margin: 0;
    padding: 0;
}
.sthd {
    display: none;
}
.stsp {
    background-color: transparent;
    background-image: none;
    border-style: none;
    margin: 0;
    padding: 0;
}

<!--
/* Terence Ordona, portal[AT]imaputz[DOT]com         */
/* http://creativecommons.org/licenses/by-sa/2.0/    */

/* begin some basic styling here                     */


table, td, a {
	
	font: normal normal 12px Verdana, Geneva, Arial, Helvetica, sans-serif
}

h1 {
	font: normal normal 18px Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 0 0 5px 0
}

h2 {
	font: normal normal 16px Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 0 0 5px 0
}

h3 {
	font: normal normal 13px Verdana, Geneva, Arial, Helvetica, sans-serif;
	
	margin: 0 0 15px 0
}
/* end basic styling                                 */

/* define height and width of scrollable area. Add 16px to width for scrollbar          */
div.tableContainer {
	clear: both;
	
	height: 285px;
	overflow: auto;
	width: 756px
}

/* Reset overflow value to hidden for all non-IE browsers. */
html>body div.tableContainer {
	overflow: hidden;
	width: 756px
}

/* define width of table. IE browsers only                 */
div.tableContainer table {
	float: left;
	width: 740px
}

/* define width of table. Add 16px to width for scrollbar.           */
/* All other non-IE browsers.                                        */
html>body div.tableContainer table {
	width: 756px
}

/* set table header to a fixed position. WinIE 6.x only                                       */
/* In WinIE 6.x, any element with a position property set to relative and is a child of       */
/* an element that has an overflow property set, the relative value translates into fixed.    */
/* Ex: parent element DIV with a class of tableContainer has an overflow property set to auto */
thead.fixedHeader tr {
	position: relative
}

/* set THEAD element to have block level attributes. All other non-IE browsers            */
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
html>body thead.fixedHeader tr {
	display: block
}

/* make the TH elements pretty */
thead.fixedHeader th {
	background: rgba(248,248,250,0.5);
	border-left: 1px solid black;
	border-right: 1px solid black;
	font-weight: normal;
	padding: 4px 3px;
	text-align: left
          
}


/* make the A elements pretty. makes for nice clickable headers                */
thead.fixedHeader a, thead.fixedHeader a:link, thead.fixedHeader a:visited {
	color: #FFF;
	display: block;
	text-decoration: none;
	width: 100%
}

/* make the A elements pretty. makes for nice clickable headers                */
/* WARNING: swapping the background on hover may cause problems in WinIE 6.x   */
thead.fixedHeader a:hover {
	color: #FFF;
	display: block;
	text-decoration: underline;
	width: 100%
}

/* define the table content to be scrollable                                              */
/* set TBODY element to have block level attributes. All other non-IE browsers            */
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
/* induced side effect is that child TDs no longer accept width: auto                     */
html>body tbody.scrollContent {
	display: block;
	height: 662px;
	overflow: auto;
	width: 100%
}

/* make TD elements pretty. Provide alternating classes for striping the table */
/* http://www.alistapart.com/articles/zebratables/                             */
tbody.scrollContent td, tbody.scrollContent tr.normalRow td {
	
        background: rgba(150,150,150,0.5);
	border-bottom: none;
	border-left: none;
	border-right: 1px solid black;
	border-top: 1px solid black;
	padding: 2px 3px 3px 4px;
          border-bottom: 2px solid black;
    border-radius: 3px;
}

tbody.scrollContent tr.alternateRow td {
	background: rgba(248,248,250,0.5);
	border-bottom: none;
	border-left: none;
	border-right: 1px solid black;
	border-top: 1px solid black;
	padding: 2px 3px 3px 4px;
          border-bottom: 2px solid black;
    border-radius: 3px;
}

/* define width of TH elements: 1st, 2nd, and 3rd respectively.          */
/* Add 16px to last TH for scrollbar padding. All other non-IE browsers. */
/* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
html>body thead.fixedHeader th {
	width: 200px
}

html>body thead.fixedHeader th + th {
	width: 240px
}

html>body thead.fixedHeader th + th + th {
	width: 316px
}

/* define width of TD elements: 1st, 2nd, and 3rd respectively.          */
/* All other non-IE browsers.                                            */
/* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
html>body tbody.scrollContent td {
	width: 200px
}

html>body tbody.scrollContent td + td {
	width: 240px
}

html>body tbody.scrollContent td + td + td {
	width: 300px
}
-->

/* Upload di file con javascript per la populate */
#drop_zone0 {
    border: 2px dashed #BBBBBB;
    border-radius: 5px 5px 5px 5px;
    color: #BBBBBB;
    padding: 25px;
    text-align: center;
}
#drop_list{
    border-radius: 5px 5px 5px 5px;
    color: #BBBB0B;
    padding: 25px;
    vertical-align: ce middle;
    
}
/* zona mostra foto del vano */
#fotoform {
  
}
#menu_css_verticale{
/*1. specifichiamo una larghezza fissa per il menu*/
/* width: 150px;*/
/*2. rimuoviamo i marcatori della lista*/
list-style:none;
/*3. azzeriamo le margine – richiesto per Internet Explorer*/
margin:0;
/*4. impostiamo un spazio cuscinetto (padding) di 1 px tra i bordi della lista e il suo contenuto*/
padding:1px; 
/*5. aggiungiamo un colore di sfondo al menu*/
background-color: #E5E5E5;
/*6. e un bordo di 1px intorno*/
border:1px solid #437E7E;
}
/*aggiunto per avere lo sfonto con il display inline-block*/
#menu_css_verticale li{
    background-color:#E5E5E5;
}
#menu_css_verticale a{
/*1. convertiamo i link da elementi inline a elemento di blocco, cosi coprono tutta la larghezza disponibile*/
display:block;
/*2. specifichiamo un altezza – richiesto per Internet Explorer 6*/
height:25px;
/*3. aggiungiamo un spazio superiore tra ogni link*/
margin-top:1px;
/*4. e un spazio cuscinetto (padding) a sinistra tra il bordo e il testo dei link*/
/*padding-left:5px;*/
/*5. specifichiamo un colore di sfondo per i link*/
background-color:#E5E5E5;
/*6. e un bordo sinistro di 10px*/
border-left:10px solid white;
/*7. speficiamo il tipo di carattere usato*/
font-family:arial;
/*8. e la misura del carattere*/
font-size:10px;
/*9. convertiamo i caratteri da minuscolo a maiuscolo*/
text-transform:uppercase;
/*10. togliamo la sottolineatura dei link aggiunta per default*/
text-decoration:none;
/*11. specifichiamo un colore per i link*/
color:#437E7E;
/*12. allineiamo verticalmente il testo*/
line-height:25px;
cursor:pointer;
/* leo: fisso la largezza del menu per abbreviare i nomi mettere:<%= pop_form.nome[0..17] %> così metterà solo i primi 17 caratteri*/
  width: 135px;
    
}
#menu_css_verticale a:hover{
/*1. cambiamo il colore di sfondo dei link*/
background-color:#E5E5E5;
/*2. il colore del bordo sinistra*/
border-left:10px solid #777777;
/*e il colore dei link stessi*/

color:#444444;
}
#menu_css_verticale a.active{
/*1. cambiamo il colore di sfondo dei link*/
background-color:#999999;
/*2. il colore del bordo sinistra*/
border-left:10px solid #777777;
/*e il colore dei link stessi*/
color:#444444;
}
table.asset_list {
    border: 1px solid #D6DDE6;
    border-collapse: collapse;
    
}
  
 td.asset_list {
    border:2px solid #ffffff;
    background-color: #333;
    color: #FFFFFF;
    font-weight: bold;
    text-align: left;
    padding: 0.3em;
}

label.obligatory {
    /* when label is necessaire for post*/
    padding: 5px;
    border-radius: 4px;
    color: black;
}


svg text {
    border:2px solid #ffffff;
    background-color: #333;
    color: #FFFFFF;
    font-weight: bold;
    text-align: left;
    padding: 0.3em;
}

.immaginiKeyCad
{
    width:35px;  
    height: 35px;
}

.keycadstyle 
{
        width: 114px;
        list-style: none outside none;
        margin: 0;
        padding: 1px;
        line-height: 25px;
}

.bottoneCad
{
        position: relative;
        height: 35px;
        float:left;
        /* background-color: #E5E5E5; */
        /*border-left: 10px solid white;*/
        color: white;
        display: block;
        font-family: arial;
        font-size: 11px;
/*                        margin-top: 5px;
        margin-left: 5px;*/
        border: 1px solid white;
        text-decoration: none;
        text-transform: uppercase;
        
}

.bottonepremutoCad
{
        height: 35px;
        float:left;
        background-color: orange; 
        /*border-left:10px solid #777777;*/
        color:#444444;
        cursor: pointer;
        display: block;
        font-family: arial;
        font-size: 15px;
/*                        margin-top: 5px;
        margin-left: 5px;*/
        text-decoration: none;
        text-transform: uppercase;
        border: 1px solid orangered;

}
.keycadstyle div 
{
        background-color: #777;

}
.bottoneCad:hover
{
    /*1. cambiamo il colore di sfondo dei link*/
    background-color: orangered; 
    /*2. il colore del bordo sinistra*/
    /* border-left:10px solid #777777;*/
    /*e il colore dei link stessi*/
    border: 1px solid yellow;
    color:#444444;
}  
.pulsanteKeyCad
{
        visibility:visible;
        position:absolute;
        display:Block;
}

.pulsante {
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    font: bold 12px Arial, Helvetica, sans-serif;
    color: #fff;
    padding: 5px 10px;
    border: solid 1px #0076a3;
    background: #064dcd;
}
.pulsanteb {
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    font: bold 12px Arial, Helvetica, sans-serif;
    color: #fff;
    padding: 5px 10px 5px 5px;
}
.pulsantealert {
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    font: bold 12px Arial, Helvetica, sans-serif;
    color: #000000;
    background: #ff0000;
    padding: 5px 10px 5px 5px;
}