/*
Christopher Zamiska, June 12, 2026, IST239-W01, Hand on Project 3-1   
calculates the total cost of items selected from a lunch menu using a for loop and an if statement as 
part of the program code. The cost of each menu item is stored in the value attribute of an input control on the web form.
*/

/* apply a natural box layout model to all elements */
* {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
}

/* reset rules */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
   vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
   display: block;
}

body {
   line-height: 1;
   width: 960px;
   background: white;
   margin: 0 auto;
   font-family: Verdana, Geneva, sans-serif; 
}

ol, ul {
   list-style: none;
}

/* page header */
header {
   background: #5472B2;
   width: 100%;
   color: #FFFFFF;
   font-size: 48px;
   text-align: center;
   line-height: 1.5em;
}

/* main content */
article {
   width: 960px;
   height: 250px;
   text-align: left;
   background: #FFDB70;
   position: relative;
}

article h2 {
   font-weight: bold;
   font-size: 24px;
   padding: 10px;
}

/* form */
form {
   float: left;
}

input {
   float: left;
   clear: left;
   margin: 10px;
}

label {
   float: left;
   font-size: 1.4em;
}

/* total div */
article div {
   width: 50%;
   float: right;
   font-size: 18px;
   font-weight: bold;
}

aside {
   font-size: 1.5em;
   position: absolute;
   left: 400px;
   top: 20px;
}