8. Alice has been tasked with developing a web application for an upcoming event registration. The application needs to collect user information, perform data validasion on the client side, and send the volidated data to the server for further processing. Figure 2 shows the HTML document for the web applicalion. estle> Event Reglotratione/titesestyleseistyleseheads-bodyo shi 1 Event Registration Formethis? valdateForm s Name; kinput type ="lent" isa"name" name="name" reguired> cinput type="emal" id"temalt" namer"emal" requireds sinput type" "wor" is" phene" name" phone" regures? sselect id " "evenkType" namex" even(T)ype" requireds seption value = Select Event Typesjoptions coption value" "workshop" S-Workshepeloption? coption values" conference" Conference eloptions Seminarefoptions elselects Figure ? a) Draw the oviput of the HTML document shown in Figure 2. (4 Marks) b) Figure 3 shows the validation requirement. 1 The name fold should not be empty and must be in the range of 5 - 10 charscters. 1. The email field should not be emply, and the emal sddress should be valid iil. The phone feld should not be empty and must contah only the numeric charactiars: Figure 3 4 1. Whe the client-side validation using JavaScript based on Figure 3 . (3 Marks) 1. Write the server-side validation using PHP based on Figure 3. (3 Marks) c) Bssed on Figure 2, wite CSS code for each of the following requirements. 1. Set the font family for the entrie page to Arial or a sans-serif talback, entablish a light grey bockground colour (Mititith), and femove the defautl margin and padding frem the body element. 1. Set the teat alignment to the center and the fext color to a dotk gray (er333) for all H1 elements. ii. For the form styles, set the maximum with of the form to 400 pisels, center it horiontally with auto margins, add padding and a white background, apply a borderradius of 5 pinels for rounded comers, and include a box shadow for a subte shadow effect. iv. Configures tabela to be displayed as block eloments and adds a bottom margin of 8 piels to cresie space between labels. . For input and select styles, set the width so 100% of their oontainer, add podding and margin for spacing. ufface bex-iting to include padding and border in the total the comers with a bordec-radius of 4 piesia. . For button styles, set the bockground colour to a green shade (siscalsO), if colour to white, sdd pedding to the lop and bottem (10px) as well as left ant (15pa) remove the defoult button border, rounds the comers with a bonder-rit of 4 pivels, and changes the curser to a pointer on button hover. vil. The button hover styles inctude a change in the bockground colour to a sightly