/*
 * jQuery simpleMultiComboBox - v0.0.1
 * 
 * Author: SOASTA / C.J.Thomas
 * 
 * 01 May 2014
 * 
 */

/*
  Common CSS Properties
  ---------------------
  These properties will be applied to any themes that you use
*/

.simpleMultiComboBox-container {
  position:         relative;
  display:          inline-block;
  vertical-align:   top;
}


/* ========================= The List Dropdown ========================= */
.simpleMultiComboBox-container .dropdown {
  width:            auto;
  
  -moz-box-sizing:  content-box;
  box-sizing:       content-box;
  min-width:        100%;
  
  position:         absolute;
  top:              calc(100% + 1px);
  
  text-align:       left;
    
  margin:           0;
  padding:          0px;
  
  border:           1px solid hsl(213, 7%, 78%);
  border-radius:    6px;
  
  box-shadow:       0 0 22px hsla(213, 40%, 20%, 0.3), 1px 6px 2px hsla(213, 40%, 10%, 0.4);
  
  background:       white;

  z-index:          9999999999999;

  opacity:          0;
  display:          none;

  transition:       visibility 0ms linear 100ms, opacity 100ms ease-in-out 0ms;
}
.simpleMultiComboBox-container .selectboxit-container.display ~ .dropdown {
  display:          block;
}
.simpleMultiComboBox-container .selectboxit-container.opened ~ .dropdown {
  opacity:          1.0; 
  transition:       visibility 0ms linear 0ms, opacity 200ms ease-in-out 0ms;
}
#dashboard_filter_criteria_table .simpleMultiComboBox-container .dropdown {
  box-shadow:       0 0 12px hsla(213, 40%, 20%, 0.1), 0px 4px 2px hsla(213, 40%, 10%, 0.1);
}

.darkTheme .simpleMultiComboBox-container .dropdown {
  background:           hsla(213, 5%, 12%, .95);
  border:               1px solid hsl(213, 3%, 44%);
  box-shadow:           0 0 12px hsla(213, 50%, 60%, .4), 0 0 80px hsla(213, 50%, 60%, .3);
}
.darkBlueTheme .simpleMultiComboBox-container .dropdown {
  background:           hsla(200, 75%, 18%, .95);
  border:               1px solid hsl(200, 30%, 48%);
  box-shadow:           0 0 8px hsla(200, 100%, 80%, .4), 0 0 80px hsla(200, 100%, 50%, .3);
}

.simpleMultiComboBox_firstColumn_topDropdownSelector {
  border-bottom:        1px solid hsl(211, 17%, 76%);
  padding:              3px 9px 5px 9px;
  width:                auto;
}
.darkTheme .simpleMultiComboBox_firstColumn_topDropdownSelector {
  border-bottom:        1px solid hsl(213, 10%, 35%);
}
.darkBlueTheme .simpleMultiComboBox_firstColumn_topDropdownSelector {
  border-bottom:        1px solid hsl(200, 50%, 40%);
}

.simpleMultiComboBox_firstColumn_topDropdownSelector select {
  color:                hsl(213,0%,50%) !important;
  height:               18px;
  
  -moz-box-shadow:      inset 0 1px 1px hsla(213,30%,15%,.05),inset 0 2px 2px hsla(213,30%,15%,.05);
  -webkit-box-shadow:   inset 0 1px 1px hsla(213,30%,15%,.05),inset 0 2px 2px hsla(213,30%,15%,.05); 
  box-shadow:           inset 0 1px 1px hsla(213,30%,15%,.05),inset 0 2px 2px hsla(213,30%,15%,.05);
  
  background-color:     #d8dbdf;
  border:               1px solid hsl(211,17%,76%);
  
  line-height:          12px;
  width:                100%;
}
.darkTheme .simpleMultiComboBox_firstColumn_topDropdownSelector select {
  color:                hsl(213, 5%, 55%) !important;

  -moz-box-shadow:      none;
  -webkit-box-shadow:   none; 
  box-shadow:           none;
}
.darkTheme .simpleMultiComboBox_firstColumn_topDropdownSelector select:hover {
  color:                hsl(213, 5%, 75%) !important;

  -moz-box-shadow:      none;
  -webkit-box-shadow:   none; 
  box-shadow:           none;
}
.darkBlueTheme .simpleMultiComboBox_firstColumn_topDropdownSelector select {
  color:                hsl(200, 50%, 85%) !important;

  -moz-box-shadow:      none;
  -webkit-box-shadow:   none; 
  box-shadow:           none;
}
.darkBlueTheme .simpleMultiComboBox_firstColumn_topDropdownSelector select:hover {
  color:                hsl(200, 50%, 98%) !important;

  -moz-box-shadow:      none;
  -webkit-box-shadow:   none; 
  box-shadow:           none;
}



/* ================== Lists, Groups & Titles ================= */
.simpleMultiComboBox-container .group_title {
  color:            hsl(213,5%,20%);
  font-size:        15px;
  backgroundx:       black;
  padding:          .3em 0 0 .6em;
  line-height:      1.3em;
}
.darkTheme .simpleMultiComboBox-container .group_title {
  color:            hsl(213,5%,90%);
}
.darkBlueTheme .simpleMultiComboBox-container .group_title {
  color:            hsl(200, 5%, 90%);
}

.simpleMultiComboBox-container .group_divider {
  width:            85%;
  height:           1px;
  
  margin:           0 auto .9em auto;
  
  background:       hsl(213,0%,80%);
}
.darkTheme .simpleMultiComboBox-container .group_divider {
  background:       hsl(213, 5%, 30%);
}
.darkBlueTheme .simpleMultiComboBox-container .group_divider {
  background:       hsl(200, 5%, 30%);
}

.simpleMultiComboBox-container ul {
  width:            100%;
  
  font-size:        11px;
    
  list-style:       none;
  
  padding:          0;
  margin:           .2em 0 0 0;
  overflow-x:       hidden;
  overflow-y:       auto;
}
@media only screen and (max-width : 1250px){
  
  .tileMode .simpleMultiComboBox-container ul {
    font-size:        11px;
  }
}

.simpleMultiComboBox-container .group_container.single_column_mode {
  border-bottom:    1px solid hsl(213, 10%, 75%);
}
.darkTheme .simpleMultiComboBox-container .group_container.single_column_mode {
  border-bottom:    1px solid hsl(213, 10%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container .group_container.single_column_mode {
  border-bottom:    1px solid hsl(200, 50%, 40%);
}


.simpleMultiComboBox-container .group_container.single_item_group {
  border-bottom:    0px solid transparent;
}
.simpleMultiComboBox-container .group_container.single_item_group ul {
  margin:           .2em 0 0 0;
}

.simpleMultiComboBox-container ul li {
  width:            auto;
  white-space:      nowrap;
  padding:          0 1.0em .3em 0.8em;
  display:          table;
}
.simpleMultiComboBox-container ul li.exclusive_group_item {
  width:             100%;
  padding:           0 8px 1px 8px;
  border:            1px solid transparent;
}
.simpleMultiComboBox-container ul li.exclusive_group_item.last_item {
  border-bottom-color:  hsl(213, 10%, 75%);
}
.darkTheme .simpleMultiComboBox-container ul li.exclusive_group_item.last_item {
  border-bottom-color:  hsl(213, 10%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container ul li.exclusive_group_item.last_item {
  border-bottom-color:  hsl(200, 50%, 40%);
}

.simpleMultiComboBox-container .group_container {
  overflow-x:       hidden;
  overflow-y:       auto;  
  
  min-width:        150px;
  max-width:        200px;
}

.simpleMultiComboBox-container .first_column {
  display:          table-cell;
  border-bottom:    1px solid hsl(213,0%,80%);
  border-right:     1px solid hsl(0,0%,80%);
  min-width:        150px;
  max-width:        200px;
}
.darkTheme .simpleMultiComboBox-container .first_column {
  border-bottom:    1px solid hsl(213, 5%, 35%);
  border-right:     1px solid hsl(213, 5%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container .first_column {
  border-bottom:    1px solid hsl(200, 30%, 40%);
  border-right:     1px solid hsl(200, 30%, 40%);
}


.simpleMultiComboBox-container .second_column {
  background:       hsl(220, 18%, 96%);
  display:          table-cell;
  border-bottom:    1px solid hsl(213,0%,80%);
  min-width:        150px;
  max-width:        200px;
}
.darkTheme .simpleMultiComboBox-container .second_column {
 background:       hsla(213, 5%, 18%, .95);
  border-bottom:    1px solid hsl(213, 5%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container .second_column {
  background:       hsla(200, 75%, 22%, .95);
  border-bottom:    1px solid hsl(200, 50%, 40%);
}


.darkTheme .simpleMultiComboBox-container .currentlySelected_container {
  border-bottom:    1px solid hsl(213, 10%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container .currentlySelected_container {
  border-bottom:    1px solid hsl(200, 50%, 40%);
}


.simpleMultiComboBox-container .currentlySelected_title {
  padding:          .2em .8em .2em .8em;
  height:           17px;
  border-bottom:    1px solid hsl(213, 0%, 80%);
}
.darkTheme .simpleMultiComboBox-container .currentlySelected_title {
  border-bottom:    1px solid hsl(213, 10%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container .currentlySelected_title {
  border-bottom:    1px solid hsl(200, 50%, 40%);
}

 
.darkTheme .simpleMultiComboBox-container .currentlySelected_title {
  color:            hsl(213, 10%, 60%);
}
.darkBlueTheme .simpleMultiComboBox-container .currentlySelected_title {
  color:            hsl(200, 20%, 65%);
}

.darkTheme .simpleMultiComboBox-container .recentlySelected_container {
  border-bottom:    1px solid hsl(213, 5%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container .recentlySelected_container {
  border-bottom:    1px solid hsl(200, 50%, 40%);
}

.simpleMultiComboBox-container .recentlySelected_title {
  padding:          .2em .8em .2em .8em;
  height:           17px;
  border-bottom:    1px solid hsl(213, 5%, 80%);
}
.darkTheme .simpleMultiComboBox-container .recentlySelected_title {
  color:            hsl(213, 10%, 60%);
  border-color:     hsl(213, 10%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container .recentlySelected_title {
  color:            hsl(200, 30%, 60%);
  border-color:     hsl(200, 50%, 40%);
}

.darkTheme .simpleMultiComboBox-container .second_column .recentlySelected_title {
  color:            hsl(213, 10%, 65%);
}
.darkBlueTheme .simpleMultiComboBox-container .second_column .recentlySelected_title {
  color:            hsl(200, 30%, 70%);
}


.simpleMultiComboBox-container #simpleMultiComboBox_firstColumn_searchBox {
  display:              block;
  padding-top:          6px;
}

.simpleMultiComboBox-container .indicatorDiv {
  color:                hsl(199,18%,40%);
  white-space:          normal;
  background:           hsl(213,5%,95%);
  padding-top:          6px;
  padding-bottom:       6px;
}
.darkTheme .simpleMultiComboBox-container .indicatorDiv {
  color:                hsl(213, 10%, 60%);
  background:           hsla(213, 5%, 18%, .95);
}
.darkBlueTheme .simpleMultiComboBox-container .indicatorDiv {
  color:                hsl(213, 10%, 60%);
  background:           hsla(200, 75%, 22%, .95);
}

.simpleMultiComboBox-container .indicatorDiv span {
  display:              table;
  padding-right:        1px;
}

.simpleMultiComboBox-container .indicatorDivForSearch {
  color:                hsl(199,18%,40%);
  white-space:          normal;
  background:           hsl(213,5%,95%);
  padding-top:          6px;
  padding-bottom:       6px;
}
.darkTheme .simpleMultiComboBox-container .indicatorDivForSearch {
  color:                hsl(213, 10%, 60%);
  background:           hsla(213, 5%, 18%, .95);
}
.darkBlueTheme .simpleMultiComboBox-container .indicatorDivForSearch {
  color:                hsl(213, 10%, 60%);
  background:           hsla(200, 75%, 22%, .95);
}

.simpleMultiComboBox-container .indicatorDivForSearch span {
  display:              table;
  padding-right:        1px;
}

.simpleMultiComboBox-container .combobox_container {
  width:                100%;
  height:               18px;
  border-radius:        6px;
  position:             static !important;
  border:               1px solid hsl(213,2%,80%);
}
.darkTheme .simpleMultiComboBox-container .combobox_container {
  border:               transparent;
}
.darkBlueTheme .simpleMultiComboBox-container .combobox_container {
  border:               transparent;
}

.darkTheme .simpleMultiComboBox-container .combobox_container .combobox_input {
  background:           hsl(213, 30%, 8%);
  color:                hsl(213, 5%, 35%);
}
.darkBlueTheme .simpleMultiComboBox-container .combobox_container .combobox_input {
  background:           hsl(200, 75%, 14%);
  color:                hsl(200, 20%, 35%);
}

.simpleMultiComboBox-container .combobox_container .combobox_input {
  width:                100%;
  height:               18px !important;
  color:                hsl(213,0%,50%);
  font-size:            10px;
  
  margin-top:           0px !important;
  border:               none;
  border-radius:        6px;
    
  box-shadow:           none;
  background:           white;
}

.simpleMultiComboBox-container .combobox_container .combobox_input:focus {
  box-shadow:           none;
}

/* ================== Inputs and Labels ================= */
.simpleMultiComboBox-container .group_container input ,
.simpleMultiComboBox-container .currentlySelected_container input ,
.simpleMultiComboBox-container .recentlySelected_container input{
  vertical-align:   top;
  cursor:           pointer;
}
.simpleMultiComboBox-container .group_container input.combobox_input {
  cursor: text;
}

.simpleMultiComboBox-container .group_container label , 
.simpleMultiComboBox-container .currentlySelected_container label ,
.simpleMultiComboBox-container .recentlySelected_container label{
  width:            auto;
  
  color:            hsl(213, 0%, 50%);
  line-height:      1.4em;
  
  cursor:           pointer;

  padding:          1px 0 0 .2em;
  
  display:          inline-table;
}

.darkTheme .simpleMultiComboBox-container .group_container label ,
.darkTheme .simpleMultiComboBox-container .currentlySelected_container label ,
.darkTheme .simpleMultiComboBox-container .recentlySelected_container label {
  color:            hsl(213, 10%, 60%);
}
.darkBlueTheme .simpleMultiComboBox-container .group_container label ,
.darkBlueTheme .simpleMultiComboBox-container .currentlySelected_container label ,
.darkBlueTheme .simpleMultiComboBox-container .recentlySelected_container label {
  color:            hsl(200, 20%, 60%);
}


.simpleMultiComboBox-container .group_container li:hover label ,
.simpleMultiComboBox-container .currentlySelected_container li:hover label ,
.simpleMultiComboBox-container .recentlySelected_container li:hover label {
  color:            hsl(213, 100%, 45%);
}
.darkTheme .simpleMultiComboBox-container .group_container li:hover label ,
.darkTheme .simpleMultiComboBox-container .currentlySelected_container label ,
.darkTheme .simpleMultiComboBox-container .recentlySelected_container label {
  color:            hsl(213, 10%, 90%);
}
.darkBlueTheme .simpleMultiComboBox-container .group_container li:hover label ,
.darkBlueTheme .simpleMultiComboBox-container .currentlySelected_container label ,
.darkBlueTheme .simpleMultiComboBox-container .recentlySelected_container label {
  color:            hsl(200, 20%, 95%);
}

/* --- Checked --- */
.simpleMultiComboBox-container .group_container input:checked ~ label ,
.simpleMultiComboBox-container .currentlySelected_container input:checked ~ label, 
.simpleMultiComboBox-container .recentlySelected_container input:checked ~ label {
  color:            hsl(213, 100%, 30%);
}
.darkTheme .simpleMultiComboBox-container .group_container input:checked ~ label , 
.darkTheme .simpleMultiComboBox-container .currentlySelected_container input:checked ~ label ,
.darkTheme .simpleMultiComboBox-container .recentlySelected_container input:checked ~ label {
  color:            hsl(213, 100%, 70%);
}
.darkBlueTheme .simpleMultiComboBox-container .group_container input:checked ~ label , 
.darkBlueTheme .simpleMultiComboBox-container .currentlySelected_container input:checked ~ label ,
.darkBlueTheme .simpleMultiComboBox-container .recentlySelected_container input:checked ~ label {
  color:            hsl(200, 100%, 70%);
}

/* --- Checked:hover --- */
.simpleMultiComboBox-container .group_container li:hover input:checked ~ label ,
.simpleMultiComboBox-container .currentlySelected_container li:hover  input:checked ~ label, 
.simpleMultiComboBox-container .recentlySelected_container li:hover  input:checked ~ label {
  color:            hsl(213, 100%, 25%);
}
.darkTheme .simpleMultiComboBox-container .group_container li:hover input:checked ~ label ,
.darkTheme .simpleMultiComboBox-container .currentlySelected_container li:hover  input:checked ~ label, 
.darkTheme .simpleMultiComboBox-container .recentlySelected_container li:hover  input:checked ~ label {
  color:            hsl(213, 100%, 85%);
}
.darkBlueTheme .simpleMultiComboBox-container .group_container li:hover input:checked ~ label ,
.darkBlueTheme .simpleMultiComboBox-container .currentlySelected_container li:hover  input:checked ~ label, 
.darkBlueTheme .simpleMultiComboBox-container .recentlySelected_container li:hover  input:checked ~ label {
  color:            hsl(200, 100%, 85%);
}


/* --------- SELECT TEXT -------- */
.simpleMultiComboBox-container .selectboxit-container .selectboxit-text {
}
@media only screen and (max-width : 1250px){
  
  .tileMode .simpleMultiComboBox-container .selectboxit-container .selectboxit-text {
    width:              69px !important;
    text-align:         left;
    text-indent:        5px;
  }
}
@media only screen and (max-width : 680px){
  
  .tileMode .simpleMultiComboBox-container .selectboxit-container .selectboxit-text {
    width:              46px !important;
    text-align:         left;
    text-indent:        5px;
  }
}
.invalid_selected_text {
  color:                rgb(255,0,0) !important;
}  
 
/* ================== Button: Apply ================= */
.simpleMultiComboBox-container button.ctButton.selected {
  float:                right;
  margin:               .8em .8em .8em 0;
}


/* =================== Buttons ========================== */
.simpleMultiComboBox-container .ctButton.selected {
    color:        hsl(213, 30%, 90%);
    background:   hsl(213, 100%, 62%);
    border:       none;
    box-shadow:   none;
}
.darkTheme .simpleMultiComboBox-container .ctButton.selected {
    color:        hsl(213, 20%, 85%);
    background:   hsl(213, 100%, 50%);
}
.darkBlueTheme .simpleMultiComboBox-container .ctButton.selected {
    color:        hsl(200, 30%, 90%);
    background:   hsl(200, 100%, 50%);
}

.simpleMultiComboBox-container .ctButton.selected:hover {
    color:        hsl(213, 100%, 98%);
    background:   hsl(213, 100%, 55%);
}
.darkTheme .simpleMultiComboBox-container .ctButton.selected:hover {
    color:        hsl(213, 100%, 98%);
    background:   hsl(213, 100%, 60%);
}
.darkBlueTheme .simpleMultiComboBox-container .ctButton.selected:hover {
    color:        hsl(200, 100%, 98%);
    background:   hsl(200, 100%, 60%);
}

