.portfolio{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:var(--portfolio-gap-size)}.portfolio.portfolio-cols-2{grid-auto-rows:30vw;grid-template-columns:repeat(2,1fr)}.portfolio.portfolio-cols-3{grid-auto-rows:20vw;grid-template-columns:repeat(3,1fr)}.portfolio.portfolio-cols-4{grid-auto-rows:calc(25vw - var(--portfolio-gap-size));grid-template-columns:repeat(4,1fr)}div[class*=max-width-section] .portfolio.portfolio-cols-3{grid-auto-rows:calc(320px - var(--portfolio-gap-size)/2)}@media (min-width:1140px){.portfolio.portfolio-cols-2{grid-auto-rows:380px}div[class*=force-full-width] .portfolio.portfolio-cols-2{grid-auto-rows:30vw}}@media (min-width:768px) and (max-width:1139px){.portfolio.portfolio-cols-3{grid-auto-rows:30vw;grid-template-columns:repeat(2,1fr)}.portfolio.portfolio-cols-4{grid-auto-rows:calc(50vw - var(--portfolio-gap-size));grid-template-columns:repeat(2,1fr)}div[class*=max-width-section] .portfolio.portfolio-cols-3{grid-auto-rows:calc(50vw - var(--portfolio-gap-size)/2 - 40px)}}@media (max-width:767px){.portfolio.portfolio-cols-2,.portfolio.portfolio-cols-3{grid-auto-rows:60vw;grid-template-columns:repeat(1,1fr)}.portfolio.portfolio-cols-4{grid-auto-rows:100vw;grid-template-columns:repeat(1,1fr)}div[class*=max-width-section] .portfolio.portfolio-cols-3{grid-auto-rows:calc(100vw - var(--portfolio-gap-size) - 40px)}}.portfolio__img{height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.05,.2,.1,1);width:100%}.portfolio__item:hover .portfolio__img{transform:scale(1.08)}.portfolio__item{overflow:hidden;position:relative}.portfolio__item a{height:100%;left:0;position:absolute;top:0;width:100%;z-index:30}.portfolio__title{background-size:100px 1.2em;color:#fff;display:inline;line-height:1.2;margin:0;position:relative;width:fit-content}.portfolio__desc{color:#fff;font-size:11px;letter-spacing:.2em;margin-bottom:10px;text-transform:uppercase}.portfolio__item .portfolio__caption{max-height:calc(100% - 60px);max-width:calc(100% - 60px);opacity:0;overflow:hidden;position:absolute;transition:all .4s cubic-bezier(.05,.2,.1,1);z-index:10}.portfolio__item .portfolio__caption:last-child{margin-bottom:0}.portfolio.animation-hover .portfolio__item .portfolio__caption{bottom:0;left:0;padding:45px;transform:scale(.8)}.portfolio.animation-hover .portfolio__item:hover .portfolio__caption{opacity:1;transform:scale(1)}.portfolio.animation-slide_in_left .portfolio__item .portfolio__caption{bottom:30px;left:30px;overflow-x:visible;padding:10px;transform:translateX(-50%);transition:all .5s ease}.portfolio.animation-slide_in_left .portfolio__item:hover .portfolio__caption{opacity:1;transform:translateX(0)}.portfolio.animation-slide_in_left .portfolio__item .portfolio__caption .portfolio__desc{transform:translateX(-50%);transition:all .7s ease}.portfolio.animation-slide_in_left .portfolio__item:hover .portfolio__caption .portfolio__desc{transform:translateX(0)}.portfolio.animation-hover .portfolio__item:before,.portfolio.animation-slide_in_left .portfolio__item:before{background:#000;content:"";display:block;height:100%;left:0;opacity:0;position:absolute;top:0;transition:all .65s cubic-bezier(.05,.2,.1,1);width:100%;z-index:10}.portfolio.animation-hover .portfolio__item:hover:before,.portfolio.animation-slide_in_left .portfolio__item:hover:before{opacity:.5}.portfolio.animation-overlay .portfolio__item .portfolio__caption{bottom:0;display:flex;flex-direction:column;height:calc(100% - 30px);justify-content:flex-end;left:0;padding:35px;right:0;top:0;width:calc(100% - 30px)}.portfolio.animation-overlay .portfolio__item:hover .portfolio__caption{opacity:1;transform:translate(30px,30px)}.portfolio.animation-overlay .portfolio__item .portfolio__caption *{opacity:0;transition:all .4s cubic-bezier(.05,.2,.1,1)}.portfolio.animation-overlay .portfolio__item:hover .portfolio__caption *{opacity:1}.portfolio.animation-overlay .portfolio__item .portfolio__caption .portfolio__title{background-size:100px 1.1em;font-size:30px}.portfolio.animation-overlay.colorful .portfolio__item .portfolio__caption *{color:#fff}.portfolio.animation-overlay.colorful .portfolio__item:hover .portfolio__caption{opacity:1}.portfolio.animation-default .portfolio__item .portfolio__caption{background:transparent;bottom:0;left:0;max-width:100%;opacity:1;padding:45px;right:0}.portfolio.animation-default .portfolio__item:before{background:#000;content:"";display:block;height:100%;left:0;opacity:.5;position:absolute;top:0;transition:all .65s cubic-bezier(.05,.2,.1,1);width:100%;z-index:10}.portfolio.animation-default .portfolio__item:hover:before{opacity:0}.portfolio.animation-default .portfolio__item .portfolio__caption *{color:#fff}.portfolio.animation-default .portfolio__item:hover .portfolio__caption{opacity:0;transform:translateY(20%)}