/* General Styling */

body {
	background: #ffffff;
	color:#000000;
	font-family: 'Source Serif Pro', serif;
	font-size:1rem;
	font-style:normal;
	font-weight:400;
}

body .container {
	background-color: #ffffff;
}

a {
	color: #0066CC;
	font-weight:600;
	text-decoration:underline;
}

a:hover,
a:focus {
	color: #0066CC;
	text-decoration:none;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: 'Source Serif Pro', serif;
	font-style:normal;
	font-weight:500;
}

h1, h2, h3 {
	margin-top: 20px;
	margin-bottom: 10px;
}

/* Page Header */

header {
	background-color: transparent;
}

header .container {
	background-color: transparent;
	padding:10px 0;
}

header img {
    max-width: 100%;
    height: auto !important;
}

/* Navigation */

.navbar {
	background:#647844;
}

.navbar .offcanvas {
	background-color:#647844;
}
	
.navbar .offcanvas .nav-link {
	color:#ffffff;
	font-size:1.25rem;
	font-weight:600;
}

.navbar .offcanvas .nav-link:hover,
.navbar .offcanvas .nav-link:focus {
	background-color: #647844;
	color: #ffffff;
	opacity:0.7;
}

.navbar .offcanvas .nav-item.active .nav-link {
	background-color: #647844;
	color: #ffffff;
	opacity:0.7;
	font-weight:600;
}

.navbar-toggler {
	border:none;
	border-radius:0;
	filter:invert(0);
}

.navbar-toggler:hover,
.navbar-toggler:focus {
	background:#ffffff;
	filter:invert(0);
}

.navbar-toggler:hover .navbar-toggler-icon,
.navbar-toggler:focus .navbar-toggler-icon {
	filter:invert(1);
}

.navbar .offcanvas .offcanvas-header .btn-close {
	filter: invert(1);
	opacity:1;
}


/* Page Footer */

footer {
	background: #DEEDE6;
	color: #000000;
}

footer .container {
	background: transparent;
}

footer .container a {
	color: #000000;
	text-decoration:none;
}

footer .container a:hover,
footer .container a:focus {
	color: #000000;
	text-decoration:none;
}


/* Buttons */

.btn-primary {
	background-color: #647844;
	border:2px solid #647844;
	color: #ffffff;
}

.btn-primary:hover, 
.btn-primary:focus {
	background-color: #647844;
	border:2px solid #647844;
	color: #ffffff !important;
	opacity:0.7;
}

.btn-outline-primary, 
.btn-right, .btn-left {
	background-color: #ffffff;
	border: 2px solid #647844;
	color: #647844;
}

.btn-outline-primary:hover, .btn-outline-primary:focus, 
.btn-right:hover, .btn-left:hover, .btn-right:focus, .btn-left:focus {
	background-color: #e8ebee;
	border: 2px solid #647844;
	color: #647844;
	opacity:0.7;
}

/* Search Results */

.search-results-info h2 {
	color: #1A7672;
}

/* Modals */

.custom-knockout-modal .modal-content .modal-header {
	background-color: #647844;
}

.modal-header h1 {
    margin:0;
}

.modal-title {
	color: #ffffff;
}

.custom-knockout-modal .modal-content .modal-header .btn-close {
	filter: invert(1);
}

/*Home Page */

.searchinfo {
    display: grid;
    width: 100%;
    margin: 20px 0;
    grid-gap: 20px;
    text-align: center;
}

.search-boxes {
    display: flex;
    flex-flow: row wrap;
    grid-gap: 20px;
}

.homepageinfo a {
    color: #333333;
    text-decoration: none;
}

.search-box {
    border: 5px solid #647844;
    padding: 2px 5px;
}

.search-boxes .search-box {
    flex: 1 40%;
}

.search-box.scrollable {
    max-height: 440px;
    overflow-y: auto;
    text-align: left;
}

.search-box li {
    margin-bottom: 10px;
}

.search-box li a {
    color: #0066CC;
    text-decoration: underline;
}

.homepageinfo .search-box h2 {
    font-weight: 600 !important;
    color: #333333 !important;
    text-transform: uppercase;
}

.keywordsearch {
    text-align: left;
}

.keywordsearch a {
    text-decoration:none;
}

.homepageinfo p a {
    font-weight:400;
}

.homepageinfo h2 {
    font-size:24px;
    text-align: center;
}

/* Media Queries */

@media (max-width: 992px) {
    header .container {
        text-align:center;
    }
    header img {
    	max-width: 100%;
    	width: initial !important;
        height: auto !important;
    }
    .searchinfo .col-xs-6 {
        margin-top:20px;
    }
}

@media (min-width: 992px) {
    .searchinfo {
        grid-template-columns: 3fr 1fr;
    }
    .search-boxes .search-box {
        flex: 1 30%;
    }
}