Layout Issues, Confusing CSS Bracketing

[flyingace]

At the risk of offending a group of developers I've never met, I'm going to pass along some observations that I'm hoping will help you with this site. I'm not trying to correct you, I'm only trying to pass along advice that is based on my own experience building web sites in the hopes that it will make the work you do easier overall.

I suggest you try to clearly organize your css, separating styles which will be applied globally from those which will be applied differently based on media queries. I would also strongly advise you to adopt a CSS pre-processor, like SASS or LESS.

There are also issues at the moment with the CSS itself since it is unclear what is meant to be encapsulated in which media queries and also the number of opening curly braces doesn't match the number of closing curly braces. When I was trying to work on the code this made it so I was uncertain whether a change I was trying to apply should have been within a particular media query or not.

I would also suggest that you consider simplifying your site. At the moment there are a lot of animations and features which are only going to make things more difficult to maintain. The number of nested elements is probably a lot higher than it needs to be and those elements in turn have more css classes applied to them than they may need. The difficulty you encounter with the maintenance of this code will likely lead to bugs which show up and negatively affect user experience. I would suggest that you insure that your content displays clearly at every screen size you're trying to target before adding animations and the like.

Again, this is only my advice based on my own experience. I hope it proves to be of some use to you.