/**
 * The base file that should be imported by every file.
 * There should be no CSS generation in this or from imported scss files at all!
 */
/**
 * Library
 */
/**
 * Variables and functions
 */
.content-image-cta p {
  font-size: 12px; }

.site-header.is-search-on #search .search-bar {
  opacity: 1;
  pointer-events: auto; }

.site-header.is-search-on #search .search-button .icon-close {
  display: block; }

.site-header.is-search-on #search .search-button .icon-search {
  display: none; }

#search {
  background-color: var(--wp--preset--color--gray);
  position: relative;
  z-index: 5; }
  @media (min-width: 1200px) {
    #search {
      background-color: transparent;
      position: static; } }
  #search .search-button {
    padding: 0;
    position: relative;
    border: 0;
    cursor: pointer;
    font-size: 15px;
    background: rgba(var(--wp--preset--color--white-rgb), 0.03);
    border-radius: var(--wp--custom--border-radius--normal);
    color: var(--wp--preset--color--white);
    width: 45px;
    height: 45px;
    justify-content: center;
    align-items: center;
    z-index: 2;
    display: none; }
    @media (min-width: 1200px) {
      #search .search-button {
        display: flex; } }
    #search .search-button span {
      cursor: pointer; }
    #search .search-button .icon-close {
      display: none; }
  #search .search-bar {
    padding: 0;
    overflow: hidden;
    z-index: 1; }
    @media (min-width: 1200px) {
      #search .search-bar {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        transition: opacity ease-in-out 200ms;
        opacity: 0;
        pointer-events: none;
        background-color: var(--wp--preset--color--gray);
        border-radius: var(--wp--custom--border-radius--normal);
        padding: 18px 85px 18px 0; } }
  #search form {
    display: flex;
    align-items: center;
    height: 100%;
    position: relative; }
    #search form input {
      flex: 2;
      width: 100%;
      height: 45px;
      border: 0;
      border-radius: var(--wp--custom--border-radius--normal);
      padding: 5px 5px 5px 50px;
      font-family: inherit;
      background-color: var(--wp--preset--color--foreground-light);
      color: var(--wp--preset--color--white); }
      @media (min-width: 1200px) {
        #search form input {
          background-color: var(--wp--preset--color--gray);
          height: 100%;
          padding: 5px 5px 5px 20px; } }
      #search form input::-moz-placeholder {
        padding-left: 0;
        color: rgba(var(--wp--preset--color--white-rgb), 0.5); }
      #search form input::placeholder {
        padding-left: 0;
        color: rgba(var(--wp--preset--color--white-rgb), 0.5); }
      #search form input:focus {
        outline: 0; }
      #search form input::-webkit-search-cancel-button {
        position: relative;
        right: 10px;
        -webkit-appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Cg fill='%23FFF' fill-rule='nonzero'%3E%3Cpath d='M9.5535714 8.66071426c.2465557.2465557.24655574.6463015 5e-8 .89285719-.2465557.24655569-.6463015.24655565-.89285719-4e-8L.44642857 1.3392857c-.24655569-.24655568-.24655569-.64630145 0-.89285714.2465557-.24655569.64630146-.24655569.89285714 0l8.2142857 8.2142857Z'/%3E%3Cpath d='M8.66071426.4464286c.2465557-.2465557.6463015-.24655574.89285719-5e-8 .24655569.2465557.24655565.6463015-4e-8 .89285719L1.3392857 9.55357143c-.24655568.24655569-.64630145.24655569-.89285714 0-.24655569-.2465557-.24655569-.64630146 0-.89285714l8.2142857-8.2142857Z'/%3E%3C/g%3E%3C/svg%3E");
        background-position: center;
        height: 10px;
        width: 10px;
        background-size: contain;
        background-repeat: no-repeat; }
    #search form button[type="submit"] {
      flex-basis: 45px;
      border: 0;
      font-size: 15px;
      color: var(--wp--preset--color--white);
      background-color: transparent;
      width: 45px;
      height: 45px;
      display: flex;
      justify-content: center;
      align-items: center;
      text-decoration: none;
      text-transform: lowercase;
      z-index: 1;
      padding: 0;
      position: absolute;
      top: 0;
      left: 0;
      cursor: pointer; }
      @media (min-width: 1200px) {
        #search form button[type="submit"] {
          position: static; } }
      #search form button[type="submit"]:focus {
        outline: 0; }

/*# sourceMappingURL=search-overlay.css.map */
