/** 
 * Main Layout File
 */
 
/* ################ RESET ################ */

* { margin: 0; outline: 0; }

/* So you don't unpad certain form elements in some browsers */
html, head, body,
h1, h2, h3, h4, h5, h6, p, blockquote, q, address, cite,
ul, ol, li, dl, dt, dd,
img,
form, legend, fieldset, label,
table, tr, thead, tbody, tfoot, th, td, caption,
em, strong, pre, sup, sub, del, ins, code, dfn, kbd, samp, var, big, small {
    padding: 0;
}

/**
  * IE/WIn does not support automatic quoting of q tag.
  * Must add quote entities manually OUTSIDE of the <q> tags.
  */
q:before,
q:after {
    content: "";
}

html>body abbr[title],
* html abbr {
    border: 0;
    cursor: help;
    font-style: normal;
}

img { border: 0; }

:focus { outline: none; }

address { font-style: normal; }

/* ################ LAYOUT ################ */

body {
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    background-color: #999;
}

#page {
    width: 900px;
    margin: 0 auto;
    text-align: left;
    border: solid #191A3A;
    border-width: 0 0 7px 0;
}

#header {
    width: 900px;
    height: 119px;
    background: url(../images/img_masthead.jpg) no-repeat top left;
    overflow: hidden;
}

#topnav {
    float: left;
    display: inline;
    border: solid #FFF;
    border-width: 0 1px;
    width: 898px;
}

#body, #footer { background-color: #FFF; }

#body {
    clear: both;
    padding: 20px 0;
}

#body .inner {
    margin: 0 20px;
}

#footer {
    float: left;
    display: inline;
    width: 900px;
}

/* ################ BLOCK CLASSES ################ */

/* ========== COLUMNS ========== */
.column {
    float: left;
    display: inline;
}

.column_3 {
    width: 273px;
    margin-left: 20px;
}

.Project #content {
    width: 480px;
    margin-right: 40px;
}

.Project #project_pieces {
    width: 340px;
}

.ImageDetail #image_detail {
    width: 504px;
    margin-right: 20px;
    overflow: hidden;
}

.ImageDetail #content {
    width: 336px;
}

/* ========== ENTRIES ========== */

.entry {
    margin-bottom: 18px;
    clear: both;
}

.entry .thumbnail {
    float: left;
    margin-right: 10px;
    overflow: hidden;
    width: 64px;
    height: 49px;
}

.entry .thumbnail img {
    border: 2px solid #999;
}

/* ################ SECTION STYLES ################ */

/* ========== HEADER ========== */

#header * {
    color: #CC9933;
    background-color: #191A3A;
}

#header #wrapper {
    visibility: hidden;
}

/* ========== NAV ========== */

.nav,
.nav ul,
.nav li,
.nav a {
    float: left;
    display: inline;
}

.nav a {
    text-decoration: none;
    text-transform: uppercase;
    font-size: 11px;
    padding: 5px 20px;
}

.nav a.current,
.nav a.section {
    color: #C2202B !important;
}

.nav a:link,
.nav a:visited {}

.nav a:hover {}

#topnav .nav a {
    text-align: center;
    background-color: #999;
    color: #FFF;
}

#topnav .nav a.current,
#topnav .nav a.section {
    background-color: #FFF;
}

#footer .nav a {
    color: #999;
    padding-right: 0;
}

/* ################ BODY ################ */

#breadcrumbs p {
    color: #999;
}

#title {
    margin-bottom: 18px;
}

#image_detail img { border: 2px solid #999; }

.prev_next {
    clear: both;
}

.prev_next .prev { margin-right: 10px; }

/* ################ FOOTER ################ */

#footer #copyright {
    float: right;
    margin-right: 20px;
    font-size: 11px;
    color: #999;
}

/* ################ PAGE SPECIFIC ################ */

#page .ProjectHolder .inner { margin: 0; }

#project_pieces .entry p a {
    color: #999;
    text-transform: uppercase;
}

/* ################ UTILITY/OTHER CLASSES ################ */

.clear {
    clear: both;
    height: 1px;
    overflow: hidden;
}