/* @override http://churchplantingassessmentcenter.cpmpreview.com/css/styles.css */ /*===== SITE: Church Planting Assessment Center FILE: styles.css CREATED: 2/4/2009 MODIFIED:2/19/2009 AUTHOR: Ben Otero (ben@churchplantmedia.com) =====*/ /* @group GLOBALS */ * { margin:0; padding:0; line-height:1; } body { background:#1c2832 url(/images/body_bg.jpg) repeat-x center top; font-size:62.5%; margin:0; padding:0; font-family:"Lucida Grande", arial, verdana, sans-serif; } #container { background:url(/images/outer_container_bg2.jpg) no-repeat center top; padding-bottom:150px; } #footer-inner, #header-inner, #wrapper { width:919px; margin:0 auto; } #wrapper { background:url(/images/wrapper_bg.gif) repeat-y 12px top;} #mainContent { background:url(/images/maincontent_bg.jpg) no-repeat left2 46px; width:919px; background:none;} .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 { z-index:1000; display:block; width:100%; height:102px; } #header-inner { position:relative; width:919px; margin:0 auto; } #header h1, #header h1 a { display:block; width:419px; height:58px; } #header h1 { margin:0; padding:0; background:url(/images/logo.png) no-repeat; text-indent:-999em; position:absolute; left:13px; top:31px; } #header h1 a:focus { outline:none; } #skip { position:absolute; top:-999em; } /* @end */ /* @group SUBMENU */ #submenu { margin:0; padding:0; list-style:none; position:absolute; top:42px; right:12px; height:31px;} #submenu li { background:url(/images/submenu_li.gif) no-repeat left bottom; padding-left:3px; display:block; float:left; margin:0 2.5px;} #submenu li a { display:block; float:left; line-height:31px; padding:0 13px 0 10px; font-size:1.2em; color:#c5c8ca; text-decoration:none; background:url(/images/submenu_li_a_bg.gif) no-repeat right bottom; text-transform:uppercase; } #submenu li:hover { background-position:left top; } #submenu li:hover a { background-position:right top; color:#fff; } /* @end */ /* @group NAVIGATION */ #navigation { width:249px; background:url(/images/nav_btm_bg.png) no-repeat left bottom; padding-bottom:49px;} #nav, #nav * { list-style:none; margin:0; padding:0; } #nav { background:url(/images/nav_bg.gif) repeat-y; } #nav li { cursor:pointer; background:url(/images/nav_li_bg.gif) no-repeat left bottom; } #nav li a { display:block; padding:12px 0 10px 38px; height:20px; font-size:1.5em; color:#fff; text-decoration:none; width:221px; position:relative; left:-10px; } #nav li:hover a { background:url(/images/nav_hover_bg.gif) repeat-y right top; } #nav li.current { background:none; margin-bottom:-3px; } #home #nav li#nav_home a, #nav li.current a:hover, #nav li.current a { border:0; padding:12px 0 12px 28px; height:20px; line-height:1; font-weight:bold; background:url(/images/nav_current_bg.gif) no-repeat; width:218px; color:#fff; left:0 } #nav li.current li a, #nav li li a, #nav li:hover li a { background:#5f1f1c; color:#fff; text-transform:capitalize; font-size:12px; padding-left:16px; width:148px; position:relative; left:0; border:0; height:9px; padding:8px 0 12px 16px; } #nav li.current li { left:0; margin-bottom:0; background: 0; height:auto; } #nav li.current li a:hover, #nav li li a:hover { background:#4b1311; width:148px; padding:8px 0 12px 16px; color:#fff; height:9px; } #nav li ul { position:absolute;left:-5000px;z-index:1001; width:164px; background: #5f1f1c; } #nav li:hover ul { left:auto; margin:-45px 0 0 216px; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul { left:-5000px;} #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul { left:auto;} #nav li:hover ul li:hover ul{ margin:-30px 0 0 164px;} /* @end */ /* @group PRIMARY CONTENT */ #primaryContent { float:right; position:relative; padding:9px 30px 100px 21px; width:601px; margin-right:16px; z-index:10; } #home #primaryContent { padding:0; width:646px; } #primaryContent a { text-decoration:underline; color:#a92a22; } #primaryContent a:hover { text-decoration: none; } #primaryContent #subscribe { float:right; position:relative; top:22px; display:block; padding:2px 0 2px 25px; line-height:22px; background:#fff url(/images/feed_icon.gif) no-repeat 5px center; margin:0; font-size:1.2em; } #primaryContent p, #primaryContent li, #primaryContent td { font-size:1.2em; line-height:1.5em; margin-bottom:1em; color:#2a2b28; } #primaryContent li p, #primaryContent td * { font-size:1em; line-height:1; } #primaryContent td { vertical-align: top; } #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, #primaryContent img.mcms_stats { border:0; } #primaryContent fieldset{ margin:0; padding:0; border:0; } #primaryContent #search_term { padding:4px; font-size:1.4em; width:80%; float:left; } #primaryContent #search_go { font-size:1.6em; background:#2a2b28; display:block; float:left; width:35px; line-height:25px; text-align:center; color:#fff; text-decoration:none; position:relative; left:7px; top:2px; } #primaryContent #search_go:hover{ background:#a92a22; } /* @group BANNER */ #banner { display:block; position:relative; left:-14px; } #home #banner { width:646px; height:364px; background:url(/mediafiles/home-header.jpg) no-repeat; left:0; margin-top:8px} #home #primaryContent img { border:0; } /* @end */ /* @group HEADINGS */ h2, h3, h4, h5, h6 { margin-bottom:1em; color:#a92a22; } h2 { font-size:1.6em; margin-top:22px; background:url(/images/h2_bg.gif) repeat-x left 8px; } h2 span { background:#fff; padding-right:12px; } #sermons h2, #articles h2 { background-position:left center;} #primaryContent h3 { font-size:1.5em; } #primaryContent h4 { font-size:1.4em; } #primaryContent h5 { font-size:1.3em; } #primaryContent h6 { font-size:1.2em; } /* @end */ /* @group ARTICLES */ .article { border-bottom:1px solid #e4e5dd; padding:19px 0; } .article h4 { margin-bottom:0; margin-top:0; } #primaryContent .article h4 a { text-decoration:none; } #primaryContent .article h4 a:hover { text-decoration: underline; } #primaryContent .article p.by { font-size:1.1em; color:#7b7b76; margin-top:3px; } /* @end */ /* @group QUICKLINKS */ #quicklinks { width:660px; margin:7px -30px 0 0; } #quicklinks div { float:left; display:inline-block; width:209px; text-decoration:none; padding:0; margin-right:9px; color:#222; position:relative; cursor:pointer; } #quicklinks a { display:block; width:209px; height:120px; position:relative; text-decoration:none; color:#fff; font-size:14px; overflow:hidden; } #quicklinks .quicklink:hover a { border-bottom:5px solid #a1433d; height:115px; } #quicklinks span { display:block; padding-right:15px; width:194px; line-height:25px; background:url(/images/ql_overlay_bg.png) no-repeat; position:relative; top:-34px; text-align:right; z-index:10; cursor:pointer; } #quicklinks img { border:0; position:relative; z-index:5; } #quicklinks object { cursor:pointer; } /* @end */ /* @end */ /* @group SECONDARY CONTENT */ #secondaryContent { float:left; position:relative; width:249px; padding-top:14px; padding-bottom:78px; background:url(/images/nav_top_bg.gif) no-repeat; } #home #secondaryContent { padding-bottom:50px; } #secondaryContent h3 { font-size:1.7em; height:44px; color:#fff; } #secondaryContent img { border:2px solid #de851a; } /* @group UPCOMING EVENTS */ #upcoming-events { width:220px; padding:0 0 0 17px; position:relative; top:0px; margin:0 0 35px 12px; background:url(/images/events_bg.gif) no-repeat left top; } #upcoming-events .event { background:url(/images/event_bg.gif) no-repeat left bottom; padding:10px 0 8px 17px; margin-left:-17px;} #upcoming-events h3 { text-transform:lowercase; margin:0 0 15px; padding:0; letter-spacing:-.06em; height:auto; } #upcoming-events h3 img { border:0; position:relative; top:3px;} #upcoming-events .all { display:block; width:57px; height:19px; background:url(/images/view_all_btn.gif) no-repeat; text-indent:-999em; position:absolute; top:8px; right:13px; } #upcoming-events h4 { font-size:1.2em; margin:4px 0 5px; font-weight:normal; } #upcoming-events h4 a { color:#fff; text-decoration:none; } #upcoming-events h4 a:hover { text-decoration:underline; } #upcoming-events p { font-size:1.1em; color:#bbbcbc; text-transform:uppercase; margin-bottom:0; } /* @end */ /* @group ELETTER */ #eletter { display:block; width:222px; height:78px; background:url(/images/eletter_bg.gif) no-repeat; position:absolute; left:12px; top:-66px; padding:18px 0 0 15px; } #eletter fieldset, #eletter form { margin:0; padding:0; border:0; } #eletter label { display:block; width:165px; height:17px; background:url(/images/eletter_label_bg.gif) no-repeat; text-indent:-999em; margin-bottom: -2px; } #eletter #ea { background:url(/images/eletter_form_bg.gif) no-repeat; border:0; padding:4px 8px; width:131px; height:14px; font-size:10px; color:#717376; } #eletter #signup { position:relative; top:8px; left:4px;} /* @end */ /* @end */ /* @group FOOTER */ #footer { position:relative; top:-10px; } #footer-inner { position:relative; width:919px; padding-top:40px; z-index:1; background:url(/images/footer_bg.png) no-repeat 12px -35px; } #footer , x:-moz-any-link { top:-10px; } #footer p { width:45%; float:left; margin:0 0 5px 260px; font-size:1.1em; color:#b5b6b9; line-height: 1.3em; } #footer #powered { float:right; width:auto; margin:-18px 15px 0 0; } #footer #powered a { display:block; width:122px; height:18px; background:url(/images/cpm_logo.png) no-repeat; text-indent:-999em; } #footer #powered a:hover { background-position:left bottom; } #footer a { color:#b5b6b9;} #footer a:hover { text-decoration:none; } #powered a:focus { outline:none; } /* @end */ /* @group SERMONS */ #filter { margin-bottom:53px; } #filter select { width:300px; margin-left:10px; } #filter a { margin-left:45px; } #primaryContent h4 { clear:both; } #primaryContent .sermonlist h4 { margin:0; padding:10px 0; } .sermonbox { position:relative; padding:10px 0; border-top:1px solid #e4e5dd; } .sermonbox a { text-decoration:underline; } .sermonbox a:hover { text-decoration:none; } #primaryContent .sermonbox h5 { margin:0;} #primaryContent .sermonbox h5 span { font-size:10px; margin-left:10px; color:#2a2b28; } #primaryContent .sermonbox p { margin:0;} .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.gif) no-repeat; } .sermonbox li.sl_download a { background:url(/images/download_icon.gif) no-repeat; } .sermonbox li.sl_notes a { background:url(/images/notes_icon.gif) no-repeat; } .sermonbox li.sl_video a { background:url(/images/video_icon.gif) no-repeat; } .sermonbox li a:focus { outline:none; } /* @group MEDIA BOX */ #text { padding-top:2em; clear:both;} #primaryContent #byline { margin:10px 0 0; padding:0; list-style:none; clear:both;} #byline li { float:left; display:inline; margin-right:10px; } #primaryContent #mediabox { padding:10px; margin:5px 0 0 0; list-style:none; border:1px solid #5c5e60; height:20px; clear:both; } #mediabox li { padding:2px 5px 0px 20px; float:left; display:inline; font-size:1.1em; line-height:20px; } #mediabox li#mb_links { background:#5c5e60; color:#fff; margin:-10px 10px -10px -10px; padding:10px; font-size:1.2em;} #mediabox li#mb_jukebox { background:url(/images/play_icon.gif) no-repeat left 2px; } #mediabox li#mb_download { background:url(/images/download_icon.gif) no-repeat left 2px; } #mediabox li#mb_notes { background:url(/images/notes_icon.gif) no-repeat left 2px; } #mediabox li#mb_video { background:url(/images/video_icon.gif) no-repeat left 2px; } #mediabox li#mb_podcast { background:url(/images/feed_icon.gif) no-repeat left 2px; } #text { margin-right:10px;} /* @end */ /* @group HOW IT WORKS */ ul#how-it-works { margin:1em 0 2em; padding:5px 0; list-style:none; height:25px; border:3px solid #e4e5dd; } #how-it-works li { padding-left:20px; margin:0 1em 1.5em; font-size:1.1em; display:block; float:left; line-height:25px;} #how-it-works li#how { font-weight:bold; margin-left: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#video { 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 { clear:both; padding-left:6px; margin:0 auto; background:url(/images/sorting_bg.gif) no-repeat; width:220px; padding:0 0 0 17px; position:relative; top:-1px; margin:0 0 35px 12px; } #sorting h3 { } #sorting label, #sorting select, #sorting a { display:block; width:90%; margin:0; } #sorting label { font-size:1.2em; font-weight:bold; margin-bottom:.5em; color:#fff} #sorting select { margin-bottom:1.5em; } #sorting a { font-size:1.2em; color:#fff; } #sorting a:hover { text-decoration:none; } /* @end */ /* @end */ /* @group CALENDAR */ #events #primaryContent div { display:block; width:31%; float:left; height:250px; padding-bottom:10px; margin-right:10px; } #primaryContent table.calendar { margin:0; border: 1px solid #e4e5dd; border-right: 0; border-bottom: 0; border-collapse: collapse; } #primaryContent table.calendar caption { padding-bottom: 10px; color:#2a2b28; font-size: 1.4em; } #primaryContent table.calendar caption span { color: #a9332c; } #primaryContent table.calendar th { padding: 6px 0 ; background: #a9332c; color: #fff; font-size: 1.3em; font-weight: normal; } #primaryContent table.calendar td { width: 28px; height: 18px; padding: 6px; border: 1px solid #e4e5dd; border-left: 0; border-top: 0; background: #fff; color: #2a2b28; font-size: 1em; vertical-align: top; } #primaryContent td.linked-day a { display:block; background:#a9332c; margin:-6px; height:18px; text-align:center; padding:10px 0 2px; color:#fff; } #primaryContent table.calendar td a { text-decoration: none; } #primaryContent table.calendar td ul { margin: .5em 0 0 .5em; padding:0; font-size: 100%; list-style: none; display:none; } #primaryContent table.calendar td li { margin-bottom: .75em; font-size: 1.1em; line-height: 1.2; } #primaryContent table.calendar td li a { text-decoration: underline; } #primaryContent table.calendar td li a:hover{ text-decoration: none; } /* @end */