﻿
/* styles/base/variables.scss */


/* styles/base/fonts.css */
@font-face {
  font-family: 'frontend';
  src: url('https://static.cmcdn.net/kits/142/fonts/frontend/frontend.woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'social';
  src: url('https://static.cmcdn.net/kits/140/fonts/social/social.woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'thumbs';
  src: url('../fonts/thumbs.woff');
  font-weight: normal;
  font-style: normal;
}


/* styles/base/base.scss */
body.dark { -webkit-font-smoothing: antialiased; }
html {
  height: 100%;
  font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
}
body {
  background: #1c1c1c;
  color: #C3C3C3;
  font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
  text-align: center;
  margin: 0;
  width: 100%;
  height: 100%;
  min-height: 100%;
  text-align: center;
  padding: 0;
}
h1,
h2,
h3,
h4,
h5 {
  font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
  margin: 0;
  padding: 0;
  font-weight: normal;
}
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
textarea {
  padding: 0;
  margin: 0;
}
img { height: auto; }
iframe { width: 100%; }
a {
  color: #00AEEF;
  text-decoration: none;
}
a.topLink {
  display: inline-block;
  margin-bottom: 0 !important;
}
a.topLink svg {
  stroke-width: 4px;
  width: 40px;
  height: 40px;
  stroke: #fff;
}
h1 { font-size: 20px; }
header a { color: #C3C3C3; }
#list h1 {
  font-size: 20px;
  margin: 30px 0;
  padding-right: 10px;
  padding-left: 10px;
  padding-bottom: 5px;
  -webkit-font-smoothing: antialiased;
}
input,
textarea { font-family: Helvetica, Arial, "Lucida Grande", sans-serif; }
body.dark input,
body.dark textarea { -webkit-font-smoothing: antialiased; }
hr {
  border: 0;
  height: 0;
  border-top: 1px solid rgba(255, 255, 255, .05);
  border-bottom: none;
}
.userContent .row {
  margin: 0 10px;
  border-bottom: solid 1px rgba(255, 255, 255, 0.05);
  padding: 20px 8px 10px;
  text-align: left;
  display: block;
}
.userContent p {
  font-size: 14px;
  line-height: 22px;
}
.userContent ol,
.userContent ul {
  list-style: inherit;
  list-style-position: inside;
}
.userContent h4 {
  font-size: 14px;
  color: rgba(242, 242, 242, 0.25);
}
.userContent a,
.aboutContent a {
  padding: 0 0 .1em 0;
  color: #fcfcfc;
  border-bottom: 1px solid rgba(252, 252, 252, 0.3);
}
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) {
  body {
    margin: 0;
    padding: 0;
  }
}

/* styles/base/buttons.scss */
button,
.button,
a.button {
  display: inline-block;
  height: 56px;
  line-height: 56px;
  padding: 0 25px;
  margin: 0 0 0 5px;
  font: 22px Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #fff;
  text-decoration: none;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: background-color 0.03s ease-in, color 0.03s ease-in, border 0.03s ease-in;
  transition: background-color 0.03s ease-in, color 0.03s ease-in, border 0.03s ease-in;
  -webkit-font-smoothing: antialiased;
}
.button i {
  margin: 0 10px 0 0;
  font: normal 18px 'talent';
}
.button { background: #5CBAFC; }
.button:hover { background: #4BABEF; }
.button:active { background: #3F92CD; }
.button:disabled {
  opacity: .3;
  cursor: default;
  color: rgba(255, 255, 255, .7);
}
.button.disabled {
  opacity: .3;
  cursor: default;
  color: rgba(255, 255, 255, .7);
}
.button:disabled:hover { background: #5CBAFC; }
.button.disabled:hover { background: #5CBAFC; }
.button.contact {
  display: block;
  position: relative;
  height: 38px;
  line-height: 38px;
  width: 38px;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.15);
}
.button.contact:before {
  display: block;
  font: 16px 'thumbs';
  content: "\e045";
  color: #fff;
  height: 38px;
  line-height: 38px;
  width: 38px;
}
.button.contact:hover { background-color: rgba(0, 0, 0, 0.2); }

/* styles/base/utility.scss */
.utility {
  height: 100%;
  font-size: 18px !important;
  line-height: 1.65 !important;
  text-align: center !important;
}
.utility .centerWrap {
  display: table;
  width: 100%;
  height: 60%;
}
.utility .centered {
  display: table-cell;
  vertical-align: middle;
}
.utility #wrapper {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.utility h1 {
  font-size: 1.6em !important;
  margin-bottom: 1.2em !important;
}

/* styles/components/player.scss */
@font-face {
  font-family: 'player';
  src: url('https://static.cmcdn.net/kits/106/fonts/player/player.woff');
  font-weight: normal;
  font-style: normal;
}
carbon-player {
  display: block;
  position: relative;
  top: 0;
  background: #000;
  width: 100%;
  height: 100%;
  -webkit-user-select: none;
  user-select: none;
  font-family: 'player';
}
carbon-player.audio { background: none; }
carbon-player.standard {
  width: 768px;
  height: 432px;
}
carbon-player.big {
  width: 960px;
  height: 540px;
}
carbon-player.hd {
  width: 1280px;
  height: 720px;
}
carbon-player.fullscreen {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
}
carbon-player > video,
carbon-player > audio {
  position: absolute;
  width: 100%;
  height: 100%;
  cursor: pointer;
  top: 0;
  left: 0;
  visibility: hidden;
}
carbon-player.played > video { visibility: visible; }
video::-webkit-media-controls-panel { display: none; }
carbon-player > .fallback {
  position: absolute;
  display: none;
  width: 100%;
  height: 100%;
  cursor: pointer;
  background: #000;
  color: #fff;
  text-align: center;
}
carbon-player.fallback > .fallback { display: block; }
carbon-player.fallback > .fallback > h2 { margin-top: 20%; }
carbon-player > .posterPlay {
  position: absolute;
  width: 136px;
  height: 136px;
  top: 50%;
  left: 50%;
  margin: -68px 0 0 -68px;
  background: rgba(0, 0, 0, .1);
  cursor: pointer;
  opacity: 1;
  border-radius: 50%;
  z-index: 5;
  text-align: center;
  font-size: 136px;
  line-height: 136px;
  text-indent: 2px;
  color: #fff;
  -webkit-transition: background 0.2s, opacity 0.2s;
  transition: background 0.2s, opacity 0.2s;
}
carbon-player > .posterPlay:before { content: '\e600'; }
carbon-player > .posterPlay:hover { background: rgba(0, 0, 0, .15); }
carbon-player:hover > .posterPlay { background: rgba(0, 0, 0, .15); }
carbon-player.played > .posterPlay { display: none; }
carbon-player > .poster,
carbon-player > .artwork,
carbon-player > .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
carbon-player > .poster,
carbon-player > .artwork {
  background-color: #000;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
carbon-player > .poster {
  z-index: 1;
  cursor: pointer;
}
carbon-player.played > .poster { display: none; }
carbon-player > .overlay { background: linear-gradient(to bottom, rgba(10, 10, 10, .05) 40%, rgba(10, 10, 10, 0.5) 100%); }
carbon-player .control {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-size: 50px;
  color: #fff;
  line-height: 50px;
  cursor: pointer;
  background: rgba(26, 26, 26, .2);
  -webkit-transition: background 0.2s;
  transition: background 0.2s;
}
carbon-player .control:hover { background: rgba(115, 207, 203, 0.8); }
carbon-player > carbon-controls {
  display: block;
  position: relative;
  opacity: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  -webkit-transition: opacity .3s;
  transition: opacity .3s;
}
carbon-player.played.hovering > carbon-controls,
carbon-player.played.scrubbing > carbon-controls { opacity: 1; }
carbon-player.played.hoverIdle > carbon-controls { opacity: 0; }
carbon-player.audio > carbon-controls,
carbon-player.audio.played.hoverIdle > carbon-controls { opacity: 1; }
carbon-player > carbon-controls .box {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 50px;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
}
carbon-player.scrubbing > carbon-controls > .box,
carbon-player.scrubbing > carbon-controls > .playToggle { opacity: 0; }
carbon-player.fullscreen > carbon-controls > .box { bottom: 9%; }
carbon-player.hoveringTrack > carbon-controls > .box,
carbon-player.hoveringTrack > carbon-controls > .playToggle { opacity: 0; }
carbon-player .playToggle {
  position: absolute;
  left: 20px;
  bottom: 20px;
  opacity: 0;
  -webkit-transition: opacity 0.2s, background 0.2s;
  transition: opacity 0.2s, background 0.2s;
}
carbon-player .playToggle:before { content: '\e600'; }
carbon-player.hovering .playToggle { opacity: 1; }
carbon-player.playing .playToggle:before { content: '\e601'; }
carbon-player.audio .playToggle { opacity: 1 !important; }
carbon-player carbon-scrubber {
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 12px;
  z-index: 5;
}
carbon-player carbon-scrubber > .track {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 6px;
  background: rgba(255, 255, 255, 0.15);
  left: 0;
  cursor: pointer;
  -webkit-transition: height 0.2s;
  transition: height 0.2s;
}
carbon-player carbon-scrubber:hover > .track { height: 12px; }
carbon-player.waiting carbon-scrubber > .track { background: url('https://static.cmcdn.net/kits/124/player2/images/buffering.gif'); }
carbon-player.waiting.scrubbing carbon-scrubber > .track { background: none; }
@-webkit-keyframes bufferAnimation {
  0% { opacity: 1; }
  50% { opacity: .6; }
  100% { opacity: 1; }
}
@keyframes bufferAnimation {
  0% { opacity: 1; }
  50% { opacity: .6; }
  100% { opacity: 1; }
}
carbon-player.loading .playToggle {
  -webkit-animation: bufferAnimation 2s infinite;
  animation: bufferAnimation 2s infinite;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}
carbon-player carbon-scrubber > .track > .bufferedBar,
carbon-player carbon-scrubber > .track > .playedBar {
  position: absolute;
  left: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
  height: 100%;
  bottom: 0;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  -webkit-transition: border-radius 0.1s;
  transition: border-radius 0.1s;
}
carbon-player carbon-scrubber > .track > .playedBar { background: #74CFCB; }
carbon-player carbon-scrubber > .track > .playedBar.end,
carbon-player carbon-scrubber > .track > .bufferedBar.end {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
carbon-player time {
  position: absolute;
  color: rgba(255, 255, 255, .75);
  text-rendering: optimizeLegibility;
  font-size: 12px;
  cursor: default;
  text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
  bottom: 14px;
  opacity: 0;
}
carbon-player time.total {
  right: 0;
  -webkit-transition: color .2s;
  transition: color .2s;
}
carbon-player time.current {
  left: 0;
  -webkit-transition: opacity 0.2s, color 10s;
  transition: opacity 0.2s, color 10s;
}
carbon-player carbon-scrubber:hover > time.current,
carbon-player.scrubbing carbon-scrubber > time.total { opacity: 1; }
carbon-player.video time.total { display: none; }
carbon-player.audio time.current,
carbon-player.audio time.total {
  bottom: 0px;
  opacity: 1 !important;
}
carbon-player.audio time.current { left: 0 !important; }
carbon-player .muteToggle {
  display: inline-block;
  background: rgba(26, 26, 26, .2);
}
carbon-player .muteToggle:before { content: '\e604'; }
carbon-player.muted .muteToggle:before { content: '\e605'; }
carbon-player .fullscreenToggle {
  display: inline-block;
  display: none;
  margin-bottom: 10px;
}
carbon-player .fullscreenToggle:before { content: '\e602'; }
carbon-player.fullscreen .fullscreenToggle:before { content: '\e603'; }
carbon-player.supportsFullscreen .fullscreenToggle { display: block; }
carbon-player.hoverIdle * { cursor: none; }
carbon-waveform {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: .8;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}
carbon-waveform > .bar {
  position: absolute;
  bottom: 0;
  background: rgba(255, 255, 255, .75);
  -webkit-transition: background 2s linear;
  transition: background 2s linear;
}
carbon-waveform > .bar.fill { background: #91E6D7; }
carbon-player.hoveringTrack carbon-waveform > .bar {
  -webkit-transition: none !important;
  transition: none !important;
}
carbon-player.playing carbon-waveform,
carbon-player.hoveringTrack carbon-waveform { opacity: 1; }
carbon-controls,
carbon-waveform { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
carbon-player.audio .playToggle {
  background: rgba(145, 230, 215, 0.75);
  left: 3.125%;
  bottom: 30px;
  -webkit-transition: background 0.2s;
  transition: background 0.2s;
}
carbon-player.audio carbon-scrubber {
  position: absolute;
  width: calc(93.75% - 65px);
  height: 50px;
  left: calc(3.125% + 65px);
  bottom: 25px;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
}
carbon-waveform { bottom: 20px; }
.collapsed {
  max-height: 90px;
  height: 90px;
}
.collapsed carbon-player.audio .playToggle { bottom: 5px; }
.collapsed carbon-player.audio carbon-scrubber { bottom: 0px; }

/* styles/parts/header.scss */
#header {
  display: block;
  height: 110px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  width: 100%;
}
#header .inner {
  display: block;
  padding: 32px 40px;
  word-wrap: break-word;
}
#header ul { display: none; }
h1.logo {
  padding: 0 auto;
  text-indent: 100%;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  margin: 0 auto;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* styles/parts/nav.scss */
.navLink {
  position: absolute;
  display: block;
  top: 10px;
  right: 10px;
  width: 50px;
  height: 50px;
  padding: 1px 0 0 2px;
  z-index: 101;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.navLink span {
  display: block;
  height: 30px;
  width: 30px;
  float: right;
}
.navLink i {
  display: block;
  width: 25px;
  height: 3px;
  background-color: #fff;
  opacity: 0.2;
  border-radius: 2px;
  margin: 4px 0;
}
body > .overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 6;
  -webkit-transition: opacity 0.3s, visibility 0s 0.3s;
  transition: opacity 0.3s, visibility 0s 0.3s;
  background-image: linear-gradient(to top, rgba(28, 28, 28, 0.9), rgba(28, 28, 28, 1));
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s, visibility 0s 0.3s;
  transition: opacity 0.3s, visibility 0s 0.3s;
}
body > .overlay nav {
  text-align: center;
  position: relative;
  top: 50%;
  height: 80%;
  font-size: 34px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-perspective: 1200px;
  perspective: 1200px;
}
body > .overlay nav ul li a {
  opacity: .5;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  display: table-cell;
  vertical-align: middle;
}
body > .overlay nav ul li.active a { opacity: 1; }
body > .overlay nav ul li {
  display: table-row;
  min-height: 54px;
  margin: 0 auto;
}
body > .overlay nav ul {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: table;
  height: 100%;
  position: relative;
  opacity: 0.4;
  -webkit-transform: translateY(-25%) rotateX(35deg);
  transform: translateY(-25%) rotateX(35deg);
  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
  transition: transform 0.3s, opacity 0.3s;
}
body > .overlay a {
  color: #f2f2f2;
  text-decoration: none;
}
.openNav .overlay nav ul {
  opacity: 1;
  -webkit-transform: rotateX(0deg);
  transform: rotateX(0deg);
}
.openNav .overlay {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

/* styles/parts/footer.scss */
footer {
  margin: 20px 10px;
  text-align: center;
  padding-bottom: 20px;
}
footer a {
  color: #C3C3C3;
  border-bottom: 1px solid #333;
  -webkit-transition: color .2s ease, border-bottom .2s ease;
  transition: color .2s ease, border-bottom .2s ease;
}
footer p,
footer carbon-branding {
  font-size: 10px;
  line-height: 1.4em;
  margin: 0;
}
footer carbon-branding a { border-bottom: none !important; }
carbon-branding carbon-glyph {
  position: relative;
  font: 20px / 0 'frontend';
  top: 5px;
  margin: 0 -4px;
}
body.light footer #rights { color: #999; }
body.light footer a {
  color: #333;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
body.light footer #rights a {
  color: #333;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  -webkit-transition: color .2s ease, border-bottom .2s ease;
  transition: color .2s ease, border-bottom .2s ease;
}

/* styles/parts/post.scss */
article {
  position: relative;
  max-width: 640px;
  margin: 0 auto 6em;
  text-align: center;
  font-size: 0.75em;
  line-height: 1.6;
}
article carbon-grid {
  display: block;
  position: relative;
}
article > .body { font-size: 1rem; }
article > .header,
article > .body,
article > .tags {
  max-width: 460px;
  margin: 1.5em auto;
}
article > .tags > a:hover { opacity: 1; }
article > .tags > a.tag:before { opacity: 0.4; }
article > .tags > a {
  opacity: 0.8;
  margin: 0 .15em;
  border-bottom: none !important;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}

/* styles/parts/paginator.scss */
carbon-paginator {
  max-width: 960px;
  margin: 0 auto;
}
carbon-paginator .prev { float: left; }
carbon-paginator .next { float: right; }

/* styles/pages/home.scss */
#projects h3 {
  font-size: 20px;
  color: #fff;
  margin-bottom: 0px;
  text-shadow: 0px 1px 2px rgba(0, 0, 0, .4);
  -webkit-font-smoothing: antialiased;
}
#projects p {
  color: white;
  font-size: 16px;
  margin-top: 0;
}
ul#projects {
  padding: 0;
  margin: 10px;
}
ul#projects.oneUp .thumbnail:after {
  padding-top: 17.9%;
  display: block;
  content: '';
}
ul#projects.twoUp .thumbnail:after {
  padding-top: 37.3%;
  display: block;
  content: '';
}
ul#projects.threeUp .thumbnail:after {
  padding-top: 58.3%;
  display: block;
  content: '';
}
ul#projects > .project > h3 {
  padding: 10px;
  font-size: 18px;
}
ul#projects > .project > .thumbnail > .info > .inner h3 { width: 100%; }
ul#projects > .project > .thumbnail > .info > .inner {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 100%;
}
ul#projects > .project > .thumbnail > .info {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 5px;
}
ul#projects > .project > .thumbnail {
  position: relative;
  display: block;
  width: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 5px;
}
ul#projects > .project {
  display: block;
  width: 100%;
  position: relative;
  margin: 0 0 10px;
  -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, .08);
  box-shadow: 0px 0px 2px rgba(0, 0, 0, .08);
  border-radius: 5px;
}
.newBug {
  display: block;
  position: absolute;
  width: 50px;
  height: 50px;
  top: 0;
  right: 0;
  border-radius: 5px;
  overflow: hidden;
}
.newBug i:after {
  font: normal 16px 'frontend';
  content: '\e003';
  color: white;
  position: relative;
  top: 6px;
}
.newBug i {
  display: block;
  position: absolute;
  top: -8px;
  right: -23px;
  width: 50px;
  height: 20px;
  background-color: #1DAFEC;
  text-align: center;
  padding: 8px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* styles/pages/about.scss */
.aboutContent .row {
  margin: 0;
  color: rgba(255, 255, 255, 1);
  border-bottom: solid 1px rgba(255, 255, 255, 0.05);
  padding: 20px 8px 10px;
}
.aboutHead {
  margin: -1px 0 0;
  background: rgba(255, 255, 255, 0.05);
}
.aboutHead .inner {
  padding: 20px 0;
  margin: 0 auto;
  background-size: cover;
  background-position: center;
}
.aboutHead .gradient { background: none; }
.aboutHead.hasCover .gradient {
  background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.6));
  margin-bottom: -20px;
  margin-top: -20px;
  padding-top: 20px;
  padding-bottom: 20px;
}
.aboutHead .userPic {
  float: none;
  margin: 0 auto 5px;
  height: 100px;
  width: 100px;
  border: 10px solid rgba(255, 255, 255, 1);
  background-color: rgba(255, 255, 255, 1);
  border-radius: 100%;
  cursor: pointer;
}
.aboutHead .userPic img {
  position: relative;
  height: 100px;
  width: 100px;
  border-radius: 100%;
}
.aboutHead .userPic.noPhoto {
  background-color: rgba(255, 255, 255, .1);
  border: 10px solid rgba(255, 255, 255, .2);
}
.aboutHead .userInfo {
  margin: 0 auto;
  padding: 0 10px 0px;
  text-align: center;
}
.aboutHead.hasCover .userInfo { text-shadow: 0px 1px 2px rgba(0, 0, 0, .4); }
.aboutHead .userInfo h1,
body.light .aboutHead.hasCover .userInfo h1 {
  margin: 0 0 5px;
  font-size: 32px;
  line-height: 48px;
  color: #fff;
}
.aboutHead .userInfo h2,
body.light .aboutHead.hasCover .userInfo h2 {
  position: relative;
  margin: 0 0 10px;
  font-size: 16px;
  line-height: 20px;
  color: rgba(255, 255, 255, 1);
}
.aboutHead .userInfo h2 i,
body.light .aboutHead.hasCover .userInfo h2 i {
  margin: 0 1px 0 8px;
  font: normal 13px 'thumbs';
  color: rgba(255, 255, 255, .7);
  opacity: .6;
}
.aboutHead .userInfo h2 .space {
  display: none;
  height: 20px;
  width: 1px;
  padding: 0 15px 0 0;
}
.aboutHead .userInfo p,
body.light .aboutHead.hasCover .userInfo p {
  margin: 0;
  font-size: 16px;
  line-height: 22px;
  color: #fff;
}
.aboutHead a.resume:hover { border: 1px solid rgba(252, 252, 252, 0.6); }
.aboutHead a.resume {
  color: #fcfcfc;
  border: 1px solid rgba(252, 252, 252, 0.3);
  padding: 10px 18px;
  border-radius: 3px;
  display: inline-block;
  margin: 16px auto 10px;
  -webkit-transition: border .2s ease;
  transition: border .2s ease;
}
.aboutHead.hasCover a.resume:hover { border: 1px solid rgba(252, 252, 252, 0.6); }
.aboutHead.hasCover a.resume {
  color: #fcfcfc;
  border: 1px solid rgba(252, 252, 252, 0.3);
}
body.light .aboutHead a.resume:hover { border: 1px solid rgba(51, 51, 51, 0.5); }
body.light .aboutHead a.resume {
  color: #333;
  border: 1px solid rgba(51, 51, 51, 0.2);
}
body.light .aboutHead.hasCover a.resume:hover { border: 1px solid rgba(252, 252, 252, 0.6); }
body.light .aboutHead.hasCover a.resume {
  color: #fcfcfc;
  border: 1px solid rgba(252, 252, 252, 0.3);
}
.aboutContent {
  margin: 0 auto;
  text-align: left;
  padding: 0 10px 20px;
}
.aboutContent p {
  font-size: 14px;
  line-height: 22px;
  color: #fcfcfc;
  margin: 5px 0;
}
.aboutContent h4 {
  font-size: 14px;
  color: rgba(242, 242, 242, 0.25);
}
.aboutContent .bio p:first-child { margin-top: 0px; }
.aboutContent p a { color: #959595; }
.aboutContent p a:hover { color: #00aeef; }
.aboutContent #links {
  padding: 5px 0 10px;
  margin-left: -5px;
  margin-top: 5px;
}
.aboutContent #links li {
  display: inline-block;
  padding: 0 5px;
  line-height: 40px;
}
.aboutContent #links a {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin: 0;
  font-size: 40px;
  color: #fcfcfc;
  background: rgba(242, 242, 242, 0.1);
  border-radius: 50%;
  border-bottom: none;
  padding: 0;
  -webkit-transition: background 0.1s ease-in;
  transition: background 0.1s ease-in;
}
#links li a:before {
  -webkit-transition: background 0.1s ease-in;
  transition: background 0.1s ease-in;
}
#links a:before {
  font-family: 'social';
  line-height: 40px;
  font-style: normal;
  font-weight: normal;
  text-align: center;
  -webkit-font-smoothing: antialiased;
  top: -1px;
  position: relative;
}
#links a.behance:before { content: "\e61d"; }
#links a.carbonmade:before { content: "\e61e"; }
#links a.dribbble:before { content: "\e61f"; }
#links a.etsy:before { content: "\e620"; }
#links a.facebook:before { content: "\e621"; }
#links a.flickr:before { content: "\e622"; }
#links a.gitHub:before { content: "\e623"; }
#links a.google:before { content: "\e624"; }
#links a.instagram:before { content: "\e625"; }
#links a.custom:before { content: "\e626"; }
#links a.linkedIn:before { content: "\e627"; }
#links a.pinterest:before { content: "\e628"; }
#links a.portfolio:before { content: "\e629"; }
#links a.tumblr:before { content: "\e62a"; }
#links a.twitter:before { content: "\e62b"; }
#links a.vimeo:before { content: "\e62c"; }
#links a.vine:before { content: "\e62d"; }
.aboutContent p i { font-style: normal; }
.aboutContent .location { margin-right: 5px; }
.aboutContent .date:before {
  content: '\b7';
  margin-right: 7px;
}
.aboutContent .clients p i { display: block; }
.aboutContent .row p.jobType {
  display: inline;
  opacity: 0.3;
  margin-bottom: 0;
}
.aboutContent .row p.byLine { margin-bottom: 0 !important; }
.aboutContent .row p { margin-bottom: 1em !important; }
.aboutContent .row p:last-of-type { margin-bottom: 0; }
.aboutContent .row p:last-of-type:after { display: none !important; }
.aboutContent .row h4 { margin-bottom: 1em; }
.aboutContent .row h5 a:hover { border-bottom-color: rgba(29, 174, 236, 0.8); }
.aboutContent .row h5 a {
  color: #1dafec;
  border-bottom-color: rgba(29, 174, 236, 0.5);
}
.aboutContent .row h5 {
  display: inline-block;
  color: #1dafec;
  font-size: 14px !important;
}
.aboutContent .row.awards,
.aboutContent .table {
  border-collapse: collapse;
  width: 100%;
}
.aboutContent .table .date:before { content: none; }
.aboutContent .awardBlock,
.aboutContent .exhibitionBlock {
  display: table-row;
  width: 100%;
}
.aboutContent .awardBlock .date,
.aboutContent .awardBlock .guts,
.aboutContent .exhibitionBlock .date,
.aboutContent .exhibitionBlock .guts {
  display: table-cell;
  padding-bottom: .6em;
}
.aboutContent .awardBlock .guts span,
.aboutContent .exhibitionBlock .guts span { opacity: 0.9; }
.aboutContent .awardBlock .date,
.aboutContent .exhibitionBlock .date {
  width: 80px;
  opacity: 0.8;
}

/* styles/pages/project.scss */
#detailsContainer {
  text-align: left;
  font-size: 14px;
  line-height: 20px;
  padding: 15px 7px 0;
  margin: 30px 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
#detailsContainer .guts { display: block; }
#detailsContainer label {
  color: #ECECEC;
  opacity: .5;
}
#detailsContainer p { margin-top: 0; }
#detailsContainer .row.site a {
  color: #6CC3F4;
  font-size: 14px;
  border-color: rgba(107, 194, 244, 0.4);
  -webkit-transition: border-color .2s ease-in-out;
  transition: border-color .2s ease-in-out;
}
#detailsContainer .row {
  width: 100%;
  overflow: hidden;
  padding: 0;
  margin: 0;
  border-bottom: none;
}
.nextProject {
  position: relative;
  display: block;
  width: 100%;
  height: 96px;
  font-size: 14px;
  text-align: center;
  background: #fff;
  margin-top: 20px;
  overflow: hidden;
}
.nextProject .bg {
  display: block;
  width: 100%;
  height: 96px;
  line-height: 96px;
  opacity: 0.5;
  background-size: cover;
  background-position: center;
  z-index: 10;
  -webkit-filter: blur(2px);
  filter: blur(2px);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
.nextProject .title strong {
  font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: normal;
  color: rgba(32, 32, 32, 1);
  -webkit-font-smoothing: antialiased;
}
.nextProject .title {
  position: absolute;
  top: 0;
  left: 0;
  color: rgba(32, 32, 32, 0.5);
  display: block;
  width: 100%;
  height: 96px;
  line-height: 96px;
  z-index: 11;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 20px;
  padding-left: 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.light .nextProject { background: #202020; }
body.light .nextProject .title strong { text-shadow: 0px 1px 2px rgba(0, 0, 0, .3); }
ul#projects.textHidden li .thumbnail .info { display: none; }
body.project footer {
  display: none;
  visibility: hidden;
}
#list {
  width: 100%;
  padding: 10px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
carbon-image {
  display: block;
  margin: auto;
}
carbon-caption { display: block; }
carbon-container {
  display: block;
  position: relative;
  margin: auto;
}
carbon-piece {
  display: block;
  margin: 20px auto;
}
carbon-image.page { margin: 20px auto; }
carbon-piece .page { background: #fff !important; }
carbon-container.hasArtwork {
  display: block;
  position: relative;
  width: 100%;
  max-height: 560px;
  height: 560px;
}
carbon-player { position: absolute !important; }
carbon-player.video time.total { display: none; }
@media only screen and (max-width: 580px) {
  carbon-container.hasArtwork {
    padding-bottom: 100% !important;
    height: auto;
  }
}

/* styles/pages/contact.scss */
body.openNav,
body.showCompose { overflow: hidden; }
.userContent a.button.btnMessage {
  background-color: #1DAFEC;
  height: 50px;
  line-height: 50px;
  border-radius: 3px;
  padding-right: 15px;
  padding-left: 15px;
  margin: 0;
  border-bottom: none;
}
.button.btnMessage i {
  font: normal 16px 'thumbs';
  margin-right: 15px;
}
body.light .userContent .row { border-bottom: solid 1px rgba(51, 51, 51, 0.1); }
#contactContainer .row p { margin-top: 0; }
.row:last-child { border-bottom: none; }
.row.msg {
  text-align: center;
  margin: -1px 10px 0;
  padding-top: 30px;
  padding-bottom: 30px !important;
}
#contactContainer div.sub {
  margin-right: 10px;
  margin-left: 10px;
  padding-right: 10px;
  padding-left: 10px;
}
.row.availability {
  text-align: center;
  margin: -1px 0 0;
  background: rgba(252, 252, 252, 0.05);
  border: none;
  padding: 20px 25px;
  border-bottom: none !important;
}
.row.availability .note {
  color: #7cc74c;
  position: relative;
  margin-right: 6px;
  padding-left: 24px;
  margin-left: 6px;
}
.row.availability .note:before {
  position: absolute;
  font-family: 'thumbs';
  content: '\e60c';
  left: 0px;
  opacity: 0.5;
}
.row.availability p {
  font-size: 16px;
  line-height: 22px;
  color: #fff;
  margin: 0;
}
#contactContainer .row.availability p { padding: 0 10px; }
.availability.now .note { color: #7cc74c; }
.availability.soon .note { color: #f8ca5c; }
.availability.unavailable .note { color: #686868; }
.availability.unavailable p { color: #999 !important; }
#contactContainer .row p a {
  color: #6CC3F4;
  font-size: 14px;
  border-color: rgba(107, 194, 244, 0.4);
  -webkit-transition: border-color .2s ease-in-out;
  transition: border-color .2s ease-in-out;
}
.contactForm {
  opacity: 1;
  visibility: visible;
  margin: 0 0 0;
  border-top: solid 1px rgba(255, 255, 255, 0.1);
}
.showCompose .navLink { display: none; }
.contactForm .cancelCompose {
  position: absolute;
  display: block;
  font: 18px 'thumbs';
  padding: 5px 10px;
  top: 10px;
  left: 9px;
  z-index: 10;
  cursor: pointer;
  color: #1DAFEC;
}
.contactForm { background-color: #1c1c1c; }
.contactForm .inner {
  height: 100%;
  margin: 0 10px;
  padding: 40px 0 50px;
}
.light .contactForm { border-top: solid 1px rgba(0, 0, 0, 0.1); }
.contactForm ul {
  padding: 0;
  list-style: none;
}
.contactForm li { position: relative; }
.contactForm li .toName {
  display: block;
  font-size: 16px;
  line-height: 70px;
  color: #fff;
  padding: 0 20px;
  text-align: left;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  margin-right: -10px;
  margin-left: -10px;
  margin-top: 7px;
}
.contactForm li .toName:before {
  content: 'To';
  opacity: .4;
  margin-right: 5px;
}
.contactForm li .subLabel {
  display: block;
  position: absolute;
  top: 0;
  left: -85px;
  width: 55px;
  height: 60px;
  line-height: 64px;
  font-size: 16px;
  text-align: right;
  color: rgba(255, 255, 255, 0.7);
}
.contactForm li .subLabel.to {
  height: 60px;
  line-height: 72px;
}
.contactForm .field {
  position: relative;
  margin-bottom: 10px;
}
.contactForm .field.col-2 {
  width: 49%;
  width: calc(50% - 5px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
}
.contactForm .field.col-2:first-of-type { margin-right: 10px; }
.contactForm .field label {
  display: block;
  position: absolute;
  opacity: 1;
  visibility: visible;
  font-size: 12px;
  line-height: 14px;
  color: rgba(255, 255, 255, 0.6);
  padding: 0 15px;
  -webkit-transition: -webkit-transform 0.08s linear, opacity 0.08s linear, visibility 0.08s linear;
  transition: transform 0.08s linear, opacity 0.08s linear, visibility 0.08s linear;
  -webkit-transform: translate(0, -24px);
  transform: translate(0, -24px);
}
.contactForm form .error {
  visibility: hidden;
  opacity: 0;
  background: #ed656c;
  color: #fff;
  text-align: center;
}
.contactForm form.error .error {
  display: block;
  visibility: visible;
  opacity: 1;
  height: auto;
  margin: 0 0 10px;
  padding: 10px 15px;
  border-radius: 3px;
}
.contactForm form .error .message {
  display: block;
  visibility: visible;
  opacity: 1;
  height: auto;
  text-align: left;
  font-size: 14px;
  text-align: center;
  line-height: 18px;
  color: #fff;
  opacity: 0.8;
}
.contactForm ::-webkit-input-placeholder { color: rgba(51, 51, 51, 0.4); }
.contactForm :-ms-input-placeholder { color: rgba(51, 51, 51, 0.4); }
.contactForm ::placeholder { color: rgba(51, 51, 51, 0.4); }
.dark .contactForm ::-webkit-input-placeholder { color: rgba(252, 252, 252, 0.3); }
.dark .contactForm :-ms-input-placeholder { color: rgba(252, 252, 252, 0.3); }
.dark .contactForm ::placeholder { color: rgba(252, 252, 252, 0.3); }
.contactForm input,
.contactForm textarea {
  display: block;
  font-size: 16px;
  line-height: 24px;
  color: #333;
  width: 100%;
  padding: 10px;
  margin: 0;
  border: solid 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 3px;
  background: #FCFCFC;
  -webkit-appearance: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.dark .contactForm input,
.dark .contactForm textarea {
  border: solid 1px rgba(255, 255, 255, 0.1);
  background: #1C1C1C;
  color: #fcfcfc;
}
.contactForm input[type="text"],
.contactForm input[type="email"] { height: 50px; }
.contactForm textarea {
  min-height: 100px;
  resize: none;
}
.contactForm input:focus,
.contactForm textarea:focus {
  outline: none;
  border-color: rgba(0, 174, 239, 0.4);
}
.contactForm .field.invalid input,
.contactForm .field.invalid textarea { border-color: #f8c1c2; }
.contactForm .button {
  display: block;
  width: 100%;
  height: 50px;
  line-height: 50px;
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  margin: 0;
  padding: 0;
  font-size: 22px;
  text-align: center;
  background-color: #00aeef;
  color: #fcfcfc;
  border-radius: 3px;
  cursor: pointer;
  -webkit-font-smoothing: antialiased;
}
#contactForm.sent .guts {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s, visibility 0s 0.3s;
  transition: opacity 0.3s, visibility 0s 0.3s;
}
#contactForm .confirmedGuts {
  opacity: 0;
  visibility: hidden;
  height: 0;
  padding: 0;
}
#contactForm.sent .confirmedGuts {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  height: auto;
  padding: 90px 0 0;
  -webkit-transition: opacity 0.3s, visibility 0s 0.3s;
  transition: opacity 0.3s, visibility 0s 0.3s;
  opacity: 1;
  visibility: visible;
}
#contactForm.sent .confirmedGuts h3 {
  margin: 0 0 15px;
  font-size: 18px;
}
#contactForm.sent .confirmedGuts a {
  width: 150px;
  margin: 0 auto 15px;
}
#contactForm.sent .cancelCompose { display: none; }
#contactForm .icon {
  visibility: hidden;
  opacity: 0;
  display: block;
  margin: 0 auto 30px;
  width: 40px;
  height: 40px;
  text-align: center;
  z-index: 100;
  -webkit-transform: translate(0px, -20px);
  transform: translate(0px, -20px);
}
#contactForm .icon.success:before {
  display: block;
  font: 40px / 40px 'frontend';
  content: "\e04c";
  position: absolute;
  top: 0;
  color: #7ac943;
  width: 40px;
  height: 40px;
  border: solid 2px #7ac943;
  border-radius: 100%;
}
#contactForm.sent .icon.success {
  -webkit-transition: -webkit-transform 0.1s linear, opacity 0.1s linear;
  transition: transform 0.1s linear, opacity 0.1s linear;
  -webkit-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
  visibility: visible;
  opacity: 1;
}

/* styles/pages/private.scss */
.accessForm {
  position: relative;
  margin: 0 15px;
}
.accessForm h3 { margin: 30px 0; }
.accessForm .loginGuts,
.accessForm .requestGuts,
.accessForm .confirmedGuts {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s, visibility 0s 0.3s;
  transition: opacity 0.3s, visibility 0s 0.3s;
}
.accessForm.login .loginGuts,
.accessForm.request .requestGuts {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
.accessForm.request .requestGuts { margin-bottom: 20px; }
.accessForm .field {
  position: relative;
  margin: 0 0 15px;
}
.accessForm input,
.accessForm textarea {
  display: block;
  font-size: 16px;
  line-height: 24px;
  color: #333;
  width: 100%;
  padding: 10px;
  margin: 0;
  border: solid 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 3px;
  background: #FCFCFC;
  -webkit-font-smoothing: antialiased;
  -webkit-appearance: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
}
.dark .accessForm input,
.dark .accessForm textarea {
  border: solid 1px rgba(255, 255, 255, 0.1);
  background: #1C1C1C;
  color: #fcfcfc;
}
.accessForm input[type="text"],
.contactForm input[type="email"] { height: 50px; }
.accessForm textarea {
  min-height: 100px;
  resize: none;
}
.accessForm input:focus,
.accessForm textarea:focus {
  outline: none;
  border-color: rgba(0, 174, 239, 0.4);
}
.accessForm .button {
  display: block;
  width: 100%;
  height: 50px;
  line-height: 50px;
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  margin: 0;
  padding: 0;
  font-size: 22px;
  text-align: center;
  background: #00aeef;
  color: #fcfcfc;
  border-radius: 3px;
  cursor: pointer;
  -webkit-font-smoothing: antialiased;
}
.accessForm .loginGuts .button {
  background: rgba(255, 255, 255, 0.1);
  height: 50px;
  line-height: 50px;
  border-radius: 3px;
  margin: 15px 0;
  cursor: default;
  pointer-events: none;
}
.light .accessForm .unlock { background: rgba(0, 0, 0, 0.1); }
.accessForm .valid + li .unlock,
.light .accessForm .valid + li .unlock {
  background: #1DAFEC;
  pointer-events: auto;
}
.accessForm .loginGuts li { margin: 0 0 15px; }
.message {
  display: block;
  visibility: hidden;
  opacity: 0;
  height: 0;
}
.accessForm form .error {
  visibility: hidden;
  opacity: 0;
  background: #ed656c;
  color: #fff;
  text-align: center;
}
.accessForm form.error .error {
  display: block;
  visibility: visible;
  opacity: 1;
  height: auto;
  margin: 0 0 10px;
  padding: 10px 15px;
  border-radius: 3px;
}
.accessForm form .error .message {
  display: block;
  visibility: visible;
  opacity: 1;
  height: auto;
  text-align: left;
  font-size: 14px;
  text-align: center;
  line-height: 18px;
  color: #fff;
  opacity: 0.8;
}
.accessForm .loginGuts .field.invalid .message {
  visibility: visible;
  opacity: 1;
  height: auto;
  background: #ed656c;
  color: #fff;
  padding: 10px 15px;
  margin: 10px 0;
  border-radius: 3px;
}
.accessForm .field.invalid input,
.accessForm .field.invalid textarea { border-color: #f8c1c2; }
.accessForm .requestAccess {
  font-size: 14px;
  color: #999;
  text-decoration: underline;
  cursor: pointer;
}
.accessForm .requestGuts input,
.accessForm .requestGuts textarea { text-align: left; }
.accessForm .confirmedGuts {
  display: block;
  visibility: hidden;
  opacity: 0;
  height: 0;
}
#accessRequestForm.sent .guts {
  visibility: hidden;
  opacity: 0;
  height: 0;
}
#accessRequestForm.sent .confirmedGuts {
  visibility: visible;
  opacity: 1;
  height: auto;
  padding: 30px 0 0;
}
#accessRequestForm.sent .confirmedGuts h3 {
  margin: 0 0 15px;
  font-size: 18px;
}
#accessRequestForm.sent .confirmedGuts a {
  width: 150px;
  margin: 0 auto 15px;
  font-size: 14px;
  color: #999;
  text-decoration: underline;
}
#accessRequestForm.sent .cancelCompose { display: none; }
#accessRequestForm .icon {
  visibility: hidden;
  opacity: 0;
  display: block;
  margin: 0 auto 30px;
  width: 40px;
  height: 40px;
  text-align: center;
  z-index: 100;
  -webkit-transform: translate(0px, -20px);
  transform: translate(0px, -20px);
}
#accessRequestForm .icon.success:before {
  display: block;
  font: 40px / 40px 'frontend';
  content: "\e04c";
  position: absolute;
  top: 0;
  color: #7ac943;
  width: 40px;
  height: 40px;
  border: solid 2px #7ac943;
  border-radius: 100%;
}
#accessRequestForm.sent .icon.success {
  -webkit-transition: -webkit-transform 0.1s linear, opacity 0.1s linear;
  transition: transform 0.1s linear, opacity 0.1s linear;
  -webkit-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
  visibility: visible;
  opacity: 1;
}

/* styles/pages/blog.scss */
carbon-paginator {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 640px;
  margin: 0 auto;
}
carbon-paginator .prev { float: left; }
carbon-paginator .next { float: right; }
.postWrapper {
  width: 100%;
  padding: 10px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.tagHeader {
  margin-bottom: 2em;
  text-align: center;
  font-size: 0.8em;
}
.tagHeader small {
  font-size: inherit;
  opacity: 0.5;
}
.tag:before { content: '#'; }
.dark article a,
.dark carbon-paginator a {
  color: #fcfcfc !important;
  border-bottom: 1px solid rgba(252, 252, 252, 0.3);
}
.dark article a:hover,
.dark carbon-paginator a:hover { border-bottom: 1px solid rgba(252, 252, 252, 0.8); }
.dark article .tags a,
.dark carbon-paginator .tags a { color: rgba(252, 252, 252, 0.5) !important; }
.dark article .tags a:hover,
.dark carbon-paginator .tags a:hover { color: rgba(252, 252, 252, 0.7) !important; }
.light article a,
.light carbon-paginator a {
  color: #666 !important;
  border-bottom: 1px solid rgba(102, 102, 102, 0.3);
}
.light article a:hover,
.light carbon-paginator a:hover { border-bottom: 1px solid rgba(102, 102, 102, 0.8); }
.light article .tags a,
.light carbon-paginator .tags a { color: rgba(102, 102, 102, 0.5) !important; }
.light article .tags a:hover,
.light carbon-paginator .tags a:hover { color: rgba(102, 102, 102, 0.7) !important; }
article p,
article ul,
article ol { margin: 0 0 1.1em 0; }
article ul {
  list-style: disc;
  list-style-position: inside;
}
article ol {
  list-style: decimal;
  list-style-position: inside;
}
article .longPost ul,
article .longPost ol {
  padding-left: 1.4em;
  list-style-position: outside;
}
article .longPost { text-align: left; }

/* styles/light.scss */
body.light {
  background-color: #fcfcfc;
  color: #333;
}
body.light .noThumbnail a { background-color: rgba(51, 51, 51, 0.1); }
body.dark .noThumbnail a { background-color: rgba(242, 242, 242, 0.1); }
body.light #header { border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
body.light #aboutContainer h1,
body.light #aboutContainer h2,
body.light #aboutContainer .row,
body.light #aboutContainer .sub .row label { color: #333; }
body.light .navLink i { background-color: #000; }
body.light hr {
  border: 0;
  height: 0;
  border-top: 1px solid rgba(0, 0, 0, .05);
  border-bottom: none;
}
body.light > .overlay { background-image: linear-gradient(to top, rgba(252, 252, 252, 0.9), rgba(252, 252, 252, 1)); }
body.light > .overlay a {
  color: #333;
  text-decoration: none;
}
body.light header a { color: #666; }
body.light #detailsContainer label {
  color: #202020;
  opacity: .4;
}
body.light p { color: #333; }
body.light .contactForm {
  background-color: #FCFCFC;
  border-bottom: none;
}
body.light .contactForm li .toName { border-top: 1px solid rgba(0, 0, 0, 0.05); }
body.light .row.availability {
  background-color: rgba(28, 28, 28, 0.05);
  border: none;
}
body.light .row.availability p { color: #333; }
body.light .availability.now .note { color: #67b038; }
body.light .availability.soon .note { color: #ecaa0c; }
body.light .availability.unavailable .note { color: #c1c1c1; }
body.light .availability.unavailable p { color: #999 !important; }
body.light .row.location { border-top: 1px solid rgba(0, 0, 0, 0.05); }
body.light #detailsContainer {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
body.light .nextProject .title { color: rgba(255, 255, 255, 0.5); }
body.light .nextProject .title strong { color: rgba(255, 255, 255, 1); }
body.light .aboutContent p a,
body.light .userContent p a { color: #333; }
body.light .userContent a,
body.light .aboutContent a {
  padding: 0 0 .1em 0;
  border-bottom: 1px solid rgba(51, 51, 51, 0.3);
}
body.light .aboutHead {
  background-color: rgba(28, 28, 28, 0.05);
  -webkit-font-smoothing: antialiased;
}
body.light .aboutHead .userInfo h1,
body.light .aboutHead .userInfo p { color: #333; }
body.light .aboutHead .userInfo h2 { color: rgba(51, 51, 51, 0.7); }
body.light .aboutHead .userInfo h2 i { color: rgba(51, 51, 51, 0.25); }
body.light .aboutContent .row { border-bottom: solid 1px rgba(51, 51, 51, 0.1); }
body.light .row:last-child { border: none; }
body.light .aboutContent p { color: #333; }
body.light .row h4 { color: rgba(51, 51, 51, 0.4); }
body.light .aboutContent #links a { color: #333; }
body.light .row.availability {
  background-color: rgba(28, 28, 28, 0.05);
  border: none;
}
body.light .row.availability p { color: #333; }
body.light .contactForm { border-bottom: 1px solid rgba(0, 0, 0, 0.05); }
body.light .contactForm li .subLabel { color: rgba(51, 51, 51, 0.4); }
body.light .contactForm .field label { color: rgba(51, 51, 51, 0.3); }
body.light .contactForm li .toName { color: #333; }
body.light .aboutContent #links a {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin: 0;
  font-size: 40px;
  background-color: #FCFCFC;
  -webkit-transition: color 0.1s ease-in;
  transition: color 0.1s ease-in;
}
body.light .aboutContent #links a:hover { background-color: none; }
body.light #links a.behance:before { content: "\e60c"; }
body.light #links a.carbonmade:before { content: "\e60d"; }
body.light #links a.dribbble:before { content: "\e60e"; }
body.light #links a.etsy:before { content: "\e60f"; }
body.light #links a.facebook:before { content: "\e610"; }
body.light #links a.flickr:before { content: "\e611"; }
body.light #links a.gitHub:before { content: "\e612"; }
body.light #links a.google:before { content: "\e613"; }
body.light #links a.instagram:before { content: "\e614"; }
body.light #links a.custom:before { content: "\e615"; }
body.light #links a.linkedIn:before { content: "\e616"; }
body.light #links a.pinterest:before { content: "\e617"; }
body.light #links a.portfolio:before { content: "\e618"; }
body.light #links a.tumblr:before { content: "\e619"; }
body.light #links a.twitter:before { content: "\e61a"; }
body.light #links a.vimeo:before { content: "\e61b"; }
.light .collapsed carbon-player time {
  color: rgba(51, 51, 51, .2);
  text-shadow: none;
}
.light .collapsed carbon-waveform > .bar { background: rgba(51, 51, 51, .15); }
.light .collapsed carbon-waveform { opacity: 1; }
.project carbon-player.audio .control { background: rgba(108, 195, 244, 0.8); }
.project carbon-player.audio .control:hover { background: rgba(108, 195, 244, 1); }
.project carbon-player.audio.loading .control:hover { background: rgba(108, 195, 244, 0.8); }
.project carbon-waveform > .bar.fill { background: rgba(108, 195, 244, 1); }
.project carbon-player.audio.played time.current { color: rgba(108, 195, 244, 1); }
.project carbon-player.audio.ended time.total { color: rgba(108, 195, 244, 1); }
.project carbon-player carbon-scrubber > .track > .playedBar { background: rgba(108, 195, 244, 1); }
.project carbon-player.video .control { background: rgba(26, 26, 26, 0.2); }
.project carbon-player.video .control:hover { background: rgba(108, 195, 244, 1); }
.collapsed carbon-player.audio .control { background: rgba(108, 195, 244, 1); }
carbon-player.audio time.current,
carbon-player.audio time.total { bottom: 3px; }

/* styles/base/clears.css */
.contactForm li:after,
.row:after,
.inner:after,
#projects:after,
.navLink:after,
#list:after,
.guts:after { 
  display: block; content: "."; 
  clear: both; 
  font-size: 0; line-height: 0; height: 0; overflow: hidden; 
}
