@import url(http://fonts.googleapis.com/css?family=Bree+Serif|Lato:300,400,400Italic);
@keyframes slide-in {
  0% {
    position: fixed;
    top: 2rem; }
  100% {
    position: fixed;
    top: 0; } }
@keyframes fade {
  from {
    transform: translateY(0.25em);
    opacity: 0; } }
/* default-mobile-below-768 */
html, body {
  font-family: "Lato", sans-serif !important;
  height: 100%;
  width: 100%; }

body {
  overflow-x: hidden; }

h1, h2, h3, h4 {
  margin: 0;
  padding: 0;
  float: left;
  line-height: 3.5rem;
  transition: all 0.3s; }

h2, h3, h4 {
  font-family: "Bree Serif", sans-serif !important;
  font-weight: 300;
  font-weight: 300;
  padding: .25rem;
  margin: 0 0 6rem 0;
  line-height: 6rem;
  text-align: center;
  width: calc(100% - 1rem); }

h2 {
  font-size: 300%; }

h2 .subtitle {
  display: block;
  font-size: 70%;
  opacity: .8; }

h3 {
  font-size: 110%; }

h4 {
  font-size: 100%; }

#content {
  float: left;
  background: #FFFFFF;
  max-width: 100%;
  overflow-x: hidden; }

.article-set {
  float: left;
  padding: 0 0 2rem 0;
  background: #FFFFFF url(../img/bg-low.jpg) top right fixed; }

article {
  display: block;
  float: left;
  width: 100vw;
  max-width: 100%;
  overflow: hidden;
  position: relative;
  background: #FFFFFF; }

section {
  display: block;
  float: left;
  width: 97%;
  margin: 0 0 0 2%;
  padding: .5rem;
  border-radius: 2px;
  background: rgba(255, 244, 198, 0.7); }
  section h1, section h4 {
    clear: both; }
  section h1 {
    font-size: 180%;
    margin: 1.5rem; }
  section p {
    margin: 0 3rem 2rem 3rem;
    clear: both;
    font-size: 150%;
    line-height: 200%;
    font-weight: 300; }
  section a {
    color: #666666;
    text-decoration: none;
    border-bottom: 1px dotted #666666; }
  section a:focus, section a:hover {
    color: #666666;
    text-decoration: none;
    border-bottom: 1px solid #666666; }

.btn-success {
  color: #ECECEC;
  border-color: rgba(255, 255, 255, 0.5); }

a.del, a.del:hover {
  cursor: not-allowed !important;
  opacity: .5;
  background: none !important;
  display: none !important; }

figcaption {
  display: none; }

.btn {
  padding: .5rem; }

.flex-grid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
  align-content: center;
  align-items: center;
  width: 85%;
  margin: auto auto 2rem auto; }
  .flex-grid.set-member {
    border-bottom: 1px solid #EEEEEE; }
  .flex-grid .item {
    padding: 1rem;
    margin: 1rem; }
    .flex-grid .item.section-label {
      font-size: 100%;
      font-weight: 300;
      max-width: 25%;
      background: #FCFCFC;
      border: 2px solid #F0F0F0;
      border-radius: .5rem; }
    .flex-grid .item img {
      margin: initial; }

.glyphicon {
  margin-left: .5rem; }

.note {
  font-family: "Bree Serif", sans-serif !important;
  font-weight: 300;
  font-style: italic;
  opacity: .7; }

.exception {
  font-size: 80%;
  font-style: italic;
  opacity: .7; }

.mobile-only {
  display: block; }

.desktop-only {
  display: none; }

.medium-only {
  display: none; }

.non-medium {
  display: block; }

.non-mobile {
  display: none; }

/* desktop-768-above */
@media screen and (min-width: 768px) {
  h2 .subtitle {
    font-size: 100%;
    display: inline; }

  section {
    width: 89%;
    margin: 0 2% 1rem 2%; }

  .mobile-only {
    display: none; }

  .medium-only {
    display: none; }

  .desktop-only, .non-medium, .non-mobile {
    display: block; } }
/* medium-btw-768-1024 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .medium-only, .non-mobile {
    display: block; }

  .non-medium {
    display: none; } }
/* default-mobile-below-768 */
header {
  position: fixed;
  top: 2rem;
  left: 0;
  z-index: 10000;
  height: 5rem;
  font-size: 24px;
  line-height: 5rem;
  width: 100%;
  color: #FFFFFF;
  background-color: #000000;
  background-color: rgba(0, 0, 0, 0.8);
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.5);
  font-weight: 300; }
  header #logo {
    position: relative;
    top: .5%;
    left: .5%;
    width: 64px;
    height: 64px;
    color: #FFFFFF;
    display: block;
    float: left; }
    header #logo svg {
      fill: currentColor; }
  header h1, header h2, header h3 {
    font-family: "Lato", sans-serif !important;
    width: auto;
    margin: .5em;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); }
  header h1 {
    font-size: 1em;
    line-height: 1em; }
  header h2 {
    font-weight: normal;
    font-size: .6em;
    line-height: 1em;
    margin: 1.4em 0 0 0;
    padding: 0;
    border: 0; }
  header.sm {
    position: fixed;
    top: 0;
    height: 4rem;
    line-height: 2rem; }
    header.sm h1 {
      font-size: 75%;
      line-height: 100%;
      padding-top: 0rem; }
    header.sm h2 {
      font-size: 50%;
      line-height: 100%;
      opacity: 0;
      margin-top: .8rem; }
    header.sm #logo {
      top: -30%;
      left: 0rem;
      transform: scale(0.5); }

/* desktop-768-above */
@media screen and (min-width: 768px) {
  header.sm {
    height: 2.2rem; }
    header.sm h1 {
      margin-top: .15rem; }
    header.sm #logo {
      top: -86%; } }
/* default-mobile-below-768 */
aside {
  background-color: transparent;
  margin: 0;
  padding: 1%;
  right: calc(50% - 12.5%);
  width: 100%;
  height: auto;
  clear: both;
  overflow: hidden;
  top: -10vw;
  transition: top .8s; }
  aside figure {
    background: transparent;
    margin: 0 0 0 5%;
    min-width: 8vw;
    float: left;
    clear: none;
    width: 24%;
    margin: 3rem 2rem 0 3rem; }
    aside figure img {
      width: 100%;
      min-width: 8vw;
      border: 2px solid #666666;
      border-radius: 100%;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5); }
  aside.sm {
    top: 3rem; }
  aside.end {
    top: -100vh; }
  aside p, aside h1, aside h2 {
    width: 60%;
    max-width: 60%;
    margin-left: 0;
    margin-right: 0;
    float: right;
    clear: right;
    text-align: center; }
  aside h1 {
    font-size: 250%;
    line-height: 120%;
    font-weight: bold;
    margin-top: 8%;
    margin-bottom: 1%; }
  aside h2 {
    font-size: 80%;
    line-height: 140%;
    margin-top: 0;
    margin-bottom: 1rem;
    border-top: 1px dotted rgba(255, 255, 255, 0.5); }
  aside .btn {
    color: #999999;
    border-color: #999999;
    background-color: #FFFFFF;
    transition: top .5s;
    opacity: 1; }
    aside .btn:hover {
      color: #999999;
      border-color: #999999;
      background-color: #FFFFFF;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5); }

/* mobile-640-above */
@media screen and (min-width: 640px) {
  aside p.mobile-only {
    font-weight: bolder; } }
/* desktop-768-above */
@media screen and (min-width: 768px) {
  aside {
    position: fixed;
    max-width: 10%;
    height: 100vh;
    right: 0;
    z-index: 2000;
    padding: 0; }
    aside figure {
      width: 35%;
      padding: 0;
      margin: 10%;
      clear: both; }
      aside figure img {
        border-radius: 100%;
        transform: rotate3d(0, 0, 0, 0deg);
        transform-style: preserve-3d;
        backface-visibility: hidden;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
        transition: all .3s;
        max-width: 100%;
        width: 20vw; }
        aside figure img:hover {
          transform: rotate3d(20, 20, 0, 10deg);
          box-shadow: -5px 5px 10px rgba(0, 0, 0, 0.3); }
    aside.sm .btn {
      top: 0;
      opacity: 1; }
    aside.sm figure {
      width: 35%;
      margin: 10%; }
    aside.sm p {
      margin: 0; }
    aside h2 {
      display: none; }
    aside p {
      clear: none;
      float: left;
      margin: 1rem 0 0 0;
      width: 100%;
      max-width: 100%;
      font-size: 100%; }
      aside p .btn {
        position: relative;
        top: -10rem;
        margin: 0;
        font-size: 100%;
        width: 90%;
        opacity: 1; } }
/* default-mobile-below-768 */
header * {
  transition: all .2s; }

header ul.nav.pull-right {
  position: fixed;
  top: 2.75rem;
  right: 0;
  z-index: 1000;
  font-size: .75em;
  line-height: 100%;
  border-radius: 0;
  padding: .5rem;
  width: 40%; }
  header ul.nav.pull-right a {
    cursor: pointer;
    color: #FFFFFF;
    padding: .5rem 2rem; }
  header ul.nav.pull-right li {
    float: right !important; }
    header ul.nav.pull-right li.active > a, header ul.nav.pull-right li.active > a:focus, header ul.nav.pull-right li.active > a:hover {
      color: #FFFFFF;
      background: transparent;
      border: 1px dotted #ECECEC; }
    header ul.nav.pull-right li a:focus, header ul.nav.pull-right li a:hover {
      color: #FFFFFF;
      background: transparent; }
header.sm ul.nav.pull-right {
  top: .75rem;
  padding: 0; }
  header.sm ul.nav.pull-right li > a, header.sm ul.nav.pull-right li > a:focus, header.sm ul.nav.pull-right li > a:hover {
    border-radius: 0;
    padding: .5rem 2rem; }

/* desktop-768-above */
@media screen and (min-width: 768px) {
  header ul.nav.pull-right {
    top: 2.5rem;
    right: 1rem;
    border-radius: 2px;
    width: auto; }
    header ul.nav.pull-right a {
      padding: 1rem 2rem; }
  header.sm ul.nav.pull-right {
    top: 0;
    padding: 0;
    border-radius: 0; }
    header.sm ul.nav.pull-right li > a, header.sm ul.nav.pull-right li > a:focus, header.sm ul.nav.pull-right li > a:hover {
      border-radius: 0;
      padding-top: .1rem; } }
/* default-mobile-below-768 */
section {
  margin-bottom: 7rem;
  position: relative;
  border-left: none;
  border-bottom: 1px dotted #EEEEEE;
  padding-bottom: 6rem;
  background: #FFFFFF; }

section.intro {
  background: rgba(255, 255, 255, 0.8); }
  section.intro p:not(.lead) {
    border-left: 5px solid #EEEEEE;
    padding: 0 2rem 2rem 5%;
    margin: 0; }

section h2 + p {
  margin-top: 4rem; }

.row {
  clear: both;
  text-align: center;
  margin: 0; }
  .row p {
    text-align: justify; }
  .row .glyphicon {
    font-size: 80%; }

.col-md-12 h1, .col-md-12 h2, .col-md-12 h3, .col-md-12 h4, .col-md-6 h1, .col-md-6 h2, .col-md-6 h3, .col-md-6 h4, .col-md-4 h1, .col-md-4 h2, .col-md-4 h3, .col-md-4 h4, .col-md-3 h1, .col-md-3 h2, .col-md-3 h3, .col-md-3 h4, .col-md-2 h1, .col-md-2 h2, .col-md-2 h3, .col-md-2 h4 {
  text-align: left;
  margin: 0;
  text-indent: 1rem;
  font-weight: bolder; }
.col-md-12 img, .col-md-6 img, .col-md-4 img, .col-md-3 img, .col-md-2 img {
  text-align: center;
  margin: 1rem 0 0 0;
  max-width: 100%; }

section.intro .lead {
  font-size: 210%;
  padding: 6rem 0 6rem 0;
  text-align: center; }

/* desktop-768-above */
@media screen and (min-width: 768px) {
  section.intro {
    width: 89%; }
    section.intro p:not(.lead) {
      border-left: 5px solid #EEEEEE;
      padding: 0 6rem 2rem 5%; } }
/* default-mobile-below-768 */
#jumbotron-background {
  position: absolute;
  top: 0;
  left: 0;
  background-color: #BEC239;
  background: #BEC239 url(../img/bg-low.jpg) no-repeat;
  background-size: cover;
  background-position: center center;
  width: 100vw;
  height: 100vh;
  transition: top .2s; }

.jumbotron {
  position: relative;
  padding: 0;
  margin: 0 0 3.5rem 0;
  clear: both;
  width: 100vw;
  height: 100vh;
  color: #FFFFFF;
  border: none;
  overflow: hidden;
  background-color: transparent; }
  .jumbotron .intro-copy {
    font-family: "Lato", sans-serif !important;
    position: relative;
    width: 90%;
    padding: 0;
    margin: 1rem auto 0 auto;
    text-align: center;
    overflow: hidden;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
    max-width: 90%;
    height: 100%;
    clear: both;
    z-index: 2000; }
  .jumbotron p {
    font-size: inherit;
    font-weight: 400; }
  .jumbotron h1 {
    font-family: "Bree Serif", sans-serif !important;
    font-weight: 300;
    margin-bottom: .7rem;
    font-weight: 400;
    font-size: 300%;
    line-height: 86%;
    transition: all .2s;
    margin-bottom: .7rem;
    float: none;
    animation: .5s .25s fade backwards ease-out; }
  .jumbotron .lead {
    font-size: 187%;
    margin: 3rem auto 0 auto;
    padding: 1rem;
    animation: 1s .5s fade backwards ease-out;
    background: rgba(0, 0, 0, 0.3); }
  .jumbotron .note {
    font-size: 100%; }

/* special breakpoint for copy */
@media screen and (min-width: 1040px) and (max-width: 1260px) {
  .jumbotron .intro-copy span {
    margin-right: 12rem; }
  .jumbotron .intro-copy em {
    margin: 0 0 0 9rem; } }
/* special breakpoint for copy  */
@media screen and (min-width: 627px) and (max-width: 768px) {
  .jumbotron h1 em {
    margin-left: 0; } }
/* desktop-768-above */
@media screen and (min-width: 768px) {
  .jumbotron h1 {
    margin-top: 2rem;
    font-size: 433%; }
  .jumbotron .lead {
    max-width: 60%;
    margin-top: 7rem; } }
@media screen and (min-width: 784px) and (max-width: 1095px) {
  .jumbotron .lead {
    max-width: 75%; } }
.footer {
  width: 100%;
  color: #FFFFFF;
  background: #000000; }
  .footer a, .footer a:hover, .footer a:focus {
    cursor: pointer;
    color: #FFFFFF; }
  .footer.mini {
    position: fixed;
    left: 0;
    bottom: -10rem;
    width: auto;
    height: auto;
    height: 3rem;
    opacity: .5; }
    .footer.mini a {
      width: 100%;
      height: 100%;
      padding: 1rem;
      margin: 0;
      line-height: .5rem;
      position: relative; }
  .footer.mega {
    font-family: "Bree Serif", sans-serif !important;
    font-weight: 300;
    position: relative;
    float: left;
    bottom: 0;
    height: 100vh; }
  .footer p {
    font-size: 100%;
    padding: 1rem;
    margin: 0;
    text-align: center;
    width: 98%;
    color: #666666; }
  .footer .row {
    margin: 0; }
    .footer .row.one {
      margin-top: 40vh; }
      .footer .row.one .fa {
        font-size: 300%; }
  .footer .col {
    margin: 0;
    padding: 0; }
  .footer.sm {
    bottom: 0rem; }
  .footer.end {
    display: none; }

/* default-mobile-below-768 */
body#portfolio aside {
  width: 15%;
  margin: 1%; }
body#portfolio figure {
  background: none; }
  body#portfolio figure figcaption {
    display: block;
    padding: .5rem; }

/* desktop-768-above */
@media screen and (min-width: 768px) {
  body#portfolio section:not(.jumbotron) {
    width: 96%; }
  body#portfolio .footer.mega aside {
    position: absolute;
    right: 0; } }
/* medium-btw-768-1024 */

/*# sourceMappingURL=master.css.map */