body {font: 1em/1.6em liberationmono;width:1000px;margin:50px auto;color:#444;}
a {color:#55f;}
#content a:hover {background:#eee;padding:3px 0px;color:#00d;}
#header a:hover {background:#eee;padding:3px 0px;color:#00d;}
li {margin-bottom:8px;}
code, pre {line-height:1.3em;}
pre {border:1px dotted #333;padding:10px;}
blockquote {background:#f5f5f5;padding:1px 15px;font-style:italic;}

#header {text-align:center;display:table;margin:0px auto;}
#header h4 {font-size:30px;margin:0px;letter-spacing:0.1em;font-family:Baskerville,Garamond,Georgia;text-shadow:0px 0px 0px gray;}
#header h4 a {text-decoration:none;color:#000;}
#header h5 {font-family:"Lucida Grande","Lucida Sans Unicode","Trebuchet MS";color:#777;font-style:italic;letter-spacing:0.1em;}

ul#nav {list-style:none;border-top:1px dotted #555;padding-top:10px;height:35px;}
ul#nav li {float:left;margin:-5px 10px;}
ul#nav li a {display:block;padding:7px;text-decoration:none;font: 1.0em/1.5em "Lucida Grande","Lucida Sans Unicode","Trebuchet MS";color:#777;text-shadow:1px 1px 1px #bbb;}
ul#nav li#active {background:#eee;}
ul#nav li#active a, ul#nav a:hover {color:#5e5e5e;padding:7px;text-shadow:1px 1px 1px #444;}

#content {margin:auto;width:700px;}
#content h1 {text #aaa;}
#content h2 {margin-bottom:-5px;text#bbb;}
#content h3 {margin-bottom:-7px;text #ccc;}
#content h4 {margin-bottom:-12px; #ddd;}
#content img {border:2px solid #aaa;border-top:none;border-left:none;}

#footer {border-top: 1px dotted #333;font-size:0.7em;color:#777;margin:40px;letter-spacing:0.04em;}
#footer p {text-align:center;}
#footer p a {color:#aaf;}

fieldset#contact-form {margin:20px 0px 20px 40px;background:#eee;padding:10px;color:#000;width:400px;}
fieldset#contact-form label {font-size:14px;}
fieldset#contact-form input {height:20px;font-size:16px;margin-bottom:15px;}
fieldset#contact-form textarea {font-size:16px;margin-bottom:15px;width:380px;}
fieldset#contact-form #contact-button {font-size:15px;height:30px;margin-left:30px;}

@media (max-width: 800px) {

body {
    width: 100%;
}
    #content {
        width: 95%;
padding: 0 .5em;
    }
 a.nav-toggle:hover {background: #000 url(https://images.staticjw.com/jim/9159/hamburger.png) no-repeat 50% 44%; border:0;
    padding: 0;}
    embed,
    object {
        max-width: 100%;
    }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
    body {
        padding: 0;
    }
.fancybox-nav span {
    visibility: visible;
}
}
/* Added by Jim, 8 may 2015 */
@media (max-width: 992px) {
   body{font-size: 130%;padding:0;}
   blockquote{margin:0;}
   ul,ol {margin-left:30px;}
   .widget-area,.widget-area h4, .widget-area ul a {font-size:18px;}
   ul li, ol li {margin-bottom:20px !important;}
   .widget-area h4 {margin-top:30px;}
}