.category-list{width:100%;height:100%;position:relative}.overlay-image{background-color:#f8f8f8;position:absolute;width:33%;height:100%}.overlay-image .content{width:70%;left:50%;top:50%;transform:translate(-50%,-50%);position:absolute}.overlay-image .content *{color:#2e2b2b}.overlay-image .content h2{margin-bottom:20px}.categories{top:50%;right:3.5%;width:60%;height:72vh;position:absolute;transform:translateY(-50%);display:flex;justify-content:space-between;align-items:stretch;flex-direction:row;flex-wrap:wrap;gap:30px 20px}.categories .category{width:calc(50% - 10px);height:calc(50% - 10px);text-decoration:none}.categories .category .image{width:100%;height:86%}.categories .category .image img{width:100%;height:100%;object-fit:cover;object-position:center;object-position:left center}.categories .category .content{margin-top:15px}.categories .category .content h3{margin-bottom:5px}.categories .category .content a,.categories .category .content span{position:relative;display:block;text-decoration:none}.categories .category .content a::after,.categories .category .content span::after{content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8 4l8 8-8 8" stroke="black" stroke-width="2" fill="none"/></svg>');width:1rem;height:1rem;transition:.5s;position:absolute;top:3px;display:inline-block;margin-left:5px;opacity:.6}.categories.thirds{align-items:center;height:50vh}.categories.thirds .category{width:calc(33% - 20px);height:100%}.categories.thirds .category .image{height:100%}@media screen and (max-width:1024px) and (orientation:portrait){.categories.thirds{flex-direction:column;height:75vh}.categories.thirds .category{width:100%;height:calc(30% - 20px)}}@media screen and (max-width:820px){.category-list{background:#f8f8f8}.overlay-image{padding-top:40px;position:relative;width:85vw;margin:0 auto;left:0;transform:unset;height:unset;top:0}.overlay-image .content{position:unset;transform:unset;left:5vw;width:100%}.overlay-image .content h2,.overlay-image .content h3,.overlay-image .content p{color:#2e2b2b;text-align:left;margin:0}.overlay-image .content h2{margin-bottom:10px}.categories{width:100%;transform:unset;position:relative;height:100%;right:0;overflow-x:scroll;margin-top:40px;padding-left:7.5%;padding-right:7.5%;padding-bottom:40px;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(1,1fr)}.categories .category{width:80vw;height:min-content}.categories .category .image{height:50vh}.categories.thirds{height:auto}.categories.thirds .category{width:80vw;height:unset}}