/* ----------- GENERAL ----------- */

body {
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size:14px;
	cursor:default;
	background-color:#FFFFFF
}

* {
	margin: 0px;
	padding: 0px;
	text-decoration: none;
}

html {
	height:100%;
	margin-bottom:1px;
}

p {
	color:black;
	background-color:#FFFFFF;
	line-height:20px;
	padding:5px;
}

hr {
	border:0px;
	color:#CCCCCC;
	background-color:#CDCDCD;
	height: 1px;
	width: 100%;
	text-align: left;
}

h1 {
	font-size:28px;
	color:#3366FF;
	background-color:#FFFFFF;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-weight:300;
}


h2 {
	font-size:15px;
	color:gray;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-weight:300;
	background-color:#FFFFFF;
}

h3 {
	color:#3366FF;
	font-size:15px;
	text-align:left;
	font-weight:300;
	padding:8px;
	margin-top:8px;
}

a {
	color:#3366FF;
	background-color:#FFFFFF;
	text-decoration:none;
	outline:none;
}

a:hover {
	color:#336699;
	background-color:#E8E8E8;
	text-decoration:underline;
}

/* ----------- MAIN DIVs ----------- */

#container {
	/*width: 60%;*/
	width: 800px;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
	background-color: #FFFFFF;
}

#header {
	width:100%;
	padding-top:15px;
	padding-bottom:15px;
}

#topmenu {
	width:100%;
	height:34px;
	background-image: url('/images/topmenu.gif');
	background-repeat:repeat-x;
	text-transform: uppercase;
	font-weight: bold;
}

#whole {
	float:left;
	width:90%;
	background-color:#FFFFFF;
	color:black;
	padding-left:30px;
	padding-right:0px;
}

#left {
	float:left;
	width:50%;
	background-color:#FFFFFF;
	color:black;
}

#right {
	float:left;
	width:50%;
	background-color:#FFFFFF;
	color:black;
}

#footer {
	clear:both;
	font-size:12px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

/* ----------- TOP MENU ----------- */

#topmenu a {
	color: #000;
	background:none;
	font-size:15px;
	text-decoration:none;
}

/*#topmenu a:hover {
	color: #3366FF;
}*/

#topmenu ul, #topmenu li {
	list-style: none;
	margin: 0; 
	border: 0;
	padding: 0;
}

#topmenu ul li {
	width:125px;
	height:34px;
	color:#000;
	font-size:15px;
	padding-top:8px;
	display:block;
	float:left;
	text-align: center;
}

#topmenu ul li.separator {
	width:11px;
	height:34px;
	background-image: url('/images/topmenu_separator.gif');
	background-repeat: no-repeat;
}

#topmenu .topitem:hover {
	height:34px; 
	position:relative;
	width: 125px;
	display:block;
	background-image: url('/images/topmenu_select.gif');
	background-repeat: no-repeat;
	text-decoration:none;
	cursor:pointer;
}

#topmenu .topitem:hover > a {
	color:#3366FF;
	display: block;
}

/*#topmenu .separator:hover {
	width:11px;
	height:34px;
	background-image: url('/images/topmenu_separator.gif');
	background-repeat: no-repeat;
	cursor: default;
}*/

#topmenu .dropdown ul {
	display:none;
	text-align: left;
}

#topmenu .dropdown:hover ul {
	display:block;
}

#topmenu .submenu {
	display: none;
	position: relative;
	top: 8px;
	width: 170px;
	clear:both;
	z-index:2;
	text-align: left;
	border-bottom:1px solid #000333;
}

#topmenu .submenu li {
	position: relative;
	height: auto;
	width:160px;
	display:block;
	font-size: 12px;
	color: #000;
	float: none;
	padding-bottom:4px;
	padding-left:8px;
	border-left:1px solid #c0c0c0;
	border-right:1px solid #000333;
	background: #fff;
	text-align: left;
}

#topmenu .submenu a {
	font-size:12px;
	text-align: left;
}

#topmenu .submenu li:hover {
	height: auto;
	display:block;
	padding-bottom:4px;
	text-decoration:none;
	background:#ddd;
}

#topmenu .submenu li:hover > a {
	color:#3366FF;
	display:block;
}

/* ----------- LEFT/RIGHT DIVS ----------- */

#left img.main {
	float:right;
	/* border:1px #666 solid; */
	/* padding:0px; */
}

#left h1 {
	float:right;
	padding:3px;
}

#left h1 a.rollover {
	display:block;
	/* border: 1px #666 solid; */
	width:390px;
	height:570px;
	text-decoration:none;
	background: url("/images/main_image_left.png");
}
	
#left h1 a.rollover:hover {
	background-position:0px 0;
}

#left p, #left h2, #left h3, #right p, #right h2, #right h3, #left table, #right table {
  padding:0px 10px 0px 10px;
}

#left img, #right img {
  border: 0px;
}

#left h1 .displace {
	position: absolute;
	left:-2500px;
}

#whole h1 a.rollover {
  display:block;
  width:750px;
  height:570px;
  text-decoration:none;
  background: url("/images/main_image.png");
}

#whole h1 .displace {
  position: absolute;
  left:-2500px;
}

#right img.main {
	float:left;
	/* border:1px #666 solid; */
	/* padding:1px; */
}

#right h1 {
	float:left;
	padding:3px;
}

#right h1 a.rollover {
	display:block;
	width:390px;
	height:570px;
	/* border: 1px #666 solid; */
	text-decoration:none;
	background: url("/images/main_image_right.png");
	/* background-position:0px 0; */
}
	
#right h1 a.rollover:hover {
	background-position:-0px 0;
}

#right h1 .displace {
	position: absolute;
	left:-2500px;
}

/* ----------- CURRICULUM VITAE ----------- */

h2.cv {
	font-size:18px;  
	color:#000;
	font-weight:400;
	padding-bottom:10px;
}

.cv-left {
	float:left;
	width:25%;
	background-color:#FFFFFF;
	color:black;
	text-transform: uppercase;
	padding-bottom:8px;
}

.cv-right {
	float:left;
	width:75%;
	background-color:#FFFFFF;
	color:black;
	padding-bottom:8px;
}

.cv-right p{
	padding-top:0px;
}

.cv-right li{
	list-style-position: outside;
}

.cv-mid {
	float:left;
	width:80%;
	background-color:#FFFFFF;
	color:black;
	padding-bottom:5px;
}

/* ----------- PUBLICATIONS ----------- */

h2.pubs {
	font-size:18px;
	color:#000;
	font-weight:400;
	padding-bottom:10px;
	border-bottom: 1px #ddd solid;
}

/* ----------- PROJECTS ----------- */

h2.projects {
	font-size:18px;
	color:#000;
	font-weight:400;
	padding-bottom:5px;
	border-bottom: 1px #ddd solid;
}

.project {
	float:left;
	background-color:#FFFFFF;
	color:black;
	padding-bottom:10px;	
}

.proj-left {
	float:left;
	width:40%;
	text-transform: uppercase;
	padding-bottom:12px;
}

.proj-left img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	border:3px #eee solid;
	padding:3px;
}

.proj-right {
	float:left;
	width:60%;
	padding-bottom:12px;
}

/* ----------- SPACING AND LAYOUT-MODIFYING CLASSES ----------- */

.large-space {
	width:100%;
	height:25px;
}

.small-space {
	width:100%;
	height:5px;
}

.highlight {
	font-weight: bold;
	color: red;
}

.hidden {
	display:none;
}

.visible {
	display:inline;
}

.right {
	color:gray;
	background-color:#FFFFFF;
	float:right;
	font-size:100%;
	margin-top:5px;
}

.left {
	color:gray;
	background-color:#FFFFFF;
	float:left;
	font-size:100%;
	margin-top:5px;
}