/*======================================================
 * Resets from https://meyerweb.com/eric/tools/css/reset/ 
 * v2.0 | 20110126
 * License: none (public domain)
 *======================================================*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
mark {
    padding:2px;
    background-color:yellow;
}
/*=========================
 * END Resets from Meyerweb
 *=========================*/

/*========================
 * General sitewide styles
 *========================*/
body {
    font-family: Arial, sans-serif;
    -webkit-text-size-adjust: 100%; 
    /* prevent ios auto-zoom when orientation chnages, without preventing user text zoom */
}
/* There is an IE8 bug (some specific versions) that is triggered when
 * respond.js is loaded with a background image on the body tag.
 * Specifying a class prevents that bug from triggering. So we do that
 * here, rather than in the main body rule. One of these classes will
 * always be present, so this effectively applies the image to all
 * cases. */
body.js, body.nojs {
    background: #ebdec5 url(https://dnvbry4stcg1.cloudfront.net/assets/images/tc-background.jpg) repeat left top;
}
a {
    color: #c62a01;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
h1,h2,h3,h4,h5,h6,strong,b {
    font-weight: bold;
}
strong, b {
    font-weight: bold;
}
.button,
button {
    color: white;
    background: #c52a00;
    border: none;
    font-size: 12px;
    padding: 6px 15px;
    cursor:pointer;
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.button:hover, button:hover { opacity: 0.7; }
input.button {width:120px !important;}
body.js .nojs { display: none; }
.hidden, .hbspt-form { display: none; }
body.admin #header form { display: none; }
.desktop-hide { display:none !important; }
/*============================
 * END General sitewide styles
 *============================*/

/*===================================
 * Common Page Elements: Small-screen
 *===================================*/

/* general: small-screen layout */
#wrapper {
    background: white;
    width: 90%;
    margin: 26px auto 0;
    padding-bottom: 26px;
    overflow: hidden;
}
#footer {
    background-color: #474747;
    width: 90%;
    margin: 0 auto;
}
#footer ul {list-style: none; }
#wrapper, #footer {
    -webkit-transition: width 0.5s linear;
    -moz-transition: width 0.5s linear;
    -o-transition: width 0.5s linear;
    transition: width 0.5s linear;
}
#header, #content {
    margin: 0 5.128205128205128205%; /*20px/390px*/
}
#header {
    margin-bottom: 10px;
}

img {
    max-width: 100%;
}
.bigscreen,
.biggerscreen {
    display: none;
}
.smallerscreen {
    display: inline;
}
.smallscreen {
    display: block;
}
.copy h1 {
    background-color: #eeeeee;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    color: #8f8f8f;
    padding: 10px 5.428571428571428571%; /*19px/350px*/
    margin-bottom: 10px;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
.copy h2 {
    color: #5f5f5f;
    font-size: 16px;
    margin-bottom: 2px;
}
.copy p, .article-copy p {
    margin-bottom: 20px;
    color: #5f5f5f;
    line-height: 1.3em;
    font-size: 14px;
}
.article-copy article ul {
    list-style: disc outside;
    font-size: inherit;
    color: #5f5f5f;
    line-height: 1.3em;
    font-size: 14px;
    margin-bottom:20px;
}
.article-copy article ul li {
    margin-left: 40px;
    line-height:1.5em;
}
.author-list { margin-top:10px;}
.copy em {
    font-style: italic;
}
.full-article .article-content img {
    padding: 5px 8px;
}
/* User sitemap styles */
ul.sitemap {
    margin-left:10px;

    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    column-count: 2 it;
    column-gap: 20px;
    list-style: none;
}
ul.sitemap li {
    margin: 12px 0;
    padding-left: 10px;
}
ul.subsitemap {
    margin: -5px 0 20px 0;
    list-style: none;
}
ul.subsitemap li {
    margin: 5px 0;
    padding-left: 20px;
}
ul.subsitemap h3 {
    margin: 16px 0 0 0;
}

.popup {
    overflow:hidden;
    padding:10px;
}
.popup h2 {
    margin-bottom:20px;
}
/* Pop Up Newsletter */
#subscribe-popup form {
padding: 10px;
}
#subscribe-popup form .taglink {
margin-top: 50px;
font-size: 12px;
float: right;
}
#subscribe-popup h3 {
background: #C62A01;
padding: 10px 20px;
font-size: 20px;
margin-bottom: 10px;
border-bottom: 1px solid black;
color: white;
}
#subscribe-popup label {
display: block;
font-weight: bold;
color: #5F5F5F;
margin-bottom: 2px;
font-size: 14px;
}
#subscribe-popup form input {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: solid 1px #C4B7A9;
width: 100%;
padding: 3px 5px;
font-size: 12px;
-moz-box-shadow: inset 2px 2px 6px #EEE;
-webkit-box-shadow: inset 2px 2px 6px #EEE;
box-shadow: inset 2px 2px 6px #EEE;
border-image: initial;
}
/* navigation: small screen layout */
nav.main {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 26px;
    line-height: 26px;
    background: #454545;
    overflow: hidden;
    font-size: 14px;
}
nav.main ul {
    width: 90%;
    margin: 0 auto;
    text-align: right;
    list-style: none;
}
nav.main li {
    display: inline-block;
    margin-right: 5.128205128205128205%; /*20px/390px*/
}
nav.main li.register,
nav.main li.login,
nav.main li.search-nav {
    margin-right: 1px;
}
nav.main li.register a,
nav.main li.login  a {
    padding-right: 5px;
}
nav.main li.register:after {
    content: '|';
    color: white;
}
nav.main a {
    color: white;
}

/* search form: small screen layout */
#header form {
    overflow: hidden;
}
#header input, #header button {
    float: left;
    font-size: 14px;
    height: 30px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#header input {
    /*width: 85%;
    color: #666;
    line-height: 16px;
    background: #eeeeee;
    -webkit-border-radius: 12px 0 0 12px;
    -moz-border-radius: 12px 0 0 12px;
    border-radius: 12px 0 0 12px;
    padding: 5px 10px;
    -moz-box-shadow: inset 3px 3px 6px #999;
    -webkit-box-shadow: inset 3px 3px 6px #999;
    box-shadow: inset 3px 3px 6px #999;
    border: solid 1px #a7a7a7;
    border-bottom-color: #EEE;
    border-width: 1px 0 1px 1px;
    outline: 0;*/
    float:left;
    width: 75%;
    border:solid 1px #9b381b;
    outline: 0;
    border-radius:4px;
}
#header input:focus {
    color: black;
    /*-moz-box-shadow: inset 3px 3px 6px #DDD;
    -webkit-box-shadow: inset 3px 3px 6px #DDD;
    box-shadow: inset 3px 3px 6px #DDD;
    border-color: #c4c4c4;*/
}
#header button {
    float:right;
    padding:0 5px;
    margin:0;
    /*width: 15%;
    line-height: 30px;
    -webkit-border-radius: 0 12px 12px 0;
    -moz-border-radius: 0 12px 12px 0;
    border-radius: 0 12px 12px 0;
    background-color: #999;
    cursor: pointer;
    outline: 0;
    text-align: center;
    padding: 0;
    font-weight: bold;
    -moz-box-shadow: inset -3px -3px 6px rgba(102, 102, 102, 0.7);
    -webkit-box-shadow: inset -3px -3px 6px rgba(102, 102, 102, 0.7);
    box-shadow: inset -3px -3px 6px rgba(102, 102, 102, 0.7);*/
}
#header button span {
    display: block;
    margin: 0 auto;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -64px -48px;
    width:16px;
    height:15px;
}
#header button:focus, #header button:hover {
    background: #b24422;
}
#header button:active {
    -moz-box-shadow: inset 3px 3px 6px rgba(102, 102, 102, 0.7);
    -webkit-box-shadow: inset 3px 3px 6px rgba(102, 102, 102, 0.7);
    box-shadow: inset 3px 3px 6px rgba(102, 102, 102, 0.7);
}
#header button:active img {
    -webkit-transform: translate(1px, 2px);
    -moz-transform: translate(1px, 2px);
    -o-transform: translate(1px, 2px);
    transform: translate(1px, 2px);
}

.search-sort {
 overflow: hidden;
 width: 100%;
 float:left;
 padding: 4px 0;
 border-top: 1px solid #EEE;
}

.search-sort * {
  float:right;
  margin: 0;
}

.search-sort label {
  line-height: 20px;
  float:left;
}

.search-sort input[type="radio"] {
  display: none;
}
.search-sort select {
  margin-left: 10px; 
  float: left;
}
label.sort {
 width: 23px;
 height: 18px;
 display: block;
 text-indent: -9999px;
 cursor: pointer;
 float:left;
}

label.sort.asc {
 background: url(/assets/images/sort-smalldown.png) no-repeat center;
 margin-left:10px;
}

label.sort.desc {
 background: url(/assets/images/sort-smallup.png) no-repeat center;
 margin-left: 10px;
}
.search-options {
 border-bottom: 1px solid #EEE;
 overflow: hidden;
 clear: both;
 margin-bottom:15px;
}
.search-filter select { 
    float: none; 
    margin: 0 5px 10px 0;
}
.search-filter  {
    float:none;
    margin:5px 0;
}
.search-filter label { display: inline-block; }
/* categories section: small-screen display */
.categories {
    margin-bottom: 16px;
    position: relative;
}
.categories div {
    display: none;
}
.categories p {
    color: #bfbfbf;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 11px;
}
.categories li {
    background-color: #eeeeee;
    margin: 5px 0;
    padding: 15px 5.428571428571428571%; /*19px/350px*/
    font-weight: bold;
    font-size: 12px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
.categories li.best-btn {
    background-color: #9b381b;
    border: 1px solid #988577;
}
.categories li.best-btn a {
    color: #fff9ef;
    font-weight: bold;
}
.categories li a { display: block; }

.categories li.searchbox {
    background:none;
    border:1px solid #fff;
}
.categories .searchbox  {
    width: 16px;
    /*width:97%;*/
    height: 33px;
    z-index: 200 !important;
    border-radius: 0px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    background: transparent !important;
    background-color:#0000ee;
    position:absolute;
    right:10px;
    top:0;
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;
}
.searchbox-container form {
    min-width:16px;
    width:100%;
    height:33px;
    overflow:hidden;
}
.categories .searchbox .searchbox-input {
    position: relative;
    right:30px;
    border:0;
    outline:0;
    width:100%;
    height:33px;
    margin:0;
    padding:0px 20px;
    font-size:20px;
    color: #6A5D4F;
    background: #fff;
    border-radius:10px;
    display:none;
}
.searchbox-input::-webkit-input-placeholder { color: #6A5D4F; }
.searchbox-input:-moz-placeholder { color: #6A5D4F; }
.searchbox-input::-moz-placeholder { color: #6A5D4F; }
.searchbox-input:-ms-input-placeholder { color: #6A5D4F; }

.categories .searchbox  span.searchbox-icon,
.categories .searchbox  .searchbox-submit {
    background: transparent url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -64px -48px;
    width: 16px;
    height: 16px;
    display: block;
    position: absolute;
    top:14px;
    right:0;
    padding: 0;
    margin: 0;
    cursor: pointer !important;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
}
.categories .searchbox  .searchbox-submit { display: none;}

/* social links: small-screen display */
.social {
    /* do we need this on mobile?
    border: solid 1px #b2b2b2;
    border-width: 1px 0; */
    /* the negative margin undoes the effects of the internal margins on the 
       wrapping #content element, to allow the borders to extend to the edges 
       of the container */
    margin: 0 -5.428571428571428571% 16px; /*19px/350px*/
    padding: 15px 0;
    overflow: hidden;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    color: #7f7f7f;
}
.social div {
    overflow: hidden;
    margin: 0 auto;
    line-height: 32px;
    display: inline-block;
}
.social p, .social ul {
    float: left;
}
.social p {
    margin-right: 5px;
}
.social li {
    display: inline-block;
    margin-right: 4px;
}
.social li:last-child {
    margin-right: 0;
}
.social-head a,
.social a {
    display: inline-block;
    width: 32px;
    height: 32px;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat left top;
    text-indent: -99999px;
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.social a:hover { opacity:0.7; }

.social.mini {
    display: none;
    margin: 0;
}
.social-head { margin-right:4px !important; }
.social-head a,
.social.mini a {
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat left -32px;
    width: 16px;
    height: 16px;
}
.social.mini div {
    margin: 6px 4px 0 0;
    padding: 0;
    float: right;
}
.social li.facebook a {
    background-position: -32px 0px;
}
.social li.twitter a {
    background-position: -64px 0px;
}
.social li.email a {
    background-position: -96px 0px;
}
li.social-head.facebook a,
.social.mini li.facebook a {
    background-position: -16px -32px;
}
li.social-head.twitter a,
.social.mini li.twitter a {
    background-position: -32px -32px;
}
li.social-head.email a,
.social.mini li.email a {
    background-position: -48px -32px;
}

/* context: 350px */

/* recent articles: homepage */
.recent-articles {
    margin-bottom: 10px;
    overflow: hidden;
}
.recent-articles article {
    color: #606060;
    border-bottom: 1px solid #eeeeee;
    margin-bottom: 20px;
    padding-bottom: 20px;
}
.recent-articles h3 {
    margin-bottom: 11px;
    line-height: 24px;
    font-size: 14px;
}
.recent-articles aside.image {
    padding-right: 2.857142857142857142%; /*10px/350px*/
}
.recent-articles aside.image img {
    max-width: 100%;
    height:auto;
}
.recent-articles .other-link {
    margin-top: -10px;
    float: right;
}

/* top comments: small screen display */
.top-comments,
.recent-articles {
    line-height: 1.2em;
    font-size: 13px;
}
#topcommentinfo {
    display:none;
}
.top-comments {
    background-color: #eee;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    margin-bottom: 25px;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
.top-comments.main header {
}
.top-comments h3 {
    border-bottom: solid 2px #fff;
    font-size: 16px;
    line-height: 43px;
    margin: 0;
    padding: 0 0 0 20px;
    position: relative;
}
.top-comments h3 span.stars {
    display: inline-block;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -64px -32px;
    height:16px;
    width:29px;
    margin-right:8px;
}
.top-comments span.info {
    position: absolute;
    right:14px;
    top:14px;
    display: inline;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -48px -48px;
    height:16px;
    width:16px;    
}
.top-comments.sidebar h3 {
    background-position: 7.142857142857142857% 13px; /*25px/350px*/
    font-size: 14px;
    /*padding-left: 16.857142857142857142%; *//*59px/350px*/
}
.top-comments p {
    margin-bottom: 7px;
}
.top-comments footer p {
    font-size: 11px;
    margin-bottom: 0;
}
.top-comments article {
    color: #5f5f5f;
    border-bottom: solid 1px #c3c3c3;
    margin: 10px 5.714285714285714285%; /*20px/350px*/
    overflow: hidden;
    padding-bottom: 10px;
}
.top-comments article:last-child {
    border-bottom: none;
}
.top-comments article strong {
    color: #000;
}
.top-comments aside,
.recent-articles aside.image {
    float: left;
    width: 15.428571428571428571%; /*54px/350px*/
    overflow: hidden;
}
.top-comments.sidebar aside {
    width: 17.419354838709677419%; /*54px/310px*/
}
.top-comments img {
    float: right;
}
.top-comments article div {
    float: left;
    padding-left: 2.857142857142857142%; /*10px/350px*/
    width: 81.714285714285714285%; /*286px/350px*/
}
.top-comments.sidebar div {
    padding-left: 3.225806451612903225%; /*10px/310px*/
    width: 79.354838709677419354%; /*246px/310px*/
}

/* twitter: small screen display */
section.twitter {
    background-color: #eeeeee;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    color: #5f5f5f;
    font-size: 12px;
    line-height: 1.2em;
    margin-bottom: 16px;
    padding: 10px 2.857142857142857142%; /*10px/350px*/
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
.twtr-hd, .twtr-ft{display: none;}
section.twitter header {
    overflow: hidden;
    line-height: 26px;
    margin-bottom: 5px;
}
section.twitter header h3 {
    float: left;
    width: 109px;
    text-indent: -99999px;
    height:26px;
    width: 109px;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -103px -39px;
}
section.twitter header p {
    float: right;
    font-weight: bold;
    font-size: 11px;
}
section.twitter article {
    border-top: solid 1px #c3c3c3;
    padding: 10px 0;
}

/* promotion area: small-screen display */
.promotion div, .promotion h3 {
    width: 98%; /*330px/350px*/
    max-width: 330px;
    margin: 0 auto;
    padding: 0 2.857142857142857142%; /*10px/350px*/
    overflow: hidden;
}
.promotion h3 {
    color: #999999;
    text-transform: uppercase;
    font-size: 10px;
    margin-bottom: 5px;
}
.promotion div {
    margin-bottom: -20px;
}
.promotion a {
    display: block;
    width: 46.363636363636363636%; /*153px/330px*/
    float:left;
    margin-bottom:20px;
}
.promotion a.even { margin-left:20px; }

/* donation: small-screen display */
.donation {
    margin-top: 17px;
    position: relative;
}
.donation a {
    display: block;
    background-color: white;
    border-left: solid 6px #53bcb3;
    color: white;
    text-transform: uppercase;
    line-height: 27px;
    font-size: 18px;
}
.donation h2 {
    margin-left: 4px;
    background-color: #173b37;
    font-weight: normal;
    padding-left: 9px;
}
.donation span.info {
    position: absolute;
    right:28px;
    top:6px;
    display: inline;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -48px -48px;
    height:16px;
    width:16px; 
}
.donation span.arrow {
    z-index:99;
    height:27px;
    width:27px;
    position: absolute;
    right: 0;
    top:0;
    background: #173b37 url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -128px 0px;
}

.terms-of-use ol {
    margin-left:30px;
}
.terms-of-use ol li {
    color: #5f5f5f;
    font-size: 14px;
    line-height: 1.3em;
    margin-bottom: 20px;
    margin-left:10px;
    list-style-type: decimal outside;
 }
 .terms-of-use ol li ol {
    margin:10px 0 0 10px;
 }

/* footer: small-screen display */
#footer {
    margin-bottom: 10px;
    -webkit-border-radius: 0 0 12px 12px;
    -moz-border-radius: 0 0 12px 12px;
    border-radius: 0 0 12px 12px;
    overflow: hidden;
    color: white;
    font-size: 11px;
    line-height: 1.5em;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
#footer a {
    color: white;
    text-decoration: underline;
}
#footer h4, #footer h4 a {
    color: #a3a3a3;
    font-size: 13px;
    margin-bottom: 3px;
    text-decoration:none;
}
#footer div.row {
    overflow: hidden;
    border-bottom: solid 1px #a3a3a3;
    padding: 10px 0;
}
#footer div.row:nth-child(2) {
    border-bottom: 0;
}
#footer div.row section {
    float: left;
}
#footer section.location, #footer section.basics {
    padding-left: 5.128205128205128205%;  /*20px/390px*/
    width: 39.230769230769230769%; /*153px/390px*/
}
#footer section.contact {
    padding-left: 11.282051282051282051%; /*44px/390px*/
    width: 39.487179487179487179%; /*154px/390px*/
}
#footer section.contact p:last-child {
    margin-top: 15px;
}
#footer section.company {
    width: 50.769230769230769230%; /*198px/390px*/
    text-align: right;
}
#footer section.company h4 {
    outline: 0;
    display: block;
    width: 144px;
    height: 28px;
    float: right;
}
#footer section.company h4 a {
    height: 100%;
    text-align: left;
    text-indent: -999999px;
    display: block;
    height:28px;
    width:144px;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -211px -39px;    
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
#footer section.company h4 a:hover { opacity:0.7; }

#footer section.company p {
    clear: right;
}

/* general form styles */
.copy form {
    width: 100%;
    overflow: hidden;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.copy form .input-group {
    margin-bottom: 10px;
}
.copy form legend,
.copy form label,
.user-profile label {
    display: block;
    font-weight: bold;
    color: #5f5f5f;
    margin-bottom: 4px;
    font-size: 14px;
}
.user-profile label { display: inline; font-size: 14px; margin-bottom:0; }
.user-profile p { margin-bottom:10px;}
.user-profile .bio p { margin-bottom:0;}
.user-profile h2 { 
    clear:both; 
    margin:40px 0 10px;
    padding-bottom:2px;
    border-bottom:1px solid #eee;
    font-size: 18px;
}
.copy form legend { font-size: 18px; padding:0px 3px;}
.copy form input, .copy form textarea,
.copy form select {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: solid 1px #c4b7a9;
    width: 100%;
    max-width: 100%;
    padding: 5px 5px;
    font-size: 12px;
    -moz-box-shadow: inset 2px 2px 6px #EEE;
    -webkit-box-shadow: inset 2px 2px 6px #EEE;
    box-shadow: inset 2px 2px 6px #EEE;
}
.copy form select { padding:4px 5px;}
.copy form p.controls {
    float: right;
}
.copy form input.error {
    border: 1px dotted red;
}
.copy form label.error {
    color: red;
    font-size: 12px;
    font-weight: 700;
    margin:2px 0;
}
.user-profile img {
    float:left;
    margin:0 10px 10px 0;
    padding:2px;
    border:2px solid #eee;
}
.availability { font-size:12px;}
.copy .search-form form input { width:90%; }
/*========================================
 * END: Common Page Elements: Small-screen
 *========================================*/

/*================================
 * Homepage Elements: Small-screen
 *================================*/

/* articles area: small screen layout */
.articles {
    font-size: 14px;
    margin-bottom: 16px;
    line-height: 1.2em;
}
.articles article.main {
    background: #eeeeee;
    color: #5f5f5f;
    padding: 2.571428571428571428%; /* 9px/350px */
    -webkit-border-radius: 12px 12px 0 0;
    -moz-border-radius: 12px 12px 0 0;
    border-radius: 12px 12px 0 0;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
.articles aside {
    border: solid 5px white;
    margin-bottom: 5px;
}
.articles aside img {
    width: 100%;
}
.articles aside a,
.more-articles a aside img,
.recent-articles aside a img,
.sidebar-item a img { 
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.articles aside a:hover,
.more-articles a:hover aside img,
.recent-articles aside a:hover img,
.sidebar-item a:hover img { opacity: 0.7; }

.articles header {
    margin-bottom: 10px;
}
.articles header h3 {
    margin-bottom: 5px;
}
.articles div.article-body p {
    margin: 0 10px;
}
.articles footer {
    margin-top:10px;
    font-size: 12px;
    color: #000;
}
.megamenu {
    padding-top: 10px;
    margin-top: 10px;
}
#comment-management .megamenu { border-top: solid 1px #efefef; }
.more-articles {
    background: #4c4c4c;
    padding: 2.571428571428571428%; /* 9px/350px */
    -webkit-border-radius: 0 0 12px 12px;
    -moz-border-radius: 0 0 12px 12px;
    border-radius: 0 0 12px 12px;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
.more-articles a {
    color: white;
}
.more-articles li {
    border: solid 1px #828282;
    border-width: 0 0 1px;
/*    FIXME: figure out proper image effect for border;*/
    padding-bottom: 12px;
    margin-bottom: 9px;
}
.more-articles li:last-child {
    margin: 0;
    border: none;
}
.more-articles article {
    overflow: hidden;
}
.more-articles aside {
    float: left;
    border: solid 1px white;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 13.253012048192771084%; /*44px/332px*/
    margin: 0 5.120481927710843373% 0 0; /*17px/332px*/
    overflow: hidden;
}
.more-articles aside img {
    width: auto;
    height:auto;
    float: right;
}
.more-articles .article-summary {
    margin-top: -2px;
    font-size: 12px;
    float: left;
    width: 81.626506024096385542%; /*271px/332px*/
}
.more-articles p {
    font-size: 11px;
    color: #a0a0a0;
}

/*=====================================
 * END: Homepage Elements: Small-screen
 *=====================================*/

/*==============================================================
 * General Article Styling - full page and summary: Small-screen
 *==============================================================*/

/* context: 350px */

/* h1 is used on the section page; h2 is used on the article page. */
.article-summaries header h1,
.article-copy.full-article header h1 {
    background: #eeeeee;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    padding: 10px 20px;
    font-size: 18px;
    margin-bottom: 10px;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
.article-copy header nav {
    text-align: center;
    overflow: hidden;
    padding-bottom: 10px;
}
.article-copy header ul {
    display: inline;
    overflow: hidden;
    line-height: 1.4em;
}
.article-copy header li {
    display: inline;
    padding: 0 7px 0 5px;
    border-right: solid 2px #d25a39;
    font-size: 14px;
    font-weight: bold;
    margin:0 !important;
}
.article-copy header li.nav-parent {
    text-transform: uppercase;
}
.article-copy header li strong {
    color: #5f5f5f;
}
.article-copy header li:first-child {
    padding-left: 0;
}
.article-copy header li:last-child {
    padding-right: 0;
    border-right-width: 0;
}
.article-copy aside.image {
    width: 44%; /*154px/350px*/
    float: left;
    margin: 0 5.714285714285714285% 10px 0; /*20px/350px*/
    -webkit-transition: width 0.3s ease;
    -moz-transition: width 0.3s ease;
    -o-transition: width 0.3s ease;
    transition: width 0.3s ease;
}
.article-copy aside.image img {
    border: solid 1px #d1cfd0;
    width: 100%;
}
.article-copy aside.published {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 20px;
    color: #5f5f5f;
}
.article-copy aside.published a {
    display: block;
    margin-bottom: 3px;
}
.article-copy aside.meta-categories {
    font-size:12px;
    margin:10px 0;
    color: #5f5f5f;
}
.article-copy aside.pullquote {
    width: 70%; /*245px/350px*/
    margin: 0 auto 20px;
    color: #7b7556;    
    line-height: 1.5em;
    font-size: 15px;
}
.article-copy aside.pullquote p {
    color: #7b7556;    
    line-height: 1.5em;
    font-size: 15px;
}
.article-copy iframe {
    max-width: 100%;
}
.article-copy footer #author_bio {
    background: #eeeeee;
    font-style: italic;
    padding: 10px;
    color: #5f5f5f;
    font-size: 12px;
    margin-bottom: 20px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
.article-copy footer {
    border-bottom: 5px solid #474747;
    margin-bottom:20px;
}
.article-copy footer #author_bio p {
    line-height: 1.7em;
    margin:0;
}
.article-copy footer #author_bio img {
    float:left;
    margin-right:10px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
}
.author-copy img {
    float:left;
    /*-webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    border-radius: 60px;*/
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    margin-right:20px;
}
.author-copy img + p,
.article-copy footer #author_bio img + p {
    padding-top:1%;
    min-height: 65px;
}
.author-copy aside {
    clear:both;
    padding-top: 20px;
}
.article-copy footer .related {
    margin-bottom: 20px;
}
.article-copy ul.social-tools, .article-copy ul.article-tools {
    font-size: 14px;
    line-height: 1.3em;
    color: #5f5f5f;
    overflow: hidden;
    margin-bottom: 5px;
}
.article-copy ul.article-tools li {
    float: left;
    display: inline-block;
    padding-right: 9px;
    border-right: solid 2px #d25a39;
    margin: 0 9px 5px 0;
}
.article-copy ul.social-tools {
}
.article-copy ul.social-tools li {
    display: block;
    float: left;
    height: 21px;
    margin: 5px 4px 10px;
}
.article-copy ul.social-tools li.sharethis .stButton {
    margin: 0;
}
.article-copy ul.social-tools li.article-like {
   width:180px;
   float:right;
   text-align: right;
}
.article-copy ul.social-tools li.article-like a { text-align:none; text-indent: -9999em !important;color:#fff; }
.article-copy ul.social-tools li.fbbutton {
   width:48px;
}
.article-copy ul.social-tools li:last-child {
   padding-left: 0;
   border-left: 0;
   margin-left: 0;
}
.article-copy ul.article-tools li:last-child {
    padding-right: 0;
    border-right: 0;
    margin-right: 0;
}
.article-copy ul.article-tools a.like {
    background: url(/assets/images/thumbs-up.png) no-repeat right center;
    padding-right: 20px;
}
.article-copy ul.social-tools li.comments {
    line-height: 20px;
}
.article-copy footer nav {
    background: #eeeeee;
    padding: 10px;
    font-size: 14px;
    overflow: hidden;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
.article-copy footer nav li.next {
    float: right;
}
.article-copy footer nav li.next a {
    background: url(/assets/images/next.png) no-repeat right center;
    padding-right: 12px;
}
.article-copy footer nav li.prev {
    float: left;
    background: url(/assets/images/prev.png) no-repeat left center;
    padding-left: 12px;
}

.article-copy aside.related h3 {
    color: #5f5f5f;
    font-size: 16px;
    margin-bottom: 12px;
}
.article-copy aside.related li {
    margin-bottom: 15px;
    font-size: 14px;
    line-height: 1.2em;
}
.article-copy aside.related li:last-child {
    margin-bottom: 0;
}
.sidebar-related {
    position: relative;
}
.sidebar-related aside.related h3 {
    color: #5f5f5f;
    font-size: 16px;
    margin-bottom: 12px;
}
.sidebar-related aside.related li {
    margin-bottom: 15px;
    font-size: 12px;
    line-height: 1.6em;
    min-height: 50px;
    position: relative;
}
.sidebar-related aside.related li a {
    display: inline-block;
}
.sidebar-related aside.related li h5 {
    font-weight: 400;
}
.sidebar-related aside.related li img {
    position:relative;
    margin-top:-2px;
    padding:2px;
    border:2px solid #eee;
    position: absolute;
    top:0;
    left:0;
}
.sidebar-related aside.related li img + h5 {
    margin-left: 90px;    
}


.article-content em {
    font-style: italic;
}
.article-content ul {
    color: #5F5F5F;
    line-height: 1.4em;
    font-size: 14px;
    margin-left: 40px;
    list-style-position: outside;
    list-style-type: square;	
}
.article-content blockquote {
    margin: 20px 40px; /* FIXME: percentize */
    font-size: 14px;
    color: #5F5F5F;
    color: #8F8F8F;
    line-height: 1.3em;
}
.article-content blockquote p {
    margin-top: 10px;
    padding-bottom: 0;
    margin-bottom: 0;
    color: #8F8F8F;
}

#listing { margin-bottom:20px; }
/*==================================================================
 * END General Article Styling - full page and summary: Small-screen
 *==================================================================*/
 
/*================================================
 * Full article page-specific styles: Small-screen
 *================================================*/
/*
section.full-article header h1 {
    color: #5f5f5f;
    font-size: 18px;
    line-height: 1.2em;
    margin-bottom: 10px;
    padding: 0;
    border: none;
    background: transparent;
}
*/
section.recent-posts article,
section.best-of-tc article {
    border-bottom: 1px solid #eee;
    margin-bottom: 30px;
    overflow: hidden;
}
section.recent-posts nav.pagination,
section.best-of-tc nav.pagination {
    border-top: 0;
}
section.recent-posts header,
section.best-of-tc header {
    margin-bottom: 15px;
    padding-bottom: 5px;
}
section.best-of-tc header {
    border-bottom: 1px solid #eee;
}

/*====================================================
 * END Full article page-specific styles: Small-screen
 *====================================================*/
 
/*======================================================
 * Subsection article page-specific styles: Small-screen
 *======================================================*/
section.article-summaries {
    margin-bottom: 20px;
}
section.article-summaries article {
    padding-bottom: 0;
}
section.article-summaries article h2 {
    font-size: 18px;
    line-height: 1.2em;
    margin-bottom: 10px;
}
section.article-summaries footer {
    padding-bottom: 10px;
    margin-bottom: 10px;
}

/*==========================================================
 * END Subsection article page-specific styles: Small-screen
 *==========================================================*/
 
/*=========================================
 * Full Article Page Comments: Small-screen
 *=========================================*/

/* context: 350px */

section.comments {
    padding-bottom: 20px;
    border-bottom: solid 1px #efefef;
    margin-bottom: 20px;
}
section.comments article.ctype-p {
    border:4px solid red !important;
}
section.comments header.copy {
    padding-top: 10px;
}
section.comments a.comment_link {
  display:inline-block;
  font-size: 13px;
  font-weight: normal;
  text-transform: lowercase;
}
section.comments a.comment_link span {
    display: inline-block;
    width:16px;
    height: 13px;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) -48px -65px no-repeat;
    margin-right:4px;
    position: relative;
    top:2px;
}
section.comments h2#leave-a-comment,
section.comments h2#comment {
    color: #5f5f5f;
    font-size: 16px;
    padding: 0 0 12px;
    border-bottom: solid 1px #e5e5e5;
    background-color: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    margin: 0;
}
section.comments h2.guest-account {
    margin-top:20px;
}
section.comments h2#leave-a-comment,
section.comments p#leave-a-comment {
    clear: both;
    padding-top: 15px;
}
section.comments h2#leave-a-comment a {
    font-weight: normal;
    font-size: 12px;
    padding-left: 10px;
}
section.comments header form {
    margin-top: 12px;
}
body.nojs section.comments header form.login {
    margin-top: 30px;
}
section.comments header .social_login h2 {
	margin-bottom:0 !important;
}
.transition {
	margin:10px 0;
	background-color:yellow;
	padding:10px;
	line-height:1.4em;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}
.transition a {text-decoration:underline;}
section.comments .input-group {
    margin:10px 0;
}
section.comments .input-group strong {
    font-size: 14px;
}
section.comments header p.controls {
    float: none;
    margin: 0;
}
section.comments header p.controls a {
    font-size: 12px;
    padding-left: 5px;
}
section.comments header textarea {
    height: 200px;
    width: 100%;
}
section.comments .login {
    background-color: #eeeeee;
    padding: 10px 2.857142857142857142% 22px; /*10px/350px*/
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}
section.comments .login h2 {
    font-size: 14px;
    line-height: 14px;
    margin: -30px 0 16px;
}
body.js section.comments .create-account {
   
}
section.comments .create-account h2 {
    margin: 0 0 6px;
}
section.comments .firstname {
    width: 43.714285714285714285%; /*153px/350px*/
    float: left;
}
section.comments .lastname {
    width: 43.714285714285714285%; /*153px/350px*/
    float: right;
}
section.comments .new-username {
    clear: left;
}
section.comments h2,
section.comments .comment_link {
    font-size: 14px;
    margin: 25px 0 -16px; /* first article has 22px top margin; this yields an effective 6px margin between the h2 and the first comment */
}
section.comments article div.comment-wrapper {
    overflow: hidden;
}
section.comments article div.comment-body {
    padding: 10px 4.285714285714285714%; /*15px/350px*/
    width: 63.142857142857142857%; /*221px/350px*/
    margin-top: 22px;
    background: #eeeeee;
    font-size: 13px;
    line-height: 1.4em;
    color: #5f5f5f;
    float: left;
    clear: left;
    -webkit-border-radius: 12px 0 0 12px;
    -moz-border-radius: 12px 0 0 12px;
    border-radius: 12px 0 0 12px;
    position: relative;
    behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
}

section.comments article div.comment-body p {
    margin:10px 0 !important;
}

/* all nested comments */
section.comments article article {
    clear: left;
    background: url(/assets/images/comment-parent.png) no-repeat 1.428571428571428571% 22px; /*5px/350px*/
}

/* first reply */
section.comments article article div.comment-body {
    margin-left: 4.857142857142857142%; /*17px/350px*/
    width: 58.285714285714285714%; /*204px/350px*/
    background: #fafafa;
}
/* second reply */
section.comments article article article {
    background-position: 6.285714285714285714% 22px; /*22px/350px*/
}
section.comments article article article div.comment-body {
    margin-left: 9.714285714285714285%; /*34px/350px*/
    width: 53.428571428571428571%; /*187px/350px*/
}
/* third reply */
section.comments article article article article {
    background-position: 11.142857142857142857% 22px; /*39px/350px*/
}
section.comments article article article article div.comment-body {
    margin-left: 14.571428571428571428%; /*51px/350px*/
    width: 48.571428571428571428%; /*170px/350px*/
}
/* fourth reply */
section.comments article article article article article {
    background-position: 16% 22px; /*56px/350px*/
}
section.comments article article article article article div.comment-body {
    margin-left: 19.428571428571428571%; /*68px/350px*/
    width: 43.714285714285714285%; /*153px/350px*/
}

section.comments aside.author {
    margin: 32px 0 0 2.571428571428571428%; /*9px/350px*/
    width: 25.714285714285714285%; /*90px/350px*/
    float: right;
    font-size: 11px;
    color: #696969;
    position: relative;
}

/* context: 90px */

section.comments aside.author img {
    width: 61.111111111111111111%; /*55px/90px*/
    margin-bottom: 5px;
}
section.comments aside.author strong {
    color: black;
    font-size: 12px;
}
section.comments aside.author time {
    display: block;
    margin-top: 5px;
}
section.comments aside.moderation {
    overflow: hidden;
    clear: both;
    font-size: 14px;
    padding-top: 5px;
    border-bottom: solid 1px #b2b2b2;
    margin: 0 -5.714285714285714285%; /*20px/350px*/
    padding: 5px 5.714285714285714285%; /*20px/350px*/
}
section.comments aside.moderation h3 {
    float: left;
    margin-right: 8px;
}
section.comments aside.moderation ul.actions {
    float: left;
}
section.comments aside.moderation ul.actions li {
    float: left;
    padding-right: 8px;
    border-right: solid 2px #444;
    margin-right: 8px;
}
section.comments aside.moderation ul.actions li button {
    padding:0;
    margin:0;
    color:#C52A00;
    background:white;
    border:0;
}
section.comments aside.moderation ul.actions li button:hover {
    cursor:pointer;cursor:hand;
    text-decoration:underline;
}
section.comments aside.moderation ul.actions li form {
    padding:0;
    margin:0;
    width:auto;
    height:auto;
}
section.comments aside.moderation ul.actions li:last-child {
    padding: 0;
    border-right: none;
    margin: 0;
}
section.comments aside.moderation form {
    color: #7f7f7f;
    padding-top: 5px;
    clear: left;
    overflow: hidden;
}
section.comments aside.moderation label {
    display: block;
}
section.comments aside.moderation textarea {
    width: 98%;
    height: 100px;
    border: solid 1px #c3b7aa;
    margin: 3px 0;
}
#new-reply-comment {
    width:98%;
    height:100px;
    border: solid 1px #c3b7aa;
    margin: 3px 0;
}
#comment_reply {
    display:none;
}

section.comments aside div.like-it,
section.comments aside div.top-comment-star {
    float:right;
    width:100%;
    display: block;
    margin: 8px 0;
    font-size:1.2em;
}
section.comments aside div.top-comment-star span {
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -96px -66px;
    width:16px;
    height:16px;
    display: inline-block;
    position: relative;
    top:2px;
}
section.comments aside div.like-it { 
    font-size: 1em;
    position: relative;
    left:2px;
}

.thumbs-up,
.thumbs-down {
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat;
    width:24px;
    height:24px;
    display: inline-block;
    text-indent: -999em;
    margin-bottom:4px;
     -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    opacity: 0.7;
}
.thumbs-up { background-position: -136px -66px; }
.thumbs-down { background-position: -112px -66px; }

.thumbs-up:hover,
.thumbs-down:hover { opacity: 0.9; }


section.comments aside.author .comment-meta { 
    display: none;
}

section.comments aside.moderation label.featured {
    float: left;
}
section.comments aside.moderation ul {
    float: right;
}
section.comments aside.moderation li {
    display: inline;
}
section.comments aside.moderation button {
    margin-left: 10px;
}
section.comments .load-more {
    margin: 30px auto 20px;
    text-align: center;
}
section.comments .load-more img { vertical-align: middle; }
section.comments .load-more  {
    width:250px;
    border: solid 1px #c52a00;
    color: #c52a00;
    background-color: white;
    font-size: 14px;
    line-height: 14px;
    padding: 15px 20px;
    cursor: pointer;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
section.comments .load-more .load-more-btn:hover {
    background-color: #c52a00;
    color: white;
    text-decoration: none;
}
 
 .
/*=============================================
 * END Full Article Page Comments: Small-screen
 *=============================================*/

/*=================================================
 * Pagination on article summary page: Small-screen
 *=================================================*/
section nav.padding-bottom { text-align: center !important; }
nav.pagination {
    text-align: center !important;
    padding: 10px 0;
    /*border-top: solid 1px #EFEFEF;
    border-bottom:1px solid #000;*/
}
nav.pagination ul {
    overflow: hidden;
    display: inline-block;
}
nav.pagination li {
    float: left;
    display: block;
    margin: 0 2px;
}
nav.pagination a, nav.pagination strong {
    display: block;
    text-align: center;
    width: 19px;
    height: 19px;
    font-size: 14px;
    line-height: 21px;
    border: solid 1px #c52a00;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
nav.pagination strong {
    color: #999999;
    border-color: #999999;
}
nav.pagination a:hover {
    color: white;
    background-color: #c52a00;
    text-decoration: none;
}
/*
nav.pagination li.arrow {
    width: 24px;
    height: 21px;
    background: transparent url(/assets/images/icons.png) no-repeat left 5px;
    margin-right: 10px;
}

nav.pagination li.arrow a:hover {
    background-color: transparent;
}
nav.pagination li.next {
    background-position: 0 -17px;
    margin-right: 0;
    margin-left: 10px;
}
nav.pagination li.arrow a {
    border: none;
    width: auto;
    text-indent: -9999px;
}*/
nav.pagination li.nolink {
display: block;
text-align: center;
width: 19px;
height: 19px;
font-size: 14px;
line-height: 21px;
border: solid 1px #999999;
color: #999999;   
}
nav.pagination li .paginate_info {
 font-size: 14px;
 line-height: 24px;
 vertical-align: bottom;
 margin-right: 10px;
}
nav.pagination li .paginate_info em {
font-weight: bold;
font-size: 16px;
font-style:normal;
}
/*=====================================================
 * END Pagination on article summary page: Small-screen
 *=====================================================*/
 
/*==============================
 * Contact us page: small-screen
 *==============================*/

.contact-us {
    padding-bottom: 10px;
    border-bottom: solid 1px #c3c3c3;
    margin-bottom: 10px;
}
.contact-us .vcard {
    color: #5f5f5f;
    line-height: 1.3em;
    font-size: 14px;
    margin-bottom: 20px;
}

/*==================================
 * END Contact us page: small-screen
 *==================================*/
 
/*==============================
 * Register page: small-screen
 *==============================*/

.register-form .checkbox_terms input[type="checkbox"] {
    display: inline;
    width: auto;
    margin: 0 1.7142857% 0 0; /*6px/350px*/
}

.register-form .checkbox_terms label {
    display: inline;
}

p.note,
.register-form .note {
    color: #999;
    font-size: 11px;
    font-weight: normal;
    display: block;
    margin-bottom: 10px;
}
.register-form .toright { 
    text-align:right;
}
.register-form fieldset {
    border:1px solid #eee;
    margin:20px 0;
    padding:20px;
}
#create-account .note {
    color: #999;
    font-size: 11px;
    font-weight: normal;
    display: block;
}
.register-form .input-group .note {
    margin-top: 2px;
    margin-bottom: 2px;
}

/*==================================
 * END Register page: small-screen
 *==================================*/
 
/*============================
 * About us page: small-screen
 *============================*/

#contributors { margin-top:30px;}
.contributors article {
    border-bottom: solid 1px #dfdfdf;
    padding: 10px 0;
    margin-bottom: 20px;
}
.contributors aside {
    line-height: 1.3em;
    font-size: 14px;
}
.contributors h3 {
    color: #5f5f5f;
}
.reframe-copy img {
    float: left;
    width: 43.428571428571428571%; /*152px/350px*/
    max-width: 218px;
    margin: 54px 4.857142857142857142% 54px 0; /*17px/350px*/
}
 
/*================================
 * END About us page: small-screen
 *================================*/
 
/*======================================
 * Comment moderation page: small-screen
 *======================================*/

/* context: 350px */

.comment-moderation form.filter-sort label {
    display: block;
    font-size: 12px;
    font-weight: bold;
}
.comment-moderation form.filter-sort em {
    font-size: 12px;
    color: #808080;
}
.comment-moderation fieldset.filter {
    margin: 0 -5.714285714285714285%; /*20px/350px*/
    border-bottom: double 3px #f7f7f7;
    padding: 0 5.714285714285714285%; /*20px/350px*/
    padding-bottom: 12px;
}
.comment-moderation form.filter-sort div {
    float: left;
}
.comment-moderation form.filter-sort nav {
    padding-top: 14px;
    float: right;
}
.comment-moderation nav.prevnext {
    font-size: 14px;
}
.comment-moderation nav.prevnext a {
    text-indent: -9999px;
    display: inline-block;
    width: 24px;
    height: 21px;
    background: transparent url(/assets/images/icons.png) no-repeat left top;
}
.comment-moderation nav.prevnext a.next {
    background-position: 0 -22px;
}
.comment-moderation fieldset.sorting {
    padding: 12px 0;
}

.comment-moderation .column-headers {
    color: white;
    background-color: #7f7f7f;
    font-size: 16px;
    margin: 0 -5.714285714285714285%; /*20px/350px*/
    overflow: hidden;
}

/* context: 390px (negative margin makes .column-headers wider) */

.comment-moderation .column-headers h3 {
    font-weight: normal;
    float: left;
    padding: 7px 0;
}
.comment-moderation .column-headers .comment {
    width: 64.102564102564102564%; /*250px/390px*/
    margin-left: 5.128205128205128205%; /*20px/390px*/
    border-right: solid 1px #ffffff;
}
.comment-moderation .column-headers .author {
    margin-left: 2.564102564102564102%; /*10px/390px*/
}

/* context: 350px */

.comment-moderation .comment-wrapper h3 {
    font-size: 14px;
    margin: 10px 0;
}
.comment-moderation section.comments article div.comment-body {
    margin-top: 0;
}
.comment-moderation section.comments aside.author {
    margin-top: 10px;
}
.comment-moderation section.comments {
    padding-bottom: 0;
    border-bottom: 0;
    margin-bottom: 0;
    overflow: visible;
}
.comment-moderation article {
    border-bottom: solid 1px #b2b2b2;
    padding-bottom: 12px;
    margin: 0 -5.714285714285714285%; /*20px/350px*/
}

/* context: 390px */

.comment-moderation article div.comment-wrapper {
    overflow: hidden;
    margin: 0 5.128205128205128205%; /*20px/390px*/
}
.comment-moderation article aside.moderation {
    margin: 0 5.128205128205128205%; /*20px/390px*/
    padding-left: 0;
    padding-right: 0;
    border-bottom: 0;
}

/* context: 350px */

/* the bottom pagination nav inherits from prevnext and has some additional styling */
.comment-moderation nav.foot {
    margin: 0 -5.714285714285714285%; /*20px/350px*/
    margin-bottom: 20px;
    overflow: hidden;
    border-bottom: solid 1px #b2b2b2;
    padding: 20px 5.714285714285714285%; /*20px/350px*/
}
.comment-moderation nav.foot div {
    float: right;
}

.caption {
    font-size: 11px;
    font-style: italic;
}
.header-link { float:right; font-size: .7em; z-index:99; position: relative; top:15px; right:10px;}
/*==========================================
 * END Comment moderation page: small-screen
 *==========================================*/

 
/* make articles side-by-side before full tablet layout is invoked */
@media screen and (min-width: 700px) {
    
    /* allow more gutters on the sides of the main content */
    #wrapper {
        width: 96.10945274%;
    }

    /* realign nav.main */
    nav.main ul {
        width: 74.129353233830845771%; /*745px/1005px*/
    }
    nav.main li {
        margin-right: 0;
    }
    
    /* realign the content margin */
    #header, #content {
        margin: 0 2.547770700636942675%; /*20px/785px*/
    }
   .smallscreen {
        display: none;
    } 
    span.bigscreen {
        display: inline;
    }
    /* move the search form */
    #header {
        overflow: hidden;
        margin-bottom: 10px;
    }
    #header a.identity {
        display: block;
        float: left;
        width: 46.979865771812080536%; /*350px/745px*/
    }
    #header form {
        width: 46.979865771812080536%; /*350px/745px*/
        float: right;
        margin-top: 5px;
        font-size:12px;
    }
    #header form p {
        font-weight:700;
        margin:2px 0 6px 4px;
    }
    /* content div contains some floated elements */
    #content {
        overflow: hidden;
    }

    /*================================
     * Main article (homepage): Tablet
     *================================*/
     
     /* context: 745px */
     
    .articles article.main {
        padding: 1.208053691275167785%; /*9px/745px*/
        padding-bottom: 20px;
        overflow: hidden;
        line-height: 1.4em;
    }
    
    /* context: 727px */
    
    .articles article.main aside a {
        display: block;
        line-height: 1em;
    }
    .articles article.main aside {
        float: left;
        width: 45.529573590096286107%; /*331px/727px*/
    }
    .articles .full-article {
        float: right;
        width: 46.905089408528198074%; /*341px/727px*/
    }
    .articles article.main footer {
        margin-top: 1em;
        float: left;
        clear: left;
        width: 45.529573590096286107%; /*331px/727px*/
    }
    .articles header h3 {
        font-size: 18px;
        line-height: 1.4em;
    }
    
    section.comments aside.author .comment-meta { 
        font-size:.8em;
        position: absolute;
        bottom:5px;
        right:0;
        display: inline-block;
    }
    section.comments aside.author .comment-meta span { 
        position:relative;
        bottom:0px; 
    }
    section.comments aside.author .comment-meta span.c-left {  width:30%; left:0px; }
    section.comments aside.author .comment-meta span.c-right { width:60%; right:18px; text-align: right; }    
    /*====================================
     * END Main article (homepage): Tablet
     *====================================*/
     
    /*=================================
     * More articles (homepage): Tablet
     *=================================*/
     
    /* context: 745px */
    
    .more-articles {
        margin: 0;
        padding: 1.208053691275167785%; /*9px/745px*/
    }
    
    /* context: 727px */
    
    .more-articles ul {
        overflow: hidden;
    }
    .more-articles h3 {
        font-size: 13px;
    }
    .more-articles li {
        float: left;
        border: 0;
        margin: 0;
        padding: 0;
        min-height: 100px;
        /* applies to second and third articles; overridden later for first 
           and last */
        width: 24.071526822558459422%; /*175px/727px*/
        margin-right: 1.2379642%; /*9px/727px*/
    }
    .more-articles li aside {
        float: none;
        margin-bottom: 9px;
        width: 100%; /* 175px */
    }
    .more-articles li .article-summary {
        width: 100%; /* 175px*/
    }
    .more-articles li:first-child .article-summary {
        width: 99.3975904%; /*165px/166px*/
    }
    
    /* fourth article: reference width of 142px */
    /* .last class is for IE8 and IE7, which do not implement :last-child, and 
       selectivizr doesn't see these rules as they are inside a media query */
    .more-articles li:last-child,
    .more-articles li.last {
        margin: 0;
    }
    .more-articles li:last-child .article-summary,
    .moare-articles li.last .article-summary {
        width: 99.2957746%; /*141px/142px*/
    }
    
    /*=====================================
     * END More articles (homepage): Tablet
     *=====================================*/

    /*===========================================
     * Recent articles (homepage): Tablet
     *===========================================*/
    .recent-articles {
        float: left;
    }

    .top-comments.main {
        float: right;
        width: 46.9799%;
    }

    /* other elements in the right column */
    section.twitter {
        width: 46.979865771812080536%; /*350px/745px*/
        border: none;
        margin: 0 0 25px 0;
        float: right;
        clear: right;
    }

    /* recent articles is in the left column */
    .recent-articles {
        width: 46.979865771812080536%; /*350px/745px*/
    }
    
    /*===========================================
     * END Recent articles (homepage): Tablet
     *===========================================*/
     
    /*===========================================
     * Full article (article detail page): Tablet
     *===========================================*/
    
    /* context: 745px */

    .article-copy aside.image {
        width: 46.979865771812080536%; /*350px/745px*/
        margin-right: 1.610738255033557046%; /*12px/745px*/
    }
    .article-copy aside.pullquote {
        float: right;
        width: 46.979865771812080536%; /*350px/745px*/
        margin-left: 5.369127516778523489%; /*40px/745px*/
        font-size: 18px;
    }
    .article-copy aside.pullquote p {
        font-size: 18px;        
    }
    .article-copy footer p {
        margin-right: 4.1338583%; /*21px/508px*/
        /*width: 44.0944882%; *//*224px/508px*/
    }
    .article-copy footer .related {
        float: right;
        margin-bottom: 0;
        width: 47.5%;
    }
    .article-copy ul.social-tools {
       clear: left;
    }
    
    /*===============================================
     * END Full article (article detail page): Tablet
     *===============================================*/
    
    /*==================================================
     * Category header (article, category pages): Tablet
     *==================================================*/
    .article-summaries header h1,
    .full-article header h1 {
        font-size: 20px;
    }
    .article-copy header nav {
        text-align: left;
        padding-left: 20px;
    }
    /*======================================================
     * END Category header (article, category pages): Tablet
     *======================================================*/
 
    .top-comments article {
        margin: 10px 20px;
    }

    .top-comments.sidebar aside {
        width: 100px;
    }
    /*===============================================
     * Comments section (article detail page): Tablet
     *===============================================*/
    
    /* context: 745px */
    
    section.comments {
        overflow: hidden;
    }
    section.comments header form {
        width: 46.979865771812080536%; /*350px/745px*/
    }
    section.comments header form.full {
  	width: 73.422818791946308724%;
  	border-right:  solid 8px white;
    }
    section.comments header form.login {
        padding: 10px 1.342281879194630872%; /*10px/745px*/
        width: 44.295302013422818791%; /*330px/745px*/
    }
    section.comments header .social_login {
		float:right;
		width:40%;
	}
	section.comments header .mobile_login {
		display:none;
	}
    section.comments h2 {
        margin: 20px 0 0 0;
    }
    section.comments h2#comments,
    section.comments .comment_link {
        color: #5f5f5f;
        float: left;
        margin-bottom: 10px;
    }
    section.comments h2#comments {
        font-size: 16px;
    }
    section.comments .comment_link {
        line-height: 16px;
        margin-left: 10px;
        margin-top: 20px;
        color: #c62a01;
        float:right;
    }
    section.comments article {
        clear: left;
        margin-top: 9px;
    }
    section.comments article.ctype-c {
        color:#eee !important;
    }
    section.comments div.comment-wrapper {
        display: table;
        width: 100%;
    }
    section.comments article div.comment-body {
        display: table-cell;
        vertical-align: top;
        background-color: #eee;
        margin: 0;
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 2.147651006711409395%; /*16px/745px*/
        padding-right: 4.697986577181208053%; /*35px/745px*/
        
        /* display table-cell means padding does not need to be subtracted 
           from target width */
        width: 73.422818791946308724%; /*547px/745px*/
        float: none;
        border-right: solid 8px white;
    }
    html.ie8 section.comments article div.comment-body {
        padding-left: 16px;
        padding-right: 35px;
    }
    
    /* applies to all nested comment replies */
    section.comments article article {
        overflow: hidden;
        clear: right;
    }
    section.comments article article div.comment-wrapper {
        float: right;
    }
    section.comments article article div.comment-body {
        margin-left: 0;
    }
    
    /* author image for all comments */
    section.comments aside.author {
        background-color: #eee;
        display: table-cell;
        margin: 0;
        padding-top: 10px;
        padding-bottom: 20px;
        padding-left: 1.342281879194630872%; /*10px/745px*/
        width: 26.308724832214765100%; /*196px/745px*/
        overflow: hidden;
        float: none;
        -webkit-border-radius: 0 12px 12px 0;
        -moz-border-radius: 0 12px 12px 0;
        border-radius: 0 12px 12px 0;
        position: relative;
        behavior: url(https://dnvbry4stcg1.cloudfront.net/assets/js/PIE.htc);
    }
    section.comments article article aside.author {
        background-color: #fafafa;
    }
    /* context: 186px */
    
    section.comments aside.author img {
        width: 29.032258064516129032%; /*54px/186px*/
        margin-right: 5.913978494623655913%; /*11px/186px*/
        margin-bottom: 0;
        float: left;
    }
    
    section.comments aside.author div {
        float: left;
        width: 60.204081632653061224%; /*118px/196px*/
    }

    /* style nested comments, up to 4 nesting levels deep */
    
    /* Where N is the nesting level
        - background-x-position is N*20-9px
        - comment-wrapper width is 745-(N*20)
        - comment-body is          ($commentWrapper-197)/$commentWrapper
        - aside.author is          197/$commentWrapper
    */
    
    /* N=1 */
    section.comments article article {
        background-position: 1.476510067114093959% 10px; /*11px/745px*/
    }
    section.comments article article div.comment-wrapper {
        width: 97.315436241610738255%; /*725px/745px*/
    }
    section.comments article article div.comment-body {
        width: 72.827586206896551724%; /*528px/725px*/
    }
    section.comments article article aside.author {
        width: 27.172413793103448275%; /*197px/725px*/
    }
    
    /* N=2 */
    section.comments article article article {
        background-position: 4.161073825503355704% 10px; /*31px/745px*/
    }
    section.comments article article article div.comment-wrapper {
        width: 94.630872483221476510%; /*705px/745px*/
    }
    section.comments article article article div.comment-body {
        width: 72.056737588652482269%; /*508px/705px*/
    }
    section.comments article article article aside.author {
        width: 27.94326241134751773%; /*197px/705px*/
    }
    
    /* N=3 */
    section.comments article article article article {
        background-position: 6.845637583892617449% 10px; /*51px/745px*/
    }
    section.comments article article article article div.comment-wrapper {
        width: 91.946308724832214765%; /*685px/745px*/
    }
    section.comments article article article article div.comment-body {
        width: 71.240875912408759124%; /*488px/685px*/
    }
    section.comments article article article article aside.author {
        width: 28.759124087591240875%; /*197px/685px*/
    }
    
    /* N=4 */
    section.comments article article article article article {
        background-position: 9.530201342281879194% 10px; /*71px/745px*/
    }
    section.comments article article article article article div.comment-wrapper {
        width: 89.261744966442953020%; /*665px/745px*/
    }
    section.comments article article article article article div.comment-body {
        width: 70.375939849624060150%; /*468px/665px*/
    }
    section.comments article article article article article aside.author {
        width: 29.624060150375939849%; /*197px/665px*/
    }
    
    /* context: 745px */
    
    section.comments aside.moderation form {
        width: 72.348993288590604026%; /*539px/745px*/
    }
    section.comments aside.moderation textarea {
        width: 98.886827458256029684%; /*533px/539px*/
    }
     
    section.comments #comment_form {
        margin:0 0 20px;
    }
    /*===================================================
     * END Comments section (article detail page): Tablet
     *===================================================*/
     
    /*=========================
     * Sub-section page: Tablet
     *=========================*/
    
    /* context: 745px */
    
    .article-summaries aside.published a {
        float: left;
        padding-right: 10px;
        border-right: solid 1px #C62A01;
        margin-right: 10px;
    }
    .article-summaries article {
        margin-bottom:40px;

    }
    .article-summaries aside.image {
        width: 20.402684563758389261%; /*152px/745px*/
        margin-right: 2.818791946308724832%; /*21px/745px*/
    }
    
    .article-summaries footer {
        clear: left;
    }
    
    /*=============================
     * END Sub-section page: Tablet
     *=============================*/
     
    /*===================
     * Contact Us: Tablet
     *===================*/
    
    .contact-us, .about-us {
        width: 46.979865771812080536%; /*350px/745px*/
        float: left;
        border-bottom: 0;
        padding-bottom: 0;
        margin-bottom: 0;
    }
    
    /*=======================
     * END Contact Us: Tablet
     *=======================*/
     
    /*=================
     * Register: Tablet
     *=================*/
    
    .register-form {
        width: 46.979865771812080536%; /*350px/745px*/
        float: left;
        border-bottom: 0;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    /*=====================
     * END Register: Tablet
     *=====================*/

    /*=======================
     * Search Results: Tablet
     *=======================*/
   
    .search-results header {
        margin-bottom: 20px;
    }

    .copy.search-results header label, .copy.search-results header p {
        color: #7F7F7F;
        font-weight: bold;
    }

    .copy .num-results {
        float: left;
        line-height: 20px;
        margin-bottom: 10px;
    }

    .search-sort {
        overflow: hidden;
        float: right;
        width: auto;
        border:none;
        padding: 0;
    }

    .search-sort * {
        float: left;
        margin: 0 4px;
    }

    .search-sort label {
        line-height: 20px;
    }

    .search-sort input[type="radio"] {
        display: none;
    }

    label.sort {
        width: 12px;
        height: 8px;
        margin-top: 8px;
        display: block;
        text-indent: -9999px;
        cursor: pointer;
    }
    /*
    label.sort.asc {
        background: url(/assets/images/sort-down.png) no-repeat center;
    }

    label.sort.desc {
        background: url(/assets/images/sort-up.png) no-repeat center;
    }*/

    .search-options {
        overflow: hidden;
        clear: both;
        border-bottom: 1px solid #EEE;
        color: #7F7F7F;
        font-weight: bold;
        font-size: 14px;
    }
    .search-options p.results {
        font-weight: normal;
    }
    .search-filter {
        padding: 10px 0;
        float: left;
    }

    .search-filter * {
        float: left;
        margin-right: 10px;
    }

    .search-filter label {
        line-height: 22px;
    }
    .search-filter button {
        margin-left:30px;
        margin-top:-5px;
    }
    .search-filter-sort {
        float:right;
    }
    .filter-cat {
        margin-left: 20px;
    }
    .result-filter label {
        display: inline;
    }
    .result-filter input {
        display: inline;
    }

    /*===========================
     * END Search Results: Tablet
     *===========================*/

        /* other elements in the right column */
    body.home .sidebar-item {
        width: 46.979865771812080536%; /*350px/745px*/
        border: none;
        margin: 0 0 25px 0;
        float: right;
        clear: right;
    }
    /* twitter has some internal padding, so we re-calc. the width */
    section.twitter {
        width: 44.295302013422818791%; /*330px/745px*/
        padding: 10px 1.342281879194630872%; /*10px/745px*/
    }
    section.twitter .twtr-widget .twtr-tweet {
        border-top: 1px solid #C3C3C3;
    } 
    /* remove some height from social */
    .social {
        padding-top: 0;
    }
    .social.mini {
        width: 100%;
        margin: 0 !important;
	    display: block;
    }
    .social.mini ul {
        text-align: left;
    }
    /* make the categories listing a 3x2 grid (it will be moved up top in 
       wider layouts) */
    .categories {
        clear: left;
        margin-bottom: 10px;
    }
    .categories ul {
        overflow: hidden;
        list-style: none !important;
    }
    .categories li {
        float: left;
        margin-right: 2.684563758389261744%; /*20px/745px*/
        width: 31.543624161073825503%; /*235px/745px*/
        padding: 10px 0;
    }
    
    .categories > ul > li:nth-child(3n) {
        margin-right: 0;
    }
    /* last-in-row is added by JS to IE8 */
    .categories li.last-in-row {
        margin-right: 0;
    }
    .categories a {
        text-align: center;
    }
    
    /* on pages with no top comments, move categories to the top of the content and 
       leave room on other elements for it */
    .no-top-comments #content {
        position: relative;
    }
    .no-top-comments .megamenu {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
    }
    .no-top-comments .categories {
        border: solid 1px #e5e5e5;
        border-width: 1px 0;
        padding: 10px 0;
    }
    .no-top-comments .content, .no-top-comments .social,
    .no-top-comments .promotion {
        margin-top: 198px;
    }
    
    /* linearize the footer */
    #footer {
        /*width: 78.109452736318407960%; 785px/1005px*/
        width: 96.10945274%;
        height: 132px; /* set height explicitly to allow lines to extend from bottom to top */
        padding: 0;
    }
    #footer div.row {
        float: left;
        padding: 0;
        border: none;
        height: 100%;
        width: 50.063694267515923566%; /*393px/785px*/
    }
    #footer div.row:first-child {
        width: 49.936305732484076433%; /*392px/785px*/
    }
    #footer section {
        padding-top: 10px;
        height: 100%;
    }
    #footer section.location, #footer section.contact {
        border-right: solid 1px #a3a3a3;
    }
    #footer section.location {
        width: 44.132653061224489795%; /*173px/392px*/
        padding-left: 5.102040816326530612%; /*20px/392px*/
    }
    #footer section.contact {
        width: 44.897959183673469387%; /*176px/392px*/
        padding-left: 5.102040816326530612%; /*20px/392px*/
    }
    #footer section.basics {
        width: 38.931297709923664122%; /*153px/393px*/
        padding-left: 5.089058524173027989%; /*20px/393px*/
    }
    #footer section.company {
        width: 51.145038167938931297%; /*201px/393px*/
    }

/* Comment Moderation */
    .content.comment-moderation section.comments {
        width: 100%;
    }
    .content.comment-moderation .comment-wrapper {
        margin: 0;
    }
    .content.comment-moderation .comment-body,
    .content.comment-moderation .author {
        display: inline;
        float: left;
        margin-right: 0;
    }
    .content.comment-moderation .comment-body {
        width: 64.102564102564102564%;
        min-height: 60px;
    }
   .content.comment-moderation section.comments aside.author {
        margin-top: 0;
        min-height: 60px;
        max-width: 25%;
        width: auto;
    }
    .content.comment-moderation section.comments article {
        margin: 0;
    }
    .content.comment-moderation #moderate fieldset {
        float: left;
        display: inline;
    }
    .content.comment-moderation #moderate fieldset.sorting {
        padding: 0 12px;
    } 
}

@media screen and (min-width: 850px) {

    /*only use the large image at a size that can support it*/
    #footer section.company h4 {
        width: 200px;
        height: 39px;
        margin-bottom: 10px;
    }
    #footer section.company h4 a {
        width:200px;
        height:39px;
        background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -155px 0px;
    }
}
@media screen and (max-width: 1005px) {
    nav.main li.social-head { display: none; }
    nav.main li.login:after {
        content: '|';
        color: white;
    }
    .desktop-hide { display:inline !important; }
}

/* 'tablet' layout: >= 1005px */
@media screen and (min-width: 1005px) {
    /* make the top categories area taller */
    #wrapper {
        margin-top: 40px;
       /*width: 82.0895522%; /*825px/1005px*/
        width: 98%; /*825px/1005px*/
    }
    .megamenu {
        padding-top: 0;
        border-top: none;
        margin-top: 0;
    }
   
    span.biggerscreen {
	   display: inline;
    }
    .smallerscreen {
      	display: none;
    } 
    /* undo the nav.main settings from smallscreen, and display it above the 
       search form */
    nav.main {
        position: relative;
        height: auto;
        background: transparent;
        overflow: auto;
        font-size: 12px;
        width: 46.979865771812080536%; /*350px/745px*/
        top: auto;
        left: auto;
        float: right;
    }
    nav.main a {
        color: #c62a01;
    }
    nav.main ul {
        width: 100%;
        margin: 0;
    }
    nav.main li {
        margin: 0;
    }
    nav.main li.register:after {
        color: black;
    }
    
    .search-error {
        width:300px;
    }
    
    /* move the categories up into the top nav, and undo settings for the 'no top 
       comments' pages */
    .megamenu {
        background: #454545;
        left: 0;
        padding: 0;
        position: absolute;
        top: 0;
        width: 100%;
    }
    .article-copy .megamenu ul { list-style: none !important; }
    .article-copy .megamenu ul li { margin-left:0 !important; }
    .no-top-comments #content {
        position: static;
    }
    .no-top-comments .content, .no-top-comments .social,
    .no-top-comments .promotion {
        margin-top: 0;
    }
    .categories, .no-top-comments .categories {
        width: 80.8955224%; /*813px/1005px*/
        height: 40px;
        line-height: 40px;
        overflow: visible;
        margin: 0 auto;
        padding: 0;
        border: none;
    }
    .categories p {
        line-height: 40px;
        float: left;
        margin: 0 4px 0 0;
    }
    .categories ul {
        float: left;
        overflow: hidden;
        margin-top: 8px;
        list-style: none;
    }
    .categories li {
        width: auto;
        height: 22px;
        line-height: 22px;
        float: left;
        font-size: 11px;
        font-weight: normal;
        -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        padding: 0 3px;
        margin: 0 3px 0 0 !important; /* earlier nth-child selector overrides this */
        -webkit-transition: height, line-height, margin, padding, font-size 0.3s ease;
        -moz-transition: height, line-height, margin, padding, font-size 0.3s ease;
        -o-transition: height, line-height, margin, padding, font-size 0.3s ease;
        transition: height, line-height, margin, padding, font-size 0.3s ease;
    }
    .categories li.best-btn {
        height: 20px;
        -webkit-transition: height, line-height, margin, padding, font-size 0.3s ease;
        -moz-transition: height, line-height, margin, padding, font-size 0.3s ease;
        -o-transition: height, line-height, margin, padding, font-size 0.3s ease;
        transition: height, line-height, margin, padding, font-size 0.3s ease;
    }
    .categories li.best-btn a {
        line-height: 20px;
    }
    .categories li.active {
        background: #333333;
        -webkit-border-radius: 6px 6px 0 0;
        -moz-border-radius: 6px 6px 0 0;
        border-radius: 6px 6px 0 0;
        -webkit-transition: background 0.3s ease;
        -moz-transition: background 0.3s ease;
        -o-transition: background 0.3s ease;
        transition: background 0.3s ease;
    }
    .categories li.active a.top {
        color: #ffffff;
    }
    
    /* the mega-menu on each category */
    body.nojs .categories div {
        display: none;
    }
    .categories div {
        display: block;
        z-index: -1;
        opacity: 0;
        filter: alpha(opacity=0);
        position: absolute;
        background: #333333;
        margin-left: -75px;
        padding: 6px;
        -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        width: 61.188811188811188811%; /*700px/1144px*/
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }
    .categories li.right div {
        margin-left: -420px;
    }
    .categories li.active div {
        opacity: 0.95;
        filter: alpha(opacity=95);
        z-index: 10;
    }
    .categories div section { 
        float: left;
        width: 25%;
        margin-top: 20px;
    }
    .categories div section:nth-child(4n+1) {
        clear: left;
    }
    /* for IE8 and below, class is added by JS */
    .categories div section.last-in-row {
        clear: left;
    }
    .categories div section.first {
        margin-top: 0;
    }
    .categories div footer {
        clear: both;
        float: right;
    }
    .categories div footer a {
        color: #C95F45;
    }   
    .categories div ul {
        float: none;
        margin: 0;
    }
    .categories div li {
        background-color: transparent;
        float: none;
        width: auto;
        height: auto;
        margin: 0 !important;
        padding: 0;
        border: none;
        border-radius: 0;
        line-height: 1.2em;
        padding: 3px 6px;
        -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }
    .categories div a {
        text-align: left;
    }
    .categories div h2 {
        padding-left: 6px;
        margin-bottom: 2px;
        font-size: 12px;
        line-height: 1.2em;
        text-transform: uppercase;
    }
    .categories div h2 a {
        color: #c95f45;
        padding: 0;
    }
    .categories div li:hover {
        background: #000000;
    }
    .categories div li a {
        color: #e3e3e3;
        font-size: 13px;
        border-bottom: 1px dotted #636161;
        padding: 0 0 2px;
     }
     .categories div li a:hover {
         background: #000000;
         text-decoration: none;
     }
    .articles article.main aside {
        -webkit-transition: height, width 0.3s ease;
        -moz-transition: height, width 0.3s ease;
        -o-transition: height, width 0.3s ease;
        transition: height, width 0.3s ease;
    }

    #comments-loading {
        position:relative;
    }
    #footer {
        width: 98%;
       /* width: 82.0895522%; /*825px/1005px*/
    }
}
 .to-right {
    float:right;
 }
 .why-create {
    position: relative;
    top:15px;
    font-size:.8em;
 }

@media screen and (min-width: 700px) and (max-width: 1200px) {

    body.interior section.email-subscribe { width:100%; float:none; display:block;}
    body.interior section.donation,
    body.interior section.promotion
    {
        width:49%;
        float:left;
    }
    body.interior section.donation { float:right; }

}
/* 'desktop' layout: >= 1200 */
@media screen and (min-width: 1280px) {

    /* Viewport reference width: 1400px */
    
    /* headers get bigger */
    .copy h1 {
        font-size: 22px;
        padding-left: 2.688172043010752688%; /*20px/744px*/
    }
    
    /* target wrapper width: 1224px */
    #wrapper, #footer {
        max-width: 1200px;
        width: 87.4285714%; /*1224px/1400px*/
    }
    
    /* make the top category bar taller */
    #wrapper {
        margin-top: 45px;
    }
    .categories, .no-top-comments .categories {
        height: 45px;
        line-height: 45px;
        text-align: center;
        margin: 0 auto;
        max-width: 1200px;
        padding: 0;
        position: relative;
        width: 86%; /*1204px/1400px*/
    }
    .categories p {
        line-height: 45px;
        margin-right: 10px;
    }
    .categories ul {
        margin-top: 5px;
    }
    .categories li {
        height: 33px;
        line-height: 33px;
        font-size: 12px;
        margin-right: 10px !important;
        padding: 0 10px;
    }
    .categories li.best-btn {
        height: 31px;
    }

    .categories li.best-btn a {
        line-height: 31px;
    }
    .categories div {
        padding: 12px;
        -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        width: 58.571428571428571428%; /*820px/1400px*/
    }
    .categories li.right div {
        margin-left: -540px;
    }
    .categories div h2 {
        font-size: 14px;
    }
    
    /* Outer content reference width: 1179px */ 
    
    /* re-pad the inner contents */
    #header, #content {
        margin-right: 1.696352841391009329%; /*20px/1179px*/
        margin-left: 1.696352841391009329%; /*20px/1179px*/
    }
    
    /* Inner content reference width: 1139px */
    
    /* form reference width: 351px */
    #header form {
        width: 30.816505706760316066%; /*351px/1139px*/
    }
    .articles article.main {
        padding: .877963125548726953%; /*10px/1139px*/
    }
    
    /* main article inner reference width: 1119px */
    
    .articles article.main header p {
        font-size: 14px;
    }
    
    /* align the main article image to the grid */
    .articles article.main aside {
        /* target width: 537px, minus 10px borders inherited earlier */
        width: 47.095621090259159964%; /*527px/1119px*/
    }
    .articles article.portrait aside {
        /* target width: 284px, minus 10px borders inherited earlier */
        width: 24.486148346738159070%; /*274px/1119px*/
    }
    
    /* align the main article copy to the grid */
    .articles .full-article {
        width: 48.078641644325290437%; /*538px/1119px*/
        width: 43.252904378909740840%; /*484px/1119px*/
        margin-right: 4.825737265415549597%; /*54px/1119px*/
    }
    .articles .portrait .full-article {
        width: 64.87935656836461126%; /*726px/1119px*/
        margin-right: 4.825737265415549597%; /*54px/1119px*/
        font-size: 18px;
        line-height: 1.4em;
    }
    
    /* align the main article 'category' listing underneath the main copy */
    .articles article.main footer {
        width: 48.078641644325290437%; /*538px/1119px*/
        float: right;
        clear: right;
        margin-bottom: 10px;
        margin-top:1em;
    }
    .articles article.portrait footer {
        width: 69.705093833780160857%; /*780px/1119px*/
    }
    .articles header h3 {
        font-size: 22px;
        margin-top: 10px;
    }
    
    /* allow 'more articles' to expand a bit */
    .more-articles {
        padding: 20px .877963125548726953%; /*10px/1139px*/
    }
    
    /* more articles inner reference width: 1119px */
    .more-articles li {
        min-height: 52px;
        width: 22.1626452%; /*248px/1119px*/
        margin-right: 3.7533512%; /*42px/1119px*/
    }
    .more-articles h3 {
        font-size: 14px;
    }
    .more-articles p {
        font-size: 12px;
    }
    .more-articles .article-summary p span {
        display: inline;
    }
    .more-articles .article-summary time {
        display: inline;
        width: auto;
    }
    .more-articles aside,
    .more-articles li:first-child aside,
    .more-articles li:last-child aside,
    .more-articles li.last aside {
        margin-right: 0;
        width: 100%;
    }
    .more-articles aside img {
        width: 100%;
    }
    .more-articles li:last-child,
    .more-articles li.last {
        margin-right: 0;
    }
    
    /* context: 1139px */
    
    /*=========================================
     * Full Article Page elements: desktop view
     *=========================================*/
    
    .article-copy, section.comments, .content {
        width: 65.320456540825285338%; /*744px/1139px*/
        float: left;
    }
    section.comments {
        border-bottom: 0;
        margin-bottom: 0;
    }
    
    .top-comments.sidebar aside {
        width: 17.419354838709677419%; /*54px/310px*/
    }

    /* context: 744px */
    
    .article-copy aside.image {
        margin-right: 1.881720430107526881%; /*14px/744px*/
    }
    
    /*=============================================
     * END Full Article Page elements: desktop view
     *=============================================*/
     
    /*=======================================
     * Subsection Page elements: desktop view
     *=======================================*/
    
    /* context: 744px */
    section.article-summaries {
        margin-bottom: 0;
    }
    section.article-summaries aside.image {
        margin-right: 2.688172043010752688%; /*20px/744px*/
    }
    section.article-summaries nav.pagination {
        border-bottom: 0;
        padding-bottom: 0;
    }
    
    /*===========================================
     * END Subsection Page elements: desktop view
     *===========================================*/
     
    /*=======================================
     * Contact Us Page elements: desktop view
     *=======================================*/
    
    /* context: 744px */
    .contact-us form {
        width: 47.177419354838709677%; /*351px/744px*/
    }
    
    /*===========================================
     * END Contact Us Page elements: desktop view
     *===========================================*/

    /*=====================================
     * Register Page elements: desktop view
     *=====================================*/
    
    .register-form .checkbox_terms input[type="checkbox"] {
        margin: 0 0.80645161% 0 0; /*6px/744px*/
    }

    /*=========================================
     * END Register Page elements: desktop view
     *=========================================*/
     
    /*=====================================
     * About us page elements: desktop view
     *=====================================*/
    
    .reframe-copy img {
        width: 218px;
     }
    
    /*=====================================
     * About us page elements: desktop view
     *=====================================*/
     
    /* top comments gets fancier */
    .top-comments.main,
    .top-comments {
        width: 30.816505706760316066%; /*351px/1139px*/
    }
    body.sidebar .top-comments {
        width: 30.816505706760316066%; /*351px/1139px*/
        float: none;
        margin-left: 69.183494293239683933%; /*788px/1139px*/
    }
    
    /* context: 754px */

    .top-comments.main h3 {
        font-size: 18px;
        margin-bottom: 20px;
    }
    .top-comments.main article {
        line-height: 1.4em;
    }
    .top-comments.main footer {
        overflow: hidden;
    }
    .top-comments.main footer p {
        font-size: 12px;
    }
    .top-comments.main time {
        padding-right: 5px;
    }
    .top-comments.main time:after {
        content: ' @' ;
    }
    .top-comments.main div {
        width: 80%; /*220px/275px*/
        padding-left: 2.281879194630872483%; /*17px/745px*/
    }
    /* IE8 doesn't like non-whole percentages for background-position values, 
       so the above % is being interpreted as 0. 1% is close enough for IE8. */
    html.ie8 .top-comments.main div {
        background-position: 1% 15px;
    }
    .top-comments.main article#topcommentinfo div {
        background: none;
        font-style: italic;
    }
    .top-comments.main article#topcommentinfo div p {
        padding-left:10%;
    }
    .top-comments.main aside {
        margin-top: 3px;
        width: 17.3633441%; /*54px/311px*/
    }

    .recent-articles {
        margin-top: 10px;
        width: 66.198419666374012291%; /*754px/1139px*/
    }
    .recent-articles h3 {
        font-size: 18px;
    }
    .recent-articles article {
        line-height: 1.4em;
        margin-bottom: 30px;
        padding-bottom: 30px;
    }
    .recent-articles aside.image {
        margin-right: 2.688172043010752688%; /*20px/744px*/
        padding-right: 0;
        width: 20.402684563758389261%; /*152px/745px*/
    }
    .recent-articles aside.published {
        margin-bottom: 10px;
    }
    .recent-articles article,
    .recent-articles .other-link {
        font-size: 14px;
    }

    
    /* top-comments on the homepage is in the right column */
    .top-comments {
        width: 46.979865771812080536%; /*350px/745px*/
        float: right;
    }

    /* top-comments in in the left column */
    .top-comments.sidebar {
        /*float: left;*/
    }

    /* context: 1139 */
    body.home .sidebar-item,
    .sidebar-item, .social, .promotion, section.donation {
        width: 30.816505706760316066%; /*351px/1139px*/

        margin-top:44px;
    }
    body.sidebar .social, body.sidebar .sidebar-item {
        float: none;
        margin-left: 69.183494293239683933%; /*788px/1139px*/
    }
    
    section.twitter {
        width: 27.304653204565408252%; /*311px/1139px*/
        padding-right: 1.755926251097453906%; /*20px/1139px*/
        padding-left: 1.755926251097453906%; /*20px/1139px*/
        font-size: 14px;
    }
    section.twitter .twtr-tweet-text {
        font-size:14px;
        padding: 10px 0;
    }
    section.twitter header p {
        font-size: 12px;
    }
    .social {
        padding-bottom: 0;
    }
    body.sidebar .social {
        margin-top: 25px;
    }
    .social p {
        font-size: 16px;
    }
    
    /* context: 1179 */
    #footer div.row {
        width: 66.666666666666666666%; /*786px/1179px*/
    }
    #footer div.row:first-child {
        width: 33.333333333333333333%; /*393px/1179px*/
    }
    
    /* context: 391 */
    #footer section.location {
        width: 39.185750636132315521%; /*154px/393px*/
        padding-left: 10.178117048346055979%; /*40px/393px*/
    }
    #footer section.contact {
        width: 45.038167938931297709%; /*177px/393px*/
        padding-left: 4.834605597964376590%; /*19px/393px*/
    }
}

/* bump up font sizes for even wider windows */
@media screen and (min-width: 1270px) {
    #wrapper, #footer {
        width: 92.2857143%; /*1292/1400px*/
    }
    .categories, .no-top-comments .categories {
        width: 90.8571429%; /*1272px/1400px*/
    }
    .categories li {
        font-size: 14px;
    }
}
@media screen and (min-width: 1005px) and (max-width: 1040px) {
    .searchbox { right:-20px !important;}
}
@media screen and (min-width: 700px) and (max-width: 810px) {
    #header input { width:70%; }
}
@media screen and (max-width:642px) {
    .copy .search-form form input { width:80%; }
}
@media screen and (max-width:440px) {
    #header input { width:70%; }
}
.screen-reader {
  display: block !important;
  left: -9999px !important;
  position: absolute !important;
  top: -9999px !important;
}



/* Hubspot form */
#output {
    padding:10px 0 20px;
    float:right;
    width: 30.816505706760316066%;
    font-size: 12px
}
#subscribe-form .input-group { margin-bottom: 10px; }
section.email-subscribe { margin:0 0 30px; }
section.email-subscribe .subscribe-box {
    background-color: #454545;
    color:#fff;
    padding:20px 0 5px 20px;
    margin: 0 0 20px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
section.email-subscribe div p {
    font-size: .8em;
    margin:5px 0 15px;
    color:#fff !important;
}
.hb-input {
    margin:0;
    border-radius:2px;
    padding:4px;
    border: 1px solid #ccc;
    width: 80%;
    padding:6px;
}
.hb-margin {
    margin:5px 0;
}
.hb-btn { 
    border-radius:4px;
    background-color: #9b381b;
    border: 1px solid #988577;
    margin-top:5px;
    font-size:1.1em;
    padding:8px 12px;
}
#output-article {
    margin:10px 0;
}

.scrollup-btn { 
    width: 50px; 
    height: 50px; 
    position: fixed; 
    display:none; 
    bottom: 15px; 
    right: 15px; 
    background-color: #000; 
    background-color: rgba(0,0,0,0.5); 
    transition: background-color 0.2s ease; 
    color:#fff !important; 
    border-radius: 4px; 
    text-align: center; 
    line-height:3em;
}
.scrollup-btn span {
    position:absolute;
    top:14px;
    left:10px;
    display: block;
    width:30px;
    height:20px;
    background: url(https://dnvbry4stcg1.cloudfront.net/assets/images/sprites.png) no-repeat -64px -66px;
}
.scrollup-btn:hover { background-color:rgba(0,0,0,0.8); }

@media screen and (max-width:700px) {
    .mobile-hide { display:none; }
    #subscribe-form { margin:20px 0; }
    #subscribe-form p { padding-bottom:5px; font-size:.8em;}
    #output { width:100%; float:none; margin-top:20px; }
}
.etabs { margin: 0; padding: 0; }
.tab { display: inline-block; zoom:1; *display:inline; background: #eee; border: solid 1px #ababab; border-bottom: none; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; }
.tab a { font-size: 13px; line-height: 2em; display: block; padding: 0 10px; outline: none; }
.tab a:hover { text-decoration: underline; }
.tab.active { background: #fff; padding-top: 6px; position: relative; top: 1px; border-color: #ababab; }
.tab a.active { font-weight: bold; }
.tab-panel { border-top:1px solid #ababab; }
.tab-container .panel-container { background: #fff; border: solid #ababab 1px; padding: 10px; -moz-border-radius: 0 4px 4px 4px; -webkit-border-radius: 0 4px 4px 4px; }