/******************** GENERALES *******************************/
html, body, h1, h2, h3, h4, h5, p{
	font-family: 'Montserrat', sans-serif !important;
	font-weight: 300;
	color: var(--negro1);
	font-size: 17px;
}

body{ background-color: #ffffff !important;}

a, a:active, a:focus, a:visited, a:hover{ text-decoration: none; }
a:active, a:active * { outline: none !important; -moz-outline-style: none !important; }
a:focus, a:focus * { outline: none !important; -moz-outline-style: none !important; }

h1{ font-size: 45px !important; }
h2{ font-size: 35px !important; }
h3{ font-size: 20px !important; }
h4{ font-size: 19px !important; }
h5{ font-size: 18px !important; }
h6{ font-size: 17px !important; }





.btn-w{
	padding: 15px 10px 15px 10px;
	    background-color: var(--verde1);
	    color: #fff !important;
	    border: 0px;
	    font-weight: 300;
	    font-size: 16px;
	    border-radius: 2px 0px 0px 2px;
	    transition: .3s;
	    width: 50%;
	    text-align: center;
	    display: flex;
	    align-items: center;
	    justify-content: center;
			text-shadow: 0px 0px 4px #0f583a;
}
.btn-w img{
	width: 22px;
	margin-right: 7px;
}
.btn-ll{
	padding: 15px 10px 15px 10px;
	    background-color: var(--negro1);
	    color: #fff !important;
	    border: 0px;
	    font-weight: 300;
	    font-size: 16px;
	    border-radius: 0px 2px 2px 0px;
	    transition: .3s;
	    width: 50%;
	    text-align: center;
	    display: flex;
	    align-items: center;
	    justify-content: center;
}
.btn-ll img{
	width: 22px;
	margin-right: 7px;
}

#s3 h1{
	font-size: 23px !important;
	text-transform: uppercase;
	font-weight: 300;
	margin-bottom: 0px;
}
#s3 h1 span{
	font-size: 40px !important;
	font-weight: 700;
}

#s3 .grad{
	background-image: linear-gradient(to left, var(--blanco) 0%,var(--azul1) 20%,var(--azul1) 80%,var(--blanco) 100%);
	padding: 20px;
	margin-top: 18px;
}
#s3 .grad img{
	width: 22px;
	padding-right: 7px;
}

#s4 img{
	max-width: 80px;
  padding: 10px;
}

.btn-1{
	padding: 15px 10px 15px 10px;
	    background-color: var(--verde1);
	    color: #333 !important;
	    border: 0px;
	    font-weight: 500;
	    font-size: 16px;
	    border-radius: 2px 0px 0px 2px;
	    transition: .3s;
	    width: 50%;
	    text-align: center;
	    display: flex;
	    align-items: center;
	    justify-content: center;
}
.btn-1 img{
	width: 22px !important;
	margin-right: 7px;
	padding: 0px !important;
}
.btn-1.disabled{
	background-color: #4d8970;
}

#whatsapp h1{
	color: #fff;
}

.disabled{
	pointer-events: none !important;
}
#whatsapp .selector-formulario a{
	background-color: #1f2534;
  color: #fff;
  font-weight: 500;
  padding: 10px 15px;
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
	font-size: 15px;
}
#whatsapp .selector-formulario a.active{
	background-color: var(--azul2);
  color: #fff;
  font-weight: 500;
  padding: 10px 15px;
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
#whatsapp #eventos input{
	background-color: var(--azul1);
	border: none !important;
	margin-bottom: 10px;
	width: 100%;
	height: 40px;
	padding: 16px;
	box-shadow: none !important;
	outline: none !important;
	border-radius: 0px;
	transition: .2s;
}
#whatsapp #eventos select{
	background-color: var(--azul1);
	border: none !important;
	margin-bottom: 10px;
	width: 100%;
	height: 40px;
	padding-left: 16px;
	box-shadow: none !important;
	outline: none !important;
	border-radius: 0px;
	transition: .2s;
}
#whatsapp #eventos .fecha select#dai{
	width: 50%;
	margin-right: 8px;
}
#whatsapp #eventos input.disabled{
	background-color: #1f2534;
	transition: .2s;
}
#whatsapp #eventos select.disabled{
	background-color: #1f2534;
	transition: .2s;
	color: #757575;
}

#whatsapp #eventos .dia .content-input input, .content-select select{
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;

}

#whatsapp .dia{
	width: 100%;
text-align: center;
border: 1px solid #464d5e;
padding: 0px 8px 25px 8px;
margin-top: 30px;
}
#whatsapp .dia p{
	color: #eef2ff;
	text-align: left;
	background-color: #333948;
	margin-bottom: 25px;
	margin-top: -14px;
	display: table;
	padding: 0px 10px;
	border-left: 1px solid #464d5e;
	border-right: 1px solid #464d5e;
}
#whatsapp .dia input{
	padding: 0px !important;
	margin: 0px !important;
}
#whatsapp .dia label{
	color: #fff;
	margin: 0px;
	height: 43px;
	width: 45px;
	padding: 0px;
	display: -webkit-inline-box;
	background-color: #333948;
}
#whatsapp .dia input{
	padding: 0px;
}
#whatsapp .dia span{
	z-index: 2;
	position: relative;
	font-style: normal;
	font-weight: 500;
}
.content-input input{
	visibility: hidden;
	position: absolute;
	right: 0;

}

.content-input{
	position: relative;
	margin-bottom: 30px;
	padding:5px 0 5px 60px; /* Damos un padding de 60px para posicionar el elemento <i> en este espacio*/
	display: block;
}

/* Estas reglas se aplicarán a todos las elementos i después de cualquier input*/
.content-input input + i{
 background: #f0f0f0;
 border:2px solid rgba(0,0,0,0.2);
 position: absolute;
 left: 0;
 top: 0;
}

/* Estas reglas se aplicarán a todos los i despues de un input de tipo radio*/
.content-input input[type=radio] + i{
	height: 40px;
	width: 40px;
	border-radius: 0px;
	left: 0px;
	background-color: #1f2534;
	border: none !important;
	display: flex;
	align-items: center;
	justify-content: center;
}
.content-input input[type=radio] + i:after{
	content: '';
    display: block;
    height: 100%;
    width: 100%;
    border-radius: 0px;
    position: absolute;
    z-index: 1;
    top: 0px;
    left: 0px;
    background: #009cff;
    transition: all 0.25s ease;
    transform: scale(0) /* Lo reducimos a 0*/;
    opacity: 0;
}

.content-input input[type=radio]:checked + i:after{
	transform: scale(1);
	opacity: 1;
}

.content-input:hover input[type=radio]:not(:checked) + i{
	background: #B1E8CD;
}

#s1{
	background-color: var(--azul1);
	background-image: url(../img/bg.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	border-bottom: 4px solid #009cff;
}
#s1 .logo{
	width: 110px !important;
	max-width: 110px;
	min-width: 110px;
}
#s1 .container{
	padding-top: 40px;
	padding-bottom: 60px;

}

#s2 .container{
	margin: -20px 20px 70px 20px;
padding: 20px 20px 60px 20px;
background-color: #fff;
border-radius: 20px;
box-shadow: 0px 0px 40px 0px #485e9769;
    text-align: center;
		max-width: 600px;
		position: relative;
}

#s2 .container input, #s2 .container select{
	width: 100% !important;
border-radius: 40px;
border: 1px solid #dbdbdb;
padding: 20px;
height: 40px;
text-align: center;
box-shadow: none;
outline: none;
background-color: #fff;
    display: flow !important;
		    padding: 0px 20px;
}

#s2 .btns{
	    display: flex;
	    justify-content: center;
	    align-items: center;
			    padding-top: 30px;
}
#s2 .btns .siguiente{
	background-color: #009cff;
	height: 40px;
	border-radius: 30px;
	padding: 5px 17px;
	font-size: 16px;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}
#s2 .btns .siguiente i{
	   color: #fff;
}


.preview{
	width: 100%;
	height: 100%;
	max-width: 100%;
	position: relative;
	overflow: hidden;
}
.preview img{
	width: 100%;
	height: 100%;
}
.preview span{
	position: absolute;
    color: #fff;
    font-weight: 700;
    font-size: 55px;
    text-shadow: 0px 0px 40px #ffffff;
    text-transform: uppercase;
    bottom: -2px;
    left: 0px;
    right: 0px;
    line-height: 40px;
    text-align: center;
		white-space: nowrap;
		text-overflow: ellipsis;
}
label {
    margin-top: 18px;
		    font-size: 14px;
}
.cont-btns-s2{
	position: absolute;
bottom: -20px;
left: 0px;
right: 0px;
width: 180px;
z-index: 2;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto;
}

.modal-dialog{
	margin: 0 auto;
}
.modal-content, .modal-dialog, .modal-body{
	margin: 0 auto !important;
	padding: 0px !important;
	border-radius: 0px !important;
	border: none !important;
	background-color: #000;
}
.modal-dialog{
	height: 100vh;
}

.cont-btns-s2 input{
	    background-color: #009cff !important;
			border-radius: 40px;
			height: 50px !important;
			border: none !important;
			outline: none;
			box-shadow: none !important;
			color: #fff;
			font-weight: 400;

}

.cont-prev{
	text-align: center;
}
.cont-fecha{
	position: relative;
height: 100px;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.cont-prev .dia{
	z-index: 2;
color: #fff;
font-weight: 400;
padding-right: 5px;
font-size: 20px;
    text-shadow: 0px 0px 20px #000000;
}
.cont-prev .mes{
	z-index: 2;
color: #fff;
font-weight: 400;
font-size: 20px;
    text-shadow: 0px 0px 20px #000000;
}
.cont-prev .ano{
	position: absolute;
font-size: 70px;
font-weight: 700;
color: #000000;
text-shadow: 0px 0px 3px #5d5f64;
}
.cont-prev .resumen{
	color: #b7b7b7;
	max-width: 80%;
text-align: center;
margin: 0 auto;
padding-bottom: 15px;
}
.cont-prev .resumen strong{
	color: #fff !important;
}
.cont-prev .logo-resumen{
	max-width: 75px;
	text-align: center;
	margin-bottom: 15px;
}
.btn-enviar{
	background-color: #009cff !important;
border-radius: 40px;
height: 50px !important;
border: none !important;
outline: none;
box-shadow: none !important;
color: #fff;
font-weight: 400;
position: relative;
width: 208px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
cursor: pointer;
}
.btn-regresar{
	background-color: #333948;
height: 50px;
width: 50px;
display: flex
;
justify-content: center;
align-items: center;
border-radius: 100%;
margin-right: 10px;
cursor: pointer;
}
.btn-regresar i{
	color: #ffffff;
font-size: 25px;
padding-top: 3px;

}