HTML5 and CSS

[uptoolate]

I have a problem that's been bugging me. The error shows in Chrome not Mozilla.
The website is here if you want to look: www.topshops.com.au
The website pages look good except for the 'store_listings-generic page where the isotope is. The store listings page on loading has the 4 coloumns like it should and then when you select a category from the filter tabs it goes into 3 columns and mucked up.

I am positive it applies to the CSS somehow and I am getting this error below:

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://www.topshops.com.au/css/colors/".
sorting.js:11 Uncaught TypeError: Cannot read property 'toLowerCase' of undefined
jquery.isotope.min.js:11 cannot call methods on isotope prior to initialization; attempted to call method 'reLayout'

In the css/color folder all the css files are css.
These are the link to my css files in the head area.

<link rel="shortcut icon" href="images/favicon.ico">
	<link href="css/bootstrap-theme.min.css" rel="stylesheet" type="text/css" />
	<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="css/prettyPhoto.css" rel="stylesheet" type="text/css" />
	<link href="css/flexslider.css" rel="stylesheet" type="text/css" />
	<link href="css/animate.css" rel="stylesheet" type="text/css" media="all" />
	<link href="css/style.css" rel="stylesheet" type="text/css" />
	<link href="css/colors/" rel="stylesheet" type="text/css" id="colors" />

Another thing I should mention is that if I rename the websites folder to another name all gets corrected, but when I change it back to the websites name it all goes askew again.
Also if I change the index.html page to another name it corrects itself and when I call it index.html it goes askew again.
I hope you can understand my problem and it makes sense. This is doing my head in.