/* @override http://thewalkchurch.cpmpreview1.com/css/styles.css */ /*===== SITE:The Walk FILE: styles.css CREATED: 5/10/2008 MODIFIED: 5/20/2008 AUTHOR: Ben Otero (ben@churchplantmedia.com) =====*/ /* @group GLOBALS */ * { margin:0; padding:0; line-height:1; } html { height:100%; } body { font-size:62.5%; margin:0; padding:0; background:#e7e5d6; height:100%; font-family:georgia, times, serif; } #container { background:#e7e5d6; position:relative; } * html #container { height:100%; } #mainContent { display:block; width:897px; margin:0 auto; padding-bottom:80px; position:relative; z-index:5; } .show { display:block; } .hidden, hr { display:none; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix { display: inline-block;} /* @end */ /* @group HEADER */ #header { position:relative; z-index:1000; height:155px; background:url(/images/body_bg.jpg) repeat-x left bottom; } #header-inner { width:897px; margin:0 auto; position:relative; } #header h1, #header h1 a { display:block; width:205px; height:75px; } #header h1 { background:url(/images/logo.png) no-repeat; text-indent:-999em; position:absolute; top:16px; } #header h1 a:focus { outline:none; } #guide { display:block; width:131px; height:25px; background:url(/images/guide_btn.gif) no-repeat; text-indent:-999em; position:absolute; top:125px; right:0; } #guide.on { background:url(/images/guide_up.gif) no-repeat; top:124px; } #guide:focus { outline:none; } #skip { position:absolute; top:-999em; } /* @end */ /* @group SHELF */ #sitemap-wrap { background:#152326 url(/images/shelf_bg.jpg) repeat-x left bottom; padding-bottom:55px;} #sitemap { display:none; padding:10px 0 40px 20px; width:900px; margin:0 auto; position:relative; } #sitemap ul { width:150px; margin:30px 0 0; padding:0; list-style:none; float:left; } #sitemap li { float:left; display:inline; } #sitemap li a { font:1.2em "Lucida Grande", verdana, sans-serif; color:#e0e0d3; text-decoration:none; line-height:2em; display:block; width:150px; } #sitemap li b a, #sitemap li a b { font-weight:bold; color:#fff;} #sitemap li a:hover { text-decoration:underline; } #sitemap #close { display:block; width:70px; height:22px; background:url(/images/close_btn.gif) no-repeat; text-indent:-999em; position:absolute; right:30px; bottom:5px; } #sitemap #close:focus { outline:none; } /* @end */ /* @group NAVIGATION */ #nav, #nav * { list-style:none;margin:0;padding:0;} #nav { position:absolute; top:113px; left:-3px; height:42px;} #nav li { cursor:pointer; float:left; padding-left:3px; margin:0 4px;} #nav li a { display:block; padding:0 17px 0 14px; text-decoration:none; line-height:46px; font-size:1.3em; font-family:"Lucida Grande", verdana, arial, sans-serif; color:#afae98; } #nav li a:hover { color:#fffefc; } #articles #nav li#nav_resources, #nav li.current { padding-left:3px; background:url(/images/nav_li_bg.gif) no-repeat left top; } #articles #nav li#nav_resources a, #nav li.current a { background:url(/images/nav_li_a.gif) no-repeat right top; color:#fffefc; } #nav li ul { display:none; } #sermons #nav_home a, #sermons #nav_home, #articles #nav_home a, #articles #nav_home { background:none; color:#afae98; } /* @end */ /* @group TOPCONTENT*/ #topcontent { display:block; height:196px; background:url(/images/topcontent_bg.jpg) no-repeat; margin:0 auto; width:897px; } #topcontent.wide { background:url(/images/topcontent_wide_bg.jpg) no-repeat; } #banner { display:block; width:510px; height:165px; background:url(/mediafiles/subpage-header.jpg) no-repeat; position:relative; top:8px; left:8px; float:left; } .wide #banner { width:897px; float:none; } #overlay { display:block; width:510px; height:165px; background:url(/images/overlay.png) no-repeat; } .wide #overlay { display:none; } #video { float:right; width:345px; height:169px; background:url(/images/video_bg.jpg) no-repeat center center; border:6px solid #b5b29e; } /* @end */ /* @group PRIMARY CONTENT */ #primaryContent { float:left; width:654px; } #primaryContent.wide { float:none; width:100%; } #text { padding-left:12px; } #primaryContent a { text-decoration:underline; color:#1f6676; } #primaryContent a:hover { text-decoration: none; } #primaryContent p, #primaryContent li, #primaryContent td { font-size:1.3em; line-height:20px; margin-bottom:1em; color:#4b4b41;} #primaryContent td { color:#4b4b41; line-height:20px; margin-bottom:0; } #primaryContent p *, #primaryContent li *, #primaryContent td * { font-size:1em; line-height:inherit; margin:0; } #primaryContent ul, #primaryContent ol { margin:1em; padding-left:2em; } img.left-align { float:left; margin:10px 10px 10px 0; } img.right-align { float:right; margin:10px 0 10px 10px; } img.no-border, img.mcms_stats { border:0; } /* @group HEADINGS */ h2, h3, h4, h5, h6 { margin-bottom:1em; } h2 { background:url(/images/subpage_h2.jpg) no-repeat; line-height:44px; padding:10px 13px 0; } .wide h2 { background-repeat: repeat-x; } #home h2 { background:url(/images/title_bg.jpg) no-repeat; } .article h4 { margin-bottom:4px } .article p { margin-top:3px; } #primaryContent h3 { font-size:1.6em; } #primaryContent h4 { font-size:1.5em; color:#374d52; font-variant:small-caps; } #primaryContent h5 { font-size:1.4em; text-transform:uppercase; font-family:arial, verdana, sans-serif; } #primaryContent h6 { font-size:1.3em; color:#374d52; } /* @end */ /* @end */ /* @group SECONDARY CONTENT */ #secondaryContent { float:left; display:inline; width:228px; margin-left:10px; position:relative; left:19px;} .col { float:left; } .section { padding:20px; background:url(/images/box_top.gif) no-repeat left top; position:relative; top:0; } .section ul { margin:0; padding:0; list-style:none; } /* @group SUBNAV */ #subnav { background:url(/images/subnav_bg.gif) repeat-y; width:215px; margin-bottom:30px; } #snav { padding:20px; margin:0; list-style:none; background:url(/images/box_top.gif) no-repeat left top; } .btm { background:url(/images/box_btm.gif) no-repeat left bottom; display:block; width:215px; height:6px; position:relative; top:6px;} #snav li, #snav li * { display:none; list-style:none; } #snav li.current, #snav li.current * { display:block; } #events #snav li#snav_events a, #snav li.current a { font-size:1.6em; font-weight:bold; color:#1d2426; text-decoration:none; line-height:29px; margin-bottom:10px; border-bottom:1px solid #dad9cc; } .section li a, #snav li.current li a { border:0; color:#43433e; font:normal 13px "Lucida Grande", arial, verdana, sans-serif; line-height:29px; margin:0; } #snav li li.current a { background:url(/images/current_arrow.gif) no-repeat; position:relative; left:-29px; padding-left:29px; width:184px; color:#fffffe; font-weight:bold; } #events #snav li#snav_events, #events #snav li#snav_events a { display:block; } #events #snav li#snav_home { display:none; } .section li a:hover { text-decoration:none; } .section p { font-size:1.2em; color:#1d2426; line-height:1em; } .section h2, .section h3, .section h4, .section h5, .section h6, .section a { color:#1d2426; } .section h2 { font-size:1.8em; } .section h3 { font-size:1.6em; } .section h4 { font-size:1.5em; } .section h5 { font-size:1.4em; } .section h6 { font-size:1.3em; } /* @end */ /* @end */ /* @group FOOTER */ #footer { position:relative; height:360px; background:#2b2a25 url(/images/footer_bg.jpg) repeat-x; z-index:2; } #footer-inner { display:block; width:897px; height:165px; margin:0 auto 2.5em; position:relative; top:-67px; padding-top:118px; background:url(/images/maincontent_bg.jpg) no-repeat center top; } #footer-bottom { clear:both; padding-top:50px; } #footer p#copyright { font-size:1.1em; color:#6f6d5f; font-family:"Lucida Grande", verdana, sans-serif; float:left; margin:5px 0 0 19px;} #footer p#designed { float:right; width:auto; margin:1px 4px 0 0} #footer .col { width:221px; padding:0 12px; float:left; } #footer h4 { background:url(/images/footer_h4_bg.gif) no-repeat; width:199px; height:30px; color:#fdf4bd; font-size:1.6em; font-weight:normal; padding:0 15px; line-height:30px; position:relative; top:-2px; } #footer #cpm-logo { display:block; width:141px; height:22px; background:url(/images/cpm_logo.gif) no-repeat; text-indent:-999em; } #footer #cpm-logo:hover { background-position:left -21px; } #footer #cpm-logo:focus { outline:none; } /* @group LIFE JOURNAL */ #journal.col { padding-right:15px; padding-left:18px; margin-right:10px; border-right:1px solid #4d4b3c; } #journal h4 { padding-left:13px; width:204px; margin:0 0 5px -5px; } #focus h4 a, #journal h4 a { text-decoration:none; color:#fdf4bd; } #focus h4 a:hover, #journal h4 a:hover { text-decoration:underline; } #journal p { font-size:1.2em; font-family:"Lucida Grande", verdana, sans-serif; line-height:1.5em; color:#fff; } #journal p.reference { font:italic 1.2em georgia, times, serif; color:#cdcdbd; text-transform:uppercase; margin-top:5px; } #journal a { color:#fdf4bd; } /* @end */ /* @group FOCUS */ #focus.col { padding-left:15px; width:219px; position:relative; margin-left:-5px; } #focus h4 { margin:0 0 7px -3px; } #focus h5 { font-size:1.4em; font-weight:normal; font-family:"Lucida Grande", verdana, sans-serif; margin-bottom:9px; } #focus h5 a { color:#fff; text-decoration:none; } #footer #focus.col p { font-size:1.1em; color:#e1e1d4; font-family:"Lucida Grande", verdana, sans-serif; line-height:1.5em; } #focus p a { color:#dedea5; font-size:11px; } #focus a:hover { text-decoration:none; } /* @end */ /* @group MESSAGE */ #message.col { background:#6f6d54 url(/images/latest_message_bg.gif) no-repeat center 35px; position:relative; top:-4px; border:1px solid #79765e; padding:15px 16px; width:325px; position:relative; margin-left:31px; } #footer #message h4 { background:none; font-size:1.4em; font-style:italic; padding:0; margin:0; top:-9px;} #message h5 { font-size:1.5em; font-weight:normal; color:#fbfaf3; margin-top:5px; margin-bottom:9px; } #message h5 span { font-size:10px; font-family:"Lucida Grande", verdana, sans-serif; color:#d5d3c1; margin-left:10px;} #message h5 a { color:#fbfaf3; text-decoration:none; } #message p { font:1.2em "Lucida Grande", verdana, sans-serif; color:#e7e5d6; line-height:1.5em; } #message a.play { position:absolute; top:11px; right:106px; display:block; width:70px; height:20px; text-indent:-999em; background:url(/images/listen_btn.gif) no-repeat; } #message a.download { position:absolute; top:11px; right:8px; display:block; width:96px; height:20px; text-indent:-999em; background:url(/images/download_btn.gif) no-repeat; } #message a:focus { outline:none; } /* @end */ /* @end */ /* @group SERMONS */ #filter select { width:200px; margin-left:10px; } #filter a { margin-left:20px; } #primaryContent h4#current { clear:both; } #primaryContent .sermonlist h4 { margin:0; padding:10px 0; clear:both; } .sermonbox { position:relative; padding:10px 0; border-top:1px solid #d4d2c1; } #primaryContent .sermonbox h5 { margin:0;} #primaryContent .sermonbox h5 span { font-size:10px; margin-left:10px; } #primaryContent .sermonbox p { margin:2px 0 0; line-height:1; } .sermonbox ul { position:absolute; top:20px; right:10px; margin:0; padding:0; list-style: none;} .sermonbox li { float:left; display:inline; margin-right:5px; } .sermonbox li a { display:block; width:16px; height:16px; text-indent:-999em; } .sermonbox li.sl_listen a { background:url(/images/play_icon_app.gif) no-repeat; } .sermonbox li.sl_download a { background:url(/images/download_icon_app.gif) no-repeat; } .sermonbox li.sl_notes a { background:url(/images/notes_icon_app.gif) no-repeat; } .sermonbox li.sl_video a { background:url(/images/video_icon_app.gif) no-repeat; } .sermonbox li a:focus { outline:none; } /* @group MEDIA BOX */ #byline { margin:10px 0 0; padding:0; list-style:none; } #primaryContent #byline li { line-height:1; margin:2px 0 0 0; padding:0; } #mediabox { padding:20px; margin:0; background:url(/images/subnav_bg.gif) repeat-x; width:175px;} #mediabox ul { margin:0; padding:0; list-style:none; } #mediabox li { padding:4px 0 4px 20px; } #mediabox li a { font-size:1.2em; color:#1f6676 } #mediabox li a:hover { text-decoration:none; } #mediabox li#mb_links { margin:-20px -20px 0; background:url(/images/box_top.gif) no-repeat; padding:20px; font-size:1.6em; font-weight:bold; color:#1d2426; } #mediabox li#mb_jukebox { background:url(/images/play_icon_app.gif) no-repeat left 2px; } #mediabox li#mb_download { background:url(/images/download_icon_app.gif) no-repeat left 2px; } #mediabox li#mb_notes { background:url(/images/notes_icon_app.gif) no-repeat left 2px; } #mediabox li#mb_video { background:url(/images/video_icon_app.gif) no-repeat left 2px; } #mediabox li#mb_podcast { background:url(/images/feed_icon_app.gif) no-repeat left 2px; } #mediabox .btm { margin:20px -20px -20px; } /* @end */ /* @group HOW IT WORKS */ #primaryContent #how-it-works { display:block; height:20px; margin:0 0 2.5em; padding:5px; list-style:none; background:#f6f5f0; border:2px solid #d4d2c1; } #how-it-works li { padding-left:20px; margin-bottom:1.5em; font-size:1.2em; float:left; display:inline; margin-right:10px;} #how-it-works li#how { font-weight:bold; margin-right:20px; padding:0; } #how-it-works li#play { background:url(/images/play_icon.gif) no-repeat left center; } #how-it-works li#notes { background:url(/images/notes_icon.gif) no-repeat left center; } #how-it-works li#hwvideo { background:url(/images/video_icon.gif) no-repeat left center; } #how-it-works li#save { background:url(/images/download_icon.gif) no-repeat left center; } /* @end */ /* @group SORTING */ #sorting { background:url(/images/subnav_bg.gif) repeat-y; padding:20px; width:175px; } #sorting h3 { margin:-20px -20px 0; background:url(/images/box_top.gif) no-repeat; padding:20px; color:#1d2426; font-size:1.6em;} #sorting .btm { margin:20px -20px -20px; } #sorting label, #sorting select { display:block; } #sorting label { font:bold 1.3em "Lucida Grande", arial, sans-serif; margin-bottom:.5em; color:#1d2426; } #sorting select { width:100%; margin-bottom:1em; } #sorting a { color:#fff; font-size:1.2em; font-weight:bold; text-decoration:none; padding:3px; background:#1f6676; margin:15px 0 0; } #sorting a:hover { background:#fff; color:#1f6676 } /* @end */ /* @end */ /* @group CALENDAR */ .calendar { margin-bottom: 25px; border: 1px solid #d4d2c1; border-right: 0; border-bottom: 0; border-collapse: collapse; width:100%; } .calendar caption { padding-bottom: 10px; font-size: 1.6em; } .calendar th { padding: 6px 0; background: #f6f5f0; color: #1d2426; font-size: 1.3em; font-weight: normal; } .calendar td { width: 68px; height: 68px; padding: 2px; border: 1px solid #f6f5f0; border-left: 0; border-top: 0; background: #d4d2c1; color: #1d2426; font-size: 12px; vertical-align: top; } .calendar td a { color: #FCFDFE; text-decoration: none; } #primaryContent .calendar ul { margin: .5em 0 0 .5em; padding:0; font-size: 100%; list-style: none; } .calendar td li { margin-bottom: .75em; font-size: 1.1em; line-height: 1.2; } .calendar td li a { color: #FFF; text-decoration: underline; } /* @end */