@media screen and (max-width: 500px) {
    .tipsy-inner {
        background-color: rgba(175, 165, 165, 0.46) !important;
    }
}
.board-main {
    margin: 0;
    width: 100%;
}
.board {
    background: url(../images/board.jpg)no-repeat;
    width: 451px;
	height: 500px;
    padding: 0;
}
.board td {
    background-position: -1px -1px;
    position: relative;
    z-index: 1;
}
.board .br,
.MatQuan .br,
.FlyCo[data-conhac="br"] {
    background: url("../images/pieces.png");
}
.board .bh,.board .bn,
.MatQuan .bh,.MatQuan .bn,
.FlyCo[data-conhac="bh"],.FlyCo[data-conhac="bn"]{
    background: url(../images/pieces.png)-49px 0;
}
.board .be,.board .bb,
.MatQuan .be,.MatQuan .bb,
.FlyCo[data-conhac="be"],.FlyCo[data-conhac="bb"] {
    background: url(../images/pieces.png)-98px 0;
}
.board .ba,
.MatQuan .ba,
.FlyCo[data-conhac="ba"] {
    background: url(../images/pieces.png)-147px 0;
}
.board .bk,
.MatQuan .bk,
.FlyCo[data-conhac="bk"] {
    background: url(../images/pieces.png)-196px 0;
}
.board .bc,
.MatQuan .bc,
.FlyCo[data-conhac="bc"] {
    background: url(../images/pieces.png)-245px 0;
}
.board .bp,
.MatQuan .bp,
.FlyCo[data-conhac="bp"] {
    background: url(../images/pieces.png)-295px 0;
}
.board .rr,
.MatQuan .rr,
.FlyCo[data-conhac="rr"] {
    background: url(../images/pieces.png)0 49px;
}
.board .rh,.board .rn,
.MatQuan .rh,.MatQuan .rn,
.FlyCo[data-conhac="rh"],.FlyCo[data-conhac="rn"] {
    background: url(../images/pieces.png)-49px 49px;
}
.board .re,.board .rb,
.MatQuan .re,.MatQuan .rb,
.FlyCo[data-conhac="re"],.FlyCo[data-conhac="rb"] {
    background: url(../images/pieces.png)-98px 49px;
}
.board .ra,
.MatQuan .ra,
.FlyCo[data-conhac="ra"] {
    background: url(../images/pieces.png)-147px 49px;
}
.board .rk,
.MatQuan .rk,
.FlyCo[data-conhac="rk"] {
    background: url(../images/pieces.png)-196px 49px;
}
.board .rc,
.MatQuan .rc,
.FlyCo[data-conhac="rc"] {
    background: url(../images/pieces.png)-244px 49px;
}
.board .rp,
.MatQuan .rp,
.FlyCo[data-conhac="rp"] {
    background: url(../images/pieces.png)-294px 49px;
}
.board .pre {
    background: #ce8409;
    -moz-border-radius: 24px;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    opacity: 0.2;
}
.board .curr {
    outline: #ce8409 dotted 2px;
}
@media only screen and (min-device-width :768px)and (max-device-width :1024px)and (-webkit-min-device-pixel-ratio:1) {
    .steps {
        width: 80px;
    }
    .comment {
        width: 200px;
    }
}
@media only screen and (max-width :480px) {
    .board-main {
        margin: 0;
    }
    .board {
        background: url(../images/board-small.jpg)no-repeat;
        width: 300px;
        height: 333px;
        padding: 0;
    }
    .board .br, .FlyCo[data-conhac="br"],
	.MatQuan .br{
        background: url("../images/pieces-small.png");
    }
    .board .bh,.board .bn, .FlyCo[data-conhac="bh"],.FlyCo[data-conhac="bn"],
	.MatQuan .bh,.MatQuan .bn{
        background: url(../images/pieces-small.png)-34px 0;
    }
    .board .be,.board .bb, .FlyCo[data-conhac="be"],.FlyCo[data-conhac="bb"],
	.MatQuan .be,.MatQuan .bb{
        background: url(../images/pieces-small.png)-65px 0;
    }
    .board .ba, .FlyCo[data-conhac="ba"],
	.MatQuan .ba{
        *background: url(../images/pieces-small.png)-100px 0;
		background: url(../images/pieces-small.png)-98px 0;
    }
    .board .bk, .FlyCo[data-conhac="bk"],
	.MatQuan .bk{
        background: url(../images/pieces-small.png)-130px 0;
    }
    .board .bc, .FlyCo[data-conhac="bc"],
	.MatQuan .bc{
        background: url(../images/pieces-small.png)-163px 0;
    }
    .board .bp, .FlyCo[data-conhac="bp"],
	.MatQuan .bp{
        background: url(../images/pieces-small.png)-195px 0;
    }
    .board .rr, .FlyCo[data-conhac="rr"],
	.MatQuan .rr{
        background: url(../images/pieces-small.png)0 32px;
    }
    .board .rh,.board .rn, .FlyCo[data-conhac="rh"],.FlyCo[data-conhac="rn"],
	.MatQuan .rh,.MatQuan .rn{
        background: url(../images/pieces-small.png)-33px 32px;
    }
    .board .re,.board .rb, .FlyCo[data-conhac="re"],.FlyCo[data-conhac="rb"],
	.MatQuan .re,.MatQuan .rb{
        background: url(../images/pieces-small.png)-64px 32px;
    }
    .board .ra, .FlyCo[data-conhac="ra"],
	.MatQuan .ra{
        background: url(../images/pieces-small.png)-97px 32px;
    }
    .board .rk, .FlyCo[data-conhac="rk"],
	.MatQuan .rk{
        background: url(../images/pieces-small.png)-130px 32px;
    }
    .board .rc, .FlyCo[data-conhac="rc"],
	.MatQuan .rc{
        background: url(../images/pieces-small.png)-161px 32px;
    }
    .board .rp, .FlyCo[data-conhac="rp"],
	.MatQuan .rp{
        background: url(../images/pieces-small.png)-194px 32px;
    }
}
.tipsy.tipsy-n{display:none!important;}
/* cho trang danh mục sản phẩm */
.product-extra_anh .board {
	background: url(../images/board-small.jpg)no-repeat;
	width: 300px;
	height: 333px;
	float: left;
	padding: 0;
}
.product-extra_anh .br{
	background: url("../images/pieces-small.png");
}
.product-extra_anh .bh,.product-extra_anh .bn{
	background: url(../images/pieces-small.png)-34px 0;
}
.product-extra_anh .be,.product-extra_anh .bb{
	background: url(../images/pieces-small.png)-65px 0;
}
.product-extra_anh .ba{
	background: url(../images/pieces-small.png)-97px 0;
}
.product-extra_anh .bk{
	background: url(../images/pieces-small.png)-130px 0;
}
.product-extra_anh .bc{
	background: url(../images/pieces-small.png)-163px 0;
}
.product-extra_anh .bp{
	background: url(../images/pieces-small.png)-195px 0;
}
.product-extra_anh .rr{
	background: url(../images/pieces-small.png)0 32px;
}
.product-extra_anh .rh,.product-extra_anh .rn{
	background: url(../images/pieces-small.png)-33px 32px;
}
.product-extra_anh .re,.product-extra_anh .rb{
	background: url(../images/pieces-small.png)-64px 32px;
}
.product-extra_anh .ra{
	background: url(../images/pieces-small.png)-97px 32px;
}
.product-extra_anh .rk{
	background: url(../images/pieces-small.png)-130px 32px;
}
.product-extra_anh .rc{
	background: url(../images/pieces-small.png)-161px 32px;
}
.product-extra_anh .rp{
	background: url(../images/pieces-small.png)-194px 32px;
}

/* ===== FIX spacing list nước đi (KyDao style) ===== */
.zvanco-steps td{padding:4px 6px !important;}
.zvanco-steps td:first-child{
  width:26px !important; min-width:26px !important; max-width:26px !important;
  text-align:right !important; padding-right:6px !important; font-weight:700;
}
.zvanco-steps td:nth-child(2), .zvanco-steps td:nth-child(3){
  text-align:left !important; padding-left:8px !important;
}



/* ===== FIX START ALIGN (override td:first-child) ===== */
.zvanco-steps tr.mv-start td,
.zvanco-steps tr.mv-start td:first-child{
  text-align: left !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* ===== FIX COMMENT HEIGHT (NOT WIDTH) ===== */
.zvanco-comment,
.zvanco-comments,
.zvanco-comment-box{
  height: 500px !important;
  max-height: 500px !important;
  overflow: auto;
}


/* ===== FIX STEPS + COMMENT MAX-HEIGHT 495px ===== */
.zvanco-steps{
  max-height: 500px !important;
  height: 500px !important;
  overflow: auto !important;
}

.zvanco-comment,
.zvanco-comments,
.zvanco-comment-box{
  max-height: 500px !important;
  height: 500px !important;
  overflow: auto !important;
}


/* ===== NORMALIZE BOX MODEL so 495px looks same visually ===== */
.zvanco-steps,
.zvanco-comment,
.zvanco-comments,
.zvanco-comment-box{
  box-sizing: border-box !important;
}

/* Ensure inner tables don't add extra vertical gaps */
.zvanco-steps table{margin:0 !important;}
.zvanco-steps td{line-height:1.25 !important;}


/* ===== FINAL FIX: 497px + single scrollbar ===== */
.zvanco-steps,
.zvanco-comment,
.zvanco-comments,
.zvanco-comment-box{
  box-sizing: border-box !important;
  height: 500px !important;
  max-height: 500px !important;
}

/* Outer containers: hide overflow to avoid double scrollbar */
.zvanco-comment,
.zvanco-comments,
.zvanco-comment-box{
  overflow: hidden !important;
}

/* Inner scroll only */
.zvanco-steps{
  overflow-y: auto !important;
}

.zvanco-comment .content,
.zvanco-comment-box .content,
#divComment{
  height: 100%;
  overflow-y: auto;
}


/* ===== OVERRIDE: FORCE 497px (last rule wins) ===== */
.zvanco-steps,
.zvanco-comment,
.zvanco-comments,
.zvanco-comment-box{
  box-sizing: border-box !important;
  height: 500px !important;
  max-height: 500px !important;
}


/* ===== FINAL OVERRIDE: FORCE 500px ===== */
.zvanco-steps,
.zvanco-comment,
.zvanco-comments,
.zvanco-comment-box{
  box-sizing: border-box !important;
  height: 500px !important;
  max-height: 500px !important;
}