/*

Alexander E. Reppel
http://www.reppel.org/
http://www.online-laddering.com/

S C R E E N . C S S

*/



/*  G L O B A L   S E T T I N G S
--------------------------------------------------------------------------------------------------- */

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, legend, fieldset, label, table, th, tr, td { background: transparent; font-size: 100%; vertical-align: baseline; border: 0; outline: 0; margin: 0; padding: 0; }

html { height: 100%; }
body { background: #e6ecf3 url("../images/_bg/bg.png") repeat-x 0 0; font: normal 12px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif; color: #567; text-align: center; text-shadow: 0 1px 0 #FFF; }

#container { background: #e6ecf3 url("../images/_bg/container.png") repeat-y 0 0; text-align: left; position: relative; width: 804px; margin: 0 auto; }


/* Global Offset -------------- */

h1, h2, h3, h5, h6, p, blockquote, ul, ol, dl, pre, table, address { margin: 0 0 15px; }
h4 { margin: 0 0; }



/* Headings ------------------- */

h1, h2, h3, h4, h5, h6 { font-weight: bold; }
h1, h2, h3 { line-height: 1.3; text-shadow: 0 1px 0 #FFF; }

h1 { font-size: 24px; line-height: 24px; margin: 0 0 2px; letter-spacing: -1px; }
h1 a { color: #567 !important; }
h2 { font-size: 16px; color: #567; margin-bottom: 15px; }
h3 { font-weight: normal; font-size: 16px; color: #567; margin-bottom: 10px; padding: 6px 0; }
h4 { color: #567; letter-spacing: 0; }


/* Links ---------------------- */

a:link { color: #4466BB; text-decoration: none; }
a:visited { color: #4466BB; text-decoration: none; }
a:hover { color: #224499; text-decoration: none; }
a:active { color: #224499; text-decoration: none; position: relative; top: 1px; }

a, :focus { outline: 0; -moz-outline-style: 0 none; }


/* Common Formatting ---------- */

small, p.small { font-size: 11px;  }
strong, b { font-weight: bold; }
em, i { font-style: italic; }
strike, del { text-decoration: line-through; }
pre, code { font-family: Consolas, Lucida Console, Monaco, monospace; font-size: 11px; }
sup, sub { font-size: 9px; line-height: 0 !important; }
blockquote, cite { font-style: italic; }

hr { display: none; }


/* Lists ---------------------- */

ul { list-style: none outside; }
ul.bullets { list-style: square outside; margin-left: 16px; }
ol { list-style: decimal inside; }
ul ul, ol ol { margin: 0 }


/* Forms ---------------------- */

form { background: #fcf8e3; width: 306px; float: left; border: 1px solid #d9d0a3; margin: 0 20px 0 0; padding: 10px 12px 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

fieldset {  }

fieldset>div { width: 100%; overflow: hidden; margin: 0 }
fieldset>div label { float: left; width: 200px; background: red; }

legend { text-indent: -9999px; font-size: 0px; line-height: 0; }
label { font-weight: bold; font-size: 11px; color: #765; display: block; cursor: pointer; }

input[type=text], select, textarea { font-size: 12px; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; color: #575d66; vertical-align: middle; margin-bottom: 12px; padding: 4px 3px; }

input[type=text] { background: #FFF; width: 298px; border: 1px solid #c1c5c9;/*  border-color: #818589 #A1A5A9 #c1c5c9;  */}
select { cursor: pointer; padding: 0; }
textarea { overflow: auto; width: 298px; height: 150px; border: 1px solid #c1c5c9; border-color: #818589 #A1A5A9 #c1c5c9; }

button { cursor: pointer; vertical-align: middle; margin: 0; }


/* Tables --------------------- */

table { /* table-layout: fixed; */ width: 100%; border-spacing: 0; border-collapse: collapse; }

table, th, td { vertical-align: top; }
th { background: #000; font-weight: bold; color: #FFF; }
th, td { text-align: left; border-bottom: 1px solid #000; padding: 4px 3px; }


/*  G L O B A L   C L A S S E S
--------------------------------------------------------------------------------------------------- */

.normal { font-weight: normal !important; }
.strong { font-weight: bold !important; }
.italic { font-style: italic !important; }

.no-border { border: 0 !important; }
.no-margin { margin: 0 !important; }

.hidden { position: absolute; left: -19999px }

.left { float: left !important; }
.right { float: right !important; }

.clr { overflow: hidden; }
.clear { clear: both; }

img, a img { border: 0; margin: 0; }
img.left { margin: 0 10px 10px 0; }
img.right { margin: 0 0 10px 10px; }

.rc { border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; }


/* Links ---------------------- */

a.more { font-weight: bold; }

a.button { background: #E1E5E9; display: block; font-weight: bold; font-size: 11px; color: #636a75; position: absolute; top: 15px; right: 15px; padding: 2px 10px; text-shadow: 0 1px 0 #FFF; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
a.button:hover { background: #D1D5D9; color: #567; text-decoration: none; }

a.morebutton { background: #e5e2cf; float: left; font-weight: bold; font-size: 14px; color: #567; border: 2px solid #c9c5b3; padding: 3px 15px 4px; text-shadow: 0 1px 0 #FFF; border-radius: 18px; -moz-border-radius: 18px; -webkit-border-radius: 18px; }
a.morebutton:hover { background: #d9d5c3; color: #567; text-decoration: none; border-color: #b9b5a3; }


/* Icons ---------------------- */

.icon { background-repeat: no-repeat; background-position: 0 50%; padding: 3px 0 3px 20px; }
.icon.delicious { background-image: url("../images/_icn/delicious.png"); }
.icon.facebook { background-image: url("../images/_icn/facebook.png"); }
.icon.flickr { background-image: url("../images/_icn/flickr.png"); }
.icon.linkedin { background-image: url("../images/_icn/linkedin.png"); }
.icon.xing { background-image: url("../images/_icn/xing.png"); }
.icon.posterous { background-image: url("../images/_icn/posterous.png"); }
.icon.aboutme { background-image: url("../images/_icn/aboutme.png"); }
.icon.twitter { background-image: url("../images/_icn/twitter.png"); }
.icon.google { background-image: url("../images/_icn/googleplus.png"); }


/*  H E A D E R
--------------------------------------------------------------------------------------------------- */

#header { background: url("../images/_bg/header.jpg"); overflow: hidden; width: 520px; height: 130px; padding: 70px 0 0 284px; } /* changed padding 90 AR */

p#subline { font-size: 16px; line-height: 20px; color: #9ab; margin-bottom: 15px; }

#nav { background: #d6dde4; float: left; padding: 0 15px; margin: 0 -15px; border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; overflow: hidden; }
#nav ul { float: left; line-height: 1; margin: 0; }
#nav ul li { display: inline; }
#nav ul a { background: url("../images/_bg/nav.gif") repeat-y 0 0; font-weight: bold; text-decoration: none; color: #678; padding: 5px 13px 7px; float: left; text-shadow: 0 1px 0 #FFF; }
#nav ul a:hover { color: #456; }
#nav ul a:active { position: static; }


#nav ul li:first-child a { background: none; padding-left: 0; }/**/
#nav ul li:last-child a { padding-right: 0; }


/*  M A I N
--------------------------------------------------------------------------------------------------- */

#main { width: 760px; overflow: hidden; margin: 25px 22px 5px; }
.group { overflow: hidden; /* background: red; */ }
#main>.group { border-bottom: 1px solid #cbccd0; padding-bottom: 10px; margin-bottom: 20px; }

.col { display: inline; width: 730px; float: left; margin: 0 0 15px 15px; /* background: green; */ }
.col.small { width: 233px; }
.col.mid { width: 481px; }

.col p { margin-bottom: 12px; }
.col ul.bullets { margin-bottom: 12px; }
.col.contact li span { float: left; width: 50px; }

.singlecol { border-bottom: 1px solid #cbccd0; padding: 0 15px 10px; margin-bottom: 20px; }

#intro { position: relative; padding-bottom: 1px; }
#intro .button { position: static }

#events { background: #fcf8e3; color: #765; overflow: hidden; position: relative; border: 1px solid #d9d0a3; margin: 0 0 25px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 15px 15px 4px; }
#events h2 { margin: 0; padding-bottom: 10px; color: #765; }
#events h4 { margin: 0; color: #765; }
#dates { overflow: hidden; }

a#hideevents, a#showevents { background: #e5e2cf; color: #765; }
a#hideevents:hover, a#showevents:hover { background: #d9d5c3; color: #765; }

.col.contact ul { margin-bottom: 15px }
#dl-vcf { background: #FFF url("../images/vcf.jpg") no-repeat 5px 50%; font-weight: bold; display: block; border: 1px solid #D1D5D9; /* margin-left: -10px; */ padding: 12px 10px 12px 70px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#dl-vcf:hover { border-color: #9ab }

div.flickr { margin-bottom: 0; padding-bottom: 10px }
div.flickr .group { margin-left: -10px; }
div.flickr img { background: #FFF; float: left; border: 1px solid #cbccd0; padding: 3px; width: 63px; height: 63px; margin-left: 10px; }

.partner { margin-bottom: 0; }
.partner img { background: #FFF; border: 1px solid #cbccd0; padding: 3px; height: 63px; width: 225px; }

#contact-details { border-top: 1px solid #cbccd0; padding: 15px 0 0; float: left; width: 217px; }
*+html #contact-details {float: none; }
#contact-details p { margin-bottom: 8px; }

#contact-details li { overflow: hidden; }
#contact-details li span { float: left; width: 50px; }

#contact-details ul { margin: 0; }
#contact-details ul.socialmedia li { margin-bottom: 2px; }
#contact-details ul.socialmedia span { float: none; width: auto; color: #999; }

ul#researchnav { background: url(../images/_bg/slidernav.gif) repeat-x 0 100%; margin: 0; padding-top: 0; overflow: hidden; }
ul#researchnav li { display: inline; }
ul#researchnav a { color: #9ab; float: left; width: 170px; padding:  15px; } /* changed from 160px AR */
ul#researchnav a strong { color: #9ab; }
ul#researchnav a:hover { color: #789; }
ul#researchnav a:hover strong { color: #567; }
ul#researchnav a.activeSlide { background: #FFF; color: #789; border: 1px solid #cbccd0; border-width: 1px 1px 0; padding: 14px 14px 15px; position: static !important; cursor: default; border-top-right-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; }
ul#researchnav a.activeSlide strong { color: #567; }

#slider { background: #FFF; overflow: hidden; height: 310px; border: 1px solid #cbccd0; border-width: 0 1px 1px; padding: 15px; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; }

#slider div { padding: 15px; }

.keeptrack { background: #FFF; font-size: 11px; overflow: hidden; border: 1px solid #D1D5D9; margin-bottom: 15px; padding: 10px 15px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.keeptrack p { float: left; margin: 3px 0 0 0 }
.keeptrack ul { float: right; overflow: hidden; margin: 0 }
.keeptrack li { display: inline; }
.keeptrack li a { float: left; color: #567; margin-left: 12px; }
.keeptrack li a:hover { text-decoration: underline; }
.keeptrack li a span { color: #9ab; }


/*  F O O T E R
--------------------------------------------------------------------------------------------------- */

#footer { background: #e6ecf3 url(../images/_bg/footer.gif) no-repeat; font-size: 11px; width: 760px; overflow: hidden; padding: 28px 22px; }

#footer .seotext p { margin: 0; }


/*  T H I C K B O X
--------------------------------------------------------------------------------------------------- */

#TB_overlay { position: fixed; z-index: 100; top: 0; left: 0; height: 100%; width: 100%; }
.TB_overlayBG { background-color: #000; filter: alpha(opacity=40); -moz-opacity: 0.4; opacity: 0.4; }
#TB_window { background: #f8fafc; text-align: left; position: fixed; z-index: 102; display: none; border: 5px solid #567; top: 50%; left: 50%; }
#TB_ajaxContent { position: relative; overflow: auto; padding: 15px; }

* html #TB_overlay { position: absolute; height: expression(document.body.scrollHeight>document.body.offsetHeight?document.body.scrollHeight:document.body.offsetHeight+'px'); } /* IE6 Fix */
* html #TB_window { position: absolute; margin-top: expression(0-parseInt(this.offsetHeight/2) 0 (TBWindowMargin=document.documentElement&&document.documentElement.scrollTop||document.body.scrollTop) 0 px); } /* IE6 Fix */

.TB_overlayMacFFBGHack { background: url(../images/_js/thickbox/macFFBgHack.png) repeat; } /* Firefox Fix */