/* Variables & Defaults */
@import url("https://fonts.googleapis.com/css2?family=The+Nautigal&display=swap");
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

body {
  margin: 0;
  padding: 0; }

/* Brand colors */
/* Fonts */
/* Mixins */
/* region Common */
[v-cloak] {
  display: none; }

html, body {
  height: 100%; }

body {
  font-family: "futura-pt", sans-serif;
  font-size: 18px; }

.relative {
  position: relative;
  height: 100%;
  width: 100%; }

#app {
  position: relative;
  min-height: 100%;
  padding-bottom: 163px; }

h1, h2 {
  margin: 0;
  font-family: "futura-pt", sans-serif;
  text-align: center; }

h1, h2, h3 {
  font-weight: 300; }

h1 {
  margin-bottom: 45px;
  margin-top: 0;
  font-family: "KrysttalSpears", "The Nautigal", cursive;
  font-size: 72px;
  text-align: center;
  color: #9b6e5b; }

h2 {
  margin-bottom: 28px;
  font-size: 24px; }

h3 {
  margin-bottom: 45px;
  margin-top: 0;
  font-family: "KrysttalSpears", "The Nautigal", cursive;
  font-size: 64px;
  text-align: center;
  color: #9b6e5b;
  user-select: none;
  cursor: default; }

a {
  outline: none;
  text-decoration: none; }

.site-container {
  width: 1200px;
  max-width: 95%;
  margin: 0 auto;
  padding-bottom: 40px;
  padding-top: 140px; }

/* endregion */
/* region Header */
header {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  padding-right: 25px;
  padding-top: 45px;
  z-index: 1; }
  header a {
    display: inline-block;
    margin: 0 30px;
    font-size: 16px;
    font-family: "Cormorant Garamond", serif;
    font-weight: 500;
    border-bottom: 1px solid transparent;
    color: #fff; }
    header a:hover, header a.router-link-exact-active {
      border-color: #fff; }
  header.reg-page {
    justify-content: center; }
    header.reg-page a {
      color: #000; }
      header.reg-page a:hover, header.reg-page a.router-link-exact-active {
        border-color: #000; }

/* endregion */
/* region Footer */
footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  font-family: "Cormorant Garamond", serif;
  background: rgba(155, 110, 91, 0.51);
  color: #fff; }
  footer .site-container {
    margin-top: 35px;
    padding-top: 0; }
  footer .flex-wrapper {
    display: flex;
    justify-content: space-between; }
  footer .footer-links a {
    display: inline-table;
    margin: 5px 15px;
    border-bottom: 1px solid transparent;
    color: #fff; }
    footer .footer-links a:first-child {
      margin-left: 0; }
    footer .footer-links a:hover {
      border-color: #fff; }
  footer .copyright {
    font-size: 15px;
    margin-top: 25px; }
  footer .social-links a {
    display: inline-block;
    margin: 0 10px;
    height: 40px;
    width: 40px;
    background: center center no-repeat;
    background-size: 99%; }
    footer .social-links a.instagram {
      background-image: url(/img/instagram.svg); }
    footer .social-links a.twitter {
      background-image: url(/img/twitter.svg); }
    footer .social-links a.linkedin {
      background-image: url(/img/linkedin.svg); }

/* endregion */
/* region 404 */
#not-found {
  height: 100vh;
  position: relative;
  background: url(/img/Desert.jpg) center center no-repeat;
  background-size: cover; }
  #not-found h1 {
    margin: 0;
    color: rgba(255, 255, 255, 0.7); }
  #not-found .content {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    width: 340px;
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
    transform: translateY(-50%); }

/* endregion */
/* region Home */
#home {
  padding-bottom: 40px; }
  #home h1 {
    margin: 50px 0 25px; }
  #home .intro {
    background: #000;
    position: relative;
    height: 100vh; }
  #home .intro-slide {
    position: absolute;
    height: 100%;
    width: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    background-size: cover;
    background-position: center center;
    transition: opacity 1s linear; }
  #home .main {
    width: 90%;
    margin: 0 auto; }
  #home .separator {
    display: block;
    width: 70px;
    margin: 70px auto; }
  #home .quote {
    text-align: center; }
    #home .quote .text {
      width: 560px;
      margin: 40px auto 20px;
      font-size: 32px;
      font-weight: 300; }
    #home .quote .author {
      font-size: 20px;
      font-weight: 700; }
  #home .text-and-image {
    display: flex;
    align-items: center;
    max-width: 950px;
    margin: 0 auto; }
    #home .text-and-image img {
      width: 350px; }
    #home .text-and-image h3 {
      transform: rotateZ(-9deg); }
    #home .text-and-image .text {
      margin-left: 12px;
      padding: 22px; }
    #home .text-and-image p {
      margin-bottom: 16px;
      line-height: 1.5; }

/* endregion */
/* region Investment */
#investment h2 {
  margin-top: 75px;
  font-size: 28px;
  font-family: "Cormorant Garamond", serif;
  text-transform: uppercase; }

#investment .pricing-note {
  margin: -25px 0 0;
  font-size: 15px;
  text-align: center;
  color: #2c2c2c; }
  #investment .pricing-note.emphasize {
    margin-top: 15px;
    font-size: 17px; }

#investment .pricing-boxes {
  display: flex;
  justify-content: center; }
  #investment .pricing-boxes .pricing-box {
    width: 33%; }
  #investment .pricing-boxes .image {
    position: relative;
    height: 400px;
    width: 80%;
    margin: 0 auto;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover; }
    #investment .pricing-boxes .image:after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      width: 100%;
      height: 40px;
      background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), white 90%); }
  #investment .pricing-boxes .image-weddings-basic {
    background-image: url(/img/pricing/wedding-basic.jpg); }
  #investment .pricing-boxes .image-weddings-standard {
    background-image: url(/img/pricing/wedding-standard.jpg); }
  #investment .pricing-boxes .image-weddings-full {
    background-image: url(/img/pricing/wedding-full.jpg); }
  #investment .pricing-boxes .image-elopements-standard {
    background-image: url(/img/pricing/elopement-standard.jpg); }
  #investment .pricing-boxes .image-elopements-premium {
    background-image: url(/img/pricing/elopement-premium.jpg); }
  #investment .pricing-boxes .image-engagements-standard {
    background-image: url(/img/pricing/engagement-standard.jpg); }
  #investment .pricing-boxes .image-families-mini {
    background-image: url(/img/pricing/family-mini.jpg); }
  #investment .pricing-boxes .image-families-standard {
    background-image: url(/img/pricing/family-standard.jpg); }
  #investment .pricing-boxes .image-headshots {
    background-image: url(/img/pricing/headshot.jpg); }
  #investment .pricing-boxes .image-lifestyle {
    background-image: url(/img/pricing/lifestyle.jpg); }
  #investment .pricing-boxes .image-company {
    background-image: url(/img/pricing/company.jpg); }
  #investment .pricing-boxes .package {
    position: relative;
    top: -40px;
    width: 95%;
    padding: 20px;
    margin: 0 auto;
    border-radius: 2px;
    background: rgba(135, 128, 136, 0.85);
    color: #fff; }
    #investment .pricing-boxes .package h6 {
      display: flex;
      justify-content: space-between;
      margin: 0 0 15px;
      font-size: 28px;
      font-weight: 300; }
      #investment .pricing-boxes .package h6 .small {
        position: relative;
        top: -1px;
        display: inline-table;
        margin: 0 2px;
        font-size: 16px; }
      #investment .pricing-boxes .package h6 a {
        border-bottom: 1px solid #fff;
        color: #fff; }
    #investment .pricing-boxes .package ul {
      margin-bottom: 0; }

#investment #weddings .package {
  min-height: 210px; }

#investment #elopements .package {
  min-height: 250px; }

#investment #headshots .package {
  min-height: 164px; }

#investment #letsConnectBtn {
  display: table;
  margin: 50px auto;
  padding: 16px 45px;
  font-family: "KrysttalSpears", "The Nautigal", cursive;
  font-size: 30px;
  border: none;
  border-radius: 2px;
  outline: none;
  background: #878088;
  color: #fff;
  cursor: pointer; }
  #investment #letsConnectBtn:hover, #investment #letsConnectBtn:active {
    background: rgba(135, 128, 136, 0.9); }

/* endregion */
/* region Contact */
#contact h1 {
  text-align: center; }

#contact .loading {
  display: block;
  width: 100px;
  margin: 0 auto; }

#contact iframe {
  display: block;
  width: 555px;
  margin: 0 auto;
  border: none; }

/* endregion */
