#app-graph-selectors {
  display: flex;
  width: 100%;
  height: 50px;
}

.mobbo-dropdown {
  position: relative;
  width: 240px;
}

.mobbo-dropdown .selected{
  cursor: pointer;
  color: #636363;
  height: 50px;
  margin: 0;
  /* font-weight: lighter; */
  background-color: white;
  width: 100%;
  border-radius: 0px;
  font-size: 16px;
  border: 1px solid #E5E5E5;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

.mobbo-dropdown .selected:hover {
  border-color: #2680EB;
}


.mobbo-dropdown .menu {
  position: absolute;
  z-index: 2;
  top: 0;
  width: 100%;
  list-style: none;
  padding: 0;
  margin: 0;
  display: none;
}

.mobbo-dropdown .menu.open {
  box-shadow: 0px 3px 6px 0px #00000036;
  display: block;
}

.mobbo-dropdown .menu li {
  cursor: pointer;
  color: #636363;
  height: 50px;
  margin: 0;
  background-color: white;
  width: 100%;
  border-radius: 0px;
  font-size: 16px;
  border: 1px solid #E5E5E5;
  border-left: none;
  border-right: none;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

.mobbo-dropdown .menu li .placeholder {
  color: #9F9F9F;
}

/* .mobbo-dropdown .menu li { */
/*   visibility: hidden; */
/* } */

/* .mobbo-dropdown .menu.open li { */
/*   visibility: visible; */
/* } */

.mobbo-dropdown .menu li:not(:first-child):hover {
  border-color: #2680EB;
}

.mobbo-dropdown .menu li:first-child {
  justify-content: space-between;
  padding: 20px 25px;
  box-sizing: border-box;
}

.mobbo-dropdown .menu li .arrow {
  visibility: hidden;
}

.mobbo-dropdown * {
  box-sizing: border-box;  
}


.mobbo-datepicker {
  position: relative;
  min-width: 240px;
}

.mobbo-datepicker * {
  box-sizing: border-box;  
}

.mobbo-datepicker .selected{
  cursor: pointer;
  height: 100%;
  background-color: white;
  border-radius: 0px;
  font-size: 16px;
  border: 1px solid #E5E5E5;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

.mobbo-datepicker .selected:hover{
  border-color: #2680EB;
}

.mobbo-datepicker .picker {
  position: absolute;
  z-index: 2;
  background-color: white;
}

.mobbo-datepicker .text {
  /* font-weight: lighter; */
  color: #636363;
}

.mobbo-datepicker .range-select {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mobbo-datepicker .range-select li {
  width: 215px;
  height: 55px;
  border: 1px solid #E5E5E5;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  margin: 0;
  padding: 0;
}

.mobbo-datepicker .range-select li.selected {
  border-color: #FEDE15;
  background-color: #FEDE15;
}

#app-graph-country {
  flex-grow: 1;
}

#app-graph-country * {
  box-sizing: border-box;  
}

.icon {
  width: 35px;
  height: 28px;
  background-repeat: no-repeat;
  background-position: 50%;
}

.icon.downloads {
  background-image: url(/images/app-graph/downloads.svg);
}

.icon.revenues {
  background-image: url(/images/app-graph/revenues.svg);
}

.icon.placements {
  background-image: url(/images/app-graph/placements.svg);
}

.icon.linechart {
  background-image: url(/images/app-graph/linechart.svg);
}

.icon.barchart {
  background-image: url(/images/app-graph/barchart.svg);
}

.icon.areachart {
  background-image: url(/images/app-graph/areachart.svg);
}


.icon.arrow {
  background-image: url(/images/app-graph/down-arrow.svg);
  width: 15px;
  height: 15px;
}

.icon.arrow-grey {
  background-image: url(/images/app-graph/down-arrow-grey.svg);
  width: 15px;
  height: 15px;
}


.icon.date {
  background-image: url(/images/app-graph/date.svg);
}

.icon.country {
  background-image: url(/images/app-graph/country.svg);
}


.search-choice-close:before, .search-choice-close:after {
  position: absolute;
  left: 0px;
  top: 0px;
  content: ' ';
  height: 15px;
  width: 2px;
  background-color: white;
}

.search-choice-close:before {
  transform: rotate(45deg);
}

.search-choice-close:after {
  transform: rotate(-45deg);
}

/* overrider datepicker */
.daterangepicker.show-calendar .ranges {
    margin-top: 0;
}
.daterangepicker .ranges li {
  border-bottom: 1px solid #E5E5E5;
}

.daterangepicker .ranges li.active {
  background-color: #2680EB;
  border-color: #2680EB;
  color: white;
}

.daterangepicker td.active, .daterangepicker td.active:hover {
  background-color: #2680EB;
  color: white;
}

.daterangepicker td.in-range {
  background-color: #70707047;
}

.daterangepicker td.end-date {
  background-color: #2680EB;
  color: white;
}

.daterangepicker .drp-selected {
  display: none;
}

.daterangepicker .app-graph-btn:hover {
  background-color: #2680EB;
  color: white;
}

.daterangepicker .app-graph-btn {
  cursor: pointer;
  background-color: white;
  border: none;
  color: black;
  font-size: 14px;
  transition: all 500ms ease-in-out;
}