/* Ancho total: 875px, ancho texto central: 700px, left:175 px */

body  {
  font-family: Optima,sans-serif;
  font-size: 1.5em;
  color: #333; /* Color de fuente por defecto */
  background: url(img/Background.jpg);
  background-repeat: repeat;
}

/* Banner */

#main {
  position: relative;
  width: 800px; /* h2 area 175 + .section 475 + .sidenote 190 */
  margin: 0px auto 0px auto;
  padding: 0px 0px 0px 0px;
}

#banner {
  position: relative;
  top: 5px;
  width: 870px;
  height: 100px;
  padding: 5px;
  margin: 0px 0px 0px 0px;
  border: 0px solid #0000FF;
  background: ;
}

#bannerimg {
  width: 869px;
  height: 100px;
  background: url(img/heading_sag.jpg); /* url(img/mainbanner.gif)*/
}


/* Left box on the main page */

#leftframe {
  position:absolute;
  top: 0px;
  left:  4px;
  width: 165px;
  height: 410px;
  margin: 0;
  padding: 0;
/*  border: 1px dotted #CDC4AC;
  border-width: 1px; */
border:1px dotted #0000FF;
  background: url(img/left_img_sag.jpg); /*  */ 
}

.leftnote {
  width: 155px; 
  height: 390px;
  position: relative;
  left: 0px;
  font-size: 0.5em;
  margin: 0px 0px 5px 0px;
  padding: 10px 0px 10px 0px;
}

.leftnote h3 {
  padding: 5px;   
  text-align:center; 
  color:black;
  font-size: 12px;
  font-weight: bold;
  margin: 5px 0px 1px 0px;
/*  background: url(img/menu_band.gif); */
}

.leftnote ul {
  position: relative;
  left: 0px;
  top: 0px;
  font-size: 10px;
  margin: 0px 0px 0px 0px;
  padding: 3px;
 }

.leftnote ul li {
  line-height:12px; 	
  list-style-type: disc;
  margin: 0px 0px 0px 22px;
  padding: 5px 0px 5px 10px;
}

.leftnote ul li a,  .leftnote ul li a:visited {
display:inline; 
text-align:center; 
text-decoration:underline; 
width:155px; 
line-height:12px; 
font-size:10px;
}

/* End of Left Box */



/* Right box on the main page */

#rightframe {
  position:absolute;
  top: 0px;
  left:  882px;
  width: 200px;
  height: 410px;
  margin: 0;
  padding: 0;
/*  border: 1px dotted #CDC4AC;
  border-width: 1px; */
border:1px dotted #0000FF;
  background: url(img/right_img_sag.jpg); /*  */ 
}

.rightnote {
  width: 195px; 
  height: 400px;
  position: relative;
  left: 0px;
  font-size: 0.5em;
  margin: 0px 0px 5px 0px;;
  padding: 10px 0px 10px 0px;
}

.rightnote h3 {
  padding: 5px;   
  text-align:center; 
  color:black;
  font-size: 12px;
  font-weight: bold;
  margin: 5px 0px 1px 0px;
/*  background: url(img/menu_band.gif); */
}

.rightnote ul {
  position: relative;
  left: 0px;
  top: 0px;
  font-size: 10px;
  margin: 0px 0px 0px 0px;
  padding: 3px;
 }

.rightnote ul li {
  line-height:12px; 	
  list-style-type: disc;
  margin: 0px 0px 0px 22px;
  padding: 5px 0px 5px 10px;
}

.rightnote ul li a,  .rightnote ul li a:visited {
display:inline; 
text-align:center; 
text-decoration:underline; 
width:195px; 
line-height:12px; 
font-size:10px;
}

/* End of Right Box */



/* Central part */

#centralpart{           /* esto define la linea de separacion entre la cabecera y la zona central */
  position: relative;
  top: 30px;
  left: 0px;
  width: 875px;
  left:0;
  margin: 0;
  padding: 0;
/*  border:1px dotted #CDC4AC;
  border-width: 1px 0px 0px 0px; */
}

#centralframe {  /* Ahora defino el texto por defecto */
  position:relative;
  top: 0px;
  left:  175px;
  width: 699px;
  height: 411px;
  margin: 0;
  padding: 0;
  border: 1px dotted #0000FF;
  border-width: 0px 1px 1px 1px;
  background: url(img/central_frame_sagS.jpg); /* img_new/Hemisferic_white.jpg - or - img_new/QFT-logo.gif */
}

#centralframe a,  #centralframe a:visited {
color: black; 
font-size:1em;
}

#intro {
  position:relative;
  top: 5px;
  left:  195px;
  width: 490px;
  height: 390px;
  margin: 0;
  padding: 0;
/*  border: 1px solid black;
  border-width: 1px 1px 1px 1px; */
}


#intro h3 {
  top: 15px;
  text-align:left; 
  font-size: 16px;
  font-weight: bold;
  margin: 5px 0px 0px 0px;
  padding: 10px 0px 0px 0px;
  color: black;
}

#intro p { 
  position: relative;
  top: 0px;
  left: 30px;
  width: 440px;
  color:black;
}



#intro ul {
  position: relative;
  left: 10px;
  top: 0px;
  font-size: 12px;
  margin: 0px 0px 0px 0px;
  padding: 0px;
 }

#intro ul li {
  line-height:15px; 	
  list-style-type: disc;
  margin: 3px 0px 3px 5px;
  padding: 3px 0px 3px 5px;
}


/* HERRAMIENTA CENTRAL BÁSICA */

.menu {
position:absolute;
left:175px;
top:-20px;
width:701px; 
margin:0; 
font-family: Optima,sans-serif;
/* font-family: verdana, arial, sans-serif; */
z-index:90;
}

/* ------- Preparamos la cabecera del menu de opciones central ------- */

.menu ul {
padding:0px; 
margin:0;
list-style-type: none;
border:0;
}

/* float the list so that the items are in a line and define borders */

.menu ul li.top {
float:left;  /* float:left; */ 
margin: 0px 0px 0px 0px;
padding:0px 0px 0px 0px; /* padding: 0px 1px 0px 0px ;*/
border:  1px  dotted #CDC4AC;
border-width: 0px 1px 0px 0px;
list-style-type: none;
}

.menu ul li.first{
float:left;  /* float:left; */ 
margin: 0px;
padding: 0px 0px 0px 0px ;
border:  1px  dotted #CDC4AC;
border-width: 0px 1px 0px 1px;
list-style-type: none;
}

/* style the menu option links to be 139px wide by 20px high with a top and right border 1px solid white. Set background color and font size. */

.menu ul li a.top,  .menu ul li a.top:visited {
display:block; 
text-align:center; 
text-decoration:none; 
width:139px; 
color:black; 
font-weight: bold;
background: url(img/menu_band_sag.jpg); 
line-height:20px; 
font-size:11px;
  list-style-type: none;
}

/* set the background and foreground color of the main menu li on hover */

.menu ul li:hover a.top {
color:#fff; 
background: url(img/grey.gif);
}

/* ------- Definimos las pestañas de opciones --------- */ 

.menu ul li div.centralf {
display: none;
list-style-type: none;
}

/* make the sub menu ul visible and position it beneath the first list item */

.menu ul li:hover div.centralf {
  list-style-type: none;
  text-align:left;
  display:block; 
  position:absolute; 
  top:20px; 
  left:1px; 
  width: 698px;
  height: 410px;
  margin: 0;
  padding: 0;
/*  border: 1px solid black;
  border-width: 1px 1px 1px 1px; */
  background:  url(img/central_frame_sag2S.jpg) ;
  }

.menu ul li ul {
  display:block;
  list-style-type: disc;
  position: relative;
  left: 25px;
  top: 0px;
  font-size: 12px;
  line-height:13px; 
  margin: 0px;
  padding: 0px;
  border:0px;
}

.menu ul li ul li {
  margin: 5px 0px 0px 5px;
  padding: 5px 0px 0px 5px;
  width:600px; 
}

.cbox {
  position:relative;
  top: 5px;
  left:  195px;
  width: 490px;
  height: 390px;
  padding: 0px;
}


.cbox p {
  position: relative;
  top: 0px;
  left: 30px;
  width: 440px;
  font-size: 12px;
  padding: 0px;
  margin: 0px;
}

.cbox ul {
  padding: 0px;
  margin: 0px;
}

.cbox h3 {
   top: 15px;
  text-align:left; 
  font-size: 16px;
  font-weight: bold;
  margin: 5px 0px 0px 0px;
  padding: 10px 0px 0px 0px;
  color: black;
}



.cbox h4 {
  position:relative;
  left:25px;
  text-align:left; 
  font-size: 13px;
  font-weight: bold;
  margin: 2px;
  padding: 10px;
  color: black;
  font-family: Optima,sans-serif;
}

.cbox a,  .cbox a:visited {
display:inline; 
text-decoration:none;
color:blue;
background:none;
font-size:12px;
font-weight:normal;
}


.cboxalt {
  position:relative;
  top: 2px;
  left:  25px;
  width: 660px;
  height: 388px;
  padding: 5px;
}

.cboxalt p {
  position: relative;
  top: 0px;
  left: 25px;
  width: 640px;
  font-size: 12px;
  padding: 5px;
  margin: 0px;
}

.cboxalt ul {
  padding: 0px;
  margin: 0px;
}

.cboxalt h3 {
  text-align:left; 
  font-size: 16px;
  font-weight: bold;
  margin: 0px;
  padding: 5px;
  color: black;
  font-family: Optima,sans-serif;
}

.cboxalt h4 {
  position:relative;
  left:25px;
  text-align:left; 
  font-size: 13px;
  font-weight: bold;
  margin: 2px;
  padding: 10px;
  color: black;
  font-family: Optima,sans-serif;
}

.cboxalt a,  .cboxalt a:visited {
display:inline; 
text-decoration:none;
color:blue;
background:none;
font-size:12px;
font-weight:normal;
}


/* Herramienta central II: buscadores */

.centralbars{text-align:center;
  position: relative;
  top:  5px;
  left: 0px;
  margin:15px 0px 15px 0px; 
  padding: 15px 0px 15px 0px;
  vertical-align:middle; 
  width:467px; 
 }


/* Herramienta central III: Tabla con links */


#tablelinks table{
margin: 5px 10px 5px 5px;
padding: 10px 5px 10px 5px;
}

#tablelinks dl{
margin: 0;
padding: 0;
border:1px dotted #CDC4AC;
border-width: 0px 1px 0px 0px;
}

#tablelinks td{
margin: 0;
padding: 0;
}

#tablelinks dt{
padding: 5px 2px 10px 2px;
text-align:left; 
color:black; 
line-height:2.0em; 
font-size:1.0em;
}

#tablelinks dd{
position:relative;
top:-1.0em;
left:-2.0em;
width:100px;
}

#tablelinks a, #tablelinks a:visited{
text-align:left; 
text-decoration:none; 
color:blue; 
border:0;
width:100px;
background:; 
line-height:12px; 
font-size:10px;
font-weight: normal;
}

#tablelinks a:hover{
color:black; 
background: url(img/grey.gif);
}


/* Herramienta central IV: galeria */

#miembros {
  position:relative;
  top: 0px;
  left:  20px;
  width: 650px;
  height: 400px;
  padding: 3px;
  margin: 3px;
}

/* This puts several pics per line. Each pic is seen as an "inline element". */


#homepics{text-align:center}
#homepics p{display:inline} /* El ancho por defecto está determinado por su contenido */
#homepics span{
  margin:2px; 
  vertical-align:top; 
  width:110px; 
  display:table-cell; 
  display:inline-table;   
  display:inline-block
} 

#homepics p img{margin-bottom:2px}
#homepics img {
  width:105px;
  height:105px;   
  border:0;
  border-style: none;
}


/* Particular elements needed in different pages: proyectos */

.abstract {
  width: 680px; /* With 1+1 borders and 5+5 padding, requires 475px */
  position: relative;
  font-size: 0.5em;
  left: 175px;
  margin: 15px 0px 15px 0px;
  padding:15px 10px 15px 10px;
  border: 1px dotted #0000FF;
  background: url(img/central_frame_sag2S.jpg);
}

.abstract h2 {
  padding: 10px;   
  text-align:center; 
  color:black;
  font-size: 16px;
  font-weight: bold;
  margin: 10px 0px 1px 0px;
}

.abstract h3 {
  padding: 5px;   
  text-align:center; 
  color:black;
  font-size: 12px;
  font-weight: bold;
  margin: 5px 0px 1px 0px;
}

.mysidenote {
  width: 155px;
  position: absolute;
  top: -1px;
  left: -176px; 
  padding: 10px 5px 10px 5px;
  margin: 0;
  border: 1px dotted #0000FF;
  background: url(img/left_img_sag.jpg); 
  }

.mysidenote h3 {
  padding: 5px;   
  text-align:center; 
  color:black;
  font-size: 12px;
  font-weight: bold;
  margin: 5px 0px 1px 0px;
/*  background: url(img/menu_band.gif); */
}

.mysidenote ul {
  position: relative;
  left: 0px;
  top: 0px;
  font-size: 10px;
  margin: 0px 0px 0px 0px;
  padding: 3px;
 }

.mysidenote ul li {
  line-height:12px; 	
  list-style-type: disc;
  margin: 0px 0px 0px 22px;
  padding: 5px 0px 5px 10px;
}

.mysidenote ul li a,  .mysidenote ul li a:visited {
display:inline; 
text-align:center; 
text-decoration:underline; 
width:155px; 
line-height:12px; 
font-size:10px;
}

.mynote {position: relative;width:155px;float:left; }
.mynote h2 {text-align:left;}
.mynote h3 {text-align:center; color:black;font-size:1.1em;}
.mynote p {text-align:center}




/*  Definiciones menores  */

p {
  font-size: 12px;
  margin: 5px 0px 5px 0px;
  text-align:left; 
  line-height:20px; 
}

ul {
  font-size: 12px;
  margin: 0px 0px 0px 0px;
  padding: 0px;
 }

ul li {
  left: 25px; 	
  margin: 5px 0px 5px 22px;
  padding: 2px 0px 2px 22px;
  list-style-type: disc;
}

ol {
  font-size: 12px;
  margin: 0px 0px 0px 0px;
  padding: 0px;
}

ol li {
  margin: 5px 0px 5px 22px;
  padding: 5px 0px 5px 22px;
}

em {
  font-style: normal;
  color: black;
}


h3 {
  font-size: 14px;
  font-weight: bold;
   /* color: #000070; */
  margin: 5px 0px 1px 0px;
}

h4 {
  font-size: 12px;
  font-weight: normal;
  margin: 1px 0px -4px 0px; /* 1 - 5 = -4 */
}

h5 {
  font-size: 12px;
  font-weight: normal;
  color: #333;
  margin-top: -8px;
  margin-bottom: 8px
}

small {
      font-size: 10px;
      font-weight: normal;
      margin-top: 0px;
      margin-bottom: 0px
      }


table {
  margin: 0px 0px 0px 0px;
  border-spacing: 0px 0px;
}

td {
  font-size: 12px;
  text-align: left;
  vertical-align: top;
  padding: 0px;
}

td p {
  margin: 0px 0px 1px 0px;
}

th {
  font-size: 12px;
  font-weight: normal;
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
  padding: 0px 4px 0px 0px;
}

a  {text-decoration: none}

a:link    {color: blue;}
a:visited {color: #800080;}
a:active  {color: #891111;}

a:hover   {text-decoration: underline}

a.black {color: #333}


/* Footer */


#footer {
  position: relative;
  top: 27px;
  left: 175px; 
  width: 700px;
  height: 32px;
  padding: 0;
  margin: 5px 0px 0px 0px;
  border:1px dotted #CDC4AC;
  border-width: 1px 0px 0px 0px;

}




/* This defines several-line elements within a main line.*/

.defbox{text-align:left}
.defbox p{display:inline} /* El ancho por defecto está determinado por su contenido */
.defbox span{
  margin:0px 0px 0px 0px; 
  vertical-align:middle; 
  width:625px; 
  position: relative;
  left: -1.0em;
  display:table-cell; 
  display:inline-table;   display:inline-block;
} 



.definition {
  width: 620px;
  top:-0.5em;
  position: relative;
  left: 25px;
  padding: 15px 0px 0px 0px;
}