/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
/* line 5, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

/* line 22, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html {
  line-height: 1;
}

/* line 24, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
ol, ul {
  list-style: none;
}

/* line 26, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* line 28, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

/* line 30, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q, blockquote {
  quotes: none;
}
/* line 103, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q:before, q:after, blockquote:before, blockquote:after {
  content: "";
  content: none;
}

/* line 32, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
a img {
  border: none;
}

/* line 116, ../../../../../Applications/compass.app/Contents/Resources/lib/ruby/compass_1.0/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block;
}

/* line 26, ../sass/_base.scss */
html {
  scroll-behavior: smooth;
}

/* line 30, ../sass/_base.scss */
body {
  background-color: white;
}

/* line 34, ../sass/_base.scss */
.header a {
  font-family: "Chivo", sans-serif;
  color: black;
  font-weight: 400;
  text-decoration: none;
  transition: 0.3s;
}

/* line 42, ../sass/_base.scss */
.header a:hover {
  color: #2637dd;
}

/* line 46, ../sass/_base.scss */
.siteMission h1 {
  font-family: "Space Mono", monospace;
  font-weight: 400;
  font-size: 36px;
  color: black;
  line-height: 1.3;
  padding-bottom: 30px;
}

@media only screen and (max-width: 48em) {
  /* line 56, ../sass/_base.scss */
  .siteMission h1 {
    font-size: 24px;
    line-height: 1.5;
    padding-bottom: 20px;
  }
}
/* line 63, ../sass/_base.scss */
.siteMission b {
  font-weight: 700;
}

/* line 67, ../sass/_base.scss */
.siteMission h2 {
  font-family: "Chivo", sans-serif;
  font-size: 28px;
  color: black;
  line-height: 1.8;
  padding-bottom: 30px;
  font-weight: 300;
}

@media only screen and (max-width: 48em) {
  /* line 77, ../sass/_base.scss */
  .siteMission h2 {
    font-size: 24px;
    padding-bottom: 20px;
  }
}

/* new code added 1.13.26 */
.siteMission h4 {
  font-family: "Chivo", sans-serif;
  font-size: 22px;
  color: black;
  line-height: 1.8;
  padding-bottom: 30px;
  font-weight: 300;
}

@media only screen and (max-width: 48em) {
  .siteMission h4 {
    font-size: 20px;
    padding-bottom: 20px;
  }
}

/* line 83, ../sass/_base.scss */
.siteMission a {
  color: black;
  text-decoration: none;
  transition: 0.3s;
}

/* line 89, ../sass/_base.scss */
.siteMission a:hover {
  color: #2637dd;
}

/* line 93, ../sass/_base.scss */
.workHeroText h1 {
  font-family: "Chivo", sans-serif;
  font-size: 36px;
  color: white;
  line-height: 1.3;
}

@media (max-width: 768px) {
  /* line 101, ../sass/_base.scss */
  .workHeroText h1 {
    font-size: 21px;
  }
}
/* line 106, ../sass/_base.scss */
.workHeroText b {
  font-weight: 700;
}

/* line 110, ../sass/_base.scss */
.workHeroText p {
  font-family: "Space Mono", monospace;
  font-size: 1rem;
  color: white;
  padding-top: 20px;
}

/* line 117, ../sass/_base.scss */
.aboutHeroText h1 {
  font-family: "Chivo", sans-serif;
  font-size: 36px;
  color: white;
  line-height: 1.3;
}

@media screen and (max-width: 48em) {
  /* line 125, ../sass/_base.scss */
  .aboutHeroText h1 {
    display: none;
  }
}
/* line 130, ../sass/_base.scss */
.aboutHeroText b {
  font-weight: 700;
}

/* line 134, ../sass/_base.scss */
.portThumb h5 {
  font-family: "Chivo", sans-serif;
  font-size: 1rem;
}

@media only screen and (max-width: 48em) {
  /* line 140, ../sass/_base.scss */
  .portThumb h5 {
    font-size: 1.25rem;
  }
}
/* line 145, ../sass/_base.scss */
.portCaption {
  font-family: "Space Mono", monospace;
  color: black;
  line-height: normal;
  font-size: 14px;
}

@media only screen and (max-width: 48em) {
  /* line 153, ../sass/_base.scss */
  .portCaption {
    font-size: 12px;
  }
}
/* line 158, ../sass/_base.scss */
.bottomCaption {
  margin-bottom: 70px !important;
}

/* line 162, ../sass/_base.scss */
.siteFooter {
  background-color: #dddddd;
  font-family: "Space Mono", monospace;
}

/* line 167, ../sass/_base.scss */
.siteFooter h4 {
  font-weight: 700;
  padding-bottom: 15px;
  color: #2637dd;
  font-size: 1rem;
}

/* line 174, ../sass/_base.scss */
.siteFooter p {
  padding-top: .5rem;
  color: black;
  font-size: 1rem;
}

/* line 180, ../sass/_base.scss */
.siteFooter a {
  color: black;
  text-decoration: none;
}

/* line 185, ../sass/_base.scss */
.siteFooter svg {
  fill: black;
}

@media screen and (max-device-width: 768px) {
  /* line 190, ../sass/_base.scss */
  .siteFooter svg {
    display: none;
  }
}
/*-----------------------------
 * TOP HEADER NAV
/*-----------------------------*/
/* line 9, ../sass/_layout.scss */
.header {
  background-color: #fff;
  box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.1);
  width: 100%;
  z-index: 500;
  padding-top: 10px;
}

/* line 17, ../sass/_layout.scss */
.header ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
  background-color: #fff;
}

/* line 25, ../sass/_layout.scss */
.header li a {
  display: block;
  padding: 20px 20px;
  text-decoration: none;
}

/* line 31, ../sass/_layout.scss */
.header .logo {
  display: block;
  float: left;
  font-size: 2em;
  padding: 10px 20px;
  text-decoration: none;
}

/* menu */
/* line 41, ../sass/_layout.scss */
.header .menu {
  clear: both;
  max-height: 0;
  transition: max-height .2s ease-out;
}

/* menu icon */
/* line 49, ../sass/_layout.scss */
.header .menu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  padding: 35px 20px;
  position: relative;
  user-select: none;
}

/* line 58, ../sass/_layout.scss */
.header .menu-icon .navicon {
  background: #333;
  display: block;
  height: 2px;
  position: relative;
  transition: background .2s ease-out;
  width: 18px;
}

/* line 67, ../sass/_layout.scss */
.header .menu-icon .navicon:before,
.header .menu-icon .navicon:after {
  background: #333;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}

/* line 78, ../sass/_layout.scss */
.header .menu-icon .navicon:before {
  top: 5px;
}

/* line 82, ../sass/_layout.scss */
.header .menu-icon .navicon:after {
  top: -5px;
}

/* menu btn */
/* line 88, ../sass/_layout.scss */
.header .menu-btn {
  display: none;
}

/* line 92, ../sass/_layout.scss */
.header .menu-btn:checked ~ .menu {
  max-height: 240px;
}

/* line 96, ../sass/_layout.scss */
.header .menu-btn:checked ~ .menu-icon .navicon {
  background: transparent;
}

/* line 100, ../sass/_layout.scss */
.header .menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

/* line 104, ../sass/_layout.scss */
.header .menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}

/* line 108, ../sass/_layout.scss */
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  top: 0;
}

/* 48em = 768px */
@media (min-width: 48em) {
  /* line 116, ../sass/_layout.scss */
  .header {
    display: flex;
    align-items: center;
    box-shadow: none;
    padding-left: 3vw;
  }

  /* line 123, ../sass/_layout.scss */
  .header li {
    float: left;
  }

  /* line 127, ../sass/_layout.scss */
  .header li a {
    padding: 20px 30px;
  }

  /* line 131, ../sass/_layout.scss */
  .header .menu {
    clear: none;
    float: right;
    max-height: none;
  }

  /* line 137, ../sass/_layout.scss */
  .header .menu-icon {
    display: none;
  }
}
/*-----------------------------
 * FEATURE TEXT
/*-----------------------------*/
/* line 146, ../sass/_layout.scss */
.siteMission {
  margin-top: 20px;
  margin-bottom: 20px;
  padding-top: 10px;
  padding-left: 5vw;
  padding-right: 5vw;
}

@media (min-width: 48em) {
  /* line 155, ../sass/_layout.scss */
  .siteMission {
    margin-top: 40px;
    margin-bottom: 40px;
  }
}
/* line 161, ../sass/_layout.scss */
.siteMission h1, h2, h4 {
  max-width: 900px;
  padding-right: 20px;
}

/*-----------------------------
 * HERO IMAGES
/*-----------------------------*/
/* line 170, ../sass/_layout.scss */
.siteHero {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 35vw;
  display: flex;
  align-items: center;
  position: relative;
}

@media (min-width: 768px) and (max-width: 1028px) {
  /* line 181, ../sass/_layout.scss */
  .siteHero {
    height: 40vw;
  }
}
@media (max-width: 767px) {
  /* line 187, ../sass/_layout.scss */
  .siteHero {
    height: 45vw;
  }
}
/* line 192, ../sass/_layout.scss */
.workHeroImg {
  width: 100%;
  height: inherit;
  overflow: hidden;
}

/* line 198, ../sass/_layout.scss */
.imgOverlay {
  position: relative;
}

/* line 202, ../sass/_layout.scss */
.imgOverlay::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(66, 66, 77, 0.3);
  mix-blend-mode: multiply;
  transition: 0.4s;
}

/* line 215, ../sass/_layout.scss */
.imgOverlay:hover::before {
  background-color: rgba(38, 55, 221, 0.9);
  mix-blend-mode: multiply;
  pointer-events: none;
}

/* line 221, ../sass/_layout.scss */
.workHeroImg img {
  width: 100%;
  height: auto;
}

/* line 226, ../sass/_layout.scss */
.workHeroText {
  padding-left: 5vw;
  padding-right: 5vw;
  position: absolute;
}

/* line 232, ../sass/_layout.scss */
.aboutHeroText {
  padding-left: 5vw;
  padding-right: 5vw;
  position: absolute;
}

/*-----------------------------
 * WORK SECTION
/*-----------------------------*/
/* line 242, ../sass/_layout.scss */
.portGrid {
  display: grid;
  grid-template-columns: 5vw auto 30px auto 30px auto 5vw;
  grid-template-rows: 90px auto 30px auto 30px auto 50px;
}

/* line 248, ../sass/_layout.scss */
.pt1 {
  grid-column-start: 2;
  grid-row-start: 2;
}

/* line 253, ../sass/_layout.scss */
.pt2 {
  grid-column-start: 4;
  grid-row-start: 2;
}

/* line 258, ../sass/_layout.scss */
.pt3 {
  grid-column-start: 6;
  grid-row-start: 2;
}

/* line 263, ../sass/_layout.scss */
.pt4 {
  grid-column-start: 2;
  grid-row-start: 4;
}

/* line 268, ../sass/_layout.scss */
.pt5 {
  grid-column-start: 4;
  grid-row-start: 4;
}

/* line 273, ../sass/_layout.scss */
.pt6 {
  grid-column-start: 6;
  grid-row-start: 4;
}

/* line 278, ../sass/_layout.scss */
.pt7 {
  grid-column-start: 2;
  grid-row-start: 6;
}

/* line 283, ../sass/_layout.scss */
.pt8 {
  grid-column-start: 4;
  grid-row-start: 6;
}

/* line 288, ../sass/_layout.scss */
.pt9 {
  grid-column-start: 6;
  grid-row-start: 6;
}

@media only screen and (max-width: 767px) {
  /* line 294, ../sass/_layout.scss */
  .portGrid {
    grid-template-columns: 5vw auto 5vw;
    grid-template-rows: 90px auto 60px auto 60px auto 60px auto 60px auto 60px auto 60px auto 60px auto 60px auto 60px;
  }

  /* line 299, ../sass/_layout.scss */
  .pt1 {
    grid-column-start: 2;
    grid-row-start: 2;
  }

  /* line 304, ../sass/_layout.scss */
  .pt2 {
    grid-column-start: 2;
    grid-row-start: 4;
  }

  /* line 309, ../sass/_layout.scss */
  .pt3 {
    grid-column-start: 2;
    grid-row-start: 6;
  }

  /* line 314, ../sass/_layout.scss */
  .pt4 {
    grid-column-start: 2;
    grid-row-start: 8;
  }

  /* line 319, ../sass/_layout.scss */
  .pt5 {
    grid-column-start: 2;
    grid-row-start: 10;
  }

  /* line 324, ../sass/_layout.scss */
  .pt6 {
    grid-column-start: 2;
    grid-row-start: 12;
  }

  /* line 329, ../sass/_layout.scss */
  .pt7 {
    grid-column-start: 2;
    grid-row-start: 14;
  }

  /* line 334, ../sass/_layout.scss */
  .pt8 {
    grid-column-start: 2;
    grid-row-start: 16;
  }

  /* line 339, ../sass/_layout.scss */
  .pt9 {
    grid-column-start: 2;
    grid-row-start: 18;
  }
}
@media only screen and (max-width: 48em) {
  /* line 346, ../sass/_layout.scss */
  .portGrid {
    grid-template-columns: 5vw auto 5vw;
    grid-template-rows: 90px auto 60px auto 60px auto 60px auto 60px auto 60px auto 60px auto 60px auto 60px auto 60px;
  }

  /* line 351, ../sass/_layout.scss */
  .pt1 {
    grid-column-start: 2;
    grid-row-start: 2;
  }

  /* line 356, ../sass/_layout.scss */
  .pt2 {
    grid-column-start: 2;
    grid-row-start: 4;
  }

  /* line 361, ../sass/_layout.scss */
  .pt3 {
    grid-column-start: 2;
    grid-row-start: 6;
  }

  /* line 366, ../sass/_layout.scss */
  .pt4 {
    grid-column-start: 2;
    grid-row-start: 8;
  }

  /* line 371, ../sass/_layout.scss */
  .pt5 {
    grid-column-start: 2;
    grid-row-start: 10;
  }

  /* line 376, ../sass/_layout.scss */
  .pt6 {
    grid-column-start: 2;
    grid-row-start: 12;
  }

  /* line 381, ../sass/_layout.scss */
  .pt7 {
    grid-column-start: 2;
    grid-row-start: 14;
  }

  /* line 386, ../sass/_layout.scss */
  .pt8 {
    grid-column-start: 2;
    grid-row-start: 16;
  }

  /* line 391, ../sass/_layout.scss */
  .pt9 {
    grid-column-start: 2;
    grid-row-start: 18;
  }
}
@media only screen and (min-width: 48em) and (max-width: 1280px) {
  /* line 398, ../sass/_layout.scss */
  .portGrid {
    grid-template-columns: 5vw auto 30px auto 5vw;
    grid-template-rows: 90px auto 30px auto 30px auto 30px auto 30px auto 50px;
  }

  /* line 403, ../sass/_layout.scss */
  .pt1 {
    grid-column-start: 2;
    grid-row-start: 2;
  }

  /* line 408, ../sass/_layout.scss */
  .pt2 {
    grid-column-start: 4;
    grid-row-start: 2;
  }

  /* line 413, ../sass/_layout.scss */
  .pt3 {
    grid-column-start: 2;
    grid-row-start: 4;
  }

  /* line 418, ../sass/_layout.scss */
  .pt4 {
    grid-column-start: 4;
    grid-row-start: 4;
  }

  /* line 423, ../sass/_layout.scss */
  .pt5 {
    grid-column-start: 2;
    grid-row-start: 6;
  }

  /* line 428, ../sass/_layout.scss */
  .pt6 {
    grid-column-start: 4;
    grid-row-start: 6;
  }

  /* line 433, ../sass/_layout.scss */
  .pt7 {
    grid-column-start: 2;
    grid-row-start: 8;
  }

  /* line 438, ../sass/_layout.scss */
  .pt8 {
    grid-column-start: 4;
    grid-row-start: 8;
  }

  /* line 443, ../sass/_layout.scss */
  .pt9 {
    grid-column-start: 2;
    grid-row-start: 10;
  }
}
/* line 449, ../sass/_layout.scss */
.portThumb {
  width: 100%;
  height: auto;
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: center;
}

/* line 458, ../sass/_layout.scss */
.portOverlay {
  position: relative;
}

/* line 462, ../sass/_layout.scss */
.portOverlay::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  pointer-events: none;
}

@media only screen and (max-width: 48em) {
  /* line 475, ../sass/_layout.scss */
  .portOverlay::before {
    background-color: rgba(0, 0, 0, 0.35);
    mix-blend-mode: multiply;
  }
}
/* line 481, ../sass/_layout.scss */
.portOverlay:hover::before {
  background-color: rgba(38, 55, 221, 0.9);
  mix-blend-mode: multiply;
}

/* line 486, ../sass/_layout.scss */
.portThumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* line 492, ../sass/_layout.scss */
.portThumb h5 {
  position: absolute;
  z-index: 500;
  align-self: center;
  color: rgba(255, 255, 255, 0);
  transition: 0.4s;
}

/* line 500, ../sass/_layout.scss */
.portThumb:hover h5 {
  color: white;
}

@media only screen and (max-width: 48em) {
  /* line 505, ../sass/_layout.scss */
  .portThumb h5 {
    color: white;
  }
}
/*-----------------------------
 * PORTFOLIO PAGES
/*-----------------------------*/
/* line 514, ../sass/_layout.scss */
.portHero {
  margin: 0;
  padding: 0;
  width: 100%;
}

/* line 520, ../sass/_layout.scss */
.portHeroImg {
  width: 100%;
  height: 45vw;
  overflow: hidden;
  margin-bottom: 100px;
}

/* line 527, ../sass/_layout.scss */
.portHeroImg img {
  width: 100%;
  height: auto;
}

/* line 532, ../sass/_layout.scss */
.portImg {
  width: 90%;
  max-width: 1500px;
  height: auto;
  overflow: hidden;
  margin: 60px 0;
  padding-left: 5vw;
  padding-right: 5vw;
}

/* line 542, ../sass/_layout.scss */
.portImg img {
  width: 100%;
  height: auto;
}

/* line 547, ../sass/_layout.scss */
.portImg video {
  width: 100%;
  height: auto;
}

/* line 552, ../sass/_layout.scss */
.portImg:last-of-type {
  margin-bottom: 70px;
}

/* line 556, ../sass/_layout.scss */
.portCaption {
  border-top: 1px solid black;
  margin: -40px 5vw 0 5vw;
  padding: 0;
}

.portOutline{
  font-family: "Space Mono", monospace;
  color: black;
  width: 90%;
  max-width: 1500px;
  height: auto;
  overflow: hidden;
  margin: 60px 0;
  padding-left: 5vw;
  padding-right: 5vw;
}

.portOutline .column{
  float: left;
  width: 33.33%;
}

@media screen and (max-width: 600px) {
  .portOutline .column {
    width: 100%;
    padding-top: 30px;
  }

  .portOutline p{
    margin-right: 0;
  }
}

.portOutline .row:after{
  content: "";
  display: table;
  clear: both;
}

.portOutline h1{
  font-size: .9rem;
  font-weight: 600;
}

.portOutline p{
  font-size: .8rem;
  font-weight: 300;
  padding-top: 10px;
  line-height: 1.3;
  margin-right: 40px;
}

.portText{
  font-family: "Chivo", sans-serif;
  color: black;
  line-height: 1.8;
  padding-bottom: 20px;
  padding-top: 20px;
  width: 90%;
  max-width: 55rem;
  height: auto;
  overflow: hidden;
  padding-left: 5vw;
  padding-right: 5vw;
}

.portText p{
  font-size: 1rem;
  font-weight: 300;
}

.portText h1{
  font-size: 1.1rem;
  font-weight: 600;
}

.portText ol{
  list-style-type: decimal;
  margin-left: 20px;
  font-weight: 300;
}

.portText ul{
  list-style-type: disc;
  margin-left: 20px;
  font-weight: 300;
}

.portText:last-of-type {
  margin-bottom: 70px;
}

/*-----------------------------
 * CONTACT INFO
/*-----------------------------*/
/* line 566, ../sass/_layout.scss */
.siteFooter {
  padding: 50px 5vw;
}

/* line 570, ../sass/_layout.scss */
.siteFooter li {
  display: inline-block;
  padding-right: 10px;
  padding-top: 20px;
}