diff --git a/android-chrome-192x192.png b/android-chrome-192x192.png new file mode 100644 index 0000000..823c0aa Binary files /dev/null and b/android-chrome-192x192.png differ diff --git a/android-chrome-512x512.png b/android-chrome-512x512.png new file mode 100644 index 0000000..210ae80 Binary files /dev/null and b/android-chrome-512x512.png differ diff --git a/apple-touch-icon.png b/apple-touch-icon.png new file mode 100644 index 0000000..511a768 Binary files /dev/null and b/apple-touch-icon.png differ diff --git a/favicon-16x16.png b/favicon-16x16.png new file mode 100644 index 0000000..022c28a Binary files /dev/null and b/favicon-16x16.png differ diff --git a/favicon-32x32.png b/favicon-32x32.png new file mode 100644 index 0000000..e9f44ca Binary files /dev/null and b/favicon-32x32.png differ diff --git a/favicon.ico b/favicon.ico new file mode 100644 index 0000000..e9f44ca Binary files /dev/null and b/favicon.ico differ diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..57f718f --- /dev/null +++ b/favicon.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/generate-favicons.js b/generate-favicons.js new file mode 100644 index 0000000..02f0e48 --- /dev/null +++ b/generate-favicons.js @@ -0,0 +1,18 @@ +const fs = require('fs'); +const https = require('https'); + +// Einfaches Script um SVG in verschiedene PNG-Größen zu konvertieren +// Nutzt einen Online-Service (RealFaviconGenerator API Alternative) + +const sizes = [16, 32, 180, 192, 512]; +const svgContent = fs.readFileSync('favicon.svg', 'utf8'); + +console.log('Favicons müssen manuell erstellt werden.'); +console.log('Optionen:'); +console.log('1. Online: https://realfavicongenerator.net/'); +console.log('2. Online: https://favicon.io/'); +console.log('3. Lokal mit ImageMagick installieren:'); +console.log(' sudo apt install imagemagick'); +console.log(' oder: sudo dnf install ImageMagick'); +console.log(''); +console.log('SVG-Favicon wurde bereits erstellt und wird von modernen Browsern unterstützt!'); diff --git a/img/Andreas_Guttenberger.jpg b/img/Andreas_Guttenberger.jpg new file mode 100644 index 0000000..9bd1fe1 Binary files /dev/null and b/img/Andreas_Guttenberger.jpg differ diff --git a/img/axa_logo.svg b/img/axa_logo.svg new file mode 100644 index 0000000..0f81752 --- /dev/null +++ b/img/axa_logo.svg @@ -0,0 +1,25 @@ + + + + + + + + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..7d6b620 --- /dev/null +++ b/index.html @@ -0,0 +1,144 @@ + + + + + + + Andreas Guttenberger - Versicherungsfachmann (IHK) + + + + + + + + + + + + + +
+
+
+
+ Andreas Guttenberger +
+
+ +

Andreas Guttenberger

+

Versicherungsfachmann (IHK)

+

Ihre persönliche Beratung für alle Versicherungsfragen

+
+ Kontakt aufnehmen + Jetzt anrufen +
+
+
+
+
+ + +
+
+

Meine Leistungen

+
+
+
🏠
+

Privatkunden

+

Individuelle Absicherung für Sie und Ihre Familie - von Kranken- bis Lebensversicherung

+
+
+
🏢
+

Gewerbekunden

+

Maßgeschneiderte Lösungen für Ihr Unternehmen und Ihre betrieblichen Risiken

+
+
+
💼
+

Altersvorsorge

+

Sichere Planung Ihrer finanziellen Zukunft mit passenden Vorsorgelösungen

+
+
+
🤝
+

Beratung vor Ort

+

Persönliche Betreuung in Kallmünz und Umgebung - kompetent und zuverlässig

+
+
+
+
+ + +
+
+

Warum ich?

+
+
+

✓ Kompetenz

+

Als geprüfter Versicherungsfachmann (IHK) verfüge ich über fundiertes Fachwissen

+
+
+

✓ Nähe

+

Persönlicher Ansprechpartner in Ihrer Region mit schneller Erreichbarkeit

+
+
+

✓ AXA Partner

+

Starke Produkte eines der führenden Versicherungsunternehmen weltweit

+
+
+
+
+ + +
+
+

Kontakt

+
+
+

Andreas Guttenberger

+

Versicherungsfachmann (IHK)

+ +
+ 📍 Adresse +

Am Fallgatter 6
93183 Kallmünz / Traidendorf

+
+ +
+ 📧 E-Mail +

andreas.guttenberger@axa.de

+
+ +
+ 📞 Telefon +

+ Festnetz: +49 9471 7184
+ Mobil: +49 151 74483560
+ Fax: +49 9471 8795 +

+
+
+ +
+

Vereinbaren Sie einen Termin

+

Gerne berate ich Sie persönlich zu Ihren Versicherungsfragen. Kontaktieren Sie mich für ein unverbindliches Gespräch.

+
+ E-Mail schreiben + Anrufen +
+
+
+
+
+ + + + + + + \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..81fc261 --- /dev/null +++ b/script.js @@ -0,0 +1,40 @@ +// Smooth scrolling for anchor links +document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + e.preventDefault(); + const target = document.querySelector(this.getAttribute('href')); + if (target) { + target.scrollIntoView({ + behavior: 'smooth', + block: 'start' + }); + } + }); +}); + +// Add animation on scroll +const observerOptions = { + threshold: 0.1, + rootMargin: '0px 0px -50px 0px' +}; + +const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.style.opacity = '1'; + entry.target.style.transform = 'translateY(0)'; + } + }); +}, observerOptions); + +// Observe service cards and about items +document.addEventListener('DOMContentLoaded', () => { + const animatedElements = document.querySelectorAll('.service-card, .about-item'); + + animatedElements.forEach(el => { + el.style.opacity = '0'; + el.style.transform = 'translateY(20px)'; + el.style.transition = 'opacity 0.6s ease, transform 0.6s ease'; + observer.observe(el); + }); +}); \ No newline at end of file diff --git a/site.webmanifest b/site.webmanifest new file mode 100644 index 0000000..08d3d41 --- /dev/null +++ b/site.webmanifest @@ -0,0 +1,20 @@ +{ + "name": "Andreas Guttenberger", + "short_name": "A. Guttenberger", + "description": "Versicherungsfachmann (IHK) - AXA", + "icons": [ + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ], + "theme_color": "#213683", + "background_color": "#213683", + "display": "standalone" +} \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..428911b --- /dev/null +++ b/style.css @@ -0,0 +1,447 @@ +/* Reset & Base Styles */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +:root { + --primary-color: #00008f; + --secondary-color: #0047bb; + --accent-color: #ff1721; + --text-dark: #1a1a1a; + --text-light: #555; + --bg-light: #f8f9fa; + --white: #ffffff; + --shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.15); +} + +html { + scroll-behavior: smooth; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; + line-height: 1.6; + color: var(--text-dark); + background-color: var(--white); +} + +.container { + max-width: 1200px; + margin: 0 auto; + padding: 0 20px; +} + +/* Hero Section */ +.hero { + background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%); + color: var(--white); + padding: 80px 20px; + min-height: 100vh; + display: flex; + align-items: center; +} + +.hero-content { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 60px; + align-items: center; +} + +.hero-image { + display: flex; + justify-content: center; +} + +.portrait { + width: 100%; + max-width: 400px; + border-radius: 20px; + box-shadow: var(--shadow-lg); + border: 8px solid rgba(255, 255, 255, 0.2); +} + +.hero-text { + text-align: left; +} + +.logo { + height: 60px; + margin-bottom: 20px; + filter: brightness(0) invert(1); +} + +.hero h1 { + font-size: 3rem; + font-weight: 700; + margin-bottom: 10px; + line-height: 1.2; +} + +.subtitle { + font-size: 1.5rem; + font-weight: 300; + margin-bottom: 20px; + opacity: 0.9; +} + +.tagline { + font-size: 1.2rem; + margin-bottom: 40px; + opacity: 0.85; + font-weight: 300; +} + +.cta-buttons { + display: flex; + gap: 15px; + flex-wrap: wrap; +} + +.btn { + display: inline-block; + padding: 15px 35px; + border-radius: 50px; + text-decoration: none; + font-weight: 600; + font-size: 1rem; + transition: all 0.3s ease; + border: 2px solid transparent; +} + +.btn-primary { + background-color: var(--white); + color: var(--primary-color); +} + +.btn-primary:hover { + background-color: transparent; + border-color: var(--white); + color: var(--white); + transform: translateY(-2px); + box-shadow: var(--shadow-lg); +} + +.btn-secondary { + background-color: transparent; + color: var(--white); + border: 2px solid var(--white); +} + +.btn-secondary:hover { + background-color: var(--white); + color: var(--primary-color); + transform: translateY(-2px); +} + +/* Services Section */ +.services { + padding: 80px 20px; + background-color: var(--white); +} + +.services h2 { + text-align: center; + font-size: 2.5rem; + margin-bottom: 50px; + color: var(--primary-color); +} + +.services-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 30px; +} + +.service-card { + background: var(--white); + padding: 40px 30px; + border-radius: 15px; + text-align: center; + transition: all 0.3s ease; + border: 2px solid #e0e0e0; +} + +.service-card:hover { + transform: translateY(-10px); + box-shadow: var(--shadow-lg); + border-color: var(--secondary-color); +} + +.service-card .icon { + font-size: 3rem; + margin-bottom: 20px; +} + +.service-card h3 { + font-size: 1.5rem; + margin-bottom: 15px; + color: var(--primary-color); +} + +.service-card p { + color: var(--text-light); + line-height: 1.6; +} + +/* About Section */ +.about { + padding: 80px 20px; + background-color: var(--bg-light); +} + +.about h2 { + text-align: center; + font-size: 2.5rem; + margin-bottom: 50px; + color: var(--primary-color); +} + +.about-content { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 40px; +} + +.about-item { + text-align: center; +} + +.about-item h3 { + font-size: 1.5rem; + margin-bottom: 15px; + color: var(--primary-color); +} + +.about-item p { + color: var(--text-light); + font-size: 1.1rem; + line-height: 1.6; +} + +/* Contact Section */ +.contact { + padding: 80px 20px; + background-color: var(--white); +} + +.contact h2 { + text-align: center; + font-size: 2.5rem; + margin-bottom: 50px; + color: var(--primary-color); +} + +.contact-grid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 60px; + max-width: 1000px; + margin: 0 auto; +} + +.contact-info h3 { + font-size: 1.8rem; + color: var(--primary-color); + margin-bottom: 10px; +} + +.contact-title { + color: var(--text-light); + font-size: 1.1rem; + margin-bottom: 30px; +} + +.contact-item { + margin-bottom: 25px; +} + +.contact-item strong { + display: block; + color: var(--primary-color); + font-size: 1.1rem; + margin-bottom: 8px; +} + +.contact-item p { + color: var(--text-light); + line-height: 1.8; +} + +.contact-item a { + color: var(--secondary-color); + text-decoration: none; + transition: color 0.3s ease; +} + +.contact-item a:hover { + color: var(--primary-color); + text-decoration: underline; +} + +.contact-cta { + background: var(--bg-light); + padding: 40px; + border-radius: 15px; + text-align: center; +} + +.contact-cta h3 { + font-size: 1.8rem; + color: var(--primary-color); + margin-bottom: 20px; +} + +.contact-cta p { + color: var(--text-light); + font-size: 1.1rem; + line-height: 1.6; + margin-bottom: 30px; +} + +.contact-buttons { + display: flex; + flex-direction: column; + gap: 15px; +} + +.contact-buttons .btn { + width: 100%; + text-align: center; +} + +.contact-buttons .btn-primary { + background-color: var(--primary-color); + color: var(--white); +} + +.contact-buttons .btn-primary:hover { + background-color: var(--secondary-color); + border-color: var(--secondary-color); +} + +.contact-buttons .btn-secondary { + background-color: transparent; + color: var(--primary-color); + border: 2px solid var(--primary-color); +} + +.contact-buttons .btn-secondary:hover { + background-color: var(--primary-color); + color: var(--white); +} + +/* Footer */ +.footer { + background-color: var(--primary-color); + color: var(--white); + padding: 40px 20px; + text-align: center; +} + +.footer p { + margin-bottom: 10px; +} + +.footer .legal { + font-size: 0.9rem; + opacity: 0.8; +} + +.footer a { + color: var(--white); + text-decoration: underline; + transition: opacity 0.3s ease; +} + +.footer a:hover { + opacity: 0.7; +} + +/* Responsive Design */ +@media (max-width: 968px) { + .hero-content { + grid-template-columns: 1fr; + gap: 40px; + text-align: center; + } + + .hero-text { + text-align: center; + } + + .hero h1 { + font-size: 2.5rem; + } + + .cta-buttons { + justify-content: center; + } + + .contact-grid { + grid-template-columns: 1fr; + gap: 40px; + } +} + +@media (max-width: 768px) { + .hero { + padding: 60px 20px; + min-height: auto; + } + + .hero h1 { + font-size: 2rem; + } + + .subtitle { + font-size: 1.2rem; + } + + .tagline { + font-size: 1rem; + } + + .services, + .about, + .contact { + padding: 60px 20px; + } + + .services h2, + .about h2, + .contact h2 { + font-size: 2rem; + } + + .services-grid { + grid-template-columns: 1fr; + } + + .about-content { + grid-template-columns: 1fr; + } +} + +@media (max-width: 480px) { + .btn { + padding: 12px 25px; + font-size: 0.9rem; + } + + .cta-buttons { + flex-direction: column; + width: 100%; + } + + .cta-buttons .btn { + width: 100%; + } + + .portrait { + max-width: 300px; + } +} \ No newline at end of file