public/scss/header.scss

@charset "utf-8";
@import "util";

header {
  position: relative;
  background-color: $light-green;
  @include box-sizing-box();
  padding: 8px;
  padding-bottom: 0;
  font-size: 10pt;
  color: $nearly-white;
  // text-shadow: none;
  button {
    color: $light-green;
    background-color: transparent;
    border-width: 0;
    font-weight: normal;
    margin: 0;
    padding: 0;
    outline: none;
  }
  span.select, span.location {
    cursor: pointer;
    font-weight: bold;
    line-height: 1.8em;
    border: {
      width: 0;
      bottom-width: 3px;
      style: solid;
      color: transparent;
    }
    display: inline-block;
    &:hover {
      color: $dark-green;
      border-color: $dark-green;
    }
    &::after {
      content: "\f0dd";
      pointer-events: none;
      font-family: FontAwesome;
      text-align: center;
      background-color: $light-green;
    }
  }
  form {
    display: block;
    padding-left: 230px;
    margin: 0px;
    position: relative;
  }
}


/**
 * Temporary hack for language chooser
 * http://cssdeck.com/labs/styling-select-box-with-css3
 */
#ql-field {
  cursor: pointer;
  margin: 0;
  outline: none;
  border: none;
  display: inline-block;
  position: relative;
  color: white;
  background-color: $light-green;
  border-width: 0;
  border-radius: 0;
  @include no-appearance;
  &:checked {
    outline: none;
  }
  > option {
    padding: 0pt 2pt;
    outline: none;
  }
}

/**
 * funny hack for firefox
 */
#ql-field:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 white;
}