body{background-color: #f8f8f8; font-size: 14px; font-family: Arial, 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: 400; overflow-x: hidden; overflow-y: auto;}
table,tr,th,td{font-size: 14px;}
.bg-webcome-box{background: url('/imgs/welcome-home.jpg') no-repeat center center; width: 100%; height: auto; color: #fff; padding: 20px; min-height: 500px;}
.empty-css{} .form-control{height: 30px;} .no-record{padding: 40px 20px; text-align: center; color: #c0c0c0; font-size: 32px;}
.nav-logo{position: relative; max-height: 90px;}
.nav-logo img {height: 50px;} .nowrap{white-space: nowrap;}
.user-panel{padding: 5px 10px;} .user-panel > .image > img, .img-avatar{ border-radius: 50%; width: 40px; height: 40px; border: 1px solid #0061B3; padding: 2px;}
.img-avatar-sm{ border-radius: 50%; width: 32px; height: 32px; border: 1px solid #eee; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.2);}
.img-avatar-smw{ border-radius: 50%; width: 40px; height: 40px; border: 2px solid #fff;}
.img-profile{ border-radius: 50%; border: 1px solid #0061B3; padding: 2px;}
.divider{height: 1px; margin: 5px 0; overflow: hidden; background-color: #eee;}
.user-online-left {position: relative; float: left; font-size: 10px; margin-top: 20px; margin-left: -8px; border-radius: 50%; padding:0px; border: 2px solid #fff; z-index: 5;}
.user-online-right {position: relative; float: right; font-size: 10px; right: -40px; margin-top: 20px; border-radius: 50%; padding:0px; border: 2px solid #fff; z-index: 5;}
.btn-download { background-color: #64BA3D; border-color: #63B73B; color: #ffffff; }
.btn-download:hover { color: #ffffff; }
.flat-btn{padding: 3px 5px; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; border: 1px solid transparent;}
.icon-attach-file{cursor: pointer; border: 1px solid #ccc; padding: 5px; border-radius: 50%}
.icon-attach-file:hover{background-color: #f0f0f0;}

.star1, .star2, .star3, .star4, .star5 {cursor: pointer;}
.star-yellow {color: #ffff00;} .star-gray {color: #c5c5c5;}

.main-support-box{padding: 10px 5px 5px 5px}
.main-support-box>ul{padding: 10px 10px 0px 10px}
.main-support-box>ul>li{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #333;}
.main-support-box>ul>li>i{width: 20px;}
.main-support-title{font-size: 16px; color: #298DBA; font-weight: 700; padding: 0px 10px 2px 10px; border-bottom: 1px solid #e0e0e0;}

.pagination { display: inline-block; padding-left: 0; margin: 0; border-radius: 4px; }
.my-caret:after{ content: ' '; margin-left: 10px; vertical-align: middle; border-top: 5px dashed; border-top: 5px solid\9; border-right: 4px solid transparent; border-left: 4px solid transparent;}
    
.text-ellipsis{max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.box-empty-content{height: 300px; color: #ccc; font-size: 30px;}
.div-midle-center{display: inline-block; position: relative; top: 50%; left: 50%; text-align: center; transform: translate(-50%, -50%);}
.text-middle{vertical-align: middle; display: table-cell;}
.slogan{font-size: 13px; color: #0061B3; padding: 4px; font-weight: 700;}
.navbar-default{background-color: #ffffff;}
.small-link-u {font-size: 12px; color: #0260AF; text-decoration: underline;}
.small-link {font-size: 12px; color: #0260AF;}
.box{margin-bottom: 12px;} .has-error{color: #ff0000;}
.img-circle {border: 2px solid #0061B3; padding: 2px;}
.img-circle-1 {border: 1px solid #0061B3; padding: 2px; border-radius: 50%;}
.navbar-default .navbar-nav>li>a {color: #222222;}
.box-title-1{font-size: 22px; margin-bottom: 20px;}
.product-title{font-size: 22px; margin-bottom: 20px; padding:0; margin-top: 0;}
.pad2{padding: 2px}} .pad15{padding: 0px 15px;} .pad-bottom{padding-bottom: 10px;}  .color444{color: #666666;}
.welcome-home-img{width: 100%;}
.footer{line-height: 120%; border-top: 1px solid #e5e5e5; margin-top: 15px; padding: 10px; background-color: #0075BC; color: #fff; font-size: 13px;}
.footer>a{padding: 0px 5px; white-space: nowrap; color: #fefefe;}
.footer-title{color: #fefefe; padding: 5px 20px; font-size: 18px; font-weight: 700;}
.mnu-footer{padding: 0px 20px;} .mnu-footer>li{line-height: 25px; white-space: nowrap; padding-left: 4px;}
.mnu-footer>li>i{width: 20px;}
.mnu-footer>li>a{color: #fefefe}
.mnu-footer>li>a:hover{text-decoration: underline;}
.mnu-li>li:before {
    position: relative;
    padding-right: 5px;
    content: "\2192";
    font-family: fontawesome;
}}

.underline:hover{text-decoration: underline;}
a.link-name{font-weight: 700; color: #222;} a.link-name:hover{font-weight: 700; color: #666;}
a.more{font-size: 13px;} a.normal-link{color: #005fac} a.normal-link:hover{text-decoration: underline;}
a.policy{color:#298DBA;}
a.policy:hover{text-decoration: underline;}
.copyright{padding-top: 15px; color: #fefefe;}
.right-panel-about {
	max-height: 300px;
	width: 100%;
	overflow: scroll;
	background: url(/imgs/bg-intro.png) no-repeat bottom center;
	background-size: 100% auto;
}

.error-css{border: 1px solid #f95d44; color: #f95d44;}

.panel-title{padding: 0px 10px 10px 10px; font-weight: 600; color: #298DBA;}
.box-panel{margin-bottom: 15px;}
ul { list-style: none; margin-left: 0; padding-left: 0; }
ul.mnu-panel>li{padding: 6px 6px 0px 6px; cursor: pointer; border: 1px solid transparent; border-radius: 3px; position: relative;}
ul.mnu-panel>li:hover{background-color: #fefefe; border: 1px solid #e0e0e0;}
ul.mnu-panel>li>i{margin-right: 5px; color: #005CA7;}
ul.mnu-panel>li>a{color: #222222; display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
ul.mnu-panel>li>a>i{margin-right: 5px; color: #005CA7; font-size: 16px;}
ul.mnu-panel>li.mnu-active{background-color: #fefefe; border: 1px solid #e0e0e0; font-weight: 700;} 

#top-panel{margin-top:-20px; margin-bottom: 15px; border-bottom: 1px solid #e0e0e0; position:relative; background-color: #ffffff;}
#top-panel>ul{ position:relative; height: 36px; float: right; left: -50%}
#top-panel>ul>li{float:left; left:50%; position:relative; height: 46px; font-size: 22px; border:1px solid transparent; }/* ie needs position:relative here*/
#top-panel>ul>li:hover{border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; background-color: #fafafa;}
#top-panel>ul>li>a{display: block; padding: 10px 15px; width: 100%; height: 100%;}
#top-panel>ul>li.top-panel-active{border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; background-color: #fafafa;}
.navbar-collapse.in{overflow-y: initial;}

#box-search {padding-left: 15px; padding-right: 15px;}
#box-search-0 {padding-left: 15px; padding-right: 15px; margin-right: -25px; margin-left: -8px;}

#section-breadcrumb {margin-left: -15px;}
.breadcrumb-part {padding: 0px 15px 10px 0px;}
.breadcrumb-part>span {margin: 0 5px; color: #818085 !important;}
.breadcrumb-part>a {display: inline-block;
    color: #818085 !important;
    text-transform: capitalize;
    font-size: 13px;
}
.breadcrumb-part>a:last-child {
    pointer-events: none !important;
    cursor: not-allowed !important;
    font-weight: 700;
}

.dropdown-menu{padding: 0px 0px 1px 0px; margin-right: -1px; color:#333;}
.dropdown-menu > li > a {padding: 5px 15px; color: #333;}
.dropdown-menu > li > a:hover {background-color: #eee;}
.dropdown-menu > li > a >i {width: 6px;}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{background-color: #eee;}
/*
.navbar-default .navbar-nav>.open>a{color: #fff; background-color: #337ab7;}
.dropdown-menu, .dropdown-menu>li, .dropdown-menu > li > a{color: #fff; background-color: #337ab7; }
.dropdown-menu > li > a:hover{color: #222;background-color: #fff;}
*/

.post-action{padding: 12px; color: #888; border-bottom: 1px solid #eee;} .post-time{font-size: 11px; color: #999; margin-top: -2px;} .chat-time{font-size: 11px; color: #999; padding-top: 8px; margin-right: -8px;}
.post-action>span{margin-right: 10px;}
.post-time-link{font-size: 12px; color: #888; margin-top: -2px;}
.post-time-link:hover{color: #888; text-decoration: underline;}
.post-like, .post-comment, .post-reply {padding: 8px 10px; cursor: pointer; border: 1px solid transparent;}
.post-like:hover, .post-comment:hover, .post-reply:hover{border: 1px solid #ccc; border-radius: 3px; color: #005FAC}
.like-active{font-weight:700; color: #005FAC}

.post-toolbox{float: right; width: 40px; margin-right: -12px;}
.post-toolbox-btn{margin-top: -6px; padding: 4px; border: 1px solid transparent; cursor: pointer;} 
.post-toolbox-btn:hover{border: 1px solid #dfdfdf; border-radius: 4px;}
.post-body{padding: 12px 2px; border-bottom: 1px solid #dfdfdf;}
.post-body-content{overflow: hidden; text-overflow: ellipsis;}

.post-username{color: #4482c4; font-size: 14px; font-weight: 700;}
.comment-username{color: #4482c4; font-size: 13px; font-weight: 700;}
.supporter-username{color: #fff; font-size: 13px; font-weight: 700;}
.comment-area {padding: 10px 0px 0px 15px;}

.comment-box {padding: 10px; background-color: #efefef; border-radius: 10px; position: relative; margin: 0 0 15px 50px;}
.comment-box > .comment-box-userinfo {float: left; color: #4482c4; font-size: 13px; font-weight: 700;}
.comment-box > .comment-box-body {margin-top: -10px;}
.comment-box-body:before {
    position: absolute; right: 100%; top: 15px;
    border-top-color: transparent; border-top-style: solid; border-top-width: initial;
    border-right-color: #efefef; border-right-style: solid; border-right-width: initial;
    border-bottom-color: transparent; border-bottom-style: solid; border-bottom-width: initial;
    border-left-color: transparent; border-left-style: solid; border-left-width: initial;
    border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; border-right-color: #efefef;
    border-width: 6px; margin-top: -6px; content: ' '; height: 0; width: 0; pointer-events: none;
}

.msg-chat-box{padding: 5px 10px; background-color: #efefef; border-radius: 2px; position: relative; box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.2);}

.msg-chat-right{margin: 0px 0px 0px 40px;}
.msg-chat-right:before{position: absolute; right: 100%; top: 12px;
    border-top-color: transparent; border-top-style: solid; border-top-width: initial; border-right-color: #efefef;
    border-right-style: solid; border-right-width: initial; border-bottom-color: transparent; border-bottom-style: solid;
    border-bottom-width: initial; border-left-color: transparent; border-left-style: solid; border-left-width: initial;
    border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial;
    border-image-repeat: initial; border-right-color: #efefef; border-width: 5px; margin-top: -5px; content: ' '; height: 0; width: 0; pointer-events: none;}

.msg-chat-left{margin: 0px 40px 0px 0px;}
.msg-chat-left:after{position: absolute; right: -10px; top: 14px;
    border-top-color: transparent; border-top-style: solid; border-top-width: initial; 
    border-right-color: transparent; border-right-style: solid; border-right-width: initial;
    border-bottom-color: transparent; border-bottom-style: solid; border-bottom-width: initial; 
    border-left-color: #efefef; border-left-style: solid; border-left-width: initial; 
    border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; 
    border-width: 5px; margin-top: -5px; content: ' '; height: 0; width: 0; pointer-events: none;}

.toolbox-menu{background-color: #fff; margin: 0px 0px -1px 0px; border-radius: 2px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);}
.toolbox-menu>li:hover{background-color: #005fac; color: #fff;}
.toolbox-menu>li>a{display: block; padding: 6px 10px; color: #222;}
.toolbox-menu>li>a:hover{color:#fff;}

.fa-toolbox-icon:before{content: "\022EF"; letter-spacing: 2px; font-weight: 700; font-size: 20px;}
.fa-icon-orange{color: #ffbd33;} .fa-icon-gray{color: #aaaaaa;} .fa-icon-blue{color: #005FAC;}
.fa-icon-hoverwhite:hover{color: #fff;}

#ic-bottom-chat{font-size: 40px; color: #92BF33;}
#ic-bottom-chat:hover{color: #9BCC33;}
#box-bottom-chat {width: 300px; margin-bottom: -10px; font-size: 14px;}
#ic-btn-close-chat {color: #ccc; font-size: 16px;}
.notification-item{position: absolute; left: 70px; top: 60px; font-size: 12px;}

.product-box {padding: 5px 0px 15px 0px; } .product-box label{padding: 2px;}
.img-box{border: 1px solid #ccc; border-radius: 4px; padding: 4px; text-align: center; vertical-align: middle; overflow: hidden;}
.img-box-2{border: 1px solid #ccc; border-radius: 4px; padding: 4px; height: 420px; text-align: center; vertical-align: middle; overflow: hidden;}
.img-box-3{border: 1px solid #ccc; border-radius: 4px; padding: 1px;text-align: center; vertical-align: middle; overflow: hidden;}
.img-box > img, .img-box > a > img, .img-box-2 > img, .img-box-2 > a > img{width:100%; /* height:100%; */ object-fit: fill; }
.btn-product{font-size: 13px; padding: 3px 0px; margin: 1px; white-space:nowrap; width: 100%; border-radius: 2px; -webkit-box-shadow: none; box-shadow: none; border: 1px solid transparent;}
.btn-product-2{font-size: 13px; padding: 5px 10px; margin: 1px; white-space:nowrap; border-radius: 2px; -webkit-box-shadow: none; box-shadow: none; border: 1px solid transparent;}
.div-btn-product{padding: 2px 1px;}

.modal-product{position: fixed; display:none; z-index: 1001; width: 100%; height: 100%; top:0; left:0; right:0; bottom:0; background-color: rgba(0, 0, 0, 0.8);}
.modal-product .modal-box { background-color: #fff; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1002; overflow: hidden; width: 600px; height: 580px; border-radius: 4px;}
.modal-product .modal-box .modal-box-body {position: absolute; top:32px; left:0; overflow: scroll; width: 100%; height: 100%; padding-bottom: 40px;}
.modal-product .modal-box .modal-product-title {background-color: #005fac; font-weight:700; color: #fff; text-transform: uppercase; height: 32px; padding: 6px; vertical-align: middle; text-align: center;}
.modal-product .modal-box .modal-body div {padding-bottom: 5px;}
.navbar-right{margin-right: -25px; margin-left: -10px;}

.vrehab-icon {background-image: url('/imgs/sprites-2.png'); background-repeat: no-repeat; display: inline-block;}
.vrehab-online{width: 12px; height: 12px; background-position: -12px 0px;}
.vrehab-offline{width: 12px; height: 12px; background-position: 0px 0px;}
.vrehab-friend-disable{width: 12px; height: 12px; background-position: 0px -12px;}
.vrehab-friend-active{width: 12px; height: 12px; background-position: -12px -12px;}
.vrehab-verify{width: 12px; height: 12px; background-position: -12px -24px;}
.vrehab-unverify{width: 12px; height: 12px; background-position: 0px -24px;}
.vrehab-general{width: 12px; height: 12px; background-position: 0px -60px;}
.vrehab-silver{width: 12px; height: 12px; background-position: -12px -48px;}
.vrehab-gold{width: 12px; height: 12px; background-position: -12px -36px;}
.vrehab-diamon{width: 12px; height: 12px; background-position: 0px -72px;}
.vrehab-bullet{width: 12px; height: 12px; background-position: 0px -84px;}

.fb {background-image: url('/imgs/fb-icons1.png'); background-repeat: no-repeat; display: inline-block;}
.fb-newsfeed{width: 20px; height: 20px; background-position: 0px -1374px; float: left;}
.fb-messages{width: 20px; height: 20px; background-position: 0px -240px; float: left;}
.fb-inbox{width: 20px; height: 20px; background-position: 0px 0px; float: left;}
.fb-bookmark{width: 20px; height: 20px; background-position: 0px -408px; float: left;}
.fb-activity{width: 20px; height: 20px; background-position: 0px -1205px; float: left;}
.fb-map-point{width: 20px; height: 20px; background-position: 0px -1521px; float: left;}
.fb-friends{width: 12px; height: 12px; background-position: 0px -440px; float: left;}

@media (min-width: 768px) {
	.nav-logo img {height: 50px;}
	.mnu-header{/*margin-left: 20px;*/}
	.mnu-header>li>a{vertical-align:middle; display: table-cell; /* height: 100px;*/ font-weight: 700;}
	.navbar-right>li>a.user-name {vertical-align: middle; display: table-cell; height: 100%;}
	#user-panel{display: block;} #top-panel{display: none;}
	#category-panel{display: block;} #document-panel{display: block;}
	#box-search{padding-top: 35px; padding-left: 30px; width: 300px;}
	#box-search-0{/*padding-top: 35px; padding-left: 30px; width: 230px;*/}
}
@media (max-width: 767px) {
	.modal-product > .modal-box { width: 90%;} .mnu-header>li>a{font-weight: 700;}
	.navbar-brand {
	    float: left;
	    height: 64px;
	    padding: 10px 15px;
	    font-size: 16px;
	    line-height: 20px;
	}
	.navbar-nav .open .dropdown-menu {margin-right: 0; color:#333;}
	.navbar-default .navbar-nav .open .dropdown-menu>li>a {color:#333;}
	.nav-logo img {height: 30px;} .slogan{}
	.welcome-home-img {display: none;} .user-panel {padding: 0px 0px 5px 0px;}
	.navbar-right>li>a.user-name {vertical-align: middle; height: 70px;}
	#user-panel{display: none;} #top-panel{display: block;}
	/* #category-panel{display: none;} */ #document-panel{display: none;}
	.notification-item{position: absolute; left: 60px; top: 45px; font-size: 12px;}
	.navbar-default .navbar-nav .open .dropdown-menu>li:hover{background-color: #eee;}
	.my-dropdown-content-2 {left:-50px;}
	.container{background-color: #f8f8f8;}
    .vre-ads-left{display: none;}
}

/*******************/
/* Dropdown Button */
/*******************/
.my-dropbtn {cursor: pointer; width: 100%; text-overflow: ellipsis; overflow: hidden; max-width: 120px; display: inline-block;}
.my-dropdown { position: relative; display: inline-block;}
.my-dropdown-content, .my-dropdown-content-2 { display: none; position: absolute; text-align: left; background-color: #ffffff; border: 1px solid #eee; border-radius: 2px; min-width: 150px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 5;}
.my-dropdown-content a { color: black; padding: 5px 10px; text-decoration: none; display: block; white-space: nowrap;}

.my-dropdown-content-2 {margin-bottom: 20px; right: -10px; padding: 0; font-size: 13px; width: 320px;}
.my-dropdown-content-2>div.item{padding: 10px; width: 100%; height: 100%; position: relative; border-bottom: 1px solid #eee; margin-bottom: -1px;}
.my-dropdown-content-2>div.item:hover {background-color: #f5f5f5;}

.my-dropdown-content a:hover {background-color: #005fac; color: #fff;}
.my-dropdown:hover .my-dropdown-content {display: block;}
.my-dropdown:hover .my-dropdown-content-2 {display: block;}