html, body {
    font-family: arial;
}

@font-face {
    font-family: 'pic';
    src: url('/Styles/Fonts/Pic.otf') format("opentype");
    /*src: url('/Styles/Fonts/PicCOLR.eot');*/
    font-weight: normal;
    font-style: normal;
}

table {
    border-collapse: collapse;
}

#pict_matrix table tr td {
    border: 1px solid #000;
    padding: 3px;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    background-color: white;
    font-size: 200%;
}

    #pict_matrix table tr td div {
        font-family: 'pic';
    }

#pict_dialog {
    padding: 10px;
    font-size: 16px;
    background-color: lightgray;
}

.pict_dialogText {
    padding-bottom: 5px;
}

.pict_overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .5s ease;
    /*background-color: #008CBA;*/
    font-family: 'pic';
}
.pict_tooltipText {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}