/* 
    Document   : bbstyles.css
    Created on : January 25, 2010, 5:45 PM
    Author     : Al Payson http://www.alpayson.com
    
    CSSPlay is awesome!!!
    This is where I got the basic code structure for the vertical slide gallery:
    Go To http://www.cssplay.co.uk/menu/vertical-slide.html
    Stu Nicholls rocks and has tons of free codes.  
    Although I do not have a link on this site I will provide one from mine:
    
*/
/* a, a:visited {color: red}, a:hover {color: yellow}, a:active, a:focus {color: yellow}*/

#header {font-size:8pt}
#header {color:white}
#header {font-family: Goudy Stout}
#header {margin-left: 20px; margin-right: 20px}

#title {font-size: 14pt}
#title {font-family: Goudy Stout}
#title {color:white}
#title {margin-left: 0px; margin-right: 0px}

#links {font-family: Goudy Stout}
#links a{color: white; font-size: 8pt}
#links a:link {text-decoration: none}
#links a:visited {color: white; text-decoration: none}
#links a:hover {color: yellow; text-decoration: underline}

#text {font-size: 13pt;}
#text {color:#000000}
#text {font-family: Goudy Stout}
#text {margin-left: 20px; margin-right: 20px}
#text {margin-top: 20px; margin-bottom: 20px}

#main {margin-left: 10px; margin-right: 10px} 
#main {margin-top: 10px; margin-bottom: 10px}
#main {font-size: 12pt;  font-weight: bold}
#main {font-family: Goudy Old Style}
#main {color:#000000}

#footer {margin-top: 0px; margin-bottom: 0px}
#footer {margin-left: 0px; margin-right: 0px}
#footer {font-family: Goudy Old Style}
#footer {font-size: 12pt}

#holder {position:relative; background:transparent url(vertical-slide/photographer.jpg) 90px 0 no-repeat; margin-bottom:10px; width:750px; height:400px;}

#scrollbox {padding:10; margin:10; width:200px; list-style:none; height:350px; overflow:auto; float:right;}
#scrollbox li {float:left;}
#scrollbox a {display:block; color:#999; text-decoration:none; border:1px solid #fff; width:75px; height:56px; float:left; padding:5px; font-family:"trebuchet ms", sans-serif; font-size:24px; text-align:center;}

#scrollbox a.slide1 {background:url(images/gallery01Thumb.jpg) no-repeat center center;}
#scrollbox a.slide2 {background:url(images/gallery02Thumb.jpg) no-repeat center center;}
#scrollbox a.slide3 {background:url(images/gallery03Thumb.jpg) no-repeat center center;}
#scrollbox a.slide4 {background:url(images/gallery04Thumb.jpg) no-repeat center center;}
#scrollbox a.slide5 {background:url(images/gallery05Thumb.jpg) no-repeat center center;}
#scrollbox a.slide6 {background:url(images/gallery06Thumb.jpg) no-repeat center center;}
#scrollbox a.slide7 {background:url(images/gallery07Thumb.jpg) no-repeat center center;}
#scrollbox a.slide8 {background:url(images/gallery08Thumb.jpg) no-repeat center center;}
#scrollbox a.slide9 {background:url(images/gallery09Thumb.jpg) no-repeat center center;}
#scrollbox a.slide10 {background:url(images/gallery10Thumb.jpg) no-repeat center center;}
#scrollbox a.slide11 {background:url(images/gallery11Thumb.jpg) no-repeat center center;}
#scrollbox a.slide12 {background:url(images/gallery12Thumb.jpg) no-repeat center center;}
#scrollbox a.slide13 {background:url(images/gallery13Thumb.jpg) no-repeat center center;}
#scrollbox a.slide14 {background:url(images/galleryPoster01Thumb.jpg) no-repeat center center;}
#scrollbox a.slide15 {background:url(images/galleryPoster02Thumb.jpg) no-repeat center center;}
#scrollbox a.slide16 {background:url(images/galleryPoster03Thumb.jpg) no-repeat center center;}
#scrollbox a.slide17 {background:url(images/galleryPoster04Thumb.jpg) no-repeat center center;}
#scrollbox a.slide18 {background:url(images/galleryPoster05Thumb.jpg) no-repeat center center;}
#scrollbox a.slide19 {background:url(images/galleryPoster06Thumb.jpg) no-repeat center center;}

#scrollbox a span {display:block; position:absolute; left:-9999px; top:0;}
#scrollbox a span img {border:0;}
#scrollbox a:hover {border:1px solid #888;}
#scrollbox a:hover span {width:480px; height:590px; left:10px; background:#66CCFF; z-index:100;}
#scrollbox a:active {border:1px solid #000;}
#scrollbox a:focus {border:1px solid #000; outline:0;}
#scrollbox a:active span {width:480px; height:400px; top:0; left:10px; color:#000; background:#66CCFF; z-index:-1;}
#scrollbox a:focus span {width:480px; height:400px; top:0; left:10px; color:#000; background:#66CCFF; z-index:10; outline:0;}