body { margin: 0px; padding: 0px; background-color: #ffe; background-image: url('/gravity/graphics/canvas_512px.jpg'); background-position: fixed; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
.admin a { margin-left: 10px; display: inline-block; }
#alerts { 
 font-family: sans-serif; font-weight: bold; font-size: 12px; color: #999; 
 }
#alerts a { 
 display: inline-block; font-weight: normal; font-size: 10px; background: #999; border-radius: 4px; color: #ffc; padding-left: 4px; padding-right: 4px; margin-left: 3px; margin-right: 3px;
 }
#alerts a.utility { 
 opacity: 0.5; background: transparent;
 }
header#pagehead {
 background: url('/gravity/graphics/sky_01.jpg') 67% 53% repeat-x; 
 box-shadow: 0px 5px 10px #888888;
 }
header#pagehead div {
 position: relative;
 width: 100%; max-width: 980px; margin: auto;
 height: 130px;
 }
header#pagehead div h1 { 
 margin: 0px;
 font-family: trebuchet ms,helvetica,sans-serif; font-size: 36px; font-weight: bold; 
 position: absolute;
 bottom: 50px; left: 20px; width: 400px; overflow: hidden;
 text-align: right;
 text-shadow: 2px 2px 2px #000;
 }
header#pagehead div h2 { 
 margin: 0px; 
 font-family: georgia,serif; font-size: 18px; font-weight: normal;
 position: absolute;
 bottom: 35px; left: 20px; width: 400px; overflow: hidden;
 text-align: right;
 text-shadow: 2px 2px 2px #000;
 }
header#pagehead div h2 img {
 height: 20px; width: 20px; vertical-align: bottom;
 }
article header {
 padding-top: 20px;
 width: 100%; max-width: 980px; margin: auto;
 height: 140px;
 line-height: 20px;
 }
article header img {
 align: left; border: 6px solid white; border-radius: 10px; margin-right: 20px;
 width: 100px; height: 100px;
 }
article header h2 {
 font-size: 27px; font-family: trebuchet ms; font-weight: normal; line-height: 27px; margin: 0px;
 }
article header h1 {
 font-size: 54px; font-family: trebuchet ms; font-weight: normal; line-height: 54px; margin: 0px;
 }
article header h1 .categories {
 font-size: 30px; font-family: trebuchet ms; font-weight: normal; line-height: 20px;
 }
section#content_body {
 padding: 10px;
 border-radius: 10px; box-shadow: 0px -5px 15px #888888;
 background-color: white;
 width: 100%; max-width: 980px; margin: auto;
 }
 
section#content_body h1 {
 display: none;
 }
 
section#content_body ul {
 list-style: none; margin: 0px; padding: 0px;
 }
 
section#content_body ul li {
 list-style: none; margin: 20px; float: left;
 display: inline-block;
 }
 
nav#links {
 position: absolute; bottom: 0px; right: 40px;
 }
nav#links a {
 display: inline-block; background: rgba(0,0,0,.4); color: white;
 font-family: 'trebuchet ms'; font-size: 20px; font-weight: bold; text-decoration: none;
 padding-left: 4px; padding-right: 4px;
 }
 
#corner_box {
 display: block; position: absolute; top: 2px; right: 2px; width: 300px;
 font-size: 12px; font-family: trebuchet ms,sans-serif;
 text-align: right; z-index: 2000;
 }
#corner_box a { color: blue; border: thin solid #9797c0; padding: 2px; background: #ccf; }
#pagehead #search_box {
 width: 400px; position: absolute; bottom: 52px; left: 440px;
 }
#search_box input[type=text] { 
 width: 75%; max-width: 300px; height: 30px; font-size: 16px; margin-right: 0px; padding-left: 10px; -webkit-appearance: none; vertical-align: top; border: none;
 }
#search_button { 
 width: 30px; font-size: 20px; margin-left: -35px; height: 30px; -webkit-appearance: none; border: none; background: transparent; color: black; font-family: verdana,helvetica,arial;
 }
 
#debug_info { display: none; }
#address_block { display: none; }
.post_content {
 font-size: 18px; font-family: georgia,serif; line-height: 24px;
 }
 
.copyright_notice { 
 font-size: 12px; line-height: 18px; font-family: trebuchet ms,helvetica,sans-serif; float: right; color: #ccc;
 }
 .copyright_notice a { 
 color: #ccf;
 }
div.admin { background: #ffd; border: 1px solid white; }
#footer,#footer p {
 font-weight: normal; font-size: 14px; color: #330; font-family: 'trebuchet ms',sans-serif;
 }
.sunburst { width: 60px; height: 60px; vertical-align: bottom; }
.morelinks { float: right; margin-top: 28px; padding: 2px; color: gray; }
.links_box { margin-top: 20px; font: 14px sans-serif; line-height: 13px;}
#filters_box { float: right; width: 200px; }
 
@media (-webkit-device-pixel-ratio > 1)
{
 header#pagehead {
 background: url('/gravity/graphics/sky_01_@2X.jpg') center center repeat-x; 
 }
}
@media screen and (max-width: 640px)
{
 header#pagehead div {
 position: relative;
 width: 100%; max-width: 480px; margin: auto;
 height: 60px;
 }
 
 section#content_body {
 padding: 0px;
 }
 
 
 header#pagehead {
 box-shadow: 0px 2px 5px #888888;
 }
 
 header#pagehead div h1 { 
 font-size: 24px;
 bottom: 35px; left: 4px; width: auto;
 text-shadow: 2px 2px 2px #000;
 text-align: left;
 }
 
 header#pagehead div h2 { 
 font-size: 16px;
 bottom: 20px; left: 4px; width: auto;
 text-align: left;
 text-shadow: 1px 1px 1px #000;
 }
 header#pagehead div h2 img {
 height: 12px; width: 12px;
 }
 
 article header {
 padding-top: 10px;
 height: 70px;
 line-height: 14px;
 }
 
 article header img {
 border: 3px; margin-right: 10px; width: 50px; height: 50px;
 }
 
 article header h2 {
 font-size: 18px; line-height: 18px;
 }
 
 article header h1 {
 font-size: 24px; line-height: 24px;
 }
 
 article header h1 .categories {
 font-size: 18px; line-height: 16px;
 }
 nav#links {
 position: absolute; bottom: 0px; right: 0px;
 }
 
 nav#links a {
 font-size: 12px;
 padding-left: 2px; padding-right: 2px;
 }
 div.nomobile { display: none; }
 
 #pagehead #search_box {
 display: none;
 }
}