:root {
  --navbar: #ffffff;
  --navbarText: #000000;
  --buttonBorder: #7F9892;
  --buttonText: #7F9892;
  --buttonActiveText: #a29890;
  --buttonActiveOutline: #a29890;
}

@font-face {
  font-family: 'GeoSans';
  src: url('/font/GeosansLight.otf');
}

* {
  font-family: 'GeoSans';
  font-size: large;
}

body{
  overflow-x: hidden;
}

ul > li {
  list-style: none;
}

ul.showUl > li {
  list-style-type: disc;
  list-style-position: outside;
}

.is-square > img {
  border-radius: 12px;
}

.centered-axis-xy {
  width: 100vw;
  background-color: rgba(0,0,0,0.35);
  color: #fff;
  z-index: 1;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}

.no-format {
  color: #4a4a4a;
}

.small-card {
  text-align: justify;
}

.wedding-modal-header {
  position: static;
}

@keyframes zoomAnimation {
  0% {
      transform: scale(0.0);
      -webkit-transform: scale(0.0);
  }
  100% {
      transform: scale(1.0);
      -webkit-transform: scale(1.0);
  }
}

.zoom {
  animation: zoomAnimation 0.5s ease-in-out;
  -webkit-animation: zoomAnimation 0.5s ease-in-out;
}

.modal-card{
  width: 75%;
  overflow: auto;
}

.dropdown-content {
    max-height: 25em;
    overflow: auto;
}

.section {
    padding:0px;
}

.button {
    font-weight: bold;
    color: var(--buttonText);
    border-color: var(--buttonBorder);
    padding-left: 8px;
    padding-right: 8px;
    outline: none;
    box-shadow: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.button.is-active, .button:active {
  color: var(--buttonActiveText);
  border-color: var(--buttonActiveOutline);
}

.button.is-focused:not(:active), .button:focus:not(:active) {
  box-shadow: none;
  color: var(--buttonActiveText);
  border-color: var(--buttonActiveOutline);
}

.button.is-hovered:not(:active), .button:hover:not(:active) {
  color: var(--buttonActiveText);
  border-color: var(--buttonActiveOutline);
}

.burger-icon {
  color: var(--navbarText);
}

.navbar-menu {
  background-color: var(--navbar);
}

.navbar-item {
  background-color: var(--navbar);
  color: var(--navbarText);
}

.navbar-brand {
  background-color: var(--navbar);
}

.navbar.is-link .navbar-end>.navbar-item {
  color: var(--navbarText);
}

.navbar.is-link .navbar-brand>a.navbar-item:hover {
  background-color: var(--navbar);
  color: var(--navbarText);
}

.navbar.is-link .navbar-end>a.navbar-item:hover {
  background-color: var(--navbar);
  color: var(--navbarText);
}
.navbar.is-link .navbar-end>a.navbar-item:focus {
  background-color: var(--navbar);
  color: var(--navbarText);
}

.navbar.is-link .navbar-end {
  background-color: black;
}



.ribbon {
  width: 150px;
  height: 150px;
  overflow: hidden;
  position: absolute;
}
.ribbon::before,
.ribbon::after {
  position: absolute;
  z-index: -1;
  content: '';
  display: block;
  border: 5px solid #2980b9;
}
.ribbon span {
  position: absolute;
  display: block;
  width: 225px;
  padding: 15px 0;
  background-color: #EDB9A3;
  box-shadow: 0 5px 10px rgba(0,0,0,.1);
  color: #fff;
  font: 700 18px/1 'Lato', sans-serif;
  text-shadow: 0 1px 1px rgba(0,0,0,.2);
  text-transform: uppercase;
  text-align: center;
}

/* top left*/
.ribbon-top-left {
  top: -10px;
  left: -10px;
}
.ribbon-top-left::before,
.ribbon-top-left::after {
  border-top-color: transparent;
  border-left-color: transparent;
}
.ribbon-top-left::before {
  top: 0;
  right: 0;
}
.ribbon-top-left::after {
  bottom: 0;
  left: 0;
}
.ribbon-top-left span {
  right: -25px;
  top: 30px;
  transform: rotate(-45deg);
}

.privacy > * {
  font-family: Arial, Helvetica, sans-serif;
  text-align: left;
  font-size: 12px;
}


.wrapper {
    position: relative;
    height: 100vh;
    width: 100vw;
    overflow: hidden;
    z-index: 0;
  }

  .slideshow {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translateX(-50%);
  }
  .slideshow--hero {
    z-index: 3;
    left: 0;
    top: 50%;
    height: 85%;
    transform: translateY(-50%) skewY(-10deg);
    transform-origin: center;
    overflow: hidden;
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.25);
  }
  .slideshow--hero .slides {
    position: absolute;
    left: 0;
    top: -10%;
    width: 100vw;
    height: 100vh;
    animation: 11s slideshow-hero-mobile -3s infinite;
  }
  .slideshow--hero .slide1 {
    background-image: url(/img/landscape_1.jpg);
    animation: 20s slides-set-1 -0.1s infinite;
  }
  .slideshow--hero .slide2 {
    background-image: url(/img/landscape_2.jpg);
    animation: 20s slides-set-2 -0.1s infinite;
  }
  .slideshow--hero .slide3 {
    background-image: url(/img/landscape_3.jpg);
    animation: 20s slides-set-3 -0.1s infinite;
  }
  @media (min-width: 600px) {
    .slideshow--hero {
      left: 50%;
      top: 0;
      width: 67%;
      height: 100%;
      transform: translateX(-50%) skewX(-10deg);
    }
    .slideshow--hero .slides {
      top: 0;
      left: -25%;
      height: 100%;
      animation: 11s slideshow-hero -3s infinite;
    }
  }
  .slideshow--contrast {
    z-index: 1;
    width: 100%;
    height: 50%;
    transform: none;
  }
  .slideshow--contrast--before {
    left: 0;
  }
  .slideshow--contrast--before .slides {
    width: 100vw;
  }
  .slideshow--contrast--after {
    z-index: 2;
    left: auto;
    right: 0;
  }
  .slideshow--contrast--after .slides {
    width: 100vw;
    left: auto;
    right: 0;
  }
  .slideshow--contrast .slides {
    animation: 14s slideshow-contrast -5s infinite;
  }
  .slideshow--contrast .slide1 {
    background-image: linear-gradient(to bottom, rgba(250, 240, 230, 0.25) 0, rgba(255, 248, 231, 0.5) 100%), url(/img/landscape_1.jpg);
    animation: 20s slides-set-1 -0.2s infinite;
  }
  .slideshow--contrast .slide2 {
    background-image: linear-gradient(to bottom, rgba(250, 240, 230, 0.25) 0, rgba(255, 248, 231, 0.5) 100%), url(/img/landscape_2.jpg);
    animation: 20s slides-set-2 -0.2s infinite;
  }
  .slideshow--contrast .slide3 {
    background-image: linear-gradient(to bottom, rgba(250, 240, 230, 0.25) 0, rgba(255, 248, 231, 0.5) 100%), url(/img/landscape_3.jpg);
    animation: 20s slides-set-3 -0.2s infinite;
  }
  .slideshow--contrast--after {
    top: auto;
    bottom: 0;
  }
  .slideshow--contrast--after .slides {
    animation: 13s slideshow-contrast -13s infinite;
  }
  .slideshow--contrast--after .slide {
    background-position: right;
  }
  .slideshow--contrast--after .slide1 {
    animation: 20s slides-set-1 infinite;
  }
  .slideshow--contrast--after .slide2 {
    animation: 20s slides-set-2 infinite;
  }
  .slideshow--contrast--after .slide3 {
    animation: 20s slides-set-3 infinite;
  }
  @media (min-width: 600px) {
    .slideshow--contrast {
      width: 50%;
      height: 100%;
    }
    .slideshow--contrast--after {
      top: 0;
      bottom: auto;
    }
    .slideshow--contrast--after .slides {
      width: 50vw;
    }
  }

  .slides,
  .slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }

  @keyframes slideshow-hero-mobile {
    0% {
      transform: scale(1) skewY(10deg);
    }
    50% {
      transform: scale(1.05) skewY(10deg);
    }
    100% {
      transform: scale(1) skewY(10deg);
    }
  }
  @keyframes slideshow-hero {
    0% {
      transform: scale(1) skewX(10deg);
    }
    50% {
      transform: scale(1.05) skewX(10deg);
    }
    100% {
      transform: scale(1) skewX(10deg);
    }
  }
  @keyframes slideshow-contrast {
    0% {
      transform: scale(1.05);
    }
    50% {
      transform: scale(1);
    }
    100% {
      transform: scale(1.05);
    }
  }
  @keyframes slides-set-1 {
    0% {
      opacity: 1;
      transform: scale(1);
    }
    31% {
      opacity: 1;
      transform: scale(1);
    }
    34% {
      opacity: 0;
      transform: scale(1.05);
    }
    97% {
      opacity: 0;
      transform: scale(1.05);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  @keyframes slides-set-2 {
    0% {
      opacity: 0;
      transform: scale(1.05);
    }
    31% {
      opacity: 0;
      transform: scale(1.05);
    }
    34% {
      opacity: 1;
      transform: scale(1);
    }
    64% {
      opacity: 1;
      transform: scale(1);
    }
    67% {
      opacity: 0;
      transform: scale(1.05);
    }
    100% {
      opacity: 0;
      transform: scale(1.05);
    }
  }
  @keyframes slides-set-3 {
    0% {
      opacity: 0;
      transform: scale(1.05);
    }
    64% {
      opacity: 0;
      transform: scale(1.05);
    }
    67% {
      opacity: 1;
      transform: scale(1);
    }
    97% {
      opacity: 1;
      transform: scale(1);
    }
    100% {
      opacity: 0;
      transform: scale(1.05);
    }
  }