/* General Version for website (NOT for Word Add-in) */
:root {
    --zIndexBackground2:30000;
    --zIndexPopup2:31000;
}

#let-know-wrap { }

#let-know-alert {       /* outer container of all html elements */
    position:       absolute;left:0;
    top:            10%;
    display:        flex;
    justify-content: center;
    align-content:  start;
    width:100%;height:80%;
}

body.let-know-open {
    position:   relative;
    overflow: hidden;
}

div.let-know-mask {            /* cover the rest of the document in the background */
    position:   fixed; top: 0; left: 0;
    height:     100%;  width: 100%;
    background: #444; opacity:    0.5;
    z-index:    var(--zIndexBackground2);
}

div.let-know-message-body {
    position:   absolute;
    background-color: #fafafc;
    box-shadow: 10px 10px 5px #333;
    border-radius: 10px;
    margin:     0 5px;
    padding:    0;
    min-width:  240px;  max-width:  480px;
    z-index:    var(--zIndexPopup2);
}

div.let-know-message-title {
    background-color:#d1d1d1;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    cursor:move;
    font-weight: 700;
    font-size: 17px;
    text-align:center;
    padding: 8px 10px;
}
div.let-know-message-content {
    padding: 8px 10px;
    font-size: 14px;
    text-align: center;
}
div.let-know-message-buttons {
    border:0px dotted orange;
    position: relative;
    padding: 8px;
    font-size: 16px;
    display:    flex;
    align-items: center;
    justify-content: space-evenly;
}
div.let-know-message-buttons a {
    display: block;
    color: #FFFFFF;
    text-decoration: none;
    border-radius: 8px;
    border-top: 2px solid #eee;
    border-left: 2px solid #ddd;
    border-right: 2px solid #ccc;
    border-bottom: 2px solid #bbb;
    margin: 0;
    padding: 8px 16px;
    text-align:center;
    min-width:110px;
}

a.let-know-message-button-1,          /* button 1 = cancel */
a.let-know-message-button-1:link {
    background-color: #898900;
}
a.let-know-message-button-1:hover {
    color:              #FFFF77;
    background-color:   #A0A000;
}
a.let-know-message-button-0,          /* button 0 = confirm */
a.let-know-message-button-0:link {
    background-color:   #008900;
}
a.let-know-message-button-0:hover {
    color:              #FFFF77;
    background-color:   #00A000;
}


