/**
 * If using a CSS pre-processor, tell it to overwrite this file. If not, place
 * your custom CSS modifications here.
 */
 
 
/* Google font - Roboto 300, 400, 700 */
/* Google font - PT Serif 400, 700 */

/* WEBSITE STYLES */
html {
	scroll-behavior: smooth;
}
body {
	margin: 0px;
	padding: 0px;
	font-family: "Favorit", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 300;
	letter-spacing: .05em;
	line-height: 1.2em;
	color: #222;
}
.desktop { display: block !important; }
.desktop-inline { display: inline-block !important; }
.mobile, .mobile-inline { display: none !important; }

.dialog-off-canvas-main-canvas {
	display: block !important;
	position: relative;
	z-index: 0;
	width: 100%;
	height: 100%;
	margin: 0px auto 0px auto;
	padding: 0px;
}
.dialog-off-canvas-main-canvas main {
	float: none;
	position: relative;
	z-index: 0;
	width: 845px;
	height: auto;
	margin: 10px auto 0px auto;
	padding: 0px 30px 0px 30px;
}

div {
	box-sizing: border-box;
	word-wrap: break-word;
}
.row {
	clear: both;
	float: none;
}
.col-sm-12 {
	padding: 0px;
}
.clearfix {
	display: block;
	float: none;
	clear: both;
	width: 100%;
}
.hidden_content {
	display: none;
}

/* HORIZONTAL TABS */
@media all and (min-width:48em) {
	ul.nav-tabs li.nav-item {
		display: inline-block;
		border-top: none;
		border-bottom: none;
		background: none;
		font-size: var(--font-size-base);
	}
}

/* GLOBAL */
main p a {
	color: #57ff76;
	font-weight: normal;
	text-decoration: none;
}
main p a:hover {
	color: #57ff76;
	text-decoration: underline;
}
.region-content a {
	color: #222;
}
a.anchor {
	display: inline-block;
	position: relative;
	top: -180px;
	visibility: hidden;
}
.expand_link, .collapse_link {
	cursor: pointer;
	color: #57ff76 !important;
	text-decoration: none;
}
.expand_link:hover, .collapse_link:hover {
	text-decoration: underline;
}

a.button, .btn-primary {
	background-color: #57ff76;
	color: #222;
	padding: 10px 20px;
	border-radius: 0;
	border: 1px solid #57ff76;
}
a.button:hover {
	text-decoration: none;
	border: 1px solid #222;
	color: #222;
	background-color: transparent;
}
p.section-header {
	margin-bottom: 0;
}

p, .paragraph p:first-child {
	color: #000;
	line-height: 1.2em;
	font-weight: 400;
	font-size: 18px;
	letter-spacing: .05em;
	font-style: normal;
	margin-bottom: 1em;
}
p.title-case {
	font-size: 1.4em;
	font-weight: bold;
}
p.super_title {
	font-size: .75rem;
	font-weight: 400;
	letter-spacing: 1px;
	line-height: 1;
	text-transform: uppercase;
	margin-bottom: 1em;	
}
h1, h1.page-header {
	border-bottom: none;
	font-size: 34px;
	font-weight: 700;
	color: #000;
}
h1.page-header {
	margin-top: 1em;
}
p.smaller-font {
	font-size: .8em;
}
body.path-frontpage h1.page-header {
	display: none;
}
span.not-italicized {
	font-style: normal !important;
}
h1 {
	font-family: "Larken", helvetica, arial, sans-serif;
	font-size: 36px;
	color: #222;
	margin: 0 0 14px 0;
	padding: 0;
	font-weight: 500;
}
h2 {
	font-family: "Larken", helvetica, arial, sans-serif;
	font-size: 24px;
	color: #222;
	margin: 0 0 14px 0;
	padding: 0;
	font-weight: 500;
}
h3 {
	font-family: "Larken", helvetica, arial, sans-serif;
	font-size: 14px;
	color: #222;
	margin: 0 0 14px 0;
	padding: 0;
	font-weight: normal;
}
b, strong {
	font-weight: bold;
}
h1 a, h2 a, h3 a {
	text-decoration: none;
}
p {
	word-wrap: break-word;
}
.field ul li {
	margin-bottom: 1em;
}

.blue_text {
	color: #00395c;
}
.red_text {
	color: #af0000;
}
figcaption {
	font-style: italic;
}
.field__label {
	font-weight: 500;
}

.btn-primary, .btn:hover {
	background: #57ff76;
	padding: 10px 20px;
	border-radius: 4px;
	color: #000;
	border-color: #57ff76;
}
.btn:hover {
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
}

.vertical-tabs__menu-item a {
	color: #000 !important;
}

.align-left {
	margin: 0px 20px 20px 0px;
}
.align-right {
	margin: 0px 0px 20px 20px;
}

.center-this {
	display: block;
	text-align: center;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	margin: 0 auto;
}

.col-sm-6.left {
	padding-left: 0px;
	padding-right: 20px;
}
.col-sm-6.right {
	padding-left: 20px;
	padding-right: 0px;
}

form#node-media-asset-form > .js-form-type-vertical-tabs { display: none; }

/* COLUMNS */
.columns-wrapper {
	float: none;
	clear: both;
	width: 100%;
	display: flex;
	flex-flow: wrap;
	align-items: center;
	justify-content: center;
}
.columns-two .column {
	flex: 0 0 auto;
	width: calc(50% - 20px);
	min-width: 280px;
	margin: 0px auto 40px;
	padding: 0px 40px 0px 0px;
}
.columns-three .column {
	flex: 0 0 auto;
	width: calc(33% - 20px);
	min-width: 280px;
	margin: 0px auto 40px;
	padding: 0px 40px 0px 0px;
}
.columns-four .column {
	flex: 0 0 auto;
	width: calc(25% - 20px);
	margin: 0px auto 40px;
	padding: 0px 40px 0px 0px;
}
.columns-five .column {
	flex: 0 0 auto;
	width: calc(20% - 20px);
	margin: 0px auto 40px;
	padding: 0px 40px 0px 0px;
}
.columns-six .column {
	flex: 0 0 auto;
	width: calc(16.7% - 20px);
	margin: 0px auto 40px;
	padding: 0px 40px 0px 0px;
}
.column img {
	width: 100% !important;
	height: auto !important;
}

/* COLLAPSIBLE DRAWERS */
.drawer {
  display: none;
  border: 1px solid #222;
  padding: 20px;
}
a.trigger {
  position: relative;
  display: block;
  cursor: pointer;
  width: 100%;
  text-decoration: none;
  margin-bottom: .5em;
  font-weight: 500;
}
a.trigger:first-child {
	margin-top: 0px;
}
a.trigger.closed:after {
  position: relative;
  display: inline-block;
  content: '';
  width: 20px;
  height: 20px;
  margin-left: 10px;
  vertical-align: top;
  background: url('../images/chevron-down-solid.svg') center no-repeat;
}
a.trigger.opened:after {
  position: relative;
  display: inline-block;
  content: '';
  width: 20px;
  height: 20px;
	margin-left: 10px;
	vertical-align: top;
  background: url('../images/chevron-up-solid.svg') center no-repeat;
}


/* HEADER */
header {
	display: flex;
	width: 100%;
	height: 100px;
	margin: 0;
	padding: 10px 12%;
	color: #57FF76;
	background: #254E2B;
	border-bottom: 1px solid rgba(59,59,61,.5);
}
header .region-header {
	width: 66%;
}

header #block-sbbg-svgsitelogo {
	width: 100%;
	margin-top: 10px;
}
header #site-logo {
	width: 30%;
	float: left;
}
header svg.site-logo {
	height: 60px;
}
header svg.site-logo path {
	fill: #57ff76;
}
header #site-title {
	width: 70%;
	padding-top: 20px;
	float: right;
	font-size: 36px;
	text-align: center;
	text-transform: uppercase;
}

header .navbar {
	width: 33%;
}
header .navbar .d-flex {
	width: 100%;
}
header .navbar a, header .navbar a:visited, header .navbar a:link {
	color: #57ff76;
	font-size: 16px;
	text-decoration: none;
}
header .navbar a:hover {
	color: #57ff76;
	text-decoration: underline;
}
header #block-sbbg-account-menu {
	width: 100%;
}
header #block-sbbg-account-menu ul {
	margin-left: 0;
	text-align: right;
}
header #block-sbbg-account-menu ul li {
	display: inline-block;
}
header #block-sbbg-account-menu ul li a {
	padding: 5px 10px;
}


/* MAIN BODY */
.dialog-off-canvas-main-canvas main {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	background: #ececec;
}


/* HOMEPAGE */

/* HOME HERO */
.region-home-hero {
	width: 100%;
	height: auto;
	min-height: 80vh;
	margin: 0;
	padding: 10vh 20% 5vh;
	background: url('../images/sbbg-home-hero.jpg') center no-repeat;
	background-color: #000;
	background-size: cover;
}
.region-home-hero h1 {
	color: #fff;
	font-size: 80px;
	text-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
}
.region-home-hero #block-sbbg-exposedformsearch-media-assetspage-1 {
	margin-top: 100px;
	padding: 40px;
	border-radius: 5px;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
	background-color: rgba(255, 255, 255, 0.7);
}
.region-home-hero #block-sbbg-exposedformsearch-media-assetspage-1 h2 {
	text-align: center;
	font-size: 36px;
}
.region-home-hero #block-sbbg-exposedformsearch-media-assetspage-1 form {
	text-align: center;
}
.region-home-hero #block-sbbg-exposedformsearch-media-assetspage-1 form .js-form-item {
	float: none;
	margin: 0 auto;
	max-width: 500px;
}
.region-home-hero #block-sbbg-exposedformsearch-media-assetspage-1 form .js-form-item input {
	border: 1px solid #999;
}


/* HERO BANNERS */
#hero-banner {
	background: #254E2B;
}
#hero-banner .banner_wrapper {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding-left: 12%;
}
#hero-banner .banner_wrapper .banner_left {
	width: 45%;
	position: relative;
	padding-right: 50px;
}
#hero-banner .banner_wrapper .banner_left .banner_left_info {
	position: absolute;
	bottom: 50px;
}
#hero-banner .banner_wrapper .banner_left .super_title {
	font-size: .75rem;
	font-weight: 400;
	letter-spacing: 1px;
	line-height: 1;
	text-transform: uppercase;
	color: #57ff76;
	margin-bottom: 1em;
}
#hero-banner .banner_wrapper .banner_left h1 {
	font-size: 100px;
	line-height: 1;
	color: #57ff76;
	font-weight: 400;
}
#hero-banner .banner_wrapper .banner_left .banner_button {
	margin-top: 40px;
}
#hero-banner .banner_wrapper .banner_left .banner_button a {
	display: inline-block;
	padding: 10px 20px;
	color: #57ff76;
	border: 1px solid #57ff76;
	background-color: transparent;
	text-decoration: none;
}
#hero-banner .banner_wrapper .banner_left .banner_button a:hover {
	background-color: #57ff76;
	color: #254E2B;
}
#hero-banner .banner_wrapper .banner_right {
	width: 55%;
}
#hero-banner .banner_wrapper .banner_right .imagefield_slideshow-wrapper {
	border: none;
	padding: 0;
	margin: 0 auto -6px;
}
#hero-banner .banner_wrapper .banner_right .imagefield_slideshow-wrapper img {
	width: 100% !important;
	height: auto !important;
}


/* PAGE INTRO */
#page-intro {
	background: #fff;
	width: 100%;
	padding: 100px 12%;
	display: flex;
	flex-wrap: wrap;
}
#page-intro #block-sbbg-homeintro {
	width: 67%;
}


/* MAIN CONTENT */
.region-content {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 100px 20px;
}

/* SIDEBAR */
.region-sidebar-first {
	float: right;
	padding: 100px 20px;
	width: 100%;
	max-width: 300px;
}

/* MEDIA ASSET SEARCH */

#views-exposed-form-search-media-assets-page-1 .form-item-keys {
	width: 100%;
}
#views-exposed-form-search-media-assets-page-1 .form--inline .form-item {
	margin-right: 0;
}
#views-exposed-form-search-media-assets-page-1 .form-checkboxes ul {
	list-style-type: none;
	padding-left: 0;
}
#views-exposed-form-search-media-assets-page-1 .form-checkboxes ul li input {
}
#edit-secondary--2 {
	border: none;
	background-color: transparent;
}
#edit-secondary--2 > summary {
	display: none;
}
#edit-secondary--2 > .details-wrapper {
	padding: 0 !important;
}
#edit-secondary--2 > .details-wrapper .details-wrapper {
	padding: 10px;
}
.view-search-media-assets .view-content {
	display: block;
	width: 100%;
}
.view-search-media-assets .view-content .views-row {
	display: inline-block;
	width: 25%;
	margin: 0 20px 40px;
	vertical-align: top;
	text-align: center;
}
.view-search-media-assets .view-content .views-row .views-field-title {
	margin: .5em auto;
}
.view-search-media-assets .view-content .views-row a {
	color: #222;
	font-size: 20px;
	font-weight: 500;
	text-decoration: none;
}
.view-search-media-assets .view-content .views-row .views-field-field-asset-image {
	width: 100%;
	max-width: 300px;
	margin: 0 auto;
	overflow: hidden;
}
.view-search-media-assets .view-content .views-row .views-field-field-asset-image img {
	transition: all .5s;
}
.view-search-media-assets .view-content .views-row:hover .views-field-field-asset-image img {
	transform: scale(105%);
	overflow: hidden;
	transition: all .5s;
}

/* MEDIA ASSET DETAIL PAGES */
body.page-node-type-media-asset .region-content {
	width: 100%;
	max-width: unset;
	padding: 0;
}
.asset_info_container {
	width: 100%;
	max-width: 1220px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}
article.node--type-media-asset .node__content .field {
	margin-bottom: 1em;
}
article.node--type-media-asset .node__content .field .field__item p:last-child {
	margin-bottom: 0 !important;
}
article.node--type-media-asset .node__content .asset_image .field {
	overflow: hidden;
	cursor: pointer;
	margin-bottom: 0;
}
.field--name-field-asset-image {
	width: auto;
	margin: 0 auto;
}
.field--name-field-image-restrictions-note .field__label {
	margin-bottom: .5em;
}
.field--name-field-plant-names > .field__label {
	margin-bottom: .5em;
}
#asset_top_half {
	padding-top: 100px;
	background: #fff;
}
#asset_bottom_half {
	padding-top: 2em;
	margin-bottom: 4em;
}
#asset_top_half h2, #asset_bottom_half h2 {
	text-transform: normal;
}
#asset_middle {
	padding: 2em 20px;
	text-align: center;
/*	border-top: 1px solid #ccc; */
	border-bottom: 1px solid #ccc;
	background: #fff;
}
.asset_left_info, .asset_right_info {
	width: 50%;
}
.asset_left_info {
	padding-right: 50px;
	border-right: 1px solid #ccc;
}
#asset_top_half .asset_left_info {
	border: none;
}
#asset_top_half .asset_left_info .left_info_wrapper {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
#asset_top_half .asset_left_info .asset_info_block {
	padding-left: 0;
	margin-top: 2em;
}
.asset_right_info {
	padding-left: 50px;
}
#asset_top_half .asset_right_info {
	padding-left: 0;
}
.asset_info_block {
	padding-left: 30px;
	margin-bottom: 2em;
}
.asset_info_block .field__label, .asset_info_block .field__item {
	display: inline-block;
}
.view-convert-country-codes .views-row .views-field {
	margin-bottom: 1em;
}
.field--name-field-asset-image {
	text-align: center;
}
.field--name-field-asset-image img {
	transition: all .5s;
}
.field--name-field-asset-image:hover img {
	transform: scale(105%);
	overflow: hidden;
	transition: all .5s;
}
.asset_image.landscape img {
	width: 100% !important;
	height: auto !important;
}
.asset_image.portrait img {
	width: auto !important;
	height: 70vh;
	max-height: 70vh;
}
.plant_names > .field > .field__item {
	padding-left: 20px;
}
.plant_names .latin_name_wrapper {
	margin-bottom: 2em;
}
.plant_names .latin_name_wrapper .field {
	margin-bottom: .5em !important;
}
.field--name-field-collection .field__label {
	display: block;
	width: 100%;
}
.field--name-field-collection .view-content {
	padding-left: 20px;
}
.field--name-field-collection .views-field {
	margin-bottom: 1em;
}
.field--name-field-collection .views-field-title a {
	font-weight: 400;
}
.field--name-field-collection .views-field-body p {
	font-weight: 300;
}
.field--name-field-collection .views-field-field-collection-location .views-label {
	display: inline-block;
	font-weight: 500;
	float: left;
	margin-right: 10px;
}
#asset_top_half .field__label, #asset_top_half .field__item, #asset_top_half .field__item p {
	font-size: 22px;
	line-height: 1em;
}
#asset_top_half .field__item p {
	font-weight: 300;
}

/* COLORBOX */
#colorbox {
	height: auto !important;
}

/* FOOTER */
footer {
	background: #222;
}
footer .region-footer {
	width: 100%;
	max-width: 1220px;
	margin: 0 auto;
}
footer p {
	color: #fff;
}