/* line 5, ../scss/pageStyles.scss */
nav {
  height: 100px;
  z-index: 2;
  position: relative;
  display: grid;
  grid-template-columns: 1fr 70% 1fr;
}
@media screen and (max-width: 900px) {
  /* line 5, ../scss/pageStyles.scss */
  nav {
    grid-template-columns: 1fr 55% 1fr;
  }
}
/* line 8, ../scss/pageStyles.scss */
nav .nav-back {
  padding: 40px 0 40px 80px;
  grid-column: 1;
}
@media screen and (max-width: 1200px) {
  /* line 8, ../scss/pageStyles.scss */
  nav .nav-back {
    padding: 40px;
  }
}
@media screen and (max-width: 900px) {
  /* line 8, ../scss/pageStyles.scss */
  nav .nav-back {
    padding: 40px 20px;
  }
}
@media screen and (max-width: 500px) {
  /* line 8, ../scss/pageStyles.scss */
  nav .nav-back {
    padding: 40px 10px;
  }
}
/* line 13, ../scss/pageStyles.scss */
nav .nav-back a {
  font-size: 0.8em;
}
/* line 14, ../scss/pageStyles.scss */
nav .nav-back a img {
  width: 15px;
  margin-right: 10px;
}
/* line 18, ../scss/pageStyles.scss */
nav ul {
  padding: 40px 0;
  text-align: center;
  grid-column: 2;
}
/* line 19, ../scss/pageStyles.scss */
nav ul li {
  list-style-type: none;
  display: inline-block;
  text-align: center;
  padding: 0 10px;
}
@media screen and (max-width: 900px) {
  /* line 19, ../scss/pageStyles.scss */
  nav ul li {
    padding: 0 6.6666666667px;
  }
}
/* line 21, ../scss/pageStyles.scss */
nav ul li a {
  font-size: 1em;
}

/* line 30, ../scss/pageStyles.scss */
.home {
  margin: 0 160px;
  position: relative;
}
@media screen and (max-width: 1200px) {
  /* line 30, ../scss/pageStyles.scss */
  .home {
    margin: 0 80px;
  }
}
@media screen and (max-width: 900px) {
  /* line 30, ../scss/pageStyles.scss */
  .home {
    margin: 0;
  }
}
/* line 34, ../scss/pageStyles.scss */
.home .intro {
  height: auto;
  z-index: 1;
  position: relative;
}
/* line 37, ../scss/pageStyles.scss */
.home .intro .introText {
  text-align: center;
  font-family: "Hind", sans-serif;
  font-weight: 400;
  font-size: 1em;
  color: #6b6b6b;
  width: 300px;
  margin: 0 auto;
  position: relative;
  bottom: 0px;
  padding: 50px 0 100px;
  line-height: 1.8em;
}
/* line 38, ../scss/pageStyles.scss */
.home .intro .introText span.topline {
  font-weight: 700;
  line-height: 1.5em;
}
/* line 39, ../scss/pageStyles.scss */
.home .intro .introText span.tiadear {
  color: #f15d52;
  font-weight: 700;
}
/* line 40, ../scss/pageStyles.scss */
.home .intro .introText span.funwords {
  font-weight: 700;
  line-height: 1.5em;
}
/* line 44, ../scss/pageStyles.scss */
.home .logo {
  display: inline-block;
  width: 60px;
  position: absolute;
  bottom: -40px;
  left: 5%;
}
@media screen and (max-width: 900px) {
  /* line 44, ../scss/pageStyles.scss */
  .home .logo {
    left: 20px;
  }
}
@media screen and (max-width: 600px) {
  /* line 44, ../scss/pageStyles.scss */
  .home .logo {
    width: 80px;
  }
}
/* line 49, ../scss/pageStyles.scss */
.home .bg-grass {
  height: 50px;
  width: calc(100%);
  z-index: 10;
  pointer-events: none;
  position: relative;
}
@media screen and (max-width: 900px) {
  /* line 49, ../scss/pageStyles.scss */
  .home .bg-grass {
    width: 100%;
  }
}
/* line 52, ../scss/pageStyles.scss */
.home .bg-grass .grass {
  width: 100%;
  height: 100%;
  background: url("../images/grass-green.png") 50% 100% no-repeat;
  background-size: cover;
}

/* line 58, ../scss/pageStyles.scss */
.portfolio {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  margin: 0 160px;
}
@media screen and (max-width: 1200px) {
  /* line 58, ../scss/pageStyles.scss */
  .portfolio {
    margin: 0 80px;
  }
}
@media screen and (max-width: 900px) {
  /* line 58, ../scss/pageStyles.scss */
  .portfolio {
    margin: 0;
    display: grid;
  }
}
/* line 62, ../scss/pageStyles.scss */
.portfolio .portfolioPiece {
  cursor: pointer;
  grid-column: 1 / span 6;
  height: 500px;
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  overflow: hidden;
}
@media screen and (max-width: 900px) {
  /* line 62, ../scss/pageStyles.scss */
  .portfolio .portfolioPiece {
    height: 400px;
    grid-template-rows: 300px auto;
  }
}
/* line 65, ../scss/pageStyles.scss */
.portfolio .portfolioPiece .projectTitle {
  color: #fff;
  font-size: 8em;
  text-transform: uppercase;
  font-family: "Hind", sans-serif;
  font-weight: 700;
  line-height: 1em;
  opacity: 0.5;
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  padding: 5% 0;
}
@media screen and (max-width: 900px) {
  /* line 65, ../scss/pageStyles.scss */
  .portfolio .portfolioPiece .projectTitle {
    font-size: 2em;
    transform: translate(-50%, -50%);
    grid-row: 2;
  }
}
/* line 71, ../scss/pageStyles.scss */
.portfolio .portfolioPiece:hover .projectTitle {
  opacity: 1;
}
/* line 73, ../scss/pageStyles.scss */
.portfolio .portfolioPiece:hover .portfolioImage img {
  animation: slowgrow 10s;
}
/* line 77, ../scss/pageStyles.scss */
.portfolio .portfolioPiece .portfolioImage {
  height: 500px;
  margin: 0;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 900px) {
  /* line 77, ../scss/pageStyles.scss */
  .portfolio .portfolioPiece .portfolioImage {
    height: auto;
    overflow: visible;
    grid-row: 1;
  }
}
/* line 79, ../scss/pageStyles.scss */
.portfolio .portfolioPiece .portfolioImage img {
  max-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/* line 84, ../scss/pageStyles.scss */
.portfolio .portfolioPiece:nth-of-type(2n+1) .portfolioImage {
  grid-column: 2 / span 2;
}
@media screen and (max-width: 900px) {
  /* line 84, ../scss/pageStyles.scss */
  .portfolio .portfolioPiece:nth-of-type(2n+1) .portfolioImage {
    grid-column: 1 / span 3;
  }
}
/* line 87, ../scss/pageStyles.scss */
.portfolio .portfolioPiece:nth-of-type(2n+1) .projectTitle {
  grid-column: 1 / span 2;
  text-align: left;
}
@media screen and (max-width: 900px) {
  /* line 87, ../scss/pageStyles.scss */
  .portfolio .portfolioPiece:nth-of-type(2n+1) .projectTitle {
    grid-column: 1 / span 3;
    text-align: center;
  }
}
/* line 92, ../scss/pageStyles.scss */
.portfolio .portfolioPiece:nth-of-type(2n+2) .portfolioImage {
  grid-column: 1 / span 2;
}
@media screen and (max-width: 900px) {
  /* line 92, ../scss/pageStyles.scss */
  .portfolio .portfolioPiece:nth-of-type(2n+2) .portfolioImage {
    grid-column: 1 / span 3;
  }
}
/* line 95, ../scss/pageStyles.scss */
.portfolio .portfolioPiece:nth-of-type(2n+2) .projectTitle {
  grid-column: 2 / span 2;
  text-align: right;
}
@media screen and (max-width: 900px) {
  /* line 95, ../scss/pageStyles.scss */
  .portfolio .portfolioPiece:nth-of-type(2n+2) .projectTitle {
    grid-column: 1 / span 3;
    text-align: center;
  }
}

/* line 107, ../scss/pageStyles.scss */
.casestudy {
  width: 100%;
  display: grid;
  padding-bottom: 80px;
}
/* line 109, ../scss/pageStyles.scss */
.casestudy .divider {
  max-width: 500px;
  width: 80%;
  margin: 0 auto;
  height: 1px;
  background-color: rgba(164, 164, 164, 0.5);
}
/* line 110, ../scss/pageStyles.scss */
.casestudy h4, .casestudy h5, .casestudy h6, .casestudy p {
  text-align: left;
}
/* line 111, ../scss/pageStyles.scss */
.casestudy h4, .casestudy h5 {
  color: #f15d52;
  display: block;
}
/* line 112, ../scss/pageStyles.scss */
.casestudy h5, .casestudy h6 {
  padding-top: 20px;
}
@media screen and (max-width: 900px) {
  /* line 112, ../scss/pageStyles.scss */
  .casestudy h5, .casestudy h6 {
    padding-top: 10px;
  }
}
/* line 115, ../scss/pageStyles.scss */
.casestudy h6 {
  color: #6b6b6b;
  display: block;
}
/* line 116, ../scss/pageStyles.scss */
.casestudy ul {
  padding: 20px 40px 0 15px;
  list-style: none;
}
/* line 117, ../scss/pageStyles.scss */
.casestudy ul li::before {
  content: '\2022';
  color: #f15d52;
  display: inline-block;
  width: 1em;
  margin-left: -1em;
  font-weight: bold;
}
/* line 118, ../scss/pageStyles.scss */
.casestudy ul li {
  color: #6b6b6b;
  padding-bottom: 10px;
}
@media screen and (max-width: 900px) {
  /* line 116, ../scss/pageStyles.scss */
  .casestudy ul {
    padding: 20px 0 0 15px;
  }
}
/* line 121, ../scss/pageStyles.scss */
.casestudy ol {
  padding: 20px 40px 0 15px;
  color: #f15d52;
  list-style: none;
  counter-reset: li;
}
/* line 122, ../scss/pageStyles.scss */
.casestudy ol li::before {
  content: counter(li);
  color: #f15d52;
  display: inline-block;
  width: 1em;
  margin-left: -1em;
  font-weight: bold;
}
/* line 123, ../scss/pageStyles.scss */
.casestudy ol li {
  color: #6b6b6b;
  padding-bottom: 10px;
  counter-increment: li;
}
@media screen and (max-width: 900px) {
  /* line 121, ../scss/pageStyles.scss */
  .casestudy ol {
    padding: 20px 0 0 15px;
  }
}
/* line 127, ../scss/pageStyles.scss */
.casestudy span {
  color: #a4a4a4;
  font-style: italic;
  font-family: "Karma", serif;
  font-size: 1em;
  overflow-wrap: break-word;
}
/* line 128, ../scss/pageStyles.scss */
.casestudy span.highlight {
  color: #6b6b6b;
  font-style: normal;
  font-weight: bold;
  font-family: "Hind", sans-serif;
  font-size: 1em;
  display: inline-block;
  padding-bottom: 0;
}
/* line 129, ../scss/pageStyles.scss */
.casestudy img {
  display: block;
  padding: 20px;
}
/* line 130, ../scss/pageStyles.scss */
.casestudy .caption {
  font-size: 0.9em;
  color: #a4a4a4;
}
/* line 134, ../scss/pageStyles.scss */
.casestudy .caseStudyHeader {
  grid-template-columns: 1fr;
  padding: 0 80px;
}
@media screen and (max-width: 600px) {
  /* line 134, ../scss/pageStyles.scss */
  .casestudy .caseStudyHeader {
    padding: 20px;
  }
}
/* line 137, ../scss/pageStyles.scss */
.casestudy .caseStudyHeader .caseStudyHeaderContent {
  padding: 40px 0 0;
  max-width: 600px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 80px auto;
}
@media screen and (max-width: 600px) {
  /* line 137, ../scss/pageStyles.scss */
  .casestudy .caseStudyHeader .caseStudyHeaderContent {
    padding: 40px 0;
  }
}
@media screen and (max-width: 400px) {
  /* line 137, ../scss/pageStyles.scss */
  .casestudy .caseStudyHeader .caseStudyHeaderContent {
    padding: 20px 0;
  }
}
/* line 141, ../scss/pageStyles.scss */
.casestudy .caseStudyHeader .caseStudyHeaderContent h4, .casestudy .caseStudyHeader .caseStudyHeaderContent h6 {
  padding: 0 10px 0 0;
}
/* line 142, ../scss/pageStyles.scss */
.casestudy .caseStudyHeader .caseStudyHeaderContent h4 {
  grid-column: 1 / span 2;
}
/* line 143, ../scss/pageStyles.scss */
.casestudy .caseStudyHeader .caseStudyHeaderContent h6 {
  width: 80px;
}
/* line 145, ../scss/pageStyles.scss */
.casestudy .caseStudyHeader .caseStudyHeaderContent p, .casestudy .caseStudyHeader .caseStudyHeaderContent span {
  align-self: center;
}
/* line 148, ../scss/pageStyles.scss */
.casestudy .caseStudyHeader .caseStudyHeaderImage {
  height: 700px;
  background-size: cover;
  background-position: 50%;
}
@media screen and (max-width: 1920px) {
  /* line 148, ../scss/pageStyles.scss */
  .casestudy .caseStudyHeader .caseStudyHeaderImage {
    height: 600px;
  }
}
@media screen and (max-width: 1800px) {
  /* line 148, ../scss/pageStyles.scss */
  .casestudy .caseStudyHeader .caseStudyHeaderImage {
    height: 500px;
  }
}
@media screen and (max-width: 800px) {
  /* line 148, ../scss/pageStyles.scss */
  .casestudy .caseStudyHeader .caseStudyHeaderImage {
    height: 400px;
  }
}
/* line 152, ../scss/pageStyles.scss */
.casestudy .caseStudyHeader .caseStudyHeaderImage img {
  display: block;
}
/* line 156, ../scss/pageStyles.scss */
.casestudy .caseStudySection {
  display: grid;
  padding: 80px;
}
@media screen and (max-width: 900px) {
  /* line 156, ../scss/pageStyles.scss */
  .casestudy .caseStudySection {
    padding: 40px 80px;
  }
}
@media screen and (max-width: 600px) {
  /* line 156, ../scss/pageStyles.scss */
  .casestudy .caseStudySection {
    padding: 40px;
  }
}
@media screen and (max-width: 400px) {
  /* line 156, ../scss/pageStyles.scss */
  .casestudy .caseStudySection {
    padding: 20px;
  }
}
/* line 162, ../scss/pageStyles.scss */
.casestudy .caseStudySection .sectionText img {
  width: 100%;
  height: auto;
}
/* line 165, ../scss/pageStyles.scss */
.casestudy .caseStudySection .sectionImage img {
  width: 100%;
  height: auto;
}
/* line 169, ../scss/pageStyles.scss */
.casestudy .caseStudySectionText, .casestudy .caseStudySectionProcess, .casestudy .caseStudySectionVisuals, .casestudy .outcomeSummary {
  grid-template-columns: 1fr 1fr 600px 1fr 1fr;
}
@media screen and (max-width: 900px) {
  /* line 169, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionText, .casestudy .caseStudySectionProcess, .casestudy .caseStudySectionVisuals, .casestudy .outcomeSummary {
    grid-template-columns: 1fr;
  }
}
/* line 172, ../scss/pageStyles.scss */
.casestudy .caseStudySectionText .sectionText, .casestudy .caseStudySectionText h4, .casestudy .caseStudySectionProcess .sectionText, .casestudy .caseStudySectionProcess h4, .casestudy .caseStudySectionVisuals .sectionText, .casestudy .caseStudySectionVisuals h4, .casestudy .outcomeSummary .sectionText, .casestudy .outcomeSummary h4 {
  grid-column: 3 / span 1;
}
@media screen and (max-width: 900px) {
  /* line 172, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionText .sectionText, .casestudy .caseStudySectionText h4, .casestudy .caseStudySectionProcess .sectionText, .casestudy .caseStudySectionProcess h4, .casestudy .caseStudySectionVisuals .sectionText, .casestudy .caseStudySectionVisuals h4, .casestudy .outcomeSummary .sectionText, .casestudy .outcomeSummary h4 {
    grid-column: 1 / span 1;
  }
}
/* line 174, ../scss/pageStyles.scss */
.casestudy .caseStudySectionText .sectionText img, .casestudy .caseStudySectionText h4 img, .casestudy .caseStudySectionProcess .sectionText img, .casestudy .caseStudySectionProcess h4 img, .casestudy .caseStudySectionVisuals .sectionText img, .casestudy .caseStudySectionVisuals h4 img, .casestudy .outcomeSummary .sectionText img, .casestudy .outcomeSummary h4 img {
  grid-column: 1 / span 3;
}
/* line 176, ../scss/pageStyles.scss */
.casestudy .caseStudySectionText .sectionImage, .casestudy .caseStudySectionProcess .sectionImage, .casestudy .caseStudySectionVisuals .sectionImage, .casestudy .outcomeSummary .sectionImage {
  grid-column: 2 / span 3;
}
@media screen and (max-width: 900px) {
  /* line 176, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionText .sectionImage, .casestudy .caseStudySectionProcess .sectionImage, .casestudy .caseStudySectionVisuals .sectionImage, .casestudy .outcomeSummary .sectionImage {
    grid-template-columns: 1fr;
    grid-column: 1 / span 1;
  }
}
/* line 178, ../scss/pageStyles.scss */
.casestudy .caseStudySectionText .sectionImage img, .casestudy .caseStudySectionProcess .sectionImage img, .casestudy .caseStudySectionVisuals .sectionImage img, .casestudy .outcomeSummary .sectionImage img {
  max-width: 1200px;
  margin: 0 auto;
}
/* line 179, ../scss/pageStyles.scss */
.casestudy .caseStudySectionText .sectionImage .caption, .casestudy .caseStudySectionProcess .sectionImage .caption, .casestudy .caseStudySectionVisuals .sectionImage .caption, .casestudy .outcomeSummary .sectionImage .caption {
  text-align: center;
  padding-bottom: 20px;
}
/* line 182, ../scss/pageStyles.scss */
.casestudy .caseStudySectionOutcome {
  grid-template-columns: 1fr 1fr;
}
@media screen and (max-width: 900px) {
  /* line 182, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionOutcome {
    grid-template-columns: 1fr;
  }
}
/* line 190, ../scss/pageStyles.scss */
.casestudy .caseStudySectionProcess .sectionPoints {
  grid-column: 3 / span 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  padding-bottom: 40px;
}
@media screen and (max-width: 900px) {
  /* line 190, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionProcess .sectionPoints {
    grid-column: 1 / span 1;
  }
}
@media screen and (max-width: 550px) {
  /* line 190, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionProcess .sectionPoints {
    grid-template-columns: 1fr;
  }
}
/* line 194, ../scss/pageStyles.scss */
.casestudy .caseStudySectionProcess .sectionPoints h6 {
  grid-column: 1 / span 2;
}
@media screen and (max-width: 550px) {
  /* line 194, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionProcess .sectionPoints h6 {
    grid-column: 1 / span 1;
  }
}
/* line 198, ../scss/pageStyles.scss */
.casestudy .caseStudySectionProcess .sectionPoints .insightbubble {
  vertical-align: top;
  position: relative;
  border-radius: 20px;
  padding: 40px 20px;
}
/* line 199, ../scss/pageStyles.scss */
.casestudy .caseStudySectionProcess .sectionPoints .insightbubble p {
  font-family: "Karma", serif;
  color: #525252;
}
/* line 206, ../scss/pageStyles.scss */
.casestudy .caseStudySectionVisuals .sectionColours {
  grid-column: 3 / span 1;
}
@media screen and (max-width: 900px) {
  /* line 206, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionVisuals .sectionColours {
    grid-column: 1 / span 1;
    padding: 20px 0;
  }
}
/* line 209, ../scss/pageStyles.scss */
.casestudy .caseStudySectionVisuals img.small {
  max-width: 250px;
  margin: 0 auto;
}
/* line 211, ../scss/pageStyles.scss */
.casestudy .colourCat {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  padding: 10px 0 20px;
}
@media screen and (max-width: 1400px) {
  /* line 211, ../scss/pageStyles.scss */
  .casestudy .colourCat {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media screen and (max-width: 600px) {
  /* line 211, ../scss/pageStyles.scss */
  .casestudy .colourCat {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* line 215, ../scss/pageStyles.scss */
.casestudy .colourCat .colour {
  justify-self: center;
  padding: 20px 10px;
  height: 140px;
  width: 120px;
  position: relative;
}
@media screen and (max-width: 700px) {
  /* line 215, ../scss/pageStyles.scss */
  .casestudy .colourCat .colour {
    padding: 10px;
    height: 150px;
    width: 100%;
  }
}
@media screen and (max-width: 600px) {
  /* line 215, ../scss/pageStyles.scss */
  .casestudy .colourCat .colour {
    padding: 6.6666666667px;
  }
}
/* line 219, ../scss/pageStyles.scss */
.casestudy .colourCat .colour .colourBlob {
  border-radius: 30px;
  height: 100%;
  width: 100%;
}
@media screen and (max-width: 700px) {
  /* line 219, ../scss/pageStyles.scss */
  .casestudy .colourCat .colour .colourBlob {
    border-radius: 20px;
    height: 80px;
  }
}
/* line 222, ../scss/pageStyles.scss */
.casestudy .colourCat .colour .caption {
  color: #fff;
  opacity: 0;
  font-size: 1em;
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-transform: uppercase;
  font-family: "Hind", sans-serif;
  font-weight: 700;
  text-align: center;
  line-height: 1.2em;
}
@media screen and (max-width: 700px) {
  /* line 222, ../scss/pageStyles.scss */
  .casestudy .colourCat .colour .caption {
    opacity: 1;
    transform: none;
    font-size: 0.9em;
    position: relative;
    top: 0;
    left: 0;
    color: #a4a4a4;
    padding: 10px 0;
    line-height: 1.5em;
  }
}
/* line 226, ../scss/pageStyles.scss */
.casestudy .colourCat .colour:hover {
  padding: 18.1818181818px 8px;
}
/* line 227, ../scss/pageStyles.scss */
.casestudy .colourCat .colour:hover .caption {
  animation-name: appear;
  animation-duration: 1s;
  animation-direction: alternate;
  animation-fill-mode: forwards;
}
@media screen and (max-width: 700px) {
  /* line 227, ../scss/pageStyles.scss */
  .casestudy .colourCat .colour:hover .caption {
    animation-name: none;
  }
}
@media screen and (max-width: 700px) {
  /* line 226, ../scss/pageStyles.scss */
  .casestudy .colourCat .colour:hover {
    padding: 10px;
  }
}
@media screen and (max-width: 600px) {
  /* line 226, ../scss/pageStyles.scss */
  .casestudy .colourCat .colour:hover {
    padding: 6.6666666667px;
  }
}
/* line 240, ../scss/pageStyles.scss */
.casestudy .caseStudySectionOutcome .outcomeSummary {
  grid-column: 1 / span 2;
  display: grid;
}
/* line 242, ../scss/pageStyles.scss */
.casestudy .caseStudySectionOutcome .sectionImage {
  grid-column: 1;
  padding-right: 40px;
  align-self: center;
}
@media screen and (max-width: 900px) {
  /* line 242, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionOutcome .sectionImage {
    padding: 0;
    justify-self: center;
  }
}
/* line 245, ../scss/pageStyles.scss */
.casestudy .caseStudySectionOutcome .sectionImage img {
  max-width: 500px;
  float: right;
}
@media screen and (max-width: 900px) {
  /* line 245, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionOutcome .sectionImage img {
    float: none;
    width: 100%;
  }
}
/* line 250, ../scss/pageStyles.scss */
.casestudy .caseStudySectionOutcome .featureDesc {
  grid-column: 2;
  align-self: center;
  padding-left: 40px;
  width: 90%;
  max-width: 400px;
}
@media screen and (max-width: 900px) {
  /* line 250, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionOutcome .featureDesc {
    grid-column: 1;
    padding: 0 20px;
    justify-self: center;
    text-align: center;
  }
}
@media screen and (max-width: 400px) {
  /* line 250, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionOutcome .featureDesc {
    padding: 0;
    width: 100%;
  }
}
@media screen and (max-width: 900px) {
  /* line 253, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionOutcome .featureDesc p, .casestudy .caseStudySectionOutcome .featureDesc h4 {
    padding: 0;
  }
}
/* line 261, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage {
  grid-template-columns: 1fr;
  padding: 40px 80px;
}
@media screen and (max-width: 600px) {
  /* line 261, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionImage {
    padding: 10px 20px;
  }
}
/* line 263, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage .sectionImage {
  grid-column: 1;
  background-size: cover;
  background-position: 50%;
  height: 600px;
}
@media screen and (max-width: 800px) {
  /* line 263, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionImage .sectionImage {
    height: 500px;
  }
}
/* line 270, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage2 {
  grid-template-columns: 1fr 1fr;
  max-width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 700px) {
  /* line 270, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionImage2 {
    grid-template-columns: 1fr;
  }
}
/* line 273, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage2 .sectionText {
  grid-column: 1 / span 2;
  max-width: 600px;
  margin: 0 auto;
}
@media screen and (max-width: 700px) {
  /* line 273, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionImage2 .sectionText {
    grid-column: 1 / span 1;
  }
}
/* line 277, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage2 .sectionImage {
  padding-top: 20px;
}
/* line 278, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage2 .sectionImage img {
  width: 100%;
  height: auto;
}
/* line 281, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage2 .sectionImage-2 {
  grid-column: 1 / span 2;
  padding-right: 0 !important;
}
@media screen and (max-width: 700px) {
  /* line 281, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionImage2 .sectionImage-2 {
    grid-column: 1 / span 1;
  }
}
/* line 284, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage2 .sectionImage:nth-of-type(2n+2) {
  padding-right: 20px;
}
@media screen and (max-width: 700px) {
  /* line 284, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionImage2 .sectionImage:nth-of-type(2n+2) {
    padding: 20px 0;
  }
}
/* line 287, ../scss/pageStyles.scss */
.casestudy .caseStudySectionImage2 .sectionImage:nth-of-type(2n+1) {
  padding-left: 20px;
}
@media screen and (max-width: 700px) {
  /* line 287, ../scss/pageStyles.scss */
  .casestudy .caseStudySectionImage2 .sectionImage:nth-of-type(2n+1) {
    padding: 20px 0;
  }
}
/* line 295, ../scss/pageStyles.scss */
.casestudy .caseStudyGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 80px;
}
@media screen and (max-width: 1200px) {
  /* line 295, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid {
    padding: 40px;
  }
}
@media screen and (max-width: 900px) {
  /* line 295, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid {
    padding: 20px;
  }
}
@media screen and (max-width: 600px) {
  /* line 295, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid {
    grid-template-columns: 1fr;
  }
}
/* line 300, ../scss/pageStyles.scss */
.casestudy .caseStudyGrid .section:nth-of-type(2n+1) {
  padding-right: 40px;
}
@media screen and (max-width: 1200px) {
  /* line 300, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid .section:nth-of-type(2n+1) {
    padding-right: 20px;
  }
}
@media screen and (max-width: 600px) {
  /* line 300, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid .section:nth-of-type(2n+1) {
    padding: 20px 0;
  }
}
/* line 304, ../scss/pageStyles.scss */
.casestudy .caseStudyGrid .section:nth-of-type(2n) {
  padding-left: 40px;
}
@media screen and (max-width: 1200px) {
  /* line 304, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid .section:nth-of-type(2n) {
    padding-left: 20px;
  }
}
@media screen and (max-width: 600px) {
  /* line 304, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid .section:nth-of-type(2n) {
    padding: 20px 0;
  }
}
/* line 308, ../scss/pageStyles.scss */
.casestudy .caseStudyGrid .section {
  padding: 40px 0;
}
@media screen and (max-width: 1200px) {
  /* line 308, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid .section {
    padding: 20px 0;
  }
}
@media screen and (max-width: 600px) {
  /* line 308, ../scss/pageStyles.scss */
  .casestudy .caseStudyGrid .section {
    padding: 20px 0;
  }
}
/* line 312, ../scss/pageStyles.scss */
.casestudy .caseStudyGrid .section .portfolioImageWrapper, .casestudy .caseStudyGrid .section .portfolioContent {
  width: 100%;
}
/* line 313, ../scss/pageStyles.scss */
.casestudy .caseStudyGrid .section .portfolioImageWrapper img {
  width: 100%;
}
/* line 314, ../scss/pageStyles.scss */
.casestudy .caseStudyGrid .section .portfolioContent {
  max-width: 500px;
  margin: 0 auto;
}

/* line 325, ../scss/pageStyles.scss */
.onpageNav {
  position: fixed;
  z-index: 100;
  top: 40%;
  right: 0;
}
@media screen and (max-width: 600px) {
  /* line 325, ../scss/pageStyles.scss */
  .onpageNav {
    display: none;
  }
}
/* line 327, ../scss/pageStyles.scss */
.onpageNav ul {
  list-style-type: none;
  padding-right: 20px;
}
/* line 328, ../scss/pageStyles.scss */
.onpageNav ul li {
  padding-top: 20px;
}
/* line 329, ../scss/pageStyles.scss */
.onpageNav ul li a {
  font-size: 1.5em;
}
/* line 330, ../scss/pageStyles.scss */
.onpageNav ul li a .number, .onpageNav ul li a .menuItem {
  text-align: right;
  color: #f15d52;
}
/* line 331, ../scss/pageStyles.scss */
.onpageNav ul li a .menuItem {
  display: none;
  padding-left: 10px;
}
/* line 333, ../scss/pageStyles.scss */
.onpageNav ul li a:hover .number, .onpageNav ul li a:hover .menuItem {
  display: inline-block;
}

/* line 345, ../scss/pageStyles.scss */
.moreProjects {
  width: 100%;
  padding: 0 80px;
  text-align: center;
}
@media screen and (max-width: 900px) {
  /* line 345, ../scss/pageStyles.scss */
  .moreProjects {
    padding: 0 20px;
  }
}
/* line 348, ../scss/pageStyles.scss */
.moreProjects h4 {
  padding: 20px 0;
  color: #f15d52;
}
/* line 350, ../scss/pageStyles.scss */
.moreProjects .moreProjectsWrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  height: 200px;
  grid-column-gap: 20px;
}
@media screen and (max-width: 900px) {
  /* line 350, ../scss/pageStyles.scss */
  .moreProjects .moreProjectsWrap {
    grid-column-gap: 10px;
  }
}
@media screen and (max-width: 500px) {
  /* line 350, ../scss/pageStyles.scss */
  .moreProjects .moreProjectsWrap {
    grid-column-gap: 0;
  }
}
/* line 354, ../scss/pageStyles.scss */
.moreProjects .moreProjectsWrap a {
  grid-column: span 1;
  position: relative;
  overflow: hidden;
}
/* line 355, ../scss/pageStyles.scss */
.moreProjects .moreProjectsWrap a .anotherProject {
  width: 100%;
  height: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 1;
  background-position: 50%;
}
/* line 356, ../scss/pageStyles.scss */
.moreProjects .moreProjectsWrap a .anotherProjectTitle {
  color: #fff;
  opacity: 0;
  font-size: 4em;
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-transform: uppercase;
  font-family: "Hind", sans-serif;
  font-weight: 700;
  text-align: center;
  line-height: 1em;
}
@media screen and (max-width: 1600px) {
  /* line 356, ../scss/pageStyles.scss */
  .moreProjects .moreProjectsWrap a .anotherProjectTitle {
    font-size: 3em;
  }
}
@media screen and (max-width: 1200px) {
  /* line 356, ../scss/pageStyles.scss */
  .moreProjects .moreProjectsWrap a .anotherProjectTitle {
    font-size: 2em;
  }
}
@media screen and (max-width: 900px) {
  /* line 356, ../scss/pageStyles.scss */
  .moreProjects .moreProjectsWrap a .anotherProjectTitle {
    display: none;
  }
}
/* line 361, ../scss/pageStyles.scss */
.moreProjects .moreProjectsWrap a:hover .anotherProjectTitle {
  animation-name: appear;
  animation-duration: 1s;
  animation-direction: alternate;
  animation-fill-mode: forwards;
}

/* line 367, ../scss/pageStyles.scss */
.pageContent {
  display: grid;
  grid-template-columns: 1fr 1fr;
  max-width: 800px;
  width: 100%;
  margin: 100px auto;
  padding: 20px;
}
@media screen and (max-width: 900px) {
  /* line 367, ../scss/pageStyles.scss */
  .pageContent {
    grid-template-columns: 1fr;
    margin: 0 auto;
    padding: 40px;
  }
}
@media screen and (max-width: 500px) {
  /* line 367, ../scss/pageStyles.scss */
  .pageContent {
    padding: 20px;
  }
}
/* line 371, ../scss/pageStyles.scss */
.pageContent .pageContent-col p {
  padding-bottom: 10px;
}
/* line 372, ../scss/pageStyles.scss */
.pageContent .pageContent-col span {
  color: #f15d52;
}
/* line 373, ../scss/pageStyles.scss */
.pageContent .pageContent-col h4 {
  padding-bottom: 10px;
  color: #f15d52;
}
/* line 374, ../scss/pageStyles.scss */
.pageContent .pageContent-col h6 {
  padding: 5px 0 0;
  color: #d3e8b9;
}
/* line 375, ../scss/pageStyles.scss */
.pageContent .pageContent-col img {
  width: 100%;
  padding: 20px 0;
}

/* line 380, ../scss/pageStyles.scss */
.contact {
  width: 100%;
  padding: 80px;
  text-align: center;
}

/* line 384, ../scss/pageStyles.scss */
canvas#resume {
  max-width: 850px;
  border: solid 1px #a4a4a4;
}

@keyframes spaceout {
  0% {
    letter-spacing: 0em;
  }
  100% {
    letter-spacing: 12em;
  }
}
@keyframes strike {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
@keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slowgrow {
  0% {
    max-height: 100%;
  }
  100% {
    max-height: 150%;
  }
}