/* projects cards */

    .add-btn-wrap .proj_img_hover {
        opacity: 1;
        background-color: transparent;
    }

    .single-card.add-btn-wrap::after {
        content: none;
    }

    .add-btn-wrap .aspectratio_img {
        background-color: transparent;
        border: 1px solid #AFB1B2;
    }

    .card-button {
        padding: 10px 16px;
        color: #AFB1B2 !important;
        background-color: #fff;

        border: 1px solid #AFB1B2;
        border-radius: 20px;

        display: inline-flex;
        align-items: center;
        gap: 8px;
    }

    .card-button p {
        margin: 0;
        text-transform: uppercase;
    }

    .proj_img_hover .card-button .add-icon,
    .proj_img_hover .card-button .edit-icon {
        width: 21px;
    }

    .add-icon {
        display: inline-block;
        width: 21px;
        height: 21px;
        --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.4995 4.33691V20.3369' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4.49951 12.3369H20.4995' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-color: currentColor;
        -webkit-mask-image: var(--svg);
        mask-image: var(--svg);
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: 100% 100%;
        mask-size: 100% 100%;
    }

    .edit-icon {
        display: inline-block;
        width: 21px;
        height: 21px;
        --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.8101 10.0001C17.0007 10.1945 17.0007 10.5057 16.8101 10.7001L8.75012 18.7901C8.55677 18.9852 8.32529 19.1384 8.07012 19.2401L3.73012 21.0001C3.54434 21.0749 3.33185 21.0316 3.19012 20.8901C2.98319 20.7581 2.90269 20.4954 3.00012 20.2701L4.72012 15.9301C4.82184 15.675 4.97502 15.4435 5.17012 15.2501L13.2401 7.18012C13.334 7.08546 13.4618 7.03222 13.5951 7.03222C13.7284 7.03222 13.8562 7.08546 13.9501 7.18012L16.8101 10.0001ZM20.5601 4.10012L19.9001 3.44012C19.6191 3.15873 19.2378 3.00047 18.8401 3.00012H18.0801C17.6755 2.99511 17.286 3.15378 17.0001 3.44012L15.1901 5.27012C14.9996 5.46454 14.9996 5.77569 15.1901 5.97011L18.0001 8.82012C18.094 8.91477 18.2218 8.96801 18.3551 8.96801C18.4884 8.96801 18.6162 8.91477 18.7101 8.82012L20.5601 7.00011C20.8465 6.7142 21.0051 6.32473 21.0001 5.92011V5.16012C20.9998 4.76242 20.8415 4.38115 20.5601 4.10012Z' fill='%23000'/%3E%3C/svg%3E");
        background-color: #AFB1B2;
        -webkit-mask-image: var(--svg);
        mask-image: var(--svg);
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: 100% 100%;
        mask-size: 100% 100%;
    }


/* category tabs */
    .tab-buttons {
        display: flex;
        cursor: pointer;
        margin-bottom: 2rem;

        flex-wrap: wrap;
        row-gap: 1rem;
    }

    .tab {
        padding: 10px 20px;
        border-bottom: none;
        margin-right: 1rem;
        text-transform: uppercase;

        color: #8C9091;
        border: 1px solid #8C9091;
        border-radius: 90px;
    }

    .tab.active {
        color: white;
        background-color: #DF1B12;
        border-color: #DF1B12;
    }

    .tab-content {
        display: none;
    }

    .tab-content.active {
        display: block;
    }



    /* page style */

    .main_title > h1 {
        color: var(--eurac-red);
    }

    .content-intro h3 {
        color: var(--text-grey);
        font-weight: normal;
    }

    h2 {
        color: #8C9091;
    }

    .no-logged-content {
        display: flex;
        flex-direction: column;
        gap: 5rem;
        margin-bottom: 5rem;
    }

    .content-intro {
        color: var(--text-grey);
        line-height: 28px;
        margin-bottom: 3rem;
    }

    .link {
        color: var(--eurac-red) !important;
        text-decoration: underline;
    }

    .bar_header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 2rem
    }

    .aspectratio_img {
        background-color: #AAA;
    }

    .projects-container {
        margin-top: 3rem !important;
        padding-bottom: 100px;
    }