.tutorials-page{padding:20px;max-width:1600px;margin:0 auto}.tutorials-page h1{font-size:32px;margin-bottom:30px;color:#333;text-align:center}.tutorial-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}.tutorial-item{border:1px solid #ddd;border-radius:8px;overflow:hidden;background-color:#f5f5f5;transition:transform .3s ease,box-shadow .3s ease}.tutorial-item:hover{transform:translateY(-5px);box-shadow:0 5px 15px #0000001a}.video-thumbnail{position:relative;width:100%;padding-top:56.25%}.video-thumbnail img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:34px;background-color:#000000b3;border-radius:10px;cursor:pointer;transition:background-color .3s ease}.play-button:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-35%,-50%);width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:14px solid white}.tutorial-item:hover .play-button{background-color:#f00c}.tutorial-details{padding:15px}.tutorial-details h2{font-size:14px;margin:0;line-height:1.3;color:#333}@media screen and (min-width:1401px){.tutorial-list{grid-template-columns:repeat(5,1fr)}}@media screen and (max-width:1400px)and (min-width:1101px){.tutorial-list{grid-template-columns:repeat(4,1fr)}}@media screen and (max-width:1100px)and (min-width:801px){.tutorial-list{grid-template-columns:repeat(3,1fr)}}@media screen and (max-width:800px)and (min-width:501px){.tutorial-list{grid-template-columns:repeat(2,1fr)}}@media screen and (max-width:500px){.tutorial-list{grid-template-columns:1fr}.tutorials-page h1{font-size:24px}.tutorial-details h2{font-size:16px}}
/*# sourceMappingURL=/cdn/shop/t/6/assets/section-video.css.map */