.my-projects{margin-top:74px;.projects{width:342px;margin:0 auto;padding:32px 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;.projects-item{position:relative;width:342px;height:200px;.thumbnail{height:200px;object-fit:cover}.thumbnail,.title{position:absolute;width:342px;left:0}.title{top:80px;font-weight:700;font-size:30px;text-align:center;text-transform:uppercase;color:#fff;z-index:1;transition:top .5s ease}.overlay{top:0;width:100%;height:100%;background:transparent;transition:background .5s ease}.button,.overlay{position:absolute;left:0}.button{width:342px;top:90px;text-align:center;opacity:0;transition:opacity .35s ease;a{width:200px;padding:12px 48px;text-align:center;color:#fff;border:2px solid #fff;z-index:1;text-decoration:none}}&:hover{.overlay{display:block;background:rgba(0,0,0,.3)}.title{top:35px}.button{opacity:1}}}}}@media(min-width:768px){.my-projects{margin-top:93px;.projects{width:704px;padding:32px 0;.projects-item{width:334px;height:200px;.button,.thumbnail,.title{width:334px}}}}}@media(min-width:1280px){.my-projects{margin-top:119px;.projects{width:1024px;justify-content:left;.projects-item{width:321px;height:200px;.button,.thumbnail,.title{width:321px}}}}}