Kumi
c97eaf26ff
Introduced foundational static pages for the Duck.cash site, including homepage, 404 error page, and access-limited page. Implemented Bootstrap and custom styles for consistency and responsiveness. Added essential images and assets. Enhances user experience by ensuring clear navigation and presenting a professional interface.
211 lines
No EOL
3.2 KiB
CSS
211 lines
No EOL
3.2 KiB
CSS
body {
|
|
font-family: 'Roboto', sans-serif;
|
|
color: #333;
|
|
background-color: #f4f4f9;
|
|
}
|
|
|
|
.navbar {
|
|
background-color: #00695c;
|
|
padding: 1rem;
|
|
}
|
|
|
|
.navbar-brand,
|
|
.nav-link {
|
|
color: white !important;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.navbar-brand:hover,
|
|
.nav-link:hover {
|
|
color: #FFEB3B !important;
|
|
}
|
|
|
|
.hero {
|
|
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../img/header.png') no-repeat center center/cover;
|
|
height: 100vh;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: white;
|
|
text-align: center;
|
|
padding: 0 2rem;
|
|
}
|
|
|
|
.hero h1 {
|
|
font-size: 4rem;
|
|
margin: 0;
|
|
animation: fadeInDown 1s;
|
|
}
|
|
|
|
.hero p {
|
|
font-size: 1.5rem;
|
|
margin: 1rem 0 0;
|
|
animation: fadeInUp 1s;
|
|
}
|
|
|
|
.hero .btn {
|
|
animation: fadeInUp 1.5s;
|
|
}
|
|
|
|
@keyframes fadeInDown {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(-50px);
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@keyframes fadeInUp {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(50px);
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
.features,
|
|
.testimonials,
|
|
.contact {
|
|
padding: 4rem 2rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.features h2,
|
|
.testimonials h2,
|
|
.contact h2 {
|
|
font-size: 2.5rem;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.feature,
|
|
.testimonial {
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
.feature .icon {
|
|
font-size: 3rem;
|
|
color: #4CAF50;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.testimonial .icon {
|
|
font-size: 3rem;
|
|
color: #FFD700;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.contact form {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 1rem;
|
|
max-width: 500px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.card {
|
|
border: none;
|
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
|
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
|
background: linear-gradient(135deg, #f4f4f9, #ffffff);
|
|
}
|
|
|
|
.card:hover {
|
|
transform: translateY(-10px);
|
|
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
footer {
|
|
background-color: #00695c;
|
|
color: white;
|
|
text-align: center;
|
|
padding: 2rem 2rem;
|
|
}
|
|
|
|
footer p {
|
|
margin: 0;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
footer a {
|
|
color: #FFEB3B;
|
|
text-decoration: none;
|
|
font-weight: bold;
|
|
}
|
|
|
|
footer a:hover {
|
|
color: #ffffff;
|
|
}
|
|
|
|
.btn-primary {
|
|
background-color: #4CAF50;
|
|
border: none;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
background-color: #45a049;
|
|
}
|
|
|
|
.cta-section {
|
|
background: linear-gradient(135deg, #4CAF50, #81C784);
|
|
color: white;
|
|
padding: 4rem 2rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.cta-section h2 {
|
|
font-size: 2.5rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.cta-section p {
|
|
font-size: 1.2rem;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.cta-section .btn {
|
|
background-color: white;
|
|
color: #4CAF50;
|
|
border: none;
|
|
}
|
|
|
|
.cta-section .btn:hover {
|
|
background-color: #f4f4f9;
|
|
}
|
|
|
|
.error-page {
|
|
height: 100vh;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
color: #333;
|
|
}
|
|
|
|
.error-page h1 {
|
|
font-size: 6rem;
|
|
margin-bottom: 1rem;
|
|
color: #00695c;
|
|
}
|
|
|
|
.error-page p {
|
|
font-size: 1.5rem;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
.error-page .btn {
|
|
background-color: #4CAF50;
|
|
color: white;
|
|
border: none;
|
|
}
|
|
|
|
.error-page .btn:hover {
|
|
background-color: #45a049;
|
|
} |