/**
Contents:
* Main Structure
* Generic styles
* Top of Page
* Page title
* In both content and sidebar
* Main content
* Sidebar
* Admin
* Font sizes
*/


/** MAIN STRUCTURE *******************************************/

/*
body
#wrapper-head
#container-head
#pagetitle
#wrapper-body
#container-body
#main
#extra
#wrapper-foot
#container-foot
#footer

Originally had just body and #container to do centering.
But we now have the relevant body styles on the #wrappers, and separate
#wrappers and #containers for each part of the page in case we want to,
say, add full-width background colours to the header and footer but not
the main part of the page.
*/
body {
margin: 0;
padding: 0;
color: #000;
background-color: #fff;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
/*background: url("images/columns.gif") center top repeat-y; */
}

#wrapper-head,
#wrapper-body,
#wrapper-foot {
text-align: center;
min-width: 960px;
margin: 0 10px;
}
#wrapper-head {
margin-top: 10px;
}
#wrapper-body {
margin-top: 4em;
}
#wrapper-foot {
margin-bottom: 10px;
}

#container-head,
#container-body,
#container-foot {
text-align: left;
width: 940px;
margin-left: auto;
margin-right: auto;
}


/* Three-column grid.
   5  230  20  230  30  230  5
      ------------      ---
*/

#main {
float: left;
width: 580px;
margin: 2em 20px 0 60px;
display: inline; /* Win IE double float margin bug */
}
body.full #main {
/* No sidebar */
width: 880px;
}

#extra {
float: left;
width: 280px;
margin: 2.2em 0 0 0;
}

#footer {
clear: both;
width: 880px;
margin-left: 60px;
padding-top: 3em;
color: #666;
}


/** GENERIC STYLES *******************************************/

#heading h1,
h2,
h3,
h4 {
margin: 0;
padding: 0;
line-height: 1.1em;
}

p {
margin: 0 0 1em 0;
}
a {
text-decoration: underline;
}
a:link {
color: #00e;
}
a:visited {
color: #551a8b;
}
a:hover {
background: #ff6;
}
a.nohover:hover {
background: none;
}
a img {
border: none;
}
em, cite, i { 
    font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, Tahoma, sans-serif; 
}
form {
margin: 0;
padding: 0;
}
input.text,
textarea {
border: 1px solid #999;
}

.hide {
display: none;
}

.right {
text-align: right;
}

th {
font-weight: bold;
text-align: left;
vertical-align: top;
}

div.clear {
clear: both;
height: 1px;
line-height: 0;
font-size: 0;
}

acronym,
abbr { 
border-bottom: 1px dotted #000; 
cursor: help; 
}

code,
kbd,
var{
font-family: monospace; 
font-style: normal; 
}

div.hr {display: none}
/*/*/a{}
div.hr {
clear: both;
display: block;
margin: 1em 0 0.8em 0;
border-top: 1px solid #999;
}
hr {display:none}
/* */


/** TOP OF PAGE *******************************************/

#pagetitle {
float: left;
position: relative;
width: 940px;
margin: 0.5em 0 0 0;
line-height: 1.231em; /* If the font-size is 13px, this is 16px. */
}
#searchbox {
width: 280px;
margin: 0;
padding: 0;
float: right;
}

#pagetitle h1,
#pagetitle #sitetitle {
display: block;
width: 580px;
margin: 0 0 0.5em 0;
padding: 0 0 0 60px;
}
#sitetitle a:link,
#sitetitle a:visited {
color: #000;
text-decoration: none;
}
#sitetitle a:hover {
text-decoration: underline;
}


/* Main navigation */

#skiplink {
display: none;
}

#mainnav {
width: 580px;
margin: 0 20px 0 60px;
padding: 0;
float: left;
color: #666;
display: inline; /* Win IE double float margin bug */
}
#mainnav li {
list-style-type: none;
float: left;
margin: 0 20px 0 0;
padding: 0;
}
#mainnav li.split-before {
background: url("http://www.gyford.com/phil/style/default/images/bullet.gif") left 50% no-repeat;
padding-left: 20px;
}
#mainnav li.on {
color: #000;
font-weight: bold;
}


#pagetitle h1,
span#sitetitle {
display: block;
float: left;
font-weight: bold;
}
span#searchlink {
display: block;
text-align: right;
}

#searchbox p {
margin: 0;
}
#searchbox input.text {
width: 200px;
float: left;
}
#searchbox input.submit {
color: #666;
float: right;
width: 60px;
}


/** PAGE TITLE *******************************************/

#heading {
clear: left;
width: 880px;
margin-left: 60px;
}


/** IN BOTH CONTENT AND SIDEBAR ***************************/

/* Master Archive Index */
#main ul.years,
#main ul.years li {
margin-left: 0;
}
#main ul.years li,
#extra ul.years li {
margin-bottom: 1em;
font-weight: bold;
list-style-type: none;
}
#main ul.months,
#extra ul.months {
margin: 0;
padding: 0;
}
#main ul.months li,
#extra ul.months li {
display: inline;
list-style-type: none;
margin: 0;
font-weight: normal;
white-space: nowrap;
}


/** MAIN CONTENT *******************************************/

#main h2 {
margin: 2em 0 1em 0;
}
#main h3 {
margin: 1.5em 0 0.67em 0;
clear: both;
}
#main h4 {
margin: 1em 0 0 0;
}

#main h2:first-child,
#main h3:first-child,
#main h4:first-child {
margin-top: 0;
}

#main div.intro {
font-weight: bold;
}
#main dl.entries div.intro,
#main dl.entries div.comment {
margin-top: 1em;
}
#main p {
line-height: 1.462em; /* If the font-size is 13px, this is 19px. */
margin-bottom: 1.462em;
}
#main h4 {
line-height: 1.462em; /* If the font-size is 13px, this is 19px. */
}
#main iframe {
margin-bottom:1.462em;
}
#main blockquote {
margin: 0 0 13px 60px;
width: 520px;
}
#main li blockquote {
width: 460px;
}
#main blockquote blockquote {
width: 460px;
}
#main li .comment blockquote {
width: 395px;
}
#main pre {
width: 568px;
overflow: auto;
border: 1px solid #ccc;
padding: 0.2em 5px;
}
#main li .comment pre {
width: 443px;
}
#main blockquote pre {
width: 508px;
}

body.full #main pre {
width: 930px;
}
#main ul,
#main ol {
margin: 0 0 1.462em 0;
padding: 0;
}
#main ul {
list-style-type: disc;
}

#main table.data {
width: 100%;
margin-bottom: 1.462em;
}
#main table.data caption,
#main table.data th,
#main table.data td {
line-height: 1.462em; /* If the font-size is 13px, this is 19px. */
}
#main table.data .num {
text-align: right;
}

/* For writing categories list. */
#main ul ul,
#main ol ul,
#main ul ol,
#main ol ol {
margin-bottom: 0;
}
#main li,
#main dt,
#main dd {
margin: 0 0 0 60px;
padding: 0;
}
#main li {
line-height: 1.462em; /* If the font-size is 13px, this is 19px. */
}
#main ol li {
margin-left: 60px;
}
#main dt {
font-weight: bold;
line-height: 1.462em; /* If the font-size is 13px, this is 19px. */
}
#main dd {
margin-bottom: 1.462em;
line-height: 1.462em; /* If the font-size is 13px, this is 19px. */
}

#main div.intro dl.links {
margin-top: 0;
font-weight: normal;
}

#main p.illustration,
#main p.movie {
text-align: center;
}
#main p.illustration a:hover {
background: none;
}

#main img.illustration {
float: right;
margin: 0 0 0.5em 40px;
}
#main p.illustration span.caption {
display: block;
text-align: center;
}


#main ul.comments,
#main ul.comments li {
margin: 0;
padding: 0;
}
#main ul.comments li {
float: left;
list-style-type: none;
margin-bottom: 3em;
}
#main ul.comments li p.byline {
float: left;
width: 100px;
overflow: hidden;
margin: 0 0 0.5em 0;
}
#main ul.comments li p.byline strong,
#main ul.comments li p.byline small,
#main ul.comments li p.byline small a {
display: block;
}
#main ul.comments li p.byline small span {
display: none;
}
#main ul.comments li div.comment {
float: left;
width: 460px;
padding-left: 20px;
overflow: hidden;
}

#main ul.comments li div.comment {
}


/* Forms */
#main p.row {
margin-bottom: 0;
padding-top: 0.5em;
clear: left;
float: left;
}
#main p.row span.label {
float: left;
margin-right: 20px;
display: inline;
width: 160px;
}
#main form.slim-labels p.row span.label {
width: 100px;
}
#main p.row span.formfield {
float: left;
width: 400px;
}
#main p.row span.formfield input.text {
width: 280px;
}
#main p.row span.formfield textarea {
width: 390px;
}
#main p.textarea {
padding-top: 0.5em;
margin-bottom: 0;
clear: left;
}
#main p.textarea textarea {
width: 575px;
}
#main p#comments-open-challenge {
margin-bottom: 1.462em;
}

/* Lists of entry excerpts - MT Category, Date and Main Index Pages */
#main dl.entries {
margin: 0;
}
#main dl.entries dt,
#main dl.entries dd {
margin-left: 0;
}
#main dl.entries dt {
clear: left;
}
#main dl.entries dt a {
color: #000;
text-decoration: none;
}
#main dl.entries dt a:hover {
color: #fff;
}
#main dl.entries dd dt a:link {
color: #00e;
}
#main dl.entries dd dt a:visited {
color: #551a8b;
}

#main dl.entries dd {
margin-bottom: 2em;
}
#main dl.entries p {
display: inline;
margin-bottom: 0;
}
#main dl.entries div.intro p,
#main dl.entries div.more p,
#main dl.entries div.comment p {
display: block;
margin-bottom: 1em;
}
#main dl.entries blockquote {
margin-top: 0.5em;
}
#main dl.entries blockquote p {
display: block;
}
#main p.more {
display: inline;
margin-left: 0.4em;
font-weight: bold;
}
#main dl.entries p.entrydetails {
clear: both;
display: block;
color: #666;
line-height: 1.727em; /* 11/19px */
}
#main p.entrydetails a:link {
color: #6666f5;
}
#main p.entrydetails a:visited {
color: #9976b9;
}
#main p.entrydetails a:hover {
background: #ffffa3;
}


/* Links - Indvidual Entry Archive page */

#main dl.links dt,
#main dl.links dd {
margin-left: 0;
line-height: 1.462em; /* If the font-size is 13px, this is 19px. */
}


/* Category archive page */

#main div.subcategories {
margin-bottom: 2em;
}
#main div.subcategories h2 {
margin-top: 0;
margin-bottom: 0.5em;
}


/* Home page variations */

#main dl.entries dl.links {
margin-top: 0.5em;
}
#main dl.entries dl.links dt {
font-weight: normal;
}
#main dl.entries dl.links dt a {
text-decoration: underline;
}
#main dl.entries dl.links dd {
margin-bottom: 0.5em;
}

#main div.thumbnail > a:hover {
/* For the images in .thumbnail, but not the text which is in <p> tags. */
background-color: transparent;
}

/* .photos could be dd.photos on main site, or div.photos on home page. */
#main .photos div.thumbnail {
float: left;
margin: 0.5em 20px 0 0;
width: 100px;
text-align: center;
display: inline;/* Fix an annoying Win IE bug */
}
#main .photos div.thumbnail p {
text-align: center; 
line-height: 1em;
display: block;
}
#container-body #main .photos div.last {
margin-right: 0;
}
#main .photos div.more {
    margin-top: 20px;
}
/* Featured photos on the home and photos pages. */
#main .photos div.featured {
margin: 0.5em 0 0.5em 0;
float: left;
width: 100%;
}
#main .photos div.featured img {
float: left;
margin-right: 10px;
}
#main .col2 blockquote {
    width: auto;
    margin-left: 30px;
    margin-bottom: 0;
}

/* Structure on Homepage and /phil/work/ */
#main div.colrow div.col2 {
    padding-top: 0.6em;
    width: 280px;
    margin-right: 20px;
    float: left;
overflow: hidden;
}
#main div.colrow div.last {
    margin-right: 0;
}
#main div.col2 h4 {
line-height: 1.462em;
}
#main div.col2 h4.tight {
margin-top: 0;
}
#main div.col2 p.tight {
margin-bottom: 0;
}
#main div.col2 p.tight a:hover {
background: none;
}


/* Timeline */
table.timeline {
border-collapse: collapse;
}
table.timeline th,
table.timeline td {
border: 1px solid #ccc;
padding: 4px;
vertical-align: top;
line-height: 1.4em;
}
table.timeline th {
text-align: left;
font-weight: bold;
}
table.timeline td.tl-year {
vertical-align: middle;
}
table.timeline .tl-year,
table.timeline .tl-work,
table.timeline .tl-play {
background-color: #eee;
}
table.timeline .tl-place,
table.timeline .tl-ed,
table.timeline .tl-writing {
background-color: #f6f6f6;
}
#main table.timeline ul {
margin: 0 0 0 1.4em;
padding: 0;
}
#main table.timeline li {
margin: 0.3em 0 0 0;
padding: 0;
}

#main ul.reading-years {
list-style-type: none;
margin: 0 0 1em 0;
padding: 0;
}
#main ul.reading-years li {
margin: 0;
padding: 0;
display: inline;
}

/* NOTES */
#main span.note,
#main span.pp {
color: #666;
}

#main dl.publications dt,
#main dl.publications dd {
margin-left: 0;
}
#main dl.publications dt,
#main ul.publications li {
margin-bottom: 0.385em; /* 5px if font is 13px */
}


/** SIDEBAR *******************************************/

#extra .block {
margin: 0 0 2em 0;
float: left;
color: #666;
width: 277px; /* 3 pixels narrower than it should be to stop Win IE Duplicate Characters Bug */
overflow: hidden;
}
#extra .block a:link {
color: #6666f5;
}
#extra .block a:visited {
color: #9976b9;
}
#extra .block a:hover {
background: #ffffa3;
}
#extra .block a.nohover:hover {
background: none;
}

/* .highlight is in addition to .block */
#extra .highlight {
color: #000;
}
#extra .highlight a:link {
color: #00e;
}
#extra .highlight a:visited {
color: #551a8b;
}
#extra .highlight a:hover {
background: #ff6;
}


#extra h2 {
margin: 0 0 0.5em 0;
}
#extra h3 {
    font-weight: normal;
    margin: 0.7em 0 0.3em 0;
}
#extra p {
line-height: 1.455em; /* If font-size is 11px, this is 16px. */
}

/* .about is used for next/prev in weblog indiv.archive pages and for the About Me navigation. */
#extra .about {
margin: 0 0 2em 0;
float: left;
}
#extra .about p {
margin-bottom: 0.5em;
}
#extra p.nextprev {
float: left;
}
#extra p.nextprev .prev,
#extra p.nextprev .next {
display: block;
float: left;
width: 70px;
color: #666;
}
#extra p.nextprev .next {
text-align: right;
width: 67px;/* 3 pixels narrower than it should be to stop Win IE Duplicate Characters Bug */
}
#extra p.nextprev .index {
display: block;
float: left;
text-align: center;
width: 140px;
}

#extra p.nextprev .prev a,
#extra p.nextprev .next a {
text-decoration: none;
color: #000;
}
#extra p.nextprev .prev a:link span,
#extra p.nextprev .next a:link span,
#extra p.nextprev .prev a:link:hover,
#extra p.nextprev .next a:link:hover {
text-decoration: underline;
color: #00e;
}
#extra p.nextprev .prev a:visited span,
#extra p.nextprev .next a:visited span,
#extra p.nextprev .prev a:visited:hover,
#extra p.nextprev .next a:visited:hover {
text-decoration: underline;
color: #551a8b;
}


#extra dl,
#extra dt,
#extra dd {
margin: 0;
padding: 0;
}
#extra dt {
font-weight: normal;
line-height: 1.364em; /* If font-size is 11px, this is 15px. */
}
#extra dd {
margin-bottom: 0.5em;
line-height: 1.364em; /* If font-size is 11px, this is 15px. */
}

#extra ol,
#extra ul,
#extra li {
margin: 0;
padding: 0;
}
#extra ul {
list-style-type: disc;
}
#extra li {
line-height: 1.364em; /* If font-size is 11px, this is 15px. */
margin: 0 0 0.2em 1.4em;
}
#extra ul.years li {
list-style-type: none;
margin-left: 0;
}
#extra ul li ul {
margin-top: 0.2em;
}
#extra ul li ul li {
margin-left: 1.4em;
}
#extra ol li {
margin-left: 2.4em;
}

#extra ul.rss,
#footer ul.rss {
list-style-type: none;
}
#extra ul.rss li,
#footer ul.rss li {
padding-left: 17px;
margin-left: 0;
background: url("http://www.gyford.com/phil/style/default/images/feed-icon-12x12.gif") 0em 0.2em no-repeat;
}

div.row {
clear: both;
}
#extra div.thumbnail {
width: 102px;
float: left;
margin: 0 35px 0 19px;
text-align: center;
display: inline; /* Fix Win IE margin float problem. */
}
#extra div.thumbnail a img {
opacity: .5;
filter: alpha(opacity=50);
}
#extra div.thumbnail a:hover img {
opacity: 1;
filter: none;
}

#extra div.thumbnail > a:hover {
/* For the images in .thumbnail, but not the text which is in <p> tags. */
background-color: transparent;
}

#extra div.last {
margin-right: 19px;
}

#extra ul.reading-years {
list-style-type: none;
margin-bottom: 0.5em;
float: left;
}
#extra ul.reading-years li {
float: left;
margin-right: 0.5em;
margin-left: 0;
}

/* On home page */
/* Daily pages */
#extra ul.statuses {
list-style-type: none;
}
#extra ul.statuses li {
margin-left: 10px;
}

#extra #dopplr-blog-badge-for-philgyford {
max-width: 277px ! important;
}
#extra #dopplr-blog-badge-for-philgyford p {
margin-bottom: 0.5em;
color: #666 ! important;
font-family: "Lucida Grande", "Trebuchet MS", Arial, Helvetica, sans-serif ! important;
}
#extra #dopplr-blog-badge-for-philgyford li,
#extra #dopplr-blog-badge-for-philgyford li .tripmonth {
color: #666 !important;
font-family: "Lucida Grande", "Trebuchet MS", Arial, Helvetica, sans-serif ! important;
}
#extra .dopplr-badge {
clear: both !important;
background: none ! important;
border: none ! important;
margin-bottom: 2em !important;
padding: 0px !important;
}
#extra .dopplr-badge a {
color: #6666f5 !important;
text-decoration: underline;
}
#extra .dopplr-badge a:visited {
color: #9976b9;
}
#extra .dopplr-badge a:hover {
text-decoration: none;
background: #ffffa3;
}
#extra #dopplr-logo {
display: none;
}
#extra .dopplr-badge .trips,
#extra .dopplr-badge .trips .tripmonth {
font-size: 1em ! important;
color: #000 ! important;
}
#extra .dopplr-badge ul {
margin-bottom: 0.5em;
}

#map-canvas {
width: 578px;
border: 1px solid #ccc;
height: 357px;
margin-bottom: 2em;
}
.infowindow p {
line-height: 1.364em ! important; /* If font-size is 11px, this is 15px. */
margin-bottom: 1.364em ! important;
}
.infowindow p.photo {
float: left;
margin-right: 10px;
height: 100px;
}
.infowindow p.photo a:hover {
background: none;
}
.infowindow p.status {
clear: left;
}
.infowindow p.last {
margin-bottom: 0 ! important;
}

/** FOOTER *******************************************/

#footer .col3 {
    float: left;
    width: 280px;
    margin: 0 20px 1em 0;
}
#footer .last {
    margin-right: 0;
}
#footer h2 {
    margin-bottom: 0.2em;
    line-height:1.364em;
}
#footer p {
    line-height:1.364em;
}
#footer ul,
#footer li {
    margin: 0;
    padding: 0;
    line-height:1.364em;
}
#footer li {
    margin-bottom: 0.3em;
}
#footer .spaced li {
    margin-bottom: 1em;
}
#footer li.split {
    margin-bottom: 1em;
}


/** ADMIN *******************************************/

#main p.row span.formfield input.date {
width: 7em;
}
#main p.row span.formfield input.isbn {
width: 8em;
}
#main input.name-title {
width: 2em;
}
#main input.name-middle {
width: 5em;
}
#main input.name-suffix {
width: 2em;
}
#main input.name-role {
width: 5em;
}

/** FONT SIZES *******************************************/

/* Assuming 16px base font size. */

#pagetitle h1,
#pagetitle #sitetitle,
#heading h1,
#main h2 {
font-size: 1.25em; /* 20px */
}

#main h3,
#main dl.entries dt,
#main div.subcategories h2 {
font-size: 1em; /* 16px */
}


ul#mainnav li,
#main h4,
#main p,
#main li,
#main dt,
#main dd,
#main dl.entries dd dd,
#main th,
#main td,
#extra h2,
#main dl.links dt,
#main dl.links dd,
#main dl.entries dd p,
#main dl.entries dd li {
font-size: 0.8125em; /* 13px */
}


#extra h3,
#extra p,
#extra li,
#extra dt,
#extra dd,
#searchbox input.submit,
#footer p,
#footer li,
#footer h2,
#main p.entrydetails,
#main dl.entries dd p.entrydetails,
#searchlink,
#map-canvas .infowindow p {
font-size: 0.6875em; /* 11px */
}

#main table.timeline th,
#main table.timeline td {
font-size: 0.625em; /* 10px */
/*font-size: 0.563em; */ /* 9px */
}

/* Adjustments */
#main li p,
#main dl.entries dd li p,
#main dl dd p {
font-size: 1em;
}

#main li small,
#main p small,
#main p.illustration span.caption {
font-size: 0.846em; /* 11px if p is 13px */
}


#main td li,
#main dl.entries dd,
#main dl dl dt,
#main dl dl dd,
#main dl li,
#main li li,
#extra li li,
#extra li p {
font-size: 1em;
}

