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

  Site layout for dhumann.com
  
----------------------------------------------------------------------------------------------- */ 

/* Reset Elements */
* { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

body {
  font-size: 75%;
  color: #222;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.5em;
  text-align: center;
  background: #000;
}


h1, h2, h3, h4, h5, h6 {
   font-weight: normal;
   color: #222;
   font-family: "Myriad Pro", Tahoma, Verdana, Arial, sans-serif;
}

h1 { margin-bottom: 0.5em; font-size: 3em;  }
h2 { margin-bottom: 0.75em; font-size: 2.5em;  }
h2 small { font-family: Tahoma, Verdana, Arial, sans-serif; font-size: 13px; }
h3 { font-size: 1.5em; line-height: 1em; margin-bottom: .25em; color: #999; }

a { color:#333; }
a:hover { text-decoration: none; }
a:focus, a:active { outline: none; }
a:focus, a:hover { color: #000; }
a img { border:none; }

p { margin: 0 0 1em 0; }
ul, ol { list-style: none; }
strong { font-weight: bold; }
em { font-style: italic; }
dfn { font-style: normal; cursor: help; border-bottom: 1px dotted #81a03d; }
address { font-style: normal; }
hr { width: auto; height: 1px; margin: 1em 0; background: #222; color: #222; clear: both; border: none; }



/* Utility Classes */

.dim { color: #798a2d; }
.help, .more { cursor: help;  }
.more { border-bottom: 1px dotted #81a03d; }
.hidden { display:none; }

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

.clearfix, .container { display:block; }
.clear { clear:both; }


.section { font-size: 1.1em; }
.half { width: 450px; float: left; margin-right: 60px; margin-bottom: 1.5em; }
.full {  position: relative; clear: both; width: 960px; margin: 0 auto; color: #fff; }
.last { margin-right: 0; }
p.last, p.single { margin-bottom: 0; }

.fluff { 
  float: right;
  margin: 4px 0 4px 8px;
  border: 8px solid #fff;  
}

.seperator {
  position: relative;
  clear: both;
  width: auto;
  height: 1px;
  margin: 2.5em 0 .75em 0;
  background: #222;
}

.spacer { margin-bottom: 3em; background: none; }

.btnClose { 
  display: block;
  height: 15px;
  width: 15px;
  background: transparent url('../img/btn-close.png') 0 0 no-repeat;
}

.btnClose:active {
  background-position: 0 -30px;
}

.btnClose:hover {
  background-position: 0 -15px;
}

.btnClose * { display: none; }




/* Topbar Region 
-------------------------------------------- */

#top {
  position: relative;
  width: auto;
  height: 40px;
  overflow: hidden; 
  text-indent: 0; 
  padding: 0;
  color: #fff;
  background: #282827 url(../img/bg-top.jpg) bottom left repeat-x; 
  border-bottom: 1px solid #555;  
}

_body.home #top { display: none; }

#bar {
  position: relative;
  width: 960px;
  margin: 0 auto;
  padding: 0;
}

#logo {
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 178px;
  height: 40px;
  margin: 0;
  padding: 0;
  text-align: left;
  text-indent: 44px; 
  text-decoration: none;
  color: #9ec749;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: bold;
  background: transparent url('../img/icon-d.gif') center left no-repeat;
  border: 0px dotted #ccc;
}

#logo span { 
  position: relative;
  top: 10px;
  text-transform: lowercase;
  letter-spacing: .001em;
}

a#logo:hover { color: #fff; }




#nav {
  position: absolute;
  top: 0;
  left: 186px;
  height: 40px;
  list-style: none;
  color: #ccc;
  border: 0px dotted #ccc;
}

#nav li {
  display: inline;
  height: 40px;
  line-height: 40px;
  vertical-align: middle;
  padding: 0 8px;
}


#nav span, #nav a {
  display: block;
  float: left;
  width: auto;
  height: 40px;
  padding: 0 10px;
  color: #ccc;
  text-decoration: none;
}

#nav a:hover {
  color: #fff;
  background: #333;
}

#nav span.current { color: #999; cursor: help; }


#showIntro {
  position: absolute;
  top: 0;
  right: 8px;
  margin: 0 auto;
  border: 0px dotted #ccc;
}




/* Header Region 
-------------------------------------------- */

#header {
  display: block;
  position: relative;
  height: 400px;
  min-width: 960px;
  margin: 0 auto; 
  text-align:center;
  background: transparent url('../img/bg-hdr.jpg') 0 -40px repeat-x;
  border-bottom: 1px solid #000;
}

#header * { text-align: left; }
#header a { text-decoration: none; border-bottom: 1px dotted #ccc; }
#header a:hover { color: #ff9900; }


#hdrint {
  position: relative;
  z-index: 1;
  width: 960px;
  height: 400px;
  margin: 0 auto;
  background: transparent url('../img/bg-hdrint.jpg') 0 -40px no-repeat;
  border: 0px dotted red;
}

a#hdrClose {
  display: none;
  position: absolute;
  top: 48px;
  right: 32px;
  border-bottom: 0;
}

#hdrint:hover #hdrClose {
  display: block;
}

#preface {
  position: relative;
  top: 50px;
  left: 8px;
  width: 580px;
  padding: 0;
  border: 0px dotted red;
}





/* Middle Region 
----------------------------------------------- */

#mid { 
  z-index: 2;
  position: relative;
  padding-top: 0; 
  text-align: center; 
  background: #000 url(../img/) top left repeat-x;
  border-bottom: 1px solid #000;
}

body.home #mid { background: transparent; }

#mid * { text-align:left }

#content {
  position: relative;
  width: 960px;
  padding-top: 10px;
  margin: 0 auto;
  color: #fff;
}

#content a { color: #b9d445; }
#content a:hover { color:#ff9900; }
#content hr { color: #444; background: #444; }

#content h2 {
  margin: 0 auto;
  padding: .75em 0;
  text-align: left;
  color: #fff;
  border: 0px dotted #ccc;
}

#content h2.first { margin-top: .25em; }

#content h2 span.small { 
  margin-left: 10px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px; 
  color: #777;
  vertical-align: baseline;
}

#content h3 {
  margin: 0 0 4px 0;
  padding: 4px 0;
  color: #fff;
}



#intro { width: auto; margin: 480px0; color: #fff; text-align: justify; font-size: 150%; 
         font-family: "Myriad Pro", Arial, Helvetica, sans-serif; line-height: 120%; }



.project {
  width: 960px;
  margin: 0 0 8px 0;	
  padding: 8px 0 16px 0;
  color: #a8a8a8;
  background: #444;
  -moz-border-radius: 8px; -webkit-border-radius: 8px;
}

.project h3 {
  margin: 0 16px !important;
  color: #a8a8a8;
  font-size: 16px;
}

.project p {
  margin: 0 16px !important;
}

.project:hover { background: #555; }
.project:hover h3, .project:hover p { color: #fff; }







#flicks, #twitpics {
  margin: 0 0 1em 0;
  padding: 0 0 0 4px;
  clear: both;
}

#flicks a.pic, #twitpics a.pic {
  display: block;
  float: left;
  height: 75px;
  width: 75px;
  margin: 0 15px 12px 0;
  border: 8px solid #fff !important;
}








/* News & Updates */

#news, #tweets { margin: 0 0 20px 0 !important; }
#tweets ul { list-style: none; }
#tweets li { display: inline; }

.update {
   width: 200px;
   margin: 0 40px 0 0;
   float: left;
   overflow: hidden;
   border: 0px dotted #ccc;
}

@-moz-document url-prefix() {
.update { margin: 0 52px 0 0; }
}

.update.last, .update_time.last, #tweets li:last-child div {
   margin-right: 0;
}

.update_time, .update_title {
  display: block;
  width: auto;
  margin: 0;
  padding: 0 0 5px 0;
  font-size: 0.8em;
  border-bottom: 1px solid #555;
}

.update_title { font-weight: bold; }

.update_text {
   margin: 0 0 10px 0;
   margin-top: 8px;
}





/* Page Footer 
------------------------------------------------- */

#footer { 
  padding: 4em 0;
  text-align: center;   
  color: #777;
  background: #000; 
  border-top: 1px solid #555;
}
 
#footer * { text-align:left }

#attribution {
  width: 960px;
  margin: 0 auto;
  line-height: 1.5em;
  font-size: 0.75em;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}

#footer a { color: #777; text-decoration: none; }
#footer a:hover { color: #fff; text-decoration: none; }