/* @override http://harbormiramesa.cpmpreview1.com/css/styles.css */ /*===== SITE: Harbor Mira Mesa FILE: styles.css CREATED: 11/6/2008 MODIFIED: 11/7/2008 AUTHOR: Ben Otero (ben@churchplantmedia.com) =====*/ /* @group GLOBALS */ body { background:#f1f1ed url(/images/body_bg.gif) repeat-x; font-size:62.5%; margin:0; padding:0; font-family:"Lucida Grande", arial, verdana, sans-serif; color:#3e3e3c; } #container { margin:0 auto; width:763px; position:relative; } .show { display:block; } .hidden, hr { display:none; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix { display: inline-block; } /* Hides from IE-mac \*/ * html .clearfix { height: 1%;} .clearfix { display: block;} /* End hide from IE-mac */ /* @end */ /* @group HEADER */ #header { position:relative; height:175px; } #header h1 { display:block; background:url(/images/logo.png) no-repeat; width:373px; height:61px; text-indent:-999em; margin:0; padding:0; position:absolute; top:39px; left:4px; } #header h1 a { display:block; width:364px; height:56px; } #skip { position:absolute; top:-999em; left:-999em; } #topbar { position:absolute; height:18px;top:5px; right:0; z-index:10000; } #topbar p { font-size:1.1em; color:#bebaaa; margin:0; line-height:18px; position:relative; top:-5px; } #topbar p b { color:#fcf8e5; font-weight:bold; } #topbar a { color:#fcf8e5; } #topbar a:hover { text-decoration:none; } #topbar a img { border:0; position:relative; top:4px; margin-left:8px; } #topbar img { border:0; } /* @end */ /* @group NAVIGATION */ #nav, #nav * { list-style:none; margin:0;padding:0; } #nav { background:url(/images/navigation_bg.gif) no-repeat right top; height:29px; width:762px; position:absolute; top:114px; left:0px; } #nav li { float:left; background:url(/images/nav_a_bg.gif) no-repeat right top; padding-right:2px; } #nav li a { display:block; line-height:30px; text-decoration:none; font-size:1.3em; color:#f5f3eb; padding:0 18px 0 20px; } #nav li.current a, #nav li a:hover, #nav li:hover a { background:#fff; color:#393936; } #nav li li { padding:0 12px; display:inline; background:none; } #nav li.current li a, #nav li li a { padding:0; font-size:11px; background:none; color:#4c4c45; line-height:14px; } #nav li li a:hover { font-size:11px; background:none; color:#af8609; line-height:14px; text-decoration:underline;} #nav li li a:hover { color:#8f7114; text-decoration:underline; } #nav #nav_home.current a{ background:#dcd8c6 url(/images/nav_first_current.jpg) no-repeat; color:#312424; padding-left:20px; } #nav li ul { position:absolute;left:-5000px;z-index:1001; padding-top:8px; } #nav li.current ul { left:18px; top:33px; width:763px; } /* @end */ /* @group BANNER */ #banner { display:block; position:relative; width:520px; height:175px; background:url(/images/sub_banner_bg.gif) no-repeat; left:-16px; overflow:hidden; } #home #banner { height:325px; background:url(/images/banner_bg.gif) no-repeat; } #banner img { position:absolute; top:14px; left:14px; border:none; } /* @end */ /* @group PRIMARY CONTENT */ #primaryContent { float:left; width:488px; padding:12px 16px 20px; } #content { padding:0 0 12px 1px; } #primaryContent a { color:#1e466a; text-decoration:underline; } #primaryContent a:hover { text-decoration:none;} h3, h4, h5, h6 { color:#1e466a; } .article h4 { margin:0; } #primaryContent h2 { font-size:1.7em; font-weight:normal; color:#1e466a; margin-bottom:0; } #primaryContent h3 { font-size:1.3em; margin-bottom:0; color:#b38b11; } #primaryContent h4 { font-size:1.2em; } #primaryContent h5, #primaryContent h6 { font-size:1.1em; } #primaryContent h6 { font-style:italic; } #primaryContent p, #primaryContent li, #primaryContent td { font-size:1.2em; color:#3e3e3c; line-height:1.7em; margin-top: 3px; } #primaryContent p *, #primaryContent li *, #primaryContent td * { font-size:1em; } img.left-align { float:left; position:relative; left:-10px; } img.right-align { float:right; position:relative; margin-left:10px; } img.no-border { border:none; } .article p.date { margin-top:0; } #home a.more { float:right; display:block; background:url(/images/more_button.gif) no-repeat; width:115px; height:22px; font-size:9px; padding-left:8px; text-transform:uppercase; color:#5d5d5a; text-decoration:none; font-weight:bold; padding-top: 2px; margin-bottom: 2px; } #home a.more:hover { text-decoration:underline; } /* @end */ /* @group SECONDARY CONTENT */ #secondaryContent { float:right; width:239px; position:relative; padding-top:17px; } #secondaryContent h3{ font-size:1.5em; color:#b38b11; padding-bottom:5px; margin-bottom:5px; font-weight:normal; } #secondaryContent p { font-size:1em; color:#727064; line-height:16px; margin-top:0; } #sidebar-lower { background:url(/images/lower_sidebar_bg.gif) repeat-x; clear:both; width:239px; padding-top:8px; padding-bottom:80px; } #sidebar-lower a { color:#547a7c; } /* @group TAB SWITCHER */ #tabs { margin:0; padding:0; list-style:none; position:relative; z-index:2; height:32px; background:url(/images/tab_bg.gif) repeat-x left bottom; } #tabs li { float:left; display:inline; } #tabs li a { display:block; float:left; width:119px; line-height:32px; text-decoration:none; text-align:center; font-size:1.3em; color:#5c5c52; } #tabs li.active a { color:#b58d13; font-weight:bold; width:120px; background:url(/images/active_tab.gif) repeat-x; } #tabs li a:focus { outline:none; } /* @end */ /* @group EVENT LISTING CONTENT */ #events-tab, #calendar-tab { background:#dbdbd3; border-bottom:4px solid #c9c9c3; padding-top:3px; clear:both} #events-tab .event { padding:12px 15px; border-bottom:1px solid #c9c9c3; } #events-tab h5 { font-size:11px; font-weight:normal; margin:0 0 3px; color:#5b5b59; } #events-tab h4 { font-size:12px; margin:0; } #events-tab h4 a { color:#494946; text-decoration:none; } #events-tab h4 a:hover { text-decoration:underline } .last { border:0; } /* @end */ /* @group MINI CAL */ #calendar-tab { display:none; } /* @end */ /* @group RECENT SERMONS */ #calendar, #freeform, #recent-sermon, #paypal { padding:10px 15px; position:relative; margin-top: -18px; } #recent-article #view-articles, #recent-sermon #view-all { position:absolute; top:31px; right:17px; font:10px lucida grande, arial, verdana, sans-serif; color:#204b70; } #view-articles:hover, #view-all:hover { text-decoration:none; } #recent-sermon h3 { margin-top:1em; } #recent-sermon h4 { font-size:1.1em; margin:0; margin-bottom:2px; width:60%} #recent-sermon h4 a { color:#383834; text-decoration:none; } #recent-sermon h4 a:hover { text-decoration:underline; } #calendar p, #recent-sermon p { font-size:1em; color:#727064; margin:0; text-transform:uppercase; } #recent-sermon ul { position:absolute; top:55px; right:13px; margin:0; padding:0; list-style:none; height:25px; } #recent-sermon li { float:left; display:inline; } #recent-sermon li a { display:block; width:30px; height:25px; text-indent:-999em; background:url(/images/sermon_icons.gif) no-repeat; } #recent-sermon li.download a{ background-position:right top; } #recent-sermon li a:focus { outline:none; } /* @end */ /* @group CALENDAR */ #calendar ul { margin:0;; padding:0; list-style:none; } #calendar li { font-size:1.2em; line-height:1.5em; margin-bottom:.5em; font-weight:bold; } #calendar li a { color:#204b70; } #calendar li a:hover { text-decoration:none; } #calendar p { font-size:1.1em; } #calendar p a { margin:0; color:#204b70; } #calendar p a:hover { text-decoration:none; } /* @end CALENDAR */ #freeform { padding-top:0; } /* @end SECONDARY CONTENT */ /* @group FOOTER */ #footer { background:#bfbfb8; height:215px; margin-top:-7px; } #footer img { border:0; } #footer-inner { position:relative; margin:0 auto; width:763px; padding:13px 0 0;} #footer-inner ul { margin:0 0 0 20px; padding:20px 0 0; list-style:none; width:780px; } #footer-inner li { display:block; float:left; width:220px; height:117px; border:5px solid #a7a7a0; margin-right:23px; } #footer-inner li:hover { border-color:#666359; } #footer-inner p { clear:both; float:left; font-size:1.1em; color:#3e3d34; margin-left:20px; padding-top:20px; width:40%; } #footer-inner p a { color:#3e3d34; text-decoration:underline; text-transform:lowercase; } #footer-inner p a:hover { text-decoration:none; } #footer-inner p#powered { float:right; margin-right:15px; padding:15px 0 0; width:auto; } /* @end */ /* @group LINK FOCUS */ .sermonbox ul li a:focus, a#search_go:focus, #footer-inner ul li a:focus, #recent-sermon li a:focus, #directions:focus { outline:none; } /* @end */ /* @group SERMONS */ #pagination { padding:10px 0; } #pagination a { margin:0 5px; } #pagination a#current { padding:4px; background:#fff; } .sermonbox { position:relative; padding:10px 0; border-top:1px solid #dcdcd5;} #primaryContent .sermonbox h5 { margin:0 0 2px; font-size: 13px; } #primaryContent .sermonbox h5 span { font-weight:normal; font-size:10px; margin-left:10px; } #primaryContent .sermonbox h5 a { text-decoration:none;} #primaryContent .sermonbox h5 a:hover { text-decoration:underline } #primaryContent .sermonbox p { margin:0; } .sermonbox ul { position:absolute; top:15px; right:10px; margin:0; padding:0; list-style:none; } .sermonbox li { float:left; display:inline; margin-right:10px; } .sermonbox li a { display:block; height:16px; width: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; }s #how-it-works, #sorting { padding:10px; } #how-it-works ul, #sorting ul { margin:0; padding:0; list-style:none; } #how-it-works li, #sorting li { font-size:1.1em; color:#252525; } /* @group SORTING */ #sorting { margin-bottom:12px; } #sorting label, #sorting select { display:block; } #sorting label { font-size:1.1em; font-weight:bold; margin-bottom:.5em; } #sorting select { margin-bottom:1.5em; width:100%; } /* @end */ /* HOW IT WORKS */ #sorting, #how-it-works { padding:0 15px; } #how-it-works h3 { margin-top:0; } #how-it-works li { margin-bottom:1.5em; padding-left:20px; } #how-it-works li span { font-weight:bold; } #how-it-works li#play { background:url(/images/play_icon_app.gif) no-repeat; } #how-it-works li#save { background:url(/images/download_icon_app.gif) no-repeat; } #how-it-works li#notes { background:url(/images/notes_icon_app.gif) no-repeat; } #how-it-works li#video { background:url(/images/video_icon_app.gif) no-repeat; } /* @group MEDIABOX */ #text { clear:both; } #byline { float:left; margin:0; padding:0; list-style:none; font-size:1.0em; color:#252525; } #mediabox { float:right; width:130px; padding:10px; margin:0; margin-top: -19px;list-style:none; background-color: #fff;; } #mediabox li { padding:4px 10px 4px 22px;font-size:1.1em; } #mediabox li#mb_links { color:#1e466a; margin:-10px -10px 10px; padding:10px; border-bottom:1px solid #dcdcd5; } #mediabox li#mb_podcast { background:url(/images/feed_icon.gif) no-repeat left 4px; } #mediabox li#mb_notes { background:url(/images/notes_icon.gif) no-repeat left 3px } #mediabox li#mb_download { background:url(/images/download_icon.gif) no-repeat left 3px; } #mediabox li#mb_jukebox { background:url(/images/play_icon.gif) no-repeat left 3px; } #mediabox li#mb_video { background:url(/images/video_icon.gif) no-repeat left 2px; } /* @end */ /* @end */ /* @group CALENDAR */ #primaryContent table.calendar { margin-bottom: 25px; border: 1px solid #dad6c1; border-right: 0; border-bottom: 0; border-collapse: collapse;width: 103%; margin-left: -10px; } #primaryContent table.calendar caption { padding-bottom: 10px; color: #1e466a; font-size: 1.4em; } #primaryContent table.calendar th { padding: 6px 0; background: #1e466a; color: #fff; font-size: 1.3em; font-weight: normal; } #primaryContent table.calendar td { width: 68px; height: 68px; padding: 2px; border: 1px solid #dcdcd4; border-left: 0; border-top: 0; background: #fff; color: #252525; font-size: 1em; vertical-align: top; } #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; } #primaryContent table.calendar td li { margin-bottom: .95em; font-size: 1.1em; line-height: 1.2; } #primaryContent table.calendar li a { text-decoration:underline; } #primaryContent table.calendar li a:hover { text-decoration:none; } /* @end */ /* @group MINI-CAL */ #secondaryContent table.calendar { border-collapse: collapse; background:#f5f3ec; margin-bottom:1em; font-family: lucida grande,"Trebuchet MS", Arial, Helvetica, Verdana, Tahoma, sans-serif; margin:0 auto; margin-top: 10px; margin-bottom:1.2em; } #secondaryContent table.calendar caption { font-size: 13px; color:#1e466a;margin-top: 5px; } #secondaryContent table.calendar th { background: #1e466a; padding: 5px 0; color:#fff; font-size: 10px; font-weight: normal; text-align: center; } #secondaryContent table.calendar td { width:28px; height:23px; color:#534337; font-size:11px; font-weight:normal; text-align:center;} #secondaryContent table.calendar a { display: block; padding: 4px; background: #1e466a; color:#fff; text-decoration: none; } #traildiv { position:absolute; top:0; left:0; z-index:999; visibility:hidden; width:130px; height:100px; color:#FFF;} #traildiv ul { padding: .75em; padding-bottom: 3px; margin:0; background: #1e466a; font-size: 1.1em; list-style:none; } #traildiv li { color: #FFF; margin-left: 1em; margin-bottom: .75em; } #traildiv a { color: #FFF; text-decoration: none; } /* @end */