/*
File: custom.css
Description: Custom styles for Thesis
BASIC USAGE:
If you have enabled the custom stylesheet in the Thesis options panel, the tag
will be appended with the "custom" class, like so: . You can use
the "custom" class to override *any* CSS declarations contained in the style.css file.
For example, if you wish to change the default link color to green, you would add the
following declarations to this file:
.custom a, .custom a:visited { color: #090; } <--- This makes links green
.custom a:hover { color: #00f; } <--- This makes links blue when you mouse over them
WHY THIS WORKS:
By using the "custom" class, you are creating more specific CSS declarations for HTML
elements. CSS styling is applied through rules of specificity, and because declarations
prepended with .custom are more specific, they get applied when the page is rendered!
More information about styling your Thesis installation using this file can be found
in the User's Guide:
http://diythemes.com/thesis/rtfm/customizing-thesis-with-customcss/
*/
/*---------------------------------------------------------------*/
/*----- Add a background to the body. -----*/
/*---------------------------------------------------------------*/
body.custom {
/*background: #44443f;*/
background: url(images/floral_background.png) repeat;
}
/*---------------------------------------------------------------*/
/*----- Set margins and padding on the container. -----*/
/*---------------------------------------------------------------*/
.custom #container {
margin-top: 2em;
margin-bottom: 2em;
padding: 0.4em;
background:#fff;
border:2px solid #000000;
/* background: #33332f;*/
/* border: 0.4em solid #3e3e3a; */
}
/*---------------------------------------------------------------*/
/*----- Make the page white. -----*/
/*---------------------------------------------------------------*/
.custom #page {
background: #fff;
margin:-0.1em;
border: 1px solid #000000;
}
/*---------------------------------------------------------------*/
/*----- Add an image to the header. -----*/
/*---------------------------------------------------------------*/
.custom #header {
border-bottom:none;
height:80px;
padding-top:0;
padding-bottom:0;
background:url(images/header.jpg) no-repeat;
background-position: center;
margin-bottom:2em;
}
/*.custom #header {display:none;}*/
/*---------------------------------------------------------------*/
/*----- Use CSS to construct a Feature Box with two columns -----*/
/*----- and a footer. -----*/
/*---------------------------------------------------------------*/
/* Set up the feature box. The auto margins center the page, and
the text-align overrides any inherited settings. */
.custom #feature_box {
background:#ffffff;
margin: 0 auto;
text-align: left;
border-bottom:1px solid #dddddd;
border-left:1px solid #dddddd;
border-right:1px solid #dddddd;
font: 1.0em/1.3em Georgia, serif;
font-size: 14px;
}
/* The top area of the feature box where we have a notice about
pre-orders. It is full width with two columns. */
#top-feature-box {
width:100%;
padding: 0 0 0.5em 0;
border-bottom: 1px solid #dddddd;
}
#top-feature-box-left {
float:left;
width:13%;
margin-left:2.5em;
padding-top:0.25em;
font: Georgia;
font-variant: small-caps;
font-size: 16px;
text-align: center;
}
#top-feature-box-right {
float:right;
width:80%;
margin-right: 1em;
margin-top: 1em;
}
/* The middle section is full width. */
#middle-feature-box {
width:100%;
padding: 0 1em 0 0;
}
/* Establish two columns, left and right. Left is 53% width, right is with 43% width.
Shouldn't add to 100% -- we've left room for padding and margins. Add
margins to each. This is "just right" for the current content. */
#middle-feature-box-column-left {
float:left;
width:53%;
margin-left:1em;
margin-top: 0em;
}
#middle-feature-box-column-right {
float:right;
width:43%;
margin-right: 1em;
margin-top: 0em;
text-align: center;
}
#middle-feature-box h2 {
letter-spacing: 1.5px;
font-size:1.6em;
font-variant: small-caps;
}
/* The bottom of the feature box is full width. Text is aligned, and
the font is 16px Georgia.*/
#bottom-feature-box {
padding: 1em;
width: 100%;
text-align: center;
font: 16px/1.5em Georgia, serif;
}
/* Set the header to 18px, italicized Georgia. */
#bottom-feature-box h2 {
font-size:18px;
font-style: italic;
}
/* This class centers images. */
#feature-box-centered-image {
position: relative;
text-align: center;
}
/* This class needs to be added as a div, or passed to a br element,
to finish off any containers with floats in them. That way the next
box will sit fully beneath the preceding floats.*/
.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
/*----- End Feature Box -----*/
/*---------------------------------------------------------------*/
/*---------------------------------------------------------------*/
/*----- Classes that we use when type-setting "when" -----*/
/*----- for readings and other events. -----*/
/*---------------------------------------------------------------*/
.custom .when {
font-size:1.1em;
margin: 1.25em 0 0 0;
}
.custom .location{
font-size: 1.1em;
margin: 0.5em 0 0.5em 0;
}
/*---------------------------------------------------------------*/
/*----- Generic two-column class that can be used any- -----*/
/*----- where, including wordpress posts and pages. -----*/
/*---------------------------------------------------------------*/
.custom .two-column-box {
width:100%;
}
.custom .two-column-box-left {
float:left;
width:45%;
padding-left:1em;
text-align: center;
}
.custom .two-column-box-right {
float:right;
width:45%;
padding-right: 1em;
text-align: center;
}
.custom .two-column-box .activity {
font-size:18px;
font-style: italic;
}
/*---------------------------------------------------------------*/
/*----- Tweaked Drop Caps in posts -----*/
/*---------------------------------------------------------------*/
/* Thesis has a default drop cap style, but it does not give extra
indentation to the text on the second line following. This sets up
a two-line drop cap for the first letters of posts. The proper syntax
for making the first letter of a paragraph into a drop cap is
Lorem ipsum
dolor...
*/
.PostFirstLetter{
display : block;
float : left;
margin-top : -0.205em; /* use -0.205em for two lines */
margin-left : 0em;
margin-right : 0.5em;
height : 3em;
color : #aaaaaa;
}
.PostFirstLetter span{
font-size : 3.33em; /* use 3.33em for two lines */
line-height : 1.1em;
}
.PostFirstLetter + span{
margin-left : -0.4em;
}
.PostFirstLetterI{
display : block;
float : left;
margin-top : -0.205em; /* use -0.205em for two lines */
margin-left : 0em;
margin-right : 0.5em;
height : 3em;
color : #aaaaaa;
}
.PostFirstLetterI span{
font-size : 3.33em; /* use 3.33em for two lines */
line-height : 1.1em;
}
/* Vertical Space Nudges! */
.vnudge {
font: 10px/.5em Georgia, serif;
}
/* This keeps Thesis from adding the "Comments are closed" message! */
.custom .comments_closed p {display: none ;}
/*----- Customize individual list items in the twitter feed -----*/
.custom li.twitter-item{
border-left-width: 0px;
border-bottom-width: 1px;
border-right-width: 0px;
border-top-width: 1px;
border-style: dashed;
border-color: #cccccc;
padding-top: 5px;
padding-bottom: 6px;
padding-left: 8px;
padding-right: 8px;
list-style-type: none;
background-color: #E2F1CD;
}
/*----- Customize the timestamp for items in the twitter feed -----*/
.custom .twitter-timestamp{ margin-left:4px;}
/*----- Styles for the Sociable plugin -----*/
div.sociable { float: right; margin-right:1em;
}
span.sociable_tagline { position: relative; }
span.sociable_tagline span { display: none; width: 14em; }
span.sociable_tagline:hover span {
position: absolute;
display: inline;
top: -5em;
background: #ffe;
border: 1px solid #ccc;
color: black;
line-height: 1.25em;
}
.sociable span {
display: block;
}
.sociable ul:before{
color: #666666;
font: 1.0em Georgia, serif;
font-variant: small-caps;
letter-spacing: 2px;
}
.sociable ul {
display: inline;
margin: 0 !important;
padding: 0 !important;
}
.sociable ul li {
background: none;
display: inline !important;
list-style-type: none;
margin: 0;
padding: 1px;
}
.sociable ul li:before { content: ""; }
.sociable img {
float: none;
width: 24px;
height: 24px;
border: 0;
margin: 0;
padding: 0;
}
.sociable-hovers {
opacity: 1;
-moz-opacity: 1;
filter: alpha(opacity=80);
}
.sociable-hovers:hover {
opacity: .9;
-moz-opacity: .9;
filter: alpha(opacity=100);
}
.custom .sociable h3{
color: #666666;
font: 1.1em Georgia;
font-variant: small-caps;
letter-spacing: 2px;
margin-top:0;
}
/*----- End Sociable Styles -----*/
/*----- Custom Navigation Bar Styles -----*/
#cust_navigation{
height:2em;
padding-top:0.6em;
border-bottom:1px solid #dddddd;
font: 14px/1.5em Georgia, serif;
font-variant: small-caps;
}
#cust_navigation li{
float:left;
list-style-type:none;
}
#cust_navigation li a{
border-style: none;
border-width: 0px;
display:block;
padding:0 20px;
font-weight:normal;
text-decoration:none;
}
#cust_navigation .selected{
border-style: none;
border-width: 0px;
color:#80b0da;
}
#cust_navigation a:hover{
border-style: none;
border-width: 0px;
color:#80b0da;
}
/* Style the ampersand, using the most pleasing variant available to us. */
.custom span.amp {
font-family: Baskerville, Palatino, "Book Antiqua", serif;
font-style: italic;
}
/*------ These styles customize widgets in the sidebar ------*/
.custom #sidebar_1 .widget{
margin-bottom: 2em;
padding-left: 0.25em;
}
.custom #sidebar_1 .widget_links a{
padding-left: 1em;
}
.custom #sidebar_1 h3{
font-size: 1.2em;
%text-align: center;
%border-bottom: 1px solid #cccccc;
}
.custom #sidebar_1 ul li, a{
%font-size: 1.2em;
%text-align: center;
%border-bottom: 1px solid #cccccc;
}
/* A class where we put the cutesy divider. */
.custom .hordiv {
display:block;
margin-top: 0.5em;
margin-bottom: 0.25em;
text-align: center;
}
.events h1{
display: none;
}
/*.praise #content p{
padding-left: 2em;
padding-right: 2em;
}*/
/* This hides the title on the "Praise" page so we can add our own in the page editor. */
.praise h1{
display: none;
}
.press h1{
display: none;
}
.when{
color: #cc3342;
}
.bookclub ol li{
margin-bottom: 1em;
}
/* Remove border from Blockquote */
.custom blockquote { border: none; }
/*.bookclub h1{
display: none;
}
*/
/*.praise span.amp {
font-family: Baskerville, Palatino, "Book Antiqua", serif;
font-style: italic;
}
*/