/*
* Theme Name: c16
* Version: 1.0
* Author: Kevin Schwarz
* Author URI: http://www.ksdesigning.com
* Theme URI: http://www.ksdesigning.com
* Description: A portfolio and blog WordPress theme
* License: GPL
* License URI: http://www.gnu.org/licenses/gpl.html
*/
/* Table of Contents
==================================================
#Reset & Basics
#Typography
#Header
#Mobile Nav
#Sub Menu
#Sections
#Page Recent Blog Posts
#Skills
#Services
#Portfolio
#Blog
#Comments
#Sidebar
#Team Members
#Buttons
#Footer
#Slider
#Lists
#Misc.
#Media Queries
#Grid
#Clearing
*/
/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  font-family: Montserrat, sans-serif;
  -ms-word-wrap: break-word;
  word-wrap: break-word;
}

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

iframe {
  border: 0 !important;
}

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

/* #Typography
================================================== */
a {
  text-decoration: none;
  -webkit-transition: color linear 0.2s;
  -moz-transition: color linear 0.2s;
  -o-transition: color linear 0.2s;
  transition: color linear 0.2s;
  color: #666;
}

p {
  font-family: "Open Sans";
  font-size: 14px;
  color: #878787;
  line-height: 2;
  margin-bottom: 24px;
}
p:last-child {
  margin-bottom: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Montserrat";
  font-weight: 700;
  color: #333;
  letter-spacing: 4px;
}

h1 {
  font-size: 46px;
  margin-bottom: 25px;
}

h1.title {
  font-size: 40px;
  letter-spacing: 6px;
  text-transform: uppercase;
}
h1.title:first-letter {
  color: #ebbb14;
}

h2 {
  font-size: 34px;
  margin-bottom: 25px;
}

h2.title {
  font-size: 36px;
  letter-spacing: 6px;
  text-transform: uppercase;
}
h2.title:first-letter {
  color: #ebbb14;
  font-size: 50px;
}

h3 {
  font-size: 24px;
  margin-bottom: 25px;
}

h3.title {
  font-size: 18px;
  letter-spacing: 4px;
  text-transform: uppercase;
}
h3.title:first-letter {
  color: #ebbb14;
}

h4 {
  font-size: 20px;
  margin-bottom: 18px;
}

h4.title {
  font-size: 16px;
  letter-spacing: 4px;
  text-transform: uppercase;
}
h4.title:first-letter {
  color: #ebbb14;
}

h5 {
  font-size: 16px;
  margin-bottom: 15px;
}

h5.title {
  font-size: 15px;
  letter-spacing: 4px;
  text-transform: uppercase;
}
h5.title:first-letter {
  color: #ebbb14;
}

h6 {
  font-size: 14px;
  margin-bottom: 14px;
}

h6.title {
  letter-spacing: 4px;
  text-transform: uppercase;
}
h6.title:first-letter {
  color: #ebbb14;
}

.section h1, .section h2, .section h3, .section h4, .section h5, .section h6 {
  color: #fff;
}

.dropcap1 {
  float: left;
  font-size: 59px;
  color: #222;
  margin-right: 14px;
  padding-bottom: 11px;
  line-height: .8;
  position: relative;
  top: 9px;
  border-bottom: 4px solid #ebbb14;
  text-transform: uppercase;
}

.dropcap2 {
  float: left;
  font-size: 59px;
  background: #222;
  color: #fff;
  margin-right: 14px;
  padding: 10px;
  line-height: .8;
  position: relative;
  top: 9px;
  text-transform: uppercase;
}

blockquote {
  margin-bottom: 20px;
  padding-right: 60px;
}
blockquote p {
  font-size: 20px;
  font-family: Montserrat;
  font-weight: bold;
  text-transform: uppercase;
  color: #222;
  border-right: 4px solid #ebbb14;
  padding-right: 10px;
}
blockquote p:before {
  font-family: 'IcoMoon';
  font-size: 15px;
  font-weight: 300;
  content: "\e076";
  background: #ebbb14;
  color: #fff;
  padding: 7px;
  margin-right: 10px;
}

.subtitle {
  display: block;
  text-align: center;
  color: #333;
  font-family: "Open Sans";
  font-weight: bold;
  font-size: 39px;
  text-transform: uppercase;
  letter-spacing: 4px;
  padding-bottom: 25px;
  margin-bottom: 50px;
  border-bottom: 1px solid #eee;
}

/* #Header
================================================== */
.home-style header .top-bar {
  position: absolute;
  width: 100%;
  background: none;
}

header .top-bar, header .top-bar-sticky {
  background: #000;
  z-index: 9998;
  position: relative;
}
header .top-bar .logo, header .top-bar-sticky .logo {
  float: left;
  height: 110px;
}
header .top-bar .logo a, header .top-bar-sticky .logo a {
  height: 110px;
  display: table-cell;
  vertical-align: middle;
  color: #fff;
}
header .top-bar .logo a img, header .top-bar-sticky .logo a img {
  max-height: 74px;
}
header .top-bar nav, header .top-bar-sticky nav {
  float: right;
}
header .top-bar nav .main-nav, header .top-bar-sticky nav .main-nav {
  float: right;
}
header .top-bar nav .main-nav > li, header .top-bar-sticky nav .main-nav > li {
  display: inline-block;
  position: relative;
}
header .top-bar nav .main-nav > li > a, header .top-bar-sticky nav .main-nav > li > a {
  color: #fff;
  display: block;
  font-size: 12px;
  font-family: "Open Sans";
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 46px 10px;
  padding-bottom: 47px;
  margin: 0 25px;
}
header .top-bar nav .main-nav > li > a:hover, header .top-bar-sticky nav .main-nav > li > a:hover {
  color: #666;
}
header .top-bar nav .main-nav > li.current-menu-item, header .top-bar-sticky nav .main-nav > li.current-menu-item {
  background: #111;
}
header .top-bar-sticky {
  position: fixed;
  top: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.7);
  transition: margin .8s;
  z-index: 9999;
  margin-top: -110px;
}
header .top-bar-sticky.sticky-on {
  transition: margin .8s;
  margin-top: 0;
}

.no-subheader-margin {
  height: 80px;
  width: 100%;
  display: block;
}

.sub-header {
  background: #111;
  padding: 30px 0;
  margin-bottom: 80px;
}
.sub-header.no-margin-header {
  margin-bottom: 0;
}
.sub-header .title {
  float: left;
}
.sub-header .title h1 {
  color: #fff;
  text-transform: uppercase;
  font-size: 23px;
  letter-spacing: 4px;
  margin-bottom: 4px;
}
.sub-header .title span.sub-title {
  font-size: 13px;
  font-family: "Open Sans";
  color: #fff;
  letter-spacing: 2px;
}

.admin-bar .top-bar-sticky {
  top: 32px;
}

/* #Mobile Nav
================================================== */
.mobile-nav-cont {
  display: none;
  background: #000;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
  padding: 10px;
  text-align: center;
}
.mobile-nav-cont i {
  color: #ebbb14;
  font-size: 24px;
  cursor: pointer;
}
.mobile-nav-cont .mobile-nav {
  padding: 20px 0;
  display: none;
}
.mobile-nav-cont .mobile-nav li a {
  color: #fff;
  text-transform: uppercase;
  font-family: "Open Sans";
  font-size: 12px;
  padding: 5px 0;
  display: block;
}
.mobile-nav-cont .mobile-nav li a:hover {
  color: #ebbb14;
}

/* #Sub Menu
================================================== */
.main-nav .sub-menu {
  display: none;
  position: absolute;
  top: 110px;
  left: 0;
  background: #ebbb14;
  text-align: center;
  z-index: 9999;
  padding: 0 10px;
  width: 200px;
}
.main-nav .sub-menu li a {
  color: #fff;
  font-size: 10px;
  font-family: "Open Sans";
  text-transform: uppercase;
  letter-spacing: 2px;
  padding: 15px 0;
  width: 100%;
  display: block;
}
.main-nav .sub-menu li a:hover {
  color: #333;
}

/* #Sections
================================================== */
.section h2.title {
  color: #fff;
  text-align: left;
  margin-bottom: 25px;
  text-transform: uppercase;
}
.section p {
  color: #fff;
  font-size: 16px;
  line-height: 2;
}

.parallax {
  background-attachment: fixed;
  background-position: top;
  background-size: cover;
  position: relative;
}
.parallax .container {
  padding: 70px 0;
}

/* #Page Recent Blog Posts
================================================== */
.page-recent-post {
  margin-bottom: 50px;
  text-align: center;
}
.page-recent-post h4 {
  padding-top: 40px;
  text-align: center;
  margin-bottom: 20px;
}
.page-recent-post h4 a {
  color: #333;
  font-size: 18px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.page-recent-post h4 a:hover {
  color: #ebbb14;
}
.page-recent-post p {
  line-height: 2;
  font-size: 14px;
  color: #666;
}
.page-recent-post .thumb {
  border-radius: 100%;
  overflow: hidden;
  position: relative;
}
.page-recent-post .thumb .mask {
  background: #111;
  position: absolute;
  padding-top: 40%;
  opacity: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.page-recent-post .thumb .mask span.date {
  display: block;
  color: #fff;
  letter-spacing: 4px;
  font-size: 14px;
  font-family: "Open Sans";
  text-transform: uppercase;
}
.page-recent-post .thumb .mask span.divider {
  display: block;
  height: 1px;
  width: 118px;
  margin: 15px auto;
  margin-bottom: 11px;
  background: #333;
}
.page-recent-post .thumb .mask span.comments a {
  color: #fff;
  font-size: 12px;
  font-family: "Open Sans";
}
.page-recent-post .thumb .mask span.comments a:hover {
  color: #ebbb14;
}
.page-recent-post .thumb .mask span.comments i {
  color: #ebbb14;
}

/* #Skills
================================================== */
/* Skills */
.skill {
  list-style: none;
}

li.skill {
  margin-bottom: 9px;
  height: 34px;
  background: #f8f8f8;
  position: relative;
}

li.skill em {
  position: relative;
  color: #fff;
  font-family: "Open Sans";
  font-size: 10px;
  text-transform: uppercase;
  top: 6px;
  left: 15px;
}

.expand {
  height: 34px;
  background: #ebbb14;
  position: absolute;
}

span.number {
  color: #fff;
  padding: 10px;
  font-size: 10px;
  font-family: "Open Sans";
  position: absolute;
  right: 10px;
  -moz-animation: number 2s ease-out;
  -webkit-animation: number 2s ease-out;
}

@-moz-keyframes number {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-webkit-keyframes number {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/* #Services
================================================== */
.service {
  text-align: center;
}
.service i {
  font-size: 120px;
  color: #ebbb14;
  margin-bottom: 30px;
  display: block;
  -webkit-transition: all ease 0.2s;
  -moz-transition: all ease 0.2s;
  -o-transition: all ease 0.2s;
  transition: all ease 0.2s;
}
.service i:hover {
  color: #222;
}
.service h4 {
  font-size: 26px;
  font-family: "Montserrat";
  font-weight: 700;
  color: #333;
  margin-bottom: 25px;
  text-transform: uppercase;
}
.service p {
  color: #444;
  font-size: 15px;
  line-height: 1.6;
  padding: 0 10px;
}

/* #Portfolio
================================================== */
.full-portfolio-container {
  width: 100%;
}

.port-item {
  width: 25%;
  float: left;
}
.port-item img {
  margin: auto;
}

.owl-item, .port-item {
  position: relative;
}
.owl-item .owl-mask, .owl-item .port-mask, .port-item .owl-mask, .port-item .port-mask {
  position: absolute;
  opacity: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #111;
  padding-top: 20%;
  text-align: center;
}
.owl-item .owl-mask a.title, .owl-item .port-mask a.title, .port-item .owl-mask a.title, .port-item .port-mask a.title {
  display: block;
  color: #fff;
  letter-spacing: 4px;
  font-size: 14px;
  font-family: "Open Sans";
  text-transform: uppercase;
}
.owl-item .owl-mask a.title:hover, .owl-item .port-mask a.title:hover, .port-item .owl-mask a.title:hover, .port-item .port-mask a.title:hover {
  color: #ebbb14;
}
.owl-item .owl-mask span.divider, .owl-item .port-mask span.divider, .port-item .owl-mask span.divider, .port-item .port-mask span.divider {
  display: block;
  height: 1px;
  width: 118px;
  margin: 15px auto;
  margin-bottom: 11px;
  background: #333;
}
.owl-item .owl-mask ul.cats, .owl-item .port-mask ul.cats, .port-item .owl-mask ul.cats, .port-item .port-mask ul.cats {
  margin-bottom: 45px;
}
.owl-item .owl-mask ul.cats li, .owl-item .port-mask ul.cats li, .port-item .owl-mask ul.cats li, .port-item .port-mask ul.cats li {
  display: inline-block;
}
.owl-item .owl-mask ul.cats li a, .owl-item .port-mask ul.cats li a, .port-item .owl-mask ul.cats li a, .port-item .port-mask ul.cats li a {
  color: #fff;
  font-size: 12px;
  font-family: "Open Sans";
  text-transform: lowercase;
}
.owl-item .owl-mask ul.cats li a:hover, .owl-item .port-mask ul.cats li a:hover, .port-item .owl-mask ul.cats li a:hover, .port-item .port-mask ul.cats li a:hover {
  color: #ebbb14;
}
.owl-item .owl-mask i, .owl-item .port-mask i, .port-item .owl-mask i, .port-item .port-mask i {
  font-size: 26px;
  color: #ebbb14;
}

/* #Blog
================================================== */
.standard-blog-wrapper .post, .grid-blog-wrapper .post, .single-blog-wrapper .post {
  margin-bottom: 100px;
}
.standard-blog-wrapper .post .divider, .grid-blog-wrapper .post .divider, .single-blog-wrapper .post .divider {
  height: 1px;
  background: #ddd;
  width: 100%;
  margin: 80px 0;
}
.standard-blog-wrapper .post h2.blog-title, .grid-blog-wrapper .post h2.blog-title, .single-blog-wrapper .post h2.blog-title {
  font-size: 29px;
  text-align: left;
  margin-bottom: 35px;
  letter-spacing: 0;
  text-transform: uppercase;
}
.standard-blog-wrapper .post h2.blog-title a, .grid-blog-wrapper .post h2.blog-title a, .single-blog-wrapper .post h2.blog-title a {
  color: #333;
}
.standard-blog-wrapper .post h2.blog-title a:hover, .grid-blog-wrapper .post h2.blog-title a:hover, .single-blog-wrapper .post h2.blog-title a:hover {
  color: #ebbb14;
}
.standard-blog-wrapper .post .video, .grid-blog-wrapper .post .video, .single-blog-wrapper .post .video {
  margin-bottom: 15px;
}
.standard-blog-wrapper .post .img-container, .grid-blog-wrapper .post .img-container, .single-blog-wrapper .post .img-container {
  margin-bottom: 15px;
  overflow: hidden;
}
.standard-blog-wrapper .post .img-container a, .grid-blog-wrapper .post .img-container a, .single-blog-wrapper .post .img-container a {
  display: block;
  position: relative;
}
.standard-blog-wrapper .post .img-container a .post-date, .grid-blog-wrapper .post .img-container a .post-date, .single-blog-wrapper .post .img-container a .post-date {
  position: absolute;
  top: 15px;
  left: 15px;
  background: #111;
  padding: 16px;
  border-radius: 100%;
  text-align: center;
}
.standard-blog-wrapper .post .img-container a .post-date span.month, .grid-blog-wrapper .post .img-container a .post-date span.month, .single-blog-wrapper .post .img-container a .post-date span.month {
  display: block;
  color: #fff;
  font-size: 23px;
  font-weight: bold;
  text-transform: uppercase;
}
.standard-blog-wrapper .post .img-container a .post-date span.day, .grid-blog-wrapper .post .img-container a .post-date span.day, .single-blog-wrapper .post .img-container a .post-date span.day {
  display: block;
  font-size: 16px;
  color: #ebbb14;
}
.standard-blog-wrapper .post .img-container a .post-date-no-image span, .grid-blog-wrapper .post .img-container a .post-date-no-image span, .single-blog-wrapper .post .img-container a .post-date-no-image span {
  color: #333 !important;
  font-family: "Open Sans";
  font-weight: bold;
  font-size: 12px;
}
.standard-blog-wrapper .post .img-container a img, .grid-blog-wrapper .post .img-container a img, .single-blog-wrapper .post .img-container a img {
  transition: all ease 1s;
}
.standard-blog-wrapper .post .img-container a:hover img, .grid-blog-wrapper .post .img-container a:hover img, .single-blog-wrapper .post .img-container a:hover img {
  transform: scale(1.1);
}
.standard-blog-wrapper .post .post-meta, .grid-blog-wrapper .post .post-meta, .single-blog-wrapper .post .post-meta {
  margin-bottom: 20px;
}
.standard-blog-wrapper .post .post-meta span.posted-by, .standard-blog-wrapper .post .post-meta span.author, .standard-blog-wrapper .post .post-meta span.author a, .standard-blog-wrapper .post .post-meta span.comments a, .standard-blog-wrapper .post .post-meta .post-cats a, .grid-blog-wrapper .post .post-meta span.posted-by, .grid-blog-wrapper .post .post-meta span.author, .grid-blog-wrapper .post .post-meta span.author a, .grid-blog-wrapper .post .post-meta span.comments a, .grid-blog-wrapper .post .post-meta .post-cats a, .single-blog-wrapper .post .post-meta span.posted-by, .single-blog-wrapper .post .post-meta span.author, .single-blog-wrapper .post .post-meta span.author a, .single-blog-wrapper .post .post-meta span.comments a, .single-blog-wrapper .post .post-meta .post-cats a {
  font-size: 12px;
  font-family: "Open Sans";
  color: #666;
}
.standard-blog-wrapper .post .post-meta span.posted-by, .grid-blog-wrapper .post .post-meta span.posted-by, .single-blog-wrapper .post .post-meta span.posted-by {
  padding-right: 2px;
}
.standard-blog-wrapper .post .post-meta span.author:after, .standard-blog-wrapper .post .post-meta span.comments:after, .grid-blog-wrapper .post .post-meta span.author:after, .grid-blog-wrapper .post .post-meta span.comments:after, .single-blog-wrapper .post .post-meta span.author:after, .single-blog-wrapper .post .post-meta span.comments:after {
  content: "/";
  font-size: 12px;
  font-family: "Open Sans";
  font-weight: bold;
  color: #666;
  padding-left: 6px;
  padding-right: 2px;
}
.standard-blog-wrapper .post .post-meta span.author a:hover, .standard-blog-wrapper .post .post-meta span.comments a:hover, .standard-blog-wrapper .post .post-meta .post-cats a:hover, .grid-blog-wrapper .post .post-meta span.author a:hover, .grid-blog-wrapper .post .post-meta span.comments a:hover, .grid-blog-wrapper .post .post-meta .post-cats a:hover, .single-blog-wrapper .post .post-meta span.author a:hover, .single-blog-wrapper .post .post-meta span.comments a:hover, .single-blog-wrapper .post .post-meta .post-cats a:hover {
  color: #ebbb14;
}
.standard-blog-wrapper .post .post-meta .post-cats, .grid-blog-wrapper .post .post-meta .post-cats, .single-blog-wrapper .post .post-meta .post-cats {
  display: inline-block;
  color: #666;
}

.grid-blog-wrapper .post {
  height: 522px;
}
.grid-blog-wrapper .post h2.blog-title {
  font-size: 20px;
  margin-bottom: 14px;
  text-transform: uppercase;
}
.grid-blog-wrapper .post .img-container a .post-date {
  padding: 16px;
}
.grid-blog-wrapper .post .img-container a .post-date span.month {
  font-size: 18px;
}
.grid-blog-wrapper .post .img-container a .post-date span.day {
  font-size: 12px;
}
.grid-blog-wrapper .post p {
  font-size: 12px;
}

.single-blog-wrapper .img-container {
  margin-bottom: 15px;
  overflow: hidden;
  position: relative;
}
.single-blog-wrapper .img-container .post-date {
  position: absolute;
  top: 15px;
  left: 15px;
  background: #111;
  padding: 16px;
  border-radius: 100%;
  text-align: center;
}
.single-blog-wrapper .img-container .post-date span.month {
  display: block;
  color: #fff;
  font-size: 23px;
  font-weight: bold;
  text-transform: uppercase;
}
.single-blog-wrapper .img-container .post-date span.day {
  display: block;
  font-size: 16px;
  color: #ebbb14;
}
.single-blog-wrapper .img-container img {
  transition: all ease 1s;
}
.single-blog-wrapper .img-container:hover img {
  transform: scale(1.1);
}

.posts-nav .divider {
  width: 360px;
  height: 1px;
  background: #ddd;
  margin-bottom: 34px;
}
.posts-nav ul {
  display: inline-block;
}
.posts-nav ul li {
  display: inline-block;
}
.posts-nav ul li span.current {
  display: block;
  background: #222;
  color: #ebbb14;
  padding: 6px 10px;
  font-size: 12px;
  font-family: "Open Sans";
}
.posts-nav a {
  font-size: 12px;
  color: #777;
  font-family: "Open Sans";
  padding: 0 10px;
  font-weight: bold;
}
.posts-nav a:hover {
  color: #ebbb14;
}

/* #Comments
================================================== */
.comment-section ul.comment-list {
  margin-top: 50px;
}
.comment-section ul.comment-list li.comment {
  margin-bottom: 50px;
}
.comment-section ul.comment-list li.comment .avatar-cont {
  float: left;
}
.comment-section ul.comment-list li.comment .comment-header {
  background: #111;
  padding: 12px 15px;
  margin-left: 84px;
  position: relative;
}
.comment-section ul.comment-list li.comment .comment-header cite {
  display: inline-block;
  color: #ebbb14;
  font-size: 14px;
  font-weight: bold;
  font-family: "Open Sans";
  letter-spacing: 4px;
}
.comment-section ul.comment-list li.comment .comment-header cite a {
  color: #ebbb14;
  font-size: 14px;
  font-weight: bold;
  font-family: "Open Sans";
  letter-spacing: 4px;
}
.comment-section ul.comment-list li.comment .comment-header .is-author {
  display: none;
  margin-left: 10px;
  background: #ebbb14;
  color: #fff;
  padding: 2px 4px;
  letter-spacing: 2px;
  font-family: "Open Sans";
  font-size: 10px;
  text-transform: uppercase;
  border-radius: 5px;
}
.comment-section ul.comment-list li.comment .comment-header .date-time {
  display: block;
  padding-top: 10px;
  color: #fff;
  font-family: "Open Sans";
  font-size: 12px;
  letter-spacing: 4px;
  text-transform: uppercase;
}
.comment-section ul.comment-list li.comment .comment-header .comment-reply-link {
  position: absolute;
  top: 14px;
  right: 15px;
  border-radius: 4px;
  border: 1px solid #ebbb14;
  display: inline-block;
  font-family: "Open Sans";
  font-size: 12px;
  letter-spacing: 2px;
  color: #fff;
  background: #ebbb14;
  text-transform: uppercase;
  padding: 11px 29px;
}
.comment-section ul.comment-list li.comment .comment-header .comment-reply-link:hover {
  background: #222;
  border-color: #222;
}
.comment-section ul.comment-list li.comment .content {
  background: #f7f7f7;
  margin-left: 84px;
  padding: 15px;
}
.comment-section ul.comment-list li.comment .content p {
  color: #666;
}
.comment-section ul.comment-list li.comment ul.children li.comment {
  margin-left: 40px;
  margin-top: 30px;
}
.comment-section ul.comment-list li.comment ul.children li.comment .comment-header {
  background: #313131;
}
.comment-section ul.comment-list li.comment.bypostauthor .is-author {
  display: inline-block;
}
.comment-section .divider {
  width: 100%;
  height: 1px;
  background: #ddd;
  margin: 80px 0;
}

.comment-form-cont h3.comment-reply-title {
  font-size: 18px;
  letter-spacing: 4px;
  text-transform: uppercase;
}
.comment-form-cont h3.comment-reply-title:first-letter {
  color: #ebbb14;
}
.comment-form-cont form p.comment-notes {
  font-size: 12px;
  color: #212121;
}
.comment-form-cont form ::-webkit-input-placeholder {
  color: #aaa;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "Open Sans";
  letter-spacing: 2px;
}
.comment-form-cont form ::-moz-placeholder {
  color: #aaa;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "Open Sans";
  letter-spacing: 2px;
}
.comment-form-cont form :-ms-input-placeholder {
  color: #aaa;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "Open Sans";
  letter-spacing: 2px;
}
.comment-form-cont form input, .comment-form-cont form textarea {
  border: none;
  padding: 14px;
  background: #111;
  width: 420px;
  transition: all ease .2s;
  color: #aaa;
}
.comment-form-cont form input:focus, .comment-form-cont form textarea:focus {
  background: #ddd;
  color: #222;
}
.comment-form-cont form textarea {
  width: 100%;
}
.comment-form-cont form #submit {
  border-radius: 4px;
  border: 1px solid #222;
  display: inline-block;
  font-family: "Open Sans";
  font-size: 12px;
  letter-spacing: 2px;
  color: #222;
  text-transform: uppercase;
  background: none;
  padding: 12px 55px;
  margin-bottom: 30px;
}
.comment-form-cont form #submit:hover {
  background: #222;
  border-color: #222;
  color: #fff;
}
.comment-form-cont form #submit:last-child {
  margin-bottom: 0;
}
.comment-form-cont form #submit.dark {
  border: 1px solid #222;
  background: #222;
  color: #fff;
}
.comment-form-cont form #submit.dark:hover {
  border-color: #666;
  background: #666;
}

.comment-navigation a {
  font-size: 12px;
  text-transform: uppercase;
  margin-right: 15px;
}

/* #Sidebar
================================================== */
aside.sidebar .widget {
  margin-bottom: 70px;
}
aside.sidebar .widget h4 {
  font-size: 18px;
  letter-spacing: 4px;
  margin-bottom: 25px;
  text-transform: uppercase;
}
aside.sidebar .widget h4:first-letter {
  color: #ebbb14;
}
aside.sidebar .widget p {
  font-size: 12px;
}
aside.sidebar .widget ul li {
  padding-bottom: 13px;
}
aside.sidebar .widget ul li:last-child {
  padding-bottom: 0;
}
aside.sidebar .widget ul li a {
  font-size: 12px;
  font-family: "Open Sans";
  color: #666;
  letter-spacing: 4px;
  text-transform: uppercase;
  transition: padding ease .2s;
}
aside.sidebar .widget ul li a:hover {
  color: #ebbb14;
  padding-left: 10px;
}
aside.sidebar .widget.widget_search form input {
  border: 1px solid #aaa;
  width: 100%;
  padding: 12px;
  display: block;
  color: #aaa;
  font-size: 10px;
  font-family: "Open Sans";
  letter-spacing: 2px;
}
aside.sidebar .widget.widget_search form ::-webkit-input-placeholder {
  color: #aaa;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "Open Sans";
  letter-spacing: 2px;
}
aside.sidebar .widget.widget_search form ::-moz-placeholder {
  color: #aaa;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "Open Sans";
  letter-spacing: 2px;
}
aside.sidebar .widget.widget_search form :-ms-input-placeholder {
  color: #aaa;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "Open Sans";
  letter-spacing: 2px;
}
aside.sidebar .widget .textwidget {
  font-size: 12px;
  font-family: "Open Sans";
  color: #878787;
  line-height: 2;
}
aside.sidebar .widget .tagcloud a {
  background: #222;
  color: #ddd;
  padding: 10px 15px;
  margin-bottom: 4px;
  font-size: 12px;
  font-family: "Open Sans";
  display: inline-block;
  transition: background ease .2s;
}
aside.sidebar .widget .tagcloud a:hover {
  background: #ebbb14;
}

/* #Team Members
================================================== */
.team-member .img-mask-container {
  position: relative;
}
.team-member .img-mask-container .mask {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #111111 url(images/dark_pat.png);
  padding: 20px;
}
.team-member .img-mask-container .mask p {
  font-size: 12px;
  font-family: "Open Sans";
  color: #ddd;
  line-height: 1.6;
}
.team-member .img-mask-container .mask ul.social li {
  display: inline-block;
}
.team-member .img-mask-container .mask ul.social li a {
  display: block;
}
.team-member .img-mask-container .mask ul.social li a i {
  color: #ebbb14;
  font-size: 23px;
  margin: 0 10px;
  transition: all ease .2s;
}
.team-member .img-mask-container .mask ul.social li a i:hover {
  color: #444;
}
.team-member .title {
  background: #111;
  padding: 15px;
}
.team-member .title span.name {
  color: #fff;
  font-family: "Open Sans";
  font-size: 14px;
  font-weight: bold;
}
.team-member .title span.position {
  color: #ebbb14;
  font-family: "Open Sans";
  font-size: 12px;
  text-transform: uppercase;
}

/* #Buttons
================================================== */
.button {
  border-radius: 4px;
  border: 1px solid #222;
  display: inline-block;
  font-family: "Open Sans";
  font-size: 12px;
  letter-spacing: 2px;
  color: #222;
  text-transform: uppercase;
  padding: 11px 29px;
  margin-bottom: 30px;
  transition: background linear .2s;
}
.button:hover {
  background: #222;
  border-color: #222;
  color: #fff;
}
.button:last-child {
  margin-bottom: 0;
}
.button.accent {
  border: 1px solid #ebbb14;
  background: #ebbb14;
  color: #fff;
}
.button.accent:hover {
  background: #222;
  border-color: #222;
}
.button.dark {
  border: 1px solid #222;
  background: #222;
  color: #fff;
}
.button.dark:hover {
  border-color: #666;
  background: #666;
}
.button.large {
  padding: 12px 55px;
}
.button.slider {
  position: absolute;
  z-index: 4;
  bottom: 100px;
  letter-spacing: 4px;
  right: 0;
  padding: 30px 100px;
  font-size: 20px;
}

/* #Footer
================================================== */
footer {
  margin-top: 100px;
}
footer .footer-divider {
  height: 1px;
  background: #ddd;
  width: 760px;
  margin: auto;
  margin-bottom: 60px;
}
footer .footer-logo {
  margin-bottom: 40px;
}
footer .footer-logo img {
  margin: auto;
  max-height: 74px;
}
footer ul.footer-social {
  text-align: center;
  margin-bottom: 40px;
}
footer ul.footer-social li {
  display: inline-block;
}
footer ul.footer-social li a {
  margin: 0 20px;
}
footer ul.footer-social li a i {
  color: #111;
  font-size: 23px;
  transition: all ease .2s;
}
footer ul.footer-social li a i:hover {
  color: #ebbb14;
}
footer span.copyright {
  display: block;
  margin-bottom: 50px;
  text-align: center;
  font-size: 11px;
  font-family: "Open Sans";
  letter-spacing: 4px;
  color: #111;
}

/* #Slider
================================================== */
#slides .slides-container {
  display: none;
}

#slides .slides-container li .content {
  position: relative;
  padding: 160px 0;
  z-index: 4;
}

#slides .slides-container li .content span.title {
  color: #fff;
  font-weight: 900;
  font-size: 86px;
  font-family: "Open Sans";
  text-transform: uppercase;
  position: relative;
  display: block;
  margin-bottom: 25px;
  line-height: 1.1;
}
#slides .slides-container li .content span.title:first-letter {
  color: #ebbb14;
}

#slides .slides-container li .content span.sub-title {
  color: #fff;
  font-size: 22px;
  font-family: "Open Sans";
  font-weight: 300;
  position: relative;
  display: inline-block;
  background: rgba(0, 0, 0, 0.5);
  max-width: 65%;
  padding: 20px;
  line-height: 1.6;
}

.slides-pagination a {
  background: #ebbb14;
  opacity: .3;
}

.slides-pagination a.current {
  background: #ebbb14;
  opacity: 1;
}

.slides-navigation a {
  border-radius: 100%;
  display: block;
  background: #ebbb14;
  text-decoration: none;
  color: #fff;
  font-size: 10px;
  margin: 0 25px;
  text-align: center;
  text-transform: uppercase;
  width: 40px;
  height: 40px;
  top: -40px;
  padding: 14px;
  opacity: .4;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.slides-navigation a:hover {
  opacity: 1;
}

@media screen and (max-width: 767px) {
  .slides-navigation {
    display: none;
  }
}
/* #Lists
================================================== */
.post ul, .post ol, .comment .content ul, .comment .content ol {
  padding-left: 25px;
  margin-bottom: 20px;
}
.post ul li, .post ol li, .comment .content ul li, .comment .content ol li {
  list-style: disc;
  font-size: 13px;
  color: #999;
  font-family: "Open Sans";
  line-height: 1.6;
  padding-bottom: 10px;
}
.post ul li:last-child, .post ol li:last-child, .comment .content ul li:last-child, .comment .content ol li:last-child {
  padding-bottom: 0;
}
.post ul li ul, .post ul li ol, .post ol li ul, .post ol li ol, .comment .content ul li ul, .comment .content ul li ol, .comment .content ol li ul, .comment .content ol li ol {
  padding-top: 10px;
  margin-bottom: 0;
}
.post ul.tags, .comment .content ul.tags {
  padding-left: 0;
  color: #999;
  font-size: 12px;
}
.post ul.tags li, .comment .content ul.tags li {
  list-style: none;
  display: inline;
}
.post ul.tags li a, .comment .content ul.tags li a {
  color: #999;
  font-size: 12px;
}
.post ul.tags li a:hover, .comment .content ul.tags li a:hover {
  color: #ebbb14;
}

dl {
  clear: both;
}

dt {
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 15px;
  color: #333;
}

dd {
  color: #666;
  font-size: 12px;
  font-family: 'Merriweather', serif;
  margin-bottom: 20px;
  line-height: 1.6;
}

/* #Misc.
================================================== */
.animate {
  opacity: 0;
}

abbr {
  cursor: help;
  color: #444;
  font-size: 12px;
}

address {
  font-size: 14px;
  font-family: 'Merriweather', serif;
  color: #666;
  margin-bottom: 20px;
  line-height: 1.5;
  letter-spacing: 1px;
}

em {
  font-style: italic;
}

strong {
  font-weight: bold;
  color: #333;
}

var {
  color: green;
}

code, kbd, pre {
  background: #eee;
  padding: 0 5px;
  margin: 0 2px;
  color: #666;
  font-family: Arial, sans-serif;
  font-size: 12px;
}

pre {
  padding: 20px;
  border: 2px solid #444;
  word-wrap: break-word;
  margin-bottom: 30px;
  display: inline-block;
}

kbd {
  background: #333;
  color: #ccc;
}

cite {
  font-size: 12px;
}

sub, sup {
  font-size: .6em;
}

table {
  border-collapse: separate;
  border-spacing: 2px;
  border-width: 1px 0 0 1px;
  margin-bottom: 24px;
  width: 100%;
}

table thead tr {
  background: #333 !important;
}

table thead th {
  color: #fff;
  font-family: "Open Sans";
  text-transform: uppercase;
}

table tr:nth-child(odd) {
  background: #f6f6f6;
}

table th, table td {
  font-weight: normal;
  text-align: left;
  padding: 10px;
}

table th {
  font-weight: bold;
}

table td {
  color: #666;
}

.alignright {
  text-align: right;
  float: right;
  margin-left: 15px;
}

.alignright .wp-caption-text {
  margin-bottom: 0;
}

.alignleft {
  text-align: left;
  float: left;
  margin-right: 15px;
}

.alignleft .wp-caption-text {
  margin-bottom: 0;
}

.aligncenter {
  text-align: center;
  margin: auto;
}

.aligncenter img {
  margin: auto;
}

.bypostauthor {
  margin: auto;
}

.wp-caption {
  max-width: 100% !important;
}

.wp-caption-text, .gallery-caption {
  color: #555;
  font-size: 10px;
  padding: 10px 0;
}

.gallery-item {
  width: 33% !important;
  clear: none;
  float: left;
}

.gallery-item .wp-caption-text {
  padding: 0 10px;
}

.gallery-item img {
  margin: auto;
}

.page-links span, .page-links a {
  font-family: "Open Sans";
}

.pingback {
  margin-bottom: 20px;
}

.wp-audio-shortcode {
  margin-bottom: 20px;
}

.slider-overlay, .pattern-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: url(images/overlay-pattern.png);
  z-index: 3;
}

.pattern-overlay {
  z-index: 0;
}

.sticky h2:before {
  font-family: 'IcoMoon';
  content: "\e041";
  color: #333;
  font-size: 24px;
  margin-right: 15px;
}

.wpcf7-form input, .wpcf7-form textarea {
  border: none;
  background: #eee;
  padding: 10px;
  width: 100%;
  -webkit-transition: all linear 0.2s;
  -moz-transition: all linear 0.2s;
  -o-transition: all linear 0.2s;
  transition: all linear 0.2s;
  color: #666;
}

.wpcf7-form input:focus, .wpcf7-form textarea:focus {
  background: #fafafa;
  outline: none;
  color: #333;
}

.wpcf7-form input.wpcf7-submit, .wpcf7-form textarea.wpcf7-submit {
  background: #222;
  color: #fff;
  padding: 20px;
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: bold;
  cursor: pointer;
}

.owl-theme .owl-controls .owl-buttons div {
  -webkit-transition: all linear 0.2s;
  -moz-transition: all linear 0.2s;
  -o-transition: all linear 0.2s;
  transition: all linear 0.2s;
}
.owl-theme .owl-controls .owl-buttons div:hover {
  color: #ebbb14;
}

.client-owl .owl-item img {
  margin: auto;
}

#tabs ul {
  border-bottom: 1px solid #ccc;
  margin-bottom: 15px;
}
#tabs ul li {
  list-style: none;
  display: inline;
}
#tabs ul li.ui-tabs-active a {
  color: #666;
}
#tabs ul li a {
  border-right: 1px solid #ccc;
  padding: 8px 25px;
  color: #aaa;
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  display: inline-block;
}
#tabs ul li a:focus {
  outline: none;
}
#tabs ul li:last-child a {
  border-right: none;
}
#tabs p {
  font-size: 13px;
}

.accordion h5, .toggle h5 {
  font-size: 14px;
  margin-bottom: 15px;
  cursor: pointer;
  text-transform: uppercase;
}
.accordion h5.ui-accordion-header-active, .toggle h5.ui-accordion-header-active {
  color: #ebbb14;
}
.accordion h5:focus, .toggle h5:focus {
  outline: none;
}
.accordion p, .toggle p {
  font-size: 13px;
}
.accordion p:last-child, .toggle p:last-child {
  margin-bottom: 20px;
}

.toggle .toggle-content {
  display: none;
}

.alert-box {
  padding: 30px;
  font-size: 16px;
  text-transform: uppercase;
  margin-bottom: 10px;
  position: relative;
}
.alert-box .alert {
  font-family: "Open Sans";
  letter-spacing: 4px;
}
.alert-box.dark {
  background: #222;
  color: #fff;
}
.alert-box.light {
  border: 1px solid #222;
}
.alert-box.accent {
  color: #fff;
  background: #ebbb14;
}
.alert-box i {
  cursor: pointer;
  position: absolute;
  right: 10px;
  top: 10px;
}

.testimonial ul.monial {
  text-align: center;
}
.testimonial ul.monial li {
  display: inline-block;
}
.testimonial ul.monial li img {
  border-radius: 100%;
  max-width: 120px;
  margin-right: 20px;
  margin-left: -10px;
}
.testimonial ul.monial li .name, .testimonial ul.monial li .title {
  display: block;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 16px;
  letter-spacing: 4px;
  color: #222;
}
.testimonial ul.monial li .title {
  font-size: 12px;
  color: #ebbb14;
  padding-top: 10px;
}
.testimonial ul.monial li.test-title {
  position: relative;
  top: -42px;
}
.testimonial .divider {
  height: 1px;
  background: #ddd;
  width: 70%;
  margin: 20px auto;
}
.testimonial i {
  text-align: center;
  font-size: 30px;
  color: #ccc;
  display: block;
  margin-bottom: 20px;
}
.testimonial .quote {
  color: #999;
  font-family: "Open Sans";
  font-size: 14px;
  font-weight: bold;
  line-height: 2;
  text-align: center;
}

.large-spacer {
  padding: 50px 0;
}

.spacer {
  padding: 40px 0;
}

.line-spacer {
  height: 1px;
  width: 100%;
  background: #ddd;
  margin-bottom: 50px;
}

.row {
  margin-bottom: 20px;
}

.bottom {
  padding-bottom: 50px;
}

/* #Media Queries
================================================== */
@media only screen and (min-width: 960px) and (max-width: 1199px) {
  body {
    padding-top: 47px;
  }

  header .top-bar, header .top-bar-sticky {
    display: none;
  }

  .mobile-nav-cont {
    display: block;
  }

  #slides .slides-container li .content span.title {
    font-size: 54px;
  }

  #slides .slides-container li .content {
    padding: 55px 82px;
  }

  #slides .slides-container li .content span.sub-title {
    font-size: 18px;
  }

  .button.slider {
    padding: 20px 61px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 960px) {
  body {
    padding-top: 47px;
  }

  header .top-bar, header .top-bar-sticky {
    display: none;
  }

  .mobile-nav-cont {
    display: block;
  }

  footer .footer-divider {
    width: 80%;
  }

  #slides .slides-container li .content span.title {
    font-size: 54px;
  }

  #slides .slides-container li .content {
    padding: 55px 82px;
  }

  #slides .slides-container li .content span.sub-title {
    font-size: 18px;
  }

  .button.slider {
    padding: 20px 61px;
    font-size: 12px;
  }

  .port-item {
    width: 50%;
  }
}
@media only screen and (max-width: 767px) {
  #slides .slides-container li .content {
    padding: 55px 10px;
  }

  #slides .slides-container li .content span.title {
    font-size: 26px;
  }

  #slides .slides-container li .content span.sub-title {
    font-size: 14px;
    max-width: 100%;
  }

  .button.slider {
    padding: 13px 44px;
    font-size: 12px;
  }

  .posts-nav .divider {
    width: 80%;
  }

  .posts-nav ul {
    margin-bottom: 20px;
  }

  .container .column, .container .columns {
    margin-bottom: 20px;
  }

  .container .column:last-child, .container .columns:last-child {
    margin-bottom: 0;
  }

  footer ul.footer-social {
    line-height: 3;
  }

  .port-item .port-mask {
    padding-top: 27px;
  }
}
@media only screen and (max-width: 479px) {
  .port-item {
    width: 100%;
  }

  .port-item .port-mask {
    padding-top: 20%;
  }
}
/*  #Mobile First Grid
================================================== */
.container {
  width: 92%;
  position: relative;
  margin-left: auto;
  margin-right: auto;
}

.container .columns,
.container .column {
  float: left;
  display: inline;
}

.row {
  margin-bottom: 4.166666666666667%;
}

.container .one.column,
.container .one.columns,
.container .two.columns,
.container .three.columns,
.container .four.columns,
.container .five.columns,
.container .six.columns,
.container .seven.columns,
.container .eight.columns,
.container .nine.columns,
.container .ten.columns,
.container .eleven.columns,
.container .twelve.columns,
.container .thirteen.columns,
.container .fourteen.columns,
.container .fifteen.columns,
.container .sixteen.columns,
.container .one-third.column,
.container .two-thirds.column {
  width: 100%;
}

/* #Tablet
================================================== */
@media (min-width: 48em) {
  .container {
    width: 100%;
  }

  .container .column,
  .container .columns {
    margin-left: 1.302083333333333%;
    margin-right: 1.302083333333333%;
  }

  .column.alpha, .columns.alpha {
    margin-left: 0;
  }

  .column.omega, .columns.omega {
    margin-right: 0;
  }

  .column.alpha.omega, .columns.alpha.omega {
    margin-left: 0;
    margin-right: 0;
  }

  .container .one.column,
  .container .one.columns {
    width: 3.645833333333333%;
  }

  .container .two.columns {
    width: 9.895833333333333%;
  }

  .container .three.columns {
    width: 16.14583333333333%;
  }

  .container .four.columns {
    width: 22.39583333333333%;
  }

  .container .five.columns {
    width: 28.64583333333333%;
  }

  .container .six.columns {
    width: 34.89583333333333%;
  }

  .container .seven.columns {
    width: 41.14583333333333%;
  }

  .container .eight.columns {
    width: 47.39583333333333%;
  }

  .container .nine.columns {
    width: 53.64583333333333%;
  }

  .container .ten.columns {
    width: 59.89583333333333%;
  }

  .container .eleven.columns {
    width: 66.14583333333333%;
  }

  .container .twelve.columns {
    width: 72.39583333333333%;
  }

  .container .thirteen.columns {
    width: 78.64583333333333%;
  }

  .container .fourteen.columns {
    width: 84.89583333333333%;
  }

  .container .fifteen.columns {
    width: 91.14583333333333%;
  }

  .container .sixteen.columns {
    width: 97.39583333333333%;
  }

  .container .one-third.column {
    width: 30.72916666666667%;
  }

  .container .two-thirds.column {
    width: 64.0625%;
  }

  /* Offsets ($column-width + $gutter) */
  .container .offset-by-one {
    padding-left: 4.94792%;
  }

  .container .offset-by-two {
    padding-left: 11.19792%;
  }

  .container .offset-by-three {
    padding-left: 17.44792%;
  }

  .container .offset-by-four {
    padding-left: 23.69792%;
  }

  .container .offset-by-five {
    padding-left: 29.94792%;
  }

  .container .offset-by-six {
    padding-left: 36.19792%;
  }

  .container .offset-by-seven {
    padding-left: 42.44792%;
  }

  .container .offset-by-eight {
    padding-left: 48.69792%;
  }

  .container .offset-by-nine {
    padding-left: 54.94792%;
  }

  .container .offset-by-ten {
    padding-left: 61.19792%;
  }

  .container .offset-by-eleven {
    padding-left: 67.44792%;
  }

  .container .offset-by-twelve {
    padding-left: 73.69792%;
  }

  .container .offset-by-thirteen {
    padding-left: 79.94792%;
  }

  .container .offset-by-fourteen {
    padding-left: 86.19792%;
  }

  .container .offset-by-fifteen {
    padding-left: 92.44792%;
  }
}
/* /(min-width: 48em) */
/* # Desktop
================================================== */
@media (min-width: 60em) {
  .container {
    max-width: 1200px;
  }

  .container .column,
  .container .columns {
    margin-left: 1.041666666666667%;
    margin-right: 1.041666666666667%;
  }

  .column.alpha, .columns.alpha {
    margin-left: 0;
  }

  .column.omega, .columns.omega {
    margin-right: 0;
  }

  /* Grid */
  .container .one.column,
  .container .one.columns {
    width: 4.166666666666667%;
  }

  .container .two.columns {
    width: 10.41666666666667%;
  }

  .container .three.columns {
    width: 16.66666666666667%;
  }

  .container .four.columns {
    width: 22.91666666666667%;
  }

  .container .five.columns {
    width: 29.16666666666667%;
  }

  .container .six.columns {
    width: 35.41666666666667%;
  }

  .container .seven.columns {
    width: 41.66666666666667%;
  }

  .container .eight.columns {
    width: 47.91666666666667%;
  }

  .container .nine.columns {
    width: 54.16666666666667%;
  }

  .container .ten.columns {
    width: 60.41666666666667%;
  }

  .container .eleven.columns {
    width: 66.66666666666667%;
  }

  .container .twelve.columns {
    width: 72.91666666666667%;
  }

  .container .thirteen.columns {
    width: 79.16666666666667%;
  }

  .container .fourteen.columns {
    width: 85.41666666666667%;
  }

  .container .fifteen.columns {
    width: 91.66666666666667%;
  }

  .container .sixteen.columns {
    width: 97.91666666666667%;
  }

  .container .one-third.column {
    width: 31.25%;
  }

  .container .two-thirds.column {
    width: 64.58333333333333%;
  }

  /* Offsets */
  .container .offset-by-one {
    padding-left: 6.25%;
  }

  .container .offset-by-two {
    padding-left: 12.5%;
  }

  .container .offset-by-three {
    padding-left: 18.75%;
  }

  .container .offset-by-four {
    padding-left: 25%;
  }

  .container .offset-by-five {
    padding-left: 31.25%;
  }

  .container .offset-by-six {
    padding-left: 37.5%;
  }

  .container .offset-by-seven {
    padding-left: 43.75%;
  }

  .container .offset-by-eight {
    padding-left: 50%;
  }

  .container .offset-by-nine {
    padding-left: 56.25%;
  }

  .container .offset-by-ten {
    padding-left: 62.5%;
  }

  .container .offset-by-eleven {
    padding-left: 68.75%;
  }

  .container .offset-by-twelve {
    padding-left: 75%;
  }

  .container .offset-by-thirteen {
    padding-left: 81.25%;
  }

  .container .offset-by-fourteen {
    padding-left: 87.5%;
  }

  .container .offset-by-fifteen {
    padding-left: 93.75%;
  }
}
/* /(min-width: 60em) */
/* #Clearing
================================================== */
/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.container:after, .clearfix:before, .clearfix:after, .row:before, .row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.container:after, .row:after, .clearfix:after {
  clear: both;
}

.row, .clearfix {
  zoom: 1;
}

/* You can also use a <br class="clear" /> to clear columns. Note that adding .clear to any tag will automatically hide it. */
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.bottom-space {
  height: 100px;
}

.bottom-space-small {
  height: 50px;
}

.bottom-padding {
  margin-bottom: 100px;
}