html, body, ul, ol, li, p, div, span, h1, h2, h3, h4, h5, h6 { font-family:"Lucida Grande", helvetica, arial, sans-serif; list-style:none; letter-spacing:.01em; line-height:1.3em; border:0; }
strong { font-weight:bold; }
p, li, address { font-size:85%; }
/* BANNER AREA
------------------------------------ */

#branding { background:#7399C6 url(/cmn/i/logo_325x100.gif) no-repeat 11% 0%; height:110px; cursor:pointer; overflow:hidden; }
#branding a { display:block; text-indent:-9999px; height:100%; }

/* CONTENT AREA
------------------------------------ */

#main { background:#fff; margin:0 auto; padding:0; }
.inner { background:#fff; width:960px; margin:0 auto; padding:0; }
h2#siteDesc { display:none; }
.content { color:#474747; clear:both; border-top:1px solid #E3DDD1; border-right:1px solid #DEE0CB; border-bottom:1px solid #E3DDD1; border-left:1px solid #DEE0CB; margin:4px 0; padding:0 0 50px; overflow:hidden;  z-index:1; }
#bd { padding:1em 0; }
/*.col { position:relative; float:left; background:#fff; color:#2a2a2a; width:265px; margin:20px 30px 0 25px; padding:0; } /* width was 187 */*/
.col { padding:20px 0 0; }
.col p { }
.col.last { _margin-right:0; }
.col.col2 { margin-left:0; margin-right:40px; }
.col h2, .col h3, .col h4 { font-size:100%; color:#3272AA; margin:2em 2em 5px; padding:0; font-weight:bold; }
.col ul { margin:.5em 2em .5em 2em; border-bottom:1px dashed #4e709a; padding:0 1em 1em 0; }
.col ul li { margin:0 0 .1em; }
.col.error { width:500px; margin:50px 25px; }
.col.error.gag { float:none; width:auto; text-align:center; }
.col.error.gag h2 { font-size:275%; font-family:"lucida grande", helvetica, arial, sans-serif; margin:1em 0; }
.col.error.gag img { text-align:center; }
.col.error.gag .rragh { display:none; }
.col.error.gag.evil h2 { color:#de0000; /*-moz-transform:rotate(-180deg); -webkit-transform:rotate(-180deg);*/ }
.col.error.gag.evil img { display:none; }
.col.error.gag.evil img.rragh { display:inline; }
hr.drop { border-top:1px dashed #4e709a; margin:15px 5px; display:none; }
.new { margin:0 0 0 10px; padding:2px 3px; background:#4E709A; color:#fff; font-size:8px; font-family:tahoma, sans-serif; font-weight:bold; text-transform:uppercase; line-height:15px; vertical-align:top; letter-spacing:.05em; }

    /* :::::Ads :::::*/
.ad_right { display:block; width:180px; text-indent:-9999px; margin:0 auto; outline:0 none !important; }
.ad_right.idea09 { height:180px; background:transparent url(/cmn/img/meet-me-at-idea2009.png) no-repeat 0 0; }
.ad_right.ixd10 { height:225px; background:transparent url(/cmn/img/content/IxD10_180x225.jpg) no-repeat 0 0; }


/* FOOTER AREA
------------------------------------ */

#ft { background:#7399C6; color:#fff; height:24px; }
#ft cite { margin:0; padding:0 1.5em; letter-spacing:normal; color:#DDEAFC; font-size:85%; height:24px; line-height:24px; }


/* TOOLBAR AREA
------------------------------------ */
#toolBar { background:#BDC9DB; height:22px; overflow:hidden; }

#main-nav { color:#fff; overflow:hidden; height:22px; }
#main-nav li { display:block; float:left; list-style:none; font-weight:bold; margin:0; padding:0; border-right:2px solid #fff; _vertical-align:baseline; letter-spacing:.02em; height:22px; line-height:21px; }
#main-nav li a { display:block; color:#fff; text-decoration:none; margin:0; _margin:4px 0; padding:0 14px 0 12px; _padding:0 10px 0 12px; width:auto; text-align:center; height:100%; }
#main-nav li a:hover { color:#7399C6; }
#main-nav .first { border-left:2px solid #fff; margin-left:50px; _margin-left:25px; }
#main-nav .last { border-right-width:2px; }
#main-nav .hidden { border-right-width:0px; }


/* RESUME TAGS
------------------------------------ */

.quicklinks { float:left; clear:left; width:500px; }
.quicklinks ul { margin:0 0 0 30px; }
.quicklinks li { list-style-image:url(/cmn/i/icons/list_raquo.gif); margin:0; padding:0; line-height:16px; vertical-align:top; }

.linkedin { background:transparent url(/cmn/i/icons/list_linkedin.gif) no-repeat left top; margin:0 0 0 10px; padding:0 0 0 21px; line-height:25px; vertical-align:middle; }

address { display:block; position:relative; float:right; top:0; right:1em; }

h1 { }
.header { font-family:"Trebuchet MS", helvetica, arial, sans-serif; font-weight:bolder; font-size:123.1%; text-align:center; margin:1em 0 .5em; padding:0; clear:both; }
h1.sub { text-align:left; }
h3 { font-size:93%; }
h3 a { font-weight:bold; }
#resume { }
#resume h2 { font-weight:bold; font-variant:small-caps; margin:0 0 .2em; }
#resume h2 span { font-weight:normal; }

.desc li { list-style-image:url(/cmn/i/icons/list_square.gif); margin:0 0 2px 15px; _margin:0 0 2px 17px; padding:0; }
.school li, .links li { margin:0 0 8px; padding:0; }

.halfColumn { display:block; float:left; margin:0; padding:0; width:400px; }

#links { width:auto; padding:0 0 0 40px; }
.links li { font-weight:bold; margin:0 0 .5em 100px; }

.dates, .pos-type { font-size:93%; font-weight:normal; font-variant:none; }

#skills { border-bottom:1px solid #eee; }
.section { margin:.5em 0; padding:0 3em; overflow:hidden; }
.company, .skill { clear:both; background:url(/cmn/i/divider-dashed.gif) no-repeat left bottom; margin:5px 0; padding:10px 0; }

.desc {}
.expanded { margin:-22px 0 0; max-width:615px; }

.view-details { margin:6px 0 0 0; display:none;}
/*
.view-details a { background:transparent url(/cmn/img/click-to-view-details.gif) no-repeat scroll left top; display:block; height:15px; }
.view-details a.open { background:transparent url(/cmn/img/hide-details.gif) no-repeat scroll right top; }
*/
.nobg { background:none !important; }

/* MISC TAGS
------------------------------------ */



body { min-width:780px; text-align:center; }

a { color:#4E709A; text-decoration:none; }
a:hover { color:#4E709A; text-decoration:underline; }
a:active { color:#7DC0FF; }
a:visited { color:#4E709A; }

div { text-align:left; }

.clearfix:after { content:"."; display:block; height:0; font-size:0; line-height:0; clear:both; visibility:hidden; }
.clearfix { min-height:1px; height:auto !important; height:1px; }

.hide { display:none; position:absolute; }

.taproot { padding:30px 5px 0; display:none; }
#mangatar { margin:10px 2em; text-align:center; border-bottom:1px dashed #4e709a; padding:0 1em 1em 0; }

#lightbox-screen { position:fixed; width:100%; height:100%; opacity:.8; background:#000; display:none; z-index:99997; top:0; left:0; }
#lightbox-outer { position:absolute; z-index:99998; width:100%; display:none; padding:2em 0; top:1em; }
#lightbox-inner { margin:0 auto; background:#fff; border:3px solid #4e709a; overflow:hidden; height:-1px; padding:1em; width:744px; _width:750px; z-index:99999; position:relative; text-align:left; }


/* UTILITY STYLES */
.clearfix:after { content:"."; display:block; height:0; font-size:0; line-height:0; clear:both; visibility:hidden; }
.clearfix { min-height:1px; height:auto !important; height:1px; }

.hide { display:none !important; }
.go-to { display:block; }

.accessible { position:absolute; left:-9999px; }



#universe-graph {
	position: relative;
	margin: 0;
	min-height: 400px;
	font-size:16px;
}

#universe-graph .node {
	white-space: nowrap;
	font-family: sans-serif;
	text-align: center;
	font-size: 13px;
	overflow: hidden;
	padding: 3px 8px;
	margin: -0.75em 0 0;
	border: 2px solid #aaa;
	background:#fff;

	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;

	box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 -2px rgba(0, 0, 0, 0.05) inset;

	-webkit-box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 -2px rgba(0, 0, 0, 0.05) inset;

	-moz-box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 -2px rgba(0, 0, 0, 0.05) inset;

	background:
		-moz-linear-gradient(
			center top,
			rgba(255, 255, 255, 0) 50%,
			rgba(0, 0, 0, 0.03) 0%
		) repeat scroll 0 0 #fff;

	background:
		-webkit-gradient(
			linear,
			0% 0%,
			0% 100%,
			from(#fff),
			to(rgba(0, 0, 0, 0.03)),
			color-stop(0.5, rgba(255,255,255,0)),
			color-stop(0.5, rgba(0, 0, 0, 0.03))
		) repeat scroll 0 0 #fff;

	border: 1px solid rgba(0, 0, 0, 0.2);
	cursor: pointer;
}

#universe-graph .node:hover {
	background: #eee;
	border-color: rgba(0, 0, 0, 0.3);
}

#universe-graph .node.selected {
	z-index: 6;
	border-color: rgba(63, 91, 208, 0.6);

	box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 1px 7px rgba(63, 91, 208, 0.5),
		0 -2px rgba(0, 0, 0, 0.05) inset;

	-webkit-box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 1px 7px rgba(63, 91, 208, 0.5),
		0 -2px rgba(0, 0, 0, 0.05) inset;

	-moz-box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 1px 7px rgba(63, 91, 208, 0.5),
		0 -2px rgba(0, 0, 0, 0.05) inset;
}

#universe-graph .node h5 {
	font-family: sans-serif;
	display: block;
	font-size: 90%;
	float: left;
	margin: 0;
	background: none;
	color: inherit;
}

#universe-graph .node .logo {
	display: block;
	position: relative;
	margin: 0;
	float: left;
}

#universe-graph .node img {
	width: 16px;
	height: 16px;
	border: none;
	display: block;
	padding: 0 4px 0 0;
}

/* Informational-level coloring */
#universe-graph .level-0 {
	color: #7399C6;
}
#universe-graph .level-1 {
	color: #148cb5;
}
#universe-graph .level-2 {
	color: #298eb1;
}
#universe-graph .level-3 {
	color: #4a91aa;
}
#universe-graph .level-4 {
	color: #6b94a2;
}
#universe-graph .level-5 {
	color: #8c979c;
}
#universe-graph .level-6 {
	color: #999;
}

/* Visible-level styling */
#universe-graph .visible-level-0,
#universe-graph .visible-level-1 {
	display: block;
}

#universe-graph .visible-level-2 {
	background: -webkit-gradient(
		radial,
		50% 50%, 0,
		50% 50%, 30,
		from(#fff),
		to(rgba(255,255,255,0))
	);

	background: -moz-radial-gradient(
		center 0deg,
		ellipse closest-side,
		#fff 0%,
		rgba(255,255,255,0) 100%
	);

	border: none;

	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}
#universe-graph .visible-level-2 img {
	display: none;
}
#universe-graph .visible-level-2:hover {
	background: -webkit-gradient(
		radial,
		50% 50%, 0,
		50% 50%, 30,
		from(#fff),
		to(rgba(255,255,255,0))
	);

	background: -moz-radial-gradient(
		center 0deg,
		ellipse closest-side,
		#fff 0%,
		rgba(255,255,255,0) 100%
	);
}

#universe-graph .visible-level-3,
#universe-graph .visible-level-4,
#universe-graph .visible-level-5,
#universe-graph .visible-level-6,
#universe-graph .visible-level-7 {
	display: none;
}

#universe-graph .visible-level-0 {
	z-index: 5;
}
#universe-graph .visible-level-1 {
	z-index: 4;
}
#universe-graph .visible-level-2 {
	z-index: 3;
}

/* panel */
#universe-panel {
/*	font-size: 13px;
	color:#444;*/
	display: none;
	font-size: 50%;
	background: #fff8d8;
	background: -moz-linear-gradient(
		center top,
		#fff8d8 50%,
		#faf3d1 0%
	) repeat scroll 0 0 #fff8d8;
	z-index: 10;
	padding: 0;
	left: 430px;
	position: absolute;
	right: 1em;
	width: 275px;
	max-height: 100px;
	overflow-x: hidden;
	overflow-y: auto;
	border: 1px solid rgba(0, 0, 0, 0.15);

	box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 2px rgba(0, 0, 0, 0.05) inset;

	-webkit-box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 2px rgba(0, 0, 0, 0.05) inset;

	-moz-box-shadow:
		0 2px rgba(0, 0, 0, 0.05),
		0 2px rgba(0, 0, 0, 0.05) inset;

	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	padding: 5px 8px;
}

#universe-panel h3 {
	font-family: Georgia, serif;
	font-size:16px;
	color:#b91e27; margin: 0;
	text-transform:none;
}

#universe-panel .panel-link {
	display:block;
	color:#7399C6;
	text-transform:uppercase;
	font-family:"Trebuchet MS", sans-serif;
	font-size:10px;
	margin: 0;
}
#universe-panel p a, #universe-panel li a {
	color: #7399C6;
}
#universe-panel ul {
  font-size:100%;
}


#universe-panel a.toggler { display:block; margin:.5em .25em; }

#universe-panel p {
	font-size: 11px;
	margin: 0;
}

#universe-panel img { display: block; float: right; padding-top: 3px; width:60px; height:60px; }

/* for templated universe page */
.mozilla-universe { position:relative;  font-family:Georgia, serif; min-height:400px; }
.mozilla-universe #universe-graph { width:80%; }
