//Crea las cuatro div de la cabecera
var masthead=document.createElement("div");
var main_image=document.createElement("div");
var side_image=document.createElement("div");
var logo_ciencias=document.createElement("div");
masthead.id="masthead";
main_image.id="main-image";
side_image.id="side-image";
logo_ciencias.id="logo-ciencias";
//Crea un arbol DOM para la cabecera
document.body.appendChild(masthead);
masthead.appendChild(main_image);
masthead.appendChild(side_image);
masthead.appendChild(logo_ciencias);
var yo=main_image.appendChild(document.createElement("h1"));
var dpto=main_image.appendChild(document.createElement("h2"));
var alg=dpto.appendChild(document.createElement("a"));
var uni=side_image.appendChild(document.createElement("a"));
var fac=logo_ciencias.appendChild(document.createElement("a"));
//Crea los enlaces y las leyendas de la cabecera
alg.href="http://www.ugr.es/%7Ealgebra/";
uni.href="http://www.ugr.es/";
fac.href="http://www.ugr.es/%7Edecacien/";
yo.innerHTML="Enrique R. Aznar";
alg.innerHTML="Dpto. Algebra";
uni.innerHTML="Universidad de Granada";
fac.innerHTML="Facultad de Ciencias";
//Crea el div, la lista desordenanda superior del menú y el arbol DOM correspondiente
var navholder=document.body.appendChild(document.createElement("div"));
var mainNav=navholder.appendChild(document.createElement("ul"));
var ini=mainNav.appendChild(document.createElement("li"));
var asig=mainNav.appendChild(document.createElement("li"));
var histo=mainNav.appendChild(document.createElement("li"));
var bio=mainNav.appendChild(document.createElement("li"));
var cont=mainNav.appendChild(document.createElement("li"));
var inicio=ini.appendChild(document.createElement("a"));
var asignaturas=asig.appendChild(document.createElement("a"));
var historia=histo.appendChild(document.createElement("a"));
var biografias=bio.appendChild(document.createElement("a"));
var contacto=cont.appendChild(document.createElement("a"));
var uti=mainNav.appendChild(document.createElement("li"));
var utilidades=uti.appendChild(document.createElement("a"));
///Crea los id y las clases de los items principales del menú
navholder.id="navholder";
mainNav.id="mainNav";
bio.id="bio";

//Crea las leyendas de los items principales del menú
inicio.href="index.html";
asignaturas.href="index.html";
historia.href="index.html";
biografias.href="index.html";
contacto.href="index.html";
inicio.innerHTML="Inicio";
asignaturas.innerHTML="Asignaturas";
historia.innerHTML="Historia";
biografias.innerHTML="Biografías";
contacto.innerHTML="Contacto";
utilidades.innerHTML="Utilidades";
utilidades.href="index.html";
//Crea el ul, los dos li y los dos anclajes para las asignaturas del menú, mas el id para darle estilo
var asigs=asig.appendChild(document.createElement("ul"));
var geo=asigs.appendChild(document.createElement("li"));
var algor=asigs.appendChild(document.createElement("li"));
var lin=asigs.appendChild(document.createElement("li"));
var geologia=geo.appendChild(document.createElement("a"));
var algoritmos=algor.appendChild(document.createElement("a"));
var lineal=algor.appendChild(document.createElement("a"));
asigs.id="ancho_1";
//y los enlaces y las leyendas para las dos asignaturas del menú
geologia.href="aGeologia.htm";
algoritmos.href="aAlgoritmos.htm";
lineal.href="aAlgLin.htm";
geologia.innerHTML="Mat. para Geología";
algoritmos.innerHTML="Algoritmos Algebraicos";
lineal.innerHTML="Álgebra Lin. de Estadística";
//Crea el ul, los 7 li para los items de historia mas el id para darle estilo
var histos=histo.appendChild(document.createElement("ul"));
var histo1=histos.appendChild(document.createElement("li"));
var histo2=histos.appendChild(document.createElement("li"));
var histo3=histos.appendChild(document.createElement("li"));
var histo4=histos.appendChild(document.createElement("li"));
var histo5=histos.appendChild(document.createElement("li"));
var histo6=histos.appendChild(document.createElement("li"));
var histo7=histos.appendChild(document.createElement("li"));
histos.id="ancho";
//Crea los 7 anclajes para los 7 items de historia mas la sublista para grupos
var fta=histo1.appendChild(document.createElement("a"));
var hburnside=histo2.appendChild(document.createElement("a"));
var fibo=histo3.appendChild(document.createElement("a"));
var ecu=histo4.appendChild(document.createElement("a"));
var raices=histo5.appendChild(document.createElement("a"));
var fackermann=histo6.appendChild(document.createElement("a"));
var grupos=histo7.appendChild(document.createElement("a"));
var hgrup=histo7.appendChild(document.createElement("ul"));
//y las 7 leyendas para las 7 items de historia
fta.innerHTML="El Teorema Fundamental del Álgebra";
hburnside.innerHTML="El Problema de Burnside";
fibo.innerHTML="Números de Fibonacci";
ecu.innerHTML="Resolución de Ecuaciones";
raices.innerHTML="Tópicos y raíces cuadradas";
fackermann.innerHTML="La función de Ackermann";
grupos.innerHTML="Teoría de Grupos:";
//y los 7 enlaces para las 7 items de historia
fta.href="fta.htm";
hburnside.href="historia_burnside.htm";
fibo.href="fibo.htm";
ecu.href="ecuaciones.htm";
raices.href="raices_cuadradas.pdf";
fackermann.href="funcion_ackermann.htm";
grupos.href="concepto_grupo.htm";
//Crea los 4 li para los 4 subitems de grupos
var grupos1=hgrup.appendChild(document.createElement("li"));
var grupos2=hgrup.appendChild(document.createElement("li"));
var grupos3=hgrup.appendChild(document.createElement("li"));
var grupos4=hgrup.appendChild(document.createElement("li"));
//Crea los 4 anclajes para los 4 subitems de grupos
var grup1=grupos1.appendChild(document.createElement("a"));
var grup2=grupos2.appendChild(document.createElement("a"));
var grup3=grupos3.appendChild(document.createElement("a"));
var grup4=grupos4.appendChild(document.createElement("a"));
//y las 4 leyendas para los 4 subitems de grupos
grup1.innerHTML="Historia";
grup2.innerHTML="Definiciones históricas";
grup3.innerHTML="Definiciones modernas";
grup4.innerHTML="Grupos de orden pequeño";
//y los 4 enlaces para los 4 subitems de grupos
grup1.href="concepto_grupo.htm";
grup2.href="concepto_grupo_2.htm";
grup3.href="concepto_grupo_3.htm";
grup4.href="grupos_no_isomorfos.htm";
//Crea el ul y los 3 li para los items de biografías
var bios=bio.appendChild(document.createElement("ul"));
var mats=bios.appendChild(document.createElement("li"));
var otr=bios.appendChild(document.createElement("li"));
var flds=bios.appendChild(document.createElement("li"));
//Crea los 3 anclajes para los 3 items de biografías mas la sublista para fields
var matematicos=mats.appendChild(document.createElement("a"));
var otros=otr.appendChild(document.createElement("a"));
var fields=flds.appendChild(document.createElement("a"));
var hfields=flds.appendChild(document.createElement("ul"));
//y las 3 leyendas para los 3 items de biografías
matematicos.innerHTML="Matemáticos";
otros.innerHTML="Otros";
fields.innerHTML="Fields";
//y los 3 enlaces para los 3 items de biografías
matematicos.href="matematicos.htm";
otros.href="otros.htm";
fields.href="lista_fields.htm";
//Crea los 12 li para los 12 subitems de fields
var fields1=hfields.appendChild(document.createElement("li"));
var fields2=hfields.appendChild(document.createElement("li"));
var fields3=hfields.appendChild(document.createElement("li"));
var fields4=hfields.appendChild(document.createElement("li"));
var fields5=hfields.appendChild(document.createElement("li"));
var fields6=hfields.appendChild(document.createElement("li"));
var fields7=hfields.appendChild(document.createElement("li"));
var fields8=hfields.appendChild(document.createElement("li"));
var fields9=hfields.appendChild(document.createElement("li"));
var fields10=hfields.appendChild(document.createElement("li"));
var fields11=hfields.appendChild(document.createElement("li"));
var fields12=hfields.appendChild(document.createElement("li"));
//Crea los 12 anclajes para los 12 subitems de fields
var field1=hfields.appendChild(document.createElement("a"));
var field2=hfields.appendChild(document.createElement("a"));
var field3=hfields.appendChild(document.createElement("a"));
var field4=hfields.appendChild(document.createElement("a"));
var field5=hfields.appendChild(document.createElement("a"));
var field6=hfields.appendChild(document.createElement("a"));
var field7=hfields.appendChild(document.createElement("a"));
var field8=hfields.appendChild(document.createElement("a"));
var field9=hfields.appendChild(document.createElement("a"));
var field10=hfields.appendChild(document.createElement("a"));
var field11=hfields.appendChild(document.createElement("a"));
var field12=hfields.appendChild(document.createElement("a"));
//y las 12 leyendas para los 12 subitems de fields
field1.innerHTML="Historia";
field2.innerHTML="premios 1-5";
field3.innerHTML="premios 6-10";
field4.innerHTML="premios 11-15";
field5.innerHTML="premios 16-20";
field6.innerHTML="premios 21-25";
field7.innerHTML="premios 26-30";
field8.innerHTML="premios 31-35";
field9.innerHTML="premios 36-40";
field10.innerHTML="premios 41-44";
field11.innerHTML="premios 45-48";
field12.innerHTML="Fotos";
//y los 12 enlaces para los 12 subitems de fields
field1.href="historia_premios_fields.htm";
field2.href="premios_fields_1.htm";
field3.href="premios_fields_2.htm";
field4.href="premios_fields_3.htm";
field5.href="premios_fields_4.htm";
field6.href="premios_fields_5.htm";
field7.href="premios_fields_6.htm";
field8.href="premios_fields_7.htm";
field9.href="premios_fields_8.htm";
field10.href="premios_fields_9.htm";
field11.href="premios_fields_10.htm";
field12.href="fields.htm";
//Crea el ul y los 2 li para los items de contacto
var conts=cont.appendChild(document.createElement("ul"));
var conts1=conts.appendChild(document.createElement("li"));
var conts2=conts.appendChild(document.createElement("li"));
//Crea los 2 anclajes para los 2 items de contacto 
var cont1=conts1.appendChild(document.createElement("a"));
var cont2=conts2.appendChild(document.createElement("a"));
//y las 2 leyendas para los 2 items de contacto
cont1.innerHTML="Dirección";
cont2.innerHTML="Tutorías";
//y los 2 enlaces para los 2 items de contacto
cont1.href="contacto.htm";
cont2.href="tutorias.htm";
//Crea el ul y los 4 li para los items de contacto
var utils=uti.appendChild(document.createElement("ul"));
var uti1=utils.appendChild(document.createElement("li"));
var uti2=utils.appendChild(document.createElement("li"));
var uti3=utils.appendChild(document.createElement("li"));
var uti4=utils.appendChild(document.createElement("li"));
//Crea los 3 anclajes para los 2 items de utilidades 
var cbases=uti1.appendChild(document.createElement("a"));
var cfecha=uti2.appendChild(document.createElement("a"));
var ctemperatura=uti3.appendChild(document.createElement("a"));
var pstereo=uti4.appendChild(document.createElement("a"));
//y las 3 leyendas para los 3 items de utilidades 
cbases.innerHTML="Cambio de base";
cfecha.innerHTML="Día Juliano";
ctemperatura.innerHTML="Temperaturas";
pstereo.innerHTML="P. Estereográfica";
//y los 4 enlaces para los 4 items de utilidades 
cbases.href="cambio_base.htm";
cfecha.href="conversorFecha.htm";
ctemperatura.href="conversorTemperatura.htm";
pstereo.href="proyeccion_estereo.html";