/******************************************************************************
** TABLE OF CONTENTS
*******************************************************************************
**
**	Primary - General Theme/Wrapper Styles
**
**	Secondary - View Specific styles
**
**	Utility - classes to be added in the same vain as Foundation/Bootstrap
**
**	Resets - General Resets or Foundation overrides
**
**	Other - One-offs that don't fit anywhere else. Tread lightly...
**
******************************************************************************/
/**************************************
** Primary
**************************************/
* {
  font-family: 'Slabo 27px', serif; }

h1 {
  margin: 32px; }

h1, h2, h3, h4 {
  font-family: 'Ubuntu', sans-serif;
  color: #fff; }

h2 {
  margin-top: 0; }

body {
  background: url("../images/primary-bg.jpg") no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: center center;
  color: #fff;
  text-align: center; }

a {
  color: #FA5633;
  transition: all 300ms ease-in; }
  a:hover, a:active, a:focus {
    color: #fff; }

nav > div {
  z-index: 99; }

nav a {
  display: inline-block;
  font-size: 1.25rem;
  position: relative; }
  nav a.active:after {
    content: '';
    background: #fff;
    border-radius: 10px;
    height: 4px;
    width: 80%;
    position: absolute;
    bottom: -2px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%); }

.container {
  background: rgba(0, 0, 0, 0.75);
  min-height: 100vh;
  overflow-x: hidden;
  text-shadow: 1px 1px 2px #111;
  width: 100%; }

.sub-section {
  background: #222;
  padding: 16px 8px; }
  .sub-section i {
    color: #FA5633; }

.landing-view i.fa {
  font-size: 2.5rem;
  color: #FA5633;
  cursor: pointer;
  transition: all 333ms ease-in; }
  .landing-view i.fa:hover {
    color: #fff; }

header {
  background: #111;
  box-shadow: 0 2px 8px #FA5633;
  padding: 12px 8px; }

footer {
  background: #111;
  color: #999;
  padding: 12px 8px; }
  footer a {
    color: #999; }
    footer a:hover {
      color: #FA5633; }

/**************************************
** Secondary
**************************************/
/* Home Specific */
.landing-view h1 {
  padding-top: 30vh; }

.landing-view {
  min-height: 100vh; }

.interests ul {
  list-style: none; }

/* Portfolio Specific */
.portfolio {
  padding: 4px 8px; }
  .portfolio img {
    border: 1px solid #fff;
    border-radius: 2px;
    box-shadow: 1px 1px 2px #000; }
    .portfolio img:hover {
      border-width: 2px; }

/**************************************
** Utility
**************************************/
.clear {
  clear: both; }

.delayed {
  animation-delay: 2s; }

.extra-delayed {
  animation-delay: 3s; }

/**************************************
** Resets
**************************************/
* {
  box-sizing: border-box; }

.row {
  max-width: 1280px; }