Edit file File name : post-launch.html Content :<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Post Launch page</title> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;500;600&display=swap" rel="stylesheet"> <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> <link rel="stylesheet" href="style.css"> </head> <body> <a href="#" class="header-link"> <div class="header-link__container container"> Need multi-craft technicians? <img src="./assets/img/icons/arrow.svg" alt="img"> </div> </a> <header class="header"> <div class="header__fader header__fader--for-desk"></div> <div class="header__wrapper"> <div class="header__container container"> <div class="header__logo"> <a href="#"> <img src="./assets/img/logo.svg" alt="img"> </a> </div> <div class="header__fader js-menu-close"></div> <div class="header__nav"> <div class="header__close js-menu-close"> <button></button> </div> <ul class="header__menu"> <li class="header__item"> <a href="#">Solutions</a> <div class="header__submenu header__submenu--large"> <div class="header__left"> <h6>by need</h6> <div class="header__lists"> <ul> <li class="header__subitem header__subitem--main"> <a href="#"> <span>Industrial Maintenance <img src="./assets/img/icons/arrow-red.svg" alt="img"></span> Lorem ipsum dolor sit amet, consectetur adipiscing elit </a> </li> <li class="header__subitem"> <a href="#">Comprehensive Program </a> </li> <li class="header__subitem"> <a href="#">Workforce Program</a> </li> <li class="header__subitem"> <a href="#">Short-Term Support & Projects </a> </li> <li class="header__subitem header__subitem--red"> <a href="#">Get Support </a> </li> </ul> <ul> <li class="header__subitem header__subitem--main"> <a href="#"> <span>Industrial Technology<img src="./assets/img/icons/arrow-red.svg" alt="img"></span> Lorem ipsum dolor sit amet, consectetur adipiscing elit </a> </li> <li class="header__subitem"> <a href="#">Sensor Technology</a> </li> <li class="header__subitem"> <a href="#">Remote Monitoring & Analytics</a> </li> <li class="header__subitem header__subitem--red"> <a href="#">Get a Demo</a> </li> </ul> <ul> <li class="header__subitem header__subitem--main"> <a href="#"> <span>Industrial Parts <img src="./assets/img/icons/arrow-red.svg" alt="img"></span> Lorem ipsum dolor sit amet, consectetur adipiscing elit </a> </li> <li class="header__subitem"> <a href="#">Storeroom Management </a> </li> <li class="header__subitem"> <a href="#">Repairable Parts Management</a> </li> <li class="header__subitem"> <a href="#">Part Repair, Surplus & New </a> </li> <li class="header__subitem header__subitem--red"> <a href="#">Go to Industrial Store </a> </li> </ul> </div> </div> <div class="header__right"> <h6>by EXPERTISE</h6> <div class="header__lists"> <ul> <li class="header__subitem"> <a href="#">Predictive Maintenance </a> </li> <li class="header__subitem"> <a href="#">Preventive Maintenance</a> </li> <li class="header__subitem"> <a href="#">Technical Training</a> </li> <li class="header__subitem"> <a href="#">Maintenance Advisory</a> </li> <li class="header__subitem"> <a href="#">Machine Health Assessment</a> </li> <li class="header__subitem"> <a href="#">Calibration</a> </li> <li class="header__subitem"> <a href="#">Lubrication</a> </li> <li class="header__subitem"> <a href="#">Procurement & Supply Chain </a> </li> <li class="header__subitem"> <a href="#">Heat Treat</a> </li> <li class="header__subitem"> <a href="#">Crane & Hoist</a> </li> <li class="header__subitem"> <a href="#">Tool & Die</a> </li> </ul> </div> </div> </div> </li> <li class="header__item"> <a href="#">For Manufacturers</a> <div class="header__submenu"> <div class="header__left"> <h6>PROCESS & DISCRETE</h6> <div class="header__lists"> <ul> <li class="header__subitem"> <a href="#">Aerospace </a> </li> <li class="header__subitem"> <a href="#">Automotive </a> </li> <li class="header__subitem"> <a href="#">Building Products </a> </li> <li class="header__subitem"> <a href="#">Consumer Packaged Goods </a> </li> <li class="header__subitem"> <a href="#">Heavy Equipment </a> </li> <li class="header__subitem"> <a href="#">Paper & Pulp</a> </li> <li class="header__subitem"> <a href="#">Power Distribution </a> </li> <li class="header__subitem"> <a href="#">Tire & Rubber </a> </li> </ul> </div> </div> <div class="header__right"> <h6>DEPARTMENT & ROLE</h6> <div class="header__lists"> <ul> <li class="header__subitem"> <a href="#">Continuous Improvement</a> </li> <li class="header__subitem"> <a href="#">Engineering </a> </li> <li class="header__subitem"> <a href="#">Human Resources </a> </li> <li class="header__subitem"> <a href="#">Maintenance </a> </li> <li class="header__subitem"> <a href="#">Operations </a> </li> <li class="header__subitem"> <a href="#">Procurement & Supply Chain </a> </li> </ul> </div> </div> </div> </li> <li class="header__item"> <a href="#">Why ATS</a> <div class="header__submenu"> <div class="header__left"> <div class="header__lists"> <ul> <li class="header__subitem"> <a href="#">Safety Excellence </a> </li> <li class="header__subitem"> <a href="#">Skilled Technical Talent</a> </li> <li class="header__subitem"> <a href="#">Work Execution Management</a> </li> <li class="header__subitem"> <a href="#">Industry 4.0 Technologies</a> </li> <li class="header__subitem header__subitem--red"> <a href="#">Request Maintenance Assessment</a> </li> </ul> </div> </div> </div> </li> <li class="header__item"> <a href="#">Resources</a> <div class="header__submenu"> <div class="header__left"> <div class="header__lists"> <ul> <li class="header__subitem"> <a href="#">Customer Success </a> </li> <li class="header__subitem"> <a href="#">Trending Topics </a> </li> <li class="header__subitem"> <a href="#">Research & Thought Leadership </a> </li> <li class="header__subitem"> <a href="#">Solutions & Services </a> </li> <li class="header__subitem"> <a href="#">Industry Focused </a> </li> <li class="header__subitem header__subitem--red"> <a href="#">View All Resources</a> </li> </ul> </div> </div> </div> </li> <li class="header__item"> <a href="#">About</a> <div class="header__submenu"> <div class="header__left"> <div class="header__lists"> <ul> <li class="header__subitem"> <a href="#">Who We Are </a> </li> <li class="header__subitem"> <a href="#">Our Culture </a> </li> <li class="header__subitem"> <a href="#">Leadership </a> </li> <li class="header__subitem"> <a href="#">Careers </a> </li> <li class="header__subitem"> <a href="#">News & Press </a> </li> <li class="header__subitem header__subitem--red"> <a href="#">Let’s Talk</a> </li> </ul> </div> </div> </div> </li> </ul> <div class="header__references"> <div class="header__tel"> <a href="#"> <span>Let’s Talk</span> 866.315.8952 </a> </div> <div class="header__search"> <form action="#"> <div class="header__input"> <input id="input" type="text"> <div class="header__search-close"></div> </div> <div class="header__search-open"> <img src="./assets/img/icons/search.svg" alt="img"> </div> </form> </div> </div> </div> <div class="header__burger js-menu-toggle"> <span></span> <span></span> <span></span> </div> </div> </div> <div class="header__progress-container container"> <div class="header__progress-bar" id="myBar"></div> </div> </header> <main> <section class="post-section"> <div class="post-section__container container"> <div class="post-section__title" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="post-section__title-content"> <span>Solutions & Services</span> <h1>ATS Puts Luxury Automaker’s Assembly Plant on the Road to Greater Productivity With 22% Downtime Reduction</h1> <ul class="breadcrumbs"> <li><a href="#">X min read</a></li> <li><a href="#">Brochure</a></li> <li><a href="#">Solution Lorem</a></li> <li>Industry Lorem</li> </ul> </div> <div class="post-section__title-btn"> <a href="#" class="btn tn--left-top">Download Now</a> </div> </div> <div class="post-section__img" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <img src="./assets/img/post/launch.jpg" alt="img"> </div> <div class="post-section__contact" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="post-section__contactWrapp"> <div class="container"> <div class="post-section__social"> <span>Share</span> <ul> <li><a href="#"><img src="./assets/img/social/facebook.svg" alt="img"></a></li> <li><a href="#"><img src="./assets/img/social/twitter.svg" alt="img"></a></li> <li><a href="#"><img src="./assets/img/social/linkedin.svg" alt="img"></a></li> <li><a href="#"><img src="./assets/img/social/email.svg" alt="img"></a></li> </ul> </div> <div class="post-section__form"> <form action="#"> <input type="email" placeholder="Enter email address"> <button class="btn btn--dark">Subscribe</button> </form> </div> </div> </div> </div> <div class="post-section__text common-text" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <p>Manufacturers constantly face challenges such as unplanned downtime, the skilled trades gap, implementing technology and more. Read this brochure to learn about our comprehensive maintenance solution, a holistic, data-driven approach to maintenance.</p> <a href="#" class="category category--grey"> <div class="category__content"> <div class="category__text"> <h6>Next Post</h6> <p> Lorem Ipsum Dolor Sit Amet Consectetur Adipsining Elit ut </p> <p> Aliquas Purus sit Amet Luctus Venenatis </p> </div> <div class="category__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </div> </a> </div> </div> </section> <section class="text-with-categories "> <div class="text-with-categories__container container"> <div class="text-with-btn" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="text-with-btn__text"> <h2>Resources</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet luctus venenatis, lectus magna fringilla urna, porttitor</p> </div> <div class="text-with-btn__btn"> <a href="#" class="btn">View All Resources</a> </div> </div> <div class="text-with-categories__wrapper"> <a href="#" class="category" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="category__img"> <img src="./assets/img/categories/img2.jpg" alt="img"> </div> <div class="category__content"> <div class="category__text"> <h6>Type lorem</h6> <p> Lorem Ipsum Dolor Sit Amet Consectetur Adipsining Elit ut Aliquas Purus sit Amet Luctus Venenatis </p> <div class="category__type"> X min read | Topic Lorem </div> </div> <div class="category__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </div> </a> <div class="text-with-categories__grid"> <a href="#" class=" category" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="category__content"> <div class="category__text"> <h6>Type lorem</h6> <p> Lorem Ipsum Dolor Sit Amet Consectetur Adipsining Elit ut Aliquas Purus sit Amet Luctus Venenatis </p> <div class="category__type"> X min read | Topic Lorem </div> </div> <div class="category__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </div> </a> <a href="#" class=" category" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="category__content"> <div class="category__text"> <h6>Type lorem</h6> <p> Lorem Ipsum Dolor Sit Amet Consectetur Adipsining Elit ut Aliquas Purus sit Amet Luctus Venenatis </p> <div class="category__type"> X min read | Topic Lorem </div> </div> <div class="category__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </div> </a> </div> </div> </div> </section> <section class="form change-width" style="--width: 0%"> <div class="form__container container"> <div class="form__wrapper" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h2>Let’s Talk</h2> <div class="form__form"> <form action="#"> <div class="field"> <input type="text" placeholder="First Name*"> </div> <div class="field"> <input type="text" placeholder="Last Name*"> </div> <div class="field"> <input type="text" placeholder="Company*"> </div> <div class="field"> <input type="tel" placeholder="Phone*"> </div> <div class="field"> <input type="email" placeholder="Email*"> </div> <div class="field field--two-column"> <textarea placeholder="Message" rows="1"></textarea> </div> <div class="field"> <button class="btn">Submit</button> </div> </form> </div> </div> </div> </section> </main> <footer class="footer"> <div class="footer__container container"> <div class="footer__references" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h6>solutions by need</h6> <a href="#" class="reference reference--white" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="reference__title"> <h4>Industrial Maintenance </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference reference--white" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="reference__title"> <h4>Industrial Technology </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference reference--white" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="reference__title"> <h4>Industrial Parts </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <div class="footer__box" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="footer__logo"> <a href="#"> <img src="./assets/img/footer-logo.svg" alt="img"> </a> </div> <a href="#"> For Maintenance & Parts Inquiries <span>888.859.3080</span> </a> <a href="#"> For Careers, HR or Corporate Inquiries <span>866.315.8952</span> </a> <ul class="footer__social"> <li> <a href="#"> <img src="./assets/img/social/linkedin.svg" alt="img"> </a> </li> <li> <a href="#"> <img src="./assets/img/social/youtube.svg" alt="img"> </a> </li> <li> <a href="#"> <img src="./assets/img/social/facebook.svg" alt="img"> </a> </li> <li> <a href="#"> <img src="./assets/img/social/twitter.svg" alt="img"> </a> </li> <li> <a href="#"> <img src="./assets/img/social/instagram.svg" alt="img"> </a> </li> </ul> <div class="footer__copyright"> ©2022 Advanced Technology Services, Inc. <a href="#">Privacy Policy</a> | <a href="#">Sitemap</a> | <a href="#">Terms & Conditions</a> </div> </div> </div> <div class="footer__lists"> <div class="footer__list" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h6>solutions by Expertise</h6> <ul> <li> <a href="#">Predictive Maintenance</a> </li> <li> <a href="#">Preventive Maintenance</a> </li> <li> <a href="#">Technical Training</a> </li> <li> <a href="#">Maintenance Advisory</a> </li> <li> <a href="#">Machine Health Assessment</a> </li> <li> <a href="#">Calibration</a> </li> <li> <a href="#">Lubrication</a> </li> <li> <a href="#">Procurement & Supply Chain </a> </li> <li> <a href="#">Heat Treat</a> </li> <li> <a href="#">Crane & Hoist</a> </li> <li> <a href="#">Tool & Die </a> </li> </ul> </div> <div class="footer__list" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h6>WHY ATS</h6> <ul> <li> <a href="#">Safety Excellence</a> </li> <li> <a href="#">Skilled Technical Talent</a> </li> <li> <a href="#">Work Execution Management</a> </li> <li> <a href="#">Industry 4.0 Technologies</a> </li> <li> <a href="#">Request Maintenance Assessment</a> </li> </ul> </div> <div class="footer__list" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h6>PROCESS & DISCRETE</h6> <ul> <li> <a href="#">Aerospace </a> </li> <li> <a href="#">Automotive </a> </li> <li> <a href="#">Building Products </a> </li> <li> <a href="#">Consumer Packaged Goods </a> </li> <li> <a href="#">Heavy Equipment </a> </li> <li> <a href="#">Paper & Pulp </a> </li> <li> <a href="#">Power Distribution </a> </li> <li> <a href="#">Tire & Rubber </a> </li> </ul> </div> <div class="footer__list" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h6>resources</h6> <ul> <li> <a href="#">Customer Success </a> </li> <li> <a href="#">Trending Topics </a> </li> <li> <a href="#">Research & Thought Leadership </a> </li> <li> <a href="#">Solutions & Services </a> </li> <li> <a href="#">Industry Focused </a> </li> <li> <a href="#">View All Resources</a> </li> </ul> </div> <div class="footer__list" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h6>DEPARTMENT & ROLE</h6> <ul> <li> <a href="#">Continuous Improvement</a> </li> <li> <a href="#">Engineering </a> </li> <li> <a href="#">Human Resources </a> </li> <li> <a href="#">Maintenance </a> </li> <li> <a href="#">Operations </a> </li> <li> <a href="#">Procurement & Supply Chain </a> </li> </ul> </div> <div class="footer__list" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h6>ABOUT</h6> <ul> <li> <a href="#">Who We Are </a> </li> <li> <a href="#">Our Culture </a> </li> <li> <a href="#">Leadership </a> </li> <li> <a href="#">Careers </a> </li> <li> <a href="#">News & Press </a> </li> <li> <a href="#">Let’s Talk </a> </li> </ul> </div> </div> </div> </footer> <div id="modal-window" class="modal-window"> <div class="modal-window__fader"></div> <div id="modal-video" class="modal-window__item modal-window__video modal-video-item"> <button aria-label="close modal window" class="modal-video-item__close modal-window__close-icon"> </button> <div class="modal-video-item__wr-iframe"> <iframe src="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div> </div> </div> <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> <script src="js/main.js"></script> </body> </html>Save