﻿/*
-------------------------------------------------------------------- 
   Configurazione Area Edit
--------------------------------------------------------------------
*/ 
.divEdit {
    width: 95%;
    align-items: start;
    align-content: start;
    font-size: 16px !important;
    margin-left: 5%;
    margin-right: auto;
    margin-bottom: 0px;
    padding-left: 2px;
    padding-top: 0px;
    padding-bottom: 3px;
    border: 0px none rgb(241, 241, 241);
    z-index: 1;
}
    .divEdit * {
        min-width: unset;
        max-height: unset;
        font-size: 16px !important;
        border: 0px none rgb(241, 241, 241);
        margin: 0px 0px 0px 0px !important;
    }
    .divEdit label {
        min-width: 50%;
        max-height: 40px;
        overflow: hidden;
        z-index: 2;
    }
        .divEdit label:hover {
            background-color: #c4e3ed;
            border-bottom: 1px double #4fabc9;
        }
    .divEdit input[type=text] {
        width: 99%;
        z-index: 3;
    }
        .divEdit input:hover {
            border: 1px solid rgb(168, 168, 168);
        }

    .divEdit select {
        font-size: 14px !important;
        width: 99%;
        z-index: 3;
    }
        .divEdit select:hover {
            border: 1px solid rgb(168, 168, 168);
        }
    .divEdit option {
        font-size: 14px !important;
        width: 100%;
        z-index: 4;
    }
         .divEdit option:hover {
            font-weight: bold;
            background-color: #8ac7db;
        }


/*
-------------------------------------------------------------------- 
    Gestione Griglie
--------------------------------------------------------------------
*/

/*Definizione delle Colonne*/
.Col1 {
    display: grid;
    align-items: start;
    align-content: start;
    grid-column-gap: 1px;
    grid-template-columns: 100%;
}
.Col2 {
    display: grid;
    align-items: start;
    align-content: start;
    grid-column-gap: 1px;
    grid-template-columns: 50% 50%;
}
.Col3 {
    display: grid;
    align-items: start;
    align-content: start;
    grid-column-gap: 1px;
    grid-template-columns: auto 33% 33%;
}
.Col4 {
    display: grid;
    align-items: start;
    align-content: start;
    grid-column-gap: 1px;
    grid-template-columns: 25% 25% 25% 25%;
}
.Col4Reduced {
    display: grid;
    align-items: start;
    align-content: start;
    grid-column-gap: 1px;
    grid-template-columns: 350px 350px 350px 350px;
}
.Col8 {
    display: grid;
    align-items: start;
    align-content: start;
    grid-column-gap: 1px;
    grid-template-columns: auto auto auto 200px auto auto auto 200px;
}
.Col9 {
    display: grid;
    align-items: start;
    align-content: start;
    grid-column-gap: 1px;
    grid-template-columns: auto auto auto auto auto auto auto auto auto;
}
.ColAddress {
    display: grid;
    align-items: start;
    align-content: start;
    grid-column-gap: 1px;
    grid-template-columns: 45% 5% 35% 5% 10%;
}

.halfWidth {
    min-width: 50%;
    max-width: 50%;
}

.thirdWidth {
    min-width: 33%;
    max-width: 33%;
}

/*Definizione Righe*/
.rowDouble {
    grid-row-gap: 2px;
    grid-template-rows: 48px;
}
/*
-------------------------------------------------------------------- 
    Gestione Controlli
--------------------------------------------------------------------
*/    

.hide{
   display:none;
   height:0px;
   min-height:unset;
}

.img30 {
    margin-left: auto;
    margin-top: auto;
    padding-top: 20px;
    height: 30px;
    width: 30px;
}

.flag {
    background-color: transparent;
    color: black;
    border: 1px double rgb(241, 241, 241) !important;
    margin: 0px 0px 0px 0px !important;
}
    .flag td:hover {
        background-color: #c4e3ed;
        border-bottom: 1px double #4fabc9;
    }
    .flag td > label {
        max-height: 20px;
        font-size: 16px !important;
    }

.btnBlue {
    background-color: Blue !important;
    align-content:center;
    align-items: center;
    align-self:center;
    font-size: 14px !important;
    font-weight: bolder;
    color: white !important;
    border: 0px none Blue;
    margin-bottom: 15%;
    transform: translate(5%, 50%);
}
    .btnBlue:hover {
        background-color: #8080ff !important;
        box-shadow: 4px 4px 4px blue;
    }

.btnEqual {
    position: absolute;
    font-size: 16px !important;
    height: 28px;
    width: 28px;
    transform: translate(-52%, -52%);
}
    .btnEqual:hover {
        background-color: rgb(241, 241, 241);
        box-shadow: 4px 4px 4px rgb(168, 168, 168);
    }

.checkValidate {
    display: block;
    position: absolute;
    background-color: transparent;
    color: red;
    font-weight:bold;
    font-size: 16px;
    transform:translate(10%, -20%);
    z-index:5;
}

.menuPopUp {
    background-color: yellow;
    border: 1px solid black;
    width: 100%;
    font-size: 18px;
    height: 32px;
    z-index: 15;
}
    .menuPopUp * {
        z-index: 16;
        font-size: 18px;
    }
    .menuPopUp li {
        font-size: 18px;
    }
    @media screen and (max-width: 1300px) {
        .rowDouble {
            grid-template-rows: 38px;
        }
        .divEdit label {
            max-height: 30px;
            font-size: 13px !important;
        }
        .divEdit * {
            font-size: 13px !important;
        }

        .divEdit select {
            font-size: 12px !important;
        }

        .divEdit option {
            font-size: 12px !important;
        }
        .btnBlue {
            font-size: 11px !important;
        }
        .btnEqual {
            height: 28px;
            width: 28px;
            font-size: 11px !important;
        }
        .flag td > label {
            max-height: 15px;
            font-size: 13px !important;
        }
        .checkValidate {
            font-size: 13px;
        }
        .menuPopUp {
            height: 28px;
        }
            .menuPopUp * {
                font-size: 10px;
            }
            .menuPopUp li {
                font-size: 12px;
            }

    } 

    @media screen and (max-width: 992px) {
        .rowDouble {
            grid-template-rows: 35px;
        }
         .ColAddress {
            grid-template-columns: 40% 7% 35% 7% 11%;
        }
        .divEdit {
            width: 93%;
            margin-bottom: 2px;
            padding-left: 1px;
            padding-top: 0px;
            padding-bottom: 0px;
        }
            .divEdit label {
                max-height: 28px;
                font-size: 11px !important;
            }

            .divEdit * {
                font-size: 11px !important;
            }

            .divEdit select {
                font-size: 10px !important;
            }

            .divEdit option {
                font-size: 10px !important;
            }
        .img30 {
            padding-top:9px;
            height: 15px;
            width: 15px;
        }
        .btnEqual {
            font-size: 10px!important;
            height: 22px;
            width: 22px;
        }
        .btnBlue {
            /*height: 22px;*/
            font-size: 10px!important;
        }

        .flag td > label {
            max-height: 14px;
            font-size: 11px;
        }
        .checkValidate {
            font-size: 11px;
        }
        .menuPopUp {
            height: 30px;
        }
            .menuPopUp * {
                font-size: 10px;
            }

            .menuPopUp li {
                font-size: 12px;
            }
    }

    @media screen and (max-width: 768px) {
        .rowDouble {
            grid-row-gap: 1px;
            grid-template-rows: 26px;
        }
        .Col2 {
            display: block;
            grid-template-columns: none;
            padding-left: 5%;
            padding-right: 5%;
        }
        .Col3 {
            display: block;
            grid-template-columns: none;
            padding-left: 5%;
            padding-right: 5%;
        }

        .Col4 {
            display: block;
            grid-template-columns: none;
            padding-left: 5%;
            padding-right: 5%;
        }
        .Col4Reduced {
            display: block;
            grid-template-columns: none;
            padding-left: 5%;
            padding-right: 5%;
        }
        .ColAddress {
            display: block;
            grid-template-columns: none;
            padding-left: 5%;
            padding-right: 5%;
        }
        .Col8 {
            display: block;
            grid-template-columns: none;
            padding-left: 5%;
            padding-right: 5%;
        }
        .Col9 {
            display: block;
            grid-template-columns: none;
            padding-left: 5%;
            padding-right: 5%;
        }
        .divEdit {
            font-size: 10px !important;
            margin-bottom: 1px;
            padding-left: 0px;
            padding-top: 0px;
            padding-bottom: 0px;
        }

            .divEdit label {
                min-width:98%;
                max-height: 24px;
                font-size: 10px !important;
            }
                .divEdit label:hover {
                    max-height: 27px;
                }
            .divEdit * {
                font-size: 10px !important;
            }

            .divEdit select {
                font-size: 10px !important;
            }

            .divEdit option {
                font-size: 9px !important;
            }

        .img30 {
            padding-top: 9px;
            height: 18px;
            width: 18px;
        }

        .btnEqual {
            font-size: 9px !important;
            height: 33px;
            width: 33px;
        }
            .btnEqual:hover {
                box-shadow: 2px 2px 2px rgb(168, 168, 168);
            }

        .btnBlue {
            font-size: 9px !important;
            margin-bottom: 1px;
            transform: translate(0px, 0px);
        }
            .btnBlue:hover {
                box-shadow: 2px 2px 2px blue;
            }
        .flag td > label {
            max-height: 12px;
            font-size: 10px;
        }
        .checkValidate {
            font-size: 10px;
        }
        .menuPopUp {
            height: 40px;
        }

            .menuPopUp * {
                font-size: 8px;
            }

            .menuPopUp li {
                font-size: 10px;
            }
    }