@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap);.container .title::before,body,form .button input{background:linear-gradient(135deg,#71b7e6,#E99B52)}*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}body{display:flex;justify-content:center;padding:10px}.container{max-width:700px;width:100%;background-color:#fff;padding:25px 15px;border-radius:5px;box-shadow:0 5px 10px rgba(0,0,0,.15)}.container .title{font-size:25px;font-weight:500;position:relative}.container .title::before{content:"";position:absolute;left:0;bottom:0;height:3px;width:30px;border-radius:5px}.content form .user-details{display:flex;flex-wrap:wrap;justify-content:space-between;margin:20px 0 12px}form .user-details .input-box{margin-bottom:15px;width:calc(100% / 1 - 20px)}form .input-box span.details{display:block;font-weight:500;margin-bottom:5px}.user-details .input-box input,.user-details .input-box select{height:45px;width:100%;outline:0;font-size:16px;border-radius:5px;padding-left:15px;border:1px solid #ccc;border-bottom-width:2px;transition:.3s}.user-details .input-box input:focus,.user-details .input-box input:valid{border-color:#9b59b6}form .gender-details .gender-title{font-size:20px;font-weight:500}form .category{display:flex;width:80%;margin:14px 0;justify-content:space-between}form .category label{display:flex;align-items:center;cursor:pointer}form .category label .dot{height:18px;width:18px;border-radius:50%;margin-right:10px;background:#d9d9d9;border:5px solid transparent;transition:.3s}#dot-1:checked~.category label .one,#dot-2:checked~.category label .two,#dot-3:checked~.category label .three{background:#9b59b6;border-color:#d9d9d9}.com_pro,form input[type=radio]{display:none}form .button{height:45px;margin:35px 0}form .button input{height:100%;width:100%;border-radius:5px;border:none;color:#000000;font-size:18px;font-weight:500;letter-spacing:1px;cursor:pointer;transition:.3s}form .button input:hover{background:linear-gradient(-135deg,#71b7e6,#9b59b6)}@media(max-width:584px){.container{max-width:100%}form .user-details .input-box{margin-bottom:15px;width:100%}form .category{width:100%}.content form .user-details{overflow-y:scroll}.user-details::-webkit-scrollbar{width:5px}}@media(max-width:459px){.container .content .category{flex-direction:column}}.alert-danger{background-color:#f8d7da;padding:10px}