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