body{background:#1A1D20;color:#fff;font-family:Poppins,sans-serif;margin:0;height:100vh}.wrapper{margin:1em 1em 5em}.logo{width:8em}h1{font-size:2rem;margin-bottom:2em;clip-path:polygon(0 100%,100% 100%,100% 100%,0% 100%);opacity:0;transform:translateY(100px);text-align:center}main{margin-top:4em}h1{font-family:Merriweather,serif}label{margin-top:1em;margin-bottom:.4em;display:block;font-weight:700}.col2{display:flex}.hero{display:block}.form{clip-path:polygon(0 100%,100% 100%,100% 100%,0% 100%);margin:0 auto}input[type=text],input[type=submit]{padding:1.2em;font-size:1rem;width:100%;box-sizing:border-box;border-radius:.2em;border:none}input[type=submit]{width:10em;background:#923ADB;color:#fff;border:none;margin-left:.5em;font-weight:700;cursor:pointer}input[type=submit]:hover{background:#7f2fc0}.card{transform:translateY(100px) scaleY(1);transform-origin:0% 100%;padding-left:1em;border-left:1px solid #4E5862;position:relative;height:8em}.card:before{position:absolute;content:"";border-radius:100%;border:.5em solid #1A1D20;background:#BA62AD;width:.5em;height:.5em;top:0;left:-.8em;opacity:1}.card:hover:before{width:.8em;height:.8em;left:-.95em;top:-.15em}.card .title{font-weight:700;opacity:0;transform:translateY(100px)}.card .desc{color:#697887;opacity:0;transform:translateY(100px)}footer{opacity:0;background:linear-gradient(90.73deg,#C9729A 4%,#923ADB 97.46%);padding:2em 1em;color:#1a1a1a;font-weight:700;margin-top:11em!important}footer .all{margin:.3em 0 0 .5em;font-size:2rem}footer .parent{display:block}footer .twitter{width:2em;margin-left:.5em}footer .social{margin-top:2em}footer a{color:#000;text-decoration:none}footer .angle-line{margin-top:1.2em}@media only screen and (min-width: 600px){.wrapper{margin:3em}h1{font-size:3rem}}@media only screen and (min-width: 750px){.features{display:grid;grid-template-columns:repeat(2,auto);grid-template-rows:repeat(2,auto);gap:2em}.features .card{margin-bottom:2em;height:auto}.features .card .title{margin-top:0}footer{padding:3em}}@media only screen and (min-width: 900px){.form{width:75%}}@media only screen and (min-width: 1200px){.hero{display:flex;justify-content:space-between;margin:8em 0 6em}.hero h1{width:40%;margin-bottom:0;text-align:left}.hero .form{width:50%;align-self:flex-end;padding-bottom:1em;margin:unset}.features{grid-template-columns:repeat(4,auto);grid-template-rows:auto}.wrapper,.features{margin-bottom:0}footer{margin:0;padding:6em}footer .parent{max-width:1150px;margin:0 auto;display:flex;justify-content:space-between}footer .social{margin:0}footer .learn,footer .skillform{margin:1em}.features .card{margin-bottom:0;height:15rem}.wrapper{width:1150px;margin:3em auto 0}}