@import url("https://fonts.googleapis.com/css2?family=Fira+Code&display=swap");@font-face{font-family:'Material Icons';font-style:normal;font-weight:400;src:url("../fonts/MaterialIcons-Regular.ttf");src:local("Material Icons"),local("MaterialIcons-Regular"),url("../fonts/MaterialIcons-Regular.ttf") format("truetype");font-display:swap}.material-icons{font-family:'Material Icons';font-weight:normal;font-style:normal;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga'}*{margin:0px;padding:0px}*::selection{color:#F3F7F8;background-color:#1DC76E}::-webkit-scrollbar{width:10px;background-color:rgba(0,0,0,0.1);backdrop-filter:blur(20px)}::-webkit-scrollbar-thumb{border-radius:5px;border:2px solid rgba(0,0,0,0.1);background-clip:padding-box;background-color:#1DC76E}::-webkit-scrollbar-thumb:hover{background-color:#1cb365}body{font-family:'Fira Code', monospace;font-size:13px;color:#0F1724;background-color:#F3F7F8;overflow-x:hidden}@media only screen and (min-width: 328px){body{font-size:14.5px}}@media only screen and (min-width: 1024px){body{font-size:16px}}@keyframes startAnimation{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}header{width:100%;padding:50px 25px;color:#F3F7F8;background-color:#0F1724;box-sizing:border-box}@media only screen and (min-width: 1024px){header{padding:50px 25px 0px 25px}}header div{display:flex;flex-direction:column;align-items:center;text-align:center;text-wrap:pretty;gap:10px;animation:startAnimation 1s ease-out both}header span{margin-top:15px;font-size:36px;color:#1DC76E;user-select:none}@media only screen and (min-width: 1024px){header span{font-size:42px}}#wavy{aspect-ratio:1150/100;width:100%;height:auto;background-repeat:no-repeat;background-position:center;background-size:cover;background-image:url("../img/wave.webp")}main{width:100%;height:auto;padding:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px 0px;background-color:#F3F7F8;box-sizing:border-box;animation:startAnimation 1s .7s ease-out both}main .password{position:relative;max-width:350px;width:100%;height:auto;margin-top:200px;padding:0px 10px;display:flex;flex-direction:row;justify-content:space-between;align-items:center;border:1px dashed #0F1724;border-radius:10px;background-color:#FFF;box-shadow:0 0 3px rgba(0,0,0,0.3);box-sizing:border-box}main .password #avatar{position:absolute;top:-187px;right:80px;width:40%;height:auto;user-select:none;transform:scaleX(-1)}main .password #coffe{position:absolute;top:-140px;left:50px;width:65px;height:auto;padding:3px;user-select:none;animation:coffeAnimation 2s ease-in-out both infinite}@keyframes coffeAnimation{0%{transform:rotate(-30deg)}50%{transform:rotate(-10deg)}100%{transform:rotate(-30deg)}}main .password input{max-width:280px;width:100%;height:40px;font-family:'Fira Code', monospace;font-size:20px;font-weight:400;text-align:center;outline:none;border:none;border-radius:10px;background-color:inherit;z-index:1}main .password span{font-size:24px;cursor:pointer;user-select:none}main .password span:hover{transition:.5s;color:#1DC76E}main .type-password{max-width:350px;width:100%;height:auto;padding:10px 0px;text-align:center}main .type-password div{width:100%;height:auto;margin-top:15px;display:flex;flex-direction:row;justify-content:space-evenly;align-items:center}main .type-password input[type=radio]{width:13px;height:13px;-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:50%;border:solid 1px #666}main .type-password input[type=radio]:checked{border-color:#1DC76E;background-color:#1DC76E}main .type-password label{cursor:pointer}main .type-password label:hover input[type=radio]{transition:.3s;color:#1DC76E;border-color:#1DC76E}main .range{max-width:350px;width:100%;height:42px;padding:10px;display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;user-select:none;border:1px dashed #0F1724;border-radius:10px;background-color:#FFF;box-shadow:0 0 3px rgba(0,0,0,0.3);box-sizing:border-box}main .range input{width:280px;height:7px;margin:0px 10px;-webkit-appearance:none;appearance:none;-webkit-transition:.2s;transition:.2s;border-radius:10px;background-color:#1DC76E}main .range input::-webkit-slider-thumb{width:20px;height:20px;-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:50%;background:#10a055}main .range p{color:#1DC76E}main .settings{max-width:350px;width:100%;height:auto;margin:10px;padding:10px;display:flex;flex-direction:row;justify-content:space-around;flex-wrap:wrap;user-select:none;border:1px dashed #0F1724;border-radius:10px;background-color:#FFF;box-shadow:0 0 3px rgba(0,0,0,0.3);box-sizing:border-box}main .settings div{width:40%;height:auto;padding:3px 5px;display:flex;flex-direction:row;justify-content:flex-start;align-items:center;flex-wrap:nowrap}main .settings label{cursor:pointer}main .settings input{margin-right:5px;-webkit-appearance:none;appearance:none}main .settings input::before{position:relative;top:3px;content:'\e835';font-family:'Material Icons';font-size:16px;color:#0F1724;cursor:pointer}main .settings input:hover::before{color:#1DC76E}main .settings .checked input::before{position:relative;top:3px;content:'\e834';font-family:'Material Icons';font-size:16px;color:#1DC76E}section{position:relative;width:100%;height:auto;padding:35px 20px;color:#F3F7F8;background-color:#0F1724;box-sizing:border-box}section::before{position:absolute;top:0px;right:0px;bottom:0px;left:0px;content:'';background-size:cover;background-position:center;background-repeat:no-repeat;background-image:url("../img/dan-nelson-ah-HeguOe9k-unsplash.webp");opacity:.03;z-index:1}section div{width:100%;height:auto;margin:0px auto;display:grid;grid-gap:30px 0px;grid-template-columns:1fr}@media only screen and (min-width: 768px){section div{grid-template-columns:repeat(2, 1fr);transition:width 2s;grid-gap:0px 30px}}@media only screen and (min-width: 1024px){section div{width:80%}}section div article{width:100%;height:auto;padding:25px;text-wrap:pretty;border-radius:10px;border:1px dashed #1DC76E;box-sizing:border-box;z-index:2}section div article *{animation:startAnimation 1s 1.4s ease-out both}section div article h2{margin-bottom:17px}section div article ul{margin-left:17px}section div article li{margin:5px 0px}@keyframes logoAppear{from{opacity:0}to{opacity:1}}footer{width:100%;height:auto;padding:25px;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:14.5px;background-color:#F3F7F8;box-sizing:border-box;animation:logoAppear 1s 2.1s ease-out both}footer img{width:75px;height:auto;user-select:none}footer a{color:#1DC76E;text-decoration:none}