/* by Creasant */
/* general start */
@media only screen and (max-width: 767px) {
  .space-mobile-top-80{padding-top: 80px;}
  .space-mobile-top-70{padding-top: 70px;}
  .space-mobile-top-60{padding-top: 60px;}
  .space-mobile-top-50{padding-top: 50px;}
  .space-mobile-top-40{padding-top: 40px;}
  .space-mobile-top-30{padding-top: 30px;}
  .space-mobile-top-20{padding-top: 20px;}
  .space-mobile-top-10{padding-top: 10px;}
  .space-mobile-top-0{padding-top: 0px;}
  .space-mobile-bottom-80{padding-bottom: 80px;}
  .space-mobile-bottom-70{padding-bottom: 70px;}
  .space-mobile-bottom-60{padding-bottom: 60px;}
  .space-mobile-bottom-50{padding-bottom: 50px;}
  .space-mobile-bottom-40{padding-bottom: 40px;}
  .space-mobile-bottom-30{padding-bottom: 30px;}
  .space-mobile-bottom-20{padding-bottom: 20px;}
  .space-mobile-bottom-10{padding-bottom: 10px;}
  .space-mobile-bottom-0{padding-bottom: 0px;}
  
  .mtpc-2col-section.l90_10 .mtpc-2col-section-wrapper>.mtpc-2col-item--1,
  .mtpc-2col-section.l90_10 .mtpc-2col-section-wrapper>.mtpc-2col-item--2,
  .mtpc-2col-section.l10_90 .mtpc-2col-section-wrapper>.mtpc-2col-item--1,
  .mtpc-2col-section.l10_90 .mtpc-2col-section-wrapper>.mtpc-2col-item--2,
  .mtpc-2col-section.l85_15 .mtpc-2col-section-wrapper>.mtpc-2col-item--1,
  .mtpc-2col-section.l85_15 .mtpc-2col-section-wrapper>.mtpc-2col-item--2,
  .mtpc-2col-section.l15_85 .mtpc-2col-section-wrapper>.mtpc-2col-item--1,
  .mtpc-2col-section.l15_85 .mtpc-2col-section-wrapper>.mtpc-2col-item--2,
  .mtpc-2col-section.l80_20 .mtpc-2col-section-wrapper>.mtpc-2col-item--1,
  .mtpc-2col-section.l80_20 .mtpc-2col-section-wrapper>.mtpc-2col-item--2,
  .mtpc-2col-section.l20_80 .mtpc-2col-section-wrapper>.mtpc-2col-item--1,
  .mtpc-2col-section.l20_80 .mtpc-2col-section-wrapper>.mtpc-2col-item--2 {
    width: 100%;
  }
  
  .mtpc-2col-section.col-2-gap-0 .mtpc-2col-section-wrapper>.mtpc-2col-item{margin-bottom: 0;}
  
  .program-overview .max-width-330 {
    max-width: 220px;
  }
  
  .program-overview.hkust .max-width-330 {
    max-width: 200px;
  }
  
  .text-area-background-blue, .text-area-background-brown{
    position: unset;
    min-height: 100px;
    padding: 20px;
  }
}
/* general end */

@media only screen and (max-width: 767px){
  .paragraph-id-9858 .mtpc_pagetitle_wrapper {
    min-height: 100px !important;
  }
  
  h2,.event-listing-head h1,.view-header .mtpc_pagetitle.mtpc_news h1,.path-photos-videos .pagetitle h1,.mtpc_pagetitle.mtpc_gallery h1{font-size: 34px;}
  h3{ /* thumbnail title  */ 
    font-size: 30px;
  }
  h4{font-size: 27px;}
  h5{font-size: 25px;}
  h6{font-size: 22px;margin-bottom: 12px;}
  
  p.small-text{
    margin-bottom: 10px;
  }
  
  p{
    margin-bottom: 13px;
  }
  
  li, p{
    font-size: 18px;
  }
  
  ul, ol{
    margin-left: 0px;
  }
  
  p.profile-description{
    font-size: 16px;
  }
  
  p:has(> a.arrow-button){
    margin-bottom: 10px;
  }
  
  a.arrow-button{
    font-size: 18px;
    margin-bottom: 10px;
  }
  
  blockquote.bold-blockquote{
    border-left: 8px solid;
    padding-left: 10px;
  }
  
  table.tbl-noborder td{
    font-size: 16px;
  }
  
  table.accordian-table thead th, table.accordian-table thead td{
    padding: 10px 20px;
  }
  
  table.accordian-table tbody td{
    padding: 15px 20px;
  }
    
  table.tbl-bg thead tr td,
  table.tbl-bg thead tr th{
    padding: 10px 20px;
    font-size: 20px;
  }
  
  table.tbl-bg tbody tr td {
    padding: 15px 20px 30px;
  }

  .background-gradient-white:before {
    background: linear-gradient(90deg, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 0.65) 50%, rgba(255, 255, 255, 0.50) 75%);
  }
  
  header .wrapper .mobile_menu_wrapper .logo_three{
    /*flex-direction: column;*/
    margin: 0 30px;
    margin-top: 20px;
    width: -webkit-calc(100% - 60px);
    width: -moz-calc(100% - 60px);
    width: calc(100% - 60px);
  }
  
  header .wrapper .mobile_menu_wrapper .logo_three a {
    width: 50%;
  }
  
  header .wrapper .mobile_menu_wrapper .logo_three a:last-child img {
   max-width: unset; 
  }
  
  header .mtpc_header .header .wrapper .logos .logos_left .logo_one img {
    height: 45px;
  }
  
  .mtpc-block-slideshow-block .slick-arrow{
    width: 16px;
    height: 40px;
    background-size: cover;
  }
  
  .mtpc-block-slideshow-block .slick-dots.circle li{
    margin: 0 10px;
    width: 8px;
    height: 8px;
  }
  
  .mtpc-block-slideshow-block .slick-dots{
    bottom: 0.8em;
  }
  
  .mtpc-2col-item--1 .messages-from-logo{
    max-width: 250px;
  }
   
   .mtpc-2col-item--1 .messages-from-logo img {
     width: 100%;
   }
  
  .messages-from-description{
    padding: 20px 20px 40px;
  }
  
  .mtpc-1col-item .mtpc-pageTitle-block h1 {
    font-size: 40px;
    margin-bottom: 40px;
  }
  
  body.page-background-position.toolbar-tray-open,
  body.page-background-position {
    background-position: 10px 100px;
    background-size: contain;
  }
  
  .curriculum-requirements-course .field__items{
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
  
  div.circle-course .field__item{
    width: 100px;
  }
  
  div.circle-course .field__item p{
    margin-top: 3px;
    margin-bottom: 10px;
  }
  
  span.course-name{
    font-size: 18px;
  }
  
  span.course-credits{
    font-size: 16px;
  }
  
  .mtpc-block-accordian-block-title{
    padding: 15px;
  }
  
  .mtpc-block-accordian-block-title>.field__item .accordion-question{
    font-size: 22px;
  }
  
  span.additional-title-name{
    font-size: 18px;
  }
  
  span.additional-title-code,
  span.additional-title-credit{
    font-size: 16px;
  }
  
  .accordion-question .custom-text-wrapper .additional-title-name{
    margin-left: 10px;
  }
  
  .mtpc-block-accordian-block-description .field__item > *{
    margin-left: 15px;
    margin-right: 15px;
  }
  
  .mtpc-block-accordian-block-description .field__item > :first-child{
    padding-top: 20px;
  }
  
  .mtpc-block-accordian-block-description .field__item > :last-child{
    padding-bottom: 30px;
  }
  
  .overlay-section-text .field__item{
    left: 20px;
  }
  
  .overlay-section-text p{
    font-size: 26px;
  }
  
  .field__item:has( >.two-people-body){
    margin-top: 20px;
  }
  
  .section-border-bottom-line.mtpc-2col-section .mtpc-2col-section-wrapper{
    padding-bottom: 10px;
  }
  
  .mtpc-2col-section .mtpc-2col-section-wrapper>.mtpc-2col-item.mtpc-2col-item--1{
    margin-bottom: 40px;
  }
  
  .section-white-background.mtpc-1col-section .mtpc-1col-section-wrapper,
  .section-white-background.mtpc-2col-section .mtpc-2col-section-wrapper{
    padding: 40px 15px 20px;
    max-width: calc(1280px - 30px);
  }
  
  .section-housing-grid.mtpc-1col-section .mtpc-1col-item > .field{
    display: flex;
    flex-direction: column;
  }
  
  .section-housing-grid-area-text .field__item a{
    position: unset;
    min-height: 200px;
  }
  
  .mtpc_pagetitle.mtpc_news.news_listing,
  .mtpc_pagetitle.mtpc_news{
    padding-top: 50px;
  }
  
  .custom-button-wrapper{
    padding-top: 50px;
    padding-bottom: 80px;
  }
  
  .view-id-news_events .view-content .views-row .row_container .mtpc_news_title h3{
    font-size: 20px;
  }
  
  .event-listing-page,
  .node__content.mtpc-event-detail{
    padding-top: 50px;
    padding-bottom: 80px;
  }
  
  .mtpc_pagetitle.mtpc_gallery{
    padding-top: 50px;
  }
  
  .view-id-mtpc_albums .view-content{
    padding: 0 15px;
  }
  
  .download-area-2col .mtpc-2col-section-wrapper .mtpc-2col-item--1 {
    margin-bottom: 0 !important;
  }
  
  .download-area-2col .mtpc-2col-section-wrapper .mtpc-2col-item--2 > div {
    padding: 30px 25px;
  }
}

@media only screen and (max-width: 500px){
  blockquote.icon-blockquote{
    margin-left: 15px;
    padding-left: 15px;
  }
  
  blockquote.icon-blockquote::before{
    left: -24px;
    background-size: contain;
    width: 24px;
    height: 19px;
    padding-bottom: 20px;
  }
  
  #block-mtpc-mainnavigation > ul.menu{
    grid-template-columns: 1fr;
    gap: 15px 30px;
  }
  #block-mtpc-mainnavigation > ul.menu > li:before{
    left: -15px;
  }
  .mtpc-1col-item .mtpc-pageTitle-block h1 {
    font-size: 32px;
    margin-bottom: 50px;
  }
  
  .curriculum-requirements-course .field__items{
    grid-template-columns: repeat(2, 1fr);
  }
  
  .accordion-question .custom-text-wrapper{
    flex-direction: column;
  }
  
  .accordion-question .custom-text-wrapper .additional-title-name{
    margin-left: 0;
  }
  
  .field__item:has( >.two-people-thumbnail){
    margin: auto;
  }
  
  .field__item:has( >.two-people-head){
    width: 100%;
    margin: auto;
    padding: 20px 0 0 0;
    text-align: center;
  }
  
  div.inline-one, div.inline-three{
    gap: 5px;
    margin-bottom: 5px;
    flex-direction: column;
  }
  
  div.inline-three > p > img,
  div.inline-three > img {
    width: 100%;
  }
  
  .view-id-mtpc_albums .view-content .views-row.album_grid_item.mtpc_masonry_item{
    width: 100%;
  }
  
  .view-id-mtpc_albums .view-content .views-row.album_grid_item.mtpc_masonry_item:nth-child(odd){
    margin-right: 0px;
  }
}