.service-resource {
    flex: 1 0 33.333%;

    box-sizing: border-box;
    max-width: 33.333%;
    padding: 8px;
}

@media (min-width: 1250px) {
    .service-resource {
        flex-basis: 25%;

        max-width: 25%;
    }
}

@media (min-width: 1550px) {
    .service-resource {
        flex-basis: 20%;

        max-width: 20%;
    }
}

@media (min-width: 1840px) {
    .service-resource {
        flex-basis: 16.667%;

        max-width: 16.667%;
    }
}

.service-resource__card {
    position: relative;

    box-sizing: border-box;
    height: 100%;

    font-size: .9rem;
    line-height: 1.2;

    border: 1px solid #e6e6e6;
    border-radius: 4px;

    transition: 300ms ease;
}

.service-resource__card:hover {
    box-shadow: 0 4px 15px rgba(0, 0, 0, .1);
}

.service-resource__header {
    display: flex;
    align-items: baseline;
}

.service-resource__link {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;

    box-sizing: border-box;
    height: 100%;
    padding: 16px;
}

.service-resource__name {
    overflow: hidden;

    max-height: 64px;
    margin-top: 8px;

    font-weight: 500;
    word-break: break-word;

    color: #000;
}

.service-resource__id {
    word-break: break-word;

    color: #000;
}

.service-resource__description {
    margin-top: 16px;

    word-break: break-word;

    color: #777;
}

.service-resource__icon {
    flex-shrink: 0;

    width: 20px;
    height: 20px;
    margin-right: 8px;

    line-height: 20px;
}

.service-resource__link-text {
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    justify-content: flex-end;

    margin-top: 24px;
}
