@media screen and (max-width: 720px) {
    .chat-context {
        display: none;
        position: absolute;
        z-index: 500;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: auto;

        padding-top: 62px;

        background-repeat: repeat-x;
    }

    .chat-context.opened {
        display: block;
    }

    .chat-context-menuButton {
        display: inline-block;
    }

    .chatsystem-container {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }

    .chat-context .chat-context-roominfo {
        position: static;
        display: block;
        width: 100%;
        color: white;
    }

    .chatsystem-content .chat-context-roominfo, .chatsystem-content .chatmsg-item:hover .chatmsg-hover {
        display: none;
    }

    .maci-wrapper {
        position: fixed;
        z-index: 5000;
        top: 50%;
        left: 0;
        width: 100%;
        transform: translate(0, -50%);
    }

    .login-services {
        display: block;
        width: 100%;
    }
}

body.native .chatsystem-header, body.native .chat-context-menuButton {
    display: none;
}