resources/web/style/nav.pcss

#guide {
  .navheader, .navfooter {
    /* TODO flex display? */
    .prev, .next {
      font-size: 14px;
      @media screen and (max-width: 800px) {
        font-size: 13px;
      }
      @media screen and (max-width: 500px) {
        font-size: 12px;
      }
    }
    .prev {
      float: left;
      width: 50%;
    }
    .next {
      text-align: right;
      width: 50%;
      display: inline-block;
      float: right;
    }
  }

  .breadcrumbs {
    font-size: 85%;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px dotted #ECECEC;
  }

  #title-page-breadcrumb {
    border-bottom: none;
    padding-bottom: 0;
  }

  .chevron-right {
    padding-left: 3px;
    padding-right: 7px;
    font-size: 14px;
    font-weight: 300;
  }

  .navheader {
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px;
    margin: 0;
    display: none;
    width: 100%;
  }

  .navfooter {
    border-top: 1px dotted #E8E8E8;
    padding-top: 10px;
    margin: 60px 0 15px;
  }

  .related-products-title {
    display:inline-block;
    margin-right:5px
  }

  .dropdown {
    position: relative;
    display: inline-block;
  
    .dropdown-anchor {
      cursor: pointer;
      display: inline-block;
      background-color: #f1f4fa;
      padding: 5px 10px;
      border-radius: 15px;

      &:after {
        content: url('data:image/svg+xml;utf8,<svg width="10" height="10" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" class="euiIcon euiIcon--small euiIcon--subdued euiIcon-isLoaded" focusable="false" role="img" aria-hidden="true"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.957 4.982a.75.75 0 011.06-.025l4.81 4.591a.25.25 0 00.346 0l4.81-4.59a.75.75 0 011.035 1.085l-4.81 4.59a1.75 1.75 0 01-2.416 0l-4.81-4.59a.75.75 0 01-.025-1.06z"></path></svg>');
        display: inline-block;
        float: right;
        padding: 2px 5px;
        width: 15px;
        height: 15px;
      }
    }

    .dropdown-content {
      display: none;
    }

    .dropdown-content.show {
      display: block;
      position: absolute;
      background-color: #fff;
      min-width: 300px;
      box-shadow: 0px 8px 16px 6px rgba(0,0,0,0.2);
      padding: 12px 16px;
      z-index: 1;
      margin-top: 12px;

      .dropdown-category {
        font-weight: 700;
        color: #343741
      }

      ul {
        list-style-type:none;
        margin-left: -16px;
        margin-top: 4px;
        margin-bottom: 4px;
      }

      &:before, &:after {
        content: '';
        display: block;
        position: absolute;
        bottom: 100%;
        width: 0;
        height: 0;
      }
      &:before {
        left: 100px;
        border: 11px solid transparent;
      }
      &:after {
        left: 100px;
        border: 10px solid transparent;
        border-bottom-color: #fff;
      }
    }
  }
}

 /* The classname is mispelled across the templates and on Elastic.co as well */
.breadcrum-wrapper a {
  font-size: 18px !important;
}