run initial SCSS refactoring through percy

assets/sass/pages/_etc.scss

@@ -1,7 +1,7 @@
 @charset "UTF-8";
 
 // Video Styles
-main#etc {
+section#etc {
   padding-top: 1.5em;
   padding-bottom: 1.5em;
 
@@ -18,7 +18,7 @@ main#etc {
 
 // Responsive
 @mixin responsive--etc() {
-  main#etc {
+  section#etc {
     padding: 1.25em 1.1em;
 
     h1 {

assets/sass/pages/_home.scss

@@ -1,7 +1,7 @@
 @charset "UTF-8";
 
 // Home Styles
-main#home {
+section#home {
   font-size: 1.025em;
   padding-top: 1.5em;
   padding-bottom: 0.75em;
@@ -93,7 +93,7 @@ main#home {
 // Loop through $colors-home (see abstracts/_variables)
 @each $id, $colors in $colors-home {
   @each $theme, $color in $colors {
-    body.#{$theme} main#home a##{$id} {
+    body.#{$theme} section#home a##{$id} {
       color: $color;
       background-image: underline-hack($color);
     }
@@ -102,7 +102,7 @@ main#home {
 
 // Responsive
 @mixin responsive--home() {
-  main#home {
+  section#home {
     font-size: 0.975em;
     padding: 1.2em 1.2em 0.4em 1.2em;
 

assets/sass/pages/_list.scss

@@ -1,7 +1,7 @@
 @charset "UTF-8";
 
 // Archive/List Styles
-main#list {
+section#list {
   padding-top: 1.5em;
   padding-bottom: 0.25em;
 
@@ -46,7 +46,7 @@ main#list {
 
 // Responsive
 @mixin responsive--list() {
-  main#list {
+  section#list {
     padding: 1em 1em 0.25em 1em;
 
     section.year {

assets/sass/pages/_single.scss

@@ -1,7 +1,7 @@
 @charset "UTF-8";
 
 // Post Styles
-main#single {
+section#single {
   padding-top: 1em;
   padding-bottom: 1em;
 
@@ -41,7 +41,7 @@ main#single {
 
 // Responsive
 @mixin responsive--single() {
-  main#single {
+  section#single {
     padding: 0.8em 1.1em;
 
     h1#title {

assets/sass/pages/_videos.scss

@@ -1,7 +1,7 @@
 @charset "UTF-8";
 
 // Video Styles
-main#video {
+section#video {
   padding: 1.5em 0;
   text-align: center;
 
@@ -39,7 +39,7 @@ main#video {
 
 // Responsive
 @mixin responsive--videos() {
-  main#video {
+  section#video {
     padding: 1em 0;
 
     h1 {