@import '~openstax-react-components/resources/styles/main';
@import './components/shared';
@import './components/concept-coach/index';
@import './components/task/index';
@import './components/exercise/index';
@import './components/progress/index';
@import './components/reactive/index';
@import './components/course/index';
@import './components/user/index';

@import "@{bootstrap-path}/navs";
@import "@{bootstrap-path}/navbar";

@import './mixins';
@import './variables';

.concept-coach-wrapper {
  width: 100%;
  height: 100%;
}

// 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
.concept-coach-wrapper {
  width: 100%;
  height: 100%;

  @import '~openstax-react-components/resources/styles/main';
  @import './components/shared';
  @import './components/concept-coach/index';
  @import './components/task/index';
  @import './components/exercise/index';
  @import './components/progress/index';
  @import './components/reactive/index';
  @import './components/course/index';
  @import './components/user/index';

  @import "@{bootstrap-path}/navs";
  @import "@{bootstrap-path}/navbar";

  @import './mixins';
  @import './variables';
}

Move all styles inside wrapper selector
Move all styles inside wrapper selector

This should prevent problems such as the one reported in issue #32, where
we were altering the appearance of exercises on CNX
