/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~ GLOBAL SELECTORS AND SUCH ~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body
{
  margin: 0;
  padding: 0;
}

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  _zoom: 1;
  .min-height: 1%;
  clear: both;
  visibility: hidden;
}


html > body {overflow: auto}

a:link, a:visited, a:active, a:hover
{
  text-decoration: none;
  color: #666699;
}

a:hover {text-decoration: underline}

h1, h3, h6, p, div
{
  font-family: "Century Gothic", helvetica, arial, sans-serif;
  font-size: 10pt;
  color: #333366;
  line-height: 13pt;
}

h1, h3, h6 {margin: 0}

img {border: 0}

.hidden
{
  font-size: 1px;
  visibility: hidden;
}

.text-indent {text-indent: 9pt}

.border-bottom
{
  width: 100%;
  border-bottom: 2px solid #333366;
}

#content > div.extra-space {height: 10px}

#content ul {text-align: left}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~ MAIN CONTENT AREA ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#container
{
  position: absolute;
  top: 0;
  left: 50%;
  width: 640px;
  height: 100%;
  _height: auto;
  min-height: 550px;
  margin-left: -320px;
  z-index: 2;
  background: #dddddd;
}

#header
{
  position: absolute;
  top: 0;
  left: 0;
  width: 640px;
  height: 85px;
  margin: 0;
  background: #BFD6EA;
}

#schneider_design
{
    background-color: #ffffff;
  position: absolute;
  top: 25px;
  left: 0;
  width: 640px;
  height: 60px;
  text-indent: -999em;
  margin: 0;
}

#schneider_design a {
  background: url(images/home_03.gif) no-repeat 0 7px;
  display: block;
  height: 50px;
  overflow: hidden;
  width: 230px;
  }

#flash
{
  position: absolute;
  _position: relative;
  top: 97px;
  left: 12px;
  z-index: 10;
  width: 616px;
  height: 188px;
  margin: 0;
  background: url(images/works_bg.jpg) no-repeat top left;
}

#content-wrapper
{
  position: absolute;
  _position: relative;
  top: 297px;
  _top: 110px;
  left: 12px;
  bottom: 97px;
  width: 616px;
  margin: 0;
  padding: 0 0 10px 0;
  background: #BFD6EA url(images/screen.gif) no-repeat top left;
}

#content
{
  position: absolute;
  _position: relative;
  _left: 265px;
  top: 5px;
  right: 5px;
  bottom: 10px;
  width: 340px;
  margin: 0;
  padding: 0 10px 0 0;
  _padding: 0;
  overflow: auto;
  text-align: justify;
}

#view_project_info
{
  display: none;
  position: absolute;
  left: 50px;
    top: 0;
  width:110px;
  height: 20px;
}

.project-info
{
  position: absolute;
  left: 50%;
    top: 95px;
  margin-left: 196px;
  z-index: -100;
}

.project-info-content
{
  position: absolute;
  left: -100px;
    top: 35px;
  width: 175px;
  padding: 10px;
  background: url(images/transparent.png);
  border: 1px solid #000000;
  visibility: hidden;
  font-family: helvetica, verdana, arial, sans-serif;
  font-size: 8pt;
  color: #000000;
}

* html .project-info-content {background: #ffffff}
.project-info-button {border: 1px solid #ffffff}

#extra-white
{
  _display: none;
  position: absolute;
  width: 640px;
  height: 60px;
  background: #ffffff;
}

#container > #extra-white {bottom: 25px}

#footer
{
  position: absolute;
  _position: relative;
  width: 640px;
  height: 25px;
  margin: 122px 0 0 0;
  background: #BFD6EA;
}

#container > #footer {bottom: 0}

#footer #address
{
  margin: 5px 0 0 0;
  width: 640px;
  text-align: center;
  font-weight: bold;
}

#extra-container
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 550px;
  margin: 0;
  padding: 0;
  z-index: 1;
}

#extra-bar-top
{
  position: absolute;
  top: 0;
  width: 100%;
  height: 25px;
  background: #dddddd;
}

#extra-bar-left
{
  _display: none;
  position: absolute;
  top: 85px;
  bottom: 85px;
  left: 0;
  width: 70px;
  background: #dddddd;
}

#extra-bar-right
{
  _display: none;
  position: absolute;
  top: 85px;
  bottom: 85px;
  right: 0;
  width: 70px;
  background: #dddddd;
}

#extra-bar-bottom
{
  _display: none;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 25px;
  background: #dddddd;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~  NAVIGATION ~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#nav
{
  position: absolute;
  top: 55px;
  right: 2px;
  width: 250px;
  height: 20px;
  margin: 0;
}

#nav a {border: 0}

#nav
{
  margin:  0;
  padding: 0;
  list-style: none;
}

#nav li
{
  display: block;
  float: left;
  margin:  0;
  padding: 0;
}

#nav-home
{
  display: block;
  width: 51px;
  height: 20px;
  background: url(images/nav_home.gif) left top no-repeat;
}

#nav-services
{
  display: block;
  width: 67px;
  height: 20px;
  background: url(images/nav_services.gif) left top no-repeat;
}

#nav-port
{
  display: block;
  width: 70px;
  height: 20px;
  background: url(images/nav_port.gif) left top no-repeat;
}

#nav-contact
{
  display: block;
  width: 62px;
  height: 20px;
  background: url(images/nav_contact.gif) left top no-repeat;
}

#nav a:hover {text-decoration: none}

#nav #nav-home:hover,
#nav #nav-services:hover,
#nav #nav-port:hover,
#nav #nav-contact:hover
{
  background-position: 0 -20px;
}

.no_bullet li {
  list-style: none;
  }

dt { font-weight: bold }
dd { margin: 0 }

/* Work specific page */
#works #container {
  height: auto;
  left: auto;
  margin: 0 auto;
  min-height: 0;
  position: relative;
  }

#works #header {
  position: relative;
  }

#works #schneider_design {
  position: relative;
  }

#works #nav {
  float: right;
  }

#works #flash {
  background-image: none;
  border-bottom: 10px solid #DDD;
  border-top: 10px solid #DDD;
  left: 0;
  overflow: hidden;
  position: relative;
  top: 0;
  width: auto;
  z-index: 1;
  }

#works #flash img {
  display: block;
  margin: 0 auto;
  position: relative;
  width: 616px;
  }

#works #content-wrapper {
  position: relative;
  top: 0;
  bottom: auto;
  }

#works #content {
  bottom: auto;
  overflow: hidden;
  position: relative;
  top: 0;
  width: auto;
  }

#works #sidebar {
  float: left;
  width: 240px;
  }

#works #primary {
  margin-left: 260px;
  width: 340px;
  }

#works #primary .work_image {
  margin-top: 1em;
}

#works #primary .work_image img {
  display: block;
  margin: 0 auto;
  }

#works #primary .image_list li {
  display: block;
  list-style: none;
  float: left;
  height: 60px;
  overflow: hidden;
  margin: 0 1.5em 1.5em 0;
  width: 60px;
  }

#works #primary .image_list img {
  cursor: pointer;
  display: block;
  margin: 0 auto;
  }

#works #extra-white {
  bottom: auto;
  height: 0;
  position: relative;
  }

#works #footer {
  margin: 0;
  position: relative;
  }

#extra-container {
  display: none;
  }

#works #extra-container {
  position: relative;
  }

#works #extra-bar-bottom {
  position: relative;
  bottom: 25px;
  }

#works #extra-bar-left,
#works #extra-bar-right {
  height: 100%;
  }