/* @override http://dev.thinkbright.nl/cell/css/stylesheet.css */

/* body/html styles */
/* link styles */
/* textual styles */
/* main containers styles */
/* main navigation styles */
/* header styles */
/* breadcrumb styles */

/* --------------------------------------------------------------------------------------------------------------------------------------------------- */

/* BODY/HTML STYLES */

body, html {
	font-family: "Lucida Grande", "Lucida Sans", Arial, Helvetica, sans-serif;
	font-size: 11px;
	}
	

/* LINK STYLES */

a {
	color: #06c;
	text-decoration: none;
	}

a:hover {
	color: #06c;
	text-decoration: underline;
	}

address {
	font-style: normal;
	margin-bottom: 10px;
}

/* TEXTUAL STYLES */

p, #about-us li, #blog li {
	text-align: justify;
	line-height: 1.8em;
	font-size: 13px;
	
	}

img.h2 { 
	margin-bottom: 10px 
	}

textarea {
	border: 2px solid #ebebeb;
	font-family: "Lucida Grande", "Lucida Sans", Arial, Helvetica, sans-serif;
	font-size: 11px;
	}

input.text {
	border: 2px solid #ebebeb;
	font-family: "Lucida Grande", "Lucida Sans", Arial, Helvetica, sans-serif;
	font-size: 11px;
	}


#postComments {
	margin-top: 30px;
	width: 425px;
	}

#postComments label input { float: right; margin-right: 58px; margin-top: -1em; width: 236px; }
#postComments label textarea { float: right; margin-top: -1em;  width: 296px; }
#postComments .submitForm { margin-left: 120px; }
#postComments .error { clear: both; color: #F00; font-size: 10px; margin-left: 80px; position: relative; top: -10px; }

#postComments .email2 { color: #F00; display: none; visibility: hidden; }
#postComments .email2 input { width: 1px; }

h1 {
	color: #333;
	font-size: 18px;
	font-weight: normal;
	}



/* MAIN CONTAINERS STYLES */
#frame {
	margin: auto;
	margin-top: 0px;
	width: 900px;
	}

#content {
	float: left;
	positon: relative;
	width: 900px;
	}

#left-column {
	float: left;
	margin-right: 20px;
	width: 210px;
	}
	
	
	#left-column2 {
		float: left;
		margin-right: 20px;
		width: 150px;
		}

#right-column {
	float: left;
	margin-left: 20px;
	width: 210px;
	}

.full-container {
	float: left;
	width: 100%;
	}
	

/* MAIN NAVIGATION STYLES */
.title-link {
	float: left;
	margin-bottom: 20px;
	}

.title-link img {
	float: left;
	margin: 9px 10px 8px 0px;
	}

.title-link a {
	border-left: 2px solid #666;
	color: #999;
	display: block;
	float: left;
	font-size: 18px;
	padding: 8px 12px;
	text-decoration: none;
	}
.title-link a:hover {
	color: #06c; text-decoration: underline;
	}

.list-style-50 {float: left; }
.list-style-50 a 					{ border-top: 1px solid #ebebeb; display: block; float: left;	width: 100%; }
.list-style-50 a:hover 				{ text-decoration: none; }
.list-style-50 a .thumbnail 		{ border: 2px solid #ccc; float: left; height: 40px; margin: 3px; margin-right: 10px; width: 40px; }
.list-style-50 a:hover .thumbnail 	{ border: 2px solid #06c; height: 40px; margin: 3px; margin-right: 10px; width: 40px; }
.list-style-50 a strong 			{ color: #666; float: left; margin-top: 7px; width: 221px; }
.list-style-50 a:hover strong 		{ color: #06c; }
.list-style-50 a span 				{ color: #999; }
.list-style-50 a span.name 			{ float: left; }
.list-style-50 a span.date 			{ float: right; }
	
.list-style-24 						{ float: left; list-style: none; margin: 0px 0px 40px 0px; padding: 0px; width: 100%; }
.list-style-24 li 					{ width: 100%; } 
.list-style-24 a 					{ background: transparent url(../images/icons/list-style-img-24.png) left center no-repeat; display: block; padding: 6px 0px 6px 30px; }
.list-style-24 a:hover 				{ background: #f1f1f1 url(../images/icons/list-style-img-24-hover.png) left center no-repeat; text-decoration: none; }
.list-style-24 a span.extrainfo 	{ color: #999; }

	
	
/* HEADER STYLES */

#header {
	width: 900px;
	}

#header img {
	border: 0px;
	margin-top: 5px;
	z-index: 0px;
	}

#meta-nav {
	float: right;
	list-style: none;
	margin: 0px;
	margin-left: 400px;
	padding: 0px;
	position: absolute;
	top: 0px;
	right: 0px;
	}

#meta-nav li {
	display: inline;
	}

#meta-nav li a {
	border-right: 1px solid #999;
	color: #999;
	display: block;
	float: left;
	padding: 0px 5px;
	}

#meta-nav li a img {
	border: 0px;
	float: left;
	margin: 1px 5px 0px 0px;
	}

#meta-nav li a:hover {
	color: #333;
	text-decoration: none;
	}

#main-nav {
	float: right;
	list-style: none;
	position: absolute;
	top: 16px;
	z-index:5;
	}	

#main-nav li {
	float: left;
	height: 19px;
	position: absolute;
	}	

#main-nav li:hover {
	background: url(../images/background/menuRollover.png) no-repeat center;
	height: 151px;
	margin: 0px;
	width: 161px;
	}

#main-nav li ul {
	display: none;
	}

#main-nav li:hover ul {
	display: block;
	margin: 50px 10px 0px 30px;
	padding: 0px;
	width: 100px;
	}

#main-nav li:hover ul li {
	background: none;
	height: auto;
	list-style: none;
	margin: 0px;
	padding: 0px;
	position: static;
	width: 100px;
	}

#main-nav li:hover ul li a {
	background: none;
	color: #FFF;
	margin: 0px;
	position: static;
	}


#main-nav a {
	display: block;
	float: left;
	height: 21px;
	margin-top: 20px;
	position: absolute;
	width: 100%;
	} 	

#main-nav a span {
	display: none;
	}	

#main-nav li#mn-current:hover {
	background: url(../images/background/menuSingleRollover.png) no-repeat center;
	height: 64px;
	}

#mn-current a {
	background: url(../images/text/menu/current.png) no-repeat top;
	}	

#mn-current:hover a {
	background: url(../images/text/menu/currentHover.png) no-repeat top;
	}


#mn-connect {
	left: 553px;
	margin: 0px 46px;
	width: 69px;
	}

#mn-connect a {
	background: url(../images/text/menu/connect.png) no-repeat top;
	}

#mn-connect:hover a {
	background: url(../images/text/menu/connectHover.png) no-repeat top;
	}

#mn-community {
	left: 670px;
	margin: 0px 31px;
	width: 99px;
	}

#mn-community a {
	background: url(../images/text/menu/community.png) no-repeat top;
	}	

#mn-community:hover a {
	background: url(../images/text/menu/communityHover.png) no-repeat top;
	}

#mn-community:hover a {
	background: url(../images/text/menu/communityHover.png) no-repeat top;
	}	
	
#mn-content {
	left: 785px;
	margin: 0px 47px;
	width: 68px;
	}

#mn-content a {
	background: url(../images/text/menu/content.png) no-repeat top;
	}

#mn-content:hover a {
	background: url(../images/text/menu/contentHover.png) no-repeat top;
	}		


/* BREADCRUMB STYLES */

#breadcrumbs {
	background: url(../images/background/breadcrumbs.png) no-repeat center;
	border: solid #EBEBEB;
	border-width: 0 1px;
	color: #666;
	height: 21px;
	position: relative;
	margin-bottom: 30px;
	}

#breadcrumbs ul {
	list-style: none;
	margin-top: 4px;
	padding: 0px;
	}

#breadcrumbs ul li {
	display: inline;
	float: left;
	position: relative;
	}

#breadcrumbs ul li a {
	background: url(../images/background/breadcrumbNormal.png) no-repeat center right #fff;
	color: #666;
	text-decoration: none;
	position: relative;
	top: 4px;
	padding: 3px 13px 2px 4px;
	}

#breadcrumbs ul li.lastChild a {
	background: url(../images/background/breadcrumbLast.png) no-repeat center right #fff;
	}

#breadcrumbs ul li a:hover {
	color: #06c;
	text-decoration: underline;
	}

/* HOME */


#home-reel {
	height: 250px;
	overflow: hidden;
	float: left;
	list-style: none;
	margin: 60px 0px 30px 0px;
	padding: 0px;
	position: absolute;
	width: 900px;
	}

#home-reel a img {
	border: 1px solid #999;
	}

#home-reel a:hover img {
	border: 1px solid #000;
	}

#home-reel-nav {
	margin: 0px;
	padding: 0px;
	list-style: none;
	position: absolute;
	top: 8px;
	right: 8px;
	}

#home-reel-nav li a {
	background: url(../images/background/home-reel-up-background.png) no-repeat;
	display: block;
	float: right;
	height: 58px;
	width: 298px;
	}

#home-reel-nav li a.active {
	background: url(../images/background/home-reel-selected-background.png) no-repeat;
	width: 308px;
	}

/* NAVIGATION REEL */

.navigation-reel a img {
	border: 1px solid #CCCCCC;
	height: 248px;
	width: 898px;
	}

.navigation-reel a:hover img {
	border: 1px solid #777777;
	}

.navigation-reel-nav {
	float: left;
	list-style: none;
	margin: 0px;
	margin-bottom: 30px;
	padding: 0px;
	width: 100%;
	}

.navigation-reel-nav a {
	background: #AAAAAA none;
	border-right: 1px solid #FFF;
	color: #FFF;
	display: block;
	float: left;
	font-size: 16px;
	padding: 0;
	margin: 0;
	text-align: center;
	width: 299px;
	height: 10px;
	}
	
.navigation-reel-nav.two a {
	width: 449px;
}

.navigation-reel-nav a.active {
	background: #666666 none;
	color: #666;
	}
	
/* BLOGS.PHP */

#blogs {
	float: left;
	margin-bottom: 30px;
	width: 600px;
	}

#blogs a img.thumbnail {
	border: 2px solid #ccc;
	float: left;
	margin-right: 10px;
	margin-top: 10px;
	}

#blogs a:hover img.thumbnail {
	border-color: #06C;
	}

#blogs .blog {
	float: left;
	margin-bottom: 40px;
 	width: 375px;
	}

#blogs .blog p {
	border-top: 1px solid #ebebeb;
	float: left;
	margin-top: 2px;
	padding-top: 8px;
	}

#blogs .blog p.intro {
	font-weight: bold;
	}

#blogs a.h1 {
	color: #333;
	display: block;
	float: right;
	font-size: 16px;
	text-decoration: none;
	width: 375px;
	} 

#blogs a:hover.h1 {
	color: #06C;
	}
	

#blogs span.blog-info {
	color: #999;
	float: left;
	}

#blogs p strong {
	line-height: 1.5;
	}

#blogs p a {
	color: #06C;
	}

img.new {
	border: 0px;
	float: left;
	position: relative;
	left: -40px;
	top: -2px;
	}


#blogtags {
	border-bottom: 1px solid #CCC;
	border-top: 1px solid #CCC;
	color: #999;
	float: left;
	margin: 15px 0px 30px 0px;
	padding: 5px 0px;
	text-align: center;
	width: 100%;
	}

#blogtags strong {
	color: #666;
	font-weight: normal;
	}

#blogtags a {
	color: #999;
	}

#blogtags a:hover {
	color: #06c;
	}

#comments {
	float: left;
	width: 100%;
	}

#comments .comment {
	border-bottom: 1px solid #ebebeb;
	float: left;
	margin-bottom: 10px;
	padding-bottom: 8px;
	width: 100%;
	}

#comments .comment a {
	float: right;
	font-weight: bold;
	}

#comments .comment p {
	margin: 0px;
	}

/* PARTNERS */

.partners {
	color: #666666;
	font-size: 12px;
	line-height: 1.7;
	list-style: none;
	margin: 0 1em 0 0;
	padding: 0px;
	width: 210px;
	float: left;
	border-top: 1px solid #ebebeb;
	}

.partners li {
	border-bottom: 1px solid #ebebeb;
	padding: 3px 0px;
	}

/* PEOPLE.PHP */

.userheader img {
	margin-bottom: 10px; 
	}

#people {
	float: left;
	margin-bottom: 30px;
	width: 440px;
	}

.partner {
	border-bottom: 1px solid #ebebeb;
	float: left;
	padding: 10px 0px;
	width: 100%;
	}

.partner img {
	float: left;
	margin-right: 10px;
	}

.partner strong {
	float: left;
	margin-top: 20px;
	width: 140px;
	}

.partner a {
	display: block;
	float: left;
	width: 140px;
	}


#people-list img {
	border: 3px solid #ebebeb;
	height: 83px;
	width: 83px;
	}

.imglink {
	display: block;
	float: left;
	padding: 5px;
	}

.people-info {
	background: url(../images/background/people-list.png) no-repeat;
	display: none;
	float: left;
	height: 65px;
	margin: -20px 0px 0px -50px;
	padding: 10px 10px 0px 10px; 
	position: absolute;
	text-align: center;
	width: 178px;
	}

.imglink:hover .people-info {
	display: block;
	}

.people-info h1 {
	color: #333;
	font-size: 14px;
	font-weight: bold;
	margin: 0px;
	margin-top: 15px;
	}

.people-info h2 {
	color: #999;
	font-size: 12px;
	font-weight: bold;
	margin: 0px;
	}

#people-heading div {
	float: left;
	}

#people-heading a {
	display: block;
	float: left;
	height: 47px;
	width: 47px;
	}

#people-heading a.previous {
	background: url(../images/icons/previous.png) center no-repeat;
	margin-right: 10px;
	}

#people-heading a.previous:hover {
	background: url(../images/icons/previous-hover.png) center no-repeat;
	}

#people-heading a.next {
	background: url(../images/icons/next.png) center no-repeat;
	margin-left: 5px;
	}

#people-heading a.next:hover {
	background: url(../images/icons/next-hover.png) center no-repeat;
	}


#people-heading a span {
	display: none;
	}

#people-heading h1 {
	color: #000;
	font-weight: normal;
	font-size: 22px;
	margin: 0px;
	}

#people-heading h2 {
	color: #666;
	font-weight: normal;
	font-size: 16px;
	margin: 0px;
	margin-bottom: 15px;
	}

/* LABTALKS */

#latest-labtalk {
	background: url(../images/background/labtalk.png) no-repeat center;
	float: left;
	height: 280px;
	padding: 30px 20px;
	margin-bottom: 30px;
	width: 860px;
	}

#flashcontainer {
	float: left;
	margin-right: 20px;
	width: 408px;
	}

#labtalk-info {
	float: left;
	border-left: 1px solid #999;
	padding: 0px 20px;
	height: 242px;
	position: absolute;
	margin-left: 428px;
	width: 385px;
	}
	
#labtalk-info h1 {
	color: #333;
	font-size: 20px;
	margin: 0px;
	}

#labtalk-info h2 {
	color: #999;
	font-size: 16px;
	margin: 0px;
	}

#labtalk-info table h2 {
	color: #666;
	font-size: 16px;
	font-weight: normal;
	}

#labtalk-info table {
	color: #666;
	}

#labtalk-info table p {
	margin: 0px;
	margin-top: -2px;
	}

#labtalk-info a {
	bottom: 10px;
	color: #06C;
	display: block;
	float: right;
	font-size: 14px;
	left: 20px;
	position: absolute;
	}


/* NEWS */

#news {
	float: left;
	width: 600px;
	}

#news h1 {

	}
	
#news p {
	border-bottom: 0px solid #ebebeb;
	padding-bottom: 0px;
	width: 100%;
	}

#news a {
	color: #0066CC;
	}

#news img {
	border: 1px solid #ebebeb;
	float: left;
	margin-right: 15px;
	}

#news span.date {
	color: #999;
	width: 100%;
	}

/* ABOUT US & CONTACT US */

#about-us, #contact-us {
	float: left;
	width: 600px;
	}

#contact-details {
	float: right;
	font-size: 12px;
	line-height: 1.7;
	text-align: left;
	padding: 0px 20px;
	width: 240px;
	}

#contact-details h1 {

	}
	
	
#contact-us table {
	width: 100%;
	}

#contact-us table input {
	border: 2px solid #ebebeb;
	height: 14px;
	font-family: "Lucida Grande", "Lucida Sans", Arial, Helvetica, sans-serif;
	margin-bottom: 4px;
	padding: 4px 0px;
	width: 50%;
	}

#contact-us table textarea {
	margin-top: 10px;
	width: 100%;
	}

/* PRESENTATIONS */

#latest-presentations {
	float: left;
	padding: 10px 0px;
	width: 430px;
	}


#upcoming-presentations {


	float: right;

	width: 410px;
	}

.presentation {
	border-top: 1px solid #ebebeb;

	float: left;
	width: 390px;
	}

.presentation a img {
	border: 0px;
	}

.presentation h1 {
	font-size: 16px;
	margin-bottom: 0px;
	}

.presentation a {
	color: #999;
	text-decoration: underline;
	}

.presentation a:hover {
	color: #06c;
	}
	
/* INDIVIDUAL CONTAINERS */

#current-news
{
	float: left;
	width: 280px;
}

#current-news p
{
	font-size: 12px;
}

#current-news p.date
{
	margin: 0;
}
#current-news h3
{
	margin-top: 0;
}
h2.current-news, h2.current-blogs
{
	border-bottom: 1px solid #ccc;
	padding-bottom: 1em;
}
h2.project-spotlight span
{
	font-weight: normal;
}

#current-news div.blurb
{
	border-bottom: 1px solid #ccc;
	margin-bottom: 1em;
}

#current-news a{
		color: #0066CC;
}
#current-blogs {
	float: left;
	width: 600px;
	}
#current-blogs ul
{
	margin: 0;
	padding: 0;
	list-style: none;
}

#current-blogs li.post
{
	padding-bottom: 2em;
	border-bottom: 1px solid #ccc;
	margin-bottom: 2em;
}
	
#latest-blogs, #latest-presentations {
	border-bottom: 1px solid #ccc;
	float: left;
	width: 280px;
	}
	
	#latest-blogs2, #latest-presentations2 {
		border-bottom: 1px solid #ccc;
		float: left;
		width: 200px;
		}
		
		#latest-blogs3, #latest-presentations3 {

			float: left;
			width: 200px;
			}

#upcoming-labtalks, #latest-labtalks, #right-column #latest-presentations {
	border-bottom: 1px solid #ccc;
	float: right;
	margin-right: 10px;
	width: 280px;
	}
 
#right-column #latest-presentations, #right-column #latest-labtalks {
	margin-right: 0px;
	margin-bottom: 30px;
	}

.impact_table {
	width: 900px;
}

.impact_table tbody td { padding: 5px; vertical-align: top; }
.impact_table .title { width: 300px; }
.impact_table .authors { width: 300px; }
.impact_table .desc	 { width: 80px; }
.impact_table .person { width: 250px; }
.impact_table .date { width: 120px; }

.impact_table thead th, .impact_table tfoot td {
	font-weight: bold;
	padding: 5px;
	text-align: left;
}

.impact_table thead th { border-bottom: solid 1px #CCC; }
.impact_table tfoot td { border-top: solid 1px #CCC; }


#footer .col {
	border-top: solid 1px #CCC;
	float: left;
	margin: 40px 0 0;
	padding: 0 20px 0 0;
	width: 280px;
}

#footer #contact { padding: 0 0 0 20px; }

#footer .col ul {
	list-style-type: none;
	padding: 0;
}

#footer .col li { margin: 0 0 18px; position: relative; }
#footer #activity h3 {
	margin: 0 0 0 40px;
}

h3.crossbow {
	margin: 0 0 0 0px;
}
#footer #activity p {
	font-size: 10px;
	margin: 0 0 0 40px;
}
#footer #activity img {
	border: solid 2px #CCC;
	left: 0;
	position: absolute;
	top: 0;
	width: 28px;
	height: 28px;
}

#footer #contact {
	
}

#youtubechannel {
	float: left;
	margin-left: 10px;
	width: 280px;
	}

.tagcloud
{
	list-style: none;
	margin: 0;
	padding: 0;	
	width: 280px;
	display: block;
}

.tagcloud a
{
	margin: 0 3px;
}

	.clear:after {
	    content: "."; 
	    display: block; 
	    height: 0; 
	    clear: both; 
	    visibility: hidden;
	}

	.clear {display: inline-block;}

	/* Hides from IE-mac \*/
	* html .clear {height: 1%;}
	.clear {display: block;}
	/* End hide from IE-mac */
	

	
/* 
	jQuery dropdownmenu
	LEVEL ONE
*/

ul.dropdown                         
{ 
	float: right;
	margin-top: -57px;


}
ul									{ list-style: none; padding: 0;}
ul.dropdown li                      { font-weight: bold; float: left; zoom: 1; font-size: 15pt; list-style: none;}
ul.dropdown a:hover		            { color: #383838; }
ul.dropdown a:active                { color: #ffa500; }
ul.dropdown li a                    { display: block; padding: 4px 14px; border-right: 1px ; color: #383838; }
ul.dropdown li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.dropdown li.hover,
ul.dropdown li:hover                { color: white; position: relative; }
ul.dropdown li.hover a              { color: white; background:black;}


/* 
	LEVEL TWO
*/
ul.dropdown ul 						{ width: 200px; visibility: hidden; position: absolute; top: 100%; float: left }
ul.dropdown ul li 					{ font-weight: normal; background: #383838; color: #000; 
									   float: none; }
									  
                                    /* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					{ border-right: none; width: 100%;  color:white; font-size: 9pt; padding-bottom: 10px; padding-top: 10px} 
ul.dropdown ul li a:hover			{ border-right: none; width: 100%;  color:white; font-size: 9pt; padding-bottom: 10px; padding-top: 10px} 

/* 
	LEVEL THREE
*/
ul.dropdown ul ul 					{ left: 100%; top: 0; }
ul.dropdown li:hover > ul 			{ visibility: visible;  }

table.crossbow {
	border: none;
}

td.crossbow {
	vertical-align: top;
	width: 180px;
	height: 180px;
    border-color: #383838;
    border-width: 1px;    
    border-style: solid;
    padding-left: 15px;

}

td.crossbow_red {
	vertical-align: top;
	width: 290px;
    border-color: red;
    border-width: 1px;    
    border-style: solid;
    padding-left: 15px;

}

td.crossbow_green {
	vertical-align: top;
	width: 290px;
    border-color: green;
    border-width: 1px;    
    border-style: solid;
    padding-left: 15px;

}

td.crossbow_yellow {
	vertical-align: top;
	width: 290px;
    border-color: #FF8600;
    border-width: 1px;    
    border-style: solid;
    padding-left: 15px;

}
