* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
/* elementos html */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1 {
  font-family: "Merriweather", Arial;
  font-size: 2.8em;
}
.con_sombra {
  text-shadow: 0 0 6px rgba(0, 0, 0, .75);
}
.sin_sombra {
  text-shadow: none;
}
h2 {
  font-family: "Merriweather", Arial;
  line-height: 26px;
  font-size: 1.2em;
  padding-left: 10px;
}
p, label {
  font-family: "Roboto", Arial;
  font-size: 1.3em;
  line-height: 1.2em;
}
/* layout */
span {
  font-family: "Roboto", Arial;
}
ol {
  margin: 0;
  padding: 0;
  list-style-position: inside;
}
ol > li {
  font-family: "Roboto", Arial;
}
.wrapper {
  width: 960px;
  margin: 10px auto;
  padding: 20px;
}
.mosca {
  position: fixed;
  bottom: 10px;
  right: 6px;
  text-align: right;
  width: auto;
  z-index: 9999;
  display: none;
}
.panel, .panel2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 100%;
  background: #fff;
  display: flex;
}
.panel2 {
  flex-flow: row wrap;
}
.panel3 {
  position: static;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: inline-block;
  margin: auto;
}
.panel3 .contenido {
  padding: 0 20%;
  width: 100%;
}
.panel .contenido, .panel2 .contenido {
  padding: 2% 2% 1% 5%;
  width: 65%;
}
#slideTwo, #slideThree, #slideFour, #slideFive, #slideSix, #slideSeven, #slideEight {
  display: none
}
.panel aside, .panel2 aside {
  width: 35%;
  height: 100vh;
  padding: 2% 8% 0 0;
  align-self: center;
  -webkit-box-shadow: -3px 0px 15px -5px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: -3px 0px 15px -5px rgba(0, 0, 0, 0.75);
  box-shadow: -3px 0px 15px -5px rgba(0, 0, 0, 0.75);
}
.panel2 aside {
  height: auto;
}
.panel aside {
  position: fixed;
  top: 0;
  right: 0;
}
aside.no-shadow {
  -webkit-box-shadow: 0 0 rgba(0, 0, 0, 0);
  -moz-box-shadow: 0 0 rgba(0, 0, 0, 0);
  box-shadow: 0 0 rgba(0, 0, 0, 0);
}
#buttonContainer {
  width: 100%;
}
.cervezas {
  background-image: url("../img/mapas/mapa-cervezas.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}
.deporte {
  background-image: url("../img/mapas/mapa-deportiva.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}
.deportes.con-cover {
  background-image: url("../img/deportivas-cover.jpg");
  background-size: cover;
  background-attachment: fixed;
}
/*.detergentes {
    background-image: url("../img/leche/vaca1.png");
    background-size: 100%;
	background-position: center center;
	background-repeat: no-repeat;
}*/
.detergente.con-cover {
  background-image: url("../img/leche/leche-cover.jpg");
  background-size: cover;
  background-attachment: fixed;
}
.detergentes {
  background-image: url("../img/mapas/mapa-detergentes.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}
/*.detergente.con-cover {
	background-image: url("../img/detergente-cover.jpg");
    background-size: cover;
	background-attachment: fixed;
} */
.comida-rapida {
  background-image: url("../img/comida-rapida.jpg");
  background-size: cover;
}
.comida-rapida.con-cover {
  background-image: url("../img/comida-rapida-cover.jpg");
  background-size: cover;
  background-attachment: fixed;
}
.cervezas.con-cover {
  background-image: url(../img/cerveza-cover.jpg);
  background-size: cover;
  background-attachment: fixed;
}
.tecnologia {
  background-image: url("../img/mapas/mapa-tecnologia.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}
.tecno.con-cover {
  background-image: url(../img/tecnologia-cover.jpg);
  background-size: cover;
  background-attachment: fixed;
}

.cafe {
  background-image: url("../img/mapas/left-cafe.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}
.cafes.con-cover {
  background-image: url(../img/cafe-cover.jpg);
  background-size: cover;
  background-attachment: fixed;
}

.espanolas {
  background-image: url(../img/espanolas.jpg);
  background-size: cover;
}
.espanol.con-cover {
  background-image: url("../img/espanolas-cover.jpg");
  background-size: cover;
  background-attachment: fixed;
}
.supermercados {
  background-image: url("../img/mapas/mapa-supermercados.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}


.procesados {
  background-image: url("../img/mapas/mapa-embutido.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}

.smartwatch {
  background-image: url("../img/mapas/mapa-reloj.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}

.salud {
    background-image: url("../img/mapas/fotolateralsalud.png");
    background-size: 100%;
	background-position: center center;
	background-repeat: no-repeat;
}

.embutidos.con-cover {
  background-image: url("../img/embutido/embutido_fondo.png");
  background-size: cover;
}

.supermercados.con-cover {
  background-image: url(../img/supermercados-cover.jpg);
  background-size: cover;
}
.champus {
  background-image: url(../img/champu.jpg);
  background-size: cover;
}
.modas {
  background-image: url("../img/mapas/mapa-moda.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}
.telecos {
  background-image: url("../img/mapas/telco.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}
.modas.con-cover {
  background-image: url(../img/moda-cover.jpg);
  background-size: cover;
}
.salud.con-cover {
  background-image: url(../img/salud.jpg);
  background-size: cover;
}
.smartwatch .con-cover {
  background-image: url("../img/smartwatch/fondo_reloj.png");
  background-size: cover;
}

.telecomunicaciones.con-cover {
  background-image: url("../img/telecomunicaciones-cover.jpg");
  background-size: cover;
}
.tvod {
  background-image: url("../img/mapas/mapa-tv.png");
  background-size: 85%;
  background-position: center center;
  background-repeat: no-repeat;
}
.tvod.con-cover {
  background-image: url(../img/tvondemand-cover.jpg);
  background-size: cover;
}
.grid {
  display: none;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}
.grid article {
  width: 150px;
  height: 180px;
}
.grid article span {
  position: absolute;
  top: 50%;
  left: 50%;
  text-align: center;
  transform: translate(-50%, -50%);
}
/* .roundedButton {
    position: relative;
    opacity: 1;
    border: 3px solid rgba(0,0,0,.6);
    border-radius: 20px;
    margin: 1%;

    box-shadow: 0 0 10px rgba(51,51,51,.6),
                inset 6px 8px 6px rgba(222,222,222,.4);
    

    transform: perspective(400px) translateZ(0);

    will-change: transform;
    transition: all .2s;
} */
/* RoundedButton helado */
.roundedButton {
  opacity: 1;
  width: 48%;
  position: relative;
  animation-duration: 0.4s;
  /* 
    border: 3px solid rgba(0,0,0,.6);
    border-radius: 20px;
    margin: 1%;

    box-shadow: 0 0 10px rgba(51,51,51,.6),
                inset 6px 8px 6px rgba(222,222,222,.4);
    

    transform: perspective(400px) translateZ(0);

    will-change: transform; */
  transition: all .2s;
}
.roundedButtonWhite {
  position: relative;
  opacity: 1;
  border: 3px solid rgba(0, 0, 0, .6);
  border-radius: 20px;
  margin: 1.5%;
  padding: 16px 10px;
  box-shadow: 0 0 10px rgba(51, 51, 51, .6), inset 6px 8px 6px rgba(222, 222, 222, .4);
  transform: perspective(400px) translateZ(0);
  will-change: transform;
  transition: all .2s;
  background-color: #ffffff;
}
.roundedButtonWhite [type='button'] {
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  background-color: #e60000;
  color: #ffffff;
  padding: 16px 14px;
  border: 1px solid #fff;
  border-radius: 8px;
}
/* .cervezas .roundedButton {
    background: #e60000;
}

.deportes .roundedButton {
	background: #e60000;
}

.telecomunicaciones .roundedButton {
	background: #e60000;
}

.detergente .roundedButton {
	background: #e60000;
}

.comida-rapida .roundedButton {
	background: #e60000;
}

.tecno .roundedButton {
    background: #e60000;
}

.espanol .roundedButton {
    background: #e60000;
}

.supermercados .roundedButton {
    background: #e60000;
}

.modas .roundedButton {
    background: #e60000;
}

.tvod .roundedButton {
    background: #e60000;
}

.champu .roundedButton {
    background: #467c98;
}

.teleco .roundedButton {
    background: #e60000;
}

.roundedButton:hover {
    box-shadow: 0 0 10px 4px rgba(0,0,0,.6),
                inset 6px 8px 6px rgba(222,222,222,.4);
    border: 3px solid rgba(0,0,0,.6);

    background: #005500;

    transform: perspective(400px) translateZ(20px);

    cursor: pointer;
} */
.roundedButton:hover {
  /*transform: perspective(400px) translateZ(20px);*/
  animation: rubberBand 0.5s ease-out;
  cursor: pointer;
}
.roundedButton:hover span {
  color: #fff;
}
.roundedButton .item {
  position: absolute;
  top: 50%;
  left: 50%;
  text-align: center;
  transform: translate(-50%, -50%);
  transition: all .2s;
}
.roundedButton .item img {
  /* position: absolute;
    top: 50%;
    left: 50%;

    text-align: center;

    transform:  translate(-50%, -50%);

    transition: all .2s; */
  /* width: 90%; */
  border-radius: 30px;
  border: 3px solid var(--roxo);
}
figcaption {
  margin-top: 1px;
  font-family: Arial;
  font-size: 1em;
}
/*
#formWrapper {
    width: 84%;
}

.fila {
    display: flex;
    flex-flow: row wrap;
    align-content: flex-end;
}

.fila2 {
    display: inline-block;
}

.fila2 input[type='checkbox'] {
    margin: 0 10px;
}

[type='checkbox'] + span {
    color: #666;
    font-size: .75em;
}

[type='radio'] { 
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

[type='radio'] + img {
  cursor: pointer;
  opacity: .3;
}

[type='radio'] ~ span {
    opacity: 0;
    text-align: center;
    width: 90%;
    
    font-size: .8em;
    line-height: 1.2em;
}

[type='radio']:checked + img {
  opacity: 1;
}

[type='radio']:checked ~ span {
    opacity: 1;
    border: 1px solid #e60000;
    padding: 4px 2px;
    
    font-family: "Roboto";
    font-size: .7em;
    line-height: 1.2em;
    color: #e60000;
}

.radioWrapper{
    padding: 4px;
    align-self: flex-start;
}

.inputTextWrapper {
    width: 100%;
    padding: 4px;
    
    align-self: flex-end;
}

[type='text'], [type='tel'], [type='email'] {
    width: 100%;
    border: none;
    border-bottom: 2px solid #ccc; 
    padding: 2px;
    background-color: transparent;
}

[type='text']:focus {
    border-bottom: 2px solid #00ff00;
}

.inputTextWrapper2 {
    width: 50%;
    padding: 4px;
    
    align-self: center;
}

.inputTextWrapper3 {
    width: 33.333%;
    padding: 4px;
    
    align-self: center;
}

[type='submit'] {
    border: 0px solid #333;
    background: #380B61;
    color: #fff;

    border-radius: 10px;
    padding: 20px 14px !important;

    text-transform: uppercase;
    font-size: 1.1em !important;
    font-weight: 700;

    margin: 10px auto 50px auto;
}

[type='submit'] {
    cursor: pointer;
}

[type='number'] {
    padding: 8px 4px;
}
*/
/* CSS Document */
fieldset {
  margin: 0;
  padding: 0;
  border: none;
}
/* GRID */
.twelve {
  width: 100%;
}
.eleven {
  width: 91.53%;
}
.ten {
  width: 83.06%;
}
.nine {
  width: 74.6%;
}
.eight {
  width: 66.13%;
}
.seven {
  width: 57.66%;
}
.six {
  width: 49.2%;
}
.five {
  width: 40.73%;
}
.four {
  width: 32.26%;
}
.three {
  width: 23.8%;
}
.two {
  width: 15.33%;
}
.one {
  width: 6.866%;
}
/* COLUMNS */
.col {
  display: block;
  float: left;
  margin: 0 0 0 1.6%;
}
.col:first-of-type {
  margin-left: 0;
}
.container {
  width: 100%;
  max-width: 750px;
  margin: 0;
}
.form-wrapper {
  background-color: #bd1c22;
  padding: 40px 20px;
  border-radius: 10px;
  box-shadow: 0 0 6px rgba(0, 0, 0, .5);
}
.row {
  padding: 0;
}
/* CLEARFIX */
.cf:before, .cf:after {
  content: " ";
  display: table;
}
.cf:after {
  clear: both;
}
.cf {
  *zoom: 1;
}
.wrapper {
  width: 100%;
  margin: 30px 0;
}
/* STEPS */
.steps {
  list-style-type: none;
  margin: 0;
  padding: 0;
  background-color: #bd1c22;
  text-align: center;
}
.steps li {
  display: inline-block;
  margin: 20px;
  color: #ccc;
  padding-bottom: 5px;
}
.steps li.is-active {
  border-bottom: 1px solid #bd1c22;
  color: #3498db;
}
/* FORM */
.container {
  padding: 0 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #bd1c22;
  /* background-color:#204175; */
  opacity: 1;
  width: 100%;
  border-radius: 10px;
  /*min-height: 300px;*/
}
.container .section h3 {
  margin-bottom: 30px;
}
.container .section.is-active {
  opacity: 1;
  -webkit-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
}
.container .button, .container .submit {
  background-color: #bd1c22;
  display: inline-block;
  padding: 8px 30px;
  color: #fff;
  cursor: pointer;
  font-size: 14px !important;
  font-family: 'Open Sans', sans-serif !important;
}
.container .submit {
  border: none;
  outline: none;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.container input[type="text"], .container input[type="email"], .container input[type="tel"], .container input[type="password"], .container select {
  display: block;
  padding: 10px;
  margin: 10px auto;
  background-color: #ffffff;
  border: none;
  width: 100%;
  outline: none;
  font-size: 14px !important;
  font-family: 'Open Sans', sans-serif !important;
}
.container input[type="radio"] {
  display: none;
}
.container input[type="radio"] + label {
  display: block;
  border: 1px solid #ccc;
  width: 100%;
  max-width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  position: relative;
}
.container input[type="radio"] + label:before {
  content: "✔";
  position: absolute;
  right: -10px;
  top: -10px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border-radius: 100%;
  background-color: #fff;
  color: #1274B3;
  display: none;
  text-align: center;
}
.container input[type="radio"]:checked + label:before {
  display: block;
}
.container input[type="radio"] + label h4 {
  margin: 15px;
  color: #fff;
}
.container input[type="radio"]:checked + label {
  border: 1px solid #fff;
}
.container input[type="radio"]:checked + label h4 {
  color: #fff;
}
#noProxima, #Proxima {
  display: none;
}
.wrap {
  background: #bd1c22;
  border-radius: 10px;
  /*padding: 39px 45px 19px;*/
  margin: auto;
}
.wrap .tips {
  font-size: 14px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  padding: 10px 0;
  margin: auto;
  width: 98%;
  color: #fff;
}
.wrap .tips p {
  margin-bottom: 0;
  margin-top: 0;
  margin-right: 50%;
  width: 50%;
}
.wrap .group {
  position: relative;
  padding-bottom: 5px;
}
.wrap .group::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 100%;
  height: 2px;
  background: #edf0f5;
  -webkit-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
  z-index: 1;
  transform: translate(-50%, 0);
}
/*.wrap .group.active label {
  top: -15px;
  font-size: 14px;
}*/
.wrap .group.active::before {
  background: #bd1c22;
}
.wrap svg {
  width: 70px;
  position: absolute;
  top: -27%;
  right: 0;
  fill: #c5d6e7;
  cursor: pointer;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.wrap svg.active {
  fill: #222222;
}
/*
.wrap label {
  position: absolute;
  top: 5px;
  left: 0;
  -webkit-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
  pointer-events: none;
}
*/
.wrap .number {
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.wrap .number.active {
  color: #B7DBFE;
  text-decoration: line-through;
}
.wrap .count {
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.wrap .count.active {
  color: #B7DBFE;
  text-decoration: line-through;
}
.wrap .upper {
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.wrap .upper.active {
  color: #B7DBFE;
  text-decoration: line-through;
}
.wrap input {
  border: 0;
  position: relative;
  display: block;
  /*width: 50%;*/
  padding: 4px 0;
}
.wrap input:focus {
  outline: none;
}
[type='submit'] {
  border: 0px solid #333;
  /* background: #380B61; */
  background: #2FAF74;
  color: #fff;
  border-radius: 10px;
  padding: 20px 14px !important;
  text-transform: uppercase;
  font-size: 1.1em !important;
  font-weight: 700;
  margin: 10px auto 50px auto;
  box-shadow: 0 0 4px 4px rgba(255, 255, 255, .8);
}
[type='submit'] {
  cursor: pointer;
}
[type='number'] {
  padding: 8px 4px;
}
/* ANIMACIÓN DE RULETA */
@keyframes ruleta {
  from {
    transform-origin: center;
    transform: rotateZ(0);
  }
  to {
    transform-origin: center;
    transform: rotateZ(3600deg);
  }
}
@keyframes clicBoton {
  from {
    transform-origin: center;
    transform: scale(1, 1);
    opacity: 1;
  }
  to {
    transform-origin: center;
    transform: scale(4, 4);
    opacity: .1;
  }
}
.animado {
  animation: ruleta 5s ease-out;
}
.clicado {
  animation: clicBoton 250ms ease-out;
}
.notAnimado {
  animation: none;
}
.ruleta {
  position: relative;
  width: 100%;
  height: 100%;
  top: 6%;
}
.ruleta > img {
  width: 100%;
  position: relative;
  top: -220px;
}
.pointer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.pointer > img {
  width: 300px;
}
#birthDateContainer {
  display: none;
}
/* colores */
.fondoBlanco {
  background-color: #fff;
}
.blanco {
  color: #fff;
}
.gris_oscuro {
  color: #333;
}
.rojo {
  color: #333333;
  background-color: #fff;
}
.gris_claro {
  color: #555555;
}
.negro {
  color: #000000;
}
/* helpers */
.margenSup10 {
  margin-top: 10px
}
.margenSup20 {
  margin-top: 20px
}
.margenSup40 {
  margin-top: 40px
}
.margenSup60 {
  margin-top: 60px
}
.margenInf40 {
  margin-bottom: 40px
}

.faldon {
  position: fixed;
  top: 0;
  right: -100%; /* Oculto fuera de la pantalla */
  width: 100%;  /* Ocupa todo el ancho */
  height: 100%;
  background: rgba(0, 0, 0, 0.8); 
  color: white;
  overflow-y: auto;
  padding: 20px;

  transition: right 0.4s ease-in-out; /* Animación de entrada/salida */
}
/* Mostrar el faldón */
.faldon.activo {
  right: 0; /* Lo desliza hacia dentro */
}

/* Botón de cierre */
.cerrar {
  position: absolute;
  top: 15px;
  right: 20px;
  font-size: 25px;
  cursor: pointer;
  background: none;
  border: none;
  color: white;
}

/* Enlace para abrir el faldón */
.enlace-abrir {
  position: fixed;
  top: 20px;
  right: 20px;
  text-decoration: none;
  background: black;
  color: white;
  padding: 10px 15px;
  border-radius: 5px;
}

/* personaliza iframe */
#preview {
  width: 98.5%;
  height: 98.5%;
  padding: 1%;
  border: none;
}
/* premiados */
/* .margenSup40 img{
    position: relative;
    top: -150px;
} */
.textoCentrado {
  text-align: center;
}
.centrado {
  width: 80%;
  margin: auto;
}
.centrado2 {
  width: 60%;
  margin: auto;
}
.font-xs {
  font-size: .7em
}
.font-s {
  font-size: .85em
}
.font-todas {
  font-size: 12pt;
  text-align: left;
}
.font-xl {
  font-size: .8em
}
.font-roboto {
  font-family: 'Roboto', Arial;
}
.only-mobile {
  display: none;
}
.no-mobile {
  display: block;
}
/* LIGHTBOX */
#lightbox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .75);
  z-index: 99999;
  display: none;
}
.lb-container {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40%;
  height: auto;
  background: #fff;
  padding: 20px;
  transform: translate(-50%, -50%);
  border-radius: 12px;
}
#btnCerrar {
  border: 0px solid #333;
  background: #380B61;
  color: #fff;
  width: 50%;
  margin: auto;
  border-radius: 10px;
  padding: 20px 14px !important;
  text-transform: uppercase;
  font-size: 1.1em !important;
  font-weight: 700;
}
#btnCerrar:hover {
  cursor: pointer;
}
#pgcheck_container {
  display: none;
}
/* CheckBox verde estilo iOS */
.wrapper1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* width: 400px; */
  width: 50px;
  /* margin: 40vh auto 0; */
  /* margin: 10vh left 0; */
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
/* .switch_box{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex; */
/* max-width: 80px;
	min-width: 80px; */
/* height: 40px;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
} */
.box_1 {
  /* background: #fff; */
  background: #bd1c22;
  /* background: #204175; */
}
input[type="checkbox"].switch_1 {
  font-size: 15px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 2.3em;
  height: 1.5em;
  /* background: #ddd; */
  background: #bdbcbc;
  border-radius: 3em;
  position: relative;
  cursor: pointer;
  outline: none;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
input[type="checkbox"].switch_1:checked {
  background: #14d33d;
}
input[type="checkbox"].switch_1:after {
  position: absolute;
  content: "";
  width: 1.5em;
  height: 1.5em;
  border-radius: 50%;
  background: #fff;
  -webkit-box-shadow: 0 0 .25em rgba(0, 0, 0, .3);
  box-shadow: 0 0 .25em rgba(0, 0, 0, .3);
  -webkit-transform: scale(.7);
  transform: scale(.7);
  left: 0;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
input[type="checkbox"].switch_1:checked:after {
  left: calc(100% - 1.5em);
}
/* Fin Botón verde estilo iOS */