diff --git a/assets/seiten/css/design.css b/assets/seiten/css/design.css index efc69d8..4010a7c 100644 --- a/assets/seiten/css/design.css +++ b/assets/seiten/css/design.css @@ -1,5 +1,7 @@ +/* Haupt CSS für alle Seiten */ html { scroll-behavior: smooth; + overflow-x: hidden; } *{ @@ -113,7 +115,7 @@ body{ height: 100%; padding: 80px 20px; transition: .4s ease; - /* Nicht Ressourcen Schonend. > Laggs + /* Verursacht bei manchen Browsern/Geräten Laggs Beim Scrollen background-image: url(../../bilder/background.png); background-size: 100%; background-attachment: fixed; @@ -121,7 +123,7 @@ body{ */ } /* GPU Freundlicher */ -/* Q: https://www.fourkitchens.com/blog/article/fix-scrolling-performance-css-will-change-property/ */ +/* Q: https://www.fourkitchens.com/blog/article/fix-scrolling-performance-css-will-change-property/ mit kleinen Änderungen */ .seite::before { content: ""; position: fixed; @@ -134,7 +136,6 @@ body{ background-size: cover; will-change: transform; z-index: -1; - } /* Animierte Sterne */ @@ -143,18 +144,6 @@ body{ left: 0; width: 100%; height: 100vh; - animation: animateBg 50s linear infinite; -} - -@keyframes animateBg { - 0%,100% - { - transform: scale(1); - } - 50% - { - transform: scale(1.2); - } } .seite section span { @@ -198,6 +187,7 @@ body{ background: linear-gradient(90deg,#fff,transparent); } +/* Stern Position & Geschwindigkeit */ .seite section span:nth-child(1) { top: 0; @@ -280,15 +270,6 @@ body{ } /* Animation Ende */ -/* Text Formatierung */ -.seite h1 { - text-align: center; -} - -.seite p { - padding: 30px 0; -} - /* Footer */ .footer { background: #444; @@ -325,7 +306,8 @@ body{ } .ft-icons { - margin-top: 1em; + bottom: 50%; + top: 50%; } .fa{ @@ -344,5 +326,4 @@ body{ transition: ease-in-out all 0.2s; } - /* Ab hier Mika */ diff --git a/assets/seiten/css/index.css b/assets/seiten/css/index.css index ded92e7..b099595 100644 --- a/assets/seiten/css/index.css +++ b/assets/seiten/css/index.css @@ -29,7 +29,7 @@ text-align: center; position: absolute; left: 50%; - bottom: 1rem; + bottom: 0.5em; transform: translate(-50%, -50%); max-width: 75px; width: 100%; @@ -56,3 +56,21 @@ top: 8rem; transform: translate(-50%, -50%); } + +.über-uns { + width: 65%; + margin-top: 2%; + height: 50%; +} +.shop { + width: 65%; + margin-top: 0.5%; + height: 30%; +} +.shop, .über-uns{ + background-color: rgba(0, 0, 0, 0.12); + margin-right: 2.5%; + text-align: center; + border-radius: 1em; + border: 0.05em solid #121212; +} \ No newline at end of file diff --git a/index.html b/index.html index 76c9f7c..888d68a 100644 --- a/index.html +++ b/index.html @@ -21,10 +21,19 @@
Anmelden
+
-
-
+
+ +
+

Über uns

+

- Test
- Test 2
- Test 3

+
+
+

Shop Examples

+
+ @@ -35,9 +44,9 @@ +
- Nach Unten
⬇️
@@ -59,11 +68,12 @@ Kontakt
- - - - + + + +
+

2021 - © KBM