:root{--card-width:200px;--card-height:200px;--border:0;--border-radius:8px;--box-shadow:none}.card-flip{border:var(--border);border-radius:var(--border-radius);box-shadow:var(--box-shadow);color:var(--primary-text);cursor:pointer;height:var(--card-height);margin:calc(var(--gutter)/2);overflow:hidden;position:relative;text-decoration:none;transition:all .4s ease;width:var(--card-width)}.card-flip__picture{height:100%;width:100%}.card-flip__back,.card-flip__front{height:100%;position:absolute;top:0;transition:all .4s ease;width:100%}.card-flip__front{font-size:0;left:0}.card-flip:hover .card-flip__front{left:calc(0px - var(--card-width))}.card-flip__back{background:var(--primary-color);color:var(--white);font-style:italic;left:var(--card-width);padding:1em;width:100%}.card-flip:hover .card-flip__back{left:0}.card-flip__title{background:#fff;color:var(--primary-text);font-size:1rem;left:0;opacity:.8;padding:.4em;position:absolute;top:0;width:100%}.card-flip__subtitle,.card-flip__title{font-weight:700;text-transform:uppercase}.card-flip__subtitle{border-bottom:2px solid var(--secondary-color);color:var(--white);font-style:normal;margin:-.6em -.6em .6em;padding-bottom:.2em}@media screen and (max-width:679px){.card-flip{height:calc(100vw - var(--gutter)*2);margin:calc(var(--gutter)/2) 0;width:calc(100vw - var(--gutter)*2)}.card-flip:first-child{margin-top:0}.card-flip:last-child{margin-bottom:0}.card-flip__picture{height:100%;width:100%}.card-flip__title{color:var(--primary-color)}.card-flip__back{background:var(--white);color:var(--primary-text);font-weight:700;height:auto;opacity:.8}.card-flip__subtitle{display:none}.card-flip:hover .card-flip__front,.card-flip__front{height:100%;left:0;top:0;width:100%}.card-flip:hover .card-flip__back,.card-flip__back{bottom:0;height:auto;left:0;top:auto;width:100%}}