Edit file File name : solution.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>Home 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="banner banner--before-right"> <div class="banner__img" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <img src="./assets/img/hero/solution.jpg" alt="img"> </div> <div class="banner__wrapper width-back" style="--width: 0px"> <div class="container"> <div class="banner__box" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="banner__text"> <span>Sub solutions only</span> <h1>Industrial Technology</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet luctus venenatis, lectus magna fringill. </p> </div> <div class="banner__btn"> <a href="#" class="btn">Learn More</a> </div> </div> </div> </div> </section> <section class="grid-cards"> <div class="grid-cards__container container"> <div class="grid-cards__grid"> <div class="grid-cards__item" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="grid-cards__icon"> <img src="./assets/img/icons/card.svg" alt="img"> </div> <h4>Lorem Ipsum</h4> <p> Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod </p> </div> <div class="grid-cards__item" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="grid-cards__icon"> <img src="./assets/img/icons/card.svg" alt="img"> </div> <h4>Lorem Ipsum</h4> <p> Lorem ipsum dolor sit amet consectetur adipiscing elit sed do <a href="#">eiusmod</a> </p> </div> <div class="grid-cards__item" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="grid-cards__icon"> <img src="./assets/img/icons/card.svg" alt="img"> </div> <h4>Lorem Ipsum</h4> <p> Lorem ipsum dolor sit amet consectetur adipiscing <a href="#">elit sed do eiusmod</a> </p> </div> <div class="grid-cards__item" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="grid-cards__icon"> <img src="./assets/img/icons/card.svg" alt="img"> </div> <h4>Lorem Ipsum</h4> <p> Lorem ipsum dolor sit amet consectetur adipiscing <a href="#">elit sed do eiusmod</a> </p> </div> <div class="grid-cards__item" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="grid-cards__icon"> <img src="./assets/img/icons/card.svg" alt="img"> </div> <h4>Lorem Ipsum</h4> <p> Lorem ipsum dolor sit amet consectetur adipiscing elit sed <a href="#"> do eiusmod</a> </p> </div> <div class="grid-cards__item" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="grid-cards__icon"> <img src="./assets/img/icons/card.svg" alt="img"> </div> <h4>Lorem Ipsum</h4> <p> Lorem ipsum dolor sit amet consectetur adipiscing elit sed do <a href="#">eiusmod</a> </p> </div> </div> </div> </section> <section class="text-section text-section--before change-width" style="--width: 0%"> <div class="text-section__container container"> <div class="text-section__text" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h2>Lorem ipsum dolore set </h2> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet luctus venenatis, lectus magna fringilla urna, porttitor rhoncus dolor purus non enim praesent elementum facilisis leo, vel fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis enim lobortis scelerisque. </p> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet luctus venenatis, lectus magna fringilla urna, porttitor rhoncus dolor purus non enim praesent elementum facilisis leo, vel fringilla est ullamcorper eget nulla facilisi etiam dignissim diam. </p> </div> </div> </section> <section class="text-and-img-tobord" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="text-and-img-tobord__img"> <img src="./assets/img/text-and-img-tobord/img1.jpg" alt="img"> </div> <div class="text-and-img-tobord__container container"> <div class="text-and-img-tobord__content"> <h2>Solution/feature lorem </h2> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet luctus venenatis, lectus magna fringilla urna, porttitor rhoncus. </p> <ul> <li class="list-item list-item--flex"> <div class="list-item__icon"> <img src="./assets/img/icons/tick.svg" alt="img"> </div> Lorem ipsum dolore set </li> <li class="list-item list-item--flex"> <div class="list-item__icon"> <img src="./assets/img/icons/tick.svg" alt="img"> </div> Lorem ipsum dolore set </li> </ul> <a href="#" class="btn">Learn More</a> </div> </div> </section> <section class="text-and-img-tobord text-and-img-tobord--reversed" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="text-and-img-tobord__img"> <img src="./assets/img/text-and-img-tobord/img2.jpg" alt="img"> </div> <div class="text-and-img-tobord__container container"> <div class="text-and-img-tobord__content"> <h2>Solution/feature lorem </h2> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet luctus venenatis, lectus magna fringilla urna, porttitor rhoncus dolor purus. </p> <p> Vel fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis enim lobortis scelerisque fermentum dui faucibus in ornare quam viverra. </p> <a href="#" class="btn">Learn More</a> </div> </div> </section> <section class="flex-text"> <div class="flex-text__container container"> <div class="flex-text__text-and-video" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h2>Key callout lorem ipsum </h2> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet luctus venenatis, lectus magna fringilla urna, porttitor </p> <a href="#" data-video-src="https://www.youtube.com/embed/sjkrrmBnpGE" class="play">Play video lorem<img src="./assets/img/icons/play.svg" alt="img"></a> </div> <ul class="flex-text__list"> <li class="list-item list-item--flex" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="list-item__icon"> <img src="./assets/img/icons/tick.svg" alt="img"> </div> Lorem ipsum dolore set </li> <li class="list-item list-item--flex" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="list-item__icon"> <img src="./assets/img/icons/tick.svg" alt="img"> </div> Lorem ipsum dolore set </li> <li class="list-item list-item--flex" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="list-item__icon"> <img src="./assets/img/icons/tick.svg" alt="img"> </div> Lorem ipsum dolore set </li> </ul> </div> </section> <a href="#" class="cta change-width" style="--width: 0%"> <div class="cta__container container" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="cta__wrapper"> <div class="cta__text"> <h2>Lorem ipsum dolor sit amet</h2> </div> <div class="cta__btn"> <span class="btn btn--dark">Optional Lorem</span> </div> </div> </div> </a> <section class="text-with-categories text-with-categories--with-logos"> <div class="text-with-categories__container container"> <div class="logos logos--without-padding"> <div class="logos__flex" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="logos__item"> <img src="./assets/img/logos/logo7.png" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/logo2.png" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/logo8.png" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/logo1.png" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/logo9.png" alt="img"> </div> <div class="logos__item"> <img src="./assets/img/logos/logo5.png" alt="img"> </div> </div> </div> <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> <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/img3.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> </div> </section> <section class="tabs-with-component"> <div class="tabs-with-component__container container"> <div class="tabs-with-component__tabsWrapper"> <div class="tabs-with-component__title" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <h2>For manufacturers</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> <div class="tabs"> <div class="tabs__pictures"> <div class="tabs__content tabs__content--active tab1"> <div class="tabs__flex" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="tabs__img"> <img src="./assets/img/slick/slide1.jpg" alt="img"> </div> <div class="tabs__img"> <img src="./assets/img/slick/slide2.jpg" alt="img"> </div> <div class="tabs__img"> <img src="./assets/img/slick/slide3.jpg" alt="img"> </div> </div> </div> <div class="tabs__content tab2"> <div class="tabs__flex"> <div class="tabs__img"> <img src="./assets/img/slick/slide1.jpg" alt="img"> </div> <div class="tabs__img"> <img src="./assets/img/slick/slide2.jpg" alt="img"> </div> <div class="tabs__img"> <img src="./assets/img/slick/slide3.jpg" alt="img"> </div> </div> </div> </div> <div class="tabs__buttons" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="tabs__btn tabs__btn--active" data-tab="tab1">Process & Discrete</div> <div class="tabs__btn" data-tab="tab2">Department & Role</div> </div> <div class="tabs__wrapper" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="100"> <div class="tabs__content tabs__content--active tab1"> <div class="tabs__grid"> <a href="#" class="reference"> <div class="reference__title"> <h4>Aerospace </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Automotive </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Building Products </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Consumer Packaged Goods </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Heavy Equipment </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Paper & Pulp </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Power Distribution </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Tire & Rubber </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> </div> </div> <div class="tabs__content tab2"> <div class="tabs__grid"> <a href="#" class="reference"> <div class="reference__title"> <h4>Aerospace </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Automotive </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Building Products </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Consumer Packaged Goods </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Heavy Equipment </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Paper & Pulp </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Power Distribution </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> <a href="#" class="reference"> <div class="reference__title"> <h4>Tire & Rubber </h4> </div> <div class="reference__arrow"> <img src="./assets/img/icons/arrow-red.svg" alt="img"> </div> </a> </div> </div> </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