.menu .icon {padding:4px; align-items:center; display:grid;}
.menu .icon img {width:30px; height:30px;}

.main .menu .sub-menu {
    
    display:none;
    position:absolute;
    
    margin-top:2px;
    min-width:10%;
    z-index:90;
    padding:8px;
    font-weight:lighter;
    text-align:left;
    align-items:left; 
    background-color: rgba(255,255,255,0.8);
    
}
.main .menu .item {
    font-weight:bold;
    cursor:pointer;
    padding:4px;
    text-align: left;
}

.main .menu .item:hover .sub-menu{
    
    display:block;
    height:auto;    
}

.main .menu {
    padding:8px;
    grid-row:2;
    width:100%;
    display:none;
    
    /* grid-row:2; grid-column:1 ; */
    grid-template-columns: 92px repeat(7,auto);
    gap:4px;
    text-transform: capitalize;
    border:0;  height:48px; padding:0px;
    display:grid; grid-template:64px repeat(6,1fr); gap:4px; 
    /* background-color: #f3f3f3; */
    align-items: center;
}
.main .menu .icon .button {
    border:1px solid #CAD5E0; border-radius:8px; padding:2px;
    ;
}
/**
* TAB SPECIFICATIONS WITH RADIO BUTTONS AND LABELS
*/
.tab-content table { width:99%; border-radius: 8px; padding:8px; border:1px solid #d3d3d3;}
.tab-content table tr:nth-child(even) {background-color: #f3f3f3;}
/* .tab-content {width:80%;} */

.tabs {display:grid; grid-template-columns: repeat(auto-fit,209px); gap:0px; align-content:center; 
    /* background-color: #f3f3f3; */
    padding-top:4px;
    padding-left:4px;
    padding-right:4px;
}
.tabs input[type=radio] {display:none; }
.tabs input[type=radio] + label { font-weight:lighter;  
    border:1px solid transparent;
    border-bottom-color: #CAD5E0;
    background-color: #f3f3f3;
    padding:8px;
    padding-right:10px; padding-left:10px;
    
    cursor:pointer
}
.tabs input[type=radio]:checked +label {
    background-color: #ffffff;
    border-top-right-radius: 8px; 
    border-top-left-radius: 8px;
    font-weight:bold;
    border-color: #CAD5E0;
    border-bottom-color: #FFFFFF;
}