/********* HEADER ***********/
:root {
	--blanco: #ffffff;
	--negro: #3e434d;
	--gris1: #f5f8ff;
  --gris2: #eaf1ff;
  --marino1: #2f3444;
  --marino2: #252b3d;
  --rojo1: #cd133f;
  --morado1: #9047d8;
  --celeste1: #acd9ff;
}
.bg-blanco{background-color: var(--blanco); transition: .2s;}
.bg-negro{background-color: var(--negro); transition: .2s;}
.bg-gris-1{background-color: var(--gris1); transition: .2s;}
.bg-gris-2{background-color: var(--gris2); transition: .2s;}
.bg-marino-1{background-color: var(--marino1); transition: .2s;}
.bg-marino-2{background-color: var(--marino2); transition: .2s;}
.bg-rojo-1{background-color: var(--rojo1); transition: .2s;}
.bg-morado-1{background-color: var(--morado1); transition: .2s;}
.bg-celeste-1{background-color: var(--celeste1); transition: .2s;}


.bg-gradient-celeste{
  background: #EEF3F9;
  background: linear-gradient(24deg, rgba(238, 243, 249, 1) 0%, rgba(204, 221, 255, 1) 60%, rgba(226, 185, 209, 1) 89%);
}
.bg-gradient-rojo{
  background: var(--rojo1);
  background: linear-gradient(90deg, var(--rojo1) 0%, #ff0202 100%);
}
.bg-gradient-morado{
  background: var(--rojo1);
  background: linear-gradient(90deg, var(--morado1) 0%, #9812b1 100%);
}

.bg-rojo-1-hov:hover{
  background-color: var(--rojo1);
  transition: .2s;
}

.t-blanco{color: var(--blanco) !important;}
.t-negro{color: var(--negro) !important;}
.t-gris-1{color: var(--gris1) !important;}
.t-rojo-1{color: var(--rojo1) !important;}
.t-morado-1{color: var(--morado1) !important;}
.t-celeste-1{color: var(--celeste1) !important;}

.btn-1, .wpuf-submit-button{
  background-image: linear-gradient(to right, #ff0404 0%, var(--rojo1) 51%, #ff0404 100%);
     padding: 10px 25px;
    font-size: 17px;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: var(--blanco) !important;
    border-radius: 30px;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer;
}
.btn-2{
  background-image: linear-gradient(to right, #DA22FF 0%, var(--morado1) 51%, #DA22FF 100%);
    padding: 10px 25px;
    font-size: 17px;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: var(--blanco) !important;
    border-radius: 30px;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer;
}
.btn-3, .wpuf-multistep-next-btn, .wpuf-multistep-prev-btn{
  background-image: linear-gradient(to right, #77c1ff 0%, var(--celeste1) 51%, #77c1ff 100%);
    padding: 10px 25px;
    font-size: 17px;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: var(--marino1) !important;
    border-radius: 30px;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer;
}

.btn-4{
  background-image: linear-gradient(to right, #eff4ff 0%, var(--blanco) 51%, #eff4ff 100%);
    padding: 10px 25px;
    font-size: 17px;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: var(--marino1) !important;
    border-radius: 30px;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer;
}
.btn-1:hover, .btn-2:hover, .btn-3:hover, .btn-4:hover{
  background-position: right center;
}

ul.list-celeste {
  list-style: none;
}
.list-celeste li {
    position: relative;
    color: var(--blanco);
}
.list-celeste li::before {
    content: "\F59B";
    font-family: bootstrap-icons;
    color: var(--celeste1);
    font-size: 19px;
    position: absolute;
    left: -25px;
    top: -2px;
}
ul.list-rojo {
  list-style: none;
}
.list-rojo li {
    position: relative;
    color: var(--marino1);
}
.list-rojo li::before {
    content: "\F59B";
    font-family: bootstrap-icons;
    color: var(--rojo1);
    font-size: 19px;
    position: absolute;
    left: -25px;
    top: -2px;
}

h1, h2 {
  font-family: "Poppins", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-size: 40px;
}
h3, h4, h5, h6, p, a, span, li {
  font-family: "Poppins", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}
a{
  text-decoration: none !important;
  color: var(--negro);
}

nav a{
  color: var(--gris1) !important;
  text-decoration: none !important;
}
.cont-logo{
    position: relative;
    display: flex;
    justify-content: end;
    align-items: center;
}
.logo-principal{
  max-height: 50px;
}

#menu-principal .links a{
  padding: 13px 10px;
    border-right: 1px solid #ffffff26;
}
#menu-principal .links a:last-child{
  padding: 13px 10px;
    border-right: none;
}
.bg-s1-h{
      background: #EEF3F9;
    background: linear-gradient(24deg, rgba(238, 243, 249, 1) 0%, rgba(204, 221, 255, 1) 60%, rgba(226, 185, 209, 1) 89%);
    width: 95%;
    margin: 0 auto;
    border-radius: 0px 0px 90px 90px;
}
.p-nav{
    padding-top: 70px;
}

.box-shadow{
  box-shadow: 0px 0px 20px 0px #b1bed7;
    transition: .2s;
}
.hover-shadow{
  transition: .2s;
}
.hover-shadow:hover{
  box-shadow: 0px 0px 20px 0px #b1bed7;
    transition: .2s;
}


#home-s2 .per{
      background-color: #9e53e7;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0px 0px 50px 0px #4b175445;
}
.pasos-tag{
  box-shadow: 0px 0px 20px 0px #b1bed7;
    background-color: var(--blanco);
    text-align: center;
    padding: 30px 10px;
    border-radius: 15px;
    cursor: pointer;
    transition: .2s;
}
i.pasos{
      position: absolute;
    right: -23px;
    top: 50%;
    bottom: 50%;
    margin: auto;
    font-size: 35px;
    background-color: #ffffff;
    padding: 6px;
    border-radius: 100%;
    height: 46px;
    width: 46px;
    display: flex;
    z-index: 2;
    transition: .2s;
}
.paso-ico-1{
      background-image: url(../img/home-pasos-1.png);
    height: 90px;
    width: 90%;
    max-width: 185px;
    background-size: 70px;
    text-align: center;
    background-position: top;
    background-repeat: no-repeat;
    margin: 0 auto;
    border-bottom: 3px solid var(--rojo1);
    transition: .2s;
}
.pasos-tag p{
  font-size: 15px;
    padding-top: 10px;
    display: block;
    transition: .2s;
    margin-bottom: 0px;
}
.pasos-tag span.num-paso{
  background-color: var(--celeste1);
    color: var(--marino1);
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 13px;
    padding: 2px 13px;
    border-radius: 20px;
    font-weight: 500;
}
.pasos-tag:hover{
  background-color: var(--rojo1);
  transition: .2s;
}
.pasos-tag:hover .paso-ico-1{
  background-image: url(../img/home-pasos-1-hov.png);
  border-bottom: 3px solid var(--celeste1);
  transition: .2s;
}
.pasos-tag:hover p{
  color: var(--blanco);
  transition: .2s;
}
.paso-ico-2{
      background-image: url(../img/home-pasos-2.png);
    height: 90px;
    width: 90%;
    max-width: 185px;
    background-size: 70px;
    text-align: center;
    background-position: top;
    background-repeat: no-repeat;
    margin: 0 auto;
    border-bottom: 3px solid var(--rojo1);
    transition: .2s;
}
.pasos-tag:hover .paso-ico-2{
  background-image: url(../img/home-pasos-2-hov.png);
  border-bottom: 3px solid var(--celeste1);
  transition: .2s;
}
.paso-ico-3{
      background-image: url(../img/home-pasos-3.png);
    height: 90px;
    width: 90%;
    max-width: 185px;
    background-size: 70px;
    text-align: center;
    background-position: top;
    background-repeat: no-repeat;
    margin: 0 auto;
    border-bottom: 3px solid var(--rojo1);
    transition: .2s;
}
.pasos-tag:hover .paso-ico-3{
  background-image: url(../img/home-pasos-3-hov.png);
  border-bottom: 3px solid var(--celeste1);
  transition: .2s;
}
.paso-ico-4{
      background-image: url(../img/home-pasos-4.png);
    height: 90px;
    width: 90%;
    max-width: 185px;
    background-size: 70px;
    text-align: center;
    background-position: top;
    background-repeat: no-repeat;
    margin: 0 auto;
    border-bottom: 3px solid var(--rojo1);
    transition: .2s;
}
.pasos-tag:hover .paso-ico-4{
  background-image: url(../img/home-pasos-4-hov.png);
  border-bottom: 3px solid var(--celeste1);
  transition: .2s;
}

footer .col-lg-4 {
  display: flex;
}
footer .col-lg-6.links a{
  color: var(--blanco);
    padding: 3px 8px;
    border-right: 2px solid var(--rojo1);
    margin: 0px;
}
footer .col-lg-6.links a:last-child{
    border-right: none;
}
footer .footer-terminos{
  border-radius: 20px 20px 0px 0px;
}

.formulario-contacto{
      background-color: var(--blanco);
        border-radius: 40px;
        height: 50px;
        margin-top: 40px;
        display: flex;
        overflow: hidden;
        position: relative;
        box-shadow: 0px 0px 40px #2d4d6830;
}
.formulario-contacto input{
    color: var(--marino1);
    width: 25%;
    border: none;
    outline: none !important;
    padding: 20px;
    border-right: 1px solid #e9e9e9;
}
.formulario-contacto textarea{
        color: var(--marino1);
    width: 50%;
    border: none;
    outline: none !important;
    padding: 13px 50px 13px 20px;
    border-right: 1px solid #e9e9e9;
    height: 50px;
    max-height: 5px;
    min-height: 50px;
}
.formulario-contacto button{
    height: 50px;
    width: 50px;
    position: absolute;
    right: 0px;
    background-color: var(--rojo1);
    border-radius: 100%;
    border: 4px solid #fff;
    outline: none !important;
}
.formulario-contacto i{
    color: var(--blanco);
    font-size: 22px;
}

#messenger{
  position: fixed;
    z-index: 1000;
    right: 15px;
    bottom: 15px;
    height: 60px;
    width: 60px;
     background-color: #0c4cff;
    border-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.container-ejemplos{
  background-color: var(--gris2);
    border-radius: 15px;
    padding: 10px;
    text-align: center;
}
.container-ejemplos img{
    border-radius: 15px;
    max-width: 300px;
    width: 100%;
}
.container-ejemplos a{
color: var(--marino1) !important;
    font-weight: 400;
    margin-top: 10px;
    display: inline-block;
    padding: 5px 20px;
    font-size: 15px;
    transition: .2s;
}
.container-ejemplos a:hover{
    letter-spacing: 1px;
    transition: .2s;
}
.container-ejemplos.ver-mas{
  background-color: var(--celeste1);
}
.container-ejemplos.ver-mas a{
color: var(--marino1) !important;
}
.container-ejemplos.ver-mas img{
    border: none !important;
}

#demos-perfil .container-ejemplos{
  background-color: #fff !important;
}
.ejemplos-home .nav{
      width: max-content;
    margin: 0 auto;
    padding: 5px;
    background-color: var(--blanco);
    border-radius: 30px;
    box-shadow: 0px 0px 20px #17214661;
    overflow: hidden;
}
.ejemplos-home li{
background-color: var(--blanco);
}
.ejemplos-home .nav-link{
    background-color: var(--blanco);
    border-radius: 30px;
    color: var(--marino1);
    font-weight: 400;
    padding: 12px 20px;
}
.ejemplos-home .nav-link:hover{
    color: var(--rojo1);
}
.ejemplos-home .nav-link.active{
  background-color: var(--rojo1);
  background-image: linear-gradient(to right, #ff0404 0%, var(--rojo1) 100%);
  border-radius: 30px;
}
.ejemplos-home .nav-link.active:hover{
  color: var(--blanco);
}

/******************* OCULTAR HEADER Y FOOTER DE PÁGINAS **************/
.page-template-iniciar-sesion header, .page-template-registro header, .page-template-editar header, .page-template-crear-invitacion-boda-vip header, .page-template-crear-invitacion-xv-vip header, .page-template-crear-invitacion-xv header, .page-template-pago header, .page-template-error-pago header, .page-template-gracias-pago header, .page-template-gracias-registro header, .error404 header{
	display: none;
}
.page-template-iniciar-sesion footer, .page-template-registro footer, .page-template-editar footer, .page-template-crear-invitacion-boda-vip footer, .page-template-crear-invitacion-xv-vip footer, .page-template-crear-invitacion-xv footer, .page-template-pago footer, .page-template-error-pago footer, .page-template-gracias-pago footer, .page-template-gracias-registro footer, .error404 footer{
	display: none;
}


/******************* Iniciar Sesión y registro **************/



#ing-reg{
	position: relative;
  padding: 40px 0px 0px 0px;
  text-align: center;
  max-width: 350px;
    margin: 0 auto;
}

#ing-reg .wpuf-multistep-progressbar {
    display: none !important;
}
#ing-reg .wpuf-multistep-fieldset li{
  margin: 0px;
    padding: 0px;
    margin-bottom: 15px;
}
#ing-reg .wpuf-multistep-fieldset .has-error {
    background: #fff;
    padding: 0px;
    color: var(--rojo1);
    font-weight: 300;
    font-size: 12px;
    background-color: var(--blanco);
}


.wpuf-error{
    position: absolute;
    bottom: -25px;
    width: 100%;
    left: 0px;
    right: 0px;
    background-color: #cd133f !important;
    color: var(--blanco) !important;
    padding: 2px 5px 3px 5px !important;
    font-size: 12px !important;
    font-weight: 400;
    margin: 0px !important;
    border-radius: 15px 15px 0px 0px !important;
    border-color: #fff !important;
    max-height: 25px;
}
.wpuf-errors{
  display: none;
}
.wpuf-message{
  position: absolute;
    bottom: -25px;
    width: 100%;
    left: 0px;
    right: 0px;
    background-color: var(--celeste1) !important;
    color: var(--blanco) !important;
    padding: 2px 5px 3px 5px !important;
    font-size: 12px !important;
    font-weight: 400;
    margin: 0px !important;
    border-radius: 15px 15px 0px 0px !important;
    border-color: #fff !important;
    max-height: 25px;
}
#ing-reg .form input{
width: 100%;
    border: none;
    border-bottom: 2px solid #9445db !important;
    height: 40px;
    box-shadow: none !important;
    outline: none !important;
    padding: 10px;
    text-align: center;
    border-radius: 0px;
    color: var(--negro);
    background-color: var(--blanco);
    font-size: 16px;
}
.wpuf-submit-button {
  position: absolute;
  right: 0px;
  bottom: 0px;
}
#ing-reg .form label{
	color: var(--negro);
	font-size: 17px;
}
#ing-reg .form form p{
	margin-bottom: 10px;
}
#ing-reg .form .g-recaptcha{
	text-align: center;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    background-color: #f9f9f9;
    padding: 10px 10px 9px 10px;
}

#ing-reg .form .forgetmenot{
	display: flex;
justify-content: center;
align-items: center;
background-color: #ffffff;
margin-top: -10px;
}

#ing-reg .form #wpuf-rememberme{
	width: 20px;
    border-radius: 0px;
    margin-right: 5px;
    cursor: pointer;
}

#ing-reg .form #wp-submit,#ing-reg .form .wpuf-submit-button{
	    background-image: linear-gradient(to right, #DA22FF 0%, var(--morado1) 51%, #DA22FF 100%);
    padding: 10px 25px;
    font-size: 17px;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: var(--blanco);
    border-radius: 30px;
    width: inherit;
    text-decoration: none;
    height: inherit;
    border-bottom: none !important;
    text-shadow: none;
}
#ing-reg .form #wp-submit:hover{
background-position: right center;
}
         
#ing-reg .form a{
	color: var(--marino1);
	text-decoration: none !important;
}
#ing-reg input:checked {
accent-color: var(--morado1);
}

#ing-reg .close{
	background-color: var(--rojo1);
	position: absolute;
	right: 0px;
	top: 0px;
	height: 35px;
	width: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 100%;
	cursor: pointer;
}
#ing-reg .close i{
  padding-top: 2px;
	color: #fff;
}
#ing-reg .cont ul{
padding: 0px !important;
margin: 0px !important;
}
#ing-reg .cont ul li{
list-style: none !important;
}
#resetpasswordform .wpuf-fields-inline{
  width: 100% !important;
}


.lista-preguntas-frecuentes div{
  padding: 15px;
  border-bottom: 1px solid #e7e7e7;
}
.lista-preguntas-frecuentes div:last-of-type{
  border-bottom: none;
}
.lista-preguntas-frecuentes h4{
  margin-bottom: 7px;
    font-size: 19px;
    font-weight: 300;
}
.lista-preguntas-frecuentes p{
    margin-bottom: 0px;
    font-size: 14px;
    line-height: 20px;
}
.lista-preguntas-frecuentes a{
    color: var(--rojo1) !important;
    font-weight: 500 !important;
}
.lista-preguntas-frecuentes span{
    font-weight: 500 !important;
}




/***************************************************** PERFIL *****************************************************/
#pag-perfil .cont{
	background-color: #fff;
	border-radius: 20px;
	padding: 20px;
	position: relative;
	text-align: center;
	box-shadow: 0px 0px 20px 0px #d3dbef70;
	transition: .2s;
}
#pag-perfil .cont:hover{
	box-shadow: 0px 0px 20px 0px #7f8aa770;
	transition: .2s;
}

    
#pag-perfil .cont img{
	height: 70px;
	width: 70px;
}
#pag-perfil .cont a{
	color: var(--negro1);
    font-weight: 500;
    padding-top: 15px;
    width: 80%;
    margin: 15px auto 0px auto;
    display: grid;
    border-top: 2px solid #eaeef7;
	transition: .2s;
}
#pag-perfil .p-s1-1:hover a{
	border-top: 2px solid #d61341;
	letter-spacing: 2px;
	transition: .2s;
}
#pag-perfil .p-s1-2:hover a{
	border-top: 2px solid #b63fe6;
	letter-spacing: 2px;
	transition: .2s;
}
#pag-perfil .p-s1-3:hover a{
	border-top: 2px solid #46d169;
	letter-spacing: 2px;
	transition: .2s;
}
#pag-perfil .p-s1-4:hover a{
	border-top: 2px solid #138afa;
	letter-spacing: 2px;
	transition: .2s;
}
#pag-perfil .mensaje p{
	text-align: center;
	font-size: 18px;
	color: var(--blanco);
	font-weight: 300;
	margin: 0px;
}
#pag-perfil .sin-publicaciones .mensaje{
	background: rgb(0,167,220);
    background: linear-gradient(90deg, rgb(213 19 65) 0%, rgb(139 102 161) 100%);
	width: 100%;
	padding: 30px;
}

#pag-perfil .publicado .mensaje{
	background: rgb(0,167,220);
    background: linear-gradient(90deg, rgb(19 122 213) 0%, rgb(97 54 197) 100%);
	width: 100%;
	padding: 30px;
}

#pag-perfil .tarjeta-invitacion{
	    overflow: hidden;
    border-radius: 25px;
    box-shadow: 0px 0px 20px 5px #51608526;
    transition: .2s;
    position: relative;
    border: 1px solid #51608526;
	display: flex;
}
#pag-perfil .tar-inv-s1{
	max-width: 200px;
	position: relative;
	background-color: var(--negro);
}
#pag-perfil .tar-inv-s2 .bi-check-circle-fill{
	font-size: 25px;
    position: absolute;
    z-index: 2;
    right: 17px;
    top: 10px;
    color: var(--verde1);
    background-color: var(--blanco);
}
#pag-perfil .tar-inv-s2 .bi-exclamation-diamond-fill{
	font-size: 25px;
    position: absolute;
    z-index: 2;
    right: 17px;
    top: 10px;
    color: var(--naranja1);
}
#pag-perfil .tar-inv-s2{
	width: 100%;
	position: relative;
}
#pag-perfil .tar-inv-s2 .tar-inv-s2-1{
	width: 100%;
	position: relative;
	padding: 20px;
}
#pag-perfil .tar-inv-s2 .tar-inv-s2-1 p{
	margin: 0px;
}
#pag-perfil .tar-inv-s2 .tar-inv-s2-2{
	width: 100%;
	position: relative;
	padding: 5px 20px;
	display: flex;
	background-color: var(--gris1);
	justify-content: space-between;
}
#pag-perfil .tar-inv-s2 .tar-inv-s2-2 a{
	color: var(--azul1);
	font-weight: 400;
	font-size: 16px;
	padding: 2px 2px;
    margin: 0px 2px;
}
#pag-perfil .tar-inv-s2 .tar-inv-s2-2 .status{
	border-right: 1px solid #c9d2e5;
    padding-right: 10px;
}

/****** Nuevo perfil *********/
#header-perfil{
  background-image: url("https://invitar.com.mx/assets/themes/programadorweb/img/bg-header-perfil.webp");
  padding-top: 70px;
  background-color: #b4dce3;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
#header-perfil .cont-header{
      min-height: 285px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#header-perfil .menu-perfil{
     background-color: #cfd8ff0f;
    padding: 20px;
    backdrop-filter: blur(5px);
}
#mis-invitaciones .tarjeta{
    display: flex;
    align-items: center;
    background-color: #fff;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0px 0px 40px #242b5e1f;
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
}
#mis-invitaciones .tarjeta-img {
    width: 18%;
}
#mis-invitaciones .tarjeta-img img{
     height: 120px;
    width: 120px;
    margin: 10px;
    border-radius: 15px;
    border: 1px solid #e7e7e7;
}

#mis-invitaciones .tarjeta-info{
  margin-left: 20px;
  width: 41%;
}

#mis-invitaciones .tarjeta-info p{
  margin-bottom: 0px;
}
#mis-invitaciones .tarjeta-links{
  width: 41%;
  display: flex;
  justify-content: end;
  align-items: center;
  padding-right: 4%;
}
#mis-invitaciones .tarjeta-links span{
      font-weight: 500;
    padding-right: 10px;
    border-right: 1px solid #d5d5d5;
    margin-right: 10px;
    text-transform: capitalize;
}
#mis-invitaciones .tarjeta-links a{
    padding: 7px;
    margin: 3px;
    font-weight: 500;
}
#mis-invitaciones .tarjeta-links a.t-publicado{
    color: #1dab69;
}
#mis-invitaciones .tarjeta-links a.t-pendiente{
    color: #ffbc04;
}
#mis-invitaciones .tarjeta-links i.publicado{
    color: #1dab69;
    position: absolute;
    top: 3px;
    right: 10px;
    font-size: 23px;
}
#mis-invitaciones .tarjeta-links i.pendiente{
    color: #ffbc04;
    position: absolute;
    top: 3px;
    right: 10px;
    font-size: 23px;
}
#mis-invitaciones .tarjeta-links .eliminar-post i{
    color: #717581;
    font-size: 16px;
}

.boton-crear-invitacion{
      background-color: #0c4cff;
    height: 75px;
    width: 75px;
    align-items: center;
    margin: 0 auto;
    border-radius: 100px;
    color: #fff;
    margin-top: -25px;
    border: 8px solid var(--gris1);
    padding-top: 2px;
    cursor: pointer;
}
.boton-crear-invitacion i{
      font-size: 40px;
    margin-top: 4px;
}
.pulse {
    display: inline-block;
    animation: pulse-animation 1s infinite;
}

@keyframes pulse-animation {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.1);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}
#modal-nueva-invitacion .px-7{
  padding-left: 7px;
  padding-right: 7px;;
}
#modal-nueva-invitacion #block-1 {
  background-color: var(--morado1);
  background-image: url("https://invitar.com.mx/assets/themes/programadorweb/img/bg-diamante-secc.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff !important;
    text-decoration: none !important;
    position: relative;
    height: 100%;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 15px;
    text-align: center;
}
#modal-nueva-invitacion #block-1 img{
  max-width: 70px;
  margin-bottom: 30px;
}
#modal-nueva-invitacion #block-1 a{
  color: #fff !important;
  font-weight: 300;
  font-size: 16px;
}
#modal-nueva-invitacion #block-1 i{
  font-size: 30px;
  color: #fff;
}

#modal-nueva-invitacion #block-2{
  position: relative;
  background-color: var(--gris2);
  border-radius: 15px;
  padding: 20px 20px 15px 20px;
  margin-bottom: 14px;
}
#modal-nueva-invitacion #block-2 h4{
  font-size: 20px;
  margin-bottom: 15px;
}
#modal-nueva-invitacion #block-2 a{
    color: var(--marino1);
    font-size: 17px;
    display: block;
    padding: 5px;
    border-top: 1px solid #d0e3f6;
}
#modal-nueva-invitacion #block-2 a i{
  color: var(--rojo1);
  margin-right: 10px;
}
#modal-nueva-invitacion #block-3{
  position: relative;
  background-color: var(--gris2);
  border-radius: 15px;
  padding: 20px 20px 15px 20px;
}
#modal-nueva-invitacion #block-3 h4{
  font-size: 20px;
  margin-bottom: 15px;
}
#modal-nueva-invitacion #block-3 a{
    color: var(--marino1);
    font-size: 17px;
    display: block;
    padding: 5px;
    border-top: 1px solid #d0e3f6;
}
#modal-nueva-invitacion #block-3 a i{
  color: var(--rojo1);
  margin-right: 10px;
}
#modal-nueva-invitacion #block-4{
  color: var(--blanco);
  text-align: center;
}
#modal-nueva-invitacion #block-4 span{
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 5px;
  cursor: pointer;
      text-shadow: 0px 5px 3px #000;
}
#modal-nueva-invitacion #block-4 i{
  font-size: 30px;
}

#nueva-inv .modal-content{
  background: transparent;
    box-shadow: none;
    outline: none;
    border: none;
    padding: 0px 15px;
}



/***************************************************** FORMULARIO DE INVITACIONES *****************************************************/
.page-template-crear-invitacion-boda header{
  display: none;
}
.page-template-crear-invitacion-boda footer{
  display: none;
}
#form-invitaciones .wpuf-multistep-progressbar{
      margin-bottom: 20px;
    height: 4px;
    padding: 0px;
    border: 0px;
    box-shadow: none;
    outline: none;
    border-radius: 0px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}
#form-invitaciones .wpuf-multistep-progressbar .wpuf-progress-percentage{
  display: none;
}

#form-invitaciones .ui-progressbar-value{
      padding: 0px;
    border: 0px;
    box-shadow: none;
    outline: none;
    border-radius: 0px;
}
.wpuf-submit-button {
    background-image: linear-gradient(to right, #ff0404 0%, var(--rojo1) 51%, #ff0404 100%) !important;
    padding: 10px 25px !important;
    font-size: 17px !important;
    text-align: center !important;
    transition: 0.5s !important;
    background-size: 200% auto !important;
    color: var(--blanco) !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    text-shadow: none !important;
}
.wpuf-submit-button:hover{
  background-position: right center;
}
#form-invitaciones .seleccion-tema{
      height: 0px;
    padding: 0px;
    margin: 0px;
    width: 0px;
    opacity: 0;
        overflow: hidden;
}

#form-invitaciones .wpuf-multistep-fieldset{
  padding-left: 0px !important;
  padding-right: 0px !important;
}
#form-invitaciones .wpuf-form li {
    padding: 0px !important;
}
#form-invitaciones .carousel-indicators {
    right: 8%;
    left: inherit;
    
}
#form-invitaciones .carousel-indicators [data-bs-target] {
    background-color: var(--rojo1);
        text-indent: 0px;
        width: 20px !important;
    height: 20px !important;
    color: #fff;
    font-size: 11px;
    font-weight: 500;
}
#form-invitaciones .usar-tema.checked{
      height: 100%;
    width: 100%;
    background: #cfdaff;
    background: radial-gradient(circle, rgba(207, 218, 255, 0.49) 0%, rgb(0 0 0 / 30%) 100%);
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    backdrop-filter: blur(2px);
    display: flex;
    justify-content: center;
    align-items: center;
}
#form-invitaciones .usar-tema.checked::after{
content: "\F26A";
    font-family: bootstrap-icons;
    color: #f5f8ff;
    font-size: 45px;
    background-color: #cd133f;
    height: 45px;
    width: 45px;
    border-radius: 100%;
    line-height: 45px;
}
#form-invitaciones .wpuf-section-title{
  font-size: 20px !important;
    font-weight: 300;
    color: var(--marino1);
}
#form-invitaciones .wpuf-section-wrap{
    border: none;
    padding: 0px;
    margin-bottom: 20px;
}
#form-invitaciones .wpuf-section-details{
  padding: 0px;
}
#form-invitaciones .wpuf-fields input{
  border: none;
    background-color: var(--gris1);
    color: var(--marino2);
    outline: none;
    box-shadow: none;
    border-radius: 0px;
    padding: 5px 20px;
    text-align: center;
}
#form-invitaciones .wpuf-label{
  margin-bottom: 0px;
}
#form-invitaciones .wpuf-fields textarea {
    border: none;
    background-color: var(--gris1);
    color: var(--marino2);
    outline: none;
    box-shadow: none;
    border-radius: 0px;
    padding: 5px 20px;
    text-align: center;
        height: 80px !important;
    max-height: 80px !important;
    min-height: 80px !important;
}
#form-invitaciones .wpuf-info {
    background-color: #ffffff !important;
    border: none !important;
    padding: 0px 10px 15px 10px !important;
    margin: 0 0 10px 0 !important;
    font-size: 16px !important;
    color: #cd133f !important;
    margin-top: -6px !important;
    box-shadow: 1px 7px 20px -16px #161c307a !important;
}


#form-invitaciones label{
      font-weight: 500;
    color: #4d5272;
    font-size: 16px;
    width: 100%;
    padding-top: 15px;
}
#form-invitaciones .wpuf-help{
      margin-top: -2px !important;
    color: #4d529b;
}
#form-invitaciones .wpuf-el{
  margin-top: 20px;
      background-color: var(--gris1);
    border-radius: 10px;
}
#form-invitaciones .wpuf-el:first-of-type{
  margin-top: 0px;
      background-color: inherit;
    border-radius: 0px;
    border-bottom: none;
}
#form-invitaciones .has-error {
  background-color: var(--gris1);
    padding: 10px;
}
#form-invitaciones .wpuf-error-msg{
  color: var(--rojo1);
  font-weight: 500;
}
#form-invitaciones .wpuf-drag-file{display: none !important;}
#form-invitaciones .caption{
  position: absolute;
    left: 0px;
    margin-left: 0px;
    top: 0px;
    margin-top: 0px;
    width: 100%;
    text-align: center;
    padding: 0;
    border-radius: 3px;
    line-height: 0;
    height: 100%;
    display: flex !important;
    justify-content: center;
    align-items: center;
    background-color: #00000061;
    transition:.2s;
}
#form-invitaciones .caption a{
  height: 100%;
    width: 100%;
    padding: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#form-invitaciones .caption a:hover{
      background-color: #00000061;
        backdrop-filter: blur(2px);
        transition:.2s;
}
#form-invitaciones .caption a img{
  display: none;
}
#form-invitaciones .caption a::after{
      content: "\F659";
    font-family: bootstrap-icons;
    color: #fff;
    font-size: 25px;
}

#form-invitaciones .wpuf-image-wrap{
  margin: 4px;
    border-radius: 10px;
    overflow: hidden;
}
#form-invitaciones .attachment-name{
  height: 100%;
}
#form-invitaciones .attachment-name img{
  height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
}
#form-invitaciones .wpuf-attachment-upload-filelist .button.file-selector{
position: relative;
    background-color: var(--gris2);
    color: var(--morado1);
    border-radius: 15px;
    font-size: 17px;
    font-weight: 500;
    height: 80px;
    width: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    padding: 20px 10px 50px 10px;
}
#form-invitaciones .wpuf-attachment-upload-filelist .button.file-selector::after{
    content: "\F2B1";
    font-family: bootstrap-icons;
    color: var(--morado1);
    font-size: 33px;
    position: absolute;
    bottom: 0px;
}

#form-invitaciones .separaci_n_de_secci_n_1{
  background-color: #fff !important;
}

#form-invitaciones .btn-img-galeria{
background-color: #fff !important;
}

#form-invitaciones .gmnoprint{
  display: none !important;
}
#form-invitaciones .wpuf-google-map-search{
    width: 100% !important;
    margin: 0px !important;
    padding: 0px 50px 0px 45px !important;
    left: 0px !important;
    height: 45px !important;
    bottom: 0px !important;
    position: relative !important;
    border: none !important;
    box-shadow: none !important;
    background-color: var(--gris1) !important;
    border-bottom: 2px solid var(--morado1) !important;
        background-image: url("https://invitar.com.mx/assets/themes/programadorweb/img/buscar-mapa-direccion.png");
    background-position: left 10px center;
    background-repeat: no-repeat;
    background-size: 25px;
}
#form-invitaciones .gm-fullscreen-control{
position: absolute !important;
    right: 0px !important;
    top: 0px !important;
    margin: 0 auto !important;
    z-index: 111133 !important;
    height: 43px !important;
    width: 45px !important;
    box-shadow: none !important;
    background-color: var(--morado1) !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
#form-invitaciones .gm-fullscreen-control img{
opacity: 0 !important;
}
#form-invitaciones .gm-fullscreen-control::after{
    content: "\F14D";
    font-family: bootstrap-icons;
    color: var(--blanco);
    font-size: 18px;
        padding-top: 3px;
}
#form-invitaciones button[title="My Location"] {
display: none !important;
}
#form-invitaciones .gm-style-cc{
  display: none !important;
}
#form-invitaciones .wpuf-el.mapa{
  position: relative;
    margin-top: 20px;
    background-color: var(--blanco);
    border-radius: 0px;
    border-bottom: none !important;

}
#form-invitaciones .wpuf-el.mapa label{
  display: none;
}
#form-invitaciones .mapa .has-error {
    background-color: var(--blanco);
    padding: 0px;
}
#form-invitaciones .mapa .wpuf-help {
    margin-top: 5px !important;
    color: #4d529b;
}

#ui-datepicker-div{
      border: none;
    box-shadow: 0px 0px 20px #31334a61;
    padding: 10px;
    margin: 0px;
    background-color: var(--blanco);
    border-radius: 10px;
    overflow: hidden;
    outline: none;
}
#ui-datepicker-div .ui-datepicker-header{
  background-color: var(--morado1) !important;
  border: none !important;
    background: transparent;
    color: var(--marino1);
    font-weight: 500;
    border-radius: 0px !important;
    height: 40px;
}
#ui-datepicker-div .ui-datepicker-next, #ui-datepicker-div .ui-datepicker-prev{
  background-color: transparent;
  height: 40px;
  height: 40px;
  top: 0px;
      display: flex;
    justify-content: center;
    align-items: center;
}
#ui-datepicker-div .ui-datepicker-next:hover, #ui-datepicker-div .ui-datepicker-prev:hover{
  background-color: none !important;
  background: none !important;
  cursor: pointer;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
}
#ui-datepicker-div .ui-datepicker-next span, #ui-datepicker-div .ui-datepicker-prev span{
  opacity: 0;
}
#ui-datepicker-div .ui-datepicker-prev::after{
      content: "\F284";
    font-family: bootstrap-icons;
    color: var(--blanco);
    font-size: 18px;
}
#ui-datepicker-div .ui-datepicker-next::after{
      content: "\F285";
    font-family: bootstrap-icons;
    color: var(--blanco);
    font-size: 18px;
}
#ui-datepicker-div .ui-datepicker-header .ui-datepicker-month, #ui-datepicker-div .ui-datepicker-header .ui-datepicker-year {
    width: 45%;
    background-color: transparent;
    border: none;
    color: #fff;
    border-left: 1px solid #ae5cff;
    border-right: 1px solid #ae5cff;
    padding: 0px 5px;
    cursor: pointer;
    text-align: center;
     appearance: none;
}
#ui-datepicker-div .ui-datepicker-month:focus, #ui-datepicker-div .ui-datepicker-year:focus {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}
#ui-datepicker-div .ui-datepicker-month::part(select-options), #ui-datepicker-div .ui-datepicker-year::part(select-options) {
  color: #333 !important;
}
#ui-datepicker-div .ui-datepicker-title select::picker(select){
color: var(--marino1) !important;
font-weight: 300;
}



#ui-datepicker-div td a.ui-state-default{
  border: none;
    background: var(--gris1);
    font-weight: 300;
    color: var(--marino1);
    margin: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
}
#ui-datepicker-div td a.ui-state-highlight{
  background-color: #fff;
}
#ui-datepicker-div td a.ui-state-active, #ui-datepicker-div td a.ui-state-hover{
    background: #ccdcff;
}

#form-invitaciones select{
  width: 100%;
      border: none;
    background-color: var(--gris1);
    color: var(--marino2);
    outline: none;
    box-shadow: none;
    border-radius: 0px;
    padding: 5px 20px;
   text-align: center;
     appearance: none;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number], input[type=number]:hover {
    -moz-appearance: textfield;
}
.form-invitaciones-img-top img{
  height: 70px;
  text-align: center;
}
#form-invitaciones .wpuf-el.featured_image{
  background-color: #fff !important;
}
#form-invitaciones .wpuf-el.featured_image label{
  display: none;
}
.wpuf-multistep-prev-btn{
  z-index: 500;
}
#ocultar-publicar{
  position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px !important;
    z-index: 499;
}
.form-invitaciones-regresar{
position: absolute;
    right: -10px;
    top: -10px;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
}
.form-invitaciones-regresar i{
 color: var(--blanco);
     font-weight: 700 !important;
    font-size: 33px;
        height: 40px;
    width: 40px;
    background-color: var(--morado1);
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.p-4 {
    padding: 20px !important;
}
#carouseltema .ver-demo{
  display: inline-flex;
  padding: 3px 20px;
  margin-bottom: 5px;
  color: var(--marino1) !important;
  font-weight: 400;
  transition: .2s;
}
#carouseltema .ver-demo:hover{
  letter-spacing: 2px;
  transition: .2s;
}
#carouseltema .btn-2{
  display: inline-flex;
}
#carouseltema img{
    overflow: hidden;
}
#carouseltema .seleccionar-tema-flechas{
  position: absolute;
    top: 30%;
    display: flex;
    justify-content: space-between !important;
    width: 100%;
}
#carouseltema .seleccionar-tema-flechas i.bi-arrow-right-square-fill, #carouseltema .seleccionar-tema-flechas i.bi-arrow-right{
      font-size: 40px;
    background-color: #fff;
    padding: 8px 0px 7px 9px;
    box-shadow: 0px 0px 20px 0px #19223859;
    border-radius: 10px 0px 0px 10px;
    line-height: 40px;
    cursor: pointer;
    color: var(--marino1) !important;
}
#carouseltema .seleccionar-tema-flechas i.bi-arrow-left-square-fill{
      font-size: 40px;
    background-color: #fff;
    padding: 8px 9px 7px 0px;
    box-shadow: 0px 0px 20px 0px #19223859;
    border-radius: 0px 10px 10px 0px;
    line-height: 40px;
    cursor: pointer;
    color: var(--marino1) !important;
}


#carouseltema{
  margin-bottom: -65px;
    box-shadow: 0px 15px 0px 0px #ffffff;
        background-color: var(--gris1);
        position: relative;
        overflow: hidden !important;
            border-radius: 15px !important;
}

.selector-color .wpuf-radio-block input[type="radio"] { display: none;}
.selector-color .wpuf-radio-block{
   font-weight: 300 !important;
    width: 125px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    background-color: #e8efff;
    border-radius: 10px;
    margin: 4px;
    cursor: pointer;
}
.selector-color .wpuf-fields{
  display: ruby !important;
  padding-top: 20px;
}
.selector-color .wpuf-label{
  margin-bottom: 15px !important;
}
.wpuf-form li.selector-color .wpuf-fields .wpuf-radio-block, .wpuf-form li.selector-color .wpuf-fields .wpuf-checkbox-block {
    display: inline-block !important;
}

#form-invitaciones .html_personalizado_11{
  background-color: #fff;
}
#form-invitaciones .buscador-youtube{
      display: flex;
    justify-content: center;
    align-items: center;
    max-width: 400px;
    margin: 0 auto;
    padding: 0px 20px;
    position: relative;
}
#form-invitaciones .buscador-youtube button{
   height: 46px;
    background-color: var(--rojo1);
    border-radius: 100%;
    width: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    position: absolute;
    right: 23px;
    border: none;
    outline: none;
    box-shadow: none;
}
#form-invitaciones .buscador-youtube input{
    height: 50px;
    background-color: var(--blanco);
    border-radius: 50px;
    width: 100%;
    box-shadow: 0px 0px 20px 0px #202f7021;
    padding: 7px 50px;
}
#form-invitaciones #resultado #playAudio{
    background-color: var(--celeste1);
    color: var(--marino1);
    border-radius: 100px;
    border: none;
    height: 50px;
    width: 50px;
    margin: 0 auto;
    font-size: 22px;
    line-height: 13px;
    position: relative;
    padding: 10px 10px 10px 11px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: none !important;
    outline: none !important;
}


.wpuf-image-wrap .wpuf-attachment-image {
    -webkit-user-drag: none; /* Chrome, Safari */
    -khtml-user-drag: none;
    -moz-user-drag: none;    /* Firefox */
    -o-user-drag: none;
    user-drag: none;
}

/* Mantener funcionalidad de mover solo sobre el ícono */
.wpuf-image-wrap .wpuf-drag-file {
    cursor: move; /* opcional: visual de arrastre sobre el icono */
}

.selector-color .wpuf-radio-block.active-rosado { background: #ff94a3; border-color: #ff94a3; color:#fff !important; }
.selector-color .wpuf-radio-block.active-azul { background:#1985dd; border-color:#1985dd; color:#fff !important; }
.selector-color .wpuf-radio-block.active-ambar { background:#edbd0c; border-color:#edbd0c; color:#fff !important; }
.selector-color .wpuf-radio-block.active-violeta { background:#a000ff; border-color:#a000ff; color:#fff !important; }
.selector-color .wpuf-radio-block.active-rojo { background:#af0727; border-color:#af0727; color:#fff !important; }
.selector-color .wpuf-radio-block.active-esmeralda { background:#3ec084; border-color:#3ec084; color:#fff !important; }


/******************************************************************* PAGINA DE PAGO ******************************************************************/
#form-pago .wpuf-pay-col{
  display: none !important;
}

#form-pago .wpuf-payment-instruction{
    box-shadow: 0px 0px 20px 0px #213a6a14;
    border-radius: 15px;
    z-index: 1006;
    position: relative;
    background-color: #fff;
    padding: 20px 20px 0px 20px !important;
    border: 1px solid #eceff3;
    max-width: 90%;
    margin: 0 auto !important;
}
#form-pago .wpuf-payment-gateways{
  padding: 0px !important;
  margin: 0px !important;
}
#form-pago #wpuf-stripe-card-errors{
  padding-top: 20px !important;
}
#form-pago .wpuf-instruction{
  background-color: #ecf6ff !important;
  margin-bottom: 20px !important;
}
#form-pago .wpuf-btn{
  background-image: linear-gradient(to right, #DA22FF 0%, var(--morado1) 51%, #DA22FF 100%) !important;
    padding: 10px 25px !important;
    font-size: 17px !important;
    text-align: center !important;
    transition: 0.5s !important;
    background-size: 200% auto !important;
    color: var(--blanco) !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
        margin: 0px;
}
#form-pago .wpuf-btn:hover{
  background-position: right center !important;
}
#form-pago .wpuf-gateway-stripe label{
    background-color: #ecf6ff;
    border-radius: 15px 15px 0px 0px;
    padding: 10px 20px 0px 20px;
    color: #0f385c;
    font-size: 14px;
    font-weight: 400;
}
#form-pago .wpuf-gateway-stripe input{
display: none;
}
#form-pago #wpuf_pay_page_total{
  font-weight: 500 !important;
}

/******************************************************************* PAGINA BODA ******************************************************************/
.pack-titulo{
  text-align: center;
  background-color: var(--marino2);
  color: #fff;
  padding: 50px 20px 0px 20px;
  border-bottom: 5px solid var(--rojo1);
  background-image: url("https://invitar.com.mx/assets/themes/programadorweb/img/bg-lineas-costos.png");
  background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.costo{
    width: 150px;
    padding: 10px 15px;
    border-radius: 10px;
    margin: 0 auto;
    margin-bottom: -20px;
    background-color: var(--gris2);
        z-index: 2;
    position: relative;
        color: var(--marino1);
}
.costo p{
  margin-bottom: 0px;
    font-size: 30px;
    font-weight: 500;
}
.costo span{
  font-size: 20px;
    padding-right: 2px;
}
.pack-contenido{
  background-color: #fff;
  padding: 40px 20px 20px 20px;
}
#paquetes ul li{
  color: var(--marino1);
}
#paquetes .cont{
  background-color: #fff;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0px 0px 20px #20294c4a;
}
.pack-contenido .list-celeste{
  max-width: 300px;
    margin: 0 auto !important;
}
.pack-titulo h3{
  margin-bottom: 20px;
}
#pack-diamante-secc{
  background: #8575ea;
    background-image: url("https://invitar.com.mx/assets/themes/programadorweb/img/bg-diamante-secc.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
#pack-diamante{
    background: #9544DA;
    background: linear-gradient(329deg, rgba(149, 68, 218, 1) 0%, rgba(60, 102, 224, 1) 100%);
    border: 15px solid var(--celeste1) !important;
    border-radius: 30px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
.accordion-button{
  outline: none !important;
  box-shadow: none !important;
}
#home-s1-boda{
  background-image: url("https://invitar.com.mx/assets/themes/programadorweb/img/bg-header-boda.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #b2cded;
}
#home-s1-xv{
  background-image: url("https://invitar.com.mx/assets/themes/programadorweb/img/bg-header-xv.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #fcc7fc;
}