.materials .material{overflow:hidden;padding-top:100%;position:relative;transition:all .3s ease-in}.materials .material:before{background-color:#00000040;content:"";transition:all .3s ease-in;z-index:2}.materials .material img,.materials .material:before{height:100%;left:0;position:absolute;top:0;width:100%}.materials .material img{-o-object-fit:cover;object-fit:cover;z-index:1}.materials .material .content{bottom:0;height:100%;margin-bottom:calc(-100% + 90px);padding:30px;pointer-events:none;position:absolute;transition:all .3s ease-in;z-index:3}.materials .material .content h2{color:#fff;font-size:25px;line-height:45px}.materials .material .content p{color:#fff;margin-bottom:15px}.materials .material .content span{color:#fff}.materials .material:hover:before{background-color:#f5822080;content:"";transition:all .3s ease-in}.materials .material:hover .content{bottom:0;margin-bottom:0;pointer-events:all}.materials .material:hover .content h2{line-height:30px}.materials .material:hover .content span{text-decoration:underline}.materials .link{float:right;margin-top:10px}@media only screen and (max-width:1366px) and (min-width:1024px){.materials .material .content{margin-bottom:calc(-100% + 70px);padding:20px}.materials .material .content h2{font-size:20px;line-height:40px}.materials .material:hover .content h2{font-size:20px;line-height:20px;margin-bottom:5px}.materials .material:hover .content p{font-size:16px;line-height:24px;margin-bottom:5px}}@media only screen and (max-width:767px){.materials .material .content{margin-bottom:calc(-100% + 70px);padding:20px}}
