.donate{
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        background-color: #f5f6f1;
    }
    .lista{
        justify-content: center;
    }
    .lista ol{
        list-style: none;
        counter-reset: my-counter;
        margin: 0rem;
        padding:  0rem 0rem 0rem 1.5rem;
    }
    .lista li{
        counter-increment: my-counter;
        border-left: solid 2px #cdcdcd;
      /*  border-bottom: solid 2px #cdcdcd; */
        padding-top: 2rem;
        padding-bottom: 1rem;
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto;
        grid-template-areas: "icon:text";
        align-items: start;
    }
    .lista li:before {
        content: counter(my-counter);
        font-weight: bold;
        background-color: #cdcdcd;
        border: 3px solid #f5f6f1;
        border-radius: 50px;
        font-size: 20px;
        padding: 0.8rem 1.4rem;
        color: #fff;
        margin-left: -2.0rem;
        margin-right: auto;
        grid-area: icon;
    }
    .card{
        grid-area: text;
        margin-left: 4rem;
        border-radius: 0px;
        box-shadow: 0 0 5px 1px #ddd;
        margin-top: 0.5rem;
    }
    .card-html .card-header:after {
        right: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-right-color: #e65127;
        border-width: 10px;
        top: 10px;
    }
    .card-css .card-header:after {
        right: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-right-color: #379ad6;
        border-width: 10px;
        top: 10px;
    }
    .card-js .card-header:after {
        right: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-right-color: #f2bf26;
        border-width: 10px;
        top: 10px;
    }
    .card-php .card-header:after {
        right: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-right-color: #8b92bd;
        border-width: 10px;
        top: 10px;
    }
    .card-bootstrap .card-header:after {
        right: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-right-color: #7952b3;
        border-width: 10px;
        top: 10px;
    }
    .card .card-header{
        background-color: #8abe3e;
        color: #fff;
        font-size: 22px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
    }
    .btn-success{
        background-color: #8abe3e;
        color: #fff;
        border-color: #8abe3e;
        border-radius: 0px;
    }
    .card-css .card-header, .card-css .btn-success{
        background-color: #379ad6;
        border-color: #379ad6;
    }
    .card-html .card-header, .card-html .btn-success{
        background-color: #e65127;
        border-color: #e65127;
    }
    .card-js .card-header, .card-js .btn-success{
        background-color: #f2bf26;
        border-color: #f2bf26;
    }
    .card-bootstrap .card-header, .card-bootstrap .btn-success{
        background-color: #7952b3;
        border-color: #7952b3;
    }
    .card-php .card-header, .card-php .btn-success{
        background-color: #8b92bd;
        border-color: #8b92bd;
    }