:root {
    --color-uno: #10B981;
    --color-uno-a: #edf8f2;
    --color-uno-b: #18b17e;
    --color-uno-c: #20a97b;
    --color-dos: #06B6D4;
    --color-tres: #020617;
    --color-gris: #7a7a7a;
    --color-gris-a: #FCFCFC;
}

* {
    font-family: "Google Sans Flex", sans-serif;
    font-display: swap;
    font-optical-sizing: auto;
    font-weight: 100;
    font-style: normal;
    font-variation-settings:
        "slnt" 0,
        "wdth" 100,
        "GRAD" 0,
        "ROND" 0;
}

.btn-primary,
.btn-check:checked+.btn,
.btn.active,
.btn.show,
.btn:first-child:active,
:not(.btn-check)+.btn:active {
    background-color: var(--color-uno);
    border-color: var(--color-uno);
}

.btn-outline-primary {
    border-color: var(--color-uno);
    color: var(--color-uno);
}

.btn-check+.btn:hover {
    border-color: var(--color-uno-b);
    color: var(--color-uno-b);
}

.btn-check:checked+.btn:hover {
    color: #FFF;
}

.btn-primary:hover {
    background-color: var(--color-uno-b);
    border-color: var(--color-uno-b);
}

.btn:first-child:active {
    background-color: var(--color-uno-c);
    border-color: var(--color-uno-c);
}

footer {
    background-color: var(--color-tres);
    color: var(--color-gris);
}

a {
    color: var(--color-uno);
    text-decoration: none;
}

footer a {
    color: #FFF;
}

a:hover {
    color: var(--color-dos);
}

footer ul {
    list-style: none;
    padding-left: 0px;
}

.socialenlace li {
    float: left;
    margin: 10px 20px;
    border: #10B981 1px solid;
    border-radius: 100px;
    padding: 5px 10px;
}

footer h6.titulo {
    color: var(--color-uno);
}

footer h6.titulo::after {
    content: "";
    border: var(--color-uno) 1px solid;
    width: 30px;
    display: block;
    margin-top: 10px;
}

footer svg {
    color: var(--color-uno);
}

footer .pieicon svg {
    width: 35px;
    height: auto;
    float: left;
    margin-right: 10px;
    margin-top: 5px;
}

.accordion-button:not(.collapsed) {
    background-color: var(--color-uno-a);
}

.accordion-button:focus {
    box-shadow: 0 0 0 0.25rem var(--color-uno-a);
}

.bloquno svg {
    width: 80px;
    height: auto;
    color: var(--color-uno);
    padding: 16px 0px;
}


.elsiptn .mt-auto a svg {
    width: inherit;
    padding: inherit;
    border-radius: none;
    background-color: transparent;
    margin-bottom: inherit;
}

.elsiptn .mt-auto a:hover {
    text-decoration: underline;
}

.elsiptn .mt-auto a:hover svg {
    color: var(--color-dos);
    background-color: transparent;
    width: 25px;
}

.certificados {
    background-color: var(--color-uno-a);
}

.medalla {
    background-color: #FFF;
}

.elsiptn svg {
    width: 80px;
    height: auto;
    color: var(--color-uno);
    background-color: var(--color-uno-a);
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.elsiptn svg:hover {
    color: var(--color-uno-a);
    background-color: var(--color-uno);
}

.pqcg {
    background: var(--color-gris-a);
}

.pqcg svg:hover {
    color: var(--color-uno-a);
    background-color: var(--color-uno);
}

.pqcg svg {
    width: 80px;
    height: auto;
    color: var(--color-uno);
    background-color: var(--color-uno-a);
    padding: 20px;
    border-radius: 10px;

}

.pqcg .card {
    border: none;
    background: none;
}

.carousel-item figure {
    padding: 20px 40px;
}

.cuote svg {
    color: var(--color-uno);
    width: 60px;
    height: auto;
}

p.cuote {
    margin-bottom: 0px;
    ;
}

.backvar1 {
    background: var(--color-uno-a);
}

h1 span,
h2 span,
h3 span,
h4 span,
h5 span,
h6 span {
    color: var(--color-uno);
    font-weight: 500;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
}

footer h6 {
    color: #FFF;
}

.text-bg-dark {
    background-color: var(--color-tres) !important;
}

h4.alert-heading svg {
    width: 25px;
    height: auto;
}

.text-bg-primary {
    background-color: var(--color-dos) !important;
}

.border-primary {
    border-color: var(--color-dos) !important;
}

.navbar-nav .nav-link.active {
    background-color: var(--color-dos);
    color: #FFF;
    font-weight: 200;
}

.navbar-nav .nav-link:hover {
    background-color: var(--color-dos);
    color: #FFF;
}

.botoneschat h6 span {
    background: #FFF;
    padding: 5px 10px;
}

.botoneschat {
    width: 190px;
}

.botoneschat svg {
    width: 50px;
    height: auto;
    margin: 10px 0;
}