/*
 * 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.
 */

/*
 * Really small screens and up
 */
/* @media only screen and (min-width: 220px) {} */

/*
 * Smalltouch sizes and up
 */
/* @media only screen and (min-width: 320px) {} */




/* responsive styles - qqq */

@media only screen and (max-width: 1199px) {
  #page {
    width: 960px;
  }

  #header #branding #name-and-slogan #site-slogan {
    width: 450px;
  }

  #header #branding #name-and-slogan #site-name {
    margin: 35px 10px 0px;
  }

  #header #branding #logo {
    margin-top: 20px;
  }

  .front #columns #content-column {
    width: 67.3%;
  }

  #block-block-6 .form-text, #block-search-form .form-text {
    width: 235px;
  }

  .views-field-nothing {
    width: 45%;
  }

  #block-block-4 .block-content-inner div:first-child {
    width: 100%;
  }

  #block-block-4 .block-content-inner div:nth-child(2) a {
    width: 45%;
  }
  .views_slideshow_slide,
  .views-slideshow-cycle-main-frame {
    width: 100% !important;
  }

  .block-alta-translation-gallery-block .block-content .block-content-inner,
  .block-alta-translation-gallery-block .block-content .block-content-inner .view-alta-translation-gallery {
    height: 460px;
  }

  .block-alta-translation-gallery-block .block-content .block-content-inner .view-content {
    height: 430px;
  }
}

@media only screen and (max-width: 1024px) {
  .page-node-1 .region-three-25-25-50-third .ds-1col,
  .page-node-41 .region-three-25-25-50-third .ds-1col,
  .page-node-42 .region-three-25-25-50-third .ds-1col,
  .page-node-43 .region-three-25-25-50-third .ds-1col,
  .page-node-118 .region-three-25-25-50-third .ds-1col,
  .page-node-25 .region-three-25-25-50-third .ds-1col,
  .page-node-115 .region-three-25-25-50-third .ds-1col,
  .page-node-45 .region-three-25-25-50-third .ds-1col,
  .page-node-11 .region-three-25-25-50-third .ds-1col {
    float: left;
    width: 72%;
  }
  #page {
    width: 800px;
  }

  #header {
    margin: 40px auto 0;
  }

  #header #branding #name-and-slogan #site-name {
    white-space: pre-line;
    margin: 40px 10px 0;
  }

  #header #branding #name-and-slogan #site-slogan {
    padding: 25px;
    width: 310px;
  }

  #block-block-6 .form-text, #block-search-form .form-text {
    width: 195px;
  }

  .front #columns #content-column {
    width: 66.5%;
  }

  #block-block-4 .block-content-inner div:first-child {
    margin: 5px 0;
  }

  .front .views-field-field-image {
    width: 40%;
  }

  .views-field-nothing {
    width: 54%;
  }

  #bipanel .block-title {
    line-height: 15px;
  }

}

@media only screen and (max-width: 872px) {
  .page-node-1 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1,
  .page-node-41 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1,
  .page-node-42 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1,
  .page-node-43 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1,
  .page-node-118 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1,
  .page-node-25 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1,
  .page-node-115 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1,
  .page-node-45 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1,
  .page-node-11 .region-three-25-25-50-third #block-views-alta-ad-sidebar-block-1 {
    float: none;
    width: 100%;
    text-align: center;
  }
  .page-node-1 .region-three-25-25-50-third .ds-1col,
  .page-node-41 .region-three-25-25-50-third .ds-1col,
  .page-node-42 .region-three-25-25-50-third .ds-1col,
  .page-node-43 .region-three-25-25-50-third .ds-1col,
  .page-node-118 .region-three-25-25-50-third .ds-1col,
  .page-node-25 .region-three-25-25-50-third .ds-1col,
  .page-node-115 .region-three-25-25-50-third .ds-1col,
  .page-node-45 .region-three-25-25-50-third .ds-1col,
  .page-node-11 .region-three-25-25-50-third .ds-1col {
    float: none;
    width: 100%;
  }

  #page {
    width: 640px;
  }

  #logo {
    width: 100%;
    margin: 20px auto 0;
  }

  #logo img {
    display: block;
    margin: 0px auto;
  }

  #header #branding #name-and-slogan #site-name {
    width: 100%;
    text-align: center;
    margin: 40px 0 0;
  }

  #header #branding #name-and-slogan #site-slogan {
    width: 80%;
    text-align: center;
    display: block;
    margin: 0px auto;
    border-left: 0px solid #000;
  }

  #menu-bar-wrapper #block-superfish-1 .menu li a, #menu-bar-wrapper #block-system-main-menu .menu li a {
    padding: 10px 15px;
  }

  .sf-accordion-toggle.sf-style-light-blue {
    display: none;
  }

  #block-block-6 .form-text, #block-search-form .form-text {
    width: 145px;
  }

  #block-block-4 .block-content-inner div:nth-child(2) a {
    width: 100%;
  }

  .front #columns #content-column {
    width: 65.3%;
  }

  .button-join, .button-find, .button-donate, .button-blog, .button-announcements {
    padding: 10px 0;
  }

  .block-alta-translation-gallery-block .block-content .block-content-inner,
  .block-alta-translation-gallery-block .block-content .block-content-inner .view-alta-translation-gallery {
    height: 650px;
  }

  .block-alta-translation-gallery-block .block-content .block-content-inner .view-content {
    height: 620px;
  }

  footer#footer .block-7 {
    float: none;
    margin: 0px auto !important;
    display: block;
    width: auto;
  }

  footer#footer .block-7 .legal {
    padding: 0;
    margin: 20px 0 0;
  }

  footer#footer .block-7 .content li.last {
    padding: 0px !important;
  }

  footer#footer .block-7 .content li a {
    padding: 0 1em 0 0;
  }

  footer#footer .block-8 .content img {
    float: none;
    margin: 30px 0 20px;
  }

  footer#footer .block-8 .content p {
    width: 100%;
    margin: 0px auto;
    text-align: center;
  }
  .page-publishers #tripanel-3 table {
    width: 960px !important;
  }
}

@media only screen and (max-width: 768px) {
  #page {
    width: 600px; /* ***** QQQ This was doing something odd at 100% ******/
    max-width: 100%;
    min-width: 330px;
    padding: 0px 4px !important;
  }

  .mb-ad ul.menu {
    padding: 0 0 0 .2em;
  }

  #menu-bar-wrapper #block-superfish-1, #menu-bar-wrapper #block-system-main-menu {
    background: transparent;
  }

  #menu-bar, #menu-bar .block-first {
    background: transparent;
  }

  #superfish-1-accordion {
    display: none;
  }

  #block-superfish-1 #sidr-wrapper-0 a {
    color: #fff;
    padding: 0 5px;
    outline: none;
  }
  /*QQQ adaptive adjustments*/
  #header {
    min-height: 60px;
  }
  #header #branding #logo {
    padding: 7px 7px 8px 0px;
    margin: 0;
    background-color: #f7f5f2;
    position: fixed;
    top: 0;
    width: 90px;
    z-index: 9;
  }
  #menu-bar-wrapper {
    margin: 0px 0px 0px 96px;
    height: 40px;
    background-color: #f7f5f2;
    position: fixed;
    top: 0px;
    padding: 8px 8px 0 0;
    width: 92px;
    text-align: center;
    z-index: 9;
  }
  #block-block-24 {
    display: none;
  }
  .page-alta-user div.region-three-25-25-50-bottom, 
  .page-user div.region-three-25-25-50-bottom {
    width: 70%;
  }

  #header #branding #name-and-slogan #site-name {
    width: 100%;
    text-align: left;
    margin: 18px 0 0 0;
  }
  #header #branding #name-and-slogan #site-slogan {
    display: none;
  }
  #header #branding #name-and-slogan {
    margin: 0 0 0 96px;
  }
  form#views-exposed-form-alta-member-announcements-page-1 .views-exposed-widgets #edit-type-wrapper {
    width: 33%;
    margin: 0 3px 0 0;
  }
  form#views-exposed-form-alta-member-announcements-page-1 .views-exposed-widgets #edit-field-alta-genre-tid-wrapper,
  form#views-exposed-form-alta-member-announcements-page-1 .views-exposed-widgets .views-exposed-widget {
    width: 29%;
    margin: 0 3px 0 0;
  }
  form#views-exposed-form-alta-member-announcements-page-1 .views-exposed-widgets #edit-secondary-wrapper {
    width: 50%;
  }
  form#views-exposed-form-publisher-database-page .views-exposed-widget {
    width: 47%;
    min-height: 64px;
  }
  #block-block-6 form, #block-search-form form {
    width: 95%;
    float: left;
    border-left: 0px solid #000;
  }

  #block-block-6 .form-text, #block-search-form .form-text {
    width: 86%;
  }

  .front #columns #content-column,
  .two-50 > .region-two-50-first,
  .two-50 > .region-two-50-second,
  #columns .region-sidebar-first {
    width: 100% !important;
    margin: 0;
  }

  .region-two-50-second,
  #columns .region-sidebar-first {
    border-left: 0px solid #fff;
  }

  .not-front .three-25-25-50 > div.region-three-25-25-50-first {
    display: none;
  }

  .not-front .three-25-25-50 > div.region-three-25-25-50-third {
    width: 100%;
  }

  #views_slideshow_cycle_teaser_section_alta_translation_gallery_block {
    width: 100%;
  }

  /* homepage slideshow */
  .front .views-field-field-image {
    width: auto;
  }

  .front .views-field-nothing {
    width: 100%;
  }

  .block-alta-translation-gallery-block .block-content .block-content-inner,
  .block-alta-translation-gallery-block .block-content .block-content-inner .view-alta-translation-gallery {
    height: 750px;
  }

  .block-alta-translation-gallery-block .block-content .block-content-inner .view-content {
    height: 720px;
  }
  /* / homepage slideshow */

  .sidr-class-sf-depth-1 {
    list-style: none;
  }

  .sidr-class-sf-depth-1 a {
    padding: 0px 20px 10px;
    display: block;
    text-transform: uppercase;
  }

  .sidr-class-sf-depth-1 ul li a {
    display: inline-block;
    text-transform: capitalize;
  }

  .block-alta-translation-gallery-block .views-slideshow-controls-bottom {
    width: auto;
  }

}

/* end of responsive styles - qqq */

@media only screen and (max-width: 580px) {
  .block-alta-translation-gallery-block .block-content .block-content-inner,
  .block-alta-translation-gallery-block .block-content .block-content-inner .view-alta-translation-gallery {
    height: 800px;
  }

  .block-alta-translation-gallery-block .block-content .block-content-inner .view-content {
    height: 770px;
  }
}



/*
 * 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%;
  }
}

/*
 * Tablet sizes and up
 */
/* @media only screen and (min-width: 768px) {} */

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