Recreate the following table below using HTML and CSS$,$NO BOOTSTRAP classes allowed:

Using the screenshots below, create three cards as follows:

$-$ Styling a section element as a "Card" with an image, a paragraph with filler text, and a button

$-$ There should be three "Cards" on the page

$-$ The second photo shows the hover implementation for buttons

$-$ Note white space between elements and styling of buttons

Use the following custom properties:

$*\{$

$$ box$-$sizing: border$-$box;

$\}$

:root $\{$

$--$black: #$080808$;

$--$white: #fefefe;

$--$gray: #$565656$;

$--$teal: #$006060$;

$--$violetred: #a$2106$d;

$--$orange: #ffa$500$;

$\}$

body $\{$

$$ font$-$family: "Open Sans", "Helvetica Neue", sans$-$serif;

$$ font$-$size: $1\mathrm{.}2$em;

$$ color: var$(--$black$)$;

$\}$

h$1\{$

$$ text$-$align: center;

$\}$

form $\{$

$$ width: $400$px;

$\}$

Below are example screenshots of final product: