@CHARSET "UTF-8";
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
html,body{height: 100%; overflow: hidden; }
a {text-decoration: none; color: #666; -webkit-transition:color 0.3s linear; -moz-transition:color 0.3s linear; -o-transition:color 0.3s linear; transition:color 0.3s linear;}
:focus { outline: none; -moz-outline-style: none; } /* sorry, accessibility freaks! */
::-moz-selection, ::selection, ::-webkit-selection{ color: #fff;  background: #333; }
.clear { display: block; clear: both; height: 0; font-size: 0; line-height: 0; visibility: hidden; }
.left { display:block; float:left;}
.right { display:block; float:right;}
.bottom { position: absolute; bottom: 0; } 
.transparent { filter:alpha(opacity=90); -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; }

.verdana { font-family: verdana, arial; }
.tahoma { font-family: tahoma, arial; }
.cantarell {font-family: Cantarell, arial; }

#modalwindow {display: none; position:fixed; width: 100%; height: 100%; z-index: 999999;
	background: transparent url('../images/back_white.png') repeat; overflow: hidden;
}
#modalwindow .content {display: block;margin: 0 auto;overflow: hidden;position: relative;}
#modalwindow img {display: block;position: absolute;cursor: crosshair;}
img.modalimage{cursor:pointer}

canvas { position: fixed; left: 0; bottom: 0; }

#content {min-width: 900px; min-height: 400px; margin: auto; position: relative; z-index:10  }

#leftpane { width: 320px; margin: 0 15px; text-align: right; position: relative; }
#logo {margin-top: 15px; }

#leftpane { position: relative; }
#leftpane ul { line-height: 30px; margin: 50px 0 0; font-size: 18px; }
#leftpane ul li a { color: #666; }
#leftpane ul li a:hover { color: #000; }
#leftpane ul li.selected a {color: #000; }
#leftpane ul li.deselected a {color: #ccc; }
#leftpane ul li.deselected a:hover {color: #666; }

#menufiller { width: 100%; height: 50px; }

#latest { text-align: center; position:fixed; bottom: 15px; left:15px; width: 300px; }
#latest span { font-size: 18px; }
#latest div { border: 1px solid #ccc; padding: 10px; font-family: Verdana, Arial; color: #666; margin-top: 5px;}

#logoplusmenu, #menu_targets { border-right: 4px solid #eee; padding-right: 14px;}

#menu_targets { width: 316px; position: relative; padding-right: 0; }
#menu_targets .menu_target * { width: 100%; }
#menu_targets.hideborder { border: 0; }

#menu_targets .blog_entry, .page.menu_target {color: #666; font-family: Verdana, Arial; margin-bottom: 20px; }
#menu_targets .title a { font-size: 22px; color: #666; }
#menu_targets .date, #menu_targets .entry_body, .page.menu_target { font-size: 12px; overflow: hidden; }

#menu_targets img { margin: 15px 0; }

#menu_targets .menu_target {display: none; }

#menu_targets { clear: both; }
#menu_targets .viewport { width: 303px; overflow: hidden; position: relative; }
#menu_targets .overview { width: 303px; list-style: none; position: absolute; left: 0; top: 0; }
#menu_targets .thumb .end, #menu_targets .thumb { background-color: #aaa; -webkit-transition: background 300ms linear;-moz-transition: background 300ms linear;-o-transition:background 300ms linear; transition:background 300ms linear; }
#menu_targets .thumb:hover, #menu_targets .thumb:hover .end{background-color: #000;}
#menu_targets .scrollbar { position: relative; float: right; width: 4px; right:-4px; }
#menu_targets .track { background-color: #eee; height: 100%; width:4px; position: relative; padding: 0; }
#menu_targets .thumb { height: 20px; width: 4px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#menu_targets .thumb .end { overflow: hidden; height: 5px; width: 4px; }
#menu_targets .disable{ display: none; }

#rightpane { position: relative; z-index:4; }

#categories { position:relative;  text-align: center; line-height: 1; max-width:50%; }
#categories .category-tag { text-transform: uppercase; vertical-align: middle; cursor:pointer; }
#categories .close_cat{visibility:hidden; position:relative; left:3px; top:-2px; font-weight: bold; font-size: 20px; }
#categories .category-tag.active .close_cat{visibility:visible; }
#categories .category-tag { color: #666; }
#categories.open .category-tag { color: #ccc; }
#categories .category-tag:hover, #categories .category-tag.active { color: inherit; }

#rightpane.categoriespane #project-info-box { position: absolute; left: 0; top: 20px; min-height: 60px; min-width:200px}
#rightpane.categoriespane .project-info .project-title { font-size: 18px; }
#rightpane.categoriespane .project-info {  font-size: 14px; display: none;
	color: #999999; background-color: white; border: 1px solid #ccc; padding: 5px; font-family: Arial;
	filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; z-index:10 	} 

#rightpane.categoriespane .project-label {position: absolute; text-transform: lowercase; display: none; font-size: 18px; }

#rightpane.projectpane .project { padding: 15px 15px 15px 0px; overflow: hidden; position: relative; min-width:630px }
#rightpane.projectpane .project_heading { text-transform: lowercase; font-size: 24px; height: 40px; margin-top: 38px; }
#rightpane.projectpane .controls { margin:5px; font-size: 20px; }
#rightpane.projectpane .controls .fb_iframe_widget, #LikePluginPagelet { width: 50px; overflow: hidden; }

#rightpane.projectpane .project_slideshow { position:relative; height: 65%; max-height:65%; overflow:hidden; z-index:3 }
#rightpane.projectpane .project_slideshow .slides, #rightpane.projectpane .project_slideshow .slide { height: 100%; }
#rightpane.projectpane .project_slideshow .slides{position:relative; top:0; float:left;  z-index:1}
#rightpane.projectpane .overtext { font-size: 12px; position: absolute; background-color: white; margin: 15px; padding: 10px; height: 100%; width: 550px; 
														filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; z-index:2; color:#666666  }
#rightpane.projectpane .overtext a{color:#000}
#rightpane.projectpane .overtext a:hover{color:#666}
#rightpane.projectpane .project_slidebar { height: 130px; position: relative; }
#rightpane.projectpane .bar {margin-top:67px; height: 4px; background-color: #eee; z-index: -2; }
#rightpane.projectpane .handle { height: 4px; min-width: 150px; z-index:500; position:relative; cursor: pointer; -webkit-transition: background 300ms linear;-moz-transition: background 300ms linear;-o-transition:background 300ms linear; transition:background 300ms linear; }
#rightpane.projectpane .handle:hover { background-color: #000!important; }

#rightpane.projectpane .project_slidebar .milestone {background-image: url('../images/sprites.png'); width: 23px; height: 122px; float: left; margin-top:-61px; position:absolute; z-index: 2; }
#rightpane.projectpane .project_slidebar .milestone-conceptual { background-position: -23px 0; }
#rightpane.projectpane .project_slidebar .milestone-construction { background-position: -46px 0; }
#rightpane.projectpane .project_slidebar .milestone-completed { background-position: -69px 0; }


#rightpane.projectpane .overtext { clear: both; }
#rightpane.projectpane .overtext .viewport { overflow: hidden; position: relative; }
#rightpane.projectpane .overtext .overview { list-style: none; position: absolute; left: 0; top: 0; }
#rightpane.projectpane .overtext .thumb .end, #rightpane.projectpane .overtext .thumb { background-color: #aaa; -webkit-transition: background 300ms linear;-moz-transition: background 300ms linear;-o-transition:background 300ms linear; transition:background 300ms linear; }
#rightpane.projectpane .overtext .thumb:hover, #rightpane.projectpane .overtext .thumb:hover .end{background-color: #000;}
#rightpane.projectpane .overtext .scrollbar { position: relative; float: right; width: 4px; right:-4px; }
#rightpane.projectpane .overtext .track { background-color: #eee; height: 100%; width:4px; position: relative; padding: 0; }
#rightpane.projectpane .overtext .thumb { height: 20px; width: 4px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#rightpane.projectpane .overtext .thumb .end { overflow: hidden; height: 5px; width: 4px; }
#rightpane.projectpane .overtext .disable{ display: none; }

#popup { z-index: 20; display:none; position: fixed; left: 260px; top: 120px; color: #666; background-color: white; -moz-box-shadow: 0 0 10px 3px #ccc;-webkit-box-shadow: 0 0 10px 3px #ccc;box-shadow: 0 0 10px 3px #ccc;}
#popup h2, #popup .close { color: #80141C; font-size: 20px; } 
#popup h2{margin: 0 25px 15px 0;}
#popup .close { font-weight: bold; position: absolute; top: 0; right: 0; }
#popup .padding { margin: 20px; position: relative; }
#popup img { margin: 10px 0; max-width: 390px; }
#popup header { font-weight: bold; }
#popup .scroll { width: 410px; max-height: 320px; margin:15px 0;  }
#popup .overview a{color:#000}
#popup .overview a:hover{color:#666}
#popup .viewport { width: 400px; overflow: hidden; position: relative; max-height: 320px; }
#popup .overview { width: 400px; list-style: none; position: relative; left: 0; top: 0; }
#popup .thumb .end, #popup .thumb { background-color: #aaa; -webkit-transition: background 300ms linear;-moz-transition: background 300ms linear;-o-transition:background 300ms linear; transition:background 300ms linear; }
#popup .thumb:hover, #popup .thumb:hover .end{background-color: #000;}
#popup .scrollbar { position: relative; float:right; top:0; width: 4px; right:-4px;  }
#popup .track { background-color: #eee; height: 100%; width:4px; position: relative; padding: 0; }
#popup .thumb { height: 20px; width: 4px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#popup .thumb .end { overflow: hidden; height: 5px; width: 4px; }
#popup .disable{ display: none; }