Give me the code HTML and CSS of this picture.

Enhance the style rule for the body by setting the width to $600$ pixels, setting the top and bottom margins to $0$ and the right and left margins to auto, and adding a $3-$pixel, solid border with #$931420$ as its color. Then, test this change in Chrome. If the page isn't centered with a border, make the required corrections.

$3.$ Add one more declaration to the style rule for the body that sets the background color to #fIfded. Then, test this change, and note that the entire window is set to the background color, not just the body.

$4.$ To fix this, code a style rule for the html element that sets the background color to white. Then, test to make sure that worked.

Add the other borders and another background color

From this point on$,$ test each change right after you make it$.$ If you have any problems, use the Developer Tools shown in figure $4-17$ to help you debug them.

$5.$ Add a bottom border to the header that's the same as the border around the body.

Add top and bottom borders to the h$1$ heading in the main element. Both borders should be the same as the borders for the header and footer.

Set the background color of the footer to the same color as the borders, and then set the font color for the paragraph in the footer to white so it's easier to read.

Get the padding right for the header, main element, and footer At this point, you have all of the borders and colors the way they should be$,$ so you just need to set the margins and padding. In the steps that follow, you'll start by adding a reset selector to the CSS file. Then, with one exception, you'll use padding to get the spacing right.

$8.$ Add a reset selector like the one in figure $5-7$ to the CSS file. When you test this change, the page won't look good at all because the default margins and padding for all of the elements have been removed.

$9.$ For the header, add $1\mathrm{.}5$ems of padding at the top and $2$ems of padding at the bottom. Then, delete the text$-$indent declarations for the h$2$ and h$3$ elements in the header, and add $30$ pixels of padding to the right and left of the image in the header. When you test these changes, you'll see that the heading looks much better.

$10.$ For the main element, add $30$ pixels of padding to the right and left.

$11.$ Test these changes. At this point, all of the spacing should look right.

You sent

$12.$ Italicize the blockquote element to make it stand out.

$13.$ Add a linear gradient as the background for the header. The one that's shown uses #$\{6$bb$73$ at $0\%,$ #$\{6$bb$73$ at $30\%,$ white at $50\%,$ #f$6$bb$73$ at $80\%,$ and #$\{6$bb$73$ at $100\%$ as its five colors at a $30$ degree angle. But experiment with this until you get it the way you want it$.$

$14.$ Do one final test to make sure that the page looks like the one at the start of this exercise. Then, experiment on your own to see if you can improve the formatting.

use css to add a double border with rounded corners and box shadows to the speakers heading.