#vat{max-width:24rem;width:100%;margin:0 auto;font-family:Arial,sans-serif;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,.1);padding:1rem}#vat>div:not(:last-child) {margin-bottom:20px}#vat>div>div{display:flex;flex-direction:row;justify-content:space-between;align-items:center}#vat label{color:#555}#vat span{color:#607d8b}#vat input[type="text"],#vat input[type="number"]{width:175px;padding:5px 10px;margin-bottom:10px;text-align:right}#vat input[type="range"]{width:100%;cursor:pointer}#vat .column-2{display:flex;margin-bottom:10px;column-gap:20px}#vat .column.box{border-radius:6px;border:1px solid #ccc;padding:10px;display:flex;justify-content:center;text-align:center;cursor:pointer;position:relative;align-items:center;flex:1;line-height:1.4}#vat .column.box:hover{border:1px solid #c69b00}#vat .column.box.selected{border:1px solid #007bff}#vat .check-icon{position:absolute;top:0;right:3px;width:20px;height:20px;fill:#007bff;display:none}#vat .column.box.selected .check-icon{display:block}#vat button{width:100%;padding:15px 20px;background-color:#0366d6;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer}#vat button:hover{background-color:#004694}#vat .fade-loop{animation:fade 1s infinite alternate}#vat .result{display:none;grid-template-columns:repeat(2,1fr);grid-column-gap:20px;grid-row-gap:10px}#vat .result .title{grid-column:span 2;text-align:center;font-weight:600}#vat .result>span:not(:first-child):nth-child(odd) {text-align:right}@keyframes fade {
    from {
        opacity: 1;
    }

    to {
        opacity: 0.5;
    }
}#vat-result{display:none;max-width:32rem;width:100%;margin:1rem auto;font-family:Arial,sans-serif;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,.1);padding:1rem}#vat-result .summary{margin-bottom:1rem}#vat-result .summary>div{display:flex;justify-content:space-between}#vat-result .summary span:last-child{font-size:small;font-weight:600}#vat-result .summary>div:nth-child(odd) {flex:0 0 calc(60% - 40px);box-sizing:border-box}#vat-result .summary>div:nth-child(even) {flex:0 0 calc(40% - 40px);box-sizing:border-box}@media only screen and (max-width:480px){#vat{padding:10px}#vat input[type="text"]{max-width:150px}#vat input[type="number"]{max-width:100px}#vat-result .summary>div{flex:1 1 100%!important}#vat-result .summary span:last-child{text-align:right}}