/* Global (All Pages) Table of Contents: Tags & Classes Top Containers Bread Crumb Container Header/Footer */ /* Tags & Classes ------------------------------------------------------------------------------------------------------------------------------------------ */ BODY { font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 12px; background-color: #FFFFFF; margin: 0; padding: 0; } H1, H2, H3, H4, H5, H6 { font-family: Myriad, "Myriad Web", "Myriad Pro", Helvetica, Verdana, sans-serif; } /* Hidden Div to pre-load images */ #imageCache { height: 1px; margin: 0; padding: 0; // display: none; /* IE Hack */ } /** Take all padding/margining off of forms for IE **/ FORM { margin: 0; padding: 0; } IMG { border-width: 0; border-style: none; } /* General Links */ A { font-weight: bold; outline: none; } A:link, A:visited, A:hover, A:active { color: #0000CC; } A:link, A:visited { text-decoration: none; } A:hover, A:active { text-decoration: underline; } /*** Generic classes ***/ .bold { font-weight: bold !important; } P.grey { color: #444; } .left { float: left; } .right { float: right; } .clear { clear: both; height: 1px; overflow: hidden; margin-top: 1px; } .clearL { clear: left; } .clearR { clear: right; } .clearBoth { clear: both; } .floatL { float: left; } .rel { position: relative; } .flyOut { position: absolute; z-index: 100; background-color: #FFF; border: 1px solid #7798BE; overflow: hidden; filter: alpha(opacity=95); -moz-opacity: 0.95; opacity: 0.95; } .flyOut A { font-size: 9pt; position: relative; /* width: 100%;*/ display: block; padding: 5px; /* color: #000;*/ text-decoration: none; font-weight: normal; } .flyOut A:hover { background-color: #B9D3F0; } /****** Rounded Blue Buttons (Links & Buttons) ******/ .smallbluerounded, .smallbluerounded SPAN, .mediumbluerounded, .mediumbluerounded SPAN { background-repeat: no-repeat; display: block; } .smallbluerounded, .mediumbluerounded { background-position: 0 center; padding: 0 0 0 15px; color: #FFFFFF !important; text-align: left; /* For Span alignment in IE */ } .smallbluerounded SPAN, .mediumbluerounded SPAN { margin: 0; background-position: 100% center; text-decoration: none; font-style: normal; font-weight: normal; text-align: center; } .smallbluerounded, .smallbluerounded SPAN { background-image: url("../../../pic.photobucket.com/album/white/smallbluerounded_white.gif"); } .smallbluerounded SPAN { padding: 5px 15px 5px 0; font-size: 14px; } .mediumbluerounded, .mediumbluerounded SPAN { background-image: url("../../../pic.photobucket.com/album/white/mediumbluerounded_white.gif"); } .mediumbluerounded SPAN { padding: 10px 15px 10px 0; font-size: 15px; } A.smallbluerounded, A.mediumbluerounded { text-decoration: none; } /********************************** Expandable Panel Style Rules **********************************/ /* Expandable Panel 4 */ /**** * Note: The elements ".xpanel4Outer, .xpanel4Inner, .xpanel4Lower, .xpanel4LowerInner" * should all be block level elements or have the style display: block applied to them. ******/ .xpanel4Outer, .xpanel4Inner, .xpanel4Lower, .xpanel4LowerInner { background-repeat: no-repeat; } .xpanel4Outer { background-position: 100% 0; padding: 0; margin-bottom: 1em; text-align: left; } .xpanel4Inner { background-position: 0 0; margin: 0; padding: 0; /* Note: Override this as needed */ text-align: center; } .xpanel4Lower { background-position: 100% 100%; margin: 0; padding: 0; } .xpanel4LowerInner { background-position: 0 100%; margin: 0; padding: 0; /* Note: Override this as needed */ text-align: center; } .xpanel4Inner, .xpanel4LowerInner { width: 95%; /* Note: Override this as needed */ } /******************************* End - Expandable Panel Style Rules *******************************/ /***** Forms and Panel defns *****/ .ctrlPanel { padding: 0; margin: 0 auto 3em auto; color: #000000; background-color: #F4F4F4; border-color: #CCCCCC; border-style: solid; border-width: 5px 5px 5px 5px; text-align: center; font-family: Myriad, Verdana; } .headerCtrlPanel { color: #000000; padding: 0.5em 0; margin: 0; font-size: 200%; text-align: left; color: #1C64B4; font-weight: bold; text-align: center; } .ctrlPanel LABEL.floatL { color: #888888; font-weight: bold; font-size: 12px; } .ctrlPanel LABEL.floatL, .ctrlPanel INPUT.floatL, .ctrlPanel SELECT.floatL, .ctrlPanel TEXTAREA.floatL { display: block; margin-bottom: 0.5em; } .msgError { color: #FF0000; font-weight: bold; text-align: center; } /** Had to throw this in here so message looked correct with a black bg **/ .panelError, .panelMessage { margin: 0.5em auto; padding: 0.5em 0; border-top: 1px solid #cc9; border-right: 1px solid #663; border-bottom: 1px solid #663; border-left: 1px solid #cc9; } .panelError { background: #ffc; } .panelMessage { background: #c5d8ed; } .panelError H1, .panelMessage H1 { font-size: 200%; letter-spacing: -1px; font-weight: normal; margin: .2em; } .panelMessage H1 { color: #000000; } .panelMessage A { text-decoration: underline; color: #1c64b4; font-size: 60%; } .panelError H1 { color: #f60; } .panelError P, .panelMessage P { font-weight: normal; font-size: 120%; color: black; padding: 0 0.5em 0.2em 0.5em; } .panelMessage P A { font-size: 170%; } /* Other ------------------------------------------------------------------------------------------------------------------------------------------ */ #notifyTextCopied, #notifyDescTitleSuccess { /* Text Copied Message Div */ position: absolute; background-color: #FFF36F; color: #000; border: 1px solid #BFAE5F; cursor: pointer; padding: 2px 3px; } #notifyDescTitleSuccess { font-weight: bold; } /* Bubbles (Tooltips & Error Message Bubbles) ---------------------------------------------------------------------------------------------------------------------------------------------*/ .bubble, .bubbleError { position: absolute; z-index: 100; margin: 0; padding: 14px 10px 8px 10px; } .bubble { background-color: #FFF8AB; background-image: url("../../../pic.photobucket.com/bubbles/bubble_bg.gif"); background-repeat: repeat-x; background-position: 0 top; border-width: 1px; border-style: solid; border-color: gray; } .bubbleError { background-color: #FCF1EC; background-image: url("../../../pic.photobucket.com/bubbles/error_bubble_bg.gif"); background-repeat: repeat-x; background-position: 0 bottom; border-width: 1px; border-style: solid; border-color: #D53D04; } .bubble DIV.arrow { position: absolute; width: 10px; height: 18px; left: -10px; top: 14px; background-image: url("../../../pic.photobucket.com/bubbles/bubble_arrow.gif"); background-repeat: no-repeat; background-position: 0 0; } .bubbleError DIV.arrow{ position: absolute; width: 9px; height: 18px; left: -9px; top: 14px; background-image: url("../../../pic.photobucket.com/bubbles/error_bubble_arrow.gif"); background-repeat: no-repeat; background-position: 0 0; } .bubble H3, .bubbleError H3 { margin-bottom: 0.5em; } /************************ Page Header Panel ************************/ /* #containerHeader, #panelFooter { margin-left: auto; margin-right: auto; } */ /****** New Login Panel *******/ #formHeaderLogin DIV { text-align: right; margin: 0; } #formHeaderLogin DIV#ctrlsLogin * { vertical-align: middle; } #menuWelcome INPUT#username, #menuWelcome INPUT#password { width: 8em; font-size: 11px; } #menuWelcome LABEL { padding-left: 0.5em; font-weight: bold; } #menuWelcome INPUT#bttnHeaderLogin { background-color: #D0D0D0; border-color: #D0D0D0; color: #000000; font-weight: bold; } #menuLogin { font-size: 11px; padding-top: 3px; } #menuLogin * { vertical-align: middle; } #menuWelcome LABEL#lblRemember { padding-left: 0; font-weight: normal; } /********* Mainsite/Album Not Logged In Header Menu */ #groupHeaderLoginLinks * { vertical-align: middle; } #groupHeaderLoginLinks #bttnHeaderRegister { margin-left: 1em; } /*********************** Search Panel ***********************/ /* WebSearch Page */ #googleSearchUnitIframe { text-align: center; margin-top: 1em; } #webSearchHeader { text-align: center; width: 400px; margin: 2em auto; } #webSearchHeader #q { width: 15em; margin-right: 0; padding-right: 0; } #webSearchHeader #groupSearchInputs * { vertical-align: middle; } /****** General Search Panel Rules *****/ .containerSearchForm { white-space: nowrap; padding-bottom: 0.5em; } A#linkSearchCat { font-size: 11px; font-weight: bold; } A#linkSearchCat:link, A#linkSearchCat:visited { color: #000000; } .containerSearchForm INPUT { padding: 0; margin: 0; vertical-align: middle; } .containerSearchForm INPUT.qSearch { font-size: 12px; width: 14em; margin-right: 0; padding-right: 0; color: #D53D04; font-weight: bold; } .containerSearchForm .groupSearchInputs { margin: 0; padding: 0; text-align: left; } .containerSearchForm .containerModeLinks { font-size: 11px; vertical-align: middle; text-align: left; margin: 0; } .containerSearchForm .containerModeLinks A { font-weight: normal; } .containerModeLinks SPAN.menuItemSep { padding: 0 0.25em; color: #999999; } .containerModeLinks A.selected:link, .containerModeLinks A.selected:visited, .containerModeLinks A.selected:hover, .containerModeLinks A.selected:active { color: #505050; font-weight: bold; text-decoration: none; } .groupSearchInputs .bttnSearch { color: #FFFFFF; font-weight: bold; text-align: center; background-color: #1C64B4; border-color: #1C64B4; padding: 0 0.5em; // padding: 0 0.20em; } /****************** New Header Search ******************/ #containerHeader DIV#containerHeaderSearch { width: 40.75em; // width: 39em; /* IE Hack */ // width: 39.5em; /* IE Hack */ padding: 0; float: right; padding-bottom: 0; // margin: 0 0.35em 0 0; /* IE Hack */ overflow: hidden; padding-right: 0.5em; } #containerHeaderSearch DIV.containerModeLinks, #containerHeaderSearch DIV.groupSearchInputs { float: right; margin-top: 0.45em; padding-bottom: 0; } #containerHeaderSearch DIV.containerModeLinks { padding-right: 0.5em; padding-top: 0.25em; } #containerHeaderSearch DIV.groupSearchInputs { padding-top: 0.1em; padding-right: 5em; background-image: url("../../../pic.photobucket.com/general/googlelogo_smaller2.gif"); background-repeat: no-repeat; background-position: 100% bottom; } #containerHeaderSearch DIV.containerModeLinks * { vertical-align: middle; } #containerHeaderSearch DIV.containerModeLinks A { color: #FFFFFF; font-weight: normal; } #containerHeaderSearch .containerModeLinks A, #containerHeaderSearch .containerModeLinks A SPAN, #containerHeaderSearch .containerModeLinks SPAN.menuItemSep { display: block; } #containerHeaderSearch .containerModeLinks A SPAN { cursor: pointer; } #containerHeaderSearch .containerModeLinks SPAN.menuItemSep { float: left; padding: 0; color: #000000; margin: 0 0.25em; } #containerHeaderSearch .containerModeLinks A { float: left; text-align: center; // width: 3.4em; /* IE Hack */ } #containerHeaderSearch A#imagesHeaderSearch { width: 3.4em; } #containerHeaderSearch A#videosHeaderSearch { width: 3.2em; } #containerHeaderSearch A#myimagesHeaderSearch { width: 4.25em; } #containerHeaderSearch A#websearchHeaderSearch { width: 2.2em; } #containerHeaderSearch .containerModeLinks A.selected { color: #FFFFFF !important; background-image: url("../../../pic.photobucket.com/borders/search/rounded_left.gif"); background-repeat: no-repeat; background-position: left top; padding: 0 0 0 0.25em; } #containerHeaderSearch .containerModeLinks A.selected SPAN { display: block; background-image: url("../../../pic.photobucket.com/borders/search/rounded_right.gif"); background-repeat: no-repeat; background-position: right top; padding: 0 0.25em 0.2em 0; } #containerHeaderSearch .bttnSearch { border-color: #D0D0D0; background-color: #D0D0D0; color: #000000; font-weight: bold; font-size: 11px; } #containerHeaderSearch #qHeaderSearch { width: 13em; // width: 7.45em; /* IE Hack */ // width: 11em; /* IE Hack */ } /****************************** New Header ******************************/ #containerHeader, #panelFooter { margin-left: auto; margin-right: auto; } #containerHeader { min-width: 900px; margin: 0; padding: 0; background-color: #FFFFFF; color: #000000; } #containerHeader TABLE#tblHeaderFrame { // border-collapse: collapse; width: 100%; // margin: 0 0 0 0; border-color: #1C64B4; border-style: none none solid none; border-width: 0 0 0.75em 0; background-color: #FFFFFF; } #containerHeader TABLE#tblHeaderFrame TD { border-style: none; border-width: 0; } #navLogo { width: 200px; // width: 190px; min-width: 200px; text-align: center; vertical-align: bottom; } #navLogo IMG { /** Header Logo **/ margin: 4px 12px 17px 12px; } /**** For Free/No Ad Header */ .headerAd #navLogo IMG { margin-top: 0; } #navUserMenu { padding: 0.5em 1em 0.5em 0; text-align: right; } /**** For Free/No Ad Header */ .headerAd #navUserMenu { padding: 0.5em 1em 0.5em 0; } #navUserMenu A { font-weight: normal; } #navUserMenu A#welcomeUser { font-weight: bold; } #navUserMenu .menuItemSep { color: #CCCCCC; padding: 0 0.25em; } #navTabs { padding: 0; margin: 0; vertical-align: bottom; } #navTransition { text-align: right; padding: 0; // padding-left: 1em; background-image: url("../../../pic.photobucket.com/navigation/transition2.gif"); background-repeat: no-repeat; background-position: right 0; } #navTransition, #navTransition DIV { width: 4.3em; // width: 5.5em; /* Old IE */ // width: 3.5em; // min-width: 5.3em; } #navSearch { font-size: 95%; width: 45em; // width: 37em; // width: 39em; // width: 30em; padding: 0; vertical-align: middle; background-color: #1C64B4; text-align: right; overflow: auto; } #cellAd { height: 90px; text-align: center; padding: 5px 0 0 0; min-width: 900px; } #cellAd * { margin: 0 auto !important; } /****************** Navigation Tabs ******************/ /****** Navigation Menu (tabs) *******/ UL#menuNavTabs { position: relative; top: 1px; width: 20em; // width: 20.75em; /* IE Hack */ // min-width: 20.5em; /* IE7 Hack */ overflow: visible; float: left; margin: 0; padding: 0; list-style-type: none; font-size: 14px; } UL#menuNavTabs LI { float: left; margin: 0 0.2082em 0 0; padding: 0 0.833em 0 0; background-image: url("../../../pic.photobucket.com/navigation/main_tab_off.gif"); background-repeat: no-repeat; background-position: right top; overflow: visible; } UL#menuNavTabs LI A { display: block; float: left; margin: 0; padding: 5px 4px 5px 15px; background-image: url("../../../pic.photobucket.com/navigation/main_tab_off.gif"); background-repeat: no-repeat; background-position: left top; text-decoration: none; letter-spacing: 0.04em; font-weight: normal; overflow: visible; } UL#menuNavTabs LI A:hover { text-decoration: underline; } UL#menuNavTabs LI A, UL#menuNavTabs LI A SPAN { color: #FFFFFF; } UL#menuNavTabs LI.current { background-image: url("../../../pic.photobucket.com/navigation/main_tab_on.gif"); overflow: visible; border-width: 0; } UL#menuNavTabs LI.current A { background-image: url("../../../pic.photobucket.com/navigation/main_tab_on.gif"); // border-width: 0; font-weight: bold; } UL#menuNavTabs LI.current A:hover { text-decoration: none; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ UL#menuNavTabs LI A {float:none;} /* End IE5-Mac hack */ /* UL#menuNavTabs, #containerHeader DIV#groupSearchModeLinks { // padding-top: 0.4em; } */ /*********************** Page Footer Panel & Menu ************************/ #containerFooter { clear: both; } /**************** Footer Search Panel ********************/ #panelFooterSearch A:link, #panelFooterSearch A:visited, #panelFooterSearch A:hover, #panelFooterSearch A:active { color: #FFFFFF; } #panelFooterSearch { clear: left; padding: 0.8333em 0; margin-bottom: 1px; color: #FFFFFF; background-color: #3066AC; background-image: url("../../../pic.photobucket.com/homepage/searchslice.gif"); background-repeat: repeat-x; background-position: left center; opacity: 0.999999; /* Mac OS Firefox Text Fix */ } #tblFooterSearch { width: 100%; padding: 0 0 0 0; margin: 0 0 0 0; border-collapse: collapse; } #tblFooterSearch TD { padding: 0 0 0 0; border-width: 0; width: 33.3%; vertical-align: middle; border-width: 0 1px 0 0; border-style: dotted; border-color: #A0A0A0; } /** Image Counter **/ #panelFooterSearch #cellImageCounter_FooterSearch { width: 26.33%; // width: 25%; padding: 0 2% 0 1%; text-align: right; } #panelFooterSearch #cellImageCounter_FooterSearch H3 { font-size: 160%; margin: 0; } #panelFooterSearch #cellImageCounter_FooterSearch P { margin: 0; font-size: 90%; font-family: Arial, Verdana, sans-serif; color: #99CCFF; } /** Search Panel **/ #panelFooterSearch #cellSearch_FooterSearch { width: 36.33%; padding: 0 1%; } #containerFooterSearch { margin: 0 auto; width: 310px; background-image: url("../../../pic.photobucket.com/general/google_logo.gif"); background-repeat: no-repeat; background-position: 100% 15px; } #containerFooterSearch * { vertical-align: middle; } #containerFooterSearch #myalbumFooterSearch { /* Checkbox */ margin-left: 2em; } #lblmyalbum { font-family: Arial, Verdana, sans-serif; color: #666666; } #groupSearchModeLinksFooterSearch A, #groupSearchModeLinksFooterSearch A SPAN, #groupSearchModeLinksFooterSearch SPAN.menuItemSep { display: block; height: 14px; font-weight: normal } #groupSearchModeLinksFooterSearch A SPAN { cursor: pointer; } #groupSearchModeLinksFooterSearch SPAN.menuItemSep { float: left; padding: 0; color: #999999; margin: 0 0.25em; } #groupSearchModeLinksFooterSearch A { float: left; text-align: center; /* IE Hack */ // width: 3.4em; } A#imagesFooterSearch { width: 3.4em; } A#videosFooterSearch { width: 3.2em; } A#myimagesFooterSearch { width: 4.25em; } A#websearchFooterSearch { width: 2.2em; } #groupSearchModeLinksFooterSearch A.selected { color: #FFFFFF !important; background-image: url("../../../pic.photobucket.com/borders/search/rounded_left.gif"); background-repeat: no-repeat; background-position: left top; padding: 0 0 0 3px; } #groupSearchModeLinksFooterSearch A.selected SPAN { display: block; background-image: url("../../../pic.photobucket.com/borders/search/rounded_right.gif"); background-repeat: no-repeat; background-position: right top; padding: 0 3px 0 0; } #containerFooterSearch .groupSearchInputs { clear: left; } #submitFooterSearch { background-color: #D0D0D0; border-color: #D0D0D0; color: #000000; } /** Top Searches **/ #panelFooterSearch #cellTopSearches_FooterSearch { width: 29.33%; // width: 30.66%; padding: 0 1% 0 2%; text-align: left; border-width: 0; } #panelFooterSearch #cellTopSearches_FooterSearch H3 { font-size: 90%; margin: 0; color: #99CCFF; } #panelFooterSearch #cellTopSearches_FooterSearch P { width: 12em; margin: 0; font-size: 90%; color: #A0A0A0; } #panelFooterSearch #cellTopSearches_FooterSearch P A { font-weight: normal; } /**************** End - Footer Search Panel ********************/ #containerFooter { overflow: auto; } #panelFooter { background-image: url("../../../pic.photobucket.com/general/footer_gradient.gif"); background-repeat: repeat-x; background-position: left top; background-color: #FEFEFE; font-size: 12px; padding: 0; overflow: auto; background-color: #FEFEFE; // float: left; /* IE Hack */ } #panelFooter .menuItemSep { padding: 0 0.5em; color: #999999; } #panelFooter A { white-space: nowrap; font-weight: normal; } #panelFooter #copywrite { background-image: url("../../../pic.photobucket.com/general/footer_left.gif"); background-repeat: no-repeat; background-position: left top; float: left; margin: 0; padding: 0; padding-left: 18px; text-align: left; color: #999999; } #panelFooter #menuBottom { background-image: url("../../../pic.photobucket.com/general/footer_right.gif"); background-repeat: no-repeat; background-position: right top; float: right; padding-right: 18px; } #panelFooter #copywrite, #panelFooter #menuBottom { padding-top: 1em; padding-bottom: 1em; } /****** General ********/ #containerAll { clear: both; } /****** EXIF ********/ #containerPhotoInfo { font-weight: bold; } #containerExifDesc { position: relative; } #containerExifDesc SPAN { position: absolute; bottom: 2px; left: 2px; } #containerPhotoInfo #containerExifSponsor { width: 450px; margin: 0 0 0 auto; text-align: right; } #containerPhotoInfo TABLE { clear: both; border-collapse: collapse; margin-top: 3px; border-style: dotted; border-width: 1px; } #containerPhotoInfo TABLE COL { width: 50%; } #containerPhotoInfo TABLE TD { border-style: dotted; border-width: 1px; padding: 0.5em; font-size: 95%; font-weight: normal; } LABEL#photoPathLabel { display: inline; } #photoMetaData SPAN A#editPhotoPathTitle:link, #photoMetaData SPAN A#editPhotoPathTitle:visited, #photoMetaData SPAN A#editPhotoPathTitle:hover, #photoMetaData SPAN A#editPhotoPathTitle:active { text-decoration: none; } #photoMetaData #exifDataHandle { outline: none; font-weight: normal; } #photoMetaData #exifDataHandle SPAN { display: inline; margin-bottom: 0; } #photoMetaData A { text-decoration: none; } #photoMetaData A:hover { text-decoration: underline; } #photoMetaData #exifData { margin-top: 20px; } #photoMetaData #audioContentAttribution { float: right; } #photoMetaData #audioContentAttribution #audioContentAttributionImage { float: left; } #photoMetaData #audioContentAttribution #audioContentAttributionText { float: left; padding-left: 0.5em; font-weight: bold; } #photoMetaData P { margin-bottom: 3px; } #photoMetaData #containerMetaLeft { }