@media (max-width: 768px) {

    /* ========================================
       CONTACT PAGE
       ======================================== */

    #Contact {
        padding-left: 0;
        margin-top: 1rem;
    }

    #GeneralInfo #Name {
        font-size: 1rem;
    }

    /* ========================================
       GLOBAL LAYOUT
       ======================================== */

    .content-container {
        padding: 0.75rem;
    }

    footer {
        padding: 0.75rem;
    }

    .prettyuplogo {
        width: 90vw;
    }

    /* ========================================
       SYNC LICENSING CATALOG
       ======================================== */

    .catalogWrapper {
        font-size: 2.0rem;
        padding: 2.5rem 1.0rem;
    }

    .licensingMessage {
        font-size: 1.6rem;
    }

    .top-button-bar {
        flex-direction: column;
        align-items: center;
    }

    .toolbar-btn {
        width: 300px;
    }

    .mood-group-nav {
        width: 100%;
    }

    .bottom-filter-buttons {
        flex-direction: column;
    }

    .selected-track-panel {
        padding: 1.5rem;
    }

    .selected-track-info {
        font-size: 1.6rem;
    }

    .player-controls-row {
        flex-wrap: wrap;
    }

    .time-row {
        flex-wrap: wrap;
    }

    /* ========================================
       POPUPS
       ======================================== */

    .moods-popup .dxpc-mainDiv {
        width: 95vw !important;
        height: 90vh !important;
        left: 2.5vw !important;
        top: 5vh !important;
    }

    .popup-filter-content {
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
    }

    .filter-section {
        flex: 1;
    }

    .filter-section-inner {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        box-sizing: border-box;
    }

    .filter-list-container {
        width: 90%;
        max-width: 900px;
        display: flex;
        flex-direction: column;
        align-items: center;
        box-sizing: border-box;
    }

    .popup-close-container {
        width: 100%;
        margin-top: auto;
        padding-top: 1.5rem;
    }

    .popup-close-button {
        width: 100%;
    }

    /* ========================================
       SURVEYS
       ======================================== */

    .survey-panel {
        padding: 1.5rem;
    }

    .survey-title {
        font-size: 1.4em;
    }

    .survey-label {
        font-size: 1em;
    }

    .submit-button {
        width: 100%;
        font-size: 1em;
    }
}