fix content stylesheet

src/app/content/content.component.scss

-@use "../vars";
-
-#content{
-  background-color: vars.$back-color;
-  padding: 20px 20%;
-  img {
-    max-width: 40%;
-  }
-}
-
-article{
-  border: 2px solid vars.$accent-color;
-  border-radius: 20px;
-  padding: 10px;
-  margin-right: 10px;
-  flex: 1 1 0;
-  width: 0;
-  box-sizing: border-box;
-  h2{
-    text-align: center;
-    margin: 0;
-  }
-
-  &:last-child{
-    margin-right: 0;
-  }
-}
-
-#blog{
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: stretch;
-}
-
-#banner img {
-  max-width: 100% !important;
-}
-.breakWord{
-  word-wrap: break-word;
-}
-
-.clickSpan{
-  color: vars.$accent-color;
-  text-decoration: underline;
-  transition: background-color vars.$link-hover-animation-time linear;
-  cursor: pointer;
-
-  &:hover{
-    color: vars.$accent-color-2;
-  }
-}
-
-#matomo-iframe {
-  border: 0;
-  height: 200px;
-  width: 600px;
-  background-color: vars.$text-color;
-}

src/app/header/header.component.scss

-@use "../vars.scss";
+@use "../../style/vars";
 
 .header-wrapper *:before {
   box-sizing: border-box;

src/style/content.scss

+@use "vars";
+
+.content{
+  background-color: vars.$back-color;
+  padding: 20px 20%;
+  img {
+    max-width: 40%;
+  }
+}
+
+article{
+  border: 2px solid vars.$accent-color;
+  border-radius: 20px;
+  padding: 10px;
+  margin-right: 10px;
+  flex: 1 1 0;
+  width: 0;
+  box-sizing: border-box;
+  h2{
+    text-align: center;
+    margin: 0;
+  }
+
+  &:last-child{
+    margin-right: 0;
+  }
+}
+
+#blog{
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: stretch;
+}
+
+#banner img {
+  max-width: 100% !important;
+}
+.breakWord{
+  word-wrap: break-word;
+}
+
+.clickSpan{
+  color: vars.$accent-color;
+  text-decoration: underline;
+  transition: background-color vars.$link-hover-animation-time linear;
+  cursor: pointer;
+
+  &:hover{
+    color: vars.$accent-color-2;
+  }
+}
+
+#matomo-iframe {
+  border: 0;
+  height: 200px;
+  width: 600px;
+  background-color: vars.$text-color;
+}

src/style/home.scss

-@use "../app/vars";
+@use "vars";
 
 .skills {
   max-height: 80px;

src/style/mobile.scss

-@use "../app/vars";
+@use "vars";
 @media only screen and (max-width: vars.$mobile-max-width) {
   #homeImage{
     float: none;
   }
-  #content{
+  .content{
     padding-left: 10px;
     padding-right: 10px;
   }

src/style/ntp.scss

-@use "../app/vars";
+@use "vars";
 
 .js-plotly-plot {
   margin-bottom: 10px;

src/style/selling.scss

-@use "../app/vars";
+@use "vars";
 
 jl-selling-table {
   table {

src/styles.scss

-@use "app/vars";
+@use "style/vars";
 @use "style/mobile";
 @use "style/ntp";
 @use "style/pwgen";
 @use "style/selling";
 @use "style/home";
+@use "style/content";
 
 html {
   scroll-behavior: smooth;