diff --git a/_basic.scss b/_basic.scss
index 32a35e8..f307c86 100644
--- a/_basic.scss
+++ b/_basic.scss
@@ -4,38 +4,48 @@
 // @import "../../vendor/normalizecss/normalize.css";
 // @import "../../node_modules/normalize.css/normalize.css";
 
+
+
+// Functions and Mixins
+// Important code constructions
+// -----------------------------------------------------------------------------
+@import "functions/all";
+@import "mixins/all";
+
+
+
 // Fonts
 // Use a central file outside of hippie for font definitions with @font-face
 // -----------------------------------------------------------------------------
 // @import "../../vendor/fonts.css";
 
-// Functions and Mixins
-// Important code constructions
-// -----------------------------------------------------------------------------
-@forward "functions/color";
-@forward "mixins";
+
 
 // Global configuration with default values
 // -----------------------------------------------------------------------------
-@forward "global/config";
-@forward "global/common";
-@forward "global/typography";
+@import "global/config";
+
+
 
 // Basic styles - this is the core of definitions
 // Individual styles can be added her
 // -----------------------------------------------------------------------------
+@import "global/common";
+@import "global/typography";
 // Following the w3c document element structure
 // https://w3c.github.io/html/index.html#contents
-@forward "elements/sections";
-@forward "elements/grouping";
-@forward "elements/textlevel";
-@forward "elements/embedded";
-@forward "elements/tables";
-@forward "elements/interactive";
+@import "elements/sections";
+@import "elements/grouping";
+@import "elements/textlevel";
+@import "elements/embedded";
+@import "elements/tables";
+@import "elements/interactive";
+
+
 
 // Individual Modules and variables
 // in dependency to other styles
 // -----------------------------------------------------------------------------
-@forward "modules/breakpoint/breakpoint_module";
-@forward "modules/tables/tables_module";
-@forward "modules/maintenance/maintenance_module";
+@import "modules/breakpoint/breakpoint_module";
+@import "modules/tables/tables_module";
+@import "modules/maintenance/maintenance_module";
diff --git a/_hippie.scss b/_hippie.scss
index 830afcd..1f2c51d 100644
--- a/_hippie.scss
+++ b/_hippie.scss
@@ -21,13 +21,13 @@
     - Maintenance
 *
  */
-@forward "basic";
+@import "basic";
 
 // Additional Modules and variables
 // in dependency to other basic styles
 // -----------------------------------------------------------------------------
-@forward "modules/io/io_module";
-@forward "modules/navigation/nav_module";
-@forward "modules/editor/editor_module";
-@forward "modules/explanation/explanation_module";
-@forward "modules/print/print_module";
+@import "modules/io/io_module";
+@import "modules/navigation/nav_module";
+@import "modules/editor/editor_module";
+@import "modules/explanation/explanation_module";
+@import "modules/print/print_module";
diff --git a/elements/_grouping.scss b/elements/_grouping.scss
index 54e6ea4..df30a37 100644
--- a/elements/_grouping.scss
+++ b/elements/_grouping.scss
@@ -1,10 +1,5 @@
 @use "sass:color";
 
-@use "../global/config";
-@use "../global/common";
-@use "../global/typography";
-@use "../functions/color" as *;
-
 // Grouping content
 // -----------------------------------------------------------------------------
 // p
@@ -30,18 +25,18 @@
 // -----------------------------------------------------------------------------
 p {
 	@extend %basic;
-	margin-top: config.$space_basic;
-	margin-bottom: config.$space_basic;
+	margin-top: $space_basic;
+	margin-bottom: $space_basic;
 
 	code {
-		padding: config.$space_tiny config.$space_half;
+		padding: $space_tiny $space_half;
 		font-size: 1em;
 		line-height: 1;
 	}
 }
 
 .column_line {
-	column-rule: config.$border_basic;
+	column-rule: $border_basic;
 }
 
 .column_2,
@@ -51,35 +46,35 @@ p {
 
 .column_2 {
 	column-count: 2;
-	column-gap: config.$space_small;
+	column-gap: $space_small;
 }
 
 .column_3 {
 	column-count: 3;
-	column-gap: config.$space_medium;
+	column-gap: $space_medium;
 }
 
 // Address
 // -----------------------------------------------------------------------------
 address {
 	// @extend %basic;
-	margin-top: config.$space_double;
-	margin-bottom: config.$space_double;
+	margin-top: $space_double;
+	margin-bottom: $space_double;
 }
 
 // Line
 // -----------------------------------------------------------------------------
 hr {
-	margin-top: config.$space_small;
-	margin-bottom: config.$space_small;
-	border-width: config.$width_border_basic 0 0;
+	margin-top: $space_small;
+	margin-bottom: $space_small;
+	border-width: $width_border_basic 0 0;
 	border-style: solid;
-	border-color: config.$color_border_basic;
+	border-color: $color_border_basic;
 
 	&.vertical {
 		display: inline;
-		margin: 0 config.$space_double;
-		border-width: 0 config.$width_border_basic 0 0;
+		margin: 0 $space_double;
+		border-width: 0 $width_border_basic 0 0;
 	}
 }
 
@@ -96,7 +91,7 @@ hr {
 .hr_double {
 	@extend hr;
 	height: 4px;
-	border-width: config.$width_border_basic 0;
+	border-width: $width_border_basic 0;
 }
 
 // Preformat
@@ -108,12 +103,12 @@ pre {
 
 .pre_code {
 	overflow-x: auto;
-	border-color: color.scale(config.$color_back_basic, $lightness: -(config.$color_diff_tiny));
+	border-color: color.scale($color_back_basic, $lightness: -$color_diff_tiny);
 	border-style: dotted;
-	border-width: 0 0 0 config.$width_border_4;
-	border-radius: config.$radius_basic;
-	padding: config.$space_basic;
-	background-color: color.scale(config.$color_back_basic, $lightness: config.$color_diff_tiny);
+	border-width: 0 0 0 $width_border_4;
+	border-radius: $radius_basic;
+	padding: $space_basic;
+	background-color: color.scale($color_back_basic, $lightness: $color_diff_tiny);
 
 	code {
 		background-color: transparent;
@@ -123,9 +118,9 @@ pre {
 // Quote
 // -----------------------------------------------------------------------------
 blockquote {
-	margin: config.$space_basic 0;
-	padding-right: config.$indent_basic;
-	padding-left: config.$indent_basic;
+	margin: $space_basic 0;
+	padding-right: $indent_basic;
+	padding-left: $indent_basic;
 }
 
 .quote_mark {
@@ -151,12 +146,12 @@ blockquote {
 dl,
 ul,
 ol {
-	margin: config.$space_double 0;
+	margin: $space_double 0;
 }
 
 ul,
 ol {
-	padding-left: config.$indent_basic;
+	padding-left: $indent_basic;
 
 	&.horizontal {
 		overflow: auto;
@@ -172,7 +167,7 @@ menu {
 }
 
 dl {
-	margin-left: config.$indent_basic;
+	margin-left: $indent_basic;
 }
 
 li,
@@ -183,11 +178,11 @@ dd {
 
 dd,
 .list_basic li {
-	margin-bottom: config.$space_basic;
+	margin-bottom: $space_basic;
 }
 
 dd {
-	margin-left: config.$indent_basic;
+	margin-left: $indent_basic;
 }
 
 ul {
@@ -211,16 +206,16 @@ ul {
 
 .list_link {
 	li {
-		margin-bottom: config.$space_tiny * 2;
+		margin-bottom: $space_tiny * 2;
 		text-transform: uppercase;
 
 		a {
 			display: block;
-			padding: config.$padding_basic;
-			color: config.$color_text_basic;
+			padding: $padding_basic;
+			color: $color_text_basic;
 
 			img {
-				margin-right: config.$space_basic;
+				margin-right: $space_basic;
 				padding-bottom: 0.2em;
 				vertical-align: text-bottom;
 			}
@@ -228,8 +223,8 @@ ul {
 			&:active,
 			&:focus,
 			&:hover {
-				background-color: config.$color_action_basic;
-				color: config.$color_highlight_basic;
+				background-color: $color_action_basic;
+				color: $color_highlight_basic;
 			}
 		}
 	}
@@ -238,12 +233,12 @@ ul {
 // Embedded
 // -----------------------------------------------------------------------------
 figure {
-	margin: config.$space_double config.$indent_basic;
+	margin: $space_double $indent_basic;
 }
 
 figcaption {
 	@extend %basic;
-	color: config.$color_darker;
+	color: $color_darker;
 }
 
 // Main content
@@ -255,9 +250,9 @@ main {}
 div {}
 
 .div_info {
-	padding: config.$space_double config.$indent_basic;
-	border-right: config.$space_basic solid rgba(basic_color(echo), 0.6);
-	background-color: rgba(basic_color(echo), 0.1) !important;
+	padding: $space_double $indent_basic;
+	border-right: $space_basic solid rgba($echo_color, 0.6);
+	background-color: rgba($echo_color, 0.1) !important;
 }
 
 .box_space {
@@ -269,7 +264,7 @@ div {}
 .box_cube {
 	float: left;
 	display: table;
-	width: config.$space_medium;
+	width: $space_medium;
 	text-align: center;
 	vertical-align: middle;
 
@@ -280,21 +275,21 @@ div {}
 
 .box_placeholder {
 	width: 100%;
-	height: config.$space_medium;
-	border: config.$width_border_4 solid color.adjust(basic_color(alpha), $alpha: -0.1);
-	border-radius: config.$radius_basic;
-	background-color: color.adjust(basic_color(alpha), $alpha: -0.2);
+	height: $space_medium;
+	border: $width_border_4 solid color.adjust($alpha_color, $alpha: -0.1);
+	border-radius: $radius_basic;
+	background-color: color.adjust($alpha_color, $alpha: -0.2);
 }
 
 .box_placeholder_bkg {
 	width: 100%;
-	height: config.$space_medium * 2;
-	border: config.$width_border_4 solid color.adjust(config.$color_front_basic, $alpha: -0.1);
-	border-radius: config.$radius_basic;
-	padding: config.$space_basic;
+	height: $space_medium * 2;
+	border: $width_border_4 solid color.adjust($color_front_basic, $alpha: -0.1);
+	border-radius: $radius_basic;
+	padding: $space_basic;
 	/*data:[<mime type>][;charset=<charset>][;base64],<encoded data>*/
 	background: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0' y='0' width='100%' height='100%'><line x1='0' y1='0' x2='100%' y2='100%' stroke='%23FFF' stroke-width='.5'/><line x1='0' y1='100%' x2='100%' y2='0' stroke='%23FFF' stroke-width='.5'/></svg>") no-repeat;
-	background-color: color.adjust(config.$color_front_basic, $alpha: -0.1);
+	background-color: color.adjust($color_front_basic, $alpha: -0.1);
 }
 
 .box_file_tile {
@@ -313,7 +308,7 @@ div {}
 // Grid
 .grid {
 	display: grid;
-	grid-gap: config.$space_basic;
+	grid-gap: $space_basic;
 
 	&>input,
 	&>select,
@@ -322,8 +317,8 @@ div {}
 	}
 
 	&>label {
-		margin: config.$width_border_io;
-		padding: config.$space_half;
+		margin: $width_border_io;
+		padding: $space_half;
 	}
 }
 
diff --git a/elements/_interactive.scss b/elements/_interactive.scss
index e5ec7c2..d36f6fc 100644
--- a/elements/_interactive.scss
+++ b/elements/_interactive.scss
@@ -1,8 +1,5 @@
 @use "sass:color";
 
-@use "../global/config";
-@use "../global/typography";
-
 // Forms
 // -----------------------------------------------------------------------------
 // form
@@ -37,12 +34,12 @@ label {
 label,
 p {
 	input, button, textarea, select {
-		margin: 0 config.$space_basic;
+		margin: 0 $space_basic;
 	}
 }
 
 input + label {
-	margin-left: config.$space_basic;
+	margin-left: $space_basic;
 }
 
 // Input
@@ -51,11 +48,11 @@ input {
 }
 
 label + input {
-	margin-left: config.$space_basic;
+	margin-left: $space_basic;
 }
 
 input, button, textarea, select {
-	margin: config.$margin_inline;
+	margin: $margin_inline;
 
 	&[disabled="disabled"],
 	&[disabled] {
@@ -70,7 +67,7 @@ td > textarea {
 	margin: 0;
 }
 
-@each $input in config.$io_input_list, textarea, select {
+@each $input in $io_input_list, textarea, select {
 	#{$input} {
 		@extend %basic_mono;
 		line-height: 1;
@@ -79,50 +76,50 @@ td > textarea {
 
 // TODO: Move to io_module
 .input_io, .button_io, .io_textarea, .io_select {
-	margin: config.$margin_io;
+	margin: $margin_io;
 }
 
 .input_io, .io_textarea, .io_select {
-	padding: config.$space_half;
-	color: config.$color_text_io;
-	background-color: config.$color_back_io;
+	padding: $space_half;
+	color: $color_text_io;
+	background-color: $color_back_io;
 
 	&:hover {
-		background-color: config.$color_highlight_basic;
+		background-color: $color_highlight_basic;
 	}
 
 	&[readonly="readonly"],
 	&[readonly] {
-		background-color: color.scale(config.$color_back_io, $lightness: -(config.$color_diff_double));
+		background-color: color.scale($color_back_io, $lightness: -$color_diff_double);
 	}
 
 	&[disabled="disabled"],
 	&[disabled] {
 		&:hover {
-			background-color: config.$color_back_io;
+			background-color: $color_back_io;
 		}
 	}
 }
 
-@each $input in config.$io_date_list {
+@each $input in $io_date_list {
 	#{$input} {
 		padding-top: 0;
 		padding-bottom: 0;
 	}
 }
 
-@each $input in config.$io_input_list, textarea {
+@each $input in $io_input_list, textarea {
 	#{$input} {
 		// border: $border_io;
 	}
 }
 
 .input_io, .io_textarea {
-	border: config.$border_io;
+	border: $border_io;
 
 	&[readonly="readonly"],
 	&[readonly] {
-		border-color: color.scale(config.$color_border_io, $lightness: -(config.$color_diff_double));
+		border-color: color.scale($color_border_io, $lightness: -$color_diff_double);
 	}
 
 	&[disabled="disabled"],
@@ -134,16 +131,16 @@ td > textarea {
 // Fieldset
 // -----------------------------------------------------------------------------
 fieldset {
-	margin: config.$margin_double;
-	padding: config.$space_basic;
-	border: config.$border_basic;
+	margin: $margin_double;
+	padding: $space_basic;
+	border: $border_basic;
 }
 
 // Legend
 // -----------------------------------------------------------------------------
 legend {
 	@extend %basic;
-	padding: 0 config.$space_half;
+	padding: 0 $space_half;
 }
 
 // Button
@@ -154,26 +151,26 @@ button {
 
 .button_io {
 	@extend %basic;
-	border: config.$width_border_io solid config.$color_border_button;
-	padding: config.$padding_basic;
-	color: config.$color_text_button;
-	background-color: config.$color_back_button;
+	border: $width_border_io solid $color_border_button;
+	padding: $padding_basic;
+	color: $color_text_button;
+	background-color: $color_back_button;
 	user-select: none;
 
 	&:hover {
 		// border-color: #0059F6;
 		border-color: transparent;
 		color: white;
-		background-color: config.$color_action_basic;
+		background-color: $color_action_basic;
 	}
 
 	&[disabled="disabled"],
 	&[disabled] {
 		border-color: transparent;
-		color: color.scale(config.$color_text_button, $lightness: config.$color_diff_double);
+		color: color.scale($color_text_button, $lightness: $color_diff_double);
 
 		&:hover {
-			background-color: config.$color_back_button;
+			background-color: $color_back_button;
 		}
 	}
 }
@@ -190,7 +187,7 @@ button {
 	}
 
 	&:hover {
-		background-color: config.$color_action_basic;
+		background-color: $color_action_basic;
 	}
 }
 
diff --git a/elements/_sections.scss b/elements/_sections.scss
index 32a1a9a..f1fbfaa 100644
--- a/elements/_sections.scss
+++ b/elements/_sections.scss
@@ -1,8 +1,3 @@
-@use "../global/config";
-@use "../global/common";
-@use "../elements/interactive";
-@use "../mixins/media_query" as *;
-
 @use "sass:map";
 
 // Root
@@ -12,6 +7,7 @@ html {
 }
 
 
+
 // Sections
 // -----------------------------------------------------------------------------
 // body
@@ -25,17 +21,18 @@ html {
 // footer
 
 
+
 // Body
 // -----------------------------------------------------------------------------
 body {
 	position: relative;
-	box-sizing: config.$box_sizing;
+	box-sizing: $box_sizing;
 	margin: 0;
-	font-family: config.$family_text_basic;
-	font-size: config.$size_text_basic;
-	line-height: config.$line_text_basic;
-	color: config.$color_text_basic;
-	background-color: config.$color_back_basic;
+	font-family: $family_text_basic;
+	font-size: $size_text_basic;
+	line-height: $line_text_basic;
+	color: $color_text_basic;
+	background-color: $color_back_basic;
 
 	*,
 	::before,
@@ -44,46 +41,44 @@ body {
 	}
 
 	&:hover {
-		#mouse-overlay {
+		.mouse_over {
 			background-color: transparent !important;
-			transition: background-color config.$duration_basic config.$timing_basic 0s !important;
+			transition: background-color $duration_basic $timing_basic 0s !important;
 		}
 	}
 }
 
 // Article
 // -----------------------------------------------------------------------------
-article {
-}
+article {}
 
 // Section
 // -----------------------------------------------------------------------------
-section {
-}
+section {}
 
 .sec_main_center {
-	width: config.$width_basic;
+	width: $width_basic;
 	margin: 0 auto;
-	padding-top: config.$space_small;
+	padding-top: $space_small;
 
 	@include forTabletPortraitUp {
-		width: config.$width_small;
+		width: $width_small;
 	}
 
 	@include forTabletLandscapeUp {
-		width: config.$width_medium;
+		width: $width_medium;
 	}
 
 	@include forBigDesktopUp {
-		width: config.$width_large;
+		width: $width_large;
 	}
 }
 
 .sec_main_status {
-	border-top-width: config.$width_border_8;
+	border-top-width: $width_border_8;
 	border-top-style: solid;
-	border-color: config.$color_border_basic;
-	padding-top: config.$space_small;
+	border-color: $color_border_basic;
+	padding-top: $space_small;
 }
 
 // Navigation
@@ -102,14 +97,14 @@ nav {
 // Aside element
 // -----------------------------------------------------------------------------
 aside {
-	width: config.$width_aside_basic;
+	width: $width_aside_basic;
 
-	&.right + .bside {
-		margin-right: calc(#{config.$width_aside_basic} + #{config.$space_basic});
+	&.right+.bside {
+		margin-right: calc(#{$width_aside_basic} + #{$space_basic});
 	}
 
-	&.left + .bside {
-		margin-left: calc(#{config.$width_aside_basic} + #{config.$space_basic});
+	&.left+.bside {
+		margin-left: calc(#{$width_aside_basic} + #{$space_basic});
 	}
 
 	&.right {
@@ -155,9 +150,9 @@ aside {
 		}
 
 		ul.vertical li {
-			margin-bottom: config.$space_half;
+			margin-bottom: $space_half;
 
-			.a_button > i:last-child {
+			.a_button>i:last-child {
 				margin-left: auto;
 			}
 		}
@@ -177,54 +172,54 @@ h6 {
 
 h1 {
 	@extend %head_1;
-	margin: config.$space_large 0 config.$space_small;
+	margin: $space_large 0 $space_small;
 }
 
 h2 {
 	@extend %head_2;
-	margin: config.$space_medium 0 config.$space_small;
+	margin: $space_medium 0 $space_small;
 }
 
-h1 + h1,
-h2 + h2 {
+h1+h1,
+h2+h2 {
 	margin-top: 0;
 }
 
 h3 {
 	@extend %head_3;
-	margin: config.$space_double 0;
+	margin: $space_double 0;
 	text-transform: uppercase;
 }
 
 h4 {
 	@extend %head_3;
-	margin: config.$space_double 0;
+	margin: $space_double 0;
 	text-transform: none;
 }
 
 h5 {
 	@extend %head_4;
-	margin: config.$space_double 0 config.$space_basic;
+	margin: $space_double 0 $space_basic;
 	text-transform: none;
 }
 
 h6 {
 	@extend %basic;
-	margin: config.$space_basic 0;
+	margin: $space_basic 0;
 	text-transform: none;
 	font-weight: bold;
 }
 
 hgroup {
 
-	& > h1,
-	& > h2 {
+	&>h1,
+	&>h2 {
 		margin-bottom: 0;
 
 	}
 
-	& > p {
-		margin-bottom: config.$space_small;
+	&>p {
+		margin-bottom: $space_small;
 	}
 }
 
@@ -232,13 +227,13 @@ hgroup {
 // -----------------------------------------------------------------------------
 header {
 	&.io {
-		z-index: map.get(config.$z-indexes, "content-top");
+		z-index: map.get($z-indexes, "content-top");
 
-		& > *:last-child *:last-child {
+		&>*:last-child *:last-child {
 			margin-right: 0;
 		}
 
-		& > *:first-child *:first-child {
+		&>*:first-child *:first-child {
 			margin-left: 0;
 		}
 
@@ -263,11 +258,11 @@ header {
 }
 
 .header_txt {
-	margin-bottom: config.$space_small;
-	border-bottom: config.$border_dotted;
+	margin-bottom: $space_small;
+	border-bottom: $border_dotted;
 
 	h1 {
-		border-top: config.$border_basic;
+		border-top: $border_basic;
 	}
 }
 
@@ -284,7 +279,7 @@ footer {
 			button,
 			span,
 			div:not(.spacer) {
-				padding: 0 config.$space_half !important;
+				padding: 0 $space_half !important;
 			}
 		}
 	}
diff --git a/elements/_tables.scss b/elements/_tables.scss
index 2934aba..94e6b4e 100644
--- a/elements/_tables.scss
+++ b/elements/_tables.scss
@@ -1,10 +1,5 @@
 @use "sass:color";
 
-@use "../global/config";
-@use "../global/common";
-@use "../global/typography";
-@use "../elements/grouping";
-
 // Tabular data
 // -----------------------------------------------------------------------------
 // table
@@ -23,21 +18,21 @@
 // Table
 // -----------------------------------------------------------------------------
 table {
-	margin: config.$margin_double;
-	border: config.$border_basic;
+	margin: $margin_double;
+	border: $border_basic;
 	border-collapse: collapse;
 }
 
 .table_blank {
-	border: config.$width_border_basic solid transparent;
+	border: $width_border_basic solid transparent;
 
 	th, td {
-		border: config.$width_border_basic solid transparent;
+		border: $width_border_basic solid transparent;
 	}
 }
 
 .table_free {
-	border: config.$width_border_basic solid transparent;
+	border: $width_border_basic solid transparent;
 }
 
 .table_stripe {
@@ -47,7 +42,7 @@ table {
 	}
 
 	tr:nth-child(even) td {
-		background-color: color.scale(config.$color_back_basic, $lightness: config.$color_diff_tiny);
+		background-color: color.scale($color_back_basic, $lightness: $color_diff_tiny);
 	}
 }
 
@@ -63,8 +58,8 @@ table {
 // -----------------------------------------------------------------------------
 caption {
 	@extend p;
-	padding: config.$space_half 0;
-	border: config.$border_dotted;
+	padding: $space_half 0;
+	border: $border_dotted;
 	text-align: center;
 }
 
@@ -95,7 +90,7 @@ thead {
 tfoot {
 
 	tr:first-child td {
-		border-top: config.$border_basic;
+		border-top: $border_basic;
 	}
 }
 
@@ -109,17 +104,17 @@ tr {
 // -----------------------------------------------------------------------------
 th, td {
 	@extend %basic;
-	padding: config.$space_half;
+	padding: $space_half;
 }
 
 th {
-	border: config.$border_basic;
+	border: $border_basic;
 	text-align: left;
 }
 
 td {
-	border-right: config.$border_basic;
-	border-bottom: config.$border_basic;
+	border-right: $border_basic;
+	border-bottom: $border_basic;
 }
 
 td:last-child {
@@ -133,5 +128,5 @@ td:last-child {
 .cell_pre {
 	// border-right-width: $width_border_4;
 	// border-right-color: color.scale($color_back_basic, $lightness: $color_diff_basic);
-	background-color: color.scale(config.$color_back_basic, $lightness: config.$color_diff_tiny);
+	background-color: color.scale($color_back_basic, $lightness: $color_diff_tiny);
 }
diff --git a/elements/_textlevel.scss b/elements/_textlevel.scss
index 3d94607..71de523 100644
--- a/elements/_textlevel.scss
+++ b/elements/_textlevel.scss
@@ -1,9 +1,5 @@
 @use "sass:color";
 
-@use "../global/config";
-@use "../global/typography";
-@use "../functions/color" as *;
-
 // Text-Level semantics
 // -----------------------------------------------------------------------------
 // a
@@ -43,69 +39,69 @@
 // Links
 // -----------------------------------------------------------------------------
 a {
-	color: config.$color_link_basic;
+	color: $color_link_basic;
 	//  color: color.scale($color_action_basic, $lightness: 20%);
 	text-decoration: none;
 
 	&:active,
 	&:focus,
 	&:hover {
-		color: config.$color_highlight_basic;
+		color: $color_highlight_basic;
 	}
 }
 
 .a_internal {
-	color: basic_color(charlie);
+	color: $charlie_color;
 }
 
 .a_external {
-	color: basic_color(delta);
+	color: $delta_color;
 }
 
 .a_discreet {
-	color: config.$color_text_basic;
+	color: $color_text_basic;
 }
 
 .a_line {
-	border-bottom-width: config.$space_tiny;
+	border-bottom-width: $space_tiny;
 	border-bottom-style: dotted;
-	border-color: config.$color_border_basic;
-	color: config.$color_text_basic;
+	border-color: $color_border_basic;
+	color: $color_text_basic;
 	background-color: transparent;
-	transition: color config.$duration_basic config.$timing_basic;
+	transition: color $duration_basic $timing_basic;
 
 	&:active,
 	&:focus,
 	&:hover {
-		color: config.$color_highlight_basic;
-		background-color: config.$color_action_basic;
+		color: $color_highlight_basic;
+		background-color: $color_action_basic;
 	}
 }
 
 .a_button {
 	display: inline-block;
-	padding: config.$padding_basic;
-	border-radius: config.$radius_basic;
-	background-color: color.adjust(config.$color_link_basic, $alpha: -0.8);
+	padding: $padding_basic;
+	border-radius: $radius_basic;
+	background-color: color.adjust($color_link_basic, $alpha: -0.8);
 
 	&:active,
 	&:focus,
 	&:hover {
 		border-color: transparent;
-		background-color: color.adjust(config.$color_highlight_basic, $alpha: -0.8);
+		background-color: color.adjust($color_highlight_basic, $alpha: -0.8);
 	}
 }
 
 .a_button_text {
 	@extend .a_button;
-	padding: config.$padding_link;
-	color: config.$color_text_basic;
+	padding: $padding_link;
+	color: $color_text_basic;
 	background-color: transparent;
 }
 
 .a_button_border {
 	@extend .a_button_text;
-	border: config.$border_basic;
+	border: $border_basic;
 }
 
 
@@ -116,7 +112,7 @@ i, em {
 }
 
 .i_bright {
-	color: config.$color_highlight_basic;
+	color: $color_highlight_basic;
 	font-style: normal;
 }
 
@@ -200,14 +196,14 @@ time {
 // -----------------------------------------------------------------------------
 code {
 	@extend %basic_mono;
-	color: color.scale(config.$color_text_basic, $lightness: config.$color_diff_basic);
-	background-color: color.scale(config.$color_back_basic, $lightness: config.$color_diff_tiny);
+	color: color.scale($color_text_basic, $lightness: $color_diff_basic);
+	background-color: color.scale($color_back_basic, $lightness: $color_diff_tiny);
 }
 
 .code_solo {
 	@extend %basic_mono;
-	padding: config.$space_tiny config.$space_half;
-	color: config.$color_text_basic;
+	padding: $space_tiny $space_half;
+	color: $color_text_basic;
 }
 
 // Variable
@@ -228,12 +224,12 @@ kbd {
 	@extend %basic_mono;
 	// font-size: .9em;
 	// font-weight: bold;
-	padding: 0 config.$space_half;
-	border-width: config.$width_border_basic;
+	padding: 0 $space_half;
+	border-width: $width_border_basic;
 	border-style: solid;
-	border-color: config.$color_darker;
-	border-radius: config.$radius_basic;
-	color: color.scale(config.$color_text_basic, $lightness: config.$color_diff_basic);
+	border-color: $color_darker;
+	border-radius: $radius_basic;
+	color: color.scale($color_text_basic, $lightness: $color_diff_basic);
 }
 
 // Sub- and superscript
@@ -251,22 +247,22 @@ u {
 // Marks
 // -----------------------------------------------------------------------------
 mark {
-	background-color: basic_color(alpha);
+	background-color: $alpha_color;
 }
 
 .mark_cursor {
-	color: color.invert(config.$color_text_basic);
-	background-color: config.$color_text_basic;
+	color: color.invert($color_text_basic);
+	background-color: $color_text_basic;
 }
 
 ::-moz-selection {
-	color: color.invert(config.$color_text_basic);
-	background-color: config.$color_text_basic;
+	color: color.invert($color_text_basic);
+	background-color: $color_text_basic;
 }
 
 ::selection {
-	color: color.invert(config.$color_text_basic);
-	background-color: config.$color_text_basic;
+	color: color.invert($color_text_basic);
+	background-color: $color_text_basic;
 }
 
 // Text direction
diff --git a/functions/_all.scss b/functions/_all.scss
new file mode 100644
index 0000000..4acf406
--- /dev/null
+++ b/functions/_all.scss
@@ -0,0 +1,3 @@
+@import "color";
+@import "shade";
+@import "tint";
diff --git a/functions/_color.scss b/functions/_color.scss
index a7f1fa8..11fbfac 100644
--- a/functions/_color.scss
+++ b/functions/_color.scss
@@ -1,8 +1,6 @@
 @use "sass:map";
 @use "sass:color";
 
-@use "../global/config";
-
 @function createColorMap($color, $percentage, $opacity) {
   $map: (
     base: $color,
@@ -13,6 +11,6 @@
   @return $map;
 }
 
-@function basic_color($key: 'alpha', $map: config.$color_palette) {
-  @return map.get($map, $key);
+@function basic_color($key: 'alpha') {
+  @return map.get($color_palette, $key);
 }
diff --git a/functions/_index.scss b/functions/_index.scss
deleted file mode 100644
index 580266b..0000000
--- a/functions/_index.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-@use "color" as *;
-@use "shade";
-@use "tint";
diff --git a/global/_common.scss b/global/_common.scss
index c39eacf..fc42881 100644
--- a/global/_common.scss
+++ b/global/_common.scss
@@ -1,13 +1,8 @@
+// Common styles for global usage
+// -----------------------------------------------------------------------------
 @use "sass:math";
 @use "sass:color";
 
-@use "config";
-@use "../functions/color" as *;
-@use "../mixins/media_query" as *;
-@use "../mixins/user_agent" as *;
-
-// Common styles for global usage
-// -----------------------------------------------------------------------------
 
 // General classes
 // -----------------------------------------------------------------------------
@@ -21,13 +16,13 @@
 	*,
 	::before,
 	::after {
-		box-sizing: config.$box_sizing;
+		box-sizing: $box_sizing;
 	}
 }
 
 %size_io_button {
-	border: config.$width_border_io solid transparent;
-	padding: config.$padding_basic;
+	border: $width_border_io solid transparent;
+	padding: $padding_basic;
 }
 
 .di_none {
@@ -57,10 +52,10 @@
 	margin-left: 37.5%;
 }
 
-@each $size, $variable in (basic, #{config.$space_basic}),
-	(small, #{config.$space_small}),
-	(medium, #{config.$space_medium}),
-	(large, #{config.$space_large}) {
+@each $size, $variable in (basic, #{$space_basic}),
+	(small, #{$space_small}),
+	(medium, #{$space_medium}),
+	(large, #{$space_large}) {
 	.space_top_#{$size} {
 		margin-top: $variable;
 	}
@@ -114,22 +109,22 @@
 
 .wrap_center {
 	& > * {
-		margin-right: math.div((100% - config.$width_basic), 2);
-		margin-left: math.div((100% - config.$width_basic), 2);
+		margin-right: math.div((100% - $width_basic), 2);
+		margin-left: math.div((100% - $width_basic), 2);
 
 		@include forTabletPortraitUp {
-			margin-right: math.div((100% - config.$width_small), 2);
-			margin-left: math.div((100% - config.$width_small), 2);
+			margin-right: math.div((100% - $width_small), 2);
+			margin-left: math.div((100% - $width_small), 2);
 		}
 
 		@include forTabletLandscapeUp {
-			margin-right: math.div((100% - config.$width_medium), 2);
-			margin-left: math.div((100% - config.$width_medium), 2);
+			margin-right: math.div((100% - $width_medium), 2);
+			margin-left: math.div((100% - $width_medium), 2);
 		}
 
 		@include forBigDesktopUp {
-			margin-right: math.div((100% - config.$width_large), 2);
-			margin-left: math.div((100% - config.$width_large), 2);
+			margin-right: math.div((100% - $width_large), 2);
+			margin-left: math.div((100% - $width_large), 2);
 		}
 	}
 }
@@ -160,7 +155,7 @@
 
 .float_space_left {
 	float: left;
-	margin-right: config.$space_small;
+	margin-right: $space_small;
 }
 
 .float_half_size {
@@ -188,14 +183,14 @@
 	flex-wrap: wrap;
 	align-items: flex-start;
 	justify-content: flex-start;
-	gap: config.$space_half config.$space_basic;
+	gap: $space_half $space_basic;
 }
 
 %flex-column,
 %flex-row {
 	display: flex;
 	flex-wrap: nowrap;
-	gap: config.$space_basic;
+	gap: $space_basic;
 }
 
 %flex-column {
@@ -257,31 +252,31 @@
 
 .pos_full_view {
 	@extend %viewport_fixed;
-	background-color: rgba(basic_color(alpha), 0.5);
+	background-color: rgba($alpha_color, 0.5);
 }
 
 .pos_full_page {
 	@extend %full_parent;
-	background-color: rgba(basic_color(charlie), 0.25);
+	background-color: rgba($charlie_color, 0.25);
 }
 
 .hover_back_change {
-	background-color: config.$color_darker;
+	background-color: $color_darker;
 	transition: background-color 0.2s ease-in-out;
 
 	&:hover {
-		background-color: config.$color_back_basic;
+		background-color: $color_back_basic;
 	}
 }
 
-#mouse-overlay {
+.mouse_over {
 	@extend %viewport_fixed;
-	z-index: config.$z_heaven;
-	transition: background-color config.$duration_long config.$timing_basic config.$duration_long;
+	z-index: $z_heaven;
+	transition: background-color $duration_long $timing_basic $duration_long;
 	pointer-events: none;
 
 	&.active {
-		background-color: color.adjust(config.$color_darkest, $alpha: -0.5);
+		background-color: color.adjust($color_darkest, $alpha: -0.5);
 	}
 }
 
@@ -289,11 +284,11 @@
 // Colors
 // -----------------------------------------------------------------------------
 .txt_color_light {
-	color: config.$color_brighter;
+	color: $color_brighter;
 }
 
 .txt_color_dark {
-	color: config.$color_darker;
+	color: $color_darker;
 }
 
 
@@ -316,7 +311,7 @@
 }
 
 .txt_hero {
-	font-size: config.$size_hero;
+	font-size: $size_hero;
 }
 
 .txt_center {
@@ -348,12 +343,8 @@
 }
 
 .txt_gradient {
-	background: linear-gradient(165deg, basic_color(alpha) 30%, basic_color(bravo) 45%, basic_color(charlie) 50%, basic_color(delta), basic_color(echo) 80%, basic_color(foxtrot));
+	background: linear-gradient(165deg, $alpha_color 30%, $bravo_color 45%, $charlie_color 50%, $delta_color, $echo_color 80%, $foxtrot_color);
 	background-clip: text;
 	-webkit-background-clip: text;
 	-webkit-text-fill-color: transparent;
-}
-
-// Focus
-// -----------------------------------------------------------------------------
-@include overrideUserAgent(config.$no_agent_focus, config.$io_focus_list);
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/global/_config.scss b/global/_config.scss
index cb3bd3f..42b6a91 100644
--- a/global/_config.scss
+++ b/global/_config.scss
@@ -6,6 +6,7 @@
 // ------------------------------------------------------------------------------
 
 
+
 // TEXT
 // ------------------------------------------------------------------------------
 $size_text_basic: 17px !default;
@@ -66,6 +67,7 @@ $family_text_card: #{'Trebuchet MS', 'Roboto', 'Segoe UI', 'Liberation Sans', 'S
 $family_head_basic: $family_text_basic !default;
 
 
+
 // COLORS
 // ------------------------------------------------------------------------------
 $color_palette: (
@@ -76,6 +78,8 @@ $color_palette: (
 	echo: #52bed1,
 	foxtrot: #0c85ff) !default;
 
+@include addDefaultColors;
+
 $color_diff_basic: 12% !default;
 $color_diff_tiny: 4% !default;
 $color_diff_double: $color_diff_basic * 2;
@@ -95,13 +99,25 @@ $color_brighter: color.scale($color_back_basic, $lightness: $color_diff_basic);
 $color_bright: color.scale($color_brightest, $lightness: -$color_diff_double);
 
 $color_head_basic: $color_text_basic !default;
-$color_link_basic: map.get($color_palette, delta) !default;
+$color_link_basic: $delta_color !default;
 $color_highlight_basic: $color_front_basic !default;
-$color_action_basic: map.get($color_palette, foxtrot) !default;
+$color_action_basic: $foxtrot_color !default;
+
 
 // default shadow colors
 // $shadow_color: fade-out($color_medium, 0.5);
 
+$color_list: (
+);
+
+@each $key, $value in $color_palette {
+	$map: (
+	);
+$map: map.merge($map, ($key: createColorMap($value, 15%, 0.5)));
+$color_list: map.merge($color_list, $map);
+}
+
+
 
 // LAYOUT
 // ------------------------------------------------------------------------------
@@ -158,44 +174,45 @@ $z-indexes: (
 );
 
 
+
 // IO
 // ------------------------------------------------------------------------------
 $io_input_list: 'input[type="text"]',
-'input[type="number"]',
-'input[type="color"]',
-'input[type="range"]',
-'input[type="date"]',
-'input[type="time"]',
-'input[type="datetime-local"]',
-'input[type="month"]',
-'input[type="week"]',
-'input[type="email"]',
-'input[type="password"]',
-'input[type="tel"]',
-'input[type="url"]',
-'input[type="search"]',
-'input:not([type])';
+	'input[type="number"]',
+	'input[type="color"]',
+	'input[type="range"]',
+	'input[type="date"]',
+	'input[type="time"]',
+	'input[type="datetime-local"]',
+	'input[type="month"]',
+	'input[type="week"]',
+	'input[type="email"]',
+	'input[type="password"]',
+	'input[type="tel"]',
+	'input[type="url"]',
+	'input[type="search"]',
+	'input:not([type])';
 
 $io_date_list: '.input_io[type="date"]',
-'.input_io[type="time"]',
-'.input_io[type="datetime-local"]',
-'.input_io[type="month"]',
-'.input_io[type="week"]';
+	'.input_io[type="time"]',
+	'.input_io[type="datetime-local"]',
+	'.input_io[type="month"]',
+	'.input_io[type="week"]';
 
 $io_button_list: 'button',
-'input[type="button"]',
+	'input[type="button"]',
 	// 'input[type="file"]',
-'input[type="reset"]',
-'input[type="image"]',
-'input[type="submit"]';
+	'input[type="reset"]',
+	'input[type="image"]',
+	'input[type="submit"]';
 
 $io_focus_list: 'a[href]',
-'area[href]',
-'button:not([disabled])',
-'input:not([disabled])',
-'select:not([disabled])',
-'textarea:not([disabled])',
-'*[tabindex]';
+	'area[href]',
+	'button:not([disabled])',
+	'input:not([disabled])',
+	'select:not([disabled])',
+	'textarea:not([disabled])',
+	'*[tabindex]';
 
 $color_text_io: color.scale($color_text_basic, $lightness: $color_diff_basic) !default;
 $color_text_button: $color_text_basic !default;
@@ -212,6 +229,7 @@ $shadow_basic: inset 0 1px 3px rgba($color_darkest, 0.06);
 $shadow_focus: $shadow_basic, 0 0 5px color.adjust($color_action_basic, $lightness: -5%, $alpha: -0.3);
 
 
+
 // ANIMATIONS
 // ------------------------------------------------------------------------------
 $duration_basic: 200ms !default;
@@ -223,6 +241,7 @@ $transition_hide: opacity $duration_double;
 $transition_show: opacity $duration_long;
 
 
+
 // HARDWARE BREAKPOINTS
 // ------------------------------------------------------------------------------
 $screen_tiny: 768px;
@@ -233,6 +252,7 @@ $screen_huge: 1680px;
 $screen_gigantic: 1920px;
 
 
+
 // VENDOR PREFIX
 // ------------------------------------------------------------------------------
 $prefix_defaults: -moz- -webkit- -o- -ms- '';
@@ -244,6 +264,7 @@ $moz_ms_support: -moz- -ms- '';
 $webkit_ms_support: -webkit- -ms- '';
 
 
+
 // SYMBOLS
 // ------------------------------------------------------------------------------
 $icons: (
@@ -261,6 +282,9 @@ $icons: (
 }
 
 
+
 // USER AGENT
 // ------------------------------------------------------------------------------
-$no_agent_focus: true !default;
\ No newline at end of file
+$no_agent_focus: true;
+
+@include overrideUserAgent;
\ No newline at end of file
diff --git a/global/_typography.scss b/global/_typography.scss
index a67f773..f03c740 100644
--- a/global/_typography.scss
+++ b/global/_typography.scss
@@ -1,48 +1,46 @@
-@use "config";
-
 // Basic styles
 // -----------------------------------------------------------------------------
 
 %basic {
-	font-family: config.$family_text_basic;
-	font-size: config.$size_text_1;
-	line-height: config.$line_text_basic;
+	font-family: $family_text_basic;
+	font-size: $size_text_1;
+	line-height: $line_text_basic;
 }
 
 %basic_mono {
-	font-family: config.$family_text_mono;
-	font-size: config.$size_text_1;
-	line-height: config.$line_text_mono;
+	font-family: $family_text_mono;
+	font-size: $size_text_1;
+	line-height: $line_text_mono;
 }
 
 %basic_print {
-	font-family: config.$family_text_print;
-	font-size: config.$size_text_1;
-	line-height: config.$line_text_basic;
+	font-family: $family_text_print;
+	font-size: $size_text_1;
+	line-height: $line_text_basic;
 }
 
 %head_all {
-	font-family: config.$family_head_basic;
-	line-height: config.$line_head_basic;
+	font-family: $family_head_basic;
+	line-height: $line_head_basic;
 }
 
 %head_1 {
-	font-size: config.$size_head_1;
+	font-size: $size_head_1;
 	font-weight: 300;
 }
 
 %head_2 {
-	font-size: config.$size_head_2;
+	font-size: $size_head_2;
 	font-weight: 300;
 }
 
 %head_3 {
-	font-size: config.$size_head_3;
+	font-size: $size_head_3;
 	font-weight: 300;
 }
 
 %head_4 {
-	font-size: config.$size_head_4;
+	font-size: $size_head_4;
 	font-weight: 300;
 }
 
diff --git a/mixins/_all.scss b/mixins/_all.scss
new file mode 100644
index 0000000..f4240f5
--- /dev/null
+++ b/mixins/_all.scss
@@ -0,0 +1,6 @@
+@import "media_query";
+@import "sprite";
+@import "flow";
+@import "color";
+@import "user_agent";
+@import "vendor";
diff --git a/mixins/_color.scss b/mixins/_color.scss
index 0518b0d..5ace6b1 100644
--- a/mixins/_color.scss
+++ b/mixins/_color.scss
@@ -1,24 +1,22 @@
 @use "sass:map";
 
-@use "../global/config";
-
-@mixin addDefaultColors {
-  @if map.has-key(config.$color_palette, alpha) {
-    $alpha_color: map.get(config.$color_palette, alpha) !global;
+@mixin addDefaultColors() {
+  @if map.has-key($color_palette, alpha) {
+    $alpha_color: map.get($color_palette, alpha) !global;
   }
-  @if map.has-key(config.$color_palette, bravo) {
-    $bravo_color: map.get(config.$color_palette, bravo) !global;
+  @if map.has-key($color_palette, bravo) {
+    $bravo_color: map.get($color_palette, bravo) !global;
   }
-  @if map.has-key(config.$color_palette, charlie) {
-    $charlie_color: map.get(config.$color_palette, charlie) !global;
+  @if map.has-key($color_palette, charlie) {
+    $charlie_color: map.get($color_palette, charlie) !global;
   }
-  @if map.has-key(config.$color_palette, delta) {
-    $delta_color: map.get(config.$color_palette, delta) !global;
+  @if map.has-key($color_palette, delta) {
+    $delta_color: map.get($color_palette, delta) !global;
   }
-  @if map.has-key(config.$color_palette, echo) {
-    $echo_color: map.get(config.$color_palette, echo) !global;
+  @if map.has-key($color_palette, echo) {
+    $echo_color: map.get($color_palette, echo) !global;
   }
-  @if map.has-key(config.$color_palette, foxtrot) {
-    $foxtrot_color: map.get(config.$color_palette, foxtrot) !global;
+  @if map.has-key($color_palette, foxtrot) {
+    $foxtrot_color: map.get($color_palette, foxtrot) !global;
   }
 }
diff --git a/mixins/_index.scss b/mixins/_index.scss
deleted file mode 100644
index 30b748b..0000000
--- a/mixins/_index.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-@forward "media_query";
-@forward "sprite";
-@forward "flow";
-//@use "./_color";
-@forward "user_agent";
-@forward "vendor";
diff --git a/mixins/_media_query.scss b/mixins/_media_query.scss
index 7cef3e1..d0e1f6c 100644
--- a/mixins/_media_query.scss
+++ b/mixins/_media_query.scss
@@ -1,34 +1,32 @@
-@use "../global/config";
-
 @use "sass:math";
 
 //Sections for Media Queries
 @mixin forPhoneUp {
-  @media (min-width: #{config.$screen_tiny - 1}) { @content; } //599px
+  @media (min-width: #{$screen_tiny - 1}) { @content; } //599px
 }
 @mixin forPhoneOnly {
-  @media (max-width: #{config.$screen_tiny - 1}) { @content; } //599px
+  @media (max-width: #{$screen_tiny - 1}) { @content; } //599px
 }
 @mixin forTabletPortraitUp {
-  @media (min-width: config.$screen_small) { @content; } //600px
+  @media (min-width: $screen_small) { @content; } //600px
 }
 @mixin forTabletPortraitOnly {
-  @media (min-width: config.$screen_tiny) and (max-width: #{config.$screen_small - 1}) { @content; } //600px - 899px
+  @media (min-width: $screen_tiny) and (max-width: #{$screen_small - 1}) { @content; } //600px - 899px
 }
 @mixin forTabletLandscapeUp {
-  @media (min-width: config.$screen_small) { @content; } //900px
+  @media (min-width: $screen_small) { @content; } //900px
 }
 @mixin forTabletLandscapeOnly {
-  @media (min-width: config.$screen_small) and (max-width: #{config.$screen_medium - 1}) { @content; } //900px - 1199px
+  @media (min-width: $screen_small) and (max-width: #{$screen_medium - 1}) { @content; } //900px - 1199px
 }
 @mixin forDesktopUp {
-  @media (min-width: config.$screen_medium) { @content; } //1200px
+  @media (min-width: $screen_medium) { @content; } //1200px
 }
 @mixin forDesktopOnly {
-  @media (min-width: config.$screen_medium) and (max-width: #{config.$screen_huge - 1}) { @content; } //1200px - 1799px
+  @media (min-width: $screen_medium) and (max-width: #{$screen_huge - 1}) { @content; } //1200px - 1799px
 }
 @mixin forBigDesktopUp {
-  @media (min-width: config.$screen_huge) { @content; } //1800px
+  @media (min-width: $screen_huge) { @content; } //1800px
 }
 
 //Mobile-first Media Query
diff --git a/mixins/_user_agent.scss b/mixins/_user_agent.scss
index 4b94d81..bf21661 100644
--- a/mixins/_user_agent.scss
+++ b/mixins/_user_agent.scss
@@ -1,9 +1,9 @@
-@mixin overrideUserAgent($active, $elements) {
-	@if $active == true {
-		@each $el in $elements {
-			#{$el}:focus {
-				outline: 0;
-			}
-		}
-	}
+@mixin overrideUserAgent() {
+  @if $no_agent_focus == true {
+    @each $el in $io_focus_list {
+      #{$el}:focus {
+        outline: 0;
+      }
+    }
+  }
 }
diff --git a/modules/breakpoint/_breakpoint_module.scss b/modules/breakpoint/_breakpoint_module.scss
index 37ef6b3..fd0174a 100644
--- a/modules/breakpoint/_breakpoint_module.scss
+++ b/modules/breakpoint/_breakpoint_module.scss
@@ -1,59 +1,47 @@
-@use "../../global/config";
-@use "../../mixins/media_query" as *;
-
 .query_goingLarge {
-	@include goingLarge(config.$screen_tiny) {
-	}
-;
+  @include goingLarge($screen_tiny) {};
 }
 
 .query_goingSmall {
-	@include goingSmall(config.$screen_gigantic) {
-	}
-;
+  @include goingSmall($screen_gigantic) {};
 }
 
 .query_phoneUp {
-	@include forPhoneUp {
-	}
+  @include forPhoneUp {}
 }
 
 .query_phoneOnly {
-	@include forPhoneOnly {
-	}
+  @include forPhoneOnly {}
 }
 
-.query_tabletPortraitOnly {
-	@include forTabletPortraitOnly {
-	}
+.query_tabletPortaitOnly {
+  @include forTabletPortraitOnly {
+  }
 }
 
 .query_tabletPortraitUp {
-	@include forTabletPortraitUp {
-	}
+  @include forTabletPortraitUp {
+  }
 }
 
 .query_tabletLandscapeOnly {
-	@include forTabletLandscapeOnly {
-	}
+  @include forTabletLandscapeOnly {}
 }
 
 .query_tabletLandscapeUp {
-	@include forTabletLandscapeUp {
-	}
+  @include forTabletLandscapeUp {}
 }
 
 .query_desktopOnly {
-	@include forDesktopOnly {
-	}
+  @include forDesktopOnly {
+  }
 }
 
 .query_desktopUp {
-	@include forDesktopUp {
-	}
+  @include forDesktopUp {
+  }
 }
 
 .query_bigDesktopUp {
-	@include forBigDesktopUp {
-	}
+  @include forBigDesktopUp {}
 }
diff --git a/modules/editor/_editor_module.scss b/modules/editor/_editor_module.scss
index 3810dc7..7aa9434 100644
--- a/modules/editor/_editor_module.scss
+++ b/modules/editor/_editor_module.scss
@@ -1,14 +1,13 @@
 // Custom extends and mixins
 // ------------------------------------------------------------------------------
-@use "mixins";
-@use "extends";
-@use "../../global/config";
+@import "mixins";
+@import "extends";
 
 // Editor module styles
 // ------------------------------------------------------------------------------
 
 %wip {
-  border-right: config.$space_basic solid rgba(crimson, 0.8);
+  border-right: $space_basic solid rgba(crimson, 0.8);
   background-color: rgba(crimson, 0.1) !important;
 }
 .wip {
diff --git a/modules/explanation/_explanation_module.scss b/modules/explanation/_explanation_module.scss
index 55ad0d8..899add5 100644
--- a/modules/explanation/_explanation_module.scss
+++ b/modules/explanation/_explanation_module.scss
@@ -1,38 +1,30 @@
 @use "sass:color";
 @use "sass:math";
 
-@use "../../global/config";
-@use "../../global/common";
-@use "../../functions/color" as *;
-@use "../../mixins/vendor";
-
 %expose_after {
 	&::after {
 		content: "";
 		display: block;
 		height: 48px;
-		background-color: rgba(basic_color(delta), 0.1) !important;
+		background-color: rgba($delta_color, 0.1) !important;
 	}
 }
-
 %expose_before {
 	&::before {
 		content: "";
 		display: block;
 		height: 48px;
-		background-color: rgba(basic_color(delta), 0.1) !important;
+		background-color: rgba($delta_color, 0.1) !important;
 	}
 }
-
 %expose {
 	&::before, &::after {
 		content: "";
 		display: block;
 		height: 48px;
-		background-color: rgba(basic_color(delta), 0.1) !important;
+		background-color: rgba($delta_color, 0.1) !important;
 	}
 }
-
 // %exp {
 // }
 %exp_hidden {
@@ -45,42 +37,39 @@
 
 .exp_overlay {
 	@extend %full_parent;
-	background-color: color.adjust(basic_color(alpha), $alpha: -0.6);
+	background-color: color.adjust($alpha_color, $alpha: -0.6);
 }
 
 .exp_pop {
 	@extend %exp_hidden !optional;
 	position: absolute;
 	z-index: 100;
-	top: config.$space_large;
-	left: config.$space_large;
-	padding: config.$space_half;
-	border: 4px solid config.$color_back_basic;
+	top: $space_large;
+	left: $space_large;
+	padding: $space_half;
+	border: 4px solid $color_back_basic;
 	border-radius: 4px;
-	background-color: config.$color_back_basic;
+	background-color: $color_back_basic;
 	pointer-events: none;
 }
-
 .exp_marker_pop {
 	position: absolute;
-	top: math.div(-(config.$size_text_basic), 4) * 3;
-	right: math.div(-(config.$size_text_basic), 2);
-	width: config.$size_text_basic;
-	height: config.$size_text_basic;
-	border: config.$space_tiny solid config.$color_highlight_basic;
-	border-radius: config.$size_text_basic;
-	color: config.$color_highlight_basic;
-	background-color: config.$color_darkest;
+	top: math.div(-$size_text_basic, 4) * 3;
+	right: math.div(-$size_text_basic, 2);
+	width: $size_text_basic;
+	height: $size_text_basic;
+	border: $space_tiny solid $color_highlight_basic;
+	border-radius: $size_text_basic;
+	color: $color_highlight_basic;
+	background-color: $color_darkest;
 }
 
 .exp_expose {
 	@extend %expose !optional;
 }
-
 .exp_expose_pre {
 	@extend %expose_after;
 }
-
 .exp_expose_post {
 	@extend %expose_before;
 }
@@ -92,25 +81,21 @@
 	// padding: $space_basic $space_basic * 2;
 	cursor: pointer;
 }
-
 .exp_help_btn {
 	display: table;
-	right: config.$space_double;
-	bottom: config.$space_double;
-	background-color: rgba(config.$color_darkest, 0.4);
-
+	right: $space_double;
+	bottom: $space_double;
+	background-color: rgba($color_darkest, 0.4);
 	&:hover {
-		background-color: config.$color_brightest;
-
+		background-color: $color_brightest;
 		> .span_solo {
-			color: config.$color_darkest;
+			color: $color_darkest;
 		}
 	}
-
 	.span_solo {
 		display: table-cell;
-		color: rgba(config.$color_brightest, 0.8);
-		font-family: config.$family_text_mono;
+		color: rgba($color_brightest, 0.8);
+		font-family: $family_text_mono;
 		font-size: 1.4em;
 		text-align: center;
 		vertical-align: middle;
@@ -118,12 +103,13 @@
 }
 
 
+
 .expose_height {
 	position: absolute;
 	top: 0;
 	right: 0;
 	bottom: 0;
 	left: 0;
-	background-color: rgba(basic_color(delta), 0.1) !important;
-	@include vendor.vendor-prefix(transition, height 0.5s ease);
+	background-color: rgba($delta_color, 0.1) !important;
+	@include vendor-prefix(transition, height 0.5s ease);
 }
diff --git a/modules/io/_io_module.scss b/modules/io/_io_module.scss
index 60c3526..3f8c9e6 100644
--- a/modules/io/_io_module.scss
+++ b/modules/io/_io_module.scss
@@ -1,10 +1,5 @@
-@use "../../global/config";
-@use "../../global/common";
-@use "../../global/typography";
-@use "../../elements/interactive";
-
 input[type="range"] {
-	accent-color: config.$color_text_io;
+	accent-color: $color_text_io;
 }
 
 header,
@@ -56,7 +51,7 @@ footer {
 header,
 aside {
 	&.io {
-		padding: config.$space_basic;
+		padding: $space_basic;
 
 		textarea {
 			@extend .io_textarea;
diff --git a/modules/maintenance/_maintenance_module.scss b/modules/maintenance/_maintenance_module.scss
index 49a9f0a..815648c 100644
--- a/modules/maintenance/_maintenance_module.scss
+++ b/modules/maintenance/_maintenance_module.scss
@@ -1,12 +1,7 @@
-@use "../../global/config";
-@use "../../global/common";
-@use "../../elements/sections";
-@use "../../functions/color" as *;
-
 .body_status {
   @extend .sec_main_status;
   height: 100vh;
-  border-color: basic_color(foxtrot);
+  border-color: $foxtrot_color;
 
   .main_site {
     @extend .wrap_center;
@@ -18,7 +13,7 @@
     }
     & > h1 + h3 {
       margin-top: 0;
-      margin-bottom: config.$space_small;
+      margin-bottom: $space_small;
     }
   }
 }
diff --git a/modules/navigation/_nav_module.scss b/modules/navigation/_nav_module.scss
index dd01538..d5fabaa 100644
--- a/modules/navigation/_nav_module.scss
+++ b/modules/navigation/_nav_module.scss
@@ -1,6 +1,3 @@
-@use "../../global/config";
-@use "../../global/common";
-
 nav {
 
 	ul,
@@ -9,7 +6,7 @@ nav {
 	}
 
 	li {
-		margin-bottom: config.$space_basic;
+		margin-bottom: $space_basic;
 		list-style: none;
 	}
 }
@@ -19,12 +16,12 @@ nav {
 		@extend .overflow;
 
 		ul {
-			margin: config.$space_basic 0;
+			margin: $space_basic 0;
 		}
 
 		li {
 			@extend .float_space_left;
-			margin-right: config.$space_basic;
+			margin-right: $space_basic;
 			margin-bottom: 0;
 
 			&:last-child {
@@ -36,28 +33,28 @@ nav {
 
 .nav_right {
 	float: right;
-	margin-left: config.$space_basic;
+	margin-left: $space_basic;
 
 	.align_parent {
-		margin-right: config.$space_basic * -1;
+		margin-right: $space_basic * -1;
 	}
 }
 
 .nav_separate {
 	li {
 		position: relative;
-		padding-left: config.$space_tiny;
+		padding-left: $space_tiny;
 
 		&:not(:first-child) {
 
 			&::before {
 				content: "";
 				position: absolute;
-				width: config.$space_tiny;
+				width: $space_tiny;
 				height: 100%;
 				left: 0;
 				top: 0;
-				background-color: config.$color_border_basic;
+				background-color: $color_border_basic;
 			}
 		}
 	}
@@ -69,17 +66,17 @@ nav {
 		position: relative;
 
 		&:first-child {
-			padding-left: config.$space_basic * 2 + config.$space_tiny;
+			padding-left: $space_basic * 2 + $space_tiny;
 
 			&::before {
 				content: "";
 				position: absolute;
-				width: config.$space_tiny;
+				width: $space_tiny;
 				height: 100%;
 				left: 0;
 				top: 0;
-				background-color: config.$color_front_basic;
-				margin: 0 config.$space_basic;
+				background-color: $color_front_basic;
+				margin: 0 $space_basic;
 			}
 		}
 	}
@@ -100,11 +97,11 @@ nav {
 
 .nav_column {
 	position: relative;
-	margin: config.$space_basic 0;
+	margin: $space_basic 0;
 
 	ul {
 		display: flex;
-		margin: 0 config.$space_large;
+		margin: 0 $space_large;
 
 		li {
 			flex: auto;
@@ -122,11 +119,11 @@ nav {
 	position: fixed;
 	// display: table;
 	// width: 3em;
-  right: config.$space_half;
-  bottom: config.$space_double;
+  right: $space_half;
+  bottom: $space_double;
 
 	ul {
-		margin: config.$space_basic 0;
+		margin: $space_basic 0;
 	}
 
 	li {
@@ -148,7 +145,7 @@ nav {
 		}
 
 		&:hover {
-			background-color: config.$color_action_basic;
+			background-color: $color_action_basic;
 		}
 	}
 	.sprite_img {
@@ -166,8 +163,8 @@ nav {
 			&:active,
 			&:focus,
 			&:hover {
-				background-color: rgba(config.$color_text_basic, 0.2);
-				color: config.$color_text_basic;
+				background-color: rgba($color_text_basic, 0.2);
+				color: $color_text_basic;
 			}
 		}
 	}
diff --git a/modules/print/_print_module.scss b/modules/print/_print_module.scss
index 81ab54d..84d9c0f 100644
--- a/modules/print/_print_module.scss
+++ b/modules/print/_print_module.scss
@@ -1,15 +1,13 @@
 @use "sass:list";
 
-@use "../../global/config";
-@use "../../global/typography";
-@use "mixins";
-@use "extends";
+@import "mixins";
+@import "extends";
 
 // Print module styles
 // ------------------------------------------------------------------------------
 
 %paper {
-	background-color: config.$color_front_basic;
+	background-color: $color_front_basic;
 }
 
 $a4: ".dina4" 1.2cm 1.2cm 1.2cm 2.4cm;
@@ -19,7 +17,7 @@ $a6: ".dina6" 0 0 0 1.2cm;
 $din: $a4, $a5, $a6;
 
 .print_body {
-	font-size: config.$size_text_print;
+	font-size: $size_text_print;
 	margin: 10vh 20vw;
 
 	@page {
@@ -27,7 +25,7 @@ $din: $a4, $a5, $a6;
 		margin: 1.2cm;
 	}
 
-	@page :first {
+	@page:first {
 		size: A4;
 		margin: 0;
 	}
@@ -40,11 +38,9 @@ $din: $a4, $a5, $a6;
 				right: list.nth($space, 3);
 				left: list.nth($space, 5);
 			}
-
 			.page_head {
 				top: list.nth($space, 2);
 			}
-
 			.page_foot {
 				bottom: list.nth($space, 4);
 			}
@@ -90,18 +86,15 @@ $din: $a4, $a5, $a6;
 				line-height: 1;
 				text-align: right;
 			}
-
 			p:first-child {
 				text-align: left;
 			}
 		}
-
 		.page_content {
 			margin-top: 10cm;
 			margin-bottom: 2cm;
 		}
-
-		margin: config.$space_small auto;
+		margin: $space_small auto;
 	}
 
 	.page_title, .page_date {
diff --git a/modules/tables/_tables_module.scss b/modules/tables/_tables_module.scss
index 74e1dc6..2746bec 100644
--- a/modules/tables/_tables_module.scss
+++ b/modules/tables/_tables_module.scss
@@ -1,17 +1,13 @@
-@use "../../global/config";
-@use "../../global/typography";
-@use "../../functions/color" as *;
-
 .table_link {
 	width: 100%;
 	border: 0;
 	table-layout: auto;
 
 	tbody {
-		border-bottom: config.$border_basic;
+		border-bottom: $border_basic;
 
 		&:hover {
-			background-color: config.$color_bright;
+			background-color: $color_bright;
 		}
 	}
 
@@ -30,11 +26,11 @@
 	}
 
 	.cell_link {
-		padding-right: config.$space_basic;
-		padding-left: config.$space_basic;
+		padding-right: $space_basic;
+		padding-left: $space_basic;
 
 		&:hover {
-			background-color: basic_color(foxtrot);
+			background-color: $foxtrot_color;
 
 			a:first-child {
 				display: none;
@@ -42,7 +38,7 @@
 
 			a:last-child {
 				display: block;
-				color: config.$color_highlight_basic;
+				color: $color_highlight_basic;
 			}
 		}
 
@@ -62,8 +58,8 @@
 	}
 
 	.cell_text {
-		padding-right: config.$space_basic;
-		padding-left: config.$space_basic;
+		padding-right: $space_basic;
+		padding-left: $space_basic;
 
 		div {
 			width: 100%;