/* size s */

.container-s
{
  font: 13px/24px arial,sans-serif;
}

.button-s
{
  width: 24px;
  height: 24px;

  font: 13px/22px arial,sans-serif;
}

.clear-s
{
  composes: clear from '../input/input-s.css';
}

.control-s
{
  composes: control from '../input/input-s.css';

  width: calc(100% - 23px);
}

/* size m */

.container-m
{
  font: 13px/28px arial,sans-serif;
}

.button-m
{
  width: 28px;
  height: 28px;

  font: 13px/26px arial,sans-serif;
}

.clear-m
{
  composes: clear from '../input/input-m.css';
}

.control-m
{
  composes: control from '../input/input-m.css';

  width: calc(100% - 27px);
}

/* size l */

.container-l
{
  font: 15px/32px arial,sans-serif;
}

.button-l
{
  width: 32px;
  height: 32px;

  font: 15px/30px arial,sans-serif;
}

.clear-l
{
  composes: clear from '../input/input-l.css';
}

.control-l
{
  composes: control from '../input/input-l.css';

  width: calc(100% - 31px);
}