* { margin: 0; padding: 0;}
body { background-color: #999; color: #666; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: .8em; text-align: left;}

/* Links
--------------------------------------------------------------------------------- */
a:link { color: #072b61; text-decoration: underline;}
a:visited { color: #57799C; text-decoration: underline;}
a:hover { text-decoration: none;}
a:active { color: #072b61; text-decoration: underline;}

/* Image Links
--------------------------------------------------------------------------------- */
a:link img { border: 1px solid #999;}
a:visited img { border: 1px solid #999;}
a:hover img { text-decoration: none;}
a:active img { border: 1px solid #999;}

/* h1,h2,h3,h4,h5,h6,p,img,table
--------------------------------------------------------------------------------- */
h1 { font-size: 1.8em; margin: 0 0 .5em 0;}
h2 { font-size: 1.4em; margin: .5em 0;}
h3 { font-size: 1.2em; margin: .5em 0;}
h4 { font-size: 1em; line-height: 1.2em; margin: .5em 0;}
h5 { line-height: 1.2em; margin: 0 0 .5em 0;} /* small text bold by default (captions, etc..) */
h6 { line-height: 1.2em; font-weight: normal; margin: 0 0 1em 0;} /* small text (captions, etc..) */
p { line-height: 1.4em; margin: 1em 0;}
blockquote { line-height: 1.4em; margin: 0 0 1em 0; padding: 0 1.5em;}
table { margin: 0 0 1em 0; width: 100%;}

/* Container
--------------------------------------------------------------------------------- */
#container { background-color: #FFF; border-bottom: 1px solid #666; border-left: 1px solid #666; border-right: 1px solid #666; margin: 0 auto; position: relative; width: 768px;}

/* Head
----------------------------------------- */
#head { position: absolute; top: 0; width: 768px; z-index: 99;}
#head h1 { border-left: 1px solid #999; clear: right; color: #999; font-size: 18px; padding: 0 0 0 5px; position: absolute; top: 8px; left: 55px; text-transform: uppercase;}
#head h2 { margin: 0; padding: 0; width: 60px; position: absolute; top: 7px;}
#head h4 { color: #999; float: left; margin: 8px 0 0 5px;}
#head img { border: none;}

/* Menu
----------------------------------------- */
#menu ul { border-bottom: 1px solid #666; float: right;}
#menu li { border-left: 1px solid #666; float: left; list-style: none;}
#menu li:hover ul, #menu li.sfhover ul { left: auto;}
#menu li li { float: none; border-left: 0;}
#menu li a { color: #666; display: block; font-weight: bold; padding: 6px 1em 5px 1em; text-align: center; text-decoration: none;}
#menu li li a { padding: 4px 0;}
#menu li a:hover { color: #fff; background: #666;}

/* Masthead
----------------------------------------- */
#masthead { background-color: #E5E4E4; border-bottom: 1px solid #666; width: 768px; height: 37px;}
#masthead .search { margin: 6px 5px 0 0; position: absolute; top: 0; right: 0;}

/* Wrap
----------------------------------------- */
#wrap { padding: 8em 10px 0 10px; position: relative; width: 748px;}

/* Content
----------------------------------------- */
#content { float: left; padding: 0; margin: 0 0 1em 0; width: 100%;}
#content p { text-align: justify;}
#content td td p { text-align: left;}
#content ul,ol { margin: 0 1em 1em 1em;}
#content ol ol li { margin: 0 1.8em .3em 1.8em;}
#content ul ul li { margin: 0 1.8em .3em 1.8em;}
#content li { margin: 0 1.5em .8em 1.5em;}
#content img { margin: 0 0 .5em 0;}
#content img { border: 1px solid;}

/* Categories
----------------------------------------- */
#categories { background-color: #E5E4E4; border-bottom: 1px solid #666;}
#categories h3 { background-color: #666; color: #FFF; padding: 3px;}
#categories ul { list-style: none; margin: 0 0 1.2em 0; padding: .5em 1em;}
#categories li { font-weight: bold; margin: 0 0 1em 0;}

/* Table Classes Homepage
----------------------------------------- */
table.fourColumn { margin: 1em 0 0 0; width: 748px;}
table.fourColumn img { border: 1px solid #ccc;}
table td.fourColumn01,table td.fourColumn02,table td.fourColumn03 { padding: 0 3px 0 0; vertical-align: top;}
table td.fourColumn01 h2,table td.fourColumn02 h2,table td.fourColumn03 h2 { border-bottom: 0;}
table td.fourColumn04 { padding: 0; vertical-align: top;}
table td.fourColumn04 h2 { border-bottom: 0;}

/* Table Classes
----------------------------------------- */
.contentArea { padding: 0 0 0 10px;}

/* Table Classes Index pages
----------------------------------------- */
table.indexpages td { padding: 3px; vertical-align: top; width: 33%;}
table.indexpages td h2 { background-color: #ccc; border: 1px solid #666; padding: 3px;}

/* Footer
----------------------------------------- */
#footer { background-color: #E5E4E4; border-bottom: 1px solid #666; border-top: 1px solid #666; clear: both; margin: 1em 0 0 0;}
#footer h6 { text-align: center;}
#footer p { font-size: .75em; padding: 1em 0 1em 0; text-align: center;}

/* Product Support
----------------------------------------- */
#productSupport { margin: 0 auto; padding: 5px 10px; width: 748px;}
#productSupport ul { margin: 0 0 0 1.8em;}
#productSupport li a { color: #666;}


/* USEFUL Classes
----------------------------------------- */
.center { text-align: center;}
.noBorder { border: none;}
#content img.noBorder { border: none;}
ul.listStyleNone { font-weight: bold; list-style: none;}
.acrobatReader { list-style: url(/pix/zzContentGuidesTemplateGraphics/AcrobatReaderIconLI.gif);}
.flashPlayer { list-style: url(/pix/zzContentGuidesTemplateGraphics/FlashPlayerIconLI.gif);}
.nd { display: none;}
.clearthis { clear: both;} /* (this is the code you will use) <div class="clearthis"><!-- this div is not floated and its clear property is set to both --></div> */
a.backtotop,a.backtotop:link,a.backtotop:visited,a.backtotop:active { border: 1px solid #b4bac2; color: #666; font-size: .75em; left: 723px; padding: 1px 3px; position: relative; top: 23px; text-decoration: none;}
a.backtotop:hover { background: #666; color: #fff;}

/* Alphabet */
#content ul.alphabetArtLibrary { float: left; font-weight: bold; list-style: none; margin: 0 0 0 59px; padding: 0; text-align: center; display: inline;}
#content ul.alphabetArtLibrary li { float: left; margin: 0; padding: .5em 1em .5em 0;}

.product2column td { border: 1px solid #ccc; padding: .5em; width: 50%;}
.product3column th { background: #ccc; padding: .5em; width: 33%;}
.product3column td { border: 1px solid #ccc; padding: .5em; width: 33%;}
.product4column th { background: #ccc; padding: .5em; width: 25%;}
.product4column td { border: 1px solid #ccc; padding: .5em; width: 25%;}
.product5column th { background: #ccc; padding: .5em; width: 20%;}
.product5column td { border: 1px solid #ccc; padding: .5em; width: 20%;}
.product6column th { background: #ccc; padding: .5em; width: 16%;}
.product6column td { border: 1px solid #ccc; padding: .5em; width: 16%;}
.product8column th { background: #ccc; padding: .5em; width: 12%;}
.product8column td { border: 1px solid #ccc; padding: .5em; width: 12%;}