*{margin : 0px; padding : 0px;}
body{text-align : center; padding : 20px; font-family : Arial, Verdana,  Helvetica, MS Sans Serif, Sans Serif;}
#site{width : 780px;  margin-left : auto; margin-right : auto; text-align : left;}
#container{float : left; background : #FFFFFF url(../images/container_bg.gif) repeat-y; width : 780px; display : inline; text-align : left;}
#topnav{float : left; display : inline; width : 780px; height : 205px;}
#topnav a.topnav{display : block; text-align : center; font-size : 90%; text-decoration : none; color : #FFFFFF; float : left; margin-right : 3px;  width : 113px; height : 31px; line-height : 31px; background : url(../images/topnav_off.gif) no-repeat;}
#topnav a.topnav:hover{display : block; text-align : center; font-size : 90%; text-decoration : none; color : #FFFFFF; float : left; margin-right : 3px; width : 113px; height : 31px; line-height : 31px; background : url(../images/topnav_on.gif) no-repeat;}
#topnav img.logo{float : left; display : inline; width : 317px; height : 205px;}
#topnav img.demo{float : left; display : inline; border-top : #6532CB solid 8px;} 
#breadcrumbs{float : left; text-transform : lowercase; text-indent : 15px; font-size : 90%; display : inline; color : #FFFFFF; height : 30px; line-height : 30px; width : 780px; background : #6633CC;}
#breadcrumbs a{color : #FFFFFF; text-transform : lowercase; text-decoration : none;}
#breadcrumbs a:hover{color : #FFFFFF; text-transform : lowercase; text-decoration : underline;}
#left{float : left; display : inline; width : 190px;}
#left a{float : left; display : block; text-indent : 18px; height : 25px; line-height : 25px;  width : 190px; color : #6633CC; font-size : 80%; text-decoration : none; background : #CCCCFE; border-bottom : #FFFFFF solid 1px;}
#left a:hover{float : left; text-indent : 18px; display : block; height : 25px; line-height : 25px; width : 190px; color : #6633CC; font-size : 80%; text-decoration : none; background : #CCCCFE url(../images/left_arra.gif) no-repeat top left; border-bottom : #FFFFFF solid 1px;}
#left a.header{background : #6633CC; color : #FFFFFF; font-weight : bold;}
#left a.header:hover{background : #6633CC; color : #FFFFFF; font-weight : bold;}
#right{float : right; display : inline; width : 570px; margin-left : 20px;}
h1{color : #6633CC; font-size : 165%; font-weight : normal; margin-top : 20px;}
h2{ color : #707070; font-size : 90%; margin-top : 10px;}
h2.related{color : #6633CC; margin-bottom : 0px; font-size : 100%;}
p{ color : #707070; font-size : 80%; margin-top : 10px;}
ul,ol{color : #6633CC; font-size : 90%; margin-top : 20px; margin-bottom : 20px;  margin-left : 30px; }
#footer{float : left; font-weight : normal; color : #49D42B; text-align : right; font-size : 80%; width : 780px; height : 30px; margin-top : 20px; line-height : 30px; border-top : #6633CC solid 13px;}
#footer a{color : #6633CC; font-weight : normal; text-decoration : none;}
#footer a:hover{color : #6633CC; font-weight : normal; text-decoration : underline;}
#rightnav{float : right; padding-top : 5px; display : inline; margin-left : 20px; margin-bottom : 10px; width : 230px; height : auto;}
div.rightbox{float : right; padding-bottom : 12px; margin-bottom : 8px; display : inline; background : #CCCCFE url(../images/rightcurve.gif) no-repeat bottom left; width : 203px; height : auto;}
div.rightbox h3{color : #FFFFFF; font-weight : normal; font-size : 80%; height : auto; line-height : 22px; background : #6633CC; padding-left : 10px; padding-right : 10px; width : 183px;}
img.page_image{float : left; display : inline; width : 180px; height : 120px; border : #6633CC solid 1px; margin-left : 10px; margin-top : 10px;}
img.page_thumb{float : left; display : inline; width : 55px; height : 40px; border : #6633CC solid 1px; margin-top : 5px; margin-left : 5px;}
div.rightbox p{color : #808080; font-size : 80%; margin : 10px;}
div.rightbox p a{color : #6633CC; font-style : italic; text-decoration : none;}
label{color : #808080; font-size : 80%;}
input.text{width : 550px; border : #6633CC solid 1px; margin-bottom : 5px;}
textarea{width : 550px; border : #6633CC solid 1px;}
a{color : #6633CC; text-decoration : none;} 
a:hover{color : #6633CC; text-decoration : underline;}
div.content_box{float : left; display : inline; color : #707070;  font-size : 80%; width : 530px; height : auto; margin-top : 15px; padding : 10px; background : #CCCCFE; border : #6633CC solid 1px;}
div.content_box p{font-size : 90%;}
div.content_box b {color : #6633CC;  }
div.half{float : left;  display : inline; width : 50%;}
div.pix100{float : left;  display : inline; width : 70px; padding-left : 15px; height : 80px; padding-top : 20px; padding-bottom : 20px; background : #FFFFFF; margin-right : 15px; border : #6633CC solid 1px;}
div.remainder{float : left;  display : inline; width : auto;}

/* styles for javascript light box */
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }
#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }
#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; } 
#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }
#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	
#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }