html, body {
    touch-action: none;
    overscroll-behavior: none;
}

body {
    overflow: hidden;
    margin: 0px;
    overflow: scroll; /* Scrollbar are always visible */
    overflow: auto;   /* Scrollbar is displayed as it's needed */
}

canvas, svg {
    touch-action: none;
}

* {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.root {
    display: flex;
    flex-direction: column;
}

.box {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: #E0E0E0;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index:100;
    border-top: solid steelblue 1px ;
    border-bottom: solid steelblue 3px ;
}

.drawingLayer_container{
    z-index : 1;
}

.toolbox-item:hover {
    background-color: #B0BEC5;
    border-color: #78909C;
    border-width: 1px;
    cursor: pointer;
}

.fileToolBoxItem{
    margin-left: 7px;
    margin-right: 7px;
}

.clearCanvasToolBoxItem{
    margin-left: 7px;
    margin-right: 7px;
}


.toolbox-item-tools{
    margin-left: 5px;
}

.drawingLayer{
    top : 0px;
    left: 0px;
}

.toolbox-item-selected{
    background-color: #B0BEC5;
    border: black;
    border-bottom-width: 0px;
    border-top-width: 0px;
    border-left-width:0.5px;
    border-right-width:0.5px;
    border-style:solid;
}

.svgText{
    font-weight:bold;
    font-size :small;
}

.box1 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

td 
{
    vertical-align :middle;
    text-align: center;
    height: 40px;
    width: 70px;
}

dialog{
    max-width: 500px;
    max-height: 400px;
    background-color:#EDF0F5;
    border-radius: 6px;border-bottom: 2px; border-style: solid; border-color:#3A5795;
    box-shadow: 3px 3px 2px #3A5795;
}