• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Converting News theme to HTML5

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Converting News theme to HTML5

This topic is: not resolved

Tagged: html5, news

  • This topic has 4 replies, 3 voices, and was last updated 11 years, 5 months ago by Fawk.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • December 7, 2013 at 5:03 am #77517
    Fawk
    Member

    Has anyone done this? I have converted the CSS using the converter and I have added the HTML5 line into functions.php and changed some hooks.

    When I refresh my page, my menus are not looking right, the content is max width and the sidebar went to the bottom of the screen.

    This is what my functions.php look like currently:

    <?php
    /** Start the engine */
    require_once( get_template_directory() . '/lib/init.php' );

    /** Child theme (do not remove) */
    define( 'CHILD_THEME_NAME', 'News Theme' );
    define( 'CHILD_THEME_URL', 'http://www.studiopress.com/themes/news' );

    // Enable HTML5 markup
    add_theme_support( 'html5' );

    /** Add Viewport meta tag for mobile browsers
    add_action( 'genesis_meta', 'news_add_viewport_meta_tag' );
    function news_add_viewport_meta_tag() {
    echo '<meta name="viewport" content="width=device-width, initial-scale=1.0"/>';
    }
    */

    $content_width = apply_filters( 'content_width', 580, 430, 910 );

    // Remove Page Title
    add_action('get_header', 'afn_remove_page_titles');
    function afn_remove_page_titles() {
    $pages=array('942','367','182','233','722');
    if (is_page($pages)) {
    remove_action('genesis_entry_header', 'genesis_do_post_title');
    }
    }

    //* Add image size crops
    add_image_size( 'home-featured', 425, 282, TRUE );
    add_image_size( 'single-image-post', 580, 385, TRUE );

    //* Modify the length of post excerpts
    add_filter( 'excerpt_length', 'sp_excerpt_length' );
    function sp_excerpt_length( $length ) {
    return 60;
    }

    //* Display author box on single posts
    add_filter( 'get_the_author_genesis_author_box_single', '__return_true' );

    //* Display author box on archive page
    add_filter( 'get_the_author_genesis_author_box_archive', '__return_true' );

    //* Modify the size of the Gravatar in the author box
    add_filter( 'genesis_author_box_gravatar_size', 'author_box_gravatar_size' );
    function author_box_gravatar_size( $size ) {
    return '150';
    }

    //* Genesis Next/Previous Post Navigation (after post, before comments)
    add_action( 'genesis_entry_footer', 'ac_next_prev_post_nav' );

    function ac_next_prev_post_nav() {

    if ( is_single() ) {

    echo '<div class="loop-nav">';
    previous_post_link( '<div class="previous">&raquo &raquo %link</div>', '%title' );
    next_post_link( '<div class="next">&laquo &laquo %link</div>', '%title' );
    echo '</div><!-- .loop-nav -->';
    }
    }

    /** Create additional color style options */
    add_theme_support( 'genesis-style-selector', array(
    'news-green' => 'Green',
    'news-orange' => 'Orange',
    'news-pink' => 'Pink',
    'news-purple' => 'Purple',
    'news-red' => 'Red',
    'news-teal' => 'Teal'
    ) );

    /** Add support for structural wraps */
    add_theme_support( 'genesis-structural-wraps', array(
    'header',
    'nav',
    'subnav',
    'inner',
    'footer-widgets',
    'footer'
    ) );

    /** Add new image sizes */
    add_image_size( 'home-bottom', 110, 110, TRUE );
    add_image_size( 'home-middle-left', 280, 165, TRUE );
    add_image_size( 'home-middle-right', 50, 50, TRUE );
    add_image_size( 'home-tabs', 150, 220, TRUE );

    /** Add support for custom header */
    add_theme_support( 'genesis-custom-header', array(
    'width' => 960,
    'height' => 110
    ) );

    /** Add support for custom background */
    add_theme_support( 'custom-background' );

    /** Reposition the secondary navigation */
    remove_action( 'genesis_after_header', 'genesis_do_subnav' );
    add_action( 'genesis_before', 'genesis_do_subnav' );

    /** Add after post ad section */
    add_action( 'genesis_entry_footer', 'news_after_post_ad', 9 );
    function news_after_post_ad() {
    if ( is_single() && is_active_sidebar( 'after-post-ad' ) ) {
    echo '<div class="after-post-ad">';
    dynamic_sidebar( 'after-post-ad' );
    echo '</div><!-- end .after-post-ad -->';
    }
    }

    /** Add after content ad section */
    add_action( 'genesis_before_footer', 'news_after_content_ad' );
    function news_after_content_ad() {
    if ( is_active_sidebar( 'after-content-ad' ) ) {
    echo '<div class="after-content-ad">';
    dynamic_sidebar( 'after-content-ad' );
    echo '</div><!-- end .after-content-ad -->';
    }
    }

    /** Add support for 3-column footer widgets */
    add_theme_support( 'genesis-footer-widgets', 3 );

    /** Register widget areas */
    genesis_register_sidebar( array(
    'id' => 'home-top',
    'name' => __( 'Home Top', 'news' ),
    'description' => __( 'This is the home top section.', 'news' ),
    ) );
    genesis_register_sidebar( array(
    'id' => 'home-middle-left',
    'name' => __( 'Home Middle Left', 'news' ),
    'description' => __( 'This is the home middle left section.', 'news' ),
    ) );
    genesis_register_sidebar( array(
    'id' => 'home-middle-right',
    'name' => __( 'Home Middle Right', 'news' ),
    'description' => __( 'This is the home middle right section.', 'news' ),
    ) );
    genesis_register_sidebar( array(
    'id' => 'home-bottom',
    'name' => __( 'Home Bottom', 'news' ),
    'description' => __( 'This is the home bottom section.', 'news' ),
    ) );
    genesis_register_sidebar( array(
    'id' => 'after-post-ad',
    'name' => __( 'After Post Ad', 'news' ),
    'description' => __( 'This is the after post ad section.', 'news' ),
    ) );
    genesis_register_sidebar( array(
    'id' => 'after-content-ad',
    'name' => __( 'After Content Ad', 'news' ),
    'description' => __( 'This is the after content ad section.', 'news' ),
    ) );

    http://setuix.com
    December 7, 2013 at 5:11 am #77519
    Fawk
    Member

    Below is my CSS

    /*
    Theme Name: News Child Theme
    Theme URI: http://www.studiopress.com/themes/news
    Description: News is a two or three column child theme created for the Genesis Framework.
    Author: StudioPress
    Author URI: http://www.studiopress.com/

    Version: 2.1

    Tags: black, custom-background, custom-header, custom-menu, featured-images, fixed-width, gray, left-sidebar, one-column, right-sidebar, sticky-post, theme-options, threaded-comments, three-columns, translation-ready, two-columns, white

    Template: genesis
    Template Version: 1.8.2

    License: GNU General Public License v2.0
    License URI: http://www.opensource.org/licenses/gpl-license.php
    */

    /* Table of Contents

    * Import Fonts
    * Defaults
    * Hyperlinks
    * Body
    * Wrap
    * Header
    * Image Header - Partial Width
    * Image Header - Full Width
    * Navigation Constants
    * Header Right Navigation
    * Primary Navigation
    * Primary Navigation Extras
    * Secondary Navigation
    * Social Icons
    * Inner
    * Breadcrumb
    * Taxonomy Description
    * Content-Sidebar Wrap
    * Content
    * Column Classes
    * Featured Post Grid
    * Headlines
    * Ordered / Unordered Lists
    * Post Info
    * Post Meta
    * Author Box
    * Sticky Posts
    * Archive Page
    * Post Icons
    * Images
    * Post Navigation
    * Primary / Secondary Sidebars
    * Dropdowns
    * Featured Page / Post
    * User Profile
    * Buttons
    * Search Form
    * eNews & Updates Widget
    * Calendar Widget
    * Footer Widgets
    * Footer
    * Comments
    * Gravity Forms
    * News Green
    * News Orange
    * News Pink
    * News Purple
    * News Red
    * News Teal
    * Responsive Design

    */

    /* Import Fonts
    ------------------------------------------------------------ */


    @import
    url(http://fonts.googleapis.com/css?family=Archivo+Narrow);

    /* Defaults
    ------------------------------------------------------------ */

    body,
    h1,
    h2,
    h2 a,
    h2 a:visited,
    h3,
    h4,
    h5,
    h6,
    p,
    select,
    textarea {
    color: #333;
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 15px;
    font-weight: normal;
    line-height: 22px;
    margin: 0;
    padding: 0;
    text-decoration: none;
    }

    input {
    color: #333;
    font-family: 'Archivo Narrow', sans-serif;
    }

    input,
    select,
    textarea,
    .breadcrumb,
    .sticky,
    .taxonomy-description {
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    }

    li,
    ol,
    ul {
    margin: 0;
    padding: 0;
    }

    ol li {
    list-style-type: decimal;
    }

    /* Hyperlinks
    ------------------------------------------------------------ */

    a,
    a:visited {
    color: #0094d2;
    text-decoration: none;
    }

    a:hover {
    text-decoration: underline;
    }

    a img {
    border: none;
    }

    /* Body
    ------------------------------------------------------------ */

    body {
    background: url(images/bg-light.png);
    }

    /* Wrap
    ------------------------------------------------------------ */

    .site-container {
    margin: 0 auto;
    }

    /* Header
    ------------------------------------------------------------ */

    .site-header {
    border-top: 1px solid #d5d5d5;
    min-height: 110px;
    margin: 0 auto;
    overflow: hidden;
    width: 960px;
    }

    .title-area {
    float: left;
    overflow: hidden;
    padding: 18px 0 0 20px;
    width: 440px;
    }

    .site-title {
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 54px;
    font-weight: bold;
    line-height: 54px;
    margin: 0;
    text-shadow: 3px 3px #ccc;
    text-transform: uppercase;
    }

    .site-title a,
    .site-title a:hover {
    color: #333;
    text-decoration: none;
    }

    .site-description {
    color: #999;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    }

    .site-header .widget-area {
    float: right;
    padding: 25px 0 0;
    width: 493px;
    }

    /* Image Header - Partial Width
    ------------------------------------------------------------ */

    .header-image .title-area,
    .header-image .site-title,
    .header-image .site-title a {
    display: block;
    float: left;
    height: 110px;
    overflow: hidden;
    padding: 0;
    text-indent: -9999px;
    width: 465px;
    }

    .header-image .site-description {
    display: block;
    overflow: hidden;
    }

    /* Image Header - Full Width
    ------------------------------------------------------------ */

    .header-full-width .title-area,
    .header-full-width .site-title,
    .header-full-width .site-title a {
    width: 960px;
    }

    /* Navigation Constants
    ------------------------------------------------------------ */

    li:hover ul ul,
    li.sfHover ul ul {
    left: -9999px;
    }

    li:hover,
    li.sfHover {
    position: static;
    }

    li a .sf-sub-indicator {
    position: absolute;
    text-indent: -9999px;
    }

    /* Header Right Navigation
    ------------------------------------------------------------ */

    .site-header ul.menu {
    float: right;
    }

    .site-header ul.menu ul {
    float: right;
    margin: 0;
    padding: 0;
    width: 100%;
    }

    .site-header ul.menu li {
    float: left;
    list-style-type: none;
    text-transform: uppercase;
    }

    .site-header ul.menu li a {
    color: #999;
    display: block;
    font-size: 12px;
    padding: 6px 15px 5px;
    position: relative;
    text-decoration: none;
    }

    .site-header ul.menu li a:hover,
    .site-header ul.menu li a:active,
    .site-header ul.menu .current_page_item a,
    .site-header ul.menu .current-cat a,
    .site-header ul.menu .current-menu-item a {
    color: #0094d2;
    }

    .site-header ul.menu li li a,
    .site-header ul.menu li li a:link,
    .site-header ul.menu li li a:visited {
    background-color: #111;
    border: 1px solid #444;
    border-top-width: 0;
    color: #999;
    font-size: 11px;
    padding: 5px 10px;
    position: relative;
    text-transform: none;
    width: 128px;
    }

    .site-header ul.menu li li a:hover,
    .site-header ul.menu li li a:active {
    color: #0094d2;
    }

    .site-header ul.menu li ul {
    height: auto;
    left: -9999px;
    margin: 0 0 0 -1px;
    position: absolute;
    width: 150px;
    z-index: 9999;
    }

    .site-header ul.menu li ul a {
    width: 130px;
    }

    .site-header ul.menu li ul ul {
    margin: -33px 0 0 149px;
    }

    .site-header ul.menu li:hover>ul,
    .site-header ul.menu li.sfHover ul {
    left: auto;
    }

    /* Primary Navigation
    ------------------------------------------------------------ */

    .nav-primary {
    background: url(images/bg-dark.png);
    border-left: 1px solid #d5d5d5;
    border-right: 1px solid #d5d5d5;
    clear: both;
    color: #fff;
    font-family: 'Archivo Narrow', sans-serif;
    margin: 0 auto;
    overflow: hidden;
    text-transform: uppercase;
    width: 960px;
    }

    /* Highlight menu when a post of the same category is selected */
    .nav-primary .current-post-ancestor a {
    color: #27c3c7;
    }

    .nav-primary ul {
    float: left;
    width: 100%;
    }

    .nav-primary li {
    float: left;
    list-style-type: none;
    }

    .nav-primary li a {
    color: #fff;
    display: block;
    font-size: 11px;
    font-weight: bold;
    padding: 9px 15px;
    position: relative;
    text-decoration: none;
    }

    .nav-primary li a:hover,
    .nav-primary li a:active,
    .nav-primary .current_page_item a,
    .nav-primary .current-cat a,
    .nav-primary .current-menu-item a {
    color: #0094d2;
    }

    .nav-primary li li a,
    .nav-primary li li a:link,
    .nav-primary li li a:visited {
    background: url(images/bg-dark.png);
    border: 1px solid #444;
    border-top-width: 0;
    color: #fff;
    font-size: 11px;
    padding: 5px 10px;
    position: relative;
    text-transform: none;
    width: 118px;
    }

    .nav-primary li li a:hover,
    .nav-primary li li a:active {
    color: #0094d2;
    }

    .nav-primary li ul {
    height: auto;
    left: -9999px;
    position: absolute;
    width: 140px;
    z-index: 9999;
    }

    .nav-primary li ul a {
    width: 120px;
    }

    .nav-primary li ul ul {
    margin: -33px 0 0 139px;
    }

    .nav-primary li:hover>ul,
    .nav-primary li.sfHover ul {
    left: auto;
    }

    /* Primary Navigation Extras
    ------------------------------------------------------------ */

    .nav-primary li.right {
    float: right;
    padding: 9px 15px;
    }

    .nav-primary li.right a {
    background: none;
    border: none;
    color: #fff;
    display: inline;
    text-decoration: none;
    }

    .nav-primary li.right a:hover {
    color: #0094d2;
    text-decoration: none;
    }

    .nav-primary li.search {
    padding: 0 10px;
    }

    .nav-primary li.rss a {
    background: url(images/rss.png) no-repeat center left;
    margin: 0 0 0 20px;
    padding: 7px 0 5px 18px;
    }

    .nav-primary li.twitter a {
    background: url(images/twitter-nav.png) no-repeat center left;
    padding: 7px 0 5px 20px;
    }

    /* Secondary Navigation
    ------------------------------------------------------------ */

    .nav-secondary {
    clear: both;
    font-family: 'Archivo Narrow', sans-serif;
    margin: 0 auto;
    overflow: hidden;
    width: 960px;
    background-color: #353535;
    }

    .nav-secondary ul {
    float: left;
    width: 100%;
    }

    .nav-secondary li {
    float: left;
    list-style-type: none;
    }

    .nav-secondary li a {
    color: #fff;
    display: block;
    font-size: 11px;
    padding: 5px 15px 5px;
    position: relative;
    text-decoration: none;
    font-weight: bold;
    text-transform: uppercase; /* top most menu uppercase */
    }

    .nav-secondary li a:hover,
    .nav-secondary li a:active,
    .nav-secondary .current_page_item a,
    .nav-secondary .current-cat a,
    .nav-secondary .current-menu-item a {
    color: #0094d2;
    }

    .nav-secondary li li a,
    .nav-secondary li li a:link,
    .nav-secondary li li a:visited {
    background: url(images/bg-light.png);
    border: 1px solid #ccc;
    border-top-width: 0;
    color: #333;
    font-size: 11px;
    padding: 5px 10px;
    position: relative;
    text-transform: none;
    width: 118px;
    }

    .nav-secondary li li a:hover,
    .nav-secondary li li a:active {
    color: #0094d2;
    }

    .nav-secondary li ul {
    height: auto;
    left: -9999px;
    position: absolute;
    width: 140px;
    z-index: 9999;
    }

    .nav-secondary li ul a {
    width: 120px;
    }

    .nav-secondary li ul ul {
    margin: -33px 0 0 139px;
    }

    .nav-secondary li:hover>ul,
    .nav-secondary li.sfHover ul {
    left: auto;
    }

    /* Social Icons
    ------------------------------------------------------------ */

    .nav-secondary li.social-facebook,
    .nav-secondary li.social-rss,
    .nav-secondary li.social-twitter {
    float: right;
    }

    .nav-secondary li.social-facebook a,
    .nav-secondary li.social-facebook a:hover,
    .nav-secondary li.social-rss a,
    .nav-secondary li.social-rss a:hover,
    .nav-secondary li.social-twitter a,
    .nav-secondary li.social-twitter a:hover {
    display: block;
    height: 23px;
    padding: 0;
    text-indent: -9999px;
    width: 23px;
    }

    .nav-secondary li.social-facebook a,
    .nav-secondary li.social-facebook a:hover,
    .nav-secondary li.social-rss a,
    .nav-secondary li.social-rss a:hover,
    .nav-secondary li.social-twitter a,
    .nav-secondary li.social-twitter a:hover {
    background: url(images/social-icons.png);
    margin: 10px 10px 0 0;
    }

    .nav-secondary li.social-rss a,
    .nav-secondary li.social-rss a:hover {
    margin: 10px 15px 0 0;
    }

    .nav-secondary li.social-facebook a {
    background-position: 0 0;
    }

    .nav-secondary li.social-facebook a:hover {
    background-position: 0 -23px;
    }

    .nav-secondary li.social-rss a {
    background-position: -46px 0;
    }

    .nav-secondary li.social-rss a:hover {
    background-position: -46px -23px;
    }

    .nav-secondary li.social-twitter a {
    background-position: -23px 0;
    }

    .nav-secondary li.social-twitter a:hover {
    background-position: -23px -23px;
    }

    /* Inner
    ------------------------------------------------------------ */

    .site-inner {
    background-color: #fff;
    border-left: 1px solid #d5d5d5;
    border-right: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
    overflow: hidden;
    margin: 0 auto;
    width: 960px;
    }

    .news-landing .site-inner {
    margin: 20px auto;
    width: 700px;
    }

    .site-inner:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
    }

    .content-sidebar .site-inner {
    background: url(images/inner-cs.png);
    }

    .sidebar-content .site-inner {
    background: url(images/inner-sc.png);
    }

    .content-sidebar-sidebar .site-inner {
    background: url(images/inner-css.png);
    }

    .sidebar-sidebar-content .site-inner {
    background: url(images/inner-ssc.png);
    }

    .sidebar-content-sidebar .site-inner {
    background: url(images/inner-scs.png);
    }

    .full-width-content .site-inner {
    background: #fff;
    }

    /* Home Top
    ------------------------------------------------------------ */

    #home-top {
    border-bottom: 1px solid #d5d5d5;
    overflow: hidden;
    }

    #home-top .border {
    border-bottom: 4px solid #eee;
    overflow: hidden;
    }

    #home-top .wrap {
    overflow: hidden;
    padding: 20px 25px 15px;
    }

    #home-top .ui-tabs ul.ui-tabs-nav {
    border-bottom: 1px dotted #ddd;
    margin: 10px 0;
    padding: 0 0 13px;
    }

    #home-top .ui-tabs ul.ui-tabs-nav li a {
    background-color: #f5f5f5;
    font-weight: bold;
    }

    #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
    #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a {
    background-color: #00a7ed;
    color: #fff;
    }

    #home-top .ui-tabs .post {
    background-color: #fff;
    margin: 0;
    padding: 0;
    }

    /* Home Middle
    ------------------------------------------------------------ */

    #home-middle {
    border-bottom: 1px solid #d5d5d5;
    overflow: hidden;
    }

    #home-middle .border {
    border-bottom: 4px solid #eee;
    overflow: hidden;
    }

    #home-middle .wrap {
    overflow: hidden;
    padding: 25px 25px 15px;
    }

    .home-middle-left {
    float: left;
    width: 290px;
    }

    .home-middle-right {
    float: right;
    width: 285px;
    }

    /* Home Bottom
    ------------------------------------------------------------ */

    #home-bottom {
    overflow: hidden;
    }

    #home-bottom .wrap {
    overflow: hidden;
    padding: 20px 25px 15px;
    }

    /* Breadcrumb
    ------------------------------------------------------------ */

    .breadcrumb {
    border: none;
    font-size: 13px;
    line-height: 20px;
    margin: 0 0 30px;
    border-top: 1px solid rgba(0,0,0,.13);
    border-bottom: 1px solid rgba(0,0,0,.13);
    padding: 5px 0 5px;
    }

    /* Taxonomy Description
    ------------------------------------------------------------ */

    .taxonomy-description {
    border: none;
    margin: 0 0 30px;
    padding: 10px;
    }

    /* Content-Sidebar Wrap
    ------------------------------------------------------------ */

    .content-sidebar-wrap {
    float: left;
    width: 810px;
    }

    .content-sidebar-sidebar .content-sidebar-wrap,
    .sidebar-sidebar-content .content-sidebar-wrap {
    width: 805px;
    }

    .content-sidebar .content-sidebar-wrap,
    .full-width-content .content-sidebar-wrap,
    .sidebar-content .content-sidebar-wrap {
    width: 960px;
    }

    .sidebar-content-sidebar .content-sidebar-wrap,
    .sidebar-sidebar-content .content-sidebar-wrap {
    float: right;
    }

    .news-landing .content-sidebar-wrap {
    width: 700px;
    }

    /* Content
    ------------------------------------------------------------ */

    .content {
    float: left;
    padding: 25px 35px;
    width: 430px;
    }

    .content-sidebar .content,
    .sidebar-content .content {
    width: 580px;
    }

    .content-sidebar-sidebar .content {
    width: 425px;
    }

    .sidebar-content .content,
    .sidebar-sidebar-content .content {
    float: right;
    }

    .home.news.content-sidebar .content {
    padding: 0;
    width: 650px;
    }

    .full-width-content .content {
    width: 910px;
    }

    .full-width-content.news-landing .content {
    width: 630px;
    }

    blockquote {
    background-color: #f5f5f5;
    margin: 5px 15px 20px;
    padding: 15px 20px 0;
    }

    blockquote p {
    color: #666;
    font-family: 'Archivo Narrow', sans-serif;
    font-style: italic;
    }

    .post {
    margin: 0 0 40px;
    }

    .single .post {
    margin: 0 0 10px;
    }

    .entry-content {
    overflow: hidden;
    }

    .entry-content p {
    padding: 0 0 15px;
    }

    p.subscribe-to-comments {
    padding: 20px 0 10px;
    }

    .after-post-ad {
    background-color: #f5f5f5;
    margin: 5px 0 10px;
    padding: 10px;
    overflow: hidden;
    }

    .after-content-ad {
    clear: both;
    margin: 0 auto;
    overflow: hidden;
    padding: 0 0 20px;
    text-align: center;
    width: 960px;
    }

    .more-from-category {
    background: url(images/list.png) no-repeat top left;
    list-style-type: none;
    padding: 0 0 0 15px;
    }

    .clear {
    clear: both;
    }

    .clear-line {
    border-bottom: 1px dotted #ddd;
    clear: both;
    margin: 0 0 15px;
    }

    /* Column Classes
    ------------------------------------------------------------ */

    .five-sixths,
    .four-fifths,
    .four-sixths,
    .one-fifth,
    .one-fourth,
    .one-half,
    .one-sixth,
    .one-third,
    .three-fifths,
    .three-fourths,
    .three-sixths,
    .two-fifths,
    .two-fourths,
    .two-sixths,
    .two-thirds {
    float: left;
    margin: 0 0 20px;
    padding-left: 3%;
    }

    .one-half,
    .three-sixths,
    .two-fourths {
    width: 48%;
    }

    .one-third,
    .two-sixths {
    width: 31%;
    }

    .four-sixths,
    .two-thirds {
    width: 65%;
    }

    .one-fourth {
    width: 22.5%;
    }

    .three-fourths {
    width: 73.5%;
    }

    .one-fifth {
    width: 17.4%;
    }

    .two-fifths {
    width: 37.8%;
    }

    .three-fifths {
    width: 58.2%;
    }

    .four-fifths {
    width: 78.6%;
    }

    .one-sixth {
    width: 14%;
    }

    .five-sixths {
    width: 82%;
    }

    .first {
    clear: both;
    padding-left: 0;
    }

    /* Featured Post Grid
    ------------------------------------------------------------ */

    .genesis-grid-even {
    float: right;
    padding: 0 0 15px;
    width: 48%;
    }

    .genesis-grid-odd {
    clear: both;
    float: left;
    padding: 0 0 15px;
    width: 48%;
    }

    .genesis-grid-even,
    .genesis-grid-odd {
    margin: 0 0 20px;
    }

    /* Headlines
    ------------------------------------------------------------ */

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
    font-family: 'Archivo Narrow', sans-serif;
    margin: 0 0 10px;
    }

    h1,
    h2,
    h2 a,
    h2 a:visited {
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 30px;
    line-height: 30px;
    font-weight: bold;
    }

    .featuredpost h2,
    .featuredpost h2 a {
    font-size: 30px;
    line-height: 30px;
    margin: 0 0 5px;
    font-weight: bold;
    }

    #home-bottom h2,
    #home-top h2 {
    margin: 5px 0;
    }

    .home-middle-right .featuredpost h2,
    .home-middle-right h2 a,
    .sidebar .featuredpost h2,
    .sidebar .featuredpost h2 a {
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 13px;
    font-weight: bold;
    line-height: 18px;
    margin: 10px 0 0;
    }

    .taxonomy-description h1,
    .widget-area h2,
    .widget-area h2 a {
    font-size: 18px;
    line-height: 24px;
    }

    h2 a:hover {
    color: #0094d2;
    text-decoration: none;
    }

    h3 {
    font-size: 24px;
    }

    h4 {
    font-size: 20px;
    }

    .widget h4,
    .widget-area h4 {
    text-transform: uppercase;
    word-spacing: 2px;
    font-weight: bold;
    }

    .widget h4,
    .widget-area h4 {
    font-size: 14px;
    }

    .widget-area h4 a {
    color: #333;
    text-decoration: none;
    }

    .footer-widgets h4 {
    background: none;
    border: none;
    margin: 0 0 5px;
    padding: 0;
    }

    h5 {
    font-size: 18px;
    }

    h6 {
    font-size: 16px;
    }

    /* Ordered / Unordered Lists
    ------------------------------------------------------------ */

    .entry-content ol,
    .entry-content ul {
    margin: 0;
    padding: 0 0 15px;
    }

    .entry-content ol {
    margin: 0;
    }

    .archive-page ul li,
    .entry-content ul li {
    list-style-type: square;
    margin: 0 0 0 30px;
    padding: 0;
    }

    .entry-content ol li {
    margin: 0 0 0 35px;
    }

    .archive-page ul ul,
    .entry-content ol ol,
    .entry-content ul ul {
    padding: 0;
    }

    /* Post Info
    ------------------------------------------------------------ */

    .entry-header .entry-meta {
    font-size: 13px;
    margin: 0 0 15px;
    }

    .featuredpost .entry-header .entry-meta,
    .ui-tabs .entry-header .entry-meta {
    color: #666;
    margin: 0 0 20px;
    }

    .ui-tabs .entry-header .entry-meta {
    margin: 0 0 5px;
    }

    /* Post Meta
    ------------------------------------------------------------ */

    .entry-footer .entry-meta {
    background-color: #ebebeb;
    clear: both;
    font-size: 11px;
    padding: 7px 10px 5px;
    margin: 10px 0 10px 0;
    font-size: 13px;
    }

    /* Author Box
    ------------------------------------------------------------ */

    .author-box {
    background-color: #ebebeb;
    margin: 0 0 40px;
    overflow: hidden;
    padding: 10px 0px 10px;
    }

    .author-box-content p {
    font-size: 13px;
    line-height: 20px;
    color: #333;
    }

    /* Sticky Posts
    ------------------------------------------------------------ */

    .sticky {
    margin: 0 0 40px;
    padding: 20px;
    }

    /* Archive Page
    ------------------------------------------------------------ */

    .archive-page {
    float: left;
    padding: 20px 0;
    width: 45%;
    }

    /* Post Icons
    ------------------------------------------------------------ */

    .entry-categories {
    background: url(images/icon-categories.png) no-repeat top left;
    padding: 3px 0 3px 22px;
    }

    .entry-comments-link {
    background: url(images/icon-comments.png) no-repeat top left;
    margin: 0 0 0 10px;
    padding: 2px 0 2px 22px;
    }

    .entry-tags {
    background: url(images/icon-tags.png) no-repeat top left;
    margin: 0 0 0 10px;
    padding: 3px 0 3px 20px;
    font-size: 13px;
    }

    .time {
    background: url(images/icon-time.png) no-repeat top left;
    padding: 2px 0 2px 21px;
    }

    .featuredpost .entry-comments-link,
    .featuredpost .time {
    background: none;
    margin: 0;
    padding: 0;
    }

    /* Images
    ------------------------------------------------------------ */

    img {
    height: auto;
    max-width: 100%;
    }

    .avatar,
    .entry-content img,
    .featuredpage img,
    .featuredpost img,
    .post-image,
    .ui-tabs img {
    background-color: #none;
    border: none;
    padding: 1px;
    }

    .featuredpost img {
    margin: 0 0 10px;
    }

    img.ad-left {
    float: left;
    margin: 5px 10px 5px 0;
    }

    img.ad-right {
    float: left;
    margin: 5px 0;
    }

    .author-box .avatar {
    border: none;
    float: left;
    height: 100px;
    margin: 0 10px 0 10px;
    width: 100px;
    }

    .post-image {
    margin: 0 10px 10px 0;
    }

    .comment-list li .avatar {
    background-color: #fff;
    float: left;
    height: 30px;
    margin: 0 5px 0 0;
    width: 30px;
    }

    img.centered,
    .aligncenter {
    display: block;
    margin: 0 auto 10px;
    }

    img.alignnone {
    display: inline;
    margin: 0 0 15px;
    }

    img.alignleft {
    display: inline;
    margin: 0 15px 10px 0;
    }

    img.alignright {
    display: inline;
    margin: 0 0 10px 15px;
    }

    .alignleft {
    float: left;
    margin: 0 10px 0 0;
    }

    #home-top .alignleft {
    margin: 0 15px 0 0;
    }

    .alignright {
    float: right;
    margin: 0 0 0 10px;
    }

    .wp-caption {
    background-color: #f5f5f5;
    padding: 10px;
    text-align: center;
    }

    p.wp-caption-text {
    font-size: 12px;
    line-height: 16px;
    padding: 5px 0;
    }

    .wp-smiley,
    .wp-wink {
    border: none;
    float: none;
    }

    .gallery-caption {
    }

    /* Post Navigation
    ------------------------------------------------------------ */

    .pagination {
    overflow: hidden;
    padding: 20px 0;
    width: 100%;
    }

    .pagination li {
    display: inline;
    }

    .pagination li a,
    .pagination li.disabled,
    .pagination li a:hover,
    .pagination li.active a {
    background-color: #333;
    border: 1px solid #333;
    color: #fff;
    padding: 5px 8px;
    text-decoration: none;
    }

    .pagination li a:hover,
    .pagination li.active a {
    background-color: #0094d2;
    border: 1px solid #0094d2;
    }

    /* Primary / Secondary Sidebars
    ------------------------------------------------------------ */

    .sidebar {
    display: inline;
    float: right;
    font-size: 13px;
    line-height: 20px;
    width: 305px;
    }

    .sidebar p {
    font-size: 13px;
    line-height: 20px;
    }

    .sidebar-secondary {
    float: left;
    width: 150px;
    }

    .sidebar-content .sidebar-primary,
    .sidebar-sidebar-content .sidebar-primary {
    float: left;
    }

    .content-sidebar-sidebar .sidebar-secondary {
    float: right;
    }

    .sidebar-primary .widget,
    .sidebar-secondary .widget {
    border-bottom: 1px solid #d5d5d5;
    }

    .sidebar .widget-wrap {
    border-bottom: 4px solid #eee;
    overflow: hidden;
    padding: 15px 20px 20px;
    }

    .sidebar .widget ul {
    margin: 5px 0 -5px;
    }

    .sidebar .widget ul li,
    .sidebar .widget-area ul li {
    background: url(images/list.png) no-repeat top left;
    border-bottom: 1px solid #eee;
    list-style-type: none;
    margin: 0 0 7px;
    padding: 0 0 5px 15px;
    word-wrap: break-word;
    }

    /* Dropdowns
    ------------------------------------------------------------ */

    #cat,
    .widget_archive select {
    display: inline;
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 15px;
    width: 100%;
    }

    /* Featured Page / Post
    ------------------------------------------------------------ */

    .featuredpage,
    .featuredpost {
    clear: both;
    overflow: hidden;
    }

    .featuredpage .page,
    .featuredpost .post {
    border-bottom: 1px dotted #ddd;
    overflow: hidden;
    margin: 0 0 10px;
    padding: 0 0 15px;
    }

    .home.content-sidebar .home-middle-right .featuredpost .post,
    .home.content-sidebar #home-bottom .featuredpost .post {
    padding: 0;
    }

    /* User Profile
    ------------------------------------------------------------ */

    .user-profile {
    overflow: hidden;
    }

    /* Buttons
    ------------------------------------------------------------ */

    input[type="button"],
    input[type="submit"] {
    background-color: #00a7ed;
    border: 1px solid #0094d2;
    color: #fff;
    cursor: pointer;
    font-family: 'Archivo Narrow', sans-serif; !important;
    font-size: 13px;
    font-weight: normal;
    padding: 5px;
    text-decoration: none;
    }

    input:hover[type="button"],
    input:hover[type="submit"] {
    background-color: #0094d2;
    border: 1px solid #0094d2;
    color: #fff;
    text-decoration: none;
    }

    /* Search Form
    ------------------------------------------------------------ */

    .site-header .search-form {
    float: right;
    padding: 25px 20px 0 0;
    }

    .nav-primary .search-form {
    float: right;
    padding: 2px 0 0;
    }

    .search-form input[type="search"] {
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 13px;
    margin: 5px -6px 0 0;
    padding: 5px;
    width: 180px;
    }

    /* eNews and Update Widget
    ------------------------------------------------------------ */

    .enews {
    background: url(images/enews.png) no-repeat top right;
    }

    .enews #subbox {
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 13px;
    margin: 10px -2px 0 0;
    padding: 5px;
    width: 175px;
    }

    /* Calendar Widget
    ------------------------------------------------------------ */

    #wp-calendar {
    width: 100%;
    }

    #wp-calendar caption {
    font-size: 12px;
    font-style: italic;
    padding: 2px 5px 0 0;
    text-align: right;
    }

    #wp-calendar thead {
    background-color: #f5f5f5;
    font-weight: bold;
    margin: 10px 0 0;
    }

    #wp-calendar td {
    background-color: #f5f5f5;
    padding: 2px;
    text-align: center;
    }

    /* Footer Widgets
    ------------------------------------------------------------ */

    .footer-widgets {
    background-color: #fff;
    border-left: 1px solid #d5d5d5;
    border-right: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
    margin: 0 auto;
    overflow: hidden;
    width: 960px;
    }

    .footer-widgets .wrap {
    border: 4px solid #f5f5f5;
    font-size: 13px;
    line-height: 20px;
    overflow: hidden;
    padding: 15px 14px 0;
    }

    .footer-widgets .widget {
    background: none;
    border: none;
    margin: 0 0 15px;
    padding: 0;
    }

    .footer-widgets .textwidget {
    padding: 0;
    }

    .footer-widgets .widget_tag_cloud div div {
    padding: 0;
    }

    .footer-widgets p {
    font-size: 13px;
    line-height: 20px;
    padding: 0 0 10px;
    }

    .footer-widgets .widget ul li,
    .footer-widgets .widget-area ul li {
    background: url(images/list.png) no-repeat top left;
    border-bottom: 1px dotted #ddd;
    list-style-type: none;
    margin: 0 0 7px;
    padding: 0 0 5px 18px;
    word-wrap: break-word;
    }

    .footer-widgets #wp-calendar thead,
    .footer-widgets #wp-calendar td {
    background: none;
    }

    .footer-widgets-1 {
    float: left;
    margin: 0 20px 0 0;
    width: 295px;
    }

    .footer-widgets-2 {
    float: left;
    width: 290px;
    }

    .footer-widgets-3 {
    float: right;
    width: 295px;
    }

    /* Footer
    ------------------------------------------------------------ */

    .site-footer {
    background: url(images/footer.png) no-repeat top;
    clear: both;
    font-size: 11px;
    margin: 0 auto;
    padding: 30px 0 20px;
    overflow: hidden;
    text-transform: uppercase;
    width: 960px;
    line-height: 15px;
    }

    .site-footer p {
    color: #666;
    font-size: 11px;
    }

    .site-footer a,
    .site-footer a:visited {
    color: #666;
    }

    .site-footer a:hover {
    color: #0094d2;
    text-decoration: none;
    }

    .site-footer .gototop {
    float: left;
    padding: 0 0 0 10px;
    width: 200px;
    }

    .site-footer .creds {
    float: right;
    padding: 0 10px 0 0;
    text-align: right;
    width: 735px;
    }

    /* Comments
    ------------------------------------------------------------ */

    .entry-comments,
    #respond {
    margin: 0 0 30px;
    overflow: hidden;
    }

    .entry-comments {
    font-size: 13px;
    line-height: 20px;
    }

    #author,
    #comment,
    #email,
    #url {
    font-size: 12px;
    margin: 10px 5px 0 0;
    padding: 5px;
    width: 250px;
    }

    #comment {
    height: 150px;
    margin: 10px 0;
    width: 98%;
    }

    .ping-list {
    margin: 0 0 40px;
    }

    .comment-list ol,
    .ping-list ol {
    margin: 0;
    padding: 10px;
    }

    .comment-list li,
    .ping-list li {
    font-weight: bold;
    list-style: none;
    margin: 10px 0 0;
    padding: 10px;
    }

    .comment-list li ul li {
    list-style-type: none;
    }

    .comment-list p,
    .ping-list p {
    font-size: 13px;
    font-weight: normal;
    line-height: 20px;
    margin: 10px 5px 10px 0;
    padding: 0;
    text-transform: none;
    }

    .comment-list ul.children {
    margin-top: 20px;
    }

    .comment-list ul.children li.comment {
    background: #fff;
    }

    .comment-list cite,
    .ping-list cite {
    font-style: normal;
    font-weight: bold;
    }

    .comment-meta {
    font-weight:normal;
    }

    .comment-author {
    background: #e5e5e5;
    font-size: 12px;
    font-weight: bold;
    padding: 8px 10px 0;
    }

    .comment-meta {
    background: #e5e5e5;
    font-size: 12px;
    padding: 0 10px 8px;
    }

    .nocomments {
    text-align: center;
    }

    .entry-comments .pagination {
    display: block;
    padding: 0;
    }

    .bypostauthor {
    }

    .thread-alt,
    .thread-even {
    background: #f5f5f5;
    }

    .alt,
    .depth-1,
    .even {
    border: 1px solid #ddd;
    }

    /* Gravity Forms
    ------------------------------------------------------------ */

    div.gform_wrapper input,
    div.gform_wrapper select,
    div.gform_wrapper textarea {
    color: #333;
    font-family: 'Archivo Narrow', sans-serif;
    font-size: 12px !important;
    padding: 4px 5px !important;
    }

    div.gform_footer input.button {
    color: #fff;
    }

    div.gform_wrapper .ginput_complex label {
    font-size: 12px;
    }

    div.gform_wrapper li,
    div.gform_wrapper form li {
    margin: 0 0 10px;
    }

    div.gform_wrapper .gform_footer {
    border: none;
    margin: 0;
    padding: 0;
    }

    /* News Green
    ------------------------------------------------------------ */

    .news-green a,
    .news-green a:visited {
    color: #1c9b3d;
    text-decoration: none;
    }

    .news-green a:hover {
    text-decoration: underline;
    }

    .news-green .site-header ul.nav li li a,
    .news-green .site-header ul.nav li li a:link,
    .news-green .site-header ul.nav li li a:visited,
    .news-green .site-header ul.menu li li a,
    .news-green .site-header ul.menu li li a:link,
    .news-green .site-header ul.menu li li a:visited,
    .news-green .nav-primary li li a,
    .news-green .nav-primary li li a:link,
    .news-green .nav-primary li li a:visited {
    color: #fff;
    }

    .news-green .nav-secondary li li a,
    .news-green .nav-secondary li li a:link,
    .news-green .nav-secondary li li a:visited,
    .news-green h2 a,
    .news-green h2 a:visited {
    color: #333;
    }

    .news-green .site-header ul.nav li a:hover,
    .news-green .site-header ul.nav li a:active,
    .news-green .site-header ul.nav .current_page_item a,
    .news-green .site-header ul.nav .current-cat a,
    .news-green .site-header ul.nav .current-menu-item a,
    .news-green .site-header ul.menu li a:hover,
    .news-green .site-header ul.menu li a:active,
    .news-green .site-header ul.menu .current_page_item a,
    .news-green .site-header ul.menu .current-cat a,
    .news-green .site-header ul.menu .current-menu-item a,
    .news-green .site-header ul.nav li li a:hover,
    .news-green .site-header ul.nav li li a:active,
    .news-green .site-header ul.menu li li a:hover,
    .news-green .site-header ul.menu li li a:active,
    .news-green .nav-primary li a:hover,
    .news-green .nav-primary li a:active,
    .news-green .nav-primary .current_page_item a,
    .news-green .nav-primary .current-cat a,
    .news-green .nav-primary .current-menu-item a,
    .news-green .nav-primary li li a:hover,
    .news-green .nav-primary li li a:active,
    .news-green .nav-primary li.right a:hover,
    .news-green .nav-secondary li a:hover,
    .news-green .nav-secondary li a:active,
    .news-green .nav-secondary .current_page_item a,
    .news-green .nav-secondary .current-cat a,
    .news-green .nav-secondary .current-menu-item a,
    .news-green .nav-secondary li li a:hover,
    .news-green .nav-secondary li li a:active,
    .news-green h2 a:hover,
    .news-green .site-footer a:hover {
    color: #1c9b3d;
    }

    .news-green #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
    .news-green #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
    .news-green .pagination li a:hover,
    .news-green .pagination li.active a {
    background-color: #1c9b3d;
    }

    .news-green .pagination li a:hover,
    .news-green .pagination li.active a {
    border: 1px solid #1c9b3d;
    }

    .news-green h2 a:hover {
    text-decoration: none;
    }

    .news-green input[type="button"],
    .news-green input[type="submit"] {
    background-color: #27c753;
    border: 1px solid #1c9b3d;
    }

    .news-green input:hover[type="button"],
    .news-green input:hover[type="submit"] {
    background-color: #1c9b3d;
    border: 1px solid #1c9b3d;
    }

    /* News Orange
    ------------------------------------------------------------ */

    .news-orange a,
    .news-orange a:visited {
    color: #e88e05;
    text-decoration: none;
    }

    .news-orange a:hover {
    text-decoration: underline;
    }

    .news-orange .site-header ul.nav li li a,
    .news-orange .site-header ul.nav li li a:link,
    .news-orange .site-header ul.nav li li a:visited,
    .news-orange .site-header ul.menu li li a,
    .news-orange .site-header ul.menu li li a:link,
    .news-orange .site-header ul.menu li li a:visited,
    .news-orange .nav-primary li li a,
    .news-orange .nav-primary li li a:link,
    .news-orange .nav-primary li li a:visited {
    color: #fff;
    }

    .news-orange .nav-secondary li li a,
    .news-orange .nav-secondary li li a:link,
    .news-orange .nav-secondary li li a:visited,
    .news-orange h2 a,
    .news-orange h2 a:visited {
    color: #333;
    }

    .news-orange .site-header ul.nav li a:hover,
    .news-orange .site-header ul.nav li a:active,
    .news-orange .site-header ul.nav .current_page_item a,
    .news-orange .site-header ul.nav .current-cat a,
    .news-orange .site-header ul.nav .current-menu-item a,
    .news-orange .site-header ul.menu li a:hover,
    .news-orange .site-header ul.menu li a:active,
    .news-orange .site-header ul.menu .current_page_item a,
    .news-orange .site-header ul.menu .current-cat a,
    .news-orange .site-header ul.menu .current-menu-item a,
    .news-orange .site-header ul.nav li li a:hover,
    .news-orange .site-header ul.nav li li a:active,
    .news-orange .site-header ul.menu li li a:hover,
    .news-orange .site-header ul.menu li li a:active,
    .news-orange .nav-primary li a:hover,
    .news-orange .nav-primary li a:active,
    .news-orange .nav-primary .current_page_item a,
    .news-orange .nav-primary .current-cat a,
    .news-orange .nav-primary .current-menu-item a,
    .news-orange .nav-primary li li a:hover,
    .news-orange .nav-primary li li a:active,
    .news-orange .nav-primary li.right a:hover,
    .news-orange .nav-secondary li a:hover,
    .news-orange .nav-secondary li a:active,
    .news-orange .nav-secondary .current_page_item a,
    .news-orange .nav-secondary .current-cat a,
    .news-orange .nav-secondary .current-menu-item a,
    .news-orange .nav-secondary li li a:hover,
    .news-orange .nav-secondary li li a:active,
    .news-orange h2 a:hover,
    .news-orange .site-footer a:hover {
    color: #e88e05;
    }

    .news-orange #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
    .news-orange #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
    .news-orange .pagination li a:hover,
    .news-orange .pagination li.active a {
    background-color: #e88e05;
    }

    .news-orange .pagination li a:hover,
    .news-orange .pagination li.active a {
    border: 1px solid #e88e05;
    }

    .news-orange h2 a:hover {
    text-decoration: none;
    }

    .news-orange input[type="button"],
    .news-orange input[type="submit"] {
    background-color: #f5a506;
    border: 1px solid #e88e05;
    }

    .news-orange input:hover[type="button"],
    .news-orange input:hover[type="submit"] {
    background-color: #e88e05;
    border: 1px solid #e88e05;
    }

    /* News Pink
    ------------------------------------------------------------ */

    .news-pink a,
    .news-pink a:visited {
    color: #c62765;
    text-decoration: none;
    }

    .news-pink a:hover {
    text-decoration: underline;
    }

    .news-pink .site-header ul.nav li li a,
    .news-pink .site-header ul.nav li li a:link,
    .news-pink .site-header ul.nav li li a:visited,
    .news-pink .site-header ul.menu li li a,
    .news-pink .site-header ul.menu li li a:link,
    .news-pink .site-header ul.menu li li a:visited,
    .news-pink .nav-primary li li a,
    .news-pink .nav-primary li li a:link,
    .news-pink .nav-primary li li a:visited {
    color: #fff;
    }

    .news-pink .nav-secondary li li a,
    .news-pink .nav-secondary li li a:link,
    .news-pink .nav-secondary li li a:visited,
    .news-pink h2 a,
    .news-pink h2 a:visited {
    color: #333;
    }

    .news-pink .site-header ul.nav li a:hover,
    .news-pink .site-header ul.nav li a:active,
    .news-pink .site-header ul.nav .current_page_item a,
    .news-pink .site-header ul.nav .current-cat a,
    .news-pink .site-header ul.nav .current-menu-item a,
    .news-pink .site-header ul.menu li a:hover,
    .news-pink .site-header ul.menu li a:active,
    .news-pink .site-header ul.menu .current_page_item a,
    .news-pink .site-header ul.menu .current-cat a,
    .news-pink .site-header ul.menu .current-menu-item a,
    .news-pink .site-header ul.nav li li a:hover,
    .news-pink .site-header ul.nav li li a:active,
    .news-pink .site-header ul.menu li li a:hover,
    .news-pink .site-header ul.menu li li a:active,
    .news-pink .nav-primary li a:hover,
    .news-pink .nav-primary li a:active,
    .news-pink .nav-primary .current_page_item a,
    .news-pink .nav-primary .current-cat a,
    .news-pink .nav-primary .current-menu-item a,
    .news-pink .nav-primary li li a:hover,
    .news-pink .nav-primary li li a:active,
    .news-pink .nav-primary li.right a:hover,
    .news-pink .nav-secondary li a:hover,
    .news-pink .nav-secondary li a:active,
    .news-pink .nav-secondary .current_page_item a,
    .news-pink .nav-secondary .current-cat a,
    .news-pink .nav-secondary .current-menu-item a,
    .news-pink .nav-secondary li li a:hover,
    .news-pink .nav-secondary li li a:active,
    .news-pink h2 a:hover,
    .news-pink .site-footer a:hover {
    color: #c62765;
    }

    .news-pink #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
    .news-pink #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
    .news-pink .pagination li a:hover,
    .news-pink .pagination li.active a {
    background-color: #c62765;
    }

    .news-pink .pagination li a:hover,
    .news-pink .pagination li.active a {
    border: 1px solid #c62765;
    }

    .news-pink h2 a:hover {
    text-decoration: none;
    }

    .news-pink input[type="button"],
    .news-pink input[type="submit"] {
    background-color: #e8358a;
    border: 1px solid #c62765;
    }

    .news-pink input:hover[type="button"],
    .news-pink input:hover[type="submit"] {
    background-color: #c62765;
    border: 1px solid #c62765;
    }

    /* News Purple
    ------------------------------------------------------------ */

    .news-purple a,
    .news-purple a:visited {
    color: #8827c7;
    text-decoration: none;
    }

    .news-purple a:hover {
    text-decoration: underline;
    }

    .news-purple .site-header ul.nav li li a,
    .news-purple .site-header ul.nav li li a:link,
    .news-purple .site-header ul.nav li li a:visited,
    .news-purple .site-header ul.menu li li a,
    .news-purple .site-header ul.menu li li a:link,
    .news-purple .site-header ul.menu li li a:visited,
    .news-purple .nav-primary li li a,
    .news-purple .nav-primary li li a:link,
    .news-purple .nav-primary li li a:visited {
    color: #fff;
    }

    .news-purple .nav-secondary li li a,
    .news-purple .nav-secondary li li a:link,
    .news-purple .nav-secondary li li a:visited,
    .news-purple h2 a,
    .news-purple h2 a:visited {
    color: #333;
    }

    .news-purple .site-header ul.nav li a:hover,
    .news-purple .site-header ul.nav li a:active,
    .news-purple .site-header ul.nav .current_page_item a,
    .news-purple .site-header ul.nav .current-cat a,
    .news-purple .site-header ul.nav .current-menu-item a,
    .news-purple .site-header ul.menu li a:hover,
    .news-purple .site-header ul.menu li a:active,
    .news-purple .site-header ul.menu .current_page_item a,
    .news-purple .site-header ul.menu .current-cat a,
    .news-purple .site-header ul.menu .current-menu-item a,
    .news-purple .site-header ul.nav li li a:hover,
    .news-purple .site-header ul.nav li li a:active,
    .news-purple .site-header ul.menu li li a:hover,
    .news-purple .site-header ul.menu li li a:active,
    .news-purple .nav-primary li a:hover,
    .news-purple .nav-primary li a:active,
    .news-purple .nav-primary .current_page_item a,
    .news-purple .nav-primary .current-cat a,
    .news-purple .nav-primary .current-menu-item a,
    .news-purple .nav-primary li li a:hover,
    .news-purple .nav-primary li li a:active,
    .news-purple .nav-primary li.right a:hover,
    .news-purple .nav-secondary li a:hover,
    .news-purple .nav-secondary li a:active,
    .news-purple .nav-secondary .current_page_item a,
    .news-purple .nav-secondary .current-cat a,
    .news-purple .nav-secondary .current-menu-item a,
    .news-purple .nav-secondary li li a:hover,
    .news-purple .nav-secondary li li a:active,
    .news-purple h2 a:hover,
    .news-purple .site-footer a:hover {
    color: #8827c7;
    }

    .news-purple #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
    .news-purple #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
    .news-purple .pagination li a:hover,
    .news-purple .pagination li.active a {
    background-color: #8827c7;
    }

    .news-purple .pagination li a:hover,
    .news-purple .pagination li.active a {
    border: 1px solid #8827c7;
    }

    .news-purple h2 a:hover {
    text-decoration: none;
    }

    .news-purple input[type="button"],
    .news-purple input[type="submit"] {
    background-color: #9f2ede;
    border: 1px solid #8827c7;
    }

    .news-purple input:hover[type="button"],
    .news-purple input:hover[type="submit"] {
    background-color: #8827c7;
    border: 1px solid #8827c7;
    }

    /* News Red
    ------------------------------------------------------------ */

    .news-red a,
    .news-red a:visited {
    color: #c72730;
    text-decoration: none;
    }

    .news-red a:hover {
    text-decoration: underline;
    }

    .news-red .site-header ul.nav li li a,
    .news-red .site-header ul.nav li li a:link,
    .news-red .site-header ul.nav li li a:visited,
    .news-red .site-header ul.menu li li a,
    .news-red .site-header ul.menu li li a:link,
    .news-red .site-header ul.menu li li a:visited,
    .news-red .nav-primary li li a,
    .news-red .nav-primary li li a:link,
    .news-red .nav-primary li li a:visited {
    color: #fff;
    }

    .news-red .nav-secondary li li a,
    .news-red .nav-secondary li li a:link,
    .news-red .nav-secondary li li a:visited,
    .news-red h2 a,
    .news-red h2 a:visited {
    color: #333;
    }

    .news-red .site-header ul.nav li a:hover,
    .news-red .site-header ul.nav li a:active,
    .news-red .site-header ul.nav .current_page_item a,
    .news-red .site-header ul.nav .current-cat a,
    .news-red .site-header ul.nav .current-menu-item a,
    .news-red .site-header ul.menu li a:hover,
    .news-red .site-header ul.menu li a:active,
    .news-red .site-header ul.menu .current_page_item a,
    .news-red .site-header ul.menu .current-cat a,
    .news-red .site-header ul.menu .current-menu-item a,
    .news-red .site-header ul.nav li li a:hover,
    .news-red .site-header ul.nav li li a:active,
    .news-red .site-header ul.menu li li a:hover,
    .news-red .site-header ul.menu li li a:active,
    .news-red .nav-primary li a:hover,
    .news-red .nav-primary li a:active,
    .news-red .nav-primary .current_page_item a,
    .news-red .nav-primary .current-cat a,
    .news-red .nav-primary .current-menu-item a,
    .news-red .nav-primary li li a:hover,
    .news-red .nav-primary li li a:active,
    .news-red .nav-primary li.right a:hover,
    .news-red .nav-secondary li a:hover,
    .news-red .nav-secondary li a:active,
    .news-red .nav-secondary .current_page_item a,
    .news-red .nav-secondary .current-cat a,
    .news-red .nav-secondary .current-menu-item a,
    .news-red .nav-secondary li li a:hover,
    .news-red .nav-secondary li li a:active,
    .news-red h2 a:hover,
    .news-red .site-footer a:hover {
    color: #c72730;
    }

    .news-red #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
    .news-red #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
    .news-red .pagination li a:hover,
    .news-red .pagination li.active a {
    background-color: #c72730;
    }

    .news-red .pagination li a:hover,
    .news-red .pagination li.active a {
    border: 1px solid #c72730;
    }

    .news-red h2 a:hover {
    text-decoration: none;
    }

    .news-red input[type="button"],
    .news-red input[type="submit"] {
    background-color: #e93542;
    border: 1px solid #c72730;
    }

    .news-red input:hover[type="button"],
    .news-red input:hover[type="submit"] {
    background-color: #c72730;
    border: 1px solid #c72730;
    }

    /* News Teal
    ------------------------------------------------------------ */

    .news-teal a,
    .news-teal a:visited {
    color: #27c3c7;
    text-decoration: none;
    }

    .news-teal a:hover {
    text-decoration: underline;
    }

    .news-teal .site-header ul.nav li li a,
    .news-teal .site-header ul.nav li li a:link,
    .news-teal .site-header ul.nav li li a:visited,
    .news-teal .site-header ul.menu li li a,
    .news-teal .site-header ul.menu li li a:link,
    .news-teal .site-header ul.menu li li a:visited,
    .news-teal .nav-primary li li a,
    .news-teal .nav-primary li li a:link,
    .news-teal .nav-primary li li a:visited {
    color: #fff;
    }

    .news-teal .nav-secondary li li a,
    .news-teal .nav-secondary li li a:link,
    .news-teal .nav-secondary li li a:visited,
    .news-teal h2 a,
    .news-teal h2 a:visited {
    color: #333;
    }

    .news-teal .site-header ul.nav li a:hover,
    .news-teal .site-header ul.nav li a:active,
    .news-teal .site-header ul.nav .current_page_item a,
    .news-teal .site-header ul.nav .current-cat a,
    .news-teal .site-header ul.nav .current-menu-item a,
    .news-teal .site-header ul.menu li a:hover,
    .news-teal .site-header ul.menu li a:active,
    .news-teal .site-header ul.menu .current_page_item a,
    .news-teal .site-header ul.menu .current-cat a,
    .news-teal .site-header ul.menu .current-menu-item a,
    .news-teal .site-header ul.nav li li a:hover,
    .news-teal .site-header ul.nav li li a:active,
    .news-teal .site-header ul.menu li li a:hover,
    .news-teal .site-header ul.menu li li a:active,
    .news-teal .nav-primary li a:hover,
    .news-teal .nav-primary li a:active,
    .news-teal .nav-primary .current_page_item a,
    .news-teal .nav-primary .current-cat a,
    .news-teal .nav-primary .current-menu-item a,
    .news-teal .nav-primary li li a:hover,
    .news-teal .nav-primary li li a:active,
    .news-teal .nav-primary li.right a:hover,
    .news-teal .nav-secondary li a:hover,
    .news-teal .nav-secondary li a:active,
    .news-teal .nav-secondary .current_page_item a,
    .news-teal .nav-secondary .current-cat a,
    .news-teal .nav-secondary .current-menu-item a,
    .news-teal .nav-secondary li li a:hover,
    .news-teal .nav-secondary li li a:active,
    .news-teal h2 a:hover,
    .news-teal .site-footer a:hover {
    color: #27c3c7;
    }

    .news-teal #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
    .news-teal #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
    .news-teal .pagination li a:hover,
    .news-teal .pagination li.active a {
    background-color: #27c3c7;
    }

    .news-teal .pagination li a:hover,
    .news-teal .pagination li.active a {
    border: 1px solid #27c3c7;
    }

    .news-teal h2 a:hover {
    text-decoration: none;
    }

    .news-teal input[type="button"],
    .news-teal input[type="submit"] {
    background-color: #2edade;
    border: 1px solid #27c3c7;
    }

    .news-teal input:hover[type="button"],
    .news-teal input:hover[type="submit"] {
    background-color: #27c3c7;
    border: 1px solid #27c3c7;
    }

    /* Responsive Design


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

    body,
    .news-landing .site-inner,
    .site-inner {
    width: 100%;
    margin: 0 auto;
    }

    .content-sidebar .site-inner,
    .sidebar-content .site-inner,
    .content-sidebar-sidebar .site-inner,
    .sidebar-sidebar-content .site-inner,
    .sidebar-content-sidebar .site-inner {
    background: #fff;
    }

    .site-header,
    .site-inner,
    .nav-primary {
    border: none;
    }

    .archive-page,
    .content-sidebar .content,
    .content-sidebar .content-sidebar-wrap,
    .content-sidebar-sidebar .content,
    .content-sidebar-sidebar .content-sidebar-wrap,
    .footer-widgets-1,
    .footer-widgets-2,
    .footer-widgets-3,
    .full-width-content.news-landing .content,
    .full-width-content .content,
    .full-width-content .content-sidebar-wrap,
    .home-middle-left,
    .home-middle-right,
    .home.news.content-sidebar .content,
    .news-landing .wrap,
    .sidebar,
    .sidebar-content .content,
    .sidebar-content .content-sidebar-wrap,
    .sidebar-sidebar-content .content-sidebar-wrap,
    .sidebar-content-sidebar .content,
    .sidebar-sidebar-content .content,
    .content-sidebar-wrap,
    .site-footer,
    .site-header,
    #home-bottom,
    #home-middle,
    #home-top,
    .sidebar-secondary {
    box-sizing: border-box;
    width: 100%;
    }

    .site-footer .creds,
    .site-footer .gototop,
    .site-header ul.menu,
    .site-header .widget-area,
    .nav-primary,
    .nav-secondary,
    .title-area {
    float: none;
    text-align: center;
    width: 100%;
    }

    .title-area {
    padding: 10px 0 0;
    }

    .site-header .widget-area {
    padding: 10px 0;
    }

    .site-header .search-form {
    float: none;
    padding: 0;
    text-align: center;
    }

    .site-header ul.menu {
    float: none;
    }

    .site-header li,
    .nav-primary li,
    .nav-secondary li {
    display: inline-block;
    float: none;
    }

    .site-header li li,
    .nav-primary li li,
    .nav-secondary li li {
    text-align: left;
    }

    .nav-primary li.right,
    .nav-secondary li.social-facebook,
    .nav-secondary li.social-rss,
    .nav-secondary li.social-twitter {
    display: none;
    }

    .home.content-sidebar #home-bottom .featuredpost .post {
    padding: 0 0 10px;
    }

    .entry-content img,
    .featuredpage img,
    .featuredpost img,
    .post-image,
    .ui-tabs img {
    border: none;
    padding: 0;
    }

    img.ad-left,
    img.ad-right {
    float: left;
    margin: 5px 10px 5px 0;
    }

    .site-footer {
    background: none;
    padding: 15px 0 10px;
    }

    .site-footer p {
    padding: 0 20px;
    }

    }


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

    .site-title {
    font-size: 36px;
    line-height: 1;
    }

    .nav-primary li a,
    .nav-secondary li a {
    font-size: 12px;
    padding: 5px;
    }

    #home-top .ui-tabs ul.ui-tabs-nav {
    display: none;
    }

    .content {
    padding: 15px 20px;
    }

    h1,
    h2,
    h2 a,
    h2 a:visited {
    font-size: 24px;
    }

    h3,
    h4 {
    font-size: 18px;
    }

    .five-sixths,
    .four-fifths,
    .four-sixths,
    .one-fifth,
    .one-fourth,
    .one-half,
    .one-sixth,
    .one-third,
    .three-fifths,
    .three-fourths,
    .three-sixths,
    .two-fifths,
    .two-fourths,
    .two-sixths,
    .two-thirds {
    padding: 0;
    width: 100%;
    }

    }
    */

    December 7, 2013 at 6:16 pm #77583
    Derek
    Member

    Did you download the updated HTML 5 News Pro theme yet?

    http://www.studiopress.com/releases/news-pro-theme.htm


    ~’;’~

    December 7, 2013 at 6:26 pm #77586
    stinkykong
    Participant

    One problem when building a WP site and adding so many ingredients such as plugins, there are issues you run into that may make it easier to start over from scratch, not only when you try to upgrade to HTML5 but even more so when you move to a responsive design which you don't have currently. It may be that the converter (or any way to manually convert to HTML5) may require a responsive theme....I'm not sure. But what I see with UberMenus and MegaMenus, etc, etc, I think you might be better doing what SnakeAir is hinting at and upgrade to the new version of News and move from there. Surely a lot of work but I'd predict that to be the easier way.

    This is probably of no help at all, but it's the way I'd approach this. I believe the responsive aspect is even more important than the HTML5 aspect. Both are good and both come with the News-Pro version.


    Web Design by Websentia Web Services
    http://websentia.com

    December 7, 2013 at 6:31 pm #77588
    Fawk
    Member

    Thanks guys. I guess if that's the way to go then so be it.

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2025 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble