html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, figure, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;} body {line-height: 1;}ol, ul{list-style:none;} blockquote, q{quotes:none;} blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;} :focus{outline:0;} ins{text-decoration:none;} del{text-decoration:line-through;} table{border-collapse:collapse; border-spacing:0;}

/* Original blue is 0, 109, 239 or 25, 118, 210 & original dark blue is 0, 89, 219 */

:root {
  --black: rgb(0, 0, 0);
  --dark-grey: rgb(46, 46, 46);
  --middle-dark-grey: rgb(92, 92, 92);
  --middle-light-grey: rgb(163, 163, 163);
  --light-grey: rgb(209, 209, 209);
  --lightish-grey: rgb(232, 232, 232);
  --white: rgb(255, 255, 255);
  --blue: rgb(0, 109, 239);
  --dark-blue: rgb(0, 94, 208);
  --green: rgb(51, 204, 51);
  --dark-green: rgb(43, 177, 43);

  --enormous: 2em;
  --largest: 1.8em;
  --large: 1.5em;
  --larger: 1.2em;
  --standard: 1.1em;
  --smaller: 0.9em;
  --small: 0.5em;
  
  --regular: 'Poppins', sans-serif;
  
  --line-height-standard: 1.6em;
  --line-height-small: 1.4em;
}

::-moz-selection {
  background: var(--lightish-grey);
  color: var(--middle-dark-grey);
}

::selection {
  background: var(--lightish-grey);
  color: var(--middle-dark-grey);
}

html {
	scroll-behavior: smooth;
}

body {
	background: var(--white);
	color: var(--middle-dark-grey);
	font-family: var(--regular);
	font-weight: 300;
	font-size: var(--standard);
}

h1 {
	color: var(--dark-grey);
	font-family: var(--regular);
	font-size: var(--largest);
	font-weight: 600;
	line-height: var(--line-height-small);
	margin: 20px 0 0 0;
}

h2 {
	color: var(--dark-grey);
	font-family: var(--regular);
	font-size: var(--large);
	font-weight: 600;
	line-height: var(--line-height-small);
	margin: 20px 0 0 0;
}

h3 {
	color: var(--dark-grey);
	font-family: var(--regular);
  font-size: var(--larger);
	font-weight: 600;
	line-height: var(--line-height-small);
	margin: 20px 0 0 0;
}

.no-margin {
  margin: 0;
}

p, figcaption {
	font-size: var(--standard);
	line-height: var(--line-height-standard);
	margin: 20px 0 0 0;
}

li {
	margin: 20px 0 0 0;
}

a {
	color: var(--dark-grey);
	font-family: var(--regular);
	font-weight: 600;
	text-decoration: none;
	transition: 0.3s;
  position: relative;
}

a:hover {
	color: var(--green);
}

img {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
	display: block;
	width: 100%;
}

figure img {
  -webkit-border-bottom-left-radius: 0;
  -moz-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -moz-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

figcaption {
  background: var(--lightish-grey);
  -webkit-border-bottom-left-radius: 10px;
  -moz-border-bottom-left-radius: 10px;
  border-bottom-left-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-bottom-right-radius: 10px;
  border-bottom-right-radius: 10px;
	font-size: var(--smaller);
  font-weight: 600;
  margin: 0;
	padding: 10px 20px;
	text-align: center;
}

iframe {
	margin: 0;
}

.column-100 iframe {
	margin: 40px 0 0 0;
}

.score h3 {
  margin: 5px 0 0 0;
}

form {
}

input, textarea, select {
  background: var(--white);
	border: 1px var(--light-grey) solid;
	border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
	box-sizing: border-box;
	color: var(--middle-dark-grey);
	font-family: var(--regular);
	font-size: var(--standard);
	font-weight: 300;
	line-height: var(--line-height-standard);
	margin: 5px 0 0 0;
	padding: 10px;
	resize: none;
}

input, textarea {
	width: 100%;
}

option {
	font-weight: 300;
}

textarea {
	height: 150px;
}

button {
  align-items: center;
  background: linear-gradient(to bottom, var(--blue) 50%, var(--dark-blue) 50%);
  border: none;
	border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
	color: var(--white);
	cursor: pointer;
	display: inline-flex;
	font-family: var(--regular);
	font-size: var(--larger);
	font-weight: 600;
	line-height: var(--line-height-standard);
	margin: 20px 0 0 0;
	padding: 15px 20px;
	position: relative;
  z-index: 1;
}

button:after {
  background: linear-gradient(to bottom, var(--green) 50%, var(--dark-green) 50%);
	border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  bottom: 0;
  content: '';
  opacity: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  transition: all 0.2s ease-in-out;
  z-index: -1;
}

button:hover:after {
  opacity: 1;
}

button.lity-close {
  padding: 0;
  margin: 10px 0 0 0;
}

button.lity-close:after {
  background: none;
	border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  bottom: 0;
  content: '';
  opacity: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  transition: none;
  z-index: -1;
}

button span {
	line-height: var(--line-height-standard);
}

.walks-county, .rides-county, .guides-region {
	margin: 20px 0 0 0;
}

.bold {
	font-weight: 600;
}

.date {
	font-family: var(--regular);
	font-size: var(--standard);
	font-weight: 300;
	line-height: var(--line-height-standard);
}

.button {
	display: inline-block;
	margin: 10px -10px 0 0;
	width: calc(100% + 10px);
}

.button li {
	display: inline-block;
	font-family: var(--regular);
	font-size: var(--standard);
	margin: 0 10px 0 0;
}

.button li a {
  align-items: center;
  background: linear-gradient(to bottom, var(--blue) 50%, var(--dark-blue) 50%);
	border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
	box-sizing: border-box;
	color: var(--white);
	display: inline-flex;
	margin: 10px 0 0 0;
	padding: 15px 20px;
  position: relative;
  z-index: 1;
}

.button li a:after {
  background: linear-gradient(to bottom, var(--green) 50%, var(--dark-green) 50%);
	border-radius: 10px;
	bottom: 0;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  content: '';
  opacity: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  transition: all 0.2s ease-in-out;
  z-index: -1;
}

.button li a:hover:after {
  opacity: 1;
}

.icon {
	margin: 0 20px 0 0;
}

.fa-size-extra {
	font-size: var(--enormous);
}

.fa-size {
	font-size: var(--standard);
}

.button li a span {
	line-height: var(--line-height-standard);
	margin: 0;
}

.button li a p {
	margin: 0 0 0 20px;
}

.icon-list {
	margin: 0;
}

.icon-list li {
	display: flex;
	margin: 20px 0 0 0;
}

.icon-list li span {
  color: var(--blue);
	font-size: var(--standard);
	line-height: var(--line-height-standard);
	margin: 0;
}

.icon-list li p, .icon-list li h3 {
	margin: 0 0 0 20px;
}

.icon-list-no-margin {
  margin: 20px 0 0 0;
}

.icon-list-no-margin li {
	margin: 5px 20px 0 0;
}

.fa-fw {
  width: 20px!important;
}

.wrapper {
	margin: 0 auto;
	max-width: 1240px;
}

.flex {
	display: flex;
	flex-direction: row;
	flex-basis: initial;
	flex-wrap: wrap;
	padding: 0 20px;
}

.flex-center {
	align-items: center;
}

.newsflash {
	border-bottom: 1px var(--light-grey) solid;
	color: var(--dark-grey);
	font-weight: 600;
	line-height: var(--line-height-standard);
	padding: 0 0 20px 0;
}

.header {
}

.logo {
	flex: 0 1 0;
	order: 1;
	padding: 40px 20px;
}

.logo-white {
	display: none;
}

.logo img, .logo-white img {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
	height: 66px;
	width: 80px;
}

.social {
	display: flex;
	flex: 0 1 0;
	flex-direction: row;
	order: 3;
	padding: 20px 0;
}

.navigation {
	flex: 1 0 0;
	font-family: var(--regular);
	font-size: var(--larger);
	line-height: var(--line-height-standard);
	padding: 20px 0 20px 20px;
	order: 2;
}

.social-item, .navigation-item, .navigation-item-last {
	border-right: 1px var(--light-grey) solid;
	flex: 0 1 0;
	flex-basis: initial;
	padding: 0 20px 0 0;
	margin: 0 20px 0 0;
}

.navigation-item-last {
	border-right: none;
}

.social-item-last {
	flex: 0 1 0;
	flex-basis: initial;
	margin: 0 20px 0 0;
}

.hamburger {
	display: none;
}

.block {
	margin: -40px 0 0 0;
}

.block img {
	background: var(--light-grey);
	margin: 40px 0 0 0;
}

.column-15, .column-20, .column-25, .column-30, .column-33, .column-40, .column-50, .column-60, .column-67, .column-75, .column-100 {
	box-sizing: border-box;
	padding: 0 20px;
	min-width: 0;
}

.column-15 {
	flex: 0 0 15%;
}

.column-20 {
	flex: 0 0 20%;
}

.column-25 {
	flex: 0 0 25%;
}

.column-30 {
	flex: 0 0 30%;
}

.column-33 {
	flex: 0 0 calc(100% / 3);
}

.column-40 {
	flex: 0 0 40%;
}

.column-50 {
	flex: 0 0 50%;
}

.column-60 {
	flex: 0 0 60%;
}

.column-67 {
	flex: 0 0 calc(100% / 3 * 2);
}

.column-75 {
	flex: 0 0 75%;
}

.column-80 {
	flex: 0 0 80%;
}

.column-100 {
	flex: 1 100%;
}

.column-100 p {
	width: calc(100% / 3 * 2);
}

.column-100 .button p {
	width: 100%;
}

.bodge {
	margin: 20px 0 0 0;
}

.bodge-all {
	margin: 20px 0 0 0;
}

.little-bodge {
	margin: 5px 0 0 0;
}

.big-bodge {
	margin: 40px 0 0 0;
}

.bodge-alt {
	margin: -20px 0 0 0;
}

.inset {
	margin: 0 -40px;
}

.inset-20 {
	margin: 0 -20px;
}

.border {
	border: 1px var(--light-grey) solid;
	border-radius: 10px;
	margin: 40px 20px 0 20px;
	padding: 0 20px 10px 20px;
}

.border h3 {
  margin: 10px 0 0 0;
}

.grey {
	background: var(--light-grey);
 	border-radius: 10px;
	margin: 40px 0 0 0;
	padding: 20px 20px 40px 20px;
}

.inset p {
	width: 100%;
}

.sub-inset {
	margin: 0 -40px;
}

.truncate h1, .truncate h2 {
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;  
}

.truncate p {
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;  
}

.center {
	text-align: center;
}

.right {
	text-align: right;
}

.caption {
	color: var(--middle-grey);
	font-family: var(--regular);
	font-weight: 600;
}

.showing .button li a, .hidden .button li a {
	cursor: pointer;
}

.hidden {
	display: none;
}

.instagram-desktop {
	display: flex;
  margin: 40px 0 0 0;
}

.instagram-tablet, .instagram-mobile {
  display: none;
}

.clear {
  clear: both;
}

.no-show {
	display: none;
}

.footer {
	color: var(--dark-grey);
	font-family: var(--regular);
	font-size: var(--larger);
}

.made-by {
	flex: 1 0 0;
	font-weight: 600;
	padding: 40px 40px 40px 20px;
	order: 1;
}

.top-of-page {
	flex: 0 1 0;
	font-weight: 600;
	padding: 40px 20px 40px 0;
	order: 2;
}

@media (max-width: 980px) {

iframe {
	margin: 20px 0 0 0;
}

.button {
}

.button li {
	margin: 0 10px 0 0;
}

.button li a {
	width: 100%;
}

.flex {
	padding: 0;
}

.block {
  padding: 0 10px;
}

.no-padding {
	padding: 0;
}

.logo {
	order: 1;
	flex: 1 0 0;
	padding: 20px;
}

.social {
	order: 2;
	padding: 0;
}

.hamburger {
	display: inline;
	flex: 0 1 0;
	padding: 0 20px 0 0;
	order: 3;
}

#toggle-1 {
	display: none;
}

.navigation {
	box-sizing: border-box;
	flex: 0 0 100%;
	margin: 0 0 20px 0;
	order: 4;
}

.social-item, .social-item-last {
	border-right: none;
	margin: 0 20px 0 0;
	padding: 0;
}

.navigation-item, .navigation-item-last {
  border-top: 1px var(--light-grey) solid;
	border-right: none;
	flex: 0 0 100%;
	margin: 0;
	padding: 0;
}

.navigation-item-last {
  border-bottom: 1px var(--light-grey) solid;
}

.navigation-item a, .navigation-item-last a {
	display: block;
	padding: 12px 20px;
	margin: 0;
}

.title-item {
	padding: 20px;
}

.block {
	margin: -20px 0 0 0;
}

.block img {
	margin: 20px 0 0 0;
}

.column-15, .column-20, .column-25, .column-30, .column-33, .column-40, .column-50, .column-60, .column-67, .column-75, .column-80 {
	flex: 0 0 50%;
	padding: 0 10px;
}

.column-100 {
	flex: 0 0 100%;
	padding: 0 10px;
}

.column-100 p {
	width: 100%;
}

.inset .column-33, .inset .column-67 {
	padding: 0 10px;
}

.inset .column-50 {
	flex: 0 0 100%;
	padding: 0 10px;
}

.bodge {
	margin: 0;
}

.inset, .inset-20 {
	margin: 0 -10px;
	width: calc(100% + 20px);
}

.sub-inset {
	margin: 0 -20px;
	width: calc(100% + 40px);
}

.border {
  border-radius: 0;
	margin: 20px 0 0 0;
	padding: 0 20px 20px 20px;
}

.instagram-tablet {
	display: flex;
  margin: 20px 0 0 0;
}

.instagram-desktop, .instgram-mobile {
  display: none;
}

.newsflash {
	padding: 0 10px 20px 10px;
}

.no-margin {
	margin: 0;
}

.caption {
	box-sizing: border-box;
	margin: 20px 0 0 -20px;
	padding: 0 20px 0 20px;
	width: calc(100% + 40px);
}

.made-by {
	padding: 20px;
}

.top-of-page {
	padding: 20px 20px 20px 0;
}

}

@media (max-width: 640px) {

figcaption {
  -webkit-border-bottom-left-radius: 0;
  -moz-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -moz-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
  margin: 0 -20px;
}

select {
  width: 100%;
}

img {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

.column-100 iframe {
	margin: 20px 0 0 0;
}

.block {
  padding: 0;
}

.block img {
	margin: 20px 0 0 -20px;
	width: calc(100% + 40px);
}

.column-20, .column-25, .column-30, .column-33, .column-40, .column-50, .column-60, .column-67, .column-75, .column-80, .column-100 {
	flex: 0 0 100%;
	padding: 0 20px;
}

.inset, .inset-20 {
	margin: 0 -10px;
	width: calc(100% + 20px);
}

.right {
	text-align: left;
}

.newsflash .button li {
	margin: 0 10px 0 0;
}

.instagram-mobile {
	display: flex;
	margin: 20px 0 0 0;
}

behold-widget {
	margin: 0 -20px 0 -20px;
	width: calc(100% + 40px);
}

.instagram-desktop, .instagram-tablet {
  display: none;
}

.newsflash {
	padding: 0 0 20px 0;
}

}

@media (prefers-color-scheme: dark) {

body {
	background: var(--black);
	color: var(--middle-light-grey);
}

h1, h2, h3, a {
	color: var(--light-grey);
}

input, textarea, select {
	background: var(--black);
	border: 1px var(--dark-grey) solid;
	color: var(--middle-light-grey);
}

figcaption {
  background: var(--dark-grey);
}

.logo {
  display: none;
}

.logo-white {
  display: block;
  flex: 0 1 0;
	order: 1;
	padding: 40px 20px;
}

.made-by {
	padding: 20px 20px 20px 20px;
}

.top-of-page {
	padding: 20px 20px 20px 0;
}

}

@media (prefers-color-scheme: dark) and (max-width: 980px) {

.logo-white {
	order: 1;
	flex: 1 0 0;
	padding: 20px;
}

.navigation-item, .navigation-item-last {
	border-top: 1px var(--dark-grey) solid;
}

.navigation-item-last {
	border-bottom: 1px var(--dark-grey) solid;
}

.newsflash {
	background: var(--dark-grey);
	color: var(--light-grey);
}