/*----------------------------------------------------------------------------- Chicago Sport and Social Photos Section Style Sheet version: 1.0 author: Blake Bauman email: blake@bytestudios.com created: 4/26/07 -----------------------------------------------------------------------------*/ /* General -----------------------------------------------------------------------------*/ body { background: #4d0014 url('/assets/images/bg_purple.gif') repeat-y center; } /* Wrapper length for this section */ #wrapper { width: 932px; } /* Header -----------------------------------------------------------------------------*/ #header { background: transparent url('/assets/images/bg_header.png') no-repeat bottom left; padding-bottom: 20px; height: 100px; } /* Branding */ #branding { background: url('/assets/images/logo_w_tag.png') no-repeat top left; } /* Sponsors */ #sponsors li a { background: transparent url('/assets/images/bg_sponsors_purple.gif') no-repeat; } /* Navigation -----------------------------------------------------------------------------*/ #navigation { height: 36px; background: #fff url('/assets/images/bg_top_nav.gif') no-repeat top left; } #navigation li a:hover, #navigation li a.active { background: #8a3756 url('/assets/images/nav_bg_purple.gif') repeat-x left bottom; } /* Primary Content -----------------------------------------------------------------------------*/ #primary { clear: both; background-color: #fff; color: #777; } #primary_content { float: left; width: 789px; } #primary_content_l { float: left; width: 250px; padding: 0 0 0 10px; } #primary_content_l h1 { margin: 10px 0 0 20px; font: normal 32px Arial, Helvetica, sans-serif; color: #680025; } #primary_content_l ul { margin-top: 67px; list-style: none; } #primary_content_l li { width: 240px; } #primary_content_l li a { display: block; width: 210px; padding: 4px 10px 4px 20px; color: #680025; font: bold 16px Arial, Helvetica, sans-serif; text-decoration: none; } #primary_content_l li a:hover, #primary_content_l li a.active { color: #fff; background: url('/assets/images/left_nav_bg_purple.gif') no-repeat top left; } #primary_content_l p { color: #7e2345; font-size: 14px; margin-left: 23px; } #primary_content_r { float: left; width: 515px; min-height: 500px; margin-bottom: 10px; padding: 0 0 0 5px; border-left: 2px dotted #bf91a2;} #primary_content_r h2 { margin: 10px; font: normal 24px Arial, Helvetica, sans-serif; color: #7e2345; } #primary_content_r p { font-size: 12px; margin: 10px; color: #4b4b4b; line-height: 16px; } #primary_content_r div.album_block { float: left; width: 230px; padding: 10px 0 15px 20px; } /*#primary_content_r div.album_block:hover { background-color: #feedf3; cursor: pointer;}*/ #primary_content_r div.album_block span { display: block; margin-bottom: 5px; padding-left: 15px; background: url('/assets/images/purple_arrow_down.gif') no-repeat 0 5px; font-size: 12px; } #primary_content_r div.album_block span a { display: block; color: #7e2346; font-size: 14px; text-decoration: none; } #primary_content_r div.album_block span a:hover { text-decoration: underline; } /*#primary_content_r div.album_block:hover span a { text-decoration: underline; }*/ #primary_content_r div.album_block a.img { float: left; width: 102px; padding: 2px; border: 1px solid #ddd; } #primary_content_r div.album_block a.img:hover { border: 1px solid #7e2346; background-color: #7e2346; } /*#primary_content_r div.album_block:hover a.img { border: 1px solid #7e2346; background-color: #7e2346; }*/ #primary_content_r div.album_block img { border: 1px solid #fff; } #primary_content_r div.album_block p { float: left; margin: 20px 0 0 10px; font-size: 11px; line-height: 14px; width: 100px; color: #777; } #primary_content_r div.album_block p a { display: block; color: #ad4278; text-decoration: none; } #primary_content_r div.album_block p a:hover { text-decoration: underline; } /* Photo Block */ #primary_content_r #photo_block { padding-left: 15px; } #primary_content_r #photo_block h2 { margin: 10px 0; font: normal 16px Arial, Helvetica, sans-serif; color: #7e2345; } #primary_content_r #photo_block h2 strong { font: bold 22px Arial, Helvetica, sans-serif; } #primary_content_r #photo_block p { color: #777;margin: 0 0 10px 0; } #primary_content_r #photo_block p a { font-size: 14px; color: #7e2345; padding: 3px 18px 3px 0; background: url('/assets/images/icon_slideshow.gif') no-repeat 100% 50%; text-decoration: none; } #primary_content_r #photo_block p a:hover { text-decoration: underline; } #primary_content_r #photo_block a.img { float: left; width: 102px; margin: 0 12px 12px 0; padding: 2px; border: 1px solid #ddd; } #primary_content_r #photo_block a.img:hover { border: 1px solid #7e2346; background-color: #7e2346; } #primary_content_r #photo_block img { border: 1px solid #fff; } /* Slideshow Block */ #primary_content_r #slideshow_block { padding-left: 5px; } #primary_content_r #slideshow_block a { color: #7e2345; text-decoration: none; } #primary_content_r #slideshow_block a:hover { text-decoration: underline; } #primary_content_r #slideshow_block h2 { margin: 10px 0; font: normal 16px Arial, Helvetica, sans-serif; color: #7e2345; } #primary_content_r #slideshow_block h2 strong { font: bold 22px Arial, Helvetica, sans-serif; } #primary_content_r #slideshow_block img { border: 1px solid #fff; } #primary_content_r #slideshow_block div { margin-top: 5px; padding-right: 7px; } #primary_content_r #slideshow_block div a { float: left; } #primary_content_r #slideshow_block div span { float: right; text-align: right; } #primary_content_r #slideshow_block div span strong { display: block; } #primary_content_r #slideshow_block ul { clear: both; margin: 15px 0; text-align: center; } #primary_content_r #slideshow_block ul li { list-style: none; display: inline; margin-right: 5px; } #primary_content_r #slideshow_block ul li a { font-weight: bold; padding: 3px 0 3px 19px; } #primary_content_r #slideshow_block ul li#add a { background: url('/assets/images/icon_add_purp.gif') no-repeat 0 50%; } #primary_content_r #slideshow_block ul li#send a { background: url('/assets/images/icon_email_purp.gif') no-repeat 0 50%; } #primary_content_r #slideshow_block ul li#download a { background: url('/assets/images/icon_dl_purp.gif') no-repeat 0 50%; } #primary_content_r #slideshow_block ul li#view a { background: url('/assets/images/icon_view_purp.gif') no-repeat 0 50%; } #primary_content_r #pagination { clear: both; padding: 10px 20px 20px 20px; color: #777; font-size: 11px; } #primary_content_r #pagination li { list-style: none; float: left; padding: 1px; } #primary_content_r #pagination li a { color: #7e2346; text-decoration: none; border: 1px solid #fff; padding: 1px 2px; } #primary_content_r #pagination li a:hover { color: #7e2346; border: 1px solid #e9d8e2; background: #f0ebee url('/assets/images/white_px.gif') repeat-x top left; } #primary_content_r #pagination li a.active { color: #7e2346; font-weight: bold; text-decoration: none; border: 1px solid #e9d8e2; background: #f0ebee url('/assets/images/white_px.gif') repeat-x top left; } /* Comments */ #photo_comments { clear: both; width: 515px; padding: 15px 0; margin-top: 10px; background: #fff url('/assets/images/bg_top_content_r.gif') no-repeat top left; } #photo_comments_bottom { width: 518px; height: 12px; background: #fff url('/assets/images/bg_bot_content_r.gif') no-repeat bottom left; } #photo_comments h3 { padding: 5px 20px 5px 25px; color: #7e2346; font: normal 20px Arial, Helvetica, sans-serif; } #photo_comments h3 span { color: #7f7e7f; font: normal 12px Arial, Helvetica, sans-serif; background: none; } #photo_comments h3 span a { color: #7f7e7f; margin-left: 8px; text-decoration: underline; } div.comment { margin: 10px 20px 10px 21px; padding: 15px; } div.comment_odd { margin: 10px 20px 0 21px; padding: 15px 15px 10px 15px; } div.comment_odd img, div.comment img { border: 1px solid #fff; margin: 2px; } div.comment_odd a.img, div.comment a.img { float: left; display: block; margin: 0 10px 0 0; width: 66px; height: 66px; background-color: #fff; border: 1px solid #c4c3c4; } div.comment_odd a.img:hover, div.comment a.img:hover { background-color: #7e2346; border: 1px solid #7e2346; } div.comment_odd div.comment_content, div.comment div.comment_content { float: left; width: 340px; margin: 0; line-height: 14px; } div.comment_odd div.comment_content span, div.comment div.comment_content span { display: block; background: none; color: #7e2346; font-weight: bold; margin: 0 0 5px 0; } div.comment_odd div.comment_content span a, div.comment div.comment_content span a { color: #7e2346; text-decoration: underline; } div.comment_odd div.options, div.comment div.options { clear: both; display: block; list-style: none; margin: 0 0 0 77px; } div.comment_odd div.options img, div.comment div.options img { border: 0; } div.comment_odd { background: #f0ebee url('/assets/images/comment_bg_top_purple.gif') no-repeat top left; } div.comment_odd_bot { clear: both; height: 10px; margin: 0 20px 0 21px; background: #f0ebee url('/assets/images/comment_bg_bot_purple.gif') no-repeat bottom left; } div.no_comments { padding: 10px 20px; color: #a5a4a5; } div.no_comments a { color: #7e2346; text-decoration: underline; } #tell_friend_photo {} #tell_friend_photo label { float: left; width: 150px; margin-right: 5px; text-align: right; } #tell_friend_photo input.field { font: normal 12px Arial, Verdana, sans-serif; width: 277px; padding: 4px 5px 3px 5px; border: 1px solid #eee; } #tell_friend_photo textarea { font: normal 12px Arial, Verdana, sans-serif; width: 277px; height: 100px; border: 1px solid #eee; color: #333; padding: 4px 5px 3px 5px; background: #fff url('../images/form_input_bg.gif') no-repeat top left;} /* Advertising Column */ #advertisement { float: left; text-align: center; width: 135px; margin: 5px 0; padding-bottom: 10px; background: #fff url('/assets/images/home_ad_bg_bot.gif') no-repeat bottom left; } #advertisement h3 { padding: 0; width: 135px; background: #fff url('/assets/images/home_ad_bg_top.gif') no-repeat top left; text-indent: -9999px; } #advertisement img { margin-bottom: 5px; } /* Banners */ #banner { display: block; text-align: center; margin: 5px 0; background: none; height: auto; } .hidden { display : none; } /* New Gallery (added by Blake 10/9/07) -----------------------------------------------------------------------------*/ /* Removes dotted links in FireFox */ a { outline: none; } #slideShowBlock { margin-left: 0; } #slideShowBlock h2 { margin-bottom: 10px; } #largeBlock { position: relative; width: 100%; /*height: 480px;*/ min-height: 375px; background: url('/assets/images/loader.gif') no-repeat 50% 50%; text-align: center; } #thumbnailBlock { position: relative; } #thumbnailBlock ul { width: 503px; float: left; list-style: none; padding: 2px 0 0 2px; border: 1px solid #ddd; background: #eee; margin: 10px 0 0 5px; max-height: 220px; min-height: 30px; overflow: auto; } #thumbnailBlock ul li { float: left; width: 23px; margin: 0 2px 2px 0; } #thumbnailBlock ul li a { display: block; width: 21px; height: 21px; padding: 1px; border: 1px solid #ccc; filter:alpha(opacity=50); -moz-opacity: .50; opacity: .50; cursor: pointer; } #thumbnailBlock ul li a:hover, #thumbnailBlock ul li a.selected { border-color: #999; filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; cursor: pointer; } #thumbnailBlock ul li a.selected { border-color: #7e2346; } #previewBlock { position: absolute; /*width: 100%; */ /*height: 79px;*/ left: 40%; top: -76px; text-align: center; z-index: 3000; /*padding-bottom: 6px; background: url('/assets/images/arrow-photo-preview.gif') no-repeat bottom center;*/ } #previewBlock img { /*width: 100px; height: 75px; */ padding: 1px; margin: 0; border: 1px solid #ccc; background-color: #eee; } #sendToFriendForm { display: none; width: 500px; position: absolute; bottom: 0; left: 0; color: #777; background-color: #eee; padding:10px; text-align: left; } #sendToFriendForm p { margin: 0; } #sendToFriendForm a { color: #7e2346; font-size: 11px; } #sendToFriendForm #formContainer, #sendToFriendForm #responseMessage { padding: 20px; background-color: #fff; border: 1px solid #ddd; } #sendToFriendForm form h3 { color: #7e2346; font: bold 18px Helvetica, Arial, sans-serif; letter-spacing: -1px; background-color: #fff; } #sendToFriendLeft { float: left; width: 220px; } #sendToFriendLeft input, #sendToFriendForm form textarea { border: 1px solid #ddd; width: 190px; padding: 5px 3px; margin-bottom: 3px; font: normal 12px Helvetica, Arial, sans-serif; color: #333; } #sendToFriendRight { float: left; width: 220px; } #sendToFriendForm form label { display: block; font-size: 11px; color: #777; margin-bottom: 2px; } #closeSend { position: absolute; top: -22px; left: 450px; display: block; width: 50px; color: #7e2346; font-size: 11px; text-decoration: none; padding: 8px 10px 8px 10px; background-color: #eee; } #closeSend strong { text-decoration: none; } #closeSend:hover { color: #7e2346; } #closeSend:hover strong { text-decoration: underline; } #galleryControls { text-align: center; padding: 10px 0; margin-top: 10px; } #galleryEmailImage { float: left; width: 110px; text-align: left; margin-left: 8px; padding-top: 10px; } #galleryEmailImage a { font-size: 11px; padding: 3px 0 3px 19px; color: #777; background: url('/assets/images/email_friend.gif') no-repeat 0 50%; text-decoration: none; } #galleryEmailImage a:hover { text-decoration: underline; color: #7e2346; } #galleryPlayOptions { float: left; width: 270px; } #galleryPrintImage { float: left; width: 110px; text-align: right; padding-top: 10px; } #galleryPrintImage a { font-size: 11px; padding: 3px 0 3px 19px; color: #777; background: url('/assets/images/print_photo.gif') no-repeat 0 50%; text-decoration: none; } #galleryPrintImage a:hover { text-decoration: underline; color: #777; } #addResult { color: #777; } #loadingMessage { font-size: 11px; display: block; padding: 3px 0 3px 20px; background: #fff url('/assets/images/ajax-loader.gif') no-repeat 0 50%; color: #7e2346; } /* Footer -----------------------------------------------------------------------------*/ #footer { } #footer a, #footer a:visited { color: #fff; text-decoration: none; } #footer a:hover { text-decoration: underline; } #footer ul { margin-top: 0; padding: 8px; background: #993366 url('/assets/images/bg_footer_purple.gif') no-repeat bottom left; }