diff --git a/app/scripts/services/pitch_statistic_service.js b/app/scripts/services/pitch_statistic_service.js
index f9ac113..24dc694 100644
--- a/app/scripts/services/pitch_statistic_service.js
+++ b/app/scripts/services/pitch_statistic_service.js
@@ -28,7 +28,9 @@ class PitchStatisticService {
     this.stats = localStorage.getItem(localStoragePitchStatsKey);
 
     if (this.stats) {
-      this.stats = JSON.parse(this.stats).map(this.transformDate).map(StatEvolver.evolveToLatestSchema);
+      this.stats = JSON.parse(this.stats)
+        .map(this.transformDate)
+        .map(StatEvolver.evolveToLatestSchema);
     } else {
       this.stats = [];
     }
@@ -45,7 +47,9 @@ class PitchStatisticService {
   }
 
   getSuccessCount() {
-    return _(this.stats).filter(el => el.success).value().length;
+    return _(this.stats)
+      .filter(el => el.success)
+      .value().length;
   }
 
   rateEvent(event) {
@@ -67,7 +71,10 @@ class PitchStatisticService {
   }
 
   getLastTimes(n = 10) {
-    return this.stats.filter(el => el.success).map(el => el.time).slice(-n);
+    return this.stats
+      .filter(el => el.success)
+      .map(el => el.time)
+      .slice(-n);
   }
 
   computeAverage(array) {
@@ -83,11 +90,18 @@ class PitchStatisticService {
   }
 
   getTotalAmountOfChords() {
-    return _(this.stats).filter(el => el.success).map(el => el.keys).size();
+    return _(this.stats)
+      .filter(el => el.success)
+      .map(el => el.keys)
+      .size();
   }
 
   getTotalAmountOfKeys() {
-    return _(this.stats).filter(el => el.success).map(el => el.keys).flatten().size();
+    return _(this.stats)
+      .filter(el => el.success)
+      .map(el => el.keys)
+      .flatten()
+      .size();
   }
 
   getSuccessRate() {
diff --git a/app/scripts/services/rhythm_statistic_service.js b/app/scripts/services/rhythm_statistic_service.js
index bdf829b..f798f63 100644
--- a/app/scripts/services/rhythm_statistic_service.js
+++ b/app/scripts/services/rhythm_statistic_service.js
@@ -64,7 +64,9 @@ class RhythmStatisticService {
   }
 
   getSuccessCount() {
-    return _(this.stats).filter(el => el.success).value().length;
+    return _(this.stats)
+      .filter(el => el.success)
+      .value().length;
   }
 
   getLastScores(n) {
@@ -72,7 +74,10 @@ class RhythmStatisticService {
   }
 
   getLastTimes(n = 10) {
-    return this.stats.filter(el => el.success).map(el => el.time).slice(-n);
+    return this.stats
+      .filter(el => el.success)
+      .map(el => el.time)
+      .slice(-n);
   }
 
   computeAverage(array) {
@@ -88,7 +93,10 @@ class RhythmStatisticService {
   }
 
   getTotalAmountOfBeats() {
-    return _(this.stats).map(el => el.durations).flatten().size();
+    return _(this.stats)
+      .map(el => el.durations)
+      .flatten()
+      .size();
   }
 
   getTotalRhythmTime() {
diff --git a/app/scripts/views/animated_number.js b/app/scripts/views/animated_number.js
index 03269b6..6c7cf22 100644
--- a/app/scripts/views/animated_number.js
+++ b/app/scripts/views/animated_number.js
@@ -12,10 +12,7 @@ export default class AnimatedNumber extends Component {
     const number = this.props.number;
     return (
       <Motion defaultStyle={{ x: 1 }} style={{ x: spring(number) }}>
-        {value =>
-          <span>
-            {formatter ? formatter(value.x) : Math.round(value.x)}
-          </span>}
+        {value => <span>{formatter ? formatter(value.x) : Math.round(value.x)}</span>}
       </Motion>
     );
   }
diff --git a/app/scripts/views/beat_visualization.js b/app/scripts/views/beat_visualization.js
index 03bdfa3..252181b 100644
--- a/app/scripts/views/beat_visualization.js
+++ b/app/scripts/views/beat_visualization.js
@@ -27,11 +27,11 @@ export default class BeatVisualization extends Component {
     const ticks = necessaryBeatNames.slice(tickIndex, tickIndex + tickStepCount);
     return (
       <div className="row center-xs">
-        {ticks.map((beatName, index) =>
+        {ticks.map((beatName, index) => (
           <div className="col-xs" key={index}>
             {beatName}
           </div>
-        )}
+        ))}
       </div>
     );
   }
@@ -53,11 +53,11 @@ export default class BeatVisualization extends Component {
         currentX = x + width;
 
         return [
-          marginLeft > 0
-            ? <div className="beat restBeat" style={{ width: `${marginLeft}%` }} key={"spacer-${index}"}>
-                {beatNamesRest}
-              </div>
-            : null,
+          marginLeft > 0 ? (
+            <div className="beat restBeat" style={{ width: `${marginLeft}%` }} key={"spacer-${index}"}>
+              {beatNamesRest}
+            </div>
+          ) : null,
           <div className={`beat ${color}-beat`} style={{ width: `${width}%` }} key={index}>
             {beatNames}
           </div>
@@ -99,12 +99,8 @@ export default class BeatVisualization extends Component {
     // uniqueId avoids that different beat bars are animated into each other
     return (
       <div key={_.uniqueId()} className={className}>
-        <div className="expectedBeatBar">
-          {expectedBeats}
-        </div>
-        <div className="actualBeatBar">
-          {actualBeats}
-        </div>
+        <div className="expectedBeatBar">{expectedBeats}</div>
+        <div className="actualBeatBar">{actualBeats}</div>
       </div>
     );
   }
diff --git a/app/scripts/views/claviature_view.js b/app/scripts/views/claviature_view.js
index 16eb8c7..db928c6 100644
--- a/app/scripts/views/claviature_view.js
+++ b/app/scripts/views/claviature_view.js
@@ -111,9 +111,7 @@ export default class ClaviatureView extends Component {
     ].map(args => this.renderKey.apply(this, args));
     return (
       <div className={classNames({ "scale noSelect": true, noPointerEvents: this.props.disabled })}>
-        <ol>
-          {keys}
-        </ol>
+        <ol>{keys}</ol>
       </div>
     );
   }
diff --git a/app/scripts/views/game_button.js b/app/scripts/views/game_button.js
index bf69246..6bd5b67 100644
--- a/app/scripts/views/game_button.js
+++ b/app/scripts/views/game_button.js
@@ -39,22 +39,16 @@ export default class GameButton extends Component {
   }
 
   render() {
-    const subtext = this.props.shortcutLetter
-      ? <div>
-          <span style={{ fontSize: 12 }}>
-            Or press &lsquo;{this.props.shortcutLetter}&rsquo;
-          </span>
-        </div>
-      : null;
+    const subtext = this.props.shortcutLetter ? (
+      <div>
+        <span style={{ fontSize: 12 }}>Or press &lsquo;{this.props.shortcutLetter}&rsquo;</span>
+      </div>
+    ) : null;
 
     return (
       <Button onClick={this.props.onClick} bsStyle={this.props.primary ? "success" : "default"} className="gameButton">
-        <span className="gameButton-label">
-          {this.props.label}
-        </span>
-        <span className="subtext">
-          {subtext}
-        </span>
+        <span className="gameButton-label">{this.props.label}</span>
+        <span className="subtext">{subtext}</span>
       </Button>
     );
   }
diff --git a/app/scripts/views/level_view.js b/app/scripts/views/level_view.js
index 7dd7555..81d4773 100644
--- a/app/scripts/views/level_view.js
+++ b/app/scripts/views/level_view.js
@@ -65,9 +65,7 @@ export default class LevelView extends Component {
     return (
       <div>
         {content}
-        <div>
-          Current level: {levelIndex + 2}
-        </div>
+        <div>Current level: {levelIndex + 2}</div>
       </div>
     );
   }
diff --git a/app/scripts/views/metronome_view.js b/app/scripts/views/metronome_view.js
index aa1c818..cd242d0 100644
--- a/app/scripts/views/metronome_view.js
+++ b/app/scripts/views/metronome_view.js
@@ -65,9 +65,7 @@ export default class MetronomeView extends Component {
           opacityOut: (this.state.currentMetronomeBeat + 1) % 4 === 0
         })}
       >
-        <h2>
-          {this.state.currentMetronomeBeat + 1}
-        </h2>
+        <h2>{this.state.currentMetronomeBeat + 1}</h2>
       </CollapsableContainer>
     );
   }
diff --git a/app/scripts/views/pitch_reading_view.js b/app/scripts/views/pitch_reading_view.js
index 5ba0db2..0cee583 100644
--- a/app/scripts/views/pitch_reading_view.js
+++ b/app/scripts/views/pitch_reading_view.js
@@ -141,15 +141,15 @@ export default class PitchReadingView extends Component {
     const isMidiAvailable = this.props.settings.midi.inputs.get().length > 0;
     const noErrors = this.state.errorMessage !== null;
     const miniClaviature =
-      isMidiAvailable && noErrors
-        ? null
-        : <ClaviatureView
-            desiredKeys={this.getAllCurrentKeys()}
-            keySignature={this.state.currentKeySignature}
-            successCallback={this.onSuccess.bind(this)}
-            failureCallback={this.onFailure.bind(this)}
-            disabled={!this.state.running}
-          />;
+      isMidiAvailable && noErrors ? null : (
+        <ClaviatureView
+          desiredKeys={this.getAllCurrentKeys()}
+          keySignature={this.state.currentKeySignature}
+          successCallback={this.onSuccess.bind(this)}
+          failureCallback={this.onFailure.bind(this)}
+          disabled={!this.state.running}
+        />
+      );
 
     const startStopButton = (
       <GameButton
@@ -226,9 +226,7 @@ export default class PitchReadingView extends Component {
                       hide: this.state.errorMessage === null
                     })}
                   >
-                    <h3>
-                      {this.state.errorMessage}
-                    </h3>
+                    <h3>{this.state.errorMessage}</h3>
                   </div>
                 </div>
               </CollapsableContainer>
diff --git a/app/scripts/views/pitch_settings_view.js b/app/scripts/views/pitch_settings_view.js
index f8e809b..1161346 100644
--- a/app/scripts/views/pitch_settings_view.js
+++ b/app/scripts/views/pitch_settings_view.js
@@ -50,26 +50,26 @@ export default class PitchSettingsView extends Component {
     const midiSettings = this.props.settings.midi;
     const midiInputs = midiSettings.inputs.get();
     const isMidiAvailable = midiInputs.length > 0;
-    const deviceSelector = !isMidiAvailable
-      ? null
-      : <SettingLine label="Midi device">
-          <select
-            name="select"
-            onChange={this.onMidiSelectChange.bind(this)}
-            defaultValue={midiSettings.currentInput}
-            ref={c => {
-              this.midiSelect = c;
-            }}
-          >
-            {midiInputs.map((el, index) => {
-              return (
-                <option value={index} key={index}>
-                  Device {index + 1}
-                </option>
-              );
-            })}
-          </select>
-        </SettingLine>;
+    const deviceSelector = !isMidiAvailable ? null : (
+      <SettingLine label="Midi device">
+        <select
+          name="select"
+          onChange={this.onMidiSelectChange.bind(this)}
+          defaultValue={midiSettings.currentInput}
+          ref={c => {
+            this.midiSelect = c;
+          }}
+        >
+          {midiInputs.map((el, index) => {
+            return (
+              <option value={index} key={index}>
+                Device {index + 1}
+              </option>
+            );
+          })}
+        </select>
+      </SettingLine>
+    );
 
     const useAutomaticDifficulty = this.props.settings.useAutomaticDifficulty;
 
diff --git a/app/scripts/views/rhythm_reading_view.js b/app/scripts/views/rhythm_reading_view.js
index 1bf9b0b..d3d8a0a 100644
--- a/app/scripts/views/rhythm_reading_view.js
+++ b/app/scripts/views/rhythm_reading_view.js
@@ -262,17 +262,19 @@ export default class RhythmReadingView extends Component {
     );
 
     const buttons =
-      this.state.phase !== Phases.feedback
-        ? <GameButton label="Start training" shortcutLetter="s" primary onClick={this.nextBar.bind(this)} />
-        : this.state.result.success
-          ? <div>
-              <GameButton label="Repeat this bar" shortcutLetter="r" onClick={this.repeatBar.bind(this)} />
-              <GameButton label="Start next bar" shortcutLetter="s" onClick={this.nextBar.bind(this)} primary />
-            </div>
-          : <div>
-              <GameButton label="Repeat this bar" shortcutLetter="r" onClick={this.repeatBar.bind(this)} primary />
-              <GameButton label="Skip this bar" shortcutLetter="s" onClick={this.nextBar.bind(this)} />
-            </div>;
+      this.state.phase !== Phases.feedback ? (
+        <GameButton label="Start training" shortcutLetter="s" primary onClick={this.nextBar.bind(this)} />
+      ) : this.state.result.success ? (
+        <div>
+          <GameButton label="Repeat this bar" shortcutLetter="r" onClick={this.repeatBar.bind(this)} />
+          <GameButton label="Start next bar" shortcutLetter="s" onClick={this.nextBar.bind(this)} primary />
+        </div>
+      ) : (
+        <div>
+          <GameButton label="Repeat this bar" shortcutLetter="r" onClick={this.repeatBar.bind(this)} primary />
+          <GameButton label="Skip this bar" shortcutLetter="s" onClick={this.nextBar.bind(this)} />
+        </div>
+      );
 
     return (
       <div className={classNames({ trainer: true, trainerHidden2: !this.props.isActive })}>
@@ -296,9 +298,7 @@ export default class RhythmReadingView extends Component {
 
                 <CollapsableContainer collapsed={this.state.phase === Phases.running}>
                   <div className="row center-xs" style={{ marginTop: 20 }}>
-                    <div className="col-xs-12">
-                      {buttons}
-                    </div>
+                    <div className="col-xs-12">{buttons}</div>
                   </div>
                 </CollapsableContainer>
               </div>
diff --git a/app/scripts/views/rhythm_statistic_view.js b/app/scripts/views/rhythm_statistic_view.js
index 23ce513..1525224 100644
--- a/app/scripts/views/rhythm_statistic_view.js
+++ b/app/scripts/views/rhythm_statistic_view.js
@@ -24,19 +24,19 @@ export default class RhythmStatisticView extends Component {
         unit: "y"
       },
       {
-        amount: Math.floor(seconds % 31536000 / 86400),
+        amount: Math.floor((seconds % 31536000) / 86400),
         unit: "d"
       },
       {
-        amount: Math.floor(seconds % 31536000 % 86400 / 3600),
+        amount: Math.floor(((seconds % 31536000) % 86400) / 3600),
         unit: "h"
       },
       {
-        amount: Math.floor(seconds % 31536000 % 86400 % 3600 / 60),
+        amount: Math.floor((((seconds % 31536000) % 86400) % 3600) / 60),
         unit: "m"
       },
       {
-        amount: seconds % 31536000 % 86400 % 3600 % 60,
+        amount: (((seconds % 31536000) % 86400) % 3600) % 60,
         unit: "s"
       }
     ]
diff --git a/app/scripts/views/setting_line.js b/app/scripts/views/setting_line.js
index f6545e6..52013af 100644
--- a/app/scripts/views/setting_line.js
+++ b/app/scripts/views/setting_line.js
@@ -26,9 +26,7 @@ export default class SettingLine extends Component {
         <div className="col-lg-6 col-md-6 col-sm-6 col-xs-12" style={{ textAlign: "left" }}>
           {this.props.label}
         </div>
-        <div className="settingUI col-lg-6 col-md-6 col-sm-6 col-xs-12">
-          {this.props.children}
-        </div>
+        <div className="settingUI col-lg-6 col-md-6 col-sm-6 col-xs-12">{this.props.children}</div>
       </div>
     );
   }
diff --git a/app/scripts/views/stave_renderer.js b/app/scripts/views/stave_renderer.js
index 0d81318..027817b 100644
--- a/app/scripts/views/stave_renderer.js
+++ b/app/scripts/views/stave_renderer.js
@@ -85,10 +85,16 @@ class StaveRenderer extends PureComponent {
     this.setCanvasExtent(canvas, width, height, ratio);
 
     const rightHandStave = new Vex.Flow.Stave(10, 0, staveWidth);
-    rightHandStave.addClef("treble").setKeySignature(this.props.keySignature).setContext(ctx);
+    rightHandStave
+      .addClef("treble")
+      .setKeySignature(this.props.keySignature)
+      .setContext(ctx);
 
     const leftHandStave = new Vex.Flow.Stave(10, 80, staveWidth);
-    leftHandStave.addClef("bass").setKeySignature(this.props.keySignature).setContext(ctx);
+    leftHandStave
+      .addClef("bass")
+      .setKeySignature(this.props.keySignature)
+      .setContext(ctx);
 
     this.colorizeKeys();
 
diff --git a/app/styles/chartist_modifications.less b/app/styles/chartist_modifications.less
index c35d793..51663e9 100644
--- a/app/styles/chartist_modifications.less
+++ b/app/styles/chartist_modifications.less
@@ -1,6 +1,9 @@
 /* override chartist color */
 
-.ct-chart .ct-series.ct-series-a .ct-bar, .ct-chart .ct-series.ct-series-a .ct-line, .ct-chart .ct-series.ct-series-a .ct-point, .ct-chart .ct-series.ct-series-a .ct-slice.ct-donut {
+.ct-chart .ct-series.ct-series-a .ct-bar,
+.ct-chart .ct-series.ct-series-a .ct-line,
+.ct-chart .ct-series.ct-series-a .ct-point,
+.ct-chart .ct-series.ct-series-a .ct-slice.ct-donut {
   stroke: #333 !important;
 }
 
@@ -21,7 +24,6 @@
   stroke-width: 6px;
 }
 
-
 .graph-stats .ct-slice-donut {
   stroke: #449d44;
 }
diff --git a/app/styles/checkbox.css b/app/styles/checkbox.css
index 8414f78..6a85b53 100644
--- a/app/styles/checkbox.css
+++ b/app/styles/checkbox.css
@@ -1,4 +1,4 @@
-input[type=checkbox] {
+input[type="checkbox"] {
   visibility: hidden;
 }
 
@@ -11,23 +11,30 @@ input[type=checkbox] {
   top: 0;
   border-radius: 4px;
 
-  -webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
-  -moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
-  box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
+  -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5),
+    0px 1px 0px rgba(255, 255, 255, 0.4);
+  -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5),
+    0px 1px 0px rgba(255, 255, 255, 0.4);
+  box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5),
+    0px 1px 0px rgba(255, 255, 255, 0.4);
 
   background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
   background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
   background: -o-linear-gradient(top, #222 0%, #45484d 100%);
   background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
   background: linear-gradient(top, #222 0%, #45484d 100%);
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
+  filter: progid:DXImageTransform.Microsoft.gradient(
+      startColorstr="#222",
+      endColorstr="#45484d",
+      GradientType=0
+    );
 }
 
 .setting_checkbox label:after {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
-  content: '';
+  content: "";
   position: absolute;
   width: 8px;
   height: 5px;
@@ -51,9 +58,8 @@ input[type=checkbox] {
   opacity: 0.3;
 }
 
-.setting_checkbox input[type=checkbox]:checked + label:after {
+.setting_checkbox input[type="checkbox"]:checked + label:after {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
 }
-
diff --git a/app/styles/claviature.less b/app/styles/claviature.less
index 06064fb..a6f63b1 100644
--- a/app/styles/claviature.less
+++ b/app/styles/claviature.less
@@ -8,22 +8,22 @@
     top: 0px;
     z-index: 1;
     font-size: 1.5rem;
-    background: linear-gradient(to bottom, #F3F3F3, #f0f0f0 10%, #FBFAFA);
+    background: linear-gradient(to bottom, #f3f3f3, #f0f0f0 10%, #fbfafa);
     transition: all 0.1s ease-in-out;
     margin: 0;
     display: inline-block;
     border: 1px solid #ccc;
     padding: 160px 15px 50px;
     border-radius: 0 0 5px 5px;
-    box-shadow: 0 3px 3px rgba(170, 170, 170, 0.50);
+    box-shadow: 0 3px 3px rgba(170, 170, 170, 0.5);
     position: relative;
     cursor: pointer;
     color: rgba(255, 255, 255, 0);
     &:hover {
-      color: #171C1A;
+      color: #171c1a;
     }
 
-    &:active{
+    &:active {
       box-shadow: 0 0 0 rgb(0, 0, 0, 0);
       top: 3px;
       color: #333;
@@ -44,7 +44,7 @@
     border-width: 0 6px 12px;
     border-color: #000;
     border-bottom-color: #424546;
-    background: #171C1A;
+    background: #171c1a;
     &:hover {
       color: #faf0e6;
     }
@@ -55,21 +55,22 @@
     }
   }
 
-  li:active, li.active {
+  li:active,
+  li.active {
     // by default all keys are wrong which is shown when clicked
-    background: linear-gradient(to bottom, #B50C0C, #D81313 10%, #D20909);
+    background: linear-gradient(to bottom, #b50c0c, #d81313 10%, #d20909);
     &.black-note {
-      border-color: #790C0C;
-      border-bottom-color: #5A0202;
+      border-color: #790c0c;
+      border-bottom-color: #5a0202;
     }
   }
-  li.green:active, li.green.active {
+  li.green:active,
+  li.green.active {
     color: white;
-    background: linear-gradient(to bottom, #158C0D, #2DAD3D 10%, #09A915);
+    background: linear-gradient(to bottom, #158c0d, #2dad3d 10%, #09a915);
     &.black-note {
-      border-color: #18790C;
-      border-bottom-color: #025A1D;
+      border-color: #18790c;
+      border-bottom-color: #025a1d;
     }
   }
-
 }
diff --git a/app/styles/index.less b/app/styles/index.less
index ea9642e..20725da 100644
--- a/app/styles/index.less
+++ b/app/styles/index.less
@@ -44,7 +44,7 @@ footer {
     }
   }
   h2 {
-    color: #ECECEC;
+    color: #ececec;
   }
   div.left {
     text-align: left;
@@ -55,19 +55,23 @@ footer {
   }
 
   .form-control:focus {
-    border-color: #E0E0E0;
+    border-color: #e0e0e0;
     outline: 0;
-    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
-    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(224, 224, 224, 0.6);
+    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
+      0 0 8px rgba(102, 175, 233, 0.6);
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
+      0 0 8px rgba(224, 224, 224, 0.6);
   }
 
-  .btn, .btn:focus {
+  .btn,
+  .btn:focus {
     transition: all 0.5s ease;
     background-color: transparent;
     border: 1px solid white;
     color: white;
     outline: none;
-    &:hover, &:active {
+    &:hover,
+    &:active {
       background-color: rgba(255, 255, 255, 0.15);
       border-color: white;
     }
@@ -93,7 +97,6 @@ footer {
   }
 }
 
-
 .jumbotron {
   background-color: rgba(0, 0, 0, 0.7);
   padding-top: 24px;
@@ -105,7 +108,7 @@ footer {
 .jumbotron > h1 {
   /*Kozuka Gothic ...*/
   text-align: center;
-  font-family: 'Poiret One', sans-serif;
+  font-family: "Poiret One", sans-serif;
   font-size: 70pt;
   font-weight: 100;
   color: white;
@@ -116,11 +119,10 @@ footer {
   text-align: center;
   color: white;
   margin-top: 10px;
-  font-family: 'Poiret One', sans-serif;
+  font-family: "Poiret One", sans-serif;
   margin-bottom: 20px;
 }
 
-
 #image-background {
   min-height: 100%;
   min-width: 1600px;
@@ -138,7 +140,6 @@ footer {
   right: 10px;
 }
 
-
 h1 {
   font-size: 50*2px;
 }
@@ -209,7 +210,8 @@ h1 {
   transition: all 0.5s ease;
 }
 
-li.modeNavItem a, li.modeNavItem a:focus {
+li.modeNavItem a,
+li.modeNavItem a:focus {
   background-color: transparent;
   border: 1px solid white;
   color: white;
@@ -218,7 +220,8 @@ li.modeNavItem a, li.modeNavItem a:focus {
   }
 }
 
-li.modeNavItem.active a:focus, li.modeNavItem.active a {
+li.modeNavItem.active a:focus,
+li.modeNavItem.active a {
   background-color: white;
   border: 1px solid white;
   color: black;
@@ -229,10 +232,7 @@ li.modeNavItem.active a:focus, li.modeNavItem.active a {
 }
 
 .transition {
-  transition:
-    max-height 0.4s ease,
-    height 0.4s ease,
-    margin 0.4s ease,
+  transition: max-height 0.4s ease, height 0.4s ease, margin 0.4s ease,
     opacity 0.75s ease;
   opacity: 1;
   overflow: hidden;
@@ -280,7 +280,14 @@ li.modeNavItem.active a:focus, li.modeNavItem.active a {
   margin: 25px 0;
   height: 1px;
   background: black;
-  background: -webkit-gradient(linear, 0 0, 100% 0, from(rgba(255, 255, 255, 0.0)), to(rgba(255, 255, 255, 0.0)), color-stop(50%, white));
+  background: -webkit-gradient(
+    linear,
+    0 0,
+    100% 0,
+    from(rgba(255, 255, 255, 0)),
+    to(rgba(255, 255, 255, 0)),
+    color-stop(50%, white)
+  );
 }
 
 .inlineBlock {
@@ -293,7 +300,6 @@ li.modeNavItem.active a:focus, li.modeNavItem.active a {
   margin-left: 0.5%;
 }
 
-
 .noSelect {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
@@ -311,8 +317,6 @@ li.modeNavItem.active a:focus, li.modeNavItem.active a {
   display: none;
 }
 
-
-
 .gameContainer {
   white-space: nowrap;
   overflow: hidden;
diff --git a/app/styles/star_animation.less b/app/styles/star_animation.less
index 998fa49..d15ff90 100644
--- a/app/styles/star_animation.less
+++ b/app/styles/star_animation.less
@@ -17,11 +17,19 @@
 }
 
 @keyframes rotation-1 {
-  from {transform: rotate(0deg); }
-  to {transform: rotate(360deg); }
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
 }
 
 @keyframes rotation-2 {
-  from {transform: rotate(0deg); }
-  to {transform: rotate(360deg); }
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
 }
diff --git a/package.json b/package.json
index 1f3cd3e..d26d2d5 100644
--- a/package.json
+++ b/package.json
@@ -40,7 +40,7 @@
     "babel-preset-stage-0": "^6.3.13",
     "css-loader": "^0.23.1",
     "eslint": "^3.14.1",
-    "eslint-plugin-prettier": "^2.1.2",
+    "eslint-plugin-prettier": "^2.3.1",
     "eslint-plugin-react": "^7.1.0",
     "font-awesome-webpack": "0.0.4",
     "jasmine-core": "^2.4.1",
@@ -55,7 +55,7 @@
     "less": "^2.6.0",
     "less-loader": "^2.2.2",
     "phantomjs-prebuilt": "^2.1.6",
-    "prettier": "^1.5.0",
+    "prettier": "^1.7.4",
     "react-transform-hmr": "^1.0.1",
     "style-loader": "^0.13.0",
     "url-loader": "^0.5.7",
diff --git a/webpack.config.js b/webpack.config.js
index 980f345..9c0fe0d 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -76,7 +76,10 @@ module.exports = {
         test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
         loader: "url-loader?limit=10000&minetype=application/font-woff"
       },
-      { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader" },
+      {
+        test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        loader: "file-loader"
+      },
       { test: /\.html/, loader: "file?name=[name].[ext]" }
     ]
   }