diff --git a/frcal/src/index.scss b/common/src/ui/index.scss
similarity index 95%
rename from frcal/src/index.scss
rename to common/src/ui/index.scss
index ecdcbcb..ce7cf04 100644
--- a/frcal/src/index.scss
+++ b/common/src/ui/index.scss
@@ -8,8 +8,8 @@
 @import 'bootstrap/scss/card';
 @import 'bootstrap/scss/forms';
 @import 'bootstrap/scss/root';
-@import '@common/ui/consts.scss';
-@import '@common/ui/MobileTooltip.scss';
+@import './consts.scss';
+@import './MobileTooltip.scss';
 
 body {
   padding-top: $spacer * 4;
diff --git a/frcal/src/index.tsx b/frcal/src/index.tsx
index 11c07b2..8578ae3 100644
--- a/frcal/src/index.tsx
+++ b/frcal/src/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import 'bootstrap/js/dist/collapse';
-import './index.scss';
+import '@common/ui/index.scss';
 import App from './App';
 import reportWebVitals from '@common/ui/reportWebVitals';
 import {MobileTooltipProvider} from '@common/ui/MobileTooltip';
diff --git a/jcal/src/index.scss b/jcal/src/index.scss
deleted file mode 100644
index ecdcbcb..0000000
--- a/jcal/src/index.scss
+++ /dev/null
@@ -1,100 +0,0 @@
-@import 'bootstrap/scss/functions';
-@import 'bootstrap/scss/variables';
-@import 'bootstrap/scss/mixins';
-@import 'bootstrap/scss/reboot';
-@import 'bootstrap/scss/navbar';
-@import 'bootstrap/scss/transitions';
-@import 'bootstrap/scss/type';
-@import 'bootstrap/scss/card';
-@import 'bootstrap/scss/forms';
-@import 'bootstrap/scss/root';
-@import '@common/ui/consts.scss';
-@import '@common/ui/MobileTooltip.scss';
-
-body {
-  padding-top: $spacer * 4;
-  position: relative;
-}
-
-#root {
-  max-width: $calendar-width;
-  margin: 0 auto;
-}
-
-nav.navbar {
-  background: $light;
-  position: fixed;
-  top: 0;
-  z-index: 100;
-  left: 0;
-  right: 0;
-
-  .container {
-    max-width: $calendar-width;
-    width: 100%;
-    margin: 0 auto;
-    padding: 0 1em;
-  }
-}
-
-@include media-breakpoint-down(sm) {
-  .hide-small {
-    display: none;
-  }
-}
-
-.navigate {
-  max-width: $calendar-width;
-  margin-top: $spacer;
-  @include make-container();
-
-  .go-year {
-    max-width: 7em;
-  }
-
-  .go-month, .go-day {
-    max-width: 5em;
-  }
-
-  .go-button {
-    max-width: 3em;
-  }
-}
-
-.main {
-  max-width: $calendar-width;
-  margin-top: $spacer;
-  @include make-container();
-
-  .card {
-    margin-bottom: $spacer;
-  }
-}
-
-html {
-  scroll-padding-top: $spacer * 4;
-}
-
-@supports not (scroll-padding-top: 80px) {
-  h1, h2, h3, h4, h5, h6, .footnotes li {
-    margin-top: -$spacer * 4;
-    padding-top: $spacer * 4;
-  }
-}
-
-a {
-  text-decoration: none;
-}
-
-.footer {
-  background: $light;
-  min-height: $spacer * 4;
-  padding: ($spacer * 4 - $font-size-base) / 2 0;
-
-  .container {
-    width: 100%;
-    max-width: $calendar-width;
-    margin: 0 auto;
-    padding: 0 1em;
-  }
-}
diff --git a/jcal/src/index.tsx b/jcal/src/index.tsx
index 11c07b2..8578ae3 100644
--- a/jcal/src/index.tsx
+++ b/jcal/src/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import 'bootstrap/js/dist/collapse';
-import './index.scss';
+import '@common/ui/index.scss';
 import App from './App';
 import reportWebVitals from '@common/ui/reportWebVitals';
 import {MobileTooltipProvider} from '@common/ui/MobileTooltip';