* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

body {
  background-color: #d7d1c9;
}

.language-dropdown {
  height: 32px;
  position: relative;
  width: 45px;
  margin: 0 10px;
  /*
  // separator
  &:before{
    background-color: rgba(#000000, 0.15);
    height: 20px;
    left: 44px;
    top: 6px;
    width: 1px;
  }
  // arrows
  &:after{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 10'%3E%3Cpath d='M3 10l3-4H0l3 4zM3 0l3 4H0l3-4z' fill='%23565D6D' fill-rule='evenodd'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 6px 10px;
    height: 24px;
    right: 5px;
    top: 4px;
    width: 24px;
  }
  */
}

.language-dropdown:before, .language-dropdown:after, .language-dropdown > * {
  display: block;
  position: absolute;
}

.language-dropdown:before, .language-dropdown:after {
  content: "";
  z-index: 2;
}

select, .background {
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
}

select {
  cursor: pointer;
  display: block;
  opacity: 0;
  z-index: 3;
  /*
    // background hover
    &:hover + .background{
      border-color: #9ea0a3;
    }

    // background focus
    &:focus + .background{
      box-shadow: -3px -3px 0 #a5bffc, 3px -3px 0 #a5bffc, 3px 3px 0 #a5bffc, -3px 3px 0 #a5bffc;
    }
    */
}

/*
  // background
  .background{
    background-color: #fff;
    border-radius: 4px;
    border: 1px solid #dbdfe2;
    z-index: 1;
}*/
.flags {
  height: 24px;
  left: 10px;
  top: 4px;
  width: 24px;
  z-index: 2;
}

.flags .flag {
  display: none;
  width: inherit;
  height: inherit;
  font-size: 0;
  line-height: 0;
}

.flags .flag.display {
  display: block;
}

/*
@media (max-width: 800px) {
  .navbar {
    align-items: center;
    justify-content: flex-end; 
  }
}
*/
/*# sourceMappingURL=language.css.map */