body {
background:#273248 url(images/grid.gif) repeat;
margin:0;
padding:0;
font-family:Arial, sans-serif;
height:100%; /** so the #container div can have height:100% in firefox **/
}
html {
height:100%; /** so the #container div can have height:100% in firefox **/
}
* html #container{height:100%;}/* ie6 and under*/

* { /* global */
margin:0;
padding:0;
}
#container {
margin:0 auto;
padding:0;
width:780px;
height:auto; /** combined wtih ie6 hack, 100% heights and min-height below to stop div from breaking at the bottom of 1200px+ high monitors in firefox**/
min-height:100%; /** same as above **/
background:#000 url(images/bg-squares.gif) top no-repeat;
text-align:center;
border:1px solid transparent;
position:relative;
}
#callout {
margin:132px auto 0 auto;
padding:0;
background-color:#7F8AA2;
height:auto;
width:740px;
}
#recent {
margin:20px;
padding:0;
height:250px;
width:740px;
background-color:#273248;
overflow:hidden; /** keeps the .maintext's line height from expanding the box in IE6**/
}
#recentwork {
margin:10px;
float:left;
display:inline;
width:375px;
height:230px;
background-color:#7F8AA2;
overflow:hidden; /** fixes a weird 3px difference in height in IE6**/
}
#recentwork a img{
margin:10px;
border:0;
}

#recenttext {
margin:7px 5px 0 0;
float:right;
width:335px;
height:230px;
text-align:left;
}
#homeleftbox {
width:380px;
height:100px;
margin:0 8px 0 20px;
float:left;
display:inline;
background-color:#273248;
}
#homeleftboxthumb {
width:95px;
height:80px;
float:left;
display:inline;
margin:10px;
}
#homeleftboxtext {
width:255px;
height:80px;
float:right;
display:inline;
margin:5px 10px 10px 0;
}
#homerightbox {
width:345px;
height:100px;
margin:0 20px 0 7px;
float:right;
display:inline;
background-color:#273248;
}
#homerightboxtext {
width:325px;
height:80px;
margin:10px;
}
#clearfloat {
clear:both;
width:740px;
margin:0 auto;
}
#copyrightbox {
width:740px;
height:24px;
margin:0 auto 10px auto;
border:1px solid #273248;
background-color:#000;
position:relative;
}
#copyrightbox img {
border:0;
top:5px;
right:5px;
position:absolute;
background-color:transparent;
}
#copyrightbox a {
border:0;
}
#aboutleftbox {
width:340px;
height:auto;
margin:20px 8px 0 20px;
float:left;
display:inline;
background-color:#273248;
text-align:left;
padding:20px;
}
#abouttopright {
width:325px;
padding:10px;
height:auto;
margin:20px 20px 0 7px;
float:right;
display:inline;
background-color:#273248;
text-align:left;
}
#aboutbottomright {
width:323px;
padding:10px;
height:auto;
margin:20px 20px 0 7px;
float:right;
display:inline;
background-color:#000;
text-align:left;
border:1px solid #7F8AA2;
}
.project-col {
float:left;
clear:right;
width:170px;
margin:0;
}
#titlebox {
height:auto;
width:740px;
margin:20px auto 0 auto;
padding:0;
}
#pgdescription {
height:auto;
width:740px;
margin:0 auto 10px auto;
padding:0;
display:inline;
}
.semitransparent {
height:auto;
position:relative;
top:0px;
left:0px;
width:740px;
display:none;
z-index: 2;
margin-bottom:10px;
}
/************** Menu Navigation ***************/
#nav {
width:340px;
float:right;
display:inline;
margin-right:20px;
padding:0;
list-style:none;
background-color:#7F8AA2;
}
#nav li {
display:inline;
margin:0;
padding:0;
}
#nav a {
width:auto;
margin:0;
padding:9px;
color:#273248;
background-color:#7F8AA2;
font-size:12px;
text-transform:uppercase;
text-decoration:none;
float:left;
display:block;
}
#nav a:hover {
background-color:#273248;
color:#7F8AA2;
}
#nav .current {
background-color:#F8981D;
}
/*********** text styles *************/
a:link, a:visited {
color:#7F8AA2;
background-color:transparent;
text-decoration:underline;
}
a:hover {
background-color:#7F8AA2;
color:#273248;
}
.callouttext {
font-family:Arial, sans-serif;
font-size:16px;
color:#273248;
line-height:24px;
text-align:left;
padding:10px 15px;
margin:0;
background-color:transparent;
}
.header1 {
font-size:20px;
font-weight:bold;
color:#F8981D;
text-align:left;
background-color:transparent;
}
.header2 {
font-size:14px;
font-weight:bold;
color:#F8981D;
text-align:left;
line-height:20px;
background-color:transparent;
}
.header3 {
font-size:14px;
font-weight:bold;
color:#F8981D;
text-align:left;
line-height:20px;
margin-top:10px;
background-color:transparent;
}
.header4 {
font-size:14px;
font-weight:bold;
color:#7F8AA2;
line-height:20px;
float:left;
background-color:transparent;
}
.header2 a, .header2 a:visited {
font-size:14px;
font-weight:bold;
color:#F8981D;
text-align:left;
text-decoration:underline;
background-color:transparent;
}
.desc {
font-size:12px;
color:#7F8AA2;
background-color:transparent;
}
.byproject, .byproject a, .byproject a:hover {
font-size:12px;
line-height:24px;
color:#7F8AA2;
text-align:right;
text-decoration:underline;
background-color:#000;
background-color:transparent;
}
.maintext {
font-size:12px;
line-height:24px;
color:#7F8AA2;
background-color:transparent;
}
.boxtext {
font-size:12px;
line-height:18px;
color:#7F8AA2;
text-align:left;
background-color:transparent;
}
.copyright {
font-size:9px;
color:#273248;
text-align:left;
margin:6px;
background-color:transparent;
}
.byline {
font-size: 12px;
color:#7F8AA2;
text-align:right;
font-style:italic;
background-color:transparent;
}
.maintext li {
font-size:12px;
line-height:24px;
color:#7F8AA2;
margin-left:40px;
list-style-type:square;
background-color:transparent;
}
.projectlist li {
font-size:12px;
line-height:24px;
color:#7F8AA2;
margin-left:15px;
list-style-type:square;
background-color:transparent;
}