offline-editor-js/demo/widgets/modal/css/modal-popup.css

.mod-popup-div {
    opacity: 0;
    height: 0;
    width: 0;
    z-index: 98;
    font-size: x-large;
    position: absolute;
    top: 0px;
    left: -1000px;
}
.mod-popup-body {
    position: relative;
    top: 10%;
    left: 10%;
    z-index: 100;
    height: 80%;
    width: 80%;
    border-radius: 10px;
    background-color: black;
    display: table;
    opacity: 0.7;
}
.mod-popup-modal-background {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0.5;
    background-color: black;
    z-index: 99;
    overflow: visible;
}
.mod-popup-input {
    border-bottom: solid #ffffff 1px;
    width: 80%;
    display: table-cell;
    vertical-align: middle;
    padding-left: 12px;
}
.mod-popup-label {
    padding: 12px;
    width: 20%;
    display: table-cell;
    vertical-align: middle;
    background-color: dimgrey;
}
.mod-popup-label-top-left {
    padding: 12px;
    width: 20%;
    display: table-cell;
    vertical-align: middle;
    background-color: dimgray;
    border-top-left-radius: 10px;
}
.mod-popup-table-row {
    color: white;
    border-radius: 10px;
    display: table-row;
}
.mod-popup-stop-input {
    border-radius: 5px;
    font-size: x-large;
    width: 90%;
    height: 75%;
    padding: 5px;
}
.mod-popup-stop-input-disabled {
    color: white;
    border-radius: 5px;
    font-size: x-large;
    background-color: dimgray;
    opacity: 1.0; /* For safari display bug */
    padding: 5px;
    width: 90%;
    height: 75%;
}
.mod-popup-button {
    position: relative;
    float: left;
    color: #ffffff;
    font-size: x-large;
    border-radius: 10px;
    width: 45%;
    padding: 8px;
    background-color: #000000;
    border: solid #ffffff 2px;
}
.mod-popup-button:active {
    position: relative;
    float: left;
    color: #000000;
    font-size: x-large;
    border-radius: 10px;
    width: 45%;
    padding: 8px;
    background-color: lightyellow;
    border: solid #ffffff 2px;
}
.mod-popup-button-cancel {
    position: relative;
    float: left;
    color: lightgray;
    font-size: x-large;
    border-radius: 10px;
    width: 100%;
    padding: 8px;
    background-color: #000000;
    border: solid lightgray 1px;
}
.mod-popup-button-cancel:active {
    position: relative;
    float: left;
    color: #000000;
    font-size: x-large;
    border-radius: 10px;
    width: 100%;
    padding: 8px;
    background-color: lightyellow;
    border: solid lightgray 1px;
}
.mod-popup-button-div {
    padding: 12px;
    display: table-cell;
    vertical-align: middle;
    background-color: #000000;
}
.mod-popup-button-div-bottom-left {
    padding: 12px;
    display: table-cell;
    vertical-align: middle;
    background-color: #000000;
    border-bottom-left-radius: 8px;
}
@media (max-width: 500px) {
    .mod-popup-button {
        font-size: small;
    }
    .mod-popup-button:active{
        font-size: small;
    }
    .mod-popup-button-cancel {
        font-size: small;
    }
    .mod-popup-button-cancel:active {
        font-size: small;
    }
    .mod-popup-stop-input {
        font-size: small;
    }
    .mod-popup-stop-input-disabled {
        font-size: small;
    }
}
@media (max-width: 450px) {
    .mod-popup-button {
        font-size: x-small;
    }
    .mod-popup-button:active{
        font-size: x-small;
    }
    .mod-popup-button-cancel {
        font-size: x-small;
    }
    .mod-popup-button-cancel:active {
        font-size: x-small;
    }
    .mod-popup-stop-input {
        font-size: small;
    }
    .mod-popup-stop-input-disabled {
        font-size: small;
    }
}
@media (max-height: 500px) {

    .mod-popup-button {
        font-size: small;
    }
    .mod-popup-button:active{
        font-size: small;
    }
    .mod-popup-button-cancel {
        font-size: small;
    }
    .mod-popup-button-cancel:active {
        font-size: small;
    }
    .mod-popup-stop-input {
        font-size: small;
    }
    .mod-popup-stop-input-disabled {
        font-size: small;
    }
    .mod-popup-modal-background {

    }
}