<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />

<title>[25060] trunk/src/wp-content/themes/twentyfourteen: Twenty Fourteen: change IDs to classes in markup and CSS selectors.</title>

</head>

<body>

<style type="text/css"><!--

#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }

#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }

#msg dt:after { content:':';}

#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }

#msg dl a { font-weight: bold}

#msg dl a:link    { color:#fc3; }

#msg dl a:active  { color:#ff0; }

#msg dl a:visited { color:#cc6; }

h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }

#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }

#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }

#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }

#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }

#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }

#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }

#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }

#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }

#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }

#logmsg pre { background: #eee; padding: 1em; }

#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}

#logmsg dl { margin: 0; }

#logmsg dt { font-weight: bold; }

#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }

#logmsg dd:before { content:'\00bb';}

#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }

#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }

#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }

#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }

#logmsg table th.Corner { text-align: left; }

#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }

#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }

#patch { width: 100%; }

#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}

#patch .propset h4, #patch .binary h4 {margin:0;}

#patch pre {padding:0;line-height:1.2em;margin:0;}

#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}

#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}

#patch span {display:block;padding:0 10px;}

#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}

#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}

#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}

#patch .lines, .info {color:#888;background:#fff;}

--></style>

<div id="msg">

<dl class="meta">

<dt>Revision</dt> <dd><a href="http://core.trac.wordpress.org/changeset/25060">25060</a></dd>

<dt>Author</dt> <dd>lancewillett</dd>

<dt>Date</dt> <dd>2013-08-20 17:30:18 +0000 (Tue, 20 Aug 2013)</dd>

</dl>

<h3>Log Message</h3>

<pre>Twenty Fourteen: change IDs to classes in markup and CSS selectors. Props obenland, see <a href="http://core.trac.wordpress.org/ticket/24858">#24858</a>.</pre>

<h3>Modified Paths</h3>

<ul>

<li><a href="#trunksrcwpcontentthemestwentyfourteenjsthemejs">trunk/src/wp-content/themes/twentyfourteen/js/theme.js</a></li>

<li><a href="#trunksrcwpcontentthemestwentyfourteenrtlcss">trunk/src/wp-content/themes/twentyfourteen/rtl.css</a></li>

<li><a href="#trunksrcwpcontentthemestwentyfourteensidebarcontentphp">trunk/src/wp-content/themes/twentyfourteen/sidebar-content.php</a></li>

<li><a href="#trunksrcwpcontentthemestwentyfourteenstylecss">trunk/src/wp-content/themes/twentyfourteen/style.css</a></li>

</ul>

</div>

<div id="patch">

<h3>Diff</h3>

<a id="trunksrcwpcontentthemestwentyfourteenjsthemejs"></a>

<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/js/theme.js (25059 => 25060)</h4>

<pre class="diff"><span>

<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/js/theme.js   2013-08-20 12:33:07 UTC (rev 25059)

+++ trunk/src/wp-content/themes/twentyfourteen/js/theme.js      2013-08-20 17:30:18 UTC (rev 25060)

</span><span class="lines">@@ -4,9 +4,9 @@

</span><span class="cx"> 

</span><span class="cx">          var $primaryNaviClone,

</span><span class="cx">                  $secondaryNaviClone,

</span><del>-                       $masthead = $( 'header#masthead' ),

-                       $secondaryTop = $( 'div#secondary-top' ),

-                       $mobileNavigations = $( 'div#mobile-navigations'),

</del><ins>+                        $masthead = $( '#masthead' ),

+                       $secondaryTop = $( '#secondary-top' ),

+                       $mobileNavigations = $( '#mobile-navigations'),

</ins><span class="cx">                   $socialLinksWrapper = $( 'div.social-links-wrapper' ),

</span><span class="cx">                  $searchBoxWrapper = $( 'div.search-box-wrapper' ),

</span><span class="cx">                  $searchToggle = $( 'div.search-toggle' ),

</span><span class="lines">@@ -16,7 +16,7 @@

</span><span class="cx">          // Toggle function.

</span><span class="cx">          function menuToggle() {

</span><span class="cx">                  $( 'span#nav-toggle' ).toggleClass( 'active' );

</span><del>-                       $masthead.find( 'div#mobile-navigations' ).toggleClass( 'hide' );

</del><ins>+                        $masthead.find( '#mobile-navigations' ).toggleClass( 'hide' );

</ins><span class="cx">           }

</span><span class="cx"> 

</span><span class="cx">          // Click event for toggle the social links

</span><span class="lines">@@ -48,7 +48,7 @@

</span><span class="cx">          // DOM manupilations for mobile header

</span><span class="cx">          function mobileHeader() {

</span><span class="cx">                  // Check if the toggler exists. If not add it.

</span><del>-                       if ( ! $( 'span#nav-toggle' ).length )

</del><ins>+                        if ( ! $( '#nav-toggle' ).length )

</ins><span class="cx">                   $( '<span id="nav-toggle" class="genericon" />' ).appendTo( $masthead );

</span><span class="cx"> 

</span><span class="cx">                  // Clone and detach the primary navigation for use later

</span><span class="lines">@@ -104,7 +104,7 @@

</span><span class="cx">          // Sticky header.

</span><span class="cx">          var $mastheadOffset  = -1,

</span><span class="cx">                  $toolbarOffset = $( 'body' ).is( '.admin-bar' ) ? 32 : 0,

</span><del>-                       $maindiv = $( 'div#main' );

</del><ins>+                        $maindiv = $( '#main' );

</ins><span class="cx"> 

</span><span class="cx">          $( window ).on( 'scroll', false, function() {

</span><span class="cx">                  if ( $mastheadOffset < 0 )

</span></span></pre></div>

<a id="trunksrcwpcontentthemestwentyfourteenrtlcss"></a>

<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/rtl.css (25059 => 25060)</h4>

<pre class="diff"><span>

<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/rtl.css       2013-08-20 12:33:07 UTC (rev 25059)

+++ trunk/src/wp-content/themes/twentyfourteen/rtl.css  2013-08-20 17:30:18 UTC (rev 25060)

</span><span class="lines">@@ -107,7 +107,7 @@

</span><span class="cx">  margin: 0.8rem 0 0.8rem 1.0rem;

</span><span class="cx"> }

</span><span class="cx"> 

</span><del>-.search-box #searchform input[type="text"] {

</del><ins>+.search-box .search-field {

</ins><span class="cx">   float: left;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="lines">@@ -259,8 +259,8 @@

</span><span class="cx"> 

</span><span class="cx"> .post-navigation .nav-previous,

</span><span class="cx"> .post-navigation .nav-next,

</span><del>-#image-navigation .previous-image,

-#image-navigation .next-image {

</del><ins>+.image-navigation .previous-image,

+.image-navigation .next-image {

</ins><span class="cx">   text-align: right;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="lines">@@ -315,7 +315,7 @@

</span><span class="cx">  margin-left: auto;

</span><span class="cx"> }

</span><span class="cx"> 

</span><del>-#comments li #respond {

</del><ins>+.comment .comment-respond {

</ins><span class="cx">   margin-right: 47px;

</span><span class="cx">  margin-right: 4.7rem;

</span><span class="cx">  margin-left: auto;

</span><span class="lines">@@ -339,17 +339,17 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> /* Caledar widget*/

</span><del>-.widget_calendar #wp-calendar caption {

</del><ins>+.widget_calendar caption {

</ins><span class="cx">   text-align: right;

</span><span class="cx"> }

</span><span class="cx"> 

</span><del>-.widget_calendar #wp-calendar tfoot td#prev {

</del><ins>+.widget_calendar#prev {

</ins><span class="cx">   padding-right: 5px;

</span><span class="cx">  padding-right: 0.5rem;

</span><span class="cx">  padding-left: 0;

</span><span class="cx"> }

</span><span class="cx"> 

</span><del>-.widget_calendar #wp-calendar tfoot td#next {

</del><ins>+.widget_calendar #next {

</ins><span class="cx">   border-left: 1px solid rgba(255, 255, 255, 0.2);

</span><span class="cx">  padding-left: 5px;

</span><span class="cx">  padding-left: 0.5rem;

</span><span class="lines">@@ -362,13 +362,13 @@

</span><span class="cx"> /* =Content Sidebar

</span><span class="cx"> ----------------------------------------------- */

</span><span class="cx"> 

</span><del>-#content-sidebar .widget .children,

-#content-sidebar .widget .sub-menu {

</del><ins>+.content-sidebar .widget .children,

+.content-sidebar .widget .sub-menu {

</ins><span class="cx">   margin:0 20px 0 0;

</span><span class="cx">  margin:0 2.0rem 0 0;

</span><span class="cx"> }

</span><span class="cx"> 

</span><del>-#content-sidebar .widget .widgets-multi-column-grid li {

</del><ins>+.content-sidebar .widget .widgets-multi-column-grid li {

</ins><span class="cx">   padding: 0 0 6px 8px;

</span><span class="cx">  padding: 0 0 0.6rem 0.8rem;

</span><span class="cx"> }

</span><span class="lines">@@ -387,54 +387,54 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 400px) {

</span><del>-       #primary .featured-post:before,

-       #primary .post-format a:before,

-       #primary .post-format + span.entry-date a:before,

-       #primary span.entry-date a:before,

-       #primary .byline a:before,

-       #primary .comments-link a:before,

</del><ins>+        .content-area .featured-post:before,

+       .content-area .post-format a:before,

+       .content-area .post-format + .entry-date a:before,

+       .content-area .entry-date a:before,

+       .content-area .byline a:before,

+       .content-area .comments-link a:before,

</ins><span class="cx">   .entry-comment .edit-link a:before,

</span><del>-       .attachment span.entry-date:before,

-       #primary .full-size-link a:before,

-       #primary .parent-post-link a:before {

</del><ins>+        .attachment .entry-date:before,

+       .content-area .full-size-link a:before,

+       .content-area .parent-post-link a:before {

</ins><span class="cx">           margin: 0 0 0 2px;

</span><span class="cx">          margin: 0 0 0 0.2rem;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .entry-meta > span {

</del><ins>+        .content-area .entry-meta > span {

</ins><span class="cx">           margin-left: 10px;

</span><span class="cx">          margin-left: 1.0rem;

</span><span class="cx">          margin-right: auto;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .format-video .post-format a:before {

</del><ins>+        .content-area .format-video .post-format a:before {

</ins><span class="cx">           margin: -1px 0 0 2px;

</span><span class="cx">          margin: -0.1rem 0 0 0.2rem;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .format-image .post-format a:before {

</del><ins>+        .content-area .format-image .post-format a:before {

</ins><span class="cx">           margin: -1px 0 0 2px;

</span><span class="cx">          margin: -0.1rem 0 0 0.2rem;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .format-gallery .post-format a:before {

</del><ins>+        .content-area .format-gallery .post-format a:before {

</ins><span class="cx">           margin: -1px 0 0 4px;

</span><span class="cx">          margin: -0.1rem 0 0 0.4rem;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .featured-post:before {

</del><ins>+        .content-area .featured-post:before {

</ins><span class="cx">           margin: -1px 0 0 3px;

</span><span class="cx">          margin: -0.1rem 0 0 0.3rem;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .post-format + span.entry-date a:before,

-       #primary span.entry-date a:before,

-       .attachment span.entry-date:before {

</del><ins>+        .content-area .post-format + .entry-date a:before,

+       .content-area .entry-date a:before,

+       .attachment .entry-date:before {

</ins><span class="cx">           margin: 0 0 0 1px;

</span><span class="cx">          margin: 0 0 0 0.1rem;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .comments-link a:before {

</del><ins>+        .content-area .comments-link a:before {

</ins><span class="cx">           margin: -1px 0 0 2px;

</span><span class="cx">          margin: -0.1rem 0 0 0.2rem;

</span><span class="cx">  }

</span><span class="lines">@@ -451,7 +451,7 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 672px) {

</span><del>-       #primary {

</del><ins>+        .content-area {

</ins><span class="cx">           float: right;

</span><span class="cx">  }

</span><span class="cx"> 

</span><span class="lines">@@ -494,10 +494,10 @@

</span><span class="cx"> 

</span><span class="cx">  .comments-title,

</span><span class="cx">  .nocomments,

</span><del>-       #comments #respond,

</del><ins>+        .comment-respond,

</ins><span class="cx">   .comments-area article,

</span><del>-       .comment-list li.trackback,

-       .comment-list li.pingback,

</del><ins>+        .comment-list .trackback,

+       .comment-list .pingback,

</ins><span class="cx">   .post-navigation [rel="prev"],

</span><span class="cx">  .post-navigation [rel="next"] {

</span><span class="cx">          padding-left: 9.12778904%;

</span><span class="lines">@@ -509,11 +509,11 @@

</span><span class="cx">          padding-left: 0;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><span class="cx">  .full-width .comment-list li.trackback,

</span><span class="cx">  .full-width .comment-list li.pingback {

</span><span class="lines">@@ -530,24 +530,24 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 870px) {

</span><del>-       #primary .entry-header {

</del><ins>+        .content-area .entry-header {

</ins><span class="cx">           margin-left: 8.03571428%;

</span><span class="cx">          margin-right: 12.5%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .entry-content,

-       #primary .entry-summary {

</del><ins>+        .content-area .entry-content,

+       .content-area .entry-summary {

</ins><span class="cx">           margin-left: 8.03571428%;

</span><span class="cx">          margin-right: 12.5%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary footer.entry-meta {

</del><ins>+        .content-area footer.entry-meta {

</ins><span class="cx">           margin: 12px 12.5% 24px 8.03571428%;

</span><span class="cx">          margin: 1.2rem 12.5% 2.4rem 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       .page #primary .entry-header,

-       .error404 #primary .entry-header {

</del><ins>+        .page .content-area .entry-header,

+       .error404 .content-area .entry-header {

</ins><span class="cx">           margin: 0 12.5% 0 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><span class="lines">@@ -558,7 +558,7 @@

</span><span class="cx"> 

</span><span class="cx">  .comments-title,

</span><span class="cx">  .nocomments,

</span><del>-       #comments #respond,

</del><ins>+        .comment-respond,

</ins><span class="cx">   .comments-area article,

</span><span class="cx">  .comment-list li.trackback,

</span><span class="cx">  .comment-list li.pingback,

</span><span class="lines">@@ -568,7 +568,7 @@

</span><span class="cx">          padding-right: 17.06896551%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #comments #respond {

</del><ins>+        .comment-respond {

</ins><span class="cx">           padding-left: 13.8900862%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><span class="lines">@@ -589,14 +589,14 @@

</span><span class="cx">          padding-top: 7.2rem;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><del>-       .full-width .comment-list li.trackback,

-       .full-width .comment-list li.pingback {

</del><ins>+        .full-width .comment-list .trackback,

+       .full-width .comment-list .pingback {

</ins><span class="cx">           padding-left: 11.30926724%;

</span><span class="cx">          padding-right: 11.30926724%;

</span><span class="cx">  }

</span><span class="lines">@@ -611,19 +611,19 @@

</span><span class="cx">          margin-right: auto;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .no-results .entry-header {

</del><ins>+        .content-area .no-results .entry-header {

</ins><span class="cx">           margin-right: 12.5%;

</span><span class="cx">          margin-left: 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .no-results .entry-content {

</del><ins>+        .content-area .no-results .entry-content {

</ins><span class="cx">           margin-right: 12.5%;

</span><span class="cx">          margin-left: 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 1008px) {

</span><del>-       #page:before {

</del><ins>+        .site:before {

</ins><span class="cx">           right: 0;

</span><span class="cx">          left: auto;

</span><span class="cx">  }

</span><span class="lines">@@ -660,7 +660,7 @@

</span><span class="cx">          margin: 0 22.2rem 0 27.31707317%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #content-sidebar,

</del><ins>+        .content-sidebar,

</ins><span class="cx">   .post-formatted-posts {

</span><span class="cx">          margin: 0 -27.31707317% 0 0;

</span><span class="cx">  }

</span><span class="lines">@@ -671,7 +671,7 @@

</span><span class="cx">          padding-left: 0;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #colophon {

</del><ins>+        .site-footer {

</ins><span class="cx">           padding-right: 27px;

</span><span class="cx">          padding-right: 2.7rem;

</span><span class="cx">          padding-left: 0;

</span><span class="lines">@@ -691,10 +691,10 @@

</span><span class="cx"> 

</span><span class="cx">  .comments-title,

</span><span class="cx">  .nocomments,

</span><del>-       #comments #respond,

</del><ins>+        .comment-respond,

</ins><span class="cx">   .comments-area article,

</span><del>-       .comment-list li.trackback,

-       .comment-list li.pingback,

</del><ins>+        .comment-list .trackback,

+       .comment-list .pingback,

</ins><span class="cx">   .post-navigation [rel="prev"],

</span><span class="cx">  .post-navigation [rel="next"] {

</span><span class="cx">          padding-left: 9.87001616%;

</span><span class="lines">@@ -712,14 +712,14 @@

</span><span class="cx">          padding-left: 0;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><del>-       .full-width .comment-list li.trackback,

-       .full-width .comment-list li.pingback {

</del><ins>+        .full-width .comment-list .trackback,

+       .full-width .comment-list .pingback {

</ins><span class="cx">           padding-left: 5.882236%;

</span><span class="cx">          padding-right: 5.882236%;

</span><span class="cx">  }

</span><span class="lines">@@ -745,34 +745,34 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 1150px) {

</span><del>-       #primary .entry-header {

</del><ins>+        .content-area .entry-header {

</ins><span class="cx">           margin: -48px 12.5% 0 8.03571428%;

</span><span class="cx">          margin: -4.8rem 12.5% 0 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .entry-content,

-       #primary .entry-summary {

</del><ins>+        .content-area .entry-content,

+       .content-area .entry-summary {

</ins><span class="cx">           margin: 0 12.5% 0 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary footer.entry-meta {

</del><ins>+        .content-area footer.entry-meta {

</ins><span class="cx">           margin: 12px 12.5% 24px 8.03571428%;

</span><span class="cx">          margin: 1.2rem 12.5% 2.4rem 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><span class="cx">  .comments-title,

</span><span class="cx">  .nocomments,

</span><del>-       #comments #respond,

</del><ins>+        .comment-respond,

</ins><span class="cx">   .comments-area article,

</span><del>-       .comment-list li.trackback,

-       .comment-list li.pingback,

</del><ins>+        .comment-list .trackback,

+       .comment-list .pingback,

</ins><span class="cx">   .post-navigation [rel="prev"],

</span><span class="cx">  .post-navigation [rel="next"] {

</span><span class="cx">          padding-left: 12.44146986%;

</span><span class="cx">          padding-right: 16.77524429%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #comments #respond {

</del><ins>+        .comment-respond {

</ins><span class="cx">           padding-left: 13.73697916%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><span class="lines">@@ -793,24 +793,24 @@

</span><span class="cx">          margin: 0 12.5% 2.4rem 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       .page #primary .entry-header,

-       .error404 #primary .entry-header {

</del><ins>+        .page .content-area .entry-header,

+       .error404 .content-area .entry-header {

</ins><span class="cx">           margin: 0 12.5% 0 8.03571428%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><del>-       .full-width .comment-list li.trackback,

-       .full-width .comment-list li.pingback {

</del><ins>+        .full-width .comment-list .trackback,

+       .full-width .comment-list .pingback {

</ins><span class="cx">           padding-left: 11.21868265%;

</span><span class="cx">          padding-right: 11.21868265%;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .entry-content .wp-caption.alignright .wp-caption-text {

</del><ins>+        .content-area .entry-content .wp-caption.alignright .wp-caption-text {

</ins><span class="cx">           padding-right: 10px;

</span><span class="cx">          padding-right: 1.0rem;

</span><span class="cx">          padding-left: 0;

</span><span class="lines">@@ -828,25 +828,25 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 1230px) {

</span><del>-       #content-sidebar,

</del><ins>+        .content-sidebar,

</ins><span class="cx">   .post-formatted-posts {

</span><span class="cx">          padding-left: 0;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #primary .full-width .entry-header,

-       #primary .full-width .entry-content,

-       #primary .full-width footer.entry-meta {

</del><ins>+        .content-area .full-width .entry-header,

+       .content-area .full-width .entry-content,

+       .content-area .full-width footer.entry-meta {

</ins><span class="cx">           margin: 0 11.21868265% 0 0;

</span><span class="cx">  }

</span><span class="cx"> 

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><del>-       .full-width .comment-list li.trackback,

-       .full-width .comment-list li.pingback {

</del><ins>+        .full-width .comment-list .trackback,

+       .full-width .comment-list .pingback {

</ins><span class="cx">           padding-left: 0;

</span><span class="cx">  }

</span><span class="cx"> }

</span><span class="cx">\ No newline at end of file

</span></span></pre></div>

<a id="trunksrcwpcontentthemestwentyfourteensidebarcontentphp"></a>

<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/sidebar-content.php (25059 => 25060)</h4>

<pre class="diff"><span>

<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/sidebar-content.php   2013-08-20 12:33:07 UTC (rev 25059)

+++ trunk/src/wp-content/themes/twentyfourteen/sidebar-content.php      2013-08-20 17:30:18 UTC (rev 25060)

</span><span class="lines">@@ -6,7 +6,7 @@

</span><span class="cx">  * @subpackage Twenty_Fourteen

</span><span class="cx">  */

</span><span class="cx"> ?>

</span><del>-<div id="content-sidebar" class="widget-area" role="complementary">

</del><ins>+<div id="content-sidebar" class="content-sidebar widget-area" role="complementary">

</ins><span class="cx">   <?php do_action( 'before_sidebar' ); ?>

</span><span class="cx"> 

</span><span class="cx">  <?php if ( ! dynamic_sidebar( 'sidebar-2' ) ) : ?>

</span></span></pre></div>

<a id="trunksrcwpcontentthemestwentyfourteenstylecss"></a>

<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/style.css (25059 => 25060)</h4>

<pre class="diff"><span>

<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/style.css     2013-08-20 12:33:07 UTC (rev 25059)

+++ trunk/src/wp-content/themes/twentyfourteen/style.css        2013-08-20 17:30:18 UTC (rev 25060)

</span><span class="lines">@@ -220,7 +220,8 @@

</span><span class="cx"> ol {

</span><span class="cx">  list-style: decimal;

</span><span class="cx"> }

</span><del>-ul ul, ol ol, ul ol, ol ul {

</del><ins>+li > ul,

+li > ol {

</ins><span class="cx">   margin-bottom: 0;

</span><span class="cx">  margin-left: 20px;

</span><span class="cx">  margin-left: 2.0rem;

</span><span class="lines">@@ -449,7 +450,7 @@

</span><span class="cx">  color: #5FF23D;

</span><span class="cx"> }

</span><span class="cx"> /* Animated elements */

</span><del>-#page a,

</del><ins>+.site a,

</ins><span class="cx"> .more-link .meta-nav,

</span><span class="cx"> .more-formatted-posts-link .meta-nav,

</span><span class="cx"> .attachment-featured-featured img,

</span><span class="lines">@@ -459,8 +460,7 @@

</span><span class="cx"> button,

</span><span class="cx"> html input[type="button"],

</span><span class="cx"> input[type="reset"],

</span><del>-input[type="submit"],

-#infinite-handle span {

</del><ins>+input[type="submit"] {

</ins><span class="cx">   -webkit-transition: all 0.2s ease-out;

</span><span class="cx">  -moz-transition: all 0.2s ease-out;

</span><span class="cx">  -ms-transition: all 0.2s ease-out;

</span><span class="lines">@@ -543,17 +543,17 @@

</span><span class="cx">  background-color: #f5f5f5;

</span><span class="cx">  text-rendering: optimizeLegibility;

</span><span class="cx"> }

</span><del>-#page {

</del><ins>+.site {

</ins><span class="cx">   background-color: #fff;

</span><span class="cx">  max-width: 1230px;

</span><span class="cx">  max-width: 123.0rem;

</span><span class="cx">  position: relative;

</span><span class="cx"> }

</span><del>-#main {

</del><ins>+.site-main {

</ins><span class="cx">   max-width: 1230px;

</span><span class="cx">  max-width: 123.0rem;

</span><span class="cx"> }

</span><del>-#primary {

</del><ins>+.content-area {

</ins><span class="cx">   padding-top:24px;

</span><span class="cx">  padding-top:2.4rem;

</span><span class="cx"> }

</span><span class="lines">@@ -567,7 +567,7 @@

</span><span class="cx">  position: relative;

</span><span class="cx">  z-index: 2;

</span><span class="cx"> }

</span><del>-#content-sidebar {

</del><ins>+.content-sidebar {

</ins><span class="cx">   -moz-box-sizing: border-box;

</span><span class="cx">  box-sizing: border-box;

</span><span class="cx">  padding: 36px 10px 0;

</span><span class="lines">@@ -583,7 +583,7 @@

</span><span class="cx">  position: relative;

</span><span class="cx">  z-index: 3;

</span><span class="cx"> }

</span><del>-#colophon {

</del><ins>+.site-footer {

</ins><span class="cx">   background-color: #000;

</span><span class="cx">  color: rgba(255, 255, 255, 0.4);

</span><span class="cx">  font-size: 12px;

</span><span class="lines">@@ -598,7 +598,7 @@

</span><span class="cx"> /* =Header

</span><span class="cx"> ----------------------------------------------- */

</span><span class="cx"> 

</span><del>-#masthead {

</del><ins>+.site-header {

</ins><span class="cx">   background-color: #000;

</span><span class="cx">  max-width: 1230px;

</span><span class="cx">  max-width: 123.0rem;

</span><span class="lines">@@ -608,12 +608,12 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> /* Fixed Header */

</span><del>-#masthead.masthead-fixed {

</del><ins>+.site-header.masthead-fixed {

</ins><span class="cx">   box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);

</span><span class="cx">  position: fixed;

</span><span class="cx">          top: 0;

</span><span class="cx"> }

</span><del>-.admin-bar #masthead.masthead-fixed {

</del><ins>+.admin-bar .site-header.masthead-fixed {

</ins><span class="cx">   top: 32px;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="lines">@@ -1049,7 +1049,7 @@

</span><span class="cx">  display: inline;

</span><span class="cx"> }

</span><span class="cx"> .post-formatted-posts .entry-title:after,

</span><del>-#primary span + span.entry-date:before,

</del><ins>+.content-area span + span.entry-date:before,

</ins><span class="cx"> span + .byline:before,

</span><span class="cx"> span + .comments-link:before,

</span><span class="cx"> span + .edit-link:before,

</span><span class="lines">@@ -1102,15 +1102,15 @@

</span><span class="cx">  margin-bottom: 3.6rem;

</span><span class="cx"> }

</span><span class="cx"> 

</span><del>-/* #primary specific styles */

-#primary .entry-header,

-#primary .page-header {

</del><ins>+/* .content-area specific styles */

+.content-area .entry-header,

+.content-area .page-header {

</ins><span class="cx">   background-color: #fff;

</span><span class="cx">  padding: 24px 10px 12px;

</span><span class="cx">  padding: 2.4rem 1.0rem 1.2rem;

</span><span class="cx"> }

</span><del>-#primary .entry-title,

-#primary .page-title {

</del><ins>+.content-area .entry-title,

+.content-area .page-title {

</ins><span class="cx">   font-size: 33px;

</span><span class="cx">  font-size: 3.3rem;

</span><span class="cx">  font-weight: 300;

</span><span class="lines">@@ -1119,30 +1119,30 @@

</span><span class="cx">  margin-bottom: 1.2rem;

</span><span class="cx">  text-transform: uppercase;

</span><span class="cx"> }

</span><del>-#primary .entry-meta {

</del><ins>+.content-area .entry-meta {

</ins><span class="cx">   background-color: #fff;

</span><span class="cx">  margin-bottom: 8px;

</span><span class="cx">  margin-bottom: 0.8rem;

</span><span class="cx">  text-transform: uppercase;

</span><span class="cx"> }

</span><del>-#primary .entry-content,

-#primary .page-content,

-#primary .entry-summary {

</del><ins>+.content-area .entry-content,

+.content-area .page-content,

+.content-area .entry-summary {

</ins><span class="cx">   background-color: #fff;

</span><span class="cx">  padding: 12px 10px 0;

</span><span class="cx">  padding: 1.2rem 1.0rem 0;

</span><span class="cx"> }

</span><del>-#primary footer.entry-meta {

</del><ins>+.content-area footer.entry-meta {

</ins><span class="cx">   margin-top: 12px;

</span><span class="cx">  margin-top: 1.2rem;

</span><span class="cx">  padding: 0 10px;

</span><span class="cx">  padding: 0 1.0rem;

</span><span class="cx"> }

</span><del>-#primary footer.entry-meta .entry-meta {

</del><ins>+.content-area footer.entry-meta .entry-meta {

</ins><span class="cx">   margin-bottom: 24px;

</span><span class="cx">  margin-bottom: 2.4rem;

</span><span class="cx"> }

</span><del>-#primary footer.entry-meta .entry-title {

</del><ins>+.content-area footer.entry-meta .entry-title {

</ins><span class="cx">   font-size: 12px;

</span><span class="cx">  font-size: 1.2rem;

</span><span class="cx">  font-weight: 400;

</span><span class="lines">@@ -1151,59 +1151,59 @@

</span><span class="cx">  margin-bottom: 0.8rem;

</span><span class="cx">  text-transform: none;

</span><span class="cx"> }

</span><del>-#primary footer.entry-meta .entry-title a {

</del><ins>+footer.entry-meta .entry-title a {

</ins><span class="cx">   color: #8c8c8c;

</span><span class="cx"> }

</span><del>-#primary footer.entry-meta .entry-title a:hover {

</del><ins>+footer.entry-meta .entry-title a:hover {

</ins><span class="cx">   color: #2b2b2b;

</span><span class="cx"> }

</span><del>-#primary .format-aside,

-#primary .format-quote,

-#primary .format-link,

-#primary .format-image,

-#primary .format-video {

</del><ins>+.format-aside,

+.format-quote,

+.format-link,

+.format-image,

+.format-video {

</ins><span class="cx">   border-top: 1px solid rgba(0, 0, 0, 0.1);

</span><span class="cx"> }

</span><del>-#primary .format-aside .entry-header .entry-title,

-#primary .format-quote .entry-header .entry-title,

-#primary .format-link .entry-header .entry-title {

</del><ins>+.format-aside .entry-title,

+.format-quote .entry-title,

+.format-link .entry-title {

</ins><span class="cx">   display: none;

</span><span class="cx"> }

</span><del>-#primary .format-aside .entry-content,

-#primary .format-aside .entry-summary,

-#primary .format-quote .entry-content,

-#primary .format-quote .entry-summary,

-#primary .format-link .entry-content,

-#primary .format-link.entry-summary    {

</del><ins>+.format-aside .entry-content,

+.format-aside .entry-summary,

+.format-quote .entry-content,

+.format-quote .entry-summary,

+.format-link .entry-content,

+.format-link.entry-summary     {

</ins><span class="cx">   padding-top: 0;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> /* Single specific styles */

</span><del>-.single #primary .format-aside .entry-header,

-.single #primary .format-quote .entry-header,

-.single #primary .format-link .entry-header,

-.single #primary .format-image .entry-header,

-.single #primary .format-video .entry-header {

</del><ins>+.single .format-aside .entry-header,

+.single .format-quote .entry-header,

+.single .format-link .entry-header,

+.single .format-image .entry-header,

+.single .format-video .entry-header {

</ins><span class="cx">   padding-top: 0;

</span><span class="cx"> }

</span><del>-.single #primary .format-aside,

-.single #primary .format-quote,

-.single #primary .format-link,

-.single #primary .format-image,

-.single #primary .format-video {

</del><ins>+.single .format-aside,

+.single .format-quote,

+.single .format-link,

+.single .format-image,

+.single .format-video {

</ins><span class="cx">   border-top: none;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> /* Page specific styles */

</span><del>-.page #primary .entry-header,

-.error404 #primary .page-header,

-.single-attachment #primary .entry-header,

-.page #primary .entry-content,

-.error404 #primary .page-content,

-.single-attachment #primary .entry-content {

</del><ins>+.page .entry-header,

+.page .entry-content,

+.error404 .page-header,

+.error404 .page-content,

+.single-attachment .entry-header,

+.single-attachment .entry-content {

</ins><span class="cx">   padding-top: 0;

</span><span class="cx"> }

</span><del>-.single-attachment #primary footer.entry-meta {

</del><ins>+.single-attachment footer.entry-meta {

</ins><span class="cx">   text-transform: none;

</span><span class="cx"> }

</span><span class="cx"> .more-link,

</span><span class="lines">@@ -1264,7 +1264,7 @@

</span><span class="cx">  width: auto;

</span><span class="cx">  height: auto;

</span><span class="cx"> }

</span><del>-#page .tag-links a {

</del><ins>+.site .tag-links a {

</ins><span class="cx">   -webkit-transition: all 0s ease-out;

</span><span class="cx">  -moz-transition: all 0s ease-out;

</span><span class="cx">  -ms-transition: all 0s ease-out;

</span><span class="lines">@@ -1587,8 +1587,7 @@

</span><span class="cx">  margin-bottom: 36px;

</span><span class="cx">  margin-bottom: 3.6rem;

</span><span class="cx"> }

</span><del>-.error404 .page-content .widget-title,

-.error404 .page-content .widgettitle {

</del><ins>+.error404 .page-content .widget-title {

</ins><span class="cx">   border-top: 5px solid #000;

</span><span class="cx">  color: #2b2b2b;

</span><span class="cx">  padding-top: 7px;

</span><span class="lines">@@ -1603,7 +1602,7 @@

</span><span class="cx">  max-width: 100%;

</span><span class="cx">  height: auto;

</span><span class="cx"> }

</span><del>-#site-header img,

</del><ins>+.site-header img,

</ins><span class="cx"> .attachment-featured-thumbnail-large,

</span><span class="cx"> .entry-content img,

</span><span class="cx"> .comment-content img,

</span><span class="lines">@@ -1663,7 +1662,7 @@

</span><span class="cx">  padding: 0 1.0rem 0 0;

</span><span class="cx">  text-align: left;

</span><span class="cx"> }

</span><del>-#content .gallery a img {

</del><ins>+.site-content .gallery a img {

</ins><span class="cx">   border: none;

</span><span class="cx">  height: auto;

</span><span class="cx">  vertical-align: middle; /* Remove a little margin bottom */

</span><span class="lines">@@ -1671,11 +1670,11 @@

</span><span class="cx"> .site-content .gallery .gallery-icon {

</span><span class="cx">  line-height: 1; /* Remove a little margin bottom */

</span><span class="cx"> }

</span><del>-#content .gallery .gallery-item {

</del><ins>+.site-content .gallery .gallery-item {

</ins><span class="cx">   margin: 0 0 12px 0;

</span><span class="cx">  margin: 0 0 1.2rem 0;

</span><span class="cx"> }

</span><del>-#content .gallery {

</del><ins>+.site-content .gallery {

</ins><span class="cx">   margin-bottom: 12px;

</span><span class="cx">  margin-bottom: 1.2rem;

</span><span class="cx"> }

</span><span class="lines">@@ -1775,15 +1774,15 @@

</span><span class="cx">  border-top: 1px solid #000;

</span><span class="cx"> }

</span><span class="cx"> .post-navigation,

</span><del>-#image-navigation {

</del><ins>+.image-navigation {

</ins><span class="cx">   border-top: 1px solid rgba(0, 0, 0, 0.1);

</span><span class="cx">  margin: 24px 0 0;

</span><span class="cx">  margin: 2.4rem 0 0;

</span><span class="cx"> }

</span><span class="cx"> .post-navigation [rel="prev"],

</span><span class="cx"> .post-navigation [rel="next"],

</span><del>-#image-navigation .previous-image,

-#image-navigation .next-image  {

</del><ins>+.image-navigation .previous-image,

+.image-navigation .next-image  {

</ins><span class="cx">   border-bottom: 1px solid rgba(0, 0, 0, 0.1);

</span><span class="cx">  -moz-box-sizing: border-box;

</span><span class="cx">  box-sizing: border-box;

</span><span class="lines">@@ -1806,7 +1805,7 @@

</span><span class="cx">  text-transform: uppercase;

</span><span class="cx"> }

</span><span class="cx"> .site-content .post-navigation a,

</span><del>-.site-content #image-navigation a {

</del><ins>+.site-content .image-navigation a {

</ins><span class="cx">   color: #2b2b2b;

</span><span class="cx">  display: block;

</span><span class="cx">  font-size: 14px;

</span><span class="lines">@@ -1816,7 +1815,7 @@

</span><span class="cx">  text-transform: none;

</span><span class="cx"> }

</span><span class="cx"> .site-content .post-navigation a:hover,

</span><del>-.site-content #image-navigation a:hover {

</del><ins>+.site-content .image-navigation a:hover {

</ins><span class="cx">   background-color: rgba(0, 0, 0, 0.01);

</span><span class="cx">  color: #41a62a;

</span><span class="cx"> }

</span><span class="lines">@@ -1848,12 +1847,12 @@

</span><span class="cx"> /* =Comments

</span><span class="cx"> ----------------------------------------------- */

</span><span class="cx"> 

</span><del>-#comments {

</del><ins>+.comments-area {

</ins><span class="cx">   margin-top: 36px;

</span><span class="cx">  margin-top: 3.6rem;

</span><span class="cx"> }

</span><span class="cx"> .comments-title,

</span><del>-#reply-title {

</del><ins>+.comment-reply-title {

</ins><span class="cx">   font-size: 16px;

</span><span class="cx">  font-size: 1.6rem;

</span><span class="cx">  font-weight: 900;

</span><span class="lines">@@ -1863,7 +1862,7 @@

</span><span class="cx">  padding: 0 1.0rem;

</span><span class="cx">  text-transform: uppercase;

</span><span class="cx"> }

</span><del>-#commentform {

</del><ins>+.comment-form {

</ins><span class="cx">   background: #fff;

</span><span class="cx">  padding: 0 10px;

</span><span class="cx">  padding: 0 1.0rem;

</span><span class="lines">@@ -1893,8 +1892,8 @@

</span><span class="cx"> }

</span><span class="cx"> .comment-author a:hover,

</span><span class="cx"> .comment-meta a:hover,

</span><del>-.comment-list li.trackback a:hover,

-.comment-list li.pingback a:hover {

</del><ins>+.comment-list .trackback a:hover,

+.comment-list .pingback a:hover {

</ins><span class="cx">   color: #41a62a;

</span><span class="cx">  text-decoration: none;

</span><span class="cx"> }

</span><span class="lines">@@ -1904,8 +1903,8 @@

</span><span class="cx">  content: '\007c\0020';

</span><span class="cx"> }

</span><span class="cx"> .comments-area article,

</span><del>-.comment-list li.trackback,

-.comment-list li.pingback {

</del><ins>+.comment-list .trackback,

+.comment-list .pingback {

</ins><span class="cx">   border-top: 1px solid rgba(0, 0, 0, 0.1);

</span><span class="cx">  margin-bottom: 24px;

</span><span class="cx">  margin-bottom: 2.4rem;

</span><span class="lines">@@ -1939,7 +1938,7 @@

</span><span class="cx">  height: 22px;

</span><span class="cx">  height: 2.2rem;

</span><span class="cx"> }

</span><del>-.bypostauthor > article .comment-author .comment-author-avatar {

</del><ins>+.bypostauthor .comment-author .comment-author-avatar {

</ins><span class="cx">   background-color: #41a62a;

</span><span class="cx"> }

</span><span class="cx"> .comment-author cite {

</span><span class="lines">@@ -1981,16 +1980,16 @@

</span><span class="cx"> .comments-area .children article {

</span><span class="cx">  border: none;

</span><span class="cx"> }

</span><del>-#comments #respond {

</del><ins>+.comment-respond {

</ins><span class="cx">   padding: 0;

</span><span class="cx">  margin-bottom: 24px;

</span><span class="cx">  margin-bottom: 2.4rem;

</span><span class="cx"> }

</span><del>-#comments li #respond {

</del><ins>+.comment .comment-respond {

</ins><span class="cx">   margin-left: 47px;

</span><span class="cx">  margin-left: 4.7rem;

</span><span class="cx"> }

</span><del>-#comments #respond h3 {

</del><ins>+.comment-respond h3 {

</ins><span class="cx">   margin-top: 0;

</span><span class="cx">  margin-bottom: 24px;

</span><span class="cx">  margin-bottom: 2.4rem;

</span><span class="lines">@@ -2007,20 +2006,20 @@

</span><span class="cx">  padding: 0 1.0rem;

</span><span class="cx">  text-transform: uppercase;

</span><span class="cx"> }

</span><del>-#commentform {

</del><ins>+.comment-form {

</ins><span class="cx">   padding: 0 10px;

</span><span class="cx">  padding: 0 1.0rem;

</span><span class="cx"> }

</span><del>-#commentform label {

</del><ins>+.comment-form label {

</ins><span class="cx">   display: block;

</span><span class="cx"> }

</span><del>-#commentform input[type=text] {

</del><ins>+.comment-form input[type=text] {

</ins><span class="cx">   width: 100%;

</span><span class="cx"> }

</span><span class="cx"> .form-allowed-tags {

</span><span class="cx">  display: none;

</span><span class="cx"> }

</span><del>-#commentform p:last-child {

</del><ins>+.comment-form p:last-child {

</ins><span class="cx">   margin-bottom: 0;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="lines">@@ -2039,10 +2038,10 @@

</span><span class="cx"> /* =Colophon

</span><span class="cx"> ----------------------------------------------- */

</span><span class="cx"> 

</span><del>-#colophon a {

</del><ins>+.site-footer a {

</ins><span class="cx">   color: rgba(255, 255, 255, 0.4);

</span><span class="cx"> }

</span><del>-#colophon a:hover {

</del><ins>+.site-footer a:hover {

</ins><span class="cx">   color: #fff;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="lines">@@ -2079,8 +2078,7 @@

</span><span class="cx">  margin: 0 0 0 10px;

</span><span class="cx">  margin: 0 0 0 1.0rem;

</span><span class="cx"> }

</span><del>-.widget-title,

-.widgettitle {

</del><ins>+.widget-title {

</ins><span class="cx">   font-size: 14px;

</span><span class="cx">  font-size: 1.4rem;

</span><span class="cx">  font-weight: 900;

</span><span class="lines">@@ -2137,29 +2135,26 @@

</span><span class="cx"> .widget iframe:last-child,

</span><span class="cx"> .widget p:last-child,

</span><span class="cx"> #secondary .widget p:last-child,

</span><del>-#content-sidebar .widget p:last-child {

</del><ins>+.content-sidebar .widget p:last-child {

</ins><span class="cx">   margin-bottom: 0;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> /* Caledar widget*/

</span><del>-.widget_calendar #wp-calendar a {

-       display: block;

-}

-.widget_calendar #wp-calendar tbody a {

</del><ins>+.widget_calendar a {

</ins><span class="cx">   background-color: #41a62a;

</span><span class="cx">  color: #fff;

</span><span class="cx">  display: block;

</span><span class="cx"> }

</span><del>-.widget_calendar #wp-calendar tbody a:hover {

</del><ins>+.widget_calendar a:hover {

</ins><span class="cx">   background-color: #35921f;

</span><span class="cx"> }

</span><del>-.widget_calendar #wp-calendar {

</del><ins>+.widget_calendar table {

</ins><span class="cx">   border: 1px solid rgba(255, 255, 255, 0.2);

</span><span class="cx">  border-width: 1px 0 1px 1px;

</span><span class="cx">  line-height: 2;

</span><span class="cx">  margin: 0;

</span><span class="cx"> }

</span><del>-.widget_calendar #wp-calendar caption {

</del><ins>+.widget_calendar caption {

</ins><span class="cx">   color: #fff;

</span><span class="cx">  font-weight: 700;

</span><span class="cx">  line-height: 1.7142857142;

</span><span class="lines">@@ -2168,17 +2163,17 @@

</span><span class="cx">  text-align: left;

</span><span class="cx">  text-transform: uppercase;

</span><span class="cx"> }

</span><del>-.widget_calendar #wp-calendar thead th,

-.widget_calendar #wp-calendar tbody td {

</del><ins>+.widget_calendar thead th,

+.widget_calendar tbody td {

</ins><span class="cx">   border: 1px solid rgba(255, 255, 255, 0.2);

</span><span class="cx">  border-width: 0 1px 1px 0;

</span><span class="cx">  text-align: center;

</span><span class="cx"> }

</span><del>-.widget_calendar #wp-calendar tfoot td#prev {

</del><ins>+.widget_calendar #prev {

</ins><span class="cx">   padding-left: 5px;

</span><span class="cx">  padding-left: 0.5rem;

</span><span class="cx"> }

</span><del>-.widget_calendar #wp-calendar tfoot td#next {

</del><ins>+.widget_calendar #next {

</ins><span class="cx">   border-right: 1px solid rgba(255, 255, 255, 0.2);

</span><span class="cx">  padding-right: 5px;

</span><span class="cx">  padding-right: 0.5rem;

</span><span class="lines">@@ -2209,13 +2204,13 @@

</span><span class="cx"> }

</span><span class="cx"> .widget_recent_comments tr {

</span><span class="cx"> }

</span><del>-.widget_recent_comments td.recentcommentsavatartop,

-.widget_recent_comments td.recentcommentsavatarend {

</del><ins>+.widget_recent_comments .recentcommentsavatartop,

+.widget_recent_comments .recentcommentsavatarend {

</ins><span class="cx">   padding: 8px 8px 8px 0;

</span><span class="cx">  padding: 0.8rem 0.8rem 0.8rem 0;

</span><span class="cx"> }

</span><del>-.widget_recent_comments td.recentcommentstexttop,

-.widget_recent_comments td.recentcommentstextend {

</del><ins>+.widget_recent_comments .recentcommentstexttop,

+.widget_recent_comments .recentcommentstextend {

</ins><span class="cx">   line-height: 1.2857142857;

</span><span class="cx">  padding: 8px 0 8px 8px;

</span><span class="cx">  padding: 0.8rem 0 0.8rem 0.8rem;

</span><span class="lines">@@ -2236,59 +2231,59 @@

</span><span class="cx"> /* =Content Sidebar

</span><span class="cx"> ----------------------------------------------- */

</span><span class="cx"> 

</span><del>-#content-sidebar {

</del><ins>+.content-sidebar {

</ins><span class="cx">   color: #8c8c8c;

</span><span class="cx">  font-size: 14px;

</span><span class="cx">  font-size: 1.4rem;

</span><span class="cx">  line-height: 1.2857142857;

</span><span class="cx"> }

</span><del>-#content-sidebar p {

</del><ins>+.content-sidebar p {

</ins><span class="cx">   margin-bottom: 18px;

</span><span class="cx">  margin-bottom: 1.8rem;

</span><span class="cx"> }

</span><del>-#content-sidebar a {

</del><ins>+.content-sidebar a {

</ins><span class="cx">   color: #2b2b2b;

</span><span class="cx"> }

</span><del>-#content-sidebar a:hover {

</del><ins>+.content-sidebar a:hover {

</ins><span class="cx">   color: #41a62a;

</span><span class="cx"> }

</span><del>-#content-sidebar button,

-#content-sidebar html input[type="button"],

-#content-sidebar input[type="reset"],

-#content-sidebar input[type="submit"] {

</del><ins>+.content-sidebar button,

+.content-sidebar html input[type="button"],

+.content-sidebar input[type="reset"],

+.content-sidebar input[type="submit"] {

</ins><span class="cx">   background-color: #000;

</span><span class="cx">  font-size: 12px;

</span><span class="cx">  font-size: 1.2rem;

</span><span class="cx">  padding: 6px 24px;

</span><span class="cx">  padding: 0.6rem 2.4rem;

</span><span class="cx"> }

</span><del>-#content-sidebar button:hover,

-#content-sidebar html input[type="button"]:hover,

-#content-sidebar input[type="reset"]:hover,

-#content-sidebar input[type="submit"]:hover,

-#content-sidebar button:focus,

-#content-sidebar html input[type="button"]:focus,

-#content-sidebar input[type="reset"]:focus,

-#content-sidebar input[type="submit"]:focus {

</del><ins>+.content-sidebar button:hover,

+.content-sidebar html input[type="button"]:hover,

+.content-sidebar input[type="reset"]:hover,

+.content-sidebar input[type="submit"]:hover,

+.content-sidebar button:focus,

+.content-sidebar html input[type="button"]:focus,

+.content-sidebar input[type="reset"]:focus,

+.content-sidebar input[type="submit"]:focus {

</ins><span class="cx">   background-color: #41a62a;

</span><span class="cx"> }

</span><del>-#content-sidebar button:active,

-#content-sidebar html input[type="button"]:active,

-#content-sidebar input[type="reset"]:active,

-#content-sidebar input[type="submit"]:active {

</del><ins>+.content-sidebar button:active,

+.content-sidebar html input[type="button"]:active,

+.content-sidebar input[type="reset"]:active,

+.content-sidebar input[type="submit"]:active {

</ins><span class="cx">   background-color: #5FF23D;

</span><span class="cx"> }

</span><del>-#content-sidebar input[type="text"],

-#content-sidebar input[type="email"],

-#content-sidebar input[type="password"],

-#content-sidebar textarea {

</del><ins>+.content-sidebar input[type="text"],

+.content-sidebar input[type="email"],

+.content-sidebar input[type="password"],

+.content-sidebar textarea {

</ins><span class="cx">   background-color: #fff;

</span><span class="cx">  border: 1px solid rgba(0, 0, 0, 0.1);

</span><span class="cx">  color: #2b2b2b;

</span><span class="cx">  padding: 4px;

</span><span class="cx">  padding: 0.4rem;

</span><span class="cx"> }

</span><del>-#content-sidebar .widget-title {

</del><ins>+.content-sidebar .widget-title {

</ins><span class="cx">   border-top: 5px solid #000;

</span><span class="cx">  color: #2b2b2b;

</span><span class="cx">  font-size: 14px;

</span><span class="lines">@@ -2300,39 +2295,39 @@

</span><span class="cx">  padding-top: 0.7rem;

</span><span class="cx">  text-transform: uppercase;

</span><span class="cx"> }

</span><del>-#content-sidebar .widget li {

</del><ins>+.content-sidebar .widget li {

</ins><span class="cx">   border-top: 1px solid rgba(0, 0, 0, 0.1);

</span><span class="cx">  padding: 8px 0 9px;

</span><span class="cx">  padding: 0.8rem 0 0.9rem;

</span><span class="cx"> }

</span><del>-#content-sidebar .widget li:first-child {

</del><ins>+.content-sidebar .widget li:first-child {

</ins><span class="cx">   border-top:     none;

</span><span class="cx"> }

</span><del>-#content-sidebar .widget .children,

-#content-sidebar .widget .sub-menu {

</del><ins>+.content-sidebar .widget .children,

+.content-sidebar .widget .sub-menu {

</ins><span class="cx">   margin:0 0 0 20px;

</span><span class="cx">  margin:0 0 0 2.0rem;

</span><span class="cx"> }

</span><del>-#content-sidebar .widget li li {

</del><ins>+.content-sidebar .widget li li {

</ins><span class="cx">   border-top:     none;

</span><span class="cx">  padding-bottom: 0;

</span><span class="cx"> }

</span><del>-#content-sidebar .widget_calendar #wp-calendar,

-#content-sidebar .widget_calendar #wp-calendar thead th,

-#content-sidebar .widget_calendar #wp-calendar tbody td,

-#content-sidebar .widget_calendar #wp-calendar tfoot td#next {

</del><ins>+.content-sidebar .widget_calendar table,

+.content-sidebar .widget_calendar thead th,

+.content-sidebar .widget_calendar tbody td,

+.content-sidebar .widget_calendar #next {

</ins><span class="cx">   border-color: rgba(0, 0, 0, 0.1);

</span><span class="cx"> }

</span><del>-#content-sidebar .widget_calendar #wp-calendar caption {

</del><ins>+.content-sidebar .widget_calendar caption {

</ins><span class="cx">   color: #2b2b2b;

</span><span class="cx">  font-size: 14px;

</span><span class="cx">  font-size: 1.4rem;

</span><span class="cx">  font-weight: 900;

</span><span class="cx"> }

</span><del>-#content-sidebar .widget_calendar #wp-calendar thead th {

</del><ins>+.content-sidebar .widget_calendar thead th {

</ins><span class="cx">   background-color: rgba(0, 0, 0, 0.02);

</span><span class="cx"> }

</span><del>-#content-sidebar .widget_rss li {

</del><ins>+.content-sidebar .widget_rss li {

</ins><span class="cx">   margin-bottom: 0;

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="lines">@@ -2350,11 +2345,11 @@

</span><span class="cx"> 

</span><span class="cx"> /* Mobile list style */

</span><span class="cx"> @media screen and (max-width: 400px) {

</span><del>-       .list-view #primary {

</del><ins>+        .list-view .content-area {

</ins><span class="cx">           padding: 12px 10px;

</span><span class="cx">          padding: 1.2rem 1.0rem;

</span><span class="cx">  }

</span><del>-       .list-view #primary .hentry {

</del><ins>+        .list-view .content-area .hentry {

</ins><span class="cx">           border-bottom: 1px solid rgba(0, 0, 0, 0.1);

</span><span class="cx">          margin-bottom: 12px;

</span><span class="cx">          margin-bottom: 1.2rem;

</span><span class="lines">@@ -2363,10 +2358,10 @@

</span><span class="cx">          padding-bottom: 9px;

</span><span class="cx">          padding-bottom: 0.9rem;

</span><span class="cx">  }

</span><del>-       .list-view #primary .cat-links,

-       .list-view #primary .entry-content,

-       .list-view #primary .entry-summary,

-       .list-view #primary footer.entry-meta {

</del><ins>+        .list-view .content-area .cat-links,

+       .list-view .content-area .entry-content,

+       .list-view .content-area .entry-summary,

+       .list-view .content-area footer.entry-meta {

</ins><span class="cx">           display: none;

</span><span class="cx">  }

</span><span class="cx">  .list-view .attachment-featured-thumbnail {

</span><span class="lines">@@ -2382,11 +2377,11 @@

</span><span class="cx">          width: 84px;

</span><span class="cx">          width: 8.4rem;

</span><span class="cx">  }

</span><del>-       .list-view #primary .entry-header {

</del><ins>+        .list-view .content-area .entry-header {

</ins><span class="cx">           background-color: transparent;

</span><span class="cx">          padding: 0;

</span><span class="cx">  }

</span><del>-       .list-view #primary .entry-title {

</del><ins>+        .list-view .content-area .entry-title {

</ins><span class="cx">            font-size: 15px;

</span><span class="cx">           font-size: 1.5rem;

</span><span class="cx">           font-weight: 900;

</span><span class="lines">@@ -2395,49 +2390,49 @@

</span><span class="cx">           margin-bottom: 0.6rem;

</span><span class="cx">           text-transform: none;

</span><span class="cx">  }

</span><del>-       .list-view #primary .entry-meta {

</del><ins>+        .list-view .content-area .entry-meta {

</ins><span class="cx">           background-color: transparent;

</span><span class="cx">          clear: none;

</span><span class="cx">          margin: 0;

</span><span class="cx">          text-transform: none;

</span><span class="cx">  }

</span><del>-       .list-view #primary .format-aside,

-       .list-view #primary .format-quote,

-       .list-view #primary .format-link,

-       .list-view #primary .format-image,

-       .list-view #primary .format-video {

</del><ins>+        .list-view .content-area .format-aside,

+       .list-view .content-area .format-quote,

+       .list-view .content-area .format-link,

+       .list-view .content-area .format-image,

+       .list-view .content-area .format-video {

</ins><span class="cx">           border-top: 0;

</span><span class="cx">  }

</span><del>-       .list-view #primary .format-aside .entry-header .entry-title,

-       .list-view #primary .format-quote .entry-header .entry-title,

-       .list-view #primary .format-link .entry-header .entry-title {

</del><ins>+        .list-view .content-area .format-aside .entry-title,

+       .list-view .content-area .format-quote .entry-title,

+       .list-view .content-area .format-link .entry-title {

</ins><span class="cx">           display: block;

</span><span class="cx">  }

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> /* Enable Genricons */

</span><span class="cx"> @media screen and (min-width: 400px) {

</span><del>-       a.attachment-featured-thumbnail:hover img {

</del><ins>+        .attachment-featured-thumbnail:hover img {

</ins><span class="cx">           opacity: 0.8;

</span><span class="cx">  }

</span><del>-       #primary span + span.entry-date:before,

-       #primary span + .byline:before,

-       #primary span + .comments-link:before,

-       #primary span + .edit-link:before,

</del><ins>+        .content-area span + .entry-date:before,

+       .content-area span + .byline:before,

+       .content-area span + .comments-link:before,

+       .content-area span + .edit-link:before,

</ins><span class="cx">   .full-size-link:before,

</span><span class="cx">  .parent-post-link:before {

</span><span class="cx">          content: '';

</span><span class="cx">  }

</span><del>-       #primary .featured-post:before,

-       #primary .post-format a:before,

-       #primary .post-format + span.entry-date a:before,

-       #primary span.entry-date a:before,

-       #primary .byline a:before,

-       #primary .comments-link a:before,

-       #primary .edit-link a:before,

-       .attachment span.entry-date:before,

-       #primary .full-size-link a:before,

-       #primary .parent-post-link a:before {

</del><ins>+        .content-area .featured-post:before,

+       .content-area .post-format a:before,

+       .content-area .post-format + .entry-date a:before,

+       .content-area .entry-date a:before,

+       .content-area .byline a:before,

+       .content-area .comments-link a:before,

+       .content-area .edit-link a:before,

+       .attachment .entry-date:before,

+       .content-area .full-size-link a:before,

+       .content-area .parent-post-link a:before {

</ins><span class="cx">           display: inline-block;

</span><span class="cx">          -webkit-font-smoothing: antialiased;

</span><span class="cx">          font: normal 16px/1 'Genericons';

</span><span class="lines">@@ -2447,75 +2442,71 @@

</span><span class="cx">          text-transform: none;

</span><span class="cx">          vertical-align: top;

</span><span class="cx">  }

</span><del>-       #primary .entry-meta > span {

</del><ins>+        .content-area .entry-meta > span {

</ins><span class="cx">           margin-right: 10px;

</span><span class="cx">          margin-right: 1.0rem;

</span><span class="cx">  }

</span><del>-       #primary .format-video .post-format a:before {

</del><ins>+        .content-area .format-video .post-format a:before {

</ins><span class="cx">           content: '\F104';

</span><span class="cx">          margin: -1px 2px 0 0;

</span><span class="cx">          margin: -0.1rem 0.2rem 0 0;

</span><span class="cx">  }

</span><del>-       #primary .format-image .post-format a:before {

</del><ins>+        .content-area .format-image .post-format a:before {

</ins><span class="cx">           content: '\F102';

</span><span class="cx">          margin: -1px 2px 0 0;

</span><span class="cx">          margin: -0.1rem 0.2rem 0 0;

</span><span class="cx">  }

</span><del>-       #primary .format-quote .post-format a:before {

</del><ins>+        .content-area .format-quote .post-format a:before {

</ins><span class="cx">           content: '\F106';

</span><span class="cx">  }

</span><del>-       #primary .format-gallery .post-format a:before {

</del><ins>+        .content-area .format-gallery .post-format a:before {

</ins><span class="cx">           content: '\F103';

</span><span class="cx">          margin: -1px 4px 0 0;

</span><span class="cx">          margin: -0.1rem 0.4rem 0 0;

</span><span class="cx">  }

</span><del>-       #primary .format-aside .post-format a:before {

</del><ins>+        .content-area .format-aside .post-format a:before {

</ins><span class="cx">           content: '\F101';

</span><span class="cx">  }

</span><del>-       #primary .format-link .post-format a:before {

</del><ins>+        .content-area .format-link .post-format a:before {

</ins><span class="cx">           content: '\F107';

</span><span class="cx">  }

</span><del>-       #primary .featured-post:before {

</del><ins>+        .content-area .featured-post:before {

</ins><span class="cx">           content: '\F308';

</span><span class="cx">          margin: -1px 3px 0 0;

</span><span class="cx">          margin: -0.1rem 0.3rem 0 0;

</span><span class="cx">  }

</span><del>-       #primary .post-format + span.entry-date a:before,

-       #primary span.entry-date a:before,

-       .attachment span.entry-date:before {

</del><ins>+        .content-area .post-format + .entry-date a:before,

+       .content-area .entry-date a:before,

+       .attachment .entry-date:before {

</ins><span class="cx">           content: '\F303';

</span><span class="cx">          margin: 0 1px 0 0;

</span><span class="cx">          margin: 0 0.1rem 0 0;

</span><span class="cx">  }

</span><del>-       #primary .byline a:before {

</del><ins>+        .content-area .byline a:before {

</ins><span class="cx">           content: '\F304';

</span><span class="cx">          margin: -1px 0 0 0;

</span><span class="cx">          margin: -0.1rem 0 0 0;

</span><span class="cx">  }

</span><del>-       #primary .comments-link a:before {

</del><ins>+        .content-area .comments-link a:before {

</ins><span class="cx">           content: '\F300';

</span><span class="cx">          margin: -1px 2px 0 0;

</span><span class="cx">          margin: -0.1rem 0.2rem 0 0;

</span><span class="cx">  }

</span><del>-       #primary .edit-link a:before {

</del><ins>+        .content-area .edit-link a:before {

</ins><span class="cx">           content: '\F411';

</span><span class="cx">          margin: -1px 2px 0 0;

</span><span class="cx">          margin: -0.1rem 0.2rem 0 0;

</span><span class="cx">  }

</span><del>-       #primary .full-size-link a:before {

</del><ins>+        .content-area .full-size-link a:before {

</ins><span class="cx">           content: '\F402';

</span><span class="cx">  }

</span><del>-       #primary .parent-post-link a:before {

</del><ins>+        .content-area .parent-post-link a:before {

</ins><span class="cx">           content: '\F301';

</span><span class="cx">  }

</span><del>-       .page #primary .edit-link a:before {

</del><ins>+        .page .content-area .edit-link a:before {

</ins><span class="cx">           margin: 5px 2px 0 0;

</span><span class="cx">          margin: 0.5rem 0.2rem 0 0;

</span><span class="cx">  }

</span><del>-       #infinite-handle {

-               margin: 48px 10px 0;

-               margin: 4.8rem 1.0rem 0;

-       }

</del><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> /* Post formatted posts and post list start to appear on the right */

</span><span class="lines">@@ -2529,7 +2520,7 @@

</span><span class="cx">  .social-links-wrapper {

</span><span class="cx">          margin: 0;

</span><span class="cx">  }

</span><del>-       #primary {

</del><ins>+        .content-area {

</ins><span class="cx">           float: left;

</span><span class="cx">          padding: 36px 0;

</span><span class="cx">          padding: 3.6rem 0;

</span><span class="lines">@@ -2538,7 +2529,7 @@

</span><span class="cx">  .site-content {

</span><span class="cx">          margin: 0 33.33333333% 0 0;

</span><span class="cx">  }

</span><del>-       #content-sidebar {

</del><ins>+        .content-sidebar {

</ins><span class="cx">           float: right;

</span><span class="cx">          margin: 0 0 0 -30.35714285%;

</span><span class="cx">          padding: 36px 10px 24px 0;

</span><span class="lines">@@ -2574,19 +2565,19 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 740px) {

</span><del>-       #primary .entry-header {

</del><ins>+        .content-area .entry-header {

</ins><span class="cx">           margin: -48px 4.59183673% 0;

</span><span class="cx">          margin: -4.8rem 4.59183673% 0;

</span><span class="cx">          padding: 24px 4.46428571% 12px;

</span><span class="cx">          padding: 2.4rem 4.46428571% 1.2rem;

</span><span class="cx">  }

</span><del>-       #primary .entry-content,

-       #primary .entry-summary {

</del><ins>+        .content-area .entry-content,

+       .content-area .entry-summary {

</ins><span class="cx">           margin: 0 4.59183673%;

</span><span class="cx">          padding: 12px 4.46428571% 0;

</span><span class="cx">          padding: 1.2rem 4.46428571% 0;

</span><span class="cx">  }

</span><del>-       #primary footer.entry-meta {

</del><ins>+        .content-area footer.entry-meta {

</ins><span class="cx">           margin: 12px 4.59183673% 24px;

</span><span class="cx">          margin: 1.2rem 4.59183673% 2.4rem;

</span><span class="cx">          padding: 0 4.46428571%;

</span><span class="lines">@@ -2596,38 +2587,38 @@

</span><span class="cx">          margin: 0 4.59183673% 2.4rem;

</span><span class="cx">          padding: 0 4.46428571%;

</span><span class="cx">  }

</span><del>-       .page #primary .entry-header,

-       .error404 #primary .page-header {

</del><ins>+        .page .content-area .entry-header,

+       .error404 .content-area .page-header {

</ins><span class="cx">           margin: 0 4.59183673%;

</span><span class="cx">          padding: 0 4.46428571% 12px;

</span><span class="cx">          padding: 0 4.46428571% 1.2rem;

</span><span class="cx">  }

</span><del>-       #primary .full-width .entry-header {

</del><ins>+        .content-area .full-width .entry-header {

</ins><span class="cx">           margin: 0 6.04307432%;

</span><span class="cx">          padding: 0 0 12px;

</span><span class="cx">          padding: 0 0 1.2rem;

</span><span class="cx">  }

</span><del>-       #primary .full-width .entry-content {

</del><ins>+        .content-area .full-width .entry-content {

</ins><span class="cx">           margin: 0 6.04307432%;

</span><span class="cx">          padding: 0;

</span><span class="cx">  }

</span><del>-       #primary .full-width footer.entry-meta {

</del><ins>+        .content-area .full-width footer.entry-meta {

</ins><span class="cx">           margin: 0 6.04307432%;

</span><span class="cx">          padding: 0;

</span><span class="cx">  }

</span><del>-       #primary .format-aside .entry-header,

-       #primary .format-quote .entry-header,

-       #primary .format-link .entry-header,

-       #primary .format-video .entry-header,

-       #primary .format-image .entry-header {

</del><ins>+        .content-area .format-aside .entry-header,

+       .content-area .format-quote .entry-header,

+       .content-area .format-link .entry-header,

+       .content-area .format-video .entry-header,

+       .content-area .format-image .entry-header {

</ins><span class="cx">           margin-top: 12px;

</span><span class="cx">          margin-top: 1.2rem;

</span><span class="cx">  }

</span><del>-       .single #primary .format-aside .entry-header,

-       .single #primary .format-quote .entry-header,

-       .single #primary .format-link .entry-header,

-       .single #primary .format-image .entry-header,

-       .single #primary .format-video .entry-header {

</del><ins>+        .single .content-area .format-aside .entry-header,

+       .single .content-area .format-quote .entry-header,

+       .single .content-area .format-link .entry-header,

+       .single .content-area .format-image .entry-header,

+       .single .content-area .format-video .entry-header {

</ins><span class="cx">           margin-top: 0;

</span><span class="cx">  }

</span><span class="cx">  .comments-area article,

</span><span class="lines">@@ -2656,7 +2647,7 @@

</span><span class="cx">  }

</span><span class="cx">  .comments-title,

</span><span class="cx">  .no-comments,

</span><del>-       #comments #respond,

</del><ins>+        .comment-respond,

</ins><span class="cx">   .comments-area article,

</span><span class="cx">  .comment-list li.trackback,

</span><span class="cx">  .comment-list li.pingback,

</span><span class="lines">@@ -2665,36 +2656,29 @@

</span><span class="cx">          padding-right: 9.12778904%;

</span><span class="cx">          padding-left: 9.12778904%;

</span><span class="cx">  }

</span><del>-       #reply-title,

-       #respond #commentform {

</del><ins>+        .comment-reply-title,

+       .comment-form {

</ins><span class="cx">           padding: 0;

</span><span class="cx">  }

</span><span class="cx">  .comment-navigation {

</span><span class="cx">          padding-left: 9.12778904%;

</span><span class="cx">  }

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><span class="cx">  .full-width .comment-list li.trackback,

</span><span class="cx">  .full-width .comment-list li.pingback {

</span><span class="cx">          padding-right: 6.04307432%;

</span><span class="cx">          padding-left: 6.04307432%;

</span><span class="cx">  }

</span><del>-       .full-width #reply-title,

-       .full-width #commentform {

</del><ins>+        .full-width .comment-reply-title,

+       .full-width .comment-form {

</ins><span class="cx">           padding: 0;

</span><span class="cx">  }

</span><del>-       #infinite-handle {

-               margin: 48px 0 0;

-               margin: 4.8rem 0 0;

-       }

-       #infinite-handle span {

-               display: inline;

-       }

-       #primary .no-results .entry-header {

</del><ins>+        .content-area .no-results .entry-header {

</ins><span class="cx">           margin: 0 4.59183673%;

</span><span class="cx">          padding: 0 4.46428571%;

</span><span class="cx">  }

</span><span class="lines">@@ -2710,41 +2694,41 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 870px) {

</span><del>-       #primary {

</del><ins>+        .content-area {

</ins><span class="cx">           padding-top: 72px;

</span><span class="cx">          padding-top: 7.2rem;

</span><span class="cx">  }

</span><del>-       .home #primary {

</del><ins>+        .home .content-area {

</ins><span class="cx">           padding-top: 36px;

</span><span class="cx">          padding-top: 3.6rem;

</span><span class="cx">  }

</span><del>-       #primary .entry-header {

</del><ins>+        .content-area .entry-header {

</ins><span class="cx">           margin-right: 8.03571428%;

</span><span class="cx">          margin-left: 12.5%;

</span><span class="cx">  }

</span><del>-       #primary .entry-content,

-       #primary .entry-summary {

</del><ins>+        .content-area .entry-content,

+       .content-area .entry-summary {

</ins><span class="cx">           margin-right: 8.03571428%;

</span><span class="cx">          margin-left: 12.5%;

</span><span class="cx">  }

</span><del>-       #primary footer.entry-meta {

</del><ins>+        .content-area footer.entry-meta {

</ins><span class="cx">           margin: 12px 8.03571428% 24px 12.5%;

</span><span class="cx">          margin: 1.2rem 8.03571428% 2.4rem 12.5%;

</span><span class="cx">  }

</span><del>-       .page #primary .entry-header,

-       .error404 #primary .page-header {

</del><ins>+        .page .content-area .entry-header,

+       .error404 .content-area .page-header {

</ins><span class="cx">           margin: 0 8.03571428% 0 12.5%;

</span><span class="cx">  }

</span><del>-       #primary .full-width .entry-header,

-       #primary .full-width .entry-content,

-       #primary .full-width footer.entry-meta {

</del><ins>+        .content-area .full-width .entry-header,

+       .content-area .full-width .entry-content,

+       .content-area .full-width footer.entry-meta {

</ins><span class="cx">           margin: 0 11.30926724%;

</span><span class="cx">  }

</span><span class="cx">  .page-header {

</span><span class="cx">          margin: 0 8.03571428% 24px 12.5%;

</span><span class="cx">          margin: 0 8.03571428% 2.4rem 12.5%;

</span><span class="cx">  }

</span><del>-       #content-sidebar {

</del><ins>+        .content-sidebar {

</ins><span class="cx">           padding-top: 72px;

</span><span class="cx">          padding-top: 7.2rem;

</span><span class="cx">  }

</span><span class="lines">@@ -2759,7 +2743,7 @@

</span><span class="cx">  }

</span><span class="cx">  .comments-title,

</span><span class="cx">  .no-comments,

</span><del>-       #comments #respond,

</del><ins>+        .comment-respond,

</ins><span class="cx">   .comments-area article,

</span><span class="cx">  .comment-list li.trackback,

</span><span class="cx">  .comment-list li.pingback,

</span><span class="lines">@@ -2768,7 +2752,7 @@

</span><span class="cx">          padding-right: 12.39493534%;

</span><span class="cx">          padding-left: 17.06896551%;

</span><span class="cx">  }

</span><del>-       #comments #respond {

</del><ins>+        .comment-respond {

</ins><span class="cx">           padding-right: 13.8900862%;

</span><span class="cx">  }

</span><span class="cx">  .comment-list,

</span><span class="lines">@@ -2779,11 +2763,11 @@

</span><span class="cx">  .comment-navigation {

</span><span class="cx">          padding-left: 17.06896551%;

</span><span class="cx">  }

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><span class="cx">  .full-width .comment-list li.trackback,

</span><span class="cx">  .full-width .comment-list li.pingback {

</span><span class="lines">@@ -2796,11 +2780,11 @@

</span><span class="cx">  blockquote.pull.alignright {

</span><span class="cx">          margin-right: -20%;

</span><span class="cx">  }

</span><del>-       #primary .no-results .entry-header {

</del><ins>+        .content-area .no-results .entry-header {

</ins><span class="cx">           margin-right: 8.03571428%;

</span><span class="cx">          margin-left: 12.5%;

</span><span class="cx">  }

</span><del>-       #primary .no-results .entry-content {

</del><ins>+        .content-area .no-results .entry-content {

</ins><span class="cx">           margin-right: 8.03571428%;

</span><span class="cx">          margin-left: 12.5%;

</span><span class="cx">  }

</span><span class="lines">@@ -2808,7 +2792,7 @@

</span><span class="cx"> 

</span><span class="cx"> /* Secondary starts appear on the left */

</span><span class="cx"> @media screen and (min-width: 1008px) {

</span><del>-       #page:before {

</del><ins>+        .site:before {

</ins><span class="cx">           background-color: #000;

</span><span class="cx">          content: '';

</span><span class="cx">          display: block;

</span><span class="lines">@@ -2860,26 +2844,26 @@

</span><span class="cx">          margin: 0 27.31707317% 0 222px;

</span><span class="cx">          margin: 0 27.31707317% 0 22.2rem;

</span><span class="cx">  }

</span><del>-       #content-sidebar,

</del><ins>+        .content-sidebar,

</ins><span class="cx">   .post-formatted-posts {

</span><span class="cx">          margin: 0 0 0 -27.31707317%;

</span><span class="cx">          width: 24.87804878%;

</span><span class="cx">  }

</span><del>-       #primary .entry-header,

-       #primary .page-header {

</del><ins>+        .content-area .entry-header,

+       .content-area .page-header {

</ins><span class="cx">           margin: -48px 4.59183673% 0;

</span><span class="cx">          margin: -4.8rem 4.59183673% 0;

</span><span class="cx">          padding: 24px 4.46428571% 12px;

</span><span class="cx">          padding: 2.4rem 4.46428571% 1.2rem;

</span><span class="cx">  }

</span><del>-       #primary .entry-content,

-       #primary .page-content,

-       #primary .entry-summary {

</del><ins>+        .content-area .entry-content,

+       .content-area .page-content,

+       .content-area .entry-summary {

</ins><span class="cx">           margin: 0 4.59183673%;

</span><span class="cx">          padding: 12px 4.46428571% 0;

</span><span class="cx">          padding: 1.2rem 4.46428571% 0;

</span><span class="cx">  }

</span><del>-       #primary footer.entry-meta {

</del><ins>+        .content-area footer.entry-meta {

</ins><span class="cx">           margin: 12px 4.59183673% 24px;

</span><span class="cx">          margin: 1.2rem 4.59183673% 2.4rem;

</span><span class="cx">          padding: 0 4.46428571%;

</span><span class="lines">@@ -2892,7 +2876,7 @@

</span><span class="cx">          padding-left: 222px;

</span><span class="cx">          padding-left: 22.2rem;

</span><span class="cx">  }

</span><del>-       #colophon {

</del><ins>+        .site-footer {

</ins><span class="cx">           padding-left: 27px;

</span><span class="cx">          padding-left: 2.7rem;

</span><span class="cx">  }

</span><span class="lines">@@ -2932,8 +2916,8 @@

</span><span class="cx">  .secondary-navigation ul li:hover > ul {

</span><span class="cx">          display: block;

</span><span class="cx">  }

</span><del>-       .page #primary .entry-header,

-       .error404 #primary .page-header {

</del><ins>+        .page .content-area .entry-header,

+       .error404 .content-area .page-header {

</ins><span class="cx">           margin: 0 4.59183673%;

</span><span class="cx">          padding: 0 4.46428571% 12px;

</span><span class="cx">          padding: 0 4.46428571% 1.2rem;

</span><span class="lines">@@ -2942,19 +2926,19 @@

</span><span class="cx">          margin-left: 222px;

</span><span class="cx">          margin-left: 22.2rem;

</span><span class="cx">  }

</span><del>-       #primary .full-width .entry-header {

</del><ins>+        .content-area .full-width .entry-header {

</ins><span class="cx">           padding: 0 0 12px;

</span><span class="cx">          padding: 0 0 1.2rem;

</span><span class="cx">  }

</span><del>-       #primary .full-width .entry-header,

-       #primary .full-width .entry-content,

-       #primary .full-width .page-content,

-       #primary .full-width footer.entry-meta {

</del><ins>+        .content-area .full-width .entry-header,

+       .content-area .full-width .entry-content,

+       .content-area .full-width .page-content,

+       .content-area .full-width footer.entry-meta {

</ins><span class="cx">           margin: 0 5.882236%;

</span><span class="cx">  }

</span><span class="cx">  .comments-title,

</span><span class="cx">  .no-comments,

</span><del>-       #comments #respond,

</del><ins>+        .comment-respond,

</ins><span class="cx">   .comments-area article,

</span><span class="cx">  .comment-list li.trackback,

</span><span class="cx">  .comment-list li.pingback,

</span><span class="lines">@@ -2970,11 +2954,11 @@

</span><span class="cx">  .comment-navigation {

</span><span class="cx">          padding-left: 9.19765166%;

</span><span class="cx">  }

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><span class="cx">  .full-width .comment-list li.trackback,

</span><span class="cx">  .full-width .comment-list li.pingback {

</span><span class="lines">@@ -3031,23 +3015,23 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 1150px) {

</span><del>-       #primary .entry-header,

-       #primary .page-header {

</del><ins>+        .content-area .entry-header,

+       .content-area .page-header {

</ins><span class="cx">           margin: -48px 8.03571428% 0 12.5%;

</span><span class="cx">          margin: -4.8rem 8.03571428% 0 12.5%;

</span><span class="cx">  }

</span><del>-       #primary .entry-content,

-       #primary .page-content,

-       #primary .entry-summary {

</del><ins>+        .content-area .entry-content,

+       .content-area .page-content,

+       .content-area .entry-summary {

</ins><span class="cx">           margin: 0 8.03571428% 0 12.5%;

</span><span class="cx">  }

</span><del>-       #primary footer.entry-meta {

</del><ins>+        .content-area footer.entry-meta {

</ins><span class="cx">           margin: 12px 8.03571428% 24px 12.5%;

</span><span class="cx">          margin: 1.2rem 8.03571428% 2.4rem 12.5%;

</span><span class="cx">  }

</span><span class="cx">  .comments-title,

</span><span class="cx">  .no-comments,

</span><del>-       #comments #respond,

</del><ins>+        .comment-respond,

</ins><span class="cx">   .comments-area article,

</span><span class="cx">  .comment-list li.trackback,

</span><span class="cx">  .comment-list li.pingback,

</span><span class="lines">@@ -3056,7 +3040,7 @@

</span><span class="cx">          padding-right: 12.44146986%;

</span><span class="cx">          padding-left: 16.77524429%;

</span><span class="cx">  }

</span><del>-       #comments #respond {

</del><ins>+        .comment-respond {

</ins><span class="cx">           padding-right: 13.73697916%;

</span><span class="cx">  }

</span><span class="cx">  .comment-list,

</span><span class="lines">@@ -3071,28 +3055,28 @@

</span><span class="cx">          margin: 0 8.03571428% 24px 12.5%;

</span><span class="cx">          margin: 0 8.03571428% 2.4rem 12.5%;

</span><span class="cx">  }

</span><del>-       .page #primary .entry-header,

-       .error404 #primary .page-header {

</del><ins>+        .page .content-area .entry-header,

+       .error404 .content-area .page-header {

</ins><span class="cx">           margin: 0 8.03571428% 0 12.5%;

</span><span class="cx">  }

</span><del>-       #primary .full-width .entry-header,

-       #primary .full-width .entry-content,

-       #primary .full-width .page-content,

-       #primary .full-width footer.entry-meta {

</del><ins>+        .content-area .full-width .entry-header,

+       .content-area .full-width .entry-content,

+       .content-area .full-width .page-content,

+       .content-area .full-width footer.entry-meta {

</ins><span class="cx">           margin: 0 11.21868265%;

</span><span class="cx">  }

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><span class="cx">  .full-width .comment-list li.trackback,

</span><span class="cx">  .full-width .comment-list li.pingback {

</span><span class="cx">          padding-right: 11.21868265%;

</span><span class="cx">          padding-left: 11.21868265%;

</span><span class="cx">  }

</span><del>-       #primary .entry-content .wp-caption.alignleft .wp-caption-text {

</del><ins>+        .content-area .entry-content .wp-caption.alignleft .wp-caption-text {

</ins><span class="cx">           padding-left: 10px;

</span><span class="cx">          padding-left: 1.0rem;

</span><span class="cx">  }

</span><span class="lines">@@ -3105,27 +3089,27 @@

</span><span class="cx"> }

</span><span class="cx"> 

</span><span class="cx"> @media screen and (min-width: 1230px) {

</span><del>-       #page,

-       #masthead,

-       .home #main {

</del><ins>+        .site,

+       .site-header,

+       .home .site-main {

</ins><span class="cx">           max-width: 1260px;

</span><span class="cx">          max-width: 126.0rem;

</span><span class="cx">  }

</span><del>-       #content-sidebar,

</del><ins>+        .content-sidebar,

</ins><span class="cx">   .post-formatted-posts {

</span><span class="cx">          padding-right: 0;

</span><span class="cx">  }

</span><del>-       #primary .full-width .entry-header,

-       #primary .full-width .entry-content,

-       #primary .full-width .page-content,

-       #primary .full-width footer.entry-meta {

</del><ins>+        .content-area .full-width .entry-header,

+       .content-area .full-width .entry-content,

+       .content-area .full-width .page-content,

+       .content-area .full-width footer.entry-meta {

</ins><span class="cx">           margin: 0 0 0 11.21868265%;

</span><span class="cx">  }

</span><del>-       #image-navigation .previous-image,

-       #image-navigation .next-image,

</del><ins>+        .image-navigation .previous-image,

+       .image-navigation .next-image,

</ins><span class="cx">   .full-width .comment-navigation,

</span><span class="cx">  .full-width .comments-title,

</span><del>-       .full-width #comments #respond,

</del><ins>+        .full-width .comment-respond,

</ins><span class="cx">   .full-width .comments-area article,

</span><span class="cx">  .full-width .comment-list li.trackback,

</span><span class="cx">  .full-width .comment-list li.pingback {

</span></span></pre>

</div>

</div>

</body>

</html>