/*
--------------------------------------------------------
Kirkbride Buildings Default Stylesheet
Author: Ethan McElroy
--------------------------------------------------------*/
html * {
  margin: 0;
  padding: 0;
  }
body {
  background: #020100 url(../i/style/bg.jpg) no-repeat center fixed;
  color: #402010;
  font: 79% arial, sans-serif;
  text-align: center;
  }
dt, dd, li, p {
  font-size: .9em;
  }
fieldset {
  border: solid 1px #fff;
  }
form p {
  margin-bottom: 0;
  }
h1 {
  background: url(../i/style/title.png) no-repeat center 3px;
  margin: 0 auto;
  text-indent: -200000px;
  width: 660px;
  }
h2 {
  color: #604020;
  font-family: georgia, times, 'times new roman', serif;
  font-size: 1.5em;
  font-weight: normal;
  line-height: 160%;
  padding: 10px 6px;
  text-align: center;
  }
h3 {
  background: url(../i/style/hbullet.png) no-repeat 0 2px;
  color: #604020;
  font-family: georgia, times, 'times new roman', serif;
  font-size: 1.1em;
  font-weight: normal;
  line-height: 160%;
  padding-left: 22px;
  }
p.note {
  font-style: italic;
  }
  
/* LINKS
----------------------------------------------*/
a:link {
  color: #904020;
  }
a:visited {
  color: #604020;
  }
a:hover {
  color: #905030;
  }
a:active {
  color: #604020;
  }

/* CENTER PAGE
----------------------------------------------*/
#container {
  background: #fff url(../i/style/middle.png) repeat-y;
  height: 600px;
  margin: 12px auto;
  min-height: 600px;
  width: 760px;
  text-align: left;
  }
body[class] #container {
  height: auto;
  }

/* PAGE HEADER
----------------------------------------------*/
#header {
  background: #fff url(../i/style/top.png) no-repeat;
  border-top: solid 12px #fff;
  height: 30px;
  margin-top: 0;
  padding-top: 10px;
  position: relative;
  }
#header-social {
  position: absolute;
  right: 40px;
  top: 15px;
  width: 45;
  }

/* MAIN NAVIGATION
----------------------------------------------*/
#nav {
  background: url(../i/style/middle.png) repeat-y;
  height: 30px;
  width: 760px;
  }
#nav ul {
  background: url(../i/style/nav/nbg.gif) repeat-x;
  height: 30px;
  list-style: none;
  margin: 0 auto;
  overflow: hidden;
  padding: 3px 0 0 0;
  width: 680px
  }
#nav li {
  display: inline; /* required for IE */
  font-size: 1em;
  list-style: none;
  }
#nav li a {
  float: left;
  overflow: hidden;
  margin-right: 12px;
  padding: 20px 0 0 0;
  position: relative;
  height: 0 !important;
  height /**/:20px; /* for IE5/Win only */
  }
#nav li a#home {
  background: url('../i/style/nav/home.png') no-repeat;
  margin-left: 13px;
  width: 60px;
   }
#nav li a#about {
  background: url('../i/style/nav/about.png') no-repeat;
  width: 67px;
   }
#nav li a#buildings {
  background: url('../i/style/nav/buildings.png') no-repeat;
  width: 94px;
   }
#nav li a#contact {
  background: url('../i/style/nav/contact.png') no-repeat;
  width: 86px;
   }
#nav li a#forum {
  background: url('../i/style/nav/forum.png') no-repeat;
  width: 70px;
   }
#nav li a#blog {
  background: url('../i/style/nav/blog.png') no-repeat;
  width: 54px;
   }
#nav li a#search {
  background: url('../i/style/nav/search.png') no-repeat;
  width: 76px;
   }
#nav li a#links {
  background: url('../i/style/nav/links.png') no-repeat;
  width: 62px;
   }
#nav li a:link {
   background-position: left top !important;
   }
#nav li a:visited {
   background-position: left top !important;
   }
#nav li a:hover {
   background-position: left -15px !important;
   }
#nav li a:active {
   background-position: left top !important;
   }

/* BREADCRUMB NAVIGATION
----------------------------------------------*/
p#breadcrumb {
  margin: 0 0 0 39px;
  padding: 0;
  }
p#breadcrumb a {
  text-decoration: none;
  }
   
/* SLIDESHOW AND BANNER IMAGES
----------------------------------------------*/
#flash {
  margin: 0 auto;
  width: 680px;
  }
#slides {
  border-bottom: solid 1px #997;
  clear: both;
  height: 345px;
  position: relative;
  width: 680px;
  }
  #slides div {
    height: 345px;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 5;
    width: 680px;
    }
#plan {
  background: url(../i/improvedplan.jpg) no-repeat;
  border-top: solid 1px #997;
  border-bottom: solid 1px #997;
  height: 165px;
  margin-top: 8px;
  width: 340px;
  }

/* MAIN CONTENT
----------------------------------------------*/
#main {
  height: auto;
  margin: 0 auto;
  min-height: 560px;
  padding-bottom: 20px;
  width: 680px;
  }
#main dt {
  line-height: 140%;
  margin-top: 8px;
  }
#main dd {
  line-height: 140%;
  margin-bottom: 12px;
  }
#main dl {
  margin: 10px 0 20px;
  }
#main p {
  line-height: 160%;
  margin: 0 0 20px 0;
  text-align: justify;
  }
#main p img {
  border: double 3px #604020;
  float: left;
  margin: 5px 8px 0 0;
  }
#main ul {
  margin: 10px 0 20px 0;
  }
#main li {
  background: url(../i/style/bullet.png) no-repeat;
  height: 20px;
  line-height: 150%;
  list-style: none;
  padding: 0 0 0 18px;
  }
#main #description {
  line-height: 130%;
  margin: -20px auto 8px auto !important;
  text-align: center !important;
  width: 600px !important;
  }
#main #controls {
  line-height: 200%;
  margin: 0 !important;
  text-align: center !important;
  width: 100% !important;
  }
#main #send {
  background: url(../i/send.png) no-repeat;
  border: none;
  height: 26px;
  overflow: hidden;
  padding-top: 50px;
  width: 100px;
  }
#main #title {
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
  }
#main #hphoto {
  margin: 25px 130px 0 130px;
  }
#main #vphoto {
  margin: 25px 192px 0 192px;
  }
body[class] #main #gallery {
  height: auto;
  }
#main #gallery img {
  border: solid 1px #ccc;
  margin: 0 0 5px 3px;
  }
#main #end {
  background: url(../i/style/end.png) center top no-repeat;
  clear: both;
  height: 22px;
  margin: 18px auto;
  width: 100px;
  }
#portraits {
  height: 200px;
  margin: 0 auto;
  width: 568px;
  }
#portraits h3 {
  background: #fff;
  margin: 8px auto;
  padding: 0;
  text-align: center;
  }
#portraits img {
  border: double 3px #604020;
  }
body#glossary #main dt {
  font-weight: bold;
  text-transform: uppercase;
  }
body#bibliography #amazon {
  background: #cca;
  border: dotted 1px #997;
  float: right;
  height: 726px;
  margin: 0 2px auto 0;
  padding: 0 0 0 8px;
  width: 148px;
  }
body#bibliography #amazon img {
  border: none;
  margin-bottom: 8px;
  }
body#bibliography #main #amazon p.title {
  font-weight: bold;
  margin: 3px 0 5px 0 !important;
  padding: 0;
  text-align: center;
  width: 148px;
  }
body#bibliography #main #references {
  float: left;
  margin: 0;
  width: 480px;
  }
body#bibliography #main #references p {
  margin-top: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  width: 480px !important;
  }

/* LEFT COLUMN CONTENT
----------------------------------------------*/
#leftCol {
  background: #fff;
  float: left;
  height: auto;
  min-height: 375px;
  padding: 0 0 12px 0;
  width: 340px;
  }
#leftCol img {
  border: double 3px #554;
  float: left;
  margin: 3px 6px 0 0;
  }
#leftCol h2 {
  margin: 16px 0 18px 0 !important;
  padding: 0;
  }
#leftCol h2, #leftCol h3 {
  line-height: 135%;
  }
#leftCol h2#dr-kirkbride {
  background: url(../i/headings/drkirkbride.png) no-repeat center top;
  text-indent: -20000px;
  }
#leftCol h2#blogposts {
  background: url(../i/headings/blogposts.png) no-repeat center top;
  text-indent: -20000px;
  }
#leftCol h2#forumtopics {
  background: url(../i/headings/forumtopics.png) no-repeat center top;
  text-indent: -20000px;
  }
#leftCol h2#updates {
  background: url(../i/headings/updates.png) no-repeat center top;
  text-indent: -20000px;
  }
#leftCol p, #rightCol p {
  line-height: 150%;
  margin: 4px 12px 12px 0;
  }
span.dropcap {
  background: #cca;
  border: double 3px #604020;
  color: #402010;
  float: left;
  font-family: georgia, palatino, serif;
  font-size: 2.8em;
  margin: 6px 6px 0 0;
  padding: 15px 2px 14px 4px;
  text-align: center;
  width: 1em;
  }
#leftCol dl {
  margin-top: 12px;
  }
#leftCol dd {
  margin: 2px 0 12px 0;
  line-height: 150%;
  }
#leftCol ul {
  margin: 0 0 20px 0;
  }
#more {
  height: auto;
  margin: 4px 12px 12px 0;
  min-height: 140px;
  }
#more dl {
  margin: 0 6px 0 6px;
  }
#more dt {
  font-weight: bold;
  }
#more h3 {
  background: #fff;
  border-top: dotted 1px #997;
  margin: 5px 0 0 0;
  padding: 10px 0 0 0;
  text-align: center;
  }
#more li {
  clear: both;
  height: auto;
  line-height: 120%;
  margin: 6px 0;
  }
#more p {
  margin: 6px;
  }
#share {
  background: #fff;
  border-top: dotted 1px #997;
  margin: 2px auto 0;
  padding: 10px 0;
  text-align: center;
  width: 330px;
  }
#share h3 {
  background: #fff;
  margin: 0 0 4px 0;
  padding: 0;
  text-align: center;
  }

/* RIGHT COLUMN CONTENT
----------------------------------------------*/
#rightCol {
  background: #fff;
  clear: right;
  float: left;
  height: auto;
  position: relative;
  width: 340px;
  }
#gallery {
  height: auto;
  margin: 3px 0 0 4px;
  width: 340px;
  }
#gallery a {
  display: inline;
  height: 75px;
  margin: 0;
  padding: 0;
  width: 100px;
  }
#gallery img {
  border: double 3px #fff !important;
  float: left;
  height: 75px;
  margin: 0 2px 3px 0;
  position: relative;
  width: 100px;
  }
#gallery img:hover {
  border: double 3px #997 !important;
  }
#historical-gallery {
  margin-top: 6px;
  }
#historical-gallery div {
  margin-bottom: 8px;
  }
#evenmore h3 {
  background: #fff;
  border-top: dotted 1px #997;
  clear: both;
  margin: 2px 0 0 0;
  padding: 4px 0 0 0;
  text-align: center;
  }
#evenmore a {
  display: block;
  color: #402010;
  height: auto;
  text-decoration: none;
  }
#evenmore a img {
  border: none;
  float: left;
  margin-bottom: 6px;
  }
#evenmore em {
  color: #904020;
  text-decoration: underline;
  }
#evenmore p {
  clear: both;
  }
#building-photos {
  clear: right;
  float: left;
  height: auto;
  }
#building-photos a {
  color: #663300;
  display: block;
  font-size: .9em;
  height: 72px;
  padding: 3px 0 8px 108px;
  text-decoration: none;
  width: 191px;
  }
#building-photos ul {
  height: auto;
  list-style: none;
  margin: 0 0 12px 0;
  width: 340px;
  }
#building-photos li {
  background: url(../i/style/ornament.gif) no-repeat right 2px;
  border-bottom: solid 1px #997;
  color: #cca;
  height: 78px;
  line-height: 110%;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 340px;
  }
#building-photos li:hover {
  background-color: #eec;
  }
#building-photos li strong {
  color: #604020;
  }
#building-photos a#athens {
  background-image: url(../i/buildings/athens.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#buffalo {
  background-image: url(../i/buildings/buffalo.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#cherokee {
  background-image: url(../i/buildings/cherokee.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#clarinda {
  background-image: url(../i/buildings/clarinda.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#danvers {
  background-image: url(../i/buildings/danvers.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#dixmont {
  background-image: url(../i/buildings/dixmont.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#fergusfalls {
  background-image: url(../i/buildings/fergusfalls.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#greystone {
  background-image: url(../i/buildings/greystone.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#hudson {
  background-image: url(../i/buildings/hudson.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#independence {
  background-image: url(../i/buildings/independence.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#northampton {
  background-image: url(../i/buildings/northampton.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#saint-elizabeths {
  background-image: url(../i/buildings/saint-elizabeths.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#taunton {
  background-image: url(../i/buildings/taunton.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#traversecity {
  background-image: url(../i/buildings/traversecity.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#weston {
  background-image: url(../i/buildings/weston.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#worcester {
  background-image: url(../i/buildings/worcester.jpg);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }
#building-photos a#prints {
  background-image: url(../i/buildings/prints.png);
  background-repeat: no-repeat;
  background-position: 0 4px;
  }

/* PAGE FOOTER
----------------------------------------------*/
#footer {
  background: #fff url(../i/style/bottom.png) no-repeat;
  clear: both;
  height: 20px;
  min-height: 20px;
  margin: 0;
  padding: 30px 0 0 0;
  }
body[class] #footer {
  height: auto;
  }
#footer p {
  font-size: .8em;
  height: auto;
  margin: 3px 41px 0 auto;
  min-height: 18px;
  padding: 0;
  text-align: right;
  }
#footer span {
  display: block;
  float: right;
  }
#footer span#social {
  margin-top: -3px;
  margin-left: 3px;
  }
#footer a.facebook, #footer a.twitter {
  height: 18px;
  text-decoration: none;
  width: 18px;
  }

@media screen and (max-width: 720px) {
  body { background: #fff; font-size: 100%; line-height: 1.5; }
  #container { padding: 0 2%; width: 92%; }
  #container, #header, #footer { background: #fff; margin: 0; padding: 0; width: 100%; }
  #header { border: none; height: auto; }
  #container { padding: 0 5%; width: 90%; }
  h1, h2, h3, h4, h5 { text-align: left; width: 100%; }
  h1 { background-position: -5px center; background-size: contain; margin: 0; padding: 0; width: 90%; }
  h2 { line-height: 120%; margin-left: 0; padding-left: 0; }
  #flash, #slides { border-bottom: none; height: auto; width: 100%; }
  #slides div { background-size: 100% !important; height: auto; min-height: 100%; width: 100%; }
  #main, #building-photos ul, #building-photos li { width: 100%; }
  #main li { height: auto; }
  #main p { text-align: left; }
  body#bibliography #amazon { float: none; height: auto; margin: 0; padding: 0; width: 100%; }
  body#bibliography #main #amazon p.title { width: 100%; }
  body#bibliography #main #references { float: none; width: 100%; }
  body#bibliography #main #references p { width: 100% !important; }
  #leftCol, #rightCol { clear: both; float: none; width: 100%; }
  #building-photos { border-top: solid 1px #997; }
  #building-photos li { background: transparent; height: auto; line-height: 130%; }
  #building-photos a { background-position: 0 .85em !important; height: auto; padding: .75em 1% .75em 37%; width: 69%; }
  #amazon, #gallery, #main #linklist, #container #main #linklist dl, #main #references { float: none; margin: 0 !important; padding: 0 !important; width: 100% !important; }
  #gallery a { display: block; float: left; height: auto; margin: 0 1%; width: 31%; }
  #gallery a img { height: auto; width: 100%; }
  #container #main #references p, #portraits { height: auto; width: 100% !important; }
  #portraits img { height: auto; margin: 0 .25% 1em; width: 48%; }
  #main .frame { background: none !important; height: auto !important; padding: 0 0 1em !important; width: 100% !important; }
  #main #hphoto, #main #vphoto { background-position: center !important; background-size: contain !important; height: auto; margin: 0 auto !important; padding: 0 !important; width: 100%; }
  #main #hphoto img, #main #vphoto img { height: auto !important; margin: 0 auto !important; width: 100% !important; }
  #toc { border-right: none !important; width: 100% !important; }
  #rightCol, #rightCol p { width: 100% !important; }
  #cse-search-results iframe { width: 100% !important; }
  #footer p { text-align: center; }
  #footer span#social { float: none; margin: 0 auto; }
  #header-social, #nav, p#breadcrumb { display: none; }
  #nav, #nav ul { background: none; height: auto; padding: 0; width: 100%; }
  #nav li, #nav li a { background: none !important; display: block; height: auto !important; margin: 0 !important; text-indent: 0; width: 100% !important; }
  #nav li a { border-bottom: solid 1px #904020; padding: 1em 0; text-decoration: none; }
  #nav li a:link, #nav li a:visited { color: #904020; }
  #nav-toggle { background: url(../i/nav-toggle.png) no-repeat right top; background-size: 50%; cursor: pointer; display: block; height: 40px; position: absolute; right: 5%; top: 2.5%; width: 40px; }
}