﻿.quoteCard {
    --width-cards: 25rem;
    --padding-cards: 20px;
    --height-small-card: 16rem;
    --height-medium-card: 20rem;
    --height-large-card: 24rem;
    --height-very-large-card: 30rem;
    --height-total-card: 0rem;
    --height-total-img-card: 4rem;
    --title-card-height: 4rem;
    --button-card-height: 4rem;
    /*--description-card-height: 20rem;*/
    /*--description-card-height: 12rem;*/
    --description-card-height: 20rem;
    --margin-fields: 1rem;
}

    .quoteCard .vertical {
        justify-content: center;
        display: flex;
        flex-wrap: wrap;
    }


    .quoteCard .tp-card {
        /*width: var(--width-cards);*/
        padding: var(--padding-cards);
        margin: 0 auto;
        /*max-width: 30rem;*/
    }

        .quoteCard .tp-card.horizontal {
            --width-cards: 100%;
        }

    .quoteCard .horizontal .tp-card-content-in {
        display: flex;
        gap: 1rem;
        align-items: center;
    }

    .quoteCard .tp-card-content-in {
        padding: var(--padding-cards);
        border-radius: var(--rounded);
    }

        .quoteCard .tp-card-content-in.small {
            --height-total-card: var(--height-small-card);
        }

        .quoteCard .tp-card-content-in.medium {
            --height-total-card: var(--height-medium-card);
        }

        .quoteCard .tp-card-content-in.large {
            --height-total-card: var(--height-large-card);
        }

        .quoteCard .tp-card-content-in.very-large {
            --height-total-card: var(--height-very-large-card);
        }

    .quoteCard .img-card {
        height: var(--height-total-img-card);
        margin: 0 auto;
        display: flex;
        margin-bottom: var(--margin-fields);
        margin-top: var(--margin-fields);
    }

    .quoteCard .description-card {
        --margin-vertical: 0rem;
        --height-description-card: calc(var(--height-total-card) - (calc(var(--padding-cards) * 2)) - var(--height-total-img-card) - var(--title-card-height) - var(--button-card-height));
        height: var(--height-description-card);
        overflow-y: auto;
        /*font-size: 1rem;*/
        text-align: center;
        /*align-content: center;*/
        margin-bottom: var(--margin-fields);
        margin-top: var(--margin-fields);
    }

    .quoteCard .button-card {
        align-content: end;
        text-align: center;
        margin-bottom: var(--margin-fields);
        margin-top: var(--margin-fields);
    }

        .quoteCard .button-card .tp-cta {
            padding: 0;
            width: 100%;
        }

    .quoteCard .seemore {
        text-align: center;
        font-size: 14px;
    }

    .quoteCard .cardsColumn {
        grid-auto-flow: column;
        justify-content: start;
        align-items: center;
        gap: 2rem;
        padding: 2rem;
    }

    .quoteCard .ts-carousel .tns-ovh {
        padding: 0 35px;
    }

    .quoteCard .quote-description {
        font-size: 1rem;
        text-align: center;
    }

    .quoteCard .quote-person {
        font-size: 1.2rem;
        font-weight: bold;
        text-align: center;
    }

    .quoteCard .quote-job {
        font-size: 1.1rem;
        text-align: center;
    }
