<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- displays site properly based on user's device --> <link rel="icon" type="image/png" sizes="32x32" href="./images/favicon-32x32.png"> <link rel="stylesheet" href="css/style.css"> <title>Frontend Mentor | Four card feature section</title> <!-- Feel free to remove these styles or customise in your own stylesheet 👍 --> <style> .attribution { font-size: 11px; text-align: center; } .attribution a { color: hsl(228, 45%, 44%); } </style> </head> <body> <header></header> <main> <div class="flexContainer"> <div class="topSection"> <p class="title title1">Reliable, efficient delivery</p> <p class="title title2">Powered by Technology</h2> <p class="blurb">Our Artificial Intelligence powered tools use millions of project data points to ensure that your project is successful</p> </div> <div class="middleSection"> <div class="column"> <div class="supervisor card"> <h2 class="card-title"> Supervisor </h2> <p class="card-blurb"> Monitors activity to identify project roadblocks </p> <img class="card-image" src="images/icon-supervisor.svg" alt="Supervisor icon"> </div> </div> <div class="column"> <div class="teamBuilder card"> <h2 class="card-title"> Team Builder </h2> <p class="card-blurb"> Scans our talent network to create the optimal team for your project </p> <img class="card-image" src="images/icon-team-builder.svg" alt="Team building icon"> </div> <div class="karma card"> <h2 class="card-title"> Karma </h2> <p class="card-blurb"> Regularly evaluates our talent to ensure quality </p> <img class="card-image" src="images/icon-karma.svg" alt="Karma icon"> </div> </div> <div class="column"> <div class="calculator card"> <h2 class="card-title"> Calculator </h2> <p class="card-blurb"> Uses data from past projects to provide better delivery estimates </p> <img class="card-image" src="images/icon-calculator.svg" alt="Calculator icon"> </div> </div> </div> </div> </main> <footer> <!-- <p class="attribution"> Challenge by <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">Frontend Mentor</a>. Coded by <a href="emailto:work@tarasis.net">Robert McGovern</a>. </p> --> </footer> </body> </html>