:root {
    --toolbar-button-bg:transparent;
    --toolbar-button-width:22px;
    --toolbar-button-height:22px;
    --toolbar-border-color:#7d817f;
    --toolbar-hover-color:#e9e9e9;
    --toolbar-margin:0 0.15rem;
    --toolbar-fontsize : 0.75rem;
    --modal-bg:rgba(0.5, 0.5, 0.5, 0.3);
    --modal-window-bg:#FFFFFF;
}
p {margin:0;padding:0;word-break:break-all}

.wasm-editor .wasm-content{
    min-height: 300px;
    border: 1px solid #e9e9e9;
    padding: 8px;
}
.wasm-editor .wasm-toolbar .hyperlink{text-decoration: underline;}
.wasm-editor .wasm-toolbar .underline{text-decoration: underline;}
.wasm-editor .wasm-toolbar .italic{font-style: italic;}
.wasm-editor .wasm-toolbar .bold{font-weight: bold;}
.wasm-editor .wasm-toolbar .toolbar-menu:focus, .wasm-editor .wasm-content:focus{
    outline: none;
}
.wasm-editor .wasm-toolbar .toolbar-menu{
    font-size: var(--toolbar-fontsize);
    background-color: var(--toolbar-button-bg);
    height:var(--toolbar-button-height);
    width:var(--toolbar-button-width);
    border :0;
    border-radius: 0.25rem;
    font-weight:bold;
    cursor:pointer;
    margin:var(--toolbar-margin);
    text-align:center;
}
.wasm-editor .wasm-toolbar .toolbar-menu:hover {
    background-color: var(--toolbar-hover-color);
}
.wasm-modal-wrapper {
    background-color: var(--modal-bg);
    position:fixed;
    top:0;
    left:0;
    z-index: 100;
    width:100%;
    height:100%;
    text-align:center;
}
.wasm-modal{
    background-color: var(--modal-window-bg);
    border:1px solid var(--toolbar-border-color);
    min-height:9rem;
    min-width:16rem;
    max-width:16rem;
    margin: 0 auto;
    position: relative;
    z-index:101;
}
.wasm-modal-footer{
    bottom:0;
    left:0;
    position: absolute;
    width:100%;
    height:2.5rem;
}