﻿.standard-panels .slick-arrow {
   width: 36px;
   height: 36px;
   border: 1px solid var(--hl-dark-green);
   font-size: 0;
   background: url("/_assets/icon-line-arrow-hl-dark-green.png") center no-repeat;
   background-size: 17px auto;
}

.standard-panels .slick-arrow.white-background {
   background-color: #ffffff;
}

.standard-panels .slick-arrow.light-green-border {
   border-color: var(--hl-light-green);
}

.standard-panels .slick-arrow.light-green-arrow {
   background-image: url("/_assets/icon-line-arrow-hl-light-green");
}

.standard-panels .slick-arrow.light-green-border {
   border-color: var(--hl-light-green);
}

.standard-panels .slick-arrow:hover {
   background-color: var(--hl-light-green);
}

.standard-panels .slick-arrow.light-green-arrow:hover {
   background-image: url("/_assets/icon-line-arrow-hl-dark-green.png");
}

.standard-panels .slick-arrow.slick-prev {
   transform: rotate(180deg);
}

.standard-panels .carousel-controls {
   margin-top: 30px;

   display: flex;
   flex-direction: row;
   align-items: center;

   gap: 30px;
   justify-content: space-between;
}

.standard-panels .carousel-buttons {
   display: flex;
   flex-direction: row;
   gap: 20px;
   align-items: center;
}


.standard-panels.carousel-container .carousel { 
margin: 0 -10px;
}

.standard-knowhow-panel {
   display: inline-block;
   background-color: transparent;
   padding: 0;
}

.standard-knowhow-panel.slick-slide {
   padding-left: 10px;
   padding-right: 10px;
}

.standard-knowhow-panel .inner {
   color: inherit;
   padding: 0;
   background-color: #ffffff;
   border-top: 0px solid #f0f0f0;
   transition: all 0.2s;
}

.standard-knowhow-panel .inner > button {
   background-color: transparent;
   text-align: left;
   padding: 0;
   width: 100%;
}

.standard-knowhow-panel .tag {
   display: flex;
   flex-direction: row;
   padding: 0;
   align-items: center;
   justify-content: space-between;
   font-size: 12px;
   gap: 20px;
}

.standard-knowhow-panel .tag .type {
   display: flex;
   flex-direction: row;
   align-items: center;
   gap: 10px;
   line-height: 1.2em;
   font-family: Roobert, sans-serif;
	color: var(--hl-dark-green);
}

.standard-knowhow-panel .tag .type .icon {
   width: 45px;
   height: 45px;
   background-color: var(--hl-light-green);
   background-size: 28px auto;
   background-position: center;
   background-repeat: no-repeat;
}

.standard-knowhow-panel .tag .type img.panel-type {
   width: 21px;
}

.standard-knowhow-panel .tag .jurisdiction-icon {
   height: 28px;
   width: 28px;
   border-radius: 100%;
   box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.25);
}

.standard-knowhow-panel .tag.small {
   font-size: 11px;
}

.standard-knowhow-panel .jurisdictions {
   display: flex;
   flex-direction: row;
   gap: 5px;
   flex-wrap: nowrap;
   padding-right: 20px;
}

.standard-knowhow-panel .content {
   padding: 10px 20px 20px 20px;
}

.standard-knowhow-panel .content .date {
   font-family: Roobert, sans-serif;
   font-weight: 300;
   font-size: 13px;
   color: var(--hl-dark-green);
}

.standard-knowhow-panel div.title p {
   font-family: Roobert, sans-serif;
   font-weight: 400;
   color: var(--hl-dark-green);
   line-height: 1.2em;
   margin: 0;
}
   
.standard-knowhow-panel p.title {
   font-size: 18px;
}

.standard-knowhow-panel div.title p.subtitle {
   font-size: 14px;
   font-weight: 300;
   margin-top: 0.75em;
}

.standard-knowhow-panel .image {
   position: relative;
   width: 100%;
   height: 120px;
   margin-top: 20px;
   background-size: cover;
   background-position: center;
}

.standard-knowhow-panel .content .date {
   font-size: 12px;
}

.standard-knowhow-panel .inner .image .video-button {
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   opacity: 0.95;
}

.standard-knowhow-panel .inner:hover {
   background-color: #d8d8d8 !important;
}

.standard-knowhow-panel .article-date {
   display: flex;
   gap: 10px;
}

/*** ***/

.standard-knowhow-popup.knowhow-popup {
   background-color: rgba(0, 0, 0, 0.25);
}

.standard-knowhow-popup .close-knowhow-popup {
   position: absolute;
   display: block;
   width: 34px;
   height: 34px;
   background-color: transparent;
   top: 25px;
   right: 20px;
   z-index: 100;
   background-image: url("/_assets/icon-close-hl-dark-green.png");
   background-size: 16px;
   background-position: center;
   background-repeat: no-repeat;
   cursor: pointer;
}

.standard-knowhow-popup.knowhow-popup .tag {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-bottom: 10px;
   justify-content: space-between;
   padding-right: 20px;
}

.standard-knowhow-popup.knowhow-popup .tag .type {
   font-family: Roobert, sans-serif;
   font-size: 14px;
   font-weight: 400;
   color: var(--hl-dark-green);
   display: flex;
   gap: 10px;
   align-items: center;
   flex-basis: 100%;
}

.standard-knowhow-popup.knowhow-popup .tag .type .icon {
   width: 45px;
   height: 45px;
   background-color: var(--hl-light-green);
   background-size: 28px auto;
   background-position: center;
   background-repeat: no-repeat;
}

.standard-knowhow-popup.knowhow-popup .tag .jurisdictions {
   display: flex;
   flex-direction: row;
   gap: 5px;
}

.standard-knowhow-popup.knowhow-popup .tag .jurisdictions img {
   height: 28px;
   border-radius: 100%;
}

.standard-knowhow-popup.knowhow-popup .date {
   font-family: Roobert, sans-serif;
   font-weight: 400;
   font-size: 12px;
   text-align: left;
   color: var(--hl-dark-green);
}

.standard-knowhow-popup.knowhow-popup .title {
   font-family: Roobert, sans-serif;
   font-size: 25px;
   color: var(--hl-dark-green);
   margin: 0;
   line-height: 1.2;
}

.standard-knowhow-popup.knowhow-popup .content {
   font-family: Roobert, sans-serif;
   font-size: 16px;
   font-weight: 400;
   line-height: 1.2;
   color: var(--hl-dark-green);
}

.standard-knowhow-popup.knowhow-popup .content .intro {
   margin: 0;
}

.standard-knowhow-popup.knowhow-popup .button-container {
   margin-top: 20px;
}

.standard-knowhow-popup.knowhow-popup .btn-read-more {
   font-family: Roobert, sans-serif;
   font-size: 16px;
   font-weight: 400;
   border-color: var(--hl-light-green);
   background-color: var(--hl-light-green);
   color: var(--hl-dark-green);
}

.standard-knowhow-popup.knowhow-popup .video-container,
.standard-knowhow-popup.knowhow-popup .image {
   margin-top: 20px;
}

/*** ***/

.standard-title-and-filter {
   margin-bottom: 20px;
   z-index: 20;
}

.standard-title-and-filter .col-1 {
   display: flex;
   flex-direction: row;
   gap: 20px;
   justify-content: space-between;
}

.standard-title-and-filter .col-1 h2.section-title {
   margin-bottom: 0;
}

.standard-filter {
   display: flex;
   flex-direction: row;
   gap: 10px;
}

.standard-filter-field {
   font-family: Roobert, sans-serif;
   font-weight: 400;
   font-size: 14px;
   display: flex;
   flex-direction: row;
   gap: 10px;
   align-items: center;
   flex-shrink: 0; 
}

.standard-filter-field > label {
   font-weight: 500;
   flex-shrink: 0;
   color: var(--hl-dark-green);
}

.standard-filter-field.sff-label-above { 
   flex-direction: column;
   align-items: start;
   gap: 8px; 
}

.standard-filter-field .dk-select, .dk-select *,
.standard-filter-field .dk-select *:before,
.standard-filter-field .dk-select *:after,
.standard-filter-field .dk-select-multi,
.standard-filter-field .dk-select-multi *,
.standard-filter-field .dk-select-multi *:before,
.standard-filter-field .dk-select-multi *:after {
   font-family: Roobert, sans-serif;
   color: var(--hl-dark-green);
   font-weight: 300;
}

.standard-filter-field .dk-select-options {
   background-color: var(--hl-light-taupe);
}

.standard-filter-field .dk-selected {
   background-color: var(--hl-light-taupe);
   border-color: var(--hl-light-taupe);
   font-family: Roobert, sans-serif;
   font-weight: 300;
   color: var(--hl-dark-green);
   min-width: 170px;
   max-width: 190px;
}

.standard-filter-field .dk-select.wide-dd-400 .dk-select-options,
.standard-filter-field .dk-select-multi.wide-dd-400 .dk-select-options { 
   width: 400px;
   max-width: 400px;
}

.standard-filter-field .dk-select-open-down:not(.dk-always-open-up) .dk-select-options {
   padding: 10px;
}

.standard-filter-field .dk-select-options-highlight .dk-option-selected,
.standard-filter-field .dk-option-selected {
   background-color: rgba(var(--hl-dark-green-rgb), 0.15);
   color: var(--hl-dark-green);
}

.standard-filter-field .dk-select-options .dk-option-highlight {
   background-color: rgba(var(--hl-dark-green-rgb), 0.2);
   color: var(--hl-dark-green);
}

.standard-filter-field .dk-checkboxes li.dk-option:before {
   left: 5px;
   border-color: var(--hl-dark-green);
}

.standard-filter-field .standard-search-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   gap: 10px;
   border: 1px solid var(--hl-light-taupe);
   background-color: var(--hl-light-taupe);

   padding: 8px 10px;
}

.standard-filter-field .standard-search-container {
   width: 100%;
}

.standard-filter-field .standard-search-container input[type=button] {
   display: inline-block;
   width: 20px;
   height: 20px;
   background-image: url("/_assets/icon-search-hl-dark-green.png");
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
}

.standard-filter-field .standard-search-container input[type=text] {
   font-family: Roobert, sans-serif;
   font-weight: 400;
   font-size: 14px;
   color: var(--hl-dark-green);
   position: static;
   padding: 0;
}