dss/static/css/testing.css

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
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}

body {
    line-height: 1
}

ol, 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
}

body {
    margin: 0;
    padding: 0
}

.container {
    max-width: 920px;
    padding: 0 20px;
    margin: 0 auto
}

.clear {
    clear: both
}

@font-face {
    font-family: 'Copse';
    font-style: normal;
    font-weight: 400;
    src: local('Copse'), url(http://themes.googleusercontent.com/static/fonts/copse/v3/GTNBLj58pwv6qyDO1RGnXaCWcynf_cDxXwCLxiixG1c.woff) format('woff')
}

body {
    font-family: 'Copse';
    font-size: 16px;
    line-height: 22px;
    color: #373737;
    -moz-font-smoothing: antialiased;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004)
}

hgroup {
    margin-bottom: 15px
}

hgroup h2 {
    margin-bottom: 10px
}

h2 {
    font-size: 36px;
    font-style: italic
}

h3 {
    font-size: 30px;
    font-style: italic
}

a {
    color: inherit;
    text-decoration: none
}

.italic {
    font-style: italic
}

.bold {
    font-weight: bold
}

.grey {
    color: #9b9b9b
}

.underline a, a.underline {
    border-bottom: 2px solid;
    padding-bottom: 3px;
    position: relative
}

.underline a span, a.underline span {
    position: absolute;
    right: -23px;
    font-size: 16px;
    bottom: -12px;
    padding: 0px 3px;
    background-color: #fff
}

.underline-yellow a, a.underline-yellow {
    border-color: #f1e52f
}

.underline-green a, a.underline-green {
    border-color: #63a544
}

.underline-blue a, a.underline-blue {
    border-color: #26acec
}

.underline-purple a, a.underline-purple {
    border-color: #3b5998
}

.underline-orange a, a.underline-orange {
    border-color: #f60
}

img {
    max-width: 100%
}

hr {
    border: none;
    color: #9b9b9b;
    background-color: #9b9b9b;
    height: 2px
}

input[type=text], input[type=email], input[type=url] {
    background-color: #dedede;
    width: 205px;
    padding: 8px 5px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 2px solid #63a544;
    font-family: 'Copse';
    font-size: 12px
}

input {
    outline: none;
    margin-bottom: 20px;
    display: block;
    font-family: 'Copse'
}

input[type=text]:focus, input[type=email]:focus {
    outline: none;
    border-bottom: 2px solid #f1e52f
}

input[type=submit] {
    background-color: #63a544;
    color: white;
    font-size: 12px;
    line-height: 20px;
    padding: 5px 17px;
    border: none;
    -webkit-appearance: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box
}

input[type=submit]:hover {
    background-color: #cbd13e
}

.button {
    display: inline-block;
    color: white;
    font-size: 12px;
    line-height: 20px;
    padding: 5px 17px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box
}

.button:hover {
    background-color: #cbd13e
}

.green-button {
    background-color: #63a544
}

#header {
    background: url('/wp-content/themes/fivenew/img/header-background.png');
    width: 100%
}

#header #topNav {
    background-color: #171717;
    -webkit-box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.55);
    -moz-box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.55);
    box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.55)
}

.modalDialog {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 99999;
    opacity: 0;
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
    pointer-events: none
}

.modalDialog:target {
    opacity: 1;
    pointer-events: auto
}

.modalDialog>div {
    max-width: 570px;
    position: relative;
    margin: 10% auto
}

.close {
    background: #606061;
    color: #FFF;
    line-height: 25px;
    position: absolute;
    right: -12px;
    text-align: center;
    top: -10px;
    width: 24px;
    text-decoration: none;
    font-weight: bold;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    -moz-box-shadow: 1px 1px 3px #000;
    -webkit-box-shadow: 1px 1px 3px #000;
    box-shadow: 1px 1px 3px #000
}

.close:hover {
    background: #63a544
}

#openModal #newsletter form input[type=email] {
    margin-right: 0;
    text-align: center
}

footer {
    background-color: #171717
}

footer .container {
    padding-top: 35px;
    padding-bottom: 35px;
    color: white
}

footer .container h3 {
    margin-bottom: 10px
}

footer .container .twitter .inner .twitterInfo {
    padding: 10px 0 15px;
    border-bottom: 1px solid #494949;
    margin-bottom: 15px
}

footer .container .twitter .inner .twitterHandle {
    color: #63a544;
    display: inline-block;
    margin-right: 15px
}

footer .container .twitter .inner ul li {
    margin-bottom: 20px
}

footer .container #cats {
    margin-top: 10px;
    border-top: 1px solid #494949;
    padding: 30px 0
}

footer .container #cats nav ul li {
    margin-bottom: 15px
}

footer .container #cats nav ul li a {
    border-bottom: 1px solid #63a544
}

footer .container .copy {
    border-top: 1px solid #494949;
    padding: 30px 0;
    font-size: 12px
}

footer .container .copy p span {
    padding: 0 5px
}

footer .container .copy .twitter, footer .container .copy .rss, footer .container .copy .facebook {
    background: url('/wp-content/themes/fivenew/img/sprite.png') no-repeat;
    display: inline-block
}

footer .container .copy .twitter {
    background-position: 0px 0px;
    height: 22px;
    width: 23px;
    margin-right: 11px
}

footer .container .copy .rss {
    background-position: 0px -64px;
    width: 26px;
    height: 22px
}

footer .container .copy .facebook {
    background-position: 0px -32px;
    width: 17px;
    height: 22px;
    margin-right: 11px
}

#about .container {
    border-top: 2px solid #9b9b9b;
    padding-top: 25px;
    padding-bottom: 25px
}

#about .container h3 {
    margin-bottom: 15px
}

#about .container p {
    margin-bottom: 10px
}

#archive {
    padding-top: 30px
}

.mainSection {
    width: 66%;
    margin-right: 10%;
    float: left
}

.mainSection h1 {
    font-family: 'Copse';
    font-size: 36px;
    line-height: 1em;
    margin-bottom: 18px
}

.mainSection hr {
    border: none;
    color: #9b9b9b;
    margin: 30px 0;
    background-color: #9b9b9b;
    height: 1px
}

.mainSection h1+p {
    font-size: 19px;
    line-height: 1.4em
}

.mainSection p, .mainSection ul, .mainSection blockquote {
    margin-bottom: 20px
}

.mainSection blockquote {
    font-family: 'Copse';
    font-size: 20px;
    line-height: 28px;
    color: #63a544;
    background: url('/wp-content/themes/fivenew/img/blockquote.png') no-repeat top left;
    padding-left: 65px;
    min-height: 100px
}

.mainSection blockquote p {
    margin: 0
}

.mainSection h2, .mainSection h3, .mainSection h4, .mainSection h5, .mainSection h6 {
    font-size: 26px;
    line-height: 32px;
    margin-bottom: 18px
}

.mainSection img {
    margin: 10px 0
}

.mainSection pre {
    font: 13px "Courier 10 Pitch", Courier, monospace;
    line-height: 1.5;
    margin-bottom: 1.625em;
    overflow: auto;
    padding: 1.625em;
    background: #DDDDDB;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word
}

.mainSection code, .mainSection kbd, .mainSection samp, .mainSection var {
    font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    color: #666;
    background: #DDDDDB;
    display: block;
    padding: 5px
}

.mainSection code {
    display: inline
}

.excerptHide {
    height: 1000px;
    overflow: hidden
}

.excerptMore {
    border-top: 1px dashed #171717;
    padding-top: 20px;
    margin-bottom: 50px
}

.excerptMore span {
    font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    display: block;
    margin-bottom: 20px
}

.sidebar {
    width: 23%;
    float: left
}

.sidebar article {
    margin-bottom: 50px
}

.sidebar h4 {
    font-size: 16px;
    line-height: 23px
}

.sidebar p {
    font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    display: block;
    margin-bottom: 20px
}

.sidebar img {
    margin: 10px 0
}

.sidebar .author {
    background-color: #e7e7e7;
    padding: 0px 10px 10px 12px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin-bottom: 50px
}

.sidebar .author .authorName {
    max-width: 150px;
    margin-left: 10px;
    margin-top: 20px;
    font-size: 16px;
    color: #373737
}

.sidebar .author .authorName.noPic {
    margin-left: 0
}

.sidebar .author .authorName.noPic span {
    display: block;
    padding-top: 10px;
    margin-bottom: 20px
}

.sidebar .author a {
    font-size: 16px;
    color: #373737;
    word-break: break-all
}

.catTitle {
    border-bottom: 1px solid #9b9b9b
}

body.archive #archive .mainSection article h4 {
    font-size: 16px;
    line-height: 22px;
    color: #373737;
    font-weight: bold
}

.authorTitle {
    font-size: 26px;
    line-height: 30px
}

#todays-five {
    padding: 25px 0
}

#todays-five article {
    padding: 25px 0;
    text-align: center
}

#todays-five article h2, #todays-five article p {
    margin-left: 10%;
    margin-right: 10%
}

#todays-five article h2 {
    margin-bottom: 22px
}

#todays-five article h2 a {
    font-size: 36px;
    color: #373737
}

#todays-five article p {
    margin-bottom: 12px
}

#newsletter-section {
    background-color: #e7e7e7;
    padding: 35px 50px;
    max-width: 520px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    margin: 0 auto 50px auto;
    text-align: center
}

#newsletter-section h2 {
    line-height: 1em;
    margin-bottom: 8px;
    font-style: normal
}

#newsletter-section p {
    margin-bottom: 25px
}

#newsletter-section form {
    margin: 0 auto
}

#newsletter-section form input {
    display: inline
}

#newsletter-section form input[type=email] {
    margin-right: 20px;
    background-color: white
}

#newsletter article {
    background-color: #e7e7e7;
    padding: 35px 50px;
    max-width: 520px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    margin: 0 auto 50px auto;
    text-align: center
}

#newsletter article h2 {
    line-height: 1em;
    margin-bottom: 8px;
    font-style: normal
}

#newsletter article p {
    margin-bottom: 25px
}

#newsletter article form {
    margin: 0 auto
}

#newsletter article form input {
    display: inline
}

#newsletter article form input[type=email] {
    margin-right: 20px;
    background-color: white
}

html.oldie {
    font-family: Arial
}

html.oldie .left {
    float: left
}

html.oldie .right {
    float: right
}

html.oldie .third {
    width: 33.33333333%;
    display: block;
    float: left
}

html.oldie .half {
    width: 50%;
    float: left;
    display: block
}

html.oldie .modalDialog {
    display: none
}

html.oldie #topNav nav {
    max-width: 960px;
    margin: 0 auto
}

html.oldie #topNav ul {
    overflow: hidden
}

html.oldie #topNav ul.left {
    float: left
}

html.oldie #topNav ul.right {
    float: right
}

html.oldie #topNav ul li {
    float: left;
    display: block;
    padding: 25px 0;
    margin-right: 40px
}

html.oldie #topNav ul li a {
    color: #fff;
    font-family: Arial;
    font-size: 16px;
    line-height: 22px
}

html.oldie .five-logo {
    padding: 100px 0;
    display: block;
    background: url('/wp-content/themes/fivenew/img/logo-five.png') center center no-repeat
}

html.oldie #todays-five h2 {
    font-family: 'Georgia', serif;
    font-size: 36px;
    line-height: 22px;
    font-weight: bold
}

html.oldie #todays-five .third {
    width: 33.33333333%;
    float: left;
    display: block
}

html.oldie #todays-five .half {
    width: 50%;
    float: left;
    display: block
}

html.oldie #newsletter-section {
    background-color: #e7e7e7;
    padding: 35px 50px;
    max-width: 520px;
    display: block;
    margin: 0 auto 50px auto;
    text-align: center
}

html.oldie #newsletter-section h2 {
    line-height: 1em;
    margin-bottom: 8px;
    font-style: normal
}

html.oldie #newsletter-section p {
    margin-bottom: 25px
}

html.oldie #newsletter-section form {
    margin: 0 auto
}

html.oldie #newsletter-section form input {
    display: inline;
    color: black
}

html.oldie #newsletter-section form input[type=email] {
    margin-right: 20px;
    background-color: white
}

html.oldie #gform_1 .gform_description {
    max-width: 280px;
    display: block;
    margin-bottom: 30px
}

html.oldie #cats {
    margin-top: 10px;
    border-top: 1px solid #494949;
    padding: 30px 0
}

html.oldie #cats h3 {
    margin-right: 30px
}

html.oldie #cats nav ul {
    overflow: hidden
}

html.oldie #cats nav ul li {
    margin-bottom: 15px;
    display: block;
    float: left;
    width: 25%
}

html.oldie #cats nav ul li a {
    border-bottom: 1px solid #63a544
}

html.oldie .social {
    text-align: right
}

html.oldie .twitter .inner {
    border-left: 1px solid #494949;
    padding: 0 70px 20px 70px
}

html.oldie .author {
    overflow: hidden
}

html.oldie #archive .mainSection li {
    margin-bottom: 20px;
    float: left;
    width: 50%
}

html.oldie #archive .mainSection li article {
    vertical-align: top;
    display: block;
    padding-right: 30px;
    word-break: break-word;
    height: 365px
}

html.oldie #archive .mainSection li article p {
    max-height: 286px;
    overflow: hidden
}

html[data-useragent*='MSIE 10.0'] .modalDialog {
    display: none
}

@media (max-width:480px) {
    #topNav nav ul li {
        padding: 5px
    }

    #topNav nav ul li a {
        font-size: 13px
    }
}

@media (min-width:481px) and (max-width:764px) {
    #topNav nav ul li {
        padding: 5px 10px
    }
}

@media (max-width:764px) {
    .container {
        text-align: center
    }

    form input {
        margin-left: auto;
        margin-right: auto
    }

    #topNav {
        padding: 20px 0
    }

    #topNav nav ul {
        text-align: center
    }

    #topNav nav ul.social {
        display: none
    }

    #topNav nav ul li {
        display: inline-block;
        float: none;
        margin: 0;
        width: auto;
        text-align: center;
        font-size: 14px
    }

    #topNav nav ul li a {
        color: #e7e7e7
    }

    #archive .mainSection {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        float: none
    }

    #archive .mainSection ul li {
        margin-bottom: 30px;
        float: none;
        width: 100%
    }

    #archive .sidebar {
        display: none
    }

    .container {
        padding: 0 10px
    }

    .container .five-logo {
        background: url('/wp-content/themes/fivenew/img/logo-five.png') no-repeat right;
        padding: 50px 0
    }

    .submit {
        margin-bottom: 30px
    }

    .submit form input {
        margin: 0 auto 20px auto
    }

    .submit .gform_heading {
        margin-bottom: 10px
    }

    .close {
        right: 5px;
        top: -4px
    }

    #cats h3 {
        margin-bottom: 20px
    }

    #cats nav ul li {
        width: 100%;
        list-style: none
    }
}

@media (min-width:764px) {
    .container .five-logo {
        padding: 40px 0;
        background: url('/wp-content/themes/fivenew/img/logo-five.png') no-repeat center
    }

    body.home .container .five-logo {
        padding: 100px 0;
        background: url('/wp-content/themes/fivenew/img/logo-five.png') no-repeat center
    }

    #archive .mainSection li {
        margin-bottom: 20px;
        float: left;
        width: 50%
    }

    #archive .mainSection li article {
        vertical-align: top;
        display: block;
        padding-right: 30px;
        word-break: break-word;
        height: 365px
    }

    #archive .mainSection li article p {
        max-height: 286px;
        overflow: hidden
    }

    #topNav nav {
        max-width: 940px;
        margin: 0 auto
    }

    #topNav nav ul {
        padding-left: 10px
    }

    #topNav nav ul.social {
        padding: 0
    }

    #topNav nav ul.social li {
        margin-right: 35px
    }

    #topNav nav ul.social li a {
        font-size: 12px
    }

    #topNav nav ul li {
        float: left;
        margin-right: 40px;
        padding: 25px 0
    }

    #topNav nav ul li a {
        color: #e7e7e7
    }

    .left {
        float: left
    }

    .right {
        float: right
    }

    .half {
        width: 50%
    }

    .third {
        width: 33.33333333%
    }

    .twitter .inner {
        border-left: 1px solid #494949;
        padding: 0 70px 20px 70px
    }

    #gform_1 .gform_description {
        max-width: 280px;
        display: block;
        margin-bottom: 30px
    }

    #cats h3 {
        margin-right: 30px
    }

    #cats form input[type=text] {
        margin-right: 10px
    }

    #cats nav ul li {
        float: left;
        width: 25%;
        list-style: disc;
        list-style-position: inside
    }

    .social {
        text-align: right
    }
}