.dropdown_menu {
  display: inline;

  .dropdown_menu_button {
    //@include light-button;
    position: relative;
    padding-right: 22px !important;
    cursor: pointer;

    &:before {
      content: ' ';
      position: absolute;
      width: 0;
      height: 0;
      border-width: 3px 3px 0;
      border-style: solid;
      border-color: #FFF transparent;
      right: 12px;
      top: 45%;
    }

    &:after {
      content: ' ';
      position: absolute;
      width: 0;
      height: 0;
      border-width: 3px 3px 0;
      border-style: solid;
      border-color: darken($skinActiveColor, 30%) transparent;
      right: 12px;
      top: 45%;
    }
  }

  .dropdown_menu_nipple {
    // The nipple's border
    content: "";
    position: absolute;
    top: -6px;
    display: block;
    width: 0;
    height: 0;
    border-width: 0 6px 6px;
    border-style: solid;
    border-color: darken($primary-color, 4%) transparent;
    z-index: 3000;

    // The nipple's inner shadow

    &:before {
      content: ' ';
      position: absolute;
      width: 0;
      height: 0;
      border-width: 0 7px 7px;
      border-style: solid;
      border-color: darken($skinActiveColor, 10%) transparent;
      left: -7px;
      top: 1px;
    }

    // The nipple's background color

    &:after {
      content: ' ';
      position: absolute;
      width: 0;
      height: 0;
      border-width: 0 7px 7px;
      border-style: solid;
      border-color: darken($skinActiveColor, 30%) transparent;
      left: -7px;
      top: 0px;
    }
  }

  .dropdown_menu_list_wrapper {
    display: inline-block;
    position: absolute;
    background-color: white;
    padding: 2px;

    //box-shadow: rgba(0,0,0,0.4) 0 1px 3px, lighten($primary-color, 15%) 0px 1px 0px 0px inset;
    background-color: $primary-color;

    //border: solid 1px darken($primary-color, 10%);
    //border-top-color: darken($primary-color, 4%);
    //border-bottom-color: darken($primary-color, 17%);

    border-radius: 4px;
    background-color: darken($skinActiveColor, 30%);

    //background-color: $primary-color !important;
    //border: solid 1px $primary-color !important;

    .dropdown_menu_list {
      display: block;
      background-color: #FFF;
      border: solid 1px darken($skinActiveColor, 30%);

      //box-shadow: lighten($skinActiveColor, 15%) 0px 1px 0px 0px;
      border-radius: 3px;
      margin: 0;
      overflow: hidden;
      padding: 8px;
      list-style-type: none;
      padding: 0;
      z-index: 3000;
      position: relative;

      li {
        display: block;

        //border-bottom: solid 1px #ebebeb;
        box-sizing: border-box;

        a {
          display: block;
          box-sizing: padding-box;
          font-size: 0.95em;
          font-weight: bold;
          padding: 7px 16px 5px;
          text-decoration: none;
          text-align: center;
          -webkit-font-smoothing: antialiased;
          color: $skinActiveColor;
          transition: $link_transition_dutarion;

          &:hover {
            //@include highlight-gradient;
            //@include text-shadow(#5a83aa);
            background: lighten($skinActiveColor, 10%);
            color: #FFF;
          }

          &:active {
            @include reverse-highlight-gradient;

            color: #FFF;
          }
        }

        &:first-child {
          a {
            border-top-left-radius: 2px;
            border-top-right-radius: 2px;
          }
        }

        &:last-child {
          a {
            border-bottom-left-radius: 2px;
            border-bottom-right-radius: 2px;
          }

          border: none;
        }
      }
    }
  }
}