/*---------------------------
=RESET
----------------------------*/
h1,h2,h3,h4,h5,h6 { margin:0px; padding:0px; line-height:1.5em; }
ul,li,dl,dt,dd { margin:0px; padding:0px; list-style:none; list-style-type:none; }
a, a img { outline:none; border:none 0px; }
form { margin:0px; padding:0px; }
/*---------------------------
=LAYOUT
----------------------------*/
body { margin:0px; padding:0px; text-align:center; background:#fff url(bg.jpg) top left repeat-x; font-family:Trebuchet MS, Trebuchet, Helvetica, Arial, Sans-Serif; font-size:80%; }
.container { margin:0px auto; width:670px; text-align:left; }
.header { position:relative; height:133px; }
.about { position:relative; height:285px; margin-top:45px; line-height:2em;  }
.work { position:relative; height:500px; }
.skills { position:relative; height:210px; }
.contact { position:relative; height:680px; }
.footer { position:relative; font-size:.8em;}


.skills ul { position:relative; top:70px; float:left; width:100%; }
.skills ul li { float:left; width:105px; margin-bottom:10px; }

.work ul { position:relative; top:80px; float:left; width:100%; }
.work ul li { float:left; width:190px; height:90px; margin-right:43px; margin-bottom:40px; }
.work ul li a:link, .work ul li a:visited { display:block; width:186px; height:82px; border:#bebebe 4px solid;}
.work ul li a:hover { display:block; width:186px; height:82px; border:#8b8b8b 4px solid;}
.work ul li.last { margin-right:0px; }

.contact form { float:left; position:relative; top:80px; width:100%; }
.contact form fieldset { margin:10px 0px; border:none 0px; vertical-align:middle; }
.contact form input { display:inline; color:#666; font-size:11px; font-family:arial; }
.contact form input[type=text] { width:200px; }
.contact form textarea { width:200px; color:#666; font-size:11px; font-family:arial; }
.contact form label { display:inline-block; width:100px; padding-right:10px; float:left; }

h2.workSamples a { position:relative; top:40px; float:left; height:13px; width:110px; background:transparent url(workSamples.gif) left top no-repeat; }
h2.proficiencies a { position:relative; top:40px; float:left; height:13px; width:99px; background:transparent url(proficiencies.gif) left top no-repeat; }
h2.toolBox a { position:relative; top:40px; float:left; height:13px; width:68px; background:transparent url(toolBox.gif) left top no-repeat; }
h2.contactMe a { position:relative; top:40px; float:left; height:13px; width:88px; background:transparent url(contactMe.gif) left top no-repeat; }

#output {position:absolute;top:70px; color:#0000ff; }
/*---------------------------
=GLOBAL CLASS & SELECTORS
----------------------------*/
h1.logo { position:relative; top:90px; display:block; height:39px; width:169px; background:Transparent url(logo.gif) left top no-repeat; }
.clear { clear:both; }
.replaced { text-indent:-9999px; }
p { margin-top:2em; }
.left { float:left; }
.right { float:right; }
.half { width:48%; }
.valid { position:relative; top:-20px;  }
.reciprocate dl { margin-top:15px;  margin-bottom:15px;  }
.reciprocate dt,.reciprocate dd { display:inline; margin-right:15px;} 
.reciprocate { font-size:10px; }
.reciprocate  a { color:#000; }

/*---------------------------
=MODAL
----------------------------*/
#simplemodal-overlay {
  background-color:#000;
  cursor:wait;
}

#simplemodal-container {
  height:525px;
  width:600px;
  background-color:#fff;
  border:3px solid #ccc;
}

#simplemodal-container a.modalCloseImg {
  background:url(x.png) no-repeat;
  width:25px;
  height:29px;
  display:inline;
  z-index:3200;
  position:absolute;
  top:-14px;
  right:-18px;
  cursor:pointer;
}


.project { }
.description h3 { font-size:13px; font-weight:bold; }
.description p { margin:0 0 10px 0; }
.description p a { color:#666; }
.description { padding:10px; text-align:left; font-size:11px; border-top:#ccc 1px solid; }
.description .subnav dl { float:right; margin-right:10px; }
.subnav dl dt, .subnav dl dd { display:inline; }
.subnav dd a { color:#666; }
.subnav dd a.sel { color:#000; }