@charset "utf-8";

#fontsize {
  display: flex;
  justify-content: flex-end;
  margin: 0;
  padding: 0;
  overflow: hidden;
  outline: none;
  margin-right: 15px;
}

#fontsize ul:after {
  content: ".";
  height: 0;
  clear: both;
  visibility: hidden;
}

#fontsize ul {
  margin: 0 0 5px 0;
}

#fontsize li {
  list-style-type: none;
  float: left;
  margin-right: 2px;
  font-size: 1px;
}

#fontsize li.last {
  margin-right: 10px;
}

#fontsize li a {
  display: block;
  width: 20px;
  height: 21px;
  line-height: normal;
  text-indent: -9999px;
  text-decoration: none;
}

@media screen and (max-width: 480px) {
#fontsize {
  margin-right: 0;
}
}



/* fontsmall */

#fontsmall a:link, #fontsmall a:visited {
  background: transparent url(../img/font_small_off.svg) left top no-repeat;
}

#fontsmall a:hover, #fontsmall a:active {
  background: transparent url(../img/font_small_on.svg) left top no-repeat;
}


/* fontmedium */

#fontmedium a:link, #fontmedium a:visited {
  background: transparent url(../img/font_medium_off.svg) left top no-repeat;
}

#fontmedium a:hover, #fontmedium a:active {
  background: transparent url(../img/font_medium_on.svg) left top no-repeat;
}


/* #fontlarge */

#fontlarge a:link, #fontlarge a:visited {
  background: transparent url(../img/font_large_off.svg) left top no-repeat;
}

#fontlarge a:hover, #fontlarge a:active {
  background: transparent url(../img/font_large_on.svg) left top no-repeat;
}