/*---------------------------------*/
/* Esto es para que el campo number (de whatsapp no tenga flechas) */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/*---------------------------------*/

body {
    margin:0px;
    padding:0px;
    font-family: "Poppins"!important;
}

h1 {
    font-weight: bold;
}

.diferencial {
    background-color: var(--verde);
}

.violeta {
    background-color: var(--violeta);
}

.azulado {
    background-color: var(--azulado);
}

.oscuro {
    background-color: var(--oscuro);
}

.estrella {
    max-width: 30px;
}

#preguntas-frecuentes .card-header button {
    color:var(--oscuro)!important;
    font-weight: bold!important;
}

#preguntas-frecuentes .card-header button:focus {
    outline:none!important;
    box-shadow: none!important;
}

#preguntas-frecuentes .card-body {
    background-color: var(--violeta);
    color: #fff;
}


.call-to-action {
    background-color: var(--verde);
    color:var(--oscuro);
    font-weight: bold;
    font-size: 35px;
    text-decoration: none;
}

.call-to-action:hover {
    background-color: var(--oscuro);
    color: #fff;
    font-weight: bold;
    font-size: 35px;
    text-decoration: none;
}

.call-to-action:focus {
    outline:none!important;
    box-shadow: none!important;
}

.call-to-action-neutro {
    font-weight: bold;
    font-size: 35px;
    text-decoration: none;
}

.call-to-action-neutro:hover {
    background-color: var(--oscuro);
    color: #fff;
    font-weight: bold;
    font-size: 35px;
    text-decoration: none;
}

.call-to-action-neutro:focus {
    outline:none!important;
    box-shadow: none!important;
}

.texto-verde {
    color: var(--verde);
}

.error {
    border: 1px solid red;
}