/*
 * responsive.custom.css is for custom media queries that are not set via the
 * theme settings, such as cascading media queries.
 *
 * By default all the other responsive stylesheets used in Adaptivetheme use a
 * "stacking method", however cascading media queries use a waterfall method so
 * you can leverage the cascade and inheritance for all browsers that support
 * media queries.
 *
 * @SEE http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries/#mq-overlap-stack
 *
 * NOTE: this file loads by default, to disable go to your theme settings and
 * look under the "CSS" settings tab.
 */

@media only screen and (min-width: 1140px) {
    body.front div.region-secondary-content div.homepage-feature{
        font-size: 48px;
        line-height: 49px;
        padding-right: 62px;
    }
}

@media only screen and (max-width: 1024px) {
    nav.sidebar-menu h2.block-title{
        padding-left: 12px;
    } 
    nav.sidebar-menu ul.menu{
        padding-left: 0;
    }
    body.front div.region-secondary-content{
        padding: 60px 12px 60px 30px;    
    }
}

/*
 * Tablet sizes and down
 */
@media only screen and (max-width: 960px) {
    .quicktab-mobile-filter{
        display: block;
    }
    div.view-home-page-focus-areas .views-row .wrapper .image{
        width: 55px;
    }
}
@media only screen and (max-width: 902px){
    .region-sidebar-second{
        padding-left: 22px;
    }
}
@media only screen and (max-width: 860px){
    .front #content{
        padding: 0 7px;
    }
    body.front #content > .block{
        padding: 0 7px;
    }
    body.front #content h2.block-title{
        font-size: 24px;
        margin-bottom: 6px;
    }
}

@media only screen and (max-width: 820px) {
    /* Hamburger mobile menu toggle */
    #branding{
        margin-left: 41px;
    }
    .burger {
            float: right;
            margin-right:40px;
            margin-top:15px;
    }
    #block-views-taxonomy-banner-block{
        padding: 0;
    }
    .burger span {
        width: 60px;
        padding: 5px;
        display: block;
        background-color: #059851;
        margin: auto;
        margin-bottom: 9px;
        box-sizing: border-box;
    }
    #header-border{
        height: 8px;
        margin-bottom: 10px;
    }
    #header{
        border-bottom: 1px solid #CCC;
        padding-bottom: 10px;
    }
    #logo-text{
        margin-left: 0;
    }
    #mit-logo,
    #menu-bar,
    #block-menu-block-1,
    #logo,
    #block-system-user-menu{
        display: none;
    }
    #footer{
        text-align: center;
    }
    .footer-left,
    .footer-right{
        float: none;
        width: auto;
        text-align: center;
        margin-bottom: 20px;
    }
    footer#footer nav.footer-menu ul.menu{
        text-align: center;
    }
    footer#footer nav.footer-menu ul.menu li:last-child{
        margin-right: 0;
    }
}

@media only screen and (max-width: 768px) {
    .front #content{
        padding: 0 12px;
    }
    body.front #content > .block{
        width: auto;
        float: none;
        padding: 0;
        display: block;
    }
    body.front section.featured-content{
        display: block;
        width: auto;
        padding: 12px;
    }
    body.front section.featured-content .block-inner{
        padding: 12px;
        background-color: #e6e6e6;
    }
    body.front div.region-secondary-content{
        padding: 0;
        background: none;
    }
    body.front div.region-secondary-content div.homepage-feature{
        background:url(images/featured_content_background.jpg);
        background-size: cover;
        font-size: 42px;
        line-height: initial;
        display: block;
        width: 100%;
        padding-right: 0;
    }
    body.front .homepage-feature .block-content{
        padding: 20px;
        background-color: rgba(0,0,0,.25);
    }
}

@media only screen and (max-width: 720px) {
    div.view-people .views-row{
        float: none;
        width: 100%;
    }
}

/*
 * Smalltouch sizes and down
 */
@media only screen and (max-width: 560px) {
    .not-front div.news-row,
    .not-front div.view-events .views-row,
    .media-list .views-row{
        padding-top: 6px;
        border-top: 6px solid #dfdfdf;
        margin-bottom: 25px;
    }
    div.news-row .wrapper .image,
    div.view-events div.event-image,
    .media-left{
        margin-bottom: 10px;
        padding-right: 0;
    }
    div.news-row .wrapper .image,
    div.news-row .wrapper .info,
    div.view-events div.event-image,
    div.view-events div.event-info,
    .media-left,
    .media-right{
        display: block;
        width: 100%;
    }
    div.news-row .wrapper .image img,
    div.view-events div.event-image img,
    .media-left img{
        max-width: none;
        width: 100%;
    }
}
@media only screen and (max-width: 480px) {
  /* 
   * Float Region Blocks - custom media query CSS example:
   * 
   * Float regions blocks is an Extension you can enable in the appearance
   * settings for your theme. This feature allows you to automatically float
   * blocks in regions, you can switch it on and off depending on your
   * requirements. For design purposes you many want to remove the floats for
   * devices where the entire theme is just one column - for example small
   * mobile phones. The following CSS is inside the custom media query:
   *
   *   @media only screen and (max-width: 480px){}
   *
   * This will target devices with a maximum width of 480px - most small phones.
   * In these smaller screen sizes we can remove the float and widths so all
   * blocks stack instead of displaying horizonally. The selector used is an
   * "attribute selector" which will match on any float block class. Use your
   * inspector or Firebug to get the classes from the page output if you need
   * more granular control over block alignment and stacking.
   */
  .region[class*="float-blocks"] .block {
    float: none;
    width: 100%;
  }
  #header{
      padding-bottom: 6px;
  }
  #header-border{
      margin-bottom: 6px;
  }
  #branding{
        margin-left: 15px;
  }
  #logo-text{
      width: 165px;
  }
  #branding{
      margin-top: 7px;
  }
  .burger{
      margin: 0;
      padding: 16px;
  }
  .burger span{
      width: 40px;
      padding: 3px;
      margin-bottom: 6px;
  }
  div.view-people .views-row .views-field-nothing-2{
      float: none;
  }
  body.node-type-person div.group-contact-information-image .field-name-field-image{
      display: block;
      padding-right:0;
      margin-bottom: 10px;
  }
  body.node-type-person div.group-contact-information{
      display: block;
  }
  .one-sidebar .content-inner, .two-sidebars .content-inner{
      padding: 0 15px;
  }
  

  .view-signature-publications .views-field-field-newsletter-image, 
  .view-signature-publications .newsletter-info {
      display: block;
  }
  .view-signature-publications .views-field-field-newsletter-image{
      padding-right: 0;
      margin-bottom: 10px;
  }
}

@media only screen and (max-width: 415px){
    .page-node-14767 h1#page-title{
        text-align: left;
    }
    #mc_embed_signup p{
        margin-bottom: 15px;
    }
    #mc_embed_signup label{
        display: block;
        margin-bottom: 3px;
        text-align: left;
    }

    #mc_embed_signup .clear{
        text-align: left;
        margin-top: 20px;
    }
}

@media only screen and (max-width: 360px){
    body.front div.region-secondary-content div.homepage-feature{
        font-size: 34px;
        line-height: 34px;
    }
}

/*
 * Desktops/laptops and up
 */
/* @media only screen and (min-width: 1025px) {} */