/* Copyright (c) 2012 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file. */

/* NOTE: If you are using the drop-down style, you must first call
 * MenuButton.createDropDownArrows() to initialize the CSS canvases that
 * contain the arrow images. */

button.menu-button.drop-down {
  background: white -webkit-canvas(drop-down-arrow) no-repeat center 4px;
  border: 1px solid rgb(192, 195, 198);
  border-radius: 2px;
  height: 12px;
  margin: 0 5px;
  padding: 0;
  position: relative;
  top: 1px;
  width: 12px;
}

button.menu-button.drop-down:hover {
  background-image: -webkit-canvas(drop-down-arrow-hover);
  border-color: rgb(48, 57, 66);
}

button.menu-button.drop-down[menu-shown],
button.menu-button.drop-down:focus {
  background-color: rgb(48, 57, 66);
  background-image: -webkit-canvas(drop-down-arrow-active);
  border-color: rgb(48, 57, 66);
}

button.menu-button.using-mouse {
  outline: none;
}