The design of your survey is quite good, I love that you showed a nice background and description before the survey (it makes the user feel more relaxed). But there’s a problem with the hover status of the “start now” button:
you should set a different text color when the button is hovered.
Also, in small viewports the text in your header is not a aligned vertically:
for this one, you need to make two changes in your css. First, you shouldn’t have used
line-height: 20px in your
<header>, let it adapt height automatically to its content, so remove that line (I think it’s line 36… and here is where I realized that you are using bootstrap, conclusion at the end of my reply). Second, your
<header> has top margin that’s messing up its position, you should remove that as well.
Also, your survey is not passing almost any of the tests FCC was asking in the project page: validation, structure, etc. Check the survey project page again, and follow the instructions marked there, and as it’s pointed out, add the next line:
Conclusion: Start from scratch again, and this time don’t use bootstrap, FCC is asking not to use third party libraries on these first projects for a reason, it’s quite hard to modify them to our needs.