body 

  div #flash /div 

  nav .nav 

      a href="/"
      i .fa-regular fa-arrow-left margin-right/i
      /a 

  /nav

  header .header
    a href="/"
      img 
    /a
  /header 


  div .paper #paper 
    div .content 
      p /p
      p /p
      form #form
        input /input
        input disabled #printerURL  /input
        input #printIdInput /input
        div #controls /div
        div .artboard 
            canvas #imageView /canvas
        /div
        div #mouseCircle /div
        div .from /div
        div .link /div 
        button #sendPicture .button /button
      /form
      section #picture
        style /style
        header
          div .from /div
          div .hour /div
        /header
        img #image
      /section
    /div
  /div 

  footer .footer 
    p /p
  /footer

/body 

          

body: the body creates a holder for all the text and image elements in the website

nav: the nav class provides the link on the top left corner of the screen; allowing users to navigate back to the "print gallery"

header: the header class is the holder for the element placed at the top. In this case, its the illustrated printer.

div: the paper class and id is the section with text and the mini drawing board.

form: is the placeholder for the drawing canvas, including the buttons and the textholders.

footer: is the placeholder for the text at the bottom of the webpage.