$keep-container-border-radius = 5px;

hover-style(scaleX, scaleY) {

  transition();

  box-shadow: 2px 2px 6px var(--shadow-color);

  &:hover {

    if (hexo-config('style.hover.scale')) {
      transform: scaleX(scaleX) scaleY(scaleY);
    }

    if (hexo-config('style.hover.shadow')) {
      box-shadow: 3px 3px 9px var(--shadow-hover-color);
    }
  }
}


keep-container(scaleX, scaleY, padding, marginBottomValue) {
  background: var(--background-color);
  padding: padding;
  border-radius: $keep-container-border-radius;
  box-sizing: border-box;

  if (marginBottomValue != 0) {
    margin-bottom: marginBottomValue;

    +keep-tablet() {
      margin-bottom: marginBottomValue * 0.8;
    }

    +keep-mobile() {
      margin-bottom: marginBottomValue * 0.6;
    }
  }


  hover-style(scaleX, scaleY);

  +keep-tablet() {
    padding: padding * 0.8;
    border-radius: $keep-container-border-radius * 0.8;
    hover-style(scaleX * 0.8, scaleY * 0.8);
  }

  +keep-mobile() {
    padding: padding * 0.6;
    border-radius: $keep-container-border-radius * 0.6;
    hover-style(scaleX * 0.6, scaleY * 0.6);
  }
}