html, body { margin: 0; padding: 0; height: 100%; }
article, aside, details, figcaption, figure,  footer, header, hgroup, menu, nav, section { display: block; }
ol, ul, li, menu { list-style: none; margin: 0; padding: 0; }
blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
a { text-decoration: none; color: #275125; transition: color 0.2s ease; }
a:hover { color: #357532; }
img { border: none; }

@font-face {
  font-family: 'FontAwesome';
  src: url('/layout/default/wf/fontawesome-webfont.eot?v=4.7.0');
  src: url('/layout/default/wf/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('/layout/default/wf/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('/layout/default/wf/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('/layout/default/wf/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('/layout/default/wf/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

body { font-family: 'Merriweather', sans-serif; font-weight: 400; background-color: #F9F8F0; color: #403F3B; background-position: center center; background-attachment: fixed; background-size: cover; }

body > header { width: 100%; height: 30px; background-color: #FFFCD5; position: relative; margin-top: 40px; text-align: center; padding: 6px 0; z-index: 10; }
body > header > a.logo { display: inline-block; height: 100%; }
body > header > a.logo img { height: 100%; }

body > nav { position: relative; width: 100%; z-index: 11; text-align: center; border-bottom: 2px solid #FFFCD5; }
body > nav > ul { font-size: 12px; line-height: 12px; font-weight: 500; }
body > nav > ul > li { display: inline-block; position: relative; }
body > nav > ul > li a { color: #FFFCD5; }
body > nav > ul > li a:hover { color: #FFF; }
body > nav > ul > li > span,
body > nav > ul > li > a { display: inline-block; padding: 12px 10px; cursor: pointer; }
body > nav > ul > li > ul { position: absolute; top: 100%; padding-top: 2px; overflow: hidden; max-height: 0; transition: max-height 0.3s ease; }
body > nav > ul > li:hover > ul { max-height: 200px; }
body > nav > ul > li > ul > li { background-color: #275125; }
body > nav > ul > li > ul > li:hover { background-color: #357532; }
body > nav > ul > li > ul > li > a { display: block; padding: 5px; }
body > nav > ul > li > ul > li > a:hover { color: #FFFCD5; }
body > nav .navx { display: none; }

@media (max-width: 600px) {
    body > header { text-align: left; }
    body > header > a.logo img { margin-left: 10px; }
    body > nav { border-bottom: none; }
    body > nav > ul { overflow: hidden; max-height: 0; transition: max-height 0.3s ease; }
    body > nav.open > ul { max-height: 800px; transition: max-height 0.3s ease; }
    body > nav > ul > li { display: block; background-color: #FFFCD5; position: relative; }
    body > nav > ul > li:hover { background-color: #275125; }
    body > nav > ul > li > a { color: #275125; display: block; }
    body > nav > ul > li:hover > a { color: #FFFCD5; }
    body > nav > ul > li > ul { position: relative; top: auto; max-height: none; }
    body > nav > ul > li > ul > li { background-color: #f7f2c8; }
    body > nav > ul > li > ul > li > a { padding: 8px; color: #275125; }
    body > nav > ul > li > ul > li > a:hover { color: #275125; background-color: #EFEABD; }
    
    body > nav .navx {
		display: inline-block; cursor: pointer;
		position: absolute; top: -24px; right: 15px;
		width: 25px; height: 4px;
		background-color: #275125; transition: background-color 0.4s ease;
		z-index: 1001;
	}

	body > nav .navx:focus { outline: 0; }

	body > nav .navx:before,
	body > nav .navx:after {
		content: ''; display: block; background-color: transparent;
		width: 25px; height: 16px; position: absolute; right: 0;
	}

	body > nav .navx:before { top: -8px; border-top: solid 4px #275125; transition: transform 0.4s ease, top 0.2s ease; }
	body > nav .navx:after { bottom: -8px; border-bottom: solid 4px #275125; transition: transform 0.4s ease, bottom 0.2s ease; }

	body > nav .navx:hover:before { top: -10px; }
	body > nav .navx:hover:after { bottom: -10px; }

	body > nav.open .navx:hover:before { top: 0; }
	body > nav.open .navx:hover:after { bottom: 0; }
	
	body > nav.open .navx:before { top: 0; -webkit-transform: rotate(45deg) translate(-6px,2px); transform: rotate(45deg) translate(-6px,2px); }
	body > nav.open .navx { background-color: transparent; }
	body > nav.open .navx:after { bottom: 0; -webkit-transform: rotate(-45deg) translate(-5px,-2px); transform: rotate(-45deg) translate(-5px,-2px); }

}

body > #introduction { display: flex; min-height: calc(100% - 440px); position: relative; overflow: hidden; color: #FFF; z-index: 1; padding: 10px 20px 10px; align-items: center; }
body > #introduction.main-bg { background: #F9F8F0; }
body > #introduction > div { display: flex; margin: auto; max-width: 950px; }
body > #introduction > div > a { display: block; flex: 1; margin: 0 20px; text-align: center; font-size: 12px; color: #FFFCD5; position: relative; }
body > #introduction > div > a > span { display: block; position: relative; }
body > #introduction > div > a > div { display: block; position: relative; width: 100%; padding-top: 100%; border-radius: 100%; margin-bottom: 20px; overflow: hidden; }
body > #introduction > div > a > div > span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center center; transition: transform 0.3s linear; border-radius: 100%; }
body > #introduction > div > a:hover > div > span { transform: scale(2); transition: transform 20s linear; }
body > #introduction > div > a > span:nth-child(2) { font-size: 16px; border-bottom: 2px solid #FFFCD5; padding: 10px 0; }
body > #introduction > div > a > span:nth-child(3) { padding: 10px 0; }

body > #introduction > .remote { display: none; position: absolute; width: 20px; height: 20px; top: 50%; margin-top: -15px; background: none; cursor: pointer; border: none; padding: 0; color: #FFFCD5; }
body > #introduction > .remote:focus { outline: none; }
body > #introduction > .remote:before { font-family: 'FontAwesome'; font-size: 20px; }

body > #introduction > .remote#prev { left: 10px; }
body > #introduction > .remote#next { right: 10px; }
body > #introduction > .remote#prev:before { content: '\f053'; }
body > #introduction > .remote#next:before { content: '\f054'; }

body > #introduction.main-bg > div > a { color: #357532; }

@media (max-width: 700px) {
    body > #introduction > div { flex: 0 0 300%; position: relative; max-width: none; margin-left: 0; transition: margin-left 0.4s ease; }
    body > #introduction > div > a { margin: 0 6%; }
    body > #introduction > .remote { display: block; }
}

@media (max-width: 600px) {
    body > #introduction { min-height: calc(100% - 102px); }
}

body > #title { padding: 60px 60px 20px; max-width: 1000px; margin: 0 auto; }
body > #title > h1 { color: #FFFCD5; font-weight: 500; font-size: 30px; margin: 0; letter-spacing: 1px; }

@media (max-width: 920px) {
    body > #title { padding: 60px 40px 20px; }

}
@media (max-width: 700px) {
    body > #title { padding: 40px 20px 20px; }
}

body > main { font-size: 12px; position: relative; display: block; background-color: #F9F8F0; }
body.home > main { display: flex; flex-wrap: nowrap; padding: 60px 20px; }
body.home > main > div { padding: 0 50px; }
body > main:after { content: ''; display: block; height: 0; clear: both; }
body > main p { margin: 1em 0; }
body > main section.about p:first-of-type { font-size: 14px; }
body > main h2 { font-weight: 500; font-size: 18px; margin: 0 0 20px; }
body > main h3 { font-weight: 600; font-size: 14px; margin: 0 0 20px; }

body > main ol { counter-reset: li; }
body > main * li,
body > main * li { position: relative; margin: 1em 0; }
body > main * li ul,
body > main * li ol { padding-left: 1.1em; }
body > main ul li:before { content: '•'; position: absolute; left: -1.1em; }
body > main ol > li:before { content: counter(li)'.'; counter-increment: li; position: absolute; left: -1.1em; font-weight: bold; }

body > main > section { padding: 20px 50px; flex: 1; max-width: 1000px; margin: 0 auto; }
body > main > section:first-of-type { padding-top: 60px; }
body > main > section:last-of-type { padding-bottom: 60px; }

body > main > section:after { content: ''; display: block; height: 0; clear: both; }
body > main > section > div img { margin: 0 20px 20px; max-width: 50%; height: auto; }
body > main > section > div img:first-of-type { margin-top: 0; }

body > main > section > iframe { float: right; }

body > main > .gallery { padding: 20px; margin: 20px auto; border-top: solid 1px #275125; border-bottom: solid 1px #275125; }
body > main > .gallery > h2 { flex-basis: 100%; text-align: center; color: #275125; }
body > main > .gallery > div { display: flex; flex-wrap: wrap; }
body > main > .gallery > div > a { display: block; flex-basis: calc(25% - 20px); margin: 10px; background-size: cover; background-position: center center; padding-top: 15%; }
body > main > .gallery > div > a > img { max-width: 100%; margin: 10px; }

body > main > aside { flex: 0 0 280px; padding: 0 50px; border-left: solid 2px #275125; min-height: 100%; }
body > main > aside > time { font-size: 10px; margin: 0; }
body > main > aside > h3 { font-size: 12px; font-weight: 600; margin: 0; }
body > main > aside > p { font-size: 12px; }
body > main > aside > a { font-size: 12px; display: block; font-weight: 600; margin: 0 10px; }

@media (max-width: 920px) {
    body > main { padding: 60px 20px; }
    body.home > main > div { padding: 0 20px; }
    body > main > section { padding: 0 20px; }
    body > main > section:first-of-type { padding-top: 0px; }
    body > main > section:last-of-type { padding-bottom: 0px; }
    body > main > aside { padding: 0 20px; }
}

@media (max-width: 700px) {
    body > main { padding: 40px 20px; }
    body.home > main { flex-wrap: wrap; }
    body.home > main > div { padding: 0 0 20px; }
    body > main > section { padding: 0 0 20px; }
    body > main > aside { padding: 20px 0 0; flex: 0 0 100%; border-left: none; border-top: solid 2px #275125; }
}

body > footer { background-color: #403F3B; color: #F9F8F0; padding: 40px; font-size: 10px; }
body > footer a { color: #FFF; }
body > footer > div.details { display: flex; flex-wrap: wrap; justify-content: space-between;  }
body > footer > div.details > div { margin: 20px; }
body > footer > div.details > div > .title { font-weight: 600; }
body > footer > div.details > div > p { margin: 5px 0; }
body > footer > div.copyright { text-align: center; }
body > footer > div.copyright span { display: inline-block; margin: 0 10px; }

body > main.prices > section > table { border-collapse: collapse; border-spacing: 0; }
body > main.prices > section > table tr > td,
body > main.prices > section > table tr > th { padding: 5px 20px; width: 95px; border: solid 1px #275125; text-align: right; }
body > main.prices > section > table tr > td:first-child,
body > main.prices > section > table tr > th:first-child { width: auto; text-align: left; }
body > main.prices > section > table thead tr { background-color: #dedbc0; }
body > main.prices > section > table tbody tr:nth-child(even) { background-color: #eae7d0; }

.news-article { margin: 0 0 20px; }
.news-article h3 + p + a { font-weight: bold; }

body > main > section  .news-article div.img { float: left; width: 150px; margin-right: 10px; }
body > main > section  .news-article div.img img { margin: 0; max-width: 100%; }

body > !main.search > section > form { width: 300px; float: left; }
body > !main.search > section > form h4 { margin-top: 0; }
body > !main.search > section > form .form-group { margin-bottom: 10px; }
body > !main.search > section > form .form-group label { float: left; width: 90px; }
body > !main.search > section > form .form-group input { margin-left: 90px; display: block;  padding: 3px 2px; }
body > !main.search > section > form button { margin-top: 10px; padding: 10px; border: 0; color: #FFFCD5; background: #275125; }

body > main.search > section > form .form-group:after { display: block; clear: both; content: ""; }

body > main.search > section > .results { position: relative; min-height: 400px; }
body > main.search > section > .results table { border-collapse: collapse; border-spacing: 0; width: 100%; }
body > main.search > section > .results table tr > td,
body > main.search > section > .results table tr > th { padding: 5px ; border: solid 1px #275125; text-align: left;   }
body > main.search > section > .results table thead tr { background: #275125; color: #F9F8F0; }
body > main.search > section > .results table tbody tr:nth-child(4n+4),body > main.search > section > .results table tbody tr:nth-child(4n+3) { background-color: #eae7d0; }
body > main.search > section > .results table tbody tr:nth-child(even) { display: none; padding: 0; }
body > main.search > section > .results table tbody tr:nth-child(even) td { padding: 0; }
body > main.search > section > .results table tbody tr:nth-child(even) td > div.map { display: none; height: 300px; }

body > main.search > section > .results table.table-key tbody tr { background-color: #F9F8F0; padding: 5px ;}
body > main.search > section > .results table.table-key tbody tr:nth-child(2n) { background-color: #eae7d0; padding: 5px ; }
body > main.search > section > .results table.table-key tbody tr td { padding: 5px; }


body > main.search > section > form {
	display: flex;
	flex-wrap: wrap;
	padding: 8px;
	white-space: nowrap;
	border: solid 1px #275125;
	margin-bottom: 20px;
}

body > main.search > section > form h4 {
	margin: 0 0 6px;
	flex-basis: 100%;
	font-size: 14px;
	text-align: center;
}

body > main.search > section > form .form-group {
	display: flex;
	position: relative;
	border: solid 1px #275125;
	flex: 1;
	margin-bottom: 6px;
}

body > main.search > section > form .form-group label {
	font-size: 14px;
	margin-bottom: 0;
	padding: 5px;
	background: #275125;
	flex: 0;
	color: #F9F8F0;
}

@media(min-width:835px) {
	.form-group:nth-of-type(1) { margin-right: 3px; } .form-group:nth-of-type(2) { margin-left: 3px; }
}

body > main.search > section > form .form-group input {
    display: inline-block;
    padding: 5px;
    background: transparent;
    border: none;
    flex: 1;
    font-size: 14px;
    font-family: 'Merriweather', sans-serif;
    color: #403F3B;
    outline: 0; 
}

body > main.search > section > form button {
    padding: 10px;
    border: 0;
    color: #F9F8F0;
    background: #275125;
    display: block;
    flex-basis: 100%;
    font-size: 14px;
    font-family: 'Merriweather', sans-serif;
}


#plot-form { display: none; position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.5); z-index: 111111111111111111; }
#plot-form > div { width:400px;position: fixed;top: 130px; left: 50%; margin-left:-200px;background:#fff;padding:15px; }
#plot-form > div form > label { display: block; font-weight: bold; }
#plot-form > div form > textarea, #plot-form > div form > input { display: block;
    font-family: 'Merriweather', sans-serif; font-size: 12px;
width: 100%;
padding: 5px;
box-sizing: border-box; }
#plot-form > div form > button { background: #357532; padding: 5px 10px; border: 0; color: #FFFCD5; }
#plot-form a.close { position: absolute; right: 10px; top: 0px; font-size: 33px; color: #333; }


#rose-garden { display: none; position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.5); z-index: 111111111111111111; }
#rose-garden > div { width:400px;position: fixed;top: 130px; left: 50%; margin-left:-200px;background:#fff;padding:15px; }
#rose-garden > div form > label { display: block; font-weight: bold; }
#rose-garden > div form > textarea, #plot-form > div form > input { display: block;
    font-family: 'Merriweather', sans-serif; font-size: 12px;
width: 100%;
padding: 5px;
box-sizing: border-box; }
#rose-garden > div form > button { background: #357532; padding: 5px 10px; border: 0; color: #FFFCD5; }
#rose-garden a.close { position: absolute; right: 10px; top: 0px; font-size: 33px; color: #333; }

#rose-garden table { margin: auto; }
#rose-garden table td { width: 60px; height: 60px; margin: 5px; background: #eee; text-align: center; }
#rose-garden table td.empty { background: transparent !important; }

.rose-center { font-size: 16px; font-weight: bold; }

.key-contain { position: relative; max-width: 1000px;

margin: 0 auto; }
.key { position: absolute; background: #fff; border-radius: 10px; padding: 6px 12px; right: 0; z-index: 45; top: 15px; }
.key strong { display: block; margin-bottom: 5px; font-size: 16px; }
.key .key-item { font-size: 14px; line-height: 31px; margin-bottom: 4px; }
.key .key-item img { width: 18px; float: left; margin-right: 4px; }
.key .key-item:after { content: ""; clear: both; display: block; }

.results .overflow { overflow-x: scroll; }

@media (max-width:445px) {
	body > main.search > section > form .form-group label small, body > main.search > section > form .form-group input small { display: none; }
	body > main.search > section > form .form-group label, body > main.search > section > form .form-group input {
		font-size: 12px;
	}
	#plot-form > div { position: fixed;top: 50px; left: 15px; right: 15px; background:#fff;padding:15px; margin-left: auto; width: auto; }

}

@media (max-width:560px) {
	body > main > section > div img { float: none !important; max-width: 100%; margin: auto; }
}

#harkaway_monumental.map { width:100%; height:450px; }
#harkaway_rotunda.map { width:100%; height:450px; }

body.fullscreen-monumental #harkaway_monumental.map { position: fixed !important; top: 0; left: 0; height: 100%; width: 100%; z-index: 111111; }
body.fullscreen-rotunda #harkaway_monumental.map { position: fixed !important; top: 0; left: 0; height: 100%; width: 100%; z-index: 111111; }

#berwick_general.map { width:100%; height:750px; }
#harkaway_rotunda.map { width:100%; height:450px; }

body.fullscreen-monumental #berwick_general.map { position: fixed !important; top: 0; left: 0; height: 100%; width: 100%; z-index: 111111; }
body.fullscreen-rotunda #berwick_general.map { position: fixed !important; top: 0; left: 0; height: 100%; width: 100%; z-index: 111111; }

body.fullscreen-rotunda, body.fullscreen-monumental { overflow: hidden; }

.fullscreen-button { cursor: pointer; background: white; border: 1px solid #ccc; padding: 7px 9px; color: #666; position: absolute; top: 15px; right: 15px; }

body > #introduction > div > a + a + a, li.cemetery-maps { display: none !important; }
body > #introduction > div > a + a + a + a { display: inline-block !important; }

.plot-key { float:right; margin-left:15px;  }
.plot-key.open { display: block !important; }

#show-location-key { display: none; }

@media(max-width:820px) {
    .plot-key { float: none; margin: 0 0 20px; display: none; }
    #show-location-key { float: right; border:1px solid #275125; padding: 6px 10px 5px; display: block; }
    form#enquiry { width: 100% !important; float: none !important; }
    #enquire_map { width: 100% !important; float: none !important; }
}

@media(min-width:821px) {
    .plot-key { display: block !important; width: 180px; position: absolute; right: 0; top: 43px; }
    .plot-key + .overflow { margin-right: 200px; }

    .plot-key.locked-key { position: fixed; }
}

.gm-control-active > img { margin: auto; }

.plot-window { padding: 10px; }
.plot-window h3 { margin-top: 0; padding: 4px; margin-bottom: 5px; }
.plot-window tr { display: table-row !important; }
.plot-window tr td { padding: 4px !important; border: 0 !important; background: #fff !important; }
.plot-window tr td strong { font-weight: 500; }

#enquire_map { height: 500px; width: 50%; float: right; }
.pull-right {
  float: right;
}
form#enquiry {
  max-width: 100%;
  display: block;
    float:left;
    width: 40%;
    white-space: initial;
    border: 0; padding: 0;
}
form#enquiry ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
form#enquiry ul li {
  margin: 0 0 0.25em 0;
  clear: both;
  display: inline-block;
  width: 100%;
}

body > main form#enquiry ul li::before { content: ""; }
form#enquiry ul li:last-child {
  margin: 0;
}
form#enquiry ul li p {
  margin: 0 10px 0 0;
  padding: 0;
  float: left;
    width: 45%;
    box-sizing: border-box;
}
form#enquiry ul li p.right {
  float: right;
}
form#enquiry ul li .divider {
  margin: 0.5em 0 0.5em 0;
  border: 0;
  height: 1px;
  width: 100%;
  display: block;
  background-color: #275125;
  background-image: linear-gradient(to right, #275125, #275125);
}
form#enquiry ul li .req {
  color: #ee9cb4;
}
form#enquiry label {
  display: block;
  margin: 0 0 0.5em 0;
  color: #275125;
  font-size: 1em;
}
form#enquiry input {
  margin: 0 0 0.5em 0;
  border: 1px solid #ccc;
  padding: 6px 10px;
  color: #555;
  font-size: 1em;
    box-sizing: border-box;
    width: 100%;
}
form#enquiry textarea {
  border: 1px solid #ccc;
  padding: 6px 10px;
  width: 100%;
  color: #555;
    box-sizing: border-box;
}
form#enquiry small {
  color: #275125;
  margin: 0 0 0 0.5em;
}

form#enquiry button { padding: 10px;
border: 0;
color: #F9F8F0;
background: #275125;
display: block;
flex-basis: 100%;
font-size: 14px;
font-family: 'Merriweather', sans-serif;}

@media (max-width: 412px) {
    #enquire_map { height: 300px; }
}

.missing-plot {
    position: fixed;
    display: none;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, .6);
    font-size: 12px;
    z-index: 46;
}

.missing-plot form#enquiry { padding: 20px; background: #fff; width: 400px; position: absolute; top: 100px; left: 50%; transform: translateX(-50%); }