body { background: #eeebdd; color: #222; text-align: center; font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1;}
#wrapper { position: relative; width: 930px; margin: 15px auto; text-align: left; }

#home { position: absolute; }
h1 a { width: 230px; height: 90px; float: left; background: url(/images/site/sallybrownbill.gif) 0 0 no-repeat; text-indent: -5000px;}
h1 a:hover { background-position: 0 -90px;}

#page, #content, #posts, #sidebar { float: left;}
#page { width: 945px; margin: 25px 0 0 -15px;}
#content { width: 670px; padding-bottom: 30px;}
#posts { width: 660px; margin-left: 10px;}
#sidebar { width: 270px; height: 380px; margin: 20px 0 0 5px; background: url(/images/site/notepaper.gif) 0 0 no-repeat;}
.profiles #content { margin-left: -945px;}
.profiles #sidebar { margin-left: 675px;}
.inner { padding: 45px 18px 45px 20px;}
.col { width: 305px; float: left; margin: 0 15px;}

/* Page subnavigation */
#subnav { float: left; width: 200px; margin: 86px 0 0 15px; position: relative;}
#subnav li { float: left;}
#subnav li a { float: left; width: 200px; height: 50px; background-position: 0 0; background-repeat: no-repeat; text-indent: -5000px;}
#subnav li a:hover { background-position: 0 -50px;}
.about #sn-about a, .about #sn-about a:hover, .help #sn-help a, .help #sn-help a:hover, .photographers #sn-photographers a, 
.photographers #sn-photographers a:hover, .blog #sn-blog a, .blog #sn-blog a:hover { background-position: 0 -100px;}
#sn-about a { background-image: url(/images/site/subnav_about.gif);}
#sn-help a { background-image: url(/images/site/subnav_help.gif);}
#sn-photographers a { background-image: url(/images/site/subnav_photographers.gif);}
#sn-blog a { background-image: url(/images/site/subnav_blog.gif);}
#subnav #sn-photographers a, #subnav #sn-blog a { height: 25px;}
#subnav li#sn-camera a { background-image: url(/images/site/subnav_camera.gif); height: 61px; margin: 27px 0 0 16px;}
#subnav li#sn-camera a:hover { background-position: 0 -61px;}
#subnav #sn-twitter a { background-image: url(/images/site/subnav_twitter.gif); width: 30px; height: 30px; top: 252px; left: 201px; position: absolute;}
#subnav #sn-twitter a:hover { background-position: 0 -30px;}
#subnav #sn-newsletter a { background-image: url(/images/site/subnav_newsletter.gif); width: 238px; height: 35px; top: 280px; left: -15px; position: absolute;}
#subnav #sn-newsletter a:hover { background-position: 0 -35px;}

#subnav li ul { width: 200px; float: left;}
#subnav li li { float: left; margin: 0;}
.blog #subnav li li a { width: 200px; height: 25px; background-position: 0 0;}
.blog #subnav li li a:hover, .archives #subnav li li#sn-archives a { background-position: 0 -25px;}
#sn-archives a { background-image: url(/images/site/subnav_archives.gif);}
#sn-subscribe a { background-image: url(/images/site/subnav_subscribe.gif);}

.profiles #sidebar { position: relative;}
.profiles #subnav { position: absolute; bottom: 56px; left: 15px; margin: 0;}
.profiles #subnav li { margin: 0;}
.profiles #subnav #sn-twitter a { top: 102px;}

/* Profile Photos */
#frame { width: 690px; float: left; margin-left: -10px; height: 490px; background: url(/images/site/frame.png) 0 0 no-repeat; position: relative; z-index: 40;}
#photos ul { width: 690px; height: 490px; overflow: hidden; }
#photos li { width: 640px; height: 430px; padding: 30px 25px; background: url(/images/site/frame.png) 0 0 no-repeat;}
#photos li.url { font-size: 1.5em; font-weight: bold; text-align: center;}
#photos li.url img { float: left; width: 205px; margin: 65px 315px 0 120px;}
#photos li.url a { color: #999;}
#photos li.url a:hover { color: #f00;}

#tabs, #tabs li a { position: absolute; }
#tabs { width: 155px; height: 45px;}
#tabs { top: -25px; right: 26px; z-index: 50;}
#tabs li a { top: 0; right: 0; width: 78px; height: 45px; background-repeat: no-repeat; text-indent: -5000px;}
li#prev a { right: 78px; background-image: url(/images/site/tab_prev.gif); }
li#next a { background-image: url(/images/site/tab_next.gif);}
li#prev a:hover, li.inactive a { background-position: 0 -45px;}

/* Photographer menus */
#photographers li { background: url(/images/site/thumb_bg.gif) 0 0 repeat-y; width: 145px; height: 145px; float: left; margin: 0 11px 22px 11px;}
#photographers li .thumb { background: url(/images/site/thumb_bg_top.gif) 0 0 no-repeat; width: 145px; height: 110px; float: left; position: relative;}
#photographers li .thumb div { background: url(/images/site/thumb_overlay.png) 0 0 no-repeat; width: 119px; height: 80px; top: 21px; left: 13px; z-index: 30; position: absolute;}
#photographers li img { top: 22px; left: 14px; z-index: 25; position: absolute;}
#photographers li p { background: url(/images/site/thumb_bg_bottom.gif) bottom left no-repeat; width: 140px; height: 35px; float: left; margin: 0; padding: 0 0 0 5px; font-size: 0.875em; line-height: 0.9375em; text-align: center;}
#photographers li p a { border: 0;}
#photographers li:hover { -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg);}
#photographers li.hover p a { color: #f00;}

#carousel { width: 670px; float: left; margin: 30px 0 0 0; z-index: 20; position: relative;}
.jcarousel-container, .jcarousel-clip { width: 670px; float: left;}
.jcarousel-clip { height: 130px; overflow: hidden;}
.profiles #photographers { padding-top: 5px !important;}
.profiles #photographers li { background-image: url(/images/site/thumb_sml_bg.gif); width: 124px; height: 124px; margin: 0 0 20px 0; padding: 0 5px;}
.profiles #photographers li .thumb { background: url(/images/site/thumb_sml_bg_top.gif) 0 0 no-repeat; width: 124px; height: 90px;}
.profiles #photographers li .thumb div { background: url(/images/site/thumb_sml_overlay.png) 0 0 no-repeat; width: 100px; height: 66px; top: 12px; left: 12px;}
.profiles #photographers li img { top: 12px; left: 13px;}
.profiles #photographers li p { background-image: url(/images/site/thumb_sml_bg_bottom.gif); width: 120px; height: 34px; padding: 0 0 0 4px; font-size: 0.75em;}

.carousel-control { width: 20px; height: 20px; float: left; background-color: #ccb; background-position: 0 0; background-repeat: no-repeat; text-indent: -9000px; position: absolute; top: 50px; left: -21px; cursor: pointer;}
.carousel-control:hover { background-color: #aa9;}
.jcarousel-prev-disabled, .jcarousel-next-disabled, 
.jcarousel-prev-disabled:hover, .jcarousel-next-disabled:hover { background-color: #ddc; cursor: default;}
.jcarousel-prev { background-image: url(/images/site/pagelink_prev.png);}
.jcarousel-next { background-image: url(/images/site/pagelink_next.png); left: 672px;}

/* Blog */
.entry { width: 500px; float: left; background-position: repeat-y; margin: 0 0 20px 0; overflow: hidden; position: relative;}
.odd { background-image: url(/images/site/post_bg_odd.gif); padding: 0 30px 0 120px;}
.even { background-image: url(/images/site/post_bg_even.gif); padding: 0 120px 0 30px;}
.date { background: url(/images/site/post_bg_top.gif) 0 0 no-repeat; width: 560px; height: 40px; margin: 0 0 0 -30px;}
.footer { background: url(/images/site/post_bg_bottom.gif) bottom left no-repeat; width: 560px; padding-bottom: 30px; margin-left: -30px; overflow: auto;}
.featured { background: url(/images/site/post_bg_odd_feat.gif) 0 0 no-repeat; width: 104px; height: 266px; top: 65px; left: -4px; position: absolute;}
.even .featured { background-image: url(/images/site/post_bg_even_feat.gif); left: 550px;}

.feature_imgs { width: 500px; position: relative; margin: 10px 0;}
.entry h2 { font-size: 1.5em; font-weight: bold; margin: 10px 0 0 0;}
.entry h2 a { color: #f33;}
.blog_link h2 { margin-bottom: 10px; font-size: 1.25em;}
.blog_link h2 a { color: #fff; background-color: #f77; padding: 2px 6px;}
.blog_link h2 a:hover { background-color: #f33;}

.entry p { font-size: 0.875em; line-height: 1.286em; margin-bottom: 1em;}
.date p, p.author { color: #999; font-size: 0.75em;}
.date p, .featured p { font-family: 'courier new', courier, monospace; font-weight: bold; text-align: center;}
.date p { padding: 12px 40px 0 440px;}
p.author { margin: 2px 0 10px 0;}
p.author strong { color: #666; font-weight: bold;}
.intro { background: url(/images/site/bg_keyline.gif) bottom left no-repeat; padding-bottom: 20px; margin-bottom: 15px;}
.intro p { color: #666; font-size: 1.125em; line-height: 1.333em;}
.entry .more a { color: #f33; background: none;}
.more a:hover, .entry p a { background: url(/images/site/underline.gif) 0 1.1em repeat-x; padding-bottom: 0.1em;}

.featured img { margin: 11px 0 0 14px; z-index: 45;}
.even .featured img { margin-left: 0;}
.featured div { background: url(/images/site/post_bg_odd_feat_overlay.png) 0 0 no-repeat; width: 96px; height: 185px; top: 0; left: 8px; position: absolute; z-index: 50;}
.even .featured div { background-image: url(/images/site/post_bg_even_feat_overlay.png); left: 0;}
.featured p { font-size: 0.75em; line-height: 1.5em; margin-top: 6px; padding: 0 0 0 15px;}
.even .featured p { padding: 0 14px 0 0;}
.featured p a { color: #999; background: none;}
.featured.hover p a { color: #f00;}

.footer { margin-top: 20px;}
.tags { width: 400px; float: left; margin: 0 0 0 23px;}
.tags li { float: left;}
.tags li a { color: #777; background-color: #ffc; padding: 4px; margin: 3px; font-size: 0.75em; font-weight: bold;}
.tags li a:hover { background-color: #ff9;}
.networks { width: 100px; float: right; margin-right: 26px;}
.networks li { float: right;}
.networks li img { margin: 0;}
.networks li a { width: 16px; height: 16px; float: left; margin: 0 4px 4px 0; padding: 0;}

.archives #posts { background: url(/images/site/archives_bg.gif) repeat-y;}
#archives { width: 660px; background: url(/images/site/archives_bg_top.gif) 0 0 no-repeat; overflow: auto;}
#archive_footer { width: 660px; float: left; background: url(/images/site/archives_bg_bottom.gif) left bottom no-repeat; padding-top: 30px;}
#archive_date { width: 410px; float: left; margin-left: 10px;}
#archive_tag { width: 210px; float: left;}

#archives dl, #archives ul { width: 370px; float: left; margin: 0 0 25px 20px;}
.archives h2, #archives dt a { font-size: 1.125em; font-weight: bold;}
.archives h2 { margin-bottom: 40px;}
#archives dt a { color: #666; width: 370px; float: left; margin-bottom: 10px;}
#archives dd a { color: #f00; width: 360px; float: left; padding: 3px 0 3px 8px; border-left: 2px solid #999; font-size: 0.875em; line-height: 1.286em;}
#archives ul { border-top: 1px solid #999; margin-bottom: 0;}

#archives li a { color: #777; width: 370px; float: left; padding: 0.5em 0 0.428em 0; font-size: 0.875em; font-weight: bold; border-bottom: 1px solid #999;}
#archives li span { color: #f66; float: right; font-weight: normal;}
#archives dt a:hover, #archives dd a:hover, #archives li a:hover { color: #333;}

/* Home page */
#home { top: 54px; left: 154px; width: 660px; height: 680px; z-index: 100; background: url(/images/site/mouth_bg.gif) 182px 224px no-repeat;}
#home li a span, #home li a { position: absolute; background-position: 0 0; background-repeat: no-repeat; cursor: pointer; text-indent: -5000px;}
#mouth01 a { background-image: url(/images/site/mouth01.gif); top: 0; left: 328px; width: 187px; height: 125px; z-index: 110;}
#mouth01 a:hover { background-position: 0 -125px;}
#mouth02 a { background-image: url(/images/site/mouth02.gif); top: 62px; left: 60px; width: 152px; height: 211px;}
#mouth02 a:hover { background-position: 0 -211px;}
#mouth03 a { background-image: url(/images/site/mouth03.gif); top: 377px; left: 121px; width: 184px; height: 302px;}
#mouth03 a:hover { background-position: 0 -302px;}
#mouth04 a { background-image: url(/images/site/mouth04.gif); top: 239px; left: 328px; width: 187px; height: 282px; z-index: 105;}
#mouth04 a:hover { background-position: 0 -282px;}
#mouth05 a { background-image: url(/images/site/mouth05.gif); top: 142px; left: 231px; width: 154px; height: 89px; z-index: 115;}
#mouth05 a:hover { background-position: 0 -89px;}

#mouth01 span { background-image: url(/images/site/bubble01.gif); top: 108px; left: 82px; width: 250px; height: 143px;}
#mouth01 a:hover span { background-position: 0 -143px;}
#mouth02 span { background-image: url(/images/site/bubble02.gif); top: 190px; left: -60px; width: 179px; height: 137px;}
#mouth02 a:hover span { background-position: 0 -137px;}
#mouth03 span { background-image: url(/images/site/bubble03.gif); top: 151px; left: -109px; width: 167px; height: 151px;}
#mouth03 a:hover span { background-position: 0 -151px;}
#mouth04 span { background-image: url(/images/site/bubble04.gif); top: 282px; left: -6px; width: 207px; height: 150px;}
#mouth04 a:hover span { background-position: 0 -150px;}
#mouth05 span { background-image: url(/images/site/bubble05.gif); top: -88px; left: -3px; width: 113px; height: 90px;}
#mouth05 a:hover span { background-position: 0 -90px;}

#contact { width: 200px; float: right; margin: 55px 52px 0 0;}
#contact p, #contact p a { float: left; width: 200px; text-indent: -5000px; overflow: hidden; margin-bottom: 1px; line-height: 0;}
#contact p a, #contact p#mobile { float: left; width: 200px; height: 14px; background-image: url(/images/site/contact_email.gif); background-position: 0 0; background-repeat: no-repeat;}
#contact p#mobile { background-image: url(/images/site/contact_mobile.gif);}
#contact p a:hover { background-position: 0 -14px;}

/* Announcements - email newsletter status pages */
#announce { position: absolute; width: 100%; top: 50%; left: 0; margin-top: -135px;}
#announce h2 { position: relative; width: 310px; height: 270px; margin: 0 auto; text-align: left;}

div#fancy_title div, td#fancy_title_left, td#fancy_title_main, td#fancy_title_right, 
.newsletter #contact, .newsletter #sp-credit { display: none !important;}
.newsletter #wrapper { width: 500px; margin: 20px auto;}
.newsletter #page { width: 390px; margin: 120px 0 0 -70px;}
.newsletter h1 a { width: 180px; height: 155px; background-image: url(/images/site/mouth_newsletter.gif);}
.newsletter h1 a:hover { background-position: 0 0;}
.newsletter h2 { color: #f00; font-weight: bold; font-size: 0.875em;}
#form_wrap, #confirmation { margin: 15px 0;}
.newsletter label { margin: 0;}
.newsletter .textfield label { width: 50px; float: left;}
.newsletter .textfield input { width: 300px;float: left; font-size: 1em;}
.newsletter #form_wrap p { margin: 0 0 10px 0; overflow: hidden; font-size: 0.8125em;}
.newsletter #form_wrap p#submit { margin-top: 20px;}

/* Image Replaced Headings */
#content h2, h3 { background-repeat: no-repeat; text-indent: -5000px;}
#content h2 { width: 680px; height: 75px; float: left; margin-bottom: 15px; position: relative; left: -37px;}
#sidebar h2 { margin-bottom: 5px; font-size: 2.1875em;}

h2#directory { background-image: url(/images/site/h2_directory.gif);}
.about h2 { background-image: url(/images/site/h2_about.gif);}
.help h2 { background-image: url(/images/site/h2_help.gif);}
h2#error-404 { background-image: url(/images/site/h2_404.gif);}
h3#websites { background-image: url(/images/site/h3_websites.gif); width: 190px; height: 30px;}
h3#other { width: 660px; height: 25px; float: left; background-image: url(/images/site/h3_other.gif); margin: 0 0 10px 15px;}

.col p, #sidebar p, .newsletter p { font-size: 0.875em; line-height: 1.5em;}
#sidebar p { line-height: 1.75em; margin-bottom: 25px;}
#content p { line-height: 1.285em; margin-bottom: 10px;}
.profiles #sidebar p, p.address { margin: 0;}

strong, b { color: #f00; font-weight: bold;}
p em { font-weight: bold; font-style: normal;}
#posts p em { font-weight: normal; font-style: italic;}

a:link, a:visited { text-decoration: none;}
p a { color: #222;}
p a:hover { color: #f00;}
.hover { cursor: pointer;}

.col p a { border-bottom: 1px solid #777;}

#sp-credit a { float: left; width: 65px; height: 70px; margin-top: 10px; clear: both; background: url(/images/site/sp-credit.gif) 0 0 no-repeat; text-indent: -9000px;}
.home #sp-credit a { top: 450px; right: 225px; position: absolute; z-index: 100;}
.profiles #sp-credit a { top: 500px; right: 190px; position: absolute;}
#sp-credit a:hover { background-position: 0 -70px;}