html {
    scroll-padding-block-start: var(--nav-block-size);
  }

  body {
    -webkit-font-smoothing: antialiased;
  }

a { color: #754e3d; font-weight: bold; }
a:hover { color: #56453f; font-weight: bold; }
header {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50vh;
}

.rsvp { width: 200px; margin: auto; display: block; background: var(--rsvp-color); border: 0; }
.rsvp:hover { background: var(--rsvp-colorhover); }
.video-wrapper {
  position: relative;
  width: 100%;
  /* Restrict the max height to 550px */
  max-height: 550px;
  height: 550px;
  overflow: hidden;
}

/* Fill the container's width and height without black bars */
.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
h3 { font-family: "Poppins", serif;
  font-weight: 700; }
.w-100 { width: 100% !important; }
.btn { border: 0 !important; border-radius: 20px; padding-left: 30px; padding-right: 30px; font-family: "Poppins", serif;
  font-weight: 700; }

.btn-primary { background: #A47864 !important; color: #fff; }
.btn-primary:hover { background: #56453f !important; color: #fff; } 
.btn-secondary { background: #56453f !important; color: #fff; }
.btn-secondary:hover { background: #A47864 !important; color: #fff; } 
.bg-primary { background: #56453f !important; color: #fff; }

@media (max-width: 1024px) { 
header {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    height: 100vh;
    background: url(header.jpg) top center no-repeat; background-size: cover;
}

header h1 { font-size: 3rem; }
}