-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy patharticle-3.html
434 lines (426 loc) · 19.8 KB
/
article-3.html
1
<!DOCTYPE html><html lang="ru"> <head> <title>Главная</title> <meta charset="UTF-8"> <meta name="format-detection" content="telephone=no"> <link rel="stylesheet" href="css/style.min.css"> <link rel="shortcut icon" href="favicon.ico"> <!-- <meta name="robots" content="noindex, nofollow"> --> <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> --> <meta name="viewport" content="width=device-width, initial-scale=1.0"></head><body> <div class="wrapper" id="arrow"> <header class="header" id="header"> <div class="header__content _container"> <a href="index.html" class="header__column header__column_l"> <div class="header__logo"> <picture><source srcset="img/logo.webp" type="image/webp"><img src="img/logo.png" alt=""></picture> </div> </a> <nav class="header__menu menu"> <div class="menu__icon icon-menu _custom-active"> <span></span> <span></span> <span></span> </div> <div class="menu__body"> <ul class="menu__list _tabs"> <li> <a href="#" class="menu__link _menu-active" id="revista">REVISTA</a> <span class="menu__arrow"></span> <ul class="menu__sub-list menu__sub-list_small"> <span class="menu__arrow-tienda menu__arrow-tienda-1"></span> <li><a href="revista.html" class="menu__sub-link">ver todo</a></li> <li><a href="#" class="menu__sub-link">MAKE UP</a></li> <li><a href="#" class="menu__sub-link">FASHION</a></li> <li><a href="#" class="menu__sub-link">CUERPO</a></li> <li><a href="#" class="menu__sub-link">PELO</a></li> <li><a href="#" class="menu__sub-link">LIFESTYLE</a></li> </ul> </li> <li class="menu__tienda"> <a href="#" class="menu__link _menu-active" id="tienda">TIENDA</a> <span class="menu__arrow"></span> <ul class="menu__sub-list menu__sub-list_big "> <span class="menu__arrow-tienda menu__arrow-tienda-1"></span> <li><a href="tienda.html" class="menu__sub-link">MAQUILLAJE</a></li> <li><a href="#" class="menu__sub-link _tabs-item link" data-tab="#b-1">SKINCARE</a></li> <li><a href="#" class="menu__sub-link _tabs-item link" data-tab="#b-2">PELO</a></li> <li><a href="#" class="menu__sub-link _tabs-item link" data-tab="#b-3">CUERPO</a></li> <li><a href="#" class="menu__sub-link _tabs-item link" data-tab="#b-4">BUNDLES</a></li> <li><a href="#" class="menu__sub-link _tabs-item link" data-tab="#b-5">PROMOCIONES</a></li> </ul> <ul class="menu__list-tienda _tabs-block" id="b-1"> <span class="menu__arrow-tienda menu__arrow-tienda-2"></span> <li><a href="#" class="menu__link-tienda">ROSTRO</a></li> <li><a href="#" class="menu__link-tienda">OJOS</a></li> <li><a href="#" class="menu__link-tienda">cejas</a></li> <li><a href="#" class="menu__link-tienda">lábios</a></li> <li><a href="#" class="menu__link-tienda">uñas</a></li> <li><a href="#" class="menu__link-tienda">paletas</a></li> <li><a href="#" class="menu__link-tienda">accesorios</a></li> <li><a href="#" class="menu__link-tienda">bundles</a></li> </ul> <ul class="menu__list-tienda _tabs-block _tabs-2" id="b-2"> <span class="menu__arrow-tienda menu__arrow-tienda-2"></span> <li><a href="#" class="menu__link-tienda">ROSTRO</a></li> <li><a href="#" class="menu__link-tienda _tabs-item-2 link" data-tab="#b-11">OJOS</a></li> <li><a href="#" class="menu__link-tienda">cejas</a></li> <li><a href="#" class="menu__link-tienda _tabs-item-2 link" data-tab="#b-12">paletas</a></li> <li><a href="#" class="menu__link-tienda">accesorios</a></li> <li><a href="#" class="menu__link-tienda">bundles</a></li> <ul class="menu__list-tienda _tabs-block-2" id="b-11"> <span class="menu__arrow-tienda menu__arrow-tienda-2"></span> <li><a href="#" class="menu__link-tienda">ROSTRO</a></li> <li><a href="#" class="menu__link-tienda">OJOS</a></li> <li><a href="#" class="menu__link-tienda">bundles</a></li> </ul> <ul class="menu__list-tienda _tabs-block-2" id="b-12"> <span class="menu__arrow-tienda menu__arrow-tienda-2"></span> <li><a href="#" class="menu__link-tienda">cejas</a></li> <li><a href="#" class="menu__link-tienda">lábios</a></li> <li><a href="#" class="menu__link-tienda">uñas</a></li> <li><a href="#" class="menu__link-tienda">bundles</a></li> </ul> </ul> <ul class="menu__list-tienda _tabs-block" id="b-3"> <span class="menu__arrow-tienda menu__arrow-tienda-2"></span> <li><a href="#" class="menu__link-tienda">ROSTRO</a></li> <li><a href="#" class="menu__link-tienda">OJOS</a></li> <li><a href="#" class="menu__link-tienda">paletas</a></li> <li><a href="#" class="menu__link-tienda">accesorios</a></li> <li><a href="#" class="menu__link-tienda">bundles</a></li> </ul> <ul class="menu__list-tienda _tabs-block" id="b-4"> <span class="menu__arrow-tienda menu__arrow-tienda-2"></span> <li><a href="#" class="menu__link-tienda">cejas</a></li> <li><a href="#" class="menu__link-tienda">lábios</a></li> <li><a href="#" class="menu__link-tienda">uñas</a></li> <li><a href="#" class="menu__link-tienda">bundles</a></li> </ul> <ul class="menu__list-tienda _tabs-block" id="b-5"> <span class="menu__arrow-tienda menu__arrow-tienda-2"></span> <li><a href="#" class="menu__link-tienda">ROSTRO</a></li> <li><a href="#" class="menu__link-tienda">OJOS</a></li> <li><a href="#" class="menu__link-tienda">cejas</a></li> <li><a href="#" class="menu__link-tienda">lábios</a></li> <li><a href="#" class="menu__link-tienda">uñas</a></li> <li><a href="#" class="menu__link-tienda">paletas</a></li> <li><a href="#" class="menu__link-tienda">accesorios</a></li> <li><a href="#" class="menu__link-tienda">bundles</a></li> </ul> </li> <li><a href="tienda-2.html" class="menu__link">PROMOCIONES</a></li> </ul> </div> </nav> <div class="header__column header__column_r"> <div class="header__custom custom"> <ul class="custom__list"> <li class="custom__link_name"> <a href="#" class="custom__link custom__link_name"> MARIA </a> </li> <li class="custom__link_icon"> <a href="index.html" class="custom__link custom__link_icon"> <picture><source srcset="img/header/icon.webp" type="image/webp"><img src="img/header/icon.png" alt=""></picture> </a> </li> <li class="custom__link_user _custom-active"> <a href="#" class="custom__link custom__link_user"> <picture><source srcset="img/header/user.webp" type="image/webp"><img src="img/header/user.png" alt=""></picture> </a> <span class="custom__arrow"></span> <ul class="custom__sub-list custom__sub-list_name"> <li class="custom__sub-link">MIS ARTículos <br> guardados</li> <li class="custom__sub-link">MIS FAVORITOS</li> <li class="custom__sub-link">MIS DATOS</li> <li class="custom__sub-link">LOG OUT</li> </ul> </li> <li class="custom__link_shop"> <a href="#" class="custom__link custom__link_shop"> <picture><source srcset="img/header/shop.webp" type="image/webp"><img src="img/header/shop.png" alt=""></picture> </a> <span class="custom__arrow"></span> <ul class="custom__sub-list custom__sub-list_shop"> <li class="custom__sub-link"></li> </ul> </li> <li class="custom__link_search _custom-active"> <a href="#" class="custom__link custom__link_search"> <picture><source srcset="img/header/search.webp" type="image/webp"><img src="img/header/search.png" alt=""></picture> </a> <span class="custom__arrow"></span> <ul class="custom__sub-list custom__sub-list_search"> <li class="custom__search">search</li> <button class="custom__btn">buscar</button> </ul> </li> </ul> </div> </div> </div></header> <div class="bg"></div> <main class="page"> <nav class="breadcrumbs breadcrumbs_p _container" id="breadcrumbs"> <ul class="breadcrumbs__list"> <li><a href="#" class="breadcrumbs__link">INICIO</a></li> <li><a href="#" class="breadcrumbs__link">REVISTA</a></li> <li><a href="#" class="breadcrumbs__link">CUEPRO</a></li> <li><span class="breadcrumbs__item">LOREM IMPSUN</span></li> </ul> </nav> <section class="main-screen" id="main"> <div class="main-screen__container"> <div class="main-screen__wrapper"> <div class="main-screen__slide"> <div class="main-screen__slider main-screen__slider_height-2"> <div class="main-screen__ibg _ibg"> <picture><source srcset="img/article/bg-3.webp" type="image/webp"><img src="img/article/bg-3.jpg" alt=""></picture> </div> <div class="main-screen__content main-screen__content_w _container"> <h1 class="main-screen__title">LOREM IPSUM</h1> </div> <div class="main-screen__definition"> <time class="main-screen__definition-date" datetime="2021-02-12">12/02</time> <div class="main-screen__definition-item"> <div class="main-screen__definition-min">2 min</div> <a href="#" class="main-screen__definition-link"> <picture><source srcset="img/product/bookmark.webp" type="image/webp"><img src="img/product/bookmark.png" alt=""></picture> </a> </div> </div> </div> </div> </div> </div> </section> <section class="descriptin descriptin_ap"> <div class="descriptin__content descriptin__content_w _container"> <h3 class="descriptin__title title">LOREM IPSUM SERUM VAGNUM</h3> <div class="descriptin__text descriptin__text_w"> <p> La aromaterapia actúa sobre nuestro sentido del olfato y mediante la absorción al torrente sanguíneo. Aproximadamente el 15 por ciento del aire que inhalamos se dirige al techo de la nariz, donde los receptores olfatorios transportan los olores directamente a una parte del cerebro llamada sistema límbico. </p> <p> Este área está conectada con el instinto, el humor y la emoción y se cree que la aromaterapia puede estimular la liberación de sustancias químicas que juegan un papel en la liberación de emociones (piensa como incluso el simple olor a cera de suelo puede hacerte volver rápidamente a la época de las aulas). </p> <p> Este área está conectada con el instinto, el humor y la emoción y se cree que la aromaterapia puede estimular la liberación de sustancias químicas que juegan un papel en la liberación de emociones (piensa como incluso el simple olor a cera de suelo puede hacerte volver rápidamente a la época de las aulas). </p> </div> </div> </section> <section class="banner banner_content"> <div class="banner__ibg _ibg"> <picture><source srcset="img/article/04.webp" type="image/webp"><img src="img/article/04.jpg" alt=""></picture> </div> <div class="banner__content _container"> <div class="banner__card shadowBig"> <div class="banner__bodys"> <div class="banner__rating simple-rating"> <div class="simple-rating__items"> <input id="simple-rating_14" type="radio" class="simple-rating__item" name="simple-rating-10" value="5"> <label for="simple-rating_14" class="simple-rating__label"></label> <input id="simple-rating_13" type="radio" class="simple-rating__item" name="simple-rating-10" value="4" checked> <label for="simple-rating_13" class="simple-rating__label"></label> <input id="simple-rating_12" type="radio" class="simple-rating__item" name="simple-rating-10" value="3"> <label for="simple-rating_12" class="simple-rating__label"></label> <input id="simple-rating_11" type="radio" class="simple-rating__item" name="simple-rating-10" value="2"> <label for="simple-rating_11" class="simple-rating__label"></label> <input id="simple-rating_10" type="radio" class="simple-rating__item" name="simple-rating-10" value="1"> <label for="simple-rating_10" class="simple-rating__label"></label> </div> </div> <span class="banner__name">THE BODY SHOP</span> </div> <h3 class="banner__title title-big">Champú Anticaspa de Jengibre</h3> <span class="banner__cost">7€</span> <div class="banner__text">Champú anticaspa para cueros cabelludos secos y con descamación</div> <div class="banner__btn btn btn_ btnHover">AÑADIR A LA CESTA</div> </div> </div> </section> <section class="descriptin descriptin_ap"> <div class="descriptin__content descriptin__content_w _container"> <h3 class="descriptin__title title">LOREM IPSUM SERUM VAGNUM</h3> <div class="descriptin__text descriptin__text_w"> <p> La aromaterapia actúa sobre nuestro sentido del olfato y mediante la absorción al torrente sanguíneo. Aproximadamente el 15 por ciento del aire que inhalamos se dirige al techo de la nariz, donde los receptores olfatorios transportan los olores directamente a una parte del cerebro llamada sistema límbico. </p> <p> Este área está conectada con el instinto, el humor y la emoción y se cree que la aromaterapia puede estimular la liberación de sustancias químicas que juegan un papel en la liberación de emociones (piensa como incluso el simple olor a cera de suelo puede hacerte volver rápidamente a la época de las aulas). </p> </div> </div> </section> <section class="bookmarks bookmarks_mb"> <h2 class="bookmarks__title title-big">artículos PARECIDOS</h2> <div class="bookmarks__content _container"> <article class="bookmarks__card card"> <div class="card__image card__image_1 shadowDown"> <picture><source srcset="img/product/01.webp" type="image/webp"><img src="img/product/01.jpg" alt=""></picture> </div> <div class="card__items"> <a href="#" class="card__icon"> <picture><source srcset="img/product/bookmark.webp" type="image/webp"><img src="img/product/bookmark.png" alt=""></picture> </a> <div class="card__item"> <div class="card__bodys"> <a href="#" class="card__body lineAnim">CUERPO</a> <div class="card__back"> <div class="card__min">2 min</div> <a href="#" class="card__iconsm"> <picture><source srcset="img/product/bookmark.webp" type="image/webp"><img src="img/product/bookmark.png" alt=""></picture> </a> </div> </div> <a href="#" class="card__title card__title_w lineAnim">MAKE UP: Lábios perfectos</a> <p class="card__text">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque</p> </div> </div> </article> <article class="bookmarks__card card"> <div class="card__image shadowDown"> <picture><source srcset="img/product/02.webp" type="image/webp"><img src="img/product/02.jpg" alt=""></picture> </div> <div class="card__items"> <a href="#" class="card__icon"> <picture><source srcset="img/product/bookmark.webp" type="image/webp"><img src="img/product/bookmark.png" alt=""></picture> </a> <div class="card__item"> <div class="card__bodys"> <a href="#" class="card__body lineAnim">CUERPO</a> <div class="card__back"> <div class="card__min">2 min</div> <a href="#" class="card__iconsm"> <picture><source srcset="img/product/bookmark.webp" type="image/webp"><img src="img/product/bookmark.png" alt=""></picture> </a> </div> </div> <a href="#" class="card__title lineAnim">TENDENCIAS DE MODA EN 2021 (LOREM IPSUM)</a> <p class="card__text">Sed ut perspiciatis unde omnis iste natus error sit voluptatem</p> </div> </div> </article> </div> </section> </main> <footer class="footer"> <div class="footer__content _container"> <div class="footer__subscribe"> <h2 class="footer__title">SUSCRÍBETE A NUESTRO NEWS LETTER</h2> <div class="footer__form form"> <form action="#" id="form" class="form__body" data-message='Данные успешно отправлены'> <input type="email" class="footer__input _req _email" data-value="example@mail.com"> <br> <button type="submit" class="footer__btn" id="btn">SUSCRIBIRME</button> </form> </div> </div> <div class="footer__row"> <div class="footer__content-2"> <div class="footer__column"> <h3 class="footer__subtitle">Términos y privacidad</h3> <ul class="footer__list"> <li><a href="#" class="footer__link">Política de privacidad</a></li> <li><a href="#" class="footer__link">Términos y Condiciones</a></li> <li><a href="#" class="footer__link">Anuncios basados en <br> intereses</a></li> <li><a href="#" class="footer__link">Accesibilidad</a></li> <li><a href="#" class="footer__link">cookies</a></li> </ul> </div> <div class="footer__column"> <h3 class="footer__subtitle">Atención al cliente</h3> <ul class="footer__list"> <li><a href="#" class="footer__link">Devoluciones / Cambios</a></li> <li><a href="#" class="footer__link">¿Dónde está mi pedido?</a></li> <li><a href="#" class="footer__link">Preguntas frecuentes</a></li> <li><a href="#" class="footer__link">Información de envío</a></li> <li><a href="#" class="footer__link">Pago posterior</a></li> <li><a href="#" class="footer__link">Más</a></li> </ul> </div> <div class="footer__column"> <h3 class="footer__subtitle">Sobre touché.love</h3> <ul class="footer__list"> <li><a href="#" class="footer__link">nosotros</a></li> <li><a href="#" class="footer__link">EMPLEO</a></li> <li><a href="#" class="footer__link">Información <br> corporativa</a></li> </ul> </div> </div> <div class="footer__footer"> <div class="footer__icons"> <a href="#" class="footer__icon footer__icon_1"> <picture><source srcset="img/footer/01.webp" type="image/webp"><img src="img/footer/01.png" alt=""></picture> </a> <a href="#" class="footer__icon footer__icon_2"> <picture><source srcset="img/footer/02.webp" type="image/webp"><img src="img/footer/02.png" alt=""></picture> </a> <a href="#" class="footer__icon footer__icon_3"> <picture><source srcset="img/footer/03.webp" type="image/webp"><img src="img/footer/03.png" alt=""></picture> </a> </div> <p class="footer__ps">touché.love 2021</p> </div> </div> </div></footer> <a href="#arrow" class="arrow"><picture><source srcset="img/icons/arrow-up.webp" type="image/webp"><img src="img/icons/arrow-up.png" alt=""></picture> </div> <div class="popup popup-entry" id="popup-entry"> <div class="popup__content"> <div class="popup__body"> <div class="popup__close"></div> <div class="popup__form"></div> <p></p> </div> </div></div><div class="popup popup-login" id="popup-login"> <div class="popup__content"> <div class="popup__body"> <div class="popup__close"></div> <div class="popup__form-login"></div> </div> </div></div><!-- <div class="popup popup_video"> <div class="popup__content"> <div class="popup__body"> <div class="popup__close popup__close_video"></div> <div class="popup__video _video"></div> </div> </div></div> --> <!-- <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> --><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/jquery.marquee/1.4.0/jquery.marquee.min.js"></script><script src="js/vendors.min.js"></script><script src="js/app.min.js"></script></body></html>