body {
    --vt-c-indigo: #2C3E50;

    font-size: 18px;
    background-color: #F7F7F7;
}

.newsTopNav {
    background: url("../images/inv.BusinessActivities.head.jpg") no-repeat center;
}

.display-flex-column {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

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

.cards {
    width: 100%;
    margin-top: 2em;
    margin-bottom: 2em;

    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
    grid-gap: 46px;
    align-items: start;
}

.card {
    box-sizing: border-box;

    --line-color: #ECECEC;
    --margin-em: 1.8em;

    display: flex;
    align-items: center;
    background-color: white;
    height: 260px;
    border: 1px solid var(--line-color);
}

.card-title {
    display: flex;
    flex-direction: column;
    justify-content: center;

    margin: 0 var(--margin-em) 0 var(--margin-em);
    height: 50%;
}

.card-title > span {
    color: #026fe6;
    font-weight: bolder;
    font-size: 1.1em;

    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.card-division-line {
    width: calc(100% - (2 * var(--margin-em)));
    height: 1px;
    background-color: var(--line-color);
}

.card-info {
    width: 90%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 50%;

    color: var(--vt-c-indigo);
}

.card-info-date {
    display: flex;
    align-items: center;
    height: 30%;
}

.card-info-icon {
    display: flex;
    margin: 0 0.9em 0 0;
}

.card-info-icon img {
    width: 1.1em;
    height: 1.1em;
}

.card-info-place {
    display: flex;
    align-items: center;
    height: 30%;
}

.card-info-place-text {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.card-info-date-line {
    height: 2px;
    background-color: var(--vt-c-indigo);
    margin: -0.2em 0.2em 0 0.2em;

    min-width: 12px;
    max-width: 36px;
    flex: 1
}

.pagination {
    margin: 1rem 0 4rem;
}

/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
@media (max-width: 768px) {

    .cards {
        grid-template-columns: repeat(auto-fit, minmax(90%, 1fr));
    }

}