.files{display:grid;gap:20px;grid-template-columns:repeat(4,1fr)}.files__item{background:var(--color-background-card);border-radius:20px;overflow:hidden;position:relative;text-decoration:none}.files__item:before{background:var(--color-body-reverse);content:"";height:100%;opacity:0;position:absolute;transition:var(--transition);width:100%}.files__item:hover:before{opacity:.2}.files__preview{background:var(--color-body-reverse);box-sizing:border-box;display:block;height:200px;overflow:hidden;padding:20px;width:100%}.files__preview[color=pink]{background:var(--color-pink)}.files__preview[color=orange]{background:var(--color-orange)}.files__preview[color=yellow]{background:var(--color-yellow)}.files__preview[color=green]{background:var(--color-green)}.files__preview[color=blue]{background:var(--color-blue)}.files__preview[color=purple]{background:var(--color-purple)}.files__preview__img{box-shadow:10px 20px 50px 0 rgba(22,35,81,.3);height:auto;margin:0 auto;max-width:200px;transform:rotate(5deg);width:100%}.files__description{padding:20px}@media screen and (max-width:1100px){.files{grid-template-columns:repeat(3,1fr)}}@media screen and (max-width:800px){.files{grid-template-columns:repeat(2,1fr)}}@media screen and (max-width:500px){.files{grid-template-columns:1fr}}