diff --git a/package.json b/package.json
index 46ebed3..64180f4 100644
--- a/package.json
+++ b/package.json
@@ -30,7 +30,7 @@
     "keymaster": "^1.6.2",
     "lodash": "^3.10.1",
     "moment": "^2.9.0",
-    "openstax-react-components": "openstax/react-components#0b8076d20de1964025a76df4f45256a1ef7c40fc",
+    "openstax-react-components": "openstax/react-components#dbd0ddb0120920b12210d8c2266747f407bc308a",
     "underscore": "~1.8.2"
   },
   "devDependencies": {
diff --git a/resources/styles/components/concept-coach/breadcrumbs.less b/resources/styles/components/concept-coach/breadcrumbs.less
index 1a4a22d..e1bdaed 100644
--- a/resources/styles/components/concept-coach/breadcrumbs.less
+++ b/resources/styles/components/concept-coach/breadcrumbs.less
@@ -21,7 +21,7 @@
     margin: 1rem 0;
   }
 
-  .task-breadcrumbs-step {
+  .openstax-breadcrumbs-step {
     border-width: 2px;
     border-style: solid;
     border-radius: @concept-coach-breadcrumb-border-radius;
@@ -81,7 +81,7 @@
   .task-practice,
   .task-chapter_practice,
   .task-page_practice {
-    .task-breadcrumbs-step {
+    .openstax-breadcrumbs-step {
       width: auto;
       position: relative;
 
diff --git a/resources/styles/components/exercise/index.less b/resources/styles/components/exercise/index.less
index b768848..5629205 100644
--- a/resources/styles/components/exercise/index.less
+++ b/resources/styles/components/exercise/index.less
@@ -6,6 +6,6 @@
     left: @concept-coach-base-y-padding - 27px;
     top: @concept-coach-base-x-padding;
 
-    .exercise();
+    .exercise-typography();
   }
 }
\ No newline at end of file
diff --git a/resources/styles/components/shared.less b/resources/styles/components/shared.less
index 6166c06..47462fe 100644
--- a/resources/styles/components/shared.less
+++ b/resources/styles/components/shared.less
@@ -1,6 +1,6 @@
 i.close-icon {
-  .fa;
-  .fa-3x;
+  .fa();
+  .fa-3x();
   cursor: pointer;
   // position pointer to the top right of content
   float: right;
diff --git a/resources/styles/demo.less b/resources/styles/demo.less
index 8420fdb..5f5144c 100644
--- a/resources/styles/demo.less
+++ b/resources/styles/demo.less
@@ -1,2 +1,4 @@
 @import '~openstax-react-components/resources/styles/main';
 @import "@{bootstrap-path}/jumbotron";
+@import "@{bootstrap-path}/navs";
+@import "@{bootstrap-path}/navbar";
diff --git a/resources/styles/main.less b/resources/styles/main.less
index f7ee0ab..9152cd3 100644
--- a/resources/styles/main.less
+++ b/resources/styles/main.less
@@ -1,3 +1,6 @@
+@import '~openstax-react-components/resources/styles/no-conflict';
+@import './components/concept-coach/modal-opened';
+
 // All styles are included inside the wrapper selector
 // This ensures CC specific styles do not alter
 // the appearance of the website that's embedding CC
@@ -5,8 +8,9 @@
   width: 100%;
   height: 100%;
 
-  @import '~openstax-react-components/resources/styles/main';
-  @import './components/shared';
+  @import "@{bootstrap-path}/variables";
+
+  // @import './components/shared';
   @import './components/concept-coach/index';
   @import './components/navigation/index';
   @import './components/task/index';
@@ -16,11 +20,6 @@
   @import './components/course/index';
   @import './components/user/index';
 
-  @import "@{bootstrap-path}/navs";
-  @import "@{bootstrap-path}/navbar";
-
   @import './mixins';
   @import './variables';
 }
-@import '~openstax-react-components/resources/styles/variables/colors';
-@import './components/concept-coach/modal-opened';
diff --git a/src/concept-coach/base.cjsx b/src/concept-coach/base.cjsx
index 9e517ff..8048ae0 100644
--- a/src/concept-coach/base.cjsx
+++ b/src/concept-coach/base.cjsx
@@ -111,7 +111,7 @@ ConceptCoach = React.createClass
     className = classnames 'concept-coach-view', "concept-coach-view-#{view}",
       loading: not (isLoggedIn or isLoaded)
 
-    <div className='concept-coach'>
+    <div className='concept-coach openstax-wrapper'>
       <ErrorNotification />
 
       <SpyMode.Wrapper>
diff --git a/webpack-helper/configs.coffee b/webpack-helper/configs.coffee
index 251a954..97ce2ea 100644
--- a/webpack-helper/configs.coffee
+++ b/webpack-helper/configs.coffee
@@ -29,7 +29,7 @@ base =
     # new webpack.NormalModuleReplacementPlugin(/\/react\/lib\/cloneWithProps/, '../../react-clonewithprops/index.js')
     # Pass the BASE_URL along
     new webpack.EnvironmentPlugin( 'NODE_ENV', 'BASE_URL' )
-    new ExtractTextPlugin('main.css')
+    new ExtractTextPlugin('[name].css')
     new webpack.optimize.DedupePlugin()
   ]
 
diff --git a/webpack.config.coffee b/webpack.config.coffee
index fa2f28c..dbe547d 100644
--- a/webpack.config.coffee
+++ b/webpack.config.coffee
@@ -33,14 +33,19 @@ getWebpackConfig = (name, isProduction) ->
       }, {isProduction}]
     'demo': [{
         entry:
-          demo: [
+          'demo.js': [
             './demo'
-            './resources/styles/main.less'
+          ]
+          'demo': [
             './resources/styles/demo.less'
           ]
+          'main': [
+            './resources/styles/main.less'
+          ]
         output:
           path: './assets/'
           publicPath: './'
+          filename: '[name]'
       }, {isProduction, minify: true}]
 
   if configs[name]?