/* @override http://xpointe.com/css/styles.css */ /*===== CLIENT: CrossPointe Orlando FILE: styles.css - main CSS styles for staging site CREATED: 1/15/2009 MODIFIED: 2/5/2009 AUTHOR: Ben Otero (ben@churchplantmedia.com) =====*/ /* @group GLOBAL */ body { background:#b7aa99 url(/images/body_bg.jpg) repeat-x center top; margin:0; padding:0; font-size:62.5%; font-family:"Lucida Grande", "Trebuchet MS", "Lucida Sans Unicode", verdana, arial, sans-serif; height:100%; } * html, html { height:100%; } hr { display: none; } #skip { position: absolute; text-indent: -9999px; list-style: none; overflow-x:hidden; } #outer-container { background:url(/images/outer_container_bg2.jpg) no-repeat top center; position:relative; padding-bottom:4.5em; } #home #outer-container { padding-bottom:0; } #container { margin:0 auto; width:985px; position:relative; } a { overflow: 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:136px; z-index:1000; } #header-inner { width:960px; height:136px; margin:0 auto; position:relative; } #header h1, #header h1 a { display:block; width:185px; height:52px; margin:0; } #header h1 { background:url(/images/logo.gif) no-repeat; text-indent:-999em; position:absolute; left:94px; top:71px; } /* @end */ /* @group CONGREGATION TABS */ #congregations { position:absolute; height:22px; top:4px; left:-6px; margin:0; padding:0 0 0 123px; background:url(/images/congregation_ul_bg.gif) no-repeat left -4px; } #congregations li { padding-left:3px; float:left; margin-right:4px;} #congregations li a { display:block; line-height:23px; float:left; padding:0 7px 0 4px; color:#bababa; font-weight:bold; font-size:1.2em; text-decoration:none; } #congregations li#orlando { background:url(/images/topbar_li_bg.gif) no-repeat left top; } #congregations li#orlando a { background:url(/images/topbar_a_bg.gif) no-repeat right top; color:#fff; } /* @end */ /* @group NAVIGATION */ #nav, #nav * { margin:0; padding:0; list-style:none; } #nav { position:absolute; top:0; right:8px; z-index:1000; } #nav li { float:left } #nav li a { display:block; padding:0 15px; font-size:1.2em; color:#a9aeb3; line-height:32px; text-decoration:none;padding-top: 1px; } #nav li:hover { background:#46505b;height: 32px; } #nav li a:hover {color: #fff; } #nav li.current a { } #nav li.children a { background:url(/images/down_arrow.gif) no-repeat 90% center; padding-left: 17px; padding-right: 21px; } #nav li ul { position:absolute; left:-999em; width:160px; background:#1a2027; margin-top: -1px; } #nav li:hover ul { left:auto } #nav li:hover li a { background:none; width:120px; line-height:22px; padding:5px 20px; } #nav li li a:hover { background:#46505b; } /* @end */ /* @group SUBMENU */ #submenu { position:absolute; right:5px; top:79px; z-index:1502; } #submenu, #submenu * { list-style:none; margin:0; padding:0; } #submenu li { float:left; } #submenu li a { margin:0 12px; padding:0; text-decoration:none; color:#fff; display:block; font:bold 16px "Lucida Grande", "Trebuchet MS", arial, helvetica, geneva, sans-serif; text-shadow:0 1px 1px #1f2932; } #submenu li:hover a, #submenu li.current a { border-bottom:5px solid #587f96; height:22px; } #submenu li li { margin:0; margin-bottom: 2px; } #submenu li:hover li a { font-size:11px; font-weight: normal;border:none; color:#a4aeb3; display:block; line-height:18px; padding:1px 13px; width:160px; text-shadow:none; margin:0; } #submenu li:hover li a:hover { font-size:11px; border:none; color:#fff; display:block; line-height:18px; padding:1px 13px; width:160px; text-shadow:none; } #submenu li ul { position:absolute; left:-999em; margin:0 0 0 10px; padding:10px 0 7px; width:160px; z-index:1500; background:#1b2026; } #submenu li:hover ul ul, #submenu li:hover ul ul ul, #submenu li:hover ul ul ul ul { left:-5000px; } #submenu li:hover ul, #submenu li li:hover ul, #submenu li li li:hover ul, #submenu li li li li:hover ul { left:auto; } #submenu li:hover ul li:hover ul { margin:-24px 0 0 160px; } /* @end */ /* @group CONTENT WRAPPERS */ #wrapper { background:url(/images/content_wrap_bg.gif) repeat-y 12px top; margin-left:-5px;} #content-wrap { background:url(/images/wrapper_btm.gif) no-repeat 12px bottom } #mainContent { background:url(/images/maincontent_bg.jpg) no-repeat; position:relative; top:-6px; padding:39px 20px; } #home #mainContent { background:none; } /* @end */ /* @group BANNER */ #banner { width:940px; padding-bottom:20px; background:url(/images/banner_bg.gif) no-repeat left bottom; margin-bottom:6px; margin-top:-18px; } #home #banner { padding:21px 0 0 22px; display:block; z-index:2; position:relative; width:963px; height:498px; background:url(/images/home_banner_bg.png) no-repeat; position:relative; left:-27px; top:-21px; } #home #banner p { margin:0; display:block; width:940px; height:474px; background:url(/mediafiles/home-header.jpg) no-repeat; } #home #rotator { position:relative; display:block; width:940px; height:474px; } #home #rotator img { border:0; position:absolute; top:0; left:0; display:none; width:940px; height:474px; } /* @end */ /* @group ROTATOR CONTROLS */ #controls { height:29px; background:url(/images/controls_container_bg.png) no-repeat left top; padding-left:2px; position:absolute; top:452px; } #controller { background:url(/images/controls_bg.png) no-repeat right top; padding-right:3px; } #controls ul { margin:0; padding:3px 0; list-style:none; height:23px; position:relative; } #controls li { display:inline; } #controls li a { float:left; display:block; line-height:23px; font-size:11px; color:#bbb7b1; text-decoration:none; padding:0 9px;} #controls li a.current { background:#567c93; color:#fff; } #controls li#controls-previous { position:absolute; left:-34px; top:0 } #controls li#controls-previous a{ display:block; width:29px; height:29px; background:url(/images/controls_prev_btn.png) no-repeat; text-indent:-999em; padding:0; } #controls li#controls-next { position:absolute; right:-35px; top:0;} #controls li#controls-next a { display:block; width:29px; height:29px; background:url(/images/controls_next_btn.png) no-repeat; text-indent:-999em; padding:0; } #controls li a:focus { outline:none; } /* @end */ /* @group PRIMARY CONTENT */ #primaryContent { float:left; padding:0 30px 0 20px; width:620px; position:relative; } #home #primaryContent { float:none; margin-bottom:14px; padding:0; } .wide #primaryContent { width:915px; float:none; } #primaryContent li, #primaryContent td, #primaryContent p { font-size:1.2em; color:#48494b; line-height:1.5em; } #primaryContent a { color:#3591c4; } #primaryContent a:hover { text-decoration:none; } #primaryContent #subscribe { padding:0px 0 2px 20px; background:url(/images/feed_icon.gif) no-repeat left center; font-size:1.2em; position:absolute; top:5px; right:13px; z-index:19; } #primaryContent img { border:none; } img.left-align { float:left; position:relative; left:-10px; } img.right-align { float:right; position:relative; right:-10px; } #primaryContent h2 { font-size:2em; margin:0px 0 0; margin-bottom: -5px;padding:0; color:#35414f; text-transform:uppercase; font-weight:normal; } h3, h4, h5, h6 { color:#35414f; } #primaryContent h3 { font-size:1.6em; } #primaryContent h4 { font-size:1.5em; } #primaryContent .article h4 { margin-bottom:8px; } #primaryContent h5 { font-size:1.4em; } #primaryContent h6 { font-size:1.3em; } #primaryContent p *, #primaryContent li *, #primaryContent td * { font-size:1em; line-height:1; } /* @end */ /* @group QUICKLINKS */ #quicklinks { position:relative; left:-20px; top:-40px; width:980px; margin-right:-30px; } .quicklink { display:block; float:left; width:240px; height:159px; background:url(/images/QL.png) no-repeat; position:relative; margin-right:5px;margin-bottom: -50px;} .quicklink img { position:absolute; top:12px; left:12px; border:0; z-index:10px; } #quicklinks a { font-size:11px; color:#fff; text-transform:uppercase; text-align:right; padding-right:6px; text-decoration:none; } #quicklinks a:hover img { border:2px solid #77bde4; top:10px; left:10px; } .quicklink span { display:block; padding:4px 10px 0 0; width:203px; height:21px; position:absolute; top:115px; left:12px; line-height:25px; background:url(/images/ql_overlay.png) no-repeat; text-align:right; } /* @end */ /* @group SECONDARY CONTENT */ #secondaryContent { float:right; padding:5px 0 0 15px; width:243px; margin:-28px 0 0; position:relative; z-index:1; min-height:390px; background:url(/images/sidebar_bg.gif) no-repeat; display:inline; } /* @end */ /* @group SUBNAV */ #subnav, #subnav * { margin:0; padding:0; list-style:none; } #subnav { margin:0; padding:20px 0 0; width:223px; } #subnav li.current a { font-size:1.4em; color:#3a3e44; font-weight:bold; text-transform:uppercase; border-bottom:2px solid #d3d3d3; text-decoration:none; padding:0 12px 8px; margin-bottom:8px; display:block; } #subnav li.current li a { font-size:13px; font-weight:normal; border:none; text-transform:none; line-height:15px; padding:5px 15px 5px; } #subnav li li.current a { background:url(/images/subnav_current.gif) no-repeat; color:#fff; font-weight:bold; line-height:22px; padding-bottom:6px; margin-top: -1px; } /* @end */ /* @group FOOTER */ #footer { padding:10px 0 50px 3px; position:relative; margin-top:0; height:115px; background:#b7aa99 url(/images/footer_bg.gif) repeat-x center top; clear:both; } #home #footer { top:19px; margin:0; } #footer-inner { width:960px; margin:0 auto; position:relative; } #footer p { margin-top:13px; font-size:1.1em; color:#3e362c; padding-bottom: 3px;} #footer a { color:#3e362c; } #footer a:hover { text-decoration:none; } #footer #cpm { display:block; width:141px; height:21px; background:url(/images/cpm_logo.gif) no-repeat; text-indent:-999em; position:absolute; right:19px; top:2px; } #footer #cpm:hover { background-position:left bottom; } #footer form * { border:0; background:none; margin:0; padding:0; } #footer form { background:url(/images/eletter_bg.gif) no-repeat; display:block; width:432px; height:32px; position:relative; left:-8px; padding-left:15px; padding-top:15px; } #footer label { display:block; float:left; width:140px; height:15px; text-indent:-999em;} #footer #ea { padding-left:8px; width:180px; float:left; margin-left:7px; height:20px; position:relative; top:-1px; font:11px helvetica, arial, sans-serif; color:#8a7b69; } @media screen and (-webkit-min-device-pixel-ratio:0){ #footer #ea { top:-3px; } } #footer #ea:focus { outline:none; } #footer #signup { position:relative; top:-7px;margin-left:4px; } /* @end */