diff --git a/src/Components/Features/FeaturesPage.js b/src/Components/Features/FeaturesPage.js index 2eb8ca0..e0a6d83 100644 --- a/src/Components/Features/FeaturesPage.js +++ b/src/Components/Features/FeaturesPage.js @@ -14,19 +14,22 @@ const FeaturesPage = () => { <>
+
+ +
-
-
-
- -
-
- +
+
+ +
+
+ +
@@ -35,3 +38,16 @@ const FeaturesPage = () => { }; export default FeaturesPage; + +/* + +
+
+ +
+
+ +
+
+ + */ diff --git a/src/styles/features.scss b/src/styles/features.scss index 739d58e..1db9b33 100644 --- a/src/styles/features.scss +++ b/src/styles/features.scss @@ -78,20 +78,77 @@ margin: 28px 0px; } +.features-top-mobile-img { + display: none; +} + @media only screen and (max-width: 430px) { + .features-container { + height: 1100px; + } + .features-top-wrapper { flex-direction: column; } + + .features-bottom-wrapper { + flex-direction: column; + } + .features-top-left { + margin-top: 12px; width: 100%; } + + .features-bottom-left { + margin-top: 12px; + width: 100%; + } + .features-top-right { width: 100%; } - .features-bottom-left { - width: 100%; - } + .features-bottom-right { width: 100%; } + + .features-bottom-left { + width: 100%; + } + + .features-header-text { + margin-top: 0px; + padding: 0px; + } + + .features-list { + padding: 0px; + margin-left: 5px; + } + + .features-list-item { + width: 98%; + text-align: justify; + font-size: 0.94rem; + margin: 6px 0px; + } + + .features-top-right { + display: none; + } + + .features-top-mobile-img { + display: flex; + } + + .features-image-one { + display: flex; + flex-direction: column; + margin-right: 0px; + height: 100%; + width: 100%; + float: right; + border-radius: 15px; + } }