:root {
 --primary-color: #8A6135
}

body {
	background-color: #FFFFFF;
	color: #8A6135;
	font-family: Verdana, Calibri, Arial, Helvetica, sans-serif;
    padding: 0px;
	font-size: 14pt;
	background-image: url("../images/bg_horse.jpg");
	background-repeat: repeat-y;
}

h1 {
	font-size: 20pt;
	font-weight: bold;
}

h2 {
	font-size: 18pt;
	font-weight: bold;
}

h3 {
	font-size: 16pt;
	font-weight: bold;
	background-color: var(--primary-color);
	color: #FFFFFF;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
}

h6 {
	font-size: 10pt;
}

p {
	font-size: 12pt;
}

img {
	border: 0;
}

#footer {
    background-color: #8A6135;
    color: #FFFFFF;
    padding-top: 25px;
    width: 100%;
    margin: 0px;
	border-radius: 10px 10px 0px 0px;
}

#footer ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
}

#footer ul li { display: inline; }

#footer ul li a {
	text-decoration: none;
	padding: .2em 1em;
	color: #fff;
}

#footer ul li a:hover {
	color: #fff;
	background-color: #E87221;
}

#footer ul li a:hover {
	color: #fff;
	background-color: #E87221;
}

.panel{
	margin-top: 10px;
	padding:20px;
	border: 1px solid var(--primary-color);
	-webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
	box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	/* background-color: var(--primary-color); */
	color:var(--primary-color);
}

.filled_panel{
	margin-top: 10px;
	padding:20px;
	border: 1px solid var(--primary-color);
	box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
	border-radius: 10px 10px 10px 10px;
	background-color: var(--primary-color);
	color:#ffffff;
}

input[type=text].postcodeinput		{font-size:14px;color:rgb(150,150,150);width:50px;}
input[type=number].promocodeinput	{font-size:14px;color:rgb(150,150,150);width:60px;}


#container-fluid {
    padding: 0px;
    margin: 0px;
}

#maincontent {
	padding:15px;
}

.center_align {
	text-align: center;
}
.right_align {
	text-align: right;
}
.floatright {
	float: right;
}
.floatleft{
	float:left;
}


#ExperienceGrid {
	max-width:975px;
	margin:0px auto;
}

.ExperienceTypeBlock {
	float:left;
	width:230px;
	height:172px;
	background-size:cover;
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
}
.ExperienceTypeTitle {
	width:212px;
	height:30px;
	background-color:rgba(255,0,0,0.5);
	padding: 1px 8px 1px 8px;
	color:#ffffff;
}
.ExperienceTypeProse {
	width:212px;
	height:122px;
	background-color:rgba(255,255,255,0.55);
	padding: 2px 8px 1px 8px;
	color:#000000;
	font-size:14px;}

#region_dropdown {
	display: none;
}

.clear {
    clear: both;
}

/* search_exp_result.asp styles */
#experience {
	margin-top: 10px;
	padding:20px;
	border: 3px solid var(--primary-color);
	-webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
	box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	color:var(--text-color);
}

.headline {
	padding: 2px 0 2px 0; 
	color:#FFFFFF; 
	font-weight:bold;
	background-color: var(--primary-color);
	padding-left:10px;
	padding-right:10px;
	height:35px;
}
.headline_text {
	padding: 5px 0 5px 0; 
	color:#FFFFFF; 
	font-weight:bold;
	font-size: 12pt;
}

.experience_section_wrapper {
	padding:10px;
}

#under_experience{
	padding-left:10px;
	padding-right:10px;
}

#tabsarea {
	float:right;
}


A.tab:link    {color: #ffffff; text-decoration: none;}
A.tab:visited {color: #ffffff; text-decoration: none;}
A.tab:hover   {color: #ffffff; text-decoration: underline;}

div.smimagebox { 
	float:left; 
	width:86px; }

.searches {
	font-size:12px;
	text-align:right;
	color:#ffffff;
	padding-right:20px;
	padding-top:5px;
}
.redtext {
	color:#ff0000;
}
#logotext {
	color:#ffffff;
	font-size: 12pt;
}

A.m:link     { font-size: 16px; color: #ffffff; text-decoration: none; } 	/* unvisited link */
A.m:visited  { color: #ffffff; text-decoration: none; }     	/* visited links */
A.m:active   { color: #ffffff; text-decoration: none; } 	/* active links */
A.m:hover    { color: #F4A460; text-decoration: underline; }	/* hovering links */

p.m {
	font-size: 10px;
}

.review_rating {
	color:#F4A460;
}

#map-canvas {
	width:585px; 
	height:400px; 
	margin-left:15px; 
	border:2px #E0E0E0 solid;
}

#reviewdiv {width:80%; 
			height:auto; 
			margin:0 auto; 
			overflow:auto; 
			border:1px solid rgb(150, 150, 150);
			background-color:rgb(200, 200, 200); 
			font-family:Verdana, Geneva, sans-serif;
			border-radius: 10px 10px 10px 10px;
}

.fivestars		{width:150px;height:35;}
.price			{font-size:18pt; color:#FF0000; font-weight:bold; margin-top:-20px;}
input.buy 		{width: 160px;  height: 35px; font-size: 14pt;}
.redtext		{color: #ff0000;}
#pricearea		{float:left;}

/* end of search_exp_result.asp */

#postcodehints {
	z-index:9999;
	display:none;
	position:absolute;
	width:190px;
	background-color:#ffa;
	color: blue;
	padding: 5px;
	font-size:15px;
	text-align: left;
}

#mainheaderdiv {
	background-color: #8A6135;
	height: 115px;
}

#mainlogo {
	padding-top: 5px;
	padding-left: 20px;
}

#mainheaderlogo {
	padding-left: 15px;
	padding-top: 5px;
	float:left;
}
/* SJG Navigation bar customisations */

.navbar {
	height: 75px;
	border-radius: 0px 0px 10px 10px;
}

.bg-mainnavbar {
	background-color: #8A6135;
	border-bottom: 1px #ffffff;
	border-top: 1px #ffffff;
}

.bg-subnavbar {
	background-color: #8A6135;
	border-bottom: 1px #ffffff;
	border-top: 1px #ffffff;
}

.navbar-dark .navbar-nav .nav-link {
	color: #ffffff;
	text-align: center;
}

.navbar-dark .navbar-brand {
	font-size: 14pt;
	font-weight: bold;
	text-decoration: none;
}

.navbar-dark .navbar-nav .nav-item{
	z-index: 99;
	background: #8A6135;
	width: 100%;
}

.navbar-dark .navbar-nav .nav-item {
	z-index: 99;
	background: #8A6135;
}

.navbar-dark .navbar-nav > li > a:hover,
.navbar-dark .navbar-nav > li > a:focus {
  color: #ffffff;
  background-color: #E87221;
  height: 40px;
}
.navbar-dark .navbar-nav > .active > a,
.navbar-dark .navbar-nav > .active > a:hover,
.navbar-dark .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: #E87221;
  height: 40px;
}

.navbar-brand {
	color:#000000;
	font-size: medium;
}

.navbar-nav.navbar-center {
    position: absolute;
    left: 50%;
    /* transform: translatex(-50%); */
}
/* SJG end of navigation bar customisation */

.ssearch_duration {
	text-align: right;
}


/*MEDIA QUERY*/
/* Extra small devices, phones */
@media only screen and (max-width : 576px) {
    body {
        background-color: #F4A460;
        color: #FFFFFF;
		background-image: none;
    }
    img {
		display: block;
		max-width:300px;
		max-height:85px;
		width: auto;
		height: auto;
	}

	h1 {
		font-size: 20pt;
	}

	h2 {
		font-size: 18pt;
	}

	h3 {
		font-size: 16pt;
		font-weight: bold;
	}

	h6 {
		font-size: 12pt;
	}

	p{
		font-size: 12pt;
	}
	#logotext {
		font-size: 8pt;
	}
	table {
		font-size: smaller;
	}

	#ExperienceGrid {
		max-width:305px;
		margin:0px auto;
	}

	.ExperienceTypeBlock {
		width:285px;
		height:210px;
	}
	.ExperienceTypeTitle {
		width:269px;
		/* height:22px; */
	}
	.ExperienceTypeProse {
		width:265px;
		height:160px;
		font-size:20px;
	}

	#search_map {
		display: none;
	}

	#region_dropdown {
		display: block;
	}
	div.header {
		width: 100%;
		}
	div.body {
		width: 100%
		}	
	div.menu {
		display: none;
		width: 0px;
	}
	div.content {
		width: 100%;
	}
	#page_header {
		display:none;
	}
	.headline_text {
		font-size:10px;
	}
	#reviewdiv {
		display:none;
	}
	#map-canvas {
		display:none;
	}
	#mainheaderdiv{
		height:150px;
	}
	#mainlogo {
		width: 250px;
	}
	#logotext {
		display: none;
	}
}

/* Small devices (tablets, 768px and up) also landscape phones*/
@media only screen and (max-width: 768px) and (min-width: 577px){
    body {
        background-color: #CD853F;
        color: #FFFFFF;
		background-image: none;
    }

    img {
		display: block;
		max-width:300px;
		max-height:85px;
		width: auto;
		height: auto;
	}

	h1 {
		font-size: larger;
	}

	h2 {
		font-size: medium;
	}

	h3 {
		font-size: small;
		font-weight: bold;
	}

	h6 {
		font-size: x-small;
	}

	p{
		font-size: 14pt;
	}

	table {
		font-size: smaller;
	}

	#ExperienceGrid {
		max-width:500px;
		/* height:1906px; */
		margin:0px auto;
	}
	.ExperienceTypeBlock {
		width:285px;
		height:210px;
	}
	.ExperienceTypeTitle {
		width:269px;
		/* height:22px; */
	}
	.ExperienceTypeProse {
		width:265px;
		height:160px;
		font-size:20px;
	}

	#logotext {
		font-size: 8pt;
	}
	
	#search_map {
		display: none;
	}

	#region_dropdown {
		display: block;
	}
	div.header {
		width: 100%;
		}
	div.body {
		width: 100%
		}	
	div.menu {
		display: none;
		width: 0px;
	}
	div.content {
		width: 100%;
	}
	#page_header {
		display:none;
	}
	#map-canvas {
		display:none;
	}
}

/* Medium devices (desktops, 992px and up) */
@media only screen and (max-width: 1199px) and (min-width: 769px){
	#search_map {
		display: none;
	}

	#region_dropdown {
		display: block;
	}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}
