/* ---------------------------------------------
FT Lab Basel - base Styles
Author:   Adriana Palazova
Version:  6 May 2007
last rev.:25 Sept 2008
------------------------------------------------ */

/* Common
------------------------------------------------ */
* {
  margin:0;
  padding:0;
	}
a, a:visited {
  color:#a7bfdb;
  text-decoration:none;
    }
a:hover, a:active, a:focus {
  color:#fff;
  }
a:link img, a:visited img {
  text-decoration:none;
  padding:3px;
  border:0 none;
    }
a:hover img  {
  text-decoration:none;
  padding:2px;
  border:1px dashed #577499;
  /*background:#1C3D66;*/
  }
.clear {
  clear:both;
  }
.em {
  font-style:italic;
  }
.bold {
  font-weight:bold;
  }
abbr {
  border-bottom:1px dotted
  }
#sidecol abbr {
  border-color:#5f7b9c
  }
h1, h2, h3, h4, h5 {
   font-family: "Lucida Grande",Tahoma,Verdana,"Trebuchet MS",Arial,Helvetica,Geneva,Sans-serif;
   line-height:1.4;
   font-weight:normal;
   text-align:left;
   }
/* Page Structure - outher
------------------------------------------------ */
html{font-size:16px}
body {
  background:#2c4a6f;
  font:.81em/1.6 Arial,Helvetica,"Trebuchet MS",Verdana,"Lucida Grande","Lucida Sans Unicode",Sans-serif;
  margin:0;
  padding:0;
  text-align:center;
  color:#88a0c2;
  }
#page {
  background:#2c4a6f url("../img/bg_stripped.gif") repeat-x;
  }
#container {
  position:relative;
  background:transparent;
  width:800px;
  height:100%;
  margin:0 auto;
  border:none;
  color:#446284;
  }
/* Page Structure - inner. Header
------------------------------------------------ */
#header {
  position:relative;
  float:left;
  width:800px;
  height:171px;
  margin-top:20px;
  border:none;
  background:transparent url("../img/hdr.jpg") no-repeat 100% 0;
  }
/* -- Image replacement --- */
#header h1 {
  position:absolute;
  top:0px; left:0px;
  width:800px;
  height/**/:54px;
  overflow:hidden;
  background:transparent;
  padding-left:3px;
  font-size:120%;
  }
#header h1 a, #header h1 a span {
  display:block;
  width:798px;
  height:54px;
  }
#header h1 a:hover {
  border:none;
  cursor:pointer;
  }  
#header h1 a span {
  position:absolute;
  top:0; left:0;
  border:0 none;
  background:transparent url("../img/hdr.jpg") no-repeat 0 0;
  z-index:99;
  }
#header h1 a:hover span, #header h1 a:active span, #header h1 a:focus span {
  border:1px dashed #577499;
  background-position:-1px -1px;
  }
/* --- */  
#headlft {
  float:left;
  background-color:transparent;
  width:65px;
  height:83px;
  margin:78px 50px 0;
  padding:0;
  text-align:center;
  }
.logo {
  background-color:transparent;
  border:none;
  text-align:center;
  }
.logo img {
  margin:0 auto;
  border:none;
  text-align:center;
  }
.logo a, .logo a:visited, .logo a:hover, .topright a, .topright a:visited, .topright a:hover  {
  text-decoration:none;
  }
.topright {
  position: absolute;
  top:1px;
  right:0;
  width: 120px;
  background:transparent;
  font-size:95%;
  text-align:right;
  line-height:1.4;
  z-index:100;
  }
ul#banner {
  position:absolute;
  top:88px;
  right:50px;
  background:transparent;
  width:574px;
  height:100px;
  margin:0;
  padding:0;
  text-align:center;
  display:block;
  cursor: default;
  }
ul#banner li {
  float:right;
  text-align:center;
  width:80px;
  height:80px;
  margin:10px 0px 10px 33px;
  padding:0;
  border:none;
  }
ul#banner li a, ul#banner li a:visited {
  display:block;
  text-decoration:none;
  width:80px;
  height:80px;
  margin:0;
  padding:0;
  text-indent:-9999px;
  border:2px solid #2e5478;
  border-right:3px solid #13263c;
  border-bottom:3px solid #13263c;
  cursor: default;
  }
ul#banner li a:hover {
  text-decoration:none;
  cursor: default;
  }
ul#banner li#zr1 a, ul#banner li#zr1 a:visited {
  background : url("../img/banner.jpg") no-repeat 0 0;
  }
ul#banner li#ap1 a, #banner ul li#ap1 a:visited {
  background : url("../img/banner.jpg") no-repeat -80px 0;
  }
ul#banner li#zr2 a, ul#banner li#zr2 a:visited {
  background : url("../img/banner.jpg") no-repeat -160px 0;
  }
ul#banner li#ap2 a, ul#banner li#ap2 a:visited {
  background : url("../img/banner.jpg") no-repeat -240px 0;
  }
ul#banner li#aptl a, ul#banner li#aptl a:visited {
  background : url("../img/banner.jpg") no-repeat -320px 0;
  }
ul#banner li#zr1 a:hover, ul#banner li#ap1 a:hover, ul#banner li#zr2 a:hover, ul#banner li#ap2 a:hover, ul#banner li#aptl a:hover,
ul#banner li#zr1 a:active, ul#banner li#ap1 a:active, ul#banner li#zr2 a:active, ul#banner li#ap2 a:active, ul#banner li#aptl a:active,
ul#banner li#zr1 a:focus, ul#banner li#ap1 a:focus, ul#banner li#zr2 a:focus, ul#banner li#ap2 a:focus, ul#banner li#aptl a:focus {
  background-position : 0 -80px;
  text-decoration : none;
  border:2px solid #305371;
  border-left:3px solid #102135;
  border-top:3px solid #102135;
  } 
ul#banner li#ap1 a:hover, ul#banner li#ap1 a:active, ul#banner li#ap1 a:focus {
  background-position : -80px -80px;
  }
ul#banner li#zr2 a:hover, ul#banner li#zr2 a:active, ul#banner li#zr2 a:focus {
  background-position : -160px -80px;
  }
ul#banner li#ap2 a:hover, ul#banner li#ap2 a:active, ul#banner li#ap2 a:focus {
  background-position : -240px -80px;
  }
ul#banner li#aptl a:hover, ul#banner li#aptl a:active, ul#banner li#aptl a:focus {
  background-position : -320px -80px;
  }
/* Content
------------------------------- */
#content {
  clear:both;
  float:left;
  background:#345D8C url("../img/bg_content.gif") repeat;
  margin:10px auto 0;
  width:798px;
  min-height:427px;
  height:39.97em;
  border:1px solid #577499;
  text-align:left;
  }
#sidecol {
  float:left;
  margin:0.4em 0 0;
  padding:1.25em 0 0;
  background:transparent;
  width:155px;
  min-height:410px;
  height:38.3em;
  text-align:center;
  background:transparent url("../img/bg_ftlab.gif") repeat-y 1px 1px;
  }
#wrapper {
  position:absolute;
  top:202px; right:1px;
  float:right;
  background:#ececec url("../img/bg_lens.jpg") no-repeat 90% 94%;
  width:617px;
  margin:0.4em 5px;
  padding:0.2em 0;
  min-height:412px;
  height:38.6em;
  border:1px solid #f2f2f2;
  color:#333;
  z-index:2;
  }
#home #wrapper {
  background:#26486f url("../img/bg_home_wrap.gif") repeat;
  border-left:1px solid #577499;
  border-top:1px solid #577499;
  border-right:1px solid #1F3462 ;
  border-bottom:1px solid #1F3462 ; 
  cursor:default;
  }
/* --- Image replacement --- */  
#home #wrapper h2, #home #wrapper h2 span  {
  position:relative;
  left:0;
  width:550px;
  height:330px;
  }
#home #wrapper h2 {  
  margin-left:35px;
  margin-right:30px;
  margin-top:3em;
  padding:0;
  overflow:hidden;
  border:0 none;
  font-size:160%;
  color:#88a0c2;
  text-align:right;
  cursor:default;
  }
#home #wrapper h2 span {
  position:absolute;
  display:block;
  margin-right:0;
  background:transparent url("../img/apatite_home.jpg") no-repeat center left;
  z-index:100;
  }
#home #wrapper h2 small {
  display:block;
  padding-top:30px;
  font-size:80%;
}
#home #contact {
  position: relative;
  margin-top:.5em;
  right: 14px;
  font-weight:700;
  text-shadow:1px 1px 1px #003;
  text-align:right;
  z-index:101;
}  
/* --- */
.scroll {
  position:relative;
  top:0;  
  width:615px;
  margin:1.75em 0 0;
  padding:0 0 0.8em;
  min-height:345px;
  height:31.1em;
  overflow:auto;
  }
#leftcol {
  float:left;
  width:50%;
  margin:0;
  text-align:left;
  }
#rightcol {
  margin:0 0 0 50%;
  text-align:left;
  }
/* Lists
------------------------------------------------ */
ul, ol, dl {
  list-style:none;
  list-style-position:outside;
  text-align: justify;
  }
ul li, ol li {
  margin:0 23px 0.45em 25px;
  padding:3px 0 0;
  }
#menu {
  width:155px;
  margin:0.5em auto 0;
  padding:0 5px;
  text-align:center;
  font-weight: 500;
  }
#menu ul, #leftcol ul, #rightcol ul {
  text-align:left;
  }
#menu ul {
  margin-bottom:1.5em;
  }
#menu ul li {
  display:block;
  background:transparent;
  margin:0 0 0.8em 0;
  padding:0;
  text-transform:lowercase;
  }
#menu ul li a {
  position:relative;
  display:block;
  margin:0 auto;
  padding:3px 5px 6px;
  width:6em;
  height:1.3em;
  background:#1c3d66;
  border-left:1px solid #577499;
  border-top:1px solid #577499;
  border-right:2px solid #10205a;
  border-bottom:2px solid #10205a;
  z-index:1;
  }
#menu ul li a:hover, #menu ul li a:active, #menu ul li a:focus {
  position:relative;
  background:#0e3463;
  border-right:1px solid #557ca7;
  border-bottom:1px solid #557ca7;
  border-left:2px solid #102135;
  border-top:2px solid #102135;
  position:relative;
  top:1px;
  left:1px;
  z-index:3;
  }
.uppercase {
  text-transform:uppercase;
  font-size:90%;
  }
.scroll ul, .scroll ol, .scroll .ref {
  }
.scroll li, .ref li { 	
  margin-left:50px;
  text-indent: -25px;
  list-style-position:outside;
  }
.scroll #leftcol li { 	
  margin:0 0 0.25em 52px;
  text-align:left;
  }
.scroll #rightcol li { 	
  margin:0 0 0.25em 31px;
  text-align:left;
}
.ref li { 	
  padding-top:4px;
  }  
.bul li {
  margin-left:28px;
  padding-left:20px;
  background:transparent url("../img/bul.gif") no-repeat left 0.8em;
  text-indent: 0;
  list-style:none;
  list-style-position:outside;
  }
.bul li li {
  margin-right:0;
  }
.scroll .alpha {
  margin-top:1em;
  }
.alpha li {
  margin-left:20px;
  padding-left:0;
  padding-right:0;
  background-image:none;
  list-style-type:lower-alpha;
  }
.scroll .brown li {
  color:#8D6A0C;
  }
span.dark {
  color:#333;
  }
/* Links in .scroll
------------------------------------------------ */
.scroll a:link, .scroll a:visited {
  padding:1px 0;  
  border-color:#999;
  border-style:dotted;
  border-width:0 0 1px 0;
  color: #2c5eac;
  }
/*.scroll a:visited {
  color:#805959;
  }*/
.scroll .download a:link,  .scroll .download a:visited { 
  display:block;
  width:10.5em;
  margin:0 auto;
  padding:2px 1px 2px 5px;
  background:url(../img/disk.gif) no-repeat 5% center;
  border-width:3px;
  border-style:double;
  border-color:#cdcdcd;
  }
#links .scroll a:link, #links .scroll a:visited {
  display:block;
  margin-right:15px;
  padding-left:3px;
  border-color:#cdcdcd;
  border-width:1px;
  }
/* --- hover styles --- */  
.scroll a:hover, .scroll a:active, .scroll a:focus {
  background:transparent url(../img/bg_tr.png) repeat 0 0;
  border-width:1px 0;
  border-style:solid;
  color:#916900;
  }
.scroll a:hover, .scroll a:active, .scroll a:focus,
.scroll .download a:hover, .scroll .download a:active, .scroll .download a:focus {
  border-color:#D0C07A;
  border-top-color:#E0D5A0;
  border-left-color:#E0D5A0;
  }
#links .scroll a:hover, #links .scroll a:active, #links .scroll a:focus {
  border-color:#D0C07A;
  }
.scroll .download a:hover, .scroll .download a:active, .scroll .download a:focus {
  background-color:#e8e5c6;
  color:#916900;
  /*font-weight:bold;*/
  }
  
/* Headings
------------------------------------------------ */
#wrapper h2 {
  margin:0.75em 23px 0 20px;
  padding:0 3px;
  border-bottom:1px solid #C5BC89;
  font-size:175%;
  color:#916900;
  letter-spacing:0.02em;
  }
#team #wrapper h2 {
  margin-right:69px;
  }
#research #wrapper h2, #method #wrapper h2, #publications #wrapper h2, #links #wrapper h2 {
  margin-right:40px;
  }  
h3 {
  margin:0 23px 0.8em 20px;
  padding:0.2em 5px;
  border:1px solid #CBBE82;
  border-top-color:#E0D5A0;
  border-left-color:#E0D5A0;
  font-size:100%;
  font-weight:bold;
  background:transparent url(../img/bg_tr.png) repeat 0 0;
  letter-spacing:1px;
  color:#916900;
  }
h3.rf {
  margin-top:1.95em;
  }
#team h3 {
  width:75%;
  margin:0.5em 0 0.3em 20px;
  padding:0.2em 5px;
  font-size:100%;
  font-weight:bold;
  }
#team #rightcol h3 {
  margin:0.5em 0px 0.25em;
  }
h3.part, h4 {
  margin:0 0 0.2em 25px;
  padding:3px 0;
  border:0 none;
  background:transparent;
  font:bold 110% Arial,Helvetica,"Trebuchet MS",Verdana,"Lucida Grande","Lucida Sans Unicode",Sans-serif;
  letter-spacing:0;
  color:#333;
  }
/* Misc
------------------------------------------------ */
p {
  margin:0 23px 0.45em 25px;
  padding:3px 0 0;
  text-indent:0;
  text-align: justify;
  }
p.download {
  margin:1.5em auto;
  padding:0;
  font-family:Tahoma,Verdana,"Trebuchet MS",Arial,Helvetica,Geneva,Sans-serif;
  letter-spacing:1px;
  text-indent:0;
  text-align:center;
  }
address {
  margin:0.7em 10px 0.2em 350px;
  padding:3px 0 3px;
  font-style:normal;
  line-height:1.8;
  text-align:left;
  }
.left {
  float:left;
  }
.right {
  float:right;
  }
.left, .right {
  display: inline; 
  margin:7px 25px 0.2em;
  padding:0;
  width:300px;
  height:225px;
  background:transparent;
  border:none;
  }
.left img, .right img{
  display: inline;
  position:relative;
  top:-3px;
  left:-3px;
  margin:0;
  padding:5px;
  width:300px;
  height:225px;
  background:#fff bottom right;
  border:1px solid #d2d2d2;
  }
/* Footer
------------------------------------------------ */
#footer {
  clear:both;
  padding-top:0;
  font-size:95%;
  color:#c6b473;
  }
#footer p, #credits p {
  background-color:transparent;
  margin:0;
  padding:10px 20px;
  text-align:center;
  }  
/* Credits
------------------------------------------------ */
#credits {
  clear:both;
  margin:0 auto;
  width:30em;
  padding-top:0;
  font-size:85%;
  border-top:2px solid #c6b473;
  }
#credits p:hover, #credits p:hover a {
  color:#5F7B9C
  } 
#credits a, #credits a:visited {
  color:#446284;
  border-bottom:1px dotted #446284;
  }
#credits a:hover, #credits p:hover a:hover, #credits a:active, #credits a:focus {
  color:#c7cdcd;
  border-bottom:1px solid #c7cdcd;
  }
#credits a:hover, #footer a:hover, .topright a:hover {
  border-bottom:1px solid #577499;
  }