@import"https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap";*{box-sizing:border-box;padding:0;margin:0;list-style:none;text-decoration:none;font-family:"Manrope";font-weight:800;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{background:#1f2632}.container{display:grid;justify-content:center;align-items:center;grid-template-rows:10% 70% 20%;position:relative;text-align:center;max-width:345px;height:300px;margin:6rem auto;background:#323a49;padding:2.5rem 1.5rem;border-radius:1rem;transition:.4s ease-in-out}.container .advice__num__container{display:flex;justify-content:center;margin:0 auto}.container .advice__num__container p{margin:0 2px;color:#52ffa8;font-size:.6rem;letter-spacing:4px}.container .advice__msg__container{align-self:start;justify-content:center;margin:0 auto}.container .advice__msg__container h2{opacity:0;max-height:100%;color:#c9d1de;margin:1rem auto;font-size:1.3rem;transition:.4s ease-in-out}.container .advice__msg__container .hide{display:none;transition:4s ease-in-out}.container .advice__msg__container .show{opacity:1}.container img{max-width:100%;margin:0 auto}.container .dk{display:none}.container .btnContainer{position:relative}.container .btnContainer button{cursor:pointer;display:flex;justify-content:center;align-items:center;margin:0rem auto;padding:1rem;background:#52ffa8;border:none;border-radius:50%;transform-style:preserve-3d;transition:transform 200ms cubic-bezier(0, 0, 0.58, 1),background 200ms cubic-bezier(0, 0, 0.58, 1)}.container .btnContainer button::before{position:absolute;content:"";width:100%;height:100%;top:0;left:0;right:0;bottom:0;background:#2e989e;border-radius:inherit;box-shadow:0 0 0 1px #013538,0 .125em 0 0 #083133;transform:translate3d(0, 0.55em, -1em);transition:transform 200ms cubic-bezier(0, 0, 0.58, 1),box-shadow 200ms cubic-bezier(0, 0, 0.58, 1)}.container .btnContainer button:hover{box-shadow:0 5px 15px rgba(65,187,181,.4);transform:translate(0, 0.15em)}.container .btnContainer button:hover::before{transform:translate3d(0, 0.5em, -1em)}.container .btnContainer button:active{transform:translate(0em, 0.75em)}.container .btnContainer button:active::before{box-shadow:0 0 0 2px #083133,0 0 #083133;transform:translate3d(0, 0, -1em)}@media screen and (min-width: 768px){.container{max-width:500px}.container .advice__msg__container{max-width:400px}.container .mb{display:none}.container .dk{display:block}.container .advice__msg__container h2{font-size:1.5rem}}/*# sourceMappingURL=style.css.map */