/* # localized customizations # */

/* --- navbar */
.navbar-brand { padding: 0; }
.navbar-brand>img {
	height: 100%;
	width: auto;
	padding: 5px;
}
.navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus {
	background-color: hsl(162,100%,23%);
}

.navbar-inverse {
	background-color: hsl(130, 31%, 50%);
	border-color: hsl(130,31%,56%);
}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus {
	background-color: hsl(130,31%, 59%);
}
.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
	background-color: hsl(162,100%,23%);
}

.navbar-inverse .navbar-toggle {
	border-color: hsl(162,100%,23%);
}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
	border-color: hsl(162,100%,23%);
}
.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
	background-color: hsl(162,100%,25%);
}
.navbar-collapse .navbar-nav {
	margin-top: 0;
}
/* --- splash nav */

.navbar > .splashcaption {
	display: none;
}
@media screen and (min-width: 768px) {
	.ishome > .container {
		margin-top: 150px;
	}
	.ishome .navbar-inverse {
		-webkit-transition: all .35s;
		-moz-transition: all .35s;
		transition: all .35s;
		min-height: 99%;
		background-image:		url(/images/meadow-grass-layer1-1200px.png), url(/images/web-head-layer-2.png), url(/images/meadow-grass-layer3-1600px.png);
		background-position:	bottom left, bottom right, top left;
		background-size:		initial, contain, cover;
		background-repeat:		repeat-x, no-repeat, repeat-x;
	}
	.ishome .navbar-inverse.affix {
		min-height: 60px;
		background-image: none;
	}
	.ishome .navbar > .splashcaption {
		display: inline-block;
		background: rgba(140,110,74,.6);
		position: absolute;
		bottom: 1em; left: 1em;
		padding: 0 1em 0.66em;
		width: auto;
	}
	.ishome .navbar > .splashcaption > * {
		color: white !important;
		font-weight: bolder;
	}
	.ishome .navbar.affix > .splashcaption {
		display: none;
	}
	.ishome .navbar .navbar-brand {
		height: 100px;
	}
	.ishome .navbar.affix .navbar-brand {
		height: 60px;
	}
}

/* --- color, for mainbody text, links, and buttons */
a {
	color: hsl(358, 85%, 52%);
}
a:hover, a:focus {
	color: hsl(358,85%,32%);
}
footer a {
	color: hsl(162,100%,23%);
}
footer a:hover, footer a:focus {
	color: hsl(146,16%,59%);
}
body {
	color: hsl(220,3%,36%);
}
.btn-info {
	background-color: hsl(206,100%,31%); 
	border-color: hsl(206,100%,31%); 
}
.btn-info:hover {
	background-color: hsl(206,100%,21%); 
	border-color: hsl(206,100%,19%); 
}
.text-primary {
	color: hsl(130, 31%, 50%);
}
.btn-primary {
	background-color: hsl(130, 31%, 50%);
	border-color: hsl(130, 31%, 48%);
}
.btn-primary:hover, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary,
.btn-primary:active:hover, .btn-primary.active:hover, .open>.dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open>.dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open>.dropdown-toggle.btn-primary.focus {
	background-color: hsl(130,31%,30%);
	border-color: hsl(130,31%,28%);
}
 

/* --- convert tabs to accordion at xs size. 
 * note: uses hidden-xs and visible-xs classes in the html source for specific element/widget visibility 
 * note2: uses a smattering of js to trigger the click on the standard tab when an accordion tab is clicked, to use the same behaviour */

@media screen and (max-width: 767px) {
	.tab-pane {
		padding: 0.33em 0.66em;
	}
	.tab-drawer-heading {
		position: relative;
		display: block;
		margin: 0.33em 0;
		padding: 0.33em 0.66em 0.33em 40px;
		color: white;
		background-color:  hsl(130,31%, 59%);
		border-color: hsl(130,31%,57%);
		cursor: pointer;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}
	.tab-drawer-heading:before {
		content: "▼";
		display: block;
		position: absolute;
		height: 20px;
		width: 20px;
		color: inherit;
		font-size: 16px;
		top: .8em;
		left: 15px;
		background: transparent
		transition: all .8s;
	}
	.tab-drawer-heading.on:before {
		transform: rotate(-90deg);
		top: 0.5em;
	}
	.tab-drawer-heading:hover, .tab-drawer-heading.on {
		background-color:  hsl(130,31%, 49%);
		color: black;
	}
}

/* --- fixes and hacks */

.top-spacing {
	margin-top: 1em;
}
/* strengthen tab appearance */
.nav-tabs>li>a {
	font-weight: bold;
}
/* equal height tabs */
.nav-tabs {
	display: flex;
}
.nav-tabs.nav-justified li {
	display: flex;
	flex: 1;
}
.nav-tabs.nav-justified li a {
	flex: 1;
}

.designcredit {
	text-align: right; /* do it here instead of trying to defeat an !important pull-right class on that paragraph */
}
.designcredit a:after {
    vertical-align: middle;
    content: "";
	color: hsl(270, 100%, 20%);
    display: inline-block;
    width: 28px;
    height: 28px;
    margin-left: 0.3em;
    background: hsla(0, 0%, 0%, 0) url(/images/mhglogo.png) scroll no-repeat 0 0;
	background-size: cover;
}
@media screen and (max-width: 767px) {
	footer p, .designcredit {
		float: none;
		text-align: center;
	}
	.btn-block {
		margin: 0.33em 0;
	}
}