.message-modal {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.86);
    opacity: 1;
}

.message-container {
    position: relative;
    width: 90%;
    max-width: 400px;
    margin: 4em auto;
    background: var(--ThirdColor);
    border-radius: .25em .25em .4em .4em;
    text-align: center;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    border-style: groove;
}
.Loading-container {
    
    position: relative;
    width: 90%;
    max-width: 400px;
    margin: 4em auto;
   
  
    text-align: center;
   
}

.message-container:after, .message-container:before
{
    content: "";
    display: table;
    clear: both
}

.message-display-topright {
    position: absolute;
    right: 5px;
    top: 5px;
    padding:0px 3px;
    font-size:25px;
}
.message-container button {
    margin-bottom:10px

}


.message-button:disabled {
    cursor: not-allowed;
    opacity: 0.3
}
.message-container p, b {
    padding: 2px;
    color: var(--SecondaryColor);
    font-weight: bold;
}
.message-container h2 {
    color: var(--SecondaryColor);
    font-weight: bold;
}

.message-container span:hover {
    background-color: #808080;
    color : black;
    font-weight:bold;
}

    @media (max-width:600px) {
        .message-modal-content {
            margin: 0 10px;
            width: auto !important
        }

        .message-modal {
            padding-top: 30px
        }
    }

    @media (max-width:768px) {
        .message-modal-content {
            width: 500px
        }

        .message-modal {
            padding-top: 50px
        }
    }

    @media (min-width:993px) {
        .message-modal-content {
            width: 900px
        }
    }