.cg_popup {
    position: absolute;
    width:100%;
    height:100%;
    background-color: rgba(0, 0, 0, 0.95);
    z-index: 123456;
}

.cg_counter {
    position: absolute;
    width: 60px;
    top: 45px;
    left: 70px;
    color: white;
    padding: 10px;
    z-index: 123457;
    background-color: rgba(128, 128, 128, 0.5);
    text-align: center;
}

.cg_counter .counter_text {}

.cg_counter .counter_reset {}

.cg_popup .grid {
    position: absolute;
    width:80%;
    left:5%;
    height:calc(90% - 150px);
    top:5%;
    display: grid;
    align-content: space-evenly;
    justify-content: space-evenly;
}

.cg_popup .overlaygrid {
    opacity: 0.5;
    pointer-events: none;
}

.cg_popup .title {
    position: absolute;
    left: 40%;
    top: 2%;
    font-size: larger;
}

.cg_popup .tip {
    display: block;
    padding-top: 10px;
    line-height: 20px;
}

.cg_popup .buttons {
    position: absolute;
    width:14%;
    left:86%;
    height:90%;
    top:5%;
    font-size: small;
}

.cg_popup .control_text:after {
    content:"\a";
    white-space: pre;
}

.cg_popup .grid img {
    margin: 2px;
    border: 1px solid white;
    padding: 4px;
    max-width: 100%;
    max-height: 100%;
}

.cg_popup .grid img.selected {
    border: 3px solid green;
    padding: 2px;
}

.cg_popup .buttons button {
    margin-top: 10px;
    padding: 4px;
    display: block;
    width: 100px;
}

.cg_popup .buttons input {
    padding: 4px;
    display: inline;
}

.cg_popup .text_edit {
    width: 100%;
    height: 150px;
}

.cg_popup.hidden {
    display:none
}