html			   {overflow-y: scroll;}
body                       {background: url(../thumbnails/background.png) repeat; font: 17px Times, serif; color: #000000;}
h1			   {font-size: 20px; font-weight: bold; margin: 3em 0 0.5em 0;}
h2			   {font-size: 16px; font-weight: normal; color: #582d90; margin: 0 0 2.5em 0;}
hr			   {color: #ffffff; background-color: #000000; height: 1px; border: 0; margin: 0 0 10px 0;}
img			   {border: 0;}

a			   {color: #000000; text-decoration: none;}
a:focus, a:hover, a:active {color: #ff0000;}

input.btn                  {width: 75px; height: 25px; background: #ffffff; border: 1px solid #000000; font: 17px Times, serif; color: #000000; cursor: pointer;} 
input.btnhov               {color: #ff0000; border-color: #ff0000;}

.banner                    {height: 55px; background: url(../thumbnails/banner.gif) no-repeat;}
.header			   {width: 721px; border-spacing: 5px; margin-bottom: 5px; border: 0;}
.page                      {width: 721px; border-spacing: 0; padding-left: 100px; padding-right: 50px; background-color: #ffeed2; border-top: 1px solid #000000; border-left: 1px solid #000000; border-right: 1px solid #000000;}
.footer	                   {width: 721px; border-spacing: 0; font: 11px verdana, arial, sans-serif; color: #888888; background-color: #ffeed2; border-bottom: 1px solid #000000; border-left: 1px solid #000000; border-right: 1px solid #000000; padding: 100px 0 20px 100px; margin-bottom: 3em;}

.caption                   {font-size: 16px; font-style: italic; color: #582d90; margin: 0 0 1.5em 0;}
.contact		   {border-spacing: 10px 15px; margin-top: 50px;}
.contents td		   {padding-bottom: 15px;}
.next			   {margin: 3em 0 3em 0; font-weight: bold;}
.number                    {width: 18px; vertical-align: top;}
.picture                   {margin: 1.5em 0 1em 0;}
.quotation                 {font-size: 16px; color: #0000ff; font-style: italic; margin: 1em 0 1em 0;}
.required                  {color: #000000;}
.required input		   {background-color: #ffffff; margin-right: 1em; border: 1px solid #000000;}
.optional input		   {background-color: #ffffff;}
.optional textarea	   {background-color: #ffffff; border: 1px solid #000000}
.subtitle		   {font-size: 15px; font-style: italic; color: #582d90; line-height: 25px; }

#button01 a		   {display: block; width: 116px; height: 20px; margin: 0; background: url("../thumbnails/button_first_page.jpg");}
#button01 a:hover	   {background-position: -116px 0;}
#button02 a		   {display: block; width: 116px; height: 20px; margin: 0; background: url("../thumbnails/button_previous_page.jpg")}
#button02 a:hover	   {background-position: -116px 0;}
#button03 a		   {display: block; width: 116px; height: 20px; margin: 0; background: url("../thumbnails/button_toc.jpg")}
#button03 a:hover	   {background-position: -116px 0;}
#button04 a		   {display: block; width: 116px; height: 20px; margin: 0; background: url("../thumbnails/button_prints.jpg")}
#button04 a:hover	   {background-position: -116px 0;}
#button05 a		   {display: block; width: 116px; height: 20px; margin: 0; background: url("../thumbnails/button_contact.jpg")}
#button05 a:hover	   {background-position: -116px 0;}
#button06 a		   {display: block; width: 116px; height: 20px; margin: 0; background: url("../thumbnails/button_next_page.jpg")}
#button06 a:hover	   {background-position: -116px 0;}
#button07 a		   {display: block; width: 116px; height: 20px; margin: 0; background: url("../thumbnails/button_last_page.jpg")}
#button07 a:hover	   {background-position: -116px 0;}


/* lightbox.css ======================================================================================================================================================= */


#lightbox {position: absolute; left: 0; width: 100%; z-index: 100; line-height: 0;}

#lightbox img{width: auto; height: auto;}

#lightbox a img{border: none;}

#outerImageContainer {position: relative; top: 50px; left: 10px; background-color: #ffffff; width: 250px; height: 250px; margin: 0 auto;}

#imageContainer {padding: 1px;}

#loading {position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0;}

#hoverNav {position: absolute; top: -25px; left: 0; height: 100%; width: 100%; z-index: 10;}

#imageContainer>#hoverNav{left: 0;}

#hoverNav a {outline: none;}

#prevLink, #nextLink               {width: 20%; height: 100%; display: block;}
#prevLink                          {left: 0; float: left;}
#nextLink                          {right: 0; float: right;}
#prevLink:hover                    {background: url(../thumbnails/prev_hover.gif) left 0% no-repeat;}
#nextLink:hover                    {background: url(../thumbnails/next_hover.gif) right 0% no-repeat;}
#prevLink, #prevLink:visited:hover {background: url(../thumbnails/prev.gif) left 0% no-repeat;}
#nextLink, #nextLink:visited:hover {background: url(../thumbnails/next.gif) right 0% no-repeat;}

#imageDataContainer {position: relative; top: 50px; left: 10px; font: 11pt verdana, arial, sans-serif; margin: 0 auto; line-height: 1.5em; overflow: hidden; width: 100%;}

#imageData                 {padding: 0 5px; color: #ccccff;}
#imageData #imageDetails   {width: 70%; float: left; text-align: left;}
#imageData #caption        {color: #ffffff;}
#imageData #numberDisplay  {display: block; clear: left; padding-bottom: 1em;}
#imageData #bottomNavClose {width: 72px; float: right; padding-bottom: 0; outline: none;}

#overlay {position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000000;}