/** MESSAGE BOX **/

#messageBox {
    position: absolute;
    width: 50%;
    left: 50%;
    top: 15%;
    margin-left: -25%;
    background: #FFF;
    border: 1px solid #333;
    z-index: 100;
    box-shadow: 1px 1px 30px #000;
    display: none;
    border-radius: 0.7em;
}

#menuBar {
    padding-right: 1.5%;
    overflow: hidden;
    height: 6%;
    vertical-align: middle;
    border-top-right-radius: 0.5em;
    border-top-left-radius: 0.5em;
    text-align: left;
}

#close {
    float: right;
    width: 5%;
    margin: 3% 2% 2% 2%;
    cursor: pointer;
}

#messageContent {
    padding: 5%;
    font-size: 1.85%;
    color: #333;
    letter-spacing: 0.08%;
    line-height: 150%;
    text-align: left;
    font-size: 120%;

    position: relative;

    border-bottom-right-radius: 0.5em;
    border-bottom-left-radius: 0.5em;
}

#messageTitle {
    padding: 0px;
    margin: 2.5% 0% 2% 3%;
    letter-spacing: 0.1em;
    font-size: 170%;
}

#darkenLayer {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0%;
    left: 0%;
    background: rgba(0, 0, 0, 0.3);
    z-index: 99;
    display: none;
}

.markImage {
    width: 35%;
    margin-top : -5%;
}

.markText {
    width: 70%;
    font-size: 150%;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: 0.05em;
}