/*
	.u-: Utilidades (Tama�os de las fuentes, centrar textos, etc)
	.t-: Temas (Colores)
	.js-: Javascript
*/
    /*RESET DEL DOCUMENTO*/

    html,
    body,
    div,
    span,
    applet,
    object,
    iframe,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    blockquote,
    pre,
    a,
    abbr,
    acronym,
    address,
    big,
    cite,
    code,
    del,
    dfn,
    em,
    font,
    img,
    ins,
    kbd,
    q,
    s,
    samp,
    small,
    strike,
    strong,
    sub,
    sup,
    tt,
    var,
    b,
    u,
    i,
    center,
    dl,
    dt,
    dd,
    ol,
    li,
    fieldset,
    form,
    label,
    legend,
    table,
    caption,
    tbody,
    tfoot,
    thead,
    tr,
    th,
    td {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 100%;
        vertical-align: baseline;
        background: transparent;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    html {
        font-size: 1rem;
        color: #1F2937;
        font-family: 'Work Sans', sans-serif;
    }

    body,
    main {
        overflow-x: hidden;
    }
    /*CONTAINER*/

    .container {
        position: relative;
        z-index: 1;
        margin: 0 auto;
        width: 92%;
    }

    @media only screen and (min-width:600px) and (max-width:1300px) {
        .container {
            width: 95%;
        }
    }

    @media only screen and (min-width:1300px) {
        .container {
            max-width: 75rem;
            width: 100%;
        }
    }
    /*GRID*/

    .row {
        margin-left: -.75rem;
        margin-right: -.75rem;
    }

    .row--donacion {
        margin: 0;
    }

    .row--table {
        border-bottom: 1px solid #000000;
        margin: 0;
    }

    .row:after {
        content: "";
        display: table;
        clear: both;
    }

    .col {
        float: left;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 0.75rem;
        min-height: 1px;
        margin-left: auto;
        left: auto;
        right: auto;
    }

    .s3 {
        width: 25%;
        padding: 0;
    }

    .s4 {
        width: 33.3333333333%;
        padding-left: 0;
    }

    .s5 {
        width: 41.6666666667%;
    }

    .s6 {
        width: 50%;
    }

    .s7 {
        width: 58.3333333333%;
    }

    .s8 {
        width: 66.6666666667%;
    }

    .s9 {
        width: 75%;
        padding: 0;
    }

    .s12 {
        width: 100%;
    }

    @media only screen and (min-width: 601px) {
        .m2 {
            width: 16.6666666667%;
        }
        .m3 {
            width: 25%;
        }
        .m4 {
            width: 33.3333333333%;
        }
        .m5 {
            width: 41.6666666667%;
        }
        .m6 {
            width: 50%;
        }
        .m7 {
            width: 58.3333333333%;
        }
        .m8 {
            width: 66.6666666667%;
        }
        .m9 {
            width: 75%;
        }
        .m10 {
            width: 83.3333333333%;
        }
        .m11 {
            width: 91.6666666667%;
        }
        .m12 {
            width: 100%;
        }
        .offset-m1 {
            margin-left: 8.3333333333%;
        }
        .offset-m3 {
            margin-left: 25%;
        }
    }

    @media only screen and (min-width: 993px) {
        .l2 {
            width: 16.6666666667%;
        }
        .l3 {
            width: 25%;
        }
        .l4 {
            width: 33.3333333333%;
        }
        .l5 {
            width: 41.6666666667%;
        }
        .l6 {
            width: 50%;
        }
        .l7 {
            width: 58.3333333333%;
        }
        .l8 {
            width: 66.6666666667%;
        }
        .l10 {
            width: 83.3333333333%;
        }
        .l11 {
            width: 91.6666666667%;
        }
        .l12 {
            width: 100%;
        }
        .offset-l1 {
            margin-left: 8.3333333333%;
        }
        .offset-l2 {
            margin-left: 16.6666666667%;
        }
        .offset-l3 {
            margin-left: 25%;
        }
        .offset-l4 {
            margin-left: 33.3333333333%;
        }
        .row .col.offset-l8 {
            margin-left: 66.6666666667%
        }
    }

    @media only screen and (min-width: 1201px) {
        .xl3 {
            width: 25%;
            margin-left: auto;
            left: auto;
            right: auto;
        }
    }

    @media only screen and (min-width: 768px) and (max-width: 1024px) {
        .col--medium {
            width: 50%;
        }
    }

    @media only screen and (max-width: 768px) {
        .col--medium {
            width: 100%;
        }
        .col--medium .unirse {
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        }
    }
    /*COMUN*/

    .t-principal,
    .before--destacado::before,
    .barra__container::before,
    .tab-active::before,
    .t-principal,
    .campanna__pasos:nth-child(2n),
    .card__user--marketplace::before,
    .indicador.active {
        background-color: var(--primary-color);
    }

    .t-color-principal,
    .header__button--active,
    .tab-active,
    .modal--legales a {
        color: var(--primary-color);
    }

    .button--buscar,
    .accordion__faq:not(.accordion__faq--dashboard),
    .card--border,
    .indicador,
    .button--border {
        border: 1px solid var(--primary-color);
    }

    .path-fill {
        fill: var(--primary-color);
    }

    .path-stroke {
        stroke: var(--primary-color);
    }

    input[type="radio"]:not(.switch-input):checked+label:before {
        border: 5px solid var(--primary-color);
    }

    .card__separador {
        border-top: 2px solid var(--primary-color);
    }

    .t-secundario,
    .donacion__input:checked+.donacion__label::before {
        background-color: var(--secondary-color);
    }

    .t-color-secundario,
    .donacion__input:checked+.donacion__label {
        color: var(--secondary-color);
    }

    .donacion__input:checked+.donacion__label {
        border: 2px solid var(--secondary-color);
    }

    .skip-link {
        position: absolute;
        top: -50px;
        z-index: 999;
        background: white;
        display: block;
        width: 100%;
        text-align: center;
        padding: 10px;
        color: #000;
        font-size: 15px;
        font-weight: 500;
    }

    .skip-link:focus {
        top: 0px;
    }

    .u-font-extra-small {
        font-size: 0.75rem;
    }

    .u-font-small {
        font-size: 0.875rem;
    }

    .u-regular {
        font-size: 1rem;
    }

    .u-font-medium {
        font-size: 1.125rem;
    }

    .u-font-normal {
        font-size: 1.5rem;
    }

    .u-bold {
        font-weight: 700;
    }

    .u-medium,
    strong {
        font-weight: 600;
    }

    .u-normal {
        font-weight: 500;
    }

    .u-block {
        display: block;
    }

    .u-overflow-auto {
        overflow: auto;
    }

    .u-flex {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .u-flex-center {
        -webkit-box-align: center;
        -moz-box-align: center;
        -ms-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .u-space-between {
        -webkit-box-pack: justify;
        -moz-box-pack: justify;
        -ms-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .u-flex-end {
        -webkit-box-pack: end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

    .u-flex-align-end {
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .u-wrap {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .u-wrap-inverse {
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .u-justify-center {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .u-space-around {
        -ms-flex-pack: distribute;
        justify-content: space-around;
    }

    .u-box-flex {
        -webkit-box-flex: 4;
        -moz-box-flex: 4;
        -ms-box-flex: 4;
        -ms-flex: 4;
        flex: 4;
    }

    .u-flex-direccion {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .u-same-height {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        flex-wrap: wrap;
        -ms-flex-wrap: wrap;
    }

    .u-same-height .col {
        margin-left: 0;
        margin-top: 24px;
    }

    .u-same-height .u-no-margin {
        margin-top: 0;
    }

    .u-same-height .card {
        height: 100%;
    }

    .u-no-padding {
        padding: 0;
    }

    .u-no-margin {
        margin: 0;
    }

    .u-margin-extra-small {
        margin-top: 4px;
    }

    .u-margin-small {
        margin-top: 8px;
    }

    .u-margin-normal {
        margin-top: 16px;
    }

    .u-margin-regular {
        margin-top: 24px;
    }

    .u-margin-big {
        margin-top: 40px;
    }

    .u-margin-extra-big {
        margin-top: 60px;
    }

    .u-relative {
        position: relative;
        z-index: 2;
    }

    .u-display-block {
        display: block;
    }

    .u-lowercase {
        text-transform: lowercase;
    }

    .t-white .t-color-white,
    .t-white .combo__input--idioma {
        color: #1F2937;
    }

    .t-white .combo__input--idioma:focus {
        border: 2px solid #1F2937;
    }

    .t-white .combo__input--idioma:hover {
        color: #6B7280;
    }

    .cover {
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .before {
        position: relative;
    }

    .before::before {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        z-index: 1;
        content: "";
        width: 100%;
        height: 100%;
        opacity: 0.1;
    }

    .hide {
        display: none;
    }

    .hide-important {
        display: none !important;
    }

    .responsive-img {
        max-width: 100%;
    }

    .radius,
    .before--destacado::before {
        border-radius: 6px;
    }

    .svg {
        margin-right: 21px;
    }

    .svg-left,
    .margin-left {
        margin-left: 10px;
    }

    .margin-right {
        margin-right: 10px;
    }

    .divider {
        height: 1px;
        width: 100%;
        background-color: #000000;
    }

    .divider--login {
        background-color: #767676;
    }

    .divider--faqs {
        background-color: #E0E0E0;
        margin: 40px 0;
    }

    .rotate {
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .visually-hidden {
        position: absolute;
        clip: rect(1px 1px 1px 1px);
        overflow: hidden;
        height: 1px;
    }

    .right-align {
        text-align: right;
    }

    .float-right {
        float: right;
    }

    .center-align {
        text-align: center;
    }

    a {
        text-decoration: none;
    }

    ul {
        list-style-type: none;
    }

    @media only screen and (max-width:600px) {
        .no-mobile {
            display: none;
        }
    }

    @media only screen and (max-width:992px) {
        .no-mobile-tablet {
            display: none;
        }
    }

    @media only screen and (min-width:600px) {
        .no-desktop-tablet {
            display: none;
        }
    }

    @media only screen and (min-width:992px) {
        .no-desktop {
            display: none;
        }
    }
    /*HEADER*/

    .header {
        position: absolute;
        top: 0;
        z-index: 3;
        width: 100%;
    }

    .header:not(.header--landing) {
        position: fixed;
    }

    .header__nav {
        height: 5rem;
    }

    .header__logo {
        padding: 0 0.75rem;
        margin-left: -.75rem;
    }

    .header__img {
        max-height: 3.125rem;
        max-width: 100%;
    }

    .iniciar-sesion {
        margin-left: 10px;
    }

    .header .t-white,
    .header .t-principal {
        -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    }

    .header__item {
        margin: 5px 16px;
    }

    .link-activo {
        padding-bottom: 2px;
        border-bottom: 2px solid #FFFFFF;
        font-weight: 700;
    }

    .t-white .link-activo {
        border-bottom: 2px solid #1F2937;
    }

    .header .button {
        padding: 0 16px;
        height: 2.5rem;
    }

    .header__lista {
        width: 60%;
    }

    .header__logo {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
    }

    @media only screen and (min-width:601px) {
        .iniciar-sesion {
            margin-left: 20px;
        }
        .header__logo {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 25%;
            flex: 0 0 25%;
        }
    }

    @media only screen and (min-width:993px) {
        .header__logo {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 16.6666666667%;
            flex: 0 0 16.6666666667%;
        }
    }
    /*PRINCIPAL*/

    .principal {
        min-height: 100vh;
        padding: 100px 0 40px 0;
        background-image: url("https://cdn.pixabay.com/photo/2013/02/05/21/05/running-78192_1280.jpg");
    }

    .principal::before {
        background: rgb(0, 0, 0);
    }

    .principal--marketplace::before,
    .barra__container::before {
        opacity: 0.2;
    }

    .principal--landing::before {
        opacity: 0.3;
    }

    .principal__compartir li {
        margin: 16px 6px;
    }

    .principal__recaudado {
        text-transform: uppercase;
        font-size: 1.25rem;
        line-height: 1.438rem;
    }

    .bajar {
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        cursor: pointer;
        z-index: 2;
    }

    .container--busqueda {
        margin-top: 50px;
    }

    @media only screen and (max-width:600px) {
        .bajar img {
            height: 24px;
        }
        .principal .u-margin-extra-big {
            margin-top: 40px;
        }
        .principal--landing {
            min-height: 15.625rem;
            padding: 80px 0 40px 0;
        }
        .footer--landing {
            margin-bottom: 70px;
        }
        .fixed-button {
            display: block;
            background-color: #FFFFFF;
            border: 1px solid #D1D5DB;
            -webkit-box-shadow: 0px -8px 20px rgba(0, 0, 0, 0.15);
            box-shadow: 0px -8px 20px rgba(0, 0, 0, 0.15);
            position: fixed;
            bottom: 0;
            width: 100%;
            z-index: 9;
            padding: 16px;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }
        .fixed-button.hide {
            display: none;
        }
    }

    @media only screen and (min-width:400px) {
        .principal__compartir ul {
            margin-left: 24px;
        }
    }

    @media only screen and (min-width:992px) {
        .principal--landing {
            padding-bottom: 200px;
        }
    }

    @media only screen and (min-width:600px) {
        .principal__recaudado {
            font-size: 2rem;
            line-height: 2.313rem;
        }
        .fixed-button {
            display: none;
        }
    }
    /*LANDING*/

    .landing__titulo {
        font-size: 2rem;
        line-height: 2.313rem;
    }

    .landing__descripcion {
        line-height: 1.125rem;
    }

    .detalles {
        background-color: #f3f4f6;
        padding: 60px 0;
    }

    .encabezados__titulo {
        font-size: 1.5rem;
        line-height: 1.75rem;
    }

    .encabezados__subtitulo {
        font-size: 2rem;
        line-height: 2.313rem;
    }

    .encabezados__textos {
        line-height: 1.125rem;
    }

    .img-tooltip {
        margin: 0 0 -5px 5px;
        cursor: pointer;
    }

    @media only screen and (max-width:600px) {
        .landing__descripcion {
            font-weight: 500;
        }
        .encabezados__subtitulo {
            margin-top: 8px;
        }
        .encabezados__buttons .button,
        .encabezados__ayuda {
            margin: 8px auto;
        }
    }

    @media only screen and (min-width:600px) {
        .encabezados__buttons .button,
        .encabezados__ayuda {
            margin: 4px 8px;
            min-width: 13.438rem;
        }
        .encabezados__titulo {
            font-size: 2rem;
            line-height: 2.313rem;
        }
        .encabezados__subtitulo {
            font-size: 2.75rem;
            line-height: 3.188rem;
        }
        .encabezados__textos {
            font-size: 1.375rem;
            line-height: 1.563rem;
            font-weight: 400;
        }
    }

    @media only screen and (min-width:992px) {
        .landing__titulo {
            font-size: 2.5rem;
            line-height: 3.063rem;
        }
        .landing__descripcion {
            font-size: 1.25rem;
            line-height: 1.438rem;
        }
        .encabezados {
            max-width: 70%;
        }
    }

    @media only screen and (min-width:1300px) {
        .encabezados {
            max-width: 50%;
        }
    }
    /*CAJA*/

    .donacion {
        padding: 32px 20px;
        background: rgb(0, 0, 0);
        background: rgba(0, 0, 0, 0.5);
        max-width: 100%;
        margin-top: 40px;
    }

    .donacion__input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .donacion__label {
        height: 3.5rem;
        width: 95%;
        background-color: #FFFFFF;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center;
        border-radius: 6px;
        font-size: 1.125rem;
        line-height: 1.125rem;
        color: #1F2937;
        cursor: pointer;
        margin: 0 auto;
        position: relative;
        padding: 0 15px;
        border: 2px solid #FFFFFF;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        margin-bottom: 8px;
    }

    .donacion__input:checked+.donacion__label {
        font-weight: 700;
        font-size: 1.25rem;
    }

    .donacion__input:checked+.donacion__label::before {
        content: '';
        position: absolute;
        right: 2px;
        top: 2px;
        border-radius: 3px;
        height: 12px;
        width: 12px;
        background-image: url('https://stockcrowd.s3.eu-central-1.amazonaws.com/descargables/peer/check.svg');
    }

    @media only screen and (min-width:600px) {
        .donacion__label {
            height: 4.25rem;
        }
    }

    @media only screen and (max-width:800px) {
        .col--donacion {
            width: 50%;
        }
    }

    @media only screen and (min-width:992px) {
        .donacion {
            max-width: 470px;
            margin-top: 0;
            float: right;
        }
    }
    /*BUTTONS*/

    .button {
        height: 2.688rem;
        font-size: 1rem;
        border: none;
        background-color: #FFFFFF;
        color: #FFFFFF;
        cursor: pointer;
        font-weight: 600;
        border-radius: 6px;
        padding: 0 24px;
        box-sizing: border-box;
        font-family: 'Work Sans', sans-serif;
    }

    .button-img {
        border: none;
        cursor: pointer;
    }

    .button:not(.button--acciones.t-color-principal):not(.button--ignorar) {
        -webkit-box-shadow: 0px 2px 2px rgba(17, 24, 39, 0.08);
        box-shadow: 0px 2px 2px rgba(17, 24, 39, 0.08);
    }

    .button:disabled {
        background-color: #F3F4F6;
        color: #667085;
        cursor: no-drop;
    }

    .button--calculadora,
    .button--buscar {
        height: 2.375rem;
    }

    .button--buscar:hover,
    .button--ver:hover {
        background-color: var(--primary-color) !important;
        color: #FFFFFF !important;
    }

    .button--width,
    .button--calculadora,
    .u-total-width {
        width: 100%;
    }

    .button--acciones {
        padding: 0 10px;
        font-weight: 500;
    }

    .button--inverse {
        background-color: #FFFFFF;
        color: #111827;
        border: 2px solid #FFF;
    }

    .button--inverse:hover {
        background-color: #E5E7EB;
        border: 2px solid #E5E7EB;
    }

    .button--ver {
        border: 2px solid var(--primary-color);
    }

    .button--publicar {
        background-color: #111827;
        margin-left: 10px;
        border: 1px solid #111827;
    }

    .button--publicar:hover {
        background-color: #111827;
        border: 1px solid #FFFFFF;
    }

    .button--publicar:focus {
        background-color: #344054;
    }

    .button--cancelar {
        background-color: transparent;
        border: 1px solid #FFFFFF;
    }

    .button--cancelar:hover {
        background-color: #FFFFFF;
        color: #111827;
    }

    .button--cancelar:focus,
    .t-white .button--cancelar {
        background-color: #FFFFFF;
        border: 1px solid #111827;
        color: #111827;
    }

    .button--cancelar,
    .button--publicar {
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
        font-weight: 500;
    }

    .button--card {
        height: 2.313rem;
        width: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .button--card:hover {
        background-color: #FFFFFF;
        color: var(--primary-color);
        border: 2px solid var(--primary-color);
    }

    .button--paginador {
        margin: 0 5px;
    }

    .button--lupa {
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        border: 1px solid #344054;
        height: 2.375rem;
        padding: 7px;
        margin-left: 8px;
    }

    .button--idiomas {
        box-shadow: none;
        padding: 0 8px;
        font-weight: 500;
    }

    .button--seleccionado {
        background-color: #F3F4F6;
    }

    .paginador__paginas {
        margin: 0 10px;
    }

    .button--disabled svg path {
        fill: #D1D5DB;
    }

    .button-link {
        background-color: transparent;
        border: none;
        padding: 0;
        cursor: pointer;
        height: auto;
        display: block;
        font-family: 'Work Sans', sans-serif;
    }

    .button--icon {
        padding: 0px;
        background-color: transparent;
        border: none;
        cursor: pointer;
        height: 2.25rem;
        width: 2.25rem;
    }

    .button--icon:hover {
        background-color: #F3F4F6;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    }

    .card__mensaje .button--icon:hover {
        box-shadow: none;
        background-color: transparent;
    }

    .button--disabled {
        cursor: not-allowed;
    }

    .button-cancelar {
        background-color: transparent;
    }

    .button--portada {
        background: rgba(0, 0, 0, 0.6);
        border: 1px solid #111827;
        font-weight: 500;
        padding: 0 10px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
        margin-bottom: 20px;
    }

    .button-imagen {
        border: 1px dashed #D1D5DB;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        border-radius: 6px;
        background: #FFFFFF;
        padding: 8px 10px;
        color: #6B7280;
        font-size: 0.875rem;
        cursor: pointer;
        font-family: 'Work Sans', sans-serif;
    }

    .button-imagen:hover {
        background: #F3F4F6;
    }

    .button-imagen:focus {
        background: #FFFFFF;
        border: 1px dashed #1F2937;
        outline: none;
    }

    .button-imagen svg {
        margin-right: 20px;
    }

    .button.t-secundario:hover {
        background: #FFFFFF;
        color: var(--secondary-color);
    }

    .button.t-principal:hover {
        background: #FFFFFF;
        color: var(--primary-color);
    }

    @media only screen and (max-width:600px) {
        .button {
            width: 100%;
        }
    }
    /*COLORES*/

    .t-color-white {
        color: #FFFFFF;
    }

    .t-color-gris {
        color: #344054;
    }

    .t-color-error {
        color: #E10F00;
    }

    .t-color-black {
        color: #000000;
    }

    .t-white {
        background-color: #FFFFFF;
    }

    .t-red {
        background-color: red;
    }

    .t-principal,
    .barra__container::before,
    .before--destacado::before,
    .campanna__pasos:nth-child(2n),
    .tab-active::before {
        background-color: var(--primary-color);
    }

    .t-color-principal,
    .header__button--active {
        color: var(--primary-color);
    }

    .button--border {
        border: 1px solid var(--primary-color);
    }

    .path-fill {
        fill: var(--primary-color);
    }

    .path-stroke {
        stroke: var(--primary-color);
    }

    .button--buscar,
    .accordion__faq:not(.accordion__faq--dashboard),
    .card--border {
        border: 1px solid var(--primary-color);
    }

    .input-radio:checked+.input-radio-label:after {
        border: 5px solid var(--primary-color);
    }

    .t-secundario,
    .donacion__input:checked+.donacion__label::before {
        background-color: var(--secondary-color);
    }

    .t-color-secundario {
        color: var(--secondary-color);
    }

    .donacion__input:checked+.donacion__label {
        border: 2px solid #1F2937;
    }
    /*CARDS*/

    .card {
        background-color: #FFFFFF;
        border-radius: 6px;
        padding: 24px 16px;
    }

    .card--principal {
        margin-bottom: 50px;
        border-radius: 0;
        -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    }

    .card__imagen {
        border-radius: 6px;
        height: 10.625rem;
        width: 100%;
        z-index: 1;
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/irb-barcelona/celulas-sin-ola.jpg');
    }

    .card__imagen::before {
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 37.05%);
        opacity: 1;
        border-radius: 6px;
    }

    .card__buttons .button {
        width: 49%;
    }

    .no-fondo,
    .fondo-user {
        position: relative;
    }

    .no-fondo::before,
    .fondo-user::before,
    .filtro-oscuro::before {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        z-index: 1;
        content: "";
        width: 100%;
        height: 100%;
        opacity: 0.1;
        background: transparent;
        border-radius: 6px;
        background-color: var(--primary-color);
    }

    .filtro-oscuro::before {
        opacity: 0.4;
        background-color: #000000;
    }

    .fondo-user::before {
        border-radius: 100%;
    }

    .card__user {
        border-radius: 6px;
        width: 3.125rem;
        height: 3.125rem;
        margin-right: 16px;
    }

    .card__user--team {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 3.125rem;
        flex: 0 0 3.125rem;
    }

    .card__user::before {
        border-radius: 6px;
        background-color: var(--primary-color);
    }

    .card__user--marketplace {
        height: 1.875rem;
        width: 1.875rem;
        border-radius: 100%;
        margin-right: 8px;
        overflow: hidden;
        border: 1px solid #FFFFFF;
    }

    .card__user--donors {
        width: 3.75rem;
        height: 3.75rem;
    }

    .card__user--donantes {
        background-image: none;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50px;
        flex: 0 0 50px;
    }

    .card__block {
        padding: 8px 0;
        border-bottom: 1px solid #F3F4F6;
    }

    .card__block:last-child {
        border-bottom: none;
    }

    .card__block--donantes {
        padding: 16px 0;
    }

    .card__titulo {
        font-size: 1.25rem;
        margin-bottom: 25px;
        line-height: 1.875rem;
    }

    .card__mas {
        margin-top: 40px;
        text-align: right;
    }

    .card__blog {
        padding: 24px 16px;
        -webkit-box-flex: 4;
        -ms-box-flex: 4;
        -moz-box-flex: 4;
        -ms-flex: 4;
        flex: 4;
    }

    .card--border {
        max-width: 100%;
    }

    .card__texto {
        line-height: 20px;
    }

    .card__resumen img,
    .card__resumen span {
        margin-right: 24px;
    }

    .card__donantes {
        max-width: 80%;
    }

    .card--historia {
        padding: 8px 16px;
    }

    .card__equipo {
        margin-top: 16px;
    }

    .card__contenido {
        padding: 0 8px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-line-pack: justify;
        align-content: space-between;
        height: calc(100% - 12rem);
    }

    .card__edicion {
        -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
        border-radius: 8px;
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 2;
        padding: 8px;
    }

    .card__edit {
        margin-top: 40px;
        border-top: 1px solid #ECECED;
        padding-top: 16px;
    }

    .card__enlace {
        cursor: pointer;
    }

    .card__enlace svg path {
        fill: #344054;
    }

    .card__enlace_strava svg path {
        fill: #fc4c02;
    }

    .card__enlace:hover svg path {
        fill: var(--primary-color);
    }

    .card__enlace_strava:hover svg path {
        fill: #fc4c02;
    }

    .card__opciones {
        position: absolute;
        right: 8px;
        bottom: 8px;
        z-index: 1;
        height: 26px;
        width: 26px;
        border-radius: 100%;
    }

    .card__opciones .button-link {
        margin: 0 auto;
        text-align: center;
        height: 18px;
    }
    .footer__block--marketplace {
        -webkit-box-pack: end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

    .card__svg {
        height: 24px;
    }

    .card__opciones .card__svg {
        width: 18px;
        height: 18px;
        fill: #FFFFFF;
    }

    .card-blog {
        height: 150px;
        position: relative;
    }

    .card-blog:hover::before {
        position: absolute;
        left: 0;
        display: block;
        z-index: 1;
        content: "";
        width: 100%;
        height: 100%;
        border-radius: 6px;
        background-color: rgba(0, 0, 0, 0.4);
    }

    .svg-blog {
        position: absolute;
        top: 50%;
        left: 50%;
        height: 32px;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
    }

    .card__img {
        width: 100%;
        height: 100%;
        display: block;
        border-radius: 6px;
        -o-object-fit: cover;
        object-fit: cover;
        object-position: center;
    }

    .card-pasos {
        padding: 16px 24px;
        border-radius: 6px;
        width: 100%;
    }

    .card-footer {
        border-radius: 0 0 6px 6px
    }

    .radio-container {
        padding: 16px 24px;
        margin: 4px 0 2px 0;
        border-radius: 6px 6px 0 0;
    }

    @media only screen and (max-width:992px) {
        .card--mobile {
            margin-top: 44px;
        }
        .card--historia {
            margin-top: 24px;
        }
    }

    @media only screen and (max-width:600px) {
        .card__nombre {
            -webkit-box-align: center;
            -moz-box-align: center;
            -ms-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
        }
        .card__recaudado {
            margin-top: 8px;
        }
    }

    @media only screen and (min-width:768px) {
        .card__nombre {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 60%;
            flex: 0 0 60%;
        }
    }

    @media only screen and (min-width:600px) {
        .card {
            padding: 24px;
        }
        .card__blog {
            padding: 24px;
        }
    }

    @media only screen and (min-width:992px) {
        .card--principal {
            border-radius: 12px;
        }
    }

    .card--padding {
        padding: 24px 0;
    }

    .card--marketplace {
        padding: 8px 8px 16px 8px;
        border: 1px solid #E5E5E5;
        -webkit-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    }

    .card--dashboard {
        padding: 16px;
        border: 1px solid #ECECED;
    }

    .card__donantes {
        display: block;
        margin-top: 5px;
    }

    .card__separador {
        border-top: 2px solid var(--primary-color);
        padding-top: 10px;
    }

    .card--clicable {
        cursor: pointer;
    }

    @media only screen and (max-width:600px) {
        .u-same-height .col--actividad {
            margin-top: 8px;
        }
        .card--actividad {
            padding: 16px 24px;
        }
    }
    /*HISTORIA*/

    .historia {
        padding: 0 0 50px 0;
    }

    .historia__img {
        height: 10.188rem;
        width: 10.188rem;
        margin-right: 24px;
    }

    .historia__img button {
        z-index: 2;
        border: 1px solid #1F2937;
        font-weight: 500;
        font-size: 0.875rem;
        padding: 10px;
        position: absolute;
    }

    .historia__titulo {
        font-size: 1.75rem;
    }

    .historia__texto {
        line-height: 1.25rem;
    }

    .historia__texto ul li,
    .angular-editor-textarea ul li {
        list-style-type: disc;
    }

    .historia__texto ol,
    .angular-editor-textarea ol {
        margin-left: 45px;
    }

    @media only screen and (max-width:600px) {
        .historia__img {
            margin: 0 auto;
        }
        .historia__detalles {
            margin-top: 20px;
        }
    }

    @media only screen and (min-width:600px) {
        .historia {
            padding: 0 0 80px 0;
        }
        .historia__detalles {
            -webkit-box-flex: 4;
            -ms-box-flex: 4;
            -moz-box-flex: 4;
            -ms-flex: 4;
            flex: 4;
        }
    }

    @media only screen and (max-width:992px) {
        .historia__container {
            width: 100%;
        }
    }

    @media only screen and (min-width:992px) {
        .historia {
            margin-top: -135px;
        }
    }
    /*MARKETPLACE*/

    .marketplace {
        padding: 48px 0;
    }

    .marketplace--camps {
        background: #F9FAFB;
        border: 1px solid #E5E7EB;
        border-radius: 6px;
        padding: 16px 24px;
    }

    .marketplace ul {
        list-style-type: disc;
    }

    .marketplace ol {
        margin-left: 42px;
    }
    .form-marketplace {
        gap: 1rem;
    }

    @media only screen and (max-width:992px) {
        .marketplace__buscar {
            width: 100%;
            margin-top: 24px;
        }
    }

    @media only screen and (min-width:992px) {
        .marketplace {
            padding: 80px 0 100px 0;
        }
    }
    /*CAMPANA*/

    .campanna {
        padding: 0;
    }

    .campanna__encabezado {
        padding-top: 48px;
    }

    .campanna__pasos {
        padding: 48px 0;
    }

    .campanna__img {
        border-radius: 12px;
        height: 17.313rem;
        width: 100%;
        -webkit-box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
        box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
        background-image: url("https://cdn.pixabay.com/photo/2013/02/05/21/05/running-78192_1280.jpg");
    }

    .campanna__pasos .u-flex>.l7 {
        padding-right: 2.5rem;
    }

    .campanna__pasos .u-flex-direccion>.l7 {
        padding-left: 2.5rem;
    }

    .campanna__titulo {
        font-size: 2rem;
    }

    .campanna_paso {
        background-color: #FFFFFF;
        height: 2.563rem;
        width: 2.563rem;
        border-radius: 6px;
        margin-right: 20px;
        font-weight: 500;
        color: #344054;
        font-size: 1.125rem;
    }

    .campanna_paso--odd {
        border: 1px solid #344054;
    }

    .cta {
        padding: 48px 0;
    }

    .cta .iniciar-sesion {
        margin: 24px auto 0 auto;
    }

    @media only screen and (max-width:992px) {
        .campanna__img {
            margin-top: 40px;
        }
    }

    @media only screen and (min-width:992px) {
        .campanna__encabezado {
            padding-top: 80px;
        }
        .campanna__titulo {
            font-size: 2.25rem;
        }
    }
    /*BARRA DE PROGRESO*/

    .barra {
        margin: 4px 0 10px 0;
        width: 100%;
    }

    .barra--historia {
        margin-top: 10px;
    }

    .barra--marketplace {
        margin-bottom: 3px;
    }

    .barra__container {
        height: 0.5rem;
        border-radius: 4px;
        width: 100%;
        position: relative;
        overflow: hidden;
        margin-right: 10px;
        background-color: #FFFFFF;
    }

    .barra__progreso {
        position: absolute;
        height: 100%;
        left: 0;
        z-index: 3;
        border-radius: 4px;
        width: 60%;
    }
    /*COMPARTIR*/

    .compartir {
        margin-top: 16px;
    }

    .compartir__item {
        margin-left: 8px;
    }

    .compartir__donantes {
        margin-left: 10px;
    }

    .compartir__enlace {
        height: 32px;
        width: 32px;
    }
    /*TABS*/

    .tabs__encabezado {
        border-bottom: 1px solid #F3F4F6;
        padding: 0 24px;
    }

    .tabs__encabezado--dashboard {
        padding-bottom: 25px;
        border-bottom: 1px solid #E0E0E0;
    }

    .tabs__container {
        padding: 24px 16px;
    }

    .tab__button {
        padding: 0;
        height: auto;
        margin-right: 30px;
        background-color: transparent;
        color: #344054;
        font-weight: 400;
        position: relative;
        margin-bottom: 20px;
        border: none;
        cursor: pointer;
        font-size: 1rem;
        font-family: 'Work Sans', sans-serif;
    }

    .tab-active {
        font-weight: 600;
        color: var(--primary-color);
    }

    .tab-active::before,
    .tab__button:hover::before,
    .tab__button:focus::before {
        position: absolute;
        left: 0;
        bottom: -20px;
        display: block;
        z-index: 1;
        content: "";
        width: 100%;
        height: 3px;
        border-radius: 6px;
    }

    .tabs--dashboard .tab-active::before,
    .tabs--dashboard .tab__button:hover::before,
    .tabs--dashboard .tab__button:focus::before {
        bottom: -10px;
    }

    .tab__button--dashboard {
        margin: 0 0 10px 0;
        padding: 0 15px;
    }

    .img-edicion {
        border: 1px solid #f3f4f6;
    }

    @media only screen and (min-width:600px) {
        .tabs__container {
            padding: 16px 24px 0 24px;
        }
    }

    .tabs__container--dashboard {
        padding: 0;
    }
    /*FOOTER*/

    .footer {
        background-color: #1F2937;
    }

    .footer__extendido {
        padding: 24px 0;
    }

    .footer__logo {
        max-height: 3.75rem;
        max-width: 100%;
    }

    .footer__encabezados {
        margin-bottom: 4px;
    }

    .footer__link {
        line-height: 1.313rem;
    }

    .footer__link:focus {
        outline: 1px dotted #FFFFFF;
    }

    .footer__powered {
        border-top: 1px solid #FFFFFF;
        padding: 16px 0;
    }

    .footer__block {
        padding: 16px 0;
    }

    .footer__stc {
        margin-left: 8px;
    }

    @media only screen and (max-width:600px) {
        .footer__powered .t-color-white {
            width: 100%;
            text-align: center;
        }
        .footer__stc {
            margin-top: 16px;
        }
    }

    @media only screen and (max-width:768px) {
        .footer__list {
            margin: 0 8px;
        }
        .footer__block .u-flex {
            width: 100%;
            -webkit-box-pack: center;
            -moz-box-pack: center;
            -ms-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
        }
        .footer__block>.u-wrap {
            display: block;
        }
        .footer__reducido .button-link {
            margin: 16px auto 5px auto;
        }
        .footer__redes {
            margin-top: 25px;
        }
    }

    @media only screen and (min-width:768px) {
        .footer__list {
            margin-left: 16px;
        }
        .footer__reducido .button-link {
            margin-right: 32px;
        }
        .footer__block--marketplace {
            -webkit-box-pack: end;
            -moz-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end;
        }
    }

    @media only screen and (max-width:600px) {
        .footer__col {
            margin-top: 24px;
        }
    }

    @media only screen and (min-width:992px) {
        .footer__logo {
            max-height: 3.125rem;
        }
    }
    /*MODAL*/

    .overlay {
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 9;
        visibility: hidden;
        opacity: 0;
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        -webkit-transition: -webkit-transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
        transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
    }

    .overlay .container {
        position: relative;
        height: 100%;
    }

    .overlay--open {
        visibility: visible;
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
        transition: transform 0.4s, opacity 0.4s;
        overflow: auto;
        background-color: rgb(0, 0, 0);
        background-color: rgba(0, 0, 0, 0.5);
    }

    .overlay--login {
        background-color: rgb(255, 255, 255);
        z-index: 5;
    }

    .modal {
        position: fixed;
        left: 0;
        right: 0;
        padding: 0 24px;
        max-height: 100%;
        margin: auto;
        overflow-y: auto;
        border-radius: 8px;
        will-change: top, opacity;
        scrollbar-width: thin;
    }

    @media only screen and (min-width:768px) {
        .modal {
            max-height: 90%;
        }
    }

    .modal::-webkit-scrollbar,
    .mat-dialog-content::-webkit-scrollbar,
    .mat-actividad-panel::-webkit-scrollbar {
        -webkit-appearance: none;
    }

    .modal::-webkit-scrollbar,
    .mat-dialog-content::-webkit-scrollbar,
    .mat-actividad-panel::-webkit-scrollbar {
        width: 2px;
        height: 2px;
    }

    .modal::-webkit-scrollbar-thumb,
    .mat-dialog-content::-webkit-scrollbar-thumb,
    .mat-actividad-panel::-webkit-scrollbar-thumb {
        background-color: rgb(196, 196, 196);
        background-color: rgba(196, 196, 196, 1);
        border-radius: 10px;
        border: 2px solid rgb(196, 196, 196);
        border: 2px solid rgba(196, 196, 196, 1);
    }

    .modal::-webkit-scrollbar-track,
    .mat-dialog-content::-webkit-scrollbar-track,
    .mat-actividad-panel::-webkit-scrollbar-track {
        border-radius: 10px;
    }

    .modal__bottom,
    .modal__header {
        background-color: #f9f9f9;
        bottom: 0;
        width: 100%;
        height: 50px;
        position: relative;
    }

    .modal__header {
        top: 0;
    }

    .modal__bottom {
        height: 65px;
    }

    @media only screen and (min-width:768px) {
        .modal__bottom,
        .modal__header {
            position: sticky;
            overflow: hidden;
            z-index: 2;
        }
    }

    .modal--legales {
        padding: 40px 16px 16px 16px;
        max-width: 45rem;
        background-color: #F9F9F9;
        width: 95%;
    }

    .modal--legales h2 {
        margin-bottom: 10px;
    }

    .modal--legales p {
        margin: 10px 0;
    }

    .modal--acciones {
        background-color: #FFFFFF;
        max-width: 32rem;
        height: auto;
        padding: 44px 24px 34px 24px;
    }

    .modal--editar {
        background-color: #F9F9F9;
        height: auto;
        max-width: 500px;
    }

    .modal--camp,
    .modal--fundraiser,
    .modal--equipo,
    .modal--agradecimiento,
    .modal--page {
        background-color: #F9F9F9;
    }

    .modal--equipo,
    .modal--agradecimiento {
        max-width: 95%;
    }

    .modal--agradecimiento {
        padding-bottom: 25px;
    }

    .modal--camp {
        max-width: 35rem;
    }

    @media only screen and (min-width:1024px) and (max-width:1400px) {
        .modal--agradecimiento {
            max-width: 50%;
        }
        .modal--difference {
            max-width: 60%;
        }
    }

    @media only screen and (min-width:1400px) and (max-width:1700px) {
        .modal--equipo {
            max-width: 70%;
        }
        .modal--agradecimiento {
            max-width: 50%;
        }
        .modal--difference {
            max-width: 60%;
        }
    }

    @media only screen and (min-width:1700px) {
        .modal--equipo {
            max-width: 65%;
        }
        .modal--agradecimiento {
            max-width: 30%;
        }
        .modal--difference {
            max-width: 40%;
        }
    }

    @media only screen and (max-width:768px) {
        .modal--agradecimiento .col:last-child {
            margin-top: 40px;
        }
        .modal--agradecimiento .col:only-child {
            margin-top: 0;
        }
    }

    .modal--fundraiser {
        max-width: 50rem;
        height: auto;
    }

    .modal--page {
        max-width: 65rem;
    }

    .modal--login {
        max-width: 34rem;
        padding: 40px 24px;
        overflow: auto;
        background-color: #F9F9F9;
        border: 1px solid #E5E7EB;
        height: auto;
        max-height: 90vh;
    }

    .modal__content {
        padding: 0 0 24px 0;
    }

    .modal--calculadora {
        background-color: #F9F9F9;
        max-width: 35.688rem;
        padding: 32px 10px 32px 32px;
    }

    .modal__texto {
        margin-bottom: 16px;
    }

    .modal__footer {
        position: absolute;
        bottom: 10px;
        width: 98%;
        left: 0;
    }

    .modal__footer .button {
        width: auto;
    }

    .button-close {
        position: absolute;
        top: 25px;
        right: 25px;
        border: none;
        padding: 0;
        cursor: pointer;
        background-color: transparent;
    }

    .calculadora__destacado {
        padding: 26px 0;
        text-align: center;
    }

    .overflow {
        overflow: hidden;
    }

    .blur {
        filter: blur(3px);
        -webkit-filter: blur(3px);
        pointer-events: none;
    }

    @media only screen and (min-width:768px) {
        .modal--legales {
            height: 70vh;
            min-width: 600px;
        }
        .modal__content {
            max-height: 85%;
        }
        .modal--camp .modal__content {
            max-height: 95%;
        }
        .modal--calculadora {
            height: 30.625rem;
        }
        .modal--login {
            padding: 40px;
            height: auto;
        }
    }

    @media only screen and (min-width:768px) and (max-width:1220px) {
        .modal--page {
            width: 90%;
        }
    }
    /*FORMS*/

    .input-field {
        padding-right: 0;
    }

    .input,
    .mat-select {
        border-radius: 6px;
        width: 100%;
        height: 2.375rem;
        border: 1px solid #D1D5DB;
        padding: 0 12px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        color: #6B7280;
        font-size: 0.875rem;
        margin-top: 6px;
        font-family: 'Work Sans', sans-serif !important;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    }

    select {
        color: #6B7280;
        font-family: 'Work Sans', sans-serif !important;
    }

    .input--no--label {
        margin-top: 0;
    }

    .input--calculadora {
        height: 2.375rem;
        padding-right: 60px;
        margin-top: 0;
    }

    .input:focus,
    .mat-select:focus {
        border: 1px solid #1F2937;
        outline: none;
        color: #1F2937;
    }

    .input-textarea {
        min-height: 5.625rem;
        padding: 12px;
    }

    .span-input {
        position: absolute;
        right: 10px;
        top: 10px;
        background-color: #FFFFFF;
        color: #6B7280;
    }

    .input-label {
        color: #1F2937;
        font-size: 0.875rem;
        font-weight: 600;
        margin-bottom: 8px;
    }

    .invalid {
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/peer/error.svg');
        background-repeat: no-repeat;
        background-position: 98% 50%;
        border: 1px solid #FDA29B;
    }

    .invalid:focus {
        border: 1px solid #FDA29B;
        -webkit-box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0 0 0 4px #FEE4E2;
        box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0 0 0 4px #FEE4E2;
    }

    .error {
        background-color: #FFF4F3;
        border-radius: 3px;
        border: 1px solid #F04438;
        padding: 16px 20px;
    }

    .error__lista {
        list-style-type: disc;
        margin: 4px 0 0 13px;
    }

    @media only screen and (max-width:600px) {
        .input-field {
            width: 100%;
            margin-bottom: 8px;
        }
    }

    @media only screen and (max-width:992px) {
        .input-container:not(.input-containerMarketplace) {
            margin-bottom: 16px;
        }
    }

    @media only screen and (min-width:600px) {
        .marketplace__input {
            min-width: 380px;
        }
    }
    /*RADIOS BUTTONS*/

    .input-radio {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .input-radio:not(:checked)+.input-radio-label,
    .input-radio:checked+.input-radio-label {
        position: relative;
        padding-left: 28px;
        cursor: pointer;
        display: inline-block;
        height: 25px;
        line-height: 25px;
        font-size: 1rem;
        -webkit-transition: .28s ease;
        transition: .28s ease;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .input-radio+.input-radio-label:before,
    .input-radio+.input-radio-label:after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        margin: 4px;
        width: 0.875rem;
        height: 0.875rem;
        z-index: 0;
        background-color: #FFF;
    }

    .input-radio:not(:checked)+.input-radio-label:before,
    .input-radio:not(:checked)+.input-radio-label:after,
    .input-radio:checked+.input-radio-label:before,
    .input-radio:checked+.input-radio-label:after {
        border-radius: 50%
    }

    .input-radio:not(:checked)+.input-radio-label:before,
    .input-radio:not(:checked)+.input-radio-label:after {
        border: 1px solid #D1D5DB;
    }

    .input-radio:not(:checked)+.input-radio-label:after {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    .input-radio:checked+.input-radio-label:after {
        width: 0.375rem;
        height: 0.375rem;
    }
    /*CHECKBOX*/

    .chechbox-comun {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .label--check {
        position: relative;
        padding-left: 30px;
        padding-top: 3px;
        cursor: pointer;
        font-weight: 400;
        text-align: left;
        line-height: 30px;
    }

    .chechbox-comun+.label--check::before,
    .chechbox-comun+.label--check::after,
    .chechbox-comun+input+.label--check::before,
    .chechbox-comun+input+.label--check::after {
        content: '';
        left: 0;
        position: absolute;
        z-index: 1;
    }

    .chechbox-comun:not(:checked)+.label--check::after,
    .chechbox-comun:checked+.label--check::after,
    .chechbox-comun:not(:checked)+input+.label--check::after,
    .chechbox-comun:checked+input+.label--check::after {
        width: 1rem;
        height: 1rem;
        top: 3px;
        border-radius: 4px;
    }

    .chechbox-comun:not(:checked)+.label--check::after,
    .chechbox-comun:not(:checked)+input+.label--check::after {
        border: 1px solid rgb(217, 218, 217);
        background-color: #FFFFFF;
    }

    .chechbox-comun:checked+.label--check::after,
    .chechbox-comun:checked+input+.label--check::after {
        background-color: var(--primary-color);
        border: 1px solid var(--primary-color);
        background-repeat: no-repeat;
        background-size: 80%;
        background-position: center;
        background-image: url(https://stockcrowd.s3.amazonaws.com/descargables/p2p/check.png);
    }

    .chechbox-comun-partial:not(:checked) + .label--check::after,
    .chechbox-comun-partial:not(:checked) + input + .label--check::after {
        background-color: var(--primary-color);
        border: 1px solid var(--primary-color);
        background-repeat: no-repeat;
        background-size: 80%;
        background-position: center;
        background-image: url(https://stockcrowd.s3.amazonaws.com/boxbo/img/minus-check.svg) !important;
    }

    .chechbox-comun:disabled+.label--check::after {
        background-color: #F0F1F7;
        border: 1px solid #D1D5DB;
    }

    .chechbox-comun:checked:disabled+.label--check::before {
        border-right: 2px solid #c7c7ce;
        border-bottom: 2px solid #c7c7ce;
    }
    /*SELECTORES*/

    .combo__input {
        padding: 0 13px;
        cursor: pointer;
        height: 2.375rem;
        min-width: 4.688rem;
        color: #6B7280;
        border-radius: 6px;
    }

    .combo__input:not(.combo__input--idioma) {
        margin-top: 6px;
        border: 1px solid #D1D5DB;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        background-image: url('https://stockcrowd.s3.amazonaws.com/boxbo/img/dropdown.png');
        background-repeat: no-repeat;
        background-position: right 10px top 17px !important;
        background-color: #ffffff;
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        -o-appearance: none;
    }

    .combo__input.combo__input--marketplace{
        margin-top: 0;          
    }
    .input-containerMarketplace {
        width: 100%;
        max-width: 100%;  
    }
    .marketplace__input {
        margin-bottom: 0;
    }

    .combo__menu {
        position: absolute;
        left: 0;
        top: 43px;
        right: 0;
        padding: 8px 0;
        display: none;
        -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.05);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.05);
    }

    .combo__option {
        min-height: 2.5rem;
        text-align: center;
        cursor: pointer;
        color: #111827;
        padding: 0 15px;
    }

    .combo__option:hover,
    .option--current {
        background-color: #F3F4F6;
        font-weight: 500;
    }

    .combo__open .combo__input:not(.combo__input--idioma) {
        color: #1F2937;
    }

    .combo__input:not(.combo__input--idioma):focus {
        border: 1px solid #1F2937;
    }

    .combo__input--idioma {
        border: 2px solid transparent;
    }

    .combo__input--idioma:hover {
        background: rgb(255, 255, 255);
        background: rgba(255, 255, 255, 0.2);
    }

    .combo__input--idioma:focus {
        border: 2px solid #FFFFFF;
        background-color: transparent;
    }

    .combo__menu--open {
        display: block;
    }

    .combo__option[aria-selected="true"] {
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/peer/check.png');
        background-repeat: no-repeat;
        background-position: 94% 50%;
        font-weight: 600;
    }

    .combo__svg {
        position: absolute;
        top: 0;
        right: 13px;
        height: 100%;
    }

    .combo path {
        fill: #6B7280;
    }

    .combo__open path {
        fill: #1F2937;
    }

    .combo__open .combo__svg {
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .idiomas,
    .idiomas .idiomas__mat {
        width: 4.375rem !important;
        height: 2.5rem !important;
        border: none;
        box-shadow: none;
    }

    #mat-select-0-panel {
        min-width: 4.55rem !important;
        border: none !important;
    }

    .idiomas .idiomas__mat:hover {
        background: rgb(255, 255, 255);
        background: rgba(255, 255, 255, 0.2);
        background-repeat: no-repeat;
        background-position: 90% 53%;
    }

    .mat-select-panel .idiomas__option.mat-option.mat-selected:not(.mat-option-multiple) {
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/peer/check.png') !important;
        background-repeat: no-repeat !important;
        background-position: 87% 50% !important;
    }

    .idiomas__option {
        padding: 0 11px !important;
    }

    .cdk-overlay-pane {
        transform: translateX(-1px) translateY(-1px) !important;
    }

    .idiomas .idiomas__mat:focus {
        border: 2px solid #FFFFFF;
    }

    .idiomas .idiomas__mat:focus .mat-select-value-text {
        color: #FFFFFF;
    }

    .t-white .idiomas .idiomas__mat:focus {
        border: 2px solid #1F2937;
    }

    .t-white .idiomas .idiomas__mat:focus .mat-select-value-text {
        color: #1F2937;
    }

    .idiomas .idiomas__mat {
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/peer/down-white.png') !important;
    }

    .t-white .idiomas .idiomas__mat {
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/peer/down-black.png') !important;
    }

    .idiomas .mat-form-field-flex {
        padding: 0 !important;
    }

    .idiomas .mat-form-field-infix {
        padding: 0 !important;
        border-top: none !important;
    }

    .idiomas .mat-select {
        margin-top: 0;
    }

    .idiomas .mat-select-value-text {
        color: #FFFFFF;
        font-weight: 600;
    }

    .t-white .idiomas .mat-select-value-text {
        color: #1F2937;
    }

    .combo__input--idioma {
        width: 80px;
        color: #FFFFFF;
    }

    .combo__menu--idiomas .combo__option[aria-selected="true"] {
        background-position: 85% 50%;
    }

    .combo__svg--idiomas path,
    .svg-share {
        fill: #FFFFFF;
    }

    .t-white .combo__input--idioma:hover {
        color: #6B7280;
    }

    .t-white .combo--idiomas .combo__svg path {
        fill: #1F2937;
    }

    .t-white .combo--idiomas:hover .combo__svg path {
        fill: #6B7280;
    }
    /*PLACEHOLDER*/

     ::-webkit-input-placeholder {
        color: #858585;
        font-family: 'Work Sans', sans-serif;
    }

     ::-moz-placeholder {
        color: #858585;
        font-family: 'Work Sans', sans-serif;
    }

     :-ms-input-placeholder {
        color: #858585;
        font-family: 'Work Sans', sans-serif;
    }

     ::-ms-input-placeholder {
        color: #858585;
        font-family: 'Work Sans', sans-serif;
    }

     ::placeholder {
        color: #858585;
        font-family: 'Work Sans', sans-serif;
    }
    /*LOGIN*/

    .button--login {
        border: 1px solid #D1D5DB;
        width: 100%;
        font-weight: 500;
        font-size: 0.875rem;
        color: #000000;
    }

    .button--login img {
        margin-right: 8px;
    }

    .button-siguiente {
        height: 2.25rem;
    }

    .span-divider {
        width: 70px;
        text-align: center;
    }

    .svg-regresar {
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
        margin-right: 10px;
        top: -1px;
        position: relative;
    }

    @media only screen and (max-width:600px) {
        .button--login {
            margin-top: 8px;
        }
    }

    @media only screen and (min-width:600px) {
        .input-containerMarketplace {
            width: 10rem;   
        }
    }
    
    /*ACORDION*/

    .accordion__faq {
        position: relative;
        text-align: left;
        width: 100%;
        margin-bottom: 8px;
        font-family: 'Work Sans', sans-serif;
    }

    .accordion__faq:last-child {
        margin-bottom: 0;
    }

    .accordion__button {
        background: none;
        height: auto;
        width: 100%;
        padding: 24px;
        text-align: left;
        border: none;
        cursor: pointer;
        font-size: 1.125rem;
        font-weight: 500;
        font-family: 'Work Sans', sans-serif;
    }

    .accordion__button svg {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 28px;
        flex: 0 0 28px;
    }

    .accordion__panel {
        margin: 0;
        height: 0;
        overflow: hidden;
    }

    .accordion__faq--active .accordion__panel {
        height: auto;
        -webkit-transition: height .9s;
        -moz-transition: height .9s;
        transition: height .9s;
        padding: 0 50px 24px 24px;
    }

    .accordion__cerrado {
        display: none;
    }

    .accordion__faq--active .accordion__abierto {
        display: none;
    }

    .accordion__faq--active .accordion__cerrado {
        display: block;
    }

    .accordion__button--miembros {
        padding: 20px 24px;
        text-transform: uppercase;
        font-weight: 600;
        font-size: 0.875rem;
        font-family: 'Work Sans', sans-serif !important;
    }

    .accordion__panel--miembros {
        margin-top: 4px;
    }

    .accordion__panel--miembros .card__block--campannas:last-child {
        border-bottom: none;
    }

    .accordion__faq--active .accordion__panel--miembros {
        padding: 24px;
    }

    .card__block--campannas .button,
    .card-pasos .button {
        height: 1.688rem;
        padding: 4px 8px;
        font-weight: 500;
        font-size: 0.875rem;
    }

    .card__block--campannas .button:last-child {
        margin-left: 15px;
    }

    .collapsible-body ol li {
        margin-left: 45px;
    }

    .collapsible-body ul li {
        list-style-type: disc;
    }

    .buttons-equipo {
        margin: 16px 0 16px 65px;
    }

    .buttons-equipo .button:first-child {
        margin-right: 16px;
    }

    .buttons-equipo .button:last-child {
        margin-left: 0;
    }

    .buttons-equipo .button:only-child {
        margin: 0;
    }
    /*FAQS*/

    .faqs__titulo {
        font-size: 2rem;
        margin-bottom: 60px;
    }

    .faqs__subtitulo {
        margin-bottom: 16px;
    }

    @media only screen and (min-width:600px) {
        .faqs__titulo {
            font-size: 2.25rem;
            text-align: center;
        }
    }
    /*SIDENAV*/

    .mat-drawer-backdrop.mat-drawer-shown {
        background-color: rgba(0, 0, 0, 0.6);
        position: fixed;
    }

    .t-white .modal-sidenav path {
        stroke: #1F2937;
    }

    .sidenav {
        position: fixed;
        background-color: #FFFFFF;
        width: 230px;
        height: 100vh;
        top: 0;
        z-index: 3;
        padding: 80px 24px 24px 24px;
    }

    .sidenav hr {
        height: 1px;
        background-color: #E0E0E0;
        border: none;
    }

    .sidenav .button {
        margin: 0 0 15px 0;
        text-align: center;
    }

    .detalles .button--inverse,
    .header .t-white:not(.sidenav) .button:not(.button--publicar):not(.button--buscar):not(.t-secundario),
    .sidenav__secundario {
        border: 2px solid #000000;
        color: #000000;
    }

    .sidenav__item {
        border-radius: 6px;
        padding: 4px 24px;
        color: #1F2937;
        margin: 12px 0;
        height: 2.5rem;
    }

    .sidenav__item--activo,
    .sidenav__item:hover {
        background-color: #F3F4F6;
    }

    .sidenav__item:hover {
        font-weight: 500;
    }

    .sidenav__item--activo {
        font-weight: 700;
    }

    .modal-sidenav {
        margin-left: 16px;
        padding: 0;
        background-color: transparent;
        border: none;
        cursor: pointer;
    }
    /*CARROUSEL*/

    .carousel__img {
        background-image: url("https://cdn.pixabay.com/photo/2013/02/05/21/05/running-78192_1280.jpg");
        height: 150px;
        width: 150px;
    }
    /*DASHBOARD*/

    .dashboard {
        background-color: #f9fafb;
        padding-bottom: 100px;
        min-height: calc(100vh - 146px);
    }

    .header__dashboard {
        padding: 4px;
        position: absolute;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .header__dashboard::before {
        background: rgb(17, 24, 39);
        opacity: 0.3;
        border-radius: 6px;
    }

    .header .t-white .header__dashboard::before {
        background: #F3F4F6;
        opacity: 1;
    }

    .header__button {
        min-height: 1.813rem;
        border-radius: 6px;
        padding: 0 25px;
        font-weight: 500;
        font-size: 0.875rem;
        text-align: center;
        height: 100%;
    }

    .header__button:not(.header__button--active) {
        color: #FFFFFF;
    }

    .header .t-white .header__button:not(.header__button--active) {
        color: #1F2937;
    }

    .header__button--active {
        background-color: #FFFFFF;
        font-weight: 600;
    }

    .header__user {
        height: 2.5rem;
        width: 2.5rem;
        border-radius: 5px;
        margin-right: 8px;
        background-color: #FFFFFF;
        background-image: url('https://stockcrowd.s3.amazonaws.com/test/resources/sc/2021/092101/old-man-1208210_1920_600px.jpg');
    }

    .perfil__lista {
        position: absolute;
        top: 45px;
        background-color: #FFFFFF;
        padding: 16px;
        right: 0;
        border: 0.5px solid #E5E5E5;
        -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
    }

    .perfil__user {
        display: block;
        text-align: left;
        margin: 0 0 2px 0;
    }

    .js-perfil {
        background-color: transparent;
        border: none;
        cursor: pointer;
        padding: 4px 8px;
        font-family: 'Work Sans', sans-serif !important;
    }

    .js-perfil:focus,
    .js-perfil:hover {
        background: rgba(17, 24, 39, 0.3);
        cursor: pointer;
        outline: none;
    }

    .t-white .js-perfil:focus,
    .t-white .js-perfil:hover {
        background: #E5E7EB;
    }

    .donantes-fecha {
        color: #667085;
    }

    .button--msj:hover .corazon-desmarcado path,
    .button--msj:focus .corazon-desmarcado path {
        stroke: #C03632;
    }

    .button--msj:focus {
        outline: none;
    }

    .t-white .notificaciones svg path {
        stroke: #1F2937;
    }

    .notificaciones:hover svg .path-relleno {
        fill: #FFFFFF;
    }

    .t-white .notificaciones:hover svg .path-relleno {
        fill: #1F2937;
    }

    .notificaciones sub {
        background-color: #EB5757;
        width: auto;
        height: 12px;
        text-align: center;
        color: #FFFFFF;
        font-weight: 700;
        border-radius: 10px;
        font-size: 0.5rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-left: -10px;
        padding: 0 4px;
    }

    @media only screen and (max-width:768px) {
        .card__mensaje {
            width: 100%;
            margin-top: 8px;
        }
        .card__mensaje span,
        .card__mensaje p {
            text-align: left;
        }
    }

    @media only screen and (max-width:400px) {
        .perfil__lista {
            position: fixed;
            top: 65px;
            width: 89%;
            right: 1%;
        }
    }

    @media only screen and (min-width:400px) {
        .perfil__lista {
            min-width: 350px;
        }
    }

    @media only screen and (max-width:930px) {
        .header__dashboard--desktop {
            display: none;
        }
        .header__dashboard::before {
            border-radius: 0;
        }
        .header__dashboard {
            width: 100%;
            top: 60px;
            left: 0;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
        }
    }

    @media only screen and (min-width:930px) {
        .header__dashboard--mobile {
            display: none;
        }
        .header__dashboard {
            top: 7px;
            left: 50%;
            transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
        }
    }

    .card__material {
        padding: 24px;
        height: 100%;
        border: 2px solid var(--primary-color);
    }

    .card__material--direccion {
        margin-bottom: 8px;
    }

    .tipo__camp {
        min-height: 6.813rem;
        padding: 60px 25px 16px 25px;
        height: 100%;
        -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        border: 2px solid var(--primary-color);
        color: var(--primary-color);
        border-radius: 8px;
        font-weight: 500;
        font-size: 1.125rem;
        cursor: pointer;
        background-color: transparent;
        width: 100%;
        display: inherit;
        font-family: 'Work Sans', sans-serif;
    }

    .actividad__small {
        display: block;
    }

    .svg-inactive:not(.svg-create) {
        display: none;
    }

    .tipo__camp .svg-active,
    .tipo__camp .svg-inactive {
        position: absolute;
        top: 16px;
        left: 50%;
        transform: translate(-50%);
        -webkit-transform: translate(-50%);
        display: block;
    }

    .tipo__camp:hover .svg-active,
    .tipo__camp .svg-inactive {
        opacity: 0;
    }

    .tipo__camp:hover .svg-inactive {
        opacity: 1;
    }

    .tipo__camp--disabled {
        background-color: #f0f2f5;
        pointer-events: none;
        cursor: no-drop;
        color: #595959;
        opacity: 0.5;
    }

    .tipo__camp--disabled .svg-active path {
        stroke: #595959;
    }

    .create-camp {
        margin-top: 10px;
    }

    @media only screen and (max-width:992px) {
        .u-same-height .margin--material {
            margin-top: 24px;
        }
    }

    @media only screen and (min-width:600px) {
        .tipo .l5 {
            margin-top: 0;
        }
    }

    @media only screen and (max-width:600px) {
        .tipo .col:first-child {
            margin-top: 0;
        }
    }
    /*PERSONAL DASHBOARD*/

    .personal {
        margin-bottom: 20px;
        min-height: 14.063rem;
    }

    .personal__titulo {
        font-size: 2.5rem;
    }

    .personal__container {
        margin: 140px auto 24px auto;
    }

    .button--eliminar {
        border: 1px solid #000000;
        color: #000000;
    }
    /*CAMPS*/

    .camps__estado {
        position: relative;
        padding-left: 12px;
        color: #1F2937;
    }

    .camps__estado::before {
        position: absolute;
        left: 0;
        top: 4px;
        display: block;
        z-index: 1;
        content: "";
        width: 5px;
        height: 5px;
        border-radius: 100%;
        background-color: rgba(7, 191, 99, 1);
    }

    .camps__estado--finalizada::before {
        background-color: #1D4ED8;
    }

    .camps__estado--rechazada::before {
        background-color: #DC2626;
    }

    .camps__estado--pendiente::before {
        background-color: #6B7280;
    }

    .camps__tipo {
        border-radius: 20px;
        position: absolute;
        bottom: 8px;
        left: 8px;
        padding: 5px 8px;
    }

    .camps__tipo__right {
        border-radius: 20px;
        position: absolute;
        bottom: 8px;
        right: 8px;
        padding: 5px 8px;
    }

    .camps__titulo {
        font-size: 1.375rem;
        line-height: 1.563rem;
    }

    @media only screen and (min-width:600px) {
        .personal__titulo {
            font-size: 3rem;
        }
    }

    .footer-dashboard {
        padding: 16px;
        background-color: #f9fafb;
    }

    @media only screen and (max-width:600px) {
        .footer-dashboard {
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
        }
    }




    @media only screen and (max-width:992px) {
        .landing-iframe {
            margin-top: 24px;
        }
    }
    /*MAT SELECT*/

    .mat-form-field {
        width: 100%;
    }

    .mat-select-panel {
        border: 1px solid #1F2937;
        border-radius: 6px !important;
        height: auto;
        max-height: 100% !important;
    }

    .mat-option-text {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex !important;
        -webkit-box-align: center;
        -moz-box-align: center;
        -ms-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: 0.875rem;
        color: #111827;
        font-weight: 500;
        font-family: 'Work Sans', sans-serif;
    }

    .mat__select--img {
        margin-right: 10px;
    }

    .mat-form-field-appearance-legacy .mat-form-field-wrapper,
    .mat-form-field-appearance-legacy .mat-form-field-infix {
        padding-bottom: 0 !important;
    }

    .mat-form-field-appearance-legacy .mat-form-field-underline {
        display: none;
    }

    .mat-form-field-label-wrapper {
        top: -27px;
    }

    .mat-form-field-appearance-legacy .mat-form-field-label {
        color: #1F2937 !important;
        font-size: 0.875rem;
        font-weight: 600;
        top: 5px !important;
        font-family: 'Work Sans', sans-serif;
    }

    .mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label {
        transform: inherit !important;
    }

    .mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) {
        background: #F3F4F6 !important;
    }

    .mat-select {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex !important;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/peer-img/drop-gris.png');
        background-repeat: no-repeat;
        background-position: 90% 53%;
    }

    .mat-select:focus {
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/peer-img/drop-negro.png');
    }

    .mat-select:focus .mat-select-value-text {
        color: #111827;
    }

    .mat-select-trigger {
        width: 100%;
    }

    .mat-select-value-text {
        font-weight: 500;
        color: #6B7280;
    }

    .mat-select-arrow-wrapper {
        display: none !important;
    }
    /*ALERT*/

    .alert {
        margin-top: 5px;
    }

    .input--error {
        border: 1px solid #FF4B6C;
        background-image: url('https://stockcrowd.s3.amazonaws.com/descargables/peer-img/error-form.png');
        background-repeat: no-repeat;
        background-position: 98% 54%;
    }

    .chechbox-comun:not(:checked)+.label--check.label--error::after,
    .chechbox-comun:not(:checked)+input+.label--check.label--error::after {
        border: 1px solid #FF4B6C;
        background-color: #FFFFFF;
    }

    .input--error:focus {
        -webkit-box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0px 0px 0px 4px #FEE4E2;
        box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0px 0px 0px 4px #FEE4E2;
        border: 2px solid #FF4B6C;
    }

    .msg-error {
        color: #E10F00;
        font-size: 0.875rem;
    }
    /*RADIOS*/

    input[type="radio"]:not(.switch-input):not(.radio-tipo) {
        opacity: 0;
        pointer-events: none;
        display: block;
    }

    input[type="radio"]:not(.switch-input):not(.radio-tipo)+label {
        border-radius: 100%;
        cursor: pointer;
        font-weight: 600;
    }

    input[type="radio"]:not(.switch-input):not(.radio-tipo):checked:disabled+label:after {
        border-color: #ccc;
    }

    input[type="radio"]:not(.switch-input):not(.radio-tipo)+label::before {
        content: "";
        width: 1rem;
        height: 1rem;
        float: left;
        margin-right: 12px;
        border: 1px solid #D1D5DB;
        background: #fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: .28s ease;
        transition: .28s ease;
    }

    input[type="radio"]:not(.switch-input):not(.radio-tipo)+label:before {
        border-radius: 100%;
    }

    input[type="radio"]:not(.switch-input):not(.radio-tipo):checked+label:before {
        border: 5px solid var(--primary-color);
        -webkit-transition: .28s ease;
        transition: .28s ease;
    }
    /*LEADERBOARD*/

    @media only screen and (max-width:992px) {
        .leaderboard {
            margin-top: 40px;
        }
    }

    .leaderboard .tab__button {
        text-transform: uppercase;
        width: 50%;
        margin-right: 0;
    }

    .leaderboard .tabs__container .button {
        width: 48%;
    }

    .leaderboard .tabs__container {
        padding: 24px 0 0 0;
    }

    .leaderboard .lugar {
        width: 50px;
    }

    .buttons-tab .button:not(.t-principal) {
        border: 1px solid #344054;
        color: #344054;
    }
    /*SWAL*/

    .swal2-modal {
        opacity: 1 !important;
    }

    .swal2-backdrop-show {
        background-color: rgba(0, 0, 0, 0.5) !important;
    }

    .swal2-container.swal2-center>.swal2-popup {
        border-radius: 6px !important;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1) !important;
        border: 1px solid #E5E7EB !important;
        display: flex !important;
        flex-wrap: wrap !important;
        padding-top: 40px !important;
        justify-content: center !important;
    }

    .swal2-title {
        font-size: 1.125rem !important;
        color: #1F2937 !important;
        padding: 16px 0 !important;
    }

    .swal2-html-container {
        text-align: left !important;
        font-size: 1rem !important;
        font-weight: 400 !important;
        line-height: 18px !important;
        color: #1F2937 !important;
    }

    .swal2-html-container ul li {
        list-style-type: disc;
        margin: 4px 0;
    }

    .button-swal {
        height: 2.688rem !important;
        font-size: 1rem !important;
        border: none !important;
        color: #FFFFFF !important;
        cursor: pointer !important;
        font-weight: 600 !important;
        border-radius: 6px !important;
        padding: 0 24px !important;
        background-color: #FFFFFF !important;
        font-family: 'Work Sans', sans-serif !important;
    }

    .button-swalconfirm {
        background-color: rgb(7, 191, 99) !important;
    }

    .button-swalalerta,
    .button-swalano,
    .button-swalclose {
        border: 1px solid #3D454D !important;
        color: rgb(61, 69, 77) !important;
        box-shadow: 0px 1px 2px rgba(61, 69, 77, 0.15) !important;
    }

    .button-swalinfo {
        background-color: #3D454D !important;
        box-shadow: none;
    }

    .button-swalinfo:focus {
        box-shadow: none !important;
    }

    .button-swalalerta:focus,
    .button-swalalerta:hover,
    .button-swalano:focus,
    .button-swalano:hover,
    .button-swalclose:hover,
    .button-swalclose:focus {
        border: 2px solid #3D454D !important;
        background-color: #FFFFFF !important;
        background-image: none !important;
        box-shadow: 0px 1px 2px rgba(61, 69, 77, 0.15) !important;
    }

    .button-swalano,
    .button-swalsi {
        width: 44%;
    }

    .swal2-actions {
        width: 100% !important;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        -ms-flex-wrap: wrap-reverse !important;
        flex-wrap: wrap-reverse !important;
    }

    .button-swalsi {
        border: 1px solid #DC2626 !important;
        background-color: #DC2626 !important;
        background-image: none !important;
        box-shadow: 0px 1px 2px rgba(61, 69, 77, 0.15) !important;
    }

    .button-swalsi:focus,
    .button-swalsi:hover {
        border: 1px solid #DC2626 !important;
        background-color: #DC2626 !important;
        background-image: none !important;
        box-shadow: 0px 1px 2px rgba(61, 69, 77, 0.15) !important;
    }

    .button-swalconfirm:focus {
        box-shadow: 0 0 0 3px rgba(7, 191, 99, .5) !important;
    }

    .swal2-image {
        margin: 0 16px 0 0 !important;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 44px;
        flex: 0 0 44px;
    }

    #swal2-html-container {
        width: 100%;
    }
    /*TOOLTIP*/

    .mat-tooltip {
        font-size: 0.75rem !important;
        background-color: #1F2937 !important;
        font-family: 'Work Sans', sans-serif !important;
        position: relative !important;
        overflow: visible !important;
        margin-bottom: -10px !important;
        border-radius: 8px;
        -webkit-box-shadow: 0 12px 16px -4px rgba(16, 24, 40, 0.1), 0 4px 6px -2px rgba(16, 24, 40, 0.05);
        box-shadow: 0 12px 16px -4px rgba(16, 24, 40, 0.1), 0 4px 6px -2px rgba(16, 24, 40, 0.05);
        margin-left: 31px !important;
        text-align: center;
    }

    .mat-tooltip-panel-below {
        top: 60px !important;
    }
    /*EDITOR DE ANGULAR*/

    .angular-editor {
        background: #F3F4F6;
        border-radius: 6px;
        padding: 10px;
        margin-top: 16px;
    }

    .angular-editor-toolbar {
        background: #FFFFFF !important;
        border: 1px solid #D1D5DB !important;
        border-radius: 6px;
        padding-top: 7px !important;
        -webkit-box-shadow: 0 2.01027px 6.0308px rgba(0, 0, 0, 0.0417275), 0 1.12694px 3.38082px rgba(0, 0, 0, 0.035), 0 0.598509px 1.79553px rgba(0, 0, 0, 0.0282725), 0 0.249053px 0.747159px rgba(0, 0, 0, 0.0196802);
        box-shadow: 0 2.01027px 6.0308px rgba(0, 0, 0, 0.0417275), 0 1.12694px 3.38082px rgba(0, 0, 0, 0.035), 0 0.598509px 1.79553px rgba(0, 0, 0, 0.0282725), 0 0.249053px 0.747159px rgba(0, 0, 0, 0.0196802);
    }

    .angular-editor-textarea {
        border: none !important;
        padding: 10px 3px !important;
    }

    .angular-editor-button {
        border: none !important;
        background: #FFFFFF !important;
    }

    .container-video {
        position: relative;
        width: 100%;
        overflow: hidden;
        height: 100%;
        padding-top: 56.25%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 6px;
    }

    .container-video--blog {
        background-size: auto;
    }

    .container-video--capa::before {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        z-index: 1;
        content: "";
        background-color: rgba(0, 0, 0, 0.4);
        width: 100%;
        height: 100%;
        border-radius: 6px
    }

    .container-video--blog::before {
        display: none;
    }

    .responsive-iframe {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100%;
        border: none;
    }

    .no-iframe {
        height: 0;
    }

    .play-container {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        cursor: pointer;
        background-color: transparent;
        border: none;
        z-index: 1;
    }

    .igx-carousel {
        height: 500px !important;
    }

    .igx-carousel__inner {
        border-radius: 10px !important;
        -webkit-filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.05)) drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1)) !important;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.05)) drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1)) !important;
    }

    .igx-carousel__inner::before {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        z-index: 3;
        content: "";
        background-color: #000;
        opacity: .1;
        width: 100%;
        height: 100%;
        border-radius: 10px;
    }

    .igx-slide {
        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
    }

    .igx-icon,
    .igx-nav-arrow {
        display: none !important;
    }

    .igx-carousel__arrow--prev,
    .igx-carousel__arrow--next {
        z-index: 4;
        opacity: 0.8;
        width: 2.25rem;
        height: 2.25rem;
        cursor: pointer;
        position: absolute;
        background-size: cover;
        background-position: center;
    }

    .igx-carousel__arrow--prev:hover,
    .igx-carousel__arrow--next:hover {
        opacity: 1;
    }

    .igx-carousel__arrow--prev {
        left: 5px;
        background-image: url(https://stockcrowd.s3.amazonaws.com/descargables/peer/circle-left.png);
    }

    .igx-carousel__arrow--next {
        right: 5px;
        background-image: url(https://stockcrowd.s3.amazonaws.com/descargables/peer/circle-right.png);
    }

    .igx-carousel-indicators,
    .igx-carousel-indicators--top,
    .igx-carousel-indicators--bottom {
        position: absolute !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding: 0 !important;
        list-style: none !important;
        z-index: 10 !important;
        inset-inline-start: 50% !important;
        transform: translate(-50%) !important;
        bottom: -35px !important;
        margin: 0 !important;
    }

    .igx-nav-dot {
        position: relative !important;
        width: 0.625rem !important;
        height: 0.625rem !important;
        text-indent: -9999px !important;
        border: 1px solid var(--primary-color) !important;
        border-radius: 100% !important;
        margin: 0 3px !important;
        transition: all .15s cubic-bezier(.25, .46, .45, .94) !important;
        box-shadow: none !important;
    }

    .igx-nav-dot--active {
        background-color: var(--primary-color) !important;
    }

    .igx-nav-dot--active::after {
        background: none !important;
    }
    /*SWITCH*/

    .switch {
        position: relative;
        height: 2.313rem;
        width: 315px;
        border-radius: 8px;
        margin: 0 auto;
    }

    .switch-label {
        position: relative;
        z-index: 2;
        float: left;
        width: 50%;
        text-align: center;
        cursor: pointer;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: #FFF;
        font-weight: 500;
    }

    .switch-label:active {
        font-weight: bold;
    }

    .switch-label-off {
        padding-left: 2px;
    }

    .switch-label-on {
        padding-right: 2px;
    }

    .switch-input {
        display: none !important;
    }

    .switch-input:checked+.switch-label {
        color: var(--primary-color);
    }

    .switch-input:checked+.switch-label-on~.switch-selection {
        left: 49%;
    }

    .switch-selection {
        display: block;
        position: absolute;
        z-index: 1;
        top: 3px;
        left: 4px;
        width: 50%;
        height: calc(100% - 6px);
        background-color: #FFFFFF;
        border-radius: 8px;
        -webkit-transition: left 0.3s ease-out;
        -moz-transition: left 0.3s ease-out;
        -o-transition: left 0.3s ease-out;
        transition: left 0.3s ease-out;
    }

    @media only screen and (max-width: 600px) {
        .switch {
            width: 265px;
        }
    }
    /*UNIRSE*/

    .unirse {
        background-color: #FFFFFF;
        border-radius: 6px;
    }

    .modal--camp .unirse {
        background-color: transparent;
    }

    .unirse:not(.unirse--vincular) {
        height: 100%;
        cursor: pointer;
    }

    .unirse__img {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 150px;
        flex: 0 0 150px;
        border-radius: 6px 0 0 6px;
        min-height: 150px;
        padding: 5px;
        z-index: 1;
    }

    .unirse__img .t-white {
        z-index: 1;
        border-radius: 5px;
        padding: 2px 5px;
    }

    .unirse__img::before {
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 1)), color-stop(27%, rgba(0, 0, 0, 0)));
        background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 27%);
        background: linear-gradient(360deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 27%);
        border-radius: 8px 0 0 8px;
    }

    .unirse__svg {
        height: 1.25rem;
        width: auto;
    }

    .unirse small {
        font-style: italic;
    }

    .unirse__info {
        padding: 16px;
        -ms-flex-line-pack: justify;
        align-content: space-between;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 150px);
        flex: 0 0 calc(100% - 150px);
    }

    .unirse-btm {
        margin-top: 16px;
        width: 100%;
    }

    .unirse__img--camp {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100px;
        flex: 0 0 100px;
        min-height: 100px;
        border-radius: 8px;
    }

    .unirse__info--camp {
        padding: 0 16px 16px 16px;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 100px);
        flex: 0 0 calc(100% - 100px);
    }

    .fundrising--nuevo {
        border-radius: 8px;
        position: relative;
        cursor: pointer;
        height: 100%;
        min-height: 150px;
        border: 2px dashed #888888;
    }

    .fundrising--nuevo:hover {
        background-color: var(--primary-color);
        border: 2px dashed var(--primary-color);
    }

    .create-new {
        width: 100%;
        color: #888888;
        text-align: center;
    }

    .svg-plus {
        width: 25px;
        fill: #888888;
        display: block;
        margin: 10px auto 0 auto;
    }

    .svg-tipo {
        width: 57px;
        height: 57px;
    }

    .fundrising--nuevo:hover .create-new {
        color: #FFFFFF;
    }

    .fundrising--nuevo:hover .svg-plus {
        fill: #FFFFFF;
    }

    .equipo-img {
        border-radius: 8px;
        height: 350px;
    }

    .svg-donacion {
        height: 1.125rem;
        width: auto;
        margin-right: 10px;
    }

    .card-fundraiser {
        height: 100%;
        border-radius: 8px;
        border: 1px solid #E5E5E5;
        padding: 60px 24px 24px 24px;
        -ms-flex-line-pack: justify;
        align-content: space-between;
        text-align: center;
    }

    .tipo__camp--fundraiser {
        min-height: auto;
        padding: 24px 10px;
        height: auto;
        width: 100%;
        margin-top: 65px;
    }

    .ul-fundraiser {
        text-align: left;
        list-style-type: disc;
    }

    .svg-fundraiser {
        height: 150px;
        width: 150px;
        margin-bottom: 25px;
    }

    .svg-fundraiser--one {
        width: 120px;
    }

    .svg-fundraiser--page {
        width: 110px;
    }

    .titulo-fundraiser {
        max-width: 80%;
        margin: 0 auto;
    }

    .button--share:hover .svg-share {
        fill: var(--primary-color);
    }

    .button--share {
        margin: 20px auto;
    }

    @media only screen and (max-width:600px) {
        .unirse__img,
        .unirse__info {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 100%;
            flex: 0 0 100%;
        }
    }
    /*FORMATO NUEVO EN EDICION*/

    .seleccion-container {
        width: 100%;
        border-radius: 8px;
        background-color: #FFFFFF;
        border: 1px solid #D1D5DB;
        margin: 24px auto 15px auto;
    }

    .seleccion-button {
        border: none;
        background-color: transparent;
        webkit-box-flex: 3;
        -moz-box-flex: 3;
        -ms-box-flex: 3;
        -ms-flex: 3;
        flex: 3;
        font-weight: 500;
        font-size: 1.03rem;
        color: #AAAAAA;
        cursor: pointer;
        position: relative;
    }

    .seleccion-first {
        border-left: none;
    }

    .seleccion-active+.seleccion-button {
        border: none;
    }

    .seleccion-svg {
        left: 50%;
        top: 40px;
        position: absolute;
        pointer-events: none;
        transform: translate(-50%);
        -webkit-transform: translate(-50%);
    }
    /*RADIO SELECCION*/

    .radio-tipo {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .radio-tipo+label {
        height: 100%;
        width: 100%;
        display: block;
        text-align: center;
        color: #AAAAAA;
        cursor: pointer;
        padding: 90px 5px 40px 4px;
        position: relative;
        overflow: hidden;
        border-left: 1px solid #D1D5DB;
    }

    .radio-tipo+.label-individual,
    .radio-tipo+label.no-border {
        border-left: none;
    }

    .radio-tipo:checked+label {
        color: var(--primary-color);
        border: 2px solid var(--primary-color);
        border-radius: 8px;
    }

    .radio-tipo:checked+label::before {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        z-index: 1;
        content: "";
        width: 100%;
        height: 100%;
        opacity: 0.1;
        background-color: var(--primary-color);
    }

    .seleccion-svg path {
        fill: #AAAAAA;
    }

    .radio-tipo:checked+label+.seleccion-tooltip path,
    .radio-tipo:checked+label+.seleccion-tooltip+.seleccion-svg path {
        fill: var(--primary-color);
    }
    /*TOOLTIP PERSONALIZADO*/

    .seleccion-tooltip {
        position: absolute;
        top: 8px;
        right: 8px;
        z-index: 2;
    }

    .seleccion-tooltip path {
        fill: #AAAAAA;
    }

    .tooltip-personalizado {
        position: relative;
        display: inline-block;
    }

    .tooltip-personalizado .tooltiptext {
        visibility: hidden;
        width: 250px;
        background-color: #000000de;
        color: #fff;
        text-align: left;
        border-radius: 4px;
        padding: 20px;
        /* Position the tooltip */
        position: absolute;
        z-index: 1;
        top: 100%;
        left: 50%;
        pointer-events: none;
        font-size: 0.75rem;
        transform: translate(-50%);
        -webkit-transform: translate(-50%);
    }

    .tooltip-personalizado:hover .tooltiptext {
        visibility: visible;
        pointer-events: all;
    }

    .unirse__close {
        position: absolute;
        top: 8px;
        right: 8px;
        z-index: 2;
        cursor: pointer;
        padding: 0;
        border: none;
        background-color: transparent;
    }

    .unirse__close path {
        fill: var(--primary-color);
    }

    .text-justify {
        text-align: justify;
    }

    .gift {
        font-size: 1.4rem;
        display: block;
        font-weight: 400;
    }

    .gift--small {
        font-size: 0.875rem;
    }

    .mat-dialog-container {
        overflow: hidden !important;
        border-radius: 8px !important;
    }

    .flat-button .svg-active path {
        fill: #FFFFFF;
    }

    .flat-button:hover .svg-active path {
        fill: var(--primary-color);
    }
    /*MENU ANGULAR*/

    .mat-focus-indicator {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
    }

    .mat-menu-panel {
        max-width: 100% !important;
    }

    .menu__svg {
        margin-right: 10px;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 24px;
        flex: 0 0 24px;
        width: 20px;
        height: 20px;
    }

    .menu__text {
        font-size: 0.875rem;
        font-family: 'Work Sans', sans-serif;
    }

    .mat-menu-content:not(:empty) {
        padding: 0 !important;
    }

    .mat-progress-spinner circle,
    .mat-spinner circle {
        stroke: var(--primary-color) !important;
    }

    .disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .mat-dialog-content {
        padding: 24px !important;
    }

    @media only screen and (min-width:992px) and (max-width:1400px) {
        .col--input,
        .col--switch {
            width: 50%;
            margin-left: 25%;
        }
    }

.svg-check {
    fill: #117815;
}


/*TABLE*/

.table {
    border-collapse: collapse;
    border-spacing: 0;
    border-radius: 6px;
}

.table__tr {
    border-bottom: 2px solid #f9fafb;
}

.table__tr--head {
    border-bottom: 4px solid #f9fafb;
    border-radius: 6px;
}

.table__td,
.table__th {
    text-align: left;
    padding: 20px 30px;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
}

/*MODO EDICION*/

.edicion {
    opacity: 0.5;
    pointer-events: none;
}

.edicion-fondo {
    background: rgba(255, 255, 255, 0.85);
    padding: 32px 16px;
    border: 2px solid #FFFFFF;
}

.input--ediccion {
    -webkit-box-shadow: 0 1px 2px rgba(16, 24, 40, 0.15);
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.15);
    background: #FFFFFF !important;
    border: 1px solid #D1D5DB !important;
    padding: 10px !important;
    border-radius: 6px;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    color: #1F2937 !important;
    margin-top: 12px !important;
    font-family: 'Work Sans', sans-serif !important;
}

.input--encabezado {
    height: 2.438rem !important;
}

.edicion-encabezado .mat-form-field-infix,
.edicion-encabezado .mat-form-field-flex,
.mat-form-field-subscript-wrapper,
.historia__detalles .mat-form-field-flex {
    padding: 0 !important;
}

.edicion-encabezado .mat-input-element {
    caret-color: #1F2937;
}

.input--author {
    background-color: rgba(243, 244, 246, 1) !important;
    box-shadow: none !important;
    border: none !important;
}

.edicion-encabezado .mat-form-field.mat-focused .mat-form-field-label,
.edicion-encabezado .mat-form-field-label {
    color: #1F2937 !important;
    font-size: 1rem;
    font-weight: 500;
    font-family: 'Work Sans', sans-serif !important;
}

.edicion-encabezado .textarea--encabezado {
    height: 7rem;
}

.mat-form-field-appearance-fill .mat-form-field-flex {
    background-color: transparent !important;
    border-radius: 6px !important;
}

.mat-form-field-underline {
    display: none;
}

.edicion-encabezado .mat-form-field-appearance-fill.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,
.edicion-encabezado .mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label {
    -webkit-transform: translateY(0) scale(1);
    -ms-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1);
}

.mat-hint {
    color: #111827;
    font-weight: 500;
    font-size: 0.875rem;
    font-family: 'Work Sans', sans-serif !important;
}

.edicion-encabezado .mat-hint {
    color: #1F2937;
}

.edicion-encabezado .mat-form-field-label-wrapper {
    top: -1.5rem !important;
}

.edicion__input {
    padding: 10px;
}

.input--historia {
    border: none;
    display: block;
    width: 95%;
}

.historia__detalles .mat-form-field-infix {
    background-color: rgba(243, 244, 246, 1);
    border-radius: 6px;
    padding: 0 10px !important;
}

.historia__detalles .textarea--history {
    margin-bottom: 10px;
    min-height: 10rem;
    font-family: 'Work Sans', sans-serif !important;
}

/*REDIMENSIONAR IMAGEN*/

.redimensionar-imagen {
    position: fixed;
    top: 50%;
    z-index: 9;
    margin: 0 auto;
    background-color: #F9F9F9;
    padding: 16px;
    border-radius: 6px;
    left: 50%;
    height: 80%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    min-width: 50%;
}

image-cropper {
    min-height: 80%;
}

.image-cropper {
    background-color: #F9F9F9;
    padding: 0 !important;
    height: calc(100% - 80px);
    width: auto !important;
}

[_nghost-serverApp-c63]>div[_ngcontent-serverApp-c63] img.ngx-ic-source-image[_ngcontent-serverApp-c63] {
    max-height: 100% !important;
}

[_nghost-serverApp-c63] .ngx-ic-overlay[_ngcontent-serverApp-c63] {
    outline: var(--cropper-overlay-color, #F9F9F9) solid 100vw !important;
}

#file-profile {
    height: 0;
}

[contenteditable="true"] {
    border: 1px solid rgb(220, 220, 220);
}

.waiting-loader-line:first-of-type {
    position: fixed;
    background-color: rgba(255, 255, 255, 0.4);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background-repeat: no-repeat;
    background-position: center;
}

.loader-line:first-of-type {
    width: 100%;
    height: 3px;
    position: fixed;
    overflow: hidden;
    background-color: #ddd;
    top: 0;
    left: 0;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    z-index: 1000;
}

.loader-line:first-of-type:before {
    content: "";
    position: absolute;
    left: -50%;
    height: 3px;
    width: 40%;
    background-color: var(--primary-color);
    -webkit-animation: lineAnim 2.5s linear infinite;
    -moz-animation: lineAnim 2.5s linear infinite;
    animation: lineAnim 2.5s linear infinite;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
}

@keyframes lineAnim {
    0% {
        left: -40%;
    }
    50% {
        left: 20%;
        width: 80%;
    }
    100% {
        left: 100%;
        width: 100%;
    }
}

.mat-dialog-actions {
    flex-wrap: nowrap !important;
}

@media only screen and (max-width:600px) {
    .button-swalclose,
    .button-swalinfo,
    .button-swalconfirm,
    .button-swalalerta,
    .button-swalsi,
    .button-swalano {
        width: 44%;
    }
}

.cursor-pointer {
    cursor: pointer;
}

.t-emphasized {
    color: #a3a3a3;
}

.strava-color {
    color: var(--strava-color);
}

.btn-strava-color {
    background-color: var(--strava-color);
    color: #FFFFFF;
}

.gap-1 {
    gap: 1rem;
}

.margin-bottom {
    margin-bottom: 1rem;
}

.mat-actividad-panel {
    max-height: 50vh !important;
}

.mat-select-disabled,
.mat-select-disabled.mat-select:focus .mat-select-value-text {
    cursor: default;
    background-color: rgba(239, 239, 239, 0.3);
    color: rgb(84, 84, 84) !important;
    border-color: rgba(118, 118, 118, 0.3) !important;
}

app-loader {
    width: 100%;
}

.d-loader {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.loader {
    width:50px;
    height:24px;
    background:
        radial-gradient(circle closest-side,var(--primary-color) 90%,#0000) 0%   50%,
        radial-gradient(circle closest-side,var(--primary-color) 90%,#0000) 50%  50%,
        radial-gradient(circle closest-side,var(--primary-color) 90%,#0000) 100% 50%;
    background-size:calc(100%/3) 12px;
    background-repeat: no-repeat;
    animation:d3 1s infinite linear;
}

.loader.white-color {
    width:50px;
    height:24px;
    background:
    radial-gradient(circle closest-side, #FFFFFF 90%,#0000) 0%   50%,
    radial-gradient(circle closest-side, #FFFFFF 90%,#0000) 50%  50%,
    radial-gradient(circle closest-side, #FFFFFF 90%,#0000) 100% 50%;
    background-size:calc(100%/3) 12px;
    background-repeat: no-repeat;
    animation:d3 1s infinite linear;
}
@keyframes d3 {
    20%{background-position:0%   0%, 50%  50%,100%  50%}
    40%{background-position:0% 100%, 50%   0%,100%  50%}
    60%{background-position:0%  50%, 50% 100%,100%   0%}
    80%{background-position:0%  50%, 50%  50%,100% 100%}
}

.label-disabled {
    color: #858585;
}

.margin-mat-label {
    margin-top: 13px;
    display: block;
}

.start-icon {
    background-position: 0 -144px;
    background-image: url('/assets/img/sprites-map.png');
    background-repeat: no-repeat;
}

.end-icon {
    background-position: -24px -144px;
    background-image: url('/assets/img/sprites-map.png');
    background-repeat: no-repeat;
}

.center-align-swal {
    text-align: center !important;
}

.margin-between-children * {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.t-color-red {
    color: #E10F00;
}

.fill-red {
    fill: #E10F00;
}

.no-margin {
    margin: unset !important;
}

.u-align-content-end {
    align-content: flex-end
}

.u-align-content-between {
    align-content: space-between;
}

.u-justify-end {
    justify-content: flex-end;
}

.u-flex-align-start {
    align-items: start;
}

.u-direction-col {
    flex-direction: column;
}

.extra-info * sub {
    vertical-align: sub;
}

.extra-info * sup {
    vertical-align: super;
}

.extra-info blockquote {
    border-left: 3px solid gray;
    padding: 15px;
    margin: 22px;
}

.extra-info table {
    border: 0.8px rgb(128, 128, 128) solid;
    border-collapse: separate;
}

.extra-info table * tr {
    border: 0.8px rgb(128, 128, 128) solid;
    border-collapse: collapse;
}

.extra-info table * td {
    border: 0.8px rgb(128, 128, 128) solid;
    border-collapse: collapse;
}

.extra-info ol {
    padding-inline-start: 40px;
}

.extra-info ul {
    list-style-type: disc;
}

.historia__detalles_form_field .mat-form-field-infix{
  border: 0px !important;
}

.historia__detalles_form_field input{
  margin: 0px !important;
}

body.loading::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9999;
}