.main-wrapper {
  width: 500px; }

h1 {
  margin-bottom: 3rem; }

.action--item {
  padding-left: 8px; }

.action--item.active,
.action--item.active:hover {
  background-color: white;
  font-weight: bold;
  color: black;
  border-color: black;
  z-index: 10; }

.macro-settings {
  border: 1px solid black;
  border-top-color: #999;
  z-index: 100; }

.macro-settings .helper {
  position: absolute;
  display: block;
  height: 13px;
  background: #FFF;
  width: 100%;
  left: 0;
  top: -14px; }

.action--item.active.callout,
.macro-settings.callout {
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.5); }

.list-group-item .move-handle:hover {
  cursor: move; }

.action--edit {
  float: right; }

.action--edit:hover {
  color: #337ab7;
  cursor: pointer; }

.action--trash {
  float: right;
  margin-right: 1rem; }

.action--trash:hover {
  color: #d9534f;
  cursor: pointer; }

.action--edit__form {
  background-color: whtie;
  margin-left: -.5rem;
  margin-right: -15px;
  margin-top: 15px;
  padding-top: 15px;
  border-top: 1px solid #ddd; }

.flex-button-wrapper {
  display: flex;
  flex-direction: row-reverse; }

.flex-button {
  align-self: flex-end; }

.add-new__action-item:hover {
  cursor: pointer; }

.add-new__action-item--link,
.add-new__action-item--link:active,
.add-new__action-item--link:hover {
  text-decoration: none;
  color: #337ab7; }