/*
  Design v6 mobile shell for the retired 2011 cover pages (/index, /index/cover,
  /index/translators-and-interpreters, /index/translation-buyers, /index/translation-companies),
  which render through the Zend layout new_proz.phtml instead of the classic shell.
  Loaded with the viewport tag when design.v6.mobile is on. Phone widths only: from 768px up
  nothing applies, and the markup, links and IDs are unchanged.
*/
@media (max-width: 767px) {
  body {
    font-size: 15px;
  }

  /* The 945/975px fixed containers become the screen width with a 16px gutter */
  div.bcontainer, div.ftcontainer, div.hdrcontainer, div.cover-container {
    width: auto;
    max-width: 100%;
    box-sizing: border-box;
    padding-left: 16px;
    padding-right: 16px;
  }
  div.pg-container2 {
    min-width: 0;
  }
  div.bcontainer2 > div[style*="padding"] {
    padding: 16px 12px !important;
  }
  img {
    max-width: 100%;
    height: auto;
  }

  /* Header: links wrap under the logo, each a 44px tap target */
  div.header-links-container, div.header-links, div.logo {
    float: none;
    width: auto;
  }
  div.header-links a {
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
    padding: 0 8px;
  }

  /* Side boxes floated beside the text (video, screenshots, tiles) stack above it instead */
  div.bcontainer2 div[style*="float"][style*="margin"],
  div.right-col, div.left-column, div.content-block, div.cover-tiles div.tl,
  div.bt div.txt-block, div.testimonial {
    float: none !important;
    width: auto !important;
    margin: 0 0 20px 0 !important;
  }

  /* Cover page feature box: the tiles sit above the selected panel instead of a 230px column beside it */
  div.main-feature {
    clear: both;
    float: none;
    width: auto;
    height: auto;
    margin-left: 0;
    padding-left: 0;
  }
  div.main-feature div.cover-tiles {
    float: none;
    width: auto;
  }
  div.main-feature div.focus {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  div.main-feature div.focus div[style*="float:right"] {
    float: none !important;
    padding: 12px 0 !important;
  }
  div.main-feature div.orange-button {
    float: none;
    display: inline-block;
  }

  /* Links in running text get a taller tap box without reflowing the text; footer links 44px */
  div.bcontainer2 a {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  div.ft a {
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
  }

  /* Grey text readable on the white page (was 3.99:1 and 2.72:1) */
  div.sub-header {
    color: #5c5649;
  }
  div.bcontainer2 .light-grey {
    color: #666;
  }
  div.ft, div.ft a, div.ft div.pd_bot {
    color: #4a463d;
  }
  div.ft div.sn-icons {
    float: none;
    width: auto;
  }
  div.ft div.links a {
    margin-right: 12px;
  }
  div.bcontainer2 div[style*="font-size:30px"] {
    font-size: 24px !important;
  }
}
