:root{
  --left: inherit;
  --top: inherit;
  --width: 100%;
  --height: 100%;
  --angle: 0;
  --skew: 0;
  --right: inherit;
  --bottom: inherit;
  --position: absolute;
  --radius: none;
}

.block {
  top: var(--top);
  left: var(--left);
  width: var(--width);
  height: var(--height);
  bottom: var(--bottom);
  right: var(--right);
  position: var(--position);
  
  --blockColor: var(--colorFore);
  /* --blockBackground: var(--colorBack); */
  --blockBorder: 0;

  /* transform-origin: top left; */
  transform: rotate(var(--angle)) skew(var(--skew));
  mix-blend-mode: var(--blockBlend);

}

.inner {
  width: 100%;
  height: 100%;
  
  opacity: var(--blockOpacity);
  clip-path: var(--blockClip);
  box-shadow: var(--blockShadow);
  
  overflow: hidden;
}
.text .inner{
  overflow: visible;
}

.subinner{
  width: 100%;
  height: 100%;
  background: var(--blockBackground);
  color: var(--blockColor);
  padding: var(--blockPadding);
  border-radius: var(--blockRadius);
  border-width: var(--blockBorder);
  border-style: solid;
}



.inner{
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    position: absolute;
    
}