/* =========================================================
   BABY ANGEL LACE.CSS V8 CLEAN
   4 cạnh ren riêng + 2 ren giữa
========================================================= */

:root{
  --lace-size:40px;
  --lace-opacity:.96;

  --lace-top-y:-17px;
  --lace-bottom-y:-17px;
  --lace-left-x:-25px;
  --lace-right-x:-25px;

  --lace-middle-left-x:-20px;
  --lace-middle-right-x:-20px;
  --lace-middle-top:0px;
  --lace-middle-bottom:0px;

  --lace-frame-layer:930;
  --lace-divider-layer:940;
}

.layoutwrap::before,
.layoutwrap::after,
.layout::before,
.layout::after,
.contentbox::before,
.contentbox::after,
.centerstack::before,
.centerstack::after,
.comments::before,
.comments::after,
.formside::before,
.formside::after,
.guestbook-lace-divider,
.pagegrid::before,
.pagegrid::after{
  content:none !important;
  display:none !important;
  background:none !important;
}

.mainbox,
.sitewrap,
.pagegrid,
.sidebar,
.centerstack,
.widgetbar{
  overflow:visible !important;
}

.pagegrid,
.sidebar,
.centerstack,
.widgetbar{
  position:relative !important;
}

/* 4 cạnh ren ngoài */
.pagegrid > .lace-edge{
  display:block !important;
  position:absolute !important;
  pointer-events:none !important;
  z-index:var(--lace-frame-layer) !important;
  opacity:var(--lace-opacity) !important;
}

.pagegrid > .lace-top{
  top:var(--lace-top-y) !important;
  left:0 !important;
  width:100% !important;
  height:var(--lace-size) !important;
  background:url("/theme/divider-frame-bottom.png") repeat-x center center / auto var(--lace-size) !important;
}

.pagegrid > .lace-bottom{
   
  bottom:var(--lace-bottom-y) !important;
  left:0 !important;
  width:100% !important;
  height:var(--lace-size) !important;
  background:url("/theme/divider-frame-top.png") repeat-x center center / auto var(--lace-size) !important;
}

.pagegrid > .lace-left{
  top:0 !important;
  left:var(--lace-left-x) !important;
  width:var(--lace-size) !important;
  height:100% !important;
  background:url("/theme/divider-frame-right.png") repeat-y center top / var(--lace-size) auto !important;
}

.pagegrid > .lace-right{
  top:0 !important;
  right:var(--lace-right-x) !important;
  width:var(--lace-size) !important;
  height:100% !important;
  background:url("/theme/divider-frame-left.png") repeat-y center top / var(--lace-size) auto !important;
}

/* 2 ren giữa */
.sidebar::after{
  content:"" !important;
  position:absolute !important;
  top:var(--lace-middle-top) !important;
  bottom:var(--lace-middle-bottom) !important;
  right:var(--lace-middle-left-x) !important;
  width:var(--lace-size) !important;
  background:url("/theme/divider-frame-left.png") repeat-y top center / var(--lace-size) auto !important;
  pointer-events:none !important;
  z-index:var(--lace-divider-layer) !important;
  opacity:var(--lace-opacity) !important;
}

.widgetbar::before{
  content:"" !important;
  position:absolute !important;
  top:var(--lace-middle-top) !important;
  bottom:var(--lace-middle-bottom) !important;
  left:var(--lace-middle-right-x) !important;
  width:var(--lace-size) !important;
  background:url("/theme/divider-frame-right.png") repeat-y top center / var(--lace-size) auto !important;
  pointer-events:none !important;
  z-index:var(--lace-divider-layer) !important;
  opacity:var(--lace-opacity) !important;
}

.widgetbar::after,
.sidebar::before,
.pagegrid > .lace-corner{
  content:none !important;
  display:none !important;
}

.sidebar,
.widgetbar{
  background:url("/theme/meow.jpg") center / 320px !important;
}

.centerstack .contentbox,
.centerstack .tabcontent.active{
  background:url("/theme/meow.jpg") center / 320px !important;
}

@media screen and (max-width:1050px){
  .pagegrid > .lace-edge,
  .sidebar::after,
  .widgetbar::before{
    display:none !important;
  }
}
/* ép 2 ren giữa hiện lại */
.sidebar::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  top:0 !important;
  bottom:0 !important;
  right:-23px !important;
  width:40px !important;
  height:auto !important;
  background:url("/theme/divider-frame-left.png") repeat-y top center / 40px auto !important;
  pointer-events:none !important;
  z-index:940 !important;
  opacity:.96 !important;
}

.widgetbar::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  top:0 !important;
  bottom:0 !important;
  left:-23px !important;
  width:40px !important;
  height:auto !important;
  background:url("/theme/divider-frame-right.png") repeat-y top center / 40px auto !important;
  pointer-events:none !important;
  z-index:940 !important;
  opacity:.96 !important;
}

