Feedback on Survey Form - help

Could you please review my survey form and give me some feedback on things that i need to focus and change?
I need some help turning the rating radio inputs to a functioning star rating option, thank you.

https://codepen.io/Virtus30/full/YMwmKq

Very much appreciated

Beautiful design and color combination!

I am not sure how to fix the star rating system.

In mobile view you have a large gap at the top of the page.

At 701px width you are getting overlapping text. You only need to adjust your media query a bit.

screenshot2

Keep up the good work!

Thank you so much for the encouragement.
I fixed the media query and the overlapping.

I’m not sure what others are seeing. When I look at the form full screen on my Mac (Chrome) the top of the form starts at “Middle Name”. When I make the browser smaller I do see the fieldset ‘Voter Information’ but I never see the top of the form like the screenshot that @brandon_wallace added to his post.

Beautiful design!

On my Mac with Chrome, the form starts at Last Name. On my Dell with Chrome, the form starts at Middle Name.

Thanks @TazExprez, it’s not just me

When I reduce the screen size, it starts at Voter Information on both machines.

You are both right on Chrome it is was not right.
I have to study more on browser compatibility and fallback
Hope this fix works. Please let me know.
Thank you so much for the feedback.

It is looking even better now! Great work.
How about this,

  1. increasing the width of the input fields in mobile view?
  2. Changing the font of the textarea to match the rest of the page? I believe that you would just need to add
textarea {
  font-family: inherit;
}

Both added!

I really appreciate the time and feedback.