@charset "UTF-8";
/*** Pollinators Custom Styles ***/
/* need these variables to pre-process */
/* need these variables to pre-process */
.bg-pollinators-yellow {
  background-color: var(--ps-keystone-yellow-300);
}

@media (min-width: 768px) {
  .bg-honeycomb {
    background-image: url("/assets/uploads/globals/bg-custom-pollinators-honeycomb.svg");
    background-position: right top;
    background-size: contain;
  }
}

.field-guide-card {
  border: 1px solid var(--ps-limestone-gray-150);
  padding: var(--spacing-medium-small);
}
.field-guide-card h3 {
  padding-top: 0;
}
.field-guide-card h3 + p {
  margin-top: 0;
  padding-top: 0;
}
.field-guide-card p.botanical-name {
  font-style: italic;
}
.field-guide-card p.plant-detail,
.field-guide-card .plant-details p {
  padding-top: var(--spacing-small);
  line-height: var(--line-height-base);
}
.field-guide-card img {
  width: auto;
  height: 20vh;
  margin: 0 auto;
}
@media (min-width: 576px) {
  .field-guide-card img {
    height: 27.5vh;
  }
}
.field-guide-card .plant-detail span,
.field-guide-card .plant-details span {
  font-weight: var(--font-weight-bold);
  color: var(--ps-creek-600);
  display: inline-block;
  margin-right: var(--spacing-xx-small);
}
.field-guide-card .plant-detail span.plant-detail-option,
.field-guide-card .plant-details span.plant-detail-option {
  font-weight: var(--font-weight-regular);
  color: var(--primary-text-color);
}
.field-guide-card .plant-detail span.plant-detail-option::after,
.field-guide-card .plant-details span.plant-detail-option::after {
  content: "•";
  color: var(--ps-creek-600);
  padding-left: var(--spacing-xx-small);
  font-weight: var(--font-weight-bold);
}
.field-guide-card .plant-detail span.plant-detail-option:last-of-type::after,
.field-guide-card .plant-details span.plant-detail-option:last-of-type::after {
  content: none;
}
.field-guide-card .plant-detail img,
.field-guide-card .plant-details img {
  height: var(--spacing-medium-small);
  width: auto;
  margin: 0 var(--spacing-xx-small);
  display: inline-block;
  vertical-align: middle;
}

.field-guide-card .plant-details .details-bar {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin-right: 2px;
  flex-direction: column;
  text-align: center;
  min-width: 4rem;
}
.field-guide-card .plant-details .details-bar span {
  font-size: var(--small-2);
  font-weight: var(--font-weight-regular);
  color: var(--primary-text-color);
  margin-right: 0;
}

.field-guide-card .plant-details .details-label {
  min-width: 4rem;
}
.field-guide-card .plant-details .details-label p {
  padding-top: 0;
}

.water-details,
.sun-details {
  display: flex;
  align-items: center;
  padding-top: var(--spacing-small);
}

/*
.water-details {
	padding-bottom: var(--spacing-small);
	}
.sun-details {

	.sun-details-shade {
		background-color: #97DC99;
		}

	.sun-details-partial {
		background: linear-gradient(to right, rgba(151,220,153,1) 0%,rgba(255,230,83,1) 100%);
		}

	.sun-details-sun {
		background-color: #FFE653;
		}	
	}

.water-details {

	.water-details-low {
		background-color: #D5E8F8;
		}

	.water-details-moderate {
		background: linear-gradient(to right, rgba(213,232,248,1) 0%,rgba(159,203,238,1) 100%);
		}

	.water-details-high {
		background-color: #9FCBEE;
		}	
	}
*/
.plant-phenology-graph {
  width: 100%;
  height: var(--spacing-standard);
  border: 1px solid var(--ps-limestone-gray-200);
}

.plant-phenology-months {
  display: flex;
  width: 100%;
}
.plant-phenology-months ol {
  list-style-type: none;
  display: flex;
  justify-content: space-between;
  padding-left: 0;
  width: 100%;
  color: var(--ps-black-350);
  margin-top: var(--spacing-xx-small);
  margin-bottom: var(--spacing-xx-small);
}
.plant-phenology-months ol li {
  display: inline-flex;
}

@media (min-width: 768px) {
  .field-guide .preview-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1080px) {
  .field-guide .preview-cards {
    grid-template-columns: repeat(6, 1fr);
    /* default is 2-up - 2/6 */
    /* convert to 2-up 3/6 */
  }
  .field-guide .preview-cards .field-guide-card {
    grid-column: span 3;
  }
  .field-guide .preview-cards .field-guide-card:first-child:nth-last-child(2),
  .field-guide .preview-cards .field-guide-card:first-child:nth-last-child(2) ~ *,
  .field-guide .preview-cards .field-guide-card:first-child:nth-last-child(3n+1),
  .field-guide .preview-cards .field-guide-card:first-child:nth-last-child(3n+1) ~ * {
    grid-column: span 3;
  }
}

.channel-listing-imageLibrary .preview-cards-wrap.preview-cards-wrap-rows .preview-cards .card-row:hover .block-content h3 {
  text-decoration: none;
}

.channel-listing-imageLibrary a:link,
.channel-listing-imageLibrary a:visited {
  color: var(--link-color);
}

.channel-listing-imageLibrary a:link:hover,
.channel-listing-imageLibrary a:visited:hover {
  text-decoration: underline;
}

.channel-listing-imageLibrary .card-row ul.list-inline {
  padding-left: 0;
}
.channel-listing-imageLibrary .card-row ul.list-inline li {
  padding: var(--spacing-minimum) var(--spacing-x-small) var(--spacing-minimum) 0;
}

.channel-listing-imageLibrary figcaption {
  color: var(--link-color);
}
.channel-listing-imageLibrary figcaption:hover {
  text-decoration: underline;
}

.channel-listing-imageLibrary .preview-cards-wrap.preview-cards-wrap-rows .card-row:hover {
  background-color: transparent;
}
