@font-face { font-family: 'VNI-Thufap1'; src: url('../fonts/VNI-Thufap1.woff') format('woff'), url('../fonts/VNI-Thufap1.ttf') format('truetype'), url('../fonts/VNI-Thufap1.svg#VNI-Thufap1') format('svg'); font-weight: normal; font-style: normal; }

@font-face { font-family: 'VNI-Thufap1'; src: url('../fonts/Vntfap01_1.eot'); src: url('../fonts/Vntfap01_1.woff2') format('woff2'), url('../fonts/Vntfap01_1.eot?#iefix') format('embedded-opentype'); font-weight: normal; font-style: normal; }

/*normalize*/
html, body, form { height: 100%; margin: 0; padding: 0; background: url("/images/bgmain.jpg") no-repeat top; background-color: #faf9f7; }
body { font: normal 14px "Segoe UI", Arial, sans-serif; color: #1b170c; }

@media only screen and (max-width: 480px) {
    body { font-size: 16px; }
    #wrapper .header { text-align: left; padding: 0; }
    .hideItem { display: none; }
    .clsBag { width: 100%; }
}

@media only screen and (min-width: 481px) and (max-width: 770px) {
    body { font-size: 15px; }
    #wrapper .header { text-align: left; padding: 0; }
    .hideItem { display: none; }
    .clsBag { width: 48.4%; }
}

@media only screen and (min-width: 770px) {
    #wrapper .header { text-align: center; padding: 0; }
    .clsBag { width: 48.4%; }
}

.calendar
{
  text-align: center;
}

a { background: transparent; text-decoration: none; }
    a:hover { color: red; }

img { border: 0; }

button,
input { -webkit-appearance: none; cursor: pointer; }

hr { border-width: 1px 0 0 0; border-color: #767676; border-style: solid; }
/*typography*/
h1, h2, h3, h4, h5, h6 { line-height: normal; }
h1, h2, h3 { font-weight: normal; margin: .5em 0; }
h4, h5, h6 { font-weight: bold; }
h1 { font-size: 2.25em; }
h2 { font-size: 1.875em; }
h3 { font-size: 1.5em; }
h4 { font-size: 1.125em; }
h5 { font-size: 1em; }
h6 { font-size: .875em; }

.clsSuccess { color: blue; }
.clsWarned { color: #ff7200; }
.clsFailed { color: red; }
.subTitle { font-size: smaller; color: #999999; }
.clear { clear: both; }

.RadMenu_Bootstrap .rmRootGroup { border: none !important; }
#wrapper .RadButton { font-size: 1em; }

#wrapper .RadMenu, div.RadMenuPopup, #wrapper .RadMenu_Default, #wrapper .RadMenu_Default a.rmLink { font-size: 1em; }
#wrapper .header { background-image: url(/images/bgkSkin.jpg); padding: 0; margin: 0; }
    #wrapper .header .RadMenu { float: none; display: inline-block; vertical-align: top; }
.rmItem { background-image: url(/images/bgkSkin.jpg); }
    .rmItem a { color: #0c0e14 !important; padding: 10px 30px !important; font-size: medium !important; font-family: 'UVN_ThanhPho' !important; }
        .rmItem a:hover { background-image: url(/images/bgkSkin.jpg); color: #337ab7 !important; }
.rmSelected a { background-image: url(/images/bgkSkin.jpg); }
.hideItem a { color: transparent !important; }
    .hideItem a:hover { background-color: #472700 !important; cursor: default !important; }


#wrapper .dlogo { width: 48px; height: 48px; margin: -50px auto; position: relative; z-index: 99999; }
    #wrapper .dlogo a { display: block; padding: 40px; background-image: url("/img/logonew.png"); background-repeat: no-repeat; background-position: 0 0; }
        #wrapper .dlogo a:hover { background-position-y: 0px; }

/*template*/
#wrapper .t-container-fluid { max-width: 1020px; margin: 0 auto 0 auto; }
.clsHotline { max-width: 340px; height: 85px; background: url("../images/bgkHotline.png") no-repeat; margin: 100px 50px 0 150px; position: relative; }
    .clsHotline .clsFb { position: absolute; bottom: 12px; right: 220px; }
        .clsHotline .clsFb a { display: block; padding: 12px; background: url('../images/icoSocial.png') no-repeat 0 0; }
            .clsHotline .clsFb a:hover { background-position: 0 -25px; cursor: pointer; }
    .clsHotline .clsTw { position: absolute; bottom: 12px; right: 192px; }
        .clsHotline .clsTw a { display: block; padding: 12px; background: url('../images/icoSocial.png') no-repeat -24px 0; }
            .clsHotline .clsTw a:hover { background-position: -24px -25px; cursor: pointer; }
    .clsHotline .clsGg { position: absolute; bottom: 12px; right: 164px; }
        .clsHotline .clsGg a { display: block; padding: 12px; background: url('../images/icoSocial.png') no-repeat -48px 0; }
            .clsHotline .clsGg a:hover { background-position: -48px -25px; cursor: pointer; }
    .clsHotline .clsPr { position: absolute; bottom: 12px; right: 136px; }
        .clsHotline .clsPr a { display: block; padding: 12px; background: url('../images/icoSocial.png') no-repeat -72px 0; }
            .clsHotline .clsPr a:hover { background-position: -72px -25px; cursor: pointer; }
    .clsHotline .clsFbLike { position: absolute; bottom: 15px; right: 57px; }

.clsMainContent { position: relative; z-index: 10; padding: 3px; background: #f7f1dd/*#f0e3ca*/; border: 1px solid #635131; }
    .clsMainContent:before { content: ""; display: block; position: absolute; z-index: -1; top: 2px; left: 2px; right: 2px; bottom: 2px; border: 1px solid #392c14; }
.bottomContent { position: relative; z-index: 11; }
    .bottomContent .bcLeft { position: absolute; top: -14px; left: -7px; background: url('../images/bcLeft.png') no-repeat; width: 30px; height: 20px; }
    .bottomContent .bcRight { position: absolute; top: -14px; right: -7px; background: url('../images/bcRight.png') no-repeat; width: 30px; height: 20px; }

.clsItemTop { margin: 15px 0; }
.clsItem { margin-bottom: 15px; }
.clsHeaderTitle { background: url('../images/bgkht.png') repeat-x; width: 100%; height: 35px; border: solid 1px black; }
.clsHeaderTitle1 { background: url('../images/bgkht1.png') repeat-x; width: 100%; height: 35px; border: solid 1px black; position: relative; }
    .clsHeaderTitle1 span.clsTitleList { background: url('../images/icoDragon.png') no-repeat left; padding: 4px 0 4px 35px; top: 3px; left: 10px; font-weight: bold; color: white; position: absolute; text-transform: uppercase; }
    .clsHeaderTitle1 span.clsTitleDetail { background: url('../images/icoDragon1.png') no-repeat left; padding: 4px 0 4px 35px; top: 3px; left: 10px; font-weight: bold; color: white; position: absolute; text-transform: uppercase; }
    .clsHeaderTitle1 span.maintain { background: url('../images/icoMaintain.png') no-repeat left; padding: 4px 0 4px 35px; top: 3px; left: 10px; font-weight: bold; color: white; position: absolute; }
    .clsHeaderTitle1 span.specialFeatures { background: url('../images/icoSpecialFeature.png') no-repeat left; padding: 4px 0 4px 35px; top: 3px; left: 10px; font-weight: bold; color: white; position: absolute; }
    .clsHeaderTitle1 span.fbFanpage { background: url('../images/icoDateTime.png') no-repeat left; padding: 4px 0 4px 35px; top: 3px; left: 10px; font-weight: bold; color: white; position: absolute; }
    .clsHeaderTitle1 span.register { background: url('../images/icoReg.png') no-repeat left; padding: 4px 0 4px 35px; top: 3px; left: 10px; font-weight: bold; color: white; position: absolute; }

.socialShare { margin: 10px 0; text-align: right; }

.clsMgnAcc { width: 100%; background: url('../images/bgkColorPaper.jpg'); height: 60px; border-radius: 3px; border: 1px solid #6e4926; text-align: center; padding-top: 10px; }
    .clsMgnAcc a { display: inline-block; background: url('../images/lnkItems.png') no-repeat 0 0; padding: 26px 138px; }
        .clsMgnAcc a:hover { background-position-y: -54px; }

.clsGuideline { width: 100%; background: url('../images/bgkSkin.jpg'); height: 65px; border-radius: 3px; border: 1px solid #6e4926; text-align: center; padding-top: 5px; }
    .clsGuideline a { display: inline-block; background: url('../images/lnkItems.png') no-repeat 0 -106px; padding: 32px 138px; }
        .clsGuideline a:hover { background-position-y: -169px; }

.clsMaintain { width: 100%; text-align: center; /*background: url('../images/bgkMt.png');*/ height: 55px; padding-top: 10px; border: 1px solid #6e4926; font-size: large; }

.clsSpecialFeatures { width: 100%; border: solid 1px #c5ab79; background-color: #fbfaf8; }
    .clsSpecialFeatures ul { margin: 10px; padding: 0; }
        .clsSpecialFeatures ul li { list-style: none; padding: 5px 0 5px 0; border-bottom: solid 1px #c5ab79; width: 50%; float: left; }
            .clsSpecialFeatures ul li a { text-decoration: none; display: inline-block; padding-left: 23px; color: #533006; background: url('../images/icoStar.png') no-repeat left; }
                .clsSpecialFeatures ul li a:hover { color: red; }

.clsSpecialFeaturesDaily { width: 100%; border: solid 1px #c5ab79; background-color: #fbfaf8; }
    .clsSpecialFeaturesDaily ul { margin: 10px; padding: 0; }
        .clsSpecialFeaturesDaily ul li { list-style: none; padding: 5px 0 5px 0; border-bottom: solid 1px #c5ab79; float: left; }
            .clsSpecialFeaturesDaily ul li a { text-decoration: none; display: inline-block; padding-left: 23px; color: #533006; background: url('../images/icoStar.png') no-repeat left; }
                .clsSpecialFeaturesDaily ul li a:hover { color: red; }

.clsList { }
    .clsList ul { margin: 0; padding: 0; }
        .clsList ul li { list-style: none; }
            .clsList ul li a { display: block; border-bottom: solid 1px #e0cdb5; padding: 5px 0 5px 25px; text-decoration: none; color: #333333; }
                .clsList ul li a:hover { color: red; }
                .clsList ul li a.New { font-weight: bold; }

                .clsList ul li a.related { background: url('../images/icoRightArr.png') no-repeat left; }
                .clsList ul li a.news { background: url('../images/iconh.png') no-repeat left; }
                .clsList ul li a.specialfeature { background: url('../images/icoStar.png') no-repeat left; }
                .clsList ul li a.event { background: url('../images/icoShield.png') no-repeat left; }

                .clsList ul li a span.Date { float: right; font-weight: normal; font-size: small; color: #999999; }

.clsListPager div { border: none !important; background: none !important; text-align: center; }
.RadDataPager, .RadDataPager_Bootstrap { width: 216px !important; margin: 10px auto 0 auto !important; }
    .RadDataPager .rdpCurrentPage, .RadDataPager_Bootstrap .rdpCurrentPage { background-color: #944b07 !important; border-color: #cccccc !important; }

.clsFBFanpage { width: 100%; border: solid 1px #c5ab79; border-top: none; }

.relatedPost h4 { margin: 10px 0; padding: 3px 10px; background-color: #7e1001; color: white; font-weight: normal; }
/*.fb_iframe_widget span[style] { width: 100% !important; }*/
.fb-comments { width: 100% !important; }

.clsRegisterForm { max-width: 340px; margin: 10px auto; text-align: center; }
    .clsRegisterForm .clsMessageArea { text-align: center; margin: 10px; }
.clsRegForm { text-align: left; vertical-align: top; }
    .clsRegForm .RadInput { vertical-align: top !important; }
    .clsRegForm input, .clsRegForm .ddl { margin: 3px 0 2px 0; }
        .clsRegForm input.clsRegLeft { float: left; }
        .clsRegForm input.clsRegRight { float: right; }
    .clsRegForm .clsRegGender { margin-top: 5px; }
    .clsRegForm .clsOK { margin-top: 5px; }
.clsCaptchaImage { float: left; }

.clsRegisterPanel { width: 100%; margin-top: 10px; }

/* Form validator */

.help-block { display: inline; padding-left: 6px; font-size: 85%; }

span.form-error.help-block { display: block; color: red; padding-left: 0; font-size: 1em; }

div.form-error { padding: 6px 12px; line-height: 180%; background: #ffe5ed; border-radius: 4px; margin-bottom: 22px; color: darkred; }

input.valid { background: url(../Images/icon-ok.png) no-repeat right center #e3ffe5; color: #002f00; border-color: #96b796 !important; }

input.error { background: url(../Images/icon-fail.png) no-repeat right center #ffebef; color: #480000; }

.form-suggest-element { padding: 4px; }

form.validating-server-side .server-validation { background: url(../Images/ajax-loader.gif?v=2) no-repeat center right #FFF; opacity: 0.5; }

.max-chars { background: #EEE; color: #999; }

.form-help { padding-left: 6px; font-size: 90%; color: #888; }

.clsLoginForm { max-width: 300px; margin: 80px auto; }
    .clsLoginForm input { margin: 3px 0 2px 0; }
    .clsLoginForm .clsOK { margin-top: 5px; }
.clsMessageArea { margin-bottom: 5px; }

.clsMenuUser { background-color: #530600; margin-left: -15px; margin-right: -15px; }
    .clsMenuUser .RadMenu, div.RadMenuPopup, .clsMenuUser .RadMenu_Default, .clsMenuUser .RadMenu_Default a.rmLink, .clsMenuUser .RadMenu .rmHorizontal { background-color: #530600 !important; border-radius: 0 !important; }
    /*#wrapper .header { background-image: url(../images/bgkhm.png); padding: 0; margin: 0; }*/
    .clsMenuUser .RadMenu { float: none; display: inline-block; vertical-align: top; }
        .clsMenuUser .RadMenu .rmHorizontal .rmItem { background-color: #530600 !important; }
            .clsMenuUser .RadMenu .rmHorizontal .rmItem a { color: #600404 !important; padding: 9px 24px !important; font-size: 1em !important; font-family: Tahoma !important; }
                .clsMenuUser .RadMenu .rmHorizontal .rmItem a:hover { color: yellow !important; background-color: #390501 !important; }
        .clsMenuUser .RadMenu .rmHorizontal .rmSelected a { background-color: #533c21 !important; }
        .clsMenuUser .RadMenu .rmHorizontal .hideItem a { color: #472700 !important; }
            .clsMenuUser .RadMenu .rmHorizontal .hideItem a:hover { background-color: #472700 !important; cursor: default !important; }


#wrapper .footer { margin: 0; padding: 5px 0 0 0; height: 25px; text-align: center; vertical-align: bottom; color: white; font-size: small; }

.clsCoinBag { position: relative; background-color: #ffffff; border: solid 1px #c7c7c7; height: 32px; }
.clsCoin { position: absolute; left: 10px; top: 5px; }
    .clsCoin a, .clsCoin a:visited { display: block; background: url('../images/icoHeroCoin.png') no-repeat; padding: 1px 0 0 28px; font-weight: bold; color: #ff6000; }
        .clsCoin a:hover { background-position-y: -21px; color: red; }
.clsVlCoin { position: absolute; left: 35%; top: 5px; }
    .clsVlCoin a, .clsVlCoin a:visited { display: block; background: url('../images/icoVlCoin.png') no-repeat; padding: 1px 0 0 28px; font-weight: bold; color: #6b6552; }
        .clsVlCoin a:hover { background-position-y: -21px; color: #394142; }
.clsGift { position: absolute; left: 70%; top: 5px; }
    .clsGift a, .clsGift a:visited { display: block; background: url('../images/icoGift.png') no-repeat; padding: 1px 0 0 28px; font-weight: bold; color: #0071da; }
        .clsGift a:hover { background-position-y: -21px; color: #034888; }

.clsBag { margin: 0 10px 10px 0; float: left; }
.clsBagHeader { background-color: #ffffff; border-bottom: solid 1px #bbbbbb; padding: 5px 5px 5px 10px; background-image: url('../images/icoRightArr.png'); background-repeat: no-repeat; background-position: right; }
    .clsBagHeader a { color: black; display: block; background-position: left; background-repeat: no-repeat; padding-left: 35px; }

.icoExpiration { background-color: #e4ffc8;}
    .icoExpiration a { background-image: url('../images/icoDateTime.png'); }
.icoCoin { background-color: #ffcc66; }
    .icoCoin a { background-image: url('../images/icoTienXu.png'); }
.icoReward { background-color: #99ccff; }
    .icoReward a { background-image: url('../images/icoStarPoint.png'); }
.icoPromotion { background-color: #fbbdbd; }
    .icoPromotion a { background-image: url('../images/icoReward.png'); }
.icoFriendship { background-color: #fffecd; }
    .icoFriendship a { background-image: url('../images/icoFriendship.png'); }
.clsBagContent { background-color: #eeeeee; padding: 10px 10px 10px 40px; color: #888888; height: 60px; line-height: 28px; }

.clsStarPoint { display: block; background-image: url('../images/icoStarPoint.png'); background-position: right; background-repeat: no-repeat; padding-right: 32px; font-weight: bold; font-size: 1.5em; text-align: right; }
.clsStarPointSmall { background-image: url('../images/icoStarPointSmall.png'); background-position: left; background-position-x: 50px; background-repeat: no-repeat; width: 60px; text-align: right; }

.clsTitleLabel { border-left: solid 4px #e17208; padding: 5px; }

.has-error input { border: solid 1px #b94a48 !important; background-color: #ffebef !important; }
.has-success input { border: solid 1px #96b796 !important; background-color: #e3ffe5 !important; }

.clsPaymentType { }
    .clsPaymentType ul.paytype { margin: 0; padding: 0; }
ul.paytype li { margin: 5px; width: 101px; height: 55px; display: block; float: left; position: relative; z-index: 0; cursor: pointer; zoom: 1; border: 1px solid #999999; }
    ul.paytype li.selected, ul.paytype li.True:hover { cursor: pointer; border: 1px solid #d86101; z-index: 1; background: #ffddc1; }
    ul.paytype li.False { background-color: #dddddd; cursor: default; }
    /*disabled*/

    ul.paytype li span.paymentStatus { position: absolute; top: 0; left: 0; width: 98px; height: 13px; text-align: right; padding-right: 3px; font-size: xx-small; color: green; z-index: -1; }
    ul.paytype li.False span.paymentStatus { color: red; }
    ul.paytype li span.paytypename { position: absolute; width: 101px; left: 0; bottom: 1px; font-size: xx-small; font-weight: bold; text-align: center; }
    ul.paytype li span.logoPaymentType { position: absolute; width: 85px; height: 38px; left: 8px; top: 8px; display: inline-block; }
    ul.paytype li span.logoImg { background-image: url(../images/paymenttype.png); background-repeat: no-repeat; }
    ul.paytype li span.banktransfer { background-position: -85px -38px; }
    ul.paytype li span.mobifone { background-position: 0px 0px; }
    ul.paytype li span.vinaphone { background-position: -85px 0px; }
    ul.paytype li span.viettel { background-position: 0 -38px; }
    ul.paytype li span.fptgate { background-position: 0 -76px; }
    ul.paytype li span.vietnammobile { background-position: -85px -76px; }
	ul.paytype li span.zingxu { background-position: -85px -114px; }
    ul.paytype li span.cornerTL { position: absolute; width: 38px; height: 38px; top: -2px; left: -2px; }
    ul.paytype li span.promotion { background-position: 0 -114px; }
    ul.paytype li span.showTrue { display: block; }
    ul.paytype li span.showFalse { display: none; }

    .clsPaymentType ul.payext { margin: 0; padding: 0; }
    ul.payext li { margin: 5px; width: 101px; height: 55px; display: block; float: left; position: relative; z-index: 0; cursor: pointer; zoom: 1; border: 1px solid #999999; background-color: #dddddd; }
    ul.payext li.selected, ul.payext li.extAcc:hover { cursor: pointer; border: 1px solid #488a02; z-index: 1; background: #efffdd; }
    ul.payext li span.payDay { position: absolute; width: 101px; top: 7px; font-size: larger; font-weight: bold; text-align: center; }
    ul.payext li span.payDayCoin { position: absolute; width: 101px; left: 0; bottom: 7px; font-size: small; font-weight: bold; text-align: center; color: #999999;}
	
.step2 { }
.step3 { margin-top: 20px; }

.plus5p { font-weight: bold; color: #07bb13; }
.plus7p { font-weight: bold; color: #07a8bb; }
.plus9p { font-weight: bold; color: #000be9; }
.plus10p { font-weight: bold; color: #bb07a4; }
.plus15p { font-weight: bold; color: #f40303; }
.coin { display: inline; background: url('../images/icoTienXu.png') no-repeat; background-position: right; padding: 6px 30px 4px 0; font-weight: bold; }
.reward { display: inline; background: url('../images/icoStarPoint.png') no-repeat; background-position: right; padding: 15px; font-weight: bold; }

.showPromotion { font-size: small; font-weight: bold; padding: 3px; text-align: center; background-color: #fdfbd1; border: solid 1px #fff600; }
.showPriceList { float: right; font-size: small; cursor: pointer; text-decoration: underline; color: #333333; }
.showPriceListCard, .showPriceListBank { cursor: pointer; }

.clsPromotion a.clsApply { margin-top: 3px; display: inline-block; width: 34px; height: 34px; background: url(../images/btnRightArr.png) no-repeat; background-position: 0 0; cursor: pointer; }
    .clsPromotion a.clsApply:hover { background-position: 0 -34px; }

.clsGridHeader { text-align: center !important; font-weight: bold !important; }
.clsGridHeaderSmall { text-align: center !important; font-weight: bold !important; font-size: 0.9em !important; }
.clsGridItemSmall { font-size: 0.9em !important; }
.clsGridWaiting { background-color: #facfcf; }
.clsGridProcessing { background-color: #d2f9d2; }
.clsGridDone { background-color: #e1f7ff; }
    .clsGridRow td, .clsGridWaiting td, .clsGridProcessing td, .clsGridDone td { padding: 10px; font-size: .9em; border-left: solid 1px #dddddd; border-bottom: solid 1px #dddddd; }