/*PC*/
#start{
  max-width: 1360px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.modal-contratar{
  max-width: 1200px;
  padding: 5rem .5rem;
}
.tipo-plan{
	margin-top: 1rem;
	padding: 2rem;
}

.planes-texto-pc{
  font-size: 1rem;
  font-size: 1rem;
  margin-bottom: 2rem;
  opacity: .8;
}
#PLUS-plan-color{
  background: var(--seccion-productos);
  color: var(--seccion-productos-color);
	border-radius: 5px 25px 5px 25px;
}
.plan-color{
  background: var(--seccion-productos);
  color: var(--seccion-productos-color);
	border-radius: 5px 25px 5px 25px;
}

.plan-color .planes a, #PLUS-plan-color .planes a{
  box-shadow: none;
}


.titulo-planes{
	margin-bottom:1rem;
	padding: 0 .5rem;
	font-size: 1.7rem;
  font-weight: 700;
}
.abreviatura{
	font-size: .7rem;
	padding: .2rem .5rem;
	border-radius: 50px;
	margin-left: .5rem;
	background-color: var(--second-color);
	color: var(--theme-color);
  position: relative;
  bottom: 6px;
}
.planes{
	display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.planes a{
	color: var(--second-color);
	text-decoration: none;
	border-radius: 50px;
	padding: .5rem 1rem;
  background: var(--card-body-fondo);
	box-shadow: var(--box-shadow-planes);
	margin-right: 1rem;
	font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
}
.planes a:hover{
	color: var(--theme-color);
	background: var(--second-color);
	box-shadow: none;
	opacity: 1;
}

.detalles{
	box-shadow: none !important;
  background: none !important;
  color: #ff8d6d !important;
	opacity: .7;
	font-weight: 600 !important;
  display: none;
}

/*smartcard*/

.intro-card{
  text-align: center;
  background: var(--second-color);
  color: var(--theme-color);
  border-radius: 50px;
  padding: 0.5rem 1rem;
  font-size: .9rem;
  width: fit-content;
  margin: 0 auto 2rem;
}

.seccion-tools{
  padding: 0 2rem 2rem;
  font-weight: 500;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  color: var(--texto-color);
  margin-top: 7rem;
  max-width: 700px;
}
.iconos-tools{
  text-align: center;
}
.iconos-tools svg{
  text-align: center;
  width: 70px;
  margin: auto;
}
.contenido-tools ul{
  list-style: unset !important;
}
.contenido-tools li{
  text-align: left !important;
}
.content-card{
  text-align: center;
  padding: 1.5rem .8rem;
  border-radius: 40px;
  margin-bottom: 3rem;
  margin: 0 auto 4rem;
  border-radius: var(--card-border-radius);
  max-width: 600px;
}

.content-card p {
  margin: 0 !important;
  padding: 0 !important;

}
#tabPanel > div {
  display: none;
}
#CerrarPanel {
  display: none;
  padding-top: 1rem;
}


.form-link .offcanvas-body{
  justify-content: normal !important;
  padding: 6rem 1.5rem !important;

}

.form-link .offcanvas-body h1{
  text-align: left;
  padding-bottom: 1rem;
  font-weight: 900!important;
  font-size: 2rem;
  color: #2d2a26;

}
.form-link input[type=checkbox],
.form-link input[type=radio] {
  appearance: none;
  background-color: var(--form-fondo-input);
  font: inherit;
  color: currentColor;
  width: 1.15em;
  height: 1.15em;
  border-radius: 50%;
  transform: translateY(-0.075em);
  border: 0.15em solid var(--form-fondo-input);
  margin-top: .5rem;
  margin-right: 0.5rem;
  
}
.form-link input[type=checkbox]:checked, 
.form-link input[type=radio]:checked {
  background: var(--form-check-fondo);
  border-color: var(--form-check-border);
  color: var(--form-check);
  content: '\f00c';
}
.radio {
  margin: 1rem 0;
}
.radio label{
  display: initial;
  opacity: .9;
  font-weight: 600;
  font-size: 1rem;
}

form .buttons {
  display: flex;
  width: 100%;
  flex-direction: row;
  justify-content: flex-end;
}

.form-spacer h3{
  text-align: left;
  margin-top: 3rem;
}

.lista-cotizar{
  display: flex;
  flex-direction: column;
}
.entry-details-cotizar{
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: var(--shadow-boton-hover);
  border-radius: 20px;
  margin: .5rem 2rem;
  padding: 1rem .5rem;
}
.detalles-cotizar{
  text-align: left;
  display: flex;
  flex-direction: column;
  align-content: flex-start;
  margin-top: 1rem;
}
.detalles-cotizar .plataforma{
  text-transform: uppercase;
  font-weight: 600;
  margin-top: .5rem;
}
.detalles-cotizar .date{
  font-size: .8rem;
  opacity: .6;
}

.detalles-cotizar a{
  color: var(--theme-color);
  border-radius: 50px;
  padding: 0.5rem 0.5rem;
  background: var(--second-color);
  margin-top: 0.5rem;
}
.detalles-cotizar .status{
  opacity: .5;
}

.form-section{
  display: none;
}
/*pwa*/

.white{
  background: var(--azul-color);
  transition: all 2000ms;
}
.calendly-inline-widget{
  height: 640px;
}
[class*="hidden"] {
  display: none !important;
}
.page{
  transition: all 500ms;
  color: var(--texto-color) !important;
}

a{
    color: var(--focus-color);
  }
  a:not([href]):not([class]), a:not([href]):not([class]):hover{
    color: inherit;
  }
  .elemento-horizontal{
    width: 30vw;
    text-align: center;
    margin: auto;
  }
  .headroom--top{
    transform: translateY(-200%);
  }
  
  .smartlink-pwa .headroom--top{
    transform: translateY(0);
  }
  
  .smartlink-pwa .slideBottom{
    transform: translateY(0) !important;
  }
  
  .center{
    text-align: center;
  }
  .active{
    color: var(--active-seccion-cuatro) !important;
  /*  background: var(--fondo-boton-bg); */
    transition: all .2s ease-in;
  }
  
  .active h3{
    color: var(--second-color) !important;
    font-size: calc(1.2rem + .6vw) !important;
    transition: all .2s ease-in;
    border: 3px solid #2d2a26;
    box-shadow: 11px 10px 0px 4px rgba(0,0,0,1);
    -webkit-box-shadow: 11px 10px 0px 4px rgba(0,0,0,1);
    -moz-box-shadow: 11px 10px 0px 4px rgba(0,0,0,1);
    border-radius: 50px;
    padding: 1rem;
    width: 80vw;
    margin: 0 auto 1rem;
    font-weight: 800 !important;
  }
  
  .active h5{
    color: var(--active-seccion-cuatro) !important;
    font-size: 1.1rem !important;
    transition: all .2s ease-in;
  }
  
  .active .img{
    display: block !important;
  }
  .active video{
    display: block !important;
  }
  .smartlink-cliente{
    text-align: center;
    border-radius: 30px;
    width: 90vw;
    margin: auto;
    padding: 2rem 0;
  
  }
  .smartlink-cliente .img{
    width: 50%;
    position: fixed;
    top: 0%;
    display: none;
    border-radius: 20px;
    text-align: center;
    margin: 2rem auto;
    border: 3px solid #2d2a26;
    box-shadow: 11px 10px 0px 4px rgba(0,0,0,1);
    -webkit-box-shadow: 11px 10px 0px 4px rgba(0,0,0,1);
    -moz-box-shadow: 11px 10px 0px 4px rgba(0,0,0,1);
    height: 400px;
    overflow: hidden;
  }
  .smartlink-cliente img{
    width: 100%;
    animation: slide-up 10s infinite;
  }

  @keyframes slide-up {
    from {
      margin-top: -20%;
    }
  
    to {
      margin-top: -500%;
    }
  }
  
  .smartlink-cliente video{
    width: 50%;
    position: fixed;
    top: 0%;
    display: none;
    border-radius: 20px;
    text-align: center;
    margin: 2rem auto;
    box-shadow: var(--box-shadow-planes);
  }
  
  header.smartlink-pwa{
    height: 150vh;
  }
  nav.smartlink-header{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    padding: 1rem .50rem;
    position: fixed;
    bottom: 0 !important;
    right: 0 !important;
    width: 100%;
  
  }
  
  .absolute-bottom{
    position: fixed !important;
    top: 0 !important;
    right: 2% !important;
  
  }
  
  a.absolute-bottom{
    padding: 0.5rem 0.5rem 0 0.5rem;
    border-radius: 50px;
    height: 3rem;
    width: 3rem;
    text-align: center;
    font-size: 1.8rem;
    /* letter-spacing: 2px; */
    font-weight: 900;
    color: var(--second-color);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background: var(--btn-header-contacto-fondo);
    box-shadow: 3px 3px 0px 1px rgba(0,0,0,1);
    -webkit-box-shadow: 3px 3px 0px 1px rgba(0,0,0,1);
    -moz-box-shadow: 3px 3px 0px 1px rgba(0,0,0,1);
    margin: 1rem 0.5rem;
    z-index: 100;
    mix-blend-mode: difference;
    color: #fff !important;
  }
  .smartlink-header a{
    padding: .50rem .20rem;
    border-radius: 50px;
    width: 30%;
    text-align: center;
    font-size: 1.90vh;
    letter-spacing: 2px;
    font-weight: 900;
    color: var(--second-color);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    background-color: rgba(250,250,250,.5);
    box-shadow: var(--shadow-boton-bg) ;
  
  }
  
  a.smartlink-boton{
    padding: .20rem;
    border-radius: 50px;
    border: 4px solid transparent ;
    width: 30%;
    text-align: center;
    font-size: 2vh;
    letter-spacing: 2px;
    font-weight: 900;
    color: var(--second-color);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(10px);
    background-color: transparent;
    box-shadow: none;
  }
  
  .smartlink-video{
    text-align: center;
    height: 100vh;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }
  .smartlink-video img{
    border-radius: 40px;
    max-width: 50%;
  /*  border: 4px solid var(--border-index-video);*/
    box-shadow: var(--box-shadow-planes);
  }
  
  .seccion-uno{
    padding: 2rem;
    font-size: 6vw;
    font-weight: 700;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  
  }
  
  
  
  .seccion-uno em{
  
    font-style: normal !important;
    border: 3px solid;
    border-radius: 50px;
    padding: 0 .5em;
  
  }
  
  
  
  .parrafo-main{
    margin: 3.2rem 0 0;
  }
  
  .seccion-dos{
    height: 100vh;
    border-radius: 0;
    padding: 2rem .50rem;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
  }
  
  .seccion-columnas-texto{
    margin: 6rem auto 8rem;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
  
  }
  
  .seccion-columnas-texto p{
    font-size: 1.4rem;
  
  }
  
   .seccion-columnas-texto{
    color: var(--text-seccion-dos) !important;
    transition: color 0.2s ease-in-out;
  }
  
   .seccion-columnas-texto h3{
    color: var(--text-seccion-dos) !important;
      transition: color .2s ease-in-out;
  }
  
  .header-icono-svg .cls-1{
        fill: var(--theme-color);
        transition: all 700ms;
  }
  .header-icono-svg-derecha .cls-1{
        fill: var(--theme-color);
        transition: all 700ms;
  }
  
  .activar .cls-1{
        fill: #ff8d6b !important;
        transition: all 700ms;
  }
  
  .header-icono-smartlink{
    display: flex;
    flex-direction: row;
    align-content: center;
    flex-wrap: nowrap;
    align-items: center;
    margin-bottom: 1rem;
  }
  
  .header-icono-svg{
    width: 0.5rem;
    position: relative;
    right: 15px;
  }
  .header-icono-smartlink h3{
    width: 100%;
    text-align: left;
    margin-bottom: 0 !important;
    font-size: 2rem;
  }
  .parrafo-smartlink-tres-izq{
    padding: 3rem 2rem 2rem 40px;
    background: var(--second-color);
    border-radius: 50px;
    margin: 1rem;
  }
  .parrafo-smartlink-tres-derecha{
    text-align: right;
    margin-top: 3rem;
    padding: 0 40px 0 2rem;
  }
  .parrafo-smartlink-tres-derecha span{
    opacity: .7;
  }
  .header-icono-smartlink-derecha{
    display: flex;
    flex-direction: row-reverse;
    align-content: center;
    flex-wrap: nowrap;
    align-items: center;
    margin-bottom: 1rem;
  }
  
  .header-icono-svg-derecha{
    width: 0.5rem;
    position: relative;
    left: 15px;
  }
  .header-icono-smartlink-derecha h3{
    width: 100%;
    text-align: right;
    margin-bottom: 0 !important;
    font-size: 1.5rem;
  }
  .seccion-producto-video{
    margin: 1rem 0 0;
    border-radius: 0;
    padding: 2rem .50rem;
  }
  
  .seccion-producto-video h3{
    font-size: 1.3rem;
    color:var(--color-idex-productos);
  }
  .seccion-producto-video h5{
    font-size: 1.1rem;
    color:var(--color-idex-productos);
  }

  
  
  .seccion-cita-texto{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
    text-align: center;
  
  }
  .seccion-cita-titulo{
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    width: 90%;
    transition: all .2s ease-in-out;
    padding: .5rem;
    border-radius: 10px 10px;
  }
  .seccion-cita-texto .activar{
    font-size: 1.4rem;
    padding: 1rem;
    background-color: var(--second-color);
    border-radius: 20px 40px;
    color: var(--theme-color);
    transition: all .2s ease-in-out;
  }
  
  .seccion-cita-descripcion{
    font-size: 1rem;
  }
  
  .seccion-index-contratar{
    padding: 0 0.5rem;
    width: 100%;
  }
  .seccion-index-contratar h5{
  border-radius: 50px;
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      padding: 1rem;
      width: fit-content;
      margin: auto;
    }
  .svg-img-contacto{
    margin: 1rem auto;
  }
  .svg-img-contacto svg{
    width: 15vw;
    margin: auto;
  }
  
  a.boton-seccion-producto-video{
    color: var(--boton-seccion-cuatro) !important;
  }
  
  a.boton-seccion-dos{
    color: var(--texto-color) !important;
  }
  
  a.boton-seccion-dos:hover{
    color: var(--text-seccion-dos) !important;
  }
  
  
  .seccion-dos p{
    color: var(--text-seccion-dos-parrafo) !important;
    text-align: center;
    font-size: 1rem;
  }
  
  .seccion-dos a h4{
    color: var(--focus-color) !important;
    padding: 1rem;
    line-height: 0;
    margin-bottom: 0;
    border-radius: 50px;
  }
  
  
  /**/
  .card-title{
    margin: 1rem auto 0 !important;
  }
  
  .card-scroll .card-text{
    color:var(--focus-color);
    font-weight: 600;
    letter-spacing: 3px;
    margin: 1rem auto 2rem !important;
  
  }
  
  /*.precio-alt{
    background-color: transparent;
    color: #fff;
    border-radius: 50px;
    padding: 1rem 2rem;
    width: fit-content;
    margin: 2rem auto;
    font-size: 2rem;
    transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
  } */
  .precio {
    background-color: var(--precio-fondo);
    color: var(--precio-color);
    border-radius: 50px;
    padding: 1rem 2rem;
    width: fit-content;
    margin: 2rem auto;
    font-size: 2rem;
    transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
  }
  
  .mes{
    font-size: 1rem;
  }
  
  .signo-precio{
    font-size: .8rem;
    position: relative;
    bottom: 20px;
    padding: 0 .5rem
  }
  
  .no-incluye{
    text-decoration: line-through;
    opacity: .6;
  }
  
  .card .fa-ul{
    margin-left: 0 !important;
  }
  
  .card .fa-li{
    left: 1rem !important;
  }
  .botones-planes{
    margin: 2rem auto;
  }
  .agendar-cita{
    background: #ea805d;
    color: #2d2a26 !important;
  }
  a.quiero-saber-mas{
    color: var(--focus-color);
      border: 2px solid;
      padding: 0.5rem;
      border-radius: 50px;
      display: block;
      margin: 1rem auto;
      text-align: center;
      max-width: 300px;
      font-size: 1.2rem;
  }
  
  .flaticon-nfc-font{
    font-size: 2rem !important;
    display: flex;
  }
  /*INDEX*/
  .tabla_de_planes{
    background: var(--second-color);
    border-radius: 20px 40px;
  }
  .seccion-plan-texto{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
    text-align: center;
    
  
  }
  .seccion-plan-titulo{
    font-size: 1.3rem;
    font-weight: 800 !important;
    margin-bottom: 1.5rem;
    width: 90%;
    transition: all .2s ease-in-out;
    padding: .5rem;
    border-radius: 10px 10px;
    color: var(--theme-color);
  }
  .seccion-plan-texto .activar{
    font-size: 2rem;
    background-color: var(--second-color);
    border-radius: 20px 40px;
    color: var(--theme-color);
    padding: 1rem 5rem;
    transition: all .2s ease-in-out;
  }
  .tabla-planes{
    width: 98%;
    margin: 0 auto 40px;
    border-bottom: 4px solid;
    text-align: center;
  }
  .tabla-planes-header{
    display: flex;
    padding: 2rem 2rem 1rem 5rem;
    text-align: left;
    align-items: center;
  }
  .plan-title{
    font-weight: 900 !important;
    font-size: 1.9rem;
    padding-right: 15px;
    text-align: left;
    
  }
  .tabla-planes p{
    text-align: justify;
    padding: 0.5rem;

  }
  .plan-precio{
    display: flex;
    justify-content: space-evenly;
    margin: 0 3rem 2rem;
    flex-direction: column;
    align-items: flex-start;
  }
  .plan-precio-value{
    background: var(--second-color);
    color: var(--theme-color);
    border-radius: 50px;
    padding: 0.5rem 1rem;
    font-size: 1.5rem;
    font-weight: 700;
  }
  .plan-mes{
    margin-top: 1.5rem;
  }
  .plan-small{
    font-size: .9rem;
  }
  .contenedor-planes-tabla{
    display: flex;
    align-items: flex-start;
  }
  .tabla-planes-detalles{
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--focus-color);
    text-decoration: underline;
    margin-top: 4rem;
  }

  /*MENU*/
  .canvas-menu .big-boton{
    padding: 2vh !important;
  }
  /*MENU MOSTRAR CONTACTO*/
  .mostrar{
    display: block !important;
  }
  .no-mostrar{
    display: none !important;
  }
  
  
  /*RIPPLE*/
  .ripple h4 {
    background-position: center;
    transition: background 0.5s;
  }
  .ripple h4:hover {
    background: var(--azul-color) radial-gradient(circle, transparent 1%, var(--azul-color) 1%) center/15000%;
  }
  .ripple h4:active {
    background-color: var(--focus-color);
    background-size: 100%;
    transition: background 0s;
  }
  
  
  .seccion-planes {
    padding: 2rem;
    font-weight: 500;
    height: 70vh;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
  }
  
  .seccion-planes em{
    font-style: normal !important;
    border: 2px solid;
    padding: 0 .5em;
    border-radius: 50px;
    font-size: 1rem;
  
  }
  
  .seccion-productos {
    padding: 3rem 1.5rem;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin-bottom: 4rem;
    height: 77vh;
  }
  #ListaProductos{
    margin:auto;
    padding: 60px .5rem 0 !important;
  }
  #ListaProductos{
    font-size: 1.1rem;
  }
  .titulo-producto-letras{
    width: 70%;
  }
  .titulo-producto-subtitulo{
    font-size: 1rem;
    font-weight: 700;
    padding-left: .5rem;
  }
  .titulo-producto-link{
    font-style: normal !important;
    border: none;
    border-radius: 50px 10px 10px 50px;
    padding: 0.5rem 1.5rem;
    color: var(--producto-link) !important;
    display: inline-block;
    box-shadow: var(--shadow-boton-bg)!important;
    font-weight: 700;
  }
  .titulo-producto-abv{
    font-style: normal !important;
    border: 2px solid var(--second-color);
    border-radius: 10px 50px 50px 10px;
    padding: .3em .5em;
    background: var(--second-color);
    color: var(--seccion-productos-abv);
    font-weight: 700;
    margin: 0 0.25rem;
    font-size: .9rem;
    box-shadow: var(--shadow-boton-bg)!important;
    text-transform: uppercase;
    }
  .titulo-producto-link:hover{
    color: var(--theme-color) !important;
    background: var(--second-color);
    border:4px solid var(--second-color) ;
  }
  .seccion-productos a{
    color: var(--second-color) ;
  }
  .seccion-productos a:hover{
    color: var(--focus-color);
  }
  .seccion-productos p{
    margin: 1rem 0 !important;
  }
  .titulo-producto{
    display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      align-content: center;
      align-items: center;
      margin-bottom: 1rem;
      justify-content: space-between;
  }
  .titulo-producto em{
    font-style: normal !important;
    border: 2px solid;
    border-radius: 50px;
    padding: 0 .5em;
    text-transform: uppercase;
    font-size: 1rem;
  }
  .tab-productos{
    position: sticky;
    top: 40px;
    display: flex;
    width: 100%;
    flex-direction: column;
    margin-bottom: -4rem;
    align-content: flex-end;
    align-items: flex-end;
    z-index: 1000;
  }
  .tab-productos em{
    font-style: normal !important;
    border: 4px solid var(--second-color);
    border-radius: 50px 10px 10px 50px;
    padding: 0 0.5em;
    text-transform: uppercase;
    font-size: 1rem;
    color: var(--theme-color);
    background: var(--second-color);
    font-weight: 600;
    width: 19%;
    text-align: center;
    margin-bottom: 0.5rem;
  }
  .body-producto{
    margin: .5rem;
  }
  .productos-planes-p{
    padding: 2rem 0 1rem 1.2rem;
    text-align: left;
  }
  
  .body-producto h1{
    text-align: left;
  }
  .video-producto{
    max-width: 70vw;
    margin: 2rem auto;
    border-radius:25px;
  }
  
  .titulo-video-gif{
    position: absolute;
    top: 160px;
    transform: translatez(40px);
    left: -20px;
  }
  .titulo-video-gif-animacion{
  background: var(--second-color);
  box-shadow: 0px 8px 10px 1px hsla(0,0%,0%,0.14), 0px 3px 14px 2px hsla(0,0%,0%,0.12), 0px 5px 5px -3px hsla(0,0%,0%,0.2);
  border-radius: 50px;
  height: 4rem;
  width: 300px;
  margin: auto;
  -webkit-animation: titA 6s infinite linear;
          animation: titA 6s infinite linear;
  }
  .titulo-video-gif-texto{
    position: absolute;
    top: 175px;
    transform: translatez(41px);
    color: var(--theme-color);
    width: 250px;
    font-family:  'Dela Gothic One', cursive !important;
    margin: auto;
    letter-spacing: 1px;
    left: 5px;
  }
  
  .titulo-video-gif-div2{
    position: absolute;
    top: 400px;
    left: -10px;
    transform: translatez(40px);
  }
  
  .titulo-video-gif-animacion-div2{
  background: var(--second-color);
  box-shadow: 0px 8px 10px 1px hsla(0,0%,0%,0.14), 0px 3px 14px 2px hsla(0,0%,0%,0.12), 0px 5px 5px -3px hsla(0,0%,0%,0.2);
  border-radius: 40px;
  height:3rem;
  width: 280px;
  height: 150px;
  margin: auto;
  -webkit-animation: titA 6s infinite linear;
          animation: titA 6s infinite linear;
  }
  .titulo-video-gif-texto-div2{
  color:var(--theme-color);
    transform: translatez(41px);
    position: absolute;
    top: 450px;
    left: 0px;
    width: 250px;
    margin: auto;
    font-family:  'Dela Gothic One', cursive !important;
    text-align: center;
    letter-spacing: 1px;
  }
  
  .titulo-video-gif-div3{
    position: absolute;
    top: 200px;
    right: 10px;
    transform: translatez(40px);
  }
  
  .titulo-video-gif-animacion-div3{
  background: var(--second-color);
  box-shadow: 0px 8px 10px 1px hsla(0,0%,0%,0.14), 0px 3px 14px 2px hsla(0,0%,0%,0.12), 0px 5px 5px -3px hsla(0,0%,0%,0.2);
  border-radius: 50px;
  width: 100px;
  height: 100px;
  margin: auto;
  -webkit-animation: titA 6s infinite linear;
          animation: titA 6s infinite linear;
  }
  .titulo-video-gif-texto-div3{
    color: var(--theme-color);
    transform: translatez(41px);
    position: absolute;
    width: 100px;
    margin: auto;
    text-align: center;
    letter-spacing: 1px;
    top: 220px;
    right: 11px;
    font-size: 2.7rem;
    font-family:  'Dela Gothic One', cursive !important;
  }
  
  .video-gif-PWA{
    font-family:  'Dela Gothic One', cursive !important;
    display: none;
    position: relative;
    right: 33%;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  -webkit-animation: sqrA 6s infinite linear;
          animation: sqrA 6s infinite linear;
  }
  
  .video-gif-PLUS{
    display: none;
    position: relative;
    right: 33%;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  -webkit-animation: sqrA 6s infinite linear;
          animation: sqrA 6s infinite linear;
  }
  .video-gif-LITE{
    display: none;
    position: relative;
    right: 33%;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  -webkit-animation: sqrA 6s infinite linear;
          animation: sqrA 6s infinite linear;
  }
  .active-video{
    display: block;
  }
  
  @-webkit-keyframes sqrA {
    0% {
      -webkit-transform: translateX(120px) rotateY(-90deg);
              transform: translateX(120px) rotateY(-90deg);
    }
  
    2%{
      -webkit-transform: translateX(120px) rotateY(0deg);
              transform: translateX(120px) rotateY(0deg);
    }
    98%{
      -webkit-transform: translateX(120px) rotateY(0deg);
              transform: translateX(120px) rotateY(0deg);
    }
    100% {
      -webkit-transform: translateX(120px) rotateY(90deg);
              transform: translateX(120px) rotateY(90deg);
    }
  }
  
  @keyframes sqrA {
    0% {
      -webkit-transform: translateX(120px) rotateY(-90deg);
              transform: translateX(120px) rotateY(-90deg) rotateX(10deg);
    }
  
    5%{
      -webkit-transform: translateX(120px) rotateY(0deg);
              transform: translateX(120px) rotateY(-20deg);
    }
    95%{
      -webkit-transform: translateX(120px) rotateY(0deg);
              transform: translateX(120px) rotateY(0deg);
    }
    100% {
      -webkit-transform: translateX(120px) rotateY(90deg);
              transform: translateX(120px) rotateY(90deg) rotateX(2deg);
    }
  }
  
  @keyframes titA {
  0% {
    -webkit-transform: translateX(120px) rotateY(-90deg);
            transform: scale(.4);
            opacity: 0;
  }
  6% {
    -webkit-transform: translateX(120px) rotateY(90deg);
            transform: scale(.9);
            opacity: 1;
  }
  97% {
    -webkit-transform: translateX(120px) rotateY(90deg);
            transform: scale(.9);
            opacity: 1;
  }
  100% {
    -webkit-transform: translateX(120px) rotateY(-90deg);
            transform: scale(.4);
            opacity: 0;
  }
  }
  
  .detalles-producto{
    margin: 2rem 0;
  }
  .producto-item-seccion h1{
    padding-left: .5rem;
  }
  .seccion-herramientas{
    padding: 0 1.5rem;
    margin-bottom: 4rem;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
  }
  
  .seccion-herramientas em{
  
    font-style: normal !important;
    border: 2px solid;
    border-radius: 50px;
    padding: 0 .5em;
  
  }
  
  #accordionfaqs ul{
    padding: 0 0.5rem !important;
  }

  #accordionfaqs li{
    margin-top: 1rem;
  }
  .seccion-faqs{
    padding: 0 2rem 2rem;
    font-weight: 500;
    height: 40vh;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    color: var(--texto-color);
    margin-top: 7rem;
  }
  .seccion-faqs-em{
    padding: 2rem 0 0;
    text-align: center;
  }
  .seccion-add-ons{
    padding: 2rem;
    font-weight: 500;
    height: 30vh;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    color: var(--texto-color);
    margin-top: 5rem;
  }
  
  .seccion-faqs p{
    color: var(--texto-color) !important;
  }
  .seccion-faqs em{
  
    font-style: normal !important;
    border: 2px solid;
    border-radius: 50px;
    padding: 0 .5em;
    font-size: 1rem;
  
  }
  
  .espacio{
    height: 30vh;
  }
  
  
  
  .guardar {
    width: 300px;
    margin: auto;
  }
  
  .guardar p {
    border-top: 4px dotted;
    border-color: var(--focus-color) !important;
    margin:0; padding: 30px;
    counter-increment: section;
    position: relative;
    color: var(--texto-color);
  }
  
  
  
  .guardar p:nth-child(even):before {
    content: counter(section);
    right: 100%;
    margin-right: -20px;
    position: absolute;
    border-radius: 50%;
    height: 20px;
    width: 20px;
    background-color: var(--theme-color);
    text-align:center;
    color: var(--theme-color);
    font-size: 110%;
  }
  
  .guardar p:nth-child(odd):before {
    content: counter(section);
    left: 100%;
    margin-left: -20px;
    position: absolute;
    border-radius: 50%;
    height: 20px;
    width: 20px;
    background-color:var(--theme-color);
    text-align:center;
    color: var(--theme-color);
    font-size: 110%;
  }
  
  
  
  .guardar p:nth-child(even) {
    border-left: 4px dotted;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    margin-right: 30px;
    padding-right: 0;
  }
  
  .guardar p:nth-child(odd) {
    border-right: 4px dotted;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    margin-left: 30px;
    padding-left: 0;
  }
  
  .guardar p:first-child {
    border-top: 0;
    border-top-right-radius:0;
    border-top-left-radius:0;
  }
  
  .guardar p:last-child {
    border-bottom-right-radius:0;
    border-bottom-left-radius:0;
  }
  
  #SlideNav .canvas-menu{
    padding: 1rem 0 !important;
  }
  .canvas-menu{
    padding: 1rem 0 3rem;
  }
  
  .canvas-menu .accordion-body h6{
      text-align: left;
  }
  
  .card-text-info{
    color: var(--theme-color);
    font-weight: 600;
    letter-spacing: 3px;
    margin: .5rem auto !important;
    border: none;
    background: var(--botones-mas-info);
    border-radius: 10px 30px 10px 10px;
    padding: 1rem;
    width: 95%;
  }
  
  .flecha{
    position: absolute;
    right: 5%;
  }
  
  .boton-herramientas{
    color: var(--texto-boton-bg)!important;
    font-weight: 800;
    text-transform: uppercase;
    text-align: left;
    width: 100%;
    border: none;
    padding: 1rem 1.5rem;
    background: transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 1px 1px 6px rgb(0 0 0 / 20%)!important;
    border-radius: 25px;
    margin: 1rem auto;
  }
  
  .boton-herramientas:not(.collapsed){
    box-shadow: none!important;
  }
  
  
  #accordionPanelsHerramientas{
    padding: 0 0.25rem !important;
  }

  .smartlink-video::before {
      animation: bounce 1.5s ease infinite;
      bottom: 2rem;
      font-size:7vw ;
      color: var(--second-color);
      height: 4rem;
      left: 50%;
      letter-spacing: -1px;
      line-height: 4rem;
      margin-left: -3rem;
      opacity: 0.5;
      position: absolute;
      text-align: center;
      width: 6rem;
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
    z-index: 100;
  }
  
  @keyframes bounce {
      50% {
          transform: translateY(-50%);
      }
  }
  
  .scroll-down-text{
    text-align: center;
    opacity: .6;
    text-transform: uppercase;
    font-size: .9rem;
    font-weight: 600;
  }

  .scroll-down-text-noshow{
    display: none !important;
  }
  .no-show-scroll-down::before{
      display: none !important;
  }
  
  #accordionPanelsHerramientas .accordion-collapse{
    background: var(--fondo-herramientas-acordeon);
    padding: 1rem 0.3rem;
    border-radius: 5px 15px 5px 15px;
  }
  
  #accordionPanelsHerramientas .accordion-button{
    background: var(--fondo-herramientas-acordeon) !important;
  }
  
  .texto-herramienas-lista{
    padding: 1rem;
  }
  .icono-herramientas{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 10%;
  }
  .herramientas-interna-lista {
    margin: .5rem !important;
  }
  
  .herramientas-interna-lista li{
    display: flex;
    flex-direction: column;
    align-items: flex-start
  }
  .herramientas-interna-lista-titulo{
    margin: 1rem -0.5rem 0.5rem;
    text-transform: uppercase;
    border-radius: 50px;
    background: var(--herramientas-titulo-lista);
    padding: 0.5rem 1rem;
    font-size: 1rem;
    font-weight: 700;
  }
  #SlideNav .circle{
  box-shadow: none;
  }
  
  
   .close{
    margin: 1rem 1rem 0;
  }
  
  .proximamente{
    font-size: .7rem;
    padding: 0.5rem;
    border-radius: 50px;
    background: var(--second-color);
    margin-left: .5rem;
    color: var(--theme-color);
  }
  
  .footer-absolute{
    position: sticky;
  top: 40%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 80vh;
  align-items: center;
  }
  
  .boton-nav{
      padding: var(--padding-boton-bg);
      border-radius: var(--radius-border-botonbg) !important;
      border: 3px solid var(--border-boton-bg);
      color: var(--texto-boton-bg)!important;
      background: var(--fondo-boton-bg);
      width: var(--width-boton-bg);
      box-shadow: var(--shadow-boton-bg)!important;
      font-weight: 800;
      text-transform: uppercase;
      text-align: center;
      margin: 1rem auto;
      display: block; 
      max-width: 400px;
  }
  
  
  .boton-nav:hover {
      color: var(--texto-boton-bg-hover);
    /*  border: 3px solid var(--border-boton-bg-hover);
      background: var(--fondo-boton-bg-hover);
      box-shadow: var(--shadow-boton-hover-bg)!important */
  }
  
  .principal{
    color: var(--boton-principal-color)!important;
    background: var(--boton-principal);
    border: var(--boton-principal-border) !important;
    padding: var(--padding-boton-bg);
    border-radius: var(--radius-border-botonbg) !important;
    width: var(--width-boton-bg);
    box-shadow: var(--shadow-boton-bg)!important;
    font-weight: 800;
    text-transform: uppercase;
    text-align: center;
    margin: 1rem auto;
    max-width: 400px;
    font-size: 1.2rem;
  }
  .principal:hover {
      color: var(--texto-boton-nav-hover)!important;
    /*  border: 3px solid var(--border-boton-bg-hover);
      background: var(--fondo-boton-bg-hover);
      box-shadow: var(--shadow-boton-hover-bg)!important */
  }
  .icono{
    position: absolute;
  left: 17%;
  }
  
  
  .ahorra::after {
    content: "AHORRA 20%";
    opacity: .4;
    font-size: .8rem;
    position: absolute;
    margin: 1.4rem auto 0;
    left: 0;
    right: 0;
    width: 50%;
  }
  
  .pg-actual{
    display: none !important;
  }
  
  .lista-planes{
    max-width:80%;
    margin: auto !important;
  }
  
  .lista-planes li{
    margin: auto;
    margin-bottom: 1rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
  }
  .icono-lista{
    margin-right: 2.5rem;
  }
  
  /* .icono-lista{
    position: absolute;
    left: -3rem;
    text-align: center;
    width: 15%;
    opacity: .8;
  } */
  .item-lista{
    font-size: 1rem;
    text-align: left;
    width: 100%;
    text-transform: uppercase;
  }
  .item-lista small{
    font-size: .8rem;
  }
  
  .link-info{
    color:var(--focus-color);
  }
  
  .footnote-container .collapsed{
    opacity: .5
  }
  .footnote-container .collapsed::after {
    content: 'VER NOTAS';
    color: var(--second-color);
  }
  .footnote-boton{
    width: 100%;
    align-content: normal;
    -webkit-appearance: none !important;
    border: none;
    text-align: center;
    padding: 1rem 1rem;
    border-radius: 15px 15px 5px 5px;
    background: transparent;
    opacity: .5;
  font-weight: 700;
  }
  .footnote-boton::after {
    content: 'CERRAR';
    color: var(--second-color);
  }
  .footnotes{
    margin: 0 0 4rem;
  }
  .footnotes hr{
    width: 90%;
    margin: 0 auto 2rem;
  }
  .footnotes div{
    padding: 1rem 1.5rem;
    margin: auto;
  }
  
  .footnotes span{
    opacity: .9;
    font-size: 1rem;
  }
  .footnotes sup{
    top: -0.5em;
    background: var(--second-color);
    padding: 0.2rem 0.5rem;
    border-radius: 50px;
    color: var(--theme-color);
    font-weight: 800;
  }

  .footnotes div:target sup{
    color: var(--second-color);
    background: var(--theme-color);
  }
  
  .footnotes div:target{
    background-color: rgba(0,0,0,.8);
    border-radius: 35px 3px 35px 35px;
    color: #fff !important;
  }
  
  .footnotes div:target ~ .info-slide-return {
      display: block !important;
  }
  button.notas{
    -webkit-appearance: none;
      border: none;
      background: transparent;
      color: var(--focus-color);
  }
  .datos li{
    margin-left: 1rem;
    opacity: .7;
    font-size: .9rem;
    list-style: disc;
  }
  
  /*TIMELINE*/
  .timeline {
    position: relative;
    max-width: 1200px;
    margin: 4.5rem 0 0;
  }
  .timeline::after {
    content: '';
    position: absolute;
    width: 6px;
    background-color: var(--botones-mas-info);
    top: 0;
    bottom: 0;
    left: 50%;
    margin-left: -3px;
    border-radius: 900px;
  }
  .cotainer-timeline {
    padding: 10px 40px;
    position: relative;
    background-color: inherit;
    width: 50%;
  }
  .cotainer-timeline::after {
    content: '';
    position: absolute;
    width: 25px;
    height: 25px;
    right: -17px;
    background-color: var(--focus-color);
    border: 4px solid var(--focus-color);
    top: 15px;
    border-radius: 50%;
    z-index: 1;
  }
  .left-timeline {
    left: 0;
  }
  .right-timeline {
    left: 50%;
  }
  .right-timeline::after {
    left: -16px;
  }
  .content-timeline {
    padding: 25px 10px;
    background-color: var(--botones-mas-info);
    position: relative;
    border-radius: 20px;
    color: var(--theme-color);
    text-align: center;
  }
  .content-timeline h2{
    color: var(--theme-color);
    text-transform: uppercase;
  }
  @media screen and (max-width: 600px) {
    .timeline::after {
    left: 29px;
    }
    .cotainer-timeline {
    width: 100%;
    padding-left: 70px;
    padding-right: 25px;
    }
    .left-timeline::after, .right-timeline::after {
    left: 15px;
    }
    .right-timeline {
    left: 0%;
    }
  }
  .add-ons-lista{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    margin-top: 1rem;
  }
  .add-ons-circulo{
    border-radius: 50px;
    font-size: 1.1rem;
    border-radius: 5px 10px 10px;
    padding: 0.2rem;
    font-weight: 600;
  /*  border: 3px var(--add-ons-fondo) solid  */;
    color: var(--add-ons-color);
    margin-bottom: 0.5rem;
  }
  
  
  .add-ons-relleno{
    background: var(--add-ons-fondo);
      padding: 1rem .7rem;
      border-radius: 50px;
      margin: 0.2rem;
      font-weight: 600;
  
  }

  .add-ons-relleno small{
    font-size: .85rem;
  }
  
  .add-ons-incluye{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 1rem 0;
  }
  
  .add-ons-incluye-texto{
    margin: 0.5rem 0;
    background: var(--add-ons-fondo);
    border-radius:  30px 10px 30px 30px;
    padding: 2rem 1rem;
    width: 100%
  }
  
  .modulo-accordion-body .Rtable{
    margin: 1rem 0 0 -1rem;
  }
  .add-ons-incluye-texto .Rtable{
    margin: 1rem -.7rem 0;
  }
  
  #contenedor-pie .headroom--top {
      transform: none;
  }
  
  .headroom--unpinned{
    transform: translateY(200%);
  }
  
  
  .btn-negative{
    background: var(--second-color);
    color: var(--theme-color);
  }
  .canvas-info{
    padding: 0 !important;
  }
  .offcanvas-header-center {
    display: flex;
      align-items: center;
      justify-content: center;
      /* padding: 1rem 1rem 0.3rem; */
      position: absolute;
      top: 2%;
      /* height: 50px; */
      /* width: 50px; */
      z-index: 100;
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      left: 50%;
      transform: translate(-50%);
      border-radius: 50px;
      mix-blend-mode: difference;
      color: #fff !important;
  }
  .offcanvas-header-center a{
    border-radius: 50px;
    height: 50px;
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 !important;
    mix-blend-mode: difference;
    color: #fff !important;
  }
  

  
  #PLATICANOS{
    padding: 0;
    box-shadow: none;
    background: var(--platicanos-tally);
    color: #2d2a26;
    border-radius: 25px 10px;
    margin: 5rem 0 5rem;
  }
  
  #PLATICANOS h3{
    color: #2d2a26;
    margin-top: 2rem;
  }
  
  .platicanos-text{
    color: var(--platicanos-color);
    letter-spacing: 2px;
    margin: 1rem auto 2rem !important;
  }
  .redondear{
    font-style: normal !important;
    border: 2px solid;
    padding: 0 0.5em;
    border-radius: 50px;
    font-size: 1rem;
  }
  
  .offcanvas-header a{
    border-radius: 50px;
    /*  background: var(--fondo-close-boton);*/
      height: 50px;
      width: 50px;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0 !important;
  }
  
  .accordion-header:target > .accordion-button{
    animation: highlight 10s ease;
  }
  .accordion-item p{
    padding: 0 0.5rem;
  }
  .mxn{
    font-size: 1rem;
    text-transform: uppercase;
  }
  
  .text-muted{
    color: var(--texto-color) !important;
    opacity: .8;
  }
  .en-que-plan{
    padding: 0.5rem 1rem 1rem;
    display: flex;
    justify-content: flex-start;
  }
  .en-lista{
    padding: 0 0 2rem !important;
    margin: -1rem 0 0;
  
  }
  .en-que-plan a:first-child{
  border-radius: 50px 10px 10px 50px;
  }
  .en-que-plan a:last-child{
  border-radius: 10px 50px 50px 10px;
  }
  .plan-incluido{
    font-size: .8rem;
    font-weight: 700;
    border-radius: 5px;
    background: var(--second-color);
    padding: 0.2rem 0.7rem;
    color: var(--theme-color);
    margin: 0 .2rem;
  }
  
  @keyframes highlight {
    0% { box-shadow: var(--shadow-acordion); }
    100% { box-shadow: none; }
  }
  
  
  /*BARRA INFERIOR NAV-MENU*/
  .barrainferior-nav .barrainferior{
    position: initial !important;
  }
  /*TABLA*/
  .Rtable {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
  }
  .Rtable-cell {
    box-sizing: border-box;
    flex-grow: 1;
    width: 100%;
    padding: 0.8em .5em;
    overflow: hidden;
    list-style: none;
    border: solid 3px var(--fondo-herramientas-acordeon);
    background: rgba(112, 128, 144, 0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px
  }
  .Rtable-cell > h1,
  .Rtable-cell > h2,
  .Rtable-cell > h3,
  .Rtable-cell > h4,
  .Rtable-cell > h5,
  .Rtable-cell > h6 {
    margin: 0;
  }
  
  .col-name{
    font-size: .7rem !important;
    text-transform: uppercase;
    background: rgba(112, 128, 144, 0.1);
  }
  /* Table column sizing
  ================================== */
  .Rtable--2cols > .Rtable-cell {
    width: 50%;
  }
  .Rtable--3cols > .Rtable-cell {
    width: 33.33%;
  }
  .Rtable--4cols > .Rtable-cell {
    width: 25%;
    font-size: .9rem;
  
  }
  .Rtable--5cols > .Rtable-cell {
    width: 20%;
    font-size: .9rem;
    text-align: center;
  }
  .Rtable--6cols > .Rtable-cell {
    width: 16.6%;
  }
  
  .is-striped {
    background-image: linear-gradient(0, rgba(0, 0, 0, 0.07), rgba(0, 0, 0, 0.07));
  }
  
  .card-title{
    position: sticky;
    top: 0;
    background: var(--card-body-fondo);
    z-index: 100;
    padding: 1rem;
    font-weight: 900 !important;
    font-size: 1.9rem;
  }
  .myElement.is-pinned{
    color: red;
  }
  .planes-menu{
    border-radius: 0 0 20px 20px;
    background-color: var(--second-color) !important;
    max-width: 100% !important;
    margin: 0 .2rem !important;
    height: fit-content;
  }
  .planes-menu h3{
        margin-top: 1rem;
        color: var(--theme-color);
  }
  .planes-menu .offcanvas-body{
    margin: 25px auto 5px;
    background-color: var(--second-color) !important;
  }
  .myElement h3{
    padding: 0;
    margin: 0;
  }

.lista-plataforma{
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
}
.lista-plataforma li{
  width: 33%  !important;
  padding: 0.5rem;
}
.plataforma-link span{
  font-size: .9rem !important;
  color: var(--second-color);
  text-transform: uppercase;
}

.plataforma-link{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.plataforma-link img{
  width:100%; 
  max-width:300px; 
  margin: 0 auto;
}
#flex-objects .search {
  width: 100% !important;
}
#flex-objects {
  margin-top: 1rem;
  margin-bottom: 100px;
}
#flex-objects button {
  -webkit-appearance: none !important;
  border-radius: 20px;
  padding: 0.5rem;
  width: 70%;
  margin-top: 1rem;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  border: none;
  box-shadow: var(--lt-shadowDefault);
  background: var(--boton-menu-seccion);
  max-width: 400px;
}
#flex-objects ul li .entry-details p {
  margin: 0;
  padding: 0 !important;
}
.nombre-card{
  margin: 0 auto 2rem;
  font-size: 1.2rem;
  font-weight: 600;
  letter-spacing: 1px;
}
#slide-contratar.offcanvas.show {
  overflow-y: auto;
}
.contenedor-contratar{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin: 1rem;
}

/*NAV-CONTENIDO*/
.wrap-page{
  margin: 10px;
  overflow: hidden;
}
.bubble{
  background: var(--theme-color);
  border-radius: 20px;
  width: 100%;
  margin: 1.5rem auto;
  color: var(--second-color);
  margin-top: -1rem;
}
.wrapper-bubble{
  padding-left: 20px;
  padding-right: 20px;
}
.puntos-smartlink{
  background-position: top;
  background-repeat: repeat-x;
  background-size: 150px;
  background-image: var(--footer-img-svg);
}
.azul{
  background: var(--azul-fondo);
  color: var(--azul-color-text);
}
.naranja{
  background: var(--naranja-fondo);
  color: var(--naranja-color);
}

.contenedor{
  max-width: 1360px;        
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 80px;
  padding-bottom: 80px;
}
.row{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.logo-simple{
  display: flex;
  justify-content: flex-start;
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: 3px;
  padding-left: 40px;
  
}
.logo-header{
  display: block;
}
.smartlink-icono{
  display: none;
}
.nav-bar{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  border-radius: 50px;
  padding: 5px 0;
  margin-top: 0;
  position: absolute;
  top: 10px;
  left: 0;
  width: 100%;
}
.nav-botones{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 70%;
  font-weight: 800;
  max-width: 1000px;
  padding-right: 40px;
}
.nav-botones a{
  padding: 1rem 1.5rem;
  border-radius: 10px;
  color: var(--second-color);
}
.nav-botones a:visited{
  color: var(--second-color);
}
.nav-botones a:hover{
  background: var(--second-color);
  color: var(--theme-color) !important;
}

.settings{
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
}
.settings a:hover{
  color: var(--naranja-web) !important;
}
.current span:hover{
  color: var(--naranja-web) !important;
}
[class*="hidden"] {
  display: none !important;
}
@media (max-height: 770px) {

    iframe.iframe-modal {
      height: 80vh!important;
  }
  .container{
    max-width: 1200px;
  }


  }
  @media (max-height: 800px) {
    .seccion-herramientas{
      padding: 0 1rem 4rem;
      font-weight: 500;
      height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: space-evenly;
    }
    
  }

  @media(min-width: 600px){

    body{
      background: var(--second-color);
    }
    footer{
      background-image: none;
      height: unset;
    }
    .footer-absolute {
      height: unset;
    }
    .header-simple {
      box-shadow: none;
      background-color: transparent; 
      width: 70vw;
      max-width: 1200px;
    }
    .contenedor-contratar {
      display: flex;
      flex-direction: row;
      align-items: center;
      text-align: center;
      margin: 1rem;
      flex-wrap: wrap;
      justify-content: space-evenly;
    }
    #content{
      background: var(--theme-color);
      margin: auto;
      border-radius: 20px;
      margin: 10px;
      min-height: 97vh;
    }
    .gif-top-landingpage {
      margin: 0 auto 5rem;
      width: 70%!important;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding-top: 9rem;
    }
  
    .entry-details-cotizar {
      margin: 0.5rem 1rem;
      padding: 1rem 2rem;
      height: 270px;
    }
    .preloader{
      display: none;
    }
    .lista-cotizar {
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: center;
    }

    .adminbotones{
      display: none;
    }
    .form-link .offcanvas-body h1 {
      width: 600px;
      margin: auto;
    }
    .form-link form{
      width: 55vw;
      max-width: 600px;
      margin: auto;
    }
    .burbuja-contacto {
      margin: 20px !important;
    }
    .seccion-faqs{
     height: fit-content; 
    }
    .contacto .fa-ul>li {
      width: 40vw;
      margin: auto;
      max-width: 400px;
    }
    .offcanvas-center {
      height: fit-content!important;
      box-shadow: var(--box-shadow-planes);
    }
    .form-link .offcanvas-body {
      padding: 3rem 1.5rem !important;
    }
    body{
      overflow-x: hidden;
    }
    .panel-modal{
      max-width: 1200px;
      margin: auto;
    }
    #tabPanel{
      max-width: 1200px;
      margin: auto;
    }
    a{
      cursor: pointer !important;
    }
  }

  @media (min-width: 750px){
    .modal-contratar {
      
      margin: auto;
    }
    .share{
      width: 600px;
      margin: 3rem auto 0;
    }
    .tabla_de_planes{
    
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: flex-start;
      justify-content: space-around;;
    }

    .seccion-cita-texto .activar {
      font-size: 1.6rem;
      padding: 2rem;
    }
    .tabla_de_planes .card{
      width: 32%;
      margin: 0 !important;
    }
    .tabla_de_planes .precio{
      font-size: calc(1.275rem + .3vw);
      padding: 1rem;
    }
    .elemento-horizontal {
      width: 10vw;
    }
    .card-scroll{
      box-shadow: none;
    }
    .tabla_de_planes #CORP{
      width: 50%;
      padding-top: 3rem;
    }
    .video-producto {
      max-width: 30vw;
    }
    
    .detalles-producto{
      max-width: 600px;
      margin: 2rem auto;
  }
  .active h3{
    width: auto;
    max-width: 300px;
  }

  .seccion-cita-titulo{
    width: auto;
  }
  .calendly-inline-widget{
    height: 800px;
  }


  .error404 img {
    width: 20% !important;
  }
  .thatsanerror h4 {
   max-width: 300px;
  }
  .lista-plataforma li {
    width: 20% !important;
  }
  .video-gif-PWA{
    right: 10%;
  }
  .smartlink-video img {
    max-width: 30vw;
  }
}


  @media (min-width: 961px){
    .page{
      max-width: 100vw;
    }
    .elemento-horizontal{
      width: 6vw;
      padding: 2rem 0;
    }
    .smartlink-cliente video {
      width: 300px;
      left: 3%;
    }
    .smartlink-video img {
      max-width: 15vw;
    }
    .smartlink-video:before{
      font-size: 2vw;
      bottom: 1rem;
      display: none;
    }
    .seccion-uno{
      font-size: 2rem;
      max-width: 900px;
      margin:2rem auto;
      padding: 0;
      height: 90vh;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .active {
      width: 25vw;
      max-width: 400px;
      margin: auto;
    }
    .seccion-dos{
      display: none;
    }
    .seccion-columnas-texto{
      max-width: 900px;
      margin: 5rem auto 15rem;
    }
    .big-boton{
      max-width: 400px;
    }
    .offcanvas{
      margin: 0 !important;
    }
   
    .canvas-menu{
      width: 90vw;
      margin: auto;
      max-width: 100% !important;
      padding: 0 15rem 10rem;
      border-radius: 0 0 2% 2%;
    }
    .contacto{
      width: 90vw;
      margin: auto;
      max-width: 100%;
  
    }
    .offcanvas-link{
      width: 65vw !important;
      margin: 2rem auto !important;
      height: 90vh !important;
      border-radius: 2%;
    }
    main{
      width: 80vw;
      max-width: 1000px;
      margin-bottom: 10px;
    }
    .lista-plataforma{
      justify-content: space-evenly;
    }
    .lista-plataforma li {
      width: 10% !important;
  }
}