diff --git a/css/silverstripe-flexslider.css b/css/silverstripe-flexslider.css
index 2e396b8..05cd232 100644
--- a/css/silverstripe-flexslider.css
+++ b/css/silverstripe-flexslider.css
@@ -2,20 +2,20 @@
     border: none;
 }
 .slideshow .flexslider ul,
-.slideshow .carousel ul{
+.slideshow .fs-carousel ul{
     margin: 0;
 }
 .slideshow .flexslider ul li,
-.slideshow .carousel ul li{
+.slideshow .fs-carousel ul li{
     list-style-type: none;
     margin: 0;
 }
 .slideshow .flexslider ol,
-.slideshow .carousel ol{
+.slideshow .fs-carousel ol{
     list-style-type: none;
     margin: 0;
 }
-.slideshow .flexslider img, .slideshow .carousel img {
+.slideshow .flexslider img, .slideshow .fs-carousel img {
     border: 0;
 }
 .flexslider .slide {
@@ -27,22 +27,22 @@
 .slideshow .flex-direction-nav a {
     overflow: visible;
 }
-.slideshow a.flex-next:hover, .carousel a.flex-next:hover {border-bottom: none;}
+.slideshow a.flex-next:hover, .fs-carousel a.flex-next:hover {border-bottom: none;}
 
-.slideshow .carousel {position: relative;}
-.slideshow .carousel ul.slides li img {cursor: pointer; width: 100%; height: auto; opacity: 0.9;}
-.slideshow .carousel ul.slides li img:hover {opacity: 1;}
-.slideshow .carousel:hover .flex-direction-nav .flex-prev {
+.slideshow .fs-carousel {position: relative;}
+.slideshow .fs-carousel ul.slides li img {cursor: pointer; width: 100%; height: auto; opacity: 0.9;}
+.slideshow .fs-carousel ul.slides li img:hover {opacity: 1;}
+.slideshow .fs-carousel:hover .flex-direction-nav .flex-prev {
   opacity: 0.7;
   left: 10px;
 }
-.slideshow .carousel:hover .flex-direction-nav .flex-prev:hover {
+.slideshow .fs-carousel:hover .flex-direction-nav .flex-prev:hover {
   opacity: 1;
 }
-.slideshow .carousel:hover .flex-direction-nav .flex-next {
+.slideshow .fs-carousel:hover .flex-direction-nav .flex-next {
   opacity: 0.7;
   right: 10px;
 }
-.slideshow .carousel:hover .flex-direction-nav .flex-next:hover {
+.slideshow .fs-carousel:hover .flex-direction-nav .flex-next:hover {
   opacity: 1;
 }
diff --git a/src/ORM/FlexSlider.php b/src/ORM/FlexSlider.php
index 8fcf8e1..2c9ced1 100644
--- a/src/ORM/FlexSlider.php
+++ b/src/ORM/FlexSlider.php
@@ -191,7 +191,7 @@ public function contentcontrollerInit()
     public function getCustomScript()
     {
         // Flexslider options
-        $sync = ($this->owner->ThumbnailNav == true) ? "sync: '.carousel:eq('+index+')'," : '';
+        $sync = ($this->owner->ThumbnailNav == true) ? "sync: '.fs-carousel:eq('+index+')'," : '';
 
         $before = $this->owner->hasMethod('flexSliderBeforeAction')
             ? $this->owner->flexSliderBeforeAction()
@@ -208,8 +208,8 @@ public function getCustomScript()
                 $(document).ready(function(){
                     jQuery('.flexslider').each(function(index){
 					 
-                         if(jQuery('.carousel').eq(index).length) {
-                             jQuery('.carousel').eq(index).flexslider({
+                         if(jQuery('.fs-carousel').eq(index).length) {
+                             jQuery('.fs-carousel').eq(index).flexslider({
                                 slideshow: " . $this->owner->obj('Animate')->NiceAsBoolean() . ",
                                 animation: 'slide',
                                 animationLoop: " . $this->owner->obj('Loop')->NiceAsBoolean() . ",
diff --git a/templates/Includes/FlexSlider.ss b/templates/Includes/FlexSlider.ss
index 5078ee1..c2f7e4d 100644
--- a/templates/Includes/FlexSlider.ss
+++ b/templates/Includes/FlexSlider.ss
@@ -12,7 +12,7 @@
       </ul>
     </div>
   	<% if $ThumbnailNav && $SlideShow.Count > 1 %>
-      <div class="carousel">
+      <div class="fs-carousel">
         <ul class="slides">
 			<% loop $SlideShow %>
 			  <li>