/* CSS Document for benramey.com */

/***************************************
  ELEMENT STYLES
  ***********************************/
body {
  margin: 0px;
  font-family: Arial;
  background-color: black;
  text-align: left;
}
h1 {
  margin: 0px;
  padding: 0px 0px 5px;
}
h1 a {
  display: block;
  background: url(/site/graphics/logo.jpg) right top no-repeat;
  margin: 0px auto;
  width: 600px;
  height: 100px;
  text-indent: -10000px;
}
h2,h3,p,ul {
  width: 600px;
  margin-left: auto;
  margin-right: auto;
}
h2 {
  margin: 0px auto;
  padding: 5px 0px 0px;
  font-size: 1.8em;
} 
h3 {
  margin-bottom: 2px;
  padding: 5px 4px 0px;
  font-size: 1.1em;
  font-weight: normal;
  border-bottom: solid 1px #cfcfcf;
}
p {
  margin: 2px auto 10px;
  color: #333333;
}
img {
  border: 0px;
}
#footer a:link {
  text-decoration: none;
  color: #cccccc;
}
#footer a:visited {
  text-decoration: none;
  color: #999999;
}
#footer a:hover {
  text-decoration: underline;
  color: #999999;
}

/***************************************
  HEADER STYLES
  ***********************************/
#header {
  text-align: center;
  background: url(/site/graphics/bg_stripe.jpg) bottom repeat-x black;
}
#menu {
  padding: 0px;
  text-align: left;
  background: url(/site/graphics/bg_bw_gradient_bottom.jpg) bottom repeat-x black;
  border-bottom: 1px solid black;
  font-size: 1em;
}
  #menu a {
    display: block;
    float: left;
    margin: 0px;
    padding: 6px 15px 10px;
    font-variant: small-caps;
    font-size: 1.0em;
    text-decoration: none;
    color: #cfcfcf;
    background: transparent;
  }
  #menu a.active {
    background: black;
    color: white;
    border-bottom: white solid 2px;
  }
  #menu a:hover {
    background: black;
    color: white;
    border-bottom: white solid 2px;
  }
  #menu ul {
      position: relative;
      top: 5px;
    margin: 0px auto;
    padding: 0px;
    width: 600px;
    height: 34px;
    list-style-type: none;
  }
  #menu li {
      float: left;
    margin: 0px 2px;
    padding: 0px;
  }

/***************************************
  CONTENT STYLES
  ***********************************/
#content {
  height: 100%;
  padding: 15px 0px;
  background: url(/site/graphics/dropshadow_bottom.jpg) top repeat-x white;
  font-size: 0.9em;
}
  
/***************************************
  FOOTER STYLES
  ***********************************/
#footer {
  margin: 0px;
  text-align: center;
  border-top: solid 1px #cfcfcf;
  font-size: 0.8em;
  color: #999;
  padding: 10px 0px;
}
  #footer-nav {
    margin: 0px auto 5px;
    padding: 0px 0px 5px;
    width: 200px;
    border-bottom: 1px solid #333333;
  }
  #footer-external-nav {
    margin: 0px auto 5px;
    padding: 0px 0px 5px;
    width: 200px;
    border-bottom: 1px solid #333333;
  }
  #copyright {
    margin: 5px 0px;
  }
  #images {
    text-align: center;
    width: 600px;
    margin: 30px auto 0px;
  }
  #xhtml-banner {
    float: left;
    text-align: right;
    width: 45%;
  }
  #powweb-banner {
    float: right;
    text-align: left;
    width: 45%;
    border: none;
    color: #cccccc;
    text-decoration: none;
    font-size: 12px;
    font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
  }
  
/***************************************
  CONTENT LIST STYLES
  ***********************************/
.content-list {
  padding: 0px;
  width: 600px;
  margin: 10px auto;
  list-style-type: none;
}
  .content-list h3 {
    width: auto;
    padding-top: 0px;
  }
  .content-list p {
    width: auto;
    padding: 0px 210px 0px 5px;
    margin: 10px 0px;
  }
  ul#portfolio li {
    height: 200px;
    margin: 0px 0px 20px;
  }
  ul#contact li {
    margin: 0px 0px 20px;
  }
  ul#portfolio #pae {
    background: url(/site/graphics/screen_pae.jpg) right top transparent no-repeat;
  }
  ul#portfolio #walterick {
    background: url(/site/graphics/screen_walterick.jpg) right top transparent no-repeat;
    height: 270px;
  }
  ul#portfolio #jairus {
    background: url(/site/graphics/screen_jairus.jpg) right top transparent no-repeat;
  }
  ul#portfolio #dtn {
    background: url(/site/graphics/screen_dtn.jpg) right top transparent no-repeat;
  }
  ul#portfolio #bobsleigh {
    background: url(/site/graphics/screen_bobsleigh.jpg) right top transparent no-repeat;
  }
  ul#portfolio #fti {
    background: url(/site/graphics/screen_fti.jpg) right top transparent no-repeat;
  }