<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BLESS RUSSIA</title>
<style>
/* Сброс стилей */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Arial', sans-serif;
background-color: #0a0a0a;
color: #fff;
}
/* HEADER */
header {
background-color: #1a1a1a;
padding: 20px 0;
text-align: center;
font-size: 2.5em;
font-weight: bold;
border-bottom: 3px solid #e60000;
}
/* NAVIGATION */
nav {
display: flex;
justify-content: center;
background-color: #111;
padding: 15px 0;
}
nav a {
color: #fff;
text-decoration: none;
font-weight: bold;
margin: 0 20px;
transition: 0.3s;
}
nav a:hover {
color: #e60000;
}
/* MAIN */
main {
padding: 50px 20px;
}
.hero {
text-align: center;
margin-bottom: 50px;
}
.hero h1 {
font-size: 3em;
margin-bottom: 20px;
color: #e60000;
}
.hero p {
font-size: 1.2em;
margin-bottom: 30px;
}
.btn {
display: inline-block;
padding: 15px 30px;
background-color: #e60000;
color: #fff;
text-decoration: none;
font-weight: bold;
border-radius: 5px;
transition: 0.3s;
}
.btn:hover {
background-color: #ff1a1a;
}
/* SECTIONS */
section {
margin-bottom: 50px;
}
section h2 {
font-size: 2em;
color: #e60000;
margin-bottom: 20px;
text-align: center;
}
.cards {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
}
.card {
background-color: #1a1a1a;
padding: 20px;
border-radius: 10px;
width: 300px;
text-align: center;
transition: 0.3s;
}
.card:hover {
transform: scale(1.05);
background-color: #2a2a2a;
}
/* FOOTER */
footer {
background-color: #111;
text-align: center;
padding: 20px;
border-top: 3px solid #e60000;
}
/* RESPONSIVE */
@media (max-width: 768px) {
.cards {
flex-direction: column;
align-items: center;
}
}
</style>
</head>
<body>
<header>
BLESS RUSSIA
</header>
<nav>
<a href="#home">Главная</a>
<a href="#about">О проекте</a>
<a href="#news">Новости</a>
<a href="#contact">Контакты</a>
</nav>
<main>
<!-- Hero Section -->
<section id="home" class="hero">
<h1>Добро пожаловать в BLESS RUSSIA</h1>
<p>Лучший проект для игроков, объединяющий сообщество и увлекательный игровой процесс.</p>
<a href="#about" class="btn">Узнать больше</a>
</section>
<!-- About Section -->
<section id="about">
<h2>О проекте</h2>
<div class="cards">
<div class="card">
<h3>Уникальный контент</h3>
<p>Мы предлагаем эксклюзивные квесты, события и активное сообщество.</p>
</div>
<div class="card">
<h3>События и турниры</h3>
<p>Регулярные PvP и PvE мероприятия с ценными наградами для всех игроков.</p>
</div>
<div class="card">
<h3>Сообщество</h3>
<p>Дружелюбная атмосфера и поддержка новых игроков в любой момент.</p>
</div>
</div>
</section>
<!-- News Section -->
<section id="news">
<h2>Новости</h2>
<div class="cards">
<div class="card">
<h3>Обновление 1.2</h3>
<p>Новые локации, боссы и улучшения игрового интерфейса.</p>
</div>
<div class="card">
<h3>Зимнее событие</h3>
<p>Снежные битвы, праздничные костюмы и уникальные награды.</p>
</div>
<div class="card">
<h3>Турнир PvP</h3>
<p>Сразись с лучшими игроками и получи редкие титулы и награды.</p>
</div>
</div>
</section>
<!-- Contact Section -->
<section id="contact">
<h2>Контакты</h2>
<p style="text-align:center;">Свяжитесь с нами: <a href="mailto:info@blessrussia.ru" style="color:#e60000;">info@blessrussia.ru</a></p>
</section>
</main>
<footer>
© 2025 BLESS RUSSIA. Все права защищены.
</footer>
</body>
</html>