Request Consultation - Copy this React, Tailwind Component to your project

Make more actrative "<div className="px 4 md:px 12 lg:px 28 py 20"> <div className=" mx auto bg white p 8 border border gray 300 rounded lg shadow md"> <h2 className=" text center mb 6 font sans text 3xl font bold leading none tracking tight text gray 900 sm:text 4xl "> Get a free consultation </h2> <form> <div className="flex justify between"> <div className="mb 4"> <label className="block text gray 700 mb 2" htmlFor="fullName"> Enter your full name </label> <input required type="text" id="fullName" placeholder="e.g., Shahrukh Khan" className="w full px 3 py 2 border border gray 300 rounded md focus:outline none focus:ring 2 focus:ring emerald 500" /> </div> <div className="mb 4"> <label className="block text gray 700 mb 2" htmlFor="phoneNumber"> Enter your phone number </label> <input required type="text" id="phoneNumber" placeholder="10 digit number" className="w full px 3 py 2 border border gray 300 rounded md focus:outline none focus:ring 2 focus:ring emerald 500" /> </div> <div className="mb 4"> <label className="block text gray 700 mb 2" htmlFor="city"> Choose your city </label> <select id="city" required className="w full px 3 py 2 border border gray 300 rounded md focus:outline none focus:ring 2 focus:ring emerald 500" > <option>Select an Option</option> {/* Add more options here */} </select> </div> </div> <div className="mb 4"> <label className="block text gray 700 mb 2"> <input type="checkbox" className="mr 2" required /> required Allow Oro’s loan experts to contact me for my loan application </label> </div> <button type="submit" className="w full bg emerald 500 text white py 2 rounded md hover:bg emerald 600 transition duration 300" > Request a Call Back </button> </form> </div> </div>"