|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>NeuroArt Gallery | Modern AI Art</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap'); |
|
|
|
|
|
body { |
|
|
font-family: 'Montserrat', sans-serif; |
|
|
background-color: #0f0e17; |
|
|
color: #fffffe; |
|
|
scroll-behavior: smooth; |
|
|
} |
|
|
|
|
|
.gradient-text { |
|
|
background: linear-gradient(90deg, #ff8906, #e53170); |
|
|
-webkit-background-clip: text; |
|
|
background-clip: text; |
|
|
color: transparent; |
|
|
} |
|
|
|
|
|
.art-card { |
|
|
transition: all 0.3s ease; |
|
|
transform: translateY(0); |
|
|
} |
|
|
|
|
|
.art-card:hover { |
|
|
transform: translateY(-10px); |
|
|
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); |
|
|
} |
|
|
|
|
|
.hero-section { |
|
|
background: linear-gradient(rgba(15, 14, 23, 0.7), rgba(15, 14, 23, 0.9)), url('https://images.unsplash.com/photo-1635070041078-e363dbe005cb?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80'); |
|
|
background-size: cover; |
|
|
background-position: center; |
|
|
} |
|
|
|
|
|
.nav-link { |
|
|
position: relative; |
|
|
} |
|
|
|
|
|
.nav-link::after { |
|
|
content: ''; |
|
|
position: absolute; |
|
|
width: 0; |
|
|
height: 2px; |
|
|
bottom: -2px; |
|
|
left: 0; |
|
|
background: linear-gradient(90deg, #ff8906, #e53170); |
|
|
transition: width 0.3s ease; |
|
|
} |
|
|
|
|
|
.nav-link:hover::after { |
|
|
width: 100%; |
|
|
} |
|
|
|
|
|
.section-title { |
|
|
position: relative; |
|
|
display: inline-block; |
|
|
} |
|
|
|
|
|
.section-title::after { |
|
|
content: ''; |
|
|
position: absolute; |
|
|
width: 50%; |
|
|
height: 3px; |
|
|
bottom: -8px; |
|
|
left: 25%; |
|
|
background: linear-gradient(90deg, #ff8906, #e53170); |
|
|
border-radius: 3px; |
|
|
} |
|
|
|
|
|
@keyframes float { |
|
|
0%, 100% { |
|
|
transform: translateY(0); |
|
|
} |
|
|
50% { |
|
|
transform: translateY(-10px); |
|
|
} |
|
|
} |
|
|
|
|
|
.floating { |
|
|
animation: float 6s ease-in-out infinite; |
|
|
} |
|
|
|
|
|
.language-switcher { |
|
|
position: relative; |
|
|
display: inline-block; |
|
|
} |
|
|
|
|
|
.language-dropdown { |
|
|
display: none; |
|
|
position: absolute; |
|
|
right: 0; |
|
|
background-color: #1a1a2e; |
|
|
min-width: 120px; |
|
|
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); |
|
|
z-index: 1; |
|
|
border-radius: 8px; |
|
|
overflow: hidden; |
|
|
} |
|
|
|
|
|
.language-switcher:hover .language-dropdown { |
|
|
display: block; |
|
|
} |
|
|
|
|
|
.language-dropdown a { |
|
|
color: white; |
|
|
padding: 12px 16px; |
|
|
text-decoration: none; |
|
|
display: block; |
|
|
transition: background-color 0.3s; |
|
|
} |
|
|
|
|
|
.language-dropdown a:hover { |
|
|
background-color: #ff8906; |
|
|
} |
|
|
|
|
|
|
|
|
.tg-image { |
|
|
width: 100%; |
|
|
height: 300px; |
|
|
object-fit: cover; |
|
|
transition: transform 0.3s ease; |
|
|
} |
|
|
|
|
|
.art-card:hover .tg-image { |
|
|
transform: scale(1.05); |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
|
|
|
<header class="fixed w-full z-50 bg-black bg-opacity-80 backdrop-blur-sm"> |
|
|
<div class="container mx-auto px-4 py-4 flex justify-between items-center"> |
|
|
<div class="flex items-center"> |
|
|
<div class="w-10 h-10 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center mr-3"> |
|
|
<i class="fas fa-brain text-white"></i> |
|
|
</div> |
|
|
<a href="#" class="text-2xl font-bold gradient-text">NeuroArt</a> |
|
|
</div> |
|
|
|
|
|
<nav class="hidden md:flex space-x-8"> |
|
|
<a href="#midjourney" class="nav-link text-white hover:text-orange-400 transition en">Midjourney</a> |
|
|
<a href="#midjourney" class="nav-link text-white hover:text-orange-400 transition ru hidden">Миджорни</a> |
|
|
<a href="#aviation" class="nav-link text-white hover:text-orange-400 transition en">Aviation</a> |
|
|
<a href="#aviation" class="nav-link text-white hover:text-orange-400 transition ru hidden">Авиация</a> |
|
|
<a href="#about" class="nav-link text-white hover:text-orange-400 transition en">About</a> |
|
|
<a href="#about" class="nav-link text-white hover:text-orange-400 transition ru hidden">О нас</a> |
|
|
<a href="#buy" class="nav-link text-white hover:text-orange-400 transition en">Buy Art</a> |
|
|
<a href="#buy" class="nav-link text-white hover:text-orange-400 transition ru hidden">Купить арт</a> |
|
|
</nav> |
|
|
|
|
|
<div class="flex items-center space-x-4"> |
|
|
<a href="https://t.me/Art2in1" target="_blank" class="text-white hover:text-blue-400 transition"> |
|
|
<i class="fab fa-telegram text-xl"></i> |
|
|
</a> |
|
|
|
|
|
<div class="language-switcher"> |
|
|
<button class="flex items-center text-white focus:outline-none"> |
|
|
<i class="fas fa-globe mr-2"></i> |
|
|
<span class="en">EN</span> |
|
|
<span class="ru hidden">RU</span> |
|
|
<i class="fas fa-chevron-down ml-1 text-xs"></i> |
|
|
</button> |
|
|
<div class="language-dropdown"> |
|
|
<a href="#" class="language-option" data-lang="en">English</a> |
|
|
<a href="#" class="language-option" data-lang="ru">Русский</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<button class="md:hidden text-white focus:outline-none" id="menu-toggle"> |
|
|
<i class="fas fa-bars text-2xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="md:hidden hidden bg-black bg-opacity-90 w-full py-4" id="mobile-menu"> |
|
|
<div class="container mx-auto px-4 flex flex-col space-y-4"> |
|
|
<a href="#midjourney" class="nav-link text-white hover:text-orange-400 transition en">Midjourney</a> |
|
|
<a href="#midjourney" class="nav-link text-white hover:text-orange-400 transition ru hidden">Миджорни</a> |
|
|
<a href="#aviation" class="nav-link text-white hover:text-orange-400 transition en">Aviation</a> |
|
|
<a href="#aviation" class="nav-link text-white hover:text-orange-400 transition ru hidden">Авиация</a> |
|
|
<a href="#about" class="nav-link text-white hover:text-orange-400 transition en">About</a> |
|
|
<a href="#about" class="nav-link text-white hover:text-orange-400 transition ru hidden">О нас</a> |
|
|
<a href="#buy" class="nav-link text-white hover:text-orange-400 transition en">Buy Art</a> |
|
|
<a href="#buy" class="nav-link text-white hover:text-orange-400 transition ru hidden">Купить арт</a> |
|
|
</div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
|
|
|
<section class="hero-section min-h-screen flex items-center justify-center pt-20"> |
|
|
<div class="container mx-auto px-4 text-center"> |
|
|
<h1 class="text-4xl md:text-6xl font-bold mb-6"> |
|
|
<span class="gradient-text en">NeuroArt</span> |
|
|
<span class="gradient-text ru hidden">Нейроискусство</span> |
|
|
<span class="en">of the New Generation</span> |
|
|
<span class="ru hidden">нового поколения</span> |
|
|
</h1> |
|
|
<p class="text-xl md:text-2xl text-gray-300 mb-10 max-w-3xl mx-auto en"> |
|
|
Explore unique artworks created by artificial intelligence. Each image is a journey into a world of boundless creativity. |
|
|
</p> |
|
|
<p class="text-xl md:text-2xl text-gray-300 mb-10 max-w-3xl mx-auto ru hidden"> |
|
|
Исследуйте уникальные произведения искусства, созданные искусственным интеллектом. Каждое изображение - это путешествие в мир безграничной креативности. |
|
|
</p> |
|
|
<div class="flex flex-col sm:flex-row justify-center gap-4"> |
|
|
<a href="#midjourney" class="px-8 py-3 bg-gradient-to-r from-orange-500 to-pink-600 text-white rounded-full font-medium hover:opacity-90 transition shadow-lg en"> |
|
|
Gallery |
|
|
</a> |
|
|
<a href="#midjourney" class="px-8 py-3 bg-gradient-to-r from-orange-500 to-pink-600 text-white rounded-full font-medium hover:opacity-90 transition shadow-lg ru hidden"> |
|
|
Галерея |
|
|
</a> |
|
|
<a href="#buy" class="px-8 py-3 border-2 border-orange-500 text-orange-500 rounded-full font-medium hover:bg-orange-500 hover:text-white transition en"> |
|
|
Buy Art |
|
|
</a> |
|
|
<a href="#buy" class="px-8 py-3 border-2 border-orange-500 text-orange-500 rounded-full font-medium hover:bg-orange-500 hover:text-white transition ru hidden"> |
|
|
Купить арт |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section id="midjourney" class="py-20 bg-gray-900"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 section-title"> |
|
|
<span class="gradient-text en">Midjourney</span> |
|
|
<span class="gradient-text ru hidden">Миджорни</span> |
|
|
<span class="en">Gallery</span> |
|
|
<span class="ru hidden">галерея</span> |
|
|
</h2> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> |
|
|
|
|
|
<div class="art-card rounded-xl overflow-hidden bg-gray-800"> |
|
|
<img src="https://cdn4.telegram-cdn.org/file/example1.jpg" alt="Midjourney Art 1" class="tg-image"> |
|
|
<div class="p-5"> |
|
|
<h2 class="text-xl font-bold mb-2 en">Minimalist Future</h2> |
|
|
<h2 class="text-xl font-bold mb-2 ru hidden">Минималистичное будущее</h2> |
|
|
<p class="text-gray-400 mb-4 en">Created with Midjourney, 2023</p> |
|
|
<p class="text-gray-400 mb-4 ru hidden">Создано Midjourney, 2023</p> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-orange-500 font-bold">$120</span> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition en"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Buy |
|
|
</button> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition ru hidden"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Купить |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="art-card rounded-xl overflow-hidden bg-gray-800"> |
|
|
<img src="https://cdn4.telegram-cdn.org/file/example2.jpg" alt="Midjourney Art 2" class="tg-image"> |
|
|
<div class="p-5"> |
|
|
<h2 class="text-xl font-bold mb-2 en">City of Tomorrow</h2> |
|
|
<h2 class="text-xl font-bold mb-2 ru hidden">Город будущего</h2> |
|
|
<p class="text-gray-400 mb-4 en">Created with Midjourney, 2023</p> |
|
|
<p class="text-gray-400 mb-4 ru hidden">Создано Midjourney, 2023</p> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-orange-500 font-bold">$150</span> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition en"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Buy |
|
|
</button> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition ru hidden"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Купить |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="art-card rounded-xl overflow-hidden bg-gray-800"> |
|
|
<img src="https://cdn4.telegram-cdn.org/file/example3.jpg" alt="Midjourney Art 3" class="tg-image"> |
|
|
<div class="p-5"> |
|
|
<h2 class="text-xl font-bold mb-2 en">Cosmic Dreams</h2> |
|
|
<h2 class="text-xl font-bold mb-2 ru hidden">Космические сны</h2> |
|
|
<p class="text-gray-400 mb-4 en">Created with Midjourney, 2023</p> |
|
|
<p class="text-gray-400 mb-4 ru hidden">Создано Midjourney, 2023</p> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-orange-500 font-bold">$180</span> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition en"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Buy |
|
|
</button> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition ru hidden"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Купить |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="text-center mt-12"> |
|
|
<a href="#" class="px-6 py-3 border-2 border-orange-500 text-orange-500 rounded-full font-medium hover:bg-orange-500 hover:text-white transition en"> |
|
|
Show More |
|
|
</a> |
|
|
<a href="#" class="px-6 py-3 border-2 border-orange-500 text-orange-500 rounded-full font-medium hover:bg-orange-500 hover:text-white transition ru hidden"> |
|
|
Показать больше |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section id="aviation" class="py-20 bg-gray-800"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 section-title"> |
|
|
<span class="gradient-text en">Aviation</span> |
|
|
<span class="gradient-text ru hidden">Авиация</span> |
|
|
<span class="en">in Art</span> |
|
|
<span class="ru hidden">в искусстве</span> |
|
|
</h2> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> |
|
|
|
|
|
<div class="art-card rounded-xl overflow-hidden bg-gray-900"> |
|
|
<img src="https://cdn4.telegram-cdn.org/file/aviation1.jpg" alt="Aviation Art 1" class="tg-image"> |
|
|
<div class="p-5"> |
|
|
<h2 class="text-xl font-bold mb-2 en">Future Fighter</h2> |
|
|
<h2 class="text-xl font-bold mb-2 ru hidden">Истребитель будущего</h2> |
|
|
<p class="text-gray-400 mb-4 en">Created with Midjourney, 2023</p> |
|
|
<p class="text-gray-400 mb-4 ru hidden">Создано Midjourney, 2023</p> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-orange-500 font-bold">$200</span> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition en"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Buy |
|
|
</button> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition ru hidden"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Купить |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="art-card rounded-xl overflow-hidden bg-gray-900"> |
|
|
<img src="https://cdn4.telegram-cdn.org/file/aviation2.jpg" alt="Aviation Art 2" class="tg-image"> |
|
|
<div class="p-5"> |
|
|
<h2 class="text-xl font-bold mb-2 en">Sky Giant</h2> |
|
|
<h2 class="text-xl font-bold mb-2 ru hidden">Небесный гигант</h2> |
|
|
<p class="text-gray-400 mb-4 en">Created with Midjourney, 2023</p> |
|
|
<p class="text-gray-400 mb-4 ru hidden">Создано Midjourney, 2023</p> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-orange-500 font-bold">$220</span> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition en"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Buy |
|
|
</button> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition ru hidden"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Купить |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="art-card rounded-xl overflow-hidden bg-gray-900"> |
|
|
<img src="https://cdn4.telegram-cdn.org/file/aviation3.jpg" alt="Aviation Art 3" class="tg-image"> |
|
|
<div class="p-5"> |
|
|
<h2 class="text-xl font-bold mb-2 en">Through the Clouds</h2> |
|
|
<h2 class="text-xl font-bold mb-2 ru hidden">Сквозь облака</h2> |
|
|
<p class="text-gray-400 mb-4 en">Created with Midjourney, 2023</p> |
|
|
<p class="text-gray-400 mb-4 ru hidden">Создано Midjourney, 2023</p> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="text-orange-500 font-bold">$190</span> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition en"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Buy |
|
|
</button> |
|
|
<button class="px-4 py-2 bg-orange-500 text-white rounded hover:bg-orange-600 transition ru hidden"> |
|
|
<i class="fas fa-shopping-cart mr-2"></i> Купить |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="text-center mt-12"> |
|
|
<a href="#" class="px-6 py-3 border-2 border-orange-500 text-orange-500 rounded-full font-medium hover:bg-orange-500 hover:text-white transition en"> |
|
|
Show More |
|
|
</a> |
|
|
<a href="#" class="px-6 py-3 border-2 border-orange-500 text-orange-500 rounded-full font-medium hover:bg-orange-500 hover:text-white transition ru hidden"> |
|
|
Показать больше |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section id="about" class="py-20 bg-gray-900"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 section-title"> |
|
|
<span class="en">About</span> |
|
|
<span class="ru hidden">О</span> |
|
|
<span class="gradient-text en">Us</span> |
|
|
<span class="gradient-text ru hidden">нас</span> |
|
|
</h2> |
|
|
|
|
|
<div class="flex flex-col lg:flex-row items-center gap-12"> |
|
|
<div class="lg:w-1/2"> |
|
|
<div class="relative"> |
|
|
<div class="w-full h-96 bg-gradient-to-r from-orange-500 to-pink-600 rounded-xl overflow-hidden"> |
|
|
<img src="https://images.unsplash.com/photo-1635070040809-4e8c5f1b9e9f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80" alt="Our team" class="w-full h-full object-cover opacity-90"> |
|
|
</div> |
|
|
<div class="absolute -bottom-5 -right-5 w-32 h-32 bg-gray-800 rounded-full flex items-center justify-center border-4 border-gray-900"> |
|
|
<div class="w-24 h-24 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white text-4xl"> |
|
|
<i class="fas fa-brain"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="lg:w-1/2"> |
|
|
<h3 class="text-2xl font-bold mb-6 en">We Create the Art of the Future</h3> |
|
|
<h3 class="text-2xl font-bold mb-6 ru hidden">Мы создаем искусство будущего</h3> |
|
|
<p class="text-gray-400 mb-6 en"> |
|
|
NeuroArt Gallery is a platform for showcasing and selling unique artworks created with artificial intelligence. We combine technology and creativity to create images that inspire and amaze. |
|
|
</p> |
|
|
<p class="text-gray-400 mb-6 ru hidden"> |
|
|
NeuroArt Gallery - это платформа для демонстрации и продажи уникальных произведений искусства, созданных с помощью искусственного интеллекта. Мы объединяем технологии и креативность, чтобы создавать изображения, которые вдохновляют и удивляют. |
|
|
</p> |
|
|
<p class="text-gray-400 mb-8 en"> |
|
|
Our team consists of artists, programmers and designers who work together to push the boundaries of digital art. Each piece in our collection is the result of careful work and many iterations. |
|
|
</p> |
|
|
<p class="text-gray-400 mb-8 ru hidden"> |
|
|
Наша команда состоит из художников, программистов и дизайнеров, которые работают вместе, чтобы раздвигать границы цифрового искусства. Каждое произведение в нашей коллекции - это результат тщательной работы и множества итераций. |
|
|
</p> |
|
|
|
|
|
<div class="grid grid-cols-2 gap-4 mb-8"> |
|
|
<div class="flex items-center"> |
|
|
<div class="w-12 h-12 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4"> |
|
|
<i class="fas fa-palette"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold en">Unique Style</h4> |
|
|
<h4 class="font-bold ru hidden">Уникальный стиль</h4> |
|
|
<p class="text-sm text-gray-400 en">Each piece is unique</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">Каждое произведение уникально</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex items-center"> |
|
|
<div class="w-12 h-12 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4"> |
|
|
<i class="fas fa-robot"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold en">AI Technology</h4> |
|
|
<h4 class="font-bold ru hidden">AI технологии</h4> |
|
|
<p class="text-sm text-gray-400 en">Using advanced algorithms</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">Используем передовые алгоритмы</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex items-center"> |
|
|
<div class="w-12 h-12 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4"> |
|
|
<i class="fas fa-certificate"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold en">Copyright</h4> |
|
|
<h4 class="font-bold ru hidden">Авторские права</h4> |
|
|
<p class="text-sm text-gray-400 en">All works are licensed</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">Все работы лицензированы</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex items-center"> |
|
|
<div class="w-12 h-12 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4"> |
|
|
<i class="fas fa-shipping-fast"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold en">Fast Delivery</h4> |
|
|
<h4 class="font-bold ru hidden">Быстрая доставка</h4> |
|
|
<p class="text-sm text-gray-400 en">Worldwide</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">По всему миру</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<a href="https://t.me/Art2in1" target="_blank" class="px-6 py-3 bg-gradient-to-r from-orange-500 to-pink-600 text-white rounded-full font-medium hover:opacity-90 transition inline-flex items-center"> |
|
|
<i class="fab fa-telegram mr-2"></i> |
|
|
<span class="en">Our Telegram Channel</span> |
|
|
<span class="ru hidden">Наш Telegram канал</span> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section id="buy" class="py-20 bg-gray-800"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 section-title"> |
|
|
<span class="gradient-text en">Buy</span> |
|
|
<span class="gradient-text ru hidden">Купить</span> |
|
|
<span class="en">Art</span> |
|
|
<span class="ru hidden">арт</span> |
|
|
</h2> |
|
|
|
|
|
<div class="max-w-4xl mx-auto bg-gray-900 rounded-xl overflow-hidden"> |
|
|
<div class="md:flex"> |
|
|
<div class="md:w-1/2 p-8"> |
|
|
<h3 class="text-2xl font-bold mb-6 en">How to Purchase Our Works</h3> |
|
|
<h3 class="text-2xl font-bold mb-6 ru hidden">Как приобрести наши работы</h3> |
|
|
<p class="text-gray-400 mb-6 en"> |
|
|
Each artwork is available in various formats and sizes. We offer both digital versions for personal use and printed versions of the highest quality. |
|
|
</p> |
|
|
<p class="text-gray-400 mb-6 ru hidden"> |
|
|
Каждое произведение искусства доступно в различных форматах и размерах. Мы предлагаем как цифровые версии для личного использования, так и печатные варианты высочайшего качества. |
|
|
</p> |
|
|
|
|
|
<div class="space-y-4 mb-8"> |
|
|
<div class="flex items-start"> |
|
|
<div class="w-8 h-8 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4 mt-1 flex-shrink-0"> |
|
|
<i class="fas fa-check text-xs"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold en">Digital Version</h4> |
|
|
<h4 class="font-bold ru hidden">Цифровая версия</h4> |
|
|
<p class="text-sm text-gray-400 en">High resolution, no watermarks, usage license</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">Высокое разрешение, без водяных знаков, лицензия на использование</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex items-start"> |
|
|
<div class="w-8 h-8 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4 mt-1 flex-shrink-0"> |
|
|
<i class="fas fa-check text-xs"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold en">Printed Version</h4> |
|
|
<h4 class="font-bold ru hidden">Печатная версия</h4> |
|
|
<p class="text-sm text-gray-400 en">Quality printing on canvas, photo paper or acrylic</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">Качественная печать на холсте, фотобумаге или акриле</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex items-start"> |
|
|
<div class="w-8 h-8 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4 mt-1 flex-shrink-0"> |
|
|
<i class="fas fa-check text-xs"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold en">NFT Version</h4> |
|
|
<h4 class="font-bold ru hidden">NFT версия</h4> |
|
|
<p class="text-sm text-gray-400 en">Unique tokens for collectors</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">Уникальные токены для коллекционеров</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="md:w-1/2 bg-gradient-to-br from-orange-500 to-pink-600 p-8 flex flex-col justify-center"> |
|
|
<h3 class="text-2xl font-bold text-white mb-6 en">Contact Us</h3> |
|
|
<h3 class="text-2xl font-bold text-white mb-6 ru hidden">Свяжитесь с нами</h3> |
|
|
<p class="text-white mb-6 en"> |
|
|
Submit your request and our manager will contact you to clarify the details of the order and answer all your questions. |
|
|
</p> |
|
|
<p class="text-white mb-6 ru hidden"> |
|
|
Оставьте заявку, и наш менеджер свяжется с вами для уточнения деталей заказа и ответит на все вопросы. |
|
|
</p> |
|
|
|
|
|
<form class="space-y-4"> |
|
|
<div> |
|
|
<input type="text" placeholder="Your Name" class="en w-full px-4 py-3 rounded-lg bg-white bg-opacity-20 text-white placeholder-white focus:outline-none focus:ring-2 focus:ring-white"> |
|
|
<input type="text" placeholder="Ваше имя" class="ru hidden w-full px-4 py-3 rounded-lg bg-white bg-opacity-20 text-white placeholder-white focus:outline-none focus:ring-2 focus:ring-white"> |
|
|
</div> |
|
|
<div> |
|
|
<input type="email" placeholder="Email" class="w-full px-4 py-3 rounded-lg bg-white bg-opacity-20 text-white placeholder-white focus:outline-none focus:ring-2 focus:ring-white"> |
|
|
</div> |
|
|
<div> |
|
|
<textarea placeholder="Your Message" class="en w-full px-4 py-3 rounded-lg bg-white bg-opacity-20 text-white placeholder-white focus:outline-none focus:ring-2 focus:ring-white" rows="3"></textarea> |
|
|
<textarea placeholder="Сообщение" class="ru hidden w-full px-4 py-3 rounded-lg bg-white bg-opacity-20 text-white placeholder-white focus:outline-none focus:ring-2 focus:ring-white" rows="3"></textarea> |
|
|
</div> |
|
|
<button type="submit" class="w-full px-6 py-3 bg-white text-orange-600 rounded-lg font-bold hover:bg-gray-100 transition en"> |
|
|
Submit Request |
|
|
</button> |
|
|
<button type="submit" class="w-full px-6 py-3 bg-white text-orange-600 rounded-lg font-bold hover:bg-gray-100 transition ru hidden"> |
|
|
Отправить заявку |
|
|
</button> |
|
|
</form> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 bg-gray-900"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 section-title"> |
|
|
<span class="en">Client</span> |
|
|
<span class="ru hidden">Отзывы</span> |
|
|
<span class="gradient-text en">Testimonials</span> |
|
|
<span class="gradient-text ru hidden">клиентов</span> |
|
|
</h2> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
|
|
<div class="bg-gray-800 p-8 rounded-xl"> |
|
|
<div class="flex items-center mb-6"> |
|
|
<div class="w-12 h-12 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4"> |
|
|
<i class="fas fa-user"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold">Alexander</h4> |
|
|
<p class="text-sm text-gray-400 en">Collector</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">Коллекционер</p> |
|
|
</div> |
|
|
</div> |
|
|
<p class="text-gray-400 en"> |
|
|
"I purchased several works for my gallery. The print quality is excellent, the colors are very rich. Clients constantly ask about these works." |
|
|
</p> |
|
|
<p class="text-gray-400 ru hidden"> |
|
|
"Приобрел несколько работ для своей галереи. Качество печати превосходное, цвета очень насыщенные. Клиенты постоянно спрашивают об этих работах." |
|
|
</p> |
|
|
<div class="flex mt-4"> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 p-8 rounded-xl"> |
|
|
<div class="flex items-center mb-6"> |
|
|
<div class="w-12 h-12 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4"> |
|
|
<i class="fas fa-user"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold">Ekaterina</h4> |
|
|
<p class="text-sm text-gray-400 en">Interior Designer</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">Дизайнер интерьеров</p> |
|
|
</div> |
|
|
</div> |
|
|
<p class="text-gray-400 en"> |
|
|
"I use NeuroArt works in my projects. Clients are delighted with the unusual images. Great combination of price and quality." |
|
|
</p> |
|
|
<p class="text-gray-400 ru hidden"> |
|
|
"Использую работы NeuroArt в своих проектах. Клиенты в восторге от необычных изображений. Отличное сочетание цены и качества." |
|
|
</p> |
|
|
<div class="flex mt-4"> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 p-8 rounded-xl"> |
|
|
<div class="flex items-center mb-6"> |
|
|
<div class="w-12 h-12 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center text-white mr-4"> |
|
|
<i class="fas fa-user"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold">Dmitry</h4> |
|
|
<p class="text-sm text-gray-400 en">IT Entrepreneur</p> |
|
|
<p class="text-sm text-gray-400 ru hidden">IT-предприниматель</p> |
|
|
</div> |
|
|
</div> |
|
|
<p class="text-gray-400 en"> |
|
|
"I ordered a series of works for the office. Creates an amazing atmosphere of creativity and innovation. Fast delivery and excellent service." |
|
|
</p> |
|
|
<p class="text-gray-400 ru hidden"> |
|
|
"Заказал серию работ для офиса. Создает потрясающую атмосферу креативности и инноваций. Быстрая доставка и отличный сервис." |
|
|
</p> |
|
|
<div class="flex mt-4"> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star text-yellow-400"></i> |
|
|
<i class="fas fa-star-half-alt text-yellow-400"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 bg-gray-800"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 section-title"> |
|
|
<span class="en">Frequently Asked</span> |
|
|
<span class="ru hidden">Частые</span> |
|
|
<span class="gradient-text en">Questions</span> |
|
|
<span class="gradient-text ru hidden">вопросы</span> |
|
|
</h2> |
|
|
|
|
|
<div class="max-w-3xl mx-auto space-y-4"> |
|
|
<div class="bg-gray-900 rounded-xl overflow-hidden"> |
|
|
<button class="faq-toggle w-full flex justify-between items-center p-6 text-left focus:outline-none"> |
|
|
<h3 class="font-bold en">How are these artworks created?</h3> |
|
|
<h3 class="font-bold ru hidden">Как создаются эти произведения искусства?</h3> |
|
|
<i class="fas fa-chevron-down transition-transform duration-300"></i> |
|
|
</button> |
|
|
<div class="faq-content px-6 pb-6 hidden"> |
|
|
<p class="text-gray-400 en"> |
|
|
We use advanced artificial intelligence algorithms such as Midjourney, Stable Diffusion and others. Each image is created using carefully selected text prompts and many iterations. Then our artists refine the best options. |
|
|
</p> |
|
|
<p class="text-gray-400 ru hidden"> |
|
|
Мы используем передовые алгоритмы искусственного интеллекта, такие как Midjourney, Stable Diffusion и другие. Каждое изображение создается с помощью тщательно подобранных текстовых запросов и множества итераций. Затем наши художники дорабатывают лучшие варианты. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-900 rounded-xl overflow-hidden"> |
|
|
<button class="faq-toggle w-full flex justify-between items-center p-6 text-left focus:outline-none"> |
|
|
<h3 class="font-bold en">Can I order a custom artwork?</h3> |
|
|
<h3 class="font-bold ru hidden">Могу ли я заказать индивидуальное произведение?</h3> |
|
|
<i class="fas fa-chevron-down transition-transform duration-300"></i> |
|
|
</button> |
|
|
<div class="faq-content px-6 pb-6 hidden"> |
|
|
<p class="text-gray-400 en"> |
|
|
Yes, we accept orders for individual works. You can describe your wishes and we will create a unique piece especially for you. The production time depends on the complexity of the order. |
|
|
</p> |
|
|
<p class="text-gray-400 ru hidden"> |
|
|
Да, мы принимаем заказы на индивидуальные работы. Вы можете описать свои пожелания, и мы создадим уникальное произведение специально для вас. Срок выполнения зависит от сложности заказа. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-900 rounded-xl overflow-hidden"> |
|
|
<button class="faq-toggle w-full flex justify-between items-center p-6 text-left focus:outline-none"> |
|
|
<h3 class="font-bold en">What delivery options are available?</h3> |
|
|
<h3 class="font-bold ru hidden">Какие варианты доставки доступны?</h3> |
|
|
<i class="fas fa-chevron-down transition-transform duration-300"></i> |
|
|
</button> |
|
|
<div class="faq-content px-6 pb-6 hidden"> |
|
|
<p class="text-gray-400 en"> |
|
|
For digital versions - instant download after payment. We ship printed versions by courier services worldwide. Delivery time depends on your location and the chosen delivery option. |
|
|
</p> |
|
|
<p class="text-gray-400 ru hidden"> |
|
|
Для цифровых версий - мгновенная загрузка после оплаты. Печатные версии мы отправляем курьерскими службами по всему миру. Срок доставки зависит от вашего местоположения и выбранного варианта доставки. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-900 rounded-xl overflow-hidden"> |
|
|
<button class="faq-toggle w-full flex justify-between items-center p-6 text-left focus:outline-none"> |
|
|
<h3 class="font-bold en">Is there a product warranty?</h3> |
|
|
<h3 class="font-bold ru hidden">Есть ли гарантия на продукты?</h3> |
|
|
<i class="fas fa-chevron-down transition-transform duration-300"></i> |
|
|
</button> |
|
|
<div class="faq-content px-6 pb-6 hidden"> |
|
|
<p class="text-gray-400 en"> |
|
|
Yes, we guarantee the quality of our works. If you received a damaged product or it does not match the description, we will replace it free of charge. Digital goods can be returned within 14 days. |
|
|
</p> |
|
|
<p class="text-gray-400 ru hidden"> |
|
|
Да, мы гарантируем качество наших работ. Если вы получили поврежденный товар или он не соответствует описанию, мы бесплатно заменим его. Цифровые товары можно вернуть в течение 14 дней. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 bg-gradient-to-r from-orange-500 to-pink-600"> |
|
|
<div class="container mx-auto px-4 text-center"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold text-white mb-6 en">Ready to decorate your world with neuroart?</h2> |
|
|
<h2 class="text-3xl md:text-4xl font-bold text-white mb-6 ru hidden">Готовы украсить свой мир нейроискусством?</h2> |
|
|
<p class="text-xl text-white mb-10 max-w-2xl mx-auto en"> |
|
|
Subscribe to our newsletter and get 15% off your first order |
|
|
</p> |
|
|
<p class="text-xl text-white mb-10 max-w-2xl mx-auto ru hidden"> |
|
|
Подпишитесь на нашу рассылку и получите скидку 15% на первый заказ |
|
|
</p> |
|
|
<div class="max-w-md mx-auto flex"> |
|
|
<input type="email" placeholder="Your Email" class="en flex-grow px-4 py-3 rounded-l-lg focus:outline-none"> |
|
|
<input type="email" placeholder="Ваш Email" class="ru hidden flex-grow px-4 py-3 rounded-l-lg focus:outline-none"> |
|
|
<button class="px-6 py-3 bg-gray-900 text-white rounded-r-lg font-bold hover:bg-gray-800 transition en"> |
|
|
Subscribe |
|
|
</button> |
|
|
<button class="px-6 py-3 bg-gray-900 text-white rounded-r-lg font-bold hover:bg-gray-800 transition ru hidden"> |
|
|
Подписаться |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<footer class="bg-gray-900 py-12"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8"> |
|
|
<div> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="w-10 h-10 rounded-full bg-gradient-to-r from-orange-500 to-pink-600 flex items-center justify-center mr-3"> |
|
|
<i class="fas fa-brain text-white"></i> |
|
|
</div> |
|
|
<a href="#" class="text-2xl font-bold gradient-text">NeuroArt</a> |
|
|
</div> |
|
|
<p class="text-gray-400 mb-4 en"> |
|
|
Art created by artificial intelligence for true connoisseurs. |
|
|
</p> |
|
|
<p class="text-gray-400 mb-4 ru hidden"> |
|
|
Искусство, созданное искусственным интеллектом для настоящих ценителей. |
|
|
</p> |
|
|
<div class="flex space-x-4"> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition"> |
|
|
<i class="fab fa-telegram"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition"> |
|
|
<i class="fab fa-instagram"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition"> |
|
|
<i class="fab fa-twitter"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition"> |
|
|
<i class="fab fa-discord"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-lg font-bold text-white mb-4 en">Sections</h3> |
|
|
<h3 class="text-lg font-bold text-white mb-4 ru hidden">Разделы</h3> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#midjourney" class="text-gray-400 hover:text-orange-400 transition en">Midjourney</a></li> |
|
|
<li><a href="#midjourney" class="text-gray-400 hover:text-orange-400 transition ru hidden">Миджорни</a></li> |
|
|
<li><a href="#aviation" class="text-gray-400 hover:text-orange-400 transition en">Aviation</a></li> |
|
|
<li><a href="#aviation" class="text-gray-400 hover:text-orange-400 transition ru hidden">Авиация</a></li> |
|
|
<li><a href="#about" class="text-gray-400 hover:text-orange-400 transition en">About</a></li> |
|
|
<li><a href="#about" class="text-gray-400 hover:text-orange-400 transition ru hidden">О нас</a></li> |
|
|
<li><a href="#buy" class="text-gray-400 hover:text-orange-400 transition en">Buy Art</a></li> |
|
|
<li><a href="#buy" class="text-gray-400 hover:text-orange-400 transition ru hidden">Купить арт</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-lg font-bold text-white mb-4 en">Support</h3> |
|
|
<h3 class="text-lg font-bold text-white mb-4 ru hidden">Поддержка</h3> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#" class="text-gray-400 hover:text-orange-400 transition en">FAQ</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-orange-400 transition ru hidden">FAQ</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-orange-400 transition en">Delivery</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-orange-400 transition ru hidden">Доставка</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-orange-400 transition en">Returns</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-orange-400 transition ru hidden">Возврат</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-orange-400 transition en">Contacts</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-orange-400 transition ru hidden">Контакты</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-lg font-bold text-white mb-4 en">Contacts</h3> |
|
|
<h3 class="text-lg font-bold text-white mb-4 ru hidden">Контакты</h3> |
|
|
<ul class="space-y-2"> |
|
|
<li class="flex items-center text-gray-400"> |
|
|
<i class="fas fa-envelope mr-2"></i> info@neuroart.com |
|
|
</li> |
|
|
<li class="flex items-center text-gray-400"> |
|
|
<i class="fas fa-phone mr-2"></i> +7 (123) 456-7890 |
|
|
</li> |
|
|
<li class="flex items-start text-gray-400"> |
|
|
<i class="fas fa-map-marker-alt mr-2 mt-1"></i> |
|
|
<span class="en">Moscow, Neuronnaya st., 42</span> |
|
|
<span class="ru hidden">Москва, ул. Нейронная, 42</span> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center"> |
|
|
<p class="text-gray-400 mb-4 md:mb-0 en"> |
|
|
© 2023 NeuroArt Gallery. All rights reserved. |
|
|
</p> |
|
|
<p class="text-gray-400 mb-4 md:mb-0 ru hidden"> |
|
|
© 2023 NeuroArt Gallery. Все права защищены. |
|
|
</p> |
|
|
<div class="flex space-x-6"> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition en">Privacy Policy</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition ru hidden">Политика конфиденциальности</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition en">Terms of Use</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition ru hidden">Условия использования</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
<script> |
|
|
|
|
|
document.getElementById('menu-toggle').addEventListener('click', function() { |
|
|
const menu = document.getElementById('mobile-menu'); |
|
|
menu.classList.toggle('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.faq-toggle').forEach(button => { |
|
|
button.addEventListener('click', () => { |
|
|
const content = button.nextElementSibling; |
|
|
const icon = button.querySelector('i'); |
|
|
|
|
|
content.classList.toggle('hidden'); |
|
|
icon.classList.toggle('rotate-180'); |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
|
|
anchor.addEventListener('click', function(e) { |
|
|
e.preventDefault(); |
|
|
|
|
|
const targetId = this.getAttribute('href'); |
|
|
const targetElement = document.querySelector(targetId); |
|
|
|
|
|
if (targetElement) { |
|
|
window.scrollTo({ |
|
|
top: targetElement.offsetTop - 80, |
|
|
behavior: 'smooth' |
|
|
}); |
|
|
|
|
|
|
|
|
const mobileMenu = document.getElementById('mobile-menu'); |
|
|
if (!mobileMenu.classList.contains('hidden')) { |
|
|
mobileMenu.classList.add('hidden'); |
|
|
} |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
window.addEventListener('scroll', function() { |
|
|
const header = document.querySelector('header'); |
|
|
if (window.scrollY > 50) { |
|
|
header.classList.add('shadow-lg'); |
|
|
} else { |
|
|
header.classList.remove('shadow-lg'); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.language-option').forEach(option => { |
|
|
option.addEventListener('click', function(e) { |
|
|
e.preventDefault(); |
|
|
const lang = this.getAttribute('data-lang'); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.en, .ru').forEach(el => { |
|
|
el.classList.add('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll(`.${lang}`).forEach(el => { |
|
|
el.classList.remove('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelector('.language-switcher .en').textContent = lang === 'en' ? 'EN' : 'RU'; |
|
|
document.querySelector('.language-switcher .ru').textContent = lang === 'en' ? 'EN' : 'RU'; |
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=manual16/engl" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
