/* Theme Name: disassociated      
Author:	John Lampard
Author URI: https://www.disassociated.com/
*/

/* disassociated.com stylesheet (ver5) by John Lampard, May 2012. Updated December 2013, September 2015, February 2017. */

/* white space reset - resets all browser default padding and margin settings */
* {
padding:0;
margin:0;
}

html, body{
height:100%;
}

body{
background:#fff;
color:#000000;
margin:0; 
padding:0; 
border:0;
font-family:"Agenda Medium", Helvetica, Arial, Verdana, sans-serif; /* still specify system fonts just in case web fonts don't work */
font-size:16px; 
line-height:28px;
text-align:center;
}

/* global link styles, hardly used but handy */
a:link, a:visited{
text-decoration:none;
background:transparent;
color:#8c8c8c;
font-weight:normal;
}

a:hover{
text-decoration:underline;
background:transparent;
color:#333;
font-weight:normal;
}

a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

img{
border:0 none;
}

fieldset{
border:0;
}

/* global acronym styles */
acronym{
font-weight:normal;
border-bottom:solid 1px #8c8c8c;
}

#container{
width:700px;
background:#fff;
border:0;
min-height:100%;
margin-bottom:-10px;
position:relative;
margin-top:0;
margin-right:auto;
margin-bottom:0;
margin-left:auto;
}

#header{
background:#fff;
width:700px;
text-align:center;
margin:20px 0 0 0;
padding:0;
border:0;
}

/* h1 styles used for dis title in header */
#header h1{
font-size:25px;
color:#333;
font-weight:normal;
margin:0;
letter-spacing:1px;
}

#header h1 a:link, #header h1 a:visited{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

#header h1 a:hover{
text-decoration:none;
background:transparent;
color:#999;
font-weight:normal;
}

#header h1 a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

#header h2{
font-size:11px;
color:#333;
font-weight:normal;
margin:-10px 0 0 0;
letter-spacing:1px;
}

/* site menu/nav styles */
#dir{
float:left;
width:700px;
background:transparent;
text-align:center;
margin:15px 0 15px 0;
}

#dir ul{
margin:0;
padding:0 0 25px 0; /* padding puts some space under dotted line */ 
border-bottom:dotted 1px #333;
}

#dir ul li{
list-style-type:none;
display:inline;
}

#dir li{
background:transparent;
font-size:20px;
color:#333;
margin:0;
padding:0 25px 0 0;
}

#dir li a:link, #dir li a:visited{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

#dir li a:hover{
text-decoration:none;
background:transparent;
color:#999;
font-weight:normal;
}

#dir li a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

/* styles for disassociated grey text in menu/nav */
#dir li.main a:link, #dir li.main a:visited{
text-decoration:none;
background:transparent;
color:#8c8c8c;
font-weight:normal;
}

#dir li.main a:hover{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

#dir li.main a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

/* content div styles */
#content{
width:700px;
background:transparent;
text-align:left;
margin:0;
padding:0;
border:0;
}

/* h1 styles used on single post page */
#content h1{
font-size:24px; /* set to 24px for better display on Chrome */
color:#333;
font-weight:normal;
margin:15px 0 0 0;
}

#content h1 a:link, #content h1 a:visited{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

#content h1 a:hover{
text-decoration:none;
background:transparent;
color:#999;
font-weight:normal;
}

#content h1 a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

/* h2 styles used on main template category, archive etc pages, but NOT single post */
#content h2{
font-size:24px; /* set to 24px for better display on Chrome */
color:#333;
font-weight:normal;
margin:15px 0 0 0;
}

#content h2 a:link, #content h2 a:visited{
background:transparent;
text-decoration:none;
color:#333;
font-weight:normal;
}

#content h2 a:hover{
background:transparent;
text-decoration:none;
color:#999;
font-weight:normal;
}

#content h2 a:active{
background:transparent;
text-decoration:none;
color:#333;
font-weight:normal;
}

/* use for SUB HEADERS on posts (like movie reviews, Seesmic, etc) */
#content h3{
font-size:20px;
color:#333;
font-weight:normal;
padding:0;
margin:18px 0 0 0;
}

/* use for day/date under post titles */
#content h4{
font-size:16px;
color:#333;
font-weight:normal;
margin:0 0 20px 0;
padding:0;
border:0;
}

#content p{
font-size:18px;
line-height:30px;
color:#666;
margin:20px 0 20px 0;
padding:0;
border:0;
}

#content p a:link, #content p a:visited{
text-decoration:none;
background:transparent;
color:#666;
font-weight:normal;
border-bottom:dotted 1px #000;
}

#content p a:hover{
text-decoration:none;
background:transparent;
color:#999;
font-weight:normal;
}

#content p a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

/* blockquote styles use for quotes etc */
blockquote{
font-size:18px;
line-height:24px;
color:#666;
margin:15px 25px 15px 10px;
padding:0 10px 0 10px;
border-left:1px dotted #8c8c8c;
}

/* styles for tags text etc - REPLACED BY TAGS STYLE JUST BELOW 11/2/17 */
#content p.tag-header{
font-size:18px;
color:#333;
margin:10px 0 55px 0;
padding:0;
border:0;
}

/* styles for tags text etc */
#content p.tags{
font-size:16px;
color:#333;
margin:20px 0 55px 0;
padding:0;
border:0;
}

#content p.tag{   /* no longer is use as of 11/2/17, replaced by "tags" style */
font-size:14px;
color:#333;
margin:0 5px 55px 0;
padding:0;
border:0;
}

#content p.tags a:link, #content p.tag a:visited{
text-decoration:none;
background:transparent;
color:#666;
font-weight:normal;
margin:0;
padding:0;
border:0;
}

#content p.tags a:hover{
text-decoration:none;
background:transparent;
color:#999;
font-weight:normal;
margin:0;
padding:0;
border:0;
}

#content p.tags a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
margin:0;
padding:0;
border:0;
}

/* these styles are needed to help FB and Twitter buttons align */
/* #content */ 
.social{
margin:30px 0 20px 0;
padding:0; 
border:0;
}

div .twitter, .fb-like{
margin:0 5px 0 0;
display:inline-block;
}

/* styles layout of comments intro and form */
#comment-form{
width:700px;
margin:30px 0 0 0;
padding:0;
border:0;
text-align:left;
}

#comment-form p{
font-size:20px;
line-height:26px;
text-align:left;
margin:10px 0 10px 0;
}

#comment-form h3{
font-size:22px;
color:#333;
font-weight:normal;
margin:35px 0 0 0;
}

/* styles the comment warning text, be on topic, etc */
#comment-form p.small-print{
font-size:18px;
line-height:26px;
margin:10px 0 0 0;
padding:0;
}

/* comment submit button */
#comment-form input[type="submit"] {
width:100px;
color:#333;
background:#ccc;
padding:9px;
margin: 10px 0 20px 0;
border:0;
letter-spacing:1px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
-webkit-appearance:none;
text-align:center;
font-size:20px;
}

/* comment styles, for actual comments */
#comments{
width:700px;
margin:30px 0 0 0;
padding:0;
border:0;
text-align:left;
}

#comment-text{
width:690px;
margin:10px 20px 0 10px;
}

/* this styles each comment "box/space/area" */
#comments li{
background:#fff;
margin:15px 0 10px 0;
padding:0 10px 0 10px;
width:696px;
font-size:12px;
border-top:1px solid #cfcfcf;
}

/* styles for comment user urls, times, etc */
.comment-style{
background:url(http://www.disassociated.com/images/index/point_style_star.gif) no-repeat 0 6px;
font-size:18px;
color:#333;
width:660px;
margin:-5px 0 40px 0; /* the -5px setting nudges commenter name a tad closer to their comment */
padding:0 0 0 18px;
}

.comment-style a:link, .comment-style a:visited{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
border-bottom:dotted 1px #000000;
}

.comment-style a:hover{
text-decoration:none;
background:transparent;
color:#8c8c8c;
font-weight:normal;
border-bottom:dotted 1px #000000;
}

.comment-style a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

/* use this list style for plain lists i.e link roundup type reports, NO point style stars */
#content ul{
font-weight:normal;
margin:0;
}
 
#content li{
list-style:none;
font-size:18px;
line-height:26px;
color:#333;
margin:0 0 10px 0;
padding:0;
}

#content li a:link, #content li a:active{
background:transparent;
text-decoration:none;
font-weight:normal;
border-bottom:dotted 1px #000000;
color:#8c8c8c;
} 

#content li a:hover{
background:transparent;
text-decoration:none;
font-weight:normal;
border-bottom:dotted 1px #000000;
color:#999;
}

#content li a:visited{
background:transparent;
text-decoration:none;
font-weight:normal;
border-bottom:dotted 1px #000000;
color:#8c8c8c;
} 

/* use this for footnotes to posts */
.footnotes{
color:#666;
width:700px;
margin:0; 
padding:5px 0 0 0;
border-top:1px solid #333;
}

/* sub and sup styles, keeps line spacing consistent - eg Oscar's article */
sup, sub{
height:0;
line-height:1;
vertical-align:baseline;
/* _vertical-align:bottom; invalid CSS for IE6 - no longer needed?  */
position:relative;	
}

sup{
bottom:1ex; /* ex = x-height, see google for more :) */
}

sub{
top:.5ex;
}

/* this is for simple lists of items refer post titled Ignore the four as an example */
#content li.item{
list-style:none;
font-weight:normal;
font-size:18px;
line-height:26px;
color:#666;
margin:0;
padding:0;
}

/* use this list style for the "Point Style" posts */
#content ul.point-style{
margin:0;
font-weight:normal;
}

#content li.point-style{
background:url(http://www.disassociated.com/images/index/point_style_star.gif) no-repeat 0 8px;
list-style:none;
font-size:18px;
line-height:30px;
font-weight:normal;
color:#666;
width:650px;
margin:0 0 5px 0;
padding:0 0 0 18px;
}

/* styles for Five Questions, reviews, and other special features, usually used for 2007 content */
.features-intro{
font-size:18px;
line-height:26px;
color:#666; 
width:700px;
margin:0;
padding:5px 0 4px 0;
border-top:1px solid #666;
border-bottom:1px solid #666;
}

.features-intro a:link, .features-intro a:visited{
text-decoration:none;
background:transparent;
color:#8c8c8c;
font-weight:normal;
border-bottom:dotted 1px #000000;
}

.features-intro a:hover{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
border-bottom:dotted 1px #000000;
}

.features-intro a:active{
text-decoration:none;
background:transparent;
color:#8c8c8c;
font-weight:normal;
}

/* pre format style - used for "deadset" post Feb 06 for example */
pre{
color:#666;
text-align:left;
font-size:16px;
margin:10px 35px 3px 15px;
padding:0;
border:0;
}

/* special styles for very large text (eg: addendum post) */
.large{
font-size:140px;
line-height:150px;
color:#000000;
margin:0;
padding:0;
border:0;
}

/* use this list style for archive page list smaller text etc */
/* styles for archive page using HEATMAP plugin */
#compact-list{
font-size:18px;
line-height:30px;
color:#8c8c8c;
width:650px;
margin:0;
padding:0 20px 20px 0;
}

#compact-list a:link, #compact-list a:active{
background:transparent;
text-decoration:none;
font-weight:normal;
border-bottom:dotted 1px #000000; 
color:#333;
} 

#compact-list a:hover{
background:transparent;
text-decoration:none;
font-weight:normal;
border-bottom:dotted 1px #000000;
color:#999;
}

#compact-list a:visited{
background:transparent;
text-decoration:none;
font-weight:normal;
border-bottom:dotted 1px #000000;
color:#ccc;
} 

/* shared styles for comment and contact forms, mail list has its own */
.text_input{
font-size:22px;
line-height:24px;
background:#fbfbfb;
width:696px;
margin:0;
padding:3px 0 3px 2px;
border:1px solid #cfcfcf;
}

textarea{
background:#fbfbfb;
width:696px;
margin:0;
padding:3px 0 3px 2px;
border:1px solid #cfcfcf;
}

/* contact form styles */
#contact-form{
width:700px;
text-align:left;
margin:10px 0 50px 0;
padding:0;
border:0;
}

#contact-form p{
font-size:20px;
line-height:26px;
text-align:left;
margin:10px 0 10px 0;
}

/* contact form styles submit/send button */
#contact-form input[type="submit"] {
width:100px;
color:#333;
background:#ccc;
padding:9px;
border:0;
letter-spacing:1px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
-webkit-appearance:none;
text-align:center;
font-size:20px;
}

.contact-form-error{
color:#df0029;
background:#ffe303;
font-size:20px;
line-height:26px;
text-align:left;
margin:0;
padding:5px;
}

/* styles for Very Simple Contact form */
/* Submit button */
#vscf_send {
width:100px;
color:#333;
background:#ccc;
padding:9px;
margin:10px 0 20px 0;
border:0;
letter-spacing:1px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
-webkit-appearance:none;
text-align:center;
font-size:20px;
}

#vscf_name, #vscf_email, #vscf_subject, #vscf_captcha {
background:#fbfbfb;
/* width:696px; */
margin:0;
padding:3px 0 3px 2px;
border:1px solid #cfcfcf;
}

/* styles for mailchimp sign up form */
#mc-form{
width:700px;
margin:30px 0 0 0;
padding:0;
border:0;
text-align:left;
}

#mc-form p{
font-size:20px;
line-height:26px;
text-align:left;
}

#mc.text_input{
background:#fbfbfb;
width:696px;
margin:0;
padding:3px 0 3px 2px;
border:1px solid #cfcfcf;
}

/* used solely om mail list page, styles email input line without upsetting mc form code  */
.required-email{
font-size:20px;
line-height:26px;
background:#fbfbfb;
width:696px;
margin:0;
padding:3px 0 3px 2px;
border:1px solid #cfcfcf;
}

/* mc mail list form styles submit/send button */
#mc-form input[type="submit"] {
width:130px;
color:#333;
background:#ccc;
padding:9px;
border:0;
letter-spacing:1px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
-webkit-appearance:none;
text-align:center;
font-size:20px;
}

/* search box styles */
.input-box{
font-size:80px;
line-height:85px;
color:#fff;
background:#333;
border:7px solid #333;
padding:0;
margin:0;
width:685px;
border-radius:7px;
-moz-border-radius:7px;
-webkit-border-radius:7px;
-webkit-appearance:none;
vertical-align:bottom;
}

/* floats for thumb images in report, choose to turn left or right */
.left-thumb{
float:left;
margin:4px 15px 5px 0;
}

.right-thumb{
float:right;
margin:0 0 5px 15px;
}

/* photo and frame inserts */
.photo{
width:403px;
height:378px;
margin:15px 0 15px 0;
padding:0;
}

.photo img{
padding:25px 25px 29px 28px;
background:url(http://www.disassociated.com/images/index/photo_frame.gif) no-repeat;
}

/* "FULL SIZE" (not as of May 2012!) photo and frame inserts */
.photo-461{
width:461px;
height:461px;
margin:15px 0 15px 0;
padding:0;
}

.photo-461 img{
padding:25px 25px 29px 28px;
background:url(http://www.disassociated.com/images/index/photo_frame_461.gif) no-repeat;
}

/* polaroid-frame photo and frame inserts */
.photo-polaroid{
width:502px;
height:563px;
margin:15px 0 15px 0;
padding:0;
}

.photo-polaroid img{
padding:27px 27px 85px 27px;
background:url(http://www.disassociated.com/images/index/polaroid_frame.gif) no-repeat;
}

/* affiliate & non photo TEXT styles */
.image-text{
margin:-3px 25px 15px 0;
font-size:14px;
color:#666;
}

/* affiliate & non photo styles */
.non-photo{
margin:15px 0 5px 0;
padding:0;
border:0;
}

/* film review star image styles */
.film-stars{
margin:-10px 0 5px 0; /* set to -10 here, displays better when closer to date text */
padding:0;
border:0;
}

/* styles for PREVIOUS/NEXT links at foot of dis.com, category pages, etc, AND back to dis.com on about, contact, etc, etc pages */
.new-old-posts{
width:100%;
height:50px;
color:#333;
margin:50px 0 0 0;
padding:0;
border:0;
}

.new-old-posts a:link, .new-old-post a:visited{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

.new-old-posts a:hover{
text-decoration:none;
background:transparent;
color:#999;
font-weight:normal;
}

.new-old-posts a:active{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
}

/* older/newer nav styles at bottom of main index page search etc */
.alignright {
float:right;
font-size:20px;
margin:0;
}

.alignleft {
float:left;
font-size:20px;
margin:0;
}

/* footer styles */
#footer{
width:700px;
background:#fff;
height:80px;
position:relative;
margin-top:0;
margin-right:auto;
margin-bottom:0;
margin-left:auto;
text-align:center;
border-top:dotted 1px #333;
padding:20px 0 0 0;
}

#footer p{
font-size:15px;
line-height:15px;
text-align:center;
color:#333;
margin:0 0 5px 0;
padding:0;
border:0;
}

#footer p a:link, #footer p a:visited{
text-decoration:none;
background:transparent;
color:#333;
font-weight:normal;
border:0;
}

#footer p a:hover{
text-decoration:none;
background:transparent;
color:#8c8c8c;
font-weight:normal;
}

#footer p a:active{
text-decoration:none;
background:transparent;
color:#8c8c8c;
font-weight:normal;
}

/* helps force footer to bottom page regardless of its length */
.clearfooter{
height:80px;
clear:both;
}

/* sundry legacy styles, used on posts from 2007 and earlier */
.article-hide{
display:none;
}

small{
line-height:9px; /* was .09ems in case this needs to be reset */
}