@primary-color: #38f;
@bg-menu: #11314e;
@bg-logo: #09253f;
@bg-submenu: #11314e;
@bg-router-active: #09253f;
@bg-header: #11314e;

.loop-fz( @count )when( @count > 11 ) {
  .fz@{count} {
    font-size: (1px * @count);
  }
  .loop-fz((@count - 1));
}

.loop-pt( @count )when( @count > 0 ) {
  .pt@{count} {
    padding-top: (1px * @count);
  }
  .loop-pt((@count - 5));
}

.loop-pb( @count )when( @count > 0 ) {
  .pb@{count} {
    padding-bottom: (1px * @count);
  }
  .loop-pb((@count - 5));
}

.loop-pr( @count )when( @count > 0 ) {
  .pr@{count} {
    padding-right: (1px * @count);
  }
  .loop-pr((@count - 5));
}

.loop-pl( @count )when( @count > 0 ) {
  .pl@{count} {
    padding-left: (1px * @count);
  }
  .loop-pl((@count - 5));
}

.loop-mt( @count )when( @count > 0 ) {
  .mt@{count} {
    margin-top: (1px * @count);
  }
  .loop-mt((@count - 5));
}
.loop-mb( @count )when( @count > 0 ) {
  .mb@{count} {
    margin-bottom: (1px * @count);
  }
  .loop-mb((@count - 5));
}

.loop-mr( @count )when( @count > 0 ) {
  .mr@{count} {
    margin-right: (1px * @count);
  }
  .loop-mr((@count - 5));
}

.loop-ml( @count )when( @count > 0 ) {
  .ml@{count} {
    margin-left: (1px * @count);
  }
  .loop-ml((@count - 5));
}

.shadow(@color: #d0d0d0) {
  box-shadow: 0px 0px 13px 0px @color;
}
