/* much of the layout code below ccame from Claire Campbell's CSS work at http://www.tanfa.co.uk/css/layouts/flexi-floats-3col.asp */
* {
margin: 0; padding: 0; border: 0;
}
body {
text-align: left; 
background-color: #FFFFFF;
min-width: 740px;
}
/* wrapper holds left faux column tab */
/* nn6/7 will put content out of scrollable reach if auto is used unless the min-width is on body */
#wrapper { 
text-align: left;
width: 100%;
margin: 0 auto;
}
#header {
background-color: #758CA3;
clear: both; 
width: 100%;
text-align: right;
border-bottom: 0px solid #FFFFFF;
height: 108px;
margin-bottom: 0px;
padding:: 0px;
vertical-align: bottom;
}
#contentfloatholder { /* right faux column tab */
float: left;
width: 100%;
}
#contentfloatholder:after { /* this is for NN6 to clear floats */
content: "."; 
display: block; 
height: 0px;
clear: both; 
visibility: hidden;
}
#content {
margin: 35px 15px 0 205px;
padding: 30px;
border-left: 6px solid #758CA3;
}
#contenttitle {
position: absolute;
top: 108px;
left: 205px;
border-left: 6px solid #758CA3;
padding-left: 25px;
padding-top: 10px;
margin-bottom: 50px;
}
#contentScreenshots {
margin: 40px 305px 0 205px;
padding: 30px;
border-left: 6px solid #758CA3;
}
#contentwrap {
float:left;
width: 100%; 
margin: 0px -95% 0 0;
}
#nav {
float: left;
width: 160px;
margin: 0 0 0 -5%;
padding: 35px 0 25px 25px;
}
#screenshots {
float:right;
width: 300px;
margin: 0;
padding-top: 45px;
padding-right: 15px;
background-color: #FFFFFF;
text-align: right;
vertical-align: top;
}
/* The following style is a hack for IE to fix the right-side padding for screenshots. */
* html #screenshots,#screenshots ul {
margin-right: -8px ! important;
}
#experience h3 {
padding-bottom: 0;
margin-bottom: 0;
}
#experience p {
padding-top: 0;
margin-top: 0;
}
/************* IE Mac CSS Only  works for Win too **************/
* html div#centerwrap {
margin: 0 -100% 0 0;
}
* html div#left {
margin: 0;
}
div h3, div p {
margin: 1em 0;
padding: 0 20px;
}
#wrapper {word-wrap: break-word;} /* ie proprietary property to force long words to break rather than the layout */
/* styles from old stylesheet */
h1 {
margin-bottom: 0px;
padding-bottom: 0px;
padding-top: 62px;
padding-right: 30px;
font-weight: bolder;
letter-spacing: -1px;
font-family: Arial, Helvetica, sans-serif;
font-size: 50px;
color: #FFFFFF;
}
h1 a {
color: #FFFFFF;
text-decoration: none;
}
h1 a:hover {
color: #C0C0C0;
text-decoration: none;
}
h1 a:visited {
color: #FFFFFF;
text-decoration: none;
}
h1 a:visited:hover {
color: #C0C0C0;
text-decoration: none;
}
h2 {
text-align: left;
margin: 0;
padding: 25px 30px 0 25px;
color: #6B8FAA;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 125%;
letter-spacing: .06em;
}
h2 a {
color: #6B8FAA;
text-decoration: none;
}
h2 a:hover {
color: #999999;
text-decoration: none;
}
h2 a:visited {
color: #6B8FAA;
text-decoration: none;
}
h2 a:visited:hover {
color: #999999;
text-decoration: none;
}
.more a {
text-decoration: none;
color: #999999;
font-size: 80%;
padding-left: 10px;
}
.more a:hover {
color: #FF3366;
}
.more a:visited:hover {
color: #FF3366;
}
h3 {
text-align: left;
margin: 0 30px 0 0;
padding: 20px 0 0 280px;
color: #354755;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
letter-spacing: .06em;
font-weight: 700;
}
p {
text-align: left;
margin: 0 0 10px 0;
padding: 0px 30px 0px 280px;
color: #354755;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
line-height: 18px;
}
p.sample {
margin-top: -12px;
}
p.note {
color: #000000; 
border: 1px solid silver;
padding: 3px;
margin-right: 30px;
margin-left: 15px;
}
/* list styles */
ul {
list-style-type: circle;
text-align: left;
padding-top: 0;
padding-bottom: 5px;
margin: -8px 30px 0 25px;
color: #354755;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
}
ul.no_bullet {
list-style-type: none;
}
ul.no_bullet li {
padding-bottom: 5px;
}
li {
margin: 0 30px 1px 25px;
}
ul.sample {
margin-top: -8px;
}
ul.sample li {
margin-top: 2px;
margin-bottom: 3px;
font-size: 98%;
}
/* styles for nav list */
#nav ul {
margin: 0 0 5px 8px;
padding: 0 0 0 5px;
}
#nav li {
margin: 0;
padding: 6px 2px 0px 0;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
list-style-type: none;
color: #AFCACA;
line-height: 95%;
}
#nav li a {
text-decoration: none;
padding: 0px 0px 3px 0px;
color: #555555;
}
#nav li a:hover {
color: #0000FF !important;
font-weight: normal;
}
#nav li a:visited {
color: #999999;
}
#nav li a:visited:hover {
color: #999999;
font-weight: normal;
}
#nav li.button {
margin-left: -13px;
}
#nav li a:visited:hover {
color: #2D2D2D;
}
/* screenshot thumbnails */
#screenshots ul {
list-style-type: none;
}
#screenshots ul li {
margin-left: 0;
padding-left: 0;
}
#screenshots ul li.caption {
font-size: 95%;
color: #555555;
}
/* links */
a {
color: #3333CC;
text-decoration: none;
}
a:hover {
color: #999999;
text-decoration: underline;
}
a:visited {
color: purple;
text-decoration: none;
}
a:hover {
color: #999999;
text-decoration: underline;
}
/* wikipedia styled external links */
a.external {
   background: url(../graphics/external.png) center right no-repeat;
   padding-right: 12px;
}
a.external:visited {
   background: url(../graphics/external-visited.png) center right no-repeat;
   padding-right: 12px;
}
a.external:hover {
   background: url(../graphics/external-hover.png) center right no-repeat;
   padding-right: 12px;
}