#center_frame { width: 650px; margin-left: auto; margin-right: auto }
#center_frame p { position: relative; margin-top: 20px }

.Buy_Now_button { background-color: #FDD; border: 5px #D99 outset; padding: 6px }

/* ============================================================== */
/* Slide show CSS based on example provided by Stu Nicholls as shown on webreference.com */

/* The containing box for the gallery */
#SS_2009_pics { position: relative; width: 650px; height: 520px; 
                padding: 0px; margin: 2px; border: none; 
                background: url(/images/calendar/Settlement_Calendar_2009.jpg) no-repeat }

/* Replace list bullets and indentation with grid for image thumbnails */
#SS_2009_pics ul { width: 300px; height: 520px; padding: 0; margin: 0; 
                   list-style-type: none; float: right; border: none }
#SS_2009_pics li { float: left }

/* Remove the images and text from sight */
#SS_2009_pics a.gallery span {
  position: absolute; width: 1px; height: 1px; top: -1px; left: -1px; 
  overflow: hidden; background: white }

/* Add the thumbnail images */
#SS_2009_pics a.gallery, #SS_2009_pics a.gallery:visited { 
   display: block; color: black; text-decoration: none; border: 1px solid white; 
   margin: 4px; text-align: center; cursor: pointer }

#SS_2009_pics a.Buy_Now { background: url(/images/Buy_Now_button.jpg) no-repeat; width: 250px; height: 60px }
#SS_2009_pics a.slide3  { background: url(/images/calendar/Settlement_Calendar_0901sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide4  { background: url(/images/calendar/Settlement_Calendar_0902sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide5  { background: url(/images/calendar/Settlement_Calendar_0903sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide6  { background: url(/images/calendar/Settlement_Calendar_0904sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide7  { background: url(/images/calendar/Settlement_Calendar_0905sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide8  { background: url(/images/calendar/Settlement_Calendar_0906sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide9  { background: url(/images/calendar/Settlement_Calendar_0907sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide10 { background: url(/images/calendar/Settlement_Calendar_0908sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide11 { background: url(/images/calendar/Settlement_Calendar_0909sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide12 { background: url(/images/calendar/Settlement_Calendar_0910sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide13 { background: url(/images/calendar/Settlement_Calendar_0911sm.jpg); width: 64px; height: 100px }
#SS_2009_pics a.slide14 { background: url(/images/calendar/Settlement_Calendar_0912sm.jpg); width: 64px; height: 100px }

/* styling the hovers pictures */
#SS_2009_pics a.gallery:hover { border: 1px solid #ACB2F9 }
#SS_2009_pics a.gallery:hover span { position: absolute; width: 320px; height: 500px; top: 0px; left: 0px }
#SS_2009_pics a.gallery:hover img { border: 0px; float: left; margin: 0px } /* modify to add border when hover */