body{ font-size: 12px; margin-top: 40px; background-color: #F5F5F5;}
.navbar-static-top ,.navbar-fixed-top{ margin-bottom: 0; min-height: 40px;}
.navbar-green { background-color: #9ee34a; border-color: #95DD3D;}
.navbar-green .navbar-nav>.active>a, .navbar-green .navbar-nav>.active>a:focus, .navbar-green .navbar-nav>.active>a:hover{ color: #457C03; background-color: #D1F4A6;}
.nav>li>a:focus, .nav>li>a:hover { text-decoration: none; background-color: #D1F4A6;}
.navbar-nav>li>a { padding-top: 10px; padding-bottom: 10px;}
.navbar-brand { height: 40px; padding: 5px 15px; font-size: 12px;}
a { color: #3B6B03; text-decoration: none;}
a:hover { color: #3B6B03; text-decoration: none;}
a.name-product { color: #333; text-decoration: none;}
a.name-product:hover { color: #3B6B03; text-decoration: none;}
.bg-box-search{ background: #BCED7B; padding: 3px 0;}
.menu-bar{ background: #ddf8b5; box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.06); z-index: 3; position: relative; padding-top: 8px; padding-bottom: 8px;}
.nav-menu-bar>li.active>a, .nav-menu-bar>li.active>a:focus, .nav-menu-bar>li.active>a:hover { color: #fff; background-color: #8CD237;}
.nav-menu-bar>li>a:hover{ color: #fff; background-color: #8CD237;}
.nav-menu-bar .open>a:focus ,.nav-menu-bar .open>a:hover{ color: #fff; background-color: #8CD237;}
.radius{ border-radius: 4px;}
.active-color{ border-color: #ff5500; box-shadow: 0 1px 2px 1px rgba(230, 27, 27, 0.5);}
.bg-rate{background: #9ee34a url('/images/pattern_left_green_02.png?v=1');}
.font-8{ font-size: 8px;}
.font-10{ font-size: 10px;}
.font-11{ font-size: 11px;}
.font-12{ font-size: 12px;}
.font-13{ font-size: 13px;}
.font-14{ font-size: 14px;}
.font-16{ font-size: 16px;}
.font-18{ font-size: 18px}
.font-20{ font-size: 20px;}
.font-22{ font-size: 22px;}
.font-24{ font-size: 24px;}
.font-30{ font-size: 30px;}
.font-70{ font-size: 70px; font-weight: bold;}
.mg-tb-0{ margin: 0;}
.mg-tb-3{ margin: 3px 0 3px 0;}
.mg-0{ margin: 0;}
.mg-5{ margin: 5px 0;}
.mg-10{ margin: 10px 0;}
.mg-left-5{ margin-left: 5px;}
.mg-left-10{ margin-left: 10px;}
.mg-left-20{ margin-left: 20px;}
.mg-right-5{ margin-right: 5px;}
.mg-right-10{ margin-right: 10px;}
.mg-right-20{ margin-right: 20px;}
input[type=checkbox].mg-top-0,input[type=radio].mg-top-0,.mg-top-0{ margin-top: 0;}
input[type=checkbox].mg-top-1,input[type=radio].mg-top-1,.mg-top-1{ margin-top: 1px;}
input[type=checkbox].mg-top-2,input[type=radio].mg-top-2,.mg-top-2{ margin-top: 2px;}
.mg-top-1{ margin-top: 1px;}
.mg-top-2{ margin-top: 2px;}
.mg-top-3{ margin-top: 3px;}
.mg-top-5{ margin-top: 5px;}
.mg-top-10{ margin-top: 10px;}
.mg-top-15{ margin-top: 15px;}
.mg-top-20{ margin-top: 20px;}
.mg-top-30{ margin-top: 30px;}
.mg-top-40{ margin-top: 40px;}
.mg-top-50{ margin-top: 50px;}
.mg-bottom-0{ margin-bottom: 0;}
.mg-bottom-5{ margin-bottom: 5px;}
.mg-bottom-10{ margin-bottom: 10px;}
.mg-bottom-20{ margin-bottom: 20px;}
.mg-bottom-30{ margin-bottom: 30px;}
.table>tbody>tr>th.pd-3,.table>tbody>tr>td.pd-3,.table>tbody>tr.pd-3>th,.table>tbody>tr.pd-3>td,pd-3{padding: 3px;}
.table>tbody>tr>th.pd-lr-3,.table>tbody>tr>td.pd-lr-3,.table>tbody>tr.pd-lr-3>th,.table>tbody>tr.pd-lr-3>td,pd-lr-3{padding-left: 3px; padding-right: 3px;}
.pd-2{ padding: 2px;}
.pd-3{ padding: 3px;}
.pd-5{ padding: 5px;}
.pd-10{ padding: 10px;}
.pd-20{ padding: 20px;}
.pd-tb-0 ,.pd-0{ padding: 0;}
.pd-bottom-0{ padding-bottom: 0;}
.pd-left-5{padding-left: 5px;}
.pd-left-10{padding-left: 10px;}
.pd-right-5{padding-right: 5px;}
.pd-right-10{padding-right: 10px;}
.pd-lr-5{ padding-left: 5px; padding-right: 5px; }
.pd-lr-10{ padding-left: 10px; padding-right: 10px; }
.pd-lr-20{ padding-left: 20px; padding-right: 20px; }
.pd-tb-5{ padding-top: 5px; padding-bottom: 5px;}
.pd-tb-10{ padding-top: 10px; padding-bottom: 10px;}
.pd-tb-50{ padding-top: 50px; padding-bottom: 50px;}
.pd-top-5{ padding-top: 5px;}
.pd-top-10{ padding-top: 10px;}
.pd-top-20{ padding-top: 20px;}
.pd-bottom-20{ padding-bottom: 20px;}
.div-bottom{ position: absolute; bottom: 26px;}
.text-green{ color: #457C03;}
a.text-green{ color: #457C03;}
.text-white{ color: #ffffff;}
.text-red{ color: red;}
.text-yellow{ color: #ff9900;}
.text-back{ color: #000000;}
.text-head{ color: #333}
a.text-head{ color: #333}
.text-gray{ color: #999}
.text-muteds{ color: #b5b5b5;}
.text-head-shadow{ text-shadow: #fff 1px 1px 1px;}
.text-rate-shadow{ text-shadow: #457C03 1px 1px 1px;}
.table>tbody>tr>td.text-middle ,.table>tbody>tr.text-middle>th ,tr.text-middle td ,table.text-middle th{vertical-align: middle;}
.badge-green{ background-color: #457C03;}
.btn-orange{color: #fff; background-color: #FD6101; border-color: #E45903;}
.btn-orange:hover{color: #fff; background-color: #F46006; border-color: #E45903;}
.modal-md{ width: 400px;}
.bg-page{ background: #fff; margin-bottom: 15px; padding-left: 30px; box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.03);}
.bg-gn{background-color: #8CD237;}
.bg-green-light{ background: #BCED7B /*#DDF8B5;*/}
.head-item{ background: #DDF8B5;}
a:hover.head-item {background: #DDF8B5;}
a:visited.head-item {background: #DDF8B5;}
.bg-gray {background-color: #F2F8FC;}
.bg-yellow{background-color: #FFFFAA;}
.content-page{ border-radius: 5px; padding: 20px;}
.content-bg{ border-radius: 5px; background: #fff; padding-top: 15px; margin-bottom: 20px; -webkit-box-shadow: 0px 0px 15px 3px rgba(238, 238, 238 ,1); -moz-box-shadow: 0px 0px 15px 3px rgba(238, 238, 238 ,1); box-shadow: 0px 0px 15px 3px rgba(238, 238, 238 ,1);}
.btn-block{ width: 100%;}
.btn-theme{ color: #fff; background-color: #8CD237; border-color: #83C731;}
.btn-theme:hover { color: #fff; background-color: #81C330; border-color: #82DB15;}
.wrapper-slide{ margin-top: -16px;} 
.onshadow:hover{box-shadow: 0px 1px 10px 2px #d7d7d7;}
.onshadow-theme:hover{box-shadow: 0px 1px 10px 2px #457C03;}
.price-product{ position: absolute; margin-top: -34px; background: #082503; background-color:rgba(24, 24, 24, 0.5); padding: 3px 8px; color: #fff;}
.price-special-product{ position: absolute; margin-top: -60px; background: red; background-color:rgba(255, 0, 0, 0.5); padding: 3px 8px; color: #fff;}
.box-shadow{ box-shadow: 0px 10px 20px 3px #d3d3d3;}
.box-icon{ width: 113px;}
.footer{ background: #BCED7B; padding-top: 20px; color: #fff;}
#toTop { position: fixed; bottom: 50px; right: 10px; cursor: pointer; display: none;}
.pic-news{ border: 0; width: 100%; height: 110px; vertical-align: middle; overflow: hidden;}
.pic{ border: 0; max-width: 215px; max-height: 215px; vertical-align: middle; overflow: hidden; text-align: center; margin: 0 auto;}
.pic>a>img{ width: 100%; max-height: 215px;}
.pic-news{ max-height: 170px;}
.pic-product{ max-height: 176px !important;}
.box-list-news{ min-height: 290px;}
ul.hover-default>li.list-group-item:hover{ background: #f5f5f5;}
div.hover-default>div.list-group-item:hover{ background: #f5f5f5;}
.bg-rad{ background: #D9534F;}
.bg-none , .table-striped>tbody>tr.bg-none{ background: none;}
.table-striped>tbody>tr.bg-success { background-color: #dff0d8;}
.min-height{ min-height: 400px;}
.text-middle{ vertical-align: middle;}
.border{ border: 1px solid #ccc;}
.chat-bd-admin { border: 1px solid #269ABC;}
.chat-bd-user { border: 1px solid #F3CA78;}
.vertical{ vertical-align: top;}
.box-list-color{height:65px; margin-bottom: 10px;}
.row-left{padding-left: 15px; padding-right: 10px;}
.row-mid{padding-left: 10px; padding-right: 10px;}
.row-right{padding-left: 10px; padding-right: 15px;}
.wd-1{ width: 50px;}
.wd-2{ width: 100px;}
.wd-3{ width: 150px !important;}
.wd-4{ width: 200px;}
.wd-5{ width: 250px;}
.wd-6{ width: 300px;}
.wd-7{ width: 350px;}
.wd-8{ width: 400px;}
.wd-9{ width: 450px;}
.wd-10{ width: 500px;}
.ws-1{ width: 10px;}
.ws-2{ width: 20px;}
.ws-3{ width: 30px;}
.ws-4{ width: 40px;}
.ws-5{ width: 50px;}
.ws-6{ width: 60px;}
.ws-7{ width: 70px;}
.ws-8{ width: 80px;}
.ws-9{ width: 90px;}
.ws-10{ width: 100px;}
.ws-11{ width: 110px;}
.ws-12{ width: 120px;}
.ws-15{ width: 150px;}
.ws-20{ width: 200px;}
.ws-21{ width: 210px;}
.ws-22{ width: 220px;}
.ws-23{ width: 230px;}
.ws-28{ width: 280px;}
.hs-4{ height: 40px;}
.hg-19{ height: 190px;}
.hg-20{ height: 200px;}
.mhg-20{ min-height: 200px;}
.mhg-30{ min-height: 300px;}
.mhg-40{ min-height: 400px;}
.mhg-50{ min-height: 500px;}
.step{ width: 14.2%; float: left;}
.step-transport{ width: 20%; float: left;}
.form-datepicker{ width: 100%; height: 36px; font-size: 14px; border: 1px solid #ccc; padding-left: 5%;}
.display-none{ display: none;}
.list-group-item.header, .list-group-item.header:focus, .list-group-item.header:hover {color: #777; background-color: #eee;}
.col-news{ min-height: 310px;}
.box-list-item{ height: 290px;}
.icon_basket_list{position: absolute; right: 0; top: 0; margin-right: 30px !important; margin-top: 252px; height: 20px !important;}
.col-5{ width: 20%; float: left;}
.pic-list{width:100%; max-height:196px; max-height:196px;}
a.link-list:hover{ text-decoration: underline;}
table.box-vendor{ width: 100%}
table.box-vendor td ,table.box-vendor th{ padding-bottom: 12px; border-bottom: 1px solid #eee; padding-top: 12px;}

/*Form Wizard*/
.bs-wizard {border-bottom: solid 1px #e0e0e0; padding: 0 0 10px 0;}
.bs-wizard > .bs-wizard-step {padding: 0; position: relative;}
.bs-wizard > .bs-wizard-step + .bs-wizard-step {}
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {color: #595959; font-size: 16px; margin-bottom: 5px;}
.bs-wizard > .bs-wizard-step .bs-wizard-info {color: #999; font-size: 14px;}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {position: absolute; width: 30px; height: 30px; display: block; background: #fbe8aa; top: 45px; left: 50%; margin-top: -15px; margin-left: -15px; border-radius: 50%;} 
.bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {content: ' '; width: 14px; height: 14px; background: #fbbd19; border-radius: 50px; position: absolute; top: 8px; left: 8px; } 
.bs-wizard > .bs-wizard-step > .progress {position: relative; border-radius: 0px; height: 8px; box-shadow: none; margin: 20px 0;}
.bs-wizard > .bs-wizard-step > .progress > .progress-bar {width:0px; box-shadow: none; background: #fbe8aa;}
.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {width:100%;}
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {width:50%;}
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {width:0%;}
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {width: 100%;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {background-color: #f5f5f5;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {opacity: 0;}
.bs-wizard > .bs-wizard-step:first-child  > .progress {left: 50%; width: 50%;}
.bs-wizard > .bs-wizard-step:last-child  > .progress {width: 50%;}
.bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot{ pointer-events: none; }
.bs-wizard > .bs-wizard-step > .progress-disabled{background-color: #BCED7B;}
/*END Form Wizard*/

/*font Awesome http://fontawesome.io*/
@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css);
/*Comment List styles*/
.comment-list .row {
    margin-bottom: 0px;
}
.comment-list .panel .panel-heading {
    padding: 4px 15px;
    position: absolute;
    border:none;
    /*Panel-heading border radius*/
    border-top-right-radius:0px;
    top: 1px;
}
.comment-list .panel .panel-heading.right {
    border-right-width: 0px;
    /*Panel-heading border radius*/
    border-top-left-radius:0px;
    right: 16px;
}
.comment-list .panel .panel-heading .panel-body {
    padding-top: 6px;
}
.comment-list figcaption {
    /*For wrapping text in thumbnail*/
    word-wrap: break-word;
}
/* Portrait tablets and medium desktops */
@media (min-width: 768px) {
    .comment-list .arrow:after, .comment-list .arrow:before {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
    }
    .comment-list .panel.arrow.left:after, .comment-list .panel.arrow.left:before {
        border-left: 0;
    }
    /*****Left Arrow*****/
    /*Outline effect style*/
    .comment-list .panel.arrow.left:before {
        left: 0px;
        top: 30px;
        /*Use boarder color of panel*/
        border-right-color: inherit;
        border-width: 16px;
    }
    /*Background color effect*/
    .comment-list .panel.arrow.left:after {
        left: 1px;
        top: 31px;
        /*Change for different outline color*/
        border-right-color: #FFFFFF;
        border-width: 15px;
    }
    /*****Right Arrow*****/
    /*Outline effect style*/
    .comment-list .panel.arrow.right:before {
        right: -16px;
        top: 30px;
        /*Use boarder color of panel*/
        border-left-color: inherit;
        border-width: 16px;
    }
    /*Background color effect*/
    .comment-list .panel.arrow.right:after {
        right: -14px;
        top: 31px;
        /*Change for different outline color*/
        border-left-color: #FFFFFF;
        border-width: 15px;
    }
}
.comment-list .comment-post {
    margin-top: 6px;
}