// Custom styling to the Google Custom Search used in `_includes/header-global.html` & `_includes/nav-global.html` // ================================================== // Styling for the Google Custom Search used in the `_includes/header-global.html` version of the nav // ================================================== .header-global__search-collapse #___gcse_0:hover gsc-iw-id1, .header-global__search-collapse #___gcse_0:focus gsc-iw-id1 {

filter: drop-shadow(2px 2px 6px rgba(128,128,128, 0.5));

}

.header-global__search-collapse gsc-iw-id1 {

border-radius: 2rem;
padding-left: .5rem;
border: solid thin $grey-5;
line-height: 1;
padding-top: 3px;
padding-bottom: 3px;

}

.header-global__search-collapse .gsc-search-button-v2 {

background-color: transparent !important;
border: none !important;
pointer-events: auto;
position: relative;
right: -0.5rem;
top: -.25rem;
transition-property: right;
transition-duration: .2s;

}

.header-global__search-collapse button.gsc-overrides__clear-x {

right: .5rem;
padding-right: 5px !important;

}

@media screen and (min-width: 992px) {

.header-global__search-collapse .gsc-search-button-v2 {
  top: 0;
  right: .5rem;
}

.header-global__search-collapse button.gsc-overrides__clear-x {
  right: 1.125rem;
  padding-right: 5px !important;
}

}

.header-global__search-collapse .gsst_a .gscb_a {

vertical-align: middle;

}

.header-global__search-collapse .gsc-search-button-v2 svg {

fill: $primary-blue !important;
height: 1.25rem;
width: 1.25rem;
transition-property: fill;
transition-duration: .2s;

}

.header-global__search-collapse .gsc-search-button-v2:hover svg, .header-global__search-collapse .gsc-search-button-v2:focus svg {

fill: $primary-red !important;

}

.header-global__search-collapse td.gsc-search-button {

display: inline;
pointer-events: none;
position: absolute;
right: 50px;

}

@media screen and (min-width: 1400px) {

.header-global__search-collapse td.gsc-search-button {
  right: 44px;
}

}

.header-global__search-collapse .gsc-search-box-tools .gsc-search-box .gsc-input {

padding-right: 0 !important;

}