Created
October 31, 2013 03:09
-
-
Save schneidan/7243853 to your computer and use it in GitHub Desktop.
This is the CSS for the Denver Post's 100-year-later Titanic section at denverpost.com/titanic
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* [file] redesign_sectionpage.css */ | |
| /* css for SECTION PAGE LAYOUT */ | |
| body.bodyStyle { | |
| background-color: #0A1F40; | |
| } | |
| div#masthead_section { | |
| height:auto!important; | |
| } | |
| div#masthead_sectiondate { | |
| display:none!important; | |
| } | |
| TD.preHeaderRegion { | |
| background: #0A1F40!important; | |
| } | |
| .footerRegion .adElement { | |
| background: #0A1F40!important; | |
| } | |
| div#navRegistration { | |
| display:none!important; | |
| } | |
| .postHeaderRegion1 div#navwrapper, .postHeaderRegion1 div#navcontainer { | |
| background: #0A1F40!important; | |
| } | |
| div#navcontainer { | |
| background: #0A1F40!important; | |
| } | |
| div#navwrapper { | |
| background: #0A1F40!important; | |
| } | |
| div.contentStyle { | |
| background: none repeat scroll 0 0 #0A1F40; | |
| color:#eee; | |
| } | |
| div.contentStyle .region5 .boxblue h1, div.contentStyle .region4 .boxblue h1, div.contentStyle .region3 .boxblue h1, div.contentStyle .region5 .boxblue h2, div.contentStyle .region4 .boxblue h2, div.contentStyle .region3 .boxblue h2 { | |
| color: #fff; | |
| margin: 0 0 8px; | |
| } | |
| div.contentStyle .region5 .boxblue h2, div.contentStyle .region4 .boxblue h2, div.contentStyle .region3 .boxblue h2 { | |
| font: 12px Arial, Verdana, sans-serif; | |
| color: #fff; | |
| margin: 0 0 8px; | |
| } | |
| div.contentStyle .region5 h1, div.contentStyle .region4 h1, div.contentStyle .region3 h1 { | |
| font-size:14px; | |
| line-height:14px; | |
| padding: 0 0 6px; | |
| } | |
| div.contentStyle .region5 .boxblue h1 a:link, div.contentStyle .region4 .boxblue h1 a:link, div.contentStyle .region3 .boxblue h1 a:link, div.contentStyle .region5 .boxblue h2 a:link, div.contentStyle .region4 .boxblue h2 a:link, div.contentStyle .region3 .boxblue h2 a:link { | |
| color: #fff; | |
| margin: 0 0 8px; | |
| } | |
| div.contentStyle .region5 .boxblue a:link, div.contentStyle .region4 .boxblue a:link, div.contentStyle .region3 .boxblue a:link { | |
| color: #fff; | |
| margin: 0 0 8px; | |
| } | |
| div.contentStyle .region5 .boxblue p, div.contentStyle .region4 .boxblue p, div.contentStyle .region3 .boxblue p { | |
| color: #fff; | |
| } | |
| td.region4 .complexListingBox { | |
| background: #0A1F40!important; | |
| margin: 0 0 25px; | |
| width: 100%; | |
| color:#eee; | |
| } | |
| td.region4, td.region3, td.region5 { | |
| background: #0A1F40!important; | |
| margin: 0 0 25px; | |
| width: 327px; | |
| color:#eee; | |
| } | |
| td.region4 { | |
| border-right: none!important; | |
| } | |
| td.region5 .complexListingBox { | |
| background: #0A1F40!important; | |
| margin: 0 0 25px; | |
| width: 100%; | |
| color:#eee; | |
| } | |
| td.region1 { | |
| background: #0A1F40!important; | |
| line-height:0px!important; | |
| } | |
| td.region1 table td { | |
| background: #0A1F40!important; | |
| height:616px; | |
| } | |
| .region5 .boxblue, .region3 .boxblue, .region4 .boxblue , .region5 .boxblue .contentblock, .region3 .boxblue .contentblock, .region4 .boxblue .contentblock{ | |
| background:#0A1F40!important; | |
| } | |
| .region5 .boxblue ul, .region3 .boxblue ul, .region4 .boxblue ul, .region5 .boxblue .contentblock ul, .region3 .boxblue .contentblock ul, .region4 .boxblue .contentblock ul{ | |
| background:#0A1F40!important; | |
| color: #fff; | |
| } | |
| .region5 .boxblue ul li, .region3 .boxblue ul li, .region4 .boxblue ul li, .region5 .boxblue .contentblock ul li, .region3 .boxblue .contentblock ul li, .region4 .boxblue .contentblock ul li { | |
| background:#0A1F40!important; | |
| color: #fff; | |
| } | |
| #redesign_default div.complexListingBox a.listingItemTitle { | |
| color: #fff; | |
| display: block; | |
| padding: 10px 0 0; | |
| } | |
| #redesign_default .boxgrey a:visited, #redesign_default .boxwhite a:visited, #redesign_default table.complexListingBox a.listingItemTitle:visited, #redesign_default .tabbedbox .tabboxoutline li a:visited, #redesign_default table.complexListingBox a.complexListingLink:visited, #redesign_default a:visited { | |
| color: #6E7FB3; text-decoration:none!important; | |
| } | |
| #redesign_default .boxgrey a:hover, #redesign_default .boxwhite a:hover, #redesign_default table.complexListingBox a.listingItemTitle:hover, #redesign_default .tabbedbox .tabboxoutline li a:hover, #redesign_default table.complexListingBox a.complexListingLink:hover, #redesign_default a:hover { | |
| color: #6E7FB3; text-decoration:none!important; | |
| } | |
| #redesign_default div.contentStyle .region5 .boxblue a:hover h1, #redesign_default div.contentStyle .region5 .boxblue a:hover h2, #redesign_default div.contentStyle .region5 .boxblue a:visited h1, #redesign_default div.contentStyle .region5 .boxblue a:visited h2, #redesign_default div.contentStyle .region4 .boxblue a:hover h1, #redesign_default div.contentStyle .region4 .boxblue a:hover h2, #redesign_default div.contentStyle .region4 .boxblue a:visited h1, #redesign_default div.contentStyle .region4 .boxblue a:visited h2 { | |
| color: #6E7FB3; text-decoration:none!important; | |
| } | |
| #redesign_default table.complexListingBox a.listingItemTitle:hover, #redesign_default .tabbedbox .tabboxoutline li a:hover, #redesign_default table.complexListingBox a.complexListingLink:hover, #redesign_default a:hover { | |
| color: #6E7FB3!important; | |
| } | |
| /* CENTER COLUMN - blue border - left */ | |
| #redesign_sectionpage{display:block; clear:both} | |
| td.region4 { | |
| /*padding: 8px 0 8px 8px; | |
| border-left: 10px solid #fff;*/ | |
| } | |
| /* CENTER COLUMN - blue border - right | |
| td.region13, td.region5 { | |
| /*width: 280px;*/ | |
| } | |
| /* CENTER COLUMN - blue border - left */ | |
| div.region4and5box{ | |
| background: #e3e6eb; | |
| border-left: 10px solid #fff; | |
| padding: 8px 0px 0px 8px; | |
| } | |
| div.region4 { | |
| width: 292px; | |
| /*padding: 8px 0 8px 8px;*/ | |
| background: #e3e6eb; | |
| /*border-left: 10px solid #fff;*/ | |
| } | |
| /* CENTER COLUMN - blue border - right */ | |
| div.region5 { | |
| background: #e3e6eb; | |
| /* width: 315px; */ | |
| } | |
| div.region10 { | |
| width: 327px; | |
| /*background: lime;*/ | |
| float: left; | |
| } | |
| div.region13 { | |
| float: left; | |
| margin-right: 0; | |
| padding-right: 0; | |
| } | |
| /*-------------------------------*/ | |
| /* MAIN headline */ | |
| .region2 img.listing3Image { | |
| margin-right: 10px; | |
| } | |
| /*td.region2 .lastUpdatedDate { | |
| color: #8d1427; | |
| text-transform: uppercase; | |
| font: normal 11px arial, helvetica, verdana, sans-serif; | |
| padding-bottom: 5px; | |
| display: block; | |
| }*/ | |
| .region2 li.listNoImage { | |
| margin: 0; | |
| } | |
| .region2 .listingItemTitle { | |
| font-size: 16px; | |
| } | |
| /* fix for odd ie bug - not a problem with proper html markup (missing ul tag) */ | |
| *html .region2 li.listNoImage { | |
| margin-left: 0px; | |
| } | |
| /* CENTER COLUMN - right */ | |
| /* see also .bluebox styles for the following h1 tags */ | |
| .region4 h1, | |
| .region5 h1 { | |
| font-family: Arial, Verdana, sans-serif; | |
| font-size: 11px; | |
| line-height: 12px; | |
| text-transform: uppercase; | |
| margin: 0 0 0 0; | |
| padding: 0 0 3px 0; | |
| border-bottom: 1px dashed #ccc; | |
| width: 95%; | |
| } | |
| .region4 li h1, | |
| .region5 li h1 { | |
| font: bold 12px Arial, Helvetica, sans-serif; | |
| color: #A8130C; | |
| background: none; | |
| padding: 0; | |
| margin: 0 0 5px 0; | |
| height: auto; | |
| } | |
| /* if a complexListing is used in regions 4 or 5 - style differently to go with bluebox styles */ | |
| .region4 table.complexListingBox a.complexListingTitle, | |
| .region5 table.complexListingBox a.complexListingTitle { | |
| font: bold 12px arial, verdana, sans-serif; | |
| color: #eee; | |
| padding: 0; | |
| text-transform: uppercase; | |
| display: block; | |
| margin: 0 0 2px 0; | |
| width: 300px; | |
| border-bottom: 1px dashed #ccc; | |
| } | |
| .region4 table.complexListingBox .listingItemTitle, | |
| .region5 table.complexListingBox .listingItemTitle { | |
| padding: 0; | |
| margin: 0; | |
| } | |
| .region4 table.complexListingBox a.listingItemTitle, | |
| .region5 table.complexListingBox a.listingItemTitle { | |
| padding: 0; | |
| margin: 5px 0 0 0; | |
| } | |
| .region4 table.complexListingBox .listingArticleBlurb, | |
| .region5 table.complexListingBox .listingArticleBlurb { | |
| margin: 5px 0 10px 0; | |
| padding: 0; | |
| } | |
| .region4 a.listingArticleLinkTo, | |
| .region5 a.listingArticleLinkTo { | |
| font-size: 11px; | |
| line-height: 17px; | |
| margin: 5px 0 0 5px; | |
| } | |
| .region4 a.listingArticleLinkTo img, | |
| .region5 a.listingArticleLinkTo img { | |
| margin: 0 5px 0 0; | |
| } | |
| .region4 table.complexListingBox li.listNoImage, .region4 li.listNoImage, | |
| .region5 table.complexListingBox li.listNoImage, .region5 li.listNoImage { | |
| list-style: none; | |
| background:transparent url(http://extras.mnginteractive.com/live/media/site36/2008/0303/20080303_101049_bullet_gray.gif) no-repeat scroll 0pt 5px; | |
| font: normal 12px arial, verdana, sans-serif; | |
| line-height: 1em; | |
| margin: 8px 0 3px 0px; | |
| padding: 0; | |
| display: block; | |
| } | |
| .region4 table.complexListingBox li.listNoImage a.complexListingLink, .region4 li.listNoImage a.complexListingLink, | |
| .region5 table.complexListingBox li.listNoImage a.complexListingLink, .region5 li.listNoImage a.complexListingLink { | |
| color: #eee; | |
| display: block; | |
| line-height: 14px; | |
| margin-left: 10px; | |
| padding: 0; | |
| font: normal 12px arial, helvetica, sans-serif; | |
| } | |
| /* --- FIX for ie - rendering differently due to lack of ul tag --- */ | |
| *html .region4 table.complexListingBox li.listNoImage, *html .region4 li.listNoImage, | |
| *html .region5 table.complexListingBox li.listNoImage, *html .region5 li.listNoImage { | |
| padding: 0; | |
| clear: both; | |
| margin: 0 0 5px 0px; /* was margin-left: 13px */ | |
| line-height: 14px; | |
| background:transparent url(http://extras.mnginteractive.com/live/media/site36/2008/0303/20080303_101049_bullet_gray.gif) no-repeat scroll 0pt 5px; | |
| } | |
| *html .region4 table.complexListingBox li.listNoImage a.complexListingLink, *html .region4 li.listNoImage a.complexListingLink, | |
| *html .region5 table.complexListingBox li.listNoImage a.complexListingLink, *html .region5 li.listNoImage a.complexListingLink { | |
| margin: 0; | |
| padding: 0 0 0 10px; | |
| text-indent: -15px; | |
| } | |
| /* --- END ie fix --- */ | |
| /* Edit 20061127 Joe Murphy: Reduced the bottom padding from 30px to 0px increased the top from 10px to 15px, added the margin-left declaration */ | |
| div.listingItemTitle { | |
| padding: 15px 0 0px 0; | |
| margin-left:0px!important; | |
| font: normal 11px arial, helvetica, verdana, sans-serif; | |
| color: #aaa ; | |
| } | |
| /* if a pollsbox is used in regions 4 or 5 - style differently to go with bluebox styles */ | |
| .region5 table.pollsBox { | |
| margin: 10px 0 25px 0; | |
| width: 100%; | |
| height: 100%; | |
| } | |
| .region5 table.pollsBox td.pollsAnswer { | |
| padding-left: 30px; | |
| text-indent: -3px; | |
| } | |
| .region5 table.pollsBox td.pollsAnswer input { | |
| margin-left: -20px; | |
| } | |
| .nobullet { | |
| list-style-type: none; | |
| background: none; | |
| } | |
| .inline | |
| { | |
| display: inline !important; | |
| } | |
| /* Edit 20061103 Joe Murphy Fixes the div.region5 float:right lack-of-margin issue on section indexes */ | |
| div.region4and5box | |
| { | |
| padding:10px!important; | |
| } | |
| /* Edit 20061109 Joe Murphy Fixes the div.region6 width issues float:right lack-of-margin issue on section indexes */ | |
| div.region6, div.region3 | |
| { | |
| padding-left:10px!important; | |
| _padding:0; | |
| } | |
| div.region3 | |
| { | |
| _width:330px; | |
| _padding:0 0 0 5px!important; | |
| } | |
| /* Edit 20070502 Joe Murphy Fixes the skinny poll width on section fronts */ | |
| table.pollsBox | |
| { | |
| width:300px!important; | |
| } | |
| a.weatherWarn {padding: 0 0 3px 0x;margin: 0;text-align: left;font: bold 11px Arial, Helvetica, sans-serif;color:red; | |
| } | |
| .woodyback { | |
| position : relative; | |
| left : 0; | |
| top : 0; | |
| height :480; | |
| width : 640; | |
| } | |
| .woodyimage { | |
| position : absolute; | |
| left : 25; | |
| top : 92; | |
| } | |
| /*style for red highlighted freeform headers*/ | |
| h1.red {color: #A8130C;} | |
| /*sets the mini-nav list in the header to float right*/ | |
| /* | |
| .region5 ul.mininav {color: #FFF; float: right;list-style: none;padding: 0;margin: 0;font: 11px Arial, Helvetica, sans-serif;} | |
| .region5 ul.mininav li {float: left;margin: 8px 3px 0 0;line-height: 20px;} | |
| .region5 ul.mininav li img {margin: 0 0 0 6px;padding: 4px 0 0 0;} | |
| .region5 ul.mininav li a, ul.mininav li a:visited {color: #FFF; text-decoration: none;} | |
| .region5 ul.mininav li a:hover {text-decoration: underline;} | |
| */ | |
| /*-------------------------------*/ | |
| div.clear { | |
| clear: both; | |
| } | |
| p | |
| { | |
| font: 12px Arial, Helvetica, sans-serif; | |
| margin-bottom:3px; | |
| } | |
| table.complexListingBox li.listNoImage { | |
| background:transparent url(http://extras.mnginteractive.com/live/media/site36/2008/0303/20080303_101049_bullet_gray.gif) no-repeat scroll 0pt 8px; | |
| font: normal 12px/15px arial, verdana, sans-serif; | |
| margin: 0px 0 3px 2px; | |
| padding: 0; | |
| display: block; | |
| } | |
| .region2 .complexListingBox { | |
| margin: 60px 0 0 0; | |
| } | |
| .region2 .complexListingTitle { | |
| font-weight: bold; | |
| text-transform: uppercase; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| .region2 .complexListingImage { | |
| padding: 10px 10px 0 0; | |
| } | |
| .region2 .listingArticleBlurb { | |
| margin: 0; | |
| padding: 0; | |
| } | |
| .region2 table.complexListingBox a.listingItemTitle { | |
| font-size: 24px; | |
| } | |
| /* MW added during Redesign 08 */ | |
| .region4 h1, .region5 h1 { | |
| margin: 20px 0 0 0; | |
| } | |
| /* Special Sections CSS 8/08 MW */ | |
| .specialsection { | |
| margin: 10px 0 0 5px; | |
| width: 300px; | |
| } | |
| .specialsection h1 { | |
| font-size: 18px; | |
| font-family: Times, "Times New Roman", Georgia, Serif; | |
| color: #003459; | |
| text-transform: none; | |
| font-weight: normal; | |
| border: 0; | |
| margin: 0 0 0px 0; | |
| padding: 0; | |
| line-height: 20px; | |
| } | |
| .specialsection h1 a:link, | |
| .specialsection h1 a:visited { | |
| text-decoration: none; | |
| } | |
| .specialsection h1 a:hover, | |
| .specialsection h1 a:active { | |
| text-decoration: none; | |
| } | |
| #specialmultimedia img { | |
| background-color:#FFFFFF; | |
| border:1px solid #A5A5A5; | |
| padding:4px; | |
| } | |
| #specialmultimedia li { | |
| height: 25px; | |
| margin: 4px 0 0 0; | |
| font-size: 11px; | |
| padding: 2px 0 0 20px; | |
| } | |
| ol | |
| { | |
| margin-top:0; | |
| } | |
| /* Changes made to make full-span /greenbusiness CL look less wonky on the bulleted-list items */ | |
| td.region2b span#redesign_complexListing_layout5 { margin-left: 15px; display:block; } | |
| td.region2b span#redesign_complexListing_layout5 table.complexListingBox a.complexListingLink { display:inline; } | |
| /* sports- and business-specific breaking news widget adjustments */ | |
| #bnews-widget { width: 294px!important; _width:325px!important; margin-right:0!important; } | |
| .region3 #bnews-widget { _width:313px!important; } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment