@font-face {
  font-family: "Eagle Lake";
  font-weight: 400;
  src: url("image/EagleLake-Regular.ttf");
}
body {
  width: 100svw;
  height: 100svh;
  overflow: hidden;
  margin: 0;
  padding: 0;
  font-family: "Eagle Lake";
  font-size: min(20pt, 4vmin);
  font-weight: 400;
}
main {
  display: block;
  width: 100%;
  height: 100lvh;
  overflow: hidden auto;
  background: url('image/background.webp') no-repeat center;
  background-size: cover;
  background-attachment: local;
}
h1 {
  font-size: 300%;
  font-weight: 500;
  margin: 0.2em 0;
}
h2 {
  font-size: 150%;
  font-weight: 600;
  margin: 0.5em 0;
}
h3 {
  font-size: 130%;
  font-weight: 600;
  margin: 1em 0;
}
h3:has(+p, +table) {
  margin-bottom: 0;
}
p,
table {
  margin: 1em 0;
}
em {
  font-style: normal;
  font-weight: 600;
}
s {
  text-decoration: underline;
  text-decoration-thickness: 0.15em;
  text-decoration-skip-ink: none;
  text-underline-offset: -0.35em;
}
small {
  display: block;
  line-height: 1.25em;
  margin-bottom: 0.3em;
}
a,
a:link,
a:visited,
a:hover,
a:active {
  display: inline;
  color: inherit;
}
section {
  position: relative;
  display: flex;
  flex-flow: column nowrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: center;
  text-align: center;
  width: 100%;
  min-height: fit-content;
  min-block-size: 100lvh;
  scroll-snap-align: start;
}
section div.soft_box {
  display: flex;
  flex-flow: column nowrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: center;
  text-align: center;
  width: 90%;
  max-width: 1200px;
}
section#header {
  min-block-size: 100svh;
}
section#header h1 {
  margin: 0.5em 1em;
  line-height: 1.3em;
  filter: drop-shadow(0 0 1px #fff);
}
section#header h2 {
  font-weight: 400;
  margin: 0 1em;
  line-height: 1.2em;
  filter: drop-shadow(0 0 1px #fff);
}
section#header div.filler {
  display: flex;
  flex-flow: column nowrap;
  flex-grow: 1;
  flex-shrink: 1;
  justify-content: end;
}
section#header div.filler img {
  height: 5em;
  aspect-ratio: 7 / 24;
  margin-bottom: 1em;
  filter: drop-shadow(0 0 1px #fff);
}
div.picture {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: center;
  width: 100%;
  margin: 2% 0;
}
div.picture.person:nth-of-type(2n) {
  flex-direction: row;
}
div.picture.person:nth-of-type(2n+1) {
  flex-direction: row-reverse;
}
div.picture.event:nth-of-type(2n) {
  flex-direction: row-reverse;
}
div.picture.event:nth-of-type(2n+1) {
  flex-direction: row;
}
div.picture.event:last-of-type {
  flex-direction: column;
  margin-bottom: 0;
}
div.picture.event:last-of-type h2 {
  margin-bottom: 0;
}
div.picture div.photo {
  position: relative;
  width: 100%;
  max-width: 700px;
  aspect-ratio: 1/1;
  transition-property: transform;
  transition-duration: 150ms;
  transition-timing-function: ease-out;
}
div.picture div.photo::after {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: center no-repeat;
  background-size: contain;
  content: "";
}
div.picture div.photo:active {
  transform: none !important;
}
div.picture div.photo.dasa {
  transform: rotate(1.8deg);
}
div.picture div.photo.dasa::after {
  background-image: url("image/photo_frame4.webp");
}
div.picture div.photo.miro {
  transform: rotate(-2.1deg);
}
div.picture div.photo.miro::after {
  background-image: url("image/photo_frame2.webp");
}
div.picture div.photo.v1 {
  transform: rotate(2.3deg);
}
div.picture div.photo.v1::after {
  background-image: url("image/photo_frame1.webp");
}
div.picture div.photo.v2 {
  transform: rotate(-1.6deg);
}
div.picture div.photo.v2::after {
  background-image: url("image/photo_frame2.webp");
}
div.picture div.photo.v3 {
  transform: rotate(1.3deg);
}
div.picture div.photo.v3::after {
  background-image: url("image/photo_frame3.webp");
}
div.picture div.photo.v4 {
  transform: rotate(-0.3deg);
}
div.picture div.photo.v4::after {
  background-image: url("image/photo_frame4.webp");
}
div.picture div.photo.v5 {
  transform: rotate(-1.8deg);
}
div.picture div.photo.v5::after {
  background-image: url("image/photo_frame2.webp");
}
div.picture div.photo.v6 {
  transform: rotate(2.4deg);
}
div.picture div.photo.v6::after {
  background-image: url("image/photo_frame3.webp");
}
div.picture div.photo.v7 {
  transform: rotate(-3.7deg);
}
div.picture div.photo.v7::after {
  background-image: url("image/photo_frame4.webp");
}
div.picture div.photo.v8::after {
  background-image: url("image/photo_frame1.webp");
}
div.picture div.photo img {
  display: block;
  width: 90%;
  height: 90%;
  margin: 5%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
}
div.picture div.text {
  width: 500px;
}
div.picture div.text ul {
  font-style: italic;
  text-align: left;
  list-style: "\2014\00a0";
}
div.picture div.text::after {
  display: inline-block;
  transform: scaleX(250%);
  content: "\2014";
}
section#wedding {
  justify-content: start;
}
section#schedule table {
  border-spacing: 1em 0.2em;
}
section#schedule td {
  text-align: left;
  vertical-align: baseline;
}
section#schedule td:first-child {
  font-size: 85%;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
section#schedule div.filler {
  flex-grow: 1;
  margin: 1.5em 0;
}
section#schedule div.leaves {
  width: 20em;
  min-height: 6em;
  background: url("image/leaves.webp") center no-repeat;
  background-size: contain;
  filter: drop-shadow(0 0 1px #999);
  mix-blend-mode: hard-light;
}
section#info div#map {
  display: block;
  width: 100%;
  max-width: 800px;
  margin: 1em;
  aspect-ratio: 5 / 3;
  border: 1px solid black;
}
section#contact {
  position: relative;
}
section#contact div.soft_box {
  flex-grow: 1;
}
section#contact div.filler {
  flex-grow: 1;
  margin: 1.5em 0;
}
section#contact div.footer {
  align-self: end;
  flex-grow: 5;
  width: 100%;
  background: url("image/lonely_mountain.webp") right center no-repeat;
  background-size: contain;
  mix-blend-mode: multiply;
}
