diff --git a/www/clients.php b/www/clients.php index ec40633..7a541c2 100644 --- a/www/clients.php +++ b/www/clients.php @@ -107,18 +107,24 @@ if ($path == '') { Mandanten - Elwig - Elektronische Winzergenossenschaftsverwaltung + -

Mandanten

- - - +
+
+

Mandanten

+

Startseite

+
Name
+ + \n"; - } ?> - -
Name
$c
-

JSON-Format

+ echo " $c\n"; +} ?> + + +

JSON-Format

+ + Downloads - Elwig - Elektronische Winzergenossenschaftsverwaltung + -

Downloads

- - - +
+
+

Downloads

+

Startseite

+
NameGrößeÄnderungsdatum
+ + [$prod, $vers, $url, $size, $mtime, $ctime, $mod, $cre]) { - echo " \n"; - } ?> - -
NameGrößeÄnderungsdatum
$name" . number_format($size / 1024 / 1024, 1) . " MB" . date('d.m.Y, H:i', $mtime) . "
-

JSON-Format

+ echo " $name" . number_format($size / 1024 / 1024, 1) . " MB" . date('d.m.Y, H:i', $mtime) . "\n"; +} ?> + + +

JSON-Format

+ + Elwig - Elektronische Winzergenossenschaftsverwaltung +
-

Elwig

-

Elektronische Winzergenossenschaftsverwaltung

- Mandanten +
+ +
+ Elwig +
+

Elwig

+

Elektronische Winzer­genossenschafts­verwaltung

+
+
+ +
+ +
+ +

Elwig

+

+ Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore etdolore magna aliquyam erat, sed diam voluptua. + At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. + Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. + At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. +

+

+ Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore etdolore magna aliquyam erat, sed diam voluptua. + At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. + Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. + At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. +

+
+ +
+ +
+ +

Die Genossenschaften

+

+ Mandanten +

+
+ +
diff --git a/www/res/images/Italien-1.jpg b/www/res/images/Italien-1.jpg new file mode 100644 index 0000000..c4e5b88 Binary files /dev/null and b/www/res/images/Italien-1.jpg differ diff --git a/www/res/images/Italien-2.jpg b/www/res/images/Italien-2.jpg new file mode 100644 index 0000000..ac8c5dd Binary files /dev/null and b/www/res/images/Italien-2.jpg differ diff --git a/www/res/images/Italien-3.jpg b/www/res/images/Italien-3.jpg new file mode 100644 index 0000000..c1ab451 Binary files /dev/null and b/www/res/images/Italien-3.jpg differ diff --git a/www/res/style.css b/www/res/style.css index 226299e..8ded4b5 100644 --- a/www/res/style.css +++ b/www/res/style.css @@ -1,7 +1,11 @@ +* { + box-sizing: border-box; +} + :root { font-family: 'Arial', sans-serif; - box-sizing: border-box; + scroll-behavior: smooth; } body { @@ -15,6 +19,7 @@ header { height: 3em; border-bottom: 1px solid #C0C0C0; background-color: #FFFFFF; + z-index: 10; } header img { @@ -24,6 +29,13 @@ header img { nav { height: 100%; + display: flex; + justify-content: space-between; +} + +nav > *:first-child, +nav > *:last-child { + flex: 100px 1 1; } nav ul { @@ -36,15 +48,183 @@ nav ul { height: 100%; } -nav li { - -} - nav li a { text-decoration: none; - padding: 1em; + padding: 1em 2em; + color: #808080; +} + +nav li a:hover { + color: #A040C0; +} + +main span[id] { + position: relative; + top: -8em; +} + +p a { + color: #A040C0; +} + +main .home { + height: 100vh; + background: url("/res/images/Italien-1.jpg") no-repeat bottom center fixed; + background-size: cover; +} + +main .picture-1 { + width: 100%; + margin: 0; + background: url("/res/images/Italien-2.jpg") no-repeat bottom center fixed; + background-size: cover; + height: 24em; +} + +main .picture-2 { + width: 100%; + margin: 0; + background: url("/res/images/Italien-3.jpg") no-repeat bottom center fixed; + background-size: cover; + height: 24em; +} + +main .home a { + text-decoration: none; + color: #000000; + top: calc(32vh - 1em); + position: relative; +} + +main .home a > div { + display: flex; + justify-content: center; + align-items: center; + font-size: 1.5em; + transition: top 0.25s, font-size 0.25s; + width: fit-content; + margin: auto; + backdrop-filter: blur(16px); + padding: 1em 0.5em; + border-radius: 3em; +} + +main .home a > div:hover { + font-size: 1.675em; + top: calc(32vh - 1.5em); +} + +main .home img { + width: 8em; + height: 8em; +} + +main .home h1 { + font-size: 3.5em; + margin: 0; + font-weight: normal; +} + +main .home h2 { + font-size: 1.125em; + margin: 0; + font-weight: bold; +} + +main section { + padding: 1em 0 2em 0; +} + +main section p, +main section table { + max-width: 1000px; + margin: 1em auto; +} + +main section p { + text-align: justify; +} + +main section h3 { + text-align: center; + font-size: 2em; +} + +main .about { + border-top: 1em solid #C0F080; + border-bottom: 1em solid #C0F080; +} + +main .clients { + border-top: 1em solid #C0F080; + border-bottom: 1em solid #C0F080; } table td { padding: 0.125em 0.5em; } + +footer { + height: 8em; + padding: 1em; + width: 100%; + background-color: #404040; + color: #FFFFFF; + display: flex; + justify-content: center; + gap: 2em; +} + +footer img { + height: 4em; + width: 4em; +} + +footer a { + align-self: center; +} + +@media screen and (max-width: 1032px) { + nav li a { + padding: 1em; + } + main section p, + main section table { + margin: 1em; + } +} + +@media screen and (max-width: 800px) { + footer { + flex-direction: column; + height: unset; + align-items: center; + gap: 1em; + } + + footer > *:not(:first-child) { + width: 300px; + } + + .home { + font-size: 0.5em; + } +} + +@media screen and (max-width: 650px) { + nav li:first-child { + display: none; + } +} + +@media screen and (max-width: 550px) { + nav li:nth-child(2) { + display: none; + } +} + +@media screen and (max-width: 500px) { + nav li:nth-child(3) { + display: none; + } +}