header {

  background-color: @header-background-color;

  padding-top: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid #d9d9d9;

  #header-site-title {
    font-family: @header-site-title-type-font-family;
    font-weight: @header-site-title-type-font-weight;
    color: @header-site-title-type-color;
    text-transform: @header-site-title-type-text-transform;
    line-height: @header-site-title-type-font-size / 2;
    font-size: @header-site-title-type-font-size;
    .transition(color 0.2s linear);

    &:hover {
      color: darken(@header-site-title-type-color, 20%);
      text-decoration: none !important;
    }
  }

  .ccm-search-block-form {
    position: relative;
    &:before {
      content: "\f002";
      font-family: FontAwesome;
      font-weight: normal;
      font-style: normal;
      display: inline-block;
      position: absolute;
      left: 14px;
      top: 9px;
      text-decoration: inherit;
      color: @header-search-input-icon-color;
    }
    .ccm-search-block-text {
      border: 1px solid @header-search-input-border-color;
      color: @header-search-input-icon-color;
      border-radius: 30px;
      padding: 10px 20px 10px 35px;
      background-color: @header-search-input-background-color;

      &:focus {
        outline: 0;
      }
    }
  }

  nav {

    .dropdown{
      &:after {
        content: ' ▶';
      }
      &:hover {
        &:after {
          content:'\25bc';
        }
      }
    }

    ul {
      a {
        padding-right: 40px;
        font-family: @header-navigation-type-font-family;
        font-size: @header-navigation-type-font-size;
        font-weight: @header-navigation-type-font-weight;
        color: @header-navigation-type-color;
        text-transform: @header-navigation-type-text-transform;

        &:hover {
          color: @header-navigation-hover-color;
          text-decoration: none;
        }
      }
      -webkit-font-smoothing:antialiased;
      list-style: none;
      margin-top: 10px !important;
      padding: 0px 0px 0px 0px;
      float: right;

       li {
        &:hover {
          ul {
            opacity: 1;
            top: 30px;
            visibility: visible;
          }
        }
        margin: 0;
        padding: 0;
        padding-bottom: 10px;
        position: relative;
        display: inline-block;
        ul {
          li {
            &:hover {
              a {
                color: @header-navigation-menu-text-hover-color;
              }
            }
            a {
              &:hover {
                color: @header-navigation-menu-text-hover-color;
              }
              display: block;
              padding-bottom: 15px;
              font-size: 1.0em;
              text-transform: none;
              color: @header-navigation-menu-text-color;
              .transition(all .25s ease);
              font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
              font-weight: normal;
            }
            float: none;
            width: 100%;
            padding-bottom: 0px;
          }
          cursor: pointer;
          padding: 15px;
          padding-bottom: 0px;
          float: left;
          left: 0;
          opacity: 0;
          position: absolute;
          top: 20px;
          visibility: hidden;
          width: 200px;
          background-color: @header-navigation-menu-background-color;
          z-index: 99;
          .transition(all .25s ease);
          .border-radius(3px);
          border: 1px solid @header-navigation-menu-border-color;
        }
      }
    }
  }
}