@import style/css/reset.css; @import style/css/typography.css; @import style/css/layout.css; @import style/css/layout.css;
/*
Theme Name: Starkers
Theme URI: http://elliotjaystocks.com
Description: The totally nude Wordpress theme. Phwoar! (Based on the famous Kubrick by Michael Heilemann)
Version: 2.8
Author: Elliot Jay Stocks
Author URI: http://elliotjaystocks.com
Tags: starkers, naked, clean, basic
*/
/* Colors:
Green: #30a343
brown: #341a10
Blue: #397ebd
*/
body { margin:0; font-family:'Helvetica', Arial; background:#341a10; color:#444; }
a { color:#30a343; text-decoration: none; }
a:active { outline:none; }
a img { border:none; outline: none;}
.clear { clear:both; }
.shadow { box-shadow:0 0 5px #666; -moz-box-shadow:0 0 5px #666; -webkit-box-shadow:0 0 5px #666; }
.inset-shadow {
box-shadow: inset 0 0 10px #222;
-moz-box-shadow: inset 0 0 10px #222;
-webkit-box-shadow: inset 0 0 8px #222;
}
object, embed, video, iframe {max-width: 100%;}
ul {padding: 0; margin: 0; }
li { list-style: square;}
span.small-italics {
font-size: 12px;
font-style: italic;
color: #666;
}
html {}
h4.worship-assignment-dates { margin: 0; padding: 5px 0 10px; font-size: 12px; font-style: italic; font-weight: normal; }
div#wrap { background: url(/images/woody-bg-2.png) repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; }
div#head-wrap { width:960px; height:150px; margin:0 auto; padding-top:25px; position:relative; }
div#logo { background-image:url(http://www.4thandelm.com/images/logo.png); height:138px; width:274px; float:left; margin-left:20px; }
#logo a { display:block; height:138px; width:274px; }
div#church-info-box { width:200px; position:absolute; bottom: 25px; right:0; }
#church-info-box ul { margin-bottom: 10px; }
div#church-info-box li { color:white; list-style:none; font-size:smaller; line-height: 25px;}
div#church-info-box li a { color: white; text-decoration: none; line-height: 25px; display: block; }
div#church-info-box li a img { padding-right: 5px;float: left;}
#church-info-box li a:hover { color: #30a343; }
div.content-wrap { width:960px; position:relative; margin:0 auto 20px; border:1px solid white; background-color:#ddd; box-shadow:0 0 5px #222; -moz-box-shadow:0 0 10px #222; -webkit-box-shadow:0 0 10px #222; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;
/* future proofing */
-khtml-border-radius:5px;
/* for old Konqueror browsers */
/* Background color and gradients */
background: #ddd;
background: -moz-linear-gradient(top, #ddd, #B7BABC);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ddd), to(#B7BABC));
}
div#page-wrap { width:960px; margin:0 auto 20px; padding-top: 20px; border:1px solid white; background-color:#ddd; box-shadow:0 0 5px #222; -moz-box-shadow:0 0 10px #222; -webkit-box-shadow:0 0 10px #222; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;
/* future proofing */
-khtml-border-radius:5px;
/* for old Konqueror browsers */
/* Background color and gradients */
background: #ddd;
background: -moz-linear-gradient(top, #ddd, #B7BABC);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ddd), to(#B7BABC));
}
div#nav { height:40px; width:936px; float:right; margin:2px; text-align:left; padding:0 10px; }
div#nav ul li { display:inline; padding:0 5px; }
div#nav ul { margin:8px 0 10px; padding:0 0 0 3px; }
div#nav ul li a { color:#444; font-size:18px; font-weight:bold; text-decoration:none; padding:8px 10px 10px; text-shadow:0 1px 1px #fff; }
div#nav ul li a:hover { background-color:#30a343; color:#eee; text-shadow:0 -1px 1px #444; }
div#featured-info { width:270px; height:280px; padding:20px; float:left; background-color:#30a343; position: relative;
/* Background color and gradients */
background: #30A343;
background: -moz-linear-gradient(top, #30A343, #277839);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#30A343), to(#277839));
}
div#featured-info li { color:white; text-align:right; list-style:none; line-height:20px; }
div#featured-info h4 { color:white; text-align:right; font-size:24px;letter-spacing: -2; margin:0 0 5px; text-shadow: 0 -1px 1px #213A15; }
div#verse { height: 100%; width: 90%; overflow: hidden; scrollbar-3d-light-color: inherit; padding: 0 20px; margin-bottom: 20px; }
div#verse li { list-style: none; font-size: 16px; font-style: italic; text-align: center; }
div#verse li a { color: white; text-decoration: none; }
div#social-nav { position: absolute; bottom: 65px; right: 20px; width: 100%; }
ul#menu { }
ul#menu li { margin-top: 20px; line-height: 0px; display: inline; }
ul#menu li a{float:right;display:block;background:url("/images/social.png") no-repeat;width:41px;height:41px; margin-left: 20px; }
ul#menu li#fb a{background-position:-124px 0; text-indent:-9999px;}
ul#menu li#twitter a{background-position:-165px 0;}
ul#menu li#rss a{background-position:-83px 0;}
ul#menu li a span {background:url("/images/social.png");height:41px;display:block;}
ul#menu li#fb a span{background-position:-124px -41px;}
ul#menu li#twitter a span{background-position:-164px -41px;}
ul#menu li#rss a span{background-position:-83px -41px}
div#sidebar { float:right; width: 100%; }
div#footer { height:50px; }
div#footer-wrap { width:960px; height:100%; margin:0 auto; padding-left:20px; }
#footer p { margin-bottom:0; color:#1E0F0A; }
p.designer { font-size:10px; margin:0; }
p.designer a { color:#1E0F0A; text-decoration:none; }
p.designer a:hover { text-decoration:underline; }
div#post-wrap { width:550px; float:left; background-color:#fff; margin:0 20px 20px; padding:20px; border: 1px solid #bbb;}
div#post-wrap-wide { width:880px; float:left; background-color:#fff; margin:0 20px 20px; padding:20px; border: 1px solid #bbb;}
div#sidebar-wrap { width:310px; margin-bottom:20px; float:left; color:#eee; }
div.audio-box { width:250px; float:left; position:relative; margin:10px 20px 20px; padding:10px 20px; }
.audio-box ul { padding:0; margin:10px 0; }
.audio-box li { list-style:none; }
p.audioplayer_container { margin:0 0 20px; }
div.audio-box p { margin: 5px 0 0; padding: 0; }
.audio-box h1,.family-news-box h1,.adult-classes-box h1,.audio-box a, .family-news-box a,.events-box h1 { text-decoration:none; margin:0 0 10px; color:#341a10; text-shadow:0 1px 1px #fff; font-size:26px; }
.audio-box a.smaller, .family-news-box a.smaller {
color: #444;
font-size: 16px;
font-weight: bold;
padding: 0;
margin: 0;
}
.audio-box a:hover, .family-news-box a:hover { color: #30a343;}
a.download {
text-decoration:none; margin:0; color:#30A343; font-weight: bold; text-shadow:0 1px 1px #fff; font-size:14px; line-height:18px; }
a.download:hover:after {
content: attr(title) " (To Download: Right-Click and select 'Save As')"; font-size: 10px; line-height: 14px;color: #444; font-weight: normal; vertical-align: middle;}
.family-news-box h1 span { text-decoration:none; margin:0; color:#341a10; text-shadow:0 1px 1px #fff; font-size:18px; }
.audio-box h1,.audio-box a:hover: { color:#30a343; }
.audio-box p.sub-title { margin: 2px 0 10px; font-size: 12px; font-style: italic; color: #666; }
.adult-classes-box { width:250px; float:left; position:relative; margin: 10px 20px 0 0; padding: 10px 20px 0; }
div.family-news-box { width:250px; float:left; position:relative; margin:10px 20px 20px 0; padding:10px 20px; background-image: url(http://4thandelm.com/images/fam-green.jpg) repeat-no; }
.family-news-box a { display:block; font-weight: bold; position: relative;}
.family-news-box p { padding:0; margin:0; }
.family-news-box img { opacity:.5; }
.family-news-box img:hover { opacity:1; }
.adult-classes-box ul { padding:0; margin:10px 0 20px; }
.adult-classes-box li { list-style:none; color:#444; font-size:12px; margin:0 0 0 10px; }
.adult-classes-box h4,.audio-box h4 { margin:10px 0 2px; color:#444; }
.adult-classes-box .class-title { font-weight:bold; font-size: 16px;}
.events-box {width: 250px; float: left;margin: 0 20px 20px 0;
padding: 0 20px;}
.events-box h4, .events-box h3 {margin: 0;}
.events-box .entry {padding-left: 10px;padding-top: 10px; padding-bottom: 10px;}
div.media-post {
padding: 20px;
margin-bottom: 30px;
border-bottom: 1px solid #CCC;
position: relative;
background: #F4F4F4;
}
div.media-post h4 { color:#30a343; font-size:24px; margin:0 0 2px; width: 100%; line-height: 28px; text-shadow: 0 1px 1px white; }
div.post-date { margin-bottom:20px; font-size:12px; color:#666; }
span.entry-cat a { font-style: italic; }
span.sermon-date { margin-right: 5px; float: left; border-right: 1px solid #ccc; padding-right: 5px;}
div.post-date p { }
ul.text-list {margin-left: 25px; }
div.search-results { padding: bottom: 20px; margin-bottom: 30px; }
div.search-results h4 { color: #30a343; font-size: 24px; margin: 0 0 2px; }
div.search-results h4 a { text-decoration: none; }
div.search-results h4 a:hover { color: #341a10; }
div.worship-link {
height: 75px; margin: 0;
}
a.download-link {
line-height: 32px;
display: block;
font-weight: bold;
color: #999
}
a.download-link img {
height:48px;
position: relative;
padding-right: 5px;
float: left;
}
div.worship-link a { font-weight: bold; font-size: 14px;}
div.worship-link a img.worship-icon {
margin-right: 0;
display: inline;
float: left;
padding:0;
opacity: 1;
}
div.subscribe { width: 100%; height: 74px; font-family: Georgia, serif; font-size: 14px; font-style: italic; border-bottom: 1px solid #ccc; margin-bottom: 20px; padding-top: 38px; }
div.subscribe li { list-style: none; height: 20px; margin-bottom: 10px; }
div.subscribe li a { padding: 5px 0; color: #444; }
div.subscribe li a:hover { color: #30a343; }
.subscribe a {height: 25px; display: block; line-height: 20px;}
.subscribe li img { height: 25px; width: 25px; float: left; margin-right: 2px;
margin-bottom: 5px;}
.page-icon-img {
cursor: auto;
display: inline;
float: left;
margin-bottom: 20px;
margin-right: 20px;
}
div.audio-content {
width: 400px;
}
div.audio-content p {
margin: 0px;
}
div.post ul {
margin: 0 0 0 25px;
}
div.post ul li ul li {
list-style-type: circle;
list-style:
}
div.classroom {
height: auto;
padding: 10px 0 0 0;
margin: 0 0 0 20px;
border-bottom: 1px solid #ccc;
width: 95%;
}
/* == WordPress WYSIWYG Editor Styles == */
.entry-content img {
margin: 0 0 1.5em 0;
}
.alignleft, img.alignleft {
margin-right: 1.5em;
display: inline;
float: left;
border: 1px solid #ccc;
padding: 5px;
background: #eee;
}
.alignright, img.alignright {
margin-left: 1.5em;
display: inline;
float: right;
border: 1px solid #ccc;
padding: 5px;
background: #eee;
position: absolute;
right: 0px;
top: 0px;
}
.aligncenter, img.aligncenter {
margin-right: auto;
margin-left: auto;
display: block;
clear: both;
border: 1px solid #ccc;
padding: 5px;
background: #eee;
}
.alignnone, img.alignnone {
/* not sure about this one */
}
.wp-caption {
margin-bottom: 1.5em;
text-align: center;
padding-top: 5px;
}
.wp-caption img {
border: 0 none;
padding: 0;
margin: 0;
}
.wp-caption p.wp-caption-text {
line-height: 1.5;
font-size: 10px;
margin: 0;
}
.wp-smiley {
margin: 0 !important;
max-height: 1em;
}
blockquote.left {
margin-right: 20px;
text-align: right;
margin-left: 0;
width: 33%;
float: left;
}
blockquote.right {
margin-left: 20px;
text-align: left;
margin-right: 0;
width: 33%;
float: right;
}
.gallery dl {}
.gallery dt {}
.gallery dd {}
.gallery dl a {}
.gallery dl img {}
.gallery-caption {}
.size-full {}
.size-large {}
.size-medium {}
.size-thumbnail {}
/*--------Sidebar-------------*/
div#sidebar-search { background-color:#bbb; padding:20px; margin-bottom:20px; }
div#sidebar-info { background-color: #30A343;
border-bottom: 1px solid white;
border-top: 1px solid #444;
margin-bottom: 20px;
padding: 20px; }
div#search-box-sidebar { background-color: #666; padding: 20px; margin-bottom: 20px; position: relative; }
div#sidebar-info h4,div#sidebar-news h4, div#latest-tweets h4 { margin:0 0 10px; font-size:24px; }
div#sidebar-info ul { margin:0; padding:0; }
div#sidebar-info li { list-style:none; margin-bottom:5px; }
div#sidebar-news { background-color:#444; padding:20px; margin-bottom:20px;border-bottom: 1px solid white;
border-top: 1px solid #444;
margin-bottom: 20px;
padding: 20px; }
div#sidebar-news ul { margin:0; padding:0; }
div#sidebar-news li { list-style:none; margin-bottom:5px; border-bottom:1px solid #666; }
div#sidebar-news li a { color:#fff; text-decoration:none; }
div#sidebar-news li a:hover { color:#30a343; }
div#latest-tweets { background-color:#397ebd; padding:20px; margin-bottom:20px;border-bottom: 1px solid white;
border-top: 1px solid #444;
margin-bottom: 20px;
padding: 20px; }
div#latest-tweets ul { margin:0; padding:0; }
div#latest-tweets li { list-style:none; margin-bottom:5px; border-bottom:1px solid #448bc9; padding-bottom: 5px; }
div#latest-tweets li a { color:#fff; text-decoration:none; font-style: italic; }
div#latest-tweets li a:hover { color:#30a343; }
div#sidebar-social { background-color: yellow; padding: 20px; margin-bottom: 20px; }
div#sidebar-social ul { margin: 0; padding: 0; }
div#sidebar-social li { list-style: none; }
.entry {border-bottom: 1px solid #666;}
.event-title {margin-bottom: 5px; }
.entry span {font-style: italic;}
#sidebar-news h3 a {color: white;}
#sidebar-news .entry {padding-bottom: 18px;}
/*---------------Dropdown Nav-----------------*/
div#nav ul li { display:inline; padding: 0; }
div#nav ul { margin:10px 0 10px; padding:0 0 0 8px; }
div#nav ul li a { border: 1px solid #ddd;color:#444; font-size:15px; font-weight:bold; text-decoration:none; padding:8px 8px 10px; text-shadow:0 1px 1px #fff; }
div#nav ul li a:hover { border: 1px solid #2F8A42; background-color:#30a343; color:#eee; text-shadow:0 -1px 1px #444; }
.slider-img-link {width: 100%; height: 100%; margin: 0 auto;}
div.slider-img-link a {margin: 0; display: block;}
/*---------------Slider-----------------------*/
/*
anythingSlider v1.0
By Chris Coyier: http://css-tricks.com
with major improvements by Doug Neiner: http://pixelgraphics.us/
based on work by Remy Sharp: http://jqueryfordesigners.com/
*/
.anythingSlider { width: 590px; height: 320px; float:left; background-color:darkgray; margin:0 20px 20px; position:relative; }
.anythingSlider .wrapper { display: block; width: 590px; overflow: auto; height: 320px; border-top: 1px solid #444;border-bottom: 1px solid white; margin: 0; position: absolute; top: 0; left: 0; box-shadow: inset 0 0 10px #000;
-moz-box-shadow: inset 0 0 10px #000;
-webkit-box-shadow: inset 0 0 5px #000000; }
.anythingSlider .wrapper ul { width: 99999px; list-style: none; position: absolute; top: 0; left: 0; background: #eee; margin: 0; }
.anythingSlider ul li { display: block; float: left; padding: 0; height: 320px; width: 590px; margin: 0; }
.anythingSlider ul a { margin-top: 0; color: #ddd; font-weight: bold; display: block; margin-left: 0; }
.anythingSlider ul a:hover { color: #fff; }
#thumbNav { position: relative; top:270px; text-align: right;}
#thumbNav a { color: white; font: 18px/26px Helvetica, Arial, Serif; font-weight:bold; display: inline-block; padding: 2px 8px; height: 26px; margin: 0 5px 0 0; text-align: center; text-decoration: none; text-shadow: 0 0 4px #444;}
#thumbNav a:hover { background-color: #30a343; }
#thumbNav a.cur { background: none; }
#start-stop { display: none; color: white; padding: 2px 5px; width: 40px; text-align: center; position: absolute; right: 0; top: 0; font: 14px/22px Helvetica, Arial, Serif; font-weight:bold; text-decoration: none; text-shadow: 0 0 4px #000000; }
#start-stop.playing { background-color: transparent; }
#start-stop:hover { background-image: none; }
/*
Prevents
*/
.anythingSlider .wrapper ul ul { color: #ffffff;position: static; margin: 0; background: none; overflow: visible; width:275px; margin: -150px 0px 40px 30px; border: 0; }
.anythingSlider .wrapper ul ul li { float: none; height: auto; width: auto; background: none; }
.anythingSlider .wrapper ul ul li.feat-title { font-size: 26px; letter-spacing: -1px; font-weight: bold; text-shadow: 1px 1px 1px #000; z-index: 100;}
.anythingSlider .wrapper ul ul li.feat-date { font-size: 20px; font-family: Georgia; font-style: italic; text-shadow: 1px 1px 1px #000; z-index: 100;}
/*------------------Search----------------------*/
#search-box { position: absolute; bottom: 0; right: 0; width: 100%; background-color: white; }
div#search-box-page { position: relative; width: 100%; background-color: white; border: 1px solid #ccc; }
fieldset.search { height: 30px; border: none; padding: 0px; margin: 6px 10px; }
.search input, .search button { border: none; cursor: pointer; background-color: none; width: 80%; font-family: Helvetica, Arial, Serif; font-style: italic; color: #ccc; font-weight: bold; font-size: 18px; padding: 5px; }
.search input:focus { outline: none; }
.search .btn {background-image: url(http://4thandelm.com/images/search-icon.png) ; width: 25px; height: 25px; text-indent: -9999px; position: absolute; bottom: 10px; right: 10px; }