:root{--ypk__card-flip__card-width:15em;--ypk__card-flip__card-height:20em}.ypk__card-flip{background:var(--ypk__components__background-color);border-color:var(--ypk__components__border-color);border-radius:var(--ypk__components__border-radius);border-style:var(--ypk__components__border-style);border-width:var(--ypk__components__border-width);box-shadow:var(--ypk__components__box-shadow);color:var(--ypk__body__text);display:block;height:var(--ypk__card-flip__card-height);overflow:hidden;position:relative;text-decoration:none;transition:all .4s ease;width:var(--ypk__card-flip__card-width)}.ypk__card-flip__front__picture{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.ypk__card-flip__back,.ypk__card-flip__front{height:100%;position:absolute;top:0;transition:all .4s ease;width:100%}.ypk__card-flip__front{font-size:0;left:0}.ypk__card-flip:hover .ypk__card-flip__front{left:calc(0px - var(--ypk__card-flip__card-width))}.ypk__card-flip__front__title{background:var(--ypk__white);color:var(--ypk__primary-color);font-size:1rem;font-weight:700;left:0;opacity:.8;padding:.4em;position:absolute;text-transform:uppercase;top:0;width:100%}.ypk__card-flip__back{background:var(--ypk__components__background-color);color:var(--ypk__body__text);font-style:italic;left:var(--ypk__card-flip__card-width);padding:1em}.ypk__card-flip:hover .ypk__card-flip__back{left:0}.ypk__card-flip__back__title{border-bottom:2px solid var(--ypk__secondary-color);color:var(--ypk__body__text);font-style:normal;font-weight:700;margin:-.6em -.6em .6em;padding-bottom:.2em;text-transform:uppercase}@media screen and (max-width:679px){.ypk__card-flip{height:calc(100vw - var(--ypk__gutter)*2);margin:calc(var(--ypk__gutter)/2) 0;width:calc(100vw - var(--ypk__gutter)*2)}.ypk__card-flip__front__picture{height:100%;width:100%}.ypk__card-flip__back{background:var(--ypk__body__color);color:var(--ypk__body__text);font-weight:700;height:auto;opacity:.8}.ypk__card-flip__back__title{display:none}.ypk__card-flip:hover .ypk__card-flip__front,.ypk__card-flip__front{height:100%;left:0;top:0;width:100%}.ypk__card-flip:hover .ypk__card-flip__back,.ypk__card-flip__back{bottom:0;height:auto;left:0;top:auto;width:100%}}