/* ----------------------------------------------------------
File: dux.css
Site: dux.interlopers.net
Author: Simon Smith - http://www.blink-design.net
Version: 1.0
--------------------------------------------------------------*/

/* Imports ------------------------------------------*/ 
@import url(resets.css);
@import url(hs.css);

/* Body settings ------------------------------------------*/ 
body {
background-color: #232323;
text-align: center;
font: 62.5% Verdana, Tahoma, Arial, sans-serif;
}

html {
overflow: scroll;
}

/* Container ------------------------------------------*/ 
#wrap {
width: 660px;
margin: 20px auto;
text-align: left;
}

/* Used in case UAs decide to render strong & em differently */
strong { font-weight: bold; font-style: normal;} 
em { font-style: italic; } 

/* Clear fix ----------------------------------------*/
#heading:after, #nav:after, .map ul:after  {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

/* Heading  ------------------------------------------*/
#heading {
border-bottom: 1px solid #ddd;
padding-bottom: 10px;
}

#heading h1 {
font: 3.2em Helvetica, Tahoma, Verdana, Arial, sans-serif;
color: #ddd;
}

#heading h2 {
float: left;
margin-top: -5px;
font: 1.8em Helvetica, Tahoma, Verdana, Arial, sans-serif;
color: #016fe0;
word-spacing: 7px;
}

#heading p {
background: url(../images/site/email.gif) no-repeat 0 -1px;
float: right;
letter-spacing: 1px;
}

#heading a {
color: #ddd;
padding-left: 22px;
}

#heading a:hover { color: #016fe0; }

/* Navigation  ------------------------------------------*/
#nav {
margin: 20px 0;
font-size: 1.2em;
}

#nav li { 
width: 258px;
text-align: center;
float: left;
letter-spacing: 1px;
}

#nav li.first {
text-align: left;
width: 200px;
border-right: 1px solid #ddd;
}

#nav li.last {
text-align: right;
width: 200px;
border-left: 1px solid #ddd;
}

#nav li a { color: #ddd; }
#nav li a:hover { color: #016fe0; }

#nav li a.current { 
border-bottom: 1px dotted;
padding-bottom: 2px;
}

/* Top message box  ------------------------------------------*/
#message {
background-color: #2b2b2b;
padding: 15px;
border: 1px solid #363636;
margin-bottom: 55px;
}

#message h3 {
font-size: 1.6em;
color: #ddd;
}

#message h4 {
font-size: 1.2em;
color: #ddd;
margin: 15px 0;
}

#message p {
font-size: 1.1em;
margin-top: 10px;
color: #ddd;
line-height: 1.4;
}

#message a { 
color: #eee;
text-decoration: underline;
}

#message a:hover { color: #016fe0; }

#message ul {
list-style-type: disc;
color: #ddd;
font-size: 1.1em;
line-height: 1.5;
margin: 10px 0 10px 25px;
}

#message p.large {
font-size: 2em;
text-align: center;
}

/* Content images ------------------------------------------*/
.map li.description {
background-color: #2b2b2b;
padding: 15px;
border: 1px solid #363636;
margin-bottom: 10px;
}

.map li.description h3 {
font-size: 1.4em;
color: #ddd;
}

.map li.description p {
font-size: 1.1em;
margin-top: 10px;
color: #ddd;
line-height: 1.4;
}

.map ul { margin: 0 0 45px 20px; }

.map ul li {
float: left;
width: 200px;
margin: 8px 10px 0 0;
}

.map ul li img { border: 1px solid #363636; }
.map li.description a { color: #016fe0; }
.map li.description a:hover { color: #6babed; text-decoration: underline; }

.map li.description p.download {
background: url(../images/site/server_go.gif) no-repeat 0 1px;
margin-top: 25px;
}

.map li.description p.download a {
font-size: 1.2em;
text-decoration: none;
color: #b76d6d;
padding-left: 22px;
}

.map li.description p.download a:hover { color: #eee; }

/* CV ------------------------------------------*/
#message .cv h4 {
font-weight: bold;
font-size: 1.2em;
margin-top: 40px;
}

#message .cv ul.list { font-size: 1.2em; }
#message .cv ul.list li { margin-top: 8px; }

#message .cv ul li h4 {
font-weight: normal;
font-size: 1.4em;
margin: 20px 0 6px 0;
}

#message .cv ul li p { margin-top: 4px; }
#message .cv  { font-size: 0.9em; }
#message .cv a { color: #016fe0; text-decoration: none; }
#message .cv a:hover { color: #6babed; }

/* Footer ------------------------------------------*/
#footer { text-align: center; }

#footer li {
color: #474747;
font-size: 1.1em;
display: inline;
margin-right: 15px;
}

#footer li a { color: #80237d;}
#footer li a:hover { color: #650462; }