
#unitConverter #border {
  border: 1px solid #e7e7e7;
  padding: 10px;
  margin-top: 20px; }
#unitConverter #converterMenu {
  width: 150px;
  list-style: none;
  padding: 10px;
  background-color: #fff;
  font-size: 14px; }
  #unitConverter #converterMenu li {
    padding: 5px 0;
    min-height: 20px;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    border-bottom: 1px dashed #e0dfdf;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center; }
    #unitConverter #converterMenu li.active a, #unitConverter #converterMenu li:hover a {
      background-color: #FF3000;
      color: #fff; }
    #unitConverter #converterMenu li:first-of-type {
      padding-top: 0; }
    #unitConverter #converterMenu li:last-of-type {
      padding-bottom: 0;
      border-bottom: 0; }
    #unitConverter #converterMenu li a {
      padding: 5px;
      color: inherit;
      width: 100%;
      height: 100%;
      box-sizing: border-box; }
    #unitConverter #converterMenu li span.icon {
      background: url("/img/unitIcon.png") no-repeat 0 0;
      display: block; }
#unitConverter #formula {
  background-color: #EAF3F7;
  padding: 10px;
  -webkit-box-align: start;
  -ms-flex-align: start;
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  align-items: flex-start; }
  #unitConverter #formula #converterMenu {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-order: 2;
    -ms-flex-order: 2;
    order: 2; }
    #unitConverter #formula #converterMenu a{
      text-decoration: none;
    }
  #unitConverter #formula form {
    margin-right: 20px;
    font-size: 14px; }
    #unitConverter #formula form > div {
      margin: 10px 0; }
      #unitConverter #formula form > div label {
        width: 150px; }
        #unitConverter #formula form > div label:first-of-type {
          text-align: right;
          width: 50px;
          font-weight: bold; }
      #unitConverter #formula form > div:hover {
        color: #FF3000; }
    #unitConverter #formula form input[type="text"] {
      margin: 0 10px;
      min-width: 150px;
      padding: 5px;
      text-align: right;
      background: none repeat scroll 0 0 #fff;
      border: 4px solid #fff;
      font-size: 14px;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      -khtml-border-radius: 3px;
      border-radius: 3px;
      -webkit-background-clip: padding-box;
      -khtml-background-clip: padding;
      -moz-background-clip: padding;
      background-clip: padding-box;
      -moz-box-shadow: 0 0 0 1px #85bdd6, 1px 1px 3px 0 #b2d6e6 inset;
      -webkit-box-shadow: 0 0 0 1px #85bdd6, 1px 1px 3px 0 #b2d6e6 inset;
      -khtml-border-radius: 0 0 0 1px #85bdd6, 1px 1px 3px 0 #b2d6e6 inset;
      box-shadow: 0 0 0 1px #85bdd6, 1px 1px 3px 0 #b2d6e6 inset; }
      #unitConverter #formula form input[type="text"]:focus {
        color: #FF3000; }
  #unitConverter #formula #converterMenu a span.icon {
    width: 64px;
    height: 64px;
    margin: -12px 0 0 -12px;
    -webkit-transform: scale(0.25);
    -moz-transform: scale(0.25);
    -ms-transform: scale(0.25);
    -o-transform: scale(0.25);
    transform: scale(0.25);
    -webkit-transform-origin: 25% 25% 0;
    -moz-transform-origin: 25% 25% 0;
    -ms-transform-origin: 25% 25% 0;
    -o-transform-origin: 25% 25% 0;
    transform-origin: 25% 25% 0; }
  #unitConverter #formula #converterMenu a div {
    width: 16px;
    height: 16px;
    overflow: hidden;
    margin-right: 10px; }
#unitConverter #selectCategory {
  overflow: hidden; }
  #unitConverter #selectCategory #converterMenu {
    width: 100%; 
    box-sizing: border-box;
    margin: 0;
  }
    #unitConverter #selectCategory #converterMenu li {
      min-height: 100px;
      min-width: 150px;
      max-width: 33.3%;
      width: 100%;
      box-sizing: border-box;
      margin: 0;
      padding: 5px;
      border-right: 1px dashed #e0dfdf; }
      #unitConverter #selectCategory #converterMenu li:nth-child(3n), #unitConverter #selectCategory #converterMenu li:last-of-type {
        border-right: 0; }
      #unitConverter #selectCategory #converterMenu li a {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        -moz-justify-content: center;
        justify-content: center; }
      #unitConverter #selectCategory #converterMenu li span.icon {
        width: 64px;
        height: 64px;
        -webkit-transform: scale(0.5);
        -moz-transform: scale(0.5);
        -ms-transform: scale(0.5);
        -o-transform: scale(0.5);
        transform: scale(0.5);
        -webkit-transform-origin: 50% 50% 0;
        -moz-transform-origin: 50% 50% 0;
        -ms-transform-origin: 50% 50% 0;
        -o-transform-origin: 50% 50% 0;
        transform-origin: 50% 50% 0; }
#unitConverter #selectCategory li a span.icon.dlugosc, #unitConverter #formula li a span.icon.dlugosc {
  background-position: 0 -64px; }
#unitConverter #selectCategory li a span.icon.powierzchnia, #unitConverter #formula li a span.icon.powierzchnia {
  background-position: -64px -128px; }
#unitConverter #selectCategory li a span.icon.objetosc, #unitConverter #formula li a span.icon.objetosc {
  background-position: -194px -128px; }
#unitConverter #selectCategory li a span.icon.masa, #unitConverter #formula li a span.icon.masa {
  background-position: -64px -194px; }
#unitConverter #selectCategory li a span.icon.predkosc, #unitConverter #formula li a span.icon.predkosc {
  background-position: 0 -128px; }
#unitConverter #selectCategory li a span.icon.czas, #unitConverter #formula li a span.icon.czas {
  background-position: 0 -194px; }
#unitConverter #selectCategory li a span.icon.energia, #unitConverter #formula li a span.icon.energia {
  background-position: -128px -64px; }
#unitConverter #selectCategory li a span.icon.swiatlo, #unitConverter #formula li a span.icon.swiatlo {
  background-position: -64px -64px; }
#unitConverter #selectCategory li a span.icon.temperatura, #unitConverter #formula li a span.icon.temperatura {
  background-position: -128px -128px; }
#unitConverter #selectCategory li a span.icon.cisnienie, #unitConverter #formula li a span.icon.cisnienie {
  background-position: -64px 0; }
#unitConverter #selectCategory li a span.icon.sila, #unitConverter #formula li a span.icon.sila {
  background-position: -194px -64px; }
#unitConverter #selectCategory li a span.icon.moc, #unitConverter #formula li a span.icon.moc {
  background-position: -194px 0; }
#unitConverter #selectCategory li a span.icon.ilosc, #unitConverter #formula li a span.icon.ilosc {
  background-position: 0 0; }
#unitConverter #selectCategory li a span.icon.pamiec, #unitConverter #formula li a span.icon.pamiec {
  background-position: -128px 0; }


@media screen and (max-device-width: 900px) {
    #unitConverter #selectCategory #converterMenu li{
      width: 100%;
      max-width: none;
      border-right: 0;
    }
    #unitConverter #converterMenu{
      width: 100%;
    }
  }