/** START DISABLE COPY CONTENT **/
body { -moz-user-select: none !important; -webkit-touch-callout: none !important; -webkit-user-select: none !important; -khtml-user-select: none !important; -moz-user-select: none !important; -ms-user-select: none !important; user-select: none !important; }
/** END DISABLE COPY CONTENT **/
#wapper{
    background: url(../img/bg-wapper.png) left top repeat;
}

#head{
    width: 100%;
    height:217px;
    /*position: fixed;*/
    z-index: 2000;
    /*background: url(../img/icon/bg-head.png) left top repeat;*/
    background: url(../img/bg-wapper.png) left top repeat;
}
#spcl{
    font-family: Arial;
    font-size: 16px;
    font-weight: bold;
    color: red;
    text-transform: uppercase;
}
#head .search{
    width: 100%;
    height:35px;
    background-color: #000000;
}
#head .search .search-block{
    width: 1000px;
    margin: 0px auto;
}

#head .search .search-block .line1{
    width: 154px;
    height: 2px;
    background-color: #ffffff;
    float: right;
}
#head .search .search-block .line2{
    width: 154px;
    height: 2px;
    background-color: #fcd912;
    float: right;
}
#head .search .search-block .line3{
    width: 154px;
    height: 2px;
    background-color: #4c39ff;
    float: right;
}
#head .search .search-block .line4{
    width: 154px;
    height: 2px;
    background-color: #ff0000;
    float: right;
}

#head .search .search-block .timkiem .searchs{
    width: 200px;
    height: 20px;
    border: 1px solid #FFFFFF;
    float: left;
    margin-top: 5px;
}
#head .search .search-block .timkiem input.txt{
    width: 196px;
    height: 16px;
}
#head .search .search-block .timkiem .bo{
    margin-top: 8px;
    float: left;
    margin-left: -20px;
}

.block{
    width: 1000px;
    margin: 0px auto;
}
.block .logo-hotline{
    width: 1000px;
    height: 130px;
}
.block .logo-hotline .logo{
    float: left;
    padding: 2%;
    background-color: #fff;
    margin-top: 15px;
}
.block .logo-hotline .logo img{width:96%}

.block .logo-hotline .hotline{
    width: 340px;
    height: 131px;
    float: right;
    background: url(../img/img-hotline.png) left top no-repeat;
    margin-top: -131px;
}
.block .logo-hotline .hotline .sdt1{
    padding-top: 50px;
}


.block .logo-hotline .hotline p{
    color: #000000;
    padding-left: 116px;
    font-size: 18px;
    font-weight: bold;
}


.block .nav{
    width: 1000px;
    height: 50px;
    background: url(../img/bg-nav.png) left top repeat-x;
    margin-top:15px;
}

.line-ao{
    width: 100%;
    /*height: 218px;*/
}

.slide{
    width: 1000px;
    /*height: 348px;*/
    clear:both;
}


.img-slide{
    width: 1000px;
    /*height: 200px;*/
    background-color: #FFFFFF;
}
.img-slide .img-slide-1{
    width: 450px;
    /*height: 170px;*/
    float: left;
    padding: 15px 0 15px 25px;
    position: relative;
}
.img-slide .img-slide-1 .slide-text-1{
    position: absolute;
    top: 120px;
    left: 25px;
    width: 450px;
    height: 65px;
    background: rgba(0, 0, 0, .7);
    z-index: 900;
}
.img-slide .img-slide-1 .slide-text-1 h4{
    color: #FFFFFF;
    font-size: 17px;
    font-weight: bold;
    padding: 5px 0px 0px 5px;
}
.img-slide .img-slide-1 .slide-text-1 p{
    color: #FFFFFF;
    font-size: 12px;
    padding: 2px 0px 0px 5px;
}


.img-slide .img-slide-2{
    padding-left: 50px;
}
.img-slide .img-slide-2 .slide-text-1{
    position: absolute;
    top: 120px;
    left: 50px;
    width: 450px;
    height: 65px;
    background: rgba(0, 0, 0, .7);
    z-index: 900;
}

.content .td{
    margin-top: 20px;
    float: left;
}

.content .icon{
    float: right;
    width: 266px;
    height: 40px;
    margin-top: 30px;
}
.content .icon ul li{
    float: right;
    width: 40px;
    height: 40px;
}
.content .icon ul .li-left{
    margin-right: 15px;
}
.content .icon ul li a{
    display: block;
}
.content .icon ul .li-right a{
    width: 40px;
    height: 40px;
    background: url(../img/icon/icon-right.png) left bottom no-repeat;
    -webkit-transition: all .3s;
}
.content .icon ul .li-right a:hover{
    background: url(../img/icon/icon-right.png) left top no-repeat;
}

.content .icon ul .li-left a{
    width: 40px;
    height: 40px;
    background: url(../img/icon/icon-left.png) left bottom no-repeat;
    -webkit-transition: all .3s;
}
.content .icon ul .li-left a:hover{
    background: url(../img/icon/icon-left.png) left top no-repeat;
}
.content .line5{
    width: 1000px;
    height: 5px;
}
.content .sanpham{
    width: 1000px;
    /*height: 370px;*/
    margin-top: 20px;
}

/*=========CSS3 SP=================*/
.group:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html .group { height: 1%; }
*:first-child+html .group { min-height: 1px; }

body { background: #ddd url(../images/noise.jpg); font-family: Arial, Helvetica, sans-serif; font-size: 100%; }

@font-face {
    font-family: 'AdelleBasicBold';
    src: url('../fonts/adellebasic_bold-webfont.eot?') format('eot'),
        url('../fonts/adellebasic_bold-webfont.woff') format('woff'),
        url('../fonts/adellebasic_bold-webfont.ttf') format('truetype'),
        url('../fonts/adellebasic_bold-webfont.svg#webfontll9eFuSn') format('svg');
    font-weight: normal;
    font-style: normal;

}

#container { max-width: 1000px; padding: 0 0px; margin: 0 auto; }

h1, h2, h3, p { color: #333; margin-bottom: 20px; }
h1, h2 { font-family: 'AdelleBasicBold', Arial, sans-serif; }
h1.title { font-size: 68px; letter-spacing: -3px; font-weight: bold; text-align: center; margin: 100px 0 50px; text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.6); }

h1.title span { font-size: 38px; line-height: 48px; display: block; letter-spacing: -1px; color: rgba(51, 51, 51, 0.5); }


/*
Stacks CSS ----------------------------------------------------------------------------------------------------------- */

/* Layout */
.stack { float: left; width: 220px; margin: 0 4% 4% 0; position: relative; z-index: 10; text-align:center; }

/* Image styles */
.stack .twisted_img{
    width:100%;
    height:220px;	
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    background:#FFF;
    border: 10px solid #fff; border-radius: 3px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}
.stack img { max-width: 100%; max-height:205px; height: auto; vertical-align: bottom;	
}
.stack:last-of-type { margin-right: 0; }

/* Stacks creted by the use of generated content */
.stack:before, .stack:after { content: ""; border-radius: 3px; width: 100%; height: 100%; position: absolute; border: 10px solid #fff; left: 0;
                              -webkit-box-sizing: border-box;
                              -moz-box-sizing: border-box;
                              box-sizing: border-box;
                              -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
                              -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
                              box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
                              -webkit-transition: 0.3s all ease-out;
                              -moz-transition: 0.3s all ease-out;
                              transition: 0.3s all ease-out;
}
.stack:before { top: 4px; z-index: -10; } /* 1st element in stack (behind image) */
.stack:after { top: 8px; z-index: -20; } /* 2nd element in stack (behind image) */

/* Second stack example (rotated to the right from the bottom left) */
.stack.rotated:before {
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    transform: rotate(2deg);
}
.stack.rotated:after {
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    transform: rotate(4deg);
}

/* Third stack example (One stack element rotated in the opposite direction) */
.stack.twisted:before {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    transform: rotate(4deg);
}
.stack.twisted:after {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    transform: rotate(-4deg);
}

/* Fourth stack example (Similar to the second but rotated left) */
.stack.rotated-left:before {
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform: rotate(-3deg);
    -moz-transform: rotate(-3deg);
    transform: rotate(-3deg);
}
.stack.rotated-left:after {
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    transform: rotate(-6deg);
}

/* Reset all rotations on hover */
.stack:hover:before, .stack:hover:after {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
}

.sp{
    width: 220px;
    height: 370px;
    float: left;
    margin:0 15px;
}
.sp4{
    width: 220px;
    height: 370px;
    float: left;
    margin-right: 0%
}


a { text-decoration: none; }

#themelistings { list-style: none; margin: 15px 0 25px; }
#themelistings a { display: block;}
#themelistings a:hover { text-decoration: none; }
h2.index-title { text-align: center; font-size: 1.75em; margin-top: 100px; letter-spacing: -1px; }
#themelistings li:hover h2 { background: #BE3F1C; color: #fff; }
#themelistings li { float: left; width: 48%; margin-right: 4%; position: relative; }
#themelistings li:nth-of-type(2n) { margin-right: 0; }
#themelistings img { border-radius: 3px; vertical-align: bottom; margin: 0; max-width: 100%; height: auto;
                     -webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
                     -moz-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
                     box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
}

.post-type-archive-wordpress-themes #featured { border-top: none; font-size: 1.5em; }
.post-type-archive-wordpress-themes #featured { padding-bottom: 25px; }

#themelistings h2 { color: #3F454F; border: 0; font-family: 'Proxima Nova Semibold', Arial, Helvetica; font-size: 1em; letter-spacing: -1px; position: absolute; bottom: 0; left: 0; background: #fff; width: 100%; padding: 10px; margin-bottom: 0;
                    -webkit-box-sizing: border-box;
                    -moz-box-sizing: border-box;
                    box-sizing: border-box;
                    -webkit-box-shadow: 0 -4px 4px -3px rgba(0, 0, 0, 0.4);
                    -moz-box-shadow: 0 -4px 4px -3px rgba(0, 0, 0, 0.4);
                    box-shadow: 0 -4px 4px -3px rgba(0, 0, 0, 0.4);
                    -webkit-transition: all 0.2s ease-out;
                    -moz-transition: all 0.2s ease-out;
                    transition: all 0.2s ease-out;
}
#themelistings h2 span { float: right; opacity: 0.65; }

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section, menu,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    font-weight: normal;
}
body {
    line-height:1;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    outline: 0;
}

ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted #000;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

hr {
    display:block;
    width:100%;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:15px 0;
    padding:0;
}
input, select {
    vertical-align:middle;
}


.thongtin{
    width: 220px;
    height: 113px;
    margin-top: 256px;
    background: url(../img/bg-thongtin.png) left top no-repeat;
}
.thongtin h5{
    color: #FF0000;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    /*height: 35px;*/
    padding:5px;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 18px;
}
.thongtin p{
    color: #2b2b2b;
    font-size: 10px;
    padding-top: 5px;
    padding-left: 8px;
    width: 200px;
    height: 40px;
    overflow: hidden;
}
.thongtin div.demo{
    color: #2b2b2b;
    font-size: 11px;
    margin: 5px 5px 10px 5px;
    width: 200px;
    height: 25px;
    overflow: hidden;
    /* font-family: TeXGyreAdventor; */
    line-height: 13px;
    white-space: pre-wrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    display: block;
}
.thongtin .gia{
    color: #FF0000;
    font-size: 13px;
    float: left;
    width: 120px;
}
.thongtin .xemthem{
    width: 85px;
    height: 23px;
    background: url(../img/bg-xemthem.png) left top no-repeat;
    float: left;
}
.thongtin .xemthem a{
    color: #2b2b2b;
    font-size: 10px;
    font-style: italic;
    line-height: 20px;
    padding-left: 25px;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    -fn-transition: all .3s;
    transition: all .3s;
}
.thongtin .xemthem a:hover{
    text-decoration: underline;
}
/*==========END CONTTENT-TRANG CHU=============*/
/*==========CONTENT SANPHAM==============*/
.content-sanpham{
    width: 1000px;
}
.content-sanpham .sanpham-tieude {
    margin-top: 20px;
}
.content-sanpham .sanpham-tieude ul{float:left;}
.content-sanpham .sanpham-tieude ul li{
    float: left;
    border-bottom: 1px solid #ffffff;
}
.content-sanpham .sanpham-tieude ul li a{
    color: #FFFFFF;
    line-height: 20px;
    font-size: 16px;
}
.content-sanpham .sanpham-tieude ul .ruouvang{
    margin-left: 25px;
    list-style: url(../img/icon/icon-sanpham.png);
}
.content-sanpham .sanpham-tieude ul li a:hover{
    text-shadow: 0 0 3px #ffffff;
}


.main{
    margin-top: 20px;
    /*    margin-left: -15px;
        margin-right: -15px;*/
}
.main:after{
    content: '';
    display: block;
    clear: both;
}
/*margin-top: 30px;
float:left;
}
.view2{
    margin-left: 30px;
}*/

.view-post{
    position: relative;
    border-bottom: solid 1px #ccc;
    padding: 10px;
    overflow: hidden;
    background: #fff;
    margin-bottom: 20px;
    clear: both;
}
.view-post:hover{background-color:#f2f2f2;}
.view-post:before{
    content: " ";
    display: table;
}
.view-post a.link_img{
    display: block;
    width: 130px;
    float: left;
    padding-right: 8px;
}
.view-post a.link_img img{width: 120px; height:110px;}
.view-post .mask .title{margin-bottom: 10px;display: block;}
.view-post .mask h2{font-weight:600;}
.view-post .mask a.view-more{position: absolute; right:10px; bottom: 10px;font-size:14px;color: #333;}
.view-post .mask a.view-more:hover{text-decoration: underline;color: #a40043}

.view {
    float: left;
    width: 25%;
    padding-left: 15px;
    padding-right: 15px;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;
    margin-bottom: 20px;
    box-sizing: border-box;
}
.view > a{
    display: block;
    width: 100%;
    padding-top: 100%;
    border: 10px solid #ececec;
    position: relative;
    text-align: center;
    cursor: default;
    box-sizing: border-box;
    background: #fff url(../images/bgimg.jpg) no-repeat center center;
    -webkit-box-shadow: 1px 1px 2px #e6e6e6;
    -moz-box-shadow: 1px 1px 2px #e6e6e6;
    box-shadow: 1px 1px 2px #e6e6e6;
}
.view > a > img{
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
}

.view .tsp{
    position: absolute;
    background-color: #FFCC33;
    padding: 3px 30px;
    -webkit-transform:translate(118px,-6px) rotate(45deg) scale(.8);
    z-index: 1500;
}
.view .tsp p{
    font-family: Arial;
    font-size: 16px;
    font-weight: bold;
    color: #FF0000;
}


.view .mask,.view .content {
    width: 207px;
    height: 207px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}
.view .mask{
    width: auto;
    height: 100%;
    left: 15px;
    right: 15px;
}
.view img {
    display: block;
    position: relative;
    width: 207px;
    height: 207px;
}
.view h2 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    position: relative;
    font-size: 14px;
    padding: 10px;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0;
    max-height:35px;
    overflow:hidden;
}
.view p {
    font-family: Georgia, serif;
    font-style: italic;
    font-size: 12px;
    position: relative;
    color: #fff;
    padding: 10px 20px 20px;
    text-align: left;
}
.view .demo {
    font-family: Georgia, serif;
    font-style: italic;
    font-size: 12px;
    position: relative;
    color: #000;
    padding: 10px 20px 20px;
    text-align: left;
    height:65px;
    overflow:hidden;
}

.view a.info {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: #000;
    color: #fff;
    text-transform: uppercase;
    -webkit-box-shadow: 0 0 1px #000;
    -moz-box-shadow: 0 0 1px #000;
    box-shadow: 0 0 1px #000;
    font-size: 12px;
}
.view a.info: hover {
    -webkit-box-shadow: 0 0 5px #000;
    -moz-box-shadow: 0 0 5px #000;
    box-shadow: 0 0 5px #000;
}


.view-eighth .mask {
    background-color: rgba(255, 255, 255, 0.7);
    top: -100%;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: all 0.3s ease-out 0.5s;
    -moz-transition: all 0.3s ease-out 0.5s;
    -o-transition: all 0.3s ease-out 0.5s;
    -ms-transition: all 0.3s ease-out 0.5s;
    transition: all 0.3s ease-out 0.5s;
}
.view-eighth h2 {
    -webkit-transform: translateY(-200px);
    -moz-transform: translateY(-200px);
    -o-transform: translateY(-200px);
    -ms-transform: translateY(-200px);
    transform: translateY(-200px);
    -webkit-transition: all 0.2s ease-in-out 0.1s;
    -moz-transition: all 0.2s ease-in-out 0.1s;
    -o-transition: all 0.2s ease-in-out 0.1s;
    -ms-transition: all 0.2s ease-in-out 0.1s;
    transition: all 0.2s ease-in-out 0.1s;
}
.view-eighth p {
    color: #333;
    -webkit-transform: translateY(-200px);
    -moz-transform: translateY(-200px);
    -o-transform: translateY(-200px);
    -ms-transform: translateY(-200px);
    transform: translateY(-200px);
    -webkit-transition: all 0.2s ease-in-out 0.2s;
    -moz-transition: all 0.2s ease-in-out 0.2s;
    -o-transition: all 0.2s ease-in-out 0.2s;
    -ms-transition: all 0.2s ease-in-out 0.2s;
    transition: all 0.2s ease-in-out 0.2s;
}
.view-eighth a.info {
    -webkit-transform: translateY(-200px);
    -moz-transform: translateY(-200px);
    -o-transform: translateY(-200px);
    -ms-transform: translateY(-200px);
    transform: translateY(-200px);
    -webkit-transition: all 0.2s ease-in-out 0.3s;
    -moz-transition: all 0.2s ease-in-out 0.3s;
    -o-transition: all 0.2s ease-in-out 0.3s;
    -ms-transition: all 0.2s ease-in-out 0.3s;
    transition: all 0.2s ease-in-out 0.3s;
}
.view-eighth:hover .mask {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    top: 0px;
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
    -ms-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-animation: bounceY 0.9s linear;
    -moz-animation: bounceY 0.9s linear;
    -ms-animation: bounceY 0.9s linear;
    animation: bounceY 0.9s linear;
}
.view-eighth:hover h2 {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -o-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition-delay: 0.4s;
    -moz-transition-delay: 0.4s;
    -o-transition-delay: 0.4s;
    -ms-transition-delay: 0.4s;
    transition-delay: 0.4s;
}

.view-eighth:hover p {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -o-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    -ms-transition-delay: 0.2s;
    transition-delay: 0.2s;
}
.view-eighth:hover a.info {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -o-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
    -ms-transition-delay: 0s;
    transition-delay: 0s;
}
.view-eighth a:hover{
    color: #FF0000;
    background-color: #ffffff;
}
@keyframes bounceY {
    0% { transform: translateY(-205px);}
    40% { transform: translateY(-100px);}
    65% { transform: translateY(-52px);}
    82% { transform: translateY(-25px);}
    92% { transform: translateY(-12px);}
    55%, 75%, 87%, 97%, 100% { transform: translateY(0px);}
}
@-moz-keyframes bounceY {
    0% { -moz-transform: translateY(-205px);}
    40% { -moz-transform: translateY(-100px);}
    65% { -moz-transform: translateY(-52px);}
    82% { -moz-transform: translateY(-25px);}
    92% { -moz-transform: translateY(-12px);}
    55%, 75%, 87%, 97%, 100% { -moz-transform: translateY(0px);}
}
@-webkit-keyframes bounceY {
    0% { -webkit-transform: translateY(-205px);}
    40% { -webkit-transform: translateY(-100px);}
    65% { -webkit-transform: translateY(-52px);}
    82% { -webkit-transform: translateY(-25px);}
    92% { -webkit-transform: translateY(-12px);}
    55%, 75%, 87%, 97%, 100% { -webkit-transform: translateY(0px);}
}


.bannerquangcao{
    margin-top: 20px;
}

.footer{
    width: 100%;
    background: url(../img/bg-footer.png) left top repeat;
    margin-top: 10px;
    float: left;
}
.footer .footer1{
    width: 320px;
    float: left;
    margin: 15px 0;
}
.footer .footer1 h4{
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    color: #FFFFFF;
    margin-top: 10px;
    padding-left: 10px;
    border-left: 2px solid #FF0000;
}
.footer .footer1 ul{
    margin-top: 10px;
}
.footer .footer1 ul li{
    list-style: url(../img/icon/iconlogo.png);
    margin: 2px 0px 2px 15px;
}
.footer .footer1 ul li a{
    font-size: 13px;
    color: #FFFFFF;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -fn-transition: all .2s;
    transition: all .2s;
}
.footer .footer1 ul li a:hover{
    text-shadow: 0 0 1px #ffffff;
    padding-left: 5px;
}

.footer .footer2{
    width: 175px;
    height: 200px;
    float: left;
}

.footer .footer3{
    width: 340px;
    float: right;
}
.footer .footer3 .login{
    margin-top: 30px;
    float: left;
}


.footer .footer3 .login input{
    width: 230px;
    height: 32px;
}
.footer .footer3 .bo1{
    width: 50px;
    height: 36px;
    background-color: #FF0000;
    float: left;
    margin-top: 30px;
    margin-left: 10px;
}
.footer .footer3 .bo1 a{
    line-height: 36px;
    text-align: center;
    color: #FFFFFF;
    display: block;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -fn-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
}
.footer .footer3 .bo1 a:hover{
    color: #FF0000;
    background-color: #FFFFFF;
}
.footer .footer3 .mangxahoi{
    width:100%;
    float:left;
    margin-top:10px;
}
.footer .footer3 .social{background:url('../img/icon-social.png') no-repeat;display:inline-block;width:30px;height:30px;-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:6px;-webkit-border-radius:6px;-moz-border-radius:6px;}
.footer .footer3 .social:hover{-moz-transform:rotate(20deg);-webkit-transform:rotate(20deg);-o-transform:rotate(20deg);-ms-transform:rotate(20deg);transform:rotate(20deg);}
.footer .footer3 .social:nth-child(1){background-position:0 -30px;}
.footer .footer3 .social:nth-child(2){background-position:0 -60px; margin-left: 20px;}
.footer .footer3 .social:nth-child(3){background-position:0 0; margin-left: 20px;}
.footer .footer3 .social:nth-child(4){background-position:0 -90px; margin-left: 20px;}

.footer .footer1_footer1{
    width: 100%;
    float: left;
    margin:15px 0;
    color:#FFF;
    text-align:center;
    font-size: 16px;
}

.scroll-img {
    width: 100%;
    /*height: 355px;*/
    overflow: hidden;
    font-size: 0;
}
.scroll-img ul {
    /*width: 700px;*/
    margin: 0;
}
.scroll-img ul li {
    display: inline-block;
}
#demo5.scroll-img ul {
    width: 1500px;
}
#demo5-btn {
    width: 680px;
    padding-top: 10px;
}

.main .news{
    width:978px;
    float:left;
    border:1px #999 solid;
    padding:10px 10px 20px 10px;
    background: #FFF url(../img/bg_news.jpg) left top repeat;
    font-size: 14px;
    line-height: 25px;
}
/*background: #CCC url(../img/icon/bg-head.png) left top repeat;*/
/* lien he */
.lienhe-nhapthongtin{width:100%; float:left;}
.contact_us_use{width:100%; float: left; margin-top:6px; padding-top:15px; border: 2px solid #ccc; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);}
.contact_us_use div.contact_us_t{width:100%; float:left; margin-bottom: 10px;}
.contact_us_use div.contact_us_t label{width:32%; padding-top: 5px;  margin-right:2%; text-align:right; float:left;}
.contact_us_use div.contact_us_c{width:55%; float:left; margin-left:10px;}
.contact_us_use div.contact_us_c .in_contact{border:1px #999 solid; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.contact_us_use div.contact_us_c input{ width:350px; height:28px;}
.contact_us_use div.contact_us_c input.captcha{ width:270px; height:28px;}
.contact_us_use div.contact_us_c .img_captcha{width: 80px;float: left;}
.contact_us_use div.contact_us_c textarea{ width:350px; height:100px;}
.contact_us_use div.contact_us_action{width:50%; padding-left:45%; float:left; margin: 10px 0;}
.error{text-align:center; color:#F00; font-size:14px; font-weight:700;}

/* product */
.main .pro-detail{
    width:938px;
    float:left;
    border:1px #999 solid;
    padding:10px 30px 20px 30px;
    background: #FFF url(../img/bg_news.jpg) left top repeat;
    font-size: 14px;
    line-height: 25px;
}
.main .pro-detail .row{width:100%; height:350px; float: left;}
.main .pro-detail .row_pro_left{width:530px; height:100%; float: left; margin-right: 20px; border: 1px solid #dadada;}
.main .pro-detail .row_pro_right{width:380px; height:100%; float: left; }
.main .pro-detail .row_pro_right .pro_right{padding: 10px 0px 0px 0px; }
.main .pro-detail .row_pro_right .line_sp{width:100%; min-height:30px; line-height:30px; float:left; margin-bottom:3px;}
.main .pro-detail .pro_content{width:100%; float:left; margin:30px 0 10px 0;}
.main .pro-detail .pro_comments{width:100%; float:left; margin:10px 0 10px 0;}

p.pds_title {
    font-style: italic;
    font-size: 20px;
    padding-bottom: 20px;
    font-weight:bold;
}
div.pds_price {
    float: left;
    font-size: 23px;
    color: #f00;
    font-style: italic;
    line-height: 52px;
    padding-right: 12px;
}
div.pds_no {
    float: left;
    height: 62px;
    width: 65px;
    position: relative;
}
input.pds_no {
    width: 50px;
    height: 40px;
    padding: 5px 0 0;
    color: #bbb;
    font-size: 26px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    text-align:center;
}
div.pds_scart {
    float: left;
}

span.scart_continue {
    float: right;
    background: url(../img/button_left_8x48.png) no-repeat top left, url(../img/button_right_8x48.png) no-repeat top right;
    height: 48px;
    padding: 0 5px;
}
input.scart_continue {
    height: 48px;
    overflow: visible;
    padding: 0 15px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    background: none;
    border: none;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
    color: #010101;
    background: url(../img/button_mid_1x48.jpg) repeat-x top left;
}
input.scart_continue:hover{
    border: none;
}
div.pds_info {
    padding-top: 5px;
    color: #3c3c3c;
    line-height: 24px;
    font-size:12px;
}
div.pds_info b{
    font-weight:bold;
}

/*gio hang*/
table.cart {
    clear: both;
    width: 100%;
    margin: 0 auto;
    border-collapse: separate;
    border-spacing: 0;
    text-shadow: 0 1px 0 #fff;
    background: #fff;
    border: 1px solid #D1D1D1;
    border-bottom: none;
}
table.cart thead th {
    font-size: 16px;
    text-align: left;
    text-align: center;
    padding: 7px 10px 9px;
    font-weight: normal;
    background: #292929;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    background: -moz-linear-gradient(100% 100% 90deg, #292929, #434343);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#434343), to(#292929));
}
table.cart td {
    padding: 10px;
    border-bottom: 1px solid #D1D1D1;
    border-right: 1px dotted #D1D1D1;
    text-align: center;
    vertical-align: middle;
    box-shadow: 0 1px 0 #fff;
}
table.cart td p{
    font-size:13px;
}
table.cart td.jshop_img_description_center img {
    width:100px;	
    max-height:100px;
}
div.tongtien{width:100%; float:left; text-align:right; margin:10px 0 10px; border-bottom: 1px dotted #ccc; padding-bottom:10px; font-weight:bold;}
div.tongtien #tong{font-weight:bold;}
div.card_left{width:50%; float:left;}
div.card_left a{text-decoration: none; color: rgb(69, 66, 70);}
div.card_left a:hover{text-decoration:underline;}
div.card_right{width:50%; float:left; text-align:right;}
.jshop_prod_cart input.inputbox{width:35px; height:25px; text-align:center;}
.contact_us_use div.contact_pay_action{ padding-left:45%; float:left; margin: 10px 0;}

div.imgtam{width:100%; float:left; text-align:center;}
img.imgtam{max-width:100%; height: 320px;}
div.pro_empty{width:100%; float:left; color:#CCC;}
div.pro_empty span{color:#FFF; font-weight:800;}

/* phan trang */
div.pageing{
    width:100%; 
    float:left;
    clear: both;
    margin: 25px 0;
    padding: 1px;
    text-align:right;
}
div.pageing .spaginate-inner{

    clear: both;
    height: 34px;
    margin-bottom: 20px;
    padding-left: 15px;
    padding-top: 16px;
}
div.pageing span{
    color: #FFF;
    margin-right: 4px;
}
div.pageing a{
    border: 1px solid #666;
    color: #999;
    margin-right: 5px;
    padding: 4px 8px;
    text-align: center;
    text-decoration: none;
    font-size:13px;
}
div.pageing a.active, div.pageing a:hover{
    background: url(../img/bg-footer-1.png) repeat;
    color: #FFF;
    border: 1px solid #FFF;
}
/* phan trang */
.row_pro_left #img_01{max-width:530px;}
.row_pro_left #gallery_01{
    width:100%;
    height:80px;
    float:left;
    background:#FFF;
}
.row_pro_left #gallery_01 img{	
    height:75px;
    float:left;
}


div.like{	
    height:29px;
    background-color: #ffffff;
    margin-top:10px;
}
div.like ul{
    padding-top: 5px;
}
div.like ul li{
    float: left;
    max-width:120px;
}
div.like ul .luot1{
    background: url(../img/luotlike.png) left top no-repeat;
    padding-right: 10px;
    height: 17px;
    width: 20px;
}
div.like ul p{
    padding-left: 5px;
    font-size: 13px;
}
div.like ul li a:hover{
    opacity: .5;
}
div.like ul li.twitter{
    max-width:90px;
    margin-left:3px;
}
div.like ul li.plusone{
    max-width:120px;
}

/*tim kiem nang cao*/
.search_cao{
    color:#FFF;
    width: 200px;
    height: 20px;
    float: left;
    margin-top: 6px;
    margin-left:40px;	
    cursor:pointer;
}
div.advancedSearch_bg {
    background: url("../img/body_bg.jpg") repeat 0 0;
    border: 1px solid #C3C3C3;
    border-radius: 5px;
    box-shadow: 5px 5px 5px #09090A;
    left: 175px;
    min-height: 100px;
    position: absolute;
    top: 33px;
    width: 900px;
    z-index:10;
}
div.advancedSearch_arrow {
    background: url("../img/advanced-search-arrow.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    position: absolute;
    top: -9px;
    left: 285px;
    width: 32px;
    height: 9px;
}
div.advancedSearch_content {
    padding: 16px 10px;
    float:left;
}
label.advancedSearch_label {
    color: #FF6C00;
    font-size: 14px;
    font-style: italic;
    text-transform: uppercase;
    padding-right: 10px;
}
select.advancedSearch_catlist {
    border: 1px solid #8F8F8F;
    color: #5E5E5E;
    font-size: 14px;
    height: 28px;
    line-height: 28px;
    padding: 4px;
}
span.advancedSearch_numWines {
    color: #45474C;
    font-size: 14px;
    padding-left: 10px;
}
div.advancedSearch_filter {
    margin-top: 20px;
    max-height: 420px;
    float:left;
}
div.advancedSearch_filter div.column {
    float: left;
    border-right: #5E5F61 1px solid;
    padding-right: 0px;
    margin-right: 15px;
    height: 100%;
    min-height:200px;
}
div.advancedSearch_filter div.column2 {
    border-right: none;
}
.mCSB_container {
    width: auto;
    margin-right: 0px;
    overflow: hidden;
}
div.advancedSearch_filter div.column div.filter_flag {
    color: #fff;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
}
div.advancedSearch_filter div.column ul.filter-list li.filter {
    padding-left: 0px;
    padding-right: 20px;
}
div.advancedSearch_filter div.column ul.filter-list li.filter label {
    color: #9b9b9b;
    line-height: 24px;
    font-size: 14px;
}
div.advancedSearch_filter div.column ul.filter-list li.filter label span {
    padding-left: 2px;
}
div.advancedSearch_filter div.column ul.filter-list li.filter a {
    color:#9b9b9b;
}
.filter label {
    font-size: 14px;
    line-height: 32px;
    display: block;
    width: 100%;
}

.error_page{width:100%; float:left; text-align:center; margin-top:20px; color:#FFF;}
.error_page h1{font-size:40px; color:#FFF;}
.error_page div{margin-top:10px;}
.error_page div a{color:#F00;}

/*
iPhone and mobile widths --------------------------------------------------------------------------------------------------------------------------- */
@media only screen and (min-width: 320px) and (max-width: 480px) {
    .stack { float: none; width: auto; margin-bottom: 35px; }
    h1.title { margin: 15px 0; }
    .view-post .demo{display:none;}
    .view-post a.link_img{width:90px;}
    .view-post a.link_img img{width: 90px;height:80px;}
    .view-post .mask h2{line-height: 18px;}
	
	#themelistings li { width: auto; float: none; margin-right: 0; margin-bottom: 10px; }
}

@media only screen and (min-width: 481px){
    .pro_relation .view-post{width: 46.2%;float:left; clear:none;}
    .pro_relation .view-post-2{margin-right:30px;}
}

@media (max-width: 575.98px) {
	.footer .footer3 .mangxahoi{text-align:center;}
}
