*{box-sizing:border-box;margin:0;padding:0}body{height:100vh;font-family:"Exo 2",sans-serif;background-color:#fff}canvas{touch-action:auto}.webgl{max-width:500px;height:300px}:root{--color-1: rgb(155, 232, 209);--color-2: rgb(162, 205, 240);--color-3: rgb(255, 195, 125);--color-4: rgb(255 170 170);--color-5: rgb(49, 60, 67);--color-6: #dee;--color-glob: var(--color-4)}.wrap{display:flex;align-items:center;justify-content:center;background:linear-gradient(to right,var(--color-1) 0% 25%,var(--color-2) 0% 50%,var(--color-3) 0% 75%,var(--color-4) 0% 100%);width:360px;height:calc(100vh - 30px);margin:0 auto}#content{display:flex;flex-direction:column;align-items:center;justify-content:space-around;background:linear-gradient(to top,var(--color-1) 0% 0%,#fff 35%);padding-bottom:30px;border-bottom:2px solid #fff;width:360px}#intro{width:360px;padding:40px 30px;font-weight:300;text-align:center;margin-bottom:-60px}.intro{font-weight:300;text-align:center}#intro span{text-transform:uppercase;font-weight:400}#intro span:nth-child(1){color:var(--color-1)}#intro span:nth-child(2){color:var(--color-2)}#intro span:nth-child(3){color:var(--color-3)}#intro span:nth-child(4){color:var(--color-4)}.social{display:flex;align-items:center;padding:4px 6px;gap:30px;margin:-55px 0 20px;z-index:2}.social>a>img{height:20px}.social>a:nth-child(1){padding:0 10px}.social>a{display:flex;align-items:center;justify-content:center;background:radial-gradient(#fff,#fff) padding-box,linear-gradient(-45deg,#0091ff,#ffcf00 49%,#fc4f4f) border-box;border-radius:25px;border:1px solid transparent;height:35px;padding:0 10px;transition:all .3s ease-in-out}.social>a:hover{background:radial-gradient(white 50%,var(--color-6) 100%) padding-box,linear-gradient(-45deg,#0091ff,#ffcf00 49%,#fc4f4f) border-box;padding:0 17px}#link{margin:0 0 20px;display:inline-flex;align-items:center;gap:20px;justify-content:center;border:2px solid #fff;padding:6px 12px 6px 9px;border-radius:20px;text-decoration:none;background:linear-gradient(to right,#fff 0 38px,var(--color-6) 0% 100%)}#link a{color:var(--color-5);transition:all .3s ease-in-out}#link a:link,#link a:visited{text-decoration:none}#link a:hover{text-decoration:underline;letter-spacing:1px!important}#link a:active{text-decoration:underline}footer{width:360px;bottom:0;margin:0 auto;color:var(--color-5);font-weight:300;text-align:center;font-size:small}
