.dropdown-button {
  font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
  font-size: 100%;
  border: 1px solid rgba(0, 0, 0, 0.1);
  color: rgba(0,0,0,0.4);
  padding: 0 0 0 12px;
  border-radius: 4px;
  background: white;
  text-align: left;
  cursor: pointer;
  height: 35px;
  width: 100%;
}
.dropdown-button:hover, .dropdown-button:focus {
  border: 1px solid rgba(0, 0, 0, 0.4);
  color: rgba(0,0,0,0.8);
}
#dD-reasonPc,#dD-countryPc{
  font-size: 100%;
  height: 38px;
}


.show-button {
  border: 1px solid rgba(0, 0, 0, 0.4);
  border-bottom-color: rgba(0, 0, 0, 0.1);
  border-radius: 4px 4px 0 0;
}
.dropdown-button.show-button:hover {
  border: 1px solid rgba(0, 0, 0, 0.4);
  border-bottom-color: rgba(0,0,0,0.1);
  color: rgba(0,0,0,0.8);
  cursor: pointer;
}

.dropdownContent {
  border: 1px solid rgba(0,0,0,0.4);
  border-radius: 0 0 4px 4px;
  visibility: hidden;
  position: absolute;
  background: white;
  max-height: 200px;
  overflow: auto;
  display: none;
  border-top:0;
  width:99.5%;
}
#Content-translateBtn.dropdownContent{
  width:98.5%;
}
#Content-mood.dropdownContent{
  width:99%;
}
#Content-sphere.dropdownContent{
  width:99%;
}
#Content-reasonPc.dropdownContent{
  width:99.85%;
  font-size: 100%;
}
.show-dropdownContent {
  flex-direction: column;
  visibility: visible;
  display: flex;
  z-index: 1;
}

.dropdownContent a{
  transition: all 200ms;
}
.dropdownContent.show-dropdownContent a {
  padding: 6px 0 6px 12px;
  color: rgba(0,0,0,0.4);
  cursor: pointer;
}
.dropdownContent.show-dropdownContent a:last-child{
  padding: 6px 0 6px 12px;
}
.dropdownContent.show-dropdownContent a:hover{
  background:rgba(0,0,0,0.1);
  color: rgba(0,0,0,0.8);
}
#Content-countryPc.dropdownContent, #Content-countryMob.dropdownContent{
  z-index: 1;
}




@media screen and (min-width: 1801px){
  .dropdownContent {
    border: 2px solid rgba(0,0,0,0.2);
    width: 99.5%;
    max-height: 250px;
  }
  #Content-translateBtn.dropdownContent{
    border: 2px solid rgba(0,0,0,0.2);
    width:98%;
  }
  #Content-mood.dropdownContent{
    border: 2px solid rgba(0,0,0,0.2);
    width:98.5%;
  }
  #Content-sphere.dropdownContent{
    border: 2px solid rgba(0,0,0,0.2);
    width:98.5%;
  }
  .dropdown-button {
    border: 2px solid rgba(0, 0, 0, 0.2);
    padding: 0 0 0 18px;
  }
  .dropdownContent.show-dropdownContent a {
    padding: 11px 0 11px 18px;
  }
  .dropdownContent.show-dropdownContent a:last-child{
    padding: 11px 0 11px 18px;
  }
  .dropdown-button {
    border: 2px solid rgba(0,0,0,0.2);
    height: 40px;
    padding-bottom: 2px;
  }
}

@media screen and (max-width: 1400px) and (min-width: 1081px){
  #Content-translateBtn.dropdownContent{
    width:99%;
  }
}

@media screen and (max-width: 1080px) and (min-width: 805px) {
  .dropdown-button {
    height: 30px;
    padding-bottom: 2px;
  }
}

@media screen and (max-width: 1080px) {
  #dD-reasonPc,#dD-countryPc{
    font-size: 100%;
    height: 30px;
  }
}

@media screen and (max-width: 804px) and (min-width: 701px) {
  .dropdownContent {
    width: 99%;
    max-height: 125px;
  }
  #Content-translateBtn.dropdownContent{
    width:98%;
  }
  #Content-mood.dropdownContent{
    width:98.5%;
  }
  #Content-sphere.dropdownContent{
    width:98.5%;
  }
  .dropdown-button {
    padding: 0 0 0 6px;
  }
  .dropdownContent.show-dropdownContent a {
    padding: 3px 0 3px 6px;
  }
  .dropdownContent.show-dropdownContent a:last-child{
    padding: 3px 0 3px 6px;
  }
  .dropdown-button {
    height: 22px;
    padding-bottom: 2px;
  }
}

@media screen and (max-width: 700px) {
  #dD-reasonMob,#dD-countryMob{
    height: 30px;
  }
  #Content-bodyPart_mob.dropdownContent,
  #Content-subPart_mob.dropdownContent,
  #Content-mood_mob.dropdownContent,
  #Content-sphere_mob.dropdownContent,
  #Content-countryMob.dropdownContent,
  #Content-reasonMob.dropdownContent{
    position: inherit;
    margin-bottom: 2%;
    max-height: 150px;
    font-size: 1.2em;
  }
  #dD-bodyPart_mob.dropdown-button,
  #dD-subPart_mob.dropdown-button,
  #dD-mood_mob.dropdown-button,
  #dD-sphere_mob.dropdown-button,
  #dD-countryMob.dropdown-button,
  #dD-reasonMob.dropdown-button{
    font-size: 1.2em;
  }

  .dropdownContent.show-dropdownContent a {
    color: rgba(0,0,0,0.6);
  }
}

@media screen and (max-width: 500px) {
  #dD-reasonMob,#dD-countryMob{
    height: 28px;
  }
}