@charset "UTF-8";
/* Parallax base styles
  --------------------------------------------- */
/* line 4, pages/_home_page.scss */
.parallax {
  height: 600px;
  min-height: 600px;
  /* fallback for older browsers */
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-perspective: 300px;
  perspective: 300px;
}

/* line 14, pages/_home_page.scss */
.parallax__group {
  position: relative;
  min-height: 500px;
  /* fallback for older browsers */
  display: block;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

/* line 22, pages/_home_page.scss */
.parallax__layer {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

/* line 30, pages/_home_page.scss */
.parallax__layer--top {
  -webkit-transform: translateZ(100px) scale(0.7);
  transform: translateZ(100px) scale(0.7);
  z-index: 7;
  pointer-events: none;
}

/* line 37, pages/_home_page.scss */
.parallax__layer--fore {
  -webkit-transform: translateZ(90px) scale(0.7);
  transform: translateZ(90px) scale(0.7);
  z-index: 1;
}

/* line 43, pages/_home_page.scss */
.parallax__layer--base {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  z-index: 4;
}

/* line 49, pages/_home_page.scss */
.parallax__layer--back {
  -webkit-transform: translateZ(-300px) scale(2);
  transform: translateZ(-300px) scale(2);
  z-index: 3;
}

/* line 55, pages/_home_page.scss */
.parallax__layer--deep {
  -webkit-transform: translateZ(-600px) scale(3);
  transform: translateZ(-600px) scale(3);
  z-index: 2;
}

/* style the groups
--------------------------------------------- */
/* line 65, pages/_home_page.scss */
#introduction {
  z-index: 5;
  /* slide over group 2 */
  text-align: center;
  background-image: url("/images/spideyslc1.jpg");
  background-position: center;
  background-size: cover;
  position: relative;
  display: table;
}
/* line 74, pages/_home_page.scss */
#introduction img.title {
  position: relative;
  z-index: 7;
  width: 90%;
  max-width: 1040px;
  padding-left: 4%;
  padding-top: 18%;
}
@media only screen and (min-width: 700px) {
  /* line 74, pages/_home_page.scss */
  #introduction img.title {
    width: 50%;
  }
}
/* line 86, pages/_home_page.scss */
#introduction .links {
  margin-top: 6%;
  position: relative;
}
/* line 89, pages/_home_page.scss */
#introduction .links li {
  display: inline-block;
  position: relative;
  vertical-align: middle;
}
/* line 93, pages/_home_page.scss */
#introduction .links li a {
  position: relative;
  display: block;
  background-color: transparent;
  border-radius: 50%;
  text-align: center;
  border: 1px solid #fefefe;
  margin: 0 2rem;
  padding: 0.25rem;
}
/* line 102, pages/_home_page.scss */
#introduction .links li a img {
  width: 50px;
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}
/* line 110, pages/_home_page.scss */
#introduction .links li a:hover {
  background-color: #1c1c1c;
  color: #fefefe;
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}
/* line 118, pages/_home_page.scss */
#introduction .links li a:hover + .caption {
  opacity: 1;
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}
/* line 126, pages/_home_page.scss */
#introduction .links li .caption {
  opacity: 0;
  position: relative;
  color: #fefefe;
  text-align: center;
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
}
/* line 136, pages/_home_page.scss */
#introduction.parallax__group {
  height: 600px;
  min-height: 600px;
  height: 100vh;
  width: 100%;
}

/* line 143, pages/_home_page.scss */
#introduction .parallax__layer--base {
  position: relative;
  position: relative;
  display: table-cell;
  vertical-align: middle;
}

/* line 150, pages/_home_page.scss */
#what {
  z-index: 3;
  /* slide under groups 1 and 3 */
  height: 600px;
}

/* line 154, pages/_home_page.scss */
#what .parallax__layer--back {
  background: #d0eaff url("/images/slc-city1.jpg");
  background-size: cover;
  background-position: center;
  position: relative;
  text-align: right;
}
/* line 160, pages/_home_page.scss */
#what .parallax__layer--back img {
  position: relative;
}
/* line 162, pages/_home_page.scss */
#what .parallax__layer--back img.spidey {
  max-width: 50%;
  top: 3rem;
}

/* line 169, pages/_home_page.scss */
#gallery {
  z-index: 6;
  /* slide over group 2 and 4 */
  position: relative;
  display: table;
  width: 100%;
  /*     Gallery
  ------------------------------------------------  */
}
/* line 174, pages/_home_page.scss */
#gallery.parallax__group {
  height: 650px;
  height: 100vh;
}
/* line 178, pages/_home_page.scss */
#gallery .parallax__layer--top {
  top: -200px;
}
/* line 180, pages/_home_page.scss */
#gallery .parallax__layer--top .string {
  opacity: 0.5;
  width: 99%;
}
/* line 185, pages/_home_page.scss */
#gallery .swapper_container {
  position: relative;
  display: table-cell;
  vertical-align: middle;
}
/* line 193, pages/_home_page.scss */
#gallery #perspective {
  margin: 0 auto;
  margin-top: 0px;
  padding: 5%;
  width: 90%;
  position: relative;
  -webkit-perspective: 175px;
  perspective: 175;
}
/* line 204, pages/_home_page.scss */
#gallery #perspective .swapper ul li {
  display: block;
  text-align: center;
  margin: 0;
}
/* line 208, pages/_home_page.scss */
#gallery #perspective .swapper ul li img {
  width: 80%;
  max-width: 1000px;
}

/* line 217, pages/_home_page.scss */
#gallery .parallax__layer--base {
  background: #ececec url("/images/gallery-bg.jpg");
}

/* line 221, pages/_home_page.scss */
#why {
  z-index: 5;
  /* slide under group 3 and 5 */
}
/* line 223, pages/_home_page.scss */
#why h2, #why p {
  color: #fefefe;
}
/* line 226, pages/_home_page.scss */
#why .parallax__layer--top {
  top: 100%;
}
/* line 228, pages/_home_page.scss */
#why .parallax__layer--top .string {
  opacity: 0.5;
  -ms-transform: rotate(180deg);
  /* IE 9 */
  -webkit-transform: rotate(180deg);
  /* Chrome, Safari, Opera */
  transform: rotate(180deg);
  width: 99%;
}

/* line 237, pages/_home_page.scss */
#why .parallax__layer--base {
  background: #6194bc url("/images/slc-city3.jpg");
  background-size: cover;
  background-position: center;
  position: relative;
  text-align: right;
  overflow: hidden;
  min-height: 500px;
  padding: 3rem 0;
}
/* line 246, pages/_home_page.scss */
#why .parallax__layer--base img {
  position: relative;
}
/* line 248, pages/_home_page.scss */
#why .parallax__layer--base img.spidey {
  width: 50%;
  max-width: 1000px;
  top: 3rem;
}

/* line 256, pages/_home_page.scss */
#nice_words {
  z-index: 4;
  /* slide over group 4 and 6 */
}
/* line 260, pages/_home_page.scss */
#nice_words .swapper ul li {
  display: block;
  padding: 3rem;
  margin: 0;
}

/* line 268, pages/_home_page.scss */
#nice_words .parallax__layer--base {
  background: #d0eaff;
}

/* line 272, pages/_home_page.scss */
#book {
  position: relative;
  z-index: 3;
  background: #ececec url("/images/slc-city4.jpg");
  background-repeat: repeat;
  background-size: cover;
  padding: 2rem 0;
}

/* line 281, pages/_home_page.scss */
#footer {
  z-index: 6;
  background-color: #606060;
  padding-top: 1.5rem;
}
/* line 285, pages/_home_page.scss */
#footer .h_padding {
  height: 60px;
  min-height: 60px;
  text-align: center;
}
/* line 290, pages/_home_page.scss */
#footer .h_padding .social_media li {
  display: inline-block;
}
/* line 292, pages/_home_page.scss */
#footer .h_padding .social_media li a {
  background-color: #fefefe;
  border-radius: 50%;
  color: #1c1c1c;
  margin: 0 2rem;
  padding: 0.25rem 0.375rem;
  font-size: 1.5rem;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
/* line 303, pages/_home_page.scss */
#footer .h_padding .social_media li a .fa {
  min-width: 1.5rem;
}
/* line 306, pages/_home_page.scss */
#footer .h_padding .social_media li a:hover {
  background-color: #1c1c1c;
  color: #fefefe;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}