/*
 Gómez-Skarmeta Lab : http://www.upo.es/CABD/GomezSkarmetaLab
 CABD: www.cabd.es
 CSS by Antonio H. F. Maia aka simcosmos
 alphas, betas, etc: v20130204 >> 0307 >> 0328 >> 0517/21/22 >> 0607/12/26
 RC: ~v20130701/02/05 >> 08xx >> 0901 >> 0912 (RC1)
 (Departure Point: Two-Column Liquid Design Layout CSS by Matthew James Taylor)
 (other credits / references within comments)
 */

body {
	margin:0;
	padding:0;
	border:0;			/* This removes the border around the viewport in old versions of IE */
	width:100%;
	background:#fff; 
	/*min-width:600px;    	        /* Minimum width of layout - remove line if not required */
					/* The min-width property does not work in old versions of Internet Explorer */
	font-size:90%;
	font-family:Verdana,Tahoma,Arial;
}

/*
html {
			background: url(img/logos/GSlab_logoFAV2.png) no-repeat center center fixed;
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-o-background-size: cover;
			background-size: cover;
		}
*/

hr {color:#eee; clear:both; width:100%; align:center;}

/* Links */
a {
	color:#369;
    overflow:auto;
    word-wrap:break-word;
}
a:hover {
	color:#369;
	background:#fff;
	text-decoration:none;
}

/* Headings */
h1 {
  font-size:150%;
  margin:.8em 0 .2em 0;
	padding:0;
}
h2 {
  font-size:130%;
  margin:.8em 0 .2em 0;
	padding:0;
}
h3 {
  font-size:110%;
  margin:.8em 0 .2em 0;
	padding:0;
}
h4 {
  font-size:100%;
  margin:.8em 0 .2em 0;
	padding:0;
}
p {
	margin:.4em 0 .8em 0;
	padding:0;
	text-indent:15px;
  text-align:justify;
}
img {
	margin:10px 0 5px;
}
#logo img {
	display:block;
	/*padding-top:10px;*/
  margin: 10px 15px 0px 15px;
  float:left;
  border:0;
}

/* SCALLABE PICS - COOL                                         */
/* view-source:http://rjohara.net/server/css-figures-captions/  */
/* figure-divs and their supporters                             */

div.figure {
padding: 10px; 
margin: 0.67em auto; /* needed to support centering of almost-full-width figures */
border: thin solid silver;
}

div.figure img { width: 100%; }

div.figure p { /* the default "legend" style, as opposed to "caption" */
font-family: Verdana, Tahoma, Arial;
font-size: smaller;
padding-left: 1%;
padding-right: 1%;
line-height: 1.1;
margin: 0.25em auto 0 auto;
}
div.figure p.caption { text-align: center; }
/* "caption" for short phrases; "legend" (default) is for continuous prose */

.full { width: 90%; padding: 10px; margin: 0.67em auto; }
/* "full" should be unnecessary, but this responds to the box model bugs in IE */
.half { width: 50%; padding: 10px; margin: 0.5em 0.67em; }
.third { width: 33%; padding: 10px; margin: 0.5em 0.67em; }
.quarter { width: 25%; border: none; padding: 5px; margin: 0.25em 0.5em; }
.fifth { width: 20%; border: none; padding: 5px; margin: 0.25em 1%; }

.right { float: right; margin-left: 2%; }
.left { float: left; margin-right: 2%; }
.center { margin-left: auto; margin-right: auto; }
/* end figure-divs */

/* Header styles */
#header {
	clear:both;
	float:left;
	width:100%;
  background:#fff /*url(img/background_main.png) repeat center top */ ;
}
#header {
	border-bottom:1px solid #000;
}
#header h1{
	padding:.4em 15px 0 15px;
	margin:0;
/*  color:white;*/
  color:green;
  text-shadow: 0px 1px grey,2px 2px 0px #eee;
}
#header p,
#header h2 {
	padding:.4em 15px 0 15px;
	margin:0;
  color:black;
}
#header ul {
	clear:auto;
  /*	clear:left;*/
	float:left;
	width:100%;
	list-style:none;
	margin:10px 0 0 0;
	padding:0;
}
#header ul li {
	display:inline;
	list-style:none;
	margin:0;
	padding:0;
}
#header ul li a {
	display:block;
	float:left;
	margin:1px 0 0 1px;
	padding:3px 9px;
	text-align:center;
  /* menu - background */
	background:#E2F4E2;
	color:#000;
	text-decoration:none;
	position:relative;
	left:15px;
	line-height:1.3em;
}
#header ul li a:hover {
	background:#669966;
	color:#fff;
	/*font-weight:bold;*/
}
#header ul li a.active,
#header ul li a.active:hover {
	background:#007000;
	color:#fff;
	font-weight:bold;
}
#header ul li a span {
	display:block;
}
/* sub menu: site info */
#websiteinfo {
	clear:both;
	background:#eee /*url(img/background_bar.png) repeat-x right top*/;
	border-top:4px solid #007000;
	margin-right:0;
	padding:6px 15px !important;
	text-align:right;
	color:#fff;
	font-style:italic;
	font-size:80%;
}
/* column container */
.colmask {
	position:relative;	/* This fixes the IE7 overflow hidden bug */
	clear:both;
	float:left;
	width:100%;			/* width of whole page */
	overflow:hidden;		/* This chops off any overhanging divs */
}
/* common column settings */
.colright,
.colmid,
.colleft {
	float:left;
	width:100%;
	position:relative;
}
.col1,
.col2,
.col3 {
	float:left;
	position:relative;
	padding:0 0 1em 0;
	overflow:hidden;
  /*max-width:1000px*/
}
/* 2 Column (right menu) settings */
.rightmenu {
	background:#fff;		/* right column background colour */
}
.rightmenu .colleft {
	right:25%;			/* right column width */
	background:#fff;		/* left column background colour */
}
.rightmenu .col1 {
	width:71%;			/* left column content width (left column width minus left and right padding) */
	left:27%;			/* (right column width) plus (left column left padding) */
}
.rightmenu .col2 {
	width:21%;			/* right column content width (right column width minus left and right padding) */
	left:31%;			/* (right column width) plus (left column left and right padding) plus (right column left padding) */
}
/* Footer styles */
#footer {
	clear:both;
	float:left;
	width:100%;
	border-top:1px solid #000;
}
#footer p {
	padding:10px;
	margin:0;
}

#partner_logos {
  display:block;
  padding: 0px 20px;
}
#partner_logos img{
  height:44px;
  margin:5px;
  float:left;
  border:0;
}
#cabd_info, #cabd_info h5 {
  display:block;
  float:right;
  padding:0px 15px 0px 0px;
  color: #4562B6;
}
#cabd_info img{
  float:right;
  height:50px;
  margin:0px;
  border:0;
}

#updateinfo {
	clear:both;
	background:#fff /*url(img/background_bar.png) repeat-x right top*/;
	border-top:1px solid #eee;
	margin:0;
	padding:0px 15px !important;
	text-align:right;
	color:#D0D0D0;
	font-style:italic;
	font-size:80%;
}


/* ***************************************** */
/*      FORM for Custom Search Box           */
/*http://qkin.com/free-search-box-with-style/*/
/* ***************************************** */
form{margin:0;padding:0}

.search-box{ /*outer background*/
background:#eee /*url(img/search-box.gif) no-repeat top left*/;
height: 26px;
padding: 5px 0 0 10px;
/*width: 160px;*/
width: 158px;
}

input.search-field{ /*input field */
float: left;
border:0;
margin:0;
font-family:tahoma;
font-size: 12px;
padding: 3px 0px 0px 4px;
height:18px;
background: #ffffff /*url(img/search-form.png) no-repeat top left*/;
/*width: 123px;*/
width: 120px;
}

input.search-go { /*search icon */
float:left;
border:0;
margin:0;
padding:0;
margin-left: 5px;
height: 21px;
width: 21px;
background: url(img/search-icon.gif) no-repeat top left;
cursor: pointer;
}

input.search-go:hover{ /*search icon hover "Does Not work in ie6" */
background:url(img/search-icon.gif) no-repeat bottom left;
}



/* ********************** */
/* DOCS TABLE DEFINITIONS */
/* ********************** */
#tableDOCS
{
font-family: Verdana, Tahoma, Arial;
width:100%; 
text-indent: 20px;
text-align:justify;
border-collapse:collapse;
margin:30px auto 30px auto;
}
#tableDOCS, #tableDOCS 
{
font-size:90%;
border:2px solid #4562B6;
}
#tableDOCS th 
{
width:230px;
font-size:100%;
text-indent: 10px;
text-align:left;
/*background-color:#A6B2D3;*/
background-color:#4562B6;
color:#ffffff;  /*text color*/
}
#tableDOCS tr td 
{
color:#000000;
padding:15px 15px 15px 15px;
text-align: justify;
}
#tableDOCS tr.alt td 
{
background-color:#EAF2D3;
color:#000000;
}



/* ************************ */
/* PEOPLE TABLE DEFINITIONS */
/* ************************ */
#tableGS
{
font-family:Arial, Helvetica, sans-serif;
width:100%; 
margin-left:auto; 
margin-right:auto;
border-collapse:collapse;
overflow:auto;
word-wrap:break-word;
}
#tableGS, #tableGS 
{
font-size:79.80%;
border:2px solid #1f3b08;
padding:3px 7px 2px 7px;
text-align:center;
}
#tableGS th 
{
font-size:100%;
text-align:center;
padding-top:5px;
padding-bottom:4px;
background-color:#1f3b08;
color:#ffffff;
}
#tableGS tr.alt td 
{
color:#000000;
background-color:#EAF2D3;
}

/* -------------------------------------------------- */
/* Data Table Thumbnails on Mouse Hover People Names  */
/* -------------------------------------------------- */
div#thumbpopup a img {height: 0; width: 0; border-width: 0}
div#thumbpopup a:hover img {position: fixed;_position:absolute;top:50%;right:18px;
    clip:inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);
    _left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth - offsetWidth);
    max-height:30%; height: 284px; max-width:15%; width: 256px; border: 3px solid #627d4d; /*z-index:2;*/
    /*zoom: 1; filter: alpha(opacity=90); opacity: 0.9;*/}
div#thumbpopup a:hover {color: #fff; background: #000; background-color: #627d4d; cursor:pointer}
/* clumsy fix for IE5.5... handy though!? extra work needed*/
/* *html div#thumbpopup a:hover img {position:absolute; /* bottom:0;left:0px; height: 128px; width: 176px ;}/*



/* ---------------------- */
/*      PUBLICATIONS      */
/* ---------------------- */
dl.publications {
    padding-top:0em;
    font-size:80%;
}
dl.publications dt.title {
    /*color:#1f3b08;*/
    font-weight:bold;
    padding-top:2em;
    padding-bottom:0.5em;
}
dl.publications dd.authors {
    font-style:italic;
    padding-top:0.3em;
}
dl.publications dd.ID {
    padding-top:0.5em;
}
dl.publications dd.URL {
    padding-top:0.2em;
}


/* ---------------------- */
/*    Data Lists (SIDE)   */
/* ---------------------- */
dl.side {
    padding-top:1em;
}

dl.side dd {
    margin: 0.1em;
    padding: 0.2em;
}


/* --------------------------------------- */
/*              Floating Box               */
/* --------------------------------------- */
.box {
    width: 200px;
    position: fixed;
    right: 10px;
    top: 200px;
    margin: 2px 2px 2px 15px;
    padding-top:5px;
    padding-bottom:4px;
    background-color:#eee;
    color:#000000;
    font-size:10px;
    zoom: 1;
    filter: alpha(opacity=60);
    opacity: 0.6;
}
* html .box {
    position: absolute;
}

/* ---------------------- */
/*      TEXT MODIFIERS    */
/* ---------------------- */

p.legend
    {
    font-size:10px;
}

span.hidden {
    display: none;
}

span.tooltip {
cursor: pointer;
cursor: hand;
text-align:center;
color:#369;
}

span.green {
    color:green;
}

span.red {
    color:red;
}

span.GTA {
    font-size:8px;
    width:500px;
    overflow:auto;
}


/* http://catcode.com/csstips/center_table.html*/
.centered { text-align: center; }

.centered-table {
   margin-left: auto;
   margin-right: auto;
}

.imageBCKG {
   position: relative;
   width: 100%; /* for IE 6 */
}


/* Bullet Lists Def */
ul.NoBullet {list-style-type: none; text-align:justify}
ul.circle {list-style-type: circle; text-align:justify}
ul.square {list-style-type: square; text-align:justify}
ul.decimal {list-style-type: decimal; text-align:justify}
ul.lower-roman {list-style-type: lower-roman; text-align:justify}
ul.upper-roman {list-style-type: upper-roman; text-align:justify}
ul.lower-alpha {list-style-type: lower-alpha; text-align:justify}
ul.upper-alpha {list-style-type: upper-alpha; text-align:justify}

li {padding-top:5px}


/**********************************/
/*  SMALLER RESOLUTION / DEVICES  */
/**********************************/
@media screen and (max-width: 350px) {
#logo img {
  float:none;
  width:88px;
  height:25px;
  margin-left: auto;
  margin-right: auto;
}

.full { min-width: 90%}
.half { min-width: 90%}
.third { min-width: 90%}
.quarter { min-width: 90%}
.fifth { min-width: 90%}

h1 {
  font-size:100%;
}
h2 {
  font-size:100%;
}
h3 {
  font-size:100%;
}
#header h1, h2{
  text-align:center;
}

#header ul li a {
	padding:3px 10px;
}

.rightmenu .col1 {
	width:90%;			/* left column content width (left column width minus left and right padding) */
	left:30%;			/* (right column width) plus (left column left padding) */
}
.rightmenu .col2 {
	width:90%;			/* right column content width (right column width minus left and right padding) */
	left:30%;			/* (right column width) plus (left column left and right padding) plus (right column left padding) */
}

.search-box{
  margin-left: auto;
  margin-right: auto;
}

.box {
    width: 0%;
    filter: alpha(opacity=0);
    opacity: 0;
}

#partner_logos {
  padding: 0px 14%;
}

#cabd_info img{
  height:32px;
}

#cabd_info h5 {
  font-size: 65%;
}
}
/************************************************************/
@media screen and (min-width: 351px) and (max-width: 640px) {
#logo img {
  width:88px;
  height:25px;
}

.full { min-width: 90%}
.half { min-width: 60%}
.third { min-width: 40%}
.quarter { min-width: 30%}
.fifth { min-width: 24%}

h1 {
  font-size:125%;
}
h2 {
  font-size:115%;
}
h3 {
  font-size:100%;
}

#header h2 {
  text-align:center;
}

.rightmenu .col1 {
	width:90%;			/* left column content width (left column width minus left and right padding) */
	left:30%;			/* (right column width) plus (left column left padding) */
}
.rightmenu .col2 {
	width:90%;			/* right column content width (right column width minus left and right padding) */
	left:30%;			/* (right column width) plus (left column left and right padding) plus (right column left padding) */
}

/*      FORM for Custom Search Box           */
.search-box{
  width: 85%;
  margin-left: auto;
  margin-right: auto;
}

input.search-field{ /*input field */
  width: 50%;
}

.box {
    width: 0%;
    filter: alpha(opacity=0);
    opacity: 0;
}
}
/************************************************************/
@media screen and (min-width: 641px) and (max-width: 768px) {
#logo img {
  width:132px;
  height:38px;
}

.full { min-width: 90%}
.half { min-width: 60%}
.third { min-width: 40%}
.quarter { min-width: 30%}
.fifth { min-width: 20%}

h1 {
  font-size:130%;
}
h2 {
  font-size:120%;
}
h3 {
  font-size:100%;
}

.box {
    width: 0%;
    filter: alpha(opacity=0);
    opacity: 0;
}

/*      FORM for Custom Search Box           */
.search-box{ /*outer background*/
width: 130px;
}

input.search-field{ /*input field */
width: 95px;
}
}
/************************************************************/
@media screen and (min-width: 769px) and (max-width: 799px) {
#logo img {
  width:140px;
  height:40px;
}

.full { min-width: 90%}
.half { min-width: 90%}
.third { min-width: 90%}
.quarter { min-width: 90%}
.fifth { min-width: 90%}

}
/************************************************************/
@media screen and (min-width: 800px) and (max-width: 1024px) {
#logo img {
  width:158px;
  height:45px;
}
}


/* HIGHER RESOLUTION / DEVICES */
@media screen and (min-width: 1200px) {

body {
	font-size:100%
}

p {
	padding: 1% 20% 0 20%;
}

ul {
	padding: 1% 20% 0 25%;
}

#header h1 {
  font-size:200%;
}

/*******************************/
/*      Fixed Header          */
#header {
          position:fixed;
          z-index:99;
}

.colmask {
          padding: 140px 0 0 0;
}

/* http://www.pixelflips.com/blog/anchor-links-with-a-fixed-header/ */
/* http://stackoverflow.com/questions/10732690/offsetting-an-html-anchor-to-adjust-for-fixed-header */
/* anchor to fix jumps in 'fixed header mode' */
.anchor {
  display: block;
  height: 140px;
  margin-top: -140px;
  visibility: hidden;
}


/*      FORM for Custom Search Box           */
.search-box{ /*outer background*/
width: 185px;
}

input.search-field{ /*input field */
width: 150px;
}

.box {
    width: 300px;
    margin-left: auto;
    margin-right: 8%;
    top: 200px;
    padding:8px;
    font-size:12px;
}
}