@charset "UTF-8";

/*!

Theme Name: Doctype

Theme URI: https://codestag.com/themes/doctype

Description: A Flat and Minimal Portfolio Theme

Author: Codestag

Author URI: https://codestag.com

Version: 1.0.11

License: GNU General Public License v2.0

License URI: http://www.gnu.org/licenses/gpl-2.0.html

Tags: theme-options, flexible-width, editor-style, featured-images, translation-ready, one-column, custom-menu

Text Domain: stag

*/

article,

aside,

details,

figcaption,

figure,

footer,

header,

hgroup,

main,

nav,

section,

summary {

  display: block;

}



audio,

canvas,

video {

  display: inline-block;

}



audio:not([controls]) {

  display: none;

  height: 0;

}



[hidden] {

  display: none;

}



html {

  font-family: sans-serif;

  -ms-text-size-adjust: 100%;

  -webkit-text-size-adjust: 100%;

}



body {

  margin: 0;

}



a:focus {

  outline: thin dotted;

}



a:active,

a:hover {

  outline: 0;

}



h1 {

  font-size: 3.706em;

  margin-top: 0.38094em;

  margin-bottom: 0.38094em;

}



abbr[title] {

  border-bottom: 1px dotted;

}



b,

strong {

  font-weight: bold;

}



dfn {

  font-style: italic;

}



hr {

  -moz-box-sizing: content-box;

  -webkit-box-sizing: content-box;

  box-sizing: content-box;

  height: 0;

}



mark {

  background: #ff0;

  color: #000;

}



code,

kbd,

pre,

samp {

  font-family: monospace, serif;

  font-size: 1em;

}



pre {

  white-space: pre-wrap;

}



q {

  quotes: "\201C" "\201D" "\2018" "\2019";

}



small {

  font-size: 80%;

}



sub,

sup {

  font-size: 75%;

  line-height: 0;

  position: relative;

  vertical-align: baseline;

}



sup {

  top: -0.5em;

}



sub {

  bottom: -0.25em;

}



img {

  border: 0;

}



svg:not(:root) {

  overflow: hidden;

}



figure {

  margin: 0;

  -webkit-backface-visibility: hidden;

}



fieldset {

  margin: 0 2px;

  border-color: #c0c0c0;

  border-top-width: 0.05882em;

  border-top-style: solid;

  padding-top: 0.43529em;

  border-bottom-width: 0.05882em;

  border-bottom-style: solid;

  padding-bottom: 0.85882em;

  border-left-width: 0.05882em;

  border-left-style: solid;

  padding-left: 0.82353em;

  border-right-width: 0.05882em;

  border-right-style: solid;

  padding-right: 0.82353em;

}



legend {

  border: 0;

  padding: 0;

}



button,

input,

select,

textarea {

  font-family: inherit;

  font-size: 100%;

  margin: 0;

}



button,

input {

  line-height: normal;

}



button,

select {

  text-transform: none;

}



button,

html input[type="button"],

input[type="reset"],

input[type="submit"] {

  -webkit-appearance: button;

  cursor: pointer;

}



button[disabled],

html input[disabled] {

  cursor: default;

}



input[type="checkbox"],

input[type="radio"] {

  -moz-box-sizing: border-box;

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  padding: 0;

}



input[type="search"] {

  -webkit-appearance: textfield;

}



input[type="search"]::-webkit-search-cancel-button,

input[type="search"]::-webkit-search-decoration {

  -webkit-appearance: none;

}



button::-moz-focus-inner,

input::-moz-focus-inner {

  border: 0;

  padding: 0;

}



textarea {

  overflow: auto;

  vertical-align: top;

}



table {

  border-collapse: collapse;

  border-spacing: 0;

}



.clearfix, .site-header, .entry-content,

.comment-content, .paging-navigation, .single-page-navigation, .entry-content-wrapper .entry-content, .project-images, .portfolio-cta, .section-call-to-action, .comments-area li.comment {

  zoom: 1;

}

.clearfix:before, .clearfix:after, .site-header:before, .entry-content:before,

.comment-content:before, .paging-navigation:before, .single-page-navigation:before, .entry-content-wrapper .entry-content:before, .project-images:before, .portfolio-cta:before, .section-call-to-action:before, .comments-area li.comment:before, .site-header:after, .entry-content:after,

.comment-content:after, .paging-navigation:after, .single-page-navigation:after, .entry-content-wrapper .entry-content:after, .project-images:after, .portfolio-cta:after, .section-call-to-action:after, .comments-area li.comment:after {

  display: table;

  content: "";

}

.clearfix:after, .site-header:after, .entry-content:after,

.comment-content:after, .paging-navigation:after, .single-page-navigation:after, .entry-content-wrapper .entry-content:after, .project-images:after, .portfolio-cta:after, .section-call-to-action:after, .comments-area li.comment:after {

  clear: both;

}



.page-content, .entry-header, .comments-area {

  max-width: 970px;

  margin-left: auto;

  margin-right: auto;

}



.page-header--portfolio span, .related-projects span {

  background: #fff;

  z-index: 2;

  padding-left: 30px;

  padding-right: 30px;

  display: inline-block;

}

.page-header--portfolio span:before, .related-projects span:before {

  content: '';

  display: block;

  position: absolute;

  background: #2b353a;

  height: 1px;

  width: 100%;

  z-index: -1;

  top: 50%;

  bottom: 50%;

  left: 0;

}



@media screen and (min-width: 768px) {

  .grids {

    max-width: 105%;

    margin: 0 0 0 -3%;

  }



  .grids [class*="grid-"] {

    display: inline-block;

    margin: 0 0 0 3%;

    margin-right: -.25em;

    vertical-align: top;

  }



  .grid-1 {

    width: 6.15%;

  }



  .grid-2 {

    width: 14.5741%;

  }



  .grid-2-5 {

    width: 17.07%;

  }



  .grid-3 {

    width: 22.05%;

  }



  .grid-4, .grid-one-third {

    width: 30.36%;

  }



  .grid-5 {

    width: 39.583%;

  }



  .grid-6, .grid-half {

    width: 47%;

  }



  .grid-7 {

    width: 54.25%;

  }



  .grid-8, .grid-two-thirds {

    width: 62.088%;

  }



  .grid-9 {

    width: 72%;

  }



  .grid-10 {

    width: 81.25%;

  }



  .grid-11 {

    width: 89.583%;

  }



  .grid-12 {

    width: 97.917%;

    margin: 0;

  }

}

html {

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  text-rendering: optimizeLegibility;

}



html,

body {

  width: 100%;

  overflow-x: hidden;

}



body {

  font: 17px/1.4 "Helvetica Neue", sans-serif, normal;

  color: #2b353a;

}

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

  body {

    padding-left: 20px;

    padding-right: 20px;

  }

}



.inside, .site-content, .site-footer .site-info {

  max-width: 1170px;

  margin: 0 auto;

}



.site-header {

  position: relative;

  background: white;

  -moz-transition: padding 0.1s ease-in;

  -o-transition: padding 0.1s ease-in;

  -webkit-transition: padding 0.1s ease-in;

  transition: padding 0.1s ease-in;

  padding-top: 40px;

  padding-top: 2.66667rem;

  padding-bottom: 40px;

  padding-bottom: 2.66667rem;

}



@media (min-width: 900px) {

  .sticky-nav .site-header--fixed {

    position: fixed;

    z-index: 10;

    right: 0;

    left: 0;

    top: 0;

  }



  .sticky-nav.admin-bar .site-header--fixed {

    top: 28px;

  }

}

.site-branding {

  display: inline-block;

  float: left;

  line-height: 80px;

  height: 100%;

}

.site-branding img {

  vertical-align: middle;

  padding: 5px 0;

}

.site-branding h1 {

  margin: 0;

  padding: 0;

  line-height: 1.2;

}



.navbar {

  float: right;

  line-height: 80px;

  font-size: 15px;

}

.navbar li {

  margin-left: 10px;

  line-height: 1;

}

.navbar a {

  text-transform: uppercase;

  color: inherit;

}



.site-content {

  margin-bottom: 70px;

  margin-bottom: 4.66667rem;

}



.site-footer {

  background-color: #363f48;

  padding: 26px 0;

  color: white;

  font-size: 14px;

  text-transform: uppercase;

}

.site-footer .grid-6:nth-child(2) {

  text-align: right;

}



.footer-widget-area {

  background: whitesmoke;

  position: relative;

  padding-top: 65px;

  padding-top: 4.33333rem;

}

.footer-widget-area .widget-title {

  margin: 0;

  font-size: 17px;

  font-size: 1.13333rem;

  font-weight: bold;

  color: #2b353a;

  margin-bottom: 45px;

  margin-bottom: 3rem;

  position: relative;

}

.footer-widget-area .widget-title span {

  display: inline-block;

  background: whitesmoke;

  position: relative;

  z-index: 1;

  max-width: 250px;

  padding-right: 10px;

}

.footer-widget-area .widget-title::before {

  content: '';

  background: #2b353a;

  height: 1px;

  width: 100%;

  position: absolute;

  z-index: 1;

  top: 50%;

  bottom: 50%;

}

.footer-widget-area ul {

  margin: 0;

  padding: 0;

}

.footer-widget-area li {

  list-style: none;

  margin-bottom: 7px;

}

.footer-widget-area .widget {

  padding-bottom: 65px;

  padding-bottom: 4.33333rem;

}

.footer-widget-area .search-field {

  border: 1px solid #c2c2c2;

}

.footer-widget-area .search-field:focus {

  outline: 0;

  border-color: #b5b5b5;

}

.footer-widget-area .search-submit {

  border: 1px solid transparent;

}



.widget .rss-date,

.widget .post-date {

  font-size: 13px;

  color: #c2c2c2;

  margin-top: 5px;

}

.widget cite {

  color: #c2c2c2;

}

.widget .children {

  padding-left: 20px;

}

.widget table {

  width: 100%;

}

.widget table td,

.widget table th {

  padding: 10px 10px;

}

.widget table th {

  text-align: left;

}

.widget table .odd {

  background: whitesmoke;

}



.flickr-photos li {

  display: inline-block;

  margin: 0 5px 5px 0;

}



.widget_rss cite {

  text-transform: none;

  font-size: 13px;

}

.widget_rss cite:before {

  content: '· By ';

}



.widget_recent_entries,

.widget_rss {

  text-transform: uppercase;

}

.widget_recent_entries .widget-title span,

.widget_rss .widget-title span {

  display: inline;

  vertical-align: middle;

}

.widget_recent_entries .widget-title img,

.widget_rss .widget-title img {

  position: relative;

  top: -5px;

}

.widget_recent_entries .widget-title a,

.widget_rss .widget-title a {

  display: inline;

}

.widget_recent_entries a,

.widget_rss a {

  color: inherit;

  display: block;

}

.widget_recent_entries li,

.widget_rss li {

  margin-bottom: 20px;

}



.widget_categories,

.widget_archive {

  color: #c2c2c2;

}



.js #primary-menu {

  clip: rect(0 0 0 0);

  max-height: 0;

  position: absolute;

  display: block;

  zoom: 1;

}

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

  .js #primary-menu {

    overflow: hidden;

  }

}



#primary-menu.opened {

  max-height: 9999px;

}



@media screen and (min-width: 900px) {

  .js #primary-menu {

    position: relative;

  }



  .js #primary-menu.closed {

    max-height: none;

  }



  #nav-toggle {

    display: none;

  }

}

#nav-toggle {

  font-size: 28px;

  line-height: 1;

  text-align: right;

  position: relative;

}



.sfHover a {

  color: #fff;

}



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

  .navbar {

    width: 100%;

    margin: 0;

    line-height: 1;

  }

  .navbar a:hover {

    background: transparent !important;

  }



  .site-header {

    padding: 0px 0px 30px;

  }



  #nav-toggle {

    display: inline-block;

    float: right;

    bottom: -40px;

  }



  .sub-menu:before {

    display: none;

  }



  .main-navigation .primary-menu {

    background: whitesmoke;

    margin-left: -20px;

    margin-right: -20px;

    padding-left: 20px;

    padding-right: 20px;

    position: relative;

    top: 0px;

  }

  .main-navigation .primary-menu li {

    width: 100%;

    display: block;

    margin: 0;

  }

  .main-navigation .primary-menu a {

    display: block;

    border-bottom: 1px solid white;

    padding: 10px 0;

  }

}

@media (min-width: 900px) {

  .primary-menu li {

    position: relative;

  }

  .primary-menu > li > a {

    margin-bottom: 10px;

  }

  .primary-menu ul {

    position: absolute;

    display: none;

    top: 100%;

    left: 0;

    min-width: 12em;

    z-index: 99;

  }

}

@media (max-width: 900px) {

  .primary-menu .sub-menu {

    visibility: visible !important;

    display: block !important;

    width: 100% !important;

    padding: 0 !important;

    background: transparent !important;

  }

  .primary-menu .sub-menu a {

    color: inherit;

  }

}

.sub-menu {

  padding: 15px 0 !important;

  -moz-border-radius: 5px;

  -webkit-border-radius: 5px;

  border-radius: 5px;

}

.sub-menu:before {

  bottom: 100%;

  border: solid transparent;

  content: " ";

  height: 0;

  width: 0;

  position: absolute;

  pointer-events: none;

  border-color: rgba(136, 183, 213, 0);

  border-top-color: #fff;

  border-width: 10px;

  left: 50%;

  top: 0px;

  left: 20px;

}

.sub-menu li {

  margin: 0;

  background: transparent;

  line-height: 1;

}

.sub-menu a {

  color: #fff;

  background: transparent;

  display: block !important;

}

.sub-menu a:hover {

  opacity: .85;

}

.sub-menu ul {

  top: 0;

}

.sub-menu ul:before {

  display: none;

}



.primary-menu li:hover > ul,

.primary-menu li.sfHover > ul {

  display: block;

}



*, *:after, *:before {

  -moz-box-sizing: border-box;

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

}



h1,

h2,

h3,

h4,

h5,

h6 {

  color: #363f48;

  text-transform: uppercase;

  font-weight: 300;

}



/* Make sure videos and embeds fit their containers. */

embed,

iframe,

object,

video {

  max-width: 100%;

}



p {

  margin: 0;

}



img {

  max-width: 100%;

  height: auto;

}



iframe {

  max-height: 100%;

}



img {

  vertical-align: bottom;

}

img:not([src]) {

  visibility: hidden;

}



a {

  text-decoration: none;

  -moz-transition: all 0.25s ease-in-out;

  -o-transition: all 0.25s ease-in-out;

  -webkit-transition: all 0.25s ease-in-out;

  transition: all 0.25s ease-in-out;

}

a:hover {

  color: inherit;

}



/* Images */

.alignleft {

  float: left;

}



.alignright {

  float: right;

}



.aligncenter {

  display: block;

  margin-left: auto;

  margin-right: auto;

}



img.alignleft {

  margin: 5px 20px 5px 0;

}



.wp-caption.alignleft {

  margin: 5px 10px 5px 0;

}



img.alignright {

  margin: 5px 0 5px 20px;

}



.wp-caption.alignright {

  margin: 5px 0 5px 10px;

}



img.aligncenter {

  margin: 5px auto;

}



img.alignnone {

  margin: 5px 0;

}



.wp-caption .wp-caption-text,

.entry-caption,

.gallery-caption {

  color: #220e10;

  font-size: 18px;

  font-style: italic;

  font-weight: 300;

}



.wp-caption {

  margin-top: 30px;

  margin-top: 2rem;

  margin-bottom: 30px;

  margin-bottom: 2rem;

  max-width: 100%;

}



.wp-caption-text {

  margin-top: 10px;

  padding-left: 15px;

}



.wp-caption.alignleft + ul,

.wp-caption.alignleft + ol {

  list-style-position: inside;

}



.navigation li {

  list-style: none;

  display: inline-block;

  font-size: 1.2em;

}

.navigation ul {

  margin: 0;

  padding: 0;

}



.sticky,

.bypostauthor {

  color: inherit;

}



.clear {

  clear: both;

  display: block;

  font-size: 0;

  height: 0;

  line-height: 0;

  width: 100%;

}



.entry-content,

.comment-content {

  margin-top: 60px;

  margin-top: 4rem;

  word-wrap: break-word;

  max-width: 970px;

  margin-left: auto;

  margin-right: auto;

}

.entry-content p,

.comment-content p {

  line-height: 1.6;

  margin-bottom: 2em;

  font-size: 1.2em;	

}

.entry-content p:first-child,

.comment-content p:first-child {

  margin-top: 0;

}

.entry-content p:last-child,

.comment-content p:last-child {

  margin-bottom: 0;

}

.entry-content blockquote,

.comment-content blockquote {

  font-family: 'Rokkitt', serif;

  font-weight: bold;

  font-size: 27px;

  border: none;

  text-align: center;

  line-height: 1;

  margin: 50px auto;

  max-width: 90%;

}

.entry-content blockquote p,

.comment-content blockquote p {

  line-height: inherit;

}

.entry-content blockquote::before, .entry-content blockquote::after,

.comment-content blockquote::before,

.comment-content blockquote::after {

  display: inline-block;

  content: '';

  width: 126px;

  margin-left: auto;

  margin-right: auto;

  height: 1px;

  background: #2b353a;

  position: relative;

}

.entry-content blockquote::before,

.comment-content blockquote::before {

  top: -30px;

}

.entry-content blockquote::after,

.comment-content blockquote::after {

  bottom: -20px;

}

.entry-content table,

.comment-content table {

  width: 100%;

}

.entry-content table td,

.entry-content table th,

.comment-content table td,

.comment-content table th {

  padding: 10px 10px;

}

.entry-content table th,

.comment-content table th {

  text-align: left;

}

.entry-content table .odd,

.comment-content table .odd {

  background: whitesmoke;

}

.entry-content li,

.comment-content li {

  margin-bottom: 5px;

  list-style: none;

}

.entry-content li:before,

.comment-content li:before {

  margin-right: 6px;

  color: #b6b6b6;

}

.entry-content ul,

.comment-content ul {

  padding: 0;

}






/* insert tick bullet here */



.entry-content ol,

.comment-content ol {

  padding: 0;

  counter-reset: section;

}

.entry-content ol li:before,

.comment-content ol li:before {

  font-weight: bold;

  counter-increment: section;

  content: counters(section,".") ". ";

}

.entry-content h1,

.comment-content h1 {

  font-size: 28px;

  font-size: 1.86667rem;

  font-weight: 300;

}

.entry-content h2,

.comment-content h2 {

  font-size: 23px;

  font-size: 1.53333rem;

  font-weight: bold;

}

.entry-content h3,

.comment-content h3 {

  font-size: 20px;

  font-size: 1.33333rem;

  font-weight: bold;

  text-transform: none;

}

.entry-content h4,

.comment-content h4 {

  font-size: 15px;

  font-size: 1rem;

  font-weight: bold;

}

.entry-content h5,

.comment-content h5 {

  font-size: 13px;

  font-size: 0.86667rem;

  font-weight: bold;

  color: #808080;

}

.entry-content h6,

.comment-content h6 {

  font-size: 12px;

  font-size: 0.8rem;

  font-weight: bold;

  color: #808080;

}



.stag-intro-text {

  font-size: 22px;

  font-size: 1.46667rem;

  font-weight: 300;

  text-transform: uppercase;

  line-height: 1.6;

  margin-bottom: 2em;

}



.post-thumbnail {

  margin-top: 60px;

  margin-top: 4rem;

  margin-bottom: 60px;

  margin-bottom: 4rem;

  text-align: center;

}



.entry-title {

  line-height: 1.2;

  margin-top: 0;

  -ms-word-wrap: break-word;

  word-wrap: break-word;
  font-size: 2.2em;

}



.entry-title a {

  color: inherit;

}



.screen-reader-text {

  display: none;

}



.page-content {

  text-align: center;

}



.blog .hentry,

.archive .hentry,

.search .hentry {

  position: relative;

  margin-top: 80px;

  margin-top: 5.33333rem;

  margin-bottom: 60px;

  margin-bottom: 4rem;

}

.blog .hentry::before,

.archive .hentry::before,

.search .hentry::before {

  content: "\f10e";

  font-family: FontAwesome;

  font-weight: normal;

  font-style: normal;

  text-decoration: inherit;

  -webkit-font-smoothing: antialiased;

  *margin-right: .3em;

  display: block;

  margin-left: auto;

  margin-right: auto;

  text-align: center;

  width: 57px;

  position: relative;

  top: -33px;

  top: -2.2rem;

  background: white;

  z-index: 3;

}

.blog .hentry::after,

.archive .hentry::after,

.search .hentry::after {

  position: absolute;

  content: '';

  display: block;

  text-align: center;

  width: 160px;

  left: 50%;

  right: 50%;

  margin-left: -80px;

  position: absolute;

  top: -25px;

  top: -1.66667rem;

  background: #362946;

  height: 1px;

}



.entry-header {

  text-align: center;

  margin-top: 30px;

  margin-bottom: 30px;

}



.page-header {

  text-align: center;

  max-width: 940px;

  margin-top: 35px;

  margin-top: 2.33333rem;

  margin-bottom: 60px;

  margin-bottom: 4rem;

  margin-left: auto;

  margin-right: auto;

}

.page-header .blog-title {

  position: relative;

  line-height: 1;

}

.page-header span {

  max-width: 680px;

}



.entry-meta {

  text-align: center;

  color: #aeafaf;

  text-transform: uppercase;

  font-size: 14px;

  margin-top: 30px;

  margin-top: 2rem;

  margin-bottom: 60px;

  margin-bottom: 4rem;

}

.entry-meta span:after {

  content: '/';

  margin-left: 5px;

  margin-right: 5px;

}

.entry-meta span:last-child:after {

  display: none;

}



.blog-title {

  margin: 0 0 0 0;

  word-break: break-word;

}



.blog-subtitle {

  margin: 15px 0 0 0;

  text-transform: uppercase;

  color: #aeafaf;

}



.updated {

  display: none;

}



.paging-navigation {

  text-align: center;

  font-size: 24px;

  border-top: 1px solid #362946;

  padding-top: 62px;

  padding-top: 4.13333rem;

  margin-top: 62px;

  margin-top: 4.13333rem;

  margin-bottom: 62px;

  margin-bottom: 4.13333rem;

}

.paging-navigation div, .paging-navigation .page-numbers {

  display: inline-block;

}

.paging-navigation div {

  vertical-align: middle;

}

.paging-navigation .pages {

  text-align: center;

  margin-left: auto;

  margin-right: auto;

  padding: 0 50px;

}

.paging-navigation .page-numbers {

  border: 2px solid #2b353a;

  -moz-border-radius: 2px;

  -webkit-border-radius: 2px;

  border-radius: 2px;

  width: 58px;

  height: 58px;

  padding-top: 12px;

  margin-right: 6px;

  margin-bottom: 6px;

}

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

  .paging-navigation .page-numbers {

    width: 40px;

    height: 40px;

    padding-top: 6px;

    font-size: 15px;

  }

}

.paging-navigation .nav-next {

  float: right;

}

.paging-navigation .nav-previous {

  float: left;

}

.paging-navigation .nav-next,

.paging-navigation .nav-previous {

  padding-top: 17px;

}

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

  .paging-navigation .nav-next,

  .paging-navigation .nav-previous {

    padding-top: 8px;

  }

}

.paging-navigation a {

  color: inherit;

}



.single-page-navigation {

  max-width: 1030px;

  border-top: 1px solid #362946;

  border-bottom: 1px solid #362946;

  padding: 30px 0;

  margin: 50px auto;

  text-transform: uppercase;

}

.single-page-navigation a {

  color: inherit;

  display: block;

}



.nav-next {

  float: right;

  text-align: right;

}

.nav-next .fa {

  padding-left: 60px;

}



.nav-previous .fa {

  padding-right: 60px;

}



.page-header .sub-title {

  margin: 15px 0 0 0;

  text-transform: uppercase;

  color: #aeafaf;

}



.page-header--portfolio {

  position: relative;

  margin-bottom: 15px;

  margin-bottom: 1rem;

}



.portfolio-items {

  text-transform: uppercase;

  font-size: 18px;

  font-size: 1.2rem;

}

.portfolio-items *:not(a) {

  -moz-backface-visibility: hidden;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}

.portfolio-items .grid-4 {

  max-width: 370px;

  margin-top: 3%;

}

.portfolio-items figure {

  position: relative;

  overflow: hidden;

}

.portfolio-items figure:hover figcaption {

  opacity: 1;

  -moz-transform: translateY(0px);

  -ms-transform: translateY(0px);

  -webkit-transform: translateY(0px);

  transform: translateY(0px);

  -webkit-transition: -webkit-transform 0.4s, opacity 0.1s;

  -moz-transition: -moz-transform 0.4s, opacity 0.1s;

  transition: transform 0.4s, opacity 0.1s;

}

.portfolio-items figure:hover img {

  -moz-transform: translateY(-50px);

  -ms-transform: translateY(-50px);

  -webkit-transform: translateY(-50px);

  transform: translateY(-50px);

}

.portfolio-items figcaption {

  position: absolute;

  background: #363f48;

  display: block;

  width: 100%;

  bottom: 0;

  padding: 17px 20px;

  text-align: center;

  opacity: 0;

  -moz-transform: translateY(100%);

  -ms-transform: translateY(100%);

  -webkit-transform: translateY(100%);

  transform: translateY(100%);

  -moz-backface-visibility: hidden;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

  -webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;

  -moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;

  transition: transform 0.4s, opacity 0.1s 0.3s;

}

.portfolio-items img {

  -webkit-transition: -webkit-transform 0.4s;

  -moz-transition: -moz-transform 0.4s;

  transition: transform 0.4s;

}

.portfolio-items h4 {

  font-size: inherit;

  color: white;

  margin: 0 0 15px 0;

}

.portfolio-items .button {

  font-size: 15px;

  line-height: 1;

  padding-left: 33px;

  padding-right: 33px;

}



.entry-content-wrapper {

  padding-top: 50px;

  padding-top: 3.33333rem;

  padding-bottom: 50px;

  padding-bottom: 3.33333rem;

}

.entry-content-wrapper .entry-content {

  margin-top: 0;

}

.entry-content-wrapper .about-this-project {

  color: inherit;

  margin: 0;

  line-height: 1;

  margin-bottom: 40px;

  margin-bottom: 2.66667rem;

}

.entry-content-wrapper .main-content {

  margin-bottom: 50px;

}

@media screen and (min-width: 700px) {

  .entry-content-wrapper .main-content {

    float: left;

    width: 65%;

    max-width: 100%;

    margin-bottom: 0;

  }

}

.entry-content-wrapper .project-meta {

  text-transform: uppercase;

}

@media screen and (min-width: 700px) {

  .entry-content-wrapper .project-meta {

    float: right;

    width: 27.8%;

    max-width: 100%;

  }

}

.entry-content-wrapper .project-meta li {

  list-style: none;

  display: block;

  margin-bottom: 20px;

}

.entry-content-wrapper .project-meta li:first-child {

  margin-bottom: 45px;

}

.entry-content-wrapper .project-meta .button {

  width: 100%;

  max-width: 270px;

}

.entry-content-wrapper .project-meta span {

  color: #aeafaf;

  font-size: 14px;

}

.entry-content-wrapper .project-meta p {

  color: #61676b;

  margin-top: 5px;

}



.project-images {

  margin-top: 50px;

}

.project-images ul {

  margin: 0;

  padding: 0;

}

.project-images li {

  list-style: none;

}



.portfolio-slides {

  position: relative;

  list-style: none;

  overflow: hidden;

  width: 100%;

  padding: 0;

  margin: 0;

}



.portfolio-slides li {

  -webkit-backface-visibility: hidden;

  position: absolute;

  display: none;

  width: 100%;

  left: 0;

  top: 0;

}



.portfolio-slides li:first-child {

  position: relative;

  display: block;

  float: left;

}



.portfolio-slides img {

  display: block;

  height: auto;

  float: left;

  width: 100%;

  border: 0;

}



.project-images {

  position: relative;

}



.portfolio-slides_nav {

  z-index: 3;

  position: absolute;

  -webkit-tap-highlight-color: transparent;

  top: 0;

  left: 0;

  display: block;

  background: #FFF;

  opacity: 0;

  filter: alpha(opacity=1);

  width: 48%;

  text-indent: -9999px;

  overflow: hidden;

  height: 91%;

}



.portfolio-slides_nav.prev {

  cursor: w-resize;

}



.portfolio-slides_nav.next {

  left: auto;

  right: 0;

  cursor: e-resize;

}



.portfolio-slides_tabs {

  position: absolute;

  bottom: 30px;

  left: 100px;

  width: 400px;

  max-width: 100%;

  z-index: 1000;

}

.portfolio-slides_tabs li {

  display: inline-block;

  margin-right: 5px;

}

.portfolio-slides_tabs a {

  display: block;

  width: 12px;

  height: 12px;

  border-radius: 30px;

  background: transparent;

  border: 2px solid white;

  font-size: 0;

}



.portfolio-slides_here a {

  background: white;

}



.related-projects {

  margin-top: 60px;

  margin-top: 4rem;

  margin-bottom: 60px;

  margin-bottom: 4rem;

}

.related-projects h2 {

  position: relative;

  text-align: center;

}

.related-projects span:before {

  margin-top: 0;

}



.page-template-template-home-php .site-content,

.page-template-template-widgetized-php .site-content {

  max-width: none;

  margin-bottom: 0;

}



.section-intro {

  padding-bottom: 60px;

  padding-bottom: 4rem;

}

.section-intro h1 {

  line-height: 1.2;

  margin: 0 auto;

  max-width: 90%;

}



.section-recent-projects {

  margin-top: 60px;

  margin-top: 4rem;

  margin-bottom: 60px;

  margin-bottom: 4rem;

  text-align: left;

}

.section-recent-projects .page-header {

  margin-top: 0;

}

.section-recent-projects .portfolio-button {

  margin: 60px auto 0 auto;

  display: block;

  text-align: center;

  width: 365px;

  max-width: 100%;

}



.section-static-content {

  padding-top: 65px;

  padding-top: 4.33333rem;

  padding-bottom: 65px;

  padding-bottom: 4.33333rem;

  position: relative;

}

.section-static-content .section-title {

  margin: 0 auto;

  position: relative;

  z-index: 1;

  max-width: 940px;

}



.section-title span {

font-size: 1.4em;

font-weight: 550;

}



.section-static-content .section-title span:before {

  display: none;

}

.section-static-content .entry-content {

  margin-top: 50px;

  text-align: left;

}

.section-static-content li {

  list-style: none;

}

.section-static-content .stag-button {

  color: white !important;

}

.section-static-content figure {

  margin-top: 50px;

  margin-top: 3.33333rem;

  margin-bottom: -65px;

  margin-bottom: -4.33333rem;

}

.section-static-content article {

  position: relative;

  z-index: 2;

}



.static-content-cover {

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  z-index: 1;

  background-repeat: no-repeat;

  background-position: center;

  -moz-background-size: cover;

  -o-background-size: cover;

  -webkit-background-size: cover;

  background-size: cover;

}



.stag-custom-widget-area .widget, .section-homepage {

  text-align: center;

}

.stag-custom-widget-area .widget .section-title, .section-homepage .section-title {

  line-height: 1.2;

	

}



.widgetized-sections section:first-child {

  margin-top: 0;

}



.section-hero {

  background-position: center center;

  background-repeat: no-repeat;

  padding-top: 80px;

  padding-top: 5.33333rem;

  -moz-background-size: cover;

  -o-background-size: cover;

  -webkit-background-size: cover;

  background-size: cover;

}

.section-hero .inner-section-divider {

  display: block;

  text-align: center;

  font-size: 34px;

  margin-top: 60px;

  margin-top: 4rem;

  margin-bottom: 40px;

  margin-bottom: 2.66667rem;

}

.section-hero .hero-content-wrapper {

  background: white;

}

.section-hero .hero-content-inner {

  margin: 0 auto;

  max-width: 1110px;

  padding-top: 45px;

  padding-top: 4rem;

  padding-bottom: 45px;

  padding-bottom: 4rem;

  padding-left: 20px;

  padding-right: 20px;

}

.section-hero .section-title {

  font-size: 38px;

  font-size: 2.33333rem;

}

.section-hero .button {

  width: 360px;

  margin-bottom: 80px;

  margin-bottom: 5.33333rem;

}

.section-hero .hero-content {

  line-height: 1.5;

  text-align: left;

  margin-top: 0;

}



.archive-lists {

  text-transform: uppercase;

  font-size: 26px;

  font-size: 1.73333rem;

  font-weight: 300;

}

.archive-lists a {

  color: #2b353a;

}

.archive-lists .widgettitle {

  margin: 0;

  font-size: 45px;

  font-size: 3rem;

  line-height: 1;

  font-weight: 300;

}

.archive-lists .widgettitle:before {

  padding-right: 15px;

  font-family: FontAwesome;

  font-weight: normal;

  font-style: normal;

  text-decoration: inherit;

  -webkit-font-smoothing: antialiased;

  *margin-right: .3em;

}

.archive-lists ul {

  padding: 0;

  margin: 40px 0 0;

}

.archive-lists li {

  list-style: none;

  margin-bottom: .8em;

}

.archive-lists li:before {

  display: none;

}

.archive-lists .widget_recent_entries .widgettitle:before {

  content: "\f0f6";

}

.archive-lists .widget_archive .widgettitle:before {

  content: "\f017";

}

.archive-lists .widget_categories .widgettitle:before {

  content: "\f044";

}

.archive-lists .widget_search .screen-reader-text {

  display: block;

  font-size: 45px;

  font-size: 3rem;

  line-height: 1;

  font-weight: 300;

  line-height: 1;

  margin-bottom: 20px;

}

.archive-lists .widget_search .screen-reader-text:before {

  font-size: 38px;

  font-size: 2.53333rem;


  position: relative;

  top: 4px;

  vertical-align: top;

  padding-right: 15px;

  content: "\f002";

  font-family: FontAwesome;

  font-weight: normal;

  font-style: normal;

  text-decoration: inherit;

  -webkit-font-smoothing: antialiased;

  *margin-right: .3em;

}

.archive-lists .widget_search .search-submit {

  display: none;

}

.archive-lists .widget_search .search-field {

  font-size: 17px;

  width: 470px;

}

.archive-lists .widget {

  padding: 50px 0;

}

.archive-lists .widget:after {

  content: '';

  display: block;

  width: 160px;

  height: 1px;

  position: relative;

  bottom: -40px;

  background: #362946;

}

.archive-lists .widget:last-child:after {

  display: none;

}



.stag-twitter li {

  margin-bottom: 20px;

}

.stag-twitter .time {

  text-transform: uppercase;

  font-size: .7rem;

}

.stag-twitter .time a {

  color: inherit;

}



.stag-nav li:before {

  display: none;

}



.error404 .widget:after {

  display: none;

}

.error404 .widgettitle {

  margin-bottom: 30px;

}



.search .search-form, .page-content .search-form {

  margin-top: 50px;

  margin-top: 3.33333rem;

}



.section-contact {

  padding-top: 65px;

  padding-top: 4.33333rem;

  padding-bottom: 65px;

  padding-bottom: 4.33333rem;

}

.section-contact .page-header {

  margin-top: 0;

}

.section-contact .inner-section-divider {

  display: block;

  text-align: center;

  font-size: 18px;

  margin-top: 60px;

  margin-top: 4rem;

  margin-bottom: 40px;

  margin-bottom: 2.66667rem;

}

.section-contact .entry-content {

  margin: 0 auto;

  text-transform: uppercase;

}

.section-contact .entry-content p {

  margin: 0;

}

.section-contact .google-map {

  margin: 80px 0 30px 0;

  margin:  5.33333rem 0 2rem 0;

}



.fa {

  -moz-backface-visibility: hidden;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}



.contact-form-wrapper {

  max-width: 970px;

  margin: 50px auto 0 auto;

}

.contact-form-wrapper h2 {

  text-align: center;

}

.contact-form-wrapper label {

  display: block;

  font-size: 14px;

  color: #aeafaf;

  text-transform: uppercase;

  margin-bottom: 10px;

}

.contact-form-wrapper input[type="text"],

.contact-form-wrapper input[type="email"],

.contact-form-wrapper textarea {

  width: 100%;

}

.contact-form-wrapper .buttons {

  margin-top: 40px;

  text-align: center;

}

.contact-form-wrapper .buttons input {

  width: 370px;

}

.contact-form-wrapper .commentsText {

  margin-top: 30px;

}

.contact-form-wrapper .error {

  display: block;

  margin-top: 10px;

  color: #ff6666;

  font-size: 14px;

}



.page-template-template-contact-php .google-map {

  margin: 30px 0;

}



.section-call-to-action {

  text-align: left;

}



.portfolio-cta, .section-call-to-action {

  background: #363f48;

  padding-top: 56px;

  padding-top: 3.73333rem;

  padding-bottom: 56px;

  padding-bottom: 3.73333rem;

}

.portfolio-cta h2, .section-call-to-action h2 {

  color: white;

  display: inline-block;

  margin: 0;

  line-height: 1;

}

.portfolio-cta .button, .section-call-to-action .button {

  padding: 22px 20px;

  width: 370px;

}

@media screen and (min-width: 768px) {

  .portfolio-cta .button, .section-call-to-action .button {

    float: right;

  }

}

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

  .portfolio-cta .button, .section-call-to-action .button {

    margin-top: 30px;

  }

}

.portfolio-cta .grid-5, .section-call-to-action .grid-5,

.portfolio-cta .grid-7,

.section-call-to-action .grid-7 {

  vertical-align: middle;

}

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

  .portfolio-cta .grid-5, .section-call-to-action .grid-5 {

    text-align: center;

  }

}



.tax-skill .hentry {

  margin-bottom: 0;

}

.tax-skill .hentry:before, .tax-skill .hentry:after {

  display: none;

}



#portfolio-filter .mix {

  opacity: 0;

  display: none;

}



.portfolio-filter {

  padding: 0;

  text-align: center;

  font-size: 15px;

  margin-top: 60px;

  margin-top: 4rem;

  margin-bottom: 40px;

  margin-bottom: 2.66667rem;

}

.portfolio-filter li {

  margin-left: 10px;

  cursor: pointer;

}

.portfolio-filter .active {

  background: #f5f4f4;

  color: #2b353a;

}

.portfolio-filter .active:hover {

  color: inherit;

}

.portfolio-filter .button {

  font-weight: inherit;

  padding: 8px;

}



.avatar-148 {

  max-width: 74px;

}



.avatar-140 {

  max-width: 70px;

}



.avatar {

  -moz-border-radius: 50%;

  -webkit-border-radius: 50%;

  border-radius: 50%;

}



.comments-area {

  margin-top: 60px;

  margin-top: 4rem;

  color: #8e8e8e;

  font-size: 15px;

}

.comments-area li.comment .comment-respond {

  padding-left: 95px;

  padding-top: 30px;

}

.comments-area li.comment .comment-respond input:not([type="submit"]), .comments-area li.comment .comment-respond textarea {

  background: white;

  border-color: #d4d5d5;

}

.comments-area .avatar {

  float: left;

  margin-right: 25px;

}



.comment-reply-title {

  font-size: 45px;

  font-size: 3rem;

  margin: 0;

}

.comment-reply-title small {

  font-size: 12px;

  font-weight: bold;

}



.form-allowed-tags {

  font-size: 14px;

  color: #aeafaf;

}



.comment-form {

  margin-top: 50px;

}

.comment-form label {

  display: block;

  text-transform: uppercase;

  font-size: 14px;

  color: #aeafaf;

  margin-bottom: 10px;

}

.comment-form p {

  margin: 0 0 1.5em 0;

}

.comment-form p input:not([type="submit"]) {

  width: 100%;

  color: inherit;

}

.comment-form .required {

  color: #ff9999;

}

.comment-form textarea {

  width: 100%;

  height: 180px;

  resize: none;

}

.comment-form .comment-form-url {

  display: none;

}

@media screen and (min-width: 768px) {

  .comment-form .comment-form-author,

  .comment-form .comment-form-email {

    display: inline-block;

    width: 49%;

    margin-left: 2%;

    margin-right: -.25em;

  }

}

.comment-form .comment-form-author {

  margin-left: 0;

}



.comments-main-area {

  background: whitesmoke;

  margin: 70px -20px;

  padding: 70px 20px;

}



.comments-title {

  line-height: 1;

  margin: 0;

}



.comment-list {

  margin: 0;

  padding: 0;

}

.comment-list li.comment {

  list-style: none;

  margin: 40px 0 0 0;

  padding: 40px 0 0 0;

}

.comment-list li.comment:before {

  content: '';

  display: inline-block;

  width: 126px;

  background: #362946;

  height: 1px;

  position: relative;

  left: 0;

  top: -41px;

}



.comment-body {

  padding-left: 95px;

}



.comment-meta {

  font-size: 14px;

  line-height: 1;

  margin-bottom: 20px;

}



.comment-author {

  text-transform: uppercase;

}

.comment-author cite {

  font-style: normal;

}

.comment-author span:before {

  margin: 0 5px;

  content: '/';

}

.comment-author span:first-child:before {

  display: none;

}



ul.children {

  margin: 0;

  padding: 0 0 0 95px;

}



.comment-content {

  margin: 0;

}



input,

button,

.button,

textarea {

  -webkit-font-smoothing: inherit;

  background: whitesmoke;

  border: 1px solid transparent;

  padding: 13px 10px;

  -moz-border-radius: 3px;

  -webkit-border-radius: 3px;

  border-radius: 3px;

  max-width: 100%;

}

input:focus,

button:focus,

.button:focus,

textarea:focus {

  outline: 0;

  border: 1px solid gainsboro;

  background: white;

}



.stag-button {

  -moz-border-radius: 3px;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}



.stag-button--stroke {

  background-color: transparent;

}



.stag-button--green:not(.stag-button--stroke) {

  background-color: #8bd3c1;

}

.stag-button--green.stag-button--stroke {

  border-color: #8bd3c1;

  color: #8bd3c1 !important;

}

.stag-button--green.stag-button--stroke:hover {

  background: #8bd3c1;

}



.stag-button--black:not(.stag-button--stroke) {

  background-color: #363f48;

}

.stag-button--black.stag-button--stroke {

  border-color: #363f48;

  color: #363f48 !important;

}

.stag-button--black.stag-button--stroke:hover {

  background: #363f48;

}



input[type=submit],

button,

.button {

  color: #fff;

  font-weight: bold;

  text-align: center;

  text-transform: uppercase;

  line-height: 1;

  -moz-transition: all 0.35s;

  -o-transition: all 0.35s;

  -webkit-transition: all 0.35s;

  transition: all 0.35s;

}

input[type=submit]:hover,

button:hover,

.button:hover {

  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);

  opacity: 0.85;

}



.button {

  display: inline-block;

}

.button:hover {

  color: white;

}



.search-form .screen-reader-text {

  display: none;

}



@media (min-width: 900px) {

  .sticky-nav #content {

    margin-top: 200px;

  }



  .sticky-nav .site-header {

    -webkit-animation-duration: .5s;

    -moz-animation-duration: .5s;

    -o-animation-duration: .5s;

    animation-duration: .5s;

    -webkit-animation-fill-mode: both;

    -moz-animation-fill-mode: both;

    -o-animation-fill-mode: both;

    animation-fill-mode: both;

  }

  .sticky-nav .site-header--pinned {

    -webkit-animation-name: slideDown;

    -moz-animation-name: slideDown;

    -o-animation-name: slideDown;

    animation-name: slideDown;

  }

  .sticky-nav .header-shrink {

    max-height: 80px !important;

    padding-top: 0px;

    padding-top: 0rem;

    padding-bottom: 0px;

    padding-bottom: 0rem;

    -moz-box-shadow: 1px 1px 2px rgba(221, 221, 221, 0.8);

    -webkit-box-shadow: 1px 1px 2px rgba(221, 221, 221, 0.8);

    box-shadow: 1px 1px 2px rgba(221, 221, 221, 0.8);

  }

  .sticky-nav .site-header--unpinned {

    -webkit-animation-name: slideUp;

    -moz-animation-name: slideUp;

    -o-animation-name: slideUp;

    animation-name: slideUp;

  }

  .sticky-nav .site-header img {

    height: auto;

    width: auto;

    max-height: 100%;

  }

  .sticky-nav .inside {

    height: 100%;

  }

  .sticky-nav .logo-container {

    display: block;

    height: 100%;

  }

  .sticky-nav .site-header {

    max-height: 170px;

    height: 170px;

  }

}

@-webkit-keyframes slideUp {

  0% {

    -webkit-transform: translateY(0);

  }



  100% {

    -webkit-transform: translateY(-83px);

  }

}

@-moz-keyframes slideUp {

  0% {

    -moz-transform: translateY(0);

  }



  100% {

    -moz-transform: translateY(-83px);

  }

}

@-o-keyframes slideUp {

  0% {

    -o-transform: translateY(0);

  }



  100% {

    -o-transform: translateY(-83px);

  }

}

@keyframes slideUp {

  0% {

    transform: translateY(0);

    -webkit-transform: translateY(0);

  }



  100% {

    transform: translateY(-83px);

    -webkit-transform: translateY(-83px);

  }

}

@-webkit-keyframes slideDown {

  0% {

    -webkit-transform: translateY(-83px);

  }



  100% {

    -webkit-transform: translateY(0);

  }

}

@-moz-keyframes slideDown {

  0% {

    -moz-transform: translateY(-83px);

  }



  100% {

    -moz-transform: translateY(0);

  }

}

@-o-keyframes slideDown {

  0% {

    -o-transform: translateY(-83px);

  }



  100% {

    -o-transform: translateY(0);

  }

}

@keyframes slideDown {

  0% {

    transform: translateY(-83px);

    -webkit-transform: translateY(-83px);

  }

}

@media (max-width: 768px) {

  body {

    font-size: 15px;

  }



  .section-hero .section-title {

    font-size: 27px;

  }



  .single-page-navigation, .nav-next {

    text-align: center;

  }



  .single-page-navigation {

    padding: 15px 0;

  }

  .single-page-navigation .fa {

    padding: 0;

  }

  .single-page-navigation a {

    padding: 10px 0;

  }

}

@media screen and (min-width: 480px) and (max-width: 768px) {

  .portfolio-items {

    max-width: 105%;

    margin-left: -3%;

  }

  .portfolio-items .grid-4 {

    width: 30.36%;

    display: inline-block;

    margin-left: 3%;

    margin-right: -.25em;

  }

}

@media (max-width: 480px) {

  .portfolio-items {

    text-align: center;

  }

  .portfolio-items .portfolio {

    margin-left: auto;

    margin-right: auto;

    margin-bottom: 5%;

  }



  h1 {

    font-size: 38px;

    font-size: 2.53333rem;

  }



  .page-header--portfolio span, .related-projects span, .section-static-content .section-title span {

    padding-left: 0;

    padding-right: 0;

  }



  .page-header--portfolio span:before, .related-projects span:before, .section-static-content .section-title span:before {

    display: none;

  }



  .portfolio-slides_tabs {

    text-align: center;

    left: 0;

  }

}

@media (max-width: 1170px) {

  .site-footer,

  .footer-widget-area,

  .entry-content-wrapper,

  .section-hero,

  .portfolio-cta,

  .section-call-to-action,

  .section-static-content {

    margin-left: -20px;

    margin-right: -20px;

    padding-left: 20px;

    padding-right: 20px;

  }



  .static-content-cover {

    margin-left: -20px;

  }

}

@media (min-width: 900px) {

  .navbar a {

    display: inline-block;

    padding: 10px 14px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    border-radius: 5px;

    line-height: 1;

  }

  .navbar a:hover {

    color: white;

  }

}

@media (max-width: 900px) {

  .sfHover a {

    background: transparent !important;

    color: inherit;

  }



  .navbar a:hover {

    color: #6c8592;

  }



  .sub-menu li {

    padding-left: 20px;

  }



  .site-branding {

    line-height: 1;

  }

}

@media (max-width: 992px) {

  .comments-area .avatar {

    display: none;

  }

  .comments-area li.comment {

    padding-left: 0;

  }



  .comment-body {

    padding-left: 0;

  }



  ul.children {

    padding-left: 20px;

  }

}











.gallery a img { border: 0 !important; }