@import"https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Outfit,sans-serif}body{background-color:#eaf4f4}.upper{display:flex;justify-content:center;align-items:center;gap:80px;margin:50px 0}form{display:flex;align-items:center;gap:50px}.select{width:fit-content;cursor:pointer;position:relative;transition:.3s;color:#fff;overflow:hidden}.selected{background-color:#2a2f3b;padding:5px;margin-bottom:3px;border-radius:5px;position:relative;z-index:100000;font-size:15px;display:flex;align-items:center;justify-content:space-between}.arrow{position:relative;right:0;height:10px;transform:rotate(-90deg);width:25px;fill:#fff;z-index:100000;transition:.3s}.options{display:flex;flex-direction:column;border-radius:5px;padding:5px;background-color:#2a2f3b;position:relative;top:-100px;opacity:0;transition:.3s}.select:hover>.options{opacity:1;top:0}.select:hover>.selected .arrow{transform:rotate(0)}.option{border-radius:5px;padding:5px;transition:.3s;background-color:#2a2f3b;width:150px;font-size:15px}.option:hover{background-color:#323741}.options input[type=radio]{display:none}.options label{display:inline-block}.options label:before{content:attr(data-txt)}.options input[type=radio]:checked+label{display:none}.options input[type=radio]#all:checked+label{display:none}.select:has(.options input[type=radio]#all:checked) .selected:before{content:attr(data-default)}.select:has(.options input[type=radio]#option-1:checked) .selected:before{content:attr(data-one)}.select:has(.options input[type=radio]#option-2:checked) .selected:before{content:attr(data-two)}.select:has(.options input[type=radio]#option-3:checked) .selected:before{content:attr(data-three)}.input-div{display:flex;align-items:center;gap:40px}.input{max-width:190px;padding:.5rem;font-size:1rem;border:1.5px solid #000;border-radius:.5rem;box-shadow:2.5px 3px #000;outline:none;transition:ease .25s}.input:focus{box-shadow:5.5px 7px #000}.submit-btn{--color: #000;font-family:inherit;display:inline-block;line-height:2.5em;overflow:hidden;cursor:pointer;font-size:17px;z-index:1;color:var(--color);border:2px solid var(--color);box-shadow:2.5px 3px #000;border-radius:6px;position:relative;padding:0 20px}.submit-btn:last-of-type{margin-left:40px}.submit-btn:before{position:absolute;content:"";background:var(--color);width:200px;height:200px;z-index:-1;border-radius:50%}.submit-btn:hover{color:#fff}.submit-btn:before{top:100%;left:100%;transition:.3s all}.submit-btn:hover:before{top:-30px;left:-30px}.colorBox{height:120px;flex:0 0 10%;display:flex;justify-content:center;align-items:center;cursor:pointer}.Toastify__toast,.Toastify__toast-body,.Toastify__close-button{background-color:#fff!important;color:#000!important;box-shadow:none!important}.Toastify__toast-container{background-color:transparent!important}@media only screen and (max-width: 1160px){.upper{display:flex;flex-direction:column;gap:30px}.colorBox{flex:0 0 12.5%}}@media only screen and (max-width: 992px){.colorBox{flex:0 0 calc(100% / 6)}}@media only screen and (max-width: 768px){form{display:flex;flex-direction:column;align-items:start;margin-bottom:30px}.colorBox{flex:0 0 20%}}@media only screen and (max-width: 576px){.colorBox{flex:0 0 25%}}@media only screen and (max-width: 450px){.colorBox{flex:0 0 calc(100% / 3)}}