/* 
------------------------------------------------------------------

PATER FAMILIAS WEBSITE

Core Stylesheet for Screen Media

website		: www.pater-familias.com
filename	: core_css (stylesheets template group)
revision	: 2 November 2009

author		: Brian Lokker / Antigravity Design
website		: www.antigravitydesign.com
email		: studio@antigravitydesign.com

------------------------------------------------------------------ */



/* =Reset Styles (adapated from Eric Meyer's reset.css -- see
	http://meyerweb.com/eric/tools/css/reset/)
------------------------------------------------------------------ */

/* remove default browser margins, padding, borders, etc. */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
/* table, */ caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

body {
line-height: 1;
}

ol, ul {
list-style: none;
}

blockquote, q {
quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}

/* remove outline from active links, etc. */
/* remember to define focus styles! */
a:hover, a:focus, a:active {
outline: none;
}

/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}

del {
text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
/*
table {
border-collapse: collapse;
border-spacing: 0;
}
*/



/* =Utilities
------------------------------------------------------------------ */


/* force Firefox to draw scrollbar to avoid short-page jump */
/* hide from IE-Mac \*/
html {
min-height: 100%;
margin-bottom: 1px;
}
/* end hiding from IE5-Mac */

/* set help cursor for abbreviations and acronyms */
abbr, acronym {
cursor: help;
}

/* "phantom" elements for screen readers etc. */
.hidden {
display: none;
}

/* generic clearing styles */
.clearBoth {
clear: both;
}
.clearLeft {
clear: left;
}
.clearRight {
clear: right;
}

/* Clearing floats: the design pattern alternative --
   (add an empty div with this class as the last element in a div
   that contains escaping floats) */

.clearFloats {
clear: both;
display: block;
height: 1px;
font-size: 1px;
line-height: 1px;
}

/* Clearing floats: the "easy clearing method" alternative --
   (add the .clearfix class to a div that contain escaping floats)
   see http://www.positioniseverything.net/easyclearing.html */

.clearfix:after {
content: ".";
display: block;
height: 0;
font-size: 0;
clear: both;
visibility: hidden;
}

.clearfix {
min-height: 1px;
}

* html .clearfix {
height: 1px;
}



/* =Body and Page
------------------------------------------------------------------ */

body {
min-width: 980px; /* for Netscape 6 */
text-align: center; /* center content in IE */
padding-top: 0;
/* padding-bottom: 20px; */ /* note that setting margin-bottom on "page" doesn't work in IE/Win */
font-size: 62.5%;
font-family: "Lucida Grande", Verdana, Helvetica, Geneva, Arial, sans-serif;
color: #000; /* default */
background: #ECEBFB url(/images/site/bg_body.png) center top repeat-x;
}

#page {
position: relative;
margin: 0 auto; /* center content in standards-compliant browsers */
text-align: left;
padding-bottom: 24px;
line-height: 12px; /* sets the default vertical grid */
color: #000;
background: #FFF url(/images/site/bg_body.png) center top repeat-x;
}



/* =Header and Top Navigation
___________________________________________________________________ */

#header {
position: relative;
top: 0;
left: -20px;
width: 1000px;
height: 200px;
margin-bottom: 40px;
margin-top: 0;
padding-top: 0;
}

/* replace h1 text with background image (except on home page, where it is Flash) */
h1#banner {
width: 980px;
height: 137px;
z-index: 10;
text-indent: -9999px;
background: url(/images/site/banner-1.png) top left no-repeat;
}

/* convert background heading image to a link */
/* repeat the background image rule to avoid flickering in IE during mouseover; */
h1 a {
display: block;
width: 980px;
height: 137px;
background: url(/images/site/banner-1.png);
}

/* remove "link" cursor from logo on homepage (may not be necessary with Flash) */
.homepage h1 a { 
cursor: default;
}

/* Top Navigation uses "Pixy" graphic method */

#navTop {
margin-left: 0;
margin-bottom: 7px;
width: 980px;
height: 40px;
background-image: url(/images/site/sprite_navTop.png);
background-repeat: no-repeat;
}

#navTop ul {
float: left;
position: relative;
top: 0;
left: 0;
width: 980px;
height: 40px;
line-height: 40px;
}

#navTop li {
float: left;
text-indent: -9999px;
}

#navTop li span {
display: none;
}

#navTop a {
display: block;
height: 40px;
text-indent: -9999px;
background-image: url(/images/site/sprite_navTop.png);
background-repeat: no-repeat;
}

#navTop a.here {
cursor: default;
}

.picksDetail #navTop a.here,
.picksAll #navTop a.here {
cursor: pointer;
}

#navTop .navHome a {
width: 75px;
background-position: 0 0;
}

#navTop .navHome a:hover,
#navTop .navHome a:active {
background-position: 0 -40px;
}

#navTop .navArchives a {
width: 95px;
background-position: -75px 0;
}

#navTop .navArchives a:hover,
#navTop .navArchives a:active {
background-position: -75px -40px;
}

#navTop .navPicks a {
width: 120px;
background-position: -170px 0;
}

#navTop .navPicks a:hover,
#navTop .navPicks a:active {
background-position: -170px -40px;
}

#navTop .navPlays a {
width: 115px;
background-position: -290px 0;
}

#navTop .navPlays a:hover,
#navTop .navPlays a:active {
background-position: -290px -40px;
}

#navTop .navAbout a {
width: 85px;
background-position: -405px 0;
}

#navTop .navAbout a:hover,
#navTop .navAbout a:active {
background-position: -405px -40px;
}

#navTop .navContact a {
width: 90px;
background-position: -490px 0;
}

#navTop .navContact a:hover,
#navTop .navContact a:active {
background-position: -490px -40px;
}

.home #navTop .navHome a.here {
background-position: 0 -80px;
}

.blogArchives #navTop .navArchives a.here {
background-position: -75px -80px;
}

.picks #navTop .navPicks a.here {
background-position: -170px -80px;
}

.plays #navTop .navPlays a.here {
background-position: -290px -80px;
}

.about #navTop .navAbout a.here {
background-position: -405px -80px;
}

.contact #navTop .navContact a.here {
background-position: -490px -80px;
}



/* =Content Layout and Standard Styles
___________________________________________________________________ */

#contentWrapper {
margin-bottom: 24px;
}

.contentMain {
position: relative;
}

.contentSecondary {
position: relative;
}

.contentMain h2 {
padding-bottom: 6px;
font-family: "Myriad Pro", Helvetica, Geneva, Arial, sans-serif;
font-size: 2.5em;
line-height: 24px;
font-weight: normal;
letter-spacing: 2px;
color: #000;
background-color: transparent;
}

.contentMain p,
.contentMain ul,
.contentMain ol,
.contentMain dl {
margin-bottom: 1.3em;
font-size: 1.3em;
line-height: 1.5;
}

.contentSecondary p {
font-size: 1.2em;
line-height: 1.5;
margin-bottom: 12px;
}

a:link,
a:visited {
color: #1C6E26;
}

a:hover,
a:active {
color: #124618;
}


/* =Footer
___________________________________________________________________ */

#footer {
clear: both;
position: relative;
left: 0;
width: 100%;
height: auto;
border-top: 7px solid #FFF;
background: #898989;
}

#footerContent {
position: relative;
margin: 0 auto; /* center content in standards-compliant browsers */
padding: 20px 10px;
width: 960px;
text-align: left;
color: #393939;
background-color: #D2D2D2;
}

#navBottom {
margin-bottom: 20px;
font-size: 1.1em;
}

#navBottom li {
display: inline;
line-height: 1;
}

#navBottom a {
font-weight: bolder;
line-height: 1;
}

#navBottom a:link, #navBottom a:visited {
text-decoration: none;
color: #393939;
}

#credits a:link, #credits a:visited {
text-decoration: none;
color: #393939;
}

#navBottom a:hover, #navBottom a:active,
#credits a:hover, #credits a:active {
text-decoration: underline;
color: #9D3568;
}

#navBottom a.here {
text-decoration: none;
cursor: default;
color: #9D3568;
}

.picksDetail #navBottom a.here,
.picksAll #navBottom a.here {
cursor: pointer;
}

#navBottom li span {
padding: 0 0.5em;
}

#credits {
padding-left: 90px;
line-height: 1.3;
background-color: #D2D2D2;
}

#socialLinks {
position: absolute;
top: 20px;
left: 660px;
width: 300px;
}

#socialLinks h3 {
text-transform: uppercase;
letter-spacing: 0.1em;
color: #9D3568;
margin-bottom: 12px;
}

#socialLinks li {
display: inline;
line-height: 24px;
}



/* =Blog
___________________________________________________________________ */

.blogEntry {
margin-left: 80px;
margin-bottom: 24px;
}

.featuredEntry {
margin-bottom: 48px;
}

.blogEntry h3 {
margin-bottom: 1.3em;
font-size: 1.3em;
font-weight: bold;
line-height: 1.5;
text-transform: uppercase;
color: #000;
background-color: transparent;
}

.blogEntry h4 {
margin-bottom: 1.3em;
font-size: 1.3em;
font-weight: bold;
line-height: 1.5;
color: #9D3568;
background-color: transparent;
}

/* most of these styles are also used for Pater's Picks */
p.entryDate {
border-top: 1px solid #1C6E26;
padding-top: 0.5em;
margin-bottom: 2.5em;
font-size: 1.1em;
color: #4C4C4C;
background-color: transparent;
}

p.entryDate a:link, p.entryDate a:visited {
text-decoration: none;
}

p.entryDate a:hover, p.entryDate a:active {
text-decoration: underline;
}

.blogEntry p.blogIntro {
font-size: 1.7em;
line-height: 1.3;
color: #1C6E26;
}

.blogEntry img.arkle {
float: left;
margin-left: -80px;
margin-top: 0.5em;
margin-right: 20px;
margin-bottom: 0.5em;
}

.blogEntry ul {
margin-left: 1em;
list-style-image: url(/images/site/listMarker-green.png);
}

.blogEntry ol {
margin-left: 2.5em;
list-style-type: decimal;
}

.blogEntry li {
margin-bottom: 0.75em;
}

.blogEntry p.blogEntryComments {
margin-top: 1em;
border-top: 1px solid #1C6E26;
padding-top: 0.5em;
font-size: 1.1em;
}

.blogEntry blockquote {
margin: 0 3em 0 2em;
font-size: 1em;
}

.cotwEntry blockquote p {
margin-bottom: 1.5em;
line-height: 1.1;
}

h2#cotw {
margin-left: 80px;
margin-bottom: 36px;
text-indent: -9999px;
height: 40px;
background: url(/images/site/hd_weeklynews.png) left center no-repeat;
}

h2#previous {
margin-left: 80px;
margin-top: 36px;
margin-bottom: 36px;
text-indent: -9999px;
height: 40px;
background: url(/images/site/hd_previous.png) left center no-repeat;
}

.excerptEntry h2 {
margin-top: 36px;
}

.excerptEntry p.readOnLink {
font-size: 1.2em;
}

/* ensure consistency in "read on" links when excerpt ends with ul or ol */

.excerptEntry ul p.readOnLink {
font-size: inherit;
margin-left: -1em;
}

.excerptEntry ol p.readOnLink {
font-size: inherit;
margin-left: -2.5em;
}

/* Comments Styles */

#comments {
margin-left: 80px;
}

#comments h2 {
margin-bottom: 24px;
text-indent: -9999px;
height: 40px;
background: url(/images/site/hd_comments.png) left center no-repeat;
}

#comments h3 {
margin-bottom: 12px;
font-size: 1.5em;
color: #9D3568;
background-color: transparent;
}

#comments h4 {
margin-bottom: 1em;
font-size: 1.3em;
font-weight: normal;
color: #9D3568;
background-color: transparent;
}

#comments p {
font-size: 1.3em;
line-height: 1.3;
}

#comments .comment,
#comments .preview {
margin-bottom: 2em;
padding: 4px;
background: url(/images/site/icon_comment.png) 4px 8px no-repeat;
}

#comments .comment {
border: 1px solid #D0D7E1;
}

#comments .preview {
border: 1px solid #9D3568;
}

#comments .commentBody,
#comments .previewBody {
padding: 4px 4px 0 4px;
text-indent: 16px;
}

#comments .comment.author2 {
background: url(/images/site/icon_mike.png) 4px 8px no-repeat;
}

#comments p.footnote {
margin-bottom: 0;
padding-left: 4px;
font-size: 1.1em;
line-height: 2.5;
color: #4C4C4C;
background-color: #F3F5F8;
}

#comments p.footnote strong,
#comments p.footnote span {
color: #393939;
font-weight: bold;
}

#comments .author2 p.footnote span {
color: #1C6E26;
}

#comments textarea {
width: 100%;
}


/* Lists of Entries in Secondary Column */
/* Note: these styles are also used in Picks -- see below */

.blog .contentSecondary .entriesRecent,
.blog .contentSecondary .entriesCategories {
margin-bottom: 24px;
padding: 10px 10px 0 10px;
background-color: #EEE;
}

.blog .contentSecondary .entriesRecent h3,
.blog .contentSecondary .entriesCategories h3 {
margin-bottom: 13px;
border-bottom: 1px solid #9D3568;
padding-bottom: 4px;
font-size: 1.5em;
font-weight: bold;
}

.blog .contentSecondary ul {
padding-bottom: 18px;
}

.blog .contentSecondary li {
font-size: 1.2em;
line-height: 1.5;
}

.blog .contentSecondary .entriesRecent li span {
font-size: 0.8em;
}

/* Blog Category and Blog Archives page styles */

.blogCategory .contentMain h2,
.blogArchives .contentMain h2 {
border-bottom: 1px solid #1C6E26;
}

.blogCategory .blogEntry {
margin: 24px 0 0 0;
padding: 0;
}

.blogCategory .blogEntry h3 {
margin: 0 0 3px 0;
padding: 0;
font-size: 1.5em;
font-weight: bold;
text-transform: none;
color: #000; /*#1C6E26;*/
}

.blogCategory .blogEntry h3 a:link,
.blogCategory .blogEntry h3 a:visited {
color: #000;
text-decoration: none;
}

.blogCategory .blogEntry h3 a:hover,
.blogCategory .blogEntry h3 a:active {
color: #124618;
text-decoration: underline;
}

.blogCategory .blogEntry p {
display: inline;
font-size: 1.2em;
line-height: 1.5;
}

.blogCategory .blogEntry p.entryDate {
display: block;
margin: 6px 0 0 0;
border-top: 1px solid #C2C2C2;
padding: 3px 0 0 0;
font-size: 0.9em;
text-align: right;
}

.blogCategory .blogEntry p.blogIntro {
display: block;
margin: 0 0 6px 0;
padding: 0;
font-size: 1.3em;
font-weight: bold;
}

.blogCategory p.noResults {
margin-top: 24px;
}

/* Styles to condense excerpt for Categories list */

.blogCategory .blogEntry div h3,
.blogCategory .blogEntry div h4 {
float: left;
margin-bottom: 0;
padding-right: 1em;
font-size: 1.2em;
font-weight: bold;
line-height: 1.5;
color: #000;
}

.blogArchives .blogEntry {
margin-top: 24px;
}

.blogArchives .blogEntry h3 {
float: left;
margin-left: -80px;
}

.blogArchives .blogEntry h4 {
margin: 6px 0 3px 0;
padding: 0;
color: #000;
}

.blogArchives .blogEntry ul {
margin: 0;
padding: 0;
list-style-image: none;
}

.blogArchives .blogEntry li {
margin: 0 0 0 30px;
padding: 0;
}

.blogArchives .blogEntry li span {
display: block;
float: left;
margin-left: -30px;
font-weight: bold;
color: #4C4C4C;
}



/* =Pater's Picks
___________________________________________________________________ */

/* Picks content in main content section -- Pater's Picks section */

.picks .contentMain h2 {
text-indent: -9999px;
width: 460px;
height: 40px;
background: url(/images/site/hd_picks.png) left center no-repeat;
}

.picks .contentMain h2 a {
display: block;
width: 460px;
height: 40px;
background: url(/images/site/hd_picks.png) left center no-repeat;
}

/* Picks content in secondary content section (e.g., home page) */

.contentSecondary .pickPreview h3 {
text-indent: -9999px;
width: 300px;
height: 40px;
background: url(/images/site/hd_picks.png) left center no-repeat;
}

.contentSecondary .pickPreview h3 a {
display: block;
width: 300px;
height: 40px;
background: url(/images/site/hd_picks.png) left center no-repeat;
}

.contentSecondary .pickEntry p.entryDate {
font-size: 1em;
}
/* ----for additional p,entryDate styles, see above under blog entry---- */

.pickEntry {
margin-top: 24px;
}

.pickEntry h4 {
width: 90%; /* was 80% in semi-final draft */
margin-bottom: 12px;
font-size: 1.4em; /* was 1.5 em in semi-final draft */
font-weight: bold;
line-height: 1.3;
color: #9D3568;
background-color: transparent;
}

.pickEntry h4 a:link, .pickEntry h4 a:visited {
text-decoration: none;
color: #9D3568;
background-color: transparent;
}

.pickEntry h4 a:hover, .pickEntry h4 a:active {
text-decoration: underline;
color: #9D3568;
background-color: transparent;
}

.pickEntry img {
background-color: #EEE;
padding: 10px;
margin-bottom: 12px;
}

.pickEntry div p:first-child:first-line {
font-size: 1.1em;
font-weight: bold;
}

/* Styles for Picks listed on a category page */

.pickListing .pickEntry img {
float: left;
}

.pickListing .pickEntry h4 {
margin-left: 160px;
font-size: 1.4em;
line-height: 1.2;
color: #9D3568;
background-color: transparent;
}

.pickListing .pickEntry div {
margin-left: 160px;
font-size: 1em;
line-height: 1.2;
}

.pickListing .pickEntry div p:first-child:first-line {
font-size: 1em;
}

/* Styles for MX Stars Field */

.star-rating {
list-style: none;
margin: 0 0 18px 0;
padding: 0;
width: 85px; /* 17px per star = 5 stars */    
height: 17px;
position: relative;
background: url(/images/site/rating-stars.png) top left repeat-x;
}

.star-rating li {
padding: 0;
margin: 0;
height: 17px;
width: 17px;
float: left;
}

.star-rating li.current-rating {
background: url(/images/site/rating-stars.png) left bottom;
position: absolute;
height: 17px;
display: block;
text-indent: -9000px;
z-index: 1;
}

/* Lists of Picks in Secondary Column */
/* Note: these styles are also used in the Blog -- see above */

.picks .contentSecondary .picksRecent,
.picks .contentSecondary .picksCategories {
margin-bottom: 24px;
padding: 10px 10px 0 10px;
background-color: #EEE;
}

.picks .contentSecondary h3 {
margin-bottom: 13px;
border-bottom: 1px solid #9D3568;
padding-bottom: 4px;
font-size: 1.5em;
font-weight: bold;
}

.picks .contentSecondary ul {
padding-bottom: 18px;
}

.picks .contentSecondary li {
font-size: 1.2em;
line-height: 1.5;
}

/* Picks Categories Listing */

.picks .contentMain h3 {
margin-top: 24px;
margin-bottom: 12px;
padding-left: 12px;
font-size: 1.5em;
font-weight: bold;
color: #000;
background: url(/images/site/listMarker-green.png) left 50% no-repeat;
}

.picks .contentMain h3 span {
font-weight: normal;
}

/* All Picks Listing */

.picks .nav_cat_archive {
margin-top: 24px;
}

.picks .nav_cat_archive ul {
margin-bottom: 0;
}

.picks .nav_cat_archive li {
margin-top: 12px;
padding-left: 12px;
font-size: 1.1em;
font-weight: bold;
line-height: 1.5;
color: #000;
background: url(/images/site/listMarker-green.png) left 0.4em no-repeat;
}

.picks .nav_cat_archive li li {
margin-top: 0;
padding-left: 0;
font-size: 0.6em;
background: none;
}

.picks .nav_cat_archive li span {
font-weight: normal;
}

/* AddThis Buttons */

.addthis_button img {
margin: 0 0 1.3em 0;
padding: 0;
background: none;
}


/* =Pater's Plays
___________________________________________________________________ */

/* Plays content in secondary content section (e.g., home page) */

.contentSecondary .playFeatured h3 {
text-indent: -9999px;
width: 300px;
height: 40px;
background: url(/images/site/hd_plays.png) left center no-repeat;
}

.contentSecondary .playFeatured h3 a {
display: block;
width: 300px;
height: 40px;
background: url(/images/site/hd_plays.png) left center no-repeat;
}

.contentSecondary .playEntry p.entryDate {
font-size: 1.2em;
}
/* ----for additional p,entryDate styles, see above under blog entry---- */

.playEntry {
margin-top: 24px;
}

.playEntry h4 {
width: 90%;
margin-bottom: 12px;
font-size: 1.4em;
font-weight: normal;
line-height: 1.3;
color: #9D3568;
background-color: transparent;
}

.playEntry h4 a:link, .playEntry h4 a:visited {
text-decoration: none;
color: #9D3568;
background-color: transparent;
}

.playEntry h4 a:hover, .playEntry h4 a:active {
text-decoration: underline;
color: #9D3568;
background-color: transparent;
}

.playEntry h4 span {
color: #000;
}

.playWidget {
text-align: center;
padding-top: 25px;
padding-bottom: 25px;
background-color: #EEE;
margin-bottom: 12px;
}

.playNote p:first-child:first-line {
font-size: 1.1em;
font-weight: bold;
}

/* Plays content in main content section -- Pater's Plays page */

.plays .contentMain h2 {
text-indent: -9999px;
width: 460px;
height: 40px;
background: url(/images/site/hd_plays.png) left center no-repeat;
}

.playListing .playEntry .albumCover {
float: left;
margin-bottom: 12px;
padding: 10px;
background-color: #EEE;
}

.playListing .playEntry h4 {
width: auto;
margin-left: 160px;
font-size: 1.4em;
line-height: 1.2;
text-indent: 0;
color: #9D3568;
}

.playListing .playEntry p {
margin-left: 160px;
margin-bottom: 6px;
font-size: 1.2em;
line-height: 1.2;
}

.playListing .playEntry p.buy {
font-size: 1.1em;
}



/* =About Pater Familias
___________________________________________________________________ */

.about .contentMain h2 {
border-bottom: 1px solid #1C6E26;
}

.about .contentMain h3 {
margin-top: 1.3em;
font-size: 1.5em;
font-weight: bold;
line-height: 1.5;
color: #9D3568;
background-color: transparent;
}

.about .contentMain ul {
margin-top: -0.3em;
}

.about img#mike {
float: left;
margin-left: 0;
margin-top: 0.5em;
margin-right: 20px;
margin-bottom: 0.5em;
}



/* =Display Ads and Amazon Ads in Secondary Content Column
___________________________________________________________________ */

.contentSecondary .displayAd,
.contentSecondary .amazonAds {
margin-bottom: 24px;
}

.contentSecondary .displayAd h3 {
text-indent: -9999px;
width: 300px;
height: 20px;
background: url(/images/site/hd_advertisement.png) left top no-repeat;
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}

.contentSecondary .amazonAds h3 {
text-indent: -9999px;
width: 300px;
height: 20px;
background: url(/images/site/hd_advertisements.png) left top no-repeat;
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}

.contentSecondary .amazonAds .ad {
width: 120px;
padding: 10px;
background: #EEE;
}

.contentSecondary .amazonAds .displayLeft {
float: left;
}

.contentSecondary .amazonAds .displayRight {
float: right;
}