body{background:#000;font-family:PT Sans,Helvetica,Arial,sans-serif;margin:0;overflow-x:hidden;overflow-y:auto}.backdrop{background:linear-gradient(#000,#317ed5) no-repeat;bottom:0;left:0;position:fixed;right:0;top:0;z-index:-2}h1 svg{float:right;height:28px;width:28px}a svg,h1 svg{vertical-align:middle}a svg{height:18px;width:18px}.see-how svg{height:36px;width:36px}canvas{left:0;position:fixed;top:0;z-index:-1}#img_logo{top:130px;width:350px}#img_logo,header{left:166px;position:absolute}header{font-size:36px;font-weight:700;top:80vh;top:max(80svh,500px)}header.small .text-long{display:none}header.large .text-long,header.small .text-short{display:block}header.large .text-short{display:none}.see-how{bottom:0;cursor:pointer;text-align:center;transition:opacity .5s}.see-how,main{position:absolute;width:100%}main{top:max(100vh,600px)}main .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));margin:0 auto;grid-gap:20px;max-width:1200px;padding:20px}main .grid div{background:#eee;border-radius:10px;color:#111;height:300px;padding:20px}main .grid div h1{font-size:30px;margin:0}main h1 .material-symbols-outlined{font-size:30px}main a .material-symbols-outlined{font-size:20px}footer{align-items:center;color:#fff;display:flex;height:80px;justify-content:center;padding:20px;text-align:center}a{color:#111;text-decoration:none}@media screen and (max-width:768px){header{font-size:26px}#img_logo{margin:0 auto;position:absolute;width:200px}}