MODIFY THE FOLLOWING CODE SO THE WEBPAGE APPEAR AS THE PICTURE

Table: Column Toggle $-$ jQuery Mobile Demos

$.$slidecontainer $\{$

width: $100\%$;

$\}$

$.$slider $\{$

$-$webkit$-$appearance: none;

width: $100\%$;

height: $25$px;

background: #d$3$d$3$d$3$;

outline: none;

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

$-$webkit$-$transition: $\mathrm{.}2$s;

transition: opacity $\mathrm{.}2$s;

$\}$

$.$slider:hover $\{$

opacity: $1$;

$\}$

$.$slider::$-$webkit$-$slider$-$thumb $\{$

$-$webkit$-$appearance: none;

appearance: none;

width: $25$px;

height: $25$px;

background: #$4$CAF$50$;

cursor: pointer;

$\}$

$.$slider::$-$moz$-$range$-$thumb $\{$

width: $25$px;

height: $25$px;

background: #$4$CAF$50$;

cursor: pointer;

$\}$

$$($document$).$ready$($function$()$

$\{$

$$("$#submit"$).$click$($function$()$

$\{$

var txtval$=$$$("$#myRange"$).$val$()$;

$$("$#qval"$).$html$($txtval$)$;

$\})$;

$\})$;

Enter the quantity in gallonsQunatity Entered: $$gallonsEnter the quantity in gallonsQunatity Entered: $$gallons