Spaces:
Running
Running
| <html lang="ru"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>PROFIT STITCH - Пошив корпоративного мерча для бизнеса</title> | |
| <meta name="description" content="Профессиональный пошив корпоративного мерча под ваш бренд. Высокое качество, быстрые сроки, индивидуальный подход."> | |
| <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> | |
| .hero-gradient { | |
| background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%); | |
| } | |
| .btn-primary { | |
| background: linear-gradient(90deg, #f59e0b 0%, #ef4444 100%); | |
| transition: all 0.3s ease; | |
| } | |
| .btn-primary:hover { | |
| transform: translateY(-3px); | |
| box-shadow: 0 10px 20px -5px rgba(239, 68, 68, 0.4); | |
| } | |
| .feature-icon { | |
| background: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%); | |
| } | |
| .portfolio-item:hover .portfolio-overlay { | |
| opacity: 1; | |
| } | |
| .portfolio-overlay { | |
| background: rgba(30, 64, 175, 0.9); | |
| transition: all 0.3s ease; | |
| } | |
| .cta-section { | |
| background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('https://images.unsplash.com/photo-1525130413817-d45c1d127c42?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80'); | |
| background-size: cover; | |
| background-position: center; | |
| } | |
| .form-input:focus { | |
| box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5); | |
| } | |
| .animate-bounce-slow { | |
| animation: bounce 3s infinite; | |
| } | |
| @keyframes bounce { | |
| 0%, 100% { | |
| transform: translateY(0); | |
| } | |
| 50% { | |
| transform: translateY(-15px); | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body class="font-sans text-gray-800"> | |
| <!-- Header --> | |
| <header class="bg-white shadow-md sticky top-0 z-50"> | |
| <div class="container mx-auto px-4 py-3 flex justify-between items-center"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-tshirt text-3xl text-blue-600 mr-2"></i> | |
| <span class="text-2xl font-bold text-blue-800">PROFIT<span class="text-orange-500">STITCH</span></span> | |
| </div> | |
| <nav class="hidden md:flex space-x-8"> | |
| <a href="#about" class="font-medium hover:text-blue-600 transition">О нас</a> | |
| <a href="#products" class="font-medium hover:text-blue-600 transition">Продукция</a> | |
| <a href="#advantages" class="font-medium hover:text-blue-600 transition">Преимущества</a> | |
| <a href="#portfolio" class="font-medium hover:text-blue-600 transition">Портфолио</a> | |
| <a href="#reviews" class="font-medium hover:text-blue-600 transition">Отзывы</a> | |
| <a href="#contacts" class="font-medium hover:text-blue-600 transition">Контакты</a> | |
| </nav> | |
| <div class="md:hidden"> | |
| <button id="menu-toggle" class="text-gray-700 focus:outline-none"> | |
| <i class="fas fa-bars text-2xl"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Mobile menu --> | |
| <div id="mobile-menu" class="hidden md:hidden bg-white py-2 px-4 shadow-lg"> | |
| <a href="#about" class="block py-2 hover:text-blue-600">О нас</a> | |
| <a href="#products" class="block py-2 hover:text-blue-600">Продукция</a> | |
| <a href="#advantages" class="block py-2 hover:text-blue-600">Преимущества</a> | |
| <a href="#portfolio" class="block py-2 hover:text-blue-600">Портфолио</a> | |
| <a href="#reviews" class="block py-2 hover:text-blue-600">Отзывы</a> | |
| <a href="#contacts" class="block py-2 hover:text-blue-600">Контакты</a> | |
| </div> | |
| </header> | |
| <!-- Hero Section --> | |
| <section class="hero-gradient text-white py-20 md:py-32"> | |
| <div class="container mx-auto px-4 flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0"> | |
| <h1 class="text-4xl md:text-5xl font-bold mb-6 leading-tight">Корпоративный мерч, который работает на ваш бренд</h1> | |
| <p class="text-xl mb-8 opacity-90">Профессиональный пошив фирменной одежды и аксессуаров для продвижения вашей компании</p> | |
| <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4"> | |
| <a href="#contacts" class="btn-primary text-white font-bold py-3 px-8 rounded-full text-center">Заказать мерч</a> | |
| <a href="#portfolio" class="bg-white text-blue-800 font-bold py-3 px-8 rounded-full text-center hover:bg-gray-100 transition">Смотреть работы</a> | |
| </div> | |
| <div class="mt-10 flex items-center"> | |
| <div class="flex -space-x-2"> | |
| <img src="https://randomuser.me/api/portraits/women/12.jpg" class="w-10 h-10 rounded-full border-2 border-white" alt="Клиент"> | |
| <img src="https://randomuser.me/api/portraits/men/32.jpg" class="w-10 h-10 rounded-full border-2 border-white" alt="Клиент"> | |
| <img src="https://randomuser.me/api/portraits/women/45.jpg" class="w-10 h-10 rounded-full border-2 border-white" alt="Клиент"> | |
| </div> | |
| <div class="ml-4"> | |
| <p class="text-sm opacity-90">Более <span class="font-bold">250+</span> довольных клиентов</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center"> | |
| <img src="https://images.unsplash.com/photo-1556905055-8f358a7a4b2c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" | |
| alt="Корпоративный мерч" | |
| class="rounded-lg shadow-2xl max-w-md w-full animate-bounce-slow"> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Trusted by --> | |
| <section class="py-10 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <p class="text-center text-gray-500 mb-8">Нам доверяют:</p> | |
| <div class="flex flex-wrap justify-center items-center gap-8 md:gap-16"> | |
| <img src="https://via.placeholder.com/120x60?text=Company+1" alt="Логотип компании" class="h-10 opacity-70 hover:opacity-100 transition"> | |
| <img src="https://via.placeholder.com/120x60?text=Company+2" alt="Логотип компании" class="h-10 opacity-70 hover:opacity-100 transition"> | |
| <img src="https://via.placeholder.com/120x60?text=Company+3" alt="Логотип компании" class="h-10 opacity-70 hover:opacity-100 transition"> | |
| <img src="https://via.placeholder.com/120x60?text=Company+4" alt="Логотип компании" class="h-10 opacity-70 hover:opacity-100 transition"> | |
| <img src="https://via.placeholder.com/120x60?text=Company+5" alt="Логотип компании" class="h-10 opacity-70 hover:opacity-100 transition"> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- About Section --> | |
| <section id="about" class="py-20"> | |
| <div class="container mx-auto px-4"> | |
| <div class="flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0 md:pr-10"> | |
| <h2 class="text-3xl font-bold mb-6">PROFIT STITCH - ваш надежный партнер в производстве мерча</h2> | |
| <p class="text-lg mb-6 text-gray-600">Мы специализируемся на пошиве корпоративной одежды и аксессуаров уже более 10 лет. Наше производство оснащено современным оборудованием, а команда состоит из опытных профессионалов.</p> | |
| <p class="text-lg mb-8 text-gray-600">Мы понимаем, что корпоративный мерч - это не просто одежда, а мощный инструмент маркетинга и формирования корпоративной культуры.</p> | |
| <div class="flex space-x-4"> | |
| <div class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full flex items-center"> | |
| <i class="fas fa-check-circle mr-2"></i> | |
| <span>Гарантия качества</span> | |
| </div> | |
| <div class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full flex items-center"> | |
| <i class="fas fa-bolt mr-2"></i> | |
| <span>Быстрые сроки</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2"> | |
| <div class="bg-gray-100 p-6 rounded-xl"> | |
| <img src="https://images.unsplash.com/photo-1527719327859-c6ce80353573?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" | |
| alt="Наше производство" | |
| class="rounded-lg shadow-lg w-full"> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Products Section --> | |
| <section id="products" class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold mb-4">Что мы производим</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto">Широкий ассортимент корпоративной продукции для любых задач</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Product 1 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-xl transition"> | |
| <div class="h-48 bg-blue-100 flex items-center justify-center"> | |
| <i class="fas fa-tshirt text-6xl text-blue-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold mb-3">Фирменные футболки</h3> | |
| <p class="text-gray-600 mb-4">Классические, поло, с длинным рукавом - любые варианты с нанесением вашего логотипа.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="font-bold text-blue-600">от 790 ₽</span> | |
| <a href="#contacts" class="text-blue-600 hover:text-blue-800 font-medium">Заказать →</a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Product 2 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-xl transition"> | |
| <div class="h-48 bg-green-100 flex items-center justify-center"> | |
| <i class="fas fa-hat-cowboy text-6xl text-green-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold mb-3">Брендированные головные уборы</h3> | |
| <p class="text-gray-600 mb-4">Бейсболки, кепки, шапки - защитите сотрудников и продвигайте бренд одновременно.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="font-bold text-blue-600">от 990 ₽</span> | |
| <a href="#contacts" class="text-blue-600 hover:text-blue-800 font-medium">Заказать →</a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Product 3 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-xl transition"> | |
| <div class="h-48 bg-red-100 flex items-center justify-center"> | |
| <i class="fas fa-wind text-6xl text-red-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold mb-3">Ветровки и толстовки</h3> | |
| <p class="text-gray-600 mb-4">Стильная верхняя одежда с фирменной символикой для корпоративного стиля.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="font-bold text-blue-600">от 1 990 ₽</span> | |
| <a href="#contacts" class="text-blue-600 hover:text-blue-800 font-medium">Заказать →</a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Product 4 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-xl transition"> | |
| <div class="h-48 bg-yellow-100 flex items-center justify-center"> | |
| <i class="fas fa-bag-shopping text-6xl text-yellow-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold mb-3">Эко-сумки и рюкзаки</h3> | |
| <p class="text-gray-600 mb-4">Практичные аксессуары с логотипом компании для повседневного использования.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="font-bold text-blue-600">от 1 290 ₽</span> | |
| <a href="#contacts" class="text-blue-600 hover:text-blue-800 font-medium">Заказать →</a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Product 5 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-xl transition"> | |
| <div class="h-48 bg-purple-100 flex items-center justify-center"> | |
| <i class="fas fa-vest text-6xl text-purple-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold mb-3">Рабочая одежда</h3> | |
| <p class="text-gray-600 mb-4">Спецодежда с фирменной символикой для сотрудников производств и сервисов.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="font-bold text-blue-600">от 2 490 ₽</span> | |
| <a href="#contacts" class="text-blue-600 hover:text-blue-800 font-medium">Заказать →</a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Product 6 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-xl transition"> | |
| <div class="h-48 bg-pink-100 flex items-center justify-center"> | |
| <i class="fas fa-plus text-6xl text-pink-600"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold mb-3">Другие изделия</h3> | |
| <p class="text-gray-600 mb-4">Полотенца, зонты, фартуки и любые другие текстильные изделия с вашим брендом.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="font-bold text-blue-600">Индивидуально</span> | |
| <a href="#contacts" class="text-blue-600 hover:text-blue-800 font-medium">Обсудить →</a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Advantages Section --> | |
| <section id="advantages" class="py-20"> | |
| <div class="container mx-auto px-4"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold mb-4">Почему выбирают нас</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto">Мы создаем не просто мерч, а эффективный инструмент для вашего бизнеса</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Advantage 1 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition"> | |
| <div class="feature-icon w-14 h-14 rounded-full flex items-center justify-center text-white mb-4"> | |
| <i class="fas fa-medal text-2xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold mb-3">Качество премиум-класса</h3> | |
| <p class="text-gray-600">Используем только качественные материалы и проверенные технологии пошива. Наша продукция выдерживает многократные стирки без потери вида.</p> | |
| </div> | |
| <!-- Advantage 2 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition"> | |
| <div class="feature-icon w-14 h-14 rounded-full flex items-center justify-center text-white mb-4"> | |
| <i class="fas fa-clock text-2xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold mb-3">Сроки от 7 дней</h3> | |
| <p class="text-gray-600">Оперативное производство позволяет выполнять заказы в кратчайшие сроки без потери качества. Срочные заказы - без проблем!</p> | |
| </div> | |
| <!-- Advantage 3 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition"> | |
| <div class="feature-icon w-14 h-14 rounded-full flex items-center justify-center text-white mb-4"> | |
| <i class="fas fa-ruler-combined text-2xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold mb-3">Индивидуальный подход</h3> | |
| <p class="text-gray-600">Разрабатываем уникальные модели под ваш бренд. Поможем с дизайном, подбором материалов и технологий нанесения.</p> | |
| </div> | |
| <!-- Advantage 4 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition"> | |
| <div class="feature-icon w-14 h-14 rounded-full flex items-center justify-center text-white mb-4"> | |
| <i class="fas fa-truck text-2xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold mb-3">Доставка по всей России</h3> | |
| <p class="text-gray-600">Отправляем заказы в любой регион удобной для вас транспортной компанией. Возможен самовывоз с нашего склада.</p> | |
| </div> | |
| <!-- Advantage 5 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition"> | |
| <div class="feature-icon w-14 h-14 rounded-full flex items-center justify-center text-white mb-4"> | |
| <i class="fas fa-percent text-2xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold mb-3">Гибкая система скидок</h3> | |
| <p class="text-gray-600">Предоставляем выгодные условия для постоянных клиентов и крупных заказов. Скидки до 25% при заказе от 50 единиц.</p> | |
| </div> | |
| <!-- Advantage 6 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition"> | |
| <div class="feature-icon w-14 h-14 rounded-full flex items-center justify-center text-white mb-4"> | |
| <i class="fas fa-headset text-2xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold mb-3">Персональный менеджер</h3> | |
| <p class="text-gray-600">Каждый клиент получает персонального менеджера, который сопровождает заказ на всех этапах - от консультации до доставки.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Portfolio Section --> | |
| <section id="portfolio" class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold mb-4">Наши работы</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto">Примеры корпоративного мерча, который мы создали для клиентов</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> | |
| <!-- Portfolio Item 1 --> | |
| <div class="portfolio-item relative rounded-xl overflow-hidden h-64"> | |
| <img src="https://images.unsplash.com/photo-1529374255404-311a2a4f1fd9?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" | |
| alt="Корпоративные футболки" | |
| class="w-full h-full object-cover"> | |
| <div class="portfolio-overlay absolute inset-0 flex items-center justify-center opacity-0 p-6"> | |
| <div class="text-white text-center"> | |
| <h3 class="text-xl font-bold mb-2">Футболки для IT-компании</h3> | |
| <p>Серия футболок с фирменным дизайном для сотрудников и клиентов</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Portfolio Item 2 --> | |
| <div class="portfolio-item relative rounded-xl overflow-hidden h-64"> | |
| <img src="https://images.unsplash.com/photo-1620799140408-edc6dcb6d633?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" | |
| alt="Брендированные толстовки" | |
| class="w-full h-full object-cover"> | |
| <div class="portfolio-overlay absolute inset-0 flex items-center justify-center opacity-0 p-6"> | |
| <div class="text-white text-center"> | |
| <h3 class="text-xl font-bold mb-2">Толстовки для сети кофеен</h3> | |
| <p>Теплые худи с логотипом для бариста и промоакций</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Portfolio Item 3 --> | |
| <div class="portfolio-item relative rounded-xl overflow-hidden h-64"> | |
| <img src="https://images.unsplash.com/photo-1598033129183-c4f50c736f10?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1025&q=80" | |
| alt="Корпоративные бейсболки" | |
| class="w-full h-full object-cover"> | |
| <div class="portfolio-overlay absolute inset-0 flex items-center justify-center opacity-0 p-6"> | |
| <div class="text-white text-center"> | |
| <h3 class="text-xl font-bold mb-2">Бейсболки для спортивного клуба</h3> | |
| <p>Стильные кепки с вышивкой для фанатов и игроков</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Portfolio Item 4 --> | |
| <div class="portfolio-item relative rounded-xl overflow-hidden h-64"> | |
| <img src="https://images.unsplash.com/photo-1556905050-14c8f2c9ec83?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" | |
| alt="Рабочая одежда" | |
| class="w-full h-full object-cover"> | |
| <div class="portfolio-overlay absolute inset-0 flex items-center justify-center opacity-0 p-6"> | |
| <div class="text-white text-center"> | |
| <h3 class="text-xl font-bold mb-2">Спецодежда для строителей</h3> | |
| <p>Прочные комбинезоны с логотипом компании</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Portfolio Item 5 --> | |
| <div class="portfolio-item relative rounded-xl overflow-hidden h-64"> | |
| <img src="https://images.unsplash.com/photo-1523264939339-c89f9dadde2e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1471&q=80" | |
| alt="Эко-сумки" | |
| class="w-full h-full object-cover"> | |
| <div class="portfolio-overlay absolute inset-0 flex items-center justify-center opacity-0 p-6"> | |
| <div class="text-white text-center"> | |
| <h3 class="text-xl font-bold mb-2">Эко-сумки для супермаркета</h3> | |
| <p>Экологичные сумки с принтом для продвижения бренда</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Portfolio Item 6 --> | |
| <div class="portfolio-item relative rounded-xl overflow-hidden h-64"> | |
| <img src="https://images.unsplash.com/photo-1551232864-3f0890e580d9?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=687&q=80" | |
| alt="Корпоративные рюкзаки" | |
| class="w-full h-full object-cover"> | |
| <div class="portfolio-overlay absolute inset-0 flex items-center justify-center opacity-0 p-6"> | |
| <div class="text-white text-center"> | |
| <h3 class="text-xl font-bold mb-2">Рюкзаки для университета</h3> | |
| <p>Стильные рюкзаки для студентов и преподавателей</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <a href="#contacts" class="inline-block btn-primary text-white font-bold py-3 px-8 rounded-full">Хочу такой же мерч!</a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- How We Work Section --> | |
| <section class="py-20"> | |
| <div class="container mx-auto px-4"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold mb-4">Как мы работаем</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto">Простой и прозрачный процесс создания вашего корпоративного мерча</p> | |
| </div> | |
| <div class="flex flex-col md:flex-row justify-between items-stretch gap-8"> | |
| <!-- Step 1 --> | |
| <div class="flex-1 flex flex-col items-center text-center"> | |
| <div class="w-20 h-20 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mb-6 text-2xl font-bold">1</div> | |
| <h3 class="text-xl font-bold mb-3">Заявка и консультация</h3> | |
| <p class="text-gray-600">Вы оставляете заявку, наш менеджер связывается с вами для уточнения деталей и консультации</p> | |
| </div> | |
| <!-- Step 2 --> | |
| <div class="flex-1 flex flex-col items-center text-center"> | |
| <div class="w-20 h-20 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mb-6 text-2xl font-bold">2</div> | |
| <h3 class="text-xl font-bold mb-3">Разработка дизайна</h3> | |
| <p class="text-gray-600">Наши дизайнеры создают макеты с учетом ваших пожеланий и корпоративного стиля</p> | |
| </div> | |
| <!-- Step 3 --> | |
| <div class="flex-1 flex flex-col items-center text-center"> | |
| <div class="w-20 h-20 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mb-6 text-2xl font-bold">3</div> | |
| <h3 class="text-xl font-bold mb-3">Согласование и оплата</h3> | |
| <p class="text-gray-600">Вы утверждаете макеты, мы рассчитываем стоимость и заключаем договор</p> | |
| </div> | |
| <!-- Step 4 --> | |
| <div class="flex-1 flex flex-col items-center text-center"> | |
| <div class="w-20 h-20 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mb-6 text-2xl font-bold">4</div> | |
| <h3 class="text-xl font-bold mb-3">Производство</h3> | |
| <p class="text-gray-600">Мы изготавливаем ваш заказ с соблюдением всех стандартов качества</p> | |
| </div> | |
| <!-- Step 5 --> | |
| <div class="flex-1 flex flex-col items-center text-center"> | |
| <div class="w-20 h-20 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mb-6 text-2xl font-bold">5</div> | |
| <h3 class="text-xl font-bold mb-3">Доставка</h3> | |
| <p class="text-gray-600">Готовый мерч доставляем вам удобным способом в оговоренные сроки</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Reviews Section --> | |
| <section id="reviews" class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold mb-4">Отзывы клиентов</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto">Что говорят о нас компании, которые уже заказывали у нас мерч</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Review 1 --> | |
| <div class="bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex items-center mb-4"> | |
| <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Клиент" class="w-12 h-12 rounded-full mr-4"> | |
| <div> | |
| <h4 class="font-bold">Александр Петров</h4> | |
| <p class="text-sm text-gray-500">Директор IT-компании</p> | |
| </div> | |
| </div> | |
| <div class="mb-4"> | |
| <div class="flex text-yellow-400"> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| </div> | |
| </div> | |
| <p class="text-gray-600">"Заказывали футболки для сотрудников и клиентов. Качество пошива и печати на высоте! Все сроки соблюдены, менеджер постоянно был на связи. Будем обращаться еще!"</p> | |
| </div> | |
| <!-- Review 2 --> | |
| <div class="bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex items-center mb-4"> | |
| <img src="https://randomuser.me/api/portraits/women/44.jpg" alt="Клиент" class="w-12 h-12 rounded-full mr-4"> | |
| <div> | |
| <h4 class="font-bold">Елена Смирнова</h4> | |
| <p class="text-sm text-gray-500">Маркетолог ритейл-сети</p> | |
| </div> | |
| </div> | |
| <div class="mb-4"> | |
| <div class="flex text-yellow-400"> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| </div> | |
| </div> | |
| <p class="text-gray-600">"Сотрудничаем уже третий год. Всегда предлагают интересные решения, помогают с дизайном. Наши эко-сумки с логотипом стали хитом среди покупателей!"</p> | |
| </div> | |
| <!-- Review 3 --> | |
| <div class="bg-white p-8 rounded-xl shadow-md"> | |
| <div class="flex items-center mb-4"> | |
| <img src="https://randomuser.me/api/portraits/men/75.jpg" alt="Клиент" class="w-12 h-12 rounded-full mr-4"> | |
| <div> | |
| <h4 class="font-bold">Дмитрий Иванов</h4> | |
| <p class="text-sm text-gray-500">Владелец кафе</p> | |
| </div> | |
| </div> | |
| <div class="mb-4"> | |
| <div class="flex text-yellow-400"> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star-half-alt"></i> | |
| </div> | |
| </div> | |
| <p class="text-gray-600">"Заказали фартуки и кепки для бариста. Качество хорошее, но немного задержали сроки из-за большого объема заказов перед сезоном. В целом доволен, ценю индивидуальный подход."</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- CTA Section --> | |
| <section class="cta-section py-20 text-white"> | |
| <div class="container mx-auto px-4 text-center"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-6">Готовы заказать корпоративный мерч?</h2> | |
| <p class="text-xl mb-8 max-w-2xl mx-auto">Оставьте заявку прямо сейчас и получите бесплатный дизайн-макет вашего будущего мерча!</p> | |
| <a href="#contacts" class="inline-block btn-primary text-white font-bold py-3 px-8 rounded-full text-lg">Оставить заявку</a> | |
| </div> | |
| </section> | |
| <!-- FAQ Section --> | |
| <section class="py-20"> | |
| <div class="container mx-auto px-4"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold mb-4">Частые вопросы</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto">Ответы на самые популярные вопросы о нашем производстве</p> | |
| </div> | |
| <div class="max-w-3xl mx-auto"> | |
| <!-- FAQ Item 1 --> | |
| <div class="mb-6 border-b pb-4"> | |
| <button class="faq-question flex justify-between items-center w-full text-left font-bold text-lg"> | |
| <span>Какие технологии нанесения вы используете?</span> | |
| <i class="fas fa-chevron-down ml-2 transition-transform"></i> | |
| </button> | |
| <div class="faq-answer mt-3 text-gray-600 hidden"> | |
| <p>Мы применяем различные технологии в зависимости от задачи: шелкография, термотрансфер, вышивка, сублимация, флок и другие. Наши специалисты помогут выбрать оптимальный вариант для вашего дизайна и типа ткани.</p> | |
| </div> | |
| </div> | |
| <!-- FAQ Item 2 --> | |
| <div class="mb-6 border-b pb-4"> | |
| <button class="faq-question flex justify-between items-center w-full text-left font-bold text-lg"> | |
| <span>Какой минимальный тираж?</span> | |
| <i class="fas fa-chevron-down ml-2 transition-transform"></i> | |
| </button> | |
| <div class="faq-answer mt-3 text-gray-600 hidden"> | |
| <p>Минимальный тираж зависит от типа изделия и технологии нанесения. В среднем от 10 штук для простых изделий. Для сложных заказов с индивидуальным пошивом минимальный тираж может быть выше.</p> | |
| </div> | |
| </div> | |
| <!-- FAQ Item 3 --> | |
| <div class="mb-6 border-b pb-4"> | |
| <button class="faq-question flex justify-between items-center w-full text-left font-bold text-lg"> | |
| <span>Можно ли использовать наш дизайн?</span> | |
| <i class="fas fa-chevron-down ml-2 transition-transform"></i> | |
| </button> | |
| <div class="faq-answer mt-3 text-gray-600 hidden"> | |
| <p>Конечно! Мы работаем как с готовыми дизайнами клиентов, так и разрабатываем их с нуля. Если у вас есть фирменный стиль или логотип, мы адаптируем его для нанесения на выбранные изделия.</p> | |
| </div> | |
| </div> | |
| <!-- FAQ Item 4 --> | |
| <div class="mb-6 border-b pb-4"> | |
| <button class="faq-question flex justify-between items-center w-full text-left font-bold text-lg"> | |
| <span>Как долго выполняется заказ?</span> | |
| <i class="fas fa-chevron-down ml-2 transition-transform"></i> | |
| </button> | |
| <div class="faq-answer mt-3 text-gray-600 hidden"> | |
| <p>Стандартные сроки производства - от 7 рабочих дней после утверждения всех деталей. Для срочных заказов возможны сокращенные сроки за дополнительную плату.</p> | |
| </div> | |
| </div> | |
| <!-- FAQ Item 5 --> | |
| <div class="mb-6 border-b pb-4"> | |
| <button class="faq-question flex justify-between items-center w-full text-left font-bold text-lg"> | |
| <span>Есть ли у вас доставка в регионы?</span> | |
| <i class="fas fa-chevron-down ml-2 transition-transform"></i> | |
| </button> | |
| <div class="faq-answer mt-3 text-gray-600 hidden"> | |
| <p>Да, мы отправляем заказы по всей России через проверенные транспортные компании (СДЭК, Boxberry, Почта России и другие). Стоимость доставки рассчитывается индивидуально.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Contacts Section --> | |
| <section id="contacts" class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <div class="flex flex-col lg:flex-row"> | |
| <div class="lg:w-1/2 mb-10 lg:mb-0 lg:pr-10"> | |
| <h2 class="text-3xl font-bold mb-6">Свяжитесь с нами</h2> | |
| <p class="text-lg mb-8 text-gray-600">Оставьте заявку, и наш менеджер свяжется с вами в течение 30 минут для уточнения деталей и расчета стоимости.</p> | |
| <div class="mb-8"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-10 h-10 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mr-4"> | |
| <i class="fas fa-phone"></i> | |
| </div> | |
| <div> | |
| <p class="text-gray-500">Телефон</p> | |
| <a href="tel:+78001234567" class="text-xl font-bold hover:text-blue-600">8 (800) 123-45-67</a> | |
| </div> | |
| </div> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-10 h-10 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mr-4"> | |
| <i class="fas fa-envelope"></i> | |
| </div> | |
| <div> | |
| <p class="text-gray-500">Email</p> | |
| <a href="mailto:[email protected]" class="text-xl font-bold hover:text-blue-600">[email protected]</a> | |
| </div> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-10 h-10 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mr-4"> | |
| <i class="fas fa-map-marker-alt"></i> | |
| </div> | |
| <div> | |
| <p class="text-gray-500">Адрес</p> | |
| <p class="text-xl font-bold">г. Москва, ул. Производственная, 15</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="w-10 h-10 rounded-full bg-blue-600 text-white flex items-center justify-center hover:bg-blue-700 transition"> | |
| <i class="fab fa-whatsapp"></i> | |
| </a> | |
| <a href="#" class="w-10 h-10 rounded-full bg-blue-600 text-white flex items-center justify-center hover:bg-blue-700 transition"> | |
| <i class="fab fa-telegram"></i> | |
| </a> | |
| <a href="#" class="w-10 h-10 rounded-full bg-blue-600 text-white flex items-center justify-center hover:bg-blue-700 transition"> | |
| <i class="fab fa-vk"></i> | |
| </a> | |
| </div> | |
| </div> | |
| <div class="lg:w-1/2"> | |
| <form class="bg-white p-8 rounded-xl shadow-md"> | |
| <h3 class="text-xl font-bold mb-6">Оставить заявку</h3> | |
| <div class="mb-4"> | |
| <label for="name" class="block text-gray-700 mb-2">Ваше имя</label> | |
| <input type="text" id="name" class="form-input w-full px-4 py-3 border rounded-lg focus:outline-none" placeholder="Иван Иванов"> | |
| </div> | |
| <div class="mb-4"> | |
| <label for="phone" class="block text-gray-700 mb-2">Телефон</label> | |
| <input type="tel" id="phone" class="form-input w-full px-4 py-3 border rounded-lg focus:outline-none" placeholder="+7 (999) 123-45-67"> | |
| </div> | |
| <div class="mb-4"> | |
| <label for="email" class="block text-gray-700 mb-2">Email</label> | |
| <input type="email" id="email" class="form-input w-full px-4 py-3 border rounded-lg focus:outline-none" placeholder="[email protected]"> | |
| </div> | |
| <div class="mb-6"> | |
| <label for="message" class="block text-gray-700 mb-2">Сообщение</label> | |
| <textarea id="message" rows="4" class="form-input w-full px-4 py-3 border rounded-lg focus:outline-none" placeholder="Опишите, какой мерч вам нужен"></textarea> | |
| </div> | |
| <button type="submit" class="btn-primary w-full text-white font-bold py-3 px-4 rounded-lg text-lg">Отправить заявку</button> | |
| <p class="text-sm text-gray-500 mt-4">Нажимая кнопку, вы соглашаетесь с <a href="#" class="text-blue-600 hover:underline">политикой конфиденциальности</a></p> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Map Section --> | |
| <div class="h-96 bg-gray-200"> | |
| <iframe src="https://yandex.ru/map-widget/v1/?um=constructor%3A1a0f6e4a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0a0 | |
| </html> |