@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Red+Hat+Text:ital,wght@0,300..700;1,300..700&display=swap";*{padding:0;margin:0;font-family:Plus Jakarta Sans,sans-serif}body{background-color:#e3f3fd}.container{height:100vh;display:flex;justify-content:center;align-items:center}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.main{width:50%;background-color:#fff;border-radius:20px}.content{display:grid;grid-template-columns:1fr 1fr;width:100%;height:100%}.data-input{padding:30px}.data-display{border-radius:0 20px 20px 60px;background-color:#122f3f;padding:30px}.no-results{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.no-results h2{margin-top:10px;color:#fff}.no-results p{margin-top:15px;color:#4e6e7e;text-align:center;font-weight:700;font-size:15px}.data-display-container h2{color:#fff;margin-bottom:10px}.data-display-container p{color:#4e6e7e;font-weight:700;font-size:15px}.results{margin-top:40px;padding:30px;background-color:#12222c;border-radius:10px;border-top:5px solid hsl(61,70%,52%)}.results h1{color:#d7da2f;font-weight:600;font-size:50px}.results div{width:100%}hr{border:none;border-top:.5px solid hsl(200,26%,54%);height:0}.results p,.results h1,.results h2,.results hr{margin-bottom:20px}.calculator-container{display:flex;padding:20px;border-radius:10px;box-shadow:0 5px 15px #0000001a;max-width:800px;margin:0 auto}.form-container{flex:1}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}.clear-button{background:none;border:none;color:#0077b6;cursor:pointer;font-weight:700}.form-group{margin-bottom:20px}.form-group label{display:block;font-weight:700;margin-bottom:5px;color:#4e6e7e}.input-group{display:flex;align-items:center;height:50px;border:2px solid hsl(200,26%,54%);border-radius:10px;overflow:hidden}.input-group span{display:flex;justify-content:center;align-items:center;font-weight:500;font-size:20px;height:100%;width:60px;padding:0 10px;background-color:#e3f3fd;color:#4e6e7e}.input-group input{width:100%;height:100%;padding:6px;border:none;background:transparent;font-size:20px;margin-left:5px}.input-group input:focus{border:none;outline:none}.radio-group label{display:flex;align-items:center;margin-right:10px}.radio-group input{margin-right:5px}.calculate-button{background-color:#d7da2f;color:#122f3f;border:none;padding:10px 20px;border-radius:30px;cursor:pointer;font-size:16px;font-weight:700;max-width:100%;margin-top:30px;display:flex;align-items:center}.calculate-button:hover{background-color:#b7c20d}.results-container{flex:1;background-color:#1e2d3a;border-radius:10px;padding:20px;color:#fff;display:flex;justify-content:center;align-items:center;text-align:center}.results-content{max-width:250px}.results-content h3{margin-bottom:10px;font-size:20px}.mortgage-type{display:flex;padding:10px;border:2px solid hsl(200,26%,54%);border-radius:10px;margin-bottom:10px}.error-text{color:#d73328;font-size:14px;margin-top:5px;font-weight:500}.input-error{border-color:#d73328}.input-error span{background-color:#d73328;color:#fff}.mortgage-type,input[type=radio]{cursor:pointer}.mortgage-type:hover{border-color:#d7da2f;background-color:#f7f7d4}.mortgage-type input[type=radio]:checked{border-color:#d7da2f;background-color:#eff0a8;color:#4e6e7e}@media only screen and (max-width: 768px){.content{grid-template-columns:1fr}.data-display{border-radius:0 0 20px 20px;padding:20px}.results h1{font-size:36px}.calculate-button{width:100%}.header{display:block}}@media only screen and (max-width: 480px){.main{width:90%}.header{display:block}.form-group label{font-size:14px}.input-group span{font-size:16px;width:50px}.input-group input{font-size:16px}.calculate-button{font-size:14px;padding:8px 16px;width:100%}.results h1{font-size:28px}.results{padding:20px}.no-results p{font-size:14px}}