/* Global color variables */
:root {
    /* palette blue */
    /* 
    --color0: #222A4D;
    --color1: #37416B;
    --color2: #6E789E;
    --color3: #939BBC;
    --color4: #D2D9F4;
    */
    /* palette red A */
    /*  
    --color0: #992525;
    --color1: #CD3131;
    --color2: #DB8F8F;
    --color4: #E8BEBE;
    --color3: #F4E2E2;
    */
    /* palette red */
    /* 
    --color0: #660000;
    --color1: #880000;
    --color2: #AA3939;
    --color4: #CC8787;
    --color3: #F4D2D9;
     */
    /* palette ts */
    /* 
    --color0: #301B1B;
    --color1: #503B3B;
    --color2: #7D6767;
    --color3: #BDA7A7;
    --color4: #C9BCBC;
     */
    /* palette red 2 */
    /* 
    --color0: #3D121A;
    --color1: #6B3741;
    --color2: #9E5E78;
    --color3: #F4D2D9;
    --color4: #BC939B;

     */
    /* palette green */
    /* 
    --color0: #1A3D12;
    --color1: #416B37;
    --color2: #789E5E;
    --color3: #D9F4D2;
    --color4: #9BBC93;
    */
    /* palette red2 */
    /* */ 
    --color0: #440000;
    --color1: #660000;
    --color2: #992929;
    --color4: #AA6767;
    --color3: #D4B2B9;
    /* */
    
    /* contra e fixed */
    --colorW:    #FFFFFF;
    --colorB:    #000000;
    --colorEY:   #FFFF00;
    --colorSY:   #DCCA00;
    --colorSG:   #479B07;
    --colorSR:   #EE0033;
    --colorSO:   #FF6900;
    --colorSW:   #AAAAAA;
    --colorEVEN: #F9F9F9;
    --colorODD:  #DFDFDF;
    --colorNO:   #888;
}

body {
    margin: 0px;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    color: var(--colorB);
    margin-left: 200px;
    background: var(--colorW);
}

form { display:inline;}

table {
    border-collapse: collapse;
}

a {
    cursor:pointer;
    width: 65px;
    border-radius: 6px;
    background: var(--colorW);
    font-family: 'Roboto Condensed', sans-serif;
    background-color: var(--color1);
    color: var(--colorW);
    border: 1px solid var(--color1);
    display: inline-block;
    white-space: nowrap;
    padding: 0 1.5em;
    margin: 0.1em;
    font: bold 1em/1.5em 'Roboto condensed';
    text-decoration: none;    
}

a:hover {
    background: var(--color0);
    color: var(--color1);
    background-color: var(--colorW);
    border: 1px solid var(--color1);    
}

a.nuovo {
    background-color: var(--color1);
    color: var(--colorW);
    border: 1px solid var(--color1);
    width: 65px;
}
a.nuovo:hover {
    color: var(--color1);
    background-color: var(--colorW);
    border: 1px solid var(--colorSG);
}
a.modifica {
    background-color: var(--color1);
    color: var(--colorW);
    border: 1px solid var(--color1);
    width: 65px;
}
a.modifica:hover {
    color: var(--color1);
    background-color: var(--colorW);
    border: 1px solid var(--colorSG);
}
a.duplica {
    background-color: var(--color1);
    color: var(--colorW);
    border: 1px solid var(--color1);
    width: 65px;
}
a.duplica:hover {
    color: var(--color1);
    background-color: var(--colorW);
    border: 1px solid var(--colorSG);
}
a.invia {
    background-color: var(--colorSG);
    color: var(--colorW);
    border: 1px solid var(--colorSG);
    width: 40px;
}
a.invia:hover {
    color: var(--colorSG);
    background-color: var(--colorW);
    border: 1px solid var(--colorSG);
}

a.elimina {
    background-color: var(--colorSO);
    color: var(--colorW);
    border: 1px solid var(--colorSO);
    width: 55px;
}
a.elimina:hover {
    color: var(--colorSO);
    background-color: var(--colorW);
    border: 1px solid var(--colorSO);
}

a:before {
    font-family: 'Roboto Condensed', sans-serif;
    background: #ccc;
    background: rgba(0,0,0,.1);
    float: left;         
    width: 1em; 
    text-align: center;
    font-size: 1.5em;
    margin-left: -0.4em;
    margin-right: 0.4em;
    margin: 0 0.4em 0 -1em; 
    padding: 0 .2em;
    box-shadow: 1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,.5);
    border-radius: .15em 0 0 .15em;
    pointer-events: none;        
}

.nuovo:before {
    font-family: 'Roboto', sans-serif;
    content: "\271A";
}

.modifica:before {
    content: "\270E";        
}

.elimina:before {
    content: "\2718";        
}

.invia:before {
    content: "\2714";        
}
.duplica:before {
    content: "\2737";
}

.menucontainer {
    position: absolute;
    top:0px;
    left:0px;
    width: 180px;
    bottom: 0px;
    background-color: var(--color0);
    text-align: center;
    bottom-border: 1px solid white;
}

.menucontainer img {
    padding: 10px;
}

.menucontainer div {
    font-variant: small-caps;
    color: var(--colorW);
    padding: 10px;
}

th div button {
    height: 25px;
    vertical-align: text-bottom;
    cursor:pointer;
    margin: 0 auto;
    margin-left: 1em;
    padding-right: 10px;
    padding-left: 10px;
    border: 1px solid var(--colorB);
    border-radius: 6px;
    background: var(--colorW);
    color: var(--colorB);
    font-family: 'Roboto Condensed', sans-serif;
    font-size: large;
}

th div button:hover {
    background: var(--color0);
    border: 1px solid var(--color4);
    color: var(--color4);
}

.menu {
    display: block;
    width: 160px;
    border: 1px solid var(--color3);
    padding: 5px;
    margin: 10px;
    box-sizing: border-box;
    text-decoration: none;
    color: var(--color3);
    text-align: left;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    background-color: var(--color0);
    border: 1px solid var(--color0);
    color: var(--color3);
}

.menu.selected {
    color: var(--colorW);
    border-left: 5px solid var(--colorW);
}

.menucontainer button:hover {
    color: var(--colorW);
    border-left: 1px solid var(--colorW);
}

button.menu.selected:hover {
    color: var(--colorW);
    border-left: 5px solid var(--color4);
}
/* HACK DA STACK OVERFLOW */
select.paginator {
    height: 25px;
    width: 140px;
    vertical-align: text-bottom;
    border: 1px solid var(--color0);
    font-size: 14px;
    padding: 0px; /* If you add too much padding here, the options won't show in IE */
    font-family: 'Roboto', sans-serif;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: var(--colorW);
    color: var(--colorB);
    /* -webkit-appearance: none; */
    -moz-appearance: none;
    appearance: none;
    background: url(../img/opts.png) 96% / 8% no-repeat var(--colorW);
}

select.paginator.pop {
    width: auto;
}

/* CAUTION: IE hackery ahead */
select.paginator::-ms-expand {
    display: none; /* remove default arrow in IE 10 and 11 */
}

/* target Internet Explorer 9 to undo the custom arrow */
@media screen and (min-width:0\0) {
    select.paginator {
        background:none\9;
        padding: 0px\9;
    }
}
/* FINE HACK STACK OVERFLOW */

/* questo duplica quello presente in logs.css */

.pallino {
    width: 2em;
    height: 2em;
    border-radius: 2em;
    display: inline-block;
    line-height: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    text-align: center;
    font-size: 0.5em;
}

.ATTIVO_0 {background-color: var(--colorSR);}
.ATTIVO_1 {background-color: var(--colorSG);}

.STATUS_0 {
    background-color: var(--colorSW);
    color: var(--colorSW);
    width: 2em;
    height: 2em;
    border-radius: 2em;
    display: inline-block;
    line-height: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    text-align: center;
    font-size: 0.5em;
}

.STATUS_1 {
    background-color: var(--colorSY);
    color: var(--colorSY);
    width: 2em;
    height: 2em;
    border-radius: 2em;
    display: inline-block;
    line-height: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    text-align: center;
    font-size: 0.5em;
}

.STATUS_2 {
    background-color: var(--colorSG);
    color: var(--colorSG);
    width: 2em;
    height: 2em;
    border-radius: 2em;
    display: inline-block;
    line-height: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    text-align: center;
    font-size: 0.5em;
}

.STATUS_-1 {
    background-color: var(--colorSR);
    color: var(--colorSR);
    width: 2em;
    height: 2em;
    border-radius: 2em;
    display: inline-block;
    line-height: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
    text-align: center;
    font-size: 0.5em;
}

/*tr.footer {
	background-color: white !important;
}*/

.legenda {
	margin-left: 20px;
}