.dimension, .measure{
    border: 3px solid #ffffff;
}

.dragDropListDragStartHighlightDrop{
    border-color:#777!important;
    border-style: dashed!important;
    transition: border-color 0.5s;
}

.dragDropHighlightBorderHidden{
    border-color:  #f9f9f9;
    border-style: dashed;
}
.dragDropHighlightBorderShown{
    border-color: #aaa;
    border-style: dashed;
}


.dragDropHighlightContainer{
    position: relative;
    width: 500px; margin-top: 10px; 
}

.dragDropEmptyText{
    position: absolute;
    text-transform: uppercase;
    color:#aaa;
    font-size: 10pt;
    font-weight: 200;
    margin: auto;
    top: 0; left: -20px; bottom: 0; right: 0;
    width: 100%;
    text-align: center;
    height: 30px;
}

.dragDropEmptyTextReport{
    float: left;
    text-transform: uppercase;
    color: #ddd;
    font-size: 10pt;
    font-weight: 600;
    margin: auto;
    margin-top: 0px;
    text-align: center;
    top: 0;
    left: 0px;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.dragDropListDragStartHighlightDropWhite{
    border: solid #f9f9f9 2px ;
    transition: 0.2s;
}

.reportSelectedDragAndDropListSingle,.reportSelectedDragAndDropList{
    width: 160px;
    list-style-type:none;
    margin:0 0px;
    padding: 0;
    display: inline;
    width: 160px!important;
}

.rectangle-list{
    width: 160px;
    min-height: 30px;
    float: left;


}
.rectangle-list li{
    font-size: 10pt;
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    padding: 1px 1px;
    background: #ddd;
    color: #444;
    text-decoration: none;
    cursor: pointer;

}


.measure li{
    background: #ddd;
    border-radius: 0px;
}
.dimension li{
    background: #ddd;
    padding: .2em .4em .4em .8em;
    border-radius: 0px;
}

.rectangle-list li:hover{
    background: #ccc;
    border-radius:0px;
}

.rectangle-list li:before{
    position: absolute;
    left: -2.5em;
    top: 50%;
    margin-top: -1em;
    background: #ccc;
    height: 2em;
    width: 2em;
    line-height: 2em;
    text-align: center;
    font-weight: bold;
    border-radius: 6px;
}

.rectangle-list-mark li:after{
    position: absolute;
    content: '';
    border: .5em solid transparent;
    left: -1em;
    top: 50%;
    margin-top: -.5em;
    transition: all .3s ease-out;
}

.rectangle-list li:hover:after{
    left: -.5em;
    border-left-color: #3b4b66;
}
.deleteButton{
    float:right;
    color: #dddddd;
    width: 20px;
    margin:0 auto;
    margin-right: -12px;
}
.deleteButton:hover{
    color: #000000;
}

.reportSmallMenu{
    height: 16px;
    width: 16px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/icon_report_16_menu.png');
    background-repeat:no-repeat;
    float: left;
}

.dashboardSmallMenu{
    height: 16px;
    width: 16px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/icon_dashboard_16_menu.png');
    background-repeat:no-repeat;
    float: left;
}

.tableIcon{
    height: 16px;
    width: 16px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/icon_table_32.png');
    background-repeat:no-repeat;
    float: left;
}
.rowIcon{
    height: 16px;
    width: 8px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/icon_row_32.png');
    background-repeat:no-repeat;
    float: left;
}

.dimensionIcon{
    width: 12px;
    height: 12px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/icon_dimension_12_2.png');
    background-repeat:no-repeat;
    float: left;

}
.groupIconOpen{
    width: 14px;
    height: 14px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/iconmonstr-care-down-thin-16.png');
    background-repeat:no-repeat;
    float: left;

}

.groupIconClosed{
    width: 14px;
    height: 14px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/iconmonstr-arrow-81-16.png');
    background-repeat:no-repeat;
    float: left;

}

.measureIcon{
    width: 14px;
    height: 14px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/icon_measure_2_2.png');
    background-repeat:no-repeat;
    float: left;
}
.dateIcon{
    width: 12px;
    height: 12px;
    margin-top: 6px;
    margin-left: 3px;
    margin-right: 3px;
    opacity: 0.8;
    background-image: url('../assets/icon_date_12.png');
    float: left;
    background-repeat:no-repeat;

}
.measureText{
    margin-left: 5px;
    margin-top: 3px;
    font-weight: 400;
    width: 115px;
    word-wrap: break-word; 
}
.editButtonIcon{
    float:right;
    width: 14px;
    height: 14px;
    margin-top: 2px;
    margin:0 auto;
    margin-right: -23px;
    background-image: url('../assets/icone_pen_edit_14_hover.png');
    background-repeat:no-repeat;
    cursor: pointer;
    opacity: 0.6;
    transition: 0.5s;
}
.editButtonIcon:hover{
    background-image: url('../assets/icone_pen_edit_14_hover.png');
    opacity: 1;
}

.applyToAllMeasuresIcon{
    float:right;
    width: 20px;
    height: 20px;
    margin-top: 8px;
    /*//  margin:0 auto;*/
    margin-right: 15px;
    background-image: url('../assets/icon_apply_all_measures_grey.png');
    background-repeat:no-repeat;
    cursor: pointer;
}
.applyToAllMeasuresIcon:hover{
    background-image: url('../assets/icon_apply_all_measures.png');
}


.DNDField {
    background-color: #f0f0f0
}

.selectedDNDField {
    background-color: #4b4b4b
}



.legendContainer{ width: 100%; display: flex; }

.legend{ color: #444444; font-weight: 600; font-size: 10pt; margin-right: 3px; z-index: 10; float: left; flex-shrink:0; word-wrap: break-word }

.legendDash{ color: #444444; font-weight: 600; font-size: 12pt; margin-right: 3px; z-index: 10; float: left; flex-shrink:0; word-wrap: break-word }

.hr{ width: 100%; flex-shrink:1; height: 10px; border-bottom: 0px solid #ddd; float: left; }
.hr_tiny{     width: 100%;
              flex-shrink: 1;
              height: 7px;
              border-bottom: 2px solid #e8e8e8;
              float: left; }