@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html,
body {
    width: 100%;
    height: 100%;
    padding: 5px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background-color: #1d1d1d;
    display: flex;
    justify-content: center; /* Horizontal center */
    align-items: center;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Standard syntax */
}
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.renderbody {
    display: flex;
    justify-content: center;
    align-items: center;
}

.message-popup {
    width: 280px;
    height: auto;
    background: #2C2C2C;
    background: linear-gradient(0deg, rgba(44, 44, 44, 1) 0%, rgba(58, 58, 58, 1) 50%, rgba(76, 76, 76, 1) 100%);
    padding: 40px 20px;
    text-align: center;
    border-radius: 15px;
    box-shadow: 0px 2px 5px 1px #0e0e0e, inset 0px 1px 0 #7c7c7c, inset 0px -1px 0 #6d392f;
}

    .message-popup h6 {
        color: #cacaca;
        font-size: 20px;
        text-shadow: 0px 2px 3px #282828;
        padding: 12px 0;
    }

    .message-popup span {
        color: #cacaca;
        font-size: 14px;
        line-height: 20px;
    }

        .message-popup span span {
            color: #5c5b5b;
            font-size: 12px;
            display: block;
        }

@media screen and (orientation: landscape) and (max-height: 480px) {
    .message-popup {
        width: 360px;
        padding: 15px 20px;
    }

        .message-popup img {
            height: 50px;
        }
}