@charset "utf-8";
/* CSS Document */

/* RESET */

html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, address, img, ul, li, form, label, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, nav, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}                  
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display:block;
}
body { 
  font:.8em sans-serif; 
  *font-size:small;
  color:#fff; 
}
a { 
  margin:0; 
  padding:0; 
  font-size:100%; 
  vertical-align:baseline; 
  background:transparent;
  text-decoration:none;
  outline:none;
}
h1, h2, h3, h4, h5, h6 { 
  font-weight:bold;
}
ul {
  list-style:none;
  width:100%;
}

/* END RESET */

/* Common Styles */

html, body {
  height:100%;
}
.bold {
  font-weight:bold;
}
.italic {
  font-style:italic;
} 
.uppercase {
  text-transform:uppercase;
}
.left {
  float:left;
}
.right {
  float:right;
}
.clear {
  clear:both;
}
.center-text {
  text-align:center;
}
.inline li {
  display:inline;
}
.overflow {
  overflow:hidden;
}
.relative {
  position:relative;
}
.absolute {
  position:absolute;
}

/* Fonts */

@font-face {
  font-family:'Noir';
  src:local('?'), url('../fonts/noir.ttf') format("truetype");
}

/* Keyframes */


@-webkit-keyframes opacityChange {
  0% {
    opacity:1;
  }
  100% {
    opacity:0.1;
  }
}
@keyframes opacityChange {
  0% {
    opacity:1;
  }
  100% {
    opacity:0.1;
  }
}
@-webkit-keyframes backandforth {
  0% {
    left:30%;
  } 
  50% {
    left:45%;
  } 
  100% {
    left:30%;
  }
}
@keyframes backandforth {
  0% {
    left:30%;
  } 
  50% {
    left:45%;
  } 
  100% {
    left:30%;
  }
}

/* Unique styles */


* {
  box-sizing:border-box; 
}
audio,canvas,iframe,img,svg,video {
  vertical-align:middle; 
}
html, body {
  height:100%;
  overflow-x:hidden;
  background:#171717;
}
body::-webkit-scrollbar {
    position:absolute;
    right:0;
    top:0;
    z-index:998;
    width:7.5px;
    height:100%;
    transform-origin:center right;
    transition:transform .3s, opacity .3s;
    background-color:transparent;
    opacity:1;
}
body::-webkit-scrollbar-thumb {
    position:absolute;
    top:0;
    right:0;
    background-color:rgba(245, 242, 235, .4);
    width:7.5px;
    height:22%;
    border:2px solid #000;
    border-radius:20px;
}
body::-webkit-scrollbar-track {
    -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
    background-color:transparent;
}
p {
  position:relative;
  margin-top:10px;
  line-height:1.3;
}
a {
  color:#fff;
}
h2 {
  font-size:2rem;
}
#introContent h2 {
  background-image:-webkit-linear-gradient(left, white 25%, #147500 37.5%, white 75%);
  background-image:linear-gradient(90deg, white 25%, #147500 37.5%, white 75%);
  background-image:-webkit-linear-gradient(left, white 25%, #fde071 37.5%, white 75%);
  background-image:linear-gradient(90deg, white 25%, #fde071 37.5%, white 75%);
  background-position:right center;
  background-size:400% auto;
  -webkit-background-clip:text;
  background-clip:text;
  color:#fff;
  -webkit-text-fill-color:transparent;
  text-fill-color:transparent;
  transition:color 200ms linear;
}
#introContent h2:hover {
  background-position:left center;
  color:#ef9671;
  transition:background-position 2000ms ease-out;
}
.fullHeight {
  position:relative;
  height:100%;
}
nav {
  font-size:1.5rem;
}
#navWindow {
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:#171717;
  z-index:998;
  opacity:0;
  display:none;
}
#navWindow.open {
  opacity:1;
  display:block;
}
#navBackground { 
  position:fixed;
  width:100vw;
  height:100vh;
  object-fit:cover;
  top:0;
  left:0;
  z-index:-1;
  opacity:0.2;
}
/*#navWindow:before {
  content:"";
  position:absolute;
  left:0;
  top:0%;
  width:100%;
  height:50%;
  background:radial-gradient(ellipse at center,#000 0,hsla(0,0%,96%,0) 100%);
  transform:translate(0,50%);
  z-index:2;
  transition:opacity .2s;
}*/
/*#navWindow:after {
  content:"";
  position:absolute;
  left:0;
  top:0%;
  width:100%;
  height:100%;
  background:radial-gradient(ellipse at center,#147500 0,hsla(0,0%,96%,0) 65%);
  transform:translate(50%,50%);
  z-index:2;
  transition:opacity .2s;
}*/
.header-nav {
  height:100%;
}
.header-nav-items {
  position:relative;
  width:672px;
  margin-top:15%;
  margin-bottom:-0.2%;
  margin-left:15%;
  margin:15% auto;
  font-family:'noir';
  z-index:999;
}
.header-nav-item {
  width:100%;
  margin-bottom:1%;
  text-align:center;
  color:#fff;
}
.header-nav-item:hover {
  background:#fde071;
  color:#171717;
}
.header-nav-item p {
  position:relative;
  top:22px;
  padding:0 25px;
  font-size:5rem;
}
.navCTA a {
  color:#fde071;
}
.divider {
  position:relative;
  margin:auto;
  margin-top:1%;
  margin-bottom:1%;
  width:75%;
  height:0;
  border-top:2px solid #fff;
}
.dividerSmall {
  position:relative;
}
.dividerSmall div {
  display:inline-block;
}
.dividerLeft {
  left:-25%;
  width:25%;
}
.dividerRight {
  left:12%;
  width:25%;
}
.sectionIntro {
  position:relative;
  padding-top:16%;
  margin-bottom:8%;
}
.sectionIntro div:first-child {
  width:50%;
  height:100px;
  background:#c5b286;
}
.sectionIntro div {
  display:inline-block;
}
.dividerSmall {
  width:67%;
}
.dividerSmall .dividerTop {
  left:-60%;
  text-align:right;
}
.dividerSmall .dividerMiddle {
  left:-50%;
  text-align:right;
  border-top:1px solid #fff;
}
.dividerSmall .dividerBottom {
  left:-37%;
}
.sectionIntroTitle {
  position:relative;
  margin-bottom:-0.2%;
  left:-45%;
  width:32%;
  color:#171717;
}
.sectionIntroTitle h3 {
  font-size:5rem;
  font-family:'noir';
}
.lateralMovement {
  position:relative;
  -webkit-animation:backandforth 5s ease 0s;
  -webkit-animation-iteration-count:infinite;
  animation:backandforth 5s ease 0s;
  animation-iteration-count:infinite;
}
.lateralMovement:hover {
  animation-play-state:paused;
}
.row div {
  position:relative;
  display:inline-block;
}
header .row div {
  width:50%;
}
header .row div:first-child {
  width:45%;
}
#logo {
  position:relative;
  padding:25px 0 0 20px;
  font-size:3rem;
  font-weight:100;
  z-index:999;
}
#logo.open {
  color:#000;
  width:669px;
}
.header-button {
  position:absolute;
  z-index:100;
  width:60px;
  height:50px;
  top:25px;
  right:15px;
  cursor:pointer;
  transition:background-color .3s;
  z-index:999;
}
.header-button:focus span, .header-button:hover span {
  width:40px;
}
.header-button-item {
  display:block;
  height:2px;
  background:#fff;
  position:absolute;
  right:9px;
  opacity:1;
  transition:transform .3s, top .3s, opacity .3s, width .3s;
}
.header-button-item.top {
  top:15px;
  width:40px;
  transform-origin:left bottom;
}
.header-button-item.middle {
  top:24px;
  width:35px;
}
.header-button-item.bottom {
  top:33px;
  width:30px;
  transform-origin:left top;
}
.header-button.open {
  background-color:transparent
}
.header-button.open .header-button-item {
  width:35px;
}
.header-button.open .header-button-item.top {
  transform:rotate(45deg);
  top:12px;
}
.header-button.open .header-button-item.middle {
  opacity:0;
}
.header-button.open .header-button-item.bottom {
  transform:rotate(-45deg);
  top:37px;
}
#hamburger {
  z-index:999;
}
#headerTagline h2 {
  font-size:8rem;
}
#headerTagline h3 {
  position:absolute;
  top:20%;
  right:-50px;
  width:334px;
  font-size:1rem;
}
#headerCircle {
  position:absolute;
  bottom:15px;
  left:50%;
  transform:translate(-50%,0);
}
#headerTagline {
  position:absolute;
  top:50%;
  left:50%;
  width:856px;
  transform:translate(-50%,-50%);
}
section {
  transition:all 0.5s ease-in;
}
.expand {
  transform:scale(1) !important;
}
#introAbout {
  transform:scale(.95);
  border-radius:5px;
}
#introAbout h2 {
  color:#000;
}
#introAbout .row {
  position:relative;
}
#introAbout .rowOne div:first-child {
  width:45%;
  padding:1% 5%;
}
#introAbout .rowOne div:nth-child(2) {
  position:absolute;
  top:-75%;
  right:0;
  width:100%;
  height:50%;
}
#introAbout .rowTwo div:first-child {
  left:3px;
  width:25%;
  padding:2.75% 0;
}
#introAbout .rowTwo div:nth-child(2) {
  width:49%;
  z-index:999;
}
#introAbout .rowTwo div:nth-child(3) {
  position:absolute;
  top:0;
  right:0;
  width:100%;
  padding:6.2% 0 1px 0;
  border-bottom:2px solid #fff;
}
#introAbout img {
  width:100%;
}
#aboutTwo {
  position:absolute;
  right:10%;
  bottom:25%;
  width:254px;
  font-size:2rem;
}
#clients {
  padding:0 5% 7% 5%;
}
#clients .row {
  position:relative;
}
#clients .row div {
  padding:0 5% 0 15%;
  width:90%;
}
#clients h2 {
  text-align:center;
}
/*#clients h2:before {
  content:'';
  position:absolute;
  top:50%;
  left:-10%;
  width:30%;
  height:1px;
  background-color:#58595b;
}*/
#clients .button-view {
  color:#fff;
}
#clientListContainer .button-circle {
  margin-left:9.5%;
}
#clientListContainer .center {
  border-bottom:1px solid #fff;
}
.clientList {
  width:75%;
  margin:auto;
  padding:5% 0;
  text-align:center;
}
.clientList img {
  padding:5px;
}
/*.clientList {
  position:sticky;
  bottom:0;
  width:100%;
  border:5px solid #fde071;
  border:5px solid #fff;
  padding:0;
  text-align:center;
}
.clientList:nth-child(6) {
  border:0;
  border-top:5px solid #fde071;
  border-top:5px solid #fff;
  text-align:center;
}
.clientList:after {
  content:'';
  position:absolute;
  z-index:-1;
  left:0;
  top:0;
  width:100%;
  height:100%;
  background-repeat:no-repeat;
  background-size:50% 50%, 50% 50%;
  background-position:0 0, 100% 0, 100% 100%, 0 100%;
  animation:opacityChange 3s infinite alternate;
  background-color:#fde071;
  background-color:#fff;
}
.clientList p {
  position:relative;
  margin-top:0;
  width:100%;
  padding:50px 0;
  font-size:3rem;
  background:#171717;
}*/
#photoGrid {
  position:relative;
}
#photoGrid div, #photoGrid img {
  transition:all 0.5s ease-in;
}
#photoGrid img {
  padding:30px 0 0 30px;
  cursor:pointer;
}
#photoGrid .rowOne {
  position:relative;
}
#photoGrid .rowOne img, #photoGrid .rowOne div {
  display:inline-block;
}
#photoGrid .rowOne img {
  position:relative;
  width:60%;
}
#photoGrid .rowOne div {
  padding-left:30px;
  width:28%;
}
#photoGrid .rowOne h2 {
  font-size:3rem;
}
#photoGrid .rowOne p {
  position:absolute;
  bottom:31.5%;
  right:30.5%;
}
#photoGrid .rowOne #photoView {
  position:absolute;
  bottom:25%;
  right:0;
  width:50%;
  border-bottom:1px solid #fff;
}
#photoGrid .rowOne div#photoGridCursor {
  position:absolute;
  width:215px;
  height:50px;
  top:55%;
  left:30%;
  transform:translate(-50%,-50%);
  background:rgba(0,0,0,0.75);
  transition:transform 0.05s;
  transition:all 0.3s;
  pointer-events:none;
  z-index:999;
}
#photoGrid .rowTwo {
  position:relative;
}
#photoGrid .rowTwo img {
  position:relative;
  z-index:2;
}
#photoGrid .rowTwo img:first-child {
  margin:-42.5% 0 0 14%;
  width:30%;
}
#photoGrid .rowTwo img:nth-child(2) {
  margin:-42.7% 0 0 -40%;
  width:50%;
}
#photoGrid .rowThree {
  margin-top:-30%;
  padding-bottom:15%;
}
#photoGrid .rowThree img {
  position:relative;
  z-index:3;
}
#photoGrid .rowThree img:first-child {
  margin-left:15%;
  width:28%;
}
#photoGrid .rowThree img:nth-child(2) {
  margin-left:-27.7%;
  width:27%;
}
#photoGrid .rowThree img:nth-child(3) {
  margin-left:-25.35%;
  width:23%;
}
#photoGrid .rowThree img:nth-child(4) {
  margin-left:-22.2%;
  width:21%;
}
#photoGrid .button-circle {
  margin-left:15%;
}
#artwork {
  position:relative;
  width:74%;
  margin:auto;
}
#artworkWrapper {
  border:5px solid #fde071;
  border:5px solid #fff;
  padding:1%;
}
#artworkWrapper:after {
  content:'';
  position:absolute;
  z-index:-1;
  top:0;
  left:0;
  width:100%;
  height:100%;
  animation:opacityChange 3s infinite alternate;
  background-color:#fde071;
  background-color:#fff;
}
#artwork img {
  width:100%;
}
#artworkContent {
  position:absolute;
  top:5%;
  left:5%;
  width:40%;
  height:95%;
}
#artworkContent h2 {
  font-size:4rem;
}
#artworkContent p {
  position:absolute;
  top:39.3%;
  font-size:1.5rem;
}
#artworkView {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(0,-50%);
}
.button-circle span {
  font-size:1.5rem;
}
#headerCircle span {
  font-size:2.5rem;
}
.test {
  position:absolute;
  top:70%;
}
.testTwo {
  position:relative;
  top:0;
}
#hamburger {
  z-index:999;
}
#menu {
  position:absolute;
  padding-top:15%;
  text-align:center;
  width:100%;
  display:none;
  z-index:999;
}
#menu li a:hover {
  color:#000;
}
#navigation li {
  font-size:1.8em;
  margin-bottom:20px;
}
.highlight {
  color:#e74c3c;
  margin-bottom:15px;
}
section {
  text-align:left;
  margin:auto;
}
section h2 {
  padding:15px 0;
}
.overlay {
  position:absolute;
  width:100%;
  height:100%;
  text-align:center;
  background:rgba(0,0,0,0.3);
}
.overlay h3 {
  position:relative;
  top:45%;
  margin:auto;
  color:#fff;
  font-size:4em;
  opacity:1;
}
.underline {
  position:relative;
  margin-top:20px;
  max-width:500px;
  height:1px;
  color:#fff;
  background-color:#fff;
  border:0;
}
footer {
  position:relative;
  padding:0;
  padding:0 2% 0 2%;
}
footer hr {
  border:0;
    height:1px;
    background:#fff;
    margin:30px 0;
}
footer div {
  position:relative;
  top:-10px;
}
@media all and (max-width:580px) {
  html, body {
    height:auto;
  }
  footer {
    font-size:1.2em;
  }
  footer div {
    width:100%;
    text-align:center;
  }
  footer .right {
    margin-top:10px;
    float:none;
  }
}

@media (max-width:560px) and (orientation:portrait) {
  footer div {
    top:0;
  }
}

@media all and (max-width:700px) and (orientation:landscape) {
  footer {
      font-size:1.2em;
  }
  footer div {
    width:100%;
    text-align:center;
  }
  footer .right {
    margin-top:10px;
    float:none;
  }
  footer div {
    top:0;
  }
}

  
.button-circle {
  text-decoration:none;
  width:120px;
  height:120px;
  margin:0 auto;
  position:relative;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row nowrap;
  flex-flow:row nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  text-align:center;
  font:400 italic 20px/1;
  transition:color .5s cubic-bezier(.12,.84,.66,.95); 
  color:#fde071;
}
  

@media only screen and (max-width:767px) {
  .button-circle {
    width:80px;
    height:80px;
    font-size:14px;
  }
}

.button-circle:focus, .button-circle:hover {
  color:#fff;
}
.button-circle:focus .button-circle-hover, .button-circle:hover .button-circle-hover {
  stroke-dashoffset:0;
}
.button-circle span {
  position:relative;
  z-index:2;
}
.button-circle svg {
  width:100%;
  position:absolute;
  left:0;
  top:0;
  z-index:1;
}
.button-circle circle {
  fill:none;
  stroke-width:5;
  stroke-miterlimit:10; 
}
.button-circle-shape {
  stroke:hsla(0,0%,100%,.3); 
}
.light .button-circle-shape {
  stroke:hsla(0,0%,8%,1); 
}
.button-circle-hover {
  transform:rotate(-90deg);
  transform-origin:center center;
  stroke:#fde071;
  stroke-dasharray:1300;
  stroke-dashoffset:1300;
  transition:stroke-dashoffset .5s cubic-bezier(.12,.84,.66,.95); 
}

@media only screen and (max-width:1023px) {
  .button-circle-hover {
    stroke-dashoffset:0;
  }
}

.button-view {
  font:700 normal 14px/1;
  letter-spacing:.4em;
  text-transform:uppercase;
  color:#58595b;
  text-decoration:none;
  display:inline-block;
  position:relative;
  padding:1em;
  left:-.7em;
  overflow:hidden; 
}

@media only screen and (max-width:767px) {
  .button-view {
    font-size:12px;
  }
}

.button-view:before {
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  border-bottom:2px solid #a70303;
  width:100%;
  transform:translateX(calc(-100% + 2.5em));
  transition:transform .5s }
  .button-view:hover:before {
  transform:translateX(calc(100% - 2.5em)); 
}
.footer {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  -ms-flex-pack:justify;
  justify-content:space-between;
  text-align:center;
  padding:130px 60px 60px;
  position:relative;
  z-index:3; 
}

@media only screen and (max-width:1023px) {
  .footer {
    padding:80px 40px 40px; 
  }
}

@media only screen and (max-width:767px) {
  .footer {
    padding:60px 20px 20px;
  }
}

.footer-section {
  width:calc(100%);
  padding:80px 40px;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  -ms-flex-align:center;
  align-items:center;
}

@media only screen and (max-width:1023px) {
  .footer-section {
    padding:40px 20px; 
  }
}

@media only screen and (max-width:767px) {
  .footer-section {
    width:100%; 
  }
}

.footer-contact {
  background-color:#282828; 
}
.footer-contact .button-circle {
  margin-top:40px; 
}
.footer-social {
  background-color:#202020; 
}

@media only screen and (max-width:767px) {
  .footer-social {
    margin-top:20px; 
  }
}

.footer-title {
  font:500 normal 38px/1.2;
  color:#8b8b8f }

@media only screen and (max-width:1200px) {
  .footer-title {
    font-size:30px;
  }
}

@media only screen and (max-width:1023px) {
  .footer-title {
    font-size:24px;
  }
}

@media only screen and (max-width:480px) {
  .footer-title {
    font-size:5.5vw;
  }
}

.footer-title+.footer-subtitle {
  margin-top:.3em;
}
.footer-subtitle {
  font:400 italic 30px/1.2;
  color:#4c4c4c;
}

@media only screen and (max-width:1200px) {
  .footer-subtitle {
  font-size:24px }
   }
  @media only screen and (max-width:1023px) {
  .footer-subtitle {
  font-size:20px }
   }
@media only screen and (max-width:480px) {
  .footer-subtitle {
    font-size:5vw;
   }
}

.social {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-pack:start;
  justify-content:flex-start;
  margin-top:60px;
  width:auto;
}

@media only screen and (max-width:767px) {
  .social {
    margin-top:30px; 
  }
 }

.social-item {
list-style-type:none }
.social-item+.social-item {
margin-left:10px }
.social a {
display:block;
width:60px;
height:60px;
background-color:#171717;
background-position:50%;
background-repeat:no-repeat;
transition:background-color .2s;
position:relative }
@media only screen and (max-width:480px) {
.social a {
width:50px;
height:50px }
 }
.social a:after {
content:"";
position:absolute;
left:0;
bottom:0;
width:100%;
height:0;
background-color:#fff;
opacity:.2;
transition:height .3s cubic-bezier(.12,.84,.66,.95) }
.social a:focus:after,.social a:hover:after {
height:100% }
.social a.facebook {
  background-image:url(../images/facebook.svg);
  background-size:auto 40%;
}
.social a.instagram {
  background-image:url(../images/instagram.svg);
  background-size:auto 44%; 
}

@media all and (max-width:801px) {
  @-webkit-keyframes backandforth {
    0% {
      left:33%;
    } 
    50% {
      left:42%;
    } 
    100% {
      left:33%;
    }
  }
  @keyframes backandforth {
    0% {
      left:33%;
    } 
    50% {
      left:42%;
    } 
    100% {
      left:33%;
    }
  }
  .header-nav-item p {
    top:72px;
    padding:0 25px;
    font-size:3rem;
  }
  #headerTagline {
    width:700px;
  }
  #headerTagline h2 {
    font-size:6rem;
  }
  #headerTagline h3 {
    top:13%;
  }
  .sectionIntroTitle h3 {
    font-size:2.8rem;
  }
  #introAbout .rowOne div:first-child {
    width:95%;
  }
  #clientListContainer .button-circle {
    margin-left:4.5%;
  }
  #photoGrid .rowOne div {
    width:35%;
  }
  #photoGrid .rowOne h2 {
    position:relative;
    top:-35px;
    font-size:1.5rem;
  }
  #photoGrid .rowOne div#photoGridCursor {
    top:60%;
    left:31%;
  }
  #photoGrid .rowOne p {
    right:26.5%;
  }
  #artworkContent h2 {
    font-size:2rem;
  }
  #artworkContent p {
    top:30%;
    font-size:1.2rem;
  }
  #artworkView {
    left:47%;
  }
}
@media all and (width:1024px) {
  .sectionIntroTitle h3 {
    font-size:3.6rem;
  }
  #artworkContent h2 {
    font-size:3.1rem;
  }
  #artworkContent p {
    top:34.7%;
  }
  .dividerRight {
    left:25%;
    width:70%;
  }
  nav {
    position:relative;
    top:-11px;
  }
  #navAbout {
    margin-top:-29px;
  }
  #introAbout .rowOne div:first-child {
    width:66%;
  }
  #clients h2 {
    font-size:3rem;
  }
  #clientList p {
    font-size:2rem;
  }
  #photoGrid .rowOne div {
    width:37%;
  }
  #photoGrid .rowOne h2 {
    top:-65px;
    font-size:2rem;
  }
  #artworkView {
    left:47%;
  }
}
@media all and (min-width:1279px) {
  .sectionIntroTitle h3 {
    font-size:4.5rem;
  }
}
@media all and (min-width:1365px) {
  .sectionIntroTitle h3 {
    font-size:4.8rem;
  }
}
@media all and (max-width:799px) {
  .fullHeight {
    height:100vh;
  }
  #logo {
    font-size:1.4rem;
  }
  nav {
    position:fixed;
    top:0;
    left:0;
    width:100vw;
    height:100vh;
    z-index:999;
  }
  .header-nav-items {
    width:100%;
    margin:65% auto;
  }
  .header-nav-item p {
    top:0px;
    font-size:2rem;
  }
  #headerCircle, .dividerLeft {
    left:45%;
  }
  #headerCircle {
    bottom:75px;
  }
  .button-circle span {
    font-size:1rem;
  }
  .inline {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
  }
  .inline li {
    display:block;
    font-size:2rem;
    text-align:center;
    line-height:2;
    padding:0;
  }
  #navAbout {
    position:relative;
    margin-top:0;
    float:none;
    border:0;
    padding:0;
  }
  #introContent h2 {
    position:relative;
    left:-3.5%;
    font-size:3.4rem;
    text-align:center;
  }
  #headerTagline {
    position:relative;
    margin-top:%;
    left:0;
    padding-left:3.5%;
    width:auto;
    transform:translate(0,-100%);
  }
  #headerTagline h3 {
    position:relative;
    margin:25px 0 0 5%;
    right:0;
    width:95%;
  }
  #sectionIntroTitle {
    position:absolute;
    bottom:0;
    left:0;
    width:auto;
  }
  #sectionIntroTitle h3 {
    font-size:2rem;
  }
  .sectionIntro div:first-child {
    width:90%;
    height:50px;
  }
  .button-circle {
    margin-left:25%;
  }
  #introAbout h2, #clients h2, #photoGrid .rowOne h2, #introContent .footer-section h2 {
    font-size:1.4rem;
  }
  #introAbout .rowOne div:first-child {
    width:100%;
    margin-bottom:10%;
  }
  #introAbout .rowTwo div:first-child {
    margin-left:-6px;
    left:0;
    width:0;
  }
  #aboutTwo {
    position:relative;
    top:-40px;
    right:0;
    width:90%;
  }
  .clientList {
    position:relative;
    width:100%;
  }
  .clientList img {
    width:100%;
  }
  #clients .row div:nth-child(2) {
    padding:20% 5% 0 3%;
    width:100%;
    height:210px;
  }
  #photoGrid .rowOne div {
    position:relative;
    margin-top:40px;
    width:100%;
    padding:0 5%;
  }
  #photoGrid .rowOne #photoView {
    bottom:50%;
  }
  #photoGrid .rowOne div#photoGridCursor {
    width:192px;
    top:40%;
    left:34%;
  }
  #photoGrid .button-circle {
    margin-left:-5%;
  }
  #photoGrid img {
    padding:0;
  }
  #photoGrid .rowOne div#photoGridCursor, #photoGrid .rowTwo, #photoGrid .rowThree, #artworkContent p {
    display:none;
    visibility:hidden;
  }
  #photoGrid .rowTwo img:first-child {
    margin:-92.5% 0 0 14%;
  }
  #photoGrid .rowTwo img:nth-child(2) {
    margin:-90% 0 0 -40%;
  }
  #photoGrid .rowThree {
    margin-top:-58%;
  }
  #artworkContent {
    width:35%;
  }
  #artworkContent h2 {
    position:relative;
    top:30%;
    font-size:1rem;
  }
  #artworkView {
    left:35%;
  }
}