/* Page Structure & Globals ------------------------ */ html { height: 100%; margin: 0px; overflow: -moz-scrollbars-vertical; padding: 0px; } body { background: #E7E6E4; color: #666666; font-family: "Trebuchet MS", Arial, sans-serif; font-size: 10px; font-style: normal; font-variant: normal; font-weight: normal; height: 100%; line-height: 16px; margin: 0px 15px; padding: 0px; text-align: center; } a, a:link { color: #0570AD; text-decoration: none; } a:hover { color: #0570AD; text-decoration: underline; } a:active { color: #96DCFA; } a:visited { color: #5440B6; } #pageContainer { background: #FFFFFF; border-bottom: 15px solid #FFFFFF; margin: 0px auto; padding: 0px; position: relative; z-index: 2; text-align: left; width: 964px !important; } h1 { color: #004AAC; font-family: 'Trebuchet MS', 'Lucida Grande', Lucida, Helvetica, Verdana, Arial, sans-serif; font-weight: bold; font-size: 20px; line-height: 22px; margin: 0px 0px 15px 0px; } h2 { color: #78766F; margin: 30px 0px 8px 0px; text-transform: uppercase; font-size: 13px; font-weight: bold; } #bodyContent { width: 924px; margin: 0px 20px; } #bodyContent a { text-decoration: none; } #bodyContent a:hover { text-decoration: underline; } #bodyContent p { font-size: 12px; margin: 0px 10px 1.0em 0px; } #bodyContent p a:visited { color: #0F52D1; } .smallText { font-size: 11px; } .tinyText { font-size: 10px; } div.dividerGeneric { position: relative; height: 1px; line-height: 1px; border-top: 1px #cccccc solid; margin-top: 9px; margin-bottom: 20px; clear: both; } /* MASTER GRID STYLES added by kaiser shahid [2007-10-26] Moving forward, maybe we can use these instead of combinations of leftandcenter, leftcolumn, etc. By default, all gridCol have a left margin of 12px. using left or right adds the edge margins (28px in theory, 20px in reality). */ div.gridCol { width: 66px; margin-left: 12px !important; margin-bottom: 12px !important; float: left !important; } div.gridCol.noLeft { margin-left: 0px !important; } div.gridCol.noMargin { margin: 0px !important; } div.gridCol.left { margin-left: 20px !important; _margin-left: 10px !important; } div.gridCol.right { margin-right: 20px !important; _margin-right: 10px !important; } div.gridCol.two { width: 144px !important; } div.gridCol.three { width: 222px !important; } div.gridCol.four { width: 300px !important; } div.gridCol.five { width: 378px !important; } div.gridCol.six { width: 456px !important; } div.gridCol.seven { width: 534px !important; } div.gridCol.eight { width: 612px !important; } div.gridCol.nine { width: 690px !important; } div.gridCol.ten { width: 768px !important; } /* added [2007-11-14] a 'group' column should be used to group together two or more gridCols. doing so would allow the designer to insert rows that span multiple columns while keeping the overall grid structure. for instance --------------- ---- -xxxx-xxxxxxxxx ---- -xxxx-xxxxxxxxx ---- -yyyyyyyyyyyyyy ---- -xxxx-xxxxxxxxx ---- -xxxx-xxxxxxxxx ---- --------------- ---- this shows a layout of, say, 8x4. within the 8-column, we have a 3x5-column layout mixed in with an 8-column layout. a gridCol group should occupy the space equalling all its sub-columns plus any margin (but should not itself use any margins), and was envisioned to be used as 'edge' columns (i.e. left and right). therefore, the widths are the widths above plus 20px to account for either left or right margin. because of IE's stupidity, i had to revert to gridColGroup%Size%, since it didn't like definitions for gridCol.group.eight but has no problems with gridColGroupEight, etc. */ div.gridColGroupTwo { width: 164px !important; margin: 0px !important; float: left !important; } div.gridColGroupThree { width: 242px !important; margin: 0px !important; float: left !important; } div.gridColGroupFour { width: 320px !important; margin: 0px !important; float: left !important; } div.gridColGroupFive { width: 398px !important; margin: 0px !important; float: left !important; } div.gridColGroupSix { width: 476px !important; margin: 0px !important; float: left !important; } div.gridColGroupSeven { width: 554px !important; margin: 0px !important; float: left !important; } div.gridColGroupEight { width: 632px !important; margin: 0px !important; float: left !important; } div.gridColGroupNine { width: 710px !important; margin: 0px !important; float: left !important; } div.gridColGroupTen { width: 788px !important; margin: 0px !important; float: left !important; } /* Email Overlay ------------- */ #emailOverlay { position: absolute; top: 170px; left: 10px; z-index: 1; width: 354px; height: 328px; overflow: hidden; background: #FFFFFF url(http://assets.aarp.org/internal/tech/scrum3/loginOverlay_bg.gif) no-repeat; } .emailOverlay { position: absolute; top: 170px; left: 10px; z-index: 1; width: 354px; height: auto !important; overflow: auto !important; background: #FFFFFF url(http://assets.aarp.org/internal/tech/scrum3/loginOverlay_bg.gif) no-repeat; } #emailOverlay form, #emailOverlay table, .emailOverlay form, .emailOverlay table { padding: 0px; margin: 0px; } h1#emailTitle { background-image: url(http://assets.aarp.org/internal/tech/scrum3/PleaseSignIn.gif); background-repeat: no-repeat; text-indent: -9999px; height: 35px; margin-left: 15px; margin-top: 30px; } #emailOverlay table, .emailOverlay table { margin-left: 10px; margin-bottom: 20px; } #emailOverlay td, .emailOverlay td { font-size: 12px; padding: 4px; } #emailOverlay td.labels, .emailOverlay td.labels { width: 100px; } #emailOverlay td.inputs, .emailOverlay td.inputs { width: 125px; } #emailOverlaySubmit { margin: 10px 0px; } #emailOverlayWait { position: absolute; top: 220px; left: 50px; z-index: 2; width: 155px; height: 115px; overflow: hidden; background: #FFFFFF; border: 1px solid #999; padding-top: 60px; padding-left: 95px; -moz-opacity:.90; opacity:.90; filter:alpha(opacity=90); } #emailOverlayValidationError { margin-left: 20px; } /* Photo Upload Form --------------------------------- */ #requiredHeading { margin-bottom: 15px; text-align: right; } span.required { color: #EE3224; font-family: Verdana; font-size: 22px; vertical-align: middle; } #uploadPhotosDetailDiv { margin-left: 40px; position: relative; } #uploadPhotosDetailDiv hr { padding-bottom: 20px; border: none; height: 0px; margin-bottom: -1px; } div.formRow { clear: both; padding-left: 20px; } div.formRow span.formLabel { float: left; text-align: right; height: 20px; padding-right: 10px; width: 140px; } div.formRow span.formField { float: left; margin-bottom: 10px; text-align: left; width: 210px; } div.uploadPhotoDetailForm { float: left; position: relative; width: 460px; } div.uploadPhotoDetailForm textarea, div.uploadPhotoDetailForm input.inputText, div.uploadPhotoDetailForm select { width: 210px; } div.uploadPhotoDetailPhoto { float: left; position: relative; width: 240px; } /* Specific to Pages & Functionality --------------------------------- */ .fieldNote { margin: 0px; padding-left: 15px; font-family: Georgia,Times,serif; font-size: 11px; } input { padding: 0px; margin: 0px; } input.action { margin: 15px 0px 0px 190px; border: none; } .cancelButton { border: none; } #breadcrumb { font-family: Arial,"MS Trebuchet",sans-serif; font-size: 14px; font-weight: bold; margin-top: 20px; } #breadcrumb a { text-decoration: none; } /* Glue and Shims --------------- */ .noTopMargin { margin-top: 0px !important; } .noBottomMargin { margin-bottom: 0px !important; } .noMargin { margin: 0px !important; } div.clearer { height: 1px; clear: both; } .clear { clear: both; line-height: 0px; } .clearMe12 { clear: both; height: 12px; } /* added by Kaiser [2007-11-28] */ .clearMe25 { clear: both; height: 25px; } .clearMe50 { clear: both; height: 50px; } .clearMe75 { clear: both; height: 75px; } .clearMe100 { clear: both; height: 100px; } .centered { text-align: center; } .noBorder { border: none; } .extraSpaceAbove { padding-top: 20px; } .extraSpaceBelow { padding-bottom: 20px; } .systemErrors { color: #F40E0E; } p.systemErrors { font-size: 14px; margin: 20px 0px; } img.button, .button, input.button { border: none; } /*pagination*/ div.pageNavigation { float:right; border:0px; padding:0px; margin:0px; } a.pageNavigation { display:inline; font-size:13px; font-weight:bold; border:0px; padding:0px; margin:0px; } ul.pageNavigation { display:inline; border:0px; padding:0px; margin:0px; } ul.pageNavigation li { display:inline; padding:0px; margin:0px; border:0px; } a.paginationLink:link { border: 1px solid #0066CB; font-size:13px; font-weight:bold; text-decoration:none; padding-left:5px; padding-right:5px; padding-top:0px; padding-bottom:0px; margin:0px; line-height:1.5em; } div.pager { font-size: 11px; text-align: center; padding-top: 20px; padding-bottom: 20px; } table.friendRequests a.thumbnailImgLink { display:block; } .friendRequestsAll { margin-left:5px; float:left; } input.friendRequestSubmit { margin-left:5px; float:left; } /** * CSS support (added by Jim [2007-06-14]) */ span.clear { display:block; clear:both; height:1px; line-height:0px; font-size:0px; margin-bottom:-1px; } /* video thumbnail styles, added by Brian P. */ a.videoThumbnail { position: relative; display: block; } img.videoIcon { position: absolute; top: 0px; left: 0px; z-index: 1; -moz-opacity: .40; opacity: .40; filter: alpha(opacity=40); } /* %%%%%%%%%% Ad wrappers %%%%%%%%%% added by kaiser shahid [2007-09-20] wrap around ads. right now, there's only a bordered box or no box. as new requirements are needed, add ad stylings here. */ div.ad { margin: 9px 0px !important; text-align: center !important; } div.ad.default { padding: 5px; border: 1px solid #999; } div.ad div { clear: both; padding-top: 5px !important; padding-bottom: 5px !important; letter-spacing: 1px; text-align: center; background: #ccc; } div.ad.default div { background: #fff !important; padding-bottom: 0px !important; } /* %%%%%%%%%% General Status %%%%%%%%%% added by kaiser shahid [2007-10-10] general status box. */ #generalStatus, .generalStatus { margin-bottom: 9px; font-size: 10pt; font-weight: bold; padding: 5px; border: 2px solid #999; } /* added 2007-10-17] */ #commentResponse.generalStatus { margin-top: 9px; } /* added by kaiser shahid [2007-10-12] */ div.memberBenefits { margin-top: 15px; } /****************************** STYLES FOR SEARCH RESULTS AND ARCHIVES added by Yonas Hassen (14 August 2007) last modified by Yonas Hassen: (08 October 2007) last modified by Kaiser Shahid: 2007-11-12 > TODO: remove #archivesContainer styling (for main div) > since we're moving to the gridCol system of sizing columns. > > added general .searchContainer selector for inner things > > TODO: move to .searchContainer for styles that are shared between > the two searches. ******************************/ #searchContainer, #archivesContainer { width: 612px; float: left; margin: 0; padding: 0 0 0 20px; } #searchContainer h1, .searchContainer h1, #searchContainer h3, .searchContainer h3, #searchContainer p, .searchContainer p, #searchContainer td, .searchContainer td, #archivesContainer h1, #archivesContainer h3, #archivesContainer p, #archivesContainer td{ font-family: Verdana, Arial, Helvetica, sans-serif; color: #333; } #searchContainer h1, .searchContainer h1 { font-weight: bold; font-size: 23px; margin: 10px 0; } #archivesContainer h1 { font-weight: 100; font-size: 23px; margin: 10px 0; } #searchResultsListing { font-size: 1.2em; } #searchResultsListing h2, .searchContainer h2 { font-size: 1.8em; margin-bottom: -10px; padding-bottom: 0; line-height: 1em; /* added by kaiser [2007-11-13] for bug D-02178 */ } #searchContainer h3, .searchContainer h3, #searchContainer p, .searchContainer p, #searchContainer td, .searchContainer td, #archivesContainer h3, #archivesContainer p, #archivesContainer td { font-size: 12px; margin: 0; padding: 0; } #searchContainer p#helpMe, .searchContainer p#helpMe { float: right; } #searchContainer table#searchField, .searchContainer table#searchField { margin-top: 10px; } #searchContainer td.pad10, .searchContainer td.pad10, #archivesContainer td.pad10 { padding-left: 10px; } #searchContainer td.pad25, .searchContainer td.pad25, #archivesContainer td.pad25 { padding-left: 25px; } #searchContainer div.odd, .searchContainer div.odd, #searchContainer div.even, .searchContainer div.even, #archivesContainer div.odd, #archivesContainer div.even { padding: 10px; } #searchContainer div.odd, .searchContainer div.odd, #archivesContainer div.odd { background-color: #fff; } #searchContainer div.even, .searchContainer div.even, #archivesContainer div.even { background-color: #eaeaea; } #searchContainer p.bottomLine, .searchContainer p.bottomLine, #archivesContainer p.bottomLine { margin-top: 5px; } span#numOfResults, span.searchKeyword, span#numOfResults, span.searchKeyword { font-weight: bold; } #searchContainer form, .searchContainer form, #archivesContainer form { margin: 10px 0 0 0; padding: 0; } #searchContainer a, .searchContainer a, #archivesContainer a { color: #0066cc; text-decoration: none; } #searchContainer a:hover, .searchContainer a:hover, #archivesContainer a:hover { text-decoration: underline; } #searchContainer a:visited, .searchContainer a:visited, #archivesContainer a:visited { color: #990099; } #searchContainer div#pagination, div.searchContainer div#pagination, #archivesContainer div.pagination, div.searchContainer div.pagination { background-color: #eaeaea; padding: 5px; margin: 18px 0px 0px 0px; } #searchContainer div#pagination td, div.searchContainer div#pagination td, #archivesContainer div.pagination td, div.searchContainer div.pagination td { font-weight: bold; width: 213px; } div.searchContainer div.pagination.bottom { margin-top: 0px; } /***************************** END: STYLES FOR SEARCH RESULTS *****************************/
| ||||||
![]() ![]() | |||||||||||||||||||||||||