
    /* body width is so that on 1024x768 screens, some of the body background color shows as a border;
	it's also so that the pages aren't all weird and spread out on wide screens;
    800x600 screens have to scroll side-to-side and get none of the body background on the sides but that's the breaks */

body {margin:0 auto; background-color:#bdb76b; text-align:center; font-family:arial,sans-serif; width:850px; line-height:120%}

body.noborderimages img {border:0;}



    /* OUTER holds everything except h1 and footer, provides a background color for the navigation */   
div.outer {background-color:#CFE673; border-left:7px solid #598080; border-right:7px solid #598080;}
 
	/* CONTENT is a white box for (duh) the content, so it is inside OUTER and does not hold the navigation */
    /* content margin = navbar width to be flush, c.margin larger for border (or use padding in navbar?) */
div.content {background:white; margin:0 155px 0 0; padding:15px 40px; text-align:center;}
body.detail div.content {margin:0; padding:15px 20px; border-left:7px solid #598080; border-right:7px solid #598080; text-align:left;}

   
ul {text-align:left; list-style:disc; margin-left:35px;}
li {margin-top:3px;}
                        
    /* NAVIGATION */
div.navbar {float:right; width:150px; font-weight:bold;}
ul.nav {list-style:none; margin:10px 0 20px 0;}
ul.nav a {display:block; color:#2f4f4f; font-variant:small-caps; font-weight:normal; text-decoration:none;}
ul.nav a:hover {background:#598080; color:white;}

ul.contact {margin:20px 0 0 0; text-align:center; list-style:none; font-weight:normal; text-decoration:none;}

	/* ORDERLIST is for individual switch plate pages and book page */
ul.orderlist {list-style:none; margin-left:-10px;}
ul.orderlist li {margin:10px 0;}
ul.orderlist li img {vertical-align:bottom;}

				
	/* SQUEEZE is only used on the statement page, so it's not all spread wide */
.squeeze {margin: 10px 60px;}

	/* CLEARER ensures the content box is at least as long as the navbar; this came from alistapart.com */
.clearer {clear:both; line-height:0; height:0;}

.border {border:black solid 1px}

div.footer {margin:10px 0;}


h1 {text-align:center; margin:15px; font-variant:small-caps; font-family:"lithograph light",lithograph,arial,sans-serif;}
h2 {font-family:"times new roman",serif; font-style:italic; margin:0 0 12px 0;} /* swpl styles */
h3 {font-family:"times new roman",serif; font-style:italic; margin:0 0 6px 0;} /* titles and bylines */ 
h4 {text-align:left; margin:8px 0 0 0;} /* almost any other titles - bold */

a:link {color:#483D8B; text-decoration:none;}
a:visited {color:purple; text-decoration:none;}
a:hover {color:#B22222; text-decoration:none;}

p {text-align:left; margin:.7em 0;}
.copyright {font-size:small; text-align:center;}

.floatLeft {float:left; margin:5px 10px 5px 0;}
.floatRight {float:right; margin:5px 0 5px 10px;}  




     /* TABLE STUFF */
	 /* tables are used on these pages: (top level) clocks, fanpulls, switchplates, mywork, thebook, links, stores
	     (2nd level) tclocks, mirrors, kidsbook, fauxbook, all reg clocks, all switch plates, new (fanpulls)  */
        
td {padding:10px 10px; text-align:center;}
td.half {width:50%;}
.top {vertical-align:top;}
.bottom {vertical-align:bottom;}
.center {vertical-align:center;}
.lalign {text-align:left;}
.ralign {text-align:right;}
.calign {margin-left:auto; margin-right:auto;}
td hr {margin:18px 10px;}