@media (max-width: 400px) {
    .loc-col {
        display: none;
    }

    .fc .fc-bg-event .fc-event-title {
        font-size: 50%;
    }

    .fc-event-time {
        font-size: 70% !important;
    }

    .fc-sticky {
        font-size: 75% !important;
    }
}

@media (max-width: 600px) {
    .topic-col {
        display: none;
    }
    .desc-col {
        display: none;
    }
    .schedule-col button {
    }

  .date-picker-dialog,
  .time-picker-dialog {
    width: 100%;
    max-height: 90vh;
  }

  .date-options {
    margin-left: 0;
  }
}

@media (max-width: 1024px) {
    #content {
        width: 100%;
        padding-top: 15px;
    }
    .flex-row {
        display: block;
        width: 100%;
    }
    .flex-row > .btn {
        margin-bottom: 10px;
    }

    .form-row, .form-row-left, .tag-container, .flex-container {
        flex-direction: column;
    }

    .field-group {
        max-width: 225px;
    }

    /* Reduce horizontal padding */
    #header,
    #content,
    #footer {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Stack header items */
    #header .logo,
    #header > ul.menu,
    #header .user {
        float: none;
        display: block;
        margin: 5px 0;
    }

    /* Remove floats */
    .login-form,
    .social {
        float: none;
        width: 100%;
    }

    .left-right
    {
        justify-content: flex-start;
        flex-direction: column;
    }

    #update-all
    {
        margin-bottom: 50px !important;
    }

    .waiver-section
    {
        margin-bottom: 15px;
    }

    .divider {
      margin: 10px 0;
    }

    /* Make form fields vertical */
    label {
        float: none;
        display: block;
        margin-bottom: 4px;
        min-width: unset;
    }

    .date-row label
    {
        float: left;
    }

    input,
    textarea,
    select {
        /*width: 100%;*/
        box-sizing: border-box;
    }

    /* Buttons full-width */
    input[type=submit] {
        width: 100%;
    }

    /* Reduce large text */
    .big-text {
        font-size: 18px;
    }

    h1, .title {
        font-size: 24px;
        margin-top: 0;
        padding-bottom: 5px;
    }

    h2 {
        font-size: 22px;
        margin-top: 0;
        margin-bottom: 0;
        font-weight: bold;
    }

    h3 {
        font-size: 20px;
    }

    .spacey {
        width: 100%;
    }

    .btn {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    [role="switch"]
    {
        margin-bottom: 0 !important;
    }

    h2.announce-title
    {
        font-size: 24px;
    }

    .announce-preference label
    {
        font-size: .9rem;
        margin-bottom: .5rem;
    }

    .announce-body, .announce-header, .announce-footer, .announce-preference, .announce-item
    {
        padding: 0;
    }

    .announce-divider
    {
        margin: .5rem 0;
    }

    .announce-item
    {
        margin: .5rem 0;
    }

    .announce-content p
    {
        margin-bottom: .5rem;
    }

    h2.fc-toolbar-title
    {
        font-size: .9em !important;
    }

    .fc-col-header-cell-cushion, .fc-timegrid-slot-label-cushion, .fc-timegrid-axis-cushion
    {
        font-size: .7em !important;
    }

    .no-small
    {
        display: none !important;
    }

    #app {
        margin-bottom: 10px;
    }

    .dash-cal {
        margin-block-start: 5px !important;
    }

    .legend {
      flex-direction: column;
    }

    .legend-label {
        flex-direction: row;
    }

    ul.messages {
        margin: 10px;
    }

    .collapsible {
      width: 20px;
      height: 21px;
      font-size: 14px;
    }

    .not-simple {
        display: none;
    }
}