Task $05$

In the desktop media query, modify the first comment within the query to$,$ Desktop Viewport: Show desktop class, hide mobile$-$tablet class. Below the $.$desktop style rule, create a new style rule for the $.$mobile$-$tablet class selector that sets the display to none $.$

Task $06$

In the desktop media query, add the following comment after the style rule for aside: $/*$ Style rules for table $*/$

Below the comment, add the following style rules:

Create a style rule for the table selector that specifies a border with values of $1$px solid #$2$a$1$f$14,$ collapses the border, and sets top and bottom margins to zero and left and right margins to auto.

Create a style rule for the caption selector that specifies a font$-$size of $1\mathrm{.}5$em$,$ font$-$weight of bold, and sets the padding to $1\%.$

Create a style rule for th and td selectors that specifies a border with values of $1$px solid #$2$a$1$f$14,$ and sets the padding to $1\%.$

Create a style rule for the th selector that sets the background$-$color to $2$a$1$f$14,$ the color to white $($fff$),$ and the font$-$size to $1\mathrm{.}15$em$.$

Create a style rule for the tr selector that sets the background$-$color to #deccba for odd rows.

$/*$ Media Query for Desktop Viewport $*/$

@media screen and $($min$-$width: $1000$px$),$ print $\{$

$/*$ Desktop Viewport: Style rules for nav area $*/$

nav li $\{$

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

$\}$

nav li a $\{$

padding: $0\mathrm{.}5$em $1\mathrm{.}5$em;

$\}$

nav li a:hover $\{$

color: $$#$2$a$1$f$14$;

background$-$color: $\backslash$square#f$6$eee$4$;

opacity: $0\mathrm{.}5$;

$\}$

$.$grid $\{$

grid$-$template$-$columns: auto auto auto;

grid$-$gap: $30$px;

$\}$

aside $\{$

grid$-$column: $1/$ span $3$;

font$-$size: $2$em;

$\}$

$\}$

$/*$ Desktop Viewport: Style rules for main content $*/$

#info ul $\{$

margin: $5\%$;

$\}$

$/*$ Media Query for Large Desktop Viewports $*/$

@media screen and $($min$-$width: $1921$px$),$ print $\{$

body $\{$

background: linear$-$gradient$(\backslash$square#f$6$eee$4,\backslash$square#$78593$a$)$;

$\}$

#wrapper $\{$

width: $1920$px;

margin: $0$ auto;

$\}$

main $\{$

background$-$color: $\backslash$square#f$6$eee$4$;

$\}$

$.$grid $\{$

grid$-$template$-$columns: auto auto auto auto;

$\}$

aside $\{$

grid$-$column: $1/$ span $4$;

font$-$size: $3$em;

$\}$

$\}$