//displays banner and header on each page
function header(){
    document.write("<tr>");
    document.write("  <td>");
    document.write("     <table width='100%' cellpadding='0' cellspacing='0' class='headerTable'  >");
    document.write("      <tr  bgcolor='#000033'><td>&nbsp; Miguel Lara <br> </td>");
    document.write("        <td colspan='2'> <div align='right'> <font size='-2'>  </font>&nbsp;</div> <br></td>");
    document.write("      </tr> ");
    document.write("     <tr bgcolor='#000033'>   ");
    document.write("      <td width='33%'>  &nbsp; &nbsp;<a href='projects.htm' class='link_header' ");
    document.write('       onMouseOver="i_portfolio.src=\'images/i_portfolio_over.jpg\'" ');
    document.write('	   onMouseOut="i_portfolio.src=\'images/i_portfolio.jpg\'"> ');
	document.write('        <img src="images/i_portfolio.jpg" width="64" height="64" border="0" align="middle" name="i_portfolio">Portfolio  </a>');
    document.write("      </td> ")
    document.write("      <td width='33%' align='center'>  &nbsp; &nbsp;<a href='home.htm' class='link_header' ");
    document.write('       onMouseOver="i_resume.src=\'images/i_resume_over.jpg\'" ');
    document.write('	   onMouseOut="i_resume.src=\'images/i_resume.jpg\'"> ');
	document.write('        <img src="images/i_resume.jpg" width="64" height="64" border="0" align="middle" name="i_resume">Resume  </a>');
    document.write("      </td> ")
    document.write("      <td width='33%' align='right'>  &nbsp; &nbsp;<a href='contact.htm' class='link_header' ");
    document.write('       onMouseOver="i_email.src=\'images/i_email_over.jpg\'" ');
    document.write('	   onMouseOut="i_email.src=\'images/i_email.jpg\'"> ');
	document.write('        <img src="images/i_email.jpg" width="64" height="64" border="0" align="middle" name="i_email">Contact Me </a> &nbsp;&nbsp;');
    document.write("      </td> ")
    document.write("      </tr> ");
    document.write("    </table> ");
    document.write("   </td> ");
    document.write("  </tr> ");
    document.write("<tr>");
    document.write("  <td> <img src='images/header_bar.jpg'> </td>");
    document.write("  </tr> ");
}

             
 //displays unit/lesson numbers and previous/next buttons, gets current page and total number of pages for lesson
function navigation(unit, lesson, current,total) {
    document.write("<table width='100%' cellspacing='0' cellpadding='0'>");
    document.write("<tr>");
    document.write("<td align='right'>");
    document.write("<div class='navigation'> Unidad " + unit + " - Lección " + lesson + " &nbsp;&nbsp;&nbsp;  (" + current + " de " + total + ") </div>");
    if (current - 1 != 0 ) {  //displays previous 
      document.write(" <a href='p" + (current - 1) + ".html'");
      document.write('    onMouseOver="img1.src=\'../../images/next.gif\'"');
      document.write('    onMouseOut="img1.src=\'../../images/prev.gif\'">');
      document.write("    <img src='../../images/prev.gif' border='0' name='img1' alt='Anterior' title='Anterior'></a>");
     }
   if (current != total) { //displays next
      document.write(" <a href='p" + (current + 1) + ".html'");
      document.write('    onMouseOver="img2.src=\'../../images/next_over.gif\'"');
      document.write('    onMouseOut="img2.src=\'../../images/next.gif\'">');
      document.write("    <img src='../../images/next.gif' border='0' name='img2' alt='Siguiente' title='Siguiente'></a>");
    }
    document.write("</td>");    
    document.write("</tr>");
    document.write("</table>");   
}       


function footer() {
    document.write(" <br> <table width='100%' cellspacing='0' cellpadding='0'>");
    document.write("<tr>");
    document.write("<td align='center'> <hr> <br > <font size=-2>  &copy;2009   Miguel Lara </font></td>");
    document.write("</tr>");
    document.write("</table>");   
}