Initial commit physio-remotion
This commit is contained in:
Moritz Graf
commit
add40238f2
|
|
@ -0,0 +1 @@
|
||||||
|
.env
|
||||||
|
|
@ -0,0 +1,86 @@
|
||||||
|
# Physio-Remotion Website
|
||||||
|
|
||||||
|
A modern, clean, and mobile-optimized "Coming Soon" landing page for the physiotherapy practice **Physio-Remotion** in Erding.
|
||||||
|
|
||||||
|
## Project Overview
|
||||||
|
|
||||||
|
The website is a static landing page built with Vanilla HTML, CSS, and JavaScript. It features a responsive layout that adapts to both desktop and mobile devices, using high-quality background images of the practice.
|
||||||
|
|
||||||
|
- **Launch Date:** April 2026
|
||||||
|
- **Design:** Teal-based color palette (`#699ba4`, `#8ac3ca`) with golden accent (`#d4a373`).
|
||||||
|
- **Tech Stack:** HTML5, CSS3 (Vanilla), JavaScript, npm (for build/deploy).
|
||||||
|
|
||||||
|
## Getting Started
|
||||||
|
|
||||||
|
### Prerequisites
|
||||||
|
|
||||||
|
- **Node.js**: Required for build and deployment scripts.
|
||||||
|
- **lftp**: Required for SFTP deployment.
|
||||||
|
```bash
|
||||||
|
brew install lftp
|
||||||
|
```
|
||||||
|
|
||||||
|
### Local Setup
|
||||||
|
|
||||||
|
1. **Environment Variables**: Create a `.env` file in the root directory (already present in your repository, but ensure it has the following variables):
|
||||||
|
```env
|
||||||
|
SFTP_USER=your_user
|
||||||
|
SFTP_PASS=your_password
|
||||||
|
SFTP_HOST=your_host
|
||||||
|
SFTP_PORT=your_port
|
||||||
|
SFTP_SUB_DIR=your_remote_directory
|
||||||
|
```
|
||||||
|
2. **Install Dependencies** (Optional, for future tools):
|
||||||
|
```bash
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
### Development & Build
|
||||||
|
|
||||||
|
To prepare the website for deployment, you can run the build script which collects all necessary files into a `dist/` directory:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run build
|
||||||
|
```
|
||||||
|
|
||||||
|
## Deployment
|
||||||
|
|
||||||
|
The project includes an automated deployment script using SFTP.
|
||||||
|
|
||||||
|
To deploy the website to your remote server:
|
||||||
|
```bash
|
||||||
|
npm run deploy
|
||||||
|
```
|
||||||
|
|
||||||
|
**What the script does:**
|
||||||
|
1. Loads credentials from `.env`.
|
||||||
|
2. Runs `npm run build` to prepare static assets.
|
||||||
|
3. Uses `lftp` to mirror the `dist/` folder to the remote `SFTP_SUB_DIR`.
|
||||||
|
|
||||||
|
## Project Structure
|
||||||
|
|
||||||
|
```text
|
||||||
|
.
|
||||||
|
├── img/ # Visual assets (praxis images)
|
||||||
|
├── dist/ # Generated build artifacts (gitignored)
|
||||||
|
├── index.html # Main landing page
|
||||||
|
├── impressum.html # Legal notice (Draft)
|
||||||
|
├── datenschutz.html # Privacy policy (Draft)
|
||||||
|
├── style.css # Global styles
|
||||||
|
├── main.js # Basic site logic
|
||||||
|
├── deploy.sh # SFTP deployment bash script
|
||||||
|
├── .env # SFTP credentials (gitignored)
|
||||||
|
├── .gitignore # Git ignore rules
|
||||||
|
└── package.json # Project metadata and scripts
|
||||||
|
```
|
||||||
|
|
||||||
|
## Legal Requirements
|
||||||
|
|
||||||
|
> [!IMPORTANT]
|
||||||
|
> This is a draft version. Before going public, please ensure the following:
|
||||||
|
> 1. Complete the placeholder information in `impressum.html` (Full names, insurance details, etc.).
|
||||||
|
> 2. Complete the placeholder information in `index.html` (Phone number).
|
||||||
|
> 3. Verify the `datenschutz.html` with a legal professional.
|
||||||
|
|
||||||
|
---
|
||||||
|
© 2025 Physio-Remotion
|
||||||
|
|
@ -0,0 +1,52 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Datenschutz | Physio-Remotion</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header class="header">
|
||||||
|
<div class="container">
|
||||||
|
<div class="logo"><a href="index.html">Physio-Remotion</a></div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="container" style="padding-top: 120px; padding-bottom: 80px;">
|
||||||
|
<h1>Datenschutzerklärung</h1>
|
||||||
|
<section>
|
||||||
|
<h2>1. Datenschutz auf einen Blick</h2>
|
||||||
|
<p>Die folgenden Hinweise geben einen einfachen Überblick darüber, was mit Ihren personenbezogenen Daten
|
||||||
|
passiert, wenn Sie diese Website besuchen.</p>
|
||||||
|
|
||||||
|
<h2>2. Verantwortliche Stelle</h2>
|
||||||
|
<p>Die verantwortliche Stelle für die Datenverarbeitung auf dieser Website ist:</p>
|
||||||
|
<p>Physio-Remotion<br>
|
||||||
|
Justus-von-Liebig-Straße 2<br>
|
||||||
|
85435 Erding</p>
|
||||||
|
<p>E-Mail: info@physio-remotion.de</p>
|
||||||
|
|
||||||
|
<h2>3. Datenerfassung auf unserer Website</h2>
|
||||||
|
<p>Ihre Daten werden zum einen dadurch erhoben, dass Sie uns diese mitteilen. Hierbei kann es sich z. B. um
|
||||||
|
Daten handeln, die Sie uns per E-Mail senden.</p>
|
||||||
|
<p>Andere Daten werden automatisch beim Besuch der Website durch unsere IT-Systeme erfasst. Das sind vor
|
||||||
|
allem technische Daten (z. B. Internetbrowser, Betriebssystem oder Uhrzeit des Seitenaufrufs).</p>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<div class="container">
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2025 Physio-Remotion. Alle Rechte vorbehalten.</p>
|
||||||
|
<div class="footer-links">
|
||||||
|
<a href="index.html">Startseite</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,55 @@
|
||||||
|
#!/bin/bash
|
||||||
|
|
||||||
|
# Physio-Remotion Deployment Script
|
||||||
|
# This script loads credentials from .env and deploys the 'dist' folder via SFTP.
|
||||||
|
|
||||||
|
# Load .env file
|
||||||
|
if [ -f .env ]; then
|
||||||
|
export $(cat .env | xargs)
|
||||||
|
else
|
||||||
|
echo "Error: .env file not found."
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
||||||
|
# Check for required variables
|
||||||
|
REQUIRED_VARS=("SFTP_USER" "SFTP_PASS" "SFTP_HOST" "SFTP_PORT" "SFTP_SUB_DIR")
|
||||||
|
for VAR in "${REQUIRED_VARS[@]}"; do
|
||||||
|
if [ -z "${!VAR}" ]; then
|
||||||
|
echo "Error: $VAR is not set in .env"
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
done
|
||||||
|
|
||||||
|
echo "--- Starting Build ---"
|
||||||
|
npm run build
|
||||||
|
|
||||||
|
if [ $? -ne 0 ]; then
|
||||||
|
echo "Build failed. Aborting deployment."
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
||||||
|
echo "--- Starting Deployment to $SFTP_HOST ---"
|
||||||
|
|
||||||
|
# We use lftp for robust directory mirroring with password support.
|
||||||
|
# If lftp is not installed, it can be installed via 'brew install lftp' on macOS.
|
||||||
|
if ! command -v lftp &> /dev/null; then
|
||||||
|
echo "Error: lftp is not installed. Please install it using 'brew install lftp'."
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
||||||
|
lftp -u "$SFTP_USER","$SFTP_PASS" -p "$SFTP_PORT" sftp://"$SFTP_HOST" <<EOF
|
||||||
|
set sftp:auto-confirm yes
|
||||||
|
set net:timeout 10
|
||||||
|
set net:max-retries 2
|
||||||
|
mkdir -p $SFTP_SUB_DIR
|
||||||
|
cd $SFTP_SUB_DIR
|
||||||
|
mirror -R dist/ .
|
||||||
|
quit
|
||||||
|
EOF
|
||||||
|
|
||||||
|
if [ $? -eq 0 ]; then
|
||||||
|
echo "--- Deployment Successful! ---"
|
||||||
|
else
|
||||||
|
echo "--- Deployment Failed. ---"
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
@ -0,0 +1,52 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Datenschutz | Physio-Remotion</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header class="header">
|
||||||
|
<div class="container">
|
||||||
|
<div class="logo"><a href="index.html">Physio-Remotion</a></div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="container" style="padding-top: 120px; padding-bottom: 80px;">
|
||||||
|
<h1>Datenschutzerklärung</h1>
|
||||||
|
<section>
|
||||||
|
<h2>1. Datenschutz auf einen Blick</h2>
|
||||||
|
<p>Die folgenden Hinweise geben einen einfachen Überblick darüber, was mit Ihren personenbezogenen Daten
|
||||||
|
passiert, wenn Sie diese Website besuchen.</p>
|
||||||
|
|
||||||
|
<h2>2. Verantwortliche Stelle</h2>
|
||||||
|
<p>Die verantwortliche Stelle für die Datenverarbeitung auf dieser Website ist:</p>
|
||||||
|
<p>Physio-Remotion<br>
|
||||||
|
Justus-von-Liebig-Straße 2<br>
|
||||||
|
85435 Erding</p>
|
||||||
|
<p>E-Mail: info@physio-remotion.de</p>
|
||||||
|
|
||||||
|
<h2>3. Datenerfassung auf unserer Website</h2>
|
||||||
|
<p>Ihre Daten werden zum einen dadurch erhoben, dass Sie uns diese mitteilen. Hierbei kann es sich z. B. um
|
||||||
|
Daten handeln, die Sie uns per E-Mail senden.</p>
|
||||||
|
<p>Andere Daten werden automatisch beim Besuch der Website durch unsere IT-Systeme erfasst. Das sind vor
|
||||||
|
allem technische Daten (z. B. Internetbrowser, Betriebssystem oder Uhrzeit des Seitenaufrufs).</p>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<div class="container">
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2025 Physio-Remotion. Alle Rechte vorbehalten.</p>
|
||||||
|
<div class="footer-links">
|
||||||
|
<a href="index.html">Startseite</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 2.5 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 MiB |
|
|
@ -0,0 +1,63 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Impressum | Physio-Remotion</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header class="header">
|
||||||
|
<div class="container">
|
||||||
|
<div class="logo"><a href="index.html">Physio-Remotion</a></div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="container" style="padding-top: 120px; padding-bottom: 80px;">
|
||||||
|
<h1>Impressum</h1>
|
||||||
|
<section>
|
||||||
|
<h2>Angaben gemäß § 5 TMG</h2>
|
||||||
|
<p>Physio-Remotion<br>
|
||||||
|
Justus-von-Liebig-Straße 2<br>
|
||||||
|
85435 Erding</p>
|
||||||
|
|
||||||
|
<p><strong>Vertreten durch:</strong><br>
|
||||||
|
Magdalena [Nachname]<br>
|
||||||
|
Carmen [Nachname]</p>
|
||||||
|
|
||||||
|
<h3>Kontakt</h3>
|
||||||
|
<p>Telefon: [+49 XXX XXXXXXXX]<br>
|
||||||
|
E-Mail: info@physio-remotion.de</p>
|
||||||
|
|
||||||
|
<h3>Berufsbezeichnung und berufsrechtliche Regelungen</h3>
|
||||||
|
<p>Berufsbezeichnung: Physiotherapeutin (verliehen in der Bundesrepublik Deutschland)</p>
|
||||||
|
<p>Zuständige Aufsichtsbehörde: [Gesundheitsamt Erding]</p>
|
||||||
|
<p>Es gelten folgende berufsrechtliche Regelungen: Gesetz über die Berufe in der Physiotherapie (Masseur-
|
||||||
|
und Physiotherapeutengesetz - MPhG)<br>
|
||||||
|
Regelungen einsehbar unter: <a
|
||||||
|
href="https://www.gesetze-im-internet.de/mphg/index.html">https://www.gesetze-im-internet.de/mphg/index.html</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h3>Angaben zur Berufshaftpflichtversicherung</h3>
|
||||||
|
<p>Name und Sitz des Versicherers:<br>
|
||||||
|
[Name der Versicherung]<br>
|
||||||
|
[Anschrift der Versicherung]</p>
|
||||||
|
<p>Geltungsraum der Versicherung: Deutschland</p>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<div class="container">
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2025 Physio-Remotion. Alle Rechte vorbehalten.</p>
|
||||||
|
<div class="footer-links">
|
||||||
|
<a href="index.html">Startseite</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,77 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Physio-Remotion | Erding</title>
|
||||||
|
<meta name="description" content="Physio-Remotion - Physiotherapiepraxis von Magdalena und Carmen in Erding. Eröffnung im April 2026.">
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="header">
|
||||||
|
<div class="container">
|
||||||
|
<div class="logo">Physio-Remotion</div>
|
||||||
|
<nav class="nav">
|
||||||
|
<a href="#philosophy">Philosophie</a>
|
||||||
|
<a href="#contact">Kontakt</a>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<section class="hero">
|
||||||
|
<div class="hero-background"></div>
|
||||||
|
<div class="hero-content">
|
||||||
|
<h1 class="hero-title">Physio-Remotion</h1>
|
||||||
|
<p class="hero-subtitle">Im April 2026 geht es los.</p>
|
||||||
|
<a href="#philosophy" class="btn btn-primary">Unsere Philosophie</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="philosophy" class="philosophy">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Unsere Philosophie</h2>
|
||||||
|
<div class="philosophy-text">
|
||||||
|
<p>Im Mittelpunkt unserer Arbeit steht der Mensch als Ganzes. Physiotherapie bedeutet für uns, Beweglichkeit und Funktion nachhaltig zu fördern und nicht nur Symptome zu behandeln.</p>
|
||||||
|
<p>Um eine hochwertige und effektive Behandlung sicherzustellen, arbeiten wir im 30-Minuten-Takt, wodurch eine 25-minütige, befundorientierte Therapieeinheit gewährleistet ist.</p>
|
||||||
|
<p>Dadurch begleiten wir unsere Patientinnen und Patienten auf dem Weg zu mehr Gesundheit, Selbstständigkeit und mehr Lebensqualität!</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="contact" class="contact">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Kontakt</h2>
|
||||||
|
<div class="contact-grid">
|
||||||
|
<div class="contact-item">
|
||||||
|
<h3>Anschrift</h3>
|
||||||
|
<p>Justus-von-Liebig-Straße 2<br>85435 Erding</p>
|
||||||
|
</div>
|
||||||
|
<div class="contact-item">
|
||||||
|
<h3>Kontakt</h3>
|
||||||
|
<p>Telefon: [+49 XXX XXXXXXXX]</p>
|
||||||
|
<p>E-Mail: <a href="mailto:info@physio-remotion.de">info@physio-remotion.de</a></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<div class="container">
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2025 Physio-Remotion. Alle Rechte vorbehalten.</p>
|
||||||
|
<div class="footer-links">
|
||||||
|
<a href="impressum.html">Impressum</a>
|
||||||
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script src="main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
// Basic interactions for Physio-Remotion website
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
console.log('Physio-Remotion website loaded.');
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,279 @@
|
||||||
|
:root {
|
||||||
|
/* Color Palette */
|
||||||
|
--primary: #699ba4;
|
||||||
|
--primary-light: #8ac3ca;
|
||||||
|
--accent: #d4a373;
|
||||||
|
--white: #ffffff;
|
||||||
|
--text-dark: #333333;
|
||||||
|
--text-muted: #666666;
|
||||||
|
--bg-light: #f9fbfb;
|
||||||
|
|
||||||
|
/* Layout */
|
||||||
|
--container-width: 1100px;
|
||||||
|
--header-height: 80px;
|
||||||
|
|
||||||
|
/* Transitions */
|
||||||
|
--transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: var(--text-dark);
|
||||||
|
background-color: var(--bg-light);
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3 {
|
||||||
|
font-family: 'Montserrat', sans-serif;
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: inherit;
|
||||||
|
transition: var(--transition);
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
max-width: var(--container-width);
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header */
|
||||||
|
.header {
|
||||||
|
height: var(--header-height);
|
||||||
|
background: var(--white);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 1000;
|
||||||
|
box-shadow: 0 2px 10px rgba(0,0,0,0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.header .container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--primary);
|
||||||
|
font-family: 'Montserrat', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav a {
|
||||||
|
margin-left: 25px;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav a:hover {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hero Section */
|
||||||
|
.hero {
|
||||||
|
height: 100vh;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
text-align: center;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-background {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-image: url('img/praxis_landscape.jpg');
|
||||||
|
background-size: cover;
|
||||||
|
background-position: center;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Landscape for desktop, Portrait for mobile */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.hero-background {
|
||||||
|
background-image: url('img/praxis_portrait.jpg');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-background::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: rgba(255, 255, 255, 0.75); /* White overlay */
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-content {
|
||||||
|
max-width: 800px;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-title {
|
||||||
|
font-size: 3.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-subtitle {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Buttons */
|
||||||
|
.btn {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 12px 30px;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary {
|
||||||
|
background: var(--primary);
|
||||||
|
color: var(--white);
|
||||||
|
border: 2px solid var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary:hover {
|
||||||
|
background: transparent;
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Philosophy Section */
|
||||||
|
.philosophy {
|
||||||
|
padding: 100px 0;
|
||||||
|
background: var(--white);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.philosophy h2 {
|
||||||
|
margin-bottom: 40px;
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.philosophy h2::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: -10px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
width: 50px;
|
||||||
|
height: 3px;
|
||||||
|
background: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.philosophy-text {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.philosophy-text p {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Contact Section */
|
||||||
|
.contact {
|
||||||
|
padding: 80px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact h2 {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||||
|
gap: 40px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-item h3 {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
.footer {
|
||||||
|
background: var(--white);
|
||||||
|
padding: 40px 0;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-bottom {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 20px;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-links a {
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-links a:hover {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Mobile Optimizations */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.hero-title {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-subtitle {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header {
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav {
|
||||||
|
display: none; /* Can add a burger menu later if needed */
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-bottom {
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-links a {
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 2.5 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 MiB |
|
|
@ -0,0 +1,63 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Impressum | Physio-Remotion</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header class="header">
|
||||||
|
<div class="container">
|
||||||
|
<div class="logo"><a href="index.html">Physio-Remotion</a></div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="container" style="padding-top: 120px; padding-bottom: 80px;">
|
||||||
|
<h1>Impressum</h1>
|
||||||
|
<section>
|
||||||
|
<h2>Angaben gemäß § 5 TMG</h2>
|
||||||
|
<p>Physio-Remotion<br>
|
||||||
|
Justus-von-Liebig-Straße 2<br>
|
||||||
|
85435 Erding</p>
|
||||||
|
|
||||||
|
<p><strong>Vertreten durch:</strong><br>
|
||||||
|
Magdalena [Nachname]<br>
|
||||||
|
Carmen [Nachname]</p>
|
||||||
|
|
||||||
|
<h3>Kontakt</h3>
|
||||||
|
<p>Telefon: [+49 XXX XXXXXXXX]<br>
|
||||||
|
E-Mail: info@physio-remotion.de</p>
|
||||||
|
|
||||||
|
<h3>Berufsbezeichnung und berufsrechtliche Regelungen</h3>
|
||||||
|
<p>Berufsbezeichnung: Physiotherapeutin (verliehen in der Bundesrepublik Deutschland)</p>
|
||||||
|
<p>Zuständige Aufsichtsbehörde: [Gesundheitsamt Erding]</p>
|
||||||
|
<p>Es gelten folgende berufsrechtliche Regelungen: Gesetz über die Berufe in der Physiotherapie (Masseur-
|
||||||
|
und Physiotherapeutengesetz - MPhG)<br>
|
||||||
|
Regelungen einsehbar unter: <a
|
||||||
|
href="https://www.gesetze-im-internet.de/mphg/index.html">https://www.gesetze-im-internet.de/mphg/index.html</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h3>Angaben zur Berufshaftpflichtversicherung</h3>
|
||||||
|
<p>Name und Sitz des Versicherers:<br>
|
||||||
|
[Name der Versicherung]<br>
|
||||||
|
[Anschrift der Versicherung]</p>
|
||||||
|
<p>Geltungsraum der Versicherung: Deutschland</p>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<div class="container">
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2025 Physio-Remotion. Alle Rechte vorbehalten.</p>
|
||||||
|
<div class="footer-links">
|
||||||
|
<a href="index.html">Startseite</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,77 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Physio-Remotion | Erding</title>
|
||||||
|
<meta name="description" content="Physio-Remotion - Physiotherapiepraxis von Magdalena und Carmen in Erding. Eröffnung im April 2026.">
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="header">
|
||||||
|
<div class="container">
|
||||||
|
<div class="logo">Physio-Remotion</div>
|
||||||
|
<nav class="nav">
|
||||||
|
<a href="#philosophy">Philosophie</a>
|
||||||
|
<a href="#contact">Kontakt</a>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<section class="hero">
|
||||||
|
<div class="hero-background"></div>
|
||||||
|
<div class="hero-content">
|
||||||
|
<h1 class="hero-title">Physio-Remotion</h1>
|
||||||
|
<p class="hero-subtitle">Im April 2026 geht es los.</p>
|
||||||
|
<a href="#philosophy" class="btn btn-primary">Unsere Philosophie</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="philosophy" class="philosophy">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Unsere Philosophie</h2>
|
||||||
|
<div class="philosophy-text">
|
||||||
|
<p>Im Mittelpunkt unserer Arbeit steht der Mensch als Ganzes. Physiotherapie bedeutet für uns, Beweglichkeit und Funktion nachhaltig zu fördern und nicht nur Symptome zu behandeln.</p>
|
||||||
|
<p>Um eine hochwertige und effektive Behandlung sicherzustellen, arbeiten wir im 30-Minuten-Takt, wodurch eine 25-minütige, befundorientierte Therapieeinheit gewährleistet ist.</p>
|
||||||
|
<p>Dadurch begleiten wir unsere Patientinnen und Patienten auf dem Weg zu mehr Gesundheit, Selbstständigkeit und mehr Lebensqualität!</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="contact" class="contact">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Kontakt</h2>
|
||||||
|
<div class="contact-grid">
|
||||||
|
<div class="contact-item">
|
||||||
|
<h3>Anschrift</h3>
|
||||||
|
<p>Justus-von-Liebig-Straße 2<br>85435 Erding</p>
|
||||||
|
</div>
|
||||||
|
<div class="contact-item">
|
||||||
|
<h3>Kontakt</h3>
|
||||||
|
<p>Telefon: [+49 XXX XXXXXXXX]</p>
|
||||||
|
<p>E-Mail: <a href="mailto:info@physio-remotion.de">info@physio-remotion.de</a></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<div class="container">
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2025 Physio-Remotion. Alle Rechte vorbehalten.</p>
|
||||||
|
<div class="footer-links">
|
||||||
|
<a href="impressum.html">Impressum</a>
|
||||||
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script src="main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
// Basic interactions for Physio-Remotion website
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
console.log('Physio-Remotion website loaded.');
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,11 @@
|
||||||
|
{
|
||||||
|
"name": "physio-remotion",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "Coming Soon Website for Physio-Remotion",
|
||||||
|
"scripts": {
|
||||||
|
"build": "rm -rf dist && mkdir -p dist/img && cp *.html style.css main.js dist/ && cp img/* dist/img/",
|
||||||
|
"deploy": "./deploy.sh"
|
||||||
|
},
|
||||||
|
"author": "",
|
||||||
|
"license": "ISC"
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,279 @@
|
||||||
|
:root {
|
||||||
|
/* Color Palette */
|
||||||
|
--primary: #699ba4;
|
||||||
|
--primary-light: #8ac3ca;
|
||||||
|
--accent: #d4a373;
|
||||||
|
--white: #ffffff;
|
||||||
|
--text-dark: #333333;
|
||||||
|
--text-muted: #666666;
|
||||||
|
--bg-light: #f9fbfb;
|
||||||
|
|
||||||
|
/* Layout */
|
||||||
|
--container-width: 1100px;
|
||||||
|
--header-height: 80px;
|
||||||
|
|
||||||
|
/* Transitions */
|
||||||
|
--transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: var(--text-dark);
|
||||||
|
background-color: var(--bg-light);
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3 {
|
||||||
|
font-family: 'Montserrat', sans-serif;
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: inherit;
|
||||||
|
transition: var(--transition);
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
max-width: var(--container-width);
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header */
|
||||||
|
.header {
|
||||||
|
height: var(--header-height);
|
||||||
|
background: var(--white);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 1000;
|
||||||
|
box-shadow: 0 2px 10px rgba(0,0,0,0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.header .container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--primary);
|
||||||
|
font-family: 'Montserrat', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav a {
|
||||||
|
margin-left: 25px;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav a:hover {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hero Section */
|
||||||
|
.hero {
|
||||||
|
height: 100vh;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
text-align: center;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-background {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-image: url('img/praxis_landscape.jpg');
|
||||||
|
background-size: cover;
|
||||||
|
background-position: center;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Landscape for desktop, Portrait for mobile */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.hero-background {
|
||||||
|
background-image: url('img/praxis_portrait.jpg');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-background::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: rgba(255, 255, 255, 0.75); /* White overlay */
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-content {
|
||||||
|
max-width: 800px;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-title {
|
||||||
|
font-size: 3.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-subtitle {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Buttons */
|
||||||
|
.btn {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 12px 30px;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary {
|
||||||
|
background: var(--primary);
|
||||||
|
color: var(--white);
|
||||||
|
border: 2px solid var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary:hover {
|
||||||
|
background: transparent;
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Philosophy Section */
|
||||||
|
.philosophy {
|
||||||
|
padding: 100px 0;
|
||||||
|
background: var(--white);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.philosophy h2 {
|
||||||
|
margin-bottom: 40px;
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.philosophy h2::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: -10px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
width: 50px;
|
||||||
|
height: 3px;
|
||||||
|
background: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.philosophy-text {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.philosophy-text p {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Contact Section */
|
||||||
|
.contact {
|
||||||
|
padding: 80px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact h2 {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||||
|
gap: 40px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-item h3 {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
.footer {
|
||||||
|
background: var(--white);
|
||||||
|
padding: 40px 0;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-bottom {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 20px;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-links a {
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-links a:hover {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Mobile Optimizations */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.hero-title {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-subtitle {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header {
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav {
|
||||||
|
display: none; /* Can add a burger menu later if needed */
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-bottom {
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-links a {
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue