diff --git a/src/scss/cdb-components/steps/carousel.scss b/src/scss/cdb-components/steps/carousel.scss
new file mode 100644
index 0000000..ad31662
--- /dev/null
+++ b/src/scss/cdb-components/steps/carousel.scss
@@ -0,0 +1,89 @@
+// Step carousel styles
+// ----------------------------------------------
+
+/* SG
+# Steps/Carousel
+
+```
+
+```
+*/
+
+@import '../../cdb-utilities/mixins';
+@import '../../cdb-variables/sizes';
+@import '../../cdb-variables/colors';
+
+.CDB-Carousel {
+ width: 300px;
+ margin-left: 32px;
+}
+
+.CDB-Carousel-selection {
+ color: $cTypo3;
+ text-transform: uppercase;
+}
+
+.CDB-CarouselContainer {
+ width: 300px;
+ padding: $sMargin-element 0;
+ overflow-x: scroll;
+ overflow-y: hidden;
+ white-space: nowrap;
+}
+
+.CDB-CarouselContainer::-webkit-scrollbar {
+ width: 100%;
+ height: 3px;
+ cursor: pointer;
+}
+
+.CDB-CarouselContainer::-webkit-scrollbar-thumb {
+ background-color: $cSecondaryLine;
+ border-radius: 4px;
+ height: 3px;
+
+ &:hover {
+ background-color: $cMainLine;
+ }
+}
+
+.CDB-CarouselContainer::-webkit-scrollbar-track {
+ height: 1px;
+ background-color: $cThirdBackground;
+ border-top: 1px solid $cWhite;
+ border-bottom: 1px solid $cWhite;
+}
+
+.CDB-CarouselCard {
+ @include inline-block();
+ width: $baseSize * 11;
+ height: $baseSize * 7;
+ background: $cThirdBackground;
+ border: 1px solid $cSecondaryLine;
+ border-radius: 4px;
+ margin-right: 10px;
+ vertical-align: top;
+
+ &:hover {
+ border: 1px solid $cMainLine;
+ cursor: pointer;
+ }
+}
diff --git a/src/scss/cdb-components/steps/header.scss b/src/scss/cdb-components/steps/header.scss
new file mode 100644
index 0000000..4b881ac
--- /dev/null
+++ b/src/scss/cdb-components/steps/header.scss
@@ -0,0 +1,40 @@
+// Step header styles
+// ----------------------------------------------
+
+/* SG
+# Steps/Header
+
+```
+
+```
+*/
+
+@import '../../cdb-utilities/mixins';
+@import '../../cdb-variables/sizes';
+@import '../../cdb-variables/colors';
+
+.CDB-StepHeader {
+ width: 300px;
+}
+
+.CDB-StepHeader-numeration {
+ @include inline-block();
+ width: $baseSize * 3;
+ height: $baseSize * 3;
+ color: $cTypo3;
+ margin-right: 1px;
+ background-color: $cWhite;
+ border: 1px solid $cMainLine;
+ border-radius: 4px;
+ font-size: $sFontSize-small;
+ text-align: center;
+ line-height: $baseSize * 3;
+}
+
+.CDB-StepHeader-title {
+ @include inline-block();
+ color: $cMainDark;
+}
\ No newline at end of file
diff --git a/src/scss/cdb-utilities/helpers.scss b/src/scss/cdb-utilities/helpers.scss
index cee8ce7..b954334 100644
--- a/src/scss/cdb-utilities/helpers.scss
+++ b/src/scss/cdb-utilities/helpers.scss
@@ -21,6 +21,9 @@
.u-rSpace--xl {
margin-right: 12px;
}
+.u-bSpace-xxxl {
+ margin-bottom: 40px;
+}
.u-lSpace {
margin-left: 4px;
}
diff --git a/src/scss/cdb-variables/_sizes.scss b/src/scss/cdb-variables/_sizes.scss
index b657ab2..69230b1 100644
--- a/src/scss/cdb-variables/_sizes.scss
+++ b/src/scss/cdb-variables/_sizes.scss
@@ -9,8 +9,8 @@ $mobileLayout: 280px;
$baseSize: 8px;
// Margins
-$sMargin-section: 24px; // To separate main section
-$sMargin-element: 14px; // To separate elements inside a group
+$sMargin-section: 24px; // To separate main section
+$sMargin-element: 14px; // To separate elements inside a group
// Font sizes
$sFontSize-small: 10px;