#marcolesly img {
  position: fixed;
  top: 0;
  left: 0;
  overflow: auto;
  pointer-events: none;
}

#marcolesly2 img {
  position: fixed;

  right: 0;
  bottom: 0;
  overflow: auto;
  pointer-events: none;
}

#esquina-rose img {
  position: fixed;

  left: -5px;
  bottom: -5px;

  pointer-events: none;
}

#esquina-rose-top img {
  position: fixed;

  top: -5px;
  right: -5px;

  pointer-events: none;
}
#esquina-rose-top {
  position: fixed;
}

#mariposa {
  position: fixed;
  pointer-events: none;
  top: 35px;
  left: 10px;
}

#mariposa2 {
  position: fixed;
  pointer-events: none;
  bottom: 135px;
  right: -10px;
}

#border1 {
  position: fixed;
  pointer-events: none;
  top: 30px;
  right: 30px;
  bottom: 30px;
  left: 50px;

  z-index: 100;
  border: 4px solid transparent;
  border-style: solid;
  border-width: 2px;
  border-image: repeating-linear-gradient(#a7a7a7 40%, #ddd 55%, #a7a7a7 70%);
  border-image: -webkit-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image: -moz-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image: -o-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image-slice: 1;
  box-shadow: rgba(0, 0, 0, 0.07) 0px 0px 0px, rgba(0, 0, 0, 0.07) 0px 0px 0px,
    rgba(0, 0, 0, 0.07) 0px 0px 0px, rgba(0, 0, 0, 0.07) 0px 0px 0px,
    rgba(0, 0, 0, 0.07) 0px 0px 0px;
  z-index: -11;
}
#border2 {
  position: fixed;
  pointer-events: none;
  top: 20px;
  right: 30px;
  bottom: 40px;
  left: 40px;
  transform: rotate(-2deg);
  border: 3px black solid;
  z-index: 100;
  border: 4px solid transparent;
  border-style: solid;
  border-width: 2px;
  border-image: repeating-linear-gradient(#a7a7a7 40%, #ddd 55%, #a7a7a7 70%);
  border-image: -webkit-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image: -moz-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image: -o-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image-slice: 1;
  box-shadow: rgba(0, 0, 0, 0.07) 0px 0px 0px, rgba(0, 0, 0, 0.07) 0px 0px 0px,
    rgba(0, 0, 0, 0.07) 0px 0px 0px, rgba(0, 0, 0, 0.07) 0px 0px 0px,
    rgba(0, 0, 0, 0.07) 0px 0px 0px;
  z-index: -11;
}
#border3 {
  position: fixed;
  pointer-events: none;
  top: 20px;
  right: 20px;
  bottom: 30px;
  left: 40px;
  transform: rotate(-9deg);
  border: 3px black solid;
  z-index: 100;
  border: 4px solid transparent;
  border-style: solid;
  border-width: 2px;
  border-image: repeating-linear-gradient(#a7a7a7 40%, #ddd 55%, #a7a7a7 70%);
  border-image: -webkit-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image: -moz-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image: -o-repeating-linear-gradient(
    95deg,
    #a7a7a7 40%,
    #ddd 55%,
    #a7a7a7 70%
  );
  border-image-slice: 1;
  box-shadow: rgba(0, 0, 0, 0.07) 0px 0px 0px, rgba(0, 0, 0, 0.07) 0px 0px 0px,
    rgba(0, 0, 0, 0.07) 0px 0px 0px, rgba(0, 0, 0, 0.07) 0px 0px 0px,
    rgba(0, 0, 0, 0.07) 0px 0px 0px;
  z-index: -11;
}
@media (max-width: 800px) {
  .page-id-4410 #confirmation-boton {
    bottom: 15px !important;
    right: 15px !important;
    left: auto !important;
    position: fixed;
  }
  .principal,
  .principal2 {
    bottom: 15px !important;
    right: 15px !important;
    width: 150px;
    height: 40px;
    font-size: 16px;
    text-align: center;
    line-height: 40px;
    color: rgba(255, 255, 255, 0.9);
    border-radius: 50px;
    background-size: 600%;

    z-index: 10000;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  }

  .principal2 {
    position: absolute;

    z-index: -1;

    opacity: 0;
  }
}
.confirmed1 .principal,
.confirmed1 .principal2 {
  background: linear-gradient(-45deg, #19675e, #51c28f, #19675e, #51c28f);
  background-size: 600%;
  -webkit-animation: anime 16s linear infinite;
  animation: anime 16s linear infinite;
}
.noconfirm .principal,
.noconfirm .principal2 {
  background: linear-gradient(-45deg, #ff4848, #ff8e7a, #ff5252, #ff8e7a);
  background-size: 600%;
  -webkit-animation: anime 16s linear infinite;
  animation: anime 16s linear infinite;
}

#invitado2 {
  min-height: 30px;
  display: inline-block;
  opacity: 0;
  transition: opacity 1s;
}

.text-green {
  background-color: #f3ec78;
  background-image: linear-gradient(-45deg, #19675e, #51c28f, #19675e, #51c28f);
  background-size: 600%;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-text-fill-color: transparent;
  -webkit-animation: anime 16s linear infinite;
  animation: anime 16s linear infinite;
}

.text-green1 {
  background-color: #f3ec78;
  background-image: linear-gradient(-45deg, #19675e, #23a6d5, #e73c7e, #ee7752);
  background-size: 600%;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-text-fill-color: transparent;
  -webkit-animation: anime 8s linear infinite;
  animation: anime 8s linear infinite;
}

@-webkit-keyframes anime {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes anime {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
