/*
 * 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 https://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.
 */

/*
 * Really small screens and up
 */
/* @media only screen and (min-width: 220px) {} */

/*
 * Smalltouch sizes and up
 */
/* @media only screen and (min-width: 320px) {} */

/*
 * Smalltouch sizes and down
 */
@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%;
  }
}
@media only screen and (max-width: 500px) {
  #section-title a {
    margin-top: 60px;
    padding-left: 12%;
    text-align: left;
  }
  #donate-wrapper {
    margin-top: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1214px) {
    .not-front .columns-inner,
    #footer {
        padding:0 1em;
    }
}
@media only screen and (max-width: 1023px) {
    .group-home-statistics {
      padding:0 5%;
    }
    .field-name-field-home-statistic > .field-items > .field-item {
        padding:0;
        width:100%;
        border-right:0 none;
        border-bottom:1px solid #cccccc;
        margin-bottom:2em;
        padding-bottom:2em!important;
    }
    .field-name-field-home-statistic > .field-items > .field-item:last-child {
        border-bottom:0 none;
    }
    .field-name-field-home-statistic > .field-items > .field-item:nth-child(2){
        margin:0;
        padding:0;
    } 
    .field-name-field-home-statistic > .field-items > .field-item:last-child {
        border-bottom:0 none;
    }  
    .field-name-field-home-statistic > .field-items > .field-item {
         padding:4% 0% 4% 0;
    }    
    .group-home-content-content {
        color:#3d3d3d;
        background-color:#f2f2f2;
        position:relative;
        padding:0;
        text-align:center;
        width: 100%;
        padding-top:2em;        
    }  
    .field-name-field-home-content-heading {
        color:#001d41;
    }  
    .group-home-content-content p {
        padding:0 5%;
    }
}
/*
 * Under iPad
 */
@media only screen and (max-width: 767px) {
    /**
     * Make needed container widths 100% here
     */
    .home-story,
    .node-link-block,
    .region-tertiary-content .tertiary-block,
    .home-bottom-left,
    .home-bottom-right,
    .group-home-content-content {
        width:100%;
    }
    /**
     * Hide all the content to be hidden here 
     */
    /**
     * Page
     */
    #page {
      top:180px;
      /*top:49px;*/
    }
    .node-type-home-page #page {
      top:166px;
    }    
    /**
     * Header
     */
    #header-wrapper {
      position:relative;
    }
    #logo {
      padding:23px 0;
    }
    #header {
        text-align: center;
        margin-right: 0;
        background:#001836;
        padding-bottom:0;
        /*height:0;*/
        position:fixed;
        top:0;
        width:100%;
        background:#001836;
        /*margin-top:-84px;*/
    }
    #branding {
        width:100%;
        background:#fff;
        text-align:center;   
        margin:0;
    }    
    #header-right {
        float:none;
        width:100%;
        float:left;
        margin-top:0;
        margin-bottom:1.5em;
/*        position: fixed;
        height:52px;*/
        /*top:0;*/
/*        padding-top:12px;*/
        background:#001836;
    }
    #header-right .header-right-full {
      display:none;
    }
    #header-right .header-right-mobile {
      display:inline;
    }
    #header-right .social-icon, .region-header {
        display: inline-block;
        margin: 0 0.3em;
    }    
    .burger {
      font-size: 24px;
      position: relative;
      top: 1px;
      line-height: 20px;
    }    
    /**
     * Home Content
     */
    .field-name-field-home-headline {
        font-size:3em;
        background:transparent;
        text-align:center;
        width:100%;
        padding:0;
    }
    .field-name-field-home-headline .field-item {
      padding:0 3%;
    }
    .group-home-banner-content {
        position:relative;
        right:0!important;
        top:0!important;
        width:100%;
        text-align:center;
        min-width:inherit;
    }
    .group-home-banner {
        background:#f2f2f2;
        padding-bottom:2em;
    }
    .field-name-field-home-headline {
        color:#001d41;
    }
    .field-name-field-home-headline span {
        background:0 none;
    }
    .group-home-content-content p,
    .group-home-statistics {
      padding:0 5%;
    }
    .field-name-field-home-link-blocks,
    .stories-wrapper {
        padding:0 1em;
    }
    .node-link-block {
        margin:0 auto 1em!important;
        float: none;   
        max-width: 325px;
        width: auto;        
    }
    .field-name-field-link-block-intro {
        clear: both;
        float: left;
        margin: 2em auto;
        text-align: center;
        width: 100%;
    }    
    .field-name-field-home-statistic > .field-items > .field-item {
        padding:0;
        border-right:0 none;
        border-bottom:1px solid #cccccc;
        margin-bottom:2em;
        padding-bottom:2em!important;
    }
    .field-name-field-home-link-blocks > .field-items > .field-item:nth-child(2) .node-link-block,
    .stories-wrapper .home-story:nth-child(2),
    .region-tertiary-content .block-clf {
        margin:0;
        padding:0;
    }
    .home-story p {
        padding:0;
        max-width:inherit;
    }
    .home-bottom-left {
        margin-bottom:2em;
    }
    .home-bottom-left .node {
      padding:0 9%;
    }
    /**
     * Tertiary content 
     */
    .region-tertiary-content .tertiary-block,
    .region-tertiary-content .block-clf {
        border-bottom:1px solid #4d617a;
        padding-bottom:3em;
        margin-bottom:3em;
        width:90%;
        margin-left:5%;
        margin-right:5%;        
    }
    .region-tertiary-content .tertiary-block:last-child {
        border-bottom:0 none;
        margin-bottom:0;
        padding-bottom:1em
    }
    .region-tertiary-content .tertiary-block:nth-child(2) {
        border-left:0 none;
        border-right:0 none;
    }
    #footer ul {
        display:none;
    }
    /**
     * Main content
     */
    body.not-front #main-content,
    .region-sidebar-second .region-inner {
        padding:0 1em;
    }

    /**
     * Second sidebar
     */
    .region-sidebar-second .block {
        width:auto;
    }
    
    /**
     * Photo Gallery 
     */
    .view-photo-gallery .views-row,
    .view-staff .views-row,
    .view-superstars .views-row,
    .view-sponsor-collaborator .views-row,
    .view-stories .views-row,
    .field-name-field-gallery-image > .field-items > .field-item {
      margin:0 3% 2.5em 0;
      width:47%;
    }    
} 
@media only screen and (max-width: 768px) {
  .region-tertiary-content .tertiary-block,
  .region-tertiary-content .block-clf {
      border-bottom:1px solid #4d617a;
      padding-bottom:3em;
      margin-bottom:3em;
      width:90%;
      margin-left:5%;
      margin-right:5%;        
  }
  .region-tertiary-content .tertiary-block:last-child {
      border-bottom:0 none;
      margin-bottom:0;
      padding-bottom:1em
  }
  .region-tertiary-content .tertiary-block:nth-child(2) {
      border-left:0 none;
      border-right:0 none;
  }
}
@media only screen and (min-width: 500px) and (max-width: 650px) {
    /**
     * Page
     */
    .node-type-home-page #page,
    #page {
      top:129px;
    }  
    #header {
        text-align: center;
        margin-right: 0;
        background:#001836;
        padding-bottom:0;
        height:0;
        position:relative;
        top:0;
        margin-top:-84px;
    }
    #branding {
        width:100%;
        background:#fff;
        text-align:center;   
        margin:0;
    }    
    #header-right {
        float:none;
        width:100%;
        float:left;
        margin-top:0;
        margin-bottom:1.5em;
        position: fixed;
        height:52px;
        top:0;
        padding-top:12px;
        background:#001836;
    }   
}
@media only screen and (max-width: 500px) {
    #page {
      /*top:129px;*/
      top:49px;
    }   
    #header {
        margin-top:-110px;
    }  
    .node-type-home-page #page,
    #page {
      top:129px;
    }  
    #header {
        text-align: center;
        margin-right: 0;
        background:#001836;
        padding-bottom:0;
        height:inherit;
        position:fixed;
        top:0;
        margin-top:0px;
    }
    #branding {
        width:100%;
        background:#fff;
        text-align:center;   
        margin:0;
    }    
    #header-right {
        float:none;
        width:100%;
        float:left;
        margin-top:0;
        margin-bottom:1.5em;
        /*position: fixed;*/
        /*height:52px;*/
        top:0;
        /*padding-top:12px;*/
        background:#001836;
    }     

  /**
   * Photo Gallery 
   */
  .view-photo-gallery .views-row,
  .field-name-field-gallery-image > .field-items > .field-item,
  .view-staff .views-row,
  .view-superstars .views-row,
  .view-sponsor-collaborator .views-row,
  .view-stories .views-row {
    margin:0 0 1em 0;
    width:100%;
    padding:0;
  } 
  .view-superstars .views-row:nth-child(3n+2), 
  .view-staff .views-row:nth-child(3n+2),
  .view-sponsor-collaborator .views-row:nth-child(3n+2) {
      margin: 1em 0;
  }  
  .view-photo-gallery .views-row img,
  .view-stories .views-row img,
  .field-name-field-gallery-image > .field-items > .field-item img {
    width:100%;
  } 
}
/*
 * Tablet sizes and up
 */
/* @media only screen and (min-width: 768px) {} */

/*
 * Desktops/laptops and up
 */
/* @media only screen and (min-width: 1025px) {} */
