:root{--color-text: #00FFFF;--bg-color: rgba(67, 99, 99, 0);--span-text: #7FFFD4;--button: rgb(23, 211, 201)}*,*:after,*:before{box-sizing:border-box;margin:0;padding:0}body{font-family:Trebuchet MS,Lucida Sans Unicode,Lucida Grande,Lucida Sans,Arial,sans-serif;background-color:var(--bg-color)}.container{display:flex;justify-content:center;align-items:center;flex-direction:column;height:80vh}.container h1{color:var(--color-text);margin-bottom:2rem}.container h1 span{color:var(--span-text)}.input-box{padding:1rem}.input-box input{padding:.2rem 2rem;font-size:1rem;text-align:center;border-radius:1rem;border:.5px solid var(--span-text);outline:none;background-color:var(--bg-color);margin:0 1rem}.input-box button{padding:.2rem 2rem;font-size:1rem;text-align:center;border-radius:1rem;border:.5px solid var(--bg-color);outline:none;background-color:var(--button);color:#fff}.input-box button:focus{cursor:pointer}.calculator{display:flex;justify-content:space-between;align-items:center;width:50%;font-size:1.5rem}.calculator .day span,.calculator .month span,.calculator .year span{color:var(--color-text)}.calculator .day .minus-day,.calculator .month .minus-month{color:green;font-weight:700}.calculator .year .minus-year{color:red;font-weight:700}@media only screen and (min-width:320px) and (max-width:430px){.container{flex-wrap:wrap;flex-direction:column}.calculator{flex-direction:column}.input-box{display:flex;flex-direction:column;align-items:center;justify-content:center}.input-box input{margin-bottom:1rem}}