style.css

/*
Theme Name: Eighties
Theme URI: http://eighties.me
Author: Justin Kopepasah
Author URI: http://kopepasah.com/
Description: Hello, my name is Eighties and I am a modern, progressively enhanced theme designed to keep your content front and center. My menu and sidebar are built to stay out of the way until a user wants to see them. When clicked, users get a nice, clean overlay. You can upload a custom header image or select to use the featured image of the post as the header image. Both you and your site's visitors will love me and you can expect updates and future enhancements for years to come (because my maker loves me, too).
Version: 1.2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eighties
Domain Path: /languages/
Tags: light, red, white, one-column, responsive-layout, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
Eighties is based on Underscores http://underscores.me/, (C) 2012-2014 Automattic, Inc.

Resource Licenses:
Font Awesome: http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
Backstretch: MIT
FitVids: WTFPL license - http://sam.zoy.org/wtfpl/

Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
and Blueprint http://www.blueprintcss.org/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 - Reset
2.0 - Typography
3.0 - Elements
4.0 - Forms
	4.1 - Buttons
5.0 - Navigation
	5.1 - Links
	5.2 - Menus
6.0 - Accessibility
7.0 - Alignments
8.0 - Clearings
9.0 - Sidebars & Widgets
10.0 - Content
	10.1 - Posts and pages
	10.2 - Asides
	10.3 - Comments
12.0 - Media
13.0 - Structure
14.0 - Header
15.0 - Footer
16.0 - Jetpack
--------------------------------------------------------------*/
/*
	TODO Should this be renamed?
*/
/*--------------------------------------------------------------
1.0 - Reset
--------------------------------------------------------------*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}
html {
  font-size: 62.5%;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body {
  background: #2d2d2d;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section {
  display: block;
}
ol,
ul {
  list-style: none;
}
table {
  border-collapse: separate;
  border-spacing: 0;
}
caption,
th,
td {
  font-weight: normal;
  text-align: left;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
}
blockquote,
q {
  quotes: "" "";
}
a:focus {
  outline: thin dotted;
}
a:hover,
a:active {
  outline: 0;
}
a img {
  border: 0;
}
/** -----------------------------------------------------:[ 2.0 - Typography ]:---------- */
::-moz-selection {
  color: #FFF;
  background: #f2777a;
}
::selection {
  color: #FFF;
  background: #f2777a;
}
html {
  font-size: 18px;
}
@media screen and (max-width: 760px) {
  html {
    font-size: 16px;
  }
}
body,
button,
input,
select,
textarea {
  color: #474747;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1em;
  line-height: 1.75;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  clear: both;
  font-family: 'Varela Round', sans-serif;
  font-weight: 400;
}
h1 {
  margin-top: 0.8888888888888888em;
  margin-bottom: 0.8888888888888888em;
  font-size: 2.25em;
  letter-spacing: -1px;
}
h2 {
  margin-top: 1em;
  margin-bottom: 1em;
  font-size: 2em;
}
h3 {
  margin-top: 1.1428571428571428em;
  margin-bottom: 1.1428571428571428em;
  font-size: 1.75em;
}
h4 {
  margin-top: 1.3333333333333333em;
  margin-bottom: 1.3333333333333333em;
  font-size: 1.5em;
}
h5,
h6 {
  margin-top: 1.6em;
  margin-bottom: 1.6em;
  font-size: 1.25em;
}
h6 {
  margin-top: 2em;
  margin-bottom: 2em;
  font-size: 1em;
}
@media screen and (max-width: 760px) {
  h1 {
    margin-top: 0.7619047619047619em;
    margin-bottom: 0.7619047619047619em;
    font-size: 1.75em;
    letter-spacing: -1px;
  }
  h2 {
    margin-top: 0.8888888888888888em;
    margin-bottom: 0.8888888888888888em;
    font-size: 1.5em;
  }
  h3 {
    margin-top: 1.0666666666666667em;
    margin-bottom: 1.0666666666666667em;
    font-size: 1.25em;
  }
  h4 {
    margin-top: 1.3333333333333333em;
    margin-bottom: 1.3333333333333333em;
    font-size: 1em;
  }
  h5,
  h6 {
    margin-top: 1.7777777777777777em;
    margin-bottom: 1.7777777777777777em;
    font-size: 0.75em;
  }
  h6 {
    margin-top: 2.6666666666666665em;
    margin-bottom: 2.6666666666666665em;
    font-size: 0.5em;
  }
}
p {
  margin-bottom: 2em;
}
b,
strong {
  font-weight: bold;
}
dfn,
cite,
em,
i {
  font-style: italic;
}
blockquote {
  margin-left: 10%;
  margin-right: 10%;
  margin-bottom: 2em;
  padding: 1.5em;
  color: #868686;
  background: #f9f9f9;
}
blockquote p {
  margin-bottom: 0;
}
blockquote.alignleft,
blockquote.alignright {
  margin-bottom: 1.5em;
  max-width: 400px;
}
address {
  margin: 0 0 2em;
}
pre {
  margin-bottom: 2em;
  max-width: 100%;
  overflow: auto;
  padding: 1em;
  background: #2d2d2d;
  border-radius: 2px;
  color: #FFF;
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
  font-size: 14px;
  font-size: 0.7777777777777778rem;
  /*	line-height: 1.6;*/
}
code,
kbd,
tt,
var {
  padding: 0 5px;
  background: #ececec;
  color: #474747;
  font-size: 14px;
  font-size: 0.7777777777777778rem;
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
}
abbr,
acronym {
  border-bottom: 1px dotted #666;
  cursor: help;
}
mark,
ins {
  background: #fff1d6;
  text-decoration: none;
}
sup,
sub {
  font-size: 10px;
  font-size: 0.5555555555555556rem;
  height: 0;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  bottom: 1ex;
}
sub {
  top: .5ex;
}
small {
  font-size: 12px;
  font-size: 0.6666666666666666rem;
}
big {
  font-size: 20px;
  font-size: 1.1111111111111112rem;
}
/** -----------------------------------------------------:[ 3.0 - Elements ]:---------- */
hr {
  background-color: #ececec;
  border: 0;
  height: 3px;
  width: 80%;
  margin: 0 auto 2em;
}
ul,
ol {
  margin: 0 0 1.5em 3em;
}
@media screen and (max-width: 760px) {
  ul,
  ol {
    margin-left: 1.5em;
  }
}
ul {
  list-style: disc;
}
ol {
  list-style: decimal;
}
li > ul,
li > ol {
  margin-bottom: 0;
  margin-left: 1.5em;
}
li img {
  margin: 1em 0;
}
dt {
  font-weight: bold;
}
dd {
  margin: 0 1.5em 1.5em;
}
img {
  height: auto;
  max-width: 100%;
}
audio,
video {
  display: inline-block;
  max-width: 100%;
}
figure {
  margin: 0;
}
/** ----------------------------------------:[ tables ]:--- */
table {
  width: 100%;
  margin: 0 0 2em;
  background: #FFF;
}
table,
td,
th {
  border: 1px solid #ececec;
  border-collapse: collapse;
}
th {
  font-weight: bold;
}
th,
td,
caption {
  padding: .75em;
}
tfoot {
  font-style: italic;
}
/** -----------------------------------------------------:[ 4.0 - Forms ]:---------- */
button,
input,
select,
textarea {
  font-size: 100%;
  margin: 0;
  vertical-align: baseline;
  max-width: 100%;
}
/** ----------------------------------------:[ 4.1 - Buttons ]:--- */
.btn {
  cursor: pointer;
  display: inline-block;
  padding: 1em;
  background: #f2777a;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  color: #FFF;
  font-family: 'Varela Round', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  -webkit-transition: box-shadow 100ms linear, border-color 100ms linear;
  -moz-transition: box-shadow 100ms linear, border-color 100ms linear;
  -o-transition: box-shadow 100ms linear, border-color 100ms linear;
  transition: box-shadow 100ms linear, border-color 100ms linear;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}
.btn:hover,
.btn:focus,
.btn:active {
  background: #f2777a;
  box-shadow: 0 0 0 3px #f2777a;
  color: #FFF;
}
.btn-full {
  width: 100%;
  text-align: center;
}
.btn-disabled {
  background: #b9b9b9;
}
.btn-disabled:hover,
.btn-disabled:focus,
.btn-disabled:active {
  background: #b9b9b9;
  box-shadow: 0 0 0 3px #b9b9b9;
}
.btn-secondary {
  background: #99cc99;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
.btn-blue {
  background: #6699cc;
}
.btn-blue:hover,
.btn-blue:focus,
.btn-blue:active {
  background: #6699cc;
  box-shadow: 0 0 0 3px #6699cc;
}
.btn-green {
  background: #99cc99;
}
.btn-green:hover,
.btn-green:focus,
.btn-green:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: none;
  cursor: pointer;
  display: inline-block;
  padding: 1em;
  background: #f2777a;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  color: #FFF;
  font-family: 'Varela Round', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  -webkit-transition: box-shadow 100ms linear, border-color 100ms linear;
  -moz-transition: box-shadow 100ms linear, border-color 100ms linear;
  -o-transition: box-shadow 100ms linear, border-color 100ms linear;
  transition: box-shadow 100ms linear, border-color 100ms linear;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
  background: #f2777a;
  box-shadow: 0 0 0 3px #f2777a;
  color: #FFF;
}
button-full,
input[type="button"]-full,
input[type="reset"]-full,
input[type="submit"]-full {
  width: 100%;
  text-align: center;
}
button-disabled,
input[type="button"]-disabled,
input[type="reset"]-disabled,
input[type="submit"]-disabled {
  background: #b9b9b9;
}
button-disabled:hover,
input[type="button"]-disabled:hover,
input[type="reset"]-disabled:hover,
input[type="submit"]-disabled:hover,
button-disabled:focus,
input[type="button"]-disabled:focus,
input[type="reset"]-disabled:focus,
input[type="submit"]-disabled:focus,
button-disabled:active,
input[type="button"]-disabled:active,
input[type="reset"]-disabled:active,
input[type="submit"]-disabled:active {
  background: #b9b9b9;
  box-shadow: 0 0 0 3px #b9b9b9;
}
button-secondary,
input[type="button"]-secondary,
input[type="reset"]-secondary,
input[type="submit"]-secondary {
  background: #99cc99;
}
button-secondary:hover,
input[type="button"]-secondary:hover,
input[type="reset"]-secondary:hover,
input[type="submit"]-secondary:hover,
button-secondary:focus,
input[type="button"]-secondary:focus,
input[type="reset"]-secondary:focus,
input[type="submit"]-secondary:focus,
button-secondary:active,
input[type="button"]-secondary:active,
input[type="reset"]-secondary:active,
input[type="submit"]-secondary:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
button-blue,
input[type="button"]-blue,
input[type="reset"]-blue,
input[type="submit"]-blue {
  background: #6699cc;
}
button-blue:hover,
input[type="button"]-blue:hover,
input[type="reset"]-blue:hover,
input[type="submit"]-blue:hover,
button-blue:focus,
input[type="button"]-blue:focus,
input[type="reset"]-blue:focus,
input[type="submit"]-blue:focus,
button-blue:active,
input[type="button"]-blue:active,
input[type="reset"]-blue:active,
input[type="submit"]-blue:active {
  background: #6699cc;
  box-shadow: 0 0 0 3px #6699cc;
}
button-green,
input[type="button"]-green,
input[type="reset"]-green,
input[type="submit"]-green {
  background: #99cc99;
}
button-green:hover,
input[type="button"]-green:hover,
input[type="reset"]-green:hover,
input[type="submit"]-green:hover,
button-green:focus,
input[type="button"]-green:focus,
input[type="reset"]-green:focus,
input[type="submit"]-green:focus,
button-green:active,
input[type="button"]-green:active,
input[type="reset"]-green:active,
input[type="submit"]-green:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
/** ---:[ Inputs ]:--- */
input[type="checkbox"],
input[type="radio"] {
  padding: 0;
  margin-right: .5em;
}
/*input[type="search"] {
	-webkit-appearance: textfield; // Addresses appearance set to searchfield in S5, Chrome
	&::-webkit-search-decoration { // Corrects inner padding displayed oddly in S5, Chrome on OSX
		-webkit-appearance: none;
	}
}*/
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input[type="color"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="week"],
input[type="month"] {
  outline: none;
  padding: 1em;
  background: #FFF;
  border: 1px solid #ececec;
  border-radius: 2px;
  color: #adadad;
  -webkit-appearance: none;
}
input[type="color"]:hover,
input[type="email"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="text"]:hover,
input[type="url"]:hover,
input[type="number"]:hover,
input[type="date"]:hover,
input[type="time"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="week"]:hover,
input[type="month"]:hover {
  border-color: #d3d3d3;
}
input[type="color"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="week"]:focus,
input[type="month"]:focus {
  border-color: #b9b9b9;
  color: #606060;
}
/*select {
	width: 100%;
	max-width: 330px;
	padding: 1em;
	background: #FFF;
	border: 1px solid darken( @light, 5% );
	border-radius: 0;
	color: darken( @light, 25% );
	outline: none;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	&:hover {
		border-color: darken( @light, 25% );
	}
	&:focus {
		border-color: @dark;
		color: @dark;
	}
}*/
textarea {
  overflow: auto;
  vertical-align: top;
  width: 100%;
  padding: 1em;
  background: #FFF;
  border: 1px solid #ececec;
  border-radius: 2px;
  color: #adadad;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
textarea:hover {
  border-color: #d3d3d3;
}
textarea:focus {
  border-color: #b9b9b9;
  color: #606060;
}
/** ----------------------------------------:[ 4.2 - Notifications ]:--- */
.success,
.error,
.notice,
.update {
  position: relative;
  padding: 1em 1em 1em 4em;
  border-radius: 2px;
  color: #FFF;
}
.success a,
.error a,
.notice a,
.update a {
  color: #FFF;
  border-bottom: 1px solid #FFF;
  -webkit-transition: background-color 200ms linear, border-color 200ms linear;
  -moz-transition: background-color 200ms linear, border-color 200ms linear;
  -o-transition: background-color 200ms linear, border-color 200ms linear;
  transition: background-color 200ms linear, border-color 200ms linear;
}
.success a:hover,
.error a:hover,
.notice a:hover,
.update a:hover {
  color: #FFF;
  border-bottom-color: transparent;
}
.success:before,
.error:before,
.notice:before,
.update:before {
  content: ' ';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 3em;
  display: inline-block;
  border-right: 1px solid transparent;
}
.success:after,
.error:after,
.notice:after,
.update:after {
  position: absolute;
  top: 50%;
  left: 1em;
  min-width: 1.1em;
  text-align: center;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.success {
  background: #99cc99;
}
.success a:hover {
  background-color: #77bb77;
}
.success:before {
  border-right-color: #aad5aa;
}
.success:after {
  content: "\f00c";
}
.notice {
  background: #ffcc66;
}
.notice a:hover {
  background-color: #ffbb33;
}
.notice:before {
  border-right-color: #ffd480;
}
.notice:after {
  content: "\f071";
}
.error {
  background: #f2777a;
}
.error a:hover {
  background-color: #ee484c;
}
.error:before {
  border-right-color: #f48e91;
}
.error:after {
  content: "\f00d";
}
.update {
  background: #6699cc;
}
.update a:hover {
  background-color: #407fbf;
}
.update:before {
  border-right-color: #79a6d2;
}
.update:after {
  content: "\f129";
}
/** -----------------------------------------------------:[ 5.0 - Navigation ]:---------- */
/** ----------------------------------------:[ 5.1 - Links ]:--- */
a {
  color: #f2777a;
  text-decoration: none;
  -webkit-transition: color 200ms ease;
  -moz-transition: color 200ms ease;
  -o-transition: color 200ms ease;
  transition: color 200ms ease;
}
a:hover,
a:focus,
a:active {
  color: #99cc99;
}
/** ----------------------------------------:[ 5.2 - Menus ]:--- */
/** ---:[ Structure ]:--- */
.menu {
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
  list-style: none;
}
.menu li {
  display: inline-block;
}
.menu li a {
  display: block;
}
.menu li ul {
  position: absolute;
  z-index: 999999;
  visibility: hidden;
  margin-left: 0;
  opacity: 0;
}
.menu li ul ul {
  margin: -3.4rem 0 0 12rem;
}
.menu li:hover {
  position: static;
}
.menu li:hover ul {
  opacity: 1;
  visibility: visible;
}
.menu li:hover ul ul,
.menu li:hover ul ul ul,
.menu li:hover ul ul ul ul,
.menu li:hover ul ul ul ul ul {
  opacity: 0;
}
.menu li li {
  display: block;
}
.menu li li a {
  width: 12rem;
}
.menu li li:hover ul {
  opacity: 1;
}
.menu li li li:hover ul {
  opacity: 1;
}
.menu li li li li:hover ul {
  opacity: 1;
}
.menu li li li li li:hover ul {
  opacity: 1;
}
/** ---:[ Styles ]:--- */
.main-navigation {
  background: #f2777a;
  display: none;
}
.main-navigation ul {
  margin: 0;
}
.main-navigation ul ul {
  background: #2d2d2d;
}
.main-navigation .current-menu-item > a {
  background: rgba(255, 255, 255, 0.09999999999999998);
}
.main-navigation li a {
  text-decoration: none;
  padding: 1em;
  border-right: 1px solid rgba(255, 255, 255, 0.09999999999999998);
  background-color: transparent;
  color: #FFF;
  -webkit-transition: background-color .2s linear;
  -moz-transition: background-color .2s linear;
  -o-transition: background-color .2s linear;
  transition: background-color .2s linear;
}
.main-navigation li a:hover {
  background: rgba(255, 255, 255, 0.09999999999999998);
}
/** ---:[ With JS ]:--- */
.js.disable-scroll {
  overflow: hidden;
}
.js .main-navigation {
  overflow: scroll;
  position: fixed;
  top: 0;
  bottom: 110%;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1000;
  opacity: 0;
  background: #2d2d2d;
  -webkit-transition: opacity 200ms linear, bottom 0s linear 200ms;
  -moz-transition: opacity 200ms linear, bottom 0s linear 200ms;
  -o-transition: opacity 200ms linear, bottom 0s linear 200ms;
  transition: opacity 200ms linear, bottom 0s linear 200ms;
}
@media screen and (max-width: 500px) {
  .js .main-navigation {
    padding-left: 2em;
    padding-right: 2em;
  }
}
.js .main-navigation-open #site-navigation {
  bottom: 0;
  opacity: 1;
  -webkit-transition: opacity 200ms linear, bottom 0s linear;
  -moz-transition: opacity 200ms linear, bottom 0s linear;
  -o-transition: opacity 200ms linear, bottom 0s linear;
  transition: opacity 200ms linear, bottom 0s linear;
}
.js .main-navigation-open #page {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 0;
}
.js .main-navigation-toggle {
  position: absolute;
  top: 1em;
  left: 1em;
  font-size: 36px;
  font-size: 2rem;
  padding: .2em;
  color: #FFF;
  line-height: 0;
}
.js .main-navigation .menu {
  width: 100%;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 6em;
}
.js .main-navigation .menu > ul > li:first-child > a {
  border-top: 1px solid #3a3a3a;
}
.js .main-navigation-title {
  width: 100%;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 1em;
  padding-top: 96px;
  color: #FFF;
  line-height: 1;
  text-transform: uppercase;
}
.js .main-navigation li {
  display: block;
}
.js .main-navigation li a {
  width: 100%;
  display: block;
  text-decoration: none;
  padding: .6em 0;
  background-color: transparent;
  border-right: 0;
  border-bottom: 1px solid #3a3a3a;
  color: #FFF;
  -webkit-transition: border-width 200ms linear;
  -moz-transition: border-width 200ms linear;
  -o-transition: border-width 200ms linear;
  transition: border-width 200ms linear;
}
.js .main-navigation li a:hover,
.js .main-navigation li a:active {
  color: #f2777a;
}
.js .main-navigation li:hover ul,
.js .main-navigation li:hover ul ul,
.js .main-navigation li:hover ul ul ul,
.js .main-navigation li:hover ul ul ul ul {
  opacity: 1;
}
.js .main-navigation li.menu-item-search {
  margin-top: 3em;
  position: relative;
}
.js .main-navigation li.menu-item-search a {
  position: absolute !important;
  display: none;
}
.js .main-navigation li.menu-item-search a i {
  color: #b9b9b9;
}
.js .main-navigation li.menu-item-search input {
  width: 100%;
  border-radius: 2px;
}
.js .main-navigation ul {
  font-size: 16px;
  font-size: 0.8888888888888888rem;
  list-style: none;
  margin: 0;
  padding-left: 0;
  visibility: visible;
  opacity: 1;
}
.js .main-navigation ul ul {
  position: static;
  background: transparent;
  margin-left: 1em;
}
.js .main-navigation .current-menu-item > a {
  border-left-width: 3px;
}
.js .main-navigation #mobile-menu-close {
  background-color: #3a3a3a;
  font-size: .9em;
}
.js .main-navigation #mobile-menu-close i {
  float: right;
  margin-top: 3px;
  font-size: 1.2em;
}
.js .admin-bar .main-navigation {
  top: 32px;
}
@media screen and (max-width: 782px) {
  .js .admin-bar .main-navigation {
    top: 46px;
  }
}
.js .menu-social {
  padding-bottom: 6em;
}
.js .menu-social:before,
.js .menu-social:after {
  content: " ";
  display: table;
  line-height: 0;
}
.js .menu-social:after {
  clear: both;
}
.js .menu-social li {
  width: 33%;
  float: left;
  text-align: center;
}
@media screen and (min-width: 500px) {
  .js .menu-social li {
    width: 20%;
  }
}
.js .menu-social li a {
  display: block;
  padding: 1em 0;
  background: #3a3a3a;
  border-bottom: 0;
  font-size: 3em;
  line-height: 0;
  color: #FFF;
}
.js .menu-social li a .screen-reader-text {
  font-size: 18px;
  font-size: 1rem;
}
@media screen and (min-width: 500px) {
  .js .menu-social li a {
    padding: 0.5em 0;
  }
}
.js .menu-social li a:before {
  min-width: 27px;
  display: inline-block;
  border-bottom: 0;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.js .menu-social li a[href*='twitter.com'] {
  background: #55ACEE;
}
.js .menu-social li a[href*='twitter.com']:before {
  content: "\f099";
}
.js .menu-social li a[href*='facebook.com'] {
  background: #3B5998;
}
.js .menu-social li a[href*='facebook.com']:before {
  content: "\f09a";
}
.js .menu-social li a[href*='github.com'] {
  background: #4183C4;
}
.js .menu-social li a[href*='github.com']:before {
  content: "\f09b";
}
.js .menu-social li a[href*='foursquare.com'] {
  background: #0072B1;
}
.js .menu-social li a[href*='foursquare.com']:before {
  content: "\f180";
}
.js .menu-social li a[href*='flickr.com'] {
  background: #FF0084;
}
.js .menu-social li a[href*='flickr.com']:before {
  content: "\f16e";
}
.js .menu-social li a[href*='app.net'] {
  background: #D87A68;
}
.js .menu-social li a[href*='app.net']:before {
  content: "\f170";
}
.js .menu-social li a[href*='linkedin.com'] {
  background: #0976B4;
}
.js .menu-social li a[href*='linkedin.com']:before {
  content: "\f0e1";
}
.js .menu-social li a[href*='google.com'] {
  background: #DD4B39;
}
.js .menu-social li a[href*='google.com']:before {
  content: "\f0d5";
}
.js .menu-social li a[href*='youtube.com'] {
  background: #E52D27;
}
.js .menu-social li a[href*='youtube.com']:before {
  content: "\f167";
}
.js .menu-social li a[href*='wordpress.org'] {
  background: #21759B;
}
.js .menu-social li a[href*='wordpress.org']:before {
  content: "\f19a";
}
.js .menu-social li a:hover {
  background: #3a3a3a;
  color: #FFF;
}
/** ---:[ Without JS ]:--- */
.no-js .main-navigation {
  display: block;
  width: auto;
  left: auto;
}
.no-js .main-navigation .menu:before,
.no-js .main-navigation .menu:after {
  content: " ";
  display: table;
  line-height: 0;
}
.no-js .main-navigation .menu:after {
  clear: both;
}
.no-js .main-navigation .menu > li {
  float: left;
}
.no-js .main-navigation-title {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
}
.no-js .main-navigation li.menu-item-search {
  position: relative;
  float: right;
  border-left: 1px solid rgba(255, 255, 255, 0.09999999999999998);
}
.no-js .main-navigation li.menu-item-search input {
  visibility: hidden;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  padding: 0 0 0 10px;
  border-radius: 0;
  border-color: transparent;
  background: #FFF;
  outline: none;
}
.no-js .main-navigation li.menu-item-search input:focus {
  outline: none;
}
.no-js .main-navigation li.menu-item-search .search-form {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 48px;
}
.no-js .main-navigation li.menu-item-search:hover input {
  visibility: visible;
}
.no-js .main-navigation-toggle {
  display: none;
}
.no-js .eighties-social-menu {
  display: none;
}
/** ----------------------------------------:[ Paging ]:--- */
.paging-navigation,
.post-navigation,
.comment-navigation {
  width: 100%;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
  padding: 3em 0;
}
.paging-navigation:before,
.post-navigation:before,
.comment-navigation:before,
.paging-navigation:after,
.post-navigation:after,
.comment-navigation:after {
  content: " ";
  display: table;
  line-height: 0;
}
.paging-navigation:after,
.post-navigation:after,
.comment-navigation:after {
  clear: both;
}
.paging-navigation .nav-previous a,
.post-navigation .nav-previous a,
.comment-navigation .nav-previous a,
.paging-navigation .nav-next a,
.post-navigation .nav-next a,
.comment-navigation .nav-next a {
  cursor: pointer;
  display: inline-block;
  padding: 1em;
  background: #f2777a;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  color: #FFF;
  font-family: 'Varela Round', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  -webkit-transition: box-shadow 100ms linear, border-color 100ms linear;
  -moz-transition: box-shadow 100ms linear, border-color 100ms linear;
  -o-transition: box-shadow 100ms linear, border-color 100ms linear;
  transition: box-shadow 100ms linear, border-color 100ms linear;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}
.paging-navigation .nav-previous a:hover,
.post-navigation .nav-previous a:hover,
.comment-navigation .nav-previous a:hover,
.paging-navigation .nav-next a:hover,
.post-navigation .nav-next a:hover,
.comment-navigation .nav-next a:hover,
.paging-navigation .nav-previous a:focus,
.post-navigation .nav-previous a:focus,
.comment-navigation .nav-previous a:focus,
.paging-navigation .nav-next a:focus,
.post-navigation .nav-next a:focus,
.comment-navigation .nav-next a:focus,
.paging-navigation .nav-previous a:active,
.post-navigation .nav-previous a:active,
.comment-navigation .nav-previous a:active,
.paging-navigation .nav-next a:active,
.post-navigation .nav-next a:active,
.comment-navigation .nav-next a:active {
  background: #f2777a;
  box-shadow: 0 0 0 3px #f2777a;
  color: #FFF;
}
.paging-navigation .nav-previous a-full,
.post-navigation .nav-previous a-full,
.comment-navigation .nav-previous a-full,
.paging-navigation .nav-next a-full,
.post-navigation .nav-next a-full,
.comment-navigation .nav-next a-full {
  width: 100%;
  text-align: center;
}
.paging-navigation .nav-previous a-disabled,
.post-navigation .nav-previous a-disabled,
.comment-navigation .nav-previous a-disabled,
.paging-navigation .nav-next a-disabled,
.post-navigation .nav-next a-disabled,
.comment-navigation .nav-next a-disabled {
  background: #b9b9b9;
}
.paging-navigation .nav-previous a-disabled:hover,
.post-navigation .nav-previous a-disabled:hover,
.comment-navigation .nav-previous a-disabled:hover,
.paging-navigation .nav-next a-disabled:hover,
.post-navigation .nav-next a-disabled:hover,
.comment-navigation .nav-next a-disabled:hover,
.paging-navigation .nav-previous a-disabled:focus,
.post-navigation .nav-previous a-disabled:focus,
.comment-navigation .nav-previous a-disabled:focus,
.paging-navigation .nav-next a-disabled:focus,
.post-navigation .nav-next a-disabled:focus,
.comment-navigation .nav-next a-disabled:focus,
.paging-navigation .nav-previous a-disabled:active,
.post-navigation .nav-previous a-disabled:active,
.comment-navigation .nav-previous a-disabled:active,
.paging-navigation .nav-next a-disabled:active,
.post-navigation .nav-next a-disabled:active,
.comment-navigation .nav-next a-disabled:active {
  background: #b9b9b9;
  box-shadow: 0 0 0 3px #b9b9b9;
}
.paging-navigation .nav-previous a-secondary,
.post-navigation .nav-previous a-secondary,
.comment-navigation .nav-previous a-secondary,
.paging-navigation .nav-next a-secondary,
.post-navigation .nav-next a-secondary,
.comment-navigation .nav-next a-secondary {
  background: #99cc99;
}
.paging-navigation .nav-previous a-secondary:hover,
.post-navigation .nav-previous a-secondary:hover,
.comment-navigation .nav-previous a-secondary:hover,
.paging-navigation .nav-next a-secondary:hover,
.post-navigation .nav-next a-secondary:hover,
.comment-navigation .nav-next a-secondary:hover,
.paging-navigation .nav-previous a-secondary:focus,
.post-navigation .nav-previous a-secondary:focus,
.comment-navigation .nav-previous a-secondary:focus,
.paging-navigation .nav-next a-secondary:focus,
.post-navigation .nav-next a-secondary:focus,
.comment-navigation .nav-next a-secondary:focus,
.paging-navigation .nav-previous a-secondary:active,
.post-navigation .nav-previous a-secondary:active,
.comment-navigation .nav-previous a-secondary:active,
.paging-navigation .nav-next a-secondary:active,
.post-navigation .nav-next a-secondary:active,
.comment-navigation .nav-next a-secondary:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
.paging-navigation .nav-previous a-blue,
.post-navigation .nav-previous a-blue,
.comment-navigation .nav-previous a-blue,
.paging-navigation .nav-next a-blue,
.post-navigation .nav-next a-blue,
.comment-navigation .nav-next a-blue {
  background: #6699cc;
}
.paging-navigation .nav-previous a-blue:hover,
.post-navigation .nav-previous a-blue:hover,
.comment-navigation .nav-previous a-blue:hover,
.paging-navigation .nav-next a-blue:hover,
.post-navigation .nav-next a-blue:hover,
.comment-navigation .nav-next a-blue:hover,
.paging-navigation .nav-previous a-blue:focus,
.post-navigation .nav-previous a-blue:focus,
.comment-navigation .nav-previous a-blue:focus,
.paging-navigation .nav-next a-blue:focus,
.post-navigation .nav-next a-blue:focus,
.comment-navigation .nav-next a-blue:focus,
.paging-navigation .nav-previous a-blue:active,
.post-navigation .nav-previous a-blue:active,
.comment-navigation .nav-previous a-blue:active,
.paging-navigation .nav-next a-blue:active,
.post-navigation .nav-next a-blue:active,
.comment-navigation .nav-next a-blue:active {
  background: #6699cc;
  box-shadow: 0 0 0 3px #6699cc;
}
.paging-navigation .nav-previous a-green,
.post-navigation .nav-previous a-green,
.comment-navigation .nav-previous a-green,
.paging-navigation .nav-next a-green,
.post-navigation .nav-next a-green,
.comment-navigation .nav-next a-green {
  background: #99cc99;
}
.paging-navigation .nav-previous a-green:hover,
.post-navigation .nav-previous a-green:hover,
.comment-navigation .nav-previous a-green:hover,
.paging-navigation .nav-next a-green:hover,
.post-navigation .nav-next a-green:hover,
.comment-navigation .nav-next a-green:hover,
.paging-navigation .nav-previous a-green:focus,
.post-navigation .nav-previous a-green:focus,
.comment-navigation .nav-previous a-green:focus,
.paging-navigation .nav-next a-green:focus,
.post-navigation .nav-next a-green:focus,
.comment-navigation .nav-next a-green:focus,
.paging-navigation .nav-previous a-green:active,
.post-navigation .nav-previous a-green:active,
.comment-navigation .nav-previous a-green:active,
.paging-navigation .nav-next a-green:active,
.post-navigation .nav-next a-green:active,
.comment-navigation .nav-next a-green:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
@media screen and (max-width: 920px) {
  .paging-navigation,
  .post-navigation,
  .comment-navigation {
    padding: 3em;
  }
  .paging-navigation .nav-previous,
  .post-navigation .nav-previous,
  .comment-navigation .nav-previous {
    margin-bottom: 1.5em;
  }
}
@media screen and (max-width: 760px) {
  .paging-navigation .nav-previous,
  .post-navigation .nav-previous,
  .comment-navigation .nav-previous {
    margin-bottom: 1.5em;
  }
  .paging-navigation .nav-previous,
  .post-navigation .nav-previous,
  .comment-navigation .nav-previous,
  .paging-navigation .nav-next,
  .post-navigation .nav-next,
  .comment-navigation .nav-next {
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 760px) {
  .paging-navigation .nav-previous,
  .post-navigation .nav-previous,
  .comment-navigation .nav-previous,
  .paging-navigation .nav-next,
  .post-navigation .nav-next,
  .comment-navigation .nav-next {
    width: 48%;
  }
  .paging-navigation .nav-previous,
  .post-navigation .nav-previous,
  .comment-navigation .nav-previous {
    float: left;
  }
  .paging-navigation .nav-previous a,
  .post-navigation .nav-previous a,
  .comment-navigation .nav-previous a {
    float: left;
  }
  .paging-navigation .nav-next,
  .post-navigation .nav-next,
  .comment-navigation .nav-next {
    float: right;
  }
  .paging-navigation .nav-next a,
  .post-navigation .nav-next a,
  .comment-navigation .nav-next a {
    float: right;
  }
}
.comment-navigation {
  padding-bottom: 0;
}
.post-navigation .nav-previous,
.post-navigation .nav-next {
  max-width: 330px;
  text-align: center;
}
/** ----------------------------------------:[ Infinite Scroll (JavaScript Only) ]:--- */
.js .infinite-loader {
  color: #000;
  display: block;
  padding-top: 5em;
  padding-bottom: 5em;
  text-indent: -9999px;
}
.js .infinite-loader .spinner {
  left: 50% !important;
}
.js #infinite-handle {
  clear: both;
  padding: 3em;
  color: #FFF;
  text-align: center;
}
.js #infinite-handle span {
  width: 80%;
  max-width: 300px;
  cursor: pointer;
  display: inline-block;
  padding: 1em;
  background: #f2777a;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  color: #FFF;
  font-family: 'Varela Round', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  -webkit-transition: box-shadow 100ms linear, border-color 100ms linear;
  -moz-transition: box-shadow 100ms linear, border-color 100ms linear;
  -o-transition: box-shadow 100ms linear, border-color 100ms linear;
  transition: box-shadow 100ms linear, border-color 100ms linear;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}
.js #infinite-handle span:hover,
.js #infinite-handle span:focus,
.js #infinite-handle span:active {
  background: #f2777a;
  box-shadow: 0 0 0 3px #f2777a;
  color: #FFF;
}
.js #infinite-handle span-full {
  width: 100%;
  text-align: center;
}
.js #infinite-handle span-disabled {
  background: #b9b9b9;
}
.js #infinite-handle span-disabled:hover,
.js #infinite-handle span-disabled:focus,
.js #infinite-handle span-disabled:active {
  background: #b9b9b9;
  box-shadow: 0 0 0 3px #b9b9b9;
}
.js #infinite-handle span-secondary {
  background: #99cc99;
}
.js #infinite-handle span-secondary:hover,
.js #infinite-handle span-secondary:focus,
.js #infinite-handle span-secondary:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
.js #infinite-handle span-blue {
  background: #6699cc;
}
.js #infinite-handle span-blue:hover,
.js #infinite-handle span-blue:focus,
.js #infinite-handle span-blue:active {
  background: #6699cc;
  box-shadow: 0 0 0 3px #6699cc;
}
.js #infinite-handle span-green {
  background: #99cc99;
}
.js #infinite-handle span-green:hover,
.js #infinite-handle span-green:focus,
.js #infinite-handle span-green:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
.js #infinite-handle span:hover {
  opacity: .9;
}
/** -----------------------------------------------------:[ 6.0 - Accessability ]:---------- */
/* Text meant only for screen readers */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
}
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}
/** -----------------------------------------------------:[ 7.0 - Alignments ]:---------- */
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}
.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}
.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 960px) {
  .alignleft {
    margin-left: -100px;
  }
  .alignright {
    margin-right: -100px;
  }
}
@media screen and (min-width: 1160px) {
  .alignleft {
    margin-left: -200px;
  }
  .alignright {
    margin-right: -200px;
  }
}
/** -----------------------------------------------------:[ 8.0 - Clearings ]:---------- */
/*
	TODO Set this to the clearfix class.
*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
  content: '';
  display: table;
}
.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
  clear: both;
}
/** -----------------------------------------------------:[ 9.0 - Sidebars & Widgets ]:---------- */
.widget > ul {
  margin-left: 1em;
}
.widget select {
  max-width: 100%;
}
.widget_search .search-submit {
  display: none;
}
.widget_meta ul {
  list-style: none;
  margin: 0;
}
.widget_recent_entries ul,
.widget_recent_comments ul {
  margin: 0;
  list-style: none;
}
.widget_recent_entries li,
.widget_recent_comments li {
  margin-bottom: 1em;
}
.widget_recent_entries .post-date {
  display: block;
  font-size: .9em;
}
.widget_recent_entries .post-date:before {
  content: '\f017';
  font-family: 'fontawesome', arial;
  margin-right: 6px;
  margin-left: 2px;
  font-weight: 200;
  vertical-align: middle;
}
/** ---:[ With JavaScript ]:--- */
.js.disable-scroll {
  overflow: hidden;
}
.js #secondary {
  overflow: scroll;
  position: fixed;
  top: 0;
  bottom: 100%;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1000;
  opacity: 0;
  color: #ececec;
  background: #2d2d2d;
  -webkit-transition: opacity 300ms linear, bottom 0s linear 300ms;
  -moz-transition: opacity 300ms linear, bottom 0s linear 300ms;
  -o-transition: opacity 300ms linear, bottom 0s linear 300ms;
  transition: opacity 300ms linear, bottom 0s linear 300ms;
}
.js #secondary .widget {
  margin-bottom: 6em;
}
.js #secondary .widgets-wrapper {
  width: 100%;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 6em;
}
.js #secondary .widgets-wrapper:before,
.js #secondary .widgets-wrapper:after {
  content: " ";
  display: table;
  line-height: 0;
}
.js #secondary .widgets-wrapper:after {
  clear: both;
}
@media screen and (max-width: 1200px) {
  .js #secondary .widgets-wrapper {
    padding-left: 2em;
    padding-right: 2em;
  }
}
.js #secondary .widget-title {
  margin: 0 0 1em;
  color: #FFF;
  text-transform: uppercase;
  line-height: 1;
}
.js #secondary .widget-area-toggle {
  position: absolute;
  top: 1em;
  right: 1em;
  font-size: 36px;
  font-size: 2rem;
  padding: .2em;
  color: #FFF;
  line-height: 0;
}
.js .widget {
  font-size: 16px;
  font-size: 0.8888888888888888rem;
}
.js .widget a {
  color: #7a7a7a;
}
.js .widget a:hover {
  color: #FFF;
}
.js .widget .btn {
  color: #FFF;
}
.js .widget-area-open #secondary {
  bottom: 0;
  opacity: 1;
  -webkit-transition: opacity 300ms linear, bottom 0s linear;
  -moz-transition: opacity 300ms linear, bottom 0s linear;
  -o-transition: opacity 300ms linear, bottom 0s linear;
  transition: opacity 300ms linear, bottom 0s linear;
}
.js .widget-area-open #page {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 0;
}
.js .widget-area-open #primary,
.js .widget-area-open #masthead {
  -webkit-transition: all 100ms linear 300ms;
  -moz-transition: all 100ms linear 300ms;
  -o-transition: all 100ms linear 300ms;
  transition: all 100ms linear 300ms;
  -webkit-filter: blur(10px);
  -moz-filter: blur(10px);
  -ms-filter: blur(10px);
  -o-filter: blur(10px);
  filter: blur(10px);
}
.js .widget ul {
  list-style: none;
  margin: 0;
  padding-left: 0;
}
.js .widget ul li {
  display: block;
}
.js .widget ul ul {
  margin-left: 1em;
}
.js .widget.widget_tag_cloud a {
  display: inline-block;
  margin-right: .2em;
  margin-bottom: .5em;
  padding: .2em .5em;
  font-size: inherit !important;
  background-color: #3a3a3a;
  color: #FFF;
}
.js .widget.widget_tag_cloud a:hover {
  background-color: #f2777a;
}
.js .widget .menu li {
  padding: 0;
  border: 0;
}
.js .widget .menu li a {
  width: 100%;
  display: block;
  padding: .6em 0;
  border-top: 1px solid #3a3a3a;
}
.js .widget .menu ul {
  position: static;
  visibility: visible;
  opacity: 1;
}
.js .admin-bar #secondary {
  top: 32px;
}
@media screen and (max-width: 782px) {
  .js .admin-bar #secondary {
    top: 46px;
  }
}
/** ---:[ Without JavaScript ]:--- */
.no-js .widget {
  margin: 0 0 1.5em;
}
.no-js .widget-area-toggle {
  display: none;
}
.no-js #secondary {
  float: left;
  width: 33.3333333%;
}
@media all and (max-width: 960px) {
  .no-js #secondary {
    float: left;
    width: 41.6666667%;
  }
}
@media all and (max-width: 720px) {
  .no-js #secondary {
    float: none;
    width: 100%;
  }
}
/** -----------------------------------------------------:[ 10.0 - Content ]:---------- */
/** ---:[ Without JavaScript ]:--- */
.no-js #content {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
.no-js #content:before,
.no-js #content:after {
  content: " ";
  display: table;
  line-height: 0;
}
.no-js #content:after {
  clear: both;
}
.no-js #primary {
  float: left;
  width: 66.6666667%;
}
.no-js #main {
  margin-right: 3em;
}
@media only screen and (max-width: 1200px) {
  .no-js #content {
    padding-left: 3em;
    padding-right: 3em;
  }
}
@media all and (max-width: 960px) {
  .no-js #primary {
    float: left;
    width: 58.3333333%;
  }
}
@media all and (max-width: 720px) {
  .no-js #primary {
    float: none;
    width: 100%;
  }
  .no-js #main {
    margin-left: auto;
    margin-right: auto;
  }
}
/** ----------------------------------------:[ 10.1 - Posts and pages ]:--- */
.hentry {
  padding-top: 3em;
  padding-bottom: 3em;
  border-bottom: 1px solid #f6f6f6;
}
.hentry img {
  border-radius: 2px;
}
.entry-title {
  margin-top: 0.6666666666666666em;
  margin-bottom: 0.6666666666666666em;
  font-size: 3em;
  line-height: 1.2;
  margin-top: 0;
  word-wrap: break-word;
  -webkit-hyphens: manual;
  -moz-hyphens: manual;
  -ms-hyphens: manual;
  -o-hyphens: manual;
  hyphens: manual;
}
@media screen and (max-width: 760px) {
  .entry-title {
    margin-top: 0.5925925925925926em;
    margin-bottom: 0.5925925925925926em;
    font-size: 2.25em;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
  }
}
.entry-title a {
  color: #2d2d2d;
}
.entry-title a:hover {
  color: #f2777a;
}
.entry-meta i {
  margin-right: .4em;
}
.entry-meta-time {
  color: #adadad;
  margin-bottom: 3em;
}
.entry-meta-time a {
  color: #adadad;
}
.entry-meta-categories {
  color: #606060;
  text-transform: uppercase;
  font-weight: bold;
}
.entry-meta-tags a {
  display: inline-block;
  margin-right: .3em;
  margin-bottom: .5em;
  padding: 0 .5em;
  background: #ececec;
  color: #868686;
  -webkit-transition: background 200ms linear, color 200ms linear;
  -moz-transition: background 200ms linear, color 200ms linear;
  -o-transition: background 200ms linear, color 200ms linear;
  transition: background 200ms linear, color 200ms linear;
}
.entry-meta-tags a:hover {
  background: #f2777a;
  color: #FFF;
}
.entry-image {
  margin-bottom: 2em;
}
.entry-image img {
  margin: 0 auto;
  display: block;
}
.entry-footer {
  margin-top: 2em;
}
/** ---:[ Single ]:--- */
/** ---:[ Pages ]:--- */
/** ---:[ Sticky Posts ]:--- */
/** ---:[ With JavaScript ]:--- */
.js .hentry > [class^="entry-"] {
  /*
				NOTE Perhaps we will define this with actual classes.
			*/
  width: 100%;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
.js .hentry .entry-image,
.js .hentry .entry-video {
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.js .blog .entry-summary p:last-child,
.js .archive .entry-summary p:last-child,
.js .search .entry-summary p:last-child {
  margin-bottom: 0;
}
.js .blog .sticky,
.js .archive .sticky,
.js .search .sticky {
  background-color: #2d2d2d;
  color: #FFF;
}
.js .blog .sticky .entry-title a,
.js .archive .sticky .entry-title a,
.js .search .sticky .entry-title a {
  color: #FFF;
}
.js .blog .sticky .entry-title a:hover,
.js .archive .sticky .entry-title a:hover,
.js .search .sticky .entry-title a:hover {
  color: #f2777a;
}
.js .blog .sticky .entry-summary a,
.js .archive .sticky .entry-summary a,
.js .search .sticky .entry-summary a {
  color: #FFF;
  border-bottom: 1px solid #FFF;
  -webkit-transition: border-color 200ms linear;
  -moz-transition: border-color 200ms linear;
  -o-transition: border-color 200ms linear;
  transition: border-color 200ms linear;
}
.js .blog .sticky .entry-summary a:hover,
.js .archive .sticky .entry-summary a:hover,
.js .search .sticky .entry-summary a:hover {
  border-color: transparent;
}
.js .page-header {
  padding-top: 3em;
  padding-bottom: 3em;
  background: #515151;
  color: #FFF;
  text-align: center;
}
.js .page-title {
  margin: 0;
}
.js .page-description {
  margin-top: 1em;
  width: 100%;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.js .page-content {
  padding-top: 3em;
  padding-bottom: 3em;
  text-align: center;
}
@media screen and (max-width: 760px) {
  .js .hentry {
    padding: 3em;
  }
}
/** ---:[ Without JavaScript ]:--- */
.no-js .hentry {
  padding-top: 4.5em;
  padding-bottom: 4.5em;
  border-bottom: 1px solid #f6f6f6;
}
.no-js .sticky {
  border-left: 5px solid #f2777a;
}
/** ----------------------------------------:[ 10.2 - Post Formats ]:--- */
/** ---:[ With JavaScript ]:--- */
.js .blog .format-image.has-post-thumbnail,
.js .archive .format-image.has-post-thumbnail,
.js .search .format-image.has-post-thumbnail {
  color: #FFF;
}
.js .blog .format-image.has-post-thumbnail a,
.js .archive .format-image.has-post-thumbnail a,
.js .search .format-image.has-post-thumbnail a {
  color: #FFF;
}
.js .blog .format-image.has-post-thumbnail .entry-title,
.js .archive .format-image.has-post-thumbnail .entry-title,
.js .search .format-image.has-post-thumbnail .entry-title {
  font-size: 1.5em;
  line-height: 2;
}
.js .blog .format-image.has-post-thumbnail .entry-title a,
.js .archive .format-image.has-post-thumbnail .entry-title a,
.js .search .format-image.has-post-thumbnail .entry-title a {
  padding: .5em;
  background: #ececec;
  border-radius: 2px;
  color: #2d2d2d;
}
.js .blog .format-image.has-post-thumbnail .entry-summary p,
.js .archive .format-image.has-post-thumbnail .entry-summary p,
.js .search .format-image.has-post-thumbnail .entry-summary p {
  display: inline-block;
  padding: .75em;
  background: #ececec;
  border-radius: 2px;
  color: #2d2d2d;
}
.js .blog .format-video .entry-title,
.js .archive .format-video .entry-title,
.js .search .format-video .entry-title {
  font-size: 1.5em;
}
.js .blog .format-video .entry-video,
.js .archive .format-video .entry-video,
.js .search .format-video .entry-video {
  margin-bottom: 1em;
}
.js .blog .format-audio .entry-title,
.js .archive .format-audio .entry-title,
.js .search .format-audio .entry-title {
  font-size: 1.5em;
}
.js .blog .format-audio .entry-audio,
.js .archive .format-audio .entry-audio,
.js .search .format-audio .entry-audio {
  margin-bottom: 1em;
}
.js .blog .format-status > [class^="entry-"],
.js .archive .format-status > [class^="entry-"],
.js .search .format-status > [class^="entry-"] {
  width: 100%;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}
.js .blog .format-status .entry-title,
.js .archive .format-status .entry-title,
.js .search .format-status .entry-title {
  font-size: 1.5em;
}
.js .blog .format-status .entry-summary,
.js .archive .format-status .entry-summary,
.js .search .format-status .entry-summary {
  font-size: 30px;
  font-size: 1.6666666666666667rem;
}
.js .blog .format-status .entry-meta,
.js .archive .format-status .entry-meta,
.js .search .format-status .entry-meta {
  margin-bottom: 0;
  margin-top: 1.5em;
}
.js .blog .format-aside > [class^="entry-"],
.js .archive .format-aside > [class^="entry-"],
.js .search .format-aside > [class^="entry-"] {
  width: 100%;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}
.js .blog .format-aside .entry-title,
.js .archive .format-aside .entry-title,
.js .search .format-aside .entry-title {
  font-size: 1.5em;
}
.js .blog .format-aside .entry-meta-categories,
.js .archive .format-aside .entry-meta-categories,
.js .search .format-aside .entry-meta-categories {
  margin-bottom: 1em;
}
.js .blog .format-aside .entry-meta-categories a,
.js .archive .format-aside .entry-meta-categories a,
.js .search .format-aside .entry-meta-categories a {
  border-bottom: 1px solid #FFF;
  -webkit-transition: all 100ms linear;
  -moz-transition: all 100ms linear;
  -o-transition: all 100ms linear;
  transition: all 100ms linear;
}
.js .blog .format-aside .entry-meta-categories a:hover,
.js .archive .format-aside .entry-meta-categories a:hover,
.js .search .format-aside .entry-meta-categories a:hover {
  background: #b366b3;
  border-bottom-color: transparent;
}
.js .blog .format-aside .entry-meta-tags a,
.js .archive .format-aside .entry-meta-tags a,
.js .search .format-aside .entry-meta-tags a {
  background-color: #c388c3;
  -webkit-transition: background-color 100ms linear;
  -moz-transition: background-color 100ms linear;
  -o-transition: background-color 100ms linear;
  transition: background-color 100ms linear;
}
.js .blog .format-aside .entry-meta-tags a:hover,
.js .archive .format-aside .entry-meta-tags a:hover,
.js .search .format-aside .entry-meta-tags a:hover {
  background-color: #b366b3;
}
.js .blog .format-link > [class^="entry-"],
.js .archive .format-link > [class^="entry-"],
.js .search .format-link > [class^="entry-"] {
  width: 100%;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}
.js .blog .format-link .entry-title,
.js .archive .format-link .entry-title,
.js .search .format-link .entry-title {
  font-size: 1.5em;
}
.js .blog .format-link .entry-meta,
.js .archive .format-link .entry-meta,
.js .search .format-link .entry-meta {
  margin-bottom: 1em;
}
.js .single .format-audio .entry-meta-time,
.js .single .format-video .entry-meta-time {
  margin-bottom: 0;
}
.js .single .format-status > [class^="entry-"] {
  width: 100%;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}
.js .single .format-status .entry-title {
  font-size: 1.5em;
}
.js .single .format-status .entry-summary {
  font-size: 30px;
  font-size: 1.6666666666666667rem;
}
.js .single .format-status .entry-meta {
  margin-bottom: 0;
  margin-top: 1.5em;
  color: #FFF;
}
.js .single .format-aside > [class^="entry-"] {
  width: 100%;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}
.js .single .format-aside .entry-title {
  font-size: 1.5em;
}
.js .single .format-aside .entry-meta-categories {
  margin-bottom: 1em;
}
.js .single .format-link > [class^="entry-"] {
  width: 100%;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}
.js .single .format-link .entry-title {
  font-size: 1.5em;
}
.js .single .format-link .entry-meta {
  margin-bottom: 1em;
}
/** ----------------------------------------:[ 10.3 - Comments ]:--- */
.discussion {
  padding-top: 3em;
  padding-bottom: 3em;
  border-top: 1px solid #f6f6f6;
}
.discussion .comments-header {
  width: 100%;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
}
.discussion .avatar {
  max-width: 65px;
  position: absolute;
  margin: 0;
  border-radius: 3px;
}
.discussion .comment-wrap {
  margin-left: 85px;
  margin-bottom: 1.5em;
}
.discussion .no-comments {
  width: 100%;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 760px) {
  .discussion {
    padding: 3em;
  }
  .discussion .avatar {
    max-width: 35px;
  }
  .discussion .comment-wrap {
    margin-left: 55px;
  }
}
#comments {
  width: 100%;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 3em;
}
#comments li.odd,
#comments li.even {
  clear: both;
}
#comments li.odd:before,
#comments li.even:before,
#comments li.odd:after,
#comments li.even:after {
  content: " ";
  display: table;
  line-height: 0;
}
#comments li.odd:after,
#comments li.even:after {
  clear: both;
}
#comments img {
  border-radius: 2px;
}
#comments .children {
  margin: 0;
  margin-left: 85px;
}
@media screen and (max-width: 800px) {
  #comments .children {
    margin-left: 55px;
  }
}
#comments .comment {
  display: block;
}
#comments .comment-list {
  margin: 0;
  list-style: none;
}
#comments .comment-top {
  font-size: .8em;
}
#comments .comment-time {
  color: #b9b9b9;
}
#comments .comment-body {
  margin: .5em 0;
}
#comments .comment-body > *:last-child {
  margin-bottom: 0;
}
#comments .comment.even {
  background: #FFF;
}
#comments .comment.depth-1:before {
  content: ' ';
  background-color: #ececec;
  border: 0;
  height: 3px;
  width: 80%;
  margin: 4.5em auto;
}
#comments .comment #respond {
  padding: 0;
}
#comments .comment #respond .cancel-comment a:hover {
  border-color: #f2777a;
  color: #f2777a;
}
#comments .pingback {
  margin: 1em 0;
}
#comments .comment-reply-link,
#comments .cancel-comment a {
  color: #d3d3d3;
  font-size: .8em;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear;
}
#comments .comment-reply-link:hover,
#comments .cancel-comment a:hover {
  color: #6699cc;
}
#comments .comment-respond + .reply {
  display: none;
}
#comments .bypostauthor {
  padding-right: 1em;
  border-right: 3px solid #f2777a;
}
#respond {
  position: relative;
  width: 100%;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
#respond p {
  position: relative;
}
#respond .column-wrapper {
  margin-bottom: 10px;
}
#respond .column-wrapper p {
  margin-bottom: 0;
}
#respond .required {
  position: absolute;
  top: 12px;
  right: 12px;
  color: #f2777a;
  font-size: 1.5em;
}
#respond #reply-title {
  position: absolute;
  z-index: 100000;
  top: -2em;
  right: 1em;
  margin: 0;
  font-size: 1em;
  line-hight: 0;
}
#respond #reply-title a {
  color: #ececec;
}
#respond #reply-title a:hover {
  color: #f2777a;
}
#respond #comment {
  height: 75px;
  -webkit-transition: height 0.2s linear;
  -moz-transition: height 0.2s linear;
  -o-transition: height 0.2s linear;
  transition: height 0.2s linear;
}
#respond #comment:focus {
  height: 150px;
}
#respond .commenter-avatar {
  position: absolute;
  max-width: 65px;
}
#respond .commenter-avatar + .comment-form-comment {
  margin-left: 85px;
}
@media screen and (max-width: 760px) {
  #respond .commenter-avatar + .comment-form-comment {
    margin-left: 55px;
  }
}
#respond .comment-form {
  margin-top: 3em;
}
#respond .comment-form:before,
#respond .comment-form:after {
  content: " ";
  display: table;
  line-height: 0;
}
#respond .comment-form:after {
  clear: both;
}
#respond .comment-form p label {
  display: block;
  font-weight: bold;
}
#respond .comment-form-author {
  float: left;
  width: 33.3333333%;
  padding-right: 1em;
}
#respond .comment-form-email {
  float: left;
  width: 33.3333333%;
  padding-right: 0.5em;
  padding-left: 0.5em;
}
#respond .comment-form-email .required {
  right: 3px;
}
#respond .comment-form-url {
  float: left;
  width: 33.3333333%;
  padding-left: 1em;
}
#respond .comment-form-comment {
  clear: left;
}
#respond .comment-submit-wrapper {
  margin: 0;
  text-align: right;
}
#respond .user-login p {
  position: relative;
}
#respond .form-submit {
  float: right;
  margin-bottom: 0;
}
#respond .form-submit input {
  cursor: pointer;
  display: inline-block;
  padding: 1em;
  background: #f2777a;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  color: #FFF;
  font-family: 'Varela Round', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  -webkit-transition: box-shadow 100ms linear, border-color 100ms linear;
  -moz-transition: box-shadow 100ms linear, border-color 100ms linear;
  -o-transition: box-shadow 100ms linear, border-color 100ms linear;
  transition: box-shadow 100ms linear, border-color 100ms linear;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}
#respond .form-submit input:hover,
#respond .form-submit input:focus,
#respond .form-submit input:active {
  background: #f2777a;
  box-shadow: 0 0 0 3px #f2777a;
  color: #FFF;
}
#respond .form-submit input-full {
  width: 100%;
  text-align: center;
}
#respond .form-submit input-disabled {
  background: #b9b9b9;
}
#respond .form-submit input-disabled:hover,
#respond .form-submit input-disabled:focus,
#respond .form-submit input-disabled:active {
  background: #b9b9b9;
  box-shadow: 0 0 0 3px #b9b9b9;
}
#respond .form-submit input-secondary {
  background: #99cc99;
}
#respond .form-submit input-secondary:hover,
#respond .form-submit input-secondary:focus,
#respond .form-submit input-secondary:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
#respond .form-submit input-blue {
  background: #6699cc;
}
#respond .form-submit input-blue:hover,
#respond .form-submit input-blue:focus,
#respond .form-submit input-blue:active {
  background: #6699cc;
  box-shadow: 0 0 0 3px #6699cc;
}
#respond .form-submit input-green {
  background: #99cc99;
}
#respond .form-submit input-green:hover,
#respond .form-submit input-green:focus,
#respond .form-submit input-green:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
#disqus_thread {
  width: 100%;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 3em;
  margin-bottom: 3em;
}
@media screen and (max-width: 760px) {
  #disqus_thread {
    padding-left: 3em;
    padding-right: 3em;
  }
}
/** ----------------------------------------:[ Jetpack Portfolio ]:--- */
#portfolio-wrapper:before,
#portfolio-wrapper:after {
  content: " ";
  display: table;
  line-height: 0;
}
#portfolio-wrapper:after {
  clear: both;
}
#portfolio-wrapper .jetpack-portfolio {
  padding: 0;
  border-bottom: 0;
}
#portfolio-wrapper .jetpack-portfolio img {
  border-radius: 0;
  display: block;
}
#portfolio-wrapper .jetpack-portfolio .project-details {
  position: relative;
  width: 100%;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  background: #2d2d2d;
}
#portfolio-wrapper .jetpack-portfolio .project-details:hover .project-image {
  opacity: 1;
}
#portfolio-wrapper .jetpack-portfolio .project-image {
  opacity: .2;
  -webkit-transition: opacity 200ms linear;
  -moz-transition: opacity 200ms linear;
  -o-transition: opacity 200ms linear;
  transition: opacity 200ms linear;
}
#portfolio-wrapper .jetpack-portfolio .project-entry-meta {
  font-size: .75em;
  color: #b9b9b9;
}
#portfolio-wrapper .jetpack-portfolio .project-entry-meta a {
  color: #b9b9b9;
}
#portfolio-wrapper .jetpack-portfolio .project-entry-meta a:hover {
  color: #FFF;
}
#portfolio-wrapper .jetpack-portfolio .project-title {
  font-size: 1.8em;
  margin-top: 20%;
  margin-bottom: .5em;
}
#portfolio-wrapper .jetpack-portfolio .project-title a {
  color: #FFF;
}
#portfolio-wrapper .jetpack-portfolio .project-title a:hover {
  border-bottom: 1px solid #FFF;
}
#portfolio-wrapper .jetpack-portfolio .project-summary {
  position: absolute;
  top: 1em;
  left: 1em;
  right: 1em;
  text-align: center;
}
@media screen and (min-width: 500px) and (max-width: 1000px) {
  #portfolio-wrapper .jetpack-portfolio {
    float: left;
    width: 50%;
  }
  #portfolio-wrapper .jetpack-portfolio:nth-child( 2n+1 ) {
    clear: left;
  }
}
@media screen and (min-width: 1000px) and (max-width: 1500px) {
  #portfolio-wrapper .jetpack-portfolio {
    float: left;
    width: 33.3333333%;
  }
  #portfolio-wrapper .jetpack-portfolio:nth-child( 3n+1 ) {
    clear: left;
  }
}
@media screen and (min-width: 1500px) and (max-width: 2000px) {
  #portfolio-wrapper .jetpack-portfolio {
    float: left;
    width: 25%;
  }
  #portfolio-wrapper .jetpack-portfolio:nth-child( 4n+1 ) {
    clear: left;
  }
}
@media screen and (min-width: 2000px) {
  #portfolio-wrapper .jetpack-portfolio {
    float: left;
    width: 16.6666667%;
  }
  #portfolio-wrapper .jetpack-portfolio:nth-child( 6n+1 ) {
    clear: left;
  }
}
.page-template-portfolio-php .entry-content > *:last-child {
  margin-bottom: 0;
}
.page-template-portfolio-php .paging-navigation {
  text-align: center;
}
/*--------------------------------------------------------------
11.0 Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .paging-navigation,
.infinite-scroll.neverending .site-footer {
  display: none;
}
/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */
.infinity-end.neverending .site-footer {
  display: block;
}
/** -----------------------------------------------------:[ 12.0 - Media ]:---------- */
.page-content img.wp-smiley,
.entry-content img.wp-smiley,
.comment-content img.wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}
.wp-caption {
  padding: .5em;
  margin-bottom: 1.5em;
  max-width: 100%;
  background: #fefefe;
  border: 1px solid #ececec;
  border-radius: 2px;
}
.wp-caption img[class*="wp-image-"] {
  display: block;
  margin: 0 auto .5em;
  max-width: 100%;
}
.wp-caption-text {
  text-align: center;
}
.wp-caption .wp-caption-text {
  font-size: .8em;
  margin: 0;
}
/** ---:[ Gallery ]:--- */
.gallery:before,
.gallery:after {
  content: " ";
  display: table;
  line-height: 0;
}
.gallery:after {
  clear: both;
}
.gallery-columns-2 .gallery-item {
  float: left;
  width: 50%;
}
.gallery-columns-2 .gallery-item:nth-child( 2n+1 ) {
  clear: both;
}
.gallery-columns-3 .gallery-item {
  float: left;
  width: 33.3333333%;
}
.gallery-columns-3 .gallery-item:nth-child( 3n+1 ) {
  clear: both;
}
.gallery-columns-4 .gallery-item {
  float: left;
  width: 25%;
}
.gallery-columns-4 .gallery-item:nth-child( 4n+1 ) {
  clear: both;
}
.gallery-columns-5 .gallery-item {
  float: left;
  width: 20%;
}
.gallery-columns-5 .gallery-item:nth-child( 5n+1 ) {
  clear: both;
}
.gallery-columns-6 .gallery-item {
  float: left;
  width: 16.6666667%;
}
.gallery-columns-6 .gallery-item:nth-child( 6n+1 ) {
  clear: both;
}
.gallery-columns-7 .gallery-item {
  float: left;
  width: 14.1666667%;
}
.gallery-columns-7 .gallery-item:nth-child( 7n+1 ) {
  clear: both;
}
.gallery-columns-8 .gallery-item {
  float: left;
  width: 12.5%;
}
.gallery-columns-8 .gallery-item:nth-child( 8n+1 ) {
  clear: both;
}
.gallery-columns-9 .gallery-item {
  float: left;
  width: 11.0833333%;
}
.gallery-columns-9 .gallery-item:nth-child( 9n+1 ) {
  clear: both;
}
.gallery-item {
  margin-bottom: 3em;
  text-align: center;
}
.gallery-caption {
  font-size: .8em;
}
.gallery-icon,
.gallery-caption {
  margin-left: 1em;
  margin-right: 1em;
}
/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
  max-width: 100%;
}
/** -----------------------------------------------------:[ 13.0 - Sturcture ]:---------- */
#page {
  background: #FFF;
}
/** ---:[ With JavaScript ]:--- */
/** -----------------------------------------------------:[ 14.0 - Header ]:---------- */
.site-header.skrollable {
  height: 0;
}
.site-branding {
  clear: both;
  padding: 10em 0;
  text-align: center;
}
.site-title,
.site-description {
  font-family: 'Righteous', cursive;
  color: white;
  margin: 0;
  word-wrap: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -o-hyphens: auto;
  hyphens: auto;
}
.site-title {
  font-size: 160px;
  font-size: 8.88888888888889rem;
  line-height: 1.1;
}
.site-title a {
  color: white;
}
.site-description {
  margin-top: 1.5em;
}
@media screen and (max-width: 1000px) {
  .site-branding {
    clear: both;
    padding: 5em 0;
    text-align: center;
  }
  .site-title {
    font-size: 80px;
    font-size: 4.444444444444445rem;
  }
}
/** ----------------------------------------:[ 14.1 - Site Toggles ]:--- */
.site-toggles .main-navigation-toggle,
.site-toggles .widget-area-toggle {
  position: fixed;
  top: 46px;
  left: 32px;
  z-index: 999;
  font-size: 40px;
  font-size: 2.2222222222222223rem;
  line-height: 1;
  color: #474747;
  padding: 5px 10px;
  background: #FFF;
  border-radius: 2px;
  -webkit-transition: color 100ms linear;
  -moz-transition: color 100ms linear;
  -o-transition: color 100ms linear;
  transition: color 100ms linear;
}
.site-toggles .main-navigation-toggle:hover,
.site-toggles .widget-area-toggle:hover {
  color: #2d2d2d;
}
.site-toggles .widget-area-toggle {
  left: auto;
  right: 32px;
}
.site-toggles .toggle-title {
  left: 5px;
  bottom: -30px;
  position: absolute;
  padding: .5em;
  opacity: 0;
  background: #2d2d2d;
  background: rgba(45, 45, 45, 0.8);
  border-radius: 2px;
  font-size: 12px;
  font-size: 0.6666666666666666rem;
  text-transform: uppercase;
  -webkit-transition: opacity 200ms linear;
  -moz-transition: opacity 200ms linear;
  -o-transition: opacity 200ms linear;
  transition: opacity 200ms linear;
}
.admin-bar .site-toggles .main-navigation-toggle,
.admin-bar .site-toggles .widget-area-toggle {
  top: 64px;
}
@media screen and (max-width: 1000px) {
  .site-toggles {
    background: #2d2d2d;
  }
  .site-toggles:before,
  .site-toggles:after {
    content: " ";
    display: table;
    line-height: 0;
  }
  .site-toggles:after {
    clear: both;
  }
  .site-toggles .main-navigation-toggle,
  .site-toggles .widget-area-toggle {
    position: static;
    background: #2d2d2d;
    color: #FFF;
  }
  .site-toggles .main-navigation-toggle:hover,
  .site-toggles .widget-area-toggle:hover {
    color: #FFF;
  }
  .site-toggles .main-navigation-toggle {
    float: left;
  }
  .site-toggles .widget-area-toggle {
    float: right;
  }
}
/** -----------------------------------------------------:[ 14.0 - Footer ]:---------- */
#colophon {
  padding-bottom: 6em;
  background: #2d2d2d;
  color: #7a7a7a;
}
/** ---:[ Site Supplementary ]:--- */
#site-supplementary {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 3em;
}
#site-supplementary:before,
#site-supplementary:after {
  content: " ";
  display: table;
  line-height: 0;
}
#site-supplementary:after {
  clear: both;
}
@media screen and (max-width: 1200px) {
  #site-supplementary {
    padding-left: 2em;
    padding-right: 2em;
  }
}
#site-supplementary .widget {
  margin-bottom: 3em;
}
@media screen and (min-width: 500px) and (max-width: 800px) {
  #site-supplementary .widget {
    float: left;
    width: 50%;
  }
  #site-supplementary .widget:nth-child( 2n+1 ) {
    clear: left;
    padding-right: 2em;
  }
  #site-supplementary .widget:nth-child( 2n+2 ) {
    padding-left: 2em;
  }
}
@media screen and (min-width: 800px) {
  #site-supplementary .widget {
    float: left;
    width: 33.3333333%;
  }
  #site-supplementary .widget:nth-child( 2n+1 ) {
    clear: none;
  }
  #site-supplementary .widget:nth-child( 3n+1 ) {
    clear: left;
    padding-right: 2em;
  }
  #site-supplementary .widget:nth-child( 3n+2 ) {
    padding-left: 1em;
    padding-right: 1em;
  }
  #site-supplementary .widget:nth-child( 3n+3 ) {
    padding-left: 2em;
  }
}
#site-supplementary .widget-title {
  margin-top: 0;
  margin-bottom: 1em;
  color: #FFF;
}
#site-supplementary .widget_recent_entries a,
#site-supplementary .widget_recent_comments a {
  color: #FFF;
}
#site-supplementary .widget_recent_entries a:hover,
#site-supplementary .widget_recent_comments a:hover {
  color: #7a7a7a;
}
/** ---:[ Site Info ]:--- */
.site-info {
  padding-top: 3em;
  border-top: 1px solid #3a3a3a;
  font-size: .8em;
  text-align: center;
  color: #535353;
}
.site-info a {
  color: #535353;
}
.site-info a:hover {
  color: #FFF;
}
/** -----------------------------------------------------:[ 16.0 - Jetpack ]:---------- */
/** ---:[ Carousel ]:--- */
#jp-carousel-comment-form-button-submit,
input#carousel-reblog-submit {
  cursor: pointer;
  display: inline-block;
  padding: 1em;
  background: #f2777a;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  color: #FFF;
  font-family: 'Varela Round', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  -webkit-transition: box-shadow 100ms linear, border-color 100ms linear;
  -moz-transition: box-shadow 100ms linear, border-color 100ms linear;
  -o-transition: box-shadow 100ms linear, border-color 100ms linear;
  transition: box-shadow 100ms linear, border-color 100ms linear;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}
#jp-carousel-comment-form-button-submit:hover,
input#carousel-reblog-submit:hover,
#jp-carousel-comment-form-button-submit:focus,
input#carousel-reblog-submit:focus,
#jp-carousel-comment-form-button-submit:active,
input#carousel-reblog-submit:active {
  background: #f2777a;
  box-shadow: 0 0 0 3px #f2777a;
  color: #FFF;
}
#jp-carousel-comment-form-button-submit-full,
input#carousel-reblog-submit-full {
  width: 100%;
  text-align: center;
}
#jp-carousel-comment-form-button-submit-disabled,
input#carousel-reblog-submit-disabled {
  background: #b9b9b9;
}
#jp-carousel-comment-form-button-submit-disabled:hover,
input#carousel-reblog-submit-disabled:hover,
#jp-carousel-comment-form-button-submit-disabled:focus,
input#carousel-reblog-submit-disabled:focus,
#jp-carousel-comment-form-button-submit-disabled:active,
input#carousel-reblog-submit-disabled:active {
  background: #b9b9b9;
  box-shadow: 0 0 0 3px #b9b9b9;
}
#jp-carousel-comment-form-button-submit-secondary,
input#carousel-reblog-submit-secondary {
  background: #99cc99;
}
#jp-carousel-comment-form-button-submit-secondary:hover,
input#carousel-reblog-submit-secondary:hover,
#jp-carousel-comment-form-button-submit-secondary:focus,
input#carousel-reblog-submit-secondary:focus,
#jp-carousel-comment-form-button-submit-secondary:active,
input#carousel-reblog-submit-secondary:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}
#jp-carousel-comment-form-button-submit-blue,
input#carousel-reblog-submit-blue {
  background: #6699cc;
}
#jp-carousel-comment-form-button-submit-blue:hover,
input#carousel-reblog-submit-blue:hover,
#jp-carousel-comment-form-button-submit-blue:focus,
input#carousel-reblog-submit-blue:focus,
#jp-carousel-comment-form-button-submit-blue:active,
input#carousel-reblog-submit-blue:active {
  background: #6699cc;
  box-shadow: 0 0 0 3px #6699cc;
}
#jp-carousel-comment-form-button-submit-green,
input#carousel-reblog-submit-green {
  background: #99cc99;
}
#jp-carousel-comment-form-button-submit-green:hover,
input#carousel-reblog-submit-green:hover,
#jp-carousel-comment-form-button-submit-green:focus,
input#carousel-reblog-submit-green:focus,
#jp-carousel-comment-form-button-submit-green:active,
input#carousel-reblog-submit-green:active {
  background: #99cc99;
  box-shadow: 0 0 0 3px #99cc99;
}