@font-face {
  font-family: "Font awesome 5 brands 400";
  src: url('../fonts/Font-Awesome-5-Brands-Regular-400.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Font awesome 5 pro solid 900";
  src: url('../fonts/Font-Awesome-5-Pro-Solid-900.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Font awesome 5 pro 400";
  src: url('../fonts/Font-Awesome-5-Pro-Regular-400.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Font awesome 5 pro 300";
  src: url('../fonts/Font-Awesome-5-Pro-Light-300.otf') format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Font awesome 5 duotone solid 900";
  src: url('../fonts/Font-Awesome-5-Duotone-Solid-900.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --jet: #222;
  --dark-grey: #828282;
  --white: white;
  --medium-grey: #acacac;
  --light-grey: #d5d5d5;
  --secondary: #ffc431;
  --tertiary: #ff64a5;
  --accent: #fee20d;
  --lightprimary: #dbfff7;
  --lightsecondary: #ffe3cc;
  --lightsecondary-2: #fce2e6;
  --g-pink-top: #ff80f2;
  --primary-blue: #1db3f7;
  --g-blue-top: #3efcc6;
  --error-red: #f71d21;
  --light-error-red: #ffcccd;
  --newprimary: #f59222;
  --super-callout: #ff009b1a;
  --transparent: var(--newprimary);
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.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 {
  color: #333;
  max-width: 100vw;
  font-family: Open Sans, sans-serif;
  font-size: 1rem;
  line-height: 1.5rem;
  overflow: visible;
}

h1 {
  color: var(--jet);
  letter-spacing: .15rem;
  max-width: 800px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
  font-size: 5rem;
  font-style: italic;
  font-weight: 900;
  line-height: 6.5rem;
}

h2 {
  color: var(--jet);
  letter-spacing: .05rem;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Prompt, sans-serif;
  font-size: 2.5rem;
  font-weight: 200;
  line-height: 4rem;
}

h3 {
  color: var(--jet);
  margin-top: 24px;
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
  font-size: 3.5rem;
  font-style: italic;
  font-weight: 700;
  line-height: 5rem;
}

h4 {
  color: var(--dark-grey);
  letter-spacing: .02rem;
  margin-top: 0;
  margin-bottom: 24px;
  font-family: Prompt, sans-serif;
  font-size: 2rem;
  font-weight: 300;
  line-height: 3rem;
}

h5 {
  color: var(--jet);
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
  font-size: 3rem;
  font-weight: 600;
  line-height: 4.5rem;
}

h6 {
  color: var(--jet);
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Prompt, sans-serif;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 2rem;
}

p {
  color: var(--jet);
  max-width: 600px;
  margin-bottom: 24px;
  font-family: Lora, sans-serif;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.75rem;
}

a {
  color: #2f2f2f;
  min-width: 20rem;
  max-width: 600px;
  min-height: 44px;
  padding: 8px 0;
  font-family: Lora, sans-serif;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5rem;
  text-decoration: underline;
  transition: all .2s cubic-bezier(.175, .885, .32, 1.275);
}

ul {
  margin-top: 0;
  margin-bottom: 24px;
  padding-left: 64px;
  font-family: Open Sans, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5rem;
  list-style-type: square;
}

li {
  color: var(--jet);
  max-width: 600px;
  font-family: Lora, sans-serif;
  font-size: 1.25rem;
  line-height: 2.5rem;
}

blockquote {
  border-left: 5px solid #e2e2e2;
  max-width: 600px;
  margin-bottom: 0;
  padding: 0;
  font-size: 3rem;
  line-height: 4rem;
}

.body-small {
  font-size: 1rem;
  line-height: 1.5rem;
}

.body-micro {
  font-size: .9rem;
  line-height: 1.4rem;
}

.colorgrid {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  margin-left: 64px;
  margin-right: 64px;
}

.colorblock.black {
  background-color: var(--jet);
  color: #fff;
}

.colorblock.darkgrey {
  background-color: var(--dark-grey);
  color: var(--white);
}

.colorblock.mediumgrey {
  background-color: var(--medium-grey);
  color: #2f2f2f;
}

.colorblock.lightgrey {
  background-color: var(--light-grey);
  color: #2f2f2f;
}

.colorblock.snow {
  color: #2f2f2f;
  background-color: #fcf7f3;
}

.colorblock.primary {
  color: #2f2f2f;
  background-color: #1db3f7;
}

.colorblock.primary.light {
  color: #2f2f2f;
}

.colorblock.secondary {
  background-color: var(--secondary);
  color: #2f2f2f;
}

.colorblock.secondary.light {
  color: #2f2f2f;
}

.colorblock.tertiary {
  background-color: var(--tertiary);
  color: #2f2f2f;
}

.colorblock.tertiary.light {
  color: #2f2f2f;
}

.colorblock.accent {
  background-color: var(--accent);
  color: #2f2f2f;
}

.colorblock.accent.light {
  color: #2f2f2f;
}

.colorblock.white {
  background-color: var(--white);
  color: #2f2f2f;
}

.colorblock.lightprimary {
  background-color: var(--lightprimary);
}

.colorblock.lightsecondary {
  background-color: var(--lightsecondary);
}

.colorblock.lighttertiary {
  background-color: var(--lightsecondary-2);
}

.light {
  opacity: .15;
}

.button {
  border: 2px solid var(--jet);
  background-color: var(--light-grey);
  box-shadow: 11px 11px 0 0 var(--jet);
  color: var(--jet);
  text-align: center;
  letter-spacing: .1rem;
  text-transform: none;
  border-radius: 4px;
  margin: 0 12px 12px 0;
  padding: 16px 24px;
  font-family: Prompt, sans-serif;
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 2rem;
}

.button.primary {
  background-color: var(--accent);
  color: var(--jet);
  border-width: 2px;
  margin-right: 12px;
}

.button.primary.alternate {
  background-color: var(--lightprimary);
}

.button.primary.alternate.contactbutton.reversed.yellow {
  background-color: var(--accent);
}

.button.primary.contactbutton.reversed {
  border-color: var(--jet);
  box-shadow: 11px 11px #f5eeb8;
}

.button.primary.doubleleft {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  min-width: 10rem;
  margin-right: 0;
}

.button.primary.doubleright {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  min-width: 10rem;
}

.button.primary.doubleright.inactive {
  background-color: var(--white);
  color: var(--jet);
}

.button.primary.possible {
  background-image: linear-gradient(135deg, var(--accent) 35%, var(--g-pink-top));
}

.button.primary.shrink {
  min-width: 10rem;
}

.button.primary.gradient {
  background-image: linear-gradient(135deg, var(--accent), var(--g-pink-top));
}

.button.secondary {
  border-width: 2px;
  border-color: var(--jet);
  background-color: var(--secondary);
  color: var(--jet);
  font-size: 1.2rem;
  line-height: 2rem;
}

.button.secondary.linkedinbutton {
  margin-right: 12px;
}

.button.secondary.linkedinbutton.reversed {
  border-color: var(--jet);
  box-shadow: 11px 11px 0 0 var(--lightsecondary);
}

.button.secondary.gradient {
  background-image: linear-gradient(135deg, var(--secondary), var(--white));
}

.button.tertiary {
  background-color: var(--tertiary);
  background-image: linear-gradient(135deg, var(--g-pink-top), var(--secondary));
  color: var(--jet);
  border-width: 2px;
  margin-right: 12px;
}

.button.tertiary.cnc {
  background-image: linear-gradient(135deg, var(--secondary), white);
}

.button.accent {
  background-color: #1db3f7;
  border-width: 2px;
  margin-right: 12px;
}

.button.accent.nationwide, .button.accent.gradient {
  background-image: linear-gradient(135deg, var(--primary-blue), var(--g-blue-top));
}

.button.reset {
  box-shadow: none;
  border-style: none;
  min-width: 10rem;
}

.button.linkedin {
  background-color: var(--secondary);
  box-shadow: 11px 11px 0 0 var(--jet);
}

.button.linkedin.reversed {
  box-shadow: 11px 11px 0 0 var(--lightsecondary);
}

.button.linkedin.gradient {
  background-image: linear-gradient(135deg, var(--tertiary), var(--g-pink-top));
}

.button.email {
  background-color: var(--accent);
}

.button.email.reversed {
  box-shadow: 11px 11px #f5eeb8;
}

.button.email.gradient {
  background-image: linear-gradient(135deg, var(--secondary), var(--accent));
}

.button.email.gradient.alternate {
  background-image: linear-gradient(135deg, var(--primary-blue), var(--g-blue-top));
}

.button.email.gradient.dark {
  color: var(--jet);
}

.button.newgradient {
  background-color: var(--g-blue-top);
  background-image: linear-gradient(135deg, var(--primary-blue), var(--g-blue-top));
}

.button.newgradient.dark {
  border-color: var(--jet);
  background-image: linear-gradient(135deg, var(--primary-blue), var(--g-blue-top));
}

.button.newoutline {
  background-color: var(--g-blue-top);
  background-image: linear-gradient(135deg, var(--g-blue-top), var(--lightprimary));
  color: var(--white);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}

.button.inline {
  box-shadow: none;
  background-color: #0000;
  border-width: 0;
}

.button.inline.hidden {
  display: none;
}

.blockgrid {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: 20vw 20vw 20vw 20vw;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

.space {
  opacity: 0;
}

.space.small {
  width: 2rem;
  height: 2rem;
}

.space.medium {
  width: 4rem;
  height: 4rem;
}

.space.large {
  width: 8rem;
  height: 8rem;
}

.space.xlarge {
  width: 16rem;
  height: 16rem;
}

.space.xlarge.fullwidth {
  width: 100%;
}

.space.xlarge.fullwidth.gradientblack {
  background-color: var(--jet);
  background-image: linear-gradient(to bottom, var(--jet), white);
  opacity: 1;
}

.space.xsmall {
  width: 1rem;
  height: 1rem;
}

.space.break {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  opacity: 1;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-around;
  align-items: center;
  width: 100vw;
  height: 40vh;
  padding: 32px;
  display: grid;
}

.space.break.career {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: var(--jet);
  grid-template-rows: 1.5fr 1fr .5fr;
  grid-template-columns: 2.5fr 1fr;
  height: auto;
  padding: 2rem;
}

.space.break.career.alternate {
  background-color: var(--secondary);
  background-image: linear-gradient(135deg, var(--accent), var(--secondary));
}

.space.fullwidth.black {
  background-color: var(--jet);
  opacity: 1;
  border-radius: 0;
}

.space.fullwidth.black.extraspacebelow {
  padding-bottom: 8rem;
}

.space.fullwidth.black.nospacebelow {
  background-color: var(--white);
}

.space.fullwidth.black.nospacebelow.centerpage {
  margin-left: auto;
  margin-right: auto;
}

.space.huge {
  width: 100%;
  height: 24rem;
}

.space.huge.gradient {
  background-color: var(--jet);
  background-image: linear-gradient(to bottom, var(--jet), var(--white));
  opacity: 1;
  height: 32rem;
}

.body {
  color: #2f2f2f;
  letter-spacing: .01rem;
  font-family: Lora, sans-serif;
  font-weight: 500;
}

.block-quote {
  color: var(--jet);
  font-weight: 400;
}

.atomhero {
  justify-content: center;
  align-items: center;
  max-width: 100vw;
  min-height: 50vw;
  max-height: 50vw;
  margin-top: 0;
  display: flex;
  position: relative;
  top: 0;
  overflow: hidden;
}

.circle {
  background-color: #0000;
  border: .25vw solid #1db3f7;
  border-radius: 999vw;
  flex: 0 auto;
  align-self: auto;
  width: 80vw;
  height: 80vw;
  position: absolute;
  inset: auto;
}

.circle.small {
  z-index: 99;
  border-color: var(--jet);
  background-color: var(--white);
  width: 15vw;
  height: 15vw;
  inset: 5vw auto auto 5vw;
}

.circle.small.right {
  border-color: var(--jet);
  inset: auto 5vw 5vw auto;
}

.circle.small.center {
  border-color: var(--jet);
  background-image: url('../images/Joel-Wisneski-ProfilePic.JPG');
  background-position: 0 0;
  background-size: cover;
  width: 35vw;
  height: 35vw;
  top: auto;
  bottom: auto;
  left: auto;
}

.circle.large2 {
  z-index: 1;
  border-color: var(--accent);
  inset: auto -30vw -66vw auto;
}

.circle.large3 {
  border-color: var(--tertiary);
  top: -20vw;
  left: -66vw;
}

.circle.large4 {
  border-color: var(--secondary);
  top: -39vw;
  right: -15vw;
}

.compnayhero {
  justify-content: space-around;
  align-items: center;
  max-width: 100vw;
  min-height: 50vw;
  max-height: 50vw;
  display: flex;
  position: relative;
  overflow: hidden;
}

.companycircle {
  z-index: 99;
  background-color: var(--white);
  border: .25vw solid #000;
  border-radius: 999px;
  width: 15vw;
  height: 15vw;
  position: relative;
}

.companycircle.large {
  z-index: 1;
  background-color: #0000;
  border-color: #1db3f7;
  width: 50vw;
  height: 50vw;
  position: absolute;
  inset: -20vw auto auto -25vw;
}

.companycircle.large.circle2 {
  border-color: var(--lightsecondary-2);
  width: 75vw;
  height: 75vw;
  top: -25vw;
  left: -40vw;
}

.companycircle.large.circle3 {
  border-color: var(--jet);
  width: 75vw;
  height: 75vw;
  top: 24vw;
  left: auto;
  right: -4vw;
}

.companycircle.large.circle4 {
  border-color: #f9217c;
  width: 40vw;
  height: 40vw;
  top: 23vw;
  left: 11vw;
}

.companycircle.large.circle5 {
  border-color: var(--accent);
  width: 80vw;
  height: 80vw;
  top: -40vw;
  left: auto;
  right: -20vw;
}

.companycircle.large.circle6 {
  border-color: var(--secondary);
  width: 50vw;
  height: 50vw;
  top: auto;
  left: auto;
  right: -36vw;
}

.processgrid {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  background-color: var(--accent);
  background-image: url('../images/northStarWithText.svg'), linear-gradient(to bottom, var(--white), var(--accent));
  background-position: 50%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: 90% 90%, auto;
  grid-template-rows: 10vw 10vw 10vw 10vw 10vw 10vw 10vw;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  margin-top: 0;
  padding: 0 1rem 4rem;
}

.processgrid.old {
  display: none;
}

.siteheader {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: var(--white);
  grid-template-rows: 1.5fr 1fr 1fr;
  grid-template-columns: 2.5fr 1fr;
  grid-auto-columns: 1fr;
  place-items: end start;
  max-width: 100vw;
  padding: 2rem;
  display: grid;
}

.siteheader.accent {
  background-color: var(--white);
}

.siteheader.transparent {
  background-color: var(--jet);
  padding-bottom: 0;
}

.siteheader.transparent.accent {
  background-color: var(--jet);
}

.siteheader.small {
  grid-template-rows: 1.5fr 1fr;
}

.portfoliogrid {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  flex-direction: column;
  grid-template: "possible possible"
                 "kohlsCheckout kohlsCheckout"
                 "nationwideApp nationwideApp"
                 "kohlsSaveForLater nationwideSystem"
                 / 1fr 1fr;
  grid-auto-columns: 1fr;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding-right: .5rem;
  display: flex;
}

.portfolioblock {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: 2px solid #2f2f2f;
  border-radius: 4px;
  grid-template-rows: auto auto auto auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  padding-left: 32px;
  padding-right: 32px;
  display: grid;
  box-shadow: 11px 11px #2f2f2f;
}

.portfolioblock.flexblock {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  background-color: var(--white);
  flex-direction: column;
  min-width: auto;
  max-width: none;
  margin-left: 2rem;
  margin-right: 2rem;
  display: flex;
  position: static;
}

.portfolioblock.flexblock.halfproject {
  width: 50%;
}

.portfolioblock.threeup {
  clear: both;
  background-color: var(--white);
  flex-direction: column;
  align-items: flex-start;
  width: 30%;
  min-height: 100px;
  padding-top: 32px;
  display: flex;
}

.portfolioblock.threeup.hidden {
  display: none;
}

.portfolioblock.threeup.twoup {
  width: 50%;
}

.metricsblock {
  flex-direction: column;
  justify-content: space-around;
  margin-top: 1rem;
  display: flex;
}

.metricsblock.sidebyside {
  flex-direction: row;
  align-items: center;
}

.metricsblock.sidebyside.vertical {
  flex-direction: column;
}

.metricsblock.sidebyside.vertical.left {
  align-items: flex-start;
}

.metricblock {
  padding-left: 0;
  padding-right: 0;
  display: block;
}

.metricblock.centered {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.footer {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: var(--jet);
  flex-flow: row;
  grid-template: "." 1.5fr
                 "." 1fr
                 "."
                 "."
                 "."
                 "."
                 / 2.5fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  align-items: center;
  min-height: 0;
  margin-top: 0;
  padding: 40px;
  display: flex;
}

.footer.possible {
  background-color: var(--accent);
}

.footer.contracting.notopspace {
  margin-top: 0;
}

.companylist {
  justify-content: space-between;
  max-width: 100vw;
  margin-top: 0;
  padding-bottom: 10vh;
  padding-left: 0;
  padding-right: 0;
  display: flex;
}

.companylist.stacked {
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  max-width: 1440px;
  padding-left: 2rem;
  padding-right: 2rem;
  display: block;
}

.companylist.hidden {
  display: none;
}

.company {
  border: 2px solid var(--jet);
  box-shadow: 6px 6px 0 0 var(--jet);
  border-radius: 4px;
  justify-content: center;
  align-items: center;
  width: 30%;
  height: auto;
  display: flex;
}

.company.spacebelow {
  margin-bottom: 2rem;
}

.company.kohls {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
  position: static;
}

.company.hidemobile {
  align-items: center;
  margin-bottom: 0;
}

.company.halfcolumn {
  width: 50%;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.logo {
  max-width: 80%;
  height: auto;
  max-height: 80%;
}

.logo.possiblelogo {
  border-radius: 4px;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
}

.logo.salesforce {
  width: auto;
}

.logo.superlogo {
  width: 70%;
  max-width: 100%;
  height: 80%;
  max-height: 100%;
}

.menulink {
  flex: 0 auto;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 100%;
  min-width: 0;
  display: flex;
}

.large {
  font-family: Prompt, sans-serif;
  font-size: 1.75rem;
  font-weight: 400;
  line-height: 2.25rem;
}

.large.centered {
  text-align: center;
  margin-bottom: 0;
}

.large.centered.spaceabove {
  margin-top: 1rem;
}

.large.serif {
  font-family: Montserrat, sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
}

.contactcontainer {
  z-index: 999;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  background-color: #1db3f7;
  grid-template-rows: 128px 1fr 128px;
  grid-template-columns: 64px 1fr 1fr 64px;
  grid-auto-columns: 1fr;
  width: 100vw;
  height: 100vh;
  display: grid;
  position: absolute;
  bottom: 100vh;
}

.contactcontainer.shown {
  z-index: 999;
  background-color: var(--secondary);
  background-image: linear-gradient(to bottom, var(--accent), var(--secondary));
  position: fixed;
  inset: 0%;
}

.contactcontainer.shown.freelance {
  background-color: var(--jet);
}

.contactcontainer.possible {
  background-color: var(--accent);
}

.contactcontainer.kohls {
  background-color: var(--tertiary);
}

.contactcontainer.kohls.shown {
  background-image: linear-gradient(to bottom, var(--g-pink-top), var(--tertiary));
}

.contactcontainer.nationwide {
  background-color: #1db3f7;
}

.contactcontainer.nationwide.shown {
  background-image: linear-gradient(to bottom, var(--g-blue-top), #1db3f7);
}

.contactblock {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: var(--white);
  box-shadow: 11px 11px 0 0 var(--jet);
  border: 2px solid #2f2f2f;
  border-radius: 4px;
  grid-template-rows: 32px 1fr auto auto 32px;
  grid-template-columns: 32px 1fr 32px;
  grid-auto-columns: 1fr;
  width: auto;
  height: auto;
  margin: 0;
  padding-right: 0;
  display: grid;
  position: static;
  inset: auto;
}

.contactheader {
  flex-direction: column;
  display: flex;
}

.utility-page-wrap {
  background-color: var(--white);
  box-shadow: 11px 11px 0 0 var(--jet);
  border: 2px solid #000;
  border-radius: 4px;
  justify-content: center;
  align-items: stretch;
  width: 80vw;
  max-width: 100%;
  height: 60vh;
  max-height: 100%;
  padding-top: 32px;
  display: flex;
}

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

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.field-label {
  text-align: left;
  margin-bottom: 4px;
  padding-left: 16px;
  font-family: Prompt, sans-serif;
  font-weight: 500;
}

.text-field {
  color: var(--jet);
  border: 2px solid #000;
  border-radius: 4px;
  margin-bottom: 32px;
  padding-left: 16px;
  padding-right: 16px;
  font-family: Montserrat, sans-serif;
  font-weight: 500;
}

.heading {
  margin-top: 16px;
  margin-bottom: 16px;
}

.iconfont {
  font-family: "Font awesome 5 pro 300", sans-serif;
  font-style: normal;
  font-weight: 300;
}

.iconfont.bold {
  font-family: "Font awesome 5 pro solid 900", sans-serif;
}

.iconfont.regular {
  font-family: "Font awesome 5 pro 400", sans-serif;
  font-weight: 400;
}

.iconfont.highlighticon {
  text-align: center;
  font-size: 60px;
  line-height: 150%;
}

.iconfont.highlighticon.kohlsgradient {
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(135deg, #c4188c, #860135);
  -webkit-background-clip: text;
  background-clip: text;
}

.iconfont.highlighticon.kohlsgradientalt {
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(135deg, #f39529, #c82531);
  -webkit-background-clip: text;
  background-clip: text;
}

.iconfont.moreinfoiconfont {
  font-family: "Font awesome 5 pro 300", sans-serif;
  font-size: 24px;
  font-weight: 300;
  line-height: 100%;
  text-decoration: none;
}

.iconfont.moreinfoiconfont.supericon {
  color: #fff;
}

.iconfont.openclose {
  display: none;
}

.contentcenter {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: ". . contentArea contentArea contentArea" 1fr
  / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.cscontext {
  flex-direction: column;
  justify-content: flex-start;
  display: flex;
}

.space-8 {
  height: 8px;
  min-height: 8px;
}

.contentleft {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: ". contentArea contentArea contentArea imageArea imageArea"
  / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.fullsizeimage {
  width: 100%;
}

.contentright {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: "Area imageArea imageArea contentArea contentArea contentArea"
  / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.fullwidthimage {
  object-fit: contain;
  width: 100%;
}

.contentleftdouble {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: ". contentAreaTop contentAreaTop contentAreaTop imageArea imageArea"
                 ". contentAreaBottom contentAreaBottom contentAreaBottom imageArea imageArea"
                 / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.contentrightdouble {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: ". imageArea imageArea contentAreaTop contentAreaTop contentAreaTop"
                 ". imageArea imageArea contentAreaBottom contentAreaBottom contentAreaBottom"
                 / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.contentblockbottomfull {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: "imageArea imageArea imageArea imageArea imageArea imageArea imageArea"
                 "spacer spacer spacer spacer spacer spacer spacer" 32px
                 ". . contentArea contentArea contentArea . ."
                 / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.contentblocktopfull {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: ". . contentArea contentArea contentArea . ."
                 "spacer spacer spacer spacer spacer spacer spacer" 32px
                 "imageArea imageArea imageArea imageArea imageArea imageArea imageArea"
                 / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.contentblockbottomgutter {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: ". imageArea imageArea imageArea imageArea imageArea ."
                 "spaceBetween spaceBetween spaceBetween spaceBetween spaceBetween spaceBetween spaceBetween" 32px
                 ". . contentArea contentArea contentArea . ."
                 / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.contentblocktopgutter {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: ". . contentArea contentArea contentArea . ."
                 "spacer spacer spacer spacer spacer spacer spacer" 32px
                 ". imageArea imageArea imageArea imageArea imageArea ."
                 / 16px 1fr 1fr 1fr 1fr 1fr 16px;
  grid-auto-columns: 1fr;
  display: grid;
}

.processmap {
  height: 100%;
  display: none;
}

.hidemobile {
  margin-bottom: 1rem;
}

.hidemobile.haflwidth {
  max-width: 50%;
}

.fullwidth {
  width: 100%;
  max-width: 1440px;
}

.fullwidth.fullheight {
  height: 100%;
}

.fullwidth.fullheight.gradienttest {
  background-color: var(--white);
  white-space: normal;
  width: 100vw;
  height: 100vh;
  position: relative;
}

.fullwidth.saveforlaterprocess {
  background-image: url('../images/kohlsJourneyMap-Journey.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.processtext {
  display: none;
}

.flexboxbody {
  background-color: var(--white);
  background-image: linear-gradient(to bottom, var(--g-pink-top), var(--accent));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.error-message {
  border: 2px solid var(--error-red);
  background-color: var(--light-error-red);
  border-radius: 4px;
}

.text-block {
  color: var(--jet);
  font-family: Prompt, sans-serif;
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1.75rem;
}

.bold-text {
  font-weight: 700;
}

.projectheader {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template: "."
                 "."
                 "." 60vh
                 / 1rem 2.5fr 1fr 1rem;
  grid-auto-columns: 0;
  padding-top: 4rem;
  display: grid;
  overflow: visible;
}

.projectheader.possible {
  background-color: var(--accent);
  grid-template-rows: auto auto 50vh;
  padding-bottom: 8rem;
}

.projectheader.nationwide {
  background-color: #1db3f7;
}

.projectheader.nationwide.gradient {
  background-image: linear-gradient(to bottom, var(--lightprimary), var(--g-blue-top));
  overflow: hidden;
}

.nomax {
  max-width: 1280px;
}

.possiblehero {
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.cardimage {
  width: 30%;
  margin-top: 0;
  margin-bottom: auto;
}

.possibledashboard {
  width: 45%;
}

.possiblepayments {
  width: 50%;
  margin-top: 10rem;
}

.contentabove {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto auto auto;
  grid-template-columns: 32px 1fr 1fr 32px;
  grid-auto-columns: 1fr;
  margin-top: 2rem;
  margin-left: 0;
  margin-right: 0;
  padding-bottom: 2rem;
  padding-left: 0;
  padding-right: 0;
  display: grid;
}

.contentabove.accent {
  background-color: var(--accent);
  grid-template-rows: auto auto auto auto 64px auto;
  margin-top: 2rem;
  padding-bottom: 2rem;
}

.contentabove.accent.pink {
  background-color: var(--tertiary);
  background-image: linear-gradient(to top, var(--g-pink-top), var(--lightprimary));
}

.contentabove.pinkaccent {
  background-color: var(--lightsecondary-2);
}

.contentabove.pinkaccent.nobottompadding {
  background-color: var(--g-pink-top);
  background-image: linear-gradient(to bottom, var(--lightsecondary-2), var(--secondary) 57%);
  padding-bottom: 0;
}

.contentabove.blueaccent {
  background-color: var(--lightprimary);
  background-image: linear-gradient(to bottom, var(--lightsecondary), var(--accent));
}

.contentabove.tertiaryaccent {
  background-color: #1db3f7;
}

.screenmatrix {
  flex-wrap: wrap;
  place-content: center space-around;
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.screenmatrix.spacebelow {
  flex-flow: row;
  max-width: 1440px;
  margin-bottom: 2rem;
}

.screenmatrix.spacebelow.spaceabove {
  margin-top: 2rem;
}

.screenmatrix.spacebelow.blurredbypassword {
  filter: blur(8px);
  min-width: 100%;
  max-width: none;
  min-height: 256px;
  max-height: 100%;
}

.screenmatrix.spacebelow.blurredbypassword.fullwidth {
  align-items: flex-start;
}

.screenmatrix.spacebelow.blurredbypassword.kohlscontext {
  min-width: 0%;
  height: 100%;
  min-height: 255px;
  max-height: 99%;
}

.screenmatrix.spacebelow.spacebetween {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: center;
}

.screenmatrix.spacebelow.kohlscontext {
  max-width: 100%;
  height: 100%;
  min-height: 256px;
  max-height: 100%;
}

.screenmatrix.bigscreens {
  flex-wrap: nowrap;
}

.screenmatrix.packed {
  justify-content: center;
}

.screenmatrix.packed.autowidth {
  width: 100%;
  max-width: 768px;
}

.screenmatrix.nowrap {
  flex-wrap: nowrap;
}

.screenmatrix.nowrap.spacebelow.spacebetween {
  justify-content: space-between;
}

.screenmatrix.nowrap.spacebelow.spacebetween._90vw {
  width: 90vw;
}

.screenmatrix.vertical {
  flex-direction: column;
}

.screenmatrix.vertical.spaced {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
}

.screenmatrix.halfwidth {
  grid-column-gap: 64px;
  grid-row-gap: 64px;
}

.screenmatrix.halfwidth.spaced {
  grid-column-gap: 64px;
  grid-row-gap: 64px;
  align-items: flex-start;
  width: 375px;
}

.screenmatrix.halfwidth.left-align {
  justify-content: flex-start;
  align-items: flex-start;
  width: 375px;
}

.screenmatrix.spacebetween {
  flex-flow: row;
  justify-content: space-between;
}

.resultsblock.spacearound {
  flex: 0 auto;
  align-self: center;
  margin-left: 2rem;
  margin-right: 2rem;
}

.resultsblock.verticalspacing {
  margin-top: 20px;
  margin-bottom: 20px;
}

.resultsblock._50 {
  width: 40%;
}

.kohlslaptop {
  flex: 1;
  align-self: flex-end;
  max-width: 70%;
  margin-top: 5.2rem;
  margin-left: auto;
  margin-right: 5vw;
}

.kohlsphone {
  flex: none;
  align-self: flex-end;
  min-width: 25%;
  max-width: 25%;
  margin-top: 0%;
  margin-right: auto;
}

.projectsiteheader {
  background-color: #0000;
  justify-content: space-between;
  align-items: center;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding: 1rem 2rem 1rem 1rem;
  display: flex;
  position: sticky;
}

.projectsiteheader.nationwide {
  background-color: var(--primary-blue);
  width: 100%;
}

.projectsiteheader.kohls {
  background-color: var(--g-pink-top);
}

.projectsiteheader.kohls.cnc {
  background-color: var(--secondary);
  width: 100%;
}

.projectsiteheader.possible {
  background-color: var(--accent);
}

.lightspan {
  color: var(--dark-grey);
}

.half-width {
  max-width: 50%;
}

.twoup {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.painpointgroup {
  justify-content: center;
  align-items: center;
  display: flex;
}

.painpoint {
  width: auto;
  height: 40%;
  margin-right: 48px;
}

.flex {
  justify-content: space-around;
  align-items: stretch;
  width: 100%;
  margin-top: 1.5rem;
  display: flex;
}

.flex.fullwidth {
  justify-content: space-around;
  width: 100%;
  max-width: 1440px;
}

.flex.fullwidth.cardflex {
  border-bottom: 2px solid var(--jet);
  height: 50vh;
  position: relative;
  overflow: hidden;
}

.flex.fullwidth.spacebelow {
  max-width: 1440px;
}

.flex.fullwidth._2padding {
  z-index: 1;
  max-width: none;
  margin-bottom: -2rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  position: relative;
}

.flex.fullwidth.zadjust {
  z-index: 1;
  position: relative;
}

.flex.fullwidth.wrap {
  flex-wrap: wrap;
}

.flex.fullwidth.spacebetween {
  justify-content: space-between;
}

.flex.fullwidth.spacebetween.mobilevertical {
  width: 100%;
}

.flex.vertical {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: auto;
}

.flex.vertical.condensed {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  flex-direction: column;
  align-items: flex-start;
  width: 50%;
  margin-top: 0;
}

.flex.vertical.centered {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  align-items: center;
  width: 375px;
  margin-top: 0;
}

.flex.vertical._30 {
  width: auto;
  max-width: 30%;
}

.flex.hero {
  justify-content: space-between;
  width: 100%;
  max-width: 1440px;
}

.flex.auto {
  width: 100%;
  max-width: 768px;
}

.flex.aligntop {
  align-items: flex-start;
  max-width: 800px;
}

.flex.aligntop.spacedout {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  max-width: 1440px;
}

.flex.aligntop._100h {
  min-width: 460px;
  height: 100%;
  min-height: 256px;
}

.flex.hidden {
  display: none;
}

.flex.spaced {
  justify-content: space-between;
  align-items: stretch;
}

.flex.spaced._24gutter {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
}

.flex.spaced._40gutter {
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
  width: auto;
  margin-left: 2rem;
  margin-right: 2rem;
}

.flex.spaced.small {
  grid-column-gap: 5rem;
  grid-row-gap: 5rem;
  width: auto;
}

.flex.centerspace {
  grid-column-gap: 128px;
  grid-row-gap: 128px;
  width: 100%;
  max-width: 1440px;
}

.flex._100 {
  justify-content: space-between;
  width: 100%;
}

.flex._100.extrmargintop {
  margin-top: 128px;
}

.flex._6-col {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  align-items: flex-start;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
}

.flex._100x100 {
  background-image: none;
  width: 100vw;
  height: 100vh;
}

.flex.dbj-profilephoto {
  justify-content: center;
  align-items: center;
  width: auto;
  margin-top: 0;
  position: relative;
}

.flex.dbj-header {
  margin-top: 0;
}

.flex.linkedin {
  align-items: flex-start;
  margin-top: 0;
  transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
  position: relative;
}

.flex.linkedin.transparent {
  opacity: 0;
}

.flex.emailcopy {
  justify-content: center;
  margin-top: 0;
  transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
  position: relative;
}

.flex.emailcopy.transparent {
  opacity: 0;
}

.kohlssaveforlater {
  object-fit: contain;
  width: 100%;
  max-width: none;
  max-height: 100%;
}

.threeup-illo {
  justify-content: space-around;
  display: flex;
}

.divider {
  background-color: var(--jet);
  border-radius: 4px;
  height: 2px;
  margin-top: 4rem;
  margin-bottom: 4rem;
}

.divider.tight {
  margin-top: 0;
  margin-bottom: 2rem;
}

.divider.tight.lowtier {
  background-color: var(--secondary);
}

.divider.tight.midtier {
  background-color: var(--tertiary);
}

.divider.tight.hightier {
  background-color: var(--primary-blue);
}

.label {
  font-family: Lora, sans-serif;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 2rem;
}

.label.small {
  font-family: Prompt, sans-serif;
}

.label.small.white {
  font-family: Montserrat, sans-serif;
}

.label.small.white.new {
  text-align: right;
  margin-top: 24px;
}

.label.small.white.spacetop {
  margin-top: 24px;
}

.sitemap {
  flex-flow: wrap;
  justify-content: space-between;
  align-self: stretch;
  align-items: flex-start;
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.sitecategory {
  flex-direction: column;
  padding-bottom: 2rem;
  display: flex;
}

.medium {
  font-size: 1rem;
  font-weight: 500;
}

.medium.hidden {
  display: none;
}

.contentcentered, .contentstack {
  flex-direction: column;
  align-items: center;
  margin-top: 2rem;
  margin-left: 2rem;
  margin-right: 2rem;
  display: flex;
}

.contentstack.spacebelow {
  padding-bottom: 2rem;
}

.contentstack.fullwidth {
  margin-left: 0;
  margin-right: 0;
  padding-left: 2rem;
  padding-right: 2rem;
}

.contentstack.fullwidth.accent {
  background-color: var(--accent);
  background-image: linear-gradient(to bottom, var(--lightprimary), white);
  max-width: none;
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.contentstack.fullwidth.accent.gray {
  background-color: var(--light-grey);
  background-image: linear-gradient(to bottom, var(--lightsecondary), var(--lightprimary));
}

.contentstack.fullwidth.accent.gray.nospaceabove {
  margin-top: 0;
}

.contentstack.fullwidth.accent.warm {
  background-image: linear-gradient(to bottom, var(--lightprimary) 43%, var(--g-pink-top));
}

.contentstack.fullwidth.accent.pink {
  background-color: var(--g-pink-top);
  background-image: linear-gradient(to bottom, var(--lightprimary), var(--g-pink-top));
}

.contentstack.fullwidth.aboutcontracting {
  background-color: var(--lightprimary);
  margin-top: 0;
  padding-top: 2em;
  padding-bottom: 2em;
}

.contentstack.fullwidth.nopadding {
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

.contentstack.fullwidth.overlap {
  z-index: 0;
  background-color: var(--lightprimary);
  background-image: linear-gradient(to bottom, var(--white), var(--lightsecondary));
  max-width: none;
  margin-top: 1rem;
  padding-bottom: 4rem;
  position: relative;
}

.contentstack.fullwidth.pinkaccent {
  background-color: var(--lightsecondary-2);
  background-image: linear-gradient(to bottom, var(--accent), var(--g-pink-top));
  max-width: none;
}

.contentstack.hidden {
  display: none;
}

.contentstack.nospacetop {
  margin-top: 0;
}

.contentstack.sidebyside {
  grid-column-gap: 8rem;
  grid-row-gap: 2rem;
  flex-flow: wrap;
  justify-content: center;
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.contentstack.sidebyside.floatbottom {
  align-items: flex-end;
}

.contentstack.sidebyside.floattop {
  align-items: flex-start;
}

.contentstack.sidebyside.nowrap {
  flex-wrap: nowrap;
}

.contentstack.sidebyside.nowrap.aligntop {
  align-items: flex-start;
}

.contentblock {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-top: 2rem;
  margin-left: 2rem;
  margin-right: 2rem;
  padding-bottom: 2rem;
  display: grid;
}

.space-16 {
  display: none;
}

.insight {
  grid-column-gap: 0rem;
  grid-row-gap: 1rem;
  flex-direction: column;
  justify-content: flex-start;
  max-width: 30%;
  display: flex;
}

.image-3 {
  clear: both;
}

.spacebelow {
  margin-bottom: 2rem;
}

.macbookimage {
  max-width: 90%;
}

.projectgrid {
  flex-flow: row;
  justify-content: space-between;
  padding-left: 2rem;
  padding-right: 2rem;
  display: flex;
}

.contractingblock {
  border: 2px solid var(--jet);
  box-shadow: 11px 11px 0 0 var(--jet);
  border-radius: 4px;
  flex-flow: column wrap;
  align-content: center;
  width: 100%;
  height: auto;
  margin: 1rem 1rem 1rem 0;
  padding: 2rem 2rem 1rem;
  display: flex;
}

.contractingcolumn {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  flex-flow: column wrap;
  grid-template: "PossibleCard PossibleCard CartAndCheckout"
                 "Area-2 Area Area"
                 ". . ."
                 ". . ."
                 ". . ."
                 / 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: row;
  justify-content: flex-start;
  align-items: center;
  width: 30%;
  display: flex;
}

.fullwidthtext {
  max-width: none;
}

.possiblecard {
  min-width: 70%;
  max-width: 70%;
  position: absolute;
}

.bold {
  font-weight: 700;
}

.white {
  color: var(--white);
}

.white.nospacebelow {
  margin-bottom: 48px;
}

.white.link {
  max-width: none;
  margin-bottom: 0;
  font-family: Prompt, sans-serif;
  text-decoration: none;
}

.timelinecircle {
  border: 4px solid var(--jet);
  background-color: var(--white);
  border-radius: 20px;
  width: 2rem;
  height: 2rem;
}

.timeline {
  z-index: -1;
  border: 0px solid var(--jet);
  background-color: var(--jet);
  width: 100%;
  height: 4px;
  margin-top: -1px;
  position: absolute;
  inset: 50% 0% auto;
}

.centertext {
  text-align: center;
}

.space-32 {
  height: 32px;
}

.supportingvisual {
  max-width: 30%;
  margin-bottom: 2rem;
}

.supportingvisual.margintop {
  margin-top: auto;
  margin-bottom: auto;
}

.screen {
  border: 2px solid var(--jet);
  box-shadow: 11px 11px 0 0 var(--jet);
  border-radius: 4px;
}

.postgrid {
  padding-bottom: 2rem;
  padding-left: 2rem;
  padding-right: 2rem;
}

.postblock {
  border: 2px solid var(--jet);
  box-shadow: 11px 11px 0 0 var(--jet);
  border-radius: 4px;
  flex-direction: column;
  margin-bottom: 2rem;
  padding-bottom: 2.5rem;
  padding-left: 2rem;
  padding-right: 2rem;
  display: flex;
}

.flexcenter {
  justify-content: center;
  display: flex;
}

.companyrow {
  justify-content: space-between;
  width: 100%;
  margin-bottom: 2rem;
  display: flex;
}

.bigcart {
  flex: 0 auto;
  align-self: flex-start;
  width: 40%;
  max-width: none;
}

.nwscrollcollection {
  align-self: flex-start;
  max-width: 30%;
}

.portfoliosection {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 1rem;
  display: flex;
}

.portfoliosection.stacked {
  flex-direction: column;
}

.halfwidth {
  max-width: 50%;
  margin-bottom: 1rem;
}

.halfwidth.kohlsimages {
  align-self: flex-start;
  max-width: 45%;
}

.sidebysideproducts {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  flex-direction: row;
  justify-content: space-between;
  display: flex;
}

.mobilelink {
  padding-top: 0;
  padding-bottom: 0;
  font-family: Prompt, sans-serif;
  font-weight: 500;
}

.fittospace {
  align-self: flex-start;
  width: 20%;
}

.flexheader {
  grid-column-gap: 40px;
  grid-row-gap: 0px;
  justify-content: space-between;
  align-self: stretch;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding: 2rem;
  display: flex;
}

.flexheader.contained {
  padding-left: 0;
  padding-right: 0;
}

.flexheader.yellow {
  background-color: var(--accent);
}

.flexheader.black {
  background-color: var(--jet);
  padding-bottom: 3rem;
}

.flexheader.black.lighttext {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.flexheader.freelance {
  background-color: var(--g-pink-top);
  background-image: linear-gradient(to bottom, var(--accent), var(--g-pink-top) 50%, var(--jet));
  padding-bottom: 20rem;
}

.flexheader.freelance.hidden {
  display: none;
}

.flexheader.portfolioheader {
  justify-content: flex-start;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.titleblock {
  flex-direction: column;
  justify-content: space-between;
  display: flex;
}

.buttonblock {
  flex-direction: column;
  justify-content: center;
  display: flex;
}

.copyrights {
  justify-content: space-between;
  align-self: stretch;
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  font-family: Montserrat, sans-serif;
  display: flex;
}

.colorgradient {
  background-image: linear-gradient(to bottom, var(--g-blue-top), #1db3f7);
  width: auto;
  height: 100vh;
}

.colorgradient.yellow {
  background-image: linear-gradient(to bottom, var(--accent), var(--secondary));
}

.colorgradient.pink {
  background-image: linear-gradient(to bottom, var(--g-pink-top), var(--tertiary));
}

.colorgradient.alternate {
  background-image: linear-gradient(to bottom, var(--accent), var(--g-blue-top) 40%, #1db3f7 80%, var(--g-pink-top));
}

.anchor {
  width: 100%;
  height: 0;
}

.image-5 {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 0 0;
  background-size: auto;
}

.offering {
  clear: both;
  border: 2px solid var(--jet);
  box-shadow: 11px 11px 0 0 var(--jet);
  border-radius: 4px;
  width: 30%;
  min-height: 80px;
  padding: 16px;
}

.offering.low {
  border-color: var(--secondary);
  box-shadow: 11px 11px 0 0 var(--accent);
}

.offering.mid {
  border-color: var(--tertiary);
  box-shadow: 11px 11px 0 0 var(--g-pink-top);
}

.offering.high {
  border-color: var(--primary-blue);
  box-shadow: 11px 11px 0 0 var(--g-blue-top);
}

.offeringgroup {
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  display: flex;
}

.newheader {
  flex-direction: column;
  align-items: flex-start;
  padding: 4rem 2rem 8rem;
  display: flex;
  position: relative;
}

.newheader.possiblegradient {
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.newheader.saveforlater {
  background-color: var(--tertiary);
  background-image: linear-gradient(to bottom, var(--g-pink-top), var(--secondary));
}

.phonecontainer {
  justify-content: space-between;
  align-items: flex-start;
  width: 66%;
  display: flex;
}

.nwheader {
  min-width: 100%;
  max-width: 100%;
  margin-top: 0;
  padding-left: 0;
  padding-right: 0;
}

.nehero {
  width: 100%;
  margin-top: 2rem;
}

.div-block-3 {
  background-color: var(--secondary);
  filter: blur(60px);
  border-radius: 100px;
  width: 10vw;
  height: 10vw;
  position: absolute;
}

.pheader {
  grid-column-gap: 48px;
  grid-row-gap: 48px;
  background-color: var(--jet);
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 100vw;
  height: auto;
  margin-top: 0%;
  padding: 64px 128px;
  display: flex;
}

.pheader.condensed {
  padding-top: 0;
  padding-left: 32px;
  padding-right: 32px;
}

.variablewidthh1 {
  color: var(--white);
  text-align: center;
  max-width: none;
  padding-left: 8px;
  padding-right: 8px;
  font-family: Montserrat, sans-serif;
  font-size: 4rem;
  font-weight: 900;
  line-height: 5.5rem;
}

.variablewidthh1.leftaligned {
  text-align: left;
  font-size: 2.8rem;
  line-height: 4rem;
}

.variablewidthh2 {
  background-color: var(--secondary);
  background-image: linear-gradient(135deg, var(--secondary), var(--accent));
  color: var(--secondary);
  text-align: center;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  padding-left: 4px;
  padding-right: 4px;
  font-family: Montserrat, sans-serif;
  font-size: 2.2rem;
  font-style: italic;
  font-weight: 900;
  line-height: 3.5rem;
}

.variablewidthh2.leftaligned {
  text-align: left;
  width: 100%;
  font-size: 1.5rem;
}

.variablewidthh3 {
  background-color: var(--tertiary);
  background-image: linear-gradient(125deg, var(--tertiary), var(--g-pink-top));
  color: var(--tertiary);
  text-align: center;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  margin-top: 0;
  padding-left: 4px;
  padding-right: 4px;
  font-family: Montserrat, sans-serif;
  font-size: 2rem;
  font-weight: 900;
  line-height: 3rem;
}

.variablewidthh3.leftaligned {
  text-align: left;
  width: 100%;
  margin-bottom: 2rem;
  font-size: 1.5rem;
  line-height: 3.5rem;
}

.buttongroup {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  align-items: center;
  margin-top: 40px;
  display: flex;
}

.buttongroup.vertical {
  flex-direction: column;
  justify-content: flex-end;
}

.pdescription {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  border: 0px none var(--lightprimary);
  justify-content: space-around;
  align-items: center;
  width: 100%;
  padding: 64px 88px 64px 64px;
  display: flex;
}

.circleimage {
  border: 2px solid var(--jet);
  box-shadow: 6px 6px 0 0 var(--accent), 17px 17px 0 0 var(--tertiary), 28px 28px 0 0 var(--g-blue-top);
  border-radius: 8px;
}

.navlink {
  min-width: 0;
  max-width: none;
  font-family: Montserrat, sans-serif;
  font-weight: 700;
}

.navlink.w--current {
  color: var(--jet);
  font-style: normal;
  text-decoration: underline;
}

.navcontainer {
  background-color: var(--primary-blue);
  justify-content: center;
  display: flex;
}

.navcontainer.kohls {
  background-color: var(--secondary);
}

.navcontainer.white {
  background-color: var(--white);
}

.navbar {
  background-color: var(--white);
  box-shadow: 0 2px 0 0 var(--jet);
  position: sticky;
  top: 0;
}

.navbar.mobile {
  display: none;
}

.navbar.desktop {
  border-style: solid;
  border-width: 0 0 2px;
  border-color: var(--jet);
  box-shadow: none;
}

.heading-2 {
  align-self: flex-start;
}

.emphasis {
  font-style: italic;
  font-weight: 600;
}

.process2023 {
  background-color: var(--jet);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 8rem;
  display: flex;
}

.imagehidelmobile {
  display: block;
}

.imageshowlmobile {
  display: none;
}

.link {
  font-family: Prompt, sans-serif;
  font-weight: 500;
}

.self {
  box-shadow: 6px 6px 0 0 var(--g-blue-top);
  border-radius: 4px;
  max-width: 75%;
  margin-bottom: 8px;
  margin-right: 8px;
}

.logosmall {
  opacity: .4;
}

.logosmall.kohlslogosmall {
  background-image: url('../images/kohlsLogo-white.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20%;
}

.logosmall.nationwidelogosmall {
  background-image: url('../images/nationwideLogo-white.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20%;
}

.logosmall.possible {
  background-image: url('../images/possibleLogo-white.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20%;
}

.logosmall.superlogosmall {
  background-image: url('../images/superLogo-white.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20%;
  height: 60px;
}

.passwordsection {
  flex-direction: column;
  flex: 0 auto;
  align-self: center;
  align-items: center;
  display: flex;
  position: relative;
}

.passwordsection._100h {
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
}

.passwordcontent {
  z-index: 1;
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  background-color: #0000;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: absolute;
  inset: 0%;
}

.passwordcontent.hidesectionwithpassword {
  background-color: #fff9;
  justify-content: flex-start;
  padding-top: 4rem;
}

.passwordfield {
  color: var(--jet);
  text-align: center;
  font-family: Prompt, sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 2rem;
}

.flexwrap {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: flex-start;
  display: flex;
}

.flexwrap.spaceabovebelow {
  grid-column-gap: 64px;
  grid-row-gap: 64px;
  flex-wrap: nowrap;
  justify-content: space-around;
  width: 100vw;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.flexwrap.spaceabovebelow.nospacetablet {
  max-width: 1440px;
}

.legacyscreen {
  width: 15%;
}

.fixedwidth {
  max-width: 600px;
}

.fixedwidth.halfwidth {
  width: 50%;
}

.fixedwidth.spaceaboveandbelow {
  margin-top: 24px;
  margin-bottom: 16px;
}

.fixedwidth._64bottom {
  margin-bottom: 64px;
}

.fixedwidth.fullheight {
  height: 100%;
}

.fixedwidth._2x2 {
  width: 100%;
  height: 100%;
  min-height: 700px;
}

.fixedwidth.borderright {
  border-right: 5px solid var(--light-grey);
  align-items: center;
  height: 100%;
  padding-right: 24px;
  display: flex;
}

.fixedwidth._100h {
  width: 100%;
  min-height: 400px;
  max-height: 100%;
}

.phone {
  max-height: 80vh;
}

.journeymapping {
  background-image: url('../images/kohlsJourneyMap-Journey.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.kohlscartscreen {
  align-self: flex-start;
  max-width: 20%;
}

.autowidth {
  max-width: none;
}

.autowidth._50 {
  max-width: 50%;
  max-height: 100%;
}

.autowidth._50.minw {
  min-width: 50%;
}

.autowidth._30 {
  max-width: 30%;
  max-height: 100%;
}

.autowidth._30.minw {
  min-width: 30%;
  min-height: 0%;
}

.autowidth._20 {
  max-width: 20%;
}

.autowidth._25 {
  max-width: 25%;
}

.autowidth._40 {
  max-width: 40%;
  height: auto;
  max-height: 100%;
}

.autowidth._40.outlined {
  outline-color: var(--jet);
  outline-offset: 2px;
  outline-width: 2px;
  outline-style: solid;
  max-width: 45%;
  box-shadow: 1px 1px #0003;
}

.autowidth._40.bordertop {
  width: 40%;
  min-width: 40%;
}

.widequote {
  border-right: 5px none var(--light-grey);
  border-left-style: solid;
  width: 50%;
  max-width: 981px;
  padding-left: 24px;
  padding-right: 0;
  font-family: Montserrat, sans-serif;
  font-size: 2.5rem;
  font-style: italic;
  font-weight: 300;
}

.bordertop {
  border: 1px solid #000;
  border-top-width: 2px;
}

.leftalign {
  text-align: left;
  font-weight: 500;
}

.email {
  color: var(--white);
  text-align: center;
  font-family: Montserrat, sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 2rem;
}

.email.dark {
  color: var(--jet);
  margin-top: 1rem;
}

.semibold {
  font-weight: 600;
}

.semibold.nospacebelow, .nomargin {
  margin-bottom: 0;
}

.huge {
  font-family: Montserrat, sans-serif;
  font-size: 2.5rem;
  font-weight: 300;
  line-height: 3.5rem;
}

.titlegroup {
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.headercontainer, .navheader {
  width: 100%;
}

.contentcontainer {
  width: 100%;
  max-width: 1440px;
}

.image-7 {
  width: 100%;
  max-width: none;
  height: 100%;
}

.image-8 {
  width: 100%;
  max-width: 1440px;
}

.div-block-4, .div-block-5 {
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.image-9, .image-10 {
  width: 100%;
  max-width: 1440px;
}

.div-block-6 {
  margin-left: auto;
  margin-right: auto;
}

.processcontainer {
  background-color: var(--jet);
}

.image-11 {
  max-width: 90%;
}

.gridbody {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  display: grid;
}

.gridsection {
  grid-column-gap: 24px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: stretch;
  width: 100%;
  margin-top: 0;
  padding-top: 0;
  padding-left: 24px;
  padding-right: 24px;
  display: grid;
}

.gridsection.noheader {
  margin-top: 128px;
}

.gridsection.noheader.spacebelow {
  margin-bottom: 8rem;
}

.gridsection.gridspacebelow {
  align-items: center;
  padding-bottom: 4rem;
}

.gridsection.gridspacebelow.gridspaceabove {
  padding-top: 4rem;
}

.col-template {
  width: 100%;
  height: 20vh;
}

.col-template.col1-temp {
  background-color: #fadddf;
}

.col-template.col2-temp {
  background-color: #ffd3f5;
}

.col-template.col3-temp {
  background-color: #eed4ff;
}

.col-template.col4-temp {
  background-color: #d9d5ff;
}

.col-template.col5-temp {
  background-color: #d5eeff;
}

.col-template.col6-temp {
  background-color: #bcfbff;
}

.col-template.col7-temp {
  background-color: #c7ffe7;
}

.col-template.col8-temp {
  background-color: #bcfac7;
}

.col-template.col9-temp {
  background-color: #eeffb6;
}

.col-template.col10-temp {
  background-color: #ffebad;
}

.col-template.col11-temp {
  background-color: #fdd7ae;
}

.col-template.col12-temp {
  background-color: #cecece;
}

._2-col._100 {
  width: 100%;
}

._3-col {
  margin-top: 24px;
  margin-bottom: 16px;
}

._3-col.centered {
  flex-direction: column;
  align-items: center;
  display: flex;
}

._4-col, ._6-col {
  margin-top: 24px;
  margin-bottom: 16px;
}

._6-col.fullwidthcolumn {
  width: 100%;
}

._6-col.fullwidthcolumn.fullheightcolumn {
  height: 100%;
}

._6-col.possiblephone-dashboard {
  background-image: url('../images/possibleCardDashboardPhone.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

._6-col._100 {
  width: 100%;
  height: 100%;
  margin-top: 0;
  margin-bottom: 0;
}

._6-col._100.possiblephone-dashboard {
  object-fit: contain;
  margin-top: 0;
  margin-bottom: 0;
}

._6-col._100.possiblephone-autopay {
  background-image: url('../images/possibleCardSetupPaymentsPhone.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

._6-col._100.possiblephone-approval {
  background-image: url('../images/possibleCardApprovedPhone.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

._6-col._100.possibleteam {
  background-image: url('../images/illo-possibleTeam.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 70%;
}

._6-col._70 {
  width: 70%;
}

._6-col._50 {
  width: 50%;
}

._6-col.fullheight {
  height: 100%;
}

._12-col._100 {
  width: 100%;
  height: 12rem;
}

._12-col._100.possiblejourney {
  background-image: url('../images/journeyMapFull.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

._12-col._100.autoheight {
  height: auto;
}

._12-col._100.autoheight.spaceabove {
  margin-top: 40px;
}

._12-col._100-nomin {
  width: 100%;
}

.headersection {
  width: 100%;
  margin-top: 128px;
  padding-top: 40px;
  padding-left: 24px;
  padding-right: 24px;
}

.headersection.nospaceabove {
  margin-top: 0;
  padding-top: 0;
}

.maxwidthcontainer {
  max-width: 1440px;
}

.possiblevalueprops {
  border: 2px solid var(--jet);
  background-color: #fff;
  border-radius: 2px;
  max-width: 80%;
}

.image-12, .image-13, .image-14 {
  max-width: 80%;
}

.possiblelistitem {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  align-items: center;
  margin-top: 40px;
  margin-bottom: 40px;
  display: flex;
}

.sectiondivider {
  background-color: var(--light-grey);
  height: 2px;
}

.grey {
  border: 1px none var(--dark-grey);
  color: var(--dark-grey);
  font-family: Montserrat, sans-serif;
  font-weight: 500;
}

.grey.dark {
  color: var(--jet);
}

.heading-3 {
  color: var(--dark-grey);
}

.possiblevaluepropicon {
  width: 64px;
}

.image-15 {
  height: 100%;
  min-height: 100%;
}

.minheight100 {
  width: 100%;
  min-width: 0%;
  max-width: none;
  min-height: 256px;
}

.fullwidthcontainer {
  width: 100%;
}

.fullwidthcontainer.lightbluewhite {
  background-color: var(--lightprimary);
  background-image: linear-gradient(to bottom, var(--lightprimary), white);
}

.fullwidthcontainer.bluepink {
  background-image: linear-gradient(to bottom, var(--lightprimary), var(--g-pink-top));
  margin-top: 128px;
}

.fullwidthcontainer.pinkyellow {
  background-image: linear-gradient(to bottom, var(--lightsecondary-2), var(--secondary));
}

.fullwidthcontainer.checkoutbefore {
  background-image: linear-gradient(to bottom, var(--accent), var(--g-pink-top));
}

._60 {
  width: 60%;
}

._100x100 {
  background-image: url('../images/nationwidePoliciesPhone.png');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
}

._100x100.kohlsbg {
  background-image: url('../images/kohlsCheckoutPhone.png');
}

.max-height {
  max-height: 600px;
}

._2x2-int {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  width: 100%;
  height: 50%;
  padding-top: 8px;
  padding-bottom: 8px;
  display: flex;
}

.s4lnotebook {
  width: 50%;
  max-width: 50%;
  height: 100%;
}

.s4lnotebook.sketch1 {
  background-image: url('../images/SaveForLaterNotebook-1.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.s4lnotebook.sketch2 {
  background-image: url('../images/SaveForLaterNotebook-15.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.s4lnotebook.sketch3 {
  background-image: url('../images/SaveForLaterNotebook-8.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.s4lnotebook.sketch4 {
  background-image: url('../images/SaveForLaterNotebook-10.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.kohlsmockup {
  width: 100%;
  height: 100%;
  min-height: 512px;
}

.kohlsmockup.cart {
  background-image: url('../images/kohlsCart-iPad.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.kohlsmockup.checkout {
  background-image: url('../images/kohlsCheckout-macbook.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

._100 {
  width: 50%;
  display: flex;
}

._100.vertical-center {
  align-self: center;
}

._100.fullwidthimage {
  width: 100%;
  height: 600px;
}

._100.fullwidthimage.autoheight {
  height: auto;
}

._100.fullwidthimage.autoheight.buttonspacebelow {
  margin-bottom: 80px;
}

._100.verticalstack {
  flex-flow: column;
  align-items: flex-start;
}

.kohlsprocess {
  width: 100%;
  height: 100%;
  max-height: 100%;
}

.kohlscontextleft {
  background-image: url('../images/7--Watch-Layout---Waffler-Action-Sheet.png');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: contain;
  align-self: auto;
  width: 50%;
}

.kohlscontextright {
  background-image: url('../images/anatomyOfOffers.png');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: cover;
  width: 50%;
}

.image-16 {
  width: 100%;
}

.newportfoliosection {
  grid-column-gap: 16px;
  grid-row-gap: 132px;
  grid-template: "Large-project-highlight Large-project-highlight"
                 "Large-project Large-project"
                 "Small-project-left Small-project-right"
                 / 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  margin: 40px;
  display: grid;
}

.newportfoliosection.kohls {
  grid-template-rows: auto auto;
  margin-bottom: 0;
}

.newprojectdiv {
  background-color: var(--white);
  border-radius: 16px;
  width: 100%;
  height: 100%;
  padding: 40px 40px 64px;
  position: relative;
  box-shadow: 1px 2px 8px #0003;
}

.newprojectdiv.right {
  justify-content: flex-end;
  display: flex;
}

.summaryblock {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  justify-content: flex-end;
  align-items: center;
  width: 327px;
  display: flex;
}

.summaryblock.aligntop {
  justify-content: flex-start;
}

.summaryblock.toppadding {
  justify-content: flex-end;
  align-items: flex-start;
  margin-top: 208px;
}

.summarytitle {
  flex-flow: column;
  display: flex;
}

.newh3 {
  margin-top: 0;
  font-size: 40px;
  font-style: normal;
  font-weight: 800;
  line-height: 150%;
}

.newh3.projecttitle {
  margin-bottom: -12px;
}

.newh3.projectoutline {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  padding-left: 0;
  padding-right: 0;
  display: block;
}

.newh3.projectoutlineheadline {
  margin-top: 40px;
}

.newh3.maxwidth {
  width: 100%;
  max-width: 800px;
}

.newh4 {
  color: var(--jet);
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 150%;
}

.newh4.supersecondtitlelarge {
  display: none;
}

.newh4.maxwidth {
  max-width: 600px;
}

.newp {
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%;
  transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
}

.newp.containermax {
  max-width: none;
}

.newp.containermax.displaynone {
  display: none;
}

.newp.large {
  text-align: center;
  margin-top: 0;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
}

.newp.large.subheadline {
  line-height: 125%;
}

.newp.bold {
  font-weight: 600;
}

.newp.bold.max-width {
  width: 100%;
}

.newp.bold.centered {
  text-align: center;
}

.newp.bold._100 {
  width: calc(80% + 16px);
}

.newp.bold.moreinfohidden {
  opacity: 0;
}

.newp.bold.moreinfohidden.moreinfodisplaynone {
  display: none;
}

.newp.verticalcenter {
  align-self: center;
}

.newp.hidden {
  color: #2f2f2f00;
  text-decoration: none;
}

.newp.caption {
  color: var(--dark-grey);
  text-align: center;
  margin-top: 4px;
  font-size: 14px;
  font-weight: 400;
}

.newp.caption.extraspace {
  margin-top: 24px;
}

.newp.caption.left {
  text-align: left;
}

.newp.caption.left.spacebelow {
  margin-top: 0;
  margin-bottom: 24px;
}

.summarycontent {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.text-block-2 {
  flex-flow: column;
  max-width: none;
  padding: 4px 12px;
  font-family: Montserrat, sans-serif;
  font-size: 18px;
  line-height: 150%;
  display: flex;
}

.div-block-8 {
  object-fit: none;
  font-family: Montserrat, sans-serif;
  font-size: 18px;
  line-height: 150%;
  position: relative;
}

.tag {
  background-color: #dcdcdc66;
  border-radius: 100px;
  padding: 4px 12px;
  font-family: Montserrat, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%;
  display: inline-block;
  position: relative;
  overflow: visible;
}

.taglist {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: wrap;
  display: flex;
}

.kohlssummary {
  width: 50%;
  height: auto;
  display: none;
  position: absolute;
  inset: auto 0% auto auto;
}

.kohlssummary._992 {
  width: 58%;
  height: auto;
  display: block;
  bottom: 0;
}

.newbutton {
  border: 2px solid var(--newprimary);
  background-color: var(--newprimary);
  color: #222;
  text-align: center;
  border-radius: 100px;
  min-height: 40px;
  font-family: Montserrat, sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 150%;
}

.newbutton:hover {
  background-color: #fff;
}

.newbutton:active {
  background-color: #f592224d;
}

.newbutton.hidden {
  background-color: var(--light-grey);
}

.nationwidesummary {
  width: 78%;
  display: none;
  position: absolute;
  inset: -132px 0% 160px auto;
}

.nationwidesummary.nw992 {
  width: 100%;
  display: block;
  top: auto;
  bottom: 53%;
}

.possiblesummary {
  width: 65%;
  display: none;
  position: absolute;
  inset: -132px 0% 0% auto;
}

.possiblesummary._992 {
  width: 80%;
  display: block;
  top: auto;
  bottom: 52%;
}

.min-widthbody {
  background-color: #f5f5f5;
  transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
  overflow: visible;
}

.min-widthbody.modalopen {
  overflow: clip;
}

.newnav {
  border-bottom: 3px solid var(--light-grey);
  color: var(--jet);
  border-radius: 0;
  align-items: baseline;
  min-width: 0;
  margin-top: 40px;
  margin-left: 0;
  margin-right: 0;
  padding-bottom: 24px;
  font-family: Montserrat, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 150%;
  text-decoration: none;
  display: flex;
}

.newnav:hover {
  border-bottom-color: var(--dark-grey);
}

.newnav.current {
  border-bottom-style: solid;
  border-bottom-color: var(--newprimary);
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
  padding-bottom: 10px;
  font-size: 60px;
}

.newnav.current.w--current, .newnav.current.w--current:hover {
  color: var(--jet);
}

.newnav.current.dbj-current {
  border-bottom-color: #b121f5;
}

.newnav.process {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  justify-content: flex-end;
  align-items: center;
  margin-top: 101px;
  margin-bottom: 60px;
  padding-bottom: 44px;
  line-height: 15%;
  display: flex;
}

.newnav.casestudy:hover {
  border-bottom-color: var(--newprimary);
}

.newnav.casestudy.w--current {
  color: var(--jet);
}

.newnav.dbj-nav:hover {
  border-bottom-color: #f5ad23;
}

.nav-menu-2 {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: center;
  align-items: baseline;
  width: 100%;
  margin-top: 40px;
  margin-bottom: 40px;
  display: flex;
}

.nav-menu-2.casestudy {
  margin-top: 16px;
  margin-bottom: 12px;
  position: sticky;
  top: 0;
}

.newnavbar {
  background-color: #f5f5f5;
  justify-content: space-between;
  width: 100%;
  margin-top: 80px;
  display: flex;
  position: relative;
  inset: 0% 0% auto;
}

.newnavbar.casestudy {
  margin-top: 0;
  position: sticky;
  top: -40px;
}

.newnavbar.header {
  margin-top: 0;
}

.container {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  display: flex;
}

.newresume {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  margin: 40px;
  padding-bottom: 40px;
  display: flex;
}

.downloadheader {
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 768px;
  display: flex;
}

.resumelineitem {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  background-color: var(--white);
  border-radius: 16px;
  flex-flow: column;
  width: 100%;
  height: 100%;
  min-height: 44px;
  margin-top: 0;
  margin-bottom: 0;
  padding: 40px 40px 64px;
  display: flex;
  box-shadow: 2px 2px 8px #0003;
}

.resumelineitem.hidden, .resumelineitem.displaynone {
  display: none;
}

.jobtitle {
  justify-content: space-between;
  align-items: baseline;
  width: 100%;
  max-width: 768px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.jobtitle.floatright {
  justify-content: flex-end;
}

.bulletpoints {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  width: 100%;
  max-width: 768px;
  margin-left: auto;
  margin-right: auto;
  transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
  display: flex;
}

.bulletpoints.displaynone {
  display: none;
}

.jobmetadata {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  display: flex;
}

.newh2 {
  text-align: center;
  margin-top: 40px;
  font-family: Montserrat, sans-serif;
  font-size: 100px;
  font-weight: 900;
  line-height: 150%;
}

.newh2.headline {
  margin-top: 24px;
  margin-bottom: -12px;
}

.newh2.superheadline {
  -webkit-text-fill-color: transparent;
  background-color: #ff009b;
  background-image: linear-gradient(135deg, #ff009b 25%, #d92191 78%);
  -webkit-background-clip: text;
  background-clip: text;
  border-bottom: 3px #ff009b;
}

.newh2.nationwide {
  color: #0577ff;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(135deg, #005252, #003a5c 50%, #00520c);
  -webkit-background-clip: text;
  background-clip: text;
}

.newh2.possible {
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(135deg, #0577ff, #05397f);
  -webkit-background-clip: text;
  background-clip: text;
}

.newh2.kohl-s {
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(135deg, #c4188c 20%, #860135);
  -webkit-background-clip: text;
  background-clip: text;
}

.mesection {
  grid-column-gap: 7.5%;
  grid-row-gap: 7.5%;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 0 0 24px;
  display: flex;
}

.mesection.dbj-mesection {
  margin-top: 40px;
}

._50 {
  align-self: auto;
  width: 50%;
  max-width: 600px;
}

._50.oldsuperapp {
  width: 100%;
}

._50._800h {
  width: auto;
  max-height: 800px;
}

._50._800h.left {
  align-self: flex-start;
}

._50._800h.center {
  align-self: center;
}

._50._800h.right {
  align-self: flex-end;
}

._50.flex {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
}

._50.flex.top {
  align-items: flex-start;
}

._50.kohlsfirstpass {
  width: calc(50% - 8px);
}

._50.flexchild {
  width: calc(50% - 20px);
}

._50.small {
  width: 35%;
}

._50.aligntop {
  justify-content: space-between;
  align-self: flex-start;
  align-items: flex-start;
  display: flex;
}

._50.screenshot {
  width: 40%;
}

._50.intro {
  align-self: flex-end;
}

.contactsection {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-top: 40px;
  padding-bottom: 16px;
  display: flex;
}

.contactsection.fixed {
  background-color: #f5f5f5;
  height: auto;
  position: sticky;
}

.contactsection.nospace {
  padding-top: 0;
  padding-bottom: 40px;
}

.emailblock {
  width: 40%;
}

.contactgroup {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.contactgroup.emailgroup {
  justify-content: flex-end;
  align-items: center;
}

.iconsmall {
  filter: brightness(0%) saturate(0%);
  background-image: url('../images/LI-In-Bug.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 27px;
  height: 27px;
}

.iconsmall.email {
  background-image: url('../images/envelope-regular.svg');
}

.iconsmall.email.dbj-icon {
  filter: saturate(0%) saturate(0%);
}

.newprocess {
  justify-content: space-between;
  height: 480px;
  margin: 40px;
  padding-bottom: 40px;
  padding-right: 0;
  display: flex;
}

.processphase {
  background-color: var(--newprimary);
  border-radius: 200px;
  width: 80px;
  height: 80px;
}

.processphase.processstart {
  align-self: auto;
}

.processphase.processend, .processphase.processb {
  align-self: center;
}

.processphase.processd, .processphase.processc {
  align-self: flex-end;
}

.processgroup {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.processgroup.p2 {
  justify-content: flex-start;
  align-items: center;
}

.processgroup.p3 {
  align-self: flex-end;
}

.supersummary {
  width: 59%;
  display: block;
  position: absolute;
  top: -7%;
  bottom: auto;
  left: 0;
}

.supersummary._1440, .supersummary._768, .supersummary._568 {
  display: none;
}

.newh1 {
  text-align: center;
  max-width: none;
  font-size: 100px;
  font-style: normal;
  line-height: 150%;
}

.casestudyheader {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 80px;
  display: flex;
}

.projectoutline {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  grid-template: "projectOutlineHeader projectOutlineHeader"
  / 1fr 1fr;
  grid-auto-columns: 1fr;
  max-width: 1440px;
  margin-top: 40px;
  padding: 80px 40px;
  display: flex;
}

.projectoutline.possible {
  background-color: #f2f8ff;
  flex-flow: column;
  max-width: 1440px;
  display: flex;
}

.projectoutlineflex {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  width: calc(50% - 20px);
  display: flex;
}

.projectoutlineflex._50 {
  align-self: flex-start;
  width: 100%;
}

.newportfoliogroup {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  align-items: flex-start;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding: 40px;
  display: flex;
  position: relative;
}

.newportfoliogroup.stacked {
  flex-flow: column;
  padding-bottom: 128px;
}

.newportfoliogroup.stacked.lightgrey {
  background-color: #ff009b00;
}

.newportfoliogroup.spacedout {
  margin-top: 80px;
  margin-bottom: 80px;
}

.supergradient {
  -webkit-text-fill-color: transparent;
  background-color: #ff009b;
  background-image: linear-gradient(135deg, #ff009b, #d92190);
  -webkit-background-clip: text;
  background-clip: text;
}

.supergradientalt {
  -webkit-text-fill-color: transparent;
  background-color: #4f4df8;
  background-image: linear-gradient(135deg, #4f4df8, #3e3dc4);
  -webkit-background-clip: text;
  background-clip: text;
}

._100-image {
  width: 100%;
}

._100-image.margintop {
  margin-top: 64px;
}

._100-image.buttonspacebelow {
  margin-bottom: 80px;
}

.flexcontent {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  margin-top: 40px;
  display: flex;
}

.flexcontent.stacked {
  flex-flow: column;
}

.flexcontent._100 {
  justify-content: space-between;
  width: 100%;
}

.flexcontent._100.spaced {
  grid-column-gap: 8%;
  grid-row-gap: 8%;
  justify-content: flex-start;
}

.flexcontent._100.flexvertical {
  justify-content: center;
}

.flexcontent._100.right {
  justify-content: flex-end;
}

.flexcontent.centered {
  justify-content: center;
  align-items: flex-start;
  margin-top: 0;
}

.flexcontent.centervertical {
  align-items: center;
}

.possibleheader {
  margin-top: -11%;
}

.possiblegradient {
  -webkit-text-fill-color: transparent;
  background-color: #0577ff;
  background-image: linear-gradient(135deg, #0577ff, #05397f);
  -webkit-background-clip: text;
  background-clip: text;
}

.possiblegradientalt {
  -webkit-text-fill-color: transparent;
  background-color: #1fde32;
  background-image: linear-gradient(135deg, #1fde32, #158c2e);
  -webkit-background-clip: text;
  background-clip: text;
}

.icongroup {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  align-items: center;
  display: flex;
}

.iconflexcontent {
  grid-column-gap: 8%;
  grid-row-gap: 8%;
  flex-flow: row;
  justify-content: flex-start;
  width: 100%;
  margin-top: 40px;
  display: flex;
}

.flexscreens {
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 40px;
  display: flex;
}

.margin-top {
  margin-top: 40px;
}

.margin-top.whiteborder {
  background-color: #fff;
  padding: 24px;
}

._2lineflexgroup {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: wrap;
  justify-content: flex-end;
  align-self: flex-start;
  align-items: flex-start;
  display: flex;
}

.headerdiv {
  justify-content: center;
  display: flex;
}

.flexoverview {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: flex-start;
  width: 100%;
  display: flex;
}

.projectoutlinepossible {
  background-color: #f2f8ff;
  justify-content: center;
  align-items: flex-start;
  width: 100vw;
  display: flex;
}

.overviewsuper {
  background-color: var(--super-callout);
  justify-content: center;
  align-items: flex-start;
  width: 100vw;
  display: flex;
}

.projectoutlinenationwide {
  background-color: #feab2133;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.nationwidehighlight {
  -webkit-text-fill-color: transparent;
  background-color: #005252;
  -webkit-background-clip: text;
  background-clip: text;
}

.nationwidehighlightb {
  -webkit-text-fill-color: transparent;
  background-color: #003a5c;
  -webkit-background-clip: text;
  background-clip: text;
}

.nationwidehighlightc {
  -webkit-text-fill-color: transparent;
  background-color: #00520c;
  -webkit-background-clip: text;
  background-clip: text;
}

.code-embed-2 {
  background-color: #f5f5f5;
}

.projectoutlinekohls {
  background-color: #f9e8f3;
  flex-flow: row;
  justify-content: center;
  display: flex;
}

.margin-bottom {
  margin-bottom: 40px;
}

.margin-bottom.displaynone {
  display: none;
}

.margin-bottom.hero {
  display: block;
}

.kohlshighlight {
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(135deg, #c4188c, #860135);
  -webkit-background-clip: text;
  background-clip: text;
}

.kohlshighlightb {
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(135deg, #f39529, #c82531);
  -webkit-background-clip: text;
  background-clip: text;
}

.kohlshighlightc {
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(135deg, #70c2c6, #802b7a);
  -webkit-background-clip: text;
  background-clip: text;
}

.projectcontainer {
  width: 100%;
}

.newcontainer {
  position: relative;
}

.wrapper {
  position: relative;
  top: 0;
}

.screengroup {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.screengroup.scaled80 {
  width: 80%;
}

.screengroup.scaled80.offsettop {
  margin-top: -20%;
}

.screengroup.scaled80.homepage {
  width: 49.7%;
  margin-top: -11%;
  padding-left: 7.5%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.phonetest {
  -webkit-text-fill-color: inherit;
  background-image: url('../images/phoneScreenTest.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto 98%;
  background-clip: border-box;
  border-radius: 0;
  align-self: auto;
  max-width: 25%;
  max-height: none;
  display: block;
  position: relative;
}

.phonetest._2 {
  background-image: url('../images/possibleCardActivated---iPhone14Pro.png');
}

.phonetest._3 {
  background-image: url('../images/possibleCardMailed---iPhone14Pro-1.pn.png');
}

.phonetest.super1 {
  background-image: url('../images/rev.8.19.24---superNStarHome.png');
  background-size: 95% 98%;
  position: absolute;
}

.phonetest.super2 {
  background-image: url('../images/rev.8.19.24---superCashHub.png');
  background-size: 95% 98%;
  position: absolute;
  transform: translate(84%, 9%)rotate(15deg);
}

.phonetest.super3 {
  background-image: url('../images/rev.8.19.24---superApproved200.png');
  background-size: 95% 98%;
  position: absolute;
  transform: rotate(30deg)translate(173%);
}

.phonetest.super4 {
  background-image: url('../images/rev.8.19.24---superApproved50.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 95% 98%;
  position: absolute;
  transform: translate(-76%, 28%)rotate(-15deg);
}

.phonetest.super5 {
  background-image: url('../images/rev.8.19.24---superDelivery.png');
  background-size: 95% 98%;
  position: absolute;
  transform: translate(-136%, 68%)rotate(-30deg);
}

.screentest {
  border-radius: 40px;
  max-width: 28.4%;
  max-height: none;
  display: block;
  position: absolute;
}

.macbooktest {
  background-image: url('../images/macScreenTest.png'), url('../images/macVenturaDesktop.jpg');
  background-position: 50% 17%, 50% 17%;
  background-repeat: no-repeat, no-repeat;
  background-size: 70%, auto 88%;
  max-width: 90%;
}

.screencontainerdiv {
  flex-flow: column;
  width: 48%;
  display: flex;
}

.centerflex {
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.centerflex.vertical {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
}

.dbj-logo {
  width: 55%;
}

.dbj-profilecircle {
  background-color: #f5ad23;
  border-radius: 100%;
  align-self: flex-end;
  width: 100%;
  height: 100%;
  position: absolute;
}

.dbj-profile {
  border-bottom-right-radius: 100%;
  border-bottom-left-radius: 100%;
  position: relative;
}

.dbj-services {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-bottom: 80px;
  margin-left: 40px;
  margin-right: 40px;
  display: grid;
}

.dbj-servicesline {
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  margin-right: 4px;
  display: flex;
}

.dbj-service {
  background-color: var(--white);
  border: 2px solid #f5ad23;
  border-radius: 8px;
  width: 100%;
  height: 180px;
  padding: 8px;
  display: flex;
  box-shadow: 2px 4px 8px #2223;
}

.dbj-service.dbj-fullwidthservice {
  background-color: var(--white);
  border-color: #b121f5;
  width: 100%;
}

.services {
  margin-left: 40px;
  margin-right: 40px;
  display: flex;
}

.services.spacebetween {
  justify-content: space-between;
  margin-top: 40px;
  margin-bottom: 40px;
}

.servicebenefit {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  align-items: center;
  width: 30%;
  min-height: 100px;
  margin-top: 24px;
  margin-bottom: 24px;
  display: flex;
}

.dbj-iconsmall {
  width: 50px;
  height: 50px;
}

.process {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  align-items: center;
  margin-top: 40px;
  margin-bottom: 128px;
  padding-left: 40px;
  padding-right: 40px;
  display: flex;
}

.processstep {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.processflexcontent {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  display: flex;
}

.pastsitessection {
  padding: 40px;
}

.pastsite {
  background-color: #fff;
  border-radius: 16px;
  width: 100%;
  min-height: 150px;
  box-shadow: 1px 2px 4px #0003;
}

.moreinfo-casestudy {
  align-self: center;
  margin-top: 40px;
  margin-bottom: 0;
  display: none;
  position: sticky;
  top: 60vh;
}

.moreinfo-casestudy.alignleft {
  align-self: flex-start;
}

.moreinfo-casestudy.hidden {
  opacity: 0;
  transition: all .3s;
  transform: scale(.1);
}

.moreinfolink {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: #fff6;
  border: 2px solid #ff009b;
  border-radius: 100px;
  justify-content: space-around;
  align-items: center;
  min-width: 0;
  min-height: 56px;
  padding: 4px 4px 4px 24px;
  text-decoration: none;
  display: flex;
  position: static;
  box-shadow: 1px 2px 8px #0003;
}

.moreinfolink.hiddenlabel {
  padding-left: 4px;
}

.moreinfoicon {
  background-color: #ff009b;
  border-radius: 100px;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  display: flex;
}

.modalcontainer {
  z-index: 9999;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: #2229;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100vh;
  padding: 40px;
  display: flex;
  position: fixed;
  overflow: scroll;
}

.modalcontainer.displaynone {
  display: none;
}

.modal {
  background-color: #f5f5f5;
  border-radius: 16px 16px 0 0;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: calc(100% - 80px);
  max-width: 1280px;
  height: auto;
  margin-bottom: 80px;
  margin-left: 40px;
  margin-right: 40px;
  padding: 40px;
  display: flex;
  position: absolute;
  top: 40px;
  bottom: auto;
  overflow: visible;
}

.closebutton {
  border: 3px solid var(--light-grey);
  background-color: #f5f5f5;
  border-radius: 100px;
  justify-content: center;
  align-items: center;
  width: 40px;
  min-width: auto;
  max-width: none;
  height: 40px;
  min-height: auto;
  padding-top: 0;
  padding-bottom: 0;
  text-decoration: none;
  display: flex;
  position: absolute;
  inset: 24px 24px auto auto;
}

.detailssection {
  flex-flow: column;
  justify-content: space-between;
  width: 100%;
  margin-top: 80px;
  display: flex;
}

.superscreenhero {
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 70vw;
  display: flex;
}

.companylogos {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: none;
  margin-top: 24px;
  margin-bottom: 0;
  display: flex;
}

.companylogos.tablet {
  display: none;
}

.companylogo {
  opacity: .35;
  filter: contrast(200%) grayscale() brightness(0%);
  background-image: url('../images/kohlsLogo.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 15%;
  min-width: 0;
  max-width: none;
  min-height: 48px;
  text-decoration: none;
  transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
}

.companylogo.super {
  background-image: url('../images/logo-super.com.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 16%;
  margin-right: 4px;
}

.companylogo.super:hover {
  opacity: 1;
  filter: none;
}

.companylogo.possible {
  background-image: url('../images/possibleLogo-2.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 14%;
  margin-left: 4px;
  margin-right: 4px;
}

.companylogo.possible:hover {
  opacity: 1;
  filter: none;
}

.companylogo.kohls {
  background-image: url('../images/kohlsLogo.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 4px;
  margin-right: 4px;
}

.companylogo.kohls:hover {
  opacity: 1;
  filter: none;
}

.companylogo.nationwide {
  background-image: url('../images/Nationwide-Insurance-Logo.png');
  width: 16%;
  min-height: 48px;
  text-decoration: none;
}

.companylogo.nationwide:hover {
  opacity: 1;
  filter: none;
}

.companylogo.microsoft {
  background-image: url('../images/microsoft-logo.svg');
  background-size: 82%;
  width: 18%;
  display: block;
}

.companylogo.microsoft:hover {
  opacity: 1;
  filter: none;
}

.emaillinkblock {
  justify-content: center;
  align-items: center;
  transition-duration: .5s;
  display: flex;
}

.emaillinkblock:hover {
  color: #b121f5;
  text-decoration: none;
}

.linkedinlinkblock {
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.linkedinlinkblock:hover {
  color: #b121f5;
  text-decoration: none;
}

.navspan {
  margin-top: auto;
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 100%;
}

.hero {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.flexaligncenter {
  align-self: center;
}

.flexalignright {
  align-self: flex-end;
}

.portraitcontainer {
  width: auto;
  max-width: 30%;
  position: relative;
}

.portraitblock {
  background-color: var(--newprimary);
  border-radius: 8px;
  width: 100%;
  height: 50%;
  position: absolute;
  bottom: 0;
}

.selfportrait {
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  width: 100%;
  display: block;
  position: relative;
}

.flexvertical {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  align-self: flex-start;
  display: flex;
}

.flexvertical.rightalign {
  justify-content: flex-start;
  align-items: center;
}

.flexvertical.rightalign.menu {
  display: none;
}

.copyemailbtn {
  border: 2px solid var(--newprimary);
  background-color: var(--newprimary);
  color: var(--jet);
  text-align: right;
  border-radius: 8px 0 0 8px;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 44px;
  display: flex;
}

.copyemailbtn.linkedincopy {
  text-align: left;
  background-color: #0000;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  width: 50%;
}

.copyemailbtn.linkedinredirect {
  background-color: var(--newprimary);
  border-radius: 0 100px 100px 0;
  width: 50%;
}

.copyemailbtn.send {
  background-color: #0000;
  border-radius: 0 100px 100px 0;
}

.copyemailbtn.send.superbtn {
  border-color: #f59222;
}

.copyemailbtn.leftbtn {
  border-top-left-radius: 100px;
  border-bottom-left-radius: 100px;
}

.copyemailbtn.leftbtn.superbtn {
  background-image: linear-gradient(135deg, #ff009b 25%, #d92191 78%);
}

.copylinkedinbtn {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-self: flex-start;
  align-items: center;
  display: flex;
}

.copylinkedinbtn.menu {
  display: none;
}

.confirmationmessage {
  outline-offset: 0px;
  background-color: #f5f5f5;
  outline: 4px solid #f5f5f5;
  justify-content: center;
  align-items: center;
  transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
  display: flex;
  position: absolute;
  inset: 0%;
}

.confirmationmessage.transparent {
  opacity: 0;
}

.confirmationmessage.transparent.hidden, .confirmationmessage.transparent.hiddebn {
  display: none;
}

.middleblock {
  align-self: center;
}

.flexalignleft {
  flex-flow: column;
  justify-content: flex-start;
  align-self: flex-start;
  align-items: flex-start;
  display: block;
}

.div-block-9 {
  justify-content: center;
  align-items: center;
  width: 20%;
  height: 100px;
  margin-bottom: 256px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.wave {
  z-index: -1;
  width: 100%;
  position: absolute;
  top: 30px;
}

.dbjgridsection {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  min-height: 100px;
  display: grid;
}

.dbj-h1 {
  letter-spacing: 2px;
  font-size: 87px;
  font-style: normal;
  font-weight: 700;
  line-height: 100%;
}

.dbj-h1.large {
  font-size: 140px;
  font-weight: 600;
  line-height: 100%;
}

.dbj-h2 {
  font-size: 21px;
  font-weight: 400;
  line-height: 125%;
}

@media screen and (min-width: 1280px) {
  .newportfoliosection {
    margin-top: 184px;
  }

  .newprojectdiv {
    padding-top: 64px;
    padding-bottom: 80px;
  }

  .summaryblock.aligntop {
    justify-content: flex-start;
    align-items: flex-start;
    width: 375px;
  }

  .summaryblock.toppadding {
    width: 375px;
  }

  .newp.caption.extraspace.centerflex {
    align-self: center;
  }

  .newp.caption.spacebelow {
    margin-bottom: 24px;
  }

  .kohlssummary {
    width: calc(100% - 407px);
    height: auto;
    display: block;
    top: -64px;
  }

  .kohlssummary._992, .kohlssummary.k768 {
    display: none;
  }

  .newbutton {
    background-color: var(--newprimary);
    border: 2px solid #0000;
    transition-duration: .5s;
  }

  .newbutton:hover {
    border: 2px solid var(--newprimary);
    background-color: var(--white);
    text-decoration: none;
  }

  .newbutton:active {
    background-color: #f5922266;
  }

  .nationwidesummary {
    display: block;
  }

  .nationwidesummary.nw992 {
    display: none;
  }

  .possiblesummary {
    width: 60%;
    display: block;
    top: -140px;
  }

  .possiblesummary._992 {
    display: none;
  }

  .min-widthbody {
    transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
  }

  .resumelineitem {
    padding-top: 64px;
    padding-bottom: 80px;
  }

  .mesection {
    justify-content: center;
  }

  .supersummary {
    width: 65%;
    top: -34%;
  }

  .screengroup.scaled80.offsettop {
    margin-top: -17%;
  }

  .superscreenhero {
    height: 75vw;
  }

  .flexaligncenter {
    align-self: center;
  }

  .flexalignright {
    align-self: flex-end;
  }

  .portraitcontainer {
    position: relative;
  }

  .portraitblock {
    background-color: var(--newprimary);
    border-radius: 8px;
    width: 100%;
    height: 50%;
    position: absolute;
    bottom: 0;
  }

  .selfportrait {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    position: relative;
  }
}

@media screen and (min-width: 1440px) {
  .newportfoliosection {
    grid-row-gap: 200px;
    margin-top: 96px;
  }

  .newprojectdiv {
    padding-top: 80px;
    padding-bottom: 96px;
  }

  .newprojectdiv.right {
    justify-content: center;
  }

  .summaryblock.aligntop.right {
    margin-left: 60%;
  }

  .newh3 {
    font-size: 48px;
  }

  .newh3.maxwidth {
    max-width: 1000px;
  }

  .newh4 {
    font-size: 28px;
  }

  .newp {
    max-width: 1000px;
    font-size: 20px;
  }

  .newp.large {
    max-width: none;
  }

  .tag {
    font-size: 20px;
  }

  .kohlssummary {
    width: calc(85% - 407px);
    top: -10%;
  }

  .newbutton {
    font-size: 20px;
  }

  .nationwidesummary {
    width: 69%;
  }

  .possiblesummary {
    width: 58%;
    top: -180px;
  }

  .newresume {
    grid-column-gap: 80px;
    grid-row-gap: 80px;
  }

  .resumelineitem {
    padding-top: 80px;
    padding-bottom: 96px;
  }

  .jobtitle, .bulletpoints {
    max-width: 1000px;
  }

  .supersummary {
    width: 55%;
    display: block;
    top: -16%;
    left: 5%;
  }

  .supersummary._1440 {
    object-fit: contain;
    width: 64%;
    height: auto;
    display: none;
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
  }

  .projectoutline.possible {
    grid-column-gap: 40px;
    flex-flow: column;
    grid-template-rows: auto auto auto auto;
    grid-template-columns: auto 660px 660px auto;
    width: 100%;
    display: flex;
  }

  .possibleheader {
    margin-top: -8%;
  }

  .superscreenhero {
    max-width: 1440px;
    max-height: 1000px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (min-width: 1920px) {
  .newportfoliosection {
    grid-row-gap: 320px;
    margin-top: 14%;
    margin-bottom: 232px;
  }

  .newprojectdiv {
    padding-top: 96px;
    padding-bottom: 112px;
  }

  .summaryblock.aligntop, .summaryblock.aligntop.right, .summaryblock.toppadding {
    width: 480px;
  }

  .newh3 {
    font-size: 60px;
  }

  .newh3.maxwidth {
    max-width: 1280px;
  }

  .newh4 {
    font-size: 32px;
  }

  .newp {
    max-width: 1200px;
    font-size: 22px;
  }

  .tag {
    font-size: 22px;
  }

  .kohlssummary {
    width: 68%;
    top: -208px;
  }

  .newbutton {
    font-size: 22px;
  }

  .nationwidesummary {
    top: -220px;
  }

  .possiblesummary {
    top: -240px;
  }

  .newresume {
    grid-column-gap: 96px;
    grid-row-gap: 96px;
  }

  .resumelineitem {
    grid-column-gap: 80px;
    grid-row-gap: 80px;
    padding-top: 96px;
    padding-bottom: 112px;
  }

  .jobtitle {
    max-width: 1200px;
  }

  .bulletpoints {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }

  .supersummary {
    width: 54%;
    top: -40%;
    left: 1%;
  }

  .newportfoliogroup.stacked.lightgrey {
    background-color: #ff009b00;
  }

  .margin-bottom.hero, .hero {
    max-width: 1440px;
  }
}

@media screen and (max-width: 991px) {
  h3 {
    max-width: 100%;
  }

  .button {
    border-color: var(--jet);
    box-shadow: 11px 11px 0 0 var(--jet);
  }

  .button.linkedin.gradient.footerbutton {
    margin-top: 1rem;
  }

  .space.small.hidetablet {
    display: none;
  }

  .processgrid {
    background-image: none;
    background-repeat: repeat;
    background-size: auto;
    grid-template-rows: auto auto auto auto auto auto auto;
    grid-template-columns: 1fr;
  }

  .siteheader {
    grid-template-rows: 1.5fr 1fr 1fr auto;
    grid-template-columns: 1fr 1fr;
  }

  .siteheader.transparent {
    padding-bottom: 32px;
  }

  .portfoliogrid {
    grid-template-rows: auto auto auto auto auto;
    grid-template-areas: "possible possible"
                         "kohlsCheckout kohlsCheckout"
                         "nationwideApp nationwideApp"
                         "kohlsSaveForLater kohlsSaveForLater"
                         "nationwideSystem nationwideSystem";
  }

  .portfolioblock.flexblock {
    grid-template-rows: auto auto auto auto auto auto auto auto;
  }

  .portfolioblock.flexblock.halfproject, .portfolioblock.threeup.twoup {
    width: 100%;
  }

  .footer {
    grid-template-rows: 1.5fr 1fr auto auto auto auto auto;
    grid-template-columns: 1fr 1fr;
    padding-left: 24px;
    padding-right: 24px;
  }

  .company {
    width: 25vw;
  }

  .contentcenter {
    grid-template-areas: ". contentArea contentArea contentArea contentArea contentArea";
  }

  .contentleft {
    grid-template-rows: auto auto;
    grid-template-areas: ". contentArea contentArea contentArea contentArea ."
                         ". imageArea imageArea imageArea imageArea imageArea";
  }

  .contentright {
    grid-template-rows: auto auto;
    grid-template-areas: "Area . contentArea contentArea contentArea contentArea"
                         ". imageArea imageArea imageArea imageArea imageArea";
  }

  .contentleftdouble {
    grid-template-rows: auto auto auto;
    grid-template-areas: ". contentAreaTop contentAreaTop contentAreaTop contentAreaTop ."
                         ". imageArea imageArea imageArea imageArea imageArea"
                         ". contentAreaBottom contentAreaBottom contentAreaBottom contentAreaBottom .";
  }

  .contentrightdouble {
    grid-template-rows: auto auto auto;
    grid-template-areas: ". . contentAreaTop contentAreaTop contentAreaTop contentAreaTop"
                         ". imageArea imageArea imageArea imageArea imageArea"
                         ". . contentAreaBottom contentAreaBottom contentAreaBottom contentAreaBottom";
  }

  .processmap {
    height: auto;
    display: block;
  }

  .hidemobile.haflwidth {
    max-width: 100%;
  }

  .fullwidth.saveforlaterprocess {
    min-width: 0;
    max-width: 100vw;
  }

  .processtext {
    display: block;
  }

  .projectheader.possible {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .possiblehero {
    flex-direction: column;
    align-items: flex-start;
  }

  .cardimage {
    align-self: flex-end;
    width: 50vw;
    margin-top: -20%;
  }

  .contentabove, .contentabove.accent {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .screenmatrix {
    flex-wrap: wrap;
    place-content: space-around;
  }

  .screenmatrix.spacebelow.blurredbypassword {
    min-width: 0%;
    max-width: 100vw;
  }

  .resultsblock {
    margin-bottom: 2rem;
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .kohlslaptop {
    max-width: 60vw;
  }

  .flex {
    width: 90%;
  }

  .flex.fullwidth {
    width: 100%;
  }

  .flex.vertical.condensed {
    align-items: center;
    width: 100%;
  }

  .flex.hero, .flex.spaced._40gutter {
    flex-direction: column;
  }

  .flex.centerspace {
    width: 100%;
  }

  .flex.linkedin, .flex.emailcopy {
    align-self: center;
  }

  .sitemap {
    flex-wrap: wrap;
  }

  .contentstack, .contentblock {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .white {
    color: var(--white);
  }

  .centertext.semibold.possiblevalueproptext {
    width: 60%;
  }

  .screen.fullwidth {
    min-width: 50%;
  }

  .portfoliosection {
    flex-direction: column;
  }

  .halfwidth {
    align-self: center;
    max-width: 100%;
  }

  .halfwidth.kohlsimages {
    max-width: 50%;
  }

  .sidebysideproducts, .flexheader {
    flex-direction: column;
  }

  .flexheader.contained {
    width: 100%;
  }

  .flexheader.black.lighttext {
    color: var(--white);
  }

  .flexheader.freelance {
    background-color: var(--g-pink-top);
    background-image: linear-gradient(to bottom, var(--accent), var(--g-pink-top) 50%, var(--jet));
    padding-bottom: 18rem;
  }

  .buttonblock {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
  }

  .offering {
    width: 90%;
    margin-bottom: 32px;
  }

  .offeringgroup {
    flex-direction: column;
    align-items: center;
  }

  .newheader {
    padding-bottom: 4rem;
  }

  .newheader.checkout {
    max-width: 100vw;
  }

  .phonecontainer {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    justify-content: flex-start;
    width: 80%;
  }

  .pheader {
    padding-left: 32px;
    padding-right: 32px;
  }

  .variablewidthh2.leftaligned, .variablewidthh3.leftaligned {
    text-align: center;
  }

  .buttongroup.vertical, .pdescription {
    flex-direction: column;
  }

  .process2023 {
    width: auto;
    margin-left: 2rem;
    margin-right: 2rem;
  }

  .link {
    font-family: Prompt, sans-serif;
    font-weight: 500;
  }

  .self {
    max-width: 30%;
  }

  .flexwrap.spaceabovebelow {
    grid-column-gap: 64px;
    grid-row-gap: 64px;
    flex-direction: column;
    align-items: center;
  }

  .flexwrap.spaceabovebelow.nospacetablet {
    margin-top: 0;
  }

  .legacyscreen.paylater {
    display: none;
  }

  .phone.halfwidth {
    max-width: 50%;
  }

  .possibleperk {
    border: 2px solid var(--jet);
    background-color: #0000;
    border-radius: 4px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 50%;
    padding: 24px;
    display: flex;
  }

  .image-7, .image-8 {
    width: 100%;
  }

  .gridsection {
    grid-column-gap: 16px;
    grid-row-gap: 40px;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    padding-left: 20px;
    padding-right: 20px;
  }

  ._6-col {
    width: 100%;
  }

  ._12-col {
    overflow: visible;
  }

  .headersection {
    padding-left: 20px;
    padding-right: 20px;
  }

  .possiblevalueprops {
    max-width: 60%;
  }

  .fullwidthcontainer.checkoutbefore {
    max-width: 100vw;
  }

  ._100 {
    width: 100%;
  }

  .newportfoliosection {
    grid-row-gap: 132px;
    grid-template-rows: auto auto auto auto;
    grid-template-areas: "Large-project-Highlight Large-project-Highlight"
                         "Large-project Large-project"
                         "Small-project-left Small-project-left"
                         "Small-project-right Small-project-right";
    margin-top: 96px;
    margin-left: 24px;
    margin-right: 24px;
  }

  .newportfoliosection.kohls {
    width: 100%;
  }

  .kohlssummary._992 {
    width: 45%;
    display: none;
  }

  .kohlssummary.k768 {
    width: 47%;
    display: block;
    top: -10%;
    bottom: auto;
  }

  .nationwidesummary {
    width: 74%;
    display: block;
  }

  .nationwidesummary.nw992 {
    display: none;
  }

  .possiblesummary {
    width: 60%;
    display: block;
  }

  .possiblesummary._992 {
    display: none;
  }

  .min-widthbody {
    overflow: visible;
  }

  .newresume {
    margin-left: 24px;
    margin-right: 24px;
  }

  .jobtitle {
    grid-column-gap: 2px;
    grid-row-gap: 2px;
    flex-flow: column;
    justify-content: space-between;
    align-items: baseline;
  }

  .newh2 {
    font-size: 90px;
  }

  .newh2.headline {
    margin-bottom: -12px;
  }

  .mesection {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    justify-content: space-between;
    width: calc(100% - 48px);
    margin-left: 24px;
    margin-right: 24px;
  }

  ._50 {
    align-self: flex-end;
    width: 100%;
  }

  ._50.oldsuperapp {
    align-self: flex-start;
    width: 100%;
    max-width: none;
  }

  ._50.flex {
    align-items: flex-start;
  }

  ._50.kohlsfirstpass, ._50.screenshot {
    align-self: flex-start;
  }

  ._50.intro {
    max-width: 460px;
  }

  .contactsection {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: row;
    width: auto;
    margin-left: 24px;
    margin-right: 24px;
  }

  .newprocess, .supersummary {
    display: none;
  }

  .supersummary._768 {
    width: 48%;
    display: block;
    top: -18%;
    left: 1%;
  }

  .projectoutline {
    flex-flow: column;
    display: flex;
  }

  .projectoutline.possible {
    width: 100%;
    padding-left: 40px;
    padding-right: 40px;
  }

  .projectoutline.kohls {
    padding-left: 24px;
    padding-right: 24px;
  }

  .projectoutlineflex {
    width: 100%;
  }

  .newportfoliogroup {
    padding-left: 24px;
    padding-right: 24px;
  }

  .flexcontent {
    flex-flow: column;
  }

  .flexcontent.tabletsidebyside {
    flex-flow: row;
  }

  ._2lineflexgroup {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .flexoverview {
    flex-flow: column;
  }

  .kohlshighlightc {
    background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
    background-position: 0 0;
    background-size: auto;
  }

  .screengroup.scaled80.offsettop {
    margin-top: -20%;
  }

  .superscreenhero {
    height: 73vw;
  }

  .companylogos {
    max-width: 600px;
    display: none;
  }

  .companylogos.tablet {
    justify-content: space-between;
    width: calc(100% - 48px);
    max-width: 90vw;
    margin-left: auto;
    margin-right: auto;
    padding-left: 24px;
    padding-right: 24px;
    display: flex;
  }

  .companylogo.microsoft {
    background-size: 86%;
  }

  .emaillinkblock {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
  }

  .linkedinlinkblock {
    justify-content: center;
    align-items: flex-start;
  }

  .flexalignright {
    align-self: flex-end;
  }

  .portraitcontainer {
    width: 50%;
  }
}

@media screen and (max-width: 767px) {
  h1 {
    max-width: 100%;
  }

  .button {
    min-width: 0;
    max-width: none;
  }

  .button.primary.contactbutton {
    align-self: stretch;
  }

  .button.primary.possible, .button.tertiary.cnc.halfwidth, .button.accent.nationwide, .button.email.gradient.dark.footerbutton, .button.newgradient.dark, .button.newoutline {
    width: 100%;
  }

  .processgrid {
    background-image: none;
    background-repeat: repeat;
    background-size: auto;
    grid-template-rows: auto auto auto auto auto auto auto;
    grid-template-columns: 1fr;
  }

  .siteheader {
    grid-template-rows: auto 1fr .5fr auto auto;
    padding-left: 16px;
    padding-right: 16px;
  }

  .siteheader.accent {
    grid-template-rows: auto 1fr;
  }

  .siteheader.transparent {
    padding-bottom: 32px;
  }

  .portfoliogrid {
    margin-left: 16px;
    margin-right: 16px;
  }

  .portfolioblock.flexblock {
    padding-left: 16px;
    padding-right: 16px;
  }

  .metricsblock.sidebyside {
    flex-direction: column;
  }

  .footer {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    flex-flow: column;
    grid-template-rows: 1.5fr 1fr auto auto auto auto auto auto auto;
    justify-content: center;
    padding-left: 16px;
    padding-right: 16px;
  }

  .companylist {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
  }

  .company {
    clear: both;
    width: 280px;
    height: 160px;
    margin-bottom: 2rem;
  }

  .contactcontainer.shown {
    grid-template-columns: 16px 1fr 1fr 16px;
  }

  .contactblock {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-columns: 8px 1fr 8px;
  }

  .iconfont.openclose {
    border: 1px solid var(--light-grey);
    color: var(--jet);
    text-align: center;
    background-color: #f5f5f5;
    border-radius: 100px;
    justify-content: center;
    align-self: center;
    align-items: center;
    width: 44px;
    height: 44px;
    margin-top: 0;
    margin-bottom: -24px;
    padding-bottom: 0;
    font-size: 24px;
    font-weight: 300;
    line-height: 24px;
    transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
    display: flex;
  }

  .iconfont.openclose.opened {
    transform: rotate(45deg);
  }

  .contentcenter {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-columns: 8px 1fr 1fr 1fr 1fr 1fr 8px;
  }

  .contentleft {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-columns: 8px 1fr 1fr 1fr 1fr 1fr 8px;
    grid-template-areas: ". contentArea contentArea contentArea contentArea contentArea ."
                         "imageArea imageArea imageArea imageArea imageArea imageArea imageArea";
  }

  .contentright {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-columns: 8px 1fr 1fr 1fr 1fr 1fr 8px;
    grid-template-areas: "Area contentArea contentArea contentArea contentArea contentArea ."
                         "imageArea imageArea imageArea imageArea imageArea imageArea imageArea";
  }

  .contentleftdouble, .contentrightdouble {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-columns: 8px 1fr 1fr 1fr 1fr 1fr 8px;
    grid-template-areas: ". contentAreaTop contentAreaTop contentAreaTop contentAreaTop contentAreaTop ."
                         "imageArea imageArea imageArea imageArea imageArea imageArea imageArea"
                         ". contentAreaBottom contentAreaBottom contentAreaBottom contentAreaBottom contentAreaBottom .";
  }

  .contentblockbottomfull {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-columns: 8px 1fr 1fr 1fr 1fr 1fr 8px;
    grid-template-areas: "imageArea imageArea imageArea imageArea imageArea imageArea imageArea"
                         "spacer spacer spacer spacer spacer spacer spacer"
                         ". contentArea contentArea contentArea contentArea contentArea .";
  }

  .contentblocktopfull {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template: ". contentArea contentArea contentArea contentArea contentArea ."
                   "spacer spacer spacer spacer spacer spacer spacer" 16px
                   "imageArea imageArea imageArea imageArea imageArea imageArea imageArea"
                   / 8px 1fr 1fr 1fr 1fr 1fr 8px;
  }

  .contentblockbottomgutter {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template: ". imageArea imageArea imageArea imageArea imageArea ."
                   "spaceBetween spaceBetween spaceBetween spaceBetween spaceBetween spaceBetween spaceBetween" 26px
                   ". contentArea contentArea contentArea contentArea contentArea ."
                   / 8px 1fr 1fr 1fr 1fr 1fr 8px;
  }

  .contentblocktopgutter {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template: ". contentArea contentArea contentArea contentArea contentArea ."
                   "spacer spacer spacer spacer spacer spacer spacer" 16px
                   "imageArea imageArea imageArea imageArea imageArea imageArea imageArea"
                   / 8px 1fr 1fr 1fr 1fr 1fr 8px;
  }

  .cardimage {
    width: 60vw;
  }

  .kohlslaptop {
    max-width: 60vw;
  }

  .projectsiteheader {
    flex-direction: column;
    justify-content: space-between;
  }

  .flex.fullwidth.spacebetween.mobilevertical {
    flex-direction: row-reverse;
  }

  .flex.jd {
    flex-flow: row;
    justify-content: space-around;
    align-items: flex-start;
    width: 100%;
    margin-top: 0;
  }

  .label.small.white {
    align-self: flex-start;
  }

  .label.small.white.new {
    text-align: left;
  }

  .contentstack.sidebyside {
    width: auto;
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .space-16 {
    width: 100%;
    height: 16px;
    max-height: 16px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .projectgrid {
    flex-flow: column wrap;
  }

  .contractingcolumn {
    width: 100%;
    padding-bottom: 1rem;
  }

  .companyrow {
    flex-direction: column;
    align-items: center;
    margin-bottom: 0;
  }

  .portfoliosection.stacked.hidelmobile, .halfwidth.hidelmobile {
    display: none;
  }

  .flexheader {
    padding-left: 16px;
    padding-right: 16px;
  }

  .buttonblock {
    grid-row-gap: 0rem;
    flex-direction: column;
    align-self: center;
    align-items: stretch;
    width: 100%;
  }

  .copyrights {
    flex-direction: column;
    justify-content: flex-start;
    align-self: flex-start;
    align-items: flex-start;
  }

  .variablewidthh1 {
    text-align: center;
  }

  .buttongroup {
    flex-direction: column;
    width: 100%;
  }

  .pdescription {
    flex-direction: column;
  }

  .navcontainer {
    background-color: var(--white);
  }

  .navbar.mobile {
    display: block;
  }

  .navbar.desktop, .imagehidelmobile {
    display: none;
  }

  .imageshowlmobile {
    display: block;
  }

  .possibleperk {
    width: 100%;
  }

  .widequote {
    width: 100%;
    font-size: 2rem;
    line-height: 3.5rem;
  }

  .div-block-7 {
    margin-bottom: 1rem;
  }

  .gridsection {
    grid-column-gap: 16px;
    grid-row-gap: 40px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    padding-left: 16px;
    padding-right: 16px;
  }

  .headersection {
    padding-left: 16px;
    padding-right: 16px;
  }

  .newportfoliosection {
    margin-top: 64px;
    margin-left: 16px;
    margin-right: 16px;
  }

  .newprojectdiv {
    padding-left: 16px;
    padding-right: 16px;
  }

  .newprojectdiv.right {
    justify-content: flex-start;
  }

  .newprojectdiv.kohls {
    height: auto;
    margin-top: 0%;
  }

  .summaryblock.aligntop {
    margin-top: 95%;
  }

  .summaryblock.aligntop.right {
    margin-top: 50%;
  }

  .newh3.projecttitle {
    margin-bottom: -4px;
  }

  .newh4.supersecondtitlesmall {
    display: none;
  }

  .newh4.supersecondtitlelarge {
    display: block;
  }

  .newp {
    text-align: left;
    position: relative;
  }

  .newp.large {
    text-align: left;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 22px;
  }

  .tag {
    font-size: 16px;
  }

  .kohlssummary.k768 {
    width: 100%;
    margin-bottom: 0;
    position: absolute;
    top: -10%;
    bottom: auto;
  }

  .newnav {
    width: 100%;
  }

  .newnav.current {
    font-size: 50px;
    position: sticky;
  }

  .newnav.casestudy {
    background-color: var(--white);
    color: var(--white);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    border-bottom-style: none;
    border-bottom-width: 0;
    justify-content: flex-start;
    align-items: center;
    margin-top: 0;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 40px;
  }

  .newnav.casestudy.nationwide {
    color: var(--white);
  }

  .nav-menu-2 {
    flex-flow: column;
  }

  .nav-menu-2.casestudy {
    background-color: var(--jet);
    align-items: center;
    margin-top: 0;
  }

  .nav-menu-2.casestudy.possible {
    background-image: linear-gradient(135deg, #1fde32, #158c2e);
  }

  .nav-menu-2.casestudy.kohls {
    background-image: linear-gradient(135deg, #f39529, #c82531);
  }

  .newnavbar {
    flex-flow: column;
  }

  .newnavbar.casestudy {
    background-color: #0000;
    justify-content: flex-start;
    width: 100%;
    height: 14px;
    margin-top: 0;
    margin-left: 0;
    top: 0;
  }

  .newnavbar.casestudy.shown {
    background-color: var(--jet);
    height: 100vh;
  }

  .newnavbar.header {
    position: relative;
  }

  .newresume {
    margin-left: 16px;
    margin-right: 16px;
  }

  .resumelineitem {
    padding-left: 16px;
    padding-right: 16px;
    transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
  }

  .jobtitle {
    flex-flow: column;
  }

  .jobtitle.floatright.secondsupertitle {
    display: none;
  }

  .bulletpoints {
    transition: all .5s cubic-bezier(.175, .885, .32, 1.275);
    display: none;
  }

  .bulletpoints.transparent {
    opacity: 0;
    display: flex;
  }

  .bulletpoints.transparent.shown {
    opacity: 1;
  }

  .newh2 {
    text-align: left;
    padding-left: 16px;
    font-size: 55px;
  }

  .newh2.headline {
    margin-bottom: -8px;
  }

  .newh2.nationwide {
    background-image: linear-gradient(135deg, #005252, #003a5c 50%, #00520c);
  }

  .mesection {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: column;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    position: relative;
  }

  ._50 {
    align-self: center;
    width: 100%;
    margin-left: 16px;
    margin-right: 16px;
  }

  ._50.oldsuperapp {
    margin-left: 0;
    margin-right: 0;
  }

  ._50._800h.right {
    align-self: center;
  }

  ._50.flex, ._50.kohlsfirstpass {
    margin-left: 0;
    margin-right: 0;
  }

  ._50.flexchild {
    width: 100%;
  }

  ._50.aligntop {
    justify-content: space-between;
    margin-left: 0;
    margin-right: 0;
  }

  ._50.screenshot.superfinal {
    align-self: center;
  }

  ._50.intro {
    align-self: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }

  .contactsection {
    flex-flow: column;
  }

  .contactsection.menu {
    border-top: 3px solid #fff;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .contactgroup, .contactgroup.emailgroup {
    justify-content: center;
    align-items: center;
  }

  .iconsmall.email.white {
    filter: invert();
  }

  .iconsmall.white {
    filter: brightness(200%) brightness(200%) saturate(0%);
  }

  .supersummary._768 {
    display: none;
  }

  .supersummary._568 {
    width: 98%;
    display: block;
    left: 1%;
  }

  .projectoutlineflex._50 {
    margin-left: 0;
    margin-right: 0;
  }

  .newportfoliogroup {
    padding-left: 16px;
    padding-right: 16px;
  }

  ._100-image.margintop {
    margin-top: 24px;
  }

  .flexcontent.tabletsidebyside {
    flex-flow: column;
  }

  .iconflexcontent {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
  }

  .code-embed, .code-embed-2 {
    display: none;
  }

  .screencontainerdiv {
    width: 45%;
  }

  .superscreenhero {
    height: 65vw;
  }

  .companylogos {
    grid-column-gap: 16px;
    grid-row-gap: 40px;
    flex-flow: wrap;
    justify-content: space-around;
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
  }

  .companylogos.tablet {
    display: none;
  }

  .companylogo {
    width: 35%;
  }

  .companylogo.super {
    width: 30%;
  }

  .companylogo.possible {
    width: 26%;
  }

  .companylogo.kohls {
    width: 32%;
  }

  .companylogo.nationwide {
    width: 40%;
    min-height: 69px;
  }

  .companylogo.microsoft {
    width: 32%;
  }

  .emaillinkblock, .linkedinlinkblock {
    justify-content: center;
    align-items: center;
  }

  .flexalignright {
    align-self: center;
  }

  .portraitcontainer {
    width: 60%;
    max-width: none;
  }

  .selfportrait {
    width: 100%;
  }

  .flexvertical.rightalign {
    justify-content: flex-start;
    align-self: flex-start;
    align-items: flex-start;
  }

  .flexvertical.rightalign.menu {
    width: 100%;
    display: flex;
  }

  .copylinkedinbtn {
    flex-flow: column;
    justify-content: flex-start;
    align-self: flex-start;
    align-items: flex-start;
  }

  .copylinkedinbtn.menu {
    width: 100%;
    display: flex;
  }

  .flexalignleft {
    align-self: center;
  }

  .menubuttonnav {
    background-color: #f5f5f5;
    border-radius: 100px;
    width: 44px;
    height: 44px;
    padding: 0;
    top: 16px;
    left: 16px;
  }

  .menubuttonnav.w--open {
    background-color: var(--jet);
    border-radius: 0;
    width: 100%;
    height: 80px;
    padding-top: 16px;
    padding-left: 16px;
    top: 0;
    left: 0;
  }

  .icon {
    background-color: var(--jet);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    justify-content: center;
    align-items: center;
    width: 44px;
    height: 44px;
    margin-top: 0;
    margin-left: 0;
    display: flex;
  }

  .icon.shown {
    background-color: var(--white);
  }

  .wave {
    top: 210px;
  }

  .menuutilities {
    width: 100%;
  }

  .menu {
    color: #fff;
  }
}

@media screen and (max-width: 479px) {
  h1 {
    font-size: 3rem;
    line-height: 4rem;
  }

  h2 {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  h3 {
    font-size: 1.75rem;
    line-height: 3rem;
  }

  h4 {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  h5 {
    font-size: 2.5rem;
    line-height: 3.5rem;
  }

  h6 {
    font-size: 1.25rem;
  }

  .button {
    flex: none;
    font-size: 1.2rem;
  }

  .button.primary {
    min-width: 0;
    display: none;
  }

  .button.primary.alternate {
    display: none;
  }

  .button.primary.alternate.contactbutton {
    display: block;
  }

  .button.primary.contactbutton {
    border-color: var(--jet);
    flex: 0 auto;
    align-self: auto;
    display: block;
  }

  .button.secondary {
    min-width: 0;
    display: none;
  }

  .button.secondary.linkedinbutton {
    flex: 1;
    display: block;
  }

  .button.tertiary, .button.accent {
    display: none;
  }

  .button.linkedin {
    box-shadow: 11px 11px 0 0 var(--jet);
  }

  .button.linkedin.reversed {
    box-shadow: 11px 11px 0 0 var(--lightsecondary);
  }

  .button.newoutline {
    font-size: 1rem;
  }

  .space.small {
    max-width: 100vw;
  }

  .space.large.variable {
    height: 2rem;
  }

  .space.xsmall {
    max-width: 100vw;
  }

  .space.break.career {
    flex-direction: column;
    grid-template-rows: auto auto auto;
    grid-template-columns: 1fr 1fr;
    max-width: 100%;
    display: flex;
  }

  .portfoliogrid {
    grid-template-rows: auto auto auto auto auto 32px;
    width: 100%;
    max-width: 100vw;
    margin-left: 0;
    margin-right: 0;
    padding-right: 0;
    display: none;
    overflow: hidden;
  }

  .portfolioblock.flexblock {
    grid-row-gap: 0px;
    grid-template-rows: auto auto auto auto;
    grid-auto-rows: 0;
  }

  .footer {
    max-width: 100vw;
    padding-left: 8px;
    padding-right: 16px;
  }

  .companylist {
    padding-bottom: 5vh;
  }

  .company {
    width: 280px;
    height: 160px;
  }

  .logo, .logo.kohls {
    width: 100%;
  }

  .logo.salesforce {
    width: 70%;
    max-width: 85%;
    height: 100%;
  }

  .large {
    margin-bottom: 16px;
    font-size: 1.25rem;
  }

  .large.white {
    max-width: 80%;
  }

  .contactcontainer {
    max-width: 100vw;
  }

  .hidemobile {
    display: none;
  }

  .cardimage {
    width: 80vw;
    margin-top: -10%;
  }

  .possiblepayments {
    margin-top: 30%;
  }

  .flex.fullwidth.spacebetween.mobilevertical {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-direction: column;
    justify-content: flex-start;
  }

  .flex._100.extrmargintop {
    margin-top: 24px;
  }

  .label.small.white {
    align-self: auto;
  }

  .label.small.white.new, .label.small.white.spacetop, .sitecategory {
    width: 100%;
  }

  .medium.white {
    min-width: 0;
  }

  .html-embed {
    max-width: 0;
    max-height: 0;
  }

  .projectgrid {
    padding-left: .5rem;
    padding-right: 1rem;
  }

  .contracting {
    max-height: none;
    overflow: hidden;
  }

  .link-block {
    min-width: 0;
  }

  .companyrow {
    flex-direction: column;
    align-items: center;
    margin-bottom: 0;
  }

  .mobilelink {
    min-width: 0;
  }

  .flexheader.portfolioheader {
    display: none;
  }

  .buttonblock {
    align-self: stretch;
    width: 100%;
  }

  .copyrights {
    align-self: auto;
  }

  .phonecontainer {
    width: 100%;
  }

  .pheader {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    padding: 64px 16px;
  }

  .variablewidthh1 {
    font-size: 1.8rem;
    line-height: 3rem;
  }

  .variablewidthh1.leftaligned {
    font-size: 1.5rem;
    line-height: 3rem;
  }

  .variablewidthh2 {
    font-size: 1.2rem;
    line-height: 3rem;
  }

  .variablewidthh2.leftaligned {
    font-size: 1rem;
    line-height: 2rem;
  }

  .variablewidthh3 {
    font-size: 1.2rem;
    line-height: 3rem;
  }

  .variablewidthh3.leftaligned {
    font-size: 1rem;
    line-height: 2rem;
  }

  .pdescription {
    padding: 64px 16px 96px;
  }

  .circleimage {
    margin-right: 28px;
  }

  .navlink {
    color: var(--white);
    font-size: 2.5rem;
    line-height: 5rem;
  }

  .navlink.w--current {
    color: var(--white);
    text-decoration: none;
  }

  .menu-button {
    background-color: var(--white);
  }

  .menu-button.w--open {
    background-color: var(--white);
    color: var(--jet);
  }

  .nav-menu {
    background-color: var(--jet);
    height: 80vh;
  }

  .self {
    max-width: 50%;
  }

  .logosmall.kohlslogosmall {
    width: 100%;
    height: 25px;
  }

  .logosmall.nationwidelogosmall {
    width: 100%;
    height: 40px;
  }

  .logosmall.possible, .logosmall.superlogosmall {
    width: 100%;
    height: 25px;
  }

  .leftalign {
    font-size: 1.8rem;
  }

  .gridsection {
    grid-column-gap: 8px;
    grid-row-gap: 24px;
  }

  .gridsection.noheader {
    margin-top: 24px;
  }

  .newportfoliosection {
    grid-row-gap: 16px;
    margin-top: 16px;
    margin-left: 0;
    margin-right: 0;
  }

  .newprojectdiv {
    border-radius: 0;
    padding-left: 8px;
    padding-right: 8px;
  }

  .newprojectdiv.right {
    flex-flow: column;
  }

  .summaryblock.aligntop {
    width: 100%;
    margin-top: 0%;
  }

  .summaryblock.aligntop.right {
    margin-top: 0%;
  }

  .summaryblock.toppadding {
    width: 100%;
    margin-top: 250px;
  }

  .newh3 {
    font-size: 36px;
  }

  .newh3.projecttitle {
    margin-bottom: 0;
  }

  .newh4 {
    font-size: 18px;
  }

  .newp {
    font-size: 16px;
  }

  .newp.large {
    padding-left: 8px;
    padding-right: 8px;
    font-size: 16px;
  }

  .newp.small {
    font-size: 14px;
  }

  .newp.hidden {
    display: none;
  }

  .tag {
    font-size: 14px;
  }

  .kohlssummary.k768 {
    position: relative;
    top: 0%;
  }

  .newbutton {
    width: 100%;
    min-width: 0;
    font-size: 16px;
  }

  .newbutton.resume {
    margin-left: 8px;
    margin-right: 8px;
  }

  .nationwidesummary {
    width: 100%;
    display: none;
    bottom: auto;
  }

  .nationwidesummary.nw992 {
    display: block;
    bottom: 55%;
  }

  .possiblesummary {
    width: 83%;
    display: none;
  }

  .possiblesummary._992 {
    width: 90%;
    display: block;
    bottom: 52%;
  }

  .min-widthbody {
    min-width: 320px;
    overflow: visible;
  }

  .newnav {
    font-size: 18px;
  }

  .newnav.current {
    font-size: 48px;
  }

  .newnav.casestudy {
    background-color: var(--white);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    border-bottom-color: #f5f5f5;
    justify-content: flex-start;
    align-self: auto;
    align-items: center;
    margin-top: 0;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 16px;
  }

  .nav-menu-2.casestudy {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    background-color: var(--jet);
  }

  .nav-menu-2.casestudy.possible {
    background-image: linear-gradient(135deg, #1fde32, #158c2e);
  }

  .nav-menu-2.casestudy.kohls {
    background-image: linear-gradient(135deg, #f39529, #c82531);
  }

  .newresume {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    margin-left: 0;
    margin-right: 0;
  }

  .resumelineitem {
    border-radius: 0;
  }

  .newh2 {
    padding-left: 8px;
    padding-right: 8px;
    font-size: 52px;
  }

  .newh2.headline {
    margin-bottom: 0;
    font-size: 38px;
  }

  .newh2.superheadline {
    background-image: linear-gradient(135deg, #ff009b 25%, #d92191 78%);
  }

  .mesection {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 8px;
    padding-right: 8px;
  }

  ._50 {
    margin-left: 0;
    margin-right: 0;
  }

  ._50._800h {
    width: 90%;
  }

  ._50.screenshot.superfinal {
    width: 80%;
  }

  .contactgroup {
    justify-content: center;
    align-items: center;
  }

  .contactgroup.emailgroup {
    justify-content: flex-start;
    align-items: center;
  }

  .supersummary {
    width: 100%;
    display: block;
    position: relative;
    top: auto;
  }

  .supersummary._568 {
    display: none;
    position: relative;
    top: auto;
  }

  .newportfoliogroup {
    padding-left: 8px;
    padding-right: 8px;
  }

  .newportfoliogroup.stacked, .newportfoliogroup.stacked.lightgrey, .newportfoliogroup.stacked.extraspacebelow {
    padding-bottom: 0;
  }

  .newportfoliogroup.spacedout {
    margin-bottom: 24px;
  }

  ._100-image.margintop {
    margin-top: 0;
  }

  .possiblegradientalt {
    background-image: linear-gradient(135deg, #1fde32, #158c2e);
  }

  .code-embed {
    display: none;
  }

  .kohlshighlightb {
    background-image: linear-gradient(135deg, #f39529, #c82531);
  }

  .screengroup.scaled80.offsettop {
    margin-top: -23%;
  }

  .moreinfo-casestudy {
    display: none;
  }

  .moreinfo-casestudy.alignleft {
    align-self: stretch;
    display: none;
  }

  .superscreenhero {
    height: 60vw;
  }

  .linkedinlinkblock.white {
    justify-content: flex-start;
    align-items: center;
    padding-left: 16px;
  }

  .flexaligncenter {
    align-self: flex-start;
  }

  .portraitcontainer {
    width: 100%;
  }

  .flexvertical.rightalign.menu {
    padding-left: 16px;
  }

  .copylinkedinbtn.menu {
    padding-left: 0;
  }

  .flexalignleft {
    align-self: flex-start;
  }

  .wave {
    opacity: 0;
    top: 60px;
  }

  .menu {
    min-width: 0;
  }
}

#w-node-_61d3617d-cd2e-41c4-5df3-4a1c83c08b10-5a26d864, #w-node-_3d2b8fa7-1ef1-f654-65e9-caacf8e579c6-5a26d864, #w-node-_29ae1dfd-b8b4-3358-b47c-3252f08628af-5a26d864, #w-node-_68026420-7514-1ea6-7423-8b2df2e2b2a1-5a26d864, #w-node-f2ad35ad-c660-80aa-1ed7-0a4e045705a8-5a26d864, #w-node-_5746d683-8166-9968-cde3-7c9240b6e7ab-5a26d864, #w-node-_34bb3315-d6b9-6afc-7fae-3a7f1ca91e3b-5a26d864, #w-node-c803df46-15ab-5d2e-eecd-54ea6ccea874-5a26d864, #w-node-_3cc1d87f-366a-3766-fc6f-bc574214bcd1-5a26d864, #w-node-_3bd84663-eec8-492e-2a94-613214898e2e-5a26d864, #w-node-becdbbe0-abc6-1ab6-cbae-fce39198f787-5a26d864, #w-node-cd07fd23-7856-5ead-328f-c54a1af737b0-5a26d864, #w-node-_463c4a11-3d34-9c09-512e-0590b00decc8-5a26d864 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_3f06043f-6396-06df-fb0c-188d91416ef6-571ba942, #w-node-_5053456e-2ba5-ed47-33bb-0a7aa9dd9209-571ba942, #w-node-_46c3d8f2-699d-2439-d27a-8a295aa44dac-571ba942, #w-node-ca63d961-8afc-a690-79d9-c3d3dac37f3a-571ba942 {
  grid-area: projectOutlineHeader;
}

#w-node-_32a2414f-fecf-3708-4ae2-b9728aa6278d-571ba942 {
  grid-area: Large-project;
}

#w-node-_32a2414f-fecf-3708-4ae2-b9728aa627a3-571ba942 {
  grid-area: Small-project-left;
}

#w-node-_32a2414f-fecf-3708-4ae2-b9728aa627b7-571ba942 {
  grid-area: Small-project-right;
}

#w-node-_32a2414f-fecf-3708-4ae2-b9728aa627cb-571ba942 {
  grid-area: Large-project-highlight;
  justify-self: auto;
}

#w-node-a2e9e731-b74e-1dcb-1fc7-8e543a9a30a5-3a9a3076 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  justify-self: stretch;
}

#w-node-a2e9e731-b74e-1dcb-1fc7-8e543a9a30a6-3a9a3076 {
  grid-area: 6 / 1 / 7 / 2;
  align-self: center;
}

#w-node-a2e9e731-b74e-1dcb-1fc7-8e543a9a30aa-3a9a3076 {
  grid-area: 6 / 2 / 7 / 3;
  place-self: center end;
}

#w-node-e23e0d21-8857-2926-fd44-94288f93ab4a-874d2fb5 {
  grid-area: projectOutlineHeader;
}

#w-node-b76d5bd5-ece2-2561-20a7-673b54c38a7a-874d2fb5 {
  grid-area: span 1 / span 6 / span 1 / span 6;
  justify-self: start;
}

#w-node-_81c4815b-0c10-6c43-0217-a3d1b20e20fc-874d2fb5, #w-node-b207fdce-cb9b-6f0f-2d5d-03664916cb56-874d2fb5, #w-node-_77e9ed5a-7cdc-85bf-3ff1-f5b709ad1af0-874d2fb5, #w-node-d698f764-587e-547b-f561-c23702523ff8-874d2fb5 {
  grid-area: projectOutlineHeader;
}

#w-node-a6cdcf3c-47aa-ec67-d3e2-9d663754ca76-874d2fb5 {
  grid-area: Large-project;
}

#w-node-a6cdcf3c-47aa-ec67-d3e2-9d663754ca8c-874d2fb5 {
  grid-area: Small-project-left;
}

#w-node-a6cdcf3c-47aa-ec67-d3e2-9d663754caa0-874d2fb5 {
  grid-area: Small-project-right;
}

#w-node-a6cdcf3c-47aa-ec67-d3e2-9d663754cab4-874d2fb5 {
  grid-area: Large-project-highlight;
  justify-self: auto;
}

#w-node-_1c7ed550-c9a0-d0c8-5832-f41685a4faea-85a4fae9 {
  grid-area: span 1 / span 12 / span 1 / span 12;
  place-self: stretch stretch;
}

#w-node-c8328339-33c2-d132-f78f-954232d70d68-a4089fcf, #w-node-_0c4d27db-aa6c-0360-af6b-ef478a78f3f1-a4089fcf, #w-node-b970ed55-afa9-b363-8dc8-ba598e965631-a4089fcf, #w-node-_8656f22a-2832-e644-970f-9cae65e33421-a4089fcf, #w-node-c0c08abd-6339-195b-eea0-8436fd129210-a4089fcf, #w-node-ea0fe0f2-e0b3-e1b9-d455-7e8a10ac363a-a4089fcf, #w-node-f4b96fc8-1ab5-0726-a9bc-8063485876e1-a4089fcf, #w-node-_5065102c-bf9c-f822-4ef6-a8d5bd7941b8-a4089fcf, #w-node-_608e1408-e1d1-dd2d-466e-e7b3079623a7-a4089fcf, #w-node-f952e5d1-702e-b44c-19f1-49b0b7d82a8b-a4089fcf, #w-node-_41a3f591-e0ad-cfaf-8724-0c799c6b3df7-a4089fcf {
  grid-area: projectOutlineHeader;
}

#w-node-b4067bda-9ae4-d7b5-0cd2-d503355c2be4-a4089fcf {
  grid-area: Large-project;
}

#w-node-b4067bda-9ae4-d7b5-0cd2-d503355c2bfa-a4089fcf {
  grid-area: Small-project-left;
}

#w-node-b4067bda-9ae4-d7b5-0cd2-d503355c2c0e-a4089fcf {
  grid-area: Small-project-right;
}

#w-node-b4067bda-9ae4-d7b5-0cd2-d503355c2c22-a4089fcf {
  grid-area: Large-project-highlight;
  justify-self: auto;
}

#w-node-_6ead30c6-2e0f-7b83-5d16-4737245739b2-1241d370, #w-node-_63adedf5-8016-f0d7-d7a1-050dbf5356cc-1241d370, #w-node-d82176b6-0b6e-fa2c-b430-9f5ed8820a7f-1241d370, #w-node-df92bc60-c2f5-55e1-d64e-fc532c34093b-1241d370, #w-node-eab1094a-df9b-de1a-70e6-8c8203df9f3a-1241d370, #w-node-eb79d576-9762-189b-8c19-c9b2b1f7045b-1241d370, #w-node-e7a94f9a-c2c8-1bd6-edc6-2eaf185a5789-1241d370, #w-node-cd7c25e3-643b-7f7d-b602-cbdf24e6894c-1241d370, #w-node-_1b49a05e-8317-91e8-d75e-291b46f9c43c-1241d370, #w-node-_7b2480a3-2a08-8d5b-894f-1693caf11f1a-1241d370, #w-node-_4b57a2e2-fb24-292d-e210-867c152306fe-1241d370, #w-node-_00266bc2-b7a7-2306-f967-617a2443e660-1241d370 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_00cedf73-ca7c-2347-2c52-8e88d98a17f6-1241d370, #w-node-_833f7333-8229-12ab-0fce-55f2c6301c4f-1241d370, #w-node-ca6074a2-c6d7-2f0e-ec85-22053422c886-1241d370 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-_4352a549-ecda-45cc-4a83-9db86bc37ab7-1241d370, #w-node-_4a447eb6-7ca4-6126-d427-38a8e5ac8cab-1241d370, #w-node-_945c9068-759a-b714-aed7-150f6a39892b-1241d370, #w-node-_945c9068-759a-b714-aed7-150f6a398931-1241d370, #w-node-_40613004-deec-94c5-5b1f-bf593fd4d113-1241d370, #w-node-_40613004-deec-94c5-5b1f-bf593fd4d119-1241d370, #w-node-db4e8cce-c45d-5aa9-f1b1-8ffbc583f07f-1241d370, #w-node-db4e8cce-c45d-5aa9-f1b1-8ffbc583f079-1241d370, #w-node-_97fba44e-cd86-e705-e2f9-2808a8a1a1b5-1241d370, #w-node-_97fba44e-cd86-e705-e2f9-2808a8a1a1bb-1241d370 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-e66740cf-02f2-be26-1894-c338f17107eb-1241d370, #w-node-e66740cf-02f2-be26-1894-c338f17107ed-1241d370, #w-node-_1a49a946-f8c6-0bc4-8296-2a9ae9ed6c0c-1241d370, #w-node-_83a9f016-f396-cfc3-253e-90f96b3522f3-1241d370, #w-node-_83a9f016-f396-cfc3-253e-90f96b3522fb-1241d370, #w-node-_83a9f016-f396-cfc3-253e-90f96b352303-1241d370 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-_83a9f016-f396-cfc3-253e-90f96b35230f-1241d370, #w-node-_83a9f016-f396-cfc3-253e-90f96b352315-1241d370 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad98d-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad98e-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad98f-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad990-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad991-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad992-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad993-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad994-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad995-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad996-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad997-1241d370, #w-node-bca18f39-e6a4-d8dd-b52b-fb3df36ad998-1241d370 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_8b9d3d1d-cce4-ec5b-fa32-88487aad8bee-e762e40c {
  grid-area: Large-project;
}

#w-node-_33f9edda-d765-a62a-6f9e-ab6fa24c71f4-e762e40c {
  grid-area: Small-project-left;
}

#w-node-c9db83b3-2306-f944-e834-b3cb2521c0d4-e762e40c {
  grid-area: Small-project-right;
}

#w-node-_2e2bac9b-2277-2db3-a1b2-4af4e65a5e6f-e762e40c {
  grid-area: Large-project-highlight;
  justify-self: auto;
}

#w-node-_506fa7cc-89fd-60e8-350c-6c8aeb79ffca-ae0c7ff3, #w-node-_473a7275-68c5-aadb-49aa-82c024a7a846-ae0c7ff3, #w-node-aa27a590-aea4-be05-bfda-54d8e51261ef-ae0c7ff3, #w-node-_84251bdc-3d06-2935-24e4-c6737dd211df-ae0c7ff3, #w-node-_7121318e-5d9d-b4c8-5aed-8230d6c67c63-ae0c7ff3, #w-node-e4370c1f-2f99-50d0-4099-4f5d8da5bf15-ae0c7ff3, #w-node-_347677a4-906c-def7-b416-2bd3d80e63b9-ae0c7ff3, #w-node-_15f2a3d9-6ab2-83c4-b897-773235d9a589-ae0c7ff3, #w-node-_5f39879a-c62a-5a76-6a75-7c80e12f1c36-ae0c7ff3, #w-node-_62c19d85-4bda-2a7d-f740-8333a6eee356-ae0c7ff3 {
  grid-area: projectOutlineHeader;
}

#w-node-_6174fdae-04eb-bdd7-4f6f-9a61fbf79b25-ae0c7ff3 {
  grid-area: Large-project;
}

#w-node-_6174fdae-04eb-bdd7-4f6f-9a61fbf79b3b-ae0c7ff3 {
  grid-area: Small-project-left;
}

#w-node-_6174fdae-04eb-bdd7-4f6f-9a61fbf79b4f-ae0c7ff3 {
  grid-area: Small-project-right;
}

#w-node-_6174fdae-04eb-bdd7-4f6f-9a61fbf79b63-ae0c7ff3 {
  grid-area: Large-project-highlight;
  justify-self: auto;
}

#w-node-_3e3637ed-84fc-50ad-9ba7-433860a68c9b-e5c91451 {
  grid-area: 1 / 2 / 2 / 10;
}

#w-node-_10d4b2b2-904a-df06-ed0f-5e83a61797e6-e5c91451 {
  grid-area: 1 / 2 / 2 / 6;
}

#w-node-_5b7be1e6-d49f-bb3b-26e3-f7b73a37833a-e5c91451 {
  grid-area: 2 / 2 / 3 / 11;
}

#w-node-_01aece0f-6dee-9691-b3c4-671f1d4a01c6-e5c91451 {
  grid-area: 2 / 2 / 2 / 10;
  justify-self: start;
}

@media screen and (min-width: 1440px) {
  #w-node-_3f06043f-6396-06df-fb0c-188d91416ef6-571ba942 {
    grid-area: 1 / 2 / 2 / 4;
  }

  #w-node-_3f06043f-6396-06df-fb0c-188d91416ef8-571ba942 {
    grid-area: 2 / 2 / 3 / 3;
  }

  #w-node-_3f06043f-6396-06df-fb0c-188d91416efe-571ba942 {
    grid-area: 2 / 3 / 3 / 4;
  }

  #w-node-_3f06043f-6396-06df-fb0c-188d91416f03-571ba942 {
    grid-area: 3 / 2 / 4 / 3;
  }

  #w-node-_3f06043f-6396-06df-fb0c-188d91416f14-571ba942 {
    grid-area: 3 / 3 / 4 / 4;
  }

  #w-node-_3f06043f-6396-06df-fb0c-188d91416f19-571ba942 {
    grid-area: 4 / 2 / 5 / 3;
  }

  #w-node-_3f06043f-6396-06df-fb0c-188d91416f1f-571ba942 {
    grid-area: 4 / 3 / 5 / 4;
  }

  #w-node-_32a2414f-fecf-3708-4ae2-b9728aa627cb-571ba942 {
    grid-area: Large-project-highlight;
    justify-self: auto;
  }

  #w-node-e23e0d21-8857-2926-fd44-94288f93ab4a-874d2fb5 {
    grid-area: 1 / 2 / 2 / 4;
  }

  #w-node-e1501a4c-2b36-b60b-e6da-e68552f888e8-874d2fb5 {
    grid-area: 2 / 2 / 3 / 3;
  }

  #w-node-e23e0d21-8857-2926-fd44-94288f93ab51-874d2fb5 {
    grid-area: 2 / 3 / 3 / 4;
  }

  #w-node-ae851380-f948-9328-a485-619ba3c4c320-874d2fb5 {
    grid-area: 3 / 2 / 4 / 3;
  }

  #w-node-e23e0d21-8857-2926-fd44-94288f93ab69-874d2fb5 {
    grid-area: 3 / 3 / 4 / 4;
  }

  #w-node-c2d2c07f-07a2-b705-696c-ce29f2f56db3-874d2fb5 {
    grid-area: 4 / 2 / 5 / 3;
  }

  #w-node-e23e0d21-8857-2926-fd44-94288f93ab73-874d2fb5 {
    grid-area: 4 / 3 / 5 / 4;
  }

  #w-node-a6cdcf3c-47aa-ec67-d3e2-9d663754cab4-874d2fb5 {
    grid-area: Large-project-highlight;
    justify-self: auto;
  }

  #w-node-c8328339-33c2-d132-f78f-954232d70d68-a4089fcf {
    grid-area: 1 / 2 / 2 / 4;
  }

  #w-node-c8328339-33c2-d132-f78f-954232d70d6a-a4089fcf {
    grid-area: 2 / 2 / 3 / 3;
  }

  #w-node-c8328339-33c2-d132-f78f-954232d70d70-a4089fcf {
    grid-area: 2 / 3 / 3 / 4;
  }

  #w-node-c8328339-33c2-d132-f78f-954232d70d75-a4089fcf {
    grid-area: 3 / 2 / 4 / 3;
  }

  #w-node-c8328339-33c2-d132-f78f-954232d70d86-a4089fcf {
    grid-area: 3 / 3 / 4 / 4;
  }

  #w-node-c8328339-33c2-d132-f78f-954232d70d8b-a4089fcf {
    grid-area: 4 / 2 / 5 / 3;
  }

  #w-node-c8328339-33c2-d132-f78f-954232d70d91-a4089fcf {
    grid-area: 4 / 3 / 5 / 4;
  }

  #w-node-b4067bda-9ae4-d7b5-0cd2-d503355c2c22-a4089fcf, #w-node-_2e2bac9b-2277-2db3-a1b2-4af4e65a5e6f-e762e40c, #w-node-_6174fdae-04eb-bdd7-4f6f-9a61fbf79b63-ae0c7ff3 {
    grid-area: Large-project-highlight;
    justify-self: auto;
  }
}

@media screen and (min-width: 1280px) {
  #w-node-_32a2414f-fecf-3708-4ae2-b9728aa6278d-571ba942 {
    grid-area: Large-project;
  }

  #w-node-_32a2414f-fecf-3708-4ae2-b9728aa627cb-571ba942 {
    grid-area: Large-project-highlight;
  }

  #w-node-a6cdcf3c-47aa-ec67-d3e2-9d663754ca76-874d2fb5 {
    grid-area: Large-project;
  }

  #w-node-a6cdcf3c-47aa-ec67-d3e2-9d663754cab4-874d2fb5 {
    grid-area: Large-project-highlight;
  }

  #w-node-b4067bda-9ae4-d7b5-0cd2-d503355c2be4-a4089fcf {
    grid-area: Large-project;
  }

  #w-node-b4067bda-9ae4-d7b5-0cd2-d503355c2c22-a4089fcf {
    grid-area: Large-project-highlight;
  }

  #w-node-_8b9d3d1d-cce4-ec5b-fa32-88487aad8bee-e762e40c {
    grid-area: Large-project;
  }

  #w-node-_2e2bac9b-2277-2db3-a1b2-4af4e65a5e6f-e762e40c {
    grid-area: Large-project-highlight;
  }

  #w-node-_6174fdae-04eb-bdd7-4f6f-9a61fbf79b25-ae0c7ff3 {
    grid-area: Large-project;
  }

  #w-node-_6174fdae-04eb-bdd7-4f6f-9a61fbf79b63-ae0c7ff3 {
    grid-area: Large-project-highlight;
  }
}

@media screen and (max-width: 991px) {
  #w-node-_32a2414f-fecf-3708-4ae2-b9728aa627cb-571ba942 {
    grid-area: Large-project-Highlight;
  }

  #w-node-a2e9e731-b74e-1dcb-1fc7-8e543a9a30a6-3a9a3076 {
    grid-area: 7 / 1 / 8 / 2;
    align-self: center;
  }

  #w-node-a2e9e731-b74e-1dcb-1fc7-8e543a9a30aa-3a9a3076 {
    grid-area: 7 / 2 / 8 / 3;
    place-self: center end;
  }

  #w-node-b76d5bd5-ece2-2561-20a7-673b54c38a7a-874d2fb5 {
    grid-column: span 8 / span 8;
    justify-self: center;
  }

  #w-node-a6cdcf3c-47aa-ec67-d3e2-9d663754cab4-874d2fb5, #w-node-b4067bda-9ae4-d7b5-0cd2-d503355c2c22-a4089fcf {
    grid-area: Large-project-Highlight;
  }

  #w-node-_4ea57058-6a1f-6666-3ea9-cdf38e16deca-1241d370, #w-node-_7eba50fb-1362-5a96-fb15-d871d20990bd-1241d370 {
    grid-area: span 1 / span 12 / span 1 / span 12;
  }

  #w-node-_4352a549-ecda-45cc-4a83-9db86bc37ab7-1241d370, #w-node-_4a447eb6-7ca4-6126-d427-38a8e5ac8cab-1241d370, #w-node-_945c9068-759a-b714-aed7-150f6a39892b-1241d370, #w-node-_945c9068-759a-b714-aed7-150f6a398931-1241d370, #w-node-_40613004-deec-94c5-5b1f-bf593fd4d113-1241d370, #w-node-_40613004-deec-94c5-5b1f-bf593fd4d119-1241d370 {
    grid-column: span 4 / span 4;
  }

  #w-node-ddccaf58-d132-b218-5f23-849d2c618396-1241d370 {
    grid-area: span 1 / span 12 / span 1 / span 12;
  }

  #w-node-db4e8cce-c45d-5aa9-f1b1-8ffbc583f07f-1241d370, #w-node-db4e8cce-c45d-5aa9-f1b1-8ffbc583f079-1241d370, #w-node-_97fba44e-cd86-e705-e2f9-2808a8a1a1b5-1241d370, #w-node-_97fba44e-cd86-e705-e2f9-2808a8a1a1bb-1241d370 {
    grid-column: span 4 / span 4;
  }

  #w-node-_12433e62-e596-48d4-2066-1421dac36df8-1241d370, #w-node-_83a9f016-f396-cfc3-253e-90f96b3522f0-1241d370, #w-node-_83a9f016-f396-cfc3-253e-90f96b35230c-1241d370 {
    grid-area: span 1 / span 12 / span 1 / span 12;
  }

  #w-node-_83a9f016-f396-cfc3-253e-90f96b35230f-1241d370, #w-node-_83a9f016-f396-cfc3-253e-90f96b352315-1241d370 {
    grid-column: span 4 / span 4;
  }

  #w-node-_2e2bac9b-2277-2db3-a1b2-4af4e65a5e6f-e762e40c, #w-node-_6174fdae-04eb-bdd7-4f6f-9a61fbf79b63-ae0c7ff3 {
    grid-area: Large-project-Highlight;
  }
}

@media screen and (max-width: 767px) {
  #w-node-a2e9e731-b74e-1dcb-1fc7-8e543a9a30a6-3a9a3076 {
    grid-area: 8 / 1 / 9 / 3;
    align-self: center;
  }

  #w-node-a2e9e731-b74e-1dcb-1fc7-8e543a9a30aa-3a9a3076 {
    grid-area: 9 / 1 / 10 / 3;
    place-self: center start;
  }
}


@font-face {
  font-family: 'Font awesome 5 brands 400';
  src: url('../fonts/Font-Awesome-5-Brands-Regular-400.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Font awesome 5 pro solid 900';
  src: url('../fonts/Font-Awesome-5-Pro-Solid-900.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Font awesome 5 pro 400';
  src: url('../fonts/Font-Awesome-5-Pro-Regular-400.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Font awesome 5 pro 300';
  src: url('../fonts/Font-Awesome-5-Pro-Light-300.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Font awesome 5 duotone solid 900';
  src: url('../fonts/Font-Awesome-5-Duotone-Solid-900.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}