Füge Navigation und umfassende SEO-Optimierung hinzu
- Sticky Navigation mit Logo und Menü-Links - Mobile Hamburger-Menü mit Smooth Scroll - Back-to-Top Button mit Scroll-Effekt - Umfassende SEO Meta-Tags (Keywords, Description, Geo) - Open Graph und Twitter Card Tags für Social Media - Schema.org strukturierte Daten (InsuranceAgency, Person) - robots.txt und sitemap.xml für Suchmaschinen - Canonical URLs auf allen Seiten - Local SEO Optimierung für Kallmünz/Regensburg
This commit is contained in:
@@ -3,7 +3,10 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Datenschutzerklärung - Andreas Guttenberger</title>
|
<meta name="description" content="Datenschutzerklärung von Andreas Guttenberger. Informationen zum Datenschutz und zur Verarbeitung personenbezogener Daten.">
|
||||||
|
<meta name="robots" content="noindex, follow">
|
||||||
|
<link rel="canonical" href="https://www.andreas-guttenberger.de/datenschutz.html">
|
||||||
|
<title>Datenschutzerklärung - Andreas Guttenberger | Versicherungsfachmann (IHK)</title>
|
||||||
|
|
||||||
<!-- Favicons -->
|
<!-- Favicons -->
|
||||||
<link rel="icon" type="image/svg+xml" href="favicon.svg">
|
<link rel="icon" type="image/svg+xml" href="favicon.svg">
|
||||||
|
|||||||
@@ -3,7 +3,10 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Impressum - Andreas Guttenberger</title>
|
<meta name="description" content="Impressum von Andreas Guttenberger, Versicherungsfachmann (IHK) in Kallmünz. Rechtliche Angaben und Kontaktinformationen.">
|
||||||
|
<meta name="robots" content="noindex, follow">
|
||||||
|
<link rel="canonical" href="https://www.andreas-guttenberger.de/impressum.html">
|
||||||
|
<title>Impressum - Andreas Guttenberger | Versicherungsfachmann (IHK)</title>
|
||||||
|
|
||||||
<!-- Favicons -->
|
<!-- Favicons -->
|
||||||
<link rel="icon" type="image/svg+xml" href="favicon.svg">
|
<link rel="icon" type="image/svg+xml" href="favicon.svg">
|
||||||
|
|||||||
146
index.html
146
index.html
@@ -3,8 +3,35 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<meta name="description" content="Andreas Guttenberger - Ihr Versicherungsfachmann (IHK) in Kallmünz. Persönliche Beratung für alle Versicherungsfragen.">
|
|
||||||
<title>Andreas Guttenberger - Versicherungsfachmann (IHK)</title>
|
<!-- SEO Meta Tags -->
|
||||||
|
<meta name="description" content="Andreas Guttenberger - Ihr Versicherungsfachmann (IHK) in Kallmünz. Persönliche Beratung für alle Versicherungsfragen. ✓ Kompetent ✓ Persönlich ✓ AXA Partner">
|
||||||
|
<meta name="keywords" content="Versicherung Kallmünz, Versicherungsmakler, Versicherungsfachmann IHK, AXA Versicherung, Krankenversicherung, Lebensversicherung, Altersvorsorge, Betriebsversicherung, Traidendorf, Regensburg">
|
||||||
|
<meta name="author" content="Andreas Guttenberger">
|
||||||
|
<meta name="robots" content="index, follow">
|
||||||
|
<meta name="language" content="de">
|
||||||
|
<meta name="geo.region" content="DE-BY">
|
||||||
|
<meta name="geo.placename" content="Kallmünz">
|
||||||
|
<meta name="geo.position" content="49.1617;11.9619">
|
||||||
|
<meta name="ICBM" content="49.1617, 11.9619">
|
||||||
|
<link rel="canonical" href="https://www.andreas-guttenberger.de/">
|
||||||
|
|
||||||
|
<!-- Open Graph / Facebook -->
|
||||||
|
<meta property="og:type" content="website">
|
||||||
|
<meta property="og:url" content="https://www.andreas-guttenberger.de/">
|
||||||
|
<meta property="og:title" content="Andreas Guttenberger - Versicherungsfachmann (IHK) Kallmünz">
|
||||||
|
<meta property="og:description" content="Ihr persönlicher Versicherungsfachmann in Kallmünz. Kompetente Beratung für Privat- und Gewerbekunden. AXA Partner.">
|
||||||
|
<meta property="og:image" content="https://www.andreas-guttenberger.de/img/Andreas_Guttenberger.jpg">
|
||||||
|
<meta property="og:locale" content="de_DE">
|
||||||
|
<meta property="og:site_name" content="Andreas Guttenberger Versicherungen">
|
||||||
|
|
||||||
|
<!-- Twitter -->
|
||||||
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
|
<meta name="twitter:title" content="Andreas Guttenberger - Versicherungsfachmann (IHK)">
|
||||||
|
<meta name="twitter:description" content="Ihr persönlicher Versicherungsfachmann in Kallmünz. Kompetente Beratung für alle Versicherungsfragen.">
|
||||||
|
<meta name="twitter:image" content="https://www.andreas-guttenberger.de/img/Andreas_Guttenberger.jpg">
|
||||||
|
|
||||||
|
<title>Andreas Guttenberger - Versicherungsfachmann (IHK) | Kallmünz</title>
|
||||||
|
|
||||||
<!-- Favicons -->
|
<!-- Favicons -->
|
||||||
<link rel="icon" type="image/svg+xml" href="favicon.svg">
|
<link rel="icon" type="image/svg+xml" href="favicon.svg">
|
||||||
@@ -20,8 +47,31 @@
|
|||||||
<link rel="stylesheet" href="style.css">
|
<link rel="stylesheet" href="style.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<!-- Navigation -->
|
||||||
|
<nav class="navbar" id="navbar">
|
||||||
|
<div class="container">
|
||||||
|
<div class="nav-content">
|
||||||
|
<a href="#" class="nav-logo">
|
||||||
|
<img src="img/AXA_Logo_FR.svg" alt="AXA" class="nav-logo-img">
|
||||||
|
<span>Andreas Guttenberger</span>
|
||||||
|
</a>
|
||||||
|
<button class="nav-toggle" id="navToggle" aria-label="Navigation umschalten">
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
</button>
|
||||||
|
<ul class="nav-menu" id="navMenu">
|
||||||
|
<li><a href="#home" class="nav-link">Start</a></li>
|
||||||
|
<li><a href="#leistungen" class="nav-link">Leistungen</a></li>
|
||||||
|
<li><a href="#ueber-mich" class="nav-link">Über mich</a></li>
|
||||||
|
<li><a href="#kontakt" class="nav-link">Kontakt</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<!-- Hero Section -->
|
<!-- Hero Section -->
|
||||||
<header class="hero">
|
<header class="hero" id="home">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="hero-content">
|
<div class="hero-content">
|
||||||
<div class="hero-image">
|
<div class="hero-image">
|
||||||
@@ -42,7 +92,7 @@
|
|||||||
</header>
|
</header>
|
||||||
|
|
||||||
<!-- Services Section -->
|
<!-- Services Section -->
|
||||||
<section class="services">
|
<section class="services" id="leistungen">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h2>Meine Leistungen</h2>
|
<h2>Meine Leistungen</h2>
|
||||||
<div class="services-grid">
|
<div class="services-grid">
|
||||||
@@ -71,7 +121,7 @@
|
|||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- About Section -->
|
<!-- About Section -->
|
||||||
<section class="about">
|
<section class="about" id="ueber-mich">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h2>Warum ich?</h2>
|
<h2>Warum ich?</h2>
|
||||||
<div class="about-content">
|
<div class="about-content">
|
||||||
@@ -137,6 +187,13 @@
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<!-- Back to Top Button -->
|
||||||
|
<button id="backToTop" class="back-to-top" aria-label="Nach oben scrollen">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<polyline points="18 15 12 9 6 15"></polyline>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@@ -151,6 +208,85 @@
|
|||||||
|
|
||||||
<!-- Leaflet JS -->
|
<!-- Leaflet JS -->
|
||||||
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
|
||||||
|
|
||||||
|
<!-- Schema.org Structured Data -->
|
||||||
|
<script type="application/ld+json">
|
||||||
|
{
|
||||||
|
"@context": "https://schema.org",
|
||||||
|
"@type": "InsuranceAgency",
|
||||||
|
"name": "Andreas Guttenberger - Versicherungsfachmann (IHK)",
|
||||||
|
"image": "https://www.andreas-guttenberger.de/img/Andreas_Guttenberger.jpg",
|
||||||
|
"@id": "https://www.andreas-guttenberger.de",
|
||||||
|
"url": "https://www.andreas-guttenberger.de",
|
||||||
|
"telephone": "+4915174483560",
|
||||||
|
"email": "andreas.guttenberger@axa.de",
|
||||||
|
"address": {
|
||||||
|
"@type": "PostalAddress",
|
||||||
|
"streetAddress": "Am Fallgatter 6",
|
||||||
|
"addressLocality": "Kallmünz",
|
||||||
|
"addressRegion": "Bayern",
|
||||||
|
"postalCode": "93183",
|
||||||
|
"addressCountry": "DE"
|
||||||
|
},
|
||||||
|
"geo": {
|
||||||
|
"@type": "GeoCoordinates",
|
||||||
|
"latitude": 49.1617,
|
||||||
|
"longitude": 11.9619
|
||||||
|
},
|
||||||
|
"openingHoursSpecification": {
|
||||||
|
"@type": "OpeningHoursSpecification",
|
||||||
|
"dayOfWeek": [
|
||||||
|
"Monday",
|
||||||
|
"Tuesday",
|
||||||
|
"Wednesday",
|
||||||
|
"Thursday",
|
||||||
|
"Friday"
|
||||||
|
],
|
||||||
|
"opens": "09:00",
|
||||||
|
"closes": "18:00"
|
||||||
|
},
|
||||||
|
"sameAs": [
|
||||||
|
"https://www.axa-betreuer.de/martin_goetz/ueber-uns/filialen-und-team"
|
||||||
|
],
|
||||||
|
"priceRange": "$$",
|
||||||
|
"areaServed": {
|
||||||
|
"@type": "GeoCircle",
|
||||||
|
"geoMidpoint": {
|
||||||
|
"@type": "GeoCoordinates",
|
||||||
|
"latitude": 49.1617,
|
||||||
|
"longitude": 11.9619
|
||||||
|
},
|
||||||
|
"geoRadius": "50000"
|
||||||
|
},
|
||||||
|
"description": "Versicherungsfachmann (IHK) in Kallmünz. Persönliche Beratung für Privat- und Gewerbekunden in allen Versicherungsfragen. AXA Partner."
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="application/ld+json">
|
||||||
|
{
|
||||||
|
"@context": "https://schema.org",
|
||||||
|
"@type": "Person",
|
||||||
|
"name": "Andreas Guttenberger",
|
||||||
|
"jobTitle": "Versicherungsfachmann (IHK)",
|
||||||
|
"telephone": "+4915174483560",
|
||||||
|
"email": "andreas.guttenberger@axa.de",
|
||||||
|
"url": "https://www.andreas-guttenberger.de",
|
||||||
|
"image": "https://www.andreas-guttenberger.de/img/Andreas_Guttenberger.jpg",
|
||||||
|
"address": {
|
||||||
|
"@type": "PostalAddress",
|
||||||
|
"streetAddress": "Am Fallgatter 6",
|
||||||
|
"addressLocality": "Kallmünz",
|
||||||
|
"addressRegion": "Bayern",
|
||||||
|
"postalCode": "93183",
|
||||||
|
"addressCountry": "DE"
|
||||||
|
},
|
||||||
|
"worksFor": {
|
||||||
|
"@type": "Organization",
|
||||||
|
"name": "AXA"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
<script src="script.js"></script>
|
<script src="script.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
20
robots.txt
Normal file
20
robots.txt
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
User-agent: *
|
||||||
|
Allow: /
|
||||||
|
|
||||||
|
# Sitemaps
|
||||||
|
Sitemap: https://www.andreas-guttenberger.de/sitemap.xml
|
||||||
|
|
||||||
|
# Disallow admin pages if any
|
||||||
|
User-agent: *
|
||||||
|
Disallow: /admin/
|
||||||
|
Disallow: /*.pdf$
|
||||||
|
|
||||||
|
# Allow all search engines
|
||||||
|
User-agent: Googlebot
|
||||||
|
Allow: /
|
||||||
|
|
||||||
|
User-agent: Bingbot
|
||||||
|
Allow: /
|
||||||
|
|
||||||
|
# Crawl-delay
|
||||||
|
Crawl-delay: 0
|
||||||
52
script.js
52
script.js
@@ -1,3 +1,37 @@
|
|||||||
|
// Mobile Navigation Toggle
|
||||||
|
const navToggle = document.getElementById('navToggle');
|
||||||
|
const navMenu = document.getElementById('navMenu');
|
||||||
|
const navLinks = document.querySelectorAll('.nav-link');
|
||||||
|
|
||||||
|
navToggle.addEventListener('click', () => {
|
||||||
|
navToggle.classList.toggle('active');
|
||||||
|
navMenu.classList.toggle('active');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Close mobile menu when clicking on a link
|
||||||
|
navLinks.forEach(link => {
|
||||||
|
link.addEventListener('click', () => {
|
||||||
|
navToggle.classList.remove('active');
|
||||||
|
navMenu.classList.remove('active');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Navbar scroll effect
|
||||||
|
const navbar = document.getElementById('navbar');
|
||||||
|
let lastScroll = 0;
|
||||||
|
|
||||||
|
window.addEventListener('scroll', () => {
|
||||||
|
const currentScroll = window.pageYOffset;
|
||||||
|
|
||||||
|
if (currentScroll > 50) {
|
||||||
|
navbar.classList.add('scrolled');
|
||||||
|
} else {
|
||||||
|
navbar.classList.remove('scrolled');
|
||||||
|
}
|
||||||
|
|
||||||
|
lastScroll = currentScroll;
|
||||||
|
});
|
||||||
|
|
||||||
// Smooth scrolling for anchor links
|
// Smooth scrolling for anchor links
|
||||||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||||||
anchor.addEventListener('click', function (e) {
|
anchor.addEventListener('click', function (e) {
|
||||||
@@ -12,6 +46,24 @@ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Back to Top Button
|
||||||
|
const backToTopButton = document.getElementById('backToTop');
|
||||||
|
|
||||||
|
window.addEventListener('scroll', () => {
|
||||||
|
if (window.pageYOffset > 300) {
|
||||||
|
backToTopButton.classList.add('visible');
|
||||||
|
} else {
|
||||||
|
backToTopButton.classList.remove('visible');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
backToTopButton.addEventListener('click', () => {
|
||||||
|
window.scrollTo({
|
||||||
|
top: 0,
|
||||||
|
behavior: 'smooth'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
// Add animation on scroll
|
// Add animation on scroll
|
||||||
const observerOptions = {
|
const observerOptions = {
|
||||||
threshold: 0.1,
|
threshold: 0.1,
|
||||||
|
|||||||
31
sitemap.xml
Normal file
31
sitemap.xml
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
|
||||||
|
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||||
|
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
|
||||||
|
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
|
||||||
|
|
||||||
|
<!-- Homepage -->
|
||||||
|
<url>
|
||||||
|
<loc>https://www.andreas-guttenberger.de/</loc>
|
||||||
|
<lastmod>2026-02-10</lastmod>
|
||||||
|
<changefreq>weekly</changefreq>
|
||||||
|
<priority>1.0</priority>
|
||||||
|
</url>
|
||||||
|
|
||||||
|
<!-- Impressum -->
|
||||||
|
<url>
|
||||||
|
<loc>https://www.andreas-guttenberger.de/impressum.html</loc>
|
||||||
|
<lastmod>2026-02-10</lastmod>
|
||||||
|
<changefreq>monthly</changefreq>
|
||||||
|
<priority>0.3</priority>
|
||||||
|
</url>
|
||||||
|
|
||||||
|
<!-- Datenschutz -->
|
||||||
|
<url>
|
||||||
|
<loc>https://www.andreas-guttenberger.de/datenschutz.html</loc>
|
||||||
|
<lastmod>2026-02-10</lastmod>
|
||||||
|
<changefreq>monthly</changefreq>
|
||||||
|
<priority>0.3</priority>
|
||||||
|
</url>
|
||||||
|
|
||||||
|
</urlset>
|
||||||
182
style.css
182
style.css
@@ -26,6 +26,110 @@ body {
|
|||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
color: var(--text-dark);
|
color: var(--text-dark);
|
||||||
background-color: var(--white);
|
background-color: var(--white);
|
||||||
|
padding-top: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Navigation */
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: var(--white);
|
||||||
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||||
|
z-index: 1000;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar.scrolled {
|
||||||
|
box-shadow: 0 2px 20px rgba(0, 0, 0, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-content {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 15px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-logo {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--primary-color);
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-logo-img {
|
||||||
|
height: 40px;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-menu {
|
||||||
|
display: flex;
|
||||||
|
list-style: none;
|
||||||
|
gap: 35px;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link {
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--text-dark);
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 1rem;
|
||||||
|
transition: color 0.3s ease;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: -5px;
|
||||||
|
left: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 2px;
|
||||||
|
background-color: var(--primary-color);
|
||||||
|
transition: width 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link:hover {
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link:hover::after {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-toggle {
|
||||||
|
display: none;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 5px;
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-toggle span {
|
||||||
|
width: 25px;
|
||||||
|
height: 3px;
|
||||||
|
background-color: var(--primary-color);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-toggle.active span:nth-child(1) {
|
||||||
|
transform: rotate(45deg) translate(8px, 8px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-toggle.active span:nth-child(2) {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-toggle.active span:nth-child(3) {
|
||||||
|
transform: rotate(-45deg) translate(7px, -7px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
@@ -346,6 +450,45 @@ body {
|
|||||||
height: 450px;
|
height: 450px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Back to Top Button */
|
||||||
|
.back-to-top {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 30px;
|
||||||
|
right: 30px;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
background-color: var(--primary-color);
|
||||||
|
color: var(--white);
|
||||||
|
border: none;
|
||||||
|
border-radius: 50%;
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
box-shadow: var(--shadow-lg);
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
transform: translateY(20px);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.back-to-top.visible {
|
||||||
|
opacity: 1;
|
||||||
|
visibility: visible;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.back-to-top:hover {
|
||||||
|
background-color: var(--secondary-color);
|
||||||
|
transform: translateY(-3px);
|
||||||
|
box-shadow: 0 12px 35px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.back-to-top:active {
|
||||||
|
transform: translateY(-1px);
|
||||||
|
}
|
||||||
|
|
||||||
/* Footer */
|
/* Footer */
|
||||||
.footer {
|
.footer {
|
||||||
background-color: var(--primary-color);
|
background-color: var(--primary-color);
|
||||||
@@ -375,6 +518,45 @@ body {
|
|||||||
|
|
||||||
/* Responsive Design */
|
/* Responsive Design */
|
||||||
@media (max-width: 968px) {
|
@media (max-width: 968px) {
|
||||||
|
.nav-toggle {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-menu {
|
||||||
|
position: fixed;
|
||||||
|
top: 70px;
|
||||||
|
left: -100%;
|
||||||
|
flex-direction: column;
|
||||||
|
background-color: var(--white);
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
transition: left 0.3s ease;
|
||||||
|
box-shadow: 0 10px 27px rgba(0, 0, 0, 0.1);
|
||||||
|
padding: 20px 0;
|
||||||
|
gap: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-menu.active {
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-menu li {
|
||||||
|
padding: 15px 0;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-menu li:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link::after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
padding-top: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
.hero-content {
|
.hero-content {
|
||||||
grid-template-columns: 1fr;
|
grid-template-columns: 1fr;
|
||||||
gap: 40px;
|
gap: 40px;
|
||||||
|
|||||||
Reference in New Issue
Block a user