@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800;900&display=swap");
.loan-calculator {font-family: "Inter", sans-serif;background: #fff;box-shadow: 12px 12px 50px -11px rgba(0, 0, 0, 0.2);color: #14213d;
overflow: hidden;display: flex;flex-direction: row;}
.loan-calculator,.loan-calculator * {box-sizing: border-box;}
.loan-calculator .top {background: #d81324;color: #fff;padding: 32px;width: 50%;}
.loan-calculator form input {width: 100%;}
.loan-calculator .result {display: flex;justify-content: space-between;align-items: center;padding: 32px; width: 50%;}
.loan-calculator .result .left {width: 100%;border: 1px solid #eee; padding: 10px 0 0px 0;text-align: center;}
.loan-calculator .left h3 {font-size: 16px;font-weight: 400;margin-bottom: 8px; margin-top: 8px;}
.loan-calculator .left h4 {font-size: 16px;font-weight: 400;margin-bottom: 8px;}
.loan-calculator .result .value {font-size: 30px;font-weight: 900;padding-bottom: 10px;border-bottom: 1px solid rgba(20, 33, 61, 0.2);}
.loan-calculator .result .value::before {content: "\20B9";font-size: 27px;font-weight: 400;margin-right: 6px;opacity: 0.4;}
.loan-calculator .group1 {padding-top: 32px;text-align: center;}
.loan-calculator .group1 .calculate-btn {background: #e63946;color: #fff;border: none;padding: 8px 32px;
border-radius: 8px;font-size: 18px;font-weight: 900;cursor: pointer;margin: 24px 0;}
.loan-calculator .right {width: 50%;}
.min {width: 50%;float: left;}
.rupee::before{content: "\20B9";}
.max {width: 50%;float: left;text-align: right;}

@keyframes animateWaves {
0% {background-position-x: 170px;}
100% {background-positon-x: 0px;}
}

@keyframes animate {
0% {background-position-x: -150px;}
100% {background-positon-x: 0px;}
}

@media (max-width: 750px) {
.loan-calculator {width: 100%;max-width: 600px;display: flex;flex-direction: column;}
.loan-calculator .top {width: 100%;}
.loan-calculator .result {flex-direction: column;text-align: center; width: 100%;}
}