/* Stockholm extension, https://github.com/annaesvensson/yellow-stockholm */

/* Colors and fonts */

@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(stockholm-opensans-light.woff) format("woff");
}
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(stockholm-opensans-regular.woff) format("woff");
}
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(stockholm-opensans-bold.woff) format("woff");
}

/* holding */

.hold {
	background: url('hold.jpg') no-repeat center center fixed;
	background-size: cover;
    min-height: 100vh
}

/* Map */

html, body, #map {
	width: 100%;
    height: 100%;
	margin: 0;
	padding: 0;
    font-size: 1em
}
.leaflet-container {
    max-width: 100%;
    max-height: 100%;
}
#message {
	position:absolute;
	bottom: 30px;
	right: 5px;
	background-color: rgba(255, 255, 255, 0.7);
	border-radius: 10px;
	padding: 0 10px 0 10px;
	z-index: 999
}
#wikipages {
	 position:absolute;
	 bottom: 60px;
	 right: 5px;
	 background-color: rgba(255, 255, 255, 0.7);
	 border-radius: 10px;
	 padding: 0 10px 0 10px;
	 text-align: right;
	 z-index: 999
}
#wikipages img {
    height: 15px
}

/* Nutrient Map */

#nutmap {
	width: 100%;
    height: 550px;
	margin: 0;
	padding: 0;
    font-size: 1em
}

/* Page Map */

#imap {
	width: 100%;
    height: 700px;
	margin: 0 auto;
	padding: 0;
    font-size: 1em
}
#imessage {
    text-align: center;
	margin: 5px auto
}

#openmap {
	position:absolute;
	top: 5px;
	left: 50px;
	z-index: 999
}

#key {
    position:absolute;
    top: 100px;
	left: 10px;
    height: 25px;
    text-align: middle;
    z-index: 999
}
#key img {
    height: 25px;
    vertical-align: sub
}

/* General */

html, body, div, form, pre, span, tr, th, td, img {
    margin: 0;
    padding: 0;
    border: 0;
}
body {
    margin: 0 auto;
    background-color: #FAF7F2;
    color: #666;
    font-family: "Open Sans", Helvetica, sans-serif;;
    font-size: 1em;
    font-weight: 300;
    line-height: 1.5;
}
h1, h2, h3, h4, h5, h6 {
    color: #111;
    font-weight: 300
}
h1 {
    font-size: 2.5em
}
h2 {
    font-size: 1.8em;
    margin: 10px auto 20px 0
}
h3 {
    font-size: 1.4em;
}
h4 {
    font-size: 1.1em;
    float: right
}
h5 {
    margin-top: -1em;
    font-size: 1em;
    color: #d16603;
}
h6 {
    font-size: 1em;
    color: #d16603;
}
hr {
    height: 1px;
    background: #f08a06;
    border: 0;
}
strong {
    font-weight: bold;
}
code {
    font-size: 1.1em;
}
.ground {
	background: url('bgn.jpg') no-repeat center center fixed;
	background-size: cover;
	min-height: 850px
}
.top {
	background: inherit;
	min-height: 75px
}
.content a, #map a {
    color: #07d;
    text-decoration: none;
}
.content a:hover, #map a:hover {
    color: #07d;
    opacity: 0.5;
}
#latest-on-mastodon img {
    height: 25px
}
a {
    color: #07d;
    text-decoration: none;
}
a:hover {
    color: #07d;
    opacity: 0.5;
    text-decoration: none;
}
/* Header */

.header {
    margin: 0 auto
}
.header .sitename {
    margin: 160px auto;
	text-align: left;
    float: left;
	height: auto
}
.header .sitename h1 {
	margin: 0 0 0 10px;
	font-size: 2.8em;
	color: #FAF7F2;
    text-shadow: 0 2px 4px rgba(48, 48, 48, 0.8);
    text-align: left;
}
.header .sitename h2 {
	margin: 10px 0 0 10px;
	font-size: 2.5em;
	color: #FAF7F2;
    text-shadow: 0 1px 3px rgba(48, 48, 48, 0.8);
    text-align: left;
}
.header .sitename a {
    color: #666;
    text-decoration: none;
    padding: 0;
}
.header .sitename a:hover {
    opacity:1
}
.header .sitename p {
    margin-top: 0;
    color: #666;
}
.header .logo {
    margin: 0 auto;
	text-align: left;
    float: left
}

/* Navigation */

#navigation {
    display: block;
    font-size: 1.1em;
    overflow: hidden;
	position: fixed;
	width: 100%;
	transition: top 1s;
    text-align: right;
	padding: 0 5px 2px 5px;
	background-image: linear-gradient(0deg, rgba(48,89,48,0), rgba(48,89,48,0.5));
	border: none;
}
#navigation img {
	float:left
}
#navigation a {
	color: #fff;
	text-shadow: 0 2px 25px #2F552F;
    font-weight: 400;
    text-decoration: none;
    padding: 0.5em 0;
    margin: 0 3%;
}
#navigation a:hover {
    color: #539A53;
    opacity:0.8
}
#navigation ul {
    margin: 0 -0.5em;
    padding: 0;
    list-style: none;
}
#navigation li {
    display: inline;
}
#navigation li a.active {
    color: #29f;
}
.navigation-banner {
    clear: both;
}

.search {
    display: block;
    float: right;
	margin: 0 20px 0 0;
}

/* svg */

.content .entry-meta img {
    vertical-align: middle
}

/* Content */

.content h1 {
    margin: 0;
}
.content h1 a {
    color: #111;
}
.content h1 a:hover {
    color: #111;
    text-decoration: none;
}
.content img {
    max-width: 100%;
    height: auto;
}
.content .entry-tags {
    margin: 30px auto
}
.content #message {
    text-align: center;
    margin: 1em 0;
}
.content form {
    margin: 1em 0;
}
.content table {
    border-spacing: 0;
    border-collapse: collapse;
}
.content th {
    text-align: left;
    padding: 0.3em;
    border-bottom: 1px solid #ddd;
}
.content td {
    text-align: left;
    padding: 0.3em;
    padding-right: 2em;
}
.content code,
.content pre {
    font-family: Consolas, Menlo, Courier, monospace;
    font-size: 90%;
}
.content code {
    padding: 0.15em 0.4em;
    margin: 0;
    background-color: #f7f7f7;
    color: #666;
    border-radius: 3px;
}
.content pre > code {
    padding: 0;
    margin: 0;
    white-space: pre;
    background: transparent;
    border: 0;
    font-size: inherit;
}
.content pre {
    padding: 1em;
    overflow: auto;
    line-height: 1.45;
    background-color: #f7f7f7;
    color: #666;
    border-radius: 3px;
}
.content blockquote {
    margin-left: 0;
    padding-left: 1em;
    font-weight: bold;
    border-left: 3px solid #fb0
}
/* Grassland VH */
.content .notice01 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgba(113, 210, 3, 0.302);
    border-left: 10px solid #71d203
}
/* Grassland M */
.content .notice02 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgba(92, 172, 1, 0.302);
    border-left: 10px solid #5cac01
}
/* Grassland */
.content .notice1 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(64, 119, 0, 0.3);
    border-left: 10px solid #3e7d00
}
/* Hedgerow */
.content .notice2 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(146, 144, 0, 0.2);
    border-left: 10px solid #926e00
}
/* Woodland */
.content .notice3 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(255, 187, 0, 0.2);
    border-left: 10px solid #fb0
}
/* Watercourse */
.content .notice4 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(0, 76, 255, 0.2);
    border-left: 10px solid #004CFF
}
/* Nutrient */
.content .notice5 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(0, 217, 255, 0.2);
    border-left: 10px solid #00d9ff

}
/* Carbon */
.content .notice6 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(255, 1, 11, 0.2);
    border-left: 10px solid #ff010b
}
/* Tree */
.content .notice7 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(76, 148, 133, 0.2);
    border-left: 10px solid #4C9485
}
/* Scrub */
.content .notice8 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgba(142, 0, 147, 0.2);
    border-left: 10px solid #944c87
}
/* Mosaic */
.content .notice9 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgba(256, 132, 0, 0.2);
    border-left: 10px solid #FF8400
}
/* Ponds */
.content .notice10 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(42, 78, 162, 0.2);
    border-left: 10px solid #2a4ea2
}
/* Orchard */
.content .notice11 {
    margin: 1em 40px;
    padding: 5px 1em;
    font-size: 1.2em;
    background-color: rgb(132, 162, 42, 0.2);
    border-left: 10px solid #84a22a
}
.content .flexible {
    position: relative;
    padding-top: 0;
    padding-bottom: 56.25%;
}
.content .flexible iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.content .task-list-item {
    list-style-type: none;
}
.content .task-list-item input {
    margin: 0 0.2em 0.25em -1.75em;
    vertical-align: middle;
}
.content .toc {
    margin: 0;
    padding: 0;
    list-style: none;
}
.entry-content {
    margin: 0 1em;
}
.help {
    float: right
}

/* .wikiauthors ul { padding: 0; list-style: none; column-width: 18em; } */

.wikiauthors li {
    margin: 10px 40px 15px auto;
    padding: 15px;
    list-style: none;
    background-color: #f08b0622;
    border-radius: 10px;
    font-size: 1.2em;
    text-align: left;
    text-decoration: none;
    box-sizing: border-box;
}

.content .wikipages ul,
.content .wikitags ul,
.content .wikilinks ul {
    padding: 0;
    list-style: none;
    column-width: 18em;
}
.content .wikipages ol,
.content .wikitags ol,
.content .wikilinks ol {
    padding: 0;
    list-style: decimal;
    column-width: 19em;
}
.content .wikipages {
    float: left;
    margin-left: 9em
}
.content .wikipages img {
    height: 20px
}
.content .wikitags {
    float: right;
    margin-right: 9em
}
.content .previousnext .previous {
    margin-right: 1em;
}
.content .next {
    margin-left: 1em;
    float:right
}
.content .pagination .previous {
    margin-right: 1em;
}
.content .pagination {
    margin: 1em 0;
}
.content .left {
    float: left;
    margin: 0 1em 0 0;
}
.content .center {
    display: block;
    margin: 0 auto;
}
.content .right {
    float: right;
    margin: 0 0 0 1em;
}
.right img a:hover {
    opacity: 0.5;
}
.content .rounded {
    border-radius: 4px;
}
.microblog_post {
    margin: 10px 0 15px 0
}
.company {
	float: right;
	margin-left: 10px;
	text-align: center
}
.hall img {
    height: 30px
}

/* Footer */

.footer {
    text-align: center;
    margin: 2em auto
}
.footer .hall img {
    height: 20px
}
.footer .siteinfo img {
    height: 30px
}

/* Forms and buttons */

.form-control {
    margin: 0;
    padding: 2px 4px;
    display: inline-block;
    max-width: 9em;
    background-color: #dddbdb;
    color: #666;
    border: 1px solid #dddbdb;
    border-radius: 4px;
    font-size: 0.9em;
    font-family: inherit;
    font-weight: normal;
    line-height: normal;
}
.btn {
    margin: 0;
    padding: 5px 15px;
    display: inline-block;
    min-width: 1em;
    background-color: #eaeaea;
    color: #333333;
    border: none;
    border-radius: 4px;
    
    font-size: 0.9em;
    font-family: inherit;
    font-weight: normal;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
}
.btn:hover, .btn:focus, .btn:active {
    color: #333333;
    background-image: none;
    text-decoration: none;
}
.btn:active {
    background-color: #eaeaea;
}

/* Responsive and print */

.header {
    margin: 0 auto;
    max-width: 1200px;
}

.page {
    margin: 75px auto;
    max-width: 1200px;
}

@media screen and (min-width: 82em) {
    .page, .header {
        max-width: 1200px;
    }
}

@media screen and (max-width: 82em) {
	.ground {
	    background: url('bgns.jpg') no-repeat;
	    background-size: cover;
	    min-height: 500px
    }
    .main {
		padding: 0 10px 0 10px;
    }
	.content .wikipages {
    	float: left;
    	margin-left: 5em
	}
	.content .wikitags {
    	float: right;
    	margin-right: 5em
	}
}

@media screen and (max-width: 62em) {
    html, body {
        font-size: 1.1em
    }
    .siteground {
        display: none
    }
    .help {
        float: none;
        text-align: center
    }
    .header .sitename {
		margin: 0 auto;
        padding-top: 100px;
        text-align: center;
        float: none;
    }
	#navigation {		
		font-size: 1.1em;
		overflow: hidden;
		position: fixed;
		width: 100%;
		transition: top 1s;
		text-align: center;
		margin: 0 auto;
		padding: 0 5px 15px 0;
		border: 0;
    	border-radius: 0;
    	outline-offset: 0
	}
	#navigation a {
    	padding: 0.2em 0;
    	margin: 0 0.7em;
	}
	#navigation img {
		max-width: 75px;
		margin: 5px 0
    }
	.search {
		margin: 75px auto;
        padding-top: 0;
        text-align: center;
        float: none;
	}
	.header .sitename h1 {
		font-size: 2em;
		text-align: center;
		margin: 0 auto
    }
	.header .sitename h2 {
		font-size: 1.3em;
		text-align: center;
		margin: 20px auto
    }
	.content {
        font-size: 1.2em
    }
    .content h1 {
        font-size: 1.5em;
    }
    .content h2 {
        font-size: 1.3em;
    }
    h3 {
    	font-size: 1.2em;
	}
    .content .wikipages, .content .wikitags, .content .key-left, .content .key-right {
        float: none;
		column-width: 100%;
		margin-right: 0;
        margin-left: 50px
    }
	.company, .hall {
        text-align: center;
        float: none;
		margin: 0 auto;
    }
}
@media print {
    .page {
        border: none !important;
    }
}
