/**************************************************
  * SITE BRANDING REGION
  * (includes site logo, title, slogan, and search)
  *************************************************/
.region-site-branding {
  background-image: -moz-linear-gradient(top, #0779bf 0%, #48a9e4 100%);
  background-image: -ms-linear-gradient(top, #0779bf 0%, #48a9e4 100%);
  background-image: -o-linear-gradient(top, #0779bf 0%, #48a9e4 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #0779bf), color-stop(1, #48a9e4));
  background-image: -webkit-linear-gradient(top, #0779bf 0%, #48a9e4 100%);
  background-image: linear-gradient(top, #0779bf 0%, #48a9e4 100%);
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  flex-flow: row wrap;
  justify-content: space-between;
  margin: 0 0 0 0;
  padding: 8px 20px 8px 20px;
}
.region-site-branding .block-system-branding-block {
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: repeat(2, auto);
  grid-template-rows: repeat(2, auto);
  justify-content: start;
  flex-basis: 40%;
}
.region-site-branding .block-system-branding-block .contextual {
  bottom: unset;
  left: unset;
  right: -10px;
  top: 15px;
  padding-left: unset;
  padding-right: 0;
}
[dir="rtl"] .region-site-branding .block-system-branding-block .contextual {
  left: -10px;
  right: unset;
  padding-left: 0;
  padding-right: unset;
}
.region-site-branding .block-system-branding-block .site-logo {
  align-items: stretch;
  grid-row-start: span 2;
}
.region-site-branding .block-system-branding-block .site-logo > img {
  max-height: 80px;
  max-width: 120px;
}
.region-site-branding .block-system-branding-block .site-name {
  align-self: end;
  grid-column-start: 2;
  line-height: 1.6em;
}
.region-site-branding .block-system-branding-block .site-name > a {
  color: #333;
  text-decoration: none;
  font-size: 1.4em;
  font-weight: normal;
}
.region-site-branding .block-system-branding-block .site-name > a:hover {
  text-decoration: underline;
}
.region-site-branding .block-system-branding-block .site-slogan {
  align-self: start;
  color: #333;
  grid-column-start: 2;
}
.region-site-branding .block-search form {
  margin: 0 45px 0 0;
  padding: 0 0 0 0;
}
[dir="rtl"] .region-site-branding .block-search form {
  margin: 0 0 0 45px;
}
.region-site-branding .block-search form .search-button {
  background-color: transparent;
  border: none;
}
.region-site-branding .block-search .contextual {
  bottom: unset;
  left: unset;
  right: 0;
  top: 2px;
  padding-left: unset;
  padding-right: 0;
}
[dir="rtl"] .region-site-branding .block-search .contextual {
  left: 0;
  right: unset;
  padding-left: 0;
  padding-right: unset;
}
/* RESPONSIVE */
@media (max-width: 767px) {
  .region-site-branding .block-system-branding-block {
    margin: 0 0 1em 0;
    padding: 0 0 0 0;
    flex-basis: 100%;
  }
  .region-site-branding .block-system-branding-block .contextual {
    bottom: unset;
    left: unset;
    right: 0;
    top: 15px;
    padding-left: unset;
    padding-right: 0;
  }
  [dir="rtl"] .region-site-branding .block-system-branding-block .contextual {
    left: 0;
    right: unset;
    padding-left: 0;
    padding-right: unset;
  }
  .region-site-branding .block-search {
    flex-basis: 100%;
  }
}