/*
  Dezeen Responsive MkI - August 2013
  By Alex and Rose
  Targeting small screen devices only, legacy issues fixed with JS
*/

@media screen and (min-width: 480px) {
  #ad-leaderboard-mobile,
  #ad-footer-mobile,
  #ad-pre-comment-mobile, .articleSM {display:none;}
  .see-also-all{display:none;}
  .see-also-hellip{display:inline;}
  .sm-footer-mobile{display:none;}
  #mobile-header {display:none;}
  .hide-pag {
    display:inline;
  }

  #mobile_sign_up, .mobile_pop_com, #interscroller, .mobile-footer-nav {

    display:none;

  }

}

@media screen and (max-width: 480px) {

  .mobile_pop_com {margin-bottom:15px;}

  body{width:100% !important;}

  #content {
    width:100%; margin:0px;
  }

  #content p {
    font-size:1.16em;
    line-height:1.4em;
  }

  #content img {width: 100%;}

  #container {padding:0px;width:100%;float:auto;}

  header{width:100%;}
  header#site-header{height:auto;position: static;}
  header #logo-outer-outer {width:auto;margin-top:10px;}
  header #logo-outer {width:100%;}
  header #logo {left:0px !important;width:100%;}
  header #logo a {padding-top: 56.25%;}

  nav.secondary {display:none;}
  div#logo-outer-outer {display:none;}

  #logo-mwt{display:none;}

  #mobile-header {display:inline-block;width:100%;margin:0;}

  .secondary ul {}

  #container{}

  header nav {width:100%;margin:0px;float:none;}

  .desktop-ad,
  #horrid-ad-1,
#ad-leaderboard,
#ad-lhs-skyscrapper-1,
#ad-lhs-spot-1,
#ad-lhs-spot-2,
#ad-lhs-spot-3,
#ad-lhs-spot-4,
#ad-lhs-spot-5,
#ad-lhs-spot-6,
#ad-lhs-spot-7,
#ad-rhs-mpu-1,
#ad-rhs-halfpage-1,
.ad-pre-comment,
.ad-post-comment,
.ad-search-pre,
.ad-search-post,
.ad-post-video {display:none;}

  #ad-leaderboard-mobile {
    display:block;
    width:100%;
    text-align:center;
  }

  #ad-footer-mobile {
    display:block;
    width:100%;
    text-align:center;
  }

  #ad-pre-comment-mobile {
    display:block;
    width:100%;
    text-align:center;
    border-top: solid 4px #6c6e95;
    padding: 20px 0;
  }

  aside#secondary {display:none;top:0px;width:100%;}
  aside#secondary img {width:100%;}
  aside#videoshow {display:none;}

  nav.secondary { width:100%;-webkit-text-size-adjust:none; -ms-text-size-adjust:none; }
  nav.secondary ul {width: auto; }

  nav.secondary .search {margin-right:5px;}

  #content { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; padding-bottom:0px;}
  #content p { -webkit-text-size-adjust:auto; -ms-text-size-adjust:auto; }
  #content p a:link,
  #content p a:visited,
  #content p a:hover,
  #content p a:active { -webkit-text-size-adjust:auto !important; -ms-text-size-adjust:auto !important; }

  nav.secondary li.nav-story,
  nav.secondary li.nav-advertise,
  nav.secondary li.nav-cookies,
  nav.secondary li.nav-mailing {display:none;}

  nav.secondary li.nav-contact {border-right:none;}

  h1.page-title {
    margin-left: 10px;
    margin-right: 10px;
  }

  #nav-above {
  }

  #content #nav-below {
    width:auto;
    margin-bottom:8px;
  }

  #content ul.navigation li.prev, .mobile-footer-nav .prev {
    float:left;
    width:40%;
    border-right:none;
  }

  #content ul.navigation li.xnext,
  #content ul.navigation li.next, #page-footer ul.navigation li.xnext,
  #page-footer ul.navigation li.next, .mobile-footer-nav .next {
    float:right;
    width:40%;
    text-align:right;
  }

  article {padding:0 8px; /*margin-top: 40px;*/}

  .social-sharing {display:none;}
  .time-outer {margin: 8px 0;}
  .time-outer span {display:inline;}

  .cat-wrapper-top {
    display:none;
    margin: 15px;
    width: 92%;
  }

  #primary,
  #slideshow {display:none;}

  div#slideshow-container {
    width:100%;
    height:auto;
/*    margin-bottom: 0; */
  }

  div.slideshow{
    height: 0 !important;
    padding-bottom: 71%;
  }


  div.slideshow-control {
    width:90%;
    position: absolute;
    top: 0px;
  }

  div.paginationx {
    display:none;
  }

  div.slideshow-previous-wrapper {
    background-color: #000;
  }

  div.slideshow-control-next {
    float:right;
    background-color: #000;
  }

  #content article footer ul.see-also li {
    width:100%;
    background-color:#e7ecf3;
  }

  ul.see-also li {
    width:100%;
    background-color:#e7ecf3;
  }

  .see-also-cats {
    margin:8px;
  }

  #content article footer ul.see-also li:nth-of-type(n+4) {display: none;}

  ul.see-also li:nth-of-type(n+4) {display: none;}

  .see-also-all{display:inline;}
  .see-also-hellip{display:none;}

  #content .see-also-img-link {
    width:160px;
    margin-right:10px;
    float:left;
  }
  #content .see-also-img-link img {
    width:150px;
  }

  .see-also-title {
    float:left;
    width:40%;
    padding-top:8px;
    font-size:1.3em;
    line-height:1.1em;
    max-height:150px;
    -webkit-text-size-adjust:none;
    -ms-text-size-adjust:none;
    display:block;

    /* Den Edit November 2015 */
    height: 140px;
  }

  #page-footer {
    width:100%;
    padding:0px;
  }

  #page-footer .search {
    display:none;
  }

  #promos {
    display:none;
  }


  #idc-container-parent {
    margin:0 10px;
  }

  .ad-post-comment {
    width:100%;
    margin-left:10px;
    margin-right:10px;
  }

  #content figure {width:100%;}

  /*.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  }
  .embed-container iframe,
  .embed-container object,
  .embed-container embed {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
  }*/

  ul.post-categories {
    list-style: none;
    margin: 0;
    padding: 0;
    line-height: 1.25;
  }


  #content article footer li {
    display:inline-block;
    width:auto;
    margin-right:0px;
  }

   ul.post-categories li{
    color: #6c6e95;
    background: #e7ecf3;
    padding-right: 4px;
    border-radius: 2px;
    display: inline-block;
    margin: 4px 4px 4px 0 !important;
    border:none;

  }

  ul.post-categories li a{
    padding: 4px;
    display: inline-block;
  }

  .post-cat-more {
    display:none;
  }

  #nav-above a span,
  #nav-below a span {display:none;}

  #nav-above {
    top:-28px;
    margin-left:0px;
    display:inline-block;
    width:100%;
  }

  #content #nav-below {
    margin-bottom:60px;
    margin-left:0px;
    border-top:none;
    display: none;
    width:100%;
  }

  article h1 br {
    /*display:none;*/
  }

  #content ul.navigation li.prev,
  #content ul.navigation li.next,
  #content ul.navigation li.xnext,
  #page-footer ul.navigation li.prev,
  #page-footer ul.navigation li.xnext,
  .mobile-footer-nav .next,
  .mobile-footer-nav .prev {
    color: #6c6e95;
    background: #e7ecf3;
    padding-right: 4px;
    border-radius: 2px;
    display: inline-block;
    margin: 4px 4px 4px 0 !important;
    border:none;
    width:auto;
  }

  #content ul#nav-above.navigation li.prev {
    margin-left:10px !important;
  }

  #content ul.navigation li.prev a,
  #content ul.navigation li.prev span.current,
  #content ul.navigation li.xnext a,
  #content ul.navigation li.xnext span.current, #page-footer ul.navigation li.prev a,
  #page-footer ul.navigation li.prev span.current,
  #page-footer ul.navigation li.xnext a,
  #page-footer ul.navigation li.xnext span.current, .mobile-footer-nav .prev a, .mobile-footer-nav .next a
   {
    padding: 4px 4px 4px 8px;
    display: inline-block;
  }

  nav.secondary .search {
    display:none;
  }

  ol.wp-paginate li {
    color: #6c6e95;
    background: #e7ecf3;
    padding-right: 4px;
    border-radius: 2px;
    display: inline-block;
    margin: 4px 4px 4px 0 !important;
    border:none;
  }

  ol.wp-paginate li a,
  ol.wp-paginate li span.current {
    padding: 4px 4px 4px 8px;
    display: inline-block;
  }

  ol.wp-paginate a.next:link,
  ol.wp-paginate a.next:visited,
  ol.wp-paginate a.next:hover,
  ol.wp-paginate a.next:active {
    border-left:none;
  }

  ol.wp-paginate a.prev:link,
  ol.wp-paginate a.prev:visited,
  ol.wp-paginate a.prev:hover,
  ol.wp-paginate a.prev:active {
    border-right:none;
  }

  .sm-footer-mobile {
    display:block;
    width:100%;
  }

  .sm-footer-mobile-inner {
    margin:10px;
    border-top:solid 4px #6c6e95;
  }

  /*
    Cheers to Chris Coyier http://css-tricks.com/equidistant-objects-with-css/
  */
  .sm-stretchy-container {
    text-align: justify;
    font-size: 0.1px; /* IE 9 & 10 don't like font-size: 0; */
  }
  .sm-stretchy-container div {
    width: 60px;
    height: 60px;
    display: inline-block;
  }
  .sm-stretchy-container:after {
    content: '';
    width: 100%; /* Ensures there are at least 2 lines of text, so justification works */
    display: inline-block;
  }

  /*
  hide the comment avatars
  */
  .avatar {
    display:none;
  }

  .list-category-outer {
    padding-bottom:30px;
  }

  body.archive #content {
    margin-top:0px;
  }

  .hide-pag {
    display:none;
  }

  #disqus_thread{
    padding:0 10px;
  }

  #entry-author-info {
    margin:0 10px;
  }

  body.author .see-also {
    margin:0 10px;

  }

  body.author #content ul.see-also {
    margin:0px;
    list-style:none;
    display: inline;
  }

  body.author #content ul.see-also li {

    width: 100%;
    background-color: #e7ecf3;
    display: block;
    margin-right: 8px;
    margin-bottom: 1em;
    float: left;
  }

  body.author #content ul.see-also img {
    width:150px;
  }

  body.author .author-related {
    float:left;
    width:40%;
    padding-top:8px;
    font-size:1.6em;
    line-height:1.1em;
    max-height:150px;
    -webkit-text-size-adjust:none;
    -ms-text-size-adjust:none;
    display:block;
  }

  .inline-see-also,
  .inline-see-also-cat {
    display:none;
  }

  /* Grrrr */
  #psu_protein_unit {display:none;}

  #mobile_sign_up_outer {
    width:100%;
  }

  #mobile_sign_up {

    margin: 0 auto;
    display:block;
    padding:8px;
    width:90%;
    padding-bottom:90%;
    background-image:url(../images/Dezeen-Daily-Signup-468x468.jpg);
    background-size: cover;
    position:relative;

  }

  #mobile_sign_up_logo {

    position:absolute;
    top:3%;
    left:3%;
    width:auto;
    color:#fff;
    font-family: arial;
    font-weight: bold;
  }

  #mobile_sign_up_logo img {
    width:80%;
  }

  #mobile_sign_up_form {

    position:absolute;
    bottom:3%;
    text-align: right;
    width:100%;

  }

  #mobile_sign_up_form_inner {

    margin:0 16px;

  }

  #mobile_sign_up_form form {

    display:inline-block;
    padding:0;
    margin:0;
    width:100%;

  }

  #mobile_sign_up_form input {
    width:70%;
    border:0;
    padding:4px;
    font-size:1.4em;
    border-radius:1px;
  }

  #mobile_sign_up_form button {
    border: 0;
    color:#fff;
    font-family: arial;
    font-size:16px;
    font-weight: bold;
    background-color:transparent;
    margin: 0 4px;
    padding: 0;
    width:auto;
  }

 /* DEN EDITS 05-12-2014 */

  #mobile-header {
    position: fixed !important;
    top: -1px;
    z-index: 10000;
    width: 128px;
    left: 0;
    right: 0;
    margin: 0 auto;
  }

  h1 a {
    /* border-top: none;
    margin-bottom: 25px; */
    font-weight: lighter;
    font-size: 22px;
    line-height: 1.2;
  }

  .mobile-footer-nav {
    padding: 0 5px 0 10px;
  }

  .time-outer .share-twitter, .time-outer .share-facebook, .time-outer .share-google, .time-outer > span  {
    display: none;
  }

  .timer-outer {
    margin: 10px 0;
  }

  .more-link {
    margin-bottom: 10px;
    line-height: 1;
    display: inline-block;
  }

  /*
  #content article .time-outer time {
    font-family: arial, sans-serif;
  }
  */

  /*
  #nav-above {
    display: none;
  }
  */
  article.first {margin-top:0;}

  .cf#mobile-top-navigation {
    background: none;
    background-color: white !important;
    height: 45px;
  }

  #mobile-nav-search-input-wrapper {
    margin-top: 7px !important;
  }

  #mobile-nav-search-input-wrapper input {
    display: none;
  }

  #mobile-nav-search-input-wrapper button {
    background: none;
    border: none !important;
  }

  body #ad_wrapper, body #ad_wrapper a img {
    width: 100% !important;
    height: 100% !important;
  }

/*
  #ad-leaderboard-mobile > div {
    width: 100%;
    height: auto;
  }

  #ad-leaderboard-mobile > div > div iframe , #ad-leaderboard-mobile > div > div iframe html body #ad_wrapper {
    height: 100%;
    width: 100%;
  }

  .inline-see-also-text.cf {
    text-align: center;
  }


  .inline-see-also-text.cf p strong, .rel_story_title {
    display: block;
    font-size: 18px;
    color: black;
   }


  .rel_story_title {
    margin-bottom: 10px;
    font-weight: bold;
  }

  .inline-see-also-text.cf p a {
    width: 80%;
    display: block;
    margin: 4px auto;
    border-bottom: none !important;
    color: #6c6e95 !important;
    font-size: 20px;
    line-height: 1.2;
  }


  #content p a {
    color: black;
    border-bottom: 1px solid #6c6e95;
  }
  */

  #content footer.nocontent {
    margin-top: 18px !important;
  }

   #content footer.nocontent h3 {
     font-weight: lighter;
font-size: 22px;
line-height: 1.2;
  }

  /*
  #content footer.nocontent div:nth-of-type(1) {
    text-align: left;
    margin: 0 auto;
    width: 80%;
    display: table;
  }


  #content footer.nocontent > a img {
    width: 80% !important;
    margin: 0 auto;
    display: block;
  }
  */

  #content a img {
    margin-bottom: -4px;
  }


  #content p {
    line-height: 1.6;
    font-size: 1.05em;
  }


  /* .comments-link {
    font-family: arial, sans-serif;
    color: black !important;
    border-bottom: 1px solid #6c6e95;
  } */

  #content hr {
    margin-bottom: 12px;
  }




            .articleSM {
              width: 100%;
              height: auto;
              display: block;
              overflow: hidden;
              margin-top: 0;
            }

            .articleSM a {
              display: block;
            }

            .articleSM:after {
              clear: both;
            }

            .articleSM > div {
              width: 13%;
              float: left;
            }

            .articleSM img {
              margin: 0 !important;
              height: 60px;
            }

            .articleSM > div img, svg.icon.icon-facebook-with-circle, svg.icon.icon-twitter-with-circle, svg.icon.icon-pinterest-with-circle, svg.icon.icon-flipboard-with-circle {
              width: 76% !important;
            }

            svg.icon.icon-facebook-with-circle, svg.icon.icon-twitter-with-circle, svg.icon.icon-pinterest-with-circle, svg.icon.icon-flipboard-with-circle {
              height: 60px;
            }

            svg.icon.icon-facebook-with-circle {
              fill: #3c5a98;
            }

            svg.icon.icon-twitter-with-circle {
              fill: #2daae2;
            }

            svg.icon.icon-pinterest-with-circle {
              fill: #cc2431;
            }

            svg.icon.icon-flipboard-with-circle {
              fill: #BA1918;
            }

  .home #content .navigation#nav-below {
    display: block;
    margin-top: 0;
    margin-bottom: 60px;
		width: calc(100% - 16px);
		margin-left: 8px;
  }

  .sm-footer-mobile .feature, footer.nocontent .feature {
    border-top: solid 4px #6c6e95;
    padding-top: 5px;
    margin: 10px;
    text-align: center;
  }
    }

  @media screen and (max-width: 480px) {

    footer.nocontent > .feature {
      display: none;
    }
  }
  /* END OF DEN EDITS */

.sm-footer-mobile .feature, footer.nocontent .feature {
    border-top: solid 4px #6c6e95;
    padding-top: 5px;
    margin-bottom: 20px;
  }