Spaces:
Running
Running
| <html lang="ru"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Профессиональный ремонт квартир под ключ</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> | |
| <style> | |
| .hero-section { | |
| background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80'); | |
| background-size: cover; | |
| background-position: center; | |
| } | |
| .project-card { | |
| transition: all 0.3s ease; | |
| } | |
| .project-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); | |
| } | |
| .accordion-content { | |
| max-height: 0; | |
| overflow: hidden; | |
| transition: max-height 0.3s ease; | |
| } | |
| .accordion-content.active { | |
| max-height: 500px; | |
| } | |
| .input-radio:checked + .radio-label { | |
| background-color: #3B82F6; | |
| color: white; | |
| } | |
| .review-card { | |
| transition: all 0.3s ease; | |
| } | |
| .review-card:hover { | |
| transform: scale(1.02); | |
| box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); | |
| } | |
| .floating-button { | |
| position: fixed; | |
| bottom: 30px; | |
| right: 30px; | |
| z-index: 100; | |
| box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3); | |
| } | |
| .parallax-section { | |
| background-attachment: fixed; | |
| background-position: center; | |
| background-repeat: no-repeat; | |
| background-size: cover; | |
| } | |
| </style> | |
| </head> | |
| <body class="font-sans"> | |
| <!-- Шапка сайта --> | |
| <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"> | |
| <div class="text-2xl font-bold text-blue-600 mr-10">РемонтКвартир</div> | |
| <nav class="hidden md:flex space-x-8"> | |
| <a href="#portfolio" class="text-gray-700 hover:text-blue-600 transition">Портфолио</a> | |
| <a href="#reviews" class="text-gray-700 hover:text-blue-600 transition">Отзывы</a> | |
| <a href="#about" class="text-gray-700 hover:text-blue-600 transition">О нас</a> | |
| <a href="#faq" class="text-gray-700 hover:text-blue-600 transition">Вопросы</a> | |
| </nav> | |
| </div> | |
| <div class="flex items-center space-x-4"> | |
| <a href="tel:+79991234567" class="hidden md:block text-gray-700 hover:text-blue-600 transition"> | |
| <i class="fas fa-phone mr-1"></i> +7 (999) 123-45-67 | |
| </a> | |
| <button class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 transition"> | |
| Задать вопрос | |
| </button> | |
| <div class="flex space-x-2 ml-4"> | |
| <a href="#" class="text-gray-700 hover:text-blue-600 transition"><i class="fab fa-telegram text-xl"></i></a> | |
| <a href="#" class="text-gray-700 hover:text-blue-600 transition"><i class="fab fa-whatsapp text-xl"></i></a> | |
| </div> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Герой секция --> | |
| <section class="hero-section text-white py-20"> | |
| <div class="container mx-auto px-4 flex flex-col items-start"> | |
| <h1 class="text-4xl md:text-5xl font-bold mb-6 max-w-2xl"> | |
| Хотите сделать ремонт в срок, по фиксированной цене, без нервов и головной боли? | |
| </h1> | |
| <p class="text-xl mb-8 max-w-2xl"> | |
| Тогда обращайтесь к нам! Ремонт в новостройке по готовым проектам с материалами за 60 дней | |
| </p> | |
| <button class="bg-blue-600 text-white px-8 py-4 rounded-md hover:bg-blue-700 transition text-lg font-semibold"> | |
| Рассчитать стоимость | |
| </button> | |
| <div class="flex flex-wrap mt-12 gap-6"> | |
| <div class="bg-white bg-opacity-20 backdrop-filter backdrop-blur-lg rounded-lg p-6 flex-1 min-w-[200px]"> | |
| <div class="text-4xl font-bold mb-2">1000+</div> | |
| <div class="text-lg">Довольных клиентов</div> | |
| </div> | |
| <div class="bg-white bg-opacity-20 backdrop-filter backdrop-blur-lg rounded-lg p-6 flex-1 min-w-[200px]"> | |
| <div class="text-4xl font-bold mb-2">60</div> | |
| <div class="text-lg">Дней срок ремонта</div> | |
| </div> | |
| <div class="bg-white bg-opacity-20 backdrop-filter backdrop-blur-lg rounded-lg p-6 flex-1 min-w-[200px]"> | |
| <div class="text-4xl font-bold mb-2">5</div> | |
| <div class="text-lg">Лет на рынке</div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Почему стоит выбрать --> | |
| <section class="py-16 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12">ПОЧЕМУ СТОИТ ВЫБРАТЬ РЕМОНТ ПО ГОТОВОМУ ПРОЕКТУ</h2> | |
| <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8"> | |
| <div class="bg-white p-6 rounded-lg shadow-md"> | |
| <div class="text-blue-600 text-4xl mb-4">1</div> | |
| <h3 class="text-xl font-semibold mb-3">ВЫГОДНО</h3> | |
| <p class="text-gray-600">Фиксированная цена за м2, без доплат, стоимость указана в договоре и не меняется</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md"> | |
| <div class="text-blue-600 text-4xl mb-4">2</div> | |
| <h3 class="text-xl font-semibold mb-3">БЕЗОПАСНО</h3> | |
| <p class="text-gray-600">Работаем по договору, нам доверились более 1000 клиентов</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md"> | |
| <div class="text-blue-600 text-4xl mb-4">3</div> | |
| <h3 class="text-xl font-semibold mb-3">БЫСТРО и КРАСИВО</h3> | |
| <p class="text-gray-600">Стильный и качественный интерьер за 60 дней или быстрее</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md"> | |
| <div class="text-blue-600 text-4xl mb-4">4</div> | |
| <h3 class="text-xl font-semibold mb-3">КАЧЕСТВЕННО</h3> | |
| <p class="text-gray-600">Закупаем качественные материалы только у официальных поставщиков с сертификатом качества</p> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <button class="bg-blue-600 text-white px-8 py-3 rounded-md hover:bg-blue-700 transition font-semibold"> | |
| Подробнее «Что такое ремонт по готовому проекту» | |
| </button> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Варианты готовых проектов --> | |
| <section id="portfolio" class="py-16"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12">ВАРИАНТЫ ГОТОВЫХ ПРОЕКТОВ</h2> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <div class="project-card bg-white rounded-lg overflow-hidden shadow-lg"> | |
| <img src="https://images.unsplash.com/photo-1616486338812-3dadae4b4ace?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Скандинавский стиль" class="w-full h-64 object-cover"> | |
| <div class="p-6"> | |
| <h3 class="text-2xl font-bold mb-3">Скандинавский</h3> | |
| <p class="text-gray-600 mb-4">Светлые тона, натуральные материалы, минимализм и функциональность. Идеально подходит для создания уютного и просторного интерьера.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-lg font-semibold">от 29 000 ₽/м²</span> | |
| <button class="bg-blue-600 text-white px-6 py-2 rounded-md hover:bg-blue-700 transition"> | |
| Подробнее | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="project-card bg-white rounded-lg overflow-hidden shadow-lg"> | |
| <img src="https://images.unsplash.com/photo-1600210492493-0946911123ea?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Современный стиль" class="w-full h-64 object-cover"> | |
| <div class="p-6"> | |
| <h3 class="text-2xl font-bold mb-3">Современный</h3> | |
| <p class="text-gray-600 mb-4">Четкие линии, контрастные сочетания, современные материалы и технологии. Для тех, кто ценит актуальные тенденции в дизайне.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-lg font-semibold">от 32 000 ₽/м²</span> | |
| <button class="bg-blue-600 text-white px-6 py-2 rounded-md hover:bg-blue-700 transition"> | |
| Подробнее | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="grid md:grid-cols-2 gap-8 mt-8"> | |
| <div class="project-card bg-white rounded-lg overflow-hidden shadow-lg"> | |
| <img src="https://images.unsplash.com/photo-1600121848594-d8644e57abab?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Лофт стиль" class="w-full h-64 object-cover"> | |
| <div class="p-6"> | |
| <h3 class="text-2xl font-bold mb-3">Лофт</h3> | |
| <p class="text-gray-600 mb-4">Грубые фактуры, кирпичные стены, открытые коммуникации и индустриальные элементы. Для смелых и креативных.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-lg font-semibold">от 35 000 ₽/м²</span> | |
| <button class="bg-blue-600 text-white px-6 py-2 rounded-md hover:bg-blue-700 transition"> | |
| Подробнее | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="project-card bg-white rounded-lg overflow-hidden shadow-lg"> | |
| <img src="https://images.unsplash.com/photo-1617806118233-18e1de247200?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Классический стиль" class="w-full h-64 object-cover"> | |
| <div class="p-6"> | |
| <h3 class="text-2xl font-bold mb-3">Классический</h3> | |
| <p class="text-gray-600 mb-4">Роскошные материалы, симметрия, лепнина и благородные цвета. Для ценителей традиционного стиля и элегантности.</p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-lg font-semibold">от 38 000 ₽/м²</span> | |
| <button class="bg-blue-600 text-white px-6 py-2 rounded-md hover:bg-blue-700 transition"> | |
| Подробнее | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <button class="bg-blue-600 text-white px-8 py-3 rounded-md hover:bg-blue-700 transition font-semibold"> | |
| Посмотреть все проекты (12+) | |
| </button> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Калькулятор --> | |
| <section class="py-16 bg-blue-600 text-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12">ОТВЕТЬТЕ НА 5 ВОПРОСОВ И ПОЛУЧИТЕ РАСЧЕТ СТОИМОСТИ РЕМОНТА ВАШЕЙ КВАРТИРЫ</h2> | |
| <div class="max-w-3xl mx-auto bg-white bg-opacity-20 backdrop-filter backdrop-blur-lg rounded-xl p-8"> | |
| <div class="mb-8"> | |
| <h3 class="text-xl font-semibold mb-4">1. Какая площадь квартиры?</h3> | |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-3"> | |
| <input type="radio" name="area" id="area1" class="hidden input-radio"> | |
| <label for="area1" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">до 50 м²</label> | |
| <input type="radio" name="area" id="area2" class="hidden input-radio"> | |
| <label for="area2" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">50-70 м²</label> | |
| <input type="radio" name="area" id="area3" class="hidden input-radio"> | |
| <label for="area3" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">70-90 м²</label> | |
| <input type="radio" name="area" id="area4" class="hidden input-radio"> | |
| <label for="area4" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">более 90 м²</label> | |
| </div> | |
| </div> | |
| <div class="mb-8"> | |
| <h3 class="text-xl font-semibold mb-4">2. Количество комнат?</h3> | |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-3"> | |
| <input type="radio" name="rooms" id="rooms1" class="hidden input-radio"> | |
| <label for="rooms1" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">1</label> | |
| <input type="radio" name="rooms" id="rooms2" class="hidden input-radio"> | |
| <label for="rooms2" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">2</label> | |
| <input type="radio" name="rooms" id="rooms3" class="hidden input-radio"> | |
| <label for="rooms3" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">3</label> | |
| <input type="radio" name="rooms" id="rooms4" class="hidden input-radio"> | |
| <label for="rooms4" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">4+</label> | |
| </div> | |
| </div> | |
| <div class="mb-8"> | |
| <h3 class="text-xl font-semibold mb-4">3. Количество санузлов?</h3> | |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-3"> | |
| <input type="radio" name="bathrooms" id="bath1" class="hidden input-radio"> | |
| <label for="bath1" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">1</label> | |
| <input type="radio" name="bathrooms" id="bath2" class="hidden input-radio"> | |
| <label for="bath2" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">2</label> | |
| </div> | |
| </div> | |
| <div class="mb-8"> | |
| <h3 class="text-xl font-semibold mb-4">4. Какая отделка в квартире?</h3> | |
| <div class="grid grid-cols-2 gap-3"> | |
| <input type="radio" name="finish" id="finish1" class="hidden input-radio"> | |
| <label for="finish1" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">Черновая</label> | |
| <input type="radio" name="finish" id="finish2" class="hidden input-radio"> | |
| <label for="finish2" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">Вайт бокс</label> | |
| </div> | |
| </div> | |
| <div class="mb-8"> | |
| <h3 class="text-xl font-semibold mb-4">5. Когда планируете ремонт?</h3> | |
| <div class="grid grid-cols-3 gap-3"> | |
| <input type="radio" name="time" id="time1" class="hidden input-radio"> | |
| <label for="time1" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">Срочно</label> | |
| <input type="radio" name="time" id="time2" class="hidden input-radio"> | |
| <label for="time2" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">1 мес</label> | |
| <input type="radio" name="time" id="time3" class="hidden input-radio"> | |
| <label for="time3" class="radio-label bg-white bg-opacity-20 text-center py-3 rounded-md cursor-pointer transition">3 мес</label> | |
| </div> | |
| </div> | |
| <button class="w-full bg-white text-blue-600 py-4 rounded-md font-semibold hover:bg-gray-100 transition"> | |
| Получить расчет стоимости | |
| </button> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Как мы работаем --> | |
| <section class="py-16 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12">КАК МЫ РАБОТАЕМ</h2> | |
| <div class="max-w-4xl mx-auto"> | |
| <div class="flex flex-col md:flex-row mb-8"> | |
| <div class="md:w-1/6 flex justify-center mb-4 md:mb-0"> | |
| <div class="bg-blue-600 text-white rounded-full w-12 h-12 flex items-center justify-center font-bold text-xl">1</div> | |
| </div> | |
| <div class="md:w-5/6"> | |
| <h3 class="text-xl font-semibold mb-2">Вы выбираете стиль ремонта и отделочные материалы в рамках проекта</h3> | |
| <p class="text-gray-600">Мы предлагаем несколько готовых проектов на выбор. Вы определяетесь с дизайном и материалами отделки.</p> | |
| </div> | |
| </div> | |
| <div class="flex flex-col md:flex-row mb-8"> | |
| <div class="md:w-1/6 flex justify-center mb-4 md:mb-0"> | |
| <div class="bg-blue-600 text-white rounded-full w-12 h-12 flex items-center justify-center font-bold text-xl">2</div> | |
| </div> | |
| <div class="md:w-5/6"> | |
| <h3 class="text-xl font-semibold mb-2">Заключаем договор, фиксируем срок и стоимость</h3> | |
| <p class="text-gray-600">Все условия прописываем в договоре: точную стоимость, сроки выполнения работ, гарантии.</p> | |
| </div> | |
| </div> | |
| <div class="flex flex-col md:flex-row mb-8"> | |
| <div class="md:w-1/6 flex justify-center mb-4 md:mb-0"> | |
| <div class="bg-blue-600 text-white rounded-full w-12 h-12 flex items-center justify-center font-bold text-xl">3</div> | |
| </div> | |
| <div class="md:w-5/6"> | |
| <h3 class="text-xl font-semibold mb-2">Выезжаем на замеры, готовим планировочное решение с планами коммуникаций и расстановки мебели</h3> | |
| <p class="text-gray-600">Наш специалист приезжает к вам, делает точные замеры и разрабатывает детальный план ремонта.</p> | |
| </div> | |
| </div> | |
| <div class="flex flex-col md:flex-row mb-8"> | |
| <div class="md:w-1/6 flex justify-center mb-4 md:mb-0"> | |
| <div class="bg-blue-600 text-white rounded-full w-12 h-12 flex items-center justify-center font-bold text-xl">4</div> | |
| </div> | |
| <div class="md:w-5/6"> | |
| <h3 class="text-xl font-semibold mb-2">Согласовываем планировочное решение и готовим для вас визуализацию с учетом выбранных материалов</h3> | |
| <p class="text-gray-600">Вы получаете 3D-визуализацию будущего интерьера и вносите корректировки при необходимости.</p> | |
| </div> | |
| </div> | |
| <div class="flex flex-col md:flex-row mb-8"> | |
| <div class="md:w-1/6 flex justify-center mb-4 md:mb-0"> | |
| <div class="bg-blue-600 text-white rounded-full w-12 h-12 flex items-center justify-center font-bold text-xl">5</div> | |
| </div> | |
| <div class="md:w-5/6"> | |
| <h3 class="text-xl font-semibold mb-2">После согласования мы закупаем материалы и приступаем к черновым работам на объекте</h3> | |
| <p class="text-gray-600">Все материалы закупаем у проверенных поставщиков с сертификатами качества.</p> | |
| </div> | |
| </div> | |
| <div class="flex flex-col md:flex-row"> | |
| <div class="md:w-1/6 flex justify-center mb-4 md:mb-0"> | |
| <div class="bg-blue-600 text-white rounded-full w-12 h-12 flex items-center justify-center font-bold text-xl">6</div> | |
| </div> | |
| <div class="md:w-5/6"> | |
| <h3 class="text-xl font-semibold mb-2">Через 2 месяца (зависит от метража квартиры) - приглашаем вас на приемку</h3> | |
| <p class="text-gray-600 mb-4">Вы принимаете работу, проверяете качество и получаете гарантию на выполненные работы.</p> | |
| <p class="font-semibold">Оплата: 30% предоплата, 40% после черновых работ, 30% после сдачи объекта.</p> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <button class="bg-blue-600 text-white px-8 py-3 rounded-md hover:bg-blue-700 transition font-semibold"> | |
| Скачать презентацию с примерами работ | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Отзывы клиентов --> | |
| <section id="reviews" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12">ОТЗЫВЫ НАШИХ КЛИЕНТОВ</h2> | |
| <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <div class="review-card bg-gray-50 p-6 rounded-lg shadow-md"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center text-blue-600 font-bold mr-4">АС</div> | |
| <div> | |
| <h4 class="font-semibold">Александр Смирнов</h4> | |
| <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> | |
| </div> | |
| <p class="text-gray-600 mb-4">"Делали ремонт в новостройке в скандинавском стиле. Все сделали в срок, качественно, без нареканий. Особенно порадовало, что не было никаких скрытых платежей - все как в договоре."</p> | |
| <div class="text-sm text-gray-500">Москва, 45 м², июнь 2023</div> | |
| </div> | |
| <div class="review-card bg-gray-50 p-6 rounded-lg shadow-md"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center text-blue-600 font-bold mr-4">ЕК</div> | |
| <div> | |
| <h4 class="font-semibold">Екатерина Ковалева</h4> | |
| <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> | |
| </div> | |
| <p class="text-gray-600 mb-4">"Очень довольна результатом! Ремонт в классическом стиле получился именно таким, как я хотела. Все материалы качественные, бригада работала аккуратно. Рекомендую!"</p> | |
| <div class="text-sm text-gray-500">Москва, 68 м², март 2023</div> | |
| </div> | |
| <div class="review-card bg-gray-50 p-6 rounded-lg shadow-md"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center text-blue-600 font-bold mr-4">ДМ</div> | |
| <div> | |
| <h4 class="font-semibold">Дмитрий Морозов</h4> | |
| <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> | |
| </div> | |
| <p class="text-gray-600 mb-4">"Выбрали лофт стиль для ремонта. Получилось круто! Были небольшие задержки с материалами, но в итоге все сделали качественно. Гарантию дали на 3 года, что очень приятно."</p> | |
| <div class="text-sm text-gray-500">Москва, 85 м², январь 2023</div> | |
| </div> | |
| </div> | |
| <div class="mt-12 text-center"> | |
| <button class="bg-white border-2 border-blue-600 text-blue-600 px-8 py-3 rounded-md hover:bg-blue-50 transition font-semibold"> | |
| Читать все отзывы (87+) | |
| </button> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Параллакс секция --> | |
| <section class="parallax-section py-32 text-white" style="background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('https://images.unsplash.com/photo-1556911220-bff31c812dba?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80')"> | |
| <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> | |
| <form class="max-w-md mx-auto"> | |
| <div class="mb-4"> | |
| <input type="text" placeholder="Ваше имя" class="w-full px-4 py-3 rounded-md bg-white bg-opacity-20 border border-white border-opacity-50 focus:outline-none focus:ring-2 focus:ring-blue-500"> | |
| </div> | |
| <div class="mb-4"> | |
| <input type="tel" placeholder="Телефон" class="w-full px-4 py-3 rounded-md bg-white bg-opacity-20 border border-white border-opacity-50 focus:outline-none focus:ring-2 focus:ring-blue-500"> | |
| </div> | |
| <button type="submit" class="w-full bg-blue-600 text-white py-3 rounded-md hover:bg-blue-700 transition font-semibold"> | |
| Получить расчет | |
| </button> | |
| </form> | |
| </div> | |
| </section> | |
| <!-- Частые вопросы --> | |
| <section id="faq" class="py-16 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12">ЧАСТО ЗАДАВАЕМЫЕ ВОПРОСЫ</h2> | |
| <div class="max-w-3xl mx-auto"> | |
| <div class="mb-4 border-b border-gray-200 pb-4"> | |
| <button class="accordion-btn flex justify-between items-center w-full text-left font-semibold text-lg"> | |
| <span>Какова гарантия на выполненные работы?</span> | |
| <i class="fas fa-chevron-down transition-transform duration-300"></i> | |
| </button> | |
| <div class="accordion-content mt-2 text-gray-600"> | |
| <p>Мы предоставляем гарантию 3 года на все выполненные работы. В течение этого срока бесплатно устраняем любые недостатки, которые могут возникнуть по нашей вине. На электромонтажные работы гарантия 5 лет.</p> | |
| </div> | |
| </div> | |
| <div class="mb-4 border-b border-gray-200 pb-4"> | |
| <button class="accordion-btn flex justify-between items-center w-full text-left font-semibold text-lg"> | |
| <span>Можно ли внести изменения в готовый проект?</span> | |
| <i class="fas fa-chevron-down transition-transform duration-300"></i> | |
| </button> | |
| <div class="accordion-content mt-2 text-gray-600"> | |
| <p>Да, мы можем адаптировать готовый проект под ваши пожелания. Вы можете изменить цветовую гамму, материалы отделки, планировку (если это позволяет конструктив здания). Все изменения согласовываются с дизайнером и инженером.</p> | |
| </div> | |
| </div> | |
| <div class="mb-4 border-b border-gray-200 pb-4"> | |
| <button class="accordion-btn flex justify-between items-center w-full text-left font-semibold text-lg"> | |
| <span>Как происходит оплата?</span> | |
| <i class="fas fa-chevron-down transition-transform duration-300"></i> | |
| </button> | |
| <div class="accordion-content mt-2 text-gray-600"> | |
| <p>Оплата происходит поэтапно: 30% предоплата при заключении договора, 40% после завершения черновых работ, 30% после полного завершения ремонта и подписания акта сдачи-приемки. Возможен индивидуальный график платежей.</p> | |
| </div> | |
| </div> | |
| <div class="mb-4 border-b border-gray-200 pb-4"> | |
| <button class="accordion-btn flex justify-between items-center w-full text-left font-semibold text-lg"> | |
| <span>Кто закупает материалы?</span> | |
| <i class="fas fa-chevron-down transition-transform duration-300"></i> | |
| </button> | |
| <div class="accordion-content mt-2 text-gray-600"> | |
| <p>Мы берем на себя полную ответственность за закупку всех материалов согласно проекту. Это позволяет гарантировать их качество и соответствие заявленным характеристикам. Все материалы поставляются с сертификатами и чеками.</p> | |
| </div> | |
| </div> | |
| <div class="mb-4 border-b border-gray-200 pb-4"> | |
| <button class="accordion-btn flex justify-between items-center w-full text-left font-semibold text-lg"> | |
| <span>Можно ли сделать ремонт быстрее 60 дней?</span> | |
| <i class="fas fa-chevron-down transition-transform duration-300"></i> | |
| </button> | |
| <div class="accordion-content mt-2 text-gray-600"> | |
| <p>Да, для небольших квартир (до 50 м²) возможно выполнение ремонта за 45 дней. Также мы предлагаем услугу "Ускоренный ремонт" с увеличением количества рабочих, но это потребует дополнительной оплаты.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12"> | |
| <button class="bg-blue-600 text-white px-8 py-3 rounded-md hover:bg-blue-700 transition font-semibold"> | |
| Задать свой вопрос | |
| </button> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- О компании --> | |
| <section id="about" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <div class="flex flex-col lg:flex-row items-center"> | |
| <div class="lg:w-1/2 mb-8 lg:mb-0 lg:pr-12"> | |
| <h2 class="text-3xl font-bold mb-6">О КОМПАНИИ</h2> | |
| <p class="text-gray-600 mb-4">Компания "РемонтКвартир" работает на рынке ремонтных услуг с 2018 года. За это время мы выполнили более 1000 ремонтов квартир в Москве и Московской области.</p> | |
| <p class="text-gray-600 mb-4">Наша команда - это профессионалы с опытом работы от 7 лет. Мы постоянно обучаемся новым технологиям и следим за тенденциями в дизайне интерьеров.</p> | |
| <p class="text-gray-600 mb-6">Мы работаем только с проверенными поставщиками материалов, что позволяет гарантировать их качество и долговечность. Все наши объекты застрахованы.</p> | |
| <div class="flex flex-wrap gap-4"> | |
| <div class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full font-medium">Лицензия №123456</div> | |
| <div class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full font-medium">СРО №654321</div> | |
| <div class="bg-blue-100 text-blue-800 px-4 py-2 rounded-full font-medium">Страхование</div> | |
| </div> | |
| </div> | |
| <div class="lg:w-1/2"> | |
| <div class="grid grid-cols-2 gap-4"> | |
| <div class="bg-gray-100 rounded-lg overflow-hidden"> | |
| <img src="https://images.unsplash.com/photo-1582268611958-ebfd161ef9cf?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Наша команда" class="w-full h-full object-cover"> | |
| </div> | |
| <div class="bg-gray-100 rounded-lg overflow-hidden"> | |
| <img src="https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Рабочий процесс" class="w-full h-full object-cover"> | |
| </div> | |
| <div class="bg-gray-100 rounded-lg overflow-hidden"> | |
| <img src="https://images.unsplash.com/photo-1600566753190-17f0baa2a6c3?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Материалы" class="w-full h-full object-cover"> | |
| </div> | |
| <div class="bg-gray-100 rounded-lg overflow-hidden"> | |
| <img src="https://images.unsplash.com/photo-1600607688969-a5bfcd646554?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80" alt="Готовый проект" class="w-full h-full object-cover"> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Контакты --> | |
| <section class="py-16 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12">КОНТАКТЫ</h2> | |
| <div class="grid md:grid-cols-2 gap-8 max-w-4xl mx-auto"> | |
| <div class="bg-white p-6 rounded-lg shadow-md"> | |
| <h3 class="text-xl font-semibold mb-4">Наш офис</h3> | |
| <div class="flex items-start mb-4"> | |
| <i class="fas fa-map-marker-alt text-blue-600 mt-1 mr-3"></i> | |
| <div> | |
| <p class="font-medium">г. Москва, ул. Строителей, 15</p> | |
| <p class="text-gray-600 text-sm">Бизнес-центр "СтройГрад", офис 405</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start mb-4"> | |
| <i class="fas fa-clock text-blue-600 mt-1 mr-3"></i> | |
| <div> | |
| <p class="font-medium">Режим работы:</p> | |
| <p class="text-gray-600 text-sm">Пн-Пт: 9:00-19:00, Сб: 10:00-16:00</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <i class="fas fa-subway text-blue-600 mt-1 mr-3"></i> | |
| <div> | |
| <p class="font-medium">Как добраться:</p> | |
| <p class="text-gray-600 text-sm">5 минут пешком от м. Строгино</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md"> | |
| <h3 class="text-xl font-semibold mb-4">Свяжитесь с нами</h3> | |
| <div class="flex items-center mb-4"> | |
| <i class="fas fa-phone text-blue-600 mr-3"></i> | |
| <a href="tel:+79991234567" class="font-medium hover:text-blue-600 transition">+7 (999) 123-45-67</a> | |
| </div> | |
| <div class="flex items-center mb-4"> | |
| <i class="fas fa-envelope text-blue-600 mr-3"></i> | |
| <a href="mailto:info@remontkvartir.ru" class="font-medium hover:text-blue-600 transition">info@remontkvartir.ru</a> | |
| </div> | |
| <div class="flex items-center mb-6"> | |
| <i class="fas fa-globe text-blue-600 mr-3"></i> | |
| <a href="#" class="font-medium hover:text-blue-600 transition">www.remontkvartir.ru</a> | |
| </div> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="bg-blue-100 text-blue-600 w-10 h-10 rounded-full flex items-center justify-center hover:bg-blue-200 transition"> | |
| <i class="fab fa-telegram"></i> | |
| </a> | |
| <a href="#" class="bg-blue-100 text-blue-600 w-10 h-10 rounded-full flex items-center justify-center hover:bg-blue-200 transition"> | |
| <i class="fab fa-whatsapp"></i> | |
| </a> | |
| <a href="#" class="bg-blue-100 text-blue-600 w-10 h-10 rounded-full flex items-center justify-center hover:bg-blue-200 transition"> | |
| <i class="fab fa-vk"></i> | |
| </a> | |
| <a href="#" class="bg-blue-100 text-blue-600 w-10 h-10 rounded-full flex items-center justify-center hover:bg-blue-200 transition"> | |
| <i class="fab fa-instagram"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-12 bg-white rounded-lg shadow-md overflow-hidden"> | |
| <iframe src="https://yandex.ru/map-widget/v1/?um=constructor%3A8a3a1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1e1 | |
| </html> |