/* SEARCH: overriding the search form block styling */
#block-search-form {
  background-color: #F2F4F7;
  padding-top: 50px;
  padding-bottom: 72px;
  padding-left: 30px;
  padding-right: 30px;
  margin-bottom: 50px;
  word-break: break-word;
  word-wrap: break-word;
}

#block-search-form  .block-title {
  font-size: 36px;
  font-family: 'Montserrat', sans-serif;
  letter-spacing: 0.6px;
  text-align: center;
}

#block-search-form .form-search .input-group .form-control,
.search-form .input-group .form-control {
  width: 100%;
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: 20px;
  padding-right: 10px;
}

#block-search-form .form-search .input-group .form-control {
  border: 1px solid #6F6F6F;
}

#block-search-form .form-search .input-group .form-control:focus {
  border: 2px solid #002D72;
}

#block-search-form .form-search .input-group .input-group-btn .btn,
.search-form .input-group .input-group-btn .btn {
  border-radius: 0 8px 8px 0;
  background-color: #002D72;
  padding-bottom: 9px;
}

#block-search-form .form-search .input-group .input-group-btn .btn {
  padding-top: 12px;
  padding-bottom: 12px;
}

#search-form .form-wrapper .input-group-btn .btn {
  padding-top: 12px;
  padding-bottom: 13px;
}

/* Search block on home page hidden button:
  <button class="element-invisible btn btn-primary form-submit" type="submit" id="edit-submit" name="op" value="Search">Search</button>
   Hiding duplicate search button with class `element-invisible` 
   to prevent invisible focus and prevent the screenreader from reading 2 search buttons
   and to create correct tab order. This is a temporary solution. */
#block-search-form #search-block-form .form-wrapper .btn.element-invisible {
  display: none;
}

/* Search page */
#page .node-basic-slideshow.basic-slideshow-style-2 .field-slideshow-wrapper, #colorbox .node-basic-slideshow.basic-slideshow-style-2 .field-slideshow-wrapper {
  position: relative;
}

/* search results listing */
.search-info {
  font-family: 'Roboto', sans-serif;
  font-weight: normal;
  font-size: 14px;
  font-style: normal;
  color: #7A7A7A;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}

.search-result + .search-result {
  margin-top: 32px;
}

@media (min-width: 600px) {
  #block-search-form .form-search {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
}

@media (min-width: 768px) {
  #block-search-form {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  #block-search-form .form-search {
    width: 50%;
  }
}

@media (min-width: 1024px) {
  #block-search-form .form-search {
    width: 35%;
  }
}