/*
    Bordi grigi: #E1E1E1
    Colore del testo "nero" e dello sfondo scuro: #333333;
    Sfondo grigio chiaro: #FAFAFA
    Sfondo grigio scuro: #F1F1F1
*/

/* Reset */
html, body, form 
{
    margin: 0;
    padding: 0;
    font-family: "Segoe UI",Arial,sans-serif;
    font-size: 1em;
    color: #333333;
    box-sizing:border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}

textarea, input[type="text"], input[type="password"]
{
    font-family: "Segoe UI",Arial,sans-serif;
    font-size: 1em;
    box-sizing: border-box; 
}

input
{
    font-family: "Segoe UI",Arial,sans-serif;
    font-size: 1em;
}

select
{
    font-family: "Segoe UI",Arial,sans-serif;
    font-size: 1em;
}

a {
    text-decoration: none;
    color: #333333;
    font-size: 1em;
}
    a:hover {
        text-decoration: underline;
        color: #333333;
    }

table, tr, td
{
    margin: 0px;
    padding: 0px;
}

h1, h2, h3 {
    margin: 0;
    padding: 0
}


/* 
    Barra principale
    Visualizzata in alto nella master page
*/
.MainBar
{
    display: flex;
    align-items: center;
	background-color: #333333;
	color: #f1f1f1;
    letter-spacing: 1px;
    font-size: 17px;
    width:100%;
   
    /*position:fixed;
    overflow:auto;*/
}

.MainBar ul
{
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.MainBar li {
    float: left;
}

.MainBar li a {
    display: block;
    color: white;
    text-align: center;
    padding: 10px 16px;
    text-decoration: none;
}

.MainBar li a:hover {
    background-color: #111;
}

.MainBarSearchWatermark
{
    background-color: #EEEEEE;
    color: Gray
}

/* 
    Barra del percorso
    Visualizzata sotto alla barra principale della master page
*/
.PathBar
{
    background-color: #5F5F5F;
    color: #F1F1F1;
    font-size: 13px;
}

.PathBar ul
{
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.PathBar li {
    float: left;
}

.PathBar li a {
    display: block;
    color: white;
    text-align: center;
    padding: 4px 16px;
    text-decoration: none;
}

.PathBar li a:hover {
    background-color: #111;
}

/* 
    Barra del titolo di una pagina 
*/
.PageTitleBar
{
    display: flex;
    align-items: center;
	background-color: #FFFFFF;
	border-bottom: 1px solid #5F5F5F;
    padding: 10px 20px 10px 20px;
}

.PageIcon
{
    width: 60px;
    text-align: center;
    margin-right: 20px;
}

.PageTitle
{
    font-size: 1.5em;
    padding-right: 20px;
}

/* 
    Barra dei comandi
    Visualizzata sotto al titolo della pagina 
*/
.CommandBar 
{
    background-color: #fafafa;
    font-size: 13px;
	border-bottom: 1px solid #e1e1e1; /*#4169E1;*/
}

.CommandBar:empty {
    display:none;
    border-bottom: none;
}

.CommandBar ul
{
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.CommandBar li {
    float: left;
}

.CommandBar li a {
    display: block;
    color: #111;
    text-align: center;
    padding: 4px 16px;
    text-decoration: none;
}

.CommandBar li a:hover {
    background-color: #111;
    color: #FFF;
}

.CommandSeparator 
{
    min-width: 40px;
}

/*
    Barra delle proprietà
    Solitamente visualizzata sotto nella Page Title.
*/

.PropertyBar
{
    font-size: 14px;
}

.PropertyBar div
{
    display: inline
}

.PropertyBar > div
{
    padding: 4px 16px 4px 0px;
}

/*
    Barra dei collegamenti
    Visualizzata sotto alla barra dei comandi di una pagina
*/
.LinkBar
{
    font-size: 14px;
	border-bottom: 1px solid #E1E1E1; /*#fafafa;*/
}

.LinkBar > div
{
    padding: 4px 16px;
}

/*
    MessageBar
    Visualizzata sotto al titolo della pagina.
*/
.MessageBar
{
    display: flex;
    align-items: center;
    padding: 10px 16px 10px 16px; 
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

/*
    LeftPanel, CenterPanel, RightPanel
    Suddivisione del corpo della pagina.
*/
.LeftPanel, .CenterPanel, .RightPanel, .TopPanel
{
    padding: 8px;
    overflow: hidden;
}

.LeftPanel
{
    border-right: 1px solid #E1E1E1;
}

.RightPanel
{
    border-left: 1px solid #E1E1E1;
}

.TopPanel
{
    border-bottom: 1px solid #E1E1E1;
}

/*
    Elementi
*/


.BigIcon
{
    width: 48px;
    text-align: center;
    margin-right: 8px;
    vertical-align: middle;
}

.SmallIcon
{
    width: 24px;
    text-align: center;
    margin-right: 4px;
    vertical-align: middle; 
}

.SmallIconItem
{
    display: flex; 
    align-items: center;
    margin: 2px 0px 2px 4px;
}

.SmallText
{
    font-size: 0.75em;
}

.SmallLink
{
}

.SmallLink a
{
    font-size: 0.75em;
}

.SmallLink a:hover
{
    color:  #E47911; 
}

.SmallLink a + a 
{
    margin-left: 2px;
}

.ErrorText 
{
    font-size: 1em;
    color: #FF0000;
}

.HomeMenu
{
}

.HomeMenu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: white; 
}

.HomeMenu li a {
    display: block;
    color: black;
    padding: 8px 16px;
    text-decoration: none;
}

.HomeMenu li a:hover {
    background-color: #333333;
    color: white;
}

.HomePanel
{
    padding: 16px;
}

/*
    Il tasto di anteprima di un documento
*/
.AnteprimaButton
{
    border: 1px solid #E1E1E1;
    vertical-align: middle;
    margin-right: 20px;
}


.ItemBar
{
    display: flex;
    align-items: center;
}

.ItemBarIcon
{
    text-align: center;
    margin-left: 8px;
    margin-right: 16px;
}

/* Barra visualizzata in fondo nella master page, contenente le informazioni dell'azienda */
.BottomBar
{
    display: flex;
    align-items: center;
    justify-content: space-between;
	background-color: #333333;
	font-size:13px;
	color: #F1F1F1;
	padding: 3px;
}

.BottomBar a
{
    text-decoration: none;
    color: #CCCCCC;
}





.SmallTitle
{
    font-size: 14px;
    font-weight: bold;
}



.SmallItemLink
{
}

.SmallItemLink a
{
    color:#333333;
    font-size:0.75em;
}

.SmallWarning
{
    font-size:0.75em;
    color:Red;
}

.SmallItem
{
    font-size:0.75em;
}

.SmallInfo
{
    font-size:0.75em;
    font-style:italic;
    color:Gray;
}

/*
.HomeMenu
{
    margin: 16px;
    font-size: 1em;
    color: #232F3E;
}

.HomeMenu a
{
    text-decoration: none;
    color: #232F3E;
}

.HomeMenu a:hover
{
    color: Orange;
}
*/
/* Definisce un contenitore senza margine con padding verticale */
.Row
{
    margin: 0px;
    padding: 2px 0px 2px 0px;
}

.BigRow
{
    margin: 0px;
    padding: 8px 0px 8px 0px;
}

/* Definisce un contenitore con margine e padding verticale */
.MRow
{
    margin: 2px 0px 2px 0px;
    padding: 2px 0px 2px 0px;
}

/* Definisce un contenitore senza margine con padding verticale, più accentuato in basso */
.TopRow
{
    margin: 0px;
    padding: 2px 0px 8px 0px;
}

/* Definisce un contenitore senza margine con padding verticale, più accentuato in alto */
.BottomRow
{
    margin: 0px;
    padding: 8px 0px 2px 0px;
}

.Col
{
}

/* Definisce un contenitore senza margine con padding sia verticale che orizzontale */
.Cell
{
    margin:0px;
    padding:2px;
}

.TopMargin
{
    margin-top: 6px;
}

.BottomMargin
{
    margin-bottom: 6px;
}

.Margin
{
    margin:6px;
}

.GridHeader
{
    white-space: nowrap;
    width: 100px;
    text-align: right;
    padding-left:10px;
    padding-right: 15px;
    color: #233582;/*#0B5394;*/
}

.Box
{
    border-width: 1px;
    border-style: solid;
    padding: 2px;
}

.RoundBox
{
    border-width: 1px;
    border-style: solid;
    border-radius: 6px;
    padding: 4px 8px 4px 8px;
}

.Error
{
    background-color: #FCF4F4;
    border-color: #B12704;
    color: #B12704;
}

.Warning
{
    background-color: #FFFAE7;
    border-color: #8C6E00;
    color: #C07B00;
}
    
.LightWarning
{
    background-color: #FFFFCC; /* F6DB9A */
    border-color: #DDDAC0;
}

.Ok
{
    background-color: #DFF7DF;
    border-color: #7FC87F;
    color: #008A00;
}

.Info
{
    background-color: #C9DAF8;
	border-color: #1155CC;
}

.Highlight
{
    background-color: #FEBD69;
    border-color: #E47911
}

.White
{
    background-color: #FFFFFF;
    border-color: #CCCCCC;
}

.Important
{
    color: #7c6200;
    border-color: #7c6200;
    background-color: #F2F2F2;
}

.Dark
{
    color: #F1F1F1;
    border-color: #333333;
    background-color: #333333;
}

/* Barra degli strumenti, situata tipicamente sopra le griglie. */
/* Definisce un'area colorata con bordo inferiore con padding orizzontale */
.ToolBar
{
    /*border-bottom: 1px solid #E47911;*/
    display: flex;
    align-items: center;
    font-size: 0.75em;
    white-space: nowrap;
    background-color: #FFFFFF; /*Verde: 7CAE27 #4CAF50" #FEBD69 */
    color: #333333; /* #232F3E; */
    /*border-bottom: 1px solid #E47911; /*Verde: 4A692D*/
    padding-top: 4px;
    padding-left: 4px;
    padding-right: 4px;
    margin-bottom: 4px;
}



.ToolBar input
{
    font-size: 1em;
}

.ToolBar select
{
    font-size: 1em;
}



.CommandLink
{
    /*    
    font-size: 12px;
    color: #E47911; 
    margin-top: 3px;
    margin-bottom: 3px;
    padding: 2px;
    white-space: nowrap;   
    */
    font-size: 1em;
    color: #E47911; 
    white-space: nowrap;   
}

.CommandLink a
{
    color:  #E47911; /* #232F3E; */
}

.CommandLink a + a 
{
    margin-left: 4px;
}

/*
    GridView
*/

.GridView
{   
    font-size: 1em;
    border: 1px Solid #E0E0E0;
}

.GridView table
{
    padding: 0px;
    border-color: #E0E0E0;
}

.GridView td, .GridView tr
{
    padding: 2px 3px 2px 3px;
    border-color: #E0E0E0;
}

.GridViewHeader
{
    background-color: #F0F0F0;
    color: #000;
    border: 1px Solid #E0E0E0;
}

.GridViewHeader td, .GridViewHeader tr
{
}

.GridViewRow
{
    border: 1px Solid #E0E0E0;
}

.GridViewAlternatingRow
{
    background-color: #fafafa;
    border: 1px Solid #E0E0E0;
}

.GridViewRow td, .GridViewAlternatigRow td
{
    border-color: #E0E0E0;
}

.FloatingDialog
{
	background-color: #F2F2F2;
	border: 1px solid #232F3E;
	margin: 0px;
    padding: 8px;
}


.ModalPopupBackground
{
    /*background-color:  #232F3E; /*#666699;
    filter: alpha(opacity=50);
    opacity: 0.7;*/
}

.ModalPopupTitle
{
    padding: 2px;
    background-color: #333333;
    color: White;
}

.ModalPopupBody
{
    padding: 2px;
}

.ModalPopupContent {
    overflow-y: auto;
    max-height: 80vh
}

.MyPopup {
    top: 100px;
    position: absolute;
    width: 40%;
    min-width: 600px;
    /*min-height:300px;*/
    background: #fafafa; /*#F1F1F1;*/
    padding: 4px;
    border: 1px solid #333333;
}


.SectionTitle
{
    border-bottom: 1px solid #1AB2A4;
    color: #1AB2A4; /*#B45F06; #47A1C4*/
    font-weight:bold;
    padding: 16px 4px 2px 4px;
    margin-bottom: 4px;
}


.NameValueDefaultNameStyle
{
    min-width: 100px;
    color: Gray;
}

.NameValueDefaultValueStyle
{
    /*font-weight: bold;*/
}

.Watermark
{
    color: #B0B0B0;
    font-style: italic
}

.SmallBubble
{
    display:inline;
    font-size:0.75em;
    margin:2px;
    white-space:nowrap;
    padding:2px;
    border-radius:4px;
}

.GrigioChiaro
{
    background-color:#EFEFEF;
    color:#575757;
    border-color:#CCCCCC;
}

.GrigioChiaro a { color:#575757; }

.Grigio
{
    background-color:#CCCCCC;
    color:#575757;
    border-color:#AEAEAE;
}

.Grigio a { color:#575757; }

.GrigioScuro
{
    background-color:#666666;
    color:#EFEFEF;
    border-color:#575757;  
}

.GrigioScuro a { color:#EFEFEF; }

.VerdeChiaro
{
    background-color:#B6D7A8;
    color:#306519;
    border-color:#9CB890;
}

.VerdeChiaro a { color:#306519; }

.Verde
{
    background-color:#93C47D;
    color:#306519;
    border-color:#7EA86B;
}

.Verde a { color:#306519; }

.VerdeScuro
{
    background-color:#38761D;
    color:#D9EAD3;
    border-color:#306519;  
}

.VerdeScuro a { color:#D9EAD3; }

.BluChiaro
{
    background-color:#A4C2F4;
    color:#0F49AE;
    border-color:#8CA6D1;
}

.BluChiaro a { color:#0F49AE; }

.Blu
{
    background-color:#6D9EEB;
    color:#0F49AE;
    border-color:#5D87C9;
}

.Blu a { color:#0F49AE; }

.BluScuro
{
    background-color:#1155CC;
    color:#C9DAF8;
    border-color:#0F49AE;  
}

.BluScuro a { color:#C9DAF8; }

.RossoChiaro
{
    background-color:#EA9999;
    color:#830000;
    border-color:#C88383;
}

.RossoChiaro a { color:#830000; }

.Rosso
{
    background-color:#E06666;
    color:#830000;
    border-color:#BF5757;
}

.Rosso a { color:#830000; }

.RossoScuro
{
    background-color:#990000;
    color:#F4CCCC;
    border-color:#830000;  
}

.RossoScuro a { color:#F4CCCC; }

.GialloChiaro
{
    background-color:#FFE599;
    color:#A37B00;
    border-color:#DAC483;
}

.GialloChiaro a { color:#A37B00; }

.Giallo
{
    background-color:#FFD966;
    color:#A37B00;
    border-color:#DABA57;
}

.Giallo a { color:#A37B00; }

.GialloScuro
{
    background-color:#BF9000;
    color:#FFF2CC;
    border-color:#A37B00;  
}

.GialloScuro a { color:#FFF2CC; }

.ViolaChiaro
{
    background-color:#D5A6BD;
    color:#63173D;
    border-color:#B68EA2;
}

.ViolaChiaro a { color:#63173D; }

.Viola
{
    background-color:#C27BA0;
    color:#63173D;
    border-color:#A66989;
}

.Viola a { color:#63173D; }

.ViolaScuro
{
    background-color:#741B47;
    color:#EAD1DC;
    border-color:#63173D;  
}

.ViolaScuro a { color:#EAD1DC; }

.ArancioneChiaro
{
    background-color:#F9CB9C;
    color:#9A5105;
    border-color:#D5AE85;
}

.ArancioneChiaro a { color:#9A5105; }

.Arancione
{
    background-color:#F6B26B;
    color:#9A5105;
    border-color:#D2985B;
}

.Arancione a { color:#9A5105; }

.ArancioneScuro
{
    background-color:#B45F06;
    color:#FCE5CD;
    border-color:#9A5105;  
}

.ArancioneScuro a { color:#FCE5CD; }


/* --------------------------------*/
/* GLI STILI BUONI INIZIANO DA QUI */

.doc {
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 30px;
    width: 100%;
}
    .doc h1 {
        font-size: 2em;
        margin: .67em 0
    }
    .doc h2 {
        font-size: 1.5em;
        margin: .75em 0
    }
    .doc h3 {
        font-size: 1.17em;
        margin: .83em 0
    }
    .doc p {
        margin: 1.12em 0
    }

.page-bar {
    display: flex;
    width: 100%;
    align-items: center;
    background-color: #FFFFFF;
    border-bottom: 1px solid #5F5F5F;
    padding: 10px 20px 10px 20px;
}
    .page-bar img {
        margin-right: 10px;
    }

    .page-bar h1 {
        font-size: 1.8em;
        font-weight: normal;
        margin-right: 20px;
    }

    .page-bar h2 {
        font-size: 1.17em;
        font-weight: normal;
        margin-right: 20px;
    }

.page-bar-fav {
    margin-left: auto;
}

.sticky {
    position: sticky;
    top: 24px
}

.hpadding {
    padding-left: 8px;
    padding-right: 8px;
}

.vpadding {
    padding-top: 8px;
    padding-bottom: 8px;
}

.vpadding-big {
    padding-top: 16px;
    padding-bottom: 16px;
}

.hpadding-small {
    padding-left: 4px;
    padding-right: 4px;
}

.vpadding-small {
    padding-top: 4px;
    padding-bottom: 4px;
}

.box {
    margin: 16px;
    padding: 8px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    overflow: hidden;
}
    .box h1 {
        font-size: 1.17em;
        margin-top: 0;
        margin-bottom: .67em;
        margin-left: 0;
        margin-right: 0;
    }

.info-panel {
    display: flex;
}

.info-col {
    margin-right: 24px;
}

.grid-bar {
    display: flex;
    align-items: center;
    font-size: 0.75em;
    white-space: nowrap;
    background-color: #FFFFFF;
    color: #333333;
}
    .grid-bar input {
        font-size: 1em;
    }

    .grid-bar select {
        font-size: 1em;
    }

.grid-bar-count {
    width: 100%;
    font-weight: bold
}

.grid-bar-tool {
    margin-left: auto;
    padding-left: 8px;
}

/* Definisce un generico comando della barra dei comandi: colore standard e dimensione, float left */
/* Quando si passa sopra al comando, questo viene evidenziato */

.icon-download {
    background: url('/Images/Download24.png') left center no-repeat
}

.icon-upload {
    background: url('/Images/Upload24.png') left center no-repeat
}

.icon-edit {
    background: url('/Images/Edit24.png') left center no-repeat
}

.icon-add {
    background: url('/Images/Add24.png') left center no-repeat
}

.icon-ok {
    background: url('/Images/Ok24.png') left center no-repeat
}

.icon-cancel {
    background: url('/Images/Cancel24.png') left center no-repeat
}

.icon-play {
    background: url('/Images/Play24.png') left center no-repeat
}

.icon-stop {
    background: url('/Images/Stop24.png') left center no-repeat
}

.icon-prev {
    background: url('/Images/Previous24.png') left center no-repeat
}

.icon-next {
    background: url('/Images/Next24.png') left center no-repeat
}

.icon-select {
    background: url('/Images/Select24.png') left center no-repeat
}

.icon-none {
    background: url('/Images/None24.png') left center no-repeat
}

.icon-settings {
    background: url('/Images/Settings24.png') left center no-repeat
}

.icon-history {
    background: url('/Images/History24.png') left center no-repeat
}

.icon-wizard {
    background: url('/Images/Wizard24.png') left center no-repeat
}

.icon-calendar {
    background: url('/Images/Calendar24.png') left center no-repeat
}

.icon-pwd {
    background: url('/Images/Password24.png') left center no-repeat
}

.comandi {
    display: flex;
    align-items: center;
    background-color: white;
    font-size: 15px;
    /*border-bottom: 1px solid #E0E0E0;*/
    border-bottom: 1px solid #5F5F5F;
}

.comando {
    padding: 8px 16px;
    border: none;
    font-size: 15px;
    color: black;
    text-decoration: none;
    font-weight: 500;
    cursor: default;
    white-space: nowrap;
}
    .comando i {
        font-style: normal;
        padding-left: 28px;
    }

    .comando:hover {
        background-color: #ccc;
        color: black;
        text-decoration: none;
        cursor: default;
    }

.comando-right {
    margin-left: auto
}

.comando_ok {
    background-color: #04AA6D;
    color: white;
}
    .comando_ok:hover {
        background-color: #333333;
        color: white;
    }

.comando_danger {
    background-color: #A20025;
    color: white;
}
    .comando_danger:hover {
        background-color: #333333;
        color: white;
    }

.comando_highlight {
    background-color: #2196F3;
    color: white;
}


/* Dropdown Button */
.cmd-dropdown {
    height: auto;
}

/* The container <div> - needed to position the dropdown content */
.dropdown-container {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
/* Applicato a div - contiene link */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #eee;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}
    /* Links inside the dropdown */
    .dropdown-content a {
        color: black;
        padding: 8px 16px;
        text-decoration: none;
        display: block;
        font-size: 14px;
    }
        /* Change color of dropdown links on hover */
        .dropdown-content a:hover {
            background-color: #ddd;
        }

/* Show the dropdown menu on hover */
.dropdown-container:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown
.dropdown-container:hover .cmd-dropdown {
    background-color: #333;
    color: white;
}
    */

.riga_comandi {
    font-size: 0;
}

.riga_comando {
    padding: 2px 4px;
    font-size: 11px;
    border: none;
    background-color: inherit;
}

    .riga_comando:hover {
        background-color: #333;
        color: #fafafa;
        text-decoration: none;
    }

    

.vertical_menu {
}

    .vertical_menu a {
        background-color: #eee;
        color: black;
        display: block;
        padding: 6px 20px 6px 6px;
        text-decoration: none;
        vertical-align: middle;
    }

        .vertical_menu a:hover {
            background-color: #ccc;
        }

        .vertical_menu a.active {
            background-color: #eee;
            color: black;
            font-weight: bold;
            padding: 16px;
        }

    .vertical_menu img {
        padding-right: 10px;
    }

.testata_tabella {
    background-color: #ccc;
    color: black;
    border: 1px Solid #E0E0E0;
}

.riga_tabella {
    background-color: white;
    border: 1px solid #E0E0E0;}

    .riga_tabella:hover {
        background: #ddd;
    }

.riga_tabella_selected {
    background-color: #C2E7FF;
    border: none;
}

.cornice {
    border-width: 1px;
    border-style: solid;
}

.dialog-container {
    z-index: 3;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    top: 0px;
    left: 0px;
    position: fixed;
    display: block;
}

.dialog {
    left:0;
    right:0;
    margin:auto;
    width:fit-content;
    min-width: 300px;
    top: 100px;
    position: absolute;
    background: white; /*#F1F1F1;*/
    border: 1px solid #333333;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dialog_grande {
    width: 50%;
    min-width: 500px;
}

.dialog-title {
    display: flex;
    align-items: center;
    padding: 2px 8px;
    background-color: #2196F3;
    color: White;
    border-bottom: 1px solid #333333;
}
    .dialog-title h1 {
        margin: 0;
        padding: 0;
        font-size: 16px;
    }

.dialog-cmd-close {
    margin-left: auto;
    border: none;
    font-size: 12px;
    background-color: #2196F3;
    color: white;
    text-decoration: none;
}
    .dialog-cmd-close:hover {
        background-color: #333;
        color: #fafafa;
        text-decoration: none;
    }

.dialog_content {
    padding: 6px;
    overflow-y: auto;
    max-height: 80vh;
}


/* COLORI */

.grigio_chiarissimo {
    background-color: #F3F3F3;
    color: #575757;
    border-color: #CCCCCC;
}

    .grigio_chiarissimo a {
        color: #575757;
    }

.grigio_chiaro {
    background-color: #EFEFEF;
    color: #575757;
    border-color: #CCCCCC;
}

    .grigio_chiaro a {
        color: #575757;
    }

.grigio_normale {
    background-color: #CCCCCC;
    color: #575757;
    border-color: #AEAEAE;
}

    .grigio_normale a {
        color: #575757;
    }

.grigio_scuro {
    background-color: #666666;
    color: #EFEFEF;
    border-color: #575757;
}

    .grigio_scuro a {
        color: #EFEFEF;
    }

.verde_chiarissimo {
    background-color: #D9EAD3;
    color: #306519;
    border-color: #9CB890;
}

    .verde_chiarissimo a {
        color: #306519;
    }

.verde_chiaro {
    background-color: #B6D7A8;
    color: #306519;
    border-color: #9CB890;
}

    .verde_chiaro a {
        color: #306519;
    }

.verde_normale {
    background-color: #93C47D;
    color: #306519;
    border-color: #7EA86B;
}

    .verde_normale a {
        color: #306519;
    }

.verde_scuro {
    background-color: #38761D;
    color: #D9EAD3;
    border-color: #306519;
}

    .verde_scuro a {
        color: #D9EAD3;
    }

.blu_chiarissimo {
    background-color: #C9DAF8;
    color: #0F49AE;
    border-color: #8CA6D1;
}

    .blu_chiarissimo a {
        color: #0F49AE;
    }

.blu_chiaro {
    background-color: #A4C2F4;
    color: #0F49AE;
    border-color: #8CA6D1;
}

    .blu_chiaro a {
        color: #0F49AE;
    }

.blu_normale {
    background-color: #6D9EEB;
    color: #0F49AE;
    border-color: #5D87C9;
}

    .blu_normale a {
        color: #0F49AE;
    }

.blu_scuro {
    background-color: #1155CC;
    color: #C9DAF8;
    border-color: #0F49AE;
}

    .blu_scuro a {
        color: #C9DAF8;
    }

.rosso_chiaro {
    background-color: #EA9999;
    color: #830000;
    border-color: #C88383;
}

    .rosso_chiaro a {
        color: #830000;
    }

.rosso_chiarissimo {
    background-color: #F4CCCC;
    color: #830000;
    border-color: #C88383;
}

    .rosso_chiarissimo a {
        color: #830000;
    }

.rosso_normale {
    background-color: #E06666;
    color: #830000;
    border-color: #BF5757;
}

    .rosso_normale a {
        color: #830000;
    }

.rosso_scuro {
    background-color: #990000;
    color: #F4CCCC;
    border-color: #830000;
}

    .rosso_scuro a {
        color: #F4CCCC;
    }

.giallo_chiarissimo {
    background-color: #FFF2CC;
    color: #A37B00;
    border-color: #DAC483;
}

    .giallo_chiarissimo a {
        color: #A37B00;
    }

.giallo_chiaro {
    background-color: #FFE599;
    color: #A37B00;
    border-color: #DAC483;
}

    .giallo_chiaro a {
        color: #A37B00;
    }

.giallo_normale {
    background-color: #FFD966;
    color: #A37B00;
    border-color: #DABA57;
}

    .giallo_normale a {
        color: #A37B00;
    }

.giallo_scuro {
    background-color: #BF9000;
    color: #FFF2CC;
    border-color: #A37B00;
}
    .giallo_scuro a {
        color: #FFF2CC;
    }

.viola_chiarissimo {
    background-color: #EAD1DC;
    color: #63173D;
    border-color: #B68EA2;
}
    .viola_chiarissimo a {
        color: #63173D;
    }

.viola_chiaro {
    background-color: #D5A6BD;
    color: #63173D;
    border-color: #B68EA2;
}
    .viola_chiaro a {
        color: #63173D;
    }

.viola_normale {
    background-color: #C27BA0;
    color: #63173D;
    border-color: #A66989;
}
    .viola_normale a {
        color: #63173D;
    }

.viola_scuro {
    background-color: #741B47;
    color: #EAD1DC;
    border-color: #63173D;
}

    .viola_scuro a {
        color: #EAD1DC;
    }

.arancione_chiarissimo {
    background-color: #FCE5CD;
    color: #9A5105;
    border-color: #D5AE85;
}

    .arancione_chiarissimo a {
        color: #9A5105;
    }

.arancione_chiaro {
    background-color: #F9CB9C;
    color: #9A5105;
    border-color: #D5AE85;
}

    .arancione_chiaro a {
        color: #9A5105;
    }

.arancione_normale {
    background-color: #F6B26B;
    color: #9A5105;
    border-color: #D2985B;
}

    .arancione_normale a {
        color: #9A5105;
    }

.arancione_scuro {
    background-color: #B45F06;
    color: #FCE5CD;
    border-color: #9A5105;
}

    .arancione_scuro a {
        color: #FCE5CD;
    }

/* Definisce un percorso fatto di vari nodi, visualizzato in orizzontale */
/* ogni nodo è un elemento "a" */
.path {
    display:flex;
    align-items: center;
}

.path_item {
    padding-left: 4px;
    padding-right: 4px;
    background-color: inherit;
    color: inherit;
    text-decoration: none;
}
    .path_item:hover {
        background-color: #333;
        color: white;
        text-decoration: none;
    }

.path_root {
    margin-left: 0;
}

.path_separator {
    display: inline-block;
    width: 10px; height: 10px;
    margin-left: 10px;
    margin-right: 10px;
    border: solid gray;
    border-width: 0 1px 1px 0;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

/* Definisce una tabella contenente informazioni */
.info-table {
}
    .info-table thead {
        font-size: 12px;
        font-weight: bold;
    }

    .info-table tbody {
        font-size: 12px;
    }

    .info-table td {
        padding-right: 20px;
    }

/* Definische una tabella utilizzata per l'editing di dati */
.edit-table {
    border-collapse:collapse;
    width: 100%;
}
    .edit-table thead {
        background-color: #ccc;
        color: black;
        border: 1px solid #E0E0E0;
    }

    .edit-table th {
        text-align: left; 
        padding: 4px;
    }

    .edit-table td {
        padding: 4px 8px 4px 4px;
    }

    .edit-table tbody tr {
        background-color: inherit;
    }

        .edit-table tbody tr:hover {
            background-color: #ddd;
        }

.edit-table-container {
    border: 1px solid gray;
    overflow-y: auto;
    max-height: 50vh
}

/* Definisce una tabella matrice, in cui la prima riga e la prima colonna sono tratte in maniera diversa */
.matrix-table {
    border-collapse: collapse;
}

    .matrix-table thead {
        font-weight: bold;
    }

        .matrix-table thead th {
            text-align: left;
            padding: 4px;
        }

    .matrix-table td {
        padding: 4px;
    }

    .matrix-table td:first-child {
        font-weight: bold;
        text-align: right;
    }

/* Definisce un generico controllo che contiene dei campi editabili */
.form {
}
    .form h1 {
        border-bottom: 1px solid #1AB2A4;
        color: #1AB2A4; /*#B45F06; #47A1C4*/
        font-size: 14px;
        font-weight: bold;
        padding: 4px 0px 2px 0px;
        margin-top: 6px;
        margin-bottom: 4px;
    }

.form-row {
    display: flex;
    padding-top: 4px;
    padding-bottom: 4px;
}

    .form-row div + div {
        margin-left: 8px
    }

.item {
    display: inline-flex;
    overflow: hidden;
    align-items: center;
    overflow: hidden;
    white-space: nowrap;
}
/*    .item:hover {
        background-color: #333;
        color: #fafafa;
        text-decoration: none;
    }*/

    .item img {
        margin-right: 4px;
    }

    .item a {
        white-space: nowrap;
        overflow: hidden;
    }
        .Item a:hover {
            text-decoration: underline;
        }

.icon-small {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 0;
}

.icon-big {
    display: inline-block;
    width: 48px;
    height: 48px;
    margin: 0;
    padding: 0;
}

.caption {
    display: block;
    font-size: 0.75em;
    font-weight: bold;
    color: #575757;
}

.help {
    display: block;
    font-size: 0.75em;
    color: #575757;
}