@charset "utf-8";

@font-face {
    font-family: 'Gotham';
    src: url('GothamBold.woff2') format('woff2'),
        url('GothamBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
/******/

#starshine {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: visible;
    z-index: 0;
}
.shine {
  display: block;
  position: fixed;
  top: 50%;
  left: 50%;
 background-image: url("../img/star.svg");
background-repeat: no-repeat;
background-position:center;
background-size: 80% 80%;
  overflow: hidden;
  z-index: 2;
  color: tansparent;
  -moz-opacity: 0.0;
  opacity: 0.0;
  animation: glitter 6s linear 0s infinite normal;
  -webkit-animation: glitter 6s linear 0s infinite normal;
  -moz-animation: glitter 8s linear 0s infinite normal;
  -ms-animation: glitter 8s linear 0s infinite normal;
  -o-animation: glitter 8s linear 0s infinite normal;
}
.img-fin {
	width: 90%;
    max-width: 500px;
    margin: 3% auto 4%;
    text-align: center;
}
.star-1 {
  display: block;
  position: fixed;
  top: 60%;
  left: 60%;
  background-image: url("../img/star.svg");
  background-repeat: no-repeat;
  background-position:center;
  background-size: 80% 80%;
  overflow: hidden;
  z-index: 2;
  color: tansparent;
  -moz-opacity: 0.0;
  opacity: 0.0;
  animation: brillo 5s linear 0s infinite normal;
  -webkit-animation: brillo 5s linear 0s infinite normal;
  -moz-animation: brillo 5s linear 0s infinite normal;
  -ms-animation: brillo 5s linear 0s infinite normal;
  -o-animation: brillo 5s linear 0s infinite normal;
}
.star-2 {
  display: block;
  position: fixed;
  top: 60%;
  left: 60%;
  background-image: url("../img/star2.svg");
  background-repeat: no-repeat;
  background-position:center;
  background-size: 80% 80%;
  overflow: hidden;
  z-index: 2;
  color: tansparent;
  -moz-opacity: 0.0;
  opacity: 0.0;
  animation: brillo 6s linear 0s infinite normal;
  -webkit-animation: brillo 6s linear 0s infinite normal;
  -moz-animation: brillo 6s linear 0s infinite normal;
  -ms-animation: brillo 6s linear 0s infinite normal;
  -o-animation: brillo 6s linear 0s infinite normal;
}
.star-3 {
  display: block;
  position: fixed;
  top: 60%;
  left: 60%;
  background-image: url("../img/star.svg");
  background-repeat: no-repeat;
  background-position:center;
  background-size: 80% 80%;
  overflow: hidden;
  z-index: 2;
  color: tansparent;
  -moz-opacity: 0.0;
  opacity: 0.0;
  animation: brillo 4s linear 0s infinite normal;
  -webkit-animation: brillo 4s linear 0s infinite normal;
  -moz-animation: brillo 4s linear 0s infinite normal;
  -ms-animation: brillo 4s linear 0s infinite normal;
  -o-animation: brillo 4s linear 0s infinite normal;
}
.star-4 {
  display: block;
  position: fixed;
  top: 60%;
  left: 60%;
  background-image: url("../img/star.svg");
  background-repeat: no-repeat;
  background-position:center;
  background-size: 80% 80%;
  overflow: hidden;
  z-index: 2;
  color: tansparent;
  -moz-opacity: 0.0;
  opacity: 0.0;
  animation: brillo 7s linear 0s infinite normal;
  -webkit-animation: brillo 7s linear 0s infinite normal;
  -moz-animation: brillo 7s linear 0s infinite normal;
  -ms-animation: brillo 7s linear 0s infinite normal;
  -o-animation: brillo 7s linear 0s infinite normal;
}

.shine.small {
  width: 5px;
  height: 5px;
}
.shine.medium {
  width: 10px;
  height: 10px;
}

.shine.large {
  width: 25px;
  height: 25px;
}

/*CSS3 keyframes for glittering effect*/
@-webkit-keyframes glitter {
  0% {
    -webkit-transform: scale(0.3) rotate(0deg);
    opacity: 0;
  }
  25% {
    -webkit-transform: scale(1) rotate(0deg);
    opacity: 1;
  }
  50% {
    -webkit-transform: scale(0.3) rotate(0deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(0.3) rotate(0deg);
    opacity: 0;
  }
}

@-webkit-keyframes brillo {
  0% {
    -webkit-transform: scale(0.3) rotate(0deg);
    opacity: 0;
  }
  25% {
    -webkit-transform: scale(1) rotate(0deg);
    opacity: 1;
  }
  50% {
    -webkit-transform: scale(0.3) rotate(0deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(0.3) rotate(0deg);
    opacity: 0;
  }
}
/******/
@font-face {
    font-family: 'Gotham';
    src: url('GothamMedium.woff2') format('woff2'),
        url('GothamMedium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('GothamBlack.woff2') format('woff2'),
        url('GothamBlack.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('GothamMedium.woff2') format('woff2'),
        url('GothamMedium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('GothamBold.woff2') format('woff2'),
        url('GothamBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('GothamBlack.woff2') format('woff2'),
        url('GothamBlack.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('Gotham-Black.woff2') format('woff2'),
        url('Gotham-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('Gotham-Bold.woff2') format('woff2'),
        url('Gotham-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('Gotham-Medium.woff2') format('woff2'),
        url('Gotham-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham Book';
    src: url('Gotham-Book.woff2') format('woff2'),
        url('Gotham-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('Gotham-Bold.woff2') format('woff2'),
        url('Gotham-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('Gotham-Black.woff2') format('woff2'),
        url('Gotham-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham Ultra';
    src: url('Gotham-Ultra.woff2') format('woff2'),
        url('Gotham-Ultra.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham Book';
    src: url('Gotham-Book.woff2') format('woff2'),
        url('Gotham-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('Gotham-Bold.woff2') format('woff2'),
        url('Gotham-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('Gotham-Medium.woff2') format('woff2'),
        url('Gotham-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

html, body {
  width: auto;
  height: 100%;
}
body{
	width: 100%;
	margin: 0;
	padding: 0;
	font-family: 'Gotham';
	color: #FFF;
	background: #82c2e6;
	overflow-x: hidden;
}
#ver-ganadores{
	visibility: visible;
}
.logo-mobile{
	display: none;
}
.img-responsive{
	width: 100%;
	max-width: 100%;
	height: auto;
}
.hero-mobile{
	display: none;
}
.background {
  position: relative;
  bottom: -10%;
  left: -6%;
  width: 110%;
  height: auto;
  z-index: 10;
}
.background1 {
  position: relative;
  bottom: -10%;
  left: -6%;
  width: 110%;
  height: auto;
  z-index: 10;
}
.background2 {
  position: relative;
  top: 0;
  left: -6%;
  width: 110%;
  height: auto;
  z-index: 1;
}
.cloud {  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  height: auto;
  z-index: 2;
}
.logo {
  top: 0;
  left: 54%;
  margin: 0 0 0 -220px;
  position: absolute;
}
.nubes {
  width: 100%;
  top:30px;
  left: 0;
}
.corazones {
  width: 140%;
  top: -15%;
  left: -20%;
  position: absolute;
  overflow: hidden;
}
.principal{
	width:100%;
	position: absolute;
	z-index: 999;
	text-align: center;
}
#movimiento{
    overflow: hidden;
    min-height: 1165px;
    position: relative;
    height: 100%;
}
.textLeft{
  text-align: left;
}
.productos-resultado input {
    background: transparent;
    color: #FFFFFF;
    width: auto;
    font-size: 14px;
    border: 0;
}
.productos-resultado .small-input input, .productos-resultado .second input {
    width: auto;
}
.productos-resultado .small-input {
    width: auto;
}
.productos-resultado input::placeholder {
    color: #FFFFFF;
}
.label-big{
	display: none;
}
.titulo img {
    max-width: 800px;
    margin: auto;
}
.titulo-fin img {
    max-width: 360px;
    margin: auto;
}
img.promoFin{
    max-width: 620px;
    margin: auto;
}
.legal-fin {
    font-size: 12px;
    color: #901878;
    text-align: center;
    margin: 10px 0 10px;
    position: relative;
    top: 0;
    font-family: 'Gotham', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
}
.fluid-image{
	width: 100%;
	max-width: 100%;
	height: auto;
	display: block;
}
.inicio {
    width: 100%;
    max-width: 100%;
    position: relative;
    margin: 0 auto 0;
}
.inicio .inicio-inner {
    width: 90%;
    max-width: 700px;
    position: relative;
    margin: 30px auto 0;
    display: flex;
    flex-direction: column;
}
.inicio-paticipa {
    width: 100%;
    max-width: 100%;
    position: relative;
    margin: 0 auto 0;
    display: flex;
    height: 100%;
    align-items: center;
    flex-direction: column;
}
.titulo-ganadores2 {
    background: #2d4664;
    display: table;
    width: auto;
    padding: 1px 10px;
	text-align: center;
	margin: 5% auto 3%;
}
.inicio-paticipa .inicio-inner {
    width: 90%;
    max-width: 700px;
    position: relative;
    margin: 0 auto 0;
    display: flex;
    flex-direction: column;
	z-index: 1;
}
.row-participa-btn{
	width: auto;
	text-align: center;
	margin: 20px auto 0;
}
.row-participa-btn a {
    animation-delay: .8s;
    padding: 20px 28px;
}
.col-6{
	width: 50%;
	float: left;
}
.col-4{
	width: 33.3333%;
	float: left;
}
.row-p {
    width: 90%;
    max-width: 800px;
    margin: auto;
    text-align: center;
	background: #82c2e6;
	height: auto;
	padding: 30px;
	position: relative;
	border: 0;

}

#modal-codigo, #modal-producto, #modal-mensaje{
  position: relative;
  z-index: 1000;
}

.contet-input{
  position: relative;
}

label.error{
  display: none !important;
}
.error{
  background: #ffdcf8;
  color: #71005a;
}
.error::placeholder{
  color: #71005a;
  opacity: 1;
}
#bd-error.error{
    display: block !important;
    position: absolute;
    top: 40px;
    left: 15px;
    background: #82c2e6;
    color: #901878;
    width: auto;
    padding: 0;
    text-align: center;
    z-index: 200;
    clear: both;
    font-size: 15px;
    line-height: 15px;
    margin: auto;
    padding: 10px;
    font-weight: 900;
}
.producto {
   margin: 8px;
   background: #FFF;
   cursor: pointer;
   position: relative;
   overflow: hidden;
   z-index: 0;
   border: 3px solid transparent;
}
.talle {
    background: #f0f0f0;
    width: 70%;
    position: absolute;
    z-index: 2;
    top: 0;
    right: 30%;
    height: 100%;
    text-align: center;
    display: none;
}

.talle-inner {
    padding: 0 8px;
    position: relative;
}
.disSelect{
	color: #2d4664;
}
select::after{
	color: #2d4664;
}

/* .talle {
    background: #f0f0f0;
    width: 60%;
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    height: 100%;
    text-align: center;
    display: none;
}

.talle-inner {
    padding: 0 8px;
} */

.tipo-t {
    color: #901878;
    font-family: 'Gotham', sans-serif;
    font-weight: 900;
    font-size: 19px;
	line-height: 21px;
    text-align: left;
    margin: 14px 0 3px;
	text-transform: uppercase;
}
.lista-talle {
    display: inline-block;
    padding: 5px 8px;
    margin: 4px;
    background: #901878;
    color: #FFF;
    min-width: 34%;
    text-align: center;
    float: left;
    font-family: 'Gotham', sans-serif;
  	font-weight: 900;
    font-size: 23px;
    position: relative;
    width: auto;
}
.lista-talle:hover, .lista-talle:focus, .lista-talle:active, .lista-talle.active {
    transition: all ease-in-out .3s;
    background: #2363c9;
    color: #FFF;
}

.lista-talle.act{
  transition: all ease-in-out .3s;
  background: #e5007e;
  color: #FFF;
}


.unidad {
    background: #901878;
    width: 30%;
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    height: 100%;
    text-align: center;
    display: none;
}
.unidad-inner {
    padding: 0 11px;
    max-width: 50%;
    position: relative;
}


/* .unidad {
    background: #901878;
    width: 90%;
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    height: 100%;
    text-align: center;
    display: none;
}
.unidad-inner {
    padding: 0 11px;
    max-width: 20%;
} */


.tipo-u {
    color: #FFFFFF;
    font-family: 'Gotham', sans-serif;
  	font-weight: 900;
    font-size: 19px;
	line-height: 21px;
    text-align: left;
    margin: 14px 0 3px;
	text-transform: uppercase;
	cursor: pointer;
}
.lista-unidad {
    display: block;
    padding: 5px 4px;
    margin: 4px 0;
    background: #82c2e6;
    color: #FFF;
    width: 100%;
    text-align: center;
    float: left;
    font-family: 'Gotham', sans-serif;
  	font-weight: 900;
	transition: all ease-in-out .3s;
    position: relative;
}
.lista-unidad:hover, .tipo-unidad:focus, .tipo-unidad:active, .tipo-unidad.active {
	transition: all ease-in-out .3s;
    background: #88e0ff;
    color: #FFF;
}

.lista-unidad.act {
	transition: all ease-in-out .3s;
    background: #82c2e6;
    color: #FFF;
}

.tipo-p {
   font-size: 21px;
	font-size: 23px;
	text-align: center;
	color: #901878;
	font-family: 'Gotham', sans-serif;
  	font-weight: 900;
	padding-top: 8px;
	text-transform: uppercase;
}
.w-90 {
    max-width: 80%;
    height: auto;
    margin-bottom: 4px;
}
.form-group{
	width: 100%;
	float: left;
}
.medium-input {
    width: calc(50% - 26px);
    float: left;
    display: inline-block;
}

select.medium-input {
    width: calc(50% - 5px);
    float: left;
    display: inline-block;
	height: 40px;
	color: #82c2e6;
}


.medium-input.button1 {
    width: 50%;
}
.medium-input.second {
    margin-left: 9px;
    font-weight: 300;
}

label.fechaNac{
  margin-top: 0;
}

.small-input {
    width: 49%;
    float: left;
    display: inline-block;
	text-align: left;
}
.small-input input{
    padding: 2px 10% 0;
    width: 78%;
  	font-weight: 300;
}
.producto-i {
    width: 100%;
	display: inline-block;
	padding: 0;
	margin: 0;
}
.talle-i {
    width: 24%;
	display: inline-block;
	padding: 0;
	margin: 0;
}
.unidad-i {
    width: 13%;
    display: inline-block;
    padding: 0;
    margin: 0;
}
.producto-i input, .talle-i input, .unidad-i input {
    padding: 0 !important;
    margin: 6px 0 0 !important;
    width: 100%;
    border: none;
    text-align: center;
    background-color: rgb(255 245 202) !important;
    font-size: 17px;
    pointer-events: none;
    color: #901878;
    font-weight: 500;
    font-family: 'Gotham';
}
.producto-i input::placeholder, .talle-i input::placeholder, .unidad-i input::placeholder{
	color:#82c2e6;
	opacity: 1;
}
::placeholder{
	color:#82c2e6;
	opacity: 1;
}
input:-internal-autofill-selected {
    appearance: menulist-button;
    background-color: inherit;
    background-image: none !important;
    color: inherit;
}
label {
    display: inline-block;
    font-size: 21px;
    line-height: 29px;
    color: #901878;
    margin: 10px 0 7px;
    font-family: 'Gotham Book', sans-serif;
    font-weight: normal;
}
.small-input.second {
	margin-left: 2%;
}
input {
    width: calc(94% - 2px);
    padding: 2px 3% 0;
    margin: 0 0 4%;
    background: #FFF;
    font-size: 14px;
    line-height: 38px;
    outline: none;
	border-radius: 0;
    outline-color: transparent;
	border: none;
    font-family: 'Gotham Book', sans-serif;
  	font-weight: normal;
    position: relative;
    top: 0px;
	height: 38px;
	color: #2d4664;
}

select {
    width: 94%;
    padding: 2px 3% 0;
    border: none;
    margin: 0 0 4%;
    background: #FFF;
    font-size: 14px;
    line-height: 38px;
    outline: none;
    outline-color: transparent;
    font-family: 'Gotham Book', sans-serif;
  	font-weight: 300;
    position: relative;
    top: 0px;
  	height: 38px;
  	color: #82c2e6;
    appearance: none;
	background-image: url("../img/select.svg");
	background-repeat: no-repeat;
	background-position: right center;
	-webkit-appearance: none;
	-moz-appearance: none;
	-o-appearance: none;
}
select::-ms-expand {
	display: none;
}
select option{
    color: #2d4664;
}

input span{
  font-family: 'Gotham Book', sans-serif;
  font-weight: normal;
}
h1 {
  font-size: 24px;
  color: #FFF;
  text-align: center;
  font-family: 'Gotham', sans-serif;
  font-weight: 900;
  margin: 0 auto 30px;
}
h1 span {
  color: #fcc21c;
}
.titulo {
    display: block;
    top: 0;
    position: relative;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: auto;
    left: 0;
}
.star-1 {
    position: absolute;
    top: -3%;
    margin: 0;
    height: auto;
    width: 4%;
    max-width: 4%;
    left: 38%;
}
.star-2 {
    position: absolute;
    top: 1%;
    margin: 0;
    height: auto;
    width: 10%;
    max-width: 10%;
    left: 28%;
}
.star-3 {
    position: absolute;
    top: 71%;
    left: 88%;
    margin: 0;
    height: auto;
    width: 3%;
    max-width: 3%;
}
.star-4 {
    position: absolute;
    top: 76%;
    left: 80%;
    margin: 0;
    height: auto;
    width: 7%;
    max-width: 7%;
}
.subtitulo{
	margin-bottom: 20px;
}
.titulo-ganadores {
    max-width: 550px;
    width: 90%;
    margin: 20px auto 30px;
    text-align: center;
}
.center-txt{
	text-align: center;
}
.form{
	text-align: center;
	margin: auto;
	}
.form img{
	max-width: 680px;
	height: auto;
	}
.clearfix {
  overflow: auto;
}
.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
a{
	text-decoration: none;
}
.btn-primary {
    background: #901878;
    color: #FFFFFF;
    font-size: 24px;
    line-height: 100%;
    font-family: 'Gotham', sans-serif;
    font-weight: 700;
    text-align: center;
    display: block;
    padding: 10px 0 12px;
    transition: all ease-in-out .3s;
}
.btn-wrap-productos {
    margin: 0 auto;
    text-align: center;
	width: 100%;
	max-width: 100%;
	float: left ;
}
.btn-productos {
    background: #901878;
    color: #FFFFFF;
    font-size: 42px;
    line-height: 100%;
    position: relative;
    bottom: 0;
    right: 0;
    margin: 16px auto;
    width: auto;
    max-width: auto;
    padding: 18px 30px 13px;
    text-align: center;
	display: table;
}
.btn-primary:hover, .btn-primary:focus{
    background: #a5208a;
    color: #FFFFFF;
}
.btn-secundary {
    background: #f1c925;
    color: #901878;
    font-size: 23px;
    line-height: 100%;
    font-family: 'Gotham', sans-serif;
    font-weight: 700;
    text-align: center;
    display: block;
    padding: 7px 0 7px;
    text-decoration: none;
    transition: all ease-in-out .3s;
    position: relative;
}
.btn-secundary:hover, .btn-secundary:focus{
    background: #f5d75d;
    color: #901878;
}

.btn-secundary-2 {
    background: #901878;
    color: #FFFFFF;
    font-size: 20px;
    line-height: 100%;
    font-family: 'Gotham', sans-serif;
    font-weight: 700;
    text-align: center;
    display: block;
    padding: 10px 18px 12px;
    text-decoration: none;
    max-width: 150px;
    margin: 12px auto 0;
    z-index: 9999;
    transition: all ease-in-out .3s;
    position: relative;
    clear: both;
}
.btn-secundary-2:hover, .btn-secundary-2:focus{
    background: #a5208a;
    color: #FFFFFF;
}
.btnFinal {
    font-size: 40px;
    padding: 15px 8px 14px;
    max-width: 250px;
    margin: 24px auto 50px;
	border: 3.4px solid #901878;
}
.recuerda{
	margin: 20px auto 0;
}

.cerrarPopUp{
  background: #901878;
  color: #FFFFFF;
  font-size: 24px;
  line-height: 100%;
  position: relative;
  bottom: 0;
  right: 0;
  margin:10px auto;
  width: auto;
  max-width: 200px;
  padding: 12px 30px;
}

.cerrarPopUp:hover, .cerrarPopUp:focus{
    background: #a5208a;
    color: #FFFFFF;
}

#modal-mensaje .modal .modal-content .row-p{
  max-width: 500px;
}

.right-row{
  padding-left: 5%;
  width: 45%;
}
.small-input input{
	margin: 0;
}
small{
    font-size: 9px;
    color: #ffffff;
    margin: 6px 0 4px;
    font-family: 'Gotham Book', sans-serif;
    font-weight: normal;
    line-height: 1.1em;
    display: block;
}
.corazones-bottom {
    position: absolute;
    bottom: -40px;
    left: 50px;
    width: 100%;
    height: auto;
	z-index: -1;
}
span {
    font-size: 12px;
    color: #901878;
    margin: 0;
    text-align: left;
    display: inline-block;
    font-family: 'Gotham book', sans-serif;
    font-weight: normal;
    float: left;
    line-height: 1;
}
.mCheck {
    margin: 0 0 0 15px;
    width: 44%;
    display: flex;
    align-items: flex-start;
    flex-direction: row;
}

.overflowAuto {
  overflow: visible !important;
}
.mt4p{
  margin: 4% 0 0;
}
.checkBox {
    width: 15px;
    margin: 0 5px 0 0;
    text-align: left;
    display: inline-block;
    display: table-cell;
    vertical-align: top;
    float: left;
    position: relative;
    top: -11px;
    border: none;
    border-radius: 0;
}
.enEse{
	overflow: visible;
}
@-moz-document url-prefix() {
.checkBox {
	margin: 0px 5px 0 0;
}
}
.lupaPos {
    position: relative;
}
.lupa {
    right: 0;
    position: absolute;
    top: 5px;
    width: 147px;
    height: auto;
    z-index: 9999;
    display: block;
    cursor: pointer;
    transition: all ease-in-out .4s;
    left: 105%;
}
.lupa:hover{
    width: 99%;
	transition: all ease-in-out .3s;
}
.lupa img{
    width: 70%;
    height: auto;
}
.legal {
    font-size: 20px;
    color: #901878;
    text-align: center;
    margin: 20px auto 20px;
    position: relative;
    top: 0;
    font-family: 'Gotham', sans-serif;
    font-weight: 900;
    line-height: 1.2em;
    max-width: 800px;
}
.legal a, span a, .legal-fin a {
    color: #2d4664;
    background: #f1c925;
    display: table;
    text-align: center;
    margin: 0 auto;
    line-height: 1.2em;
    padding: 0 5px;
    margin-top: 3px;
	transition: background ease-in-out .3s;
}
.legal a:hover, span a:hover, .legal-fin a:hover {
    color: #2d4664;
	background: #f5d75d;
	transition: background ease-in-out .2s;
}
/* The Modal (background) */
.modal {
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.6);
    display: table;
}
/* Modal Content/Box */
.modal-content {
    margin: 0 auto;
    padding: 0;
    border: none;
    width: 90%;
    max-width: 600px;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    position: relative;
}

.content-img{
  position: relative;
  max-width: 800px;
  width: 100%;
  margin: auto;
}

.modal-content .content-img img.codigo-d, #modal-mensaje .modal .modal-content .row-p {
    width: 90%;
    height: auto;
    display: block;
    vertical-align: middle;
    margin: auto;
}

.modal-codigo-content{
  display: table;
}

.close-modal{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.ancho-max {
    max-width: 150px;
    margin: 30px auto 20px;
    text-align: center;
}
.text-center{
	margin: auto;
	text-align: center;
	color: #174293;
}
#ganadores.show {
    height: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
}
#ganadores .footer  {
    position: fixed;
	bottom: 0;
    z-index: 0;
}
.alto-footer {
    height: 380px;
}
.nombre-ganador{
    margin: 10px 10px 20px;
    background: #FFF;
    padding: 20px;
    padding: 14px 18px;
    font-size: 19px;
    color: #901878;
	font-family: 'Gotham', sans-serif;
  	font-weight: 900;
	text-align: center;
}
.row-ganadores {
    margin: 20px 0 30px;
}
p {
    color: #901878;
    font-size: 1rem;
    line-height: 1.3em;
    margin: 0 10px 16px;
    font-family: 'Gotham', sans-serif;
    text-align: center;
    font-weight: 300;
}
.row-botones {
    width: 464px;
	margin: 37px auto 40px;
	text-align: center;
}
.ancho-max2{
	max-width: auto;
	margin: 0 16px 0 0;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	float: left;
}
.ancho-max3{
	max-width: auto;
	margin: 0 0 0 0;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	float: left;
}
.hide{
	display: none;
}
.show{
	display: block;
}
.lupa{
		display: block;
	}
.lupa-m {
		display: none;
	}

  /* error select Prod */
  .producto.errorProd{
    border: 3px solid #f41e9e;;
    /*width: calc(100% - 26px);*/
  }

  .producto.activo{
    border: 3px solid #f41e9e;;
    /*width: calc(100% - 26px);*/
  }


  #msjErrorPopUp div p{
    background: #ffceeb;
    margin: 20px;
    font-size: 18px;
    color: #f41e9e;
  }

  #msjErrorPopUp .cont-msj-error-prod{
    margin: 8px;
    background: #ffceeb;
    cursor: pointer;
    position: relative;
    overflow: hidden;
	color: #f41e9e;  
  }
.legal-fin {
    font-size: 11px;
    color: #901878;
    text-align: center;
    margin: 10px 0 10px;
    position: relative;
    top: 0;
    font-family: 'Gotham', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
}
#modal-mensaje .modal p {
	color: #901878;
}
.inicio .inicio-inner.inner-cta{
	max-width: 460px;
	margin: 50px auto;
}
.cta {
    width: 100%;
    text-align: center;
    margin: auto;
    display: block;
}
.corazones-bottom3 {
    position: absolute;
    bottom: -110px;
    left: 50px;
    width: 100%;
    height: auto;
    z-index: -1;
}
img.promoFin {
    max-width: 76%;
    margin: auto;
}
.header {
    width: 100%;
    max-width: 100%;
    height: 100%;
    padding: 20px 0 0;
    text-align: center;
    margin: 0 auto;
    background: url(../img/bg-top.svg) no-repeat;
    background-size: cover;
    background-position: center 350%;
}
.logo-container {
    width: 40%;
    margin: auto;
    position: relative;
}
.footer{
    width: 100%;
	max-width: 100%;
    height: auto;
    padding: 0 0 5%;
	text-align: center;
	margin: 0 auto;
    background: url(../img/bg-bottom.svg) no-repeat;
	background-size: contain;
	background-position: center bottom;
}
.packs-footer{
    width: 90%;
	max-width: 1280px;
	margin: 0 auto;
}
.footer.fin {
    width: 100%;
    max-width: 100%;
    height: auto;
    padding: 3% 0 5%;
    text-align: center;
    margin: 0 auto;
    background: none;
}

/* COUNT DOWN */

.countdown-inner{
	margin-top: 50px;
    margin-bottom: 50px;
    display: flex;
    text-align: center;
    width: 100%;
    justify-content: center;
    align-items: center;
}
.countdown-inner .content-number{
	display: flex;
    width: 100%;
    max-width: 680px;
    justify-content: space-around;
    align-items: center;
}
.countdown-inner .one-number {
    width: 100%;
    margin: 0 5px;
    padding: 2%;
}
.countdown-inner .one-number div{
    display:flex;
    flex-direction: column;
}
#previa{
    width: 100%;
    max-width: 100%;
    position: relative;
    margin: 0 auto 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.countdown-inner .one-number .number {
    background-color: #901878;
    border-radius: 100%;
    text-align: center;
    font-size: 4rem;
    font-weight: 900;
    color: #FFF;
    width: 100%;
    line-height: 7.6rem;
    padding-top: 0;
}

.countdown-inner .number{
  	/* text-align: center; */
    /* font-size: 4rem; */
    /* padding: 20px 0 2px 0; */
    /* color: #FFFFFF; */
    /* max-width: 142px; */
    /* font-size: 80px; */
    /* font-weight: 900; */
    /* display: block; */
    /* line-height: 1.5; */
}
.countdown-inner h2{
	/* text-align: center; */
	/* color: #006ed2; */
	/* font-size: 50px; */
	/* font-weight: bold; */
	/* margin-bottom: 40px; */
}
.countdown-inner .indicador{
	text-align: center;
	color: #2d4664;
	font-size: 21px;
	margin-top: 10px;
}
.simply-days-section .number{
	/* background: #006ed2; */
}
.simply-hours-section .number{
	/* background: #007de3; */
}
.simply-minutes-section .number{
	/* background: #0093ec; */
}
.simply-seconds-section .number{
	/* background: #00a2f2; */
}
/* DATE */
input[type="date"]::before{
   content: attr(placeholder) ": ";
}
input[type="date"]:focus::before {
   content: "" !important;
}
@media (max-width: 1224px) {
	#movimiento {
	  display: none;
	}
	html {
	  width: 100%;
	  overflow-x: hidden;
	  padding: 0;
      margin: 0;
	}
	.logo-mobile{
		display: block;
		margin: auto;
		max-width: 36%;
		height: auto;
	}
	.hero-mobile{
		display: block;
		margin: auto;
		max-width: 100%;
		height: auto;
	}
	.formulario {
		text-align: left;
	}
	.corazones-bottom{
		left: 0;
		width: 100%;
		height: auto;
	}
	#ganadores .inicio{
		margin: 20px auto 0;
	}
	#participando .inicio{
		margin: 20px auto 0;
	}
	.lupa img{
		width: 106px;
		height: auto;
	}
	.lupa:hover{
		width: 99%;
	}
	.wrapper-body{
		width: 90%;
		margin: 0 auto;
	}
}
@media (max-width: 992px) {
.right-row {
		padding-left: 0;
	}
	.compensation {
		max-width: 80%;
	}
	.btn-secundary-2 {
		margin: 25px 0px 16px;
	}
.row-botones {
    width: 100%;
}
.col-12 {
	width: 100%;
}
.col-p{
	width: 50%;
}
.ancho-max2 {
    margin: 0 2% 0 0;
    width: 10%;
    font-size: 21px;
}
.ancho-max3 {
    margin: 0 0 0 0;
    width: 64%;
    font-size: 21px;
}
.btn-secundary-2 {
    font-size: 27px;
    line-height: 34px;
	max-width: 176px;
}
select.medium-input {
    width: calc(50% - 7px);
}
.btn-productos {
    background: #ffffff;
    color: #901878;
    font-size: 42px;
    line-height: 42px;
    position: relative;
    top: 10px;
    right: 0;
    margin: 16px 8px;
    width: auto;
    max-width: auto;
    padding: 18px 30px 12px;
    display: block;
    float: none;
    clear: both;
}
.modal {
    position: fixed;
    z-index: 9999;
    width: 100%;
    height: 100vh;
    overflow: visible;
    display: table;
    align-items: center;
	vertical-align: middle;
}
#modal-producto .modal-content {
    position: relative;
}
#modal-producto .row-p {
    width: 80%;
}	
#msjErrorPopUp {
    width: 100%;
	margin-bottom: 0;
}
#modal-producto .modal {
    position: absolute;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
    display: block;
}
/***/
	#modal-codigo, #modal-producto, #modal-mensaje {
    position: relative;
    z-index: 99999;
    width: 100%;
    height: 100%;
    left: 0;
}
	#modal-producto {
    position: fixed;
    z-index: 1000;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
	#modal-producto .modal-content {
    margin: 5% auto;
    padding: 0;
    border: none;
    width: 70%;
    max-width: 600px;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    position: relative;
}
	.close-modal {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.row-p {
    margin: 5% auto;
}
.header {
    width: 100%;
    max-width: 100%;
    height: auto;
    padding: 20px 0 0;
    text-align: center;
    margin: 0 auto;
    background: url(../img/bg-top-m.svg) no-repeat;
    background-size: cover;
    background-position: center;
	z-index: 1;
}
.logo-container {
    width: 80%;
    margin: auto;
    position: relative;
    height: 100%;
}
.medium-input {
    width: 94%;
    float: left;
    display: block;
	margin-left: 0;
	margin-right: 0;
}
.medium-input.second {
    margin-left: 0;
}
input {
    width: 94%;
    padding: 0 3% 0;
    margin: 0 0 4%;
}
.contet-input {
    position: relative;
}	
.checkBox {
    width: 15px;
    margin: 0 20px 0 0;
}
.mt4p {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
	align-items: center;
	margin-bottom: 20px;
}
.mCheck {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-left: 12px;
    max-width: 32%;
}
.footer {
    width: 100%;
    max-width: 100%;
    height: auto;
    padding: 0 0 10%;
    text-align: center;
    margin: 0 auto;
    background: url(../img/bg-bottom-m.svg) no-repeat;
    background-size: cover;
    background-position: center;
}
.footer .fin {
    background: none;
}
.packs-footer {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}
select.medium-input {
    width: 100%;
}
span {
    margin-left: 4px;
}
.btn-secundary-2 {
    margin: auto;
}
.star-1 {
    top: -1%;
    left: 42%;
}	
.star-2 {
    top: 1%;
    left: 33%;
}
.star-3 {
        top: 42%;
    left: 98%;
}
.star-4 {
    top: 46%;
    left: 92%;
}
.countdown-inner .one-number .number {
    background-color: #901878;
    border-radius: 100%;
    text-align: center;
    font-size: 2.5rem;
    font-weight: 900;
    color: #FFF;
    padding-top: 0;
    width: 100px;
    height: 100px;
    line-height: 100px;
    margin: auto;
}
.countdown-inner .indicador {
    font-size: 16px;
}
}
@media (max-width: 992px) and (orientation : portrait) {
	.img-fin {
		margin: 10% auto 15%;
	}
	.footer.fin {
		position: fixed;
		bottom: 0;
	}
}
@media (max-width: 700px) {
	#modal-producto .row-p {
		width: 90%;
		margin: 2.5% auto;
	}
	.legal {
		font-size: 16px;
	}
	.ancho-max2 {
		margin: 0 0 12px 0;
		width: 100%;
		font-size: 21px;
		padding-right: 0;
		padding-left: 0;
	}
	.ancho-max3 {
		margin: 0 0 0 0;
		width: 100%;
		font-size: 21px;
		padding-right: 0;
    	padding-left: 0;
	}
	.inicio .inicio-inner.inner-cta {
		margin: 30px auto;
	}
	.corazones-bottom3 {
	   display: none;
	}
	.inicio-paticipa {
		margin: 20px auto 30px;
	}
	.compensation {
		max-width: 70%;
	}
	.lupa {
		top: 7px;
		width: 70%;
	}
	.lupa img {
		max-width: 100%;
		width: 100%;
		height: auto;
	}
}
@media (max-width: 558px) {
	.countdown-inner .one-number .number {
		background-color: #901878;
		border-radius: 100%;
		text-align: center;
		font-size: 2rem;
		font-weight: 900;
		color: #FFF;
		padding-top: 0;
		width: 60px;
		height: 60px;
		line-height: 60px;
		margin: auto;
	}
	.countdown-inner .indicador {
		font-size: 16px;
	}
	p {
		font-size: 18px;
	}
	.row-participa-btn a {
		font-size: 24px !important;
	}
	.col-12 {
		width: 100%;
	}
	small{
		display: none;
	}
	.legal {
		font-size: 13px;
	}
	.label-big {
		display: table;
		font-size: 13px;
		color: #901878;
		margin: 00 0;
		font-family: 'Gotham Book', sans-serif;
		font-weight: 500;
		padding-top: 5px;
	}
	.inicio .inicio-inner {
		width: 100%;
		max-width: 700px;
		position: relative;
		margin: 10px auto 20px;
	}
	label {
		font-size: 18px;
	}
	.mCheck {
		margin: 15px 0 0 6px;
		width: 47%;
	}
	span {
		font-size: 12px;
		width: 100%;
		float: left;
	}
	.checkBox {
		width: 20px;
		margin: 1px 5px 0 15px;
		float: left;
	}
	#modal-producto {
		position: fixed;
		z-index: 1000;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
	}
	#modal-producto .modal {
		position: absolute;
		z-index: 9999;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		overflow: auto;
		background-color: rgb(0,0,0);
		background-color: rgba(0,0,0,0.4);
		display: block;
	}

  #modal-mensaje {
    position: fixed;
    z-index: 1000;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }

  #modal-mensaje .modal {
		position: absolute;
		z-index: 9999;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		overflow: auto;
		background-color: rgb(0,0,0);
		background-color: rgba(0,0,0,0.4);
		display: block;
	}
#modal-mensaje .modal{
  display: table;
}
#modal-mensaje .modal p {
    font-size: 21px;
}

#modal-producto .modal-content {
    margin: 0 auto;
    padding: 0;
    border: none;
    width: 90%;
    max-width: 600px;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    position: relative;
}

#modal-mensaje .modal-content {
    margin: 0 auto;
    padding: 0;
    border: none;
    width: 90%;
    max-width: 600px;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    position: relative;
}
.btn-secundary-2{
    margin: 25px auto 40px;
}	
.titulo-ganadores {
    max-width: 550px;
    width: 90%;
    margin: 20px auto 30px;
    text-align: center;
}
	.row-participa-btn {
    width: auto;
    text-align: center;
    margin: 20px auto 0;
}
.inicio-paticipa .inicio-inner {
    width: 100%;
}
.btn-secundary {
    font-size: 18px;
}
.countdown-inner .indicador {
    font-size: 13px;
}
}
@media (max-width: 460px) {
	.legal {
		font-size: 16px;
	}
	.medium-input.button1 {
		width: 100%;
	}
	.mCheck {
		margin: 15px 0 10px 0px;
		width: 100%;
	}
	.img-fin {
		margin: 10% auto 15%;
	}
	.footer.fin {
		position: fixed;
		bottom: 0;
	}

}

@media (max-width: 410px) {

  .medium-input.button1{
  		width: 100%;
  }
  .mCheck {
      width: 100%;
  }
}
@media (max-width: 375px) {
	.btn-secundary-2 {
		font-size: 24px;
		line-height: 31px;
	}
	.corazones-bottom {
		display: none;
	}
	.btn-primary {
		font-size: 25px;
	}
	.btn-primary.ancho-max2 {
    font-size: 18px;
	}
	.btn-primary.ancho-max3 {
		font-size: 18px;
	}
	.countdown-inner .one-number .number {
		background-color: #901878;
		border-radius: 100%;
		text-align: center;
		font-size: 1.5rem;
		font-weight: 900;
		color: #FFF;
		padding-top: 0;
		width: 50px;
		height: 50px;
		line-height: 50px;
		margin: auto;
	}
	.countdown-inner .indicador {
    font-size: 12px;
}
}
@media (max-width: 330px) {
	.legal {
		font-size: 11px;
	}
	span {
    	font-size: 11px;
	}
	.btn-secundary {
		font-size: 18px;
	}
}
@media (max-width: 319px) {
	.compensation {
		max-width: 100%;
	}
}