#projects #main{font-size:1.5em}#projects #main h2{font-size:1em;font-weight:600}#projects #main a{margin-bottom:1em;position:relative;display:block;color:#2d2d2d;font-size:1.5em;font-weight:700;text-transform:uppercase}#projects #main a:hover img,#projects #main a:focus img,#projects #main a:active img{filter:grayscale(0%)}#projects #main a:hover span,#projects #main a:focus span,#projects #main a:active span{opacity:1}#projects #main img{display:block;width:100%;height:400px;object-fit:cover;filter:grayscale(100%);transition:all ease .2s}#projects #main span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;background-color:#987758;padding:.5em 1em;opacity:0;transition:all ease .2s}.desc{font-size:2em}@media (max-width:575px){#projects #main a img.animate-on-scroll{filter:grayscale(100%);opacity:1;transition:filter .6s ease,opacity .6s ease}#projects #main a img.animate-on-scroll.visible{filter:grayscale(0%);opacity:1}#projects #main a span.animate-on-scroll{opacity:0;transition:opacity .6s ease,top .6s ease}#projects #main a span.animate-on-scroll.visible{opacity:1}}