:root {
  --black: #e3e3e3;
  --dim-grey: #68686b;
  --blue: #335fff;
  --text-black: #252526;
}

.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

body {
  background-color: var(--black);
  color: #252526;
  font-family: Inter, sans-serif;
  font-size: 1em;
  line-height: 140%;
}

h1 {
  letter-spacing: -.07em;
  text-shadow: none;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 10.5vh;
  font-weight: 800;
  line-height: 97%;
}

h2 {
  letter-spacing: -.07em;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 9vh;
  font-weight: 700;
  line-height: 110%;
}

h3 {
  letter-spacing: -.05em;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 3em;
  font-weight: 500;
  line-height: 110%;
}

h4 {
  letter-spacing: -.04em;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 2em;
  font-weight: 500;
  line-height: 130%;
}

h5 {
  letter-spacing: -.03em;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.5em;
  font-weight: 600;
  line-height: 120%;
}

h6 {
  color: var(--dim-grey);
  letter-spacing: -.03em;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.2em;
  font-weight: 500;
  line-height: 125%;
}

p {
  margin-bottom: 10px;
}

a {
  text-decoration: none;
}

label {
  color: var(--dim-grey);
  letter-spacing: -.02em;
  margin-bottom: 0;
  font-size: 1.6em;
  font-weight: 400;
  line-height: 100%;
  display: block;
}

strong {
  font-weight: 600;
}

blockquote {
  letter-spacing: -.02em;
  background-color: #fff;
  border-left: 5px solid #ccc;
  margin-bottom: 10px;
  padding: 40px;
  font-size: 1.4em;
  line-height: 150%;
}

.section {
  min-height: 100vh;
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 15vh;
}

.section.hero {
  padding-top: 20vh;
  padding-bottom: 0;
}

.section.skills {
  grid-column-gap: 10vw;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: start;
  min-height: auto;
  padding-left: 10vw;
  padding-right: 10vw;
  display: grid;
}

.section.blog {
  grid-column-gap: 0vw;
  grid-row-gap: 10vh;
  grid-template-rows: auto;
  grid-template-columns: 2fr 3fr;
  grid-auto-columns: 1fr;
  padding-top: 30vh;
  display: none;
}

.section.contact {
  display: block;
}

.section.follow-me {
  min-height: auto;
  display: none;
}

.section.blog-post-page, .section.blog-category-page {
  padding-top: 10vh;
}

.section.client-says {
  display: none;
}

.section.project {
  grid-column-gap: 0vw;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 60% 40%;
  grid-auto-columns: 1fr;
  align-items: start;
  padding-top: 0;
  padding-bottom: 0;
  display: grid;
}

.hero-heading {
  color: var(--blue);
  -webkit-text-stroke-color: var(--blue);
  text-shadow: none;
  width: 60vw;
  margin-bottom: 10vh;
  margin-left: 20vw;
  font-family: Inter, sans-serif;
  line-height: 70%;
  position: relative;
}

.background-scene {
  z-index: -1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: fixed;
  top: 0;
}

.horizontal-line {
  background-color: #bfbfbf;
  width: 100vw;
  height: 1px;
  position: absolute;
  top: 0;
  left: 0;
}

.horizontal-line._10-percent {
  background-color: #6db3ff;
  top: 10%;
}

.horizontal-line._20-percent {
  background-color: #6db3ff;
  top: 20%;
}

.horizontal-line._30-percent {
  background-color: #6db3ff;
  top: 30vh;
}

.horizontal-line._40-percent {
  background-color: #6db3ff;
  top: 40%;
}

.horizontal-line._50-percent {
  background-color: #6db3ff;
  top: 50%;
}

.horizontal-line._60-percent {
  background-color: #6db3ff;
  top: 60vh;
}

.horizontal-line._70-percent {
  background-color: #6db3ff;
  top: 70%;
}

.horizontal-line._80-percent {
  background-color: #6db3ff;
  top: 80%;
}

.horizontal-line._90-percent {
  background-color: #6db3ff;
  top: 90%;
}

.vertical-line {
  background-color: #bfbfbf;
  width: 1px;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
}

.vertical-line._20-percent {
  background-color: #6db3ff;
  left: 20%;
}

.vertical-line._60-percent {
  background-color: #6db3ff;
  left: 60%;
}

.vertical-line._40-percent {
  background-color: #6db3ff;
  left: 40%;
}

.vertical-line._80-percent {
  background-color: #6db3ff;
  left: 80%;
}

.hero-title {
  color: #4a4a4c;
  width: 45vw;
  margin-left: 20vw;
  font-size: 4.5vh;
  font-weight: 500;
  line-height: 100%;
  position: relative;
  top: -58px;
}

.hero-title.left {
  text-align: right;
  margin-left: 30vw;
}

.bio-history {
  letter-spacing: -.04em;
  background-color: #ffffff38;
  width: 37vw;
  min-width: 320px;
  margin-bottom: 0;
  margin-left: 10vw;
  padding: 10px;
  font-size: 1.4em;
  line-height: 170%;
  position: sticky;
  top: 20vh;
}

.bio-image {
  width: 60%;
  margin-top: 50vh;
  display: block;
}

.services-info {
  letter-spacing: -.03em;
  max-width: 320px;
  margin-bottom: 0;
  font-size: 1.2em;
  font-weight: 500;
  line-height: 160%;
}

.skills-item {
  grid-column-gap: 3vh;
  grid-row-gap: 2vh;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  justify-items: start;
  display: grid;
}

.skills-item.fourth {
  margin-top: 10vh;
}

.skills-item.first {
  margin-top: 15vh;
}

.skills-item.third {
  margin-left: -5vw;
}

.container-bio {
  grid-column-gap: 0px;
  grid-row-gap: 20vh;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.bio-image-square {
  display: none;
}

.projects-heading {
  color: #335fff;
  width: 1000px;
  margin-bottom: 1vh;
  margin-left: 39%;
  font-size: 9vh;
  display: inline;
  position: relative;
  left: -36px;
}

.projects-list {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: minmax(auto, 1fr) auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: minmax(auto, .25fr);
  grid-auto-columns: 1fr;
  max-width: 1117.8px;
  margin-top: 51px;
  margin-left: 10%;
  margin-right: 10%;
  display: grid;
}

.projects-item {
  grid-column-gap: 0px;
  grid-row-gap: 5vh;
  -webkit-text-fill-color: inherit;
  background-color: #fff;
  background-clip: border-box;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  width: 50vw;
  max-width: 600px;
  height: 650px;
  margin-top: -54px;
  margin-bottom: 10vh;
}

.projects-item:nth-child(2n) {
  margin-left: auto;
}

.projects-item:last-child {
  margin-bottom: 0;
}

.clients-logos {
  grid-column-gap: 2vw;
  grid-row-gap: 2vw;
  grid-template-rows: auto;
  grid-template-columns: 15vw 15vw 15vw;
  grid-auto-columns: 15vw;
  display: grid;
}

.clients-logo-image {
  opacity: .6;
  padding-top: 0;
  transition: opacity .2s;
}

.clients-logo-image:hover {
  opacity: 1;
}

.projects-item-content {
  padding: 8% 10%;
}

.projects-item-summary {
  color: var(--dim-grey);
  letter-spacing: -.015em;
  margin-top: 3vh;
  margin-bottom: 3vh;
  font-size: 1em;
  font-weight: 500;
  line-height: 150%;
}

.projects-item-meta {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  color: var(--dim-grey);
  letter-spacing: -.02em;
  grid-template-rows: auto;
  grid-template-columns: auto auto;
  grid-auto-columns: 1fr;
  place-items: center start;
  display: grid;
}

.project-items-year {
  letter-spacing: -.04em;
  background-color: #68686b1a;
  border-radius: 2px;
  padding: 4px 10px;
  font-weight: 500;
  display: none;
}

.motto-content {
  grid-column-gap: 0px;
  grid-row-gap: 3vh;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  margin-left: 3vw;
  font-size: 1.2em;
  display: grid;
}

.container-quote {
  background-color: #fff;
  margin-left: 20%;
  margin-right: 20%;
  padding-top: 15vh;
  padding-left: 10vw;
  padding-right: 10vw;
}

.quote-paragraph {
  letter-spacing: -.015em;
  margin-bottom: 10vh;
  font-size: 1.7em;
  font-weight: 500;
  line-height: 135%;
}

.quote-author {
  grid-column-gap: 5vw;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 10vw auto;
  grid-auto-columns: 1fr;
  margin-left: -5vw;
  display: grid;
}

.quote-author-name {
  grid-column-gap: 0px;
  grid-row-gap: 5px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  align-content: center;
  display: grid;
}

.quote-heading {
  margin-left: 20%;
  line-height: 80%;
}

.blog-item-content {
  grid-column-gap: 3vw;
  grid-row-gap: 0vw;
  color: var(--text-black);
  background-color: #fff;
  grid-template-rows: auto;
  grid-template-columns: auto 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  min-height: 20vh;
  padding: 7vh 5vw 7vh 3vw;
  text-decoration: none;
  transition: color .3s, box-shadow .3s;
  display: grid;
}

.blog-item-content:hover {
  color: var(--blue);
  box-shadow: 0 10px 30px -10px #00000029;
}

.blog-post-link {
  text-decoration: none;
  transition: color .3s;
}

.blog-heading {
  text-align: right;
  padding-right: 5vw;
  line-height: 100%;
  position: sticky;
  top: 20vh;
}

.blog-item {
  grid-column-gap: 0vw;
  grid-row-gap: 0vh;
  grid-template-rows: auto;
  grid-template-columns: 2fr 1fr;
  grid-auto-columns: 1fr;
  align-items: stretch;
  margin-bottom: 1vh;
  display: grid;
}

.blog-item:first-child {
  margin-top: 30vh;
}

.blog-item:last-child {
  margin-bottom: 0;
}

.blog-item-image {
  background-image: var(--image-7b40fadb);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  justify-content: center;
  align-items: center;
  display: flex;
}

.blog-item-date {
  color: var(--dim-grey);
  display: none;
}

.services-counter {
  letter-spacing: -.05em;
  margin-left: -.3em;
  font-size: 2.8em;
  font-weight: 900;
  line-height: 100%;
}

.skills-heading {
  margin-bottom: 10vh;
  margin-left: 10vw;
}

.blog-item-meta {
  grid-column-gap: 20px;
  grid-row-gap: 0px;
  color: var(--dim-grey);
  letter-spacing: -.02em;
  grid-template-rows: auto;
  grid-template-columns: auto 1fr;
  grid-auto-columns: 1fr;
  padding-top: 2vh;
  line-height: 100%;
  display: none;
}

.blog-item-icon {
  width: 5vw;
  display: none;
}

.paragraph {
  letter-spacing: -.01em;
  width: 30vw;
  min-width: 400px;
  margin-top: 8px;
  font-size: 1.3em;
  line-height: 160%;
}

.container-motto {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 55vw 25vw;
  grid-auto-columns: 1fr;
  align-items: end;
  margin-left: 10vw;
  margin-right: 10vw;
  display: grid;
}

.dot-grey {
  color: var(--dim-grey);
}

.span-grey {
  color: var(--blue);
}

.container-working-with {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 20vw auto;
  grid-auto-columns: 1fr;
  align-items: center;
  width: 1000px;
  margin-bottom: 10vh;
  margin-left: 0%;
  margin-right: 5vw;
  display: grid;
  position: relative;
  left: 64px;
}

.tools-item-about {
  color: var(--dim-grey);
  margin-bottom: 0;
}

.tools-container {
  grid-column-gap: 1.5vw;
  grid-row-gap: 1.5vw;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-top: 61px;
  padding-left: 2vw;
  padding-right: 2vw;
  display: grid;
}

.tools-item {
  background-color: #fff;
  padding: 3vw 4vw;
  display: none;
}

.tools-item.small {
  grid-column-gap: 2vw;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 64px 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  padding-left: 2vw;
  padding-right: 2vw;
  display: none;
}

.tools-item.wide {
  grid-column-gap: 2vw;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 64px 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  padding-left: 3vw;
  display: none;
}

.tools-item.large {
  align-items: center;
  display: flex;
}

.tools-item.tall {
  grid-column-gap: 0px;
  grid-row-gap: 3vh;
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  align-content: start;
  align-items: start;
  padding-left: 3vw;
  padding-right: 3vw;
  display: grid;
}

.tools-image {
  max-width: 128px;
  margin-bottom: 2vh;
}

.tools-item-content {
  grid-column-gap: 0px;
  grid-row-gap: 1vh;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.tools-item-tall {
  grid-column-gap: 2vw;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 48px auto;
  grid-auto-columns: 1fr;
  align-items: center;
  display: grid;
}

.contact-heading {
  margin-left: 20%;
  font-size: 10vh;
  font-weight: 900;
  line-height: 70%;
}

.contact-form {
  margin-left: 20%;
  margin-right: 20%;
  display: none;
}

.text-field {
  border-top: 0 solid #000;
  border-bottom: 0 solid #0000;
  border-left: 2px solid #0000;
  border-right: 0 solid #000;
  height: 10vh;
  margin-bottom: 0;
  padding: 15px 20px;
  font-size: 3vh;
  transition: box-shadow .3s, border-color .3s;
}

.text-field:hover {
  border-left-color: #9c9ca1;
}

.text-field:focus {
  border-left-color: var(--text-black);
  box-shadow: 0 10px 20px -10px #0003;
}

.text-field.textarea {
  min-height: 20vh;
}

.form {
  grid-column-gap: 0px;
  grid-row-gap: 5vh;
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.submit-button {
  text-transform: lowercase;
  background-color: #222226;
  padding: 20px 35px;
  font-size: 1.4em;
  transition: background-color .3s;
}

.submit-button:hover {
  background-color: #474766;
}

.submit-button:active {
  background-color: var(--text-black);
}

.form-item {
  grid-column-gap: 2vw;
  grid-row-gap: 3vh;
  grid-template-rows: auto;
  grid-template-columns: 18vw 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  display: grid;
}

.follow-me-heading {
  margin-bottom: 10vh;
  margin-left: 20%;
}

.follow-me-item {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -webkit-text-fill-color: inherit;
  background-color: #fff;
  background-clip: border-box;
  grid-template-rows: auto;
  grid-template-columns: 1.5fr 1fr;
  grid-auto-columns: 1fr;
  place-items: center start;
  padding: 4% 5%;
  display: grid;
}

.follow-me-item.second {
  margin-left: 10vw;
}

.follow-me-item.third {
  margin-left: 5vw;
  margin-right: 5vw;
}

.follow-me-item.first {
  margin-right: 10vw;
}

.follow-link {
  color: var(--dim-grey);
  letter-spacing: -.02em;
  font-size: 1.8em;
  font-weight: 600;
  line-height: 100%;
  text-decoration: none;
  transition: color .2s;
}

.follow-link:hover {
  color: var(--blue);
}

.follow-counter {
  font-size: 1.5em;
  line-height: 100%;
}

.contact-link {
  color: var(--dim-grey);
  letter-spacing: -.02em;
  font-size: 1.5em;
  font-weight: 600;
  line-height: 100%;
  text-decoration: none;
  transition: color .2s;
  position: relative;
  left: -352px;
}

.contact-link:hover {
  color: var(--blue);
}

.follow-me-socials {
  grid-column-gap: 0px;
  grid-row-gap: 2vh;
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  margin-bottom: 10vh;
  margin-left: 30%;
  margin-right: 20%;
  display: grid;
}

.contact-container {
  grid-column-gap: 0px;
  grid-row-gap: 3vh;
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  margin-bottom: 20vh;
  margin-left: 60%;
  display: grid;
}

.contact-form-heading {
  letter-spacing: -.04em;
  margin-bottom: 3vh;
  margin-left: 40%;
  font-size: 2.8em;
  font-weight: 900;
  display: none;
}

.footer {
  grid-column-gap: 10vw;
  grid-row-gap: 16px;
  border-top: 1px dashed #f0dbd5;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: start;
  padding-top: 5vh;
  padding-bottom: 5vh;
  padding-left: 10vw;
  font-size: .9em;
  display: none;
}

.footer-links {
  margin-bottom: 1vh;
  display: flex;
}

.footer-link {
  color: #000;
  font-weight: 500;
}

.footer-link:hover {
  text-decoration: underline;
}

.footer-link.margin-right {
  margin-right: 20px;
}

.style-guide-section {
  padding: 10vh 7vw;
}

.spacer {
  height: 30px;
}

.rich-text-block {
  font-size: 1.1em;
}

.rich-text-block p {
  letter-spacing: -.01em;
  margin-bottom: 30px;
  font-size: 1.1em;
  line-height: 150%;
}

.rich-text-block h1 {
  margin-bottom: 15px;
  font-size: 3em;
}

.rich-text-block h2 {
  margin-bottom: 15px;
  font-size: 2.7em;
}

.rich-text-block h3 {
  margin-bottom: 15px;
  font-size: 2.3em;
}

.rich-text-block h4 {
  margin-bottom: 15px;
}

.rich-text-block h5, .rich-text-block h6 {
  margin-bottom: 10px;
}

.rich-text-block.in-blog-post {
  background-color: #ffffff61;
  margin-left: 10vw;
  margin-right: 10vw;
  padding: 10vh 10vw;
}

.rich-text-block.in-project-page {
  background-color: #fff;
  max-width: 640px;
  margin-bottom: 10vh;
  margin-left: 20vw;
  padding: 6vh 4vw 5vh;
}

.mosaic-item {
  filter: grayscale(65%);
  transition: filter .3s;
  position: relative;
  overflow: hidden;
}

.mosaic-item:hover {
  filter: grayscale(0%);
}

.style-guide-container {
  border-bottom: 2px solid #e2e2e2;
  padding-top: 50px;
  padding-bottom: 50px;
}

.tools-heading-copy {
  line-height: 90%;
}

.background-circle {
  background-color: #6db3ff12;
  border: 1px solid #bfbfbf;
  border-radius: 50%;
  width: 90vh;
  height: 90vh;
  position: absolute;
}

.success-message {
  text-align: left;
  letter-spacing: -.025em;
  background-color: #fff;
  padding-left: 10%;
  font-size: 1.5em;
  font-weight: 500;
  line-height: 140%;
}

.error-message {
  color: #ffe7e7;
  background-color: #ff3131;
  margin-left: 33.33%;
  padding: 15px 20px;
  font-size: 1.3em;
  line-height: 140%;
}

.blog-post-heading {
  background-color: var(--black);
  letter-spacing: -.05em;
  margin-bottom: 5vh;
  margin-left: -3vw;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 20px;
  font-size: 7vh;
  line-height: 110%;
  position: relative;
}

.header-logo {
  grid-column-gap: 2vw;
  grid-row-gap: 16px;
  color: var(--dim-grey);
  letter-spacing: -.04em;
  grid-template-rows: auto;
  grid-template-columns: 10vh 1fr;
  grid-auto-columns: 1fr;
  place-items: center start;
  margin-bottom: 10vh;
  font-size: 1.6em;
  font-weight: 500;
  line-height: 100%;
  display: grid;
}

.blog-category-link {
  color: #6b6b88;
  font-size: 1.25em;
  font-weight: 600;
}

.blog-post-container {
  grid-column-gap: 5vw;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 53vw 1fr;
  grid-auto-columns: 1fr;
  align-items: start;
  margin-bottom: 15vh;
  margin-left: 7vw;
  margin-right: 8vw;
  display: grid;
}

.blog-post-name-wrap {
  padding-top: 10vh;
}

.blog-post-meta {
  grid-column-gap: 20px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 48px 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  display: grid;
}

.category-page-title {
  grid-column-gap: 3vw;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 10vh 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  margin-bottom: 10vh;
  margin-left: 20vw;
  display: grid;
}

.collection-list {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  margin-left: 20vw;
  margin-right: 10vw;
  display: grid;
}

.blog-category-item {
  grid-column-gap: 0vw;
  grid-row-gap: 0vh;
  grid-template-rows: auto;
  grid-template-columns: 2fr 1fr;
  grid-auto-columns: 1fr;
  align-items: stretch;
  margin-bottom: 10vh;
  display: grid;
}

.blog-category-item:last-child {
  margin-bottom: 0;
}

.blog-category-item-content {
  grid-column-gap: 0px;
  grid-row-gap: 2vh;
  color: var(--text-black);
  -webkit-text-fill-color: inherit;
  background-color: #fff;
  background-clip: border-box;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  padding: 10%;
  transition: color .3s;
  display: grid;
}

.blog-category-item-content:hover {
  color: var(--blue);
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  width: 260px;
  display: flex;
}

.utility-page-form {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-direction: column;
  grid-template-rows: auto auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  align-items: stretch;
  display: grid;
}

.project-item-link {
  color: var(--text-black);
}

.project-page-heading {
  margin-bottom: 0;
  margin-left: 7vw;
  display: inline-block;
}

.project-page-description {
  letter-spacing: -.01em;
  max-width: 640px;
  margin-bottom: 0;
  margin-left: 7vw;
  font-size: 1.8em;
  font-weight: 500;
  line-height: 140%;
}

.project-content {
  min-height: 100vh;
  margin-bottom: 15vh;
  padding-top: 10vh;
  padding-right: 5vw;
}

.project-image-wrap {
  justify-content: flex-start;
  align-items: center;
  min-height: 100vh;
  display: flex;
}

.project-page-meta {
  grid-column-gap: 30px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: auto auto 1fr;
  grid-auto-columns: 1fr;
  place-items: center start;
  min-height: 10vh;
  margin-left: 7vw;
  font-size: .9em;
  display: grid;
}

.project-gallery {
  column-count: 2;
  column-rule-style: none;
  column-rule-width: 0px;
  column-gap: 0;
  margin-left: auto;
  margin-right: auto;
}

.blog-item-category {
  font-weight: 500;
  position: relative;
  left: -19px;
}

.project-page-logo {
  max-width: 10vw;
  margin-left: 7vw;
}

.header-logo-wrap {
  display: none;
}

.buy-link {
  color: #555;
  letter-spacing: -.03em;
  border-bottom: 1px solid #ffc2c2;
  font-size: .8em;
  font-style: italic;
  font-weight: 300;
  position: absolute;
  top: 5%;
  right: 5%;
}

.buy-link:hover {
  color: #2f00ff;
  border-bottom-color: #ffc2c200;
}

.buy-link.hide, .text-block {
  display: none;
}

.collection-list-wrapper {
  display: inline;
}

.section-2 {
  display: block;
}

.image {
  opacity: .61;
  max-width: 300%;
  position: relative;
  inset: 10px 0 0;
}

.text-block-2 {
  display: none;
  overflow: hidden;
}

.section-3 {
  margin-top: 24px;
  padding-top: 0;
}

.image-2 {
  padding-top: 20px;
  display: none;
}

.image-3 {
  aspect-ratio: auto;
  width: 200px;
  max-width: none;
  height: auto;
  max-height: none;
  margin-left: -344px;
  display: none;
  position: relative;
  top: 80px;
  bottom: 95px;
  left: 701px;
}

.heading {
  margin-top: -141px;
  font-size: 3em;
}

.text-span {
  font-size: 8vh;
  font-weight: 100;
  line-height: 60%;
}

.text-span-2 {
  white-space: pre;
  font-size: 4vw;
  font-weight: 100;
  line-height: 50%;
  position: sticky;
  top: 37px;
}

.heading-2 {
  text-shadow: 1px 0 1px #fff;
  width: 400px;
  font-size: 1.8em;
}

.bold-text-2, .bold-text-3, .bold-text-4, .bold-text-5 {
  font-size: 1.5em;
}

.collection-list-wrapper-2, .empty-state, .text-block-3, .empty-state-2 {
  display: none;
}

.container {
  max-width: 1200px;
  padding-bottom: 48px;
}

.collection-list-2 {
  margin-bottom: 0;
  margin-left: 0;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.lightbox-link {
  width: 800px;
  position: relative;
  top: -131px;
  left: 315px;
}

.collection-list-wrapper-3 {
  position: absolute;
  top: 216px;
  bottom: 670.021px;
  left: 837px;
}

.image-4 {
  position: relative;
  top: 10px;
  left: -73px;
}

.image-5 {
  max-width: 150%;
  position: relative;
  left: -11px;
}

.image-6 {
  max-width: 80%;
}

.image-7 {
  max-width: 120%;
  padding-left: 0;
  position: relative;
  left: -5px;
}

.text-block-4 {
  display: none;
}

.image-8 {
  max-width: 10%;
  padding-left: 0;
  position: fixed;
  left: 12px;
}

.image-9, .image-10 {
  display: none;
}

.text-block-5 {
  color: var(--blue);
  display: inline;
  position: relative;
  top: 7px;
}

.empty-state-3 {
  display: none;
}

.image-11 {
  max-width: 85%;
  margin-top: -49px;
  margin-left: 55px;
  padding-left: 30px;
}

.webembed {
  margin-bottom: 227px;
  padding-bottom: 0;
}

.bold-text-6 {
  color: #335fff;
  font-size: 1.6em;
}

.bold-text-7 {
  color: #335fff;
  font-size: 1.8em;
  font-weight: 900;
}

.bold-text-8 {
  text-shadow: 1px 0 1px #fff0;
  font-weight: 700;
}

.video-2 {
  top: -117px;
}

.heading-5 {
  font-weight: 900;
}

@media screen and (min-width: 1920px) {
  .hero-heading {
    color: var(--blue);
    -webkit-text-stroke-color: var(--blue);
  }

  .horizontal-line._10-percent {
    background-color: #6db3ff;
  }

  .horizontal-line._20-percent {
    background-color: #bfbfbf;
  }

  .horizontal-line._30-percent {
    background-color: #6db3ff;
  }

  .horizontal-line._40-percent {
    background-color: #bfbfbf;
  }

  .horizontal-line._50-percent, .horizontal-line._60-percent, .horizontal-line._80-percent, .horizontal-line._90-percent, .vertical-line._20-percent, .vertical-line._60-percent, .vertical-line._40-percent, .vertical-line._80-percent {
    background-color: #6db3ff;
  }

  .bio-history {
    -webkit-text-stroke-color: #b13c3c;
    background-color: #f0f6ff26;
  }

  .projects-heading {
    width: 1000px;
    margin-left: 56%;
  }

  .projects-list {
    margin-left: 23%;
  }

  .background-circle {
    background-color: #6db3ff08;
    border-color: #6db3ff;
  }

  .bold-text-6 {
    -webkit-text-stroke-color: #2929a9;
  }

  .text-span-3 {
    font-weight: 900;
  }

  .bold-text-7 {
    color: #335fff;
    -webkit-text-stroke-color: #9593e3;
    font-size: 1.6em;
    font-weight: 900;
  }

  .bold-text-8 {
    opacity: 1;
    text-shadow: 1px 0 1px #fff0;
    font-weight: 400;
  }

  .div-block {
    top: -1071px;
  }
}

@media screen and (max-width: 991px) {
  h3 {
    font-size: 2.3em;
  }

  h4 {
    font-size: 1.8em;
  }

  .section {
    position: relative;
    top: 226px;
  }

  .section.hero {
    top: 9px;
  }

  .section.skills {
    grid-column-gap: 5vw;
  }

  .section.contact {
    top: -292px;
  }

  .hero-heading {
    font-size: 8vh;
    line-height: 80%;
  }

  .hero-title {
    width: 55vw;
    font-size: 2vh;
    font-weight: 500;
    top: -61px;
    left: 2px;
  }

  .bio-history {
    width: 60vw;
    min-width: auto;
    font-size: 1em;
    top: 9.5vh;
  }

  .bio-image {
    width: 50vw;
    max-width: 150%;
    position: relative;
    top: -1324px;
    left: -346px;
  }

  .services-info {
    padding-top: 0;
    padding-left: 0;
    font-size: .75em;
    font-weight: 500;
    position: relative;
    top: -18px;
  }

  .skills-item {
    grid-column-gap: 0vw;
    grid-row-gap: 3vh;
    grid-template-rows: 54px auto;
  }

  .skills-item.fourth {
    grid-auto-flow: column;
    position: relative;
  }

  .container-bio {
    position: relative;
    top: 385px;
  }

  .projects-heading {
    width: 500px;
    margin-left: 21%;
    font-size: 7vh;
    position: relative;
    top: 557px;
    left: 157px;
  }

  .projects-list {
    grid-template-columns: 1fr 1fr;
    margin-left: 8%;
    position: relative;
    left: -80px;
  }

  .projects-item {
    width: 48vw;
    height: 500px;
    margin-top: 102px;
    margin-bottom: 4vh;
    position: relative;
    top: 153px;
    left: 21px;
  }

  .projects-item-summary {
    font-size: .8em;
  }

  .quote-paragraph {
    font-size: 1.5em;
  }

  .blog-post-link {
    font-size: 4vh;
  }

  .blog-item {
    grid-column-gap: 0vw;
    grid-row-gap: 0vh;
    grid-template-rows: auto;
    grid-template-columns: 2fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .blog-item-date {
    display: none;
  }

  .container-motto {
    position: relative;
    top: 869px;
  }

  .container-working-with {
    top: 88px;
    left: -183px;
  }

  .tools-container {
    position: relative;
    top: 180px;
  }

  .tools-item.large {
    padding-left: 1vw;
  }

  .contact-heading {
    font-size: 8vh;
    position: relative;
    left: -98px;
  }

  .contact-container {
    position: relative;
    top: 83px;
    left: -64px;
  }

  .contact-form-heading {
    font-size: 2.4em;
  }

  .rich-text-block.in-blog-post {
    padding: 10vh 5vw;
  }

  .rich-text-block.in-project-page {
    margin-left: 10vw;
    padding-right: 10vw;
  }

  .blog-post-heading {
    font-size: 2.5em;
  }

  .project-page-heading {
    font-size: 7vh;
  }

  .project-page-description {
    font-size: 1.5em;
  }

  .project-image {
    height: 40vh;
  }

  .project-content {
    margin-bottom: 10vh;
  }

  .project-gallery {
    column-count: 1;
  }

  .blog-item-category {
    position: relative;
    left: -20px;
  }

  .collection-list-wrapper {
    position: relative;
    top: 319px;
    left: 5px;
  }

  .section-2 {
    position: relative;
    top: -35px;
  }

  .image {
    opacity: .48;
    max-width: 300%;
    position: relative;
    top: 14px;
    left: -1px;
  }

  .image-3 {
    width: 150px;
    top: 81px;
    left: 458px;
  }

  .heading {
    font-size: 2em;
  }

  .text-span {
    font-size: 6vh;
    line-height: 40%;
  }

  .text-span-2 {
    font-size: 4.5vh;
    line-height: 40%;
  }

  .heading-2 {
    width: 450px;
    font-size: 1em;
    font-weight: 700;
    position: relative;
    top: -703px;
    left: -438px;
  }

  .heading-3 {
    font-size: 4vh;
  }

  .lightbox-link {
    width: 400px;
    top: -104px;
    left: -486px;
  }

  .image-4 {
    position: absolute;
  }

  .image-11 {
    margin-top: -101px;
    margin-left: 15px;
    padding-left: 0;
  }

  .bold-text-8 {
    color: #5a5a5a;
    -webkit-text-stroke-color: #6e6e6e;
    width: 300px;
    font-size: 2em;
    font-weight: 700;
    line-height: 125%;
    position: relative;
    top: 216px;
    left: 98px;
  }

  .div-block {
    position: relative;
    top: -438px;
    left: 78px;
  }

  .video {
    width: 640px;
    max-width: 1000px;
    height: 360px;
    position: relative;
    top: -657px;
    left: -8px;
  }

  .div-block-2 {
    position: relative;
    top: -214px;
  }
}

@media screen and (max-width: 767px) {
  h1 {
    text-shadow: none;
    font-size: 7vh;
  }

  .section {
    width: 500px;
    padding-top: 10vh;
    padding-bottom: 10vh;
    top: -370px;
  }

  .section.hero {
    top: 0;
  }

  .section.skills {
    grid-row-gap: 10vh;
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .section.blog {
    grid-template-columns: 1fr;
    padding-top: 10vh;
  }

  .section.contact {
    top: -1106px;
  }

  .section.blog-post-page {
    padding-top: 5vh;
  }

  .hero-heading {
    top: 5px;
    left: -2px;
  }

  .hero-title {
    font-size: 2vh;
    left: 0;
  }

  .bio-history {
    width: auto;
    margin-left: 10vw;
    margin-right: 10vw;
    font-size: 1.1em;
    position: relative;
    top: 32vh;
  }

  .bio-image {
    margin-top: -38vh;
    margin-left: 10vw;
    top: -656px;
    left: 88px;
  }

  .services-info {
    max-width: 400px;
  }

  .skills-item {
    grid-column-gap: 0vw;
    grid-template-rows: auto;
    grid-template-columns: 54px 1fr;
    grid-auto-flow: row;
  }

  .skills-item.fourth, .skills-item.first {
    margin-top: 0;
  }

  .skills-item.third {
    margin-top: 0;
    margin-left: 0;
  }

  .container-bio {
    grid-row-gap: 5vh;
    grid-template-columns: 1fr;
    margin-bottom: 5vh;
    top: 789px;
    left: -13px;
  }

  .projects-heading {
    font-size: 8vh;
    top: -220px;
    bottom: 289px;
    left: 81px;
  }

  .projects-list {
    grid-template-columns: 2.25fr;
    margin-top: 124px;
    margin-left: 50%;
    top: 0;
    left: -232px;
  }

  .projects-item {
    width: 80vw;
    height: 520px;
    margin-top: 39px;
    margin-bottom: -52vh;
    left: 0;
  }

  .motto-content {
    margin-left: 0;
  }

  .container-quote {
    margin-left: 10vw;
    margin-right: 10vw;
    padding-top: 10vh;
  }

  .quote-author {
    grid-template-columns: 15vw auto;
  }

  .quote-heading {
    margin-left: 10vw;
  }

  .blog-item-content {
    grid-row-gap: 5vh;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr;
    margin-bottom: 0;
    padding-left: 10vw;
    padding-right: 8vw;
  }

  .blog-post-link {
    font-size: 3vh;
  }

  .blog-heading {
    text-align: left;
    margin-left: 10vw;
    position: static;
  }

  .blog-item {
    margin-bottom: 5vh;
  }

  .blog-item:first-child {
    margin-top: 0;
  }

  .blog-item:last-child, .skills-heading {
    margin-bottom: 0;
  }

  .blog-item-icon {
    width: 10vw;
  }

  .paragraph {
    margin-bottom: 10vh;
    margin-left: 10vw;
  }

  .container-motto {
    grid-row-gap: 5vh;
    grid-template-columns: 1fr;
    top: -135px;
  }

  .container-working-with {
    margin-bottom: 3vh;
    top: 32px;
    left: -50px;
  }

  .tools-container {
    grid-template-rows: 1fr;
    grid-template-columns: 1fr;
    position: relative;
    top: -114px;
    left: 31px;
  }

  .tools-item {
    padding: 10%;
  }

  .tools-item.small {
    padding-left: 10%;
    padding-right: 10%;
  }

  .tools-item.wide {
    padding-left: 10%;
  }

  .tools-item.tall {
    padding-left: 10%;
    padding-right: 10%;
  }

  .contact-heading {
    margin-left: 10%;
    font-size: 5em;
    top: 516px;
    left: -8px;
  }

  .contact-form {
    margin-left: 10%;
    margin-right: 10%;
  }

  .text-field {
    height: 8vh;
  }

  .contact-link {
    left: 0;
  }

  .follow-me-socials {
    margin-left: 10%;
    margin-right: 10%;
  }

  .contact-container {
    margin-bottom: 10vh;
    margin-left: 50%;
    top: 564px;
    left: -65px;
  }

  .contact-form-heading {
    font-size: 2em;
  }

  .rich-text-block.in-blog-post {
    width: 500px;
    margin-left: 7vw;
    margin-right: 7vw;
    padding-left: 10vw;
    padding-right: 10vw;
    position: relative;
    left: -9px;
  }

  .rich-text-block.in-project-page {
    margin-left: 7vw;
  }

  .blog-post-heading {
    background-color: #0000;
    margin-left: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    font-size: 2em;
  }

  .header-logo {
    grid-template-columns: 8vw 1fr;
    margin-bottom: 5vh;
    margin-left: 7vw;
  }

  .blog-post-container {
    grid-row-gap: 5vh;
    grid-template-columns: 1fr;
    margin-bottom: 5vh;
  }

  .category-page-title, .collection-list {
    margin-left: 7vw;
  }

  .blog-category-item {
    margin-bottom: 5vh;
  }

  .blog-category-item:first-child {
    margin-top: 0;
  }

  .blog-category-item:last-child {
    margin-bottom: 0;
  }

  .project-item-link {
    position: relative;
  }

  .project-page-heading {
    margin-bottom: 4vh;
  }

  .project-page-description {
    font-size: 1.2em;
  }

  .project-page-meta {
    grid-template-rows: auto 1fr;
    grid-template-columns: auto auto;
  }

  .project-page-logo {
    max-width: 20vw;
  }

  .collection-list-wrapper {
    top: -489px;
  }

  .image {
    position: relative;
    top: -43px;
    left: 138px;
  }

  .image-3 {
    position: relative;
    top: 134px;
    bottom: 0;
    left: 457px;
  }

  .heading {
    font-size: 2em;
  }

  .text-span {
    font-size: 5vh;
  }

  .text-span-2 {
    letter-spacing: -.04em;
    font-size: 3vh;
  }

  .heading-2 {
    top: 250px;
    left: 0;
  }

  .heading-3 {
    font-size: 3.5vh;
  }

  .lightbox-link {
    width: 200px;
    left: -518px;
  }

  .image-8 {
    max-width: 40%;
    left: 8px;
  }

  .bold-text-8 {
    color: #202020;
    top: 45px;
    left: -11px;
  }

  .div-block {
    width: 600px;
    top: -961px;
    left: 1px;
  }

  .video {
    width: 500px;
    height: 290px;
    top: 158px;
    left: -18px;
  }

  .div-block-2 {
    width: 400px;
    top: 109px;
  }

  .video-3 {
    left: 28px;
  }
}

@media screen and (max-width: 479px) {
  h4 {
    font-size: 1.5em;
  }

  h5 {
    font-size: 1.1em;
    line-height: 110%;
  }

  h6 {
    font-size: .9em;
    line-height: 110%;
  }

  .section {
    width: 320px;
    margin-top: 0;
    padding-top: 0;
    top: 205px;
  }

  .section.hero {
    width: 320px;
    padding-top: 25vh;
  }

  .section.skills, .section.blog {
    grid-row-gap: 5vh;
  }

  .section.client-says {
    min-height: auto;
  }

  .section.project {
    grid-template-columns: 1fr;
  }

  .hero-heading {
    width: 80vw;
    margin-bottom: 5vh;
    margin-left: 10vw;
    font-size: 5vh;
    line-height: 80%;
    top: -146px;
    left: 0;
  }

  .hero-title {
    width: 75vw;
    font-size: 1.5vh;
    font-weight: 500;
    top: -162px;
    left: -27px;
  }

  .bio-history {
    width: 320px;
    margin-left: 15vw;
    margin-right: 15vw;
    padding-right: 30px;
    font-size: .7em;
    top: 14.7vh;
    left: -30px;
  }

  .bio-image {
    width: 60vw;
    margin-top: -28vh;
    top: -945px;
    left: 25px;
  }

  .services-info {
    font-size: .7em;
  }

  .container-bio {
    position: relative;
    top: 337px;
  }

  .projects-heading {
    width: 300px;
    margin-left: 10%;
    font-size: 3em;
    top: -98px;
    left: -22px;
  }

  .projects-list {
    grid-column-gap: 33px;
    grid-row-gap: 33px;
    grid-template-rows: minmax(auto, .25fr) auto;
    margin-top: 91px;
    top: 261px;
    left: 0;
  }

  .projects-item {
    width: 210%;
    height: 460px;
    margin-bottom: 5vh;
    top: -168px;
    left: -159px;
  }

  .clients-logos {
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
  }

  .container-quote {
    margin-left: 5vw;
    margin-right: 5vw;
    padding-top: 5vh;
  }

  .quote-paragraph {
    margin-bottom: 5vh;
    font-size: 1.2em;
  }

  .quote-heading {
    font-size: 3em;
  }

  .blog-item-content {
    padding-top: 5vh;
    padding-bottom: 5vh;
  }

  .blog-post-link {
    font-size: 4.5vh;
  }

  .blog-heading {
    font-size: 3em;
  }

  .blog-item {
    grid-template-columns: 1fr;
    margin-bottom: 3vh;
    margin-left: 5vw;
    margin-right: 5vw;
  }

  .blog-item:first-child {
    margin-top: 0;
  }

  .blog-item-image {
    height: 30vh;
    overflow: visible;
  }

  .blog-item-date {
    font-size: .5em;
  }

  .skills-heading {
    font-size: 3em;
  }

  .blog-item-icon {
    width: 15vw;
  }

  .paragraph {
    width: 80%;
    min-width: auto;
    font-size: 1em;
  }

  .container-motto {
    position: relative;
    top: -464px;
    left: -32px;
  }

  .container-working-with {
    width: 300px;
    margin-bottom: 5vh;
    margin-left: 10%;
    font-size: .9em;
    top: 140px;
    left: -6px;
  }

  .tools-container {
    top: -759px;
    left: 1px;
  }

  .tools-item.small, .tools-item.wide {
    grid-column-gap: 5vw;
  }

  .tools-item.large {
    background-color: #0000;
  }

  .contact-heading {
    margin-bottom: 6vh;
    margin-left: 10%;
    font-size: 3em;
    top: 588px;
  }

  .contact-form {
    margin-left: 10%;
    margin-right: 10%;
  }

  .text-field {
    font-size: 1em;
  }

  .form {
    grid-row-gap: 3vh;
  }

  .form-item {
    grid-row-gap: 1vh;
    grid-template-columns: 1fr;
  }

  .follow-me-heading {
    margin-bottom: 5vh;
    margin-left: 10%;
    font-size: 3em;
  }

  .follow-me-item.second {
    margin-left: 0;
  }

  .follow-me-item.third {
    margin-left: 0;
    margin-right: 0;
  }

  .follow-me-item.first {
    margin-right: 0;
  }

  .follow-link, .follow-counter {
    font-size: 1.2em;
  }

  .contact-link {
    width: 300px;
    margin-left: 0;
    font-size: 1.3em;
    left: 0;
  }

  .follow-me-socials {
    margin-left: 10%;
  }

  .contact-container {
    grid-row-gap: 2vh;
    width: 300px;
    margin-left: 22%;
    top: 582px;
    left: -49px;
  }

  .contact-form-heading {
    margin-left: 10%;
  }

  .style-guide-section {
    padding-left: 10vw;
    padding-right: 10vw;
  }

  .rich-text-block.in-blog-post {
    width: 320px;
    margin-left: 0;
    margin-right: 0;
    padding-top: 5vh;
    padding-bottom: 5vh;
    padding-left: 7vw;
    font-size: .9em;
    left: 0;
  }

  .rich-text-block.in-project-page {
    margin-left: 0;
    padding-left: 7vw;
  }

  .style-guide-container {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .tools-heading-copy {
    font-size: 3em;
  }

  .background-circle {
    width: 90vw;
    height: 90vw;
  }

  .blog-post-heading {
    margin-bottom: 3vh;
  }

  .header-logo {
    grid-column-gap: 4vw;
    grid-template-columns: 10vw 1fr;
  }

  .blog-post-container {
    min-height: 20vh;
  }

  .blog-post-name-wrap {
    padding-top: 0;
  }

  .blog-category-item {
    grid-template-columns: 1fr;
  }

  .blog-category-item:first-child {
    margin-top: 0;
  }

  .project-page-heading {
    font-size: 2.5em;
  }

  .project-image {
    height: 20vh;
  }

  .project-content {
    min-height: auto;
    padding-right: 7vw;
  }

  .project-image-wrap {
    min-height: auto;
    padding-left: 20vw;
  }

  .project-page-meta {
    margin-bottom: 2vh;
    margin-left: 20vw;
    font-size: 1em;
  }

  .project-gallery {
    column-count: 2;
  }

  .project-page-logo {
    max-width: 33vw;
  }

  .header-logo-wrap {
    grid-template-columns: 13vw 1fr;
  }

  .buy-link {
    position: absolute;
    top: 4%;
    right: 8%;
  }

  .buy-link.hide {
    display: none;
  }

  .collection-list-wrapper {
    top: -183px;
    left: 6px;
  }

  .section-2 {
    position: relative;
    top: -492px;
  }

  .image {
    position: relative;
    top: -473px;
    left: 0;
  }

  .image-3 {
    z-index: 10;
    width: 200px;
    position: relative;
    top: 118px;
    left: 389px;
  }

  .heading {
    font-size: 1em;
  }

  .text-span {
    letter-spacing: -.06em;
    font-size: 3vh;
    line-height: 0;
  }

  .text-span-2 {
    text-align: left;
    white-space: nowrap;
    font-size: 2vh;
    line-height: 2vw;
    position: relative;
    top: -8px;
  }

  .heading-2 {
    column-count: 0;
    width: 300px;
    font-size: .9em;
    line-height: 120%;
    top: -462px;
    left: 0;
  }

  .container {
    padding-bottom: 57px;
  }

  .heading-3 {
    font-size: 2vh;
    position: relative;
    top: 85px;
  }

  .lightbox-link {
    width: 100px;
    top: -192px;
    left: -720px;
  }

  .image-4 {
    max-width: 400%;
    position: relative;
    top: -35px;
    left: -133px;
  }

  .image-8 {
    left: 11px;
  }

  .heading-4 {
    font-size: .8em;
  }

  .bold-text-8 {
    color: #202020;
    width: 200px;
    font-size: 1.2em;
    font-weight: 700;
    top: 291px;
    left: 23px;
  }

  .div-block {
    width: 300px;
    top: -1083px;
  }

  .video {
    box-sizing: border-box;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    width: 320px;
    max-width: 400em;
    height: 110px;
    max-height: 100px;
    top: -288px;
    left: 0;
  }

  .video-2 {
    padding-bottom: 35px;
    top: 62px;
  }

  .div-block-2 {
    width: 320px;
    left: 0;
  }

  .video-3 {
    left: 0;
  }
}

#w-node-cae63d4f-9c78-f1f2-cc72-66e198d82474-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_70190d14-5087-73ad-acbe-e7b3216a9656-7e1d543e {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-_3c69a676-19ca-49cd-44df-9ea217a0bb5f-7e1d543e {
  grid-area: span 1 / span 2 / span 1 / span 2;
  justify-self: end;
}

#w-node-_21cc287e-fb45-2fa6-c0fa-2230060faac9-7e1d543e {
  justify-self: center;
}

#w-node-f443de79-d478-3ea3-72e3-1af43dce74b6-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_9efcb7b9-dbba-8913-ec1c-9e3ffe856256-7e1d543e {
  justify-self: center;
}

#w-node-_9efcb7b9-dbba-8913-ec1c-9e3ffe856258-7e1d543e, #w-node-fe4b085c-2176-008c-26e4-98b8e350785d-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_6eb8abcf-6b34-0b1f-3cf1-d343f0fb1cf6-7e1d543e {
  align-self: start;
}

#w-node-_1cfa2c84-795d-9f49-5a09-74c1dba00100-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-c0a3b8e3-d58b-0272-dd10-b15cb41efd22-7e1d543e {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-_3fd12fe0-4f47-0033-b6d0-76d015e2607e-7e1d543e {
  grid-area: span 2 / span 2 / span 2 / span 2;
}

#w-node-_5f3da791-adeb-c853-0a92-fd1172e11162-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-e8938d13-b15e-e426-a9bd-a39c2ae4e4ae-7e1d543e {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-_6a6a9f1c-8c3a-4ac2-75da-8f390ab86ab9-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_3a0f6452-e413-cc63-e5d8-73c07f73fa92-7e1d543e {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-ec458cfb-2bee-6369-6ea4-1af33e61f132-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-d2956638-80d4-6f6f-4c59-85e9db36985c-7e1d543e, #w-node-_5ca94176-33ca-6159-b67d-77d6687275f4-7e1d543e {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-_8a0dccb9-c4bb-97e6-5cad-535ff545f259-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-b081b6f8-f766-c907-e918-ea503c7f2559-7e1d543e {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-_2f4a0f49-5a97-9656-fa88-9312acdf3a18-7e1d543e {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_1fd18bf3-03ea-775f-4008-2701158734a5-7e1d543e {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d817-7e1d543e, #w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d81a-7e1d543e {
  justify-self: end;
}

#w-node-_677b1bdf-77a8-4610-0438-849123e2dda4-7e1d543e {
  align-self: center;
}

#w-node-ee6e9bac-ba6e-1906-038a-2012b7cd67aa-7e1d543e {
  justify-self: end;
}

#w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d81d-7e1d543e {
  grid-area: 1 / 2 / 2 / 3;
}

#w-node-_4f2ca151-6e8a-a976-915f-58eeaf9cead8-7e1d5442 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-c717bde6-285a-b989-2e83-b1fa0dcfebd8-0dcfebd7 {
  justify-self: end;
}

#w-node-_70190d14-5087-73ad-acbe-e7b3216a9656-7e1d5448 {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-_3c69a676-19ca-49cd-44df-9ea217a0bb5f-7e1d5448 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  justify-self: end;
}

#w-node-_21cc287e-fb45-2fa6-c0fa-2230060faac9-7e1d5448 {
  justify-self: center;
}

#w-node-f443de79-d478-3ea3-72e3-1af43dce74b6-7e1d5448 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_9efcb7b9-dbba-8913-ec1c-9e3ffe856256-7e1d5448 {
  justify-self: center;
}

#w-node-_9efcb7b9-dbba-8913-ec1c-9e3ffe856258-7e1d5448, #w-node-fe4b085c-2176-008c-26e4-98b8e350785d-7e1d5448 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_6eb8abcf-6b34-0b1f-3cf1-d343f0fb1cf6-7e1d5448 {
  align-self: start;
}

#w-node-_1cfa2c84-795d-9f49-5a09-74c1dba00100-7e1d5448 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-c0a3b8e3-d58b-0272-dd10-b15cb41efd22-7e1d5448 {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-_3fd12fe0-4f47-0033-b6d0-76d015e2607e-7e1d5448 {
  grid-area: span 2 / span 2 / span 2 / span 2;
}

#w-node-_5f3da791-adeb-c853-0a92-fd1172e11162-7e1d5448 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-e8938d13-b15e-e426-a9bd-a39c2ae4e4ae-7e1d5448 {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-_6a6a9f1c-8c3a-4ac2-75da-8f390ab86ab9-7e1d5448 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_3a0f6452-e413-cc63-e5d8-73c07f73fa92-7e1d5448 {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-ec458cfb-2bee-6369-6ea4-1af33e61f132-7e1d5448 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-d2956638-80d4-6f6f-4c59-85e9db36985c-7e1d5448, #w-node-_5ca94176-33ca-6159-b67d-77d6687275f4-7e1d5448 {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-_8a0dccb9-c4bb-97e6-5cad-535ff545f259-7e1d5448 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-b081b6f8-f766-c907-e918-ea503c7f2559-7e1d5448 {
  grid-area: span 2 / span 1 / span 2 / span 1;
}

#w-node-_2f4a0f49-5a97-9656-fa88-9312acdf3a18-7e1d5448 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_1fd18bf3-03ea-775f-4008-2701158734a5-7e1d5448 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d817-7e1d5448, #w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d81a-7e1d5448 {
  justify-self: end;
}

#w-node-_677b1bdf-77a8-4610-0438-849123e2dda4-7e1d5448 {
  align-self: center;
}

#w-node-ee6e9bac-ba6e-1906-038a-2012b7cd67aa-7e1d5448 {
  justify-self: end;
}

#w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d81d-7e1d5448 {
  grid-area: 1 / 2 / 2 / 3;
}

@media screen and (max-width: 991px) {
  #w-node-_2805bb90-1308-2068-7874-8f22b734aa14-7e1d543e, #w-node-_3c69a676-19ca-49cd-44df-9ea217a0bb61-7e1d543e, #w-node-_75be80ef-a570-8da4-4de6-e35c00b3da3e-7e1d543e, #w-node-_2805bb90-1308-2068-7874-8f22b734aa14-7e1d5448, #w-node-_3c69a676-19ca-49cd-44df-9ea217a0bb61-7e1d5448, #w-node-_75be80ef-a570-8da4-4de6-e35c00b3da3e-7e1d5448 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }
}

@media screen and (max-width: 767px) {
  #w-node-_106eea5c-4678-f3f0-4fe4-d1ad1d9849cf-7e1d543e {
    grid-column: span 1 / span 1;
  }

  #w-node-_5c16e1d0-dfd5-1a04-6fea-8cc45e50567f-7e1d543e {
    order: -9999;
    grid-column: span 1 / span 1;
  }

  #w-node-_198a69f8-af77-4931-1fd3-7c93ea8520c7-7e1d543e {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_70190d14-5087-73ad-acbe-e7b3216a9656-7e1d543e {
    grid-column: span 1 / span 1;
    justify-self: start;
  }

  #w-node-_3c69a676-19ca-49cd-44df-9ea217a0bb5f-7e1d543e {
    grid-column: span 1 / span 1;
    justify-self: center;
  }

  #w-node-c0a3b8e3-d58b-0272-dd10-b15cb41efd22-7e1d543e {
    grid-row: span 1 / span 1;
  }

  #w-node-_3fd12fe0-4f47-0033-b6d0-76d015e2607e-7e1d543e {
    order: -9999;
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-e8938d13-b15e-e426-a9bd-a39c2ae4e4ae-7e1d543e, #w-node-_3a0f6452-e413-cc63-e5d8-73c07f73fa92-7e1d543e, #w-node-d2956638-80d4-6f6f-4c59-85e9db36985c-7e1d543e, #w-node-_5ca94176-33ca-6159-b67d-77d6687275f4-7e1d543e, #w-node-_8a0dccb9-c4bb-97e6-5cad-535ff545f259-7e1d543e, #w-node-b081b6f8-f766-c907-e918-ea503c7f2559-7e1d543e {
    grid-row: span 1 / span 1;
  }

  #w-node-_1fd18bf3-03ea-775f-4008-2701158734a5-7e1d543e {
    grid-column: span 1 / span 1;
  }

  #w-node-_3d450ec3-3b42-7530-90a2-4752c5551e2d-7e1d5444 {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }

  #w-node-_106eea5c-4678-f3f0-4fe4-d1ad1d9849cf-7e1d5448 {
    grid-column: span 1 / span 1;
  }

  #w-node-_5c16e1d0-dfd5-1a04-6fea-8cc45e50567f-7e1d5448 {
    order: -9999;
    grid-column: span 1 / span 1;
  }

  #w-node-_70190d14-5087-73ad-acbe-e7b3216a9656-7e1d5448 {
    grid-column: span 1 / span 1;
    justify-self: start;
  }

  #w-node-_3c69a676-19ca-49cd-44df-9ea217a0bb5f-7e1d5448 {
    grid-column: span 1 / span 1;
    justify-self: center;
  }

  #w-node-c0a3b8e3-d58b-0272-dd10-b15cb41efd22-7e1d5448 {
    grid-row: span 1 / span 1;
  }

  #w-node-_3fd12fe0-4f47-0033-b6d0-76d015e2607e-7e1d5448 {
    order: -9999;
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-e8938d13-b15e-e426-a9bd-a39c2ae4e4ae-7e1d5448, #w-node-_3a0f6452-e413-cc63-e5d8-73c07f73fa92-7e1d5448, #w-node-d2956638-80d4-6f6f-4c59-85e9db36985c-7e1d5448, #w-node-_5ca94176-33ca-6159-b67d-77d6687275f4-7e1d5448, #w-node-_8a0dccb9-c4bb-97e6-5cad-535ff545f259-7e1d5448, #w-node-b081b6f8-f766-c907-e918-ea503c7f2559-7e1d5448 {
    grid-row: span 1 / span 1;
  }

  #w-node-_1fd18bf3-03ea-775f-4008-2701158734a5-7e1d5448 {
    grid-column: span 1 / span 1;
  }
}

@media screen and (max-width: 479px) {
  #w-node-fe4b085c-2176-008c-26e4-98b8e350785d-7e1d543e, #w-node-_1cfa2c84-795d-9f49-5a09-74c1dba00100-7e1d543e {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-cfb3e5dc-5c64-5b40-d4a1-307d11c10508-7e1d543e, #w-node-_3fd12fe0-4f47-0033-b6d0-76d015e2607e-7e1d543e {
    order: -9999;
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d817-7e1d543e, #w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d81a-7e1d543e, #w-node-ee6e9bac-ba6e-1906-038a-2012b7cd67aa-7e1d543e {
    justify-self: start;
  }

  #w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d81d-7e1d543e {
    grid-area: 1 / 1 / 2 / 3;
  }

  #w-node-dc6017e6-8a1a-18ff-f15b-4260b9a22ab4-7e1d5442 {
    order: -9999;
  }

  #w-node-_3d450ec3-3b42-7530-90a2-4752c5551e2d-7e1d5444 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_41687c49-5390-44ea-49b1-7fc45fb6b254-7e1d5444 {
    order: -9999;
  }

  #w-node-fe4b085c-2176-008c-26e4-98b8e350785d-7e1d5448, #w-node-_1cfa2c84-795d-9f49-5a09-74c1dba00100-7e1d5448 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-cfb3e5dc-5c64-5b40-d4a1-307d11c10508-7e1d5448 {
    order: -9999;
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d817-7e1d5448, #w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d81a-7e1d5448, #w-node-ee6e9bac-ba6e-1906-038a-2012b7cd67aa-7e1d5448 {
    justify-self: start;
  }

  #w-node-_8ed8a75f-1a89-d63d-60b8-a9954f38d81d-7e1d5448 {
    grid-area: 1 / 1 / 2 / 3;
  }
}