﻿.ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}
/* IE 6 doesn't support max-height
   * we use height instead, but this forces the menu to always be this tall
   */
* html .ui-autocomplete {
    height: 200px;
}

.product-status {
    display: inline-block;
    position: relative;
    padding: 3px 5px;
    margin: 5px 0;
    border: 1px solid transparent;
    border-radius: .25rem;
    color: red;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.overlay-container {
    position: relative;
}

    .overlay-container .overlay {
        font-size: 1em;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(0, 0, 0, 0.8);
        overflow: hidden;
        width: 100%;
        height: 0;
        color: white;
        transition: .5s ease;
    }

    .overlay-container:hover .overlay {
        height: 100%;
    }



    .overlay-container .overlay .title {
    }

        .overlay-container .overlay .title h4 {
            background-color: #f7e502;
            padding: 3px 7px;
            font-weight: bolder;
            color: red;
        }

        .overlay-container .overlay .title > div {
            padding: 5px 7px;
            font-size: 0.9em;
        }

    .overlay-container .overlay .description {
        padding: 5px 7px;
        border-top: 1px solid #f2f2f2;
        font-size: 0.8em;
    }

        .overlay-container .overlay .description h4 {
            /*margin: 3px 0;*/
        }

        .overlay-container .overlay .description p {
            line-height: 1.3em;
        }




.item_search {
    padding: 0;
    margin: 0;
}

    .item_search.ui-menu-item {
        list-style-image: none !important;
    }


    .item_search .row {
        font-size: 0.8em;
        padding: 0;
        margin: 0;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-orient: horizontal !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: row !important;
        flex-direction: row !important;
        -webkit-box-pack: justify !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        border: none;
        outline: none;
    }

        .item_search .row.ui-state-active {
            background-color: #F7E502;
            color: red;
            border: none;
            outline: none;
        }

        .item_search .row .img img {
            max-width: 50px;
            max-height: 50px;
        }

        .item_search .row .name {
            width: 100%;
            text-align: left;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            padding: 2px 10px;
        }

        .item_search .row .price {
            text-align: right;
            font-weight: bold;
        }

            .item_search .row .price .giamgia {
                text-decoration: line-through;
                color: red;
            }





.headertop {
    width: 100%;
    float: left;
    padding: 10px 0;
}

.col-top {
    width: 25%;
    margin: 0;
    float: left;
    padding: 5px;
}

.box_top .services_text {
    position: relative;
    top: 1px;
    font-size: 1.5em;
}

.box_top a {
    color: #000;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.42857143;
    text-transform: uppercase;
}

.but_cart button,
.head_acc a {
    color: #fff;
    font-size: 14px;
    text-align: center
}

.box_top .icon {
    float: left;
    margin-right: 5px;
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: left top;
    background: url(../img/icon_page.png) rgba(0, 0, 0, 0);
    background-size: cover;
}


    .box_top .icon.icon_baohanh {
        background-image: url(../img/bao-hanh.png);
    }

    .box_top .icon.icon_camket {
        background-image: url('../img/bao-hanh.png');
    }

    .box_top .icon.icon_chinhhang {
        background-image: url('../img/chinhhang.png');
    }

    .box_top .icon.icon_doitra {
        background-image: url('../img/doitra.png');
    }

    .box_top .icon.icon_thanhtoan {
        background: url(../img/chinhhang.png);
    }


    .box_top .icon.icon_giaohang {
        background-image: url('../img/vanchuyen.png');
    }


.wrapper {
    min-width: 320px;
    min-height: 100%;
    margin: 0px auto;
    background: #000 none repeat scroll 0% 0%;
}

.header-top-background {
    border-bottom: 1px solid #2F2F2F;
    color: #FFF;
}


    .header-top-background .header-top-container {
        content: "";
        display: table;
        clear: both;
        margin: 0px auto;
        width: 100%;
        padding: 17px 0px;
        max-width: 1080px;
    }

    .header-top-background .logo {
        float: left;
    }

    .header-top-background, .header-top-background a {
        color: #FFF;
    }



.logo {
    min-height: 52px;
    max-width: 208px;
    display: block;
    float: left;
    width: 65%;
    text-align: center;
}

    .logo .large {
        display: block;
    }

    .logo .small {
        display: none;
    }

.page-header {
    margin: 0px auto;
    background: #000 none repeat scroll 0% 0%;
}

.page-header-container {
    position: relative;
    float: left;
    background: #000 none repeat scroll 0% 0%;
    width: 100%;
}

.skip-links {
    display: none;
    overflow: hidden;
}

a.skip-link, a.skip-custom-link {
    text-decoration: none;
}

.skip-link, .skip-custom-link {
    position: relative;
    float: left;
    width: 25%;
    height: 50px;
    background: #000 none repeat scroll 0% 0%;
    color: #FFF;
    line-height: 49px;
    text-align: center;
}

.package {
    display: none;
}

.skip-tel, .skip-store {
    display: none;
}

.skip-link .label, .skip-custom-link .label {
    display: inline-block;
    text-transform: uppercase;
}

#header-search {
    padding: 10px;
    float: left;
    width: 100%;
    background: #FFF none repeat scroll 0% 0%;
    border-bottom: 1px solid #CCC;
}

.skip-content {
    display: none;
}

    .skip-content.skip-active {
        display: block !important;
    }

#header-search .form-search {
    content: "";
    display: table;
    clear: both;
    background-color: #FFF;
    border: 1px solid #888;
    width: 100%;
}

#header-search input[type="text"] {
    border: 0px none;
    float: left;
    height: 40px;
    max-width: 90%;
    width: calc(100% - 40px);
}

#header-search .btn-search {
    background: transparent url("http://www.dawsons.co.uk/skin/frontend/dawsons114/shop/images/icon_sprite.png?1432801837") no-repeat scroll 3px -148px;
    border-left: 1px solid #888;
    float: right;
    height: 32px;
    margin: 4px 4px 4px 0px;
    text-indent: -9999px;
    width: 32px;
}

.nav-primary > li {
    position: relative;
}

.nav-primary li > a {
    text-decoration: none;
    position: relative;
    display: block;
    color: #000;
    line-height: 50px;
    font-family: "Roboto",arial,sans-serif;
    font-size: 1em;
}

.nav-primary ul.level1 > li a, .nav-primary ul.level2 > li a {
    border-bottom: 1px solid #CCC;
    color: #000;
    font-weight: normal;
}

.nav-primary .menu-active > ul.level0, .nav-primary .level0 > li li.sub-menu-active > ul, .nav-primary .level0 > li.sub-menu-active > ul {
    display: block;
}

#menu {
    position: relative;
    top: 0px;
    left: 0px;
    background: #000 none repeat scroll 0% 0%;
}

.menu ol li .main-nav-dd {
    display: none;
}

.block-title {
    position: relative;
    padding: 10px 0px 0px;
    margin-bottom: 10px;
    border-top: 1px solid #CCC;
}

.has-children::before {
    font-family: Flaticon !important;
    font-style: normal;
    content: "\e00d";
}

.menu-active > .has-children::before, .sub-menu-active > .has-children::before {
    font-family: Flaticon !important;
    font-style: normal;
    content: "\e00d";
}

#menu > ol > li > a:hover {
    color: #fff;
    background-color: red;
}

#menu .main-nav-dd.level-menu a {
    color: #000;
}

    #menu .main-nav-dd.level-menu a:hover {
        background-color: #fff;
        color: red;
    }

.menu ol li:hover > .main-nav-dd, .menu ol li .dropdown-links .menu ol li:hover .main-nav-dd {
    background: #fff;
    border-bottom: 1px solid #f2f2f2;
    border-left: 1px solid #f2f2f2;
    border-right: 1px solid #f2f2f2;
    display: block;
    left: 0;
    padding: 1em 0 1em 1em;
    position: absolute;
    text-align: left;
    top: 50px;
    width: 250px;
    z-index: 1;
}

.menu ol li .dropdown-links .menu {
    background: #000 none repeat scroll 0% 0%;
    width: 100%;
    height: auto;
    line-height: normal;
    box-shadow: none;
}

    .menu ol li .dropdown-links .menu ol li:hover .main-nav-dd, .menu ol li:hover > .main-nav-dd.video {
        width: 500px;
    }

    .menu ol li .dropdown-links .menu ol li:hover .main-nav-dd {
        top: 27px;
    }

    .menu ol li .dropdown-links .menu ol li:nth-child(5):hover .main-nav-dd.level-menu {
        left: -150px;
    }

    .menu ol li .dropdown-links .menu ol li:nth-child(6):hover .main-nav-dd.level-menu {
        left: -200px;
    }

    .menu ol li .dropdown-links .menu ol li:nth-child(7):hover .main-nav-dd.level-menu {
        left: -280px;
    }

    .menu ol li .dropdown-links .menu ol li:nth-child(8):hover .main-nav-dd.level-menu {
        left: -300px;
    }

    .menu ol li .dropdown-links .menu ol li:nth-child(9):hover .main-nav-dd.level-menu {
        left: -350px;
    }

.menu ol li.product:hover > .main-nav-dd {
    padding: 5px;
}

.menu ol li.product > .main-nav-dd {
    background-color: #000;
    border: none;
    color: #fff;
}

.menu ol li:hover .main-nav-dd.computer-music {
    left: -42px;
}

.menu ol li:hover .main-nav-dd.dj-gear {
    left: -189px;
}

.menu ol li:hover .main-nav-dd.video {
    left: -269px;
}

.menu ol li:hover .main-nav-dd.pa {
    left: -458px;
}



.menu ol li:hover .main-nav-dd.orchestral {
    left: -500px;
}

.menu ol li:hover .main-nav-dd .col {
    float: left;
    width: 185px;
}

    .menu ol li:hover .main-nav-dd .col.brands {
        width: 260px;
    }

    .menu ol li:hover .main-nav-dd .col ul ul {
        float: left;
        width: 50%;
    }

.menu ol li:hover .main-nav-dd a {
    font-family: "Roboto",arial,sans-serif;
    font-size: 0.9em;
    line-height: 2;
    text-transform: none;
}



    .menu ol li:hover .main-nav-dd a:after {
        content: "";
        padding: 0;
    }

.menu ol li:hover .main-nav-dd .dropdown-links {
    float: left;
    padding-right: 20px;
    /*width: 470px;*/
}

.menu ol li.product:hover > .main-nav-dd {
    width: 900px;
    /*background: #000 none repeat scroll 0% 0%;*/
}

.menu ol li.product .main-nav-dd > a {
    color: #fff;
}

.menu ol li:hover .main-nav-dd .dropdown-links .block-title {
    border: 0;
    font-family: "Roboto",arial,sans-serif;
    font-size: 0.8em;
    margin-bottom: 20px;
    text-transform: uppercase;
    color: #000;
    font-weight: bold;
}

.menu ol li:hover .main-nav-dd .dropdown-links .promo {
    float: left;
    padding-top: 20px;
    width: 50%;
}

    .menu ol li:hover .main-nav-dd .dropdown-links .promo.first {
        width: 55%;
    }

    .menu ol li:hover .main-nav-dd .dropdown-links .promo.last {
        width: 45%;
    }

    .menu ol li:hover .main-nav-dd .dropdown-links .promo li, .menu ol li:hover .main-nav-dd .dropdown-links .promo li a {
        color: #d92028;
        display: inline;
        width: 100%;
    }

.menu ol li:hover .main-nav-dd .dropdown-links .dropdown-promos {
    width: 100%;
    background-color: #f2f2f2;
    display: block;
    border-top: 1px dashed #ddd;
}

    .menu ol li:hover .main-nav-dd .dropdown-links .dropdown-promos li {
        float: left;
        width: 100%;
    }

.menu ol li:hover .main-nav-dd .dropdown-product {
    float: left;
    padding-top: 60px;
    width: 190px;
}

    .menu ol li:hover .main-nav-dd .dropdown-product p {
        padding-top: 18px;
    }

        .menu ol li:hover .main-nav-dd .dropdown-product p a {
            line-height: 1.6;
        }

.main-container {
    position: relative;
    max-width: 1080px;
    margin: 0px auto;
    clear: both;
    padding-bottom: 10px;
}

#main-slider {
    padding: 10px 0;
}

/* jssor slider bullet navigator skin 05 css */
/*
            .jssorb05 div           (normal)
            .jssorb05 div:hover     (normal mouseover)
            .jssorb05 .av           (active)
            .jssorb05 .av:hover     (active mouseover)
            .jssorb05 .dn           (mousedown)
            */
.jssorb05 {
    position: absolute;
}

    .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
        position: absolute;
        /* size of bullet elment */
        width: 16px;
        height: 16px;
        background: url(../img/b17.png) no-repeat;
        overflow: hidden;
        cursor: pointer;
    }

    .jssorb05 div {
        background-position: -7px -7px;
    }

        .jssorb05 div:hover, .jssorb05 .av:hover {
            background-position: -37px -7px;
        }

    .jssorb05 .av {
        background-position: -67px -7px;
    }

    .jssorb05 .dn, .jssorb05 .dn:hover {
        background-position: -97px -7px;
    }

/* jssor slider arrow navigator skin 12 css */
/*
            .jssora12l                  (normal)
            .jssora12r                  (normal)
            .jssora12l:hover            (normal mouseover)
            .jssora12r:hover            (normal mouseover)
            .jssora12l.jssora12ldn      (mousedown)
            .jssora12r.jssora12rdn      (mousedown)
            */
.jssora12l, .jssora12r {
    display: block;
    position: absolute;
    /* size of arrow element */
    width: 30px;
    height: 46px;
    cursor: pointer;
    background: url(../img/a12.png) no-repeat;
    overflow: hidden;
}

.jssora12l {
    background-position: -16px -37px;
}

.jssora12r {
    background-position: -75px -37px;
}

.jssora12l:hover {
    background-position: -136px -37px;
}

.jssora12r:hover {
    background-position: -195px -37px;
}

.jssora12l.jssora12ldn {
    background-position: -256px -37px;
}

.jssora12r.jssora12rdn {
    background-position: -315px -37px;
}

/* jssor slider thumbnail navigator skin 01 css */
/*
            .jssort01 .p            (normal)
            .jssort01 .p:hover      (normal mouseover)
            .jssort01 .p.pav        (active)
            .jssort01 .p.pdn        (mousedown)
            */

.jssort01 {
    position: absolute;
    /* size of thumbnail navigator container */
    width: 540px;
    height: 81px;
}

    .jssort01 .p {
        position: absolute;
        top: 0;
        left: 0;
        width: 72px;
        height: 48px;
    }

    .jssort01 .t {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: none;
    }

    .jssort01 .w {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
    }

        .jssort01 .w img {
            width: 72px;
            height: 48px !important;
        }

    .jssort01 .c {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 68px;
        height: 48px;
        border: #000 2px solid;
        box-sizing: content-box;
        background: url(../img/t01.png) -800px -800px no-repeat;
        _background: none;
    }

    .jssort01 .pav .c {
        top: 2px;
        _top: 0px;
        left: 2px;
        _left: 0px;
        width: 68px;
        height: 48px;
        border: #000 0px solid;
        _border: #fff 2px solid;
        background-position: 50% 50%;
    }

    .jssort01 .p:hover .c {
        top: 0px;
        left: 0px;
        width: 70px;
        height: 46px;
        border: #fff 1px solid;
        background-position: 50% 50%;
    }

    .jssort01 .p.pdn .c {
        background-position: 50% 50%;
        width: 68px;
        height: 68px;
        border: #000 2px solid;
    }

    * html .jssort01 .c, * html .jssort01 .pdn .c, * html .jssort01 .pav .c {
        /* ie quirks mode adjust */
        width /**/: 72px;
        height /**/: 48px;
    }


#white-box {
    width: 100%;
    height: auto;
}

    #white-box ul {
    }

    #white-box > ul > li {
        display: inline-block;
        float: left;
        width: 25%;
        margin-bottom: 15px;
    }


        #white-box > ul > li .inner {
            padding: 0 5px 5px 5px;
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            background-color: #fff;
            margin-right: 5px;
            border-radius: 2px;
        }

            #white-box > ul > li .inner .title {
                padding: 5px 0;
            }

                #white-box > ul > li .inner .title a {
                    color: #000;
                    font-weight: bold;
                    font-size: 1.1em;
                }

            #white-box > ul > li .inner .image {
                display: block;
            }

                #white-box > ul > li .inner .image a {
                    display: block;
                }

                #white-box > ul > li .inner .image img {
                    display: block;
                    width: 100%;
                    margin: 0 auto;
                }

            #white-box > ul > li .inner .list {
                padding: 5px 0;
            }

                #white-box > ul > li .inner .list li {
                    display: block;
                    padding: 0 0 5px 0;
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis;
                }

                    #white-box > ul > li .inner .list li a {
                        color: #000;
                        font-size: 1em;
                    }

                        #white-box > ul > li .inner .list li a:hover {
                            color: red;
                        }


#feature-slider {
    max-width: 750px;
    width: 100%;
}

ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    height: 32px;
    border-bottom: 1px solid #eee;
    width: 100%;
}

    ul.tabs li {
        float: left;
        margin: 0;
        cursor: pointer;
        padding: 0px 15px;
        height: 31px;
        line-height: 31px;
        /*border-top: 1px solid red;*/
        border-left: 1px solid #fff;
        border-bottom: 1px solid #fff;
        background-color: red;
        overflow: hidden;
        position: relative;
        color: #fff;
    }

#product-tab ul.tabs li {
    float: left;
    margin: 0;
    cursor: pointer;
    padding: 0px 15px;
    height: 31px;
    line-height: 31px;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
    border-bottom: 1px solid #eee;
    background-color: #eee;
    overflow: hidden;
    position: relative;
    color: #000;
}


.tab_last {
    border-right: 1px solid #eee;
}

ul.tabs li:hover {
    background-color: #ddd;
    color: #333;
}

ul.tabs li.active, #product-tab ul.tabs li.active {
    background-color: #fff;
    color: #333;
    border-bottom: 1px solid #fff;
    display: block;
}



.tab_container {
    border: 1px solid #eee;
    border-top: none;
    clear: both;
    float: left;
    width: 100%;
    background: #fff;
    overflow: auto;
}

.tab_content {
    display: none;
}

.tab_drawer_heading {
    display: none;
}

#feature-slider, #feature-video {
    display: block;
    float: left;
}

.feature-item {
    max-width: 182.5px;
    height: 270px;
    padding: 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    position: relative;
    border: 1px solid #f2f2f2;
}

    .feature-item .image {
        display: block;
        position: relative;
    }

        .feature-item .image img {
            max-width: 162.5px;
            max-height: 162.5px;
        }

    .feature-item .content {
        padding: 5px 0;
        position: relative;
        display: block;
    }

        .feature-item .content h4 {
        }

            .feature-item .content h4 a {
                color: #000;
            }

    .feature-item .price {
        display: block;
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        padding: 0 3px 3px 3px;
    }

    /*#feature-slider .feature-item .content .price .price-sale {
                    padding: 2px 5px;
                    background-color: #c0392b;
                    color: #fff;
                }*/

    .feature-item .image .clGiamGia, .products-grid .product-image .clGiamGia {
        background-image: url(../img/icon_sale.png);
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 50px;
        height: 50px;
        background-size: 50px;
        background-position: center;
        background-repeat: no-repeat;
    }

.clQuaTang {
    background-image: url(../img/icon_gift.png);
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background-size: 40px;
    background-position: center;
    background-repeat: no-repeat;
}

/*.price-origin.clGiamGia {
    background: none;
}*/

#feature-video {
    width: 100%;
    max-width: 330px;
    padding: 0 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}


    #feature-video .title {
    }

        #feature-video .title h4 {
            font-size: 1.3em;
            font-weight: bold;
            display: block;
            float: left;
            color: #fff;
        }

        #feature-video .title a {
            display: block;
            float: right;
            color: #fff;
        }

            #feature-video .title a:hover {
                text-decoration: underline;
            }

        #feature-video .title hr {
            margin: 13px 0;
            color: #fff;
        }

    #feature-video .content {
    }

        #feature-video .content iframe {
            max-width: 100%;
            width: 100%;
            height: 315px;
        }


#footer {
    background: #1A1917 none repeat scroll 0% 0%;
    width: 100%;
}

    #footer .inner {
        clear: both;
        max-width: 1080px;
        margin: 0px auto;
        padding: 30px 20px;
    }

        #footer .inner .col:first-child {
            width: 100%;
            max-width: 300px;
        }

        #footer .inner .col {
            display: block;
            float: left;
            margin-bottom: 20px;
        }

            #footer .inner .col.footer-link {
                width: 100%;
                max-width: 230px;
                padding: 0 10px;
                box-sizing: border-box;
                -moz-box-sizing: border-box;
                -webkit-box-sizing: border-box;
            }

                #footer .inner .col.footer-link .title {
                    color: #fff;
                    margin-bottom: 5px;
                }

                #footer .inner .col.footer-link .content li {
                    padding: 3px 0;
                }


                #footer .inner .col.footer-link li a {
                    color: #6C7A89;
                    font-size: 0.9em;
                }

                    #footer .inner .col.footer-link li a:hover {
                        color: #f1c40f;
                    }

            #footer .inner .col.social-link {
            }

                #footer .inner .col.social-link .phone {
                    display: block;
                    width: 100%;
                }


                    #footer .inner .col.social-link .phone a {
                        color: #fff;
                        font-size: 1.4em;
                        line-height: 1.2em;
                    }

                        #footer .inner .col.social-link .phone a:before {
                            padding-right: 5px;
                        }

                #footer .inner .col.social-link .social {
                    display: block;
                    width: 100%;
                }

                    #footer .inner .col.social-link .social a {
                        display: block;
                        float: left;
                        color: #fff;
                        font-size: 2.8em;
                        line-height: 2em;
                        margin: 0 5px;
                    }

                        #footer .inner .col.social-link .social a.yahoo:hover {
                            color: #8e44ad;
                        }

                        #footer .inner .col.social-link .social a.skype:hover {
                            color: #3498db;
                        }

                        #footer .inner .col.social-link .social a.fb:hover {
                            color: #1F3A93;
                        }

                        #footer .inner .col.social-link .social a.email:hover {
                            color: #e74c3c;
                        }

        #footer .inner .newsletter {
            margin-top: 20px;
            float: right;
        }

            #footer .inner .newsletter h4 {
                color: #fff;
                line-height: 2em;
            }

            #footer .inner .newsletter .title, #footer .inner .newsletter .input-box, #footer .inner .newsletter .actions {
                display: block;
                float: left;
                padding: 0 5px;
            }

                #footer .inner .newsletter .actions .button {
                    padding: 6px 10px;
                    font-size: 0.8em;
                }

                #footer .inner .newsletter .input-box input {
                    font-size: 0.8em;
                }

        #footer .inner .thuonghieu {
            margin-top: 20px;
        }

            #footer .inner .thuonghieu .logo-thuonghieu {
                display: block;
                float: left;
                max-width: 180px;
            }

            #footer .inner .thuonghieu .content {
                display: block;
                float: left;
                color: #6C7A89;
                max-width: 860px;
                padding: 0 20px;
                text-align: center;
                line-height: 1.5em;
            }

#breadcrumbs {
    float: left;
    width: 100%;
    padding: 5px 0 15px 0;
}

    #breadcrumbs li {
        float: left;
        font-size: 0.8em;
        font-family: "Roboto",arial,sans-serif;
    }

        #breadcrumbs li.home a {
            font-weight: bold;
            color: yellow;
        }

        #breadcrumbs li.current a {
            font-weight: bold;
            color: rgb(198, 197, 197);
        }

    #breadcrumbs a {
        float: left;
        color: #666;
    }

    #breadcrumbs li i {
        font-family: Arial,sans-serif;
        float: left;
        padding: 0 5px;
        font-size: 0.8em;
        color: #fff;
    }

#col-left {
    float: left;
    width: 100%;
    max-width: 216px;
    padding: 0 10px 0 0;
    clear: left;
}

#col-main {
    float: right;
    padding-right: 0;
    max-width: 864px;
    width: 100%;
}

#pro-header {
    background: #2b2b2b;
    float: left;
    width: 100%;
    padding: 10px;
    margin: 0 0 15px 0;
}

    #pro-header .title {
        font-size: 1.2em;
        color: #fff;
        line-height: 1.5em;
    }

    #pro-header .content {
        font-size: 0.9em;
        color: rgb(198, 197, 197);
    }

#pro-product {
    clear: both;
}

.products-grid {
    position: relative;
    border-top: 1px solid #dfdfdf;
}

    .products-grid > li {
        float: left;
        width: 50%;
        padding: 8px;
        min-height: 265px;
        position: relative;
        text-align: left;
        /*border-bottom: 1px solid #dfdfdf;*/
    }

        .products-grid > li > .inner {
            background-color: #fff;
            min-height: 370px;
            padding: 5px;
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            border-radius: 2px;
            position: relative;
        }

    .products-grid .product-image {
        margin-bottom: 5px;
        text-align: center;
        width: 100%;
        display: block;
        position: relative;
        min-height: 240px;
    }

        .products-grid .product-image img {
            max-width: 230px;
            max-height: 230px;
        }



.product-info .product-name a {
    color: #7F8C8D;
}

.product-price {
    position: absolute;
    left: 0;
    bottom: 5px;
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}


.price-origin {
    font-size: 0.8em;
    color: #fff;
    text-decoration: line-through;
    display: inline-block;
    float: right;
    background-color: #2c3e50;
    padding: 3px 5px;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}

.price-sale {
    font-size: 1em;
    background-color: red;
    color: #fff;
    padding: 3px 5px;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    display: inline-block;
}

.title-filter {
    display: none;
    background-color: #f2f2f2;
    padding: 10px 3px;
}


#col-left input[type=checkbox] {
    position: absolute;
    /*top: -9999px;*/
    left: -9999px;
}

#col-left label:first-child {
    display: block;
    background: #08C;
    padding: 5px;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 2px;
    color: white;
    font-weight: bold;
}

#col-left input[type=checkbox]:checked ~ ul.accordion {
    display: block;
}

ul.level0 > li {
    margin-bottom: 20px;
    background-color: #2B2B2B;
}

#col-left .inner > ul.level1 > li, #col-left .inner > label.filter-news {
    background-color: #2B2B2B;
}

ul.level0 > li > label, label.filter-news {
    color: #fff;
    display: block;
    /*background-color: #f2f2f2;*/
    padding: 8px 5px;
}

ul.level1 li {
}

    ul.level1 li a {
        padding: 10px 5px;
        color: rgb(198, 197, 197);
        display: block;
        font-size: 0.9em;
    }

li.level0 ul > li > a:hover {
    color: red;
}

.title-page {
    background-color: #f2f2f2;
    color: #2c3e50;
    display: block;
    padding: 20px 10px;
    font-weight: bold;
}

.news-block {
    padding: 10px 0;
    color: #fff;
    text-align: justify;
    line-height: 1.2em;
}

.news-item {
    display: block;
    padding: 8px 0;
    /*border-bottom: 1px solid #666;*/
}

    .news-item .title {
        padding: 0 8px 4px 8px;
        border-bottom: 1px dashed #666;
    }

        .news-item .title a {
            color: #fff;
        }

            .news-item .title a:hover {
                color: red;
            }

    .news-item .content {
    }

        .news-item .content .inner {
            padding: 4px 8px 0 8px;
            display: block;
            position: relative;
        }

            .news-item .content .inner .image {
                display: block;
                float: left;
                max-width: 150px;
                max-height: 100px;
            }

                .news-item .content .inner .image a {
                    display: block;
                }

                    .news-item .content .inner .image a img {
                        display: block;
                        width: 150px !important;
                        height: 100px !important;
                        /*width: 100%;
                        height: 100%;*/
                    }

            .news-item .content .inner .abstract {
                display: block;
                float: left;
                width: calc(100% - 150px);
                min-height: 91px;
                padding: 0 8px;
                box-sizing: border-box;
                -moz-box-sizing: border-box;
                -webkit-box-sizing: border-box;
            }


                .news-item .content .inner .abstract .time {
                    font-size: 0.7em;
                    color: #95a5a6;
                }

                .news-item .content .inner .abstract .text {
                    color: #fff;
                    font-size: 0.9em;
                    line-height: 1.3em;
                }

#youtube-slider {
    margin-top: 10px;
}

#youtube-block iframe {
    width: 100%;
    min-height: 500px;
}

#youtube-slider .item-video-slider {
    max-width: 150px;
    padding: 5px;
}


    #youtube-slider .item-video-slider a {
        display: block;
    }


        #youtube-slider .item-video-slider a img {
            display: block;
            padding: 0 3px;
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
        }

#product-image {
    padding: 5px 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: block;
    float: left;
    width: 50%;
}

/*#product-image img {
        max-width: 540px;
        max-height: 350px;
    }*/

#product-shop {
    display: block;
    float: left;
    width: 50%;
    padding: 10px;
}

    #product-shop .title {
        color: yellow;
        font-size: 1.3em;
    }

    #product-shop .price {
        /*text-align: right;*/
        padding: 10px 0;
    }

        #product-shop .price .price-sale:after, #product-shop .price .price-origin:after {
            content: 'VND';
            display: inline-block;
            padding-left: 5px;
            color: #666;
        }

        #product-shop .price .price-origin:after {
            color: #95A5A6;
        }


        #product-shop .price .price-sale {
            font-size: 1.2em;
            display: inline-block;
        }

        #product-shop .price .price-origin {
            display: block;
            clear: both;
        }

    #product-shop .status {
        color: #fff;
    }

        #product-shop .status span {
            padding: 3px 10px;
            background-color: #2F2F2F;
        }

#product-accessories {
    display: block;
    float: left;
    width: 50%;
    padding: 10px;
}

    #product-accessories .inner {
        border: 1px solid #eee;
        color: #2b2b2b;
        background-color: #fff;
        padding: 5px;
    }

    #product-accessories h4 {
        border-bottom: 1px solid #eee;
        line-height: 1.5em;
    }

    #product-accessories ul li {
        padding: 5px 10px;
    }

    #product-accessories .inner div.gkm {
        line-height: 1.4em;
    }

#product-social {
    display: block;
    float: left;
    width: 50%;
    padding: 5px;
}

#product-tab {
    padding: 10px 0;
    width: 100%;
}


    #product-tab .tab_content {
        padding: 10px;
        text-align: justify;
        line-height: 1.2em;
    }


.paging {
    text-align: center;
    padding: 10px 0;
    background-color: #2b2b2b;
    clear: both;
}

    .paging strong {
        border: solid 1px #d6d6d6;
        border-radius: 0.2rem;
        color: #fdfdfd;
        background-color: #1d1f20;
        border: solid 1px #1d1f20;
        text-decoration: none;
        text-transform: uppercase;
        display: inline-block;
        text-align: center;
        padding: 0.5rem 0.9rem;
    }

    .paging a {
        border: solid 1px #d6d6d6;
        border-radius: 0.2rem;
        color: #7d7d7d;
        text-decoration: none;
        text-transform: uppercase;
        display: inline-block;
        text-align: center;
        padding: 0.5rem 0.9rem;
    }

        .paging a:hover {
            color: #fdfdfd;
            background-color: #1d1f20;
            border: solid 1px #1d1f20;
        }

.drop-filter {
    border: 1px solid #ddd;
    font-size: 1.1em;
    margin: 5px;
}

#map-daily {
    height: 70vh;
    margin-top: 10px;
}

address {
    color: #fff;
}

    address > strong {
        color: yellow;
    }


/*#fbComment iframe {
    width: 100%;
}*/

#product-relative, #product-danhgia {
    display: block;
    margin: 10px 0;
    background-color: #fff;
}

    #product-relative > h4, #product-danhgia > h4 {
        color: #000;
        padding: 10px;
        border-bottom: 1px solid #f2f2f2;
    }

.tab_content iframe {
    display: block;
    max-width: 100%;
}

.col-title {
    font-weight: bold;
}


.thongso {
    padding: 20px;
    display: none;
    color: #494646;
    text-align: justify;
    font-size: 16px;
    background: #2f2f2f;
}

    .thongso table {
        margin: 0px auto;
        background-color: #FFF;
    }

        .thongso table tr td {
            text-align: left;
            padding: 5px 3px 3px 20px;
            font-size: 15px;
            border-bottom: 2px solid #2f2f2f;
            vertical-align: middle;
        }

.hotline a, .hotline a:hover {
    color: #fff;
}


.tintucSeo {
    background-color: #ccc;
    margin-top: 10px;
    padding: 10px;
}


#divHotline {
    background-color: yellow;
    position: fixed;
    bottom: 20px;
    left: 0;
    padding: 10px;
    color: #000;
    font-size: 1.5em;
    border-radius: 2px;
    z-index: 3;
}

    #divHotline i {
        margin-right: 15px;
    }

    #divHotline a {
        color: #000;
    }
