@mixin search-box {

  //property selector
  #main-menu .search-box-trigger{
    background: #ffffff url(../images/chi-search.svg) no-repeat right 1px !important;
    background-size: 30px 30px !important;
    width: 30px;
    height: 30px;
    border-style: none !important;
    float: right;

    .ember-power-select-status-icon {
      display: none !important;
    }
  }

  //this need to be in global scope because power selections opens up in worm hole.
  //so it is recommended to have a different drop down style
  .search-box-result-dropdown {
    width: auto !important;
    right: 45px;
    left: unset !important;
  }

/*
  #main-menu .search-box-trigger.ember-power-select-trigger {
    background: #ffffff url(../images/chi-search.svg) no-repeat right 1px !important;
    background-size: 30px 30px !important;
    width: 30px;
    height: 30px;
    border-style: none !important;
    float: right;

    .ember-power-select-status-icon {
      display: none !important;
    }
  }

  .ember-basic-dropdown-content.search-box-result-dropdown {
    right: 0px;
    float: right !important;
    width: 214px !important;
    left: auto !important;
    border-bottom-left-radius: 2px !important;
    border-bottom-right-radius: 2px !important;

    .ember-power-select-options {
      display: none;
    }
  }*/

}