/*------------------------------------------------------------ Screen.css st. peter's by-the-sea Last Modified : Created by : Paraveldesign.com Contact: Copyright 2007 - 2009 Based on Blueprint 1.6.1 --------------------------------------------------------------*/ /* Reset -------------------------------------------------------------- */ html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;margin:0;padding:0;} table{border-collapse:separate;border-spacing:0;margin-bottom:1.4em;} caption,th,td{text-align:left;font-weight:400;} blockquote:before,blockquote:after,q:before,q:after{content:"";} blockquote,q{quotes:;} a img{border:none;} /* Grid -------------------------------------------------------------- */ .container_12,.container_16{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16{display:inline;float:left;margin-left:10px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{width:340px}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}.clear{clear:both;display:block;overflow:hidden;width:0;height:0}.clearfix:after{clear:both;content:'.';display:block;visibility:hidden;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block} /* Page -------------------------------------------------------------- */ body { margin-top:0px;background: url(../img/bg.png) repeat; } #blue_wrapper{ margin-top:0px;background: url(../img/bg.jpg) repeat-x;} #header { height: 150px;} #logo { margin-top:35px;} #content { padding: 0 0px;margin-top: 4.5em;} #footer{background: url(../img/footerbg.png) repeat-x 0 top; padding: 110px 0 60px;color: #fff;} #footer .central{background: url(../img/centralstripedark.png) repeat-y; padding: 0 30px;} .central{background: url(../img/centralstripe.png) repeat-y; padding: 0 30px;} .content-wrapper{background: url(../img/contentbox.png) repeat-y center center;padding-top: 25px;} .content-wrapper-top{background: url(../img/contenttop.png) no-repeat center top;height: 20px;margin-top: -70px;} .content-wrapper-bottom{background: #fff url(../img/contentbottom.png) no-repeat center top;height: 40px;} .home-widgets{margin-top: 30px;margin-bottom: 30px;} /* Typography -------------------------------------------------------------- */ /* Default font settings The font-size percentage is of 16px (0.75 * 16px = 12px) */ body {color: #333;font: 75%/1.5 Georgia, "Times New Roman", Times, serif;} p { margin: 0 0 1.5em; } p.last { margin-bottom: 0; } p img { float: left; margin: 0 1.5em 1.5em 0; padding: 0; } img { margin: 0 0 1em; -ms-interpolation-mode:bicubic; } iframe{margin-bottom: 1em;} strong { font-weight: bold; } em { font-style: italic; } /* Headings -------------------------------------------------------------- */ h1,h2,h3,h4,h5,h6 {font-family: "Times New Roman", Times, serif;margin-bottom: 5px;} h1 { font-size: 3em; line-height: 1; margin-bottom: 2px; } h2 { font-size: 24px; margin-bottom: 10px;line-height: 1;color: #000;} h3 { font-size: 20px; margin-bottom: 10px;} h4 {font-size: 16px;font-weight: bold;} h5 { } h6 { } h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;} #footer h2 { color:#fff} .underline{border-bottom: 1px solid #ccc;padding-bottom: 5px;} /* Links -------------------------------------------------------------- */ a { color: #143046;text-decoration: underline; } a:focus, a:hover { text-decoration: underline;color: #3f6b8b;} a:visited {} a:visted:hover {} /* Tables - You still need cellspacing="0" in the markup -------------------------------------------------------------- */ table {} thead {} tbody {} tfoot { font-style: italic; } th,td { padding: 4px 10px 4px 5px; } th { border-bottom: 2px solid #ccc; font-weight: bold; background: #eee; } td { border-bottom: 1px solid #ddd; } tr {} caption { background: #ffc; } /* Use this if you use span-x classes on th/td. */ table .last { padding-right: 0; } tr.even td { background: #eef; } /* Lists -------------------------------------------------------------- */ li ol { margin:0 1.5em; } ol { margin: 0 1.5em 1.5em 1.5em; } ul { list-style-type: none; margin: 0px 1.5em 1.5em 0px; } ul li { margin-bottom:0.75em;} ol { list-style-type: decimal; } ol + li {} dl { margin: 0 0 1.5em 0; } dl dt { font-weight: bold; width:100px; float:left;} dd { margin-left: 1.5em;} /* Forms -------------------------------------------------------------- */ form {} fieldset {padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc;} legend {font-weight: bold; font-size:1.2em;} legend .span {} label {font-weight: bold;} input[type='text'] {} input[type='checkbox'] {} input[type='radio'] {} input[type='file'] {} textarea { width: 400px; height: 250px; padding:5px; } select { width:200px; } option {} optgroup {} input:focus,textarea:focus,select:focus { border:1px solid #666; } input,textarea, select { margin:0.5em 0; border:1px solid #bbb; } /* Other Elements -------------------------------------------------------------- */ blockquote { margin: 1.5em; color: #666; font-style: italic; } dfn { font-style: italic;font-weight: bold; background: #ffc; } sup, sub { line-height: 0; } abbr, acronym { border-bottom: 1px dotted #666; } address { margin: 0 0 1.5em; font-style: normal; } del { color:#666; } pre,code { margin: 1.5em 0; white-space: pre; } tt { display: block; margin: 1.5em 0; line-height: 1.5; } pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; } /* Navigation -------------------------------------------------------------- */ #nav {float: right;font-size: 16px;text-shadow: #11283a 1px 2px 1px; margin: 50px 0 0 0 ;color: #fff;} #nav ul { width:100%; margin: 0px;} #nav ul li { list-style-type: none; display: inline;background: url(../img/navstripe.jpg) repeat-y left;padding-left: 30px;padding-right: 20px;} #nav ul li.first{padding-left: 0px;background-image: none;} #nav a { color:#fff; text-decoration: none;display: inline-block;padding-bottom: 20px;} #nav a:hover{background: url(../img/navscroll.png) no-repeat center bottom;} .subnav ul{margin-bottom: 40px;} .subnav ul li {text-transform: uppercase;text-decoration: none;font-size: 12px;margin-bottom: 0;font-style: italic;} .subnav ul li a, .resources li a{text-decoration: none;} .subnav ul li a:hover{background: url(../img/linkaccent.png) no-repeat right;padding-right: 30px;color: #143046;} .resources li{text-decoration: none;font-size: 12px;margin-bottom: 0;font-style: italic;margin-left: 20px;} .resources li a:hover{text-decoration: underline;} .school ul li{list-style-type: disc;margin-left: 30px;margin-bottom: 5px;} /* Classes -------------------------------------------------------------- */ .small { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; } .large { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; } .hide { display: none; } .quiet { color: #666; } .loud { color: #000; } .highlight { background:#ff0; } .added { background:#060; color: #fff; } .removed { background:#900; color: #fff; } .top { margin-top:0; padding-top:0; } .bottom { margin-bottom:0; padding-bottom:0; } .error, .notice, .success { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; } .error { background: #FBE3E4; border-color: #FBC2C4; } .notice { background: #FFF6BF; border-color: #FFD324; } .success { background: #E6EFC2; border-color: #C6D880; } .error, .error a { color: #D12F19; } .notice, .notice a { color: #817134; } .notice, .success a { color: #529214; } input.text, input.title { width: 300px; margin:0.5em 0.5em 0.5em 0; } input.text, input.title { border:1px solid #bbb; background:#f6f6f6; padding:5px; } input.text:focus, input.title:focus { border:1px solid #999; background:#fff; } input.title { font-size:1.5em; } img.left {float:left; clear:left;} img.right {float:right; clear:right;} img.middle {float:none; clear:both;} .more-info{font-size: 10px;text-transform: uppercase;font-style: italic;text-decoration: none;color: #999;} .more-info a{color: #132f44;background: url(../img/linkaccent.png) no-repeat right;padding-right: 30px;font-style: italic;text-decoration: none;} .post .more-info a, .event .more-info a{background: none; padding-right: 0px;} .event .more-info{margin-top: -10px;} #footer .more-info a{background: url(../img/linkaccentwhite.png) no-repeat right;color: #fff;} .more-info a:hover{text-decoration: underline;} .post img{max-width: 520px;} /* Layout -------------------------------------------------------------- */ .rotator { width: 900px; margin: -22px auto -12px;} .post, .event, .ministry, .resources{background: url(../img/horizontalstripe.jpg) repeat-x 0 bottom;padding-bottom: 25px; margin-bottom: 20px;} .event, .ministry{margin-top: 25px;} .ministry-photo, .frame-photo{padding: 2px;border: 1px solid #e7e7e7;} .frame-photo{margin-bottom: .7em;} .date{background: url(../img/datebox.png) no-repeat center;width: 57px;height: 91px;margin-top: -10px;margin-left: auto;margin-right: auto;} .month{font-size: 10px;font-style: italic;text-transform: uppercase;padding-top: 27px;text-align: center;} .day{font-size: 26px;text-align: center;line-height: 0;padding-top: 10px;} .visitorsicon{margin-left: -15px;margin-top: -10px;} .quote{font-size: 1.8em;font-style: italic; margin-bottom: 1em;} .contact{} .podcasts{} table#service-times { width:100%; } table#service-times tr td { border-bottom:none; } td.service-time, td.service-day { text-align-left; width:70px;} td.service-title { text-align: right; } .paging { margin-bottom:2em;} .paging * { display:inline; } .staffphoto, .staff{margin-bottom: 2.5em;} /* Page-Specific - based on the class -------------------------------------------------------------- */