/*
* PROPEL HTML
* V1.0
* Author: Kevin Schwarz
* http://www.ksdesigning.com
* 
* Built on modified Skelton grid
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/
/* Table of Contents
==================================================
#Reset & Basics
#Typography
#Header
#Body
#Portfolio
#Blog
#Footer
#Forms & Fields
#Buttons
#Toggles & Tabs
#Slider
#Misc.
#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;
}

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%;
}

.wrapper ul {
  list-style-type: circle;
}

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

p {
  font-size: 14px;
  color: #999;
  line-height: 1.6;
  margin-bottom: 20px;
}
p:last-child {
  margin-bottom: 0;
}

h1, h2, h3, h4, h5, h6 {
  text-transform: uppercase;
  font-weight: 700;
  color: #333;
  -webkit-text-stroke: 0.6px;
}

h3 {
  font-size: 28px;
  margin-bottom: 50px;
}
h3.title {
  text-align: center;
  position: absolute;
  right: 50%;
}

h4 {
  margin-bottom: 30px;
}

h6.title {
  font-size: 20px;
  color: #555;
  text-align: center;
  position: absolute;
  right: 50%;
}

.title-cont {
  width: 100%;
  margin-bottom: 140px;
  position: relative;
}

.sub-header {
  font-size: 14px;
  letter-spacing: 1px;
  color: #ebbb14;
  -webkit-text-stroke: 0.3px;
  display: block;
  text-align: center;
  position: absolute;
  top: 55px;
  left: 50%;
}

.header-line {
  width: 200px;
  height: 1px;
  margin: 8px auto;
  left: 0;
  right: 0;
  background: #ccc;
  position: absolute;
  top: 35px;
}

.animate-in {
  -webkit-animation: 1s ease;
  -moz-animation: 1s ease;
  -ms-animation: 1s ease;
  -o-animation: 1s ease;
  animation: 1s ease;
}

.accent {
  color: #ebbb14 !important;
}

.center {
  text-align: center;
}

/* #Header
================================================== */
header {
  background: rgba(0, 0, 0, 0.7);
  text-align: center;
  padding: 35px 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 5;
  max-height: 89px;
}
header .logo {
  position: absolute;
  top: 26px;
  left: 60px;
  opacity: 0;
}
header nav {
  opacity: 0;
}
header nav ul li {
  display: inline-block;
}
header nav ul li a {
  font-size: 10px;
  color: #fff;
  padding: 10px 25px;
  text-transform: uppercase;
}
header nav ul li a:hover {
  background: #ebbb14;
}
header nav ul li a.current {
  background: #ebbb14;
}
header .menu-toggle {
  position: absolute;
  left: 0;
  right: 0;
}
header .menu-toggle i {
  color: #fff;
  background: #ebbb14;
  padding: 10px 12px;
  display: inline-block;
  cursor: pointer;
}

/* Mobile Nav */
.mobile-nav {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 5;
  display: none;
  text-align: center;
  background: #ebbb14;
  padding: 20px 0;
}
.mobile-nav nav ul li a {
  font-size: 10px;
  color: #fff;
  padding: 10px 20px;
  text-transform: uppercase;
  display: block;
}
.mobile-nav nav ul li a:hover {
  color: #222;
}
.mobile-nav .mobile-toggle {
  position: absolute;
  left: 0;
  right: 0;
}
.mobile-nav .mobile-toggle i {
  color: #fff;
  background: #ebbb14;
  padding: 10px 12px;
  display: inline-block;
  cursor: pointer;
}

/* #Body
================================================== */
.wrapper {
  padding-top: 80px;
}

.service {
  background: #eee;
  padding: 35px 20px;
  text-align: center;
  margin-bottom: 20px;
}
.service h4 {
  letter-spacing: 1px;
  font-size: 18px;
  font-weight: 400;
  color: #545454;
  margin-bottom: 16px;
}
.service p {
  font-size: 12px;
  line-height: 1.6;
}
.service i {
  color: #777;
  font-size: 62px;
  position: relative;
  -webkit-transition: all linear 0.2s;
  -moz-transition: all linear 0.2s;
  -o-transition: all linear 0.2s;
  transition: all linear 0.2s;
}
.service .icon-cont {
  width: 77px;
  height: 77px;
  margin: auto;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  -ms-border-radius: 100px;
  -o-border-radius: 100px;
  border-radius: 100px;
  -webkit-transition: all linear 0.2s;
  -moz-transition: all linear 0.2s;
  -o-transition: all linear 0.2s;
  transition: all linear 0.2s;
}
.service:hover .icon-cont {
  background: #ebbb14;
}
.service:hover i {
  color: #fff;
  font-size: 39px;
  top: 17px;
}

.parallax {
  background-attachment: fixed;
  margin-top: -1px;
}
.parallax h3.title {
  color: #fff;
  font-size: 20px;
}
.parallax .header-line {
  background: #fff;
  top: 33px;
}

.testimonials {
  text-align: center;
  padding: 70px 0;
  width: 900px;
  margin: auto;
}
.testimonials i {
  color: #fff;
  font-size: 62px;
  margin-bottom: 40px;
  display: block;
}
.testimonials p {
  font-size: 15px;
  color: #fff;
  margin-bottom: 30px;
}

.member {
  text-align: center;
}
.member .img-container {
  margin-bottom: 25px;
  position: relative;
  text-align: center;
}
.member .img-container img {
  margin: auto;
}
.member .img-container img, .member .img-container span.follow, .member .img-container ul.social {
  -webkit-transition: all linear .5s;
  -moz-transition: all linear .5s;
  -o-transition: all linear .5s;
  transition: all linear .5s;
}
.member .img-container span.follow {
  position: absolute;
  top: 40%;
  left: 0;
  right: 0;
  color: #777;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  opacity: 0;
}
.member .img-container ul.social {
  list-style: none;
  position: absolute;
  top: 55%;
  left: 0;
  right: 0;
  opacity: 0;
}
.member .img-container ul.social li {
  display: inline-block;
}
.member .img-container ul.social li a {
  font-size: 26px;
  color: #777;
  padding: 0 10px;
}
.member .img-container ul.social li a:hover {
  color: #ebbb14;
}
.member .img-container:hover img {
  opacity: .3;
}
.member .img-container:hover span.follow, .member .img-container:hover ul.social {
  opacity: 1;
}
.member .title-cont {
  margin-bottom: 105px;
}
.member .sub-header {
  font-size: 10px;
  top: 49px;
}
.member .header-line {
  top: 27px;
}
.member p {
  font-size: 14px;
  color: #777;
  padding: 0 35px;
}

.table {
  text-align: center;
  margin-top: 30px;
  -webkit-transition: all linear .2s;
  -moz-transition: all linear .2s;
  -o-transition: all linear .2s;
  transition: all linear .2s;
}
.table:hover {
  margin-top: 10px;
}
.table.popular {
  margin-top: 0;
}
.table.popular:hover {
  margin-top: -20px;
}
.table.popular .plan-cont {
  height: 128px;
}
.table.popular .plan-cont span.pop {
  color: #ebbb14;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 2px;
  display: block;
  position: absolute;
  bottom: 43px;
  left: 0;
  right: 0;
}
.table .price-circle {
  background: #ebbb14;
  width: 94px;
  height: 94px;
  margin: auto;
  position: relative;
  z-index: 1;
  border: 5px solid #fff;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
}
.table .price-circle span {
  display: block;
  color: #fff;
}
.table .price-circle span.price {
	font-size: 35px;
	padding-top: 12px;
}
.table .price-circle span.per {
  font-size: 10px;
  text-transform: uppercase;
}
.table .plan-cont {
  background: #333;
  height: 98px;
  position: relative;
  z-index: 0;
  margin-top: -50px;
}
.table .plan-cont span.plan {
  display: block;
  position: absolute;
  bottom: 15px;
  left: 0;
  right: 0;
  font-size: 17px;
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
}
.table .features {
  padding: 0 30px;
  border: 1px solid #ccc;
}
.table .features ul {
  list-style: none;
}
.table .features ul li {
  font-size: 13px;
  color: #777;
  padding: 20px 0;
  border-bottom: 1px solid #ddd;
}
.table .features ul li:last-child {
  border-bottom: none;
}
.table .signup {
  background: #333;
  padding: 20px 0;
}

.showcase {
  padding: 100px 0;
}

.clients {
  width: 100%;
  background: #222;
  padding: 50px 0;
}
.clients img {
  margin: auto;
}

.contact-info {
  text-align: center;
}
.contact-info ul {
  list-style: none;
}
.contact-info ul li {
  font-size: 14px;
  color: #868686;
  display: inline-block;
  letter-spacing: 2px;
  padding: 0 20px;
}
.contact-info ul li a {
  color: #868686;
}
.contact-info ul li a:hover {
  color: #ebbb14;
}
.contact-info ul li span {
  color: #333;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
}

/* #Portfolio
================================================== */
.portfolio-cont {
  width: 100%;
}
.portfolio-cont .four {
  width: 25%;
}
.portfolio-cont .img-container {
  position: relative;
  text-align: center;
  overflow: hidden;
}
.portfolio-cont .img-container img {
  -webkit-transition: all linear 1s;
  -moz-transition: all linear 1s;
  -o-transition: all linear 1s;
  transition: all linear 1s;
}
.portfolio-cont .img-container .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ebbb14;
  opacity: 0;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  transition: all linear 0.3s;
}
.portfolio-cont .img-container h6 {
  position: absolute;
  top: 40%;
  width: 100%;
  color: #222;
  font-size: 30px;
  font-weight: 400;
  letter-spacing: 1px;
  opacity: 0;
}
.portfolio-cont .img-container h6 a {
  color: #222;
}
.portfolio-cont .img-container span.desc {
  position: absolute;
  top: 56%;
  width: 100%;
  display: block;
  color: #fff;
  opacity: 0;
}
.portfolio-cont .img-container:hover img {
  transform: scale(1.3);
  -ms-transform: scale(1.3);
  -webkit-transform: scale(1.3);
}
.portfolio-cont .img-container:hover h6 {
  opacity: 1;
  -webkit-animation: portH6 .7s;
  animation: portH6 .7s;
}
.portfolio-cont .img-container:hover span.desc {
  opacity: 1;
  -webkit-animation: portDesc .7s;
  animation: portDesc .7s;
}
.portfolio-cont .img-container:hover .mask {
  opacity: .8;
}

.port-filter {
  text-align: center;
  margin-bottom: 60px;
}
.port-filter ul.filter {
  list-style: none;
}
.port-filter ul.filter li {
  display: inline-block;
  color: #666;
  text-transform: uppercase;
  font-size: 12px;
  cursor: pointer;
  padding: 12px 40px;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  transition: all linear 0.3s;
}
.port-filter ul.filter li:hover {
  background: #ebbb14;
  color: #fff;
}
.port-filter ul.filter li.current {
  background: #ebbb14;
  color: #fff;
}

.image-box {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.9);
  z-index: 99999999;
  opacity: 0;
}
.image-box img {
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  top: 50%;
  max-height: 90%;
}
.image-box .close {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 99999999999;
  background: url(../img/close-white.png);
  cursor: pointer;
}

#expander {
  position: fixed;
  background: rgba(0, 0, 0, 0.8);
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: -1;
  opacity: 0;
}
#expander .project {
  width: 73%;
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  background: #fff;
  margin: auto;
}
#expander .project .item-page .view {
  width: 55%;
  float: left;
}
#expander .project .item-page .view .bx-wrapper .bx-prev {
  left: 30px;
  opacity: .2;
}
#expander .project .item-page .view .bx-wrapper .bx-next {
  right: 30px;
  opacity: .2;
}
#expander .project .item-page .view:hover .bx-wrapper .bx-prev {
  opacity: 1;
}
#expander .project .item-page .view:hover .bx-wrapper .bx-next {
  opacity: 1;
}
#expander .project .item-page .details {
  width: 45%;
  float: left;
  padding: 30px 0;
  position: relative;
  overflow: auto;
  text-align: center;
}
#expander .project .item-page .details h2 {
  text-align: center;
  font-size: 24px;
  letter-spacing: 1px;
  margin-bottom: 20px;
}
#expander .project .item-page .details p {
  padding: 0 60px;
  text-align: left;
}
#expander .project .item-page .details .button {
  display: inline-block;
  position: relative;
  top: 0;
  background: #222;
  padding: 15px 50px;
  color: #fff;
  text-transform: uppercase;
  font-size: 13px;
  border-bottom: 4px solid #111;
}
#expander .project .item-page .details .button:hover {
  top: 4px;
  border-color: #222;
}
#expander .project .item-page .details .line {
  height: 1px;
  width: 55%;
  background: #ccc;
  margin: 35px auto;
}
#expander .project .item-page .details h6 {
  text-align: center;
}
#expander .project .item-page .details ul.share {
  margin-top: 15px;
  text-align: center;
  list-style: none;
}
#expander .project .item-page .details ul.share li {
  display: inline-block;
}
#expander .project .item-page .details ul.share li a {
  color: #333;
  font-size: 10px;
  text-transform: uppercase;
  padding: 0 20px;
}
#expander .project .item-page .details ul.share li a:hover {
  color: #ebbb14;
}
#expander .project .close {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 99999999999;
  background: url(../img/close.png);
  cursor: pointer;
}

@keyframes portH6 {
  0% {
    opacity: 0;
    left: 50%;
  }

  85% {
    opacity: 0.7;
    left: 20%;
  }

  100% {
    opacity: 1;
    left: 0px;
  }
}

@-webkit-keyframes portH6 {
  0% {
    opacity: 0;
    left: 50%;
  }

  85% {
    opacity: 0.7;
    left: -5%;
  }

  100% {
    opacity: 1;
    left: 0px;
  }
}

@-moz-keyframes portH6 {
  0% {
    opacity: 0;
    left: 50%;
  }

  85% {
    opacity: 0.7;
    left: -5%;
  }

  100% {
    opacity: 1;
    left: 0px;
  }
}

@keyframes portDesc {
  0% {
    opacity: 0;
    right: 50%;
  }

  85% {
    opacity: 0.7;
    right: 20%;
  }

  100% {
    opacity: 1;
    right: 0px;
  }
}

@-webkit-keyframes portDesc {
  0% {
    opacity: 0;
    right: 50%;
  }

  85% {
    opacity: 0.7;
    right: -5%;
  }

  100% {
    opacity: 1;
    right: 0px;
  }
}

@-moz-keyframes portDesc {
  0% {
    opacity: 0;
    right: 50%;
  }

  85% {
    opacity: 0.7;
    right: -5%;
  }

  100% {
    opacity: 1;
    right: 0px;
  }
}

/* Portfolio Isotope Transitions */
.isotope, .isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  -ms-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  -ms-transition-property: height, width;
  -o-transition-property: height, width;
  transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  -ms-transition-property: -ms-transform, opacity;
  -o-transition-property: -o-transform, opacity;
  transition-property: transform, opacity;
}

.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
  -moz-transition-duration: 0s;
  -ms-transition-duration: 0s;
  -o-transition-duration: 0s;
  transition-duration: 0s;
}

/* #Blog
================================================== */
.blog-header {
  padding: 100px 0;
  margin-bottom: 100px;
}
.blog-header span.title {
  color: #fff;
  font-size: 88px;
  font-weight: bold;
  text-transform: uppercase;
  -webkit-text-stroke: .6;
  display: block;
  text-align: center;
}

.entry {
  width: 100%;
  position: relative;
  margin-bottom: 50px;
}
.entry .title-cont {
  width: 100%;
  padding-bottom: 100px;
  margin-bottom: 0;
  position: relative;
}
.entry .title-cont .title a {
  color: #333;
}
.entry .title-cont .title a:hover {
  color: #ebbb14;
}
.entry .img-container, .entry .video, .entry .blog-slider, .entry .entry-quote {
  position: relative;
}
.entry .img-container .type, .entry .video .type, .entry .blog-slider .type, .entry .entry-quote .type {
  position: absolute;
  width: 70px;
  height: 60px;
  top: -60px;
  left: 0;
  background: #222;
  text-align: center;
}
.entry .img-container .type i, .entry .video .type i, .entry .blog-slider .type i, .entry .entry-quote .type i {
  color: #fff;
  font-size: 28px;
  position: relative;
  top: 13px;
}
.entry .blog-slider .bx-wrapper .bx-prev {
  left: 30px;
  opacity: .2;
}
.entry .blog-slider .bx-wrapper .bx-next {
  right: 30px;
  opacity: .2;
}
.entry .blog-slider:hover .bx-wrapper .bx-prev {
  opacity: 1;
}
.entry .blog-slider:hover .bx-wrapper .bx-next {
  opacity: 1;
}
.entry .entry-quote {
  padding: 35px;
  background: #eee;
}
.entry .entry-quote a {
  font-size: 28px;
  color: #555;
  margin-bottom: 0;
}
.entry .entry-quote a:hover {
  color: #ebbb14;
}
.entry .excerpt {
  background: rgba(0, 0, 0, 0.7);
  width: 90%;
  position: absolute;
  bottom: 0;
  padding: 25px 5%;
  text-align: left;
  opacity: 0;
}
.entry .excerpt p {
  color: #fff;
  font-size: 13px;
}
.entry .info {
  background: #222;
  padding: 25px 0;
  text-align: center;
}
.entry .info ul {
  list-style: none;
}
.entry .info ul li {
  display: inline-block;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  text-transform: uppercase;
  margin-right: 20px;
}
.entry .info ul li a, .entry .info ul li i {
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  text-transform: uppercase;
}
.entry .info ul li a:hover {
  color: #ebbb14;
}
.entry .info ul li i {
  margin-right: 10px;
  font-weight: normal;
  font-size: 16px;
}

.single-post .entry .info {
  margin-bottom: 40px;
}

aside .widget {
  margin-bottom: 55px;
}
aside .widget h4 {
  font-size: 20px;
  color: #333;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 26px;
}
aside .widget ul li {
  background: url(../img/bullet.png) no-repeat 0px 3px;
  padding-left: 20px;
  margin-bottom: 25px;
}
aside .widget ul li, aside .widget ul li a {
  font-size: 13px;
  color: #333;
  text-transform: uppercase;
}
aside .widget ul li a:hover {
  color: #ebbb14;
}
aside .widget.search input {
  top: 0;
  padding-left: 20px;
  background: #eee;
  border: 1px solid #eee;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}
aside .widget.search input:focus {
  background: #fff;
  border-color: #ddd;
}

.blog-nav {
  text-align: center;
  margin-bottom: 20px;
}
.blog-nav a.prev, .blog-nav a.next {
  background: #333333 url(../img/prev-bg.png) no-repeat;
  height: 27px;
  padding-right: 20px;
  padding-left: 29px;
  padding-top: 11px;
  text-align: center;
  display: inline-block;
  color: #fff;
  font-size: 13px;
  text-transform: uppercase;
}
.blog-nav a.prev:hover, .blog-nav a.next:hover {
  color: #ebbb14;
}
.blog-nav a.next {
  background: #333333 url(../img/next-bg.png) no-repeat right;
  height: 27px;
  padding-left: 20px;
  padding-right: 29px;
}

.blog-pager {
  text-align: center;
}
.blog-pager ul {
  text-align: center;
}
.blog-pager ul li {
  display: inline;
}
.blog-pager ul li a {
  color: #333;
  background: #ddd;
  font-size: 10px;
  padding: 12px 15px;
  margin-left: -3px;
}
.blog-pager ul li a:hover {
  color: #ebbb14;
}
.blog-pager ul li a.current {
  background: #333;
  color: #ebbb14;
}

/* Comments */
.comments ul.comment-list li {
  list-style: none;
}
.comments ul.comment-list li .comment-content {
  padding-left: 100px;
  padding-bottom: 50px;
  margin-bottom: 25px;
  position: relative;
}
.comments ul.comment-list li .comment-content .avatar {
  position: absolute;
  top: 0;
  left: 0;
}
.comments ul.comment-list li .comment-content h6 {
  font-weight: 400;
  font-size: 14px;
  margin-bottom: 7px;
}
.comments ul.comment-list li .comment-content span.date {
  text-transform: uppercase;
  font-size: 10px;
  color: #999;
  margin-bottom: 10px;
  display: block;
}
.comments ul.comment-list li .comment-content a.reply {
  font-size: 11px;
  text-transform: uppercase;
  position: absolute;
  color: #999;
  top: 0;
  right: 0;
}
.comments ul.comment-list li .comment-content a.reply:hover {
  color: #ebbb14;
}
.comments ul.comment-list li ul.children {
  width: 94%;
  float: right;
  margin-bottom: 0;
}

/* #Footer
================================================== */
footer {
  width: 100%;
  background: #222;
  text-align: center;
  padding: 50px 0;
  overflow: hidden;
}
footer ul.social {
  margin-bottom: 20px;
  opacity: 1;
}
footer ul.social li {
  display: inline-block;
}
footer ul.social li a i {
  background: #111;
  display: block;
  color: #666;
  font-size: 20px;
  padding: 10px;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}
footer ul.social li a i:hover {
  color: #ebbb14;
}
footer .copy span {
  color: #666;
  font-size: 10px;
  text-transform: uppercase;
}

/* #Forms & Fields
================================================== */
.input-box {
  display: block;
  margin-bottom: -33px;
}

label {
  display: inline-block;
  background: #222;
  color: #ebbb14;
  width: 108px;
  text-align: center;
  padding: 20px 0;
  font-size: 14px;
  text-transform: uppercase;
  position: relative;
  z-index: 1;
}

input {
  height: 56px;
}

input, textarea {
  width: 100%;
  padding-left: 120px;
  border: none;
  background: #ddd;
  display: inline-block;
  font-size: 14px;
  font-family: Montserrat, sans-serif;
  color: #666;
  position: relative;
  top: -58px;
  z-index: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
input:focus, textarea:focus {
  outline: none;
}

textarea {
  min-height: 250px;
  padding-top: 20px;
  margin-top: -1px;
}

.contact-form .button {
  display: block;
  text-align: center;
}

.alert {
  display: none;
  padding: 4px;
  font-size: 11px;
  margin-bottom: 10px;
}

/* #Buttons
================================================== */
.button {
  display: inline-block;
  position: relative;
  top: 0;
  background: #ebbb14;
  padding: 20px 60px;
  color: #fff;
  text-transform: uppercase;
  font-size: 13px;
  border-bottom: 4px solid #c59d11;
}
.button.small {
  padding: 15px 25px;
}
.button:hover {
  top: 4px;
  border-color: #ebbb14;
}

/* #Toggle & Tabs
================================================== */
/* #Slider
================================================== */
#slides .slides-container {
  display: none;
}
#slides .slides-container li .content {
  position: relative;
  top: 38%;
}
#slides .slides-container li .content span.title {
  color: #fff;
  font-weight: 700;
  font-size: 72px;
  text-transform: uppercase;
  text-align: center;
  position: relative;
  display: block;
  max-width: 1180px;
  margin: auto;
  margin-bottom: 25px;
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.7);
  -webkit-text-stroke: 0.6px;
}
#slides .slides-container li .content span.sub-title {
	text-transform: uppercase;
	text-align: center;
	color: #eee;
	font-size: 18px;
	position: relative;
	display: block;
	text-shadow: 2px 2px 6px rgba(0,0,0,0.90);
	-webkit-text-stroke: 0.6px;
}

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

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

.slides-navigation a {
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
  border-radius: 5px;
  display: block;
  text-decoration: none;
  color: #fff;
  font-size: 10px;
  margin: 0 25px;
  text-align: center;
  text-transform: uppercase;
  top: -40px;
  padding: 10px;
  opacity: .4;
  background: #222;
  -webkit-box-shadow: 0 1px 1px black;
  -moz-box-shadow: 0 1px 1px black;
  box-shadow: 0 1px 1px black;
  -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;
  }
}
/* #Misc.
================================================== */
/* Scrollbar */
.nicescroll-rails {
  cursor: pointer !important;
  z-index: 200000 !important;
}

/* Scroll to top */
#back-top {
  display: none;
  position: fixed;
  z-index: 1003;
  bottom: 30px;
  right: 50px;
  background: #111;
  cursor: pointer;
  color: #fff;
  padding: 10px;
  font-size: 10px;
  text-transform: uppercase;
}

/* Back to Home */
.back-to-home, .back-to-blog {
  position: fixed;
  top: 50px;
  left: 0;
  z-index: 55555555;
}
.back-to-home a, .back-to-blog a {
  background: #ebbb14;
  color: #222;
  font-size: 10px;
  font-family: Arial;
  font-style: italic;
  padding: 15px 25px;
}
.back-to-home a:hover, .back-to-blog a:hover {
  background: #222;
  color: #ebbb14;
}
.back-to-home a i, .back-to-blog a i {
  padding-right: 5px;
}

.back-to-blog {
  top: 100px;
}

/* FitVids */
.fit-vids-style {
  display: none;
}

/* Skills */
.skills {
  position: relative;
  padding-top: 30px;
}
.skills span.skill {
  margin-bottom: 80px;
  height: 5px;
  display: block;
}
.skills span.skill:last-child {
  margin-bottom: 0;
}
.skills span.skill em {
  position: relative;
  color: #222;
  font-size: 12px;
  text-transform: uppercase;
  top: -30px;
}

.expand {
  height: 32px;
  margin: 2px 0;
  background: #ebbb14;
  position: absolute;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  -ms-border-radius: 100px;
  -o-border-radius: 100px;
  border-radius: 100px;
}

span.number {
  background: #222;
  color: #ebbb14;
  padding: 8px 20px;
  padding-bottom: 9px;
  font-size: 12px;
  position: absolute;
  right: 0;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  -ms-border-radius: 100px;
  -o-border-radius: 100px;
  border-radius: 100px;
}

.jquery {
	width: 100%;
}

.responsive {
  width: 90%;
}

.php {
  width: 67%;
}

.htmlcss {
	width: 100%;
}

.beer {
  width: 100%;
}

.other {
  width: 50%;
}

/* Maps */
#gmap {
  height: 427px;
}
#gmap img {
  max-width: none !important;
}

/* Twitter */
.twitter {
  padding: 100px 10%;
  text-align: center;
  /* DIRECTION CONTROLS (NEXT / PREV) */
}
.twitter span.twitter-handle {
  color: #fff;
  font-size: 16px;
  display: block;
  margin-bottom: 30px;
}
.twitter span.tweet_text {
  font-size: 24px;
  font-weight: 700;
  color: #fff;
}
.twitter span.tweet_text a {
  color: #ebbb14;
}
.twitter span.tweet_text a:hover {
  color: #999;
}
.twitter i {
  color: #ebbb14;
  display: block;
  font-size: 46px;
  margin-top: 35px;
}
.twitter .bx-wrapper .bx-prev:before {
  font-family: 'IcoMoon';
  content: "\e126";
  color: #ebbb14;
  font-size: 20px;
  background: rgba(0, 0, 0, 0.3);
  padding: 10px;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  transition: all linear 0.3s;
}
.twitter .bx-wrapper .bx-next:before {
  font-family: 'IcoMoon';
  content: "\e122";
  color: #ebbb14;
  font-size: 20px;
  background: rgba(0, 0, 0, 0.3);
  padding: 10px;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  transition: all linear 0.3s;
}
.twitter .bx-wrapper .bx-prev {
  background: none;
}
.twitter .bx-wrapper .bx-prev:hover:before {
  background: rgba(0, 0, 0, 0.8);
}
.twitter .bx-wrapper .bx-next {
  background: none;
}
.twitter .bx-wrapper .bx-next:hover:before {
  background: rgba(0, 0, 0, 0.8);
}
.twitter .bx-wrapper .bx-controls-direction a {
  position: relative;
  top: 0;
  z-index: 9999;
  margin: 0 11px;
}
.twitter .bx-wrapper .bx-controls-direction a.disabled {
  display: none;
}
.twitter .bx-wrapper .bx-controls {
  margin-top: 30px;
}

/* Pre Loader */
#pre-loader {
  background: black url(../img/loading.gif) no-repeat 50% 50%;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999999;
}

/* #Base 1200 Grid
================================================== */
.columns, .column {
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.cc .columns {
  clear: left;
}

.container {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 0;
}
.container .column, .container .columns {
  float: left;
  display: inline;
  margin-left: 15px;
  margin-right: 15px;
}

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

.spacer {
  padding: 40px 0;
}

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

.row {
  margin-bottom: 20px;
}

.bottom {
  padding-bottom: 50px;
}

/* Nested Column Classes */
.column.alpha, .columns.alpha {
  margin-left: 0;
}

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

/* Base Grid */
.container .one.column, .container .one.columns {
  width: 45px;
}
.container .two.columns {
  width: 110px;
}
.container .three.columns {
  width: 195px;
}
.container .four.columns {
  width: 270px;
}
.container .five.columns {
  width: 345px;
}
.container .six.columns {
  width: 420px;
}
.container .seven.columns {
  width: 495px;
}
.container .eight.columns {
  width: 570px;
}
.container .nine.columns {
  width: 645px;
}
.container .ten.columns {
  width: 720px;
}
.container .eleven.columns {
  width: 795px;
}
.container .twelve.columns {
  width: 870px;
}
.container .thirteen.columns {
  width: 945px;
}
.container .fourteen.columns {
  width: 1020px;
}
.container .fifteen.columns {
  width: 1095px;
}
.container .sixteen.columns {
  width: 1170px;
}
.container .one-third.column {
  width: 370px;
}
.container .two-thirds.column {
  width: 770px;
}
.container .offset-by-one {
  padding-left: 40px;
}
.container .offset-by-two {
  padding-left: 90px;
}
.container .offset-by-three {
  padding-left: 140px;
}
.container .offset-by-four {
  padding-left: 190px;
}
.container .offset-by-five {
  padding-left: 240px;
}
.container .offset-by-six {
  padding-left: 290px;
}
.container .offset-by-seven {
  padding-left: 340px;
}
.container .offset-by-eight {
  padding-left: 390px;
}
.container .offset-by-nine {
  padding-left: 440px;
}
.container .offset-by-ten {
  padding-left: 490px;
}
.container .offset-by-eleven {
  padding-left: 540px;
}
.container .offset-by-twelve {
  padding-left: 590px;
}
.container .offset-by-thirteen {
  padding-left: 640px;
}
.container .offset-by-fourteen {
  padding-left: 690px;
}
.container .offset-by-fifteen {
  padding-left: 740px;
}
.container:after {
  content: "\0020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* Offsets */
/* Note: Design for a width 1024 Desktop
================================================== */
@media only screen and (min-width: 960px) and (max-width: 1199px) {
  /* Base Grid */
  .container {
    width: 960px;
  }
  .container .one.column, .container .one.columns {
    width: 30px;
  }
  .container .two.columns {
    width: 90px;
  }
  .container .three.columns {
    width: 150px;
  }
  .container .four.columns {
    width: 210px;
  }
  .container .five.columns {
    width: 270px;
  }
  .container .six.columns {
    width: 330px;
  }
  .container .seven.columns {
    width: 390px;
  }
  .container .eight.columns {
    width: 450px;
  }
  .container .nine.columns {
    width: 510px;
  }
  .container .ten.columns {
    width: 570px;
  }
  .container .eleven.columns {
    width: 630px;
  }
  .container .twelve.columns {
    width: 690px;
  }
  .container .thirteen.columns {
    width: 750px;
  }
  .container .fourteen.columns {
    width: 810px;
  }
  .container .fifteen.columns {
    width: 870px;
  }
  .container .sixteen.columns {
    width: 930px;
  }
  .container .one-third.column {
    width: 290px;
  }
  .container .two-thirds.column {
    width: 610px;
  }
  .container .offset-by-one {
    padding-left: 50px;
  }
  .container .offset-by-two {
    padding-left: 110px;
  }
  .container .offset-by-three {
    padding-left: 170px;
  }
  .container .offset-by-four {
    padding-left: 230px;
  }
  .container .offset-by-five {
    padding-left: 290px;
  }
  .container .offset-by-six {
    padding-left: 350px;
  }
  .container .offset-by-seven {
    padding-left: 410px;
  }
  .container .offset-by-eight {
    padding-left: 470px;
  }
  .container .offset-by-nine {
    padding-left: 530px;
  }
  .container .offset-by-ten {
    padding-left: 590px;
  }
  .container .offset-by-eleven {
    padding-left: 650px;
  }
  .container .offset-by-twelve {
    padding-left: 710px;
  }
  .container .offset-by-thirteen {
    padding-left: 770px;
  }
  .container .offset-by-fourteen {
    padding-left: 830px;
  }
  .container .offset-by-fifteen {
    padding-left: 890px;
  }

  /* Offsets */
  header .logo {
    display: none;
  }
}
.testimonials {
  width: 800px;
}

@media only screen and (max-width: 960px) {
  .testimonials {
    width: 80%;
  }

  .portfolio-cont .img-container h6 {
    font-size: 14px;
  }

  .portfolio-cont .img-container span.desc {
    font-size: 12px;
  }

  #expander .project {
    width: 100%;
  }

  header .logo {
    display: none;
  }
}
/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {
  .container {
    width: 768px;
  }
  .container .one.column, .container .one.columns {
    width: 18px;
  }
  .container .two.columns {
    width: 66px;
  }
  .container .three.columns {
    width: 114px;
  }
  .container .four.columns {
    width: 162px;
  }
  .container .five.columns {
    width: 210px;
  }
  .container .six.columns {
    width: 258px;
  }
  .container .seven.columns {
    width: 306px;
  }
  .container .eight.columns {
    width: 354px;
  }
  .container .nine.columns {
    width: 402px;
  }
  .container .ten.columns {
    width: 450px;
  }
  .container .eleven.columns {
    width: 498px;
  }
  .container .twelve.columns {
    width: 546px;
  }
  .container .thirteen.columns {
    width: 594px;
  }
  .container .fourteen.columns {
    width: 642px;
  }
  .container .fifteen.columns {
    width: 690px;
  }
  .container .sixteen.columns {
    width: 738px;
  }
  .container .one-third.column {
    width: 226px;
  }
  .container .two-thirds.column {
    width: 482px;
  }
  .container .offset-by-one {
    padding-left: 38px;
  }
  .container .offset-by-two {
    padding-left: 86px;
  }
  .container .offset-by-three {
    padding-left: 134px;
  }
  .container .offset-by-four {
    padding-left: 182px;
  }
  .container .offset-by-five {
    padding-left: 230px;
  }
  .container .offset-by-six {
    padding-left: 278px;
  }
  .container .offset-by-seven {
    padding-left: 326px;
  }
  .container .offset-by-eight {
    padding-left: 374px;
  }
  .container .offset-by-nine {
    padding-left: 422px;
  }
  .container .offset-by-ten {
    padding-left: 470px;
  }
  .container .offset-by-eleven {
    padding-left: 518px;
  }
  .container .offset-by-twelve {
    padding-left: 566px;
  }
  .container .offset-by-thirteen {
    padding-left: 614px;
  }
  .container .offset-by-fourteen {
    padding-left: 662px;
  }
  .container .offset-by-fifteen {
    padding-left: 710px;
  }

  /* Offsets */
  #slides .slides-container li .content span.title {
    font-size: 50px;
  }

  #slides .slides-container li .content span.sub-title {
    font-size: 14px;
  }
}
/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {
  .container {
    width: 300px;
  }
  .container .columns, .container .column {
    margin: 0;
    margin-bottom: 40px !important;
  }
  .container .one.column, .container .one.columns {
    width: 300px;
  }
  .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: 300px;
  }
  .container .offset-by-one, .container .offset-by-two, .container .offset-by-three, .container .offset-by-four, .container .offset-by-five, .container .offset-by-six, .container .offset-by-seven, .container .offset-by-eight, .container .offset-by-nine, .container .offset-by-ten, .container .offset-by-eleven, .container .offset-by-twelve, .container .offset-by-thirteen, .container .offset-by-fourteen, .container .offset-by-fifteen {
    padding-left: 0;
  }

  /* Offsets */
  #slides .slides-container li .content span.title {
    font-size: 50px;
  }

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

  h3 {
    font-size: 14px;
  }

  .header-line {
    top: 28px;
  }

  .sub-header {
    font-size: 10px;
  }

  .portfolio-cont .four {
    width: 50%;
  }

  header {
    display: none;
  }

  .mobile-nav {
    display: block;
  }

  .entry .excerpt {
    display: none !important;
  }
}
/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .container {
    width: 370px;
  }
  .container .columns, .container .column {
    margin: 0;
  }
  .container .one.column, .container .one.columns {
    width: 370px;
  }
  .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: 370px;
  }
}
@media only screen and (max-width: 479px) {
  #slides .slides-container li .content {
    top: 27%;
  }

  #expander .project .item-page .view {
    width: 100%;
  }

  #expander .project .item-page .details {
    width: 100%;
  }
}
/* #Clearing
================================================== */
/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before, .clearfix:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.row:before {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
  clear: both;
}

.clearfix:after {
  clear: both;
}

.row, .clearfix {
  zoom: 1;
}

/* You can also use a <br class="clear" /> to clear columns */
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}