#shop .card {
        border-radius: var(--t-radius-none);
        transition: var(--t-duration-slow) var(--t-ease-in-out);
        border-left: unset;
        border-right: unset;
    }

#shop .card-body{
        padding: 0;
    }

#shop .card h3{
        font-size: var(--t-text-3xl);
    }

#shop .card:hover{
        transform: scale(1.02);
        transition: var(--t-duration-fast) var(--t-ease-in-out);
        cursor: pointer;
    }

#shop .image-css {
        position: relative;
    }

#shop .card-body {
        text-align: center;
    }
/* presentation */

#shop #presentation .text-presentation{
        text-align: center;
        margin-bottom: var(--t-space-3);
    }

#shop #presentation .text-presentation h1 {
        letter-spacing: var(--t-tracking-wide);
        margin-bottom: var(--t-space-3);
    }

#shop #presentation .text-presentation .sub-title {
        font-weight: var(--t-weight-semibold);
        font-size: var(--t-text-5xl);
        margin-bottom: var(--t-space-3);
    }

#shop #presentation .text-presentation .cite {
        font-weight: var(--t-weight-light);
        font-size: var(--t-text-4xl);
        margin-bottom: var(--t-space-6);
    }

#shop #presentation .row > div:first-child {
        padding-right: 3px;
    }

#shop #presentation .row > div:last-child {
        padding-left: 3px;
    }
/**/

#shop .size-card {
        position: relative;
        margin-bottom: var(--t-space-7);
    }

#shop .size-card .size-title {
        position: absolute;
        pointer-events: none;
        bottom: 5%;
        left: 8%;
        font-size: var(--t-text-5xl);
        color: var(--t-color-white);
    }

#shop .size-card img {
        max-height: 665px;
    }

#shop .size-card img {
        transition: transform var(--t-duration-base) ease;
    }

#shop .size-card img:hover {
        transition: transform var(--t-duration-base) ease;
        transform: scale(1.02)
    }
/**/

#shop .text-side h1 {
        font-size: var(--t-text-8xl);
        font-weight: var(--t-weight-semibold);
        letter-spacing: var(--t-tracking-wide);
        margin-top: 45px;
        margin-bottom: var(--t-space-5);
    }

#shop .text-side .sub-title {
        font-size: var(--t-text-5xl);
        font-weight: var(--t-weight-semibold);
        margin-bottom: var(--t-space-5);
    }

#shop .text-side .cite {
        font-weight: var(--t-weight-light);
        font-size: var(--t-text-4xl);
        margin-bottom: var(--t-space-6);
    }
/**/

#shop .image-container {
        position: relative;
        display: inline-block;
        width: 100%;
    }

#shop .image-container .second_image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        transition: opacity var(--t-duration-slow) ease;
    }

#shop .image-container:hover .second_image {
        opacity: 1;
    }

#shop .image-container .main_image {
        display: block;
        width: 100%;
        height: auto;
        transition: opacity var(--t-duration-slow) ease;
    }

#shop .image-container:hover .main_image {
        opacity: 0;
    }

@media (max-width: 720px) {

        #shop #presentation .row > div:first-child {
            padding-left: 3px;
        }

        #shop #presentation .row > div:last-child {
            padding-right: 3px;
        }

        #shop #categories-sizes .size-title {
            font-size: var(--t-text-3xl);
            left: 8%;
        }

    }

@media (min-width: 720px) and (max-width: 960px) {

        #shop #presentation .row > div:first-child {
            padding-left: 3px;
        }

        #shop #presentation .row > div:last-child {
            padding-right: 3px;
        }

        #shop #categories-sizes .size-title {
            font-size: var(--t-text-3xl);
            left: 8%;
        }

    }