/* by Creasant */
@media (max-width: 767px) {
    body footer {
        padding: 30px 15px;
        margin-top: 50px;
    }

    body footer ul.menu {
        justify-content: center;
        margin-bottom: 12px;
        font-size: 16px;
    }

    body footer ul.menu .menu-item {
        padding-top: 0;
    }

    body footer .hkust-simple-text p {
        display: block;
        text-align: center;
        font-size: 14px;
        line-height: normal;
    }

    .l75_25 .mtpc-2col-item--1 > .field,
    .l70_30 .mtpc-2col-item--1 > .field,
    .l65_35 .mtpc-2col-item--1 > .field,
    .l60_40 .mtpc-2col-item--1 > .field,
    .l55_45 .mtpc-2col-item--1 > .field,
    .row_reverse.l25_75 .mtpc-2col-item--2 > .field,
    .row_reverse.l30_70 .mtpc-2col-item--2 > .field,
    .row_reverse.l35_65 .mtpc-2col-item--2 > .field,
    .row_reverse.l40_60 .mtpc-2col-item--2 > .field,
    .row_reverse.l45_55 .mtpc-2col-item--2 > .field {
        margin-right: 0;
    }

    .l25_75 .mtpc-2col-item--2 > .field,
    .l30_70 .mtpc-2col-item--2 > .field,
    .l35_65 .mtpc-2col-item--2 > .field,
    .l40_60 .mtpc-2col-item--2 > .field,
    .l45_55 .mtpc-2col-item--2 > .field,
    .row_reverse.l75_25 .mtpc-2col-item--1 > .field,
    .row_reverse.l70_30 .mtpc-2col-item--1 > .field,
    .row_reverse.l65_35 .mtpc-2col-item--1 > .field,
    .row_reverse.l60_40 .mtpc-2col-item--1 > .field,
    .row_reverse.l55_45 .mtpc-2col-item--1 > .field {
        margin-left: 0;
    }

    .view-id-mtpc_albums .view-content {
        padding: 0 15px;
    }

    .view-id-news_events .view-header {
        margin: 0;
    }

    .view-id-news_events.view-news-events .view-content {
        margin-top: 40px;
    }

    .mtpc-news-container .mtpc_news_left > .outline-button {
        margin-top: 20px;
    }

    .image-grid-rounded img {
        border-radius: 10px;
    }

    .image-grid-banner .mtpc-block-image-grid-item-wrapper > .mtpc-image-grid-block-item {
    /*    width: calc(33.33333% - 6px);*/
    /*    margin: 3px;*/
      width: 100%;
      margin: 10px 0;
    }

    .flex-bee.mtpc-2col-section .mtpc-2col-section-wrapper {
        display: flex;
    }

    .flex-bee.mtpc-2col-section .mtpc-2col-section-wrapper > .mtpc-2col-item--1 {
        width: 40px;
    }

    .flex-bee.mtpc-2col-section .mtpc-2col-section-wrapper > .mtpc-2col-item--2 {
        margin-left: 10px;
    }

    .block-theme .field__items {
        flex-direction: column-reverse;
    }

    .block-theme .field__items > .field__item:first-child {
        padding: 20px 20px;
    }

    .block-theme .field__items > .field__item:last-child {
        width: 100%;
    }

    .block-theme .field__items > .field__item:last-child img {
        height: auto;
        aspect-ratio: 3 / 2;
    }

    .calendar-grid .mtpc-block-image-grid-item-wrapper.mtpc-image-grid-layout-small > .mtpc-image-grid-block-item {
        width: calc(50% - 10px);
        margin: 10px 5px;
    }

    .calendar-legend .mtpc-3col-section-wrapper {
        padding-top: 0;
    }

    .calendar-legend.mtpc-3col-section .mtpc-3col-section-wrapper > .mtpc-3col-item--2 {
        margin-bottom: 0;
    }

    .calendar-legend.mtpc-3col-section .mtpc-3col-section-wrapper > .mtpc-3col-item--3 {
        margin-top: 0;
    }

    .bottom-divider .mtpc-1col-section-wrapper,
    .bottom-divider .mtpc-2col-section-wrapper,
    .bottom-divider .mtpc-3col-section-wrapper,
    .bottom-divider .mtpc-4col-section-wrapper {
        padding-bottom: 30px;
    }

    .bottom-divider-content.mtpc-2col-section .mtpc-2col-section-wrapper {
        margin-bottom: 0;
        border-bottom: 1px solid #f2c653;
        padding-bottom: 30px;
    }

    .bottom-divider-content.mtpc-2col-section .mtpc-2col-section-wrapper .mtpc-2col-item--1 > .field {
        border-bottom: none;
        padding-bottom: 0;
    }

    .events-grid .mtpc-block-image-grid-item-wrapper {
        max-width: 400px;
        width: 80%;
    }

    .staff-profile.mtpc-3col-section .mtpc-3col-section-wrapper > .mtpc-3col-item--1 {
        width: 100%;
        display: flex;
        gap: 20px;
        margin-top: 0;
    }

    .staff-profile.mtpc-3col-section .mtpc-3col-section-wrapper > .mtpc-3col-item--1 > .field {
        width: 150px;
    }

    .staff-profile.mtpc-3col-section .mtpc-3col-section-wrapper > .mtpc-3col-item--2 {
        padding-left: 0;
        padding-right: 0;
    }

    .staff-profile.mtpc-3col-section .mtpc-3col-section-wrapper > .mtpc-3col-item--3 {
        width: 100%;
    }

    .staff-profile-details {
        display: none;
    }

    .staff-profile-details-mobile {
        display: block;
        flex: 1;
    }

    .mobile-small-image .mtpc-image .field--name-field-media-image > .field__item img {
        max-width: 180px;
    }
}

@media (max-width: 640px) {
    .tbl-scroll-wrapper {
      overflow-y: scroll;
      max-width: 640px;  
    }
    
}

@media (max-width: 420px) {
    .events-grid .mtpc-block-image-grid-item-wrapper {
        width: 100%;
    }

    .calendar-grid .mtpc-block-image-grid-item-wrapper.mtpc-image-grid-layout-small > .mtpc-image-grid-block-item {
        width: 100%;
        margin: 10px 0;
    }
}
