body {
  color: #333;
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  font-size: 14px;
}

.welcome-head {
  color: #bb395e;
  text-align: center;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #fff;
  text-shadow: 3px 3px 3px #0003;
  font-family: Exo, sans-serif;
  font-size: 180px;
  font-weight: 600;
  line-height: 100%;
}

.name {
  color: #58926f;
  text-align: center;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #d87497ad;
  text-shadow: 2px 1px 4px #0003;
  flex-flow: column;
  justify-content: center;
  align-items: stretch;
  padding-top: 10px;
  font-family: Birthstone Bounce, sans-serif;
  font-size: 240px;
  display: flex;
}

.welcome-guess {
  max-width: 940px;
}

.welcome {
  text-align: center;
  background-image: linear-gradient(#fff, #fee8eb);
  flex-flow: row;
  justify-content: center;
  align-items: center;
  height: 25%;
  display: flex;
}

.slide {
  height: 100%;
}

.pictures {
  outline-offset: 3px;
  border-radius: 20px;
  outline: 2px dashed #ffa4af;
  height: 450px;
}

.wel-name {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 20%;
  height: 20%;
  margin: 20px;
  padding-bottom: 60px;
  display: flex;
}

.body {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: row;
  justify-content: center;
  align-items: center;
}

.mask {
  border-radius: 20px;
  box-shadow: 0 0 7px 5px #0003;
}

.container {
  width: 100%;
  height: 800px;
  padding-left: 20px;
  padding-right: 20px;
}

.wel-pics {
  height: 80%;
  padding-left: 40px;
  padding-right: 40px;
}

.introduction {
  background-color: #fee8eb;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 25%;
  display: flex;
}

.div-block {
  opacity: 1;
  width: 500px;
  transform: translate(-20px, 300px);
}

.decor {
  flex-flow: column;
  height: 300px;
}

.decor-pic1 {
  flex-flow: row;
  justify-content: center;
  align-items: stretch;
  display: inline-flex;
  transform: translate(-291px, 111px);
}

.text {
  color: #9a8d72;
  text-align: center;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #ff000047;
  text-shadow: 2px 1px 1px #fff;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 30%;
  font-family: Exo, sans-serif;
  font-size: 35px;
  line-height: 120%;
}

.text.main {
  color: #e72c4e;
  letter-spacing: 2px;
  -webkit-text-stroke-color: #bdb0848f;
  margin: 10px 20px;
  padding-bottom: 10px;
  font-family: Birthstone Bounce, sans-serif;
  font-size: 700%;
  line-height: 100%;
}

.text.stephen-thanh {
  opacity: 1;
  color: #f8c9d000;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #caa6ac;
  margin-top: 10px;
  margin-left: 40px;
  margin-right: 40px;
  padding-bottom: 10px;
}

.stephen-thanh {
  padding-top: 40px;
  font-family: WindSong, sans-serif;
  font-size: 80px;
  line-height: 100%;
}

.stephen-thanh.nav {
  color: #b98080;
  font-family: Ms Madi, sans-serif;
  font-size: 40px;
  line-height: 50%;
}

.line {
  color: #fdfcf1;
  background-color: #ffe8ec;
  flex-flow: column;
  padding-bottom: 40px;
}

.line.line1 {
  color: #fefcf0;
}

.line.line2 {
  color: #fefcf0;
  padding-top: 60px;
  padding-bottom: 20px;
}

.main-text {
  text-align: center;
}

.invitation {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  text-align: center;
  background-color: #f9e9eb;
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  align-items: center;
  height: 25%;
}

.information {
  background-color: #fffdf0;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.day {
  color: #8d7657;
  text-align: center;
  letter-spacing: 4px;
  font-family: Great Vibes, cursive;
  font-size: 70px;
  line-height: 100%;
}

.infor {
  opacity: 1;
  color: #b67897;
  text-align: center;
  letter-spacing: 7px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  font-family: Exo, sans-serif;
  font-size: 40px;
  line-height: 150%;
}

.yes---no {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.rsvp-text {
  opacity: .63;
  color: #cc979700;
  text-align: center;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #f1a9ab;
  font-family: WindSong, sans-serif;
  font-size: 100px;
  line-height: 100px;
}

.button {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-bottom: 60px;
  display: flex;
}

.text2 {
  color: #7a7a7a;
  text-align: center;
  letter-spacing: 3px;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #cf7fa9;
  text-shadow: -2px 1px 10px #0003;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 40px;
  font-family: Great Vibes, cursive;
  font-size: 120px;
  line-height: 100%;
}

.form1 {
  justify-content: center;
  align-items: center;
  display: flex;
}

.submit-button-2 {
  text-align: center;
  background-color: #ff8eb1;
  border-radius: 20px;
  width: 200px;
}

.submit-button-2.yes {
  text-align: center;
  margin-bottom: 15px;
}

.submit-button-2.no {
  margin-bottom: 15px;
}

.pic {
  opacity: .91;
  background-color: #fffdf0;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 25%;
  padding-top: 60px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.pics-slide {
  outline-offset: 3px;
  background-color: #fefcf0;
  border-radius: 20px;
  outline: 2px dashed #c9a4c1;
  height: 70%;
  margin: 20px;
  box-shadow: 2px 2px 10px 5px #0003;
}

.mask-2 {
  border: 3px solid #fff;
  border-radius: 20px;
  box-shadow: inset 2px 6px 3px #0003;
}

.img-slide {
  box-sizing: border-box;
  aspect-ratio: 2;
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.icon {
  justify-content: flex-end;
  align-items: center;
}

.slide-nav {
  line-height: 18px;
}

.form {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  font-size: 50px;
}

.guess-information {
  flex-flow: row;
  justify-content: center;
  align-items: center;
  display: flex;
}

.form-3 {
  outline-offset: 3px;
  background-color: #fff3f378;
  border-radius: 20px;
  outline: 1px dashed #c98cab;
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
  width: 540px;
  margin-top: 0;
  margin-bottom: 50px;
  padding: 20px;
  display: flex;
  box-shadow: 0 0 20px 2px #d185c25c;
}

.text-yes {
  color: #c26393;
  text-align: center;
  text-shadow: 0 1px 1px #0003;
  margin-top: 5px;
  margin-left: 10px;
  margin-right: 10px;
  font-family: Exo, sans-serif;
  font-size: 30px;
  font-weight: 500;
  line-height: 40px;
}

.text-field {
  color: #333;
  background-color: #fff;
  border-radius: 20px;
  width: 90%;
}

.submit-button-3 {
  outline-offset: 5px;
  background-color: #d989ad;
  border-radius: 20px;
  outline: 1px dashed #c98cab;
  margin-top: 10px;
  margin-bottom: 20px;
  font-size: 30px;
  line-height: 15px;
}

.break, .image-3 {
  width: 100%;
}

.image-4 {
  height: 300px;
  transform: translate(169px);
}

.image-5 {
  width: 100%;
}

.ring {
  width: 80px;
}

.image-6 {
  width: 100%;
  height: 200px;
}

.image-7 {
  width: 25%;
  height: 200px;
}

.image-8 {
  width: 50%;
  height: 50%;
}

.image-9 {
  width: 500px;
  height: 100%;
}

.image-10 {
  mix-blend-mode: multiply;
  max-width: 30%;
}

.image-11 {
  mix-blend-mode: darken;
}

.leaves {
  mix-blend-mode: multiply;
  width: 25%;
  margin-top: 5px;
  margin-bottom: 5px;
}

.leaves.bottom {
  transform: rotate(180deg);
}

.leaves.final {
  opacity: 1;
  mix-blend-mode: soft-light;
  width: 30%;
  padding-top: 10px;
}

.leaves.big {
  mix-blend-mode: overlay;
  width: 15%;
}

.save-the-date {
  opacity: .79;
  color: #856d4b;
  text-align: center;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #ff6ebc3d;
  margin-top: 10px;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
  font-family: WindSong, sans-serif;
  font-size: 100px;
  line-height: 80%;
}

.image-12 {
  width: 50%;
}

.date {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-image: url('../images/e8c0e0e28c680f059ad95b897390f33a.jpg');
  background-position: 50%;
  background-repeat: repeat;
  background-size: contain;
  background-attachment: scroll;
  border: 3px dotted #ffbef0;
  border-radius: 20px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin: 20px;
  padding: 30px 15px 15px;
  display: flex;
  box-shadow: 0 2px 13px -4px #0003;
}

.rsvp {
  background-color: #ffe8ec;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.navbar {
  background-color: #fefcf0;
  border-radius: 20px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 80%;
}

.brand {
  background-image: url('../images/Asset-01.png');
  background-position: 50%;
  background-size: contain;
  background-attachment: scroll;
}

.image-13 {
  width: 40%;
}

.brush {
  width: 500px;
  transform: translate(0);
}

.brush.left {
  opacity: .62;
  justify-content: flex-start;
  align-items: center;
  width: 40%;
}

.brush.right {
  opacity: .45;
  width: 40%;
}

.message {
  color: #adadad;
  width: 100%;
  margin-top: 40px;
  font-family: Georgia, Times, Times New Roman, serif;
  font-size: 20px;
  line-height: 100%;
}

.rsvp-block {
  background-image: url('../images/Dự-án-mới.png');
  background-position: 50%;
  background-repeat: repeat;
  background-size: 1100px 800px;
  background-attachment: scroll;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 800px;
  display: flex;
}

.background-video {
  width: 100%;
  height: 100%;
}

.body-2 {
  height: 100%;
}

.button-2 {
  display: flex;
}

.button-2.w--current {
  display: inline-block;
}

.loading {
  display: none;
}

.background-video-2 {
  width: 100%;
  height: 100%;
}

.page-loader {
  z-index: 9999;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  display: block;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.page-loader.section {
  z-index: 1;
  float: left;
  clear: right;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: block;
  position: static;
  inset: 0%;
}

.big-ass-header {
  z-index: 1;
  color: #ff8961;
  text-align: center;
  text-transform: capitalize;
  width: 95vw;
  max-width: 11ch;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
  font-size: 150px;
  font-weight: 800;
  line-height: 100%;
  position: relative;
}

.scatter-blob-1 {
  z-index: -1;
  width: 200px;
  position: absolute;
  inset: 25% auto auto 250px;
}

.scatter-blob-1.loader-1 {
  z-index: 0;
  width: 25vw;
  inset: 12% 12% auto auto;
}

.scatter-blob-1.loader-2 {
  z-index: 0;
  width: 25vw;
  inset: auto auto 12% 12%;
}

.background-video-3, .video {
  width: 100%;
  height: 100%;
}

.background-video-4 {
  width: 100%;
  display: block;
}

.loading-page {
  width: 100%;
  height: 100%;
}

.body-3 {
  background-image: url('../images/e8c0e0e28c680f059ad95b897390f33a.jpg');
  background-position: 50%;
  background-size: contain;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.big-text {
  color: #70153c;
  text-align: center;
  text-shadow: 1px 1px 2px #fc9d9dc2;
  font-family: Birthstone Bounce, sans-serif;
  font-size: 80px;
  font-weight: 400;
  line-height: 200%;
}

.div-block-2 {
  width: 100%;
}

.thank-you-text {
  color: #ac2964;
  text-align: center;
  text-shadow: 1px 1px 1px #fff;
  flex-flow: column;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: auto;
  height: auto;
  margin: 20px 60px;
  font-family: Vollkorn, serif;
  font-size: 32px;
  line-height: 100%;
}

.text-block {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 500px;
}

.body-4 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.bold-text {
  color: #a7597e;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #a953b6;
  text-shadow: 2px 1px 1px #0003;
  font-family: Ms Madi, sans-serif;
  font-size: 100px;
  font-weight: 400;
  line-height: 10%;
}

.bold-text.khong {
  color: #c01b5a;
  text-align: justify;
  -webkit-text-stroke-color: #5ab8e4bd;
  text-shadow: 1px 1px 1px #fff;
  background-image: none;
  margin-left: 40px;
  margin-right: 40px;
  font-family: Birthstone Bounce, sans-serif;
  line-height: 120%;
}

.thank-you {
  background-image: url('../images/pastel-watercolor-053bu3wtho0bzjxc.jpg');
  background-position: 50%;
  background-repeat: repeat-y;
  background-size: cover;
  background-attachment: fixed;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.sign {
  color: #985d8096;
  font-family: WindSong, sans-serif;
  font-size: 50px;
  line-height: 200%;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  width: 260px;
  display: flex;
}

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.body-5 {
  background-image: url('../images/pastel-watercolor-053bu3wtho0bzjxc.jpg');
  background-position: 0 0;
  background-size: auto;
}

.khong {
  background-image: url('../images/pastel-watercolor-053bu3wtho0bzjxc.jpg');
  background-position: 0 0;
  background-size: auto;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.cam-on-nha {
  color: #ac2964;
  text-align: center;
  text-shadow: 2px 1px 1px #fff;
  margin-left: 40px;
  margin-right: 40px;
  font-family: Vollkorn, serif;
  font-size: 35px;
  line-height: 120%;
}

.khong-text {
  text-align: justify;
  margin-left: 40px;
  margin-right: 40px;
  font-family: Vollkorn, serif;
}

.map {
  width: 50px;
  height: 50px;
}

.navbar-2 {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  width: 95%;
  max-width: 1200px;
  height: 10%;
  display: flex;
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translate(-50%);
}

.corner-blob-wrapper {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.corner-blob {
  z-index: -1;
  width: 20px;
  height: 20px;
  position: absolute;
  inset: -.1em auto auto -.45em;
}

.corner-blob.nav-link-blob {
  top: -.25em;
}

.corner-blob.nav-link-blob.nav-bar-blob {
  inset: .75em auto auto .75em;
}

.navigation {
  justify-content: center;
  align-items: flex-start;
}

.button-3 {
  color: #fff;
  text-align: center;
  background-color: #f7859c;
  border-radius: 12px;
  padding: 15px 30px;
  font-weight: 700;
  transition: background-color .2s cubic-bezier(.455, .03, .515, .955), transform .2s cubic-bezier(.455, .03, .515, .955);
  transform: translate(2px, -2px);
  box-shadow: -2px 2px 0 2px #000000b0;
}

.button-3:hover {
  color: #222;
  background-color: #9fd8e5;
  transform: none;
  box-shadow: -1px 1px 0 1px #000000b0;
}

.nav-menu {
  justify-content: center;
  align-items: center;
  display: flex;
}

.brand-2 {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
}

.nav-link {
  color: #222;
  cursor: pointer;
  font-weight: 600;
  text-decoration: none;
}

.nav-link.w--current {
  color: #222;
}

.logo {
  mix-blend-mode: soft-light;
  background-color: #ffe0e7;
  border-radius: 20px;
  display: block;
}

.navbar-3 {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #ffffffd9;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 20px;
  font-size: 85%;
  display: flex;
  position: fixed;
  inset: 0% auto auto 0%;
}

.text-block-2 {
  font-family: Ms Madi, sans-serif;
  font-size: 30px;
}

.main {
  color: #c01b5a;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #6cb8ff91;
  text-shadow: 1px 1px 1px #fff;
  padding-bottom: 60px;
  font-family: Birthstone Bounce, sans-serif;
  font-size: 120px;
}

.main.info {
  margin-top: 50px;
  margin-bottom: 30px;
  padding-bottom: 0;
  line-height: 1;
}

.info-text {
  color: #ac2964;
  text-align: justify;
  border: 3px dashed #ac2964;
  border-radius: 15px;
  padding: 20px;
  font-family: Exo, sans-serif;
  font-size: 25px;
  font-weight: 600;
  line-height: 1.2;
}

.info-text.side {
  text-align: center;
  width: 50%;
}

.info-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 800px;
  margin-bottom: 25px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.event-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.code-embed, .hidden-yes, .hidden-no {
  display: none;
}

.page-loader-2 {
  z-index: 9999;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.loading-page-2 {
  width: 100%;
  height: 100%;
  display: block;
}

.name-2 {
  color: #58926f;
  text-align: center;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #d87497ad;
  text-shadow: 2px 1px 4px #0003;
  flex-flow: column;
  justify-content: center;
  align-items: stretch;
  padding-top: 10px;
  font-size: 240px;
  display: flex;
}

.text-2 {
  color: #9a8d72;
  text-align: center;
  letter-spacing: 2px;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #ff000047;
  text-shadow: 2px 1px 1px #fff;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 30%;
  font-family: Exo, sans-serif;
  font-size: 30px;
  line-height: 120%;
}

.text-2.stephen-thanh {
  opacity: 1;
  color: #f8c9d000;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #caa6ac;
  margin-top: 10px;
  margin-left: 40px;
  margin-right: 40px;
  padding-bottom: 10px;
  font-family: WindSong, sans-serif;
  font-size: 50px;
}

.text-2.stephen-thanh.bottom {
  -webkit-text-stroke-color: #e7b8b994;
  margin-top: 0;
  padding-bottom: 0;
  font-family: WindSong, sans-serif;
  font-size: 70px;
  font-style: italic;
}

.text-2.up {
  letter-spacing: 2px;
  font-family: Exo, sans-serif;
  font-size: 30px;
}

.text-2.main {
  color: #e72c4e;
  letter-spacing: 2px;
  -webkit-text-stroke-color: #bdb0848f;
  margin: 10px 20px;
  padding-bottom: 10px;
  font-family: Birthstone Bounce, sans-serif;
  font-size: 700%;
  line-height: 100%;
}

.mask-3 {
  border: 3px solid #fff;
  border-radius: 20px;
  box-shadow: inset 2px 6px 3px #0003;
}

.day-2 {
  color: #8d578d;
  text-align: center;
  letter-spacing: 3px;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #cf585a75;
  text-transform: none;
  font-family: Alex Brush, sans-serif;
  font-size: 70px;
  font-style: normal;
  line-height: 100%;
}

.infor-2 {
  opacity: 1;
  color: #a06b85;
  text-align: center;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  font-family: Times New Roman, TimesNewRoman, Times, Baskerville, Georgia, serif;
  font-size: 35px;
  line-height: 150%;
}

.rsvp-text-2 {
  opacity: .81;
  color: #cc979700;
  text-align: center;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #f1a9ab;
  font-family: WindSong, sans-serif;
  font-size: 100px;
  line-height: 100px;
}

.rsvp-block-2 {
  background-image: url('../images/Dự-án-mới.png');
  background-position: 50%;
  background-repeat: repeat;
  background-size: 1100px 800px;
  background-attachment: scroll;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 800px;
  display: flex;
}

.message-2 {
  color: #b64e71;
  text-align: center;
  width: 100%;
  margin-top: 40px;
  margin-bottom: 40px;
  font-family: Varela Round, sans-serif;
  font-size: 20px;
  font-style: italic;
  line-height: 120%;
}

.message-2.bottom {
  font-family: Varela Round, sans-serif;
  font-style: italic;
}

.submit-button-4 {
  text-align: center;
  background-color: #ff8eb1;
  border-radius: 20px;
  width: 200px;
}

.submit-button-4.no {
  margin-bottom: 15px;
}

.submit-button-4.yes {
  text-align: center;
  margin-bottom: 15px;
}

.page-loader-viet {
  z-index: 9999;
}

.background-video-5 {
  z-index: -99999;
  width: 100%;
}

@media screen and (max-width: 991px) {
  .welcome-head {
    font-size: 120px;
  }

  .name {
    font-size: 180px;
  }

  .text {
    height: auto;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 25px;
    line-height: 150%;
  }

  .text.main {
    font-size: 600%;
  }

  .text.stephen-thanh {
    font-size: 40px;
  }

  .text.up {
    padding-bottom: 0;
  }

  .information {
    flex-flow: column;
    justify-content: center;
    align-items: center;
    height: 800px;
    display: flex;
  }

  .day {
    color: #9e5656d1;
    flex-flow: row;
    justify-content: center;
    align-items: stretch;
    padding-top: 0;
    font-size: 45px;
    line-height: 100%;
  }

  .infor {
    color: #b8668e;
    font-size: 25px;
    line-height: 45px;
  }

  .rsvp-text {
    color: #e27e7f00;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #f1a9ab;
    font-size: 80px;
    line-height: 100px;
  }

  .button {
    padding-bottom: 140px;
  }

  .text2 {
    color: #8f747d;
    font-size: 80px;
  }

  .submit-button-2.yes {
    width: 150px;
  }

  .submit-button-2.no {
    width: 150px;
    margin-bottom: 15px;
  }

  .pic {
    padding-top: 100px;
  }

  .pics-slide {
    height: 100%;
  }

  .img-slide {
    box-sizing: border-box;
    aspect-ratio: 2;
    object-fit: cover;
  }

  .slide-nav {
    line-height: 17px;
  }

  .form {
    flex-flow: column;
    justify-content: center;
    align-items: center;
  }

  .form-3 {
    width: 500px;
    margin-left: 10px;
    margin-right: 10px;
  }

  .text-yes {
    text-align: center;
    font-size: 30px;
    line-height: 50px;
  }

  .text-field {
    width: 90%;
  }

  .submit-button-3 {
    transform: none;
  }

  .leaves.final {
    width: 30%;
  }

  .save-the-date {
    font-size: 65px;
  }

  .date {
    justify-content: center;
    align-items: center;
  }

  .message {
    color: #8a8a8a;
    padding-bottom: 10px;
  }

  .page-loader {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: none;
    inset: 0% auto 0% 0%;
  }

  .big-ass-header {
    font-size: 15vw;
  }

  .scatter-blob-1 {
    left: 100px;
  }

  .scatter-blob-1.loader-1, .scatter-blob-1.loader-2 {
    width: 30vw;
  }

  .big-text {
    font-size: 60px;
  }

  .thank-you-text {
    color: #ac2964;
    text-align: justify;
    text-shadow: 1px 1px 1px #fff;
    width: auto;
    height: auto;
    margin-left: 40px;
    margin-right: 40px;
    font-family: Vollkorn, serif;
    font-size: 25px;
    display: flex;
  }

  .bold-text {
    margin-left: 10px;
    margin-right: 10px;
    line-height: 30%;
  }

  .thank-you {
    justify-content: center;
    align-items: center;
  }

  .sign {
    color: #985d8070;
  }

  .cam-on-nha {
    color: #ad2358;
  }

  .icon-2 {
    color: #000;
  }

  .navbar-2 {
    justify-content: space-between;
    align-items: center;
  }

  .menu-button {
    order: 1;
  }

  .menu-button.w--open {
    background-color: #0000;
  }

  .corner-blob.nav-link-blob.nav-bar-blob {
    opacity: 0;
  }

  .nav-menu {
    background-color: #ffdbb4;
    background-image: linear-gradient(45deg, #ffdbb4 31%, #9093d1);
    border: 2px solid #9093d1;
    border-radius: 50px;
  }

  .brand-2 {
    order: -1;
  }

  .nav-link {
    text-align: center;
  }

  .main {
    color: #c01b5a;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #008cff9e;
    text-shadow: 2px 1px #fff;
    padding-bottom: 40px;
    font-family: Birthstone Bounce, sans-serif;
    font-size: 100px;
  }

  .info-block {
    width: 750px;
  }

  .page-loader-2 {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: none;
    inset: 0% auto 0% 0%;
  }

  .name-2 {
    font-size: 180px;
  }

  .text-2 {
    height: auto;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 25px;
    line-height: 150%;
  }

  .text-2.stephen-thanh {
    font-size: 40px;
  }

  .text-2.up {
    padding-bottom: 0;
  }

  .text-2.main {
    font-size: 600%;
  }

  .day-2 {
    color: #9e5656de;
    flex-flow: row;
    justify-content: center;
    align-items: stretch;
    padding-top: 0;
    font-family: Birthstone Bounce, sans-serif;
    font-size: 45px;
    line-height: 100%;
  }

  .infor-2 {
    color: #b8668e;
    font-size: 25px;
    line-height: 45px;
  }

  .rsvp-text-2 {
    color: #e27e7f00;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #f1a9ab;
    font-size: 80px;
    line-height: 100px;
  }

  .message-2 {
    color: #b64e71;
    padding-bottom: 10px;
  }

  .submit-button-4.no {
    width: 200px;
    margin-bottom: 15px;
  }

  .submit-button-4.yes {
    width: 200px;
  }
}

@media screen and (max-width: 767px) {
  .welcome-head {
    -webkit-text-stroke-width: 1px;
    font-size: 90px;
    font-weight: 600;
  }

  .name {
    color: #6a9b69;
    -webkit-text-stroke-width: 1px;
    font-size: 150px;
  }

  .welcome {
    height: 350px;
  }

  .introduction {
    height: 400px;
  }

  .text {
    padding-top: 20px;
    font-size: 24px;
    line-height: 120%;
  }

  .text.main {
    margin-left: 10px;
    margin-right: 10px;
    padding-bottom: 0;
    font-size: 420%;
  }

  .text.stephen-thanh {
    font-size: 35px;
  }

  .text.up {
    line-height: 100%;
  }

  .information {
    height: 700px;
    padding-top: 0;
  }

  .day {
    color: #a54f3e;
    font-size: 35px;
    line-height: 120%;
  }

  .infor {
    font-size: 20px;
    line-height: 40px;
  }

  .rsvp-text {
    color: #ffffffb0;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #f1a9ab;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 50px;
    line-height: 50px;
  }

  .button {
    padding-bottom: 120px;
  }

  .text2 {
    color: #7f626c;
    font-size: 70px;
  }

  .submit-button-2.yes, .submit-button-2.no {
    width: 120px;
  }

  .pic {
    padding-top: 60px;
  }

  .img-slide {
    aspect-ratio: 16 / 9;
  }

  .slide-nav {
    line-height: 17px;
  }

  .form-3 {
    width: 400px;
    margin-left: 40px;
    margin-right: 40px;
  }

  .text-yes {
    font-size: 25px;
    line-height: 40px;
  }

  .submit-button-3 {
    margin-top: 20px;
    transform: none;
  }

  .ring {
    width: 60px;
    padding-top: 40px;
  }

  .leaves {
    width: 40%;
  }

  .leaves.bottom {
    width: 30%;
  }

  .leaves.final {
    padding-top: 0;
  }

  .save-the-date {
    color: #81663e;
    padding-bottom: 20px;
  }

  .date {
    width: 450px;
    margin-left: 10px;
    margin-right: 10px;
  }

  .brush.right {
    opacity: .3;
  }

  .message {
    margin-top: 0;
    padding-bottom: 0;
    font-size: 15px;
  }

  .rsvp-block {
    background-position: 50%;
    background-size: cover;
    height: 620px;
  }

  .scatter-blob-1 {
    top: 15%;
    left: 0;
  }

  .scatter-blob-1.loader-1 {
    top: 25%;
  }

  .scatter-blob-1.loader-2 {
    bottom: 25%;
  }

  .big-text {
    font-size: 40px;
  }

  .thank-you-text {
    text-align: justify;
    margin-left: 20px;
    margin-right: 20px;
    font-size: 28px;
  }

  .bold-text.khong {
    text-align: center;
    -webkit-text-stroke-color: #5ab8e478;
    margin-top: 40px;
    margin-left: 20px;
    margin-right: 20px;
    font-size: 70px;
  }

  .sign {
    color: #985d8091;
    text-align: center;
    font-size: 30px;
  }

  .cam-on-nha {
    color: #af1f56;
    margin-left: 20px;
    margin-right: 20px;
    font-size: 25px;
  }

  .button-3 {
    opacity: 1;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 16px;
  }

  .nav-link {
    text-align: center;
    font-size: 16px;
  }

  .main {
    color: #c01b5a;
    text-align: center;
    -webkit-text-stroke-color: #008cff75;
    padding-bottom: 20px;
    font-size: 70px;
    line-height: 100%;
  }

  .info-text.side, .info-block {
    width: 100%;
  }

  .event-block {
    flex-flow: column;
  }

  .name-2 {
    color: #6a9b69;
    -webkit-text-stroke-width: 1px;
    font-size: 150px;
  }

  .text-2 {
    font-size: 18px;
    line-height: 120%;
  }

  .text-2.stephen-thanh {
    font-size: 35px;
  }

  .text-2.stephen-thanh.bottom {
    -webkit-text-stroke-color: #e7b8b9b8;
    text-shadow: none;
    padding-top: 20px;
    font-size: 40px;
  }

  .text-2.up {
    font-size: 18px;
    line-height: 100%;
  }

  .text-2.main {
    margin-left: 10px;
    margin-right: 10px;
    padding-bottom: 0;
    font-size: 500%;
  }

  .day-2 {
    color: #a54f3e;
    font-family: Birthstone Bounce, sans-serif;
    font-size: 45px;
    line-height: 100%;
  }

  .infor-2 {
    font-size: 25px;
    line-height: 45px;
  }

  .rsvp-text-2 {
    color: #ffffffb0;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #f1a9ab;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 50px;
    line-height: 50px;
  }

  .rsvp-block-2 {
    background-position: 50%;
    background-size: cover;
    height: 620px;
    padding: 30px 20px;
  }

  .message-2 {
    margin-top: 0;
    padding-bottom: 0;
    font-size: 15px;
  }

  .message-2.bottom {
    margin-top: 20px;
    margin-bottom: 0;
  }
}

@media screen and (max-width: 479px) {
  .welcome-head {
    padding-top: 20px;
    font-size: 60px;
  }

  .name {
    font-size: 80px;
  }

  .welcome {
    flex-flow: row;
    flex: 0 auto;
    justify-content: center;
    align-items: center;
    height: 250px;
  }

  .body {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    background-color: #fffdf0;
    flex-flow: column;
    justify-content: space-around;
    align-items: center;
    display: flex;
  }

  .introduction {
    height: auto;
  }

  .text {
    letter-spacing: 1px;
    height: auto;
    margin-left: 10px;
    margin-right: 10px;
    padding-top: 10px;
    font-size: 20px;
    line-height: 100%;
  }

  .text.main {
    height: auto;
    font-size: 250%;
    font-weight: 500;
  }

  .text.stephen-thanh {
    margin-left: 20px;
    margin-right: 20px;
    padding-top: 0;
    font-size: 25px;
  }

  .text.up {
    height: auto;
    padding-top: 0;
    padding-bottom: 0;
  }

  .information {
    background-image: none;
    height: auto;
  }

  .day {
    text-align: center;
    padding-top: 10px;
    font-size: 25px;
    line-height: 120%;
  }

  .infor {
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 15px;
    line-height: 30px;
  }

  .yes---no {
    padding-top: 20px;
  }

  .rsvp-text {
    color: #fff0;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #f1aaab;
    font-size: 50px;
  }

  .text2 {
    font-size: 60px;
  }

  .pic {
    height: auto;
  }

  .pics-slide {
    margin-left: 10px;
    margin-right: 10px;
  }

  .img-slide {
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }

  .slide-nav {
    line-height: 14px;
  }

  .guess-information {
    font-size: 70px;
  }

  .form-3 {
    width: 80vw;
    height: auto;
    margin-left: 20px;
    margin-right: 20px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .text-yes {
    font-size: 25px;
  }

  .text-field {
    margin-left: 10px;
    margin-right: 10px;
  }

  .submit-button-3 {
    font-size: 20px;
    line-height: 10px;
    transform: none;
  }

  .ring {
    width: 60px;
  }

  .leaves {
    width: 30%;
  }

  .leaves.final {
    padding-top: 0;
  }

  .save-the-date {
    margin-top: 60px;
    padding-top: 20px;
    font-size: 40px;
  }

  .date {
    width: auto;
    margin-bottom: 60px;
    margin-left: 15px;
    margin-right: 15px;
  }

  .brush.left {
    width: 40%;
  }

  .message {
    margin-left: 10px;
    margin-right: 10px;
    padding-bottom: 0;
  }

  .rsvp-block {
    background-size: cover;
    justify-content: center;
    align-items: center;
    height: 500px;
  }

  .page-loader {
    display: none;
  }

  .scatter-blob-1.loader-1 {
    width: 45vw;
    max-width: 150px;
    top: 35%;
  }

  .scatter-blob-1.loader-2 {
    width: 45vw;
    max-width: 150px;
    bottom: 35%;
  }

  .big-text {
    font-size: 40px;
  }

  .thank-you-text {
    text-align: justify;
    font-size: 20px;
  }

  .bold-text.khong {
    margin-left: 10px;
    margin-right: 10px;
    font-size: 50px;
  }

  .sign {
    color: #b44b8ab8;
    font-size: 25px;
  }

  .cam-on-nha {
    color: #b94874;
    margin-left: 5px;
    margin-right: 5px;
  }

  .menu-button.w--open {
    color: #000;
  }

  .button-3 {
    padding: 10px 20px;
    font-size: 14px;
  }

  .nav-link {
    text-align: center;
    font-size: 14px;
  }

  .main {
    -webkit-text-stroke-color: #008cff47;
    font-size: 50px;
  }

  .info-text {
    font-size: 20px;
  }

  .page-loader-2 {
    display: none;
  }

  .name-2 {
    font-size: 80px;
  }

  .text-2 {
    letter-spacing: 1px;
    height: auto;
    margin-left: 10px;
    margin-right: 10px;
    padding-top: 10px;
    font-size: 15px;
    line-height: 100%;
  }

  .text-2.stephen-thanh {
    margin-left: 20px;
    margin-right: 20px;
    padding-top: 0;
    font-size: 25px;
  }

  .text-2.up {
    padding-top: 0;
    padding-bottom: 0;
    font-size: 15px;
  }

  .text-2.main {
    height: auto;
    font-size: 300%;
    font-weight: 500;
  }

  .day-2 {
    text-align: center;
    font-family: Birthstone Bounce, sans-serif;
    font-size: 35px;
    line-height: 100%;
  }

  .infor-2 {
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 25px;
    line-height: 35px;
  }

  .rsvp-text-2 {
    color: #fff0;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #f1aaab;
    font-size: 50px;
  }

  .rsvp-block-2 {
    background-size: cover;
    justify-content: center;
    align-items: center;
    height: auto;
    padding: 30px 20px;
  }

  .message-2 {
    margin-left: 10px;
    margin-right: 10px;
    padding-bottom: 0;
  }

  .submit-button-4.yes {
    padding-left: 10px;
    padding-right: 10px;
  }
}