:root {
--op-khaki:#e4e6d0;
--op-khaki-light:#f2f3e0;
--op-orange:#e84004;
}

h1,h2,h3,h4,h5,h6 {color: #8b9060 !important}

#header_logo {max-height:140px;margin-top:4px !important;}
#header_title, #header_strapline, #header_logo {display:none;}

a {color:var(--op-orange);text-decoration:none;}
a:hover {text-decoration:underline}

#mainnav   {background-color: var(--op-khaki); margin-bottom:6px; }

.acsearch {width:130px;}

.small-text {font-size:small}

.table-fixed {table-layout:fixed}

th {font-weight:normal !important}

footer {background-color: var(--op-khaki); padding:1em;}

.innsersidepanel {border-top:1px solid #e4e6d0;padding-top:10px;}

.trademark {vertical-align:super;font-size:x-small;}

.card-op {background-color: var(--op-khaki-light);   margin-bottom:20px;}

/* Breadcrumbs */
ol.breadcrumb {background-color:white;padding-left:0;}
.breadcrumb-variety {margin-bottom:0.5rem;padding-bottom:0;}


/* Maps */
#map_canvas {
	height: 300px;
	width: 100%;
	margin: 10px auto;
}

/* Variety lists */
.varietieslist {
	padding-left:0;margin:0;list-style-position:outside;
	display:grid; grid-gap:18px; 
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); 
	grid-auto-rows: minmax(min-content, max-content); 
	width:100%;
	}
.varietieslist li {list-style-position:outside;list-style-type:none; min-height:300px}
/* .varietylistimage {float:left;margin-right:5px;} */
/* .varietylisttitle {font-size:20px;} */
.varietyidphotos {max-height:300px}

.crop {object-fit: cover; width:200px; height:125px;}



/* Variety page */
.varietyprimaryimage {display:block;max-width:400px;}

.ars-grin {height:313px;aspect-ratio: 1920 / 1200; object-fit:cover;}

/* Reviews */
.varietyscore-avg {color:gold;margin-bottom:1em;}
.varietyscore {color:gold;}
.varietyscore-varieties {color:gold;}
.reviewscount {color:#666}


/* JQuery UI overrides (do not include main JQuery UI CSS) */
.ui-autocomplete {
    position: absolute;
    z-index: 1000;
    cursor: default;
    padding: 0;
    margin-top: 10px;
    list-style: none;
    background-color: #ffffff;
    border: 1px solid #ccc;
}
.ui-autocomplete > li {
  padding: 3px 6px;
}

.ui-state-hover, .ui-state-active {
    color: white;
    text-decoration: none;
    background-color: #ccc;
    border-radius: 0px;
    background-image: none;
	padding: 2px 0px;
}



/* --------------------------------------------------------------------------------------- */


/* -sm- Small devices (tablets, 576px and up) */
@media (min-width: 576px) {

	#header_logo {display:initial;}
	#header_title {display:block;margin-top:4px !important;}

	.varietyscore-avg {text-align:right; margin-bottom:0;padding-top:1em;}
	.varietyscore {float:right}

	.navbar-brand {display:none !important}

}

/* -md- Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {


	#header_strapline {display:initial}

	#map_canvas {height: 600px;}

/*	.acsearch {max-width:200px;margin:16px auto;} */

/* 	.card-body > .acsearch {width:100%;margin:2px auto;} */

	.varietylistimage {float:none;display:block;}

	.varietyprimaryimage {float:right;margin-left:25px;}


}



/* -lg- Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

	.innsersidepanel {border-left:1px solid #e4e6d0;padding-left:20px; border-top:none;}
	.innsersidepanel h2 {font-size:x-large}

}

/* -xl- Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 


}