@font-face {
    font-family: 'FontAwesome';

    src: url(../Content/fonts/awesome/fontawesome-webfont.ttf);
    src: url('../Content/fonts/awesome/fontawesome-webfont.ttf') format('embedded-opentype'),url(../Content/fonts/awesome/fontawesome-webfont.ttf?v=4.4.0) format('truetype'),url('../Content/fonts/awesome/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
    font-weight: 400;
    font-style: normal
}

body {
    background-color: #fff;
    overflow-x: auto;
    min-width: 1200px
}

body, input, button, option, textarea, legend, h4, h5, h6 {
    font: 14px/18px Arial,Helvetica,sans-serif;
    color: #333;
    outline: none
}

h1 {
    font: 28px/25px arial
}

a {
    text-decoration: none;
    color: #1d537f
}

a:hover {
    text-decoration: none;
    color: #ff6100
}

* {
    list-style: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

hr {
    border-bottom: 1px solid #ddd;
    margin: 20px 0;
    border-top: none;
    clear: both
}

.headpage {
    margin-bottom: 10px;
    padding:10px 0;
    height: 34px;
    border-bottom: 1px solid #ddd;
    position: relative
}

.head-module {
    margin: 20px 0
}

.head-module .flexJus, .head-module .flexCen {
    height: 40px
}

header .b {
    position: relative
}

.catetag {
    background: #f3f3f3;
    margin-top: 15px;
    margin-bottom: 15px;
    overflow: hidden;
    height: 48px;
}

.catetag a {
    display: inline-block;
    margin: 15px 10px;
}

.catetag a::before {
    content: '•';
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    margin-right: 5px;
}

.i img {
    width: 100%
}

.sapo {
    padding: 15px;
    font-size: 14px;
    line-height: 23px;
    text-align: justify;
    margin-bottom: 10px;
}

.sapo h2 {
    margin-bottom: 5px;
    font-size: 16px;
}

.b, .b2, section {
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 15px
}

.b3 {
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;width:100%;height:100%;
}

.fl, .slidehome, .shock-m li, .shock-p a, .shock, .search input, .fsl, .fsr, .ai, .anv, .anv img, .muahang, .incom, .leftm, .colleft {
    float: left
}

.fr, .advht, .fsl span, .follow, .colright {
    float: right
}

.cl, footer, .shock-m:after, nav {
    clear: both;
    display: table;
    content: " "
}

.b, .b2, section, .pi, .pir, .s, header, footer, nav, .shock {
    width: 100%
}

section {
    margin-top: 10px;
    margin-bottom: 10px
}

.f, .bst, .shock-p, .dbox, .comact, .bpq, .bpq2, .r1, .r2, .banner, .banner img, .boxpro {
    float: left;
    width: 100%
}

.colleft {
    padding-right: 1%;
    width: 18%
}

.colright {
    width: 82%
}

/*.w20, .w30, .w40, .w50, .w60, .w70, .w80 {
    padding-left: 15px;
    padding-right: 15px
}*/

.w80 {
    width: 80%
}

.w60 {
    width: 60%
}

.w70 {
    width: 70%
}

.w50 {
    width: 50%
}

.w40 {
    width: 40%
}

.w30 {
    width: 30%
}

.w20, .menufac p a, .five a {
    width: 20%
}

.dbox {
    margin: 40px 0
}

.hide, .bs {
    display: none
}
img{max-width:100%;max-height:100%;}

.show, .tvmp b, .sht, .sn label, .anv label, .incom a, .btn2, .btn2 span, .dd:hover > .menulist, .op label, .six .pr, .hcmenu li:hover > ul, .r2 i, #PP label, #PP a, .toptit, .camket li span b {
    display: block
}

.show {
    display: block !important
}

.inline, .shock-m div, .shock-m li h2 {
    display: inline
}

.logo, .btn, .ibf, .cart, .tvmp, .dv i, .camket div, .fsl i, .fsl span, .anv label, .follow a, .follow span, .bsf a, .shock-p a, .menufac p a, .nhan i, .hctit h2, .hctit a, .hctit div, .hcnew, #PP a, .mi i, .mi2, .mi2 i, .comact span {
    display: inline-block
}

.flexCen, .pn, .pn2, .pi, .ser, .dv li, .camket li, .follow, .psnext, .psback, .op, .op0, .search {
    display: flex;
    align-items: center;
    justify-content: center
}

.flexJus, .anv ul, .shock-p, .pw {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.flexNor {
    display: flex;
    align-items: center
}
.flexL {
    display: flex;
    justify-content: flex-start;
}
.flexR {
    display: flex;
    justify-content: flex-end;
}
.s, .b2 {
    display: table
}

.flexCol, .op .pp, .ttcol3 {
    display: flex;
    flex-direction: column
}

.flex, .dd:hover > .menufac, .dd:hover > .menugd, .hcmenu, .listh ul, .pagelist, .incom, .dv, .camket, .camket ul, .comment {
    display: flex
}

.flex {
    justify-content: space-between
}

.dd, nav, #PP label, .bpq, .five a, .hcmenu li, .hclist a, .boxpro, .pspanel, .psitem, .sales label, .camket, .camket ul, .camket li, .comment {
    position: relative
}

.dd i:after {
    margin-left: 3px;
    font: 12px/23px FontAwesome;
    vertical-align: top;
    content: "\f0dd"
}

nav div, .menulist, #all-hsx, .nhan, .bpq strong, .five a:after, .hcmenu li ul, .hcnew, .pswrap {
    position: absolute
}

.bo, .five, .six a, .dv li, nav div, #PP, .product a, .ss a {
    border: 1px solid #ddd
}

.p10 {
    padding: 10px
}

.mr0 {
    margin-right: 0 !important
}

.cen, .btn, .pn, .tvmp, .cart, .sht, .product a {
    text-align: center
}

.text {
    font-size: 16px;
    line-height: 25px;
    text-align: justify
}


/*dac diem*/
.dacdiem {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ddd
}

.dacdiem img, .dacdiem object {
    max-width: 100%;
    display: block
}

.dacdiem h2 {
    font: 25px/30px arial;
    margin: 20px 0;
    color: #555
}

.dacdiem p {
    font: 15px/25px arial;
    color: #666
}

.dacdiem:nth-last-child(1) {
    border-bottom: none
}

.ddimg, .ddinfo {
    width: 50%;
    float: left
}

.ddinfo {
    padding: 0 80px;
    text-align: center
}




.larlink {
    font: bold 13px/40px tahoma !important;
    color: #1d537f !important;
    padding-left: 10px;
    margin: 0 !important
}

.moselect {
    color: #fff;
    background: #1e5480
}

.ds, .ds h2 {
    display: inline;
    font-size: 12px;
    color: #666
}

.ds h2 {
    font-weight: 700
}


/*phan trang*/
.phantrang {
    float: left;
    width: 100%;
    padding: 15px 0;
    margin: 10px 0 0;
    text-align: center;
    border-top: 1px solid #ddd
}

.phantrang li {
    display: inline-block
}

.phantrang li a {
    margin: 0 2px;
    padding: 5px 10px;
    border-radius: 50%
}

.phantrang li:hover a, .phantrang li.active a {
    background-color: #1d537f;
    color: #FFF
}

.phantrang li a {
    color: #000
}

.box {
    margin: 20px 0
}

.boxtit {
    display: inline-block;
    float: left;
    border-left: 5px solid #f6a623;
    border-right: 2px solid #ddd;
    padding: 0 15px;
    font-size: 18px;
    color: #333
}

/*san pham*/
.bsqt {
    display: block;
    color: green;
    font: 12px/16px arial;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    border-top: 1px solid #ddd
}
.btn {
    text-transform: uppercase
}

.btn {
    border-radius: 5px;
    color: #fff;
    font: bold 12px/33px Arial;
    padding: 0 10px;
    cursor: pointer;
    margin: 0 2px
}

.btnmore {
    background: #ff6000
}

.bac {
    padding: 0 15px !important
}

.bac:hover {
    color: #fff
}

.bcam {
    background: linear-gradient(to top,#ffa103,#fb7d0f)
}

.bxanh {
    background: linear-gradient(to bottom,#0174b4,#00659e) !important;
}

.itragop {
    background: #ffa103;
    color: #000;
    font: 11px/21px arial;
    padding: 0 5px;
    width: 70px;
    position: absolute;
    z-index: 1;
}

.btn2 {
    border-radius: 6px;
    padding: 9px 0;
    color: #fff;
    text-align: center;
    cursor: pointer;
    background: linear-gradient(to top,#2290e4,#1072bf);
    font: bold 15px Arial;
    margin-bottom: 10px
}

.btn2 span {
    font: 12px arial;
    text-transform: none
}

.odh, .odh:hover {
    background: linear-gradient(to top,#ffa801,#fb7710) !important
}
.pn, .pn2 {
    height: 20px;
    margin: 15px 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px
}

.pn2 {
    font-size: 17px
}

.pi, .pir {
    height: 183px;
    margin-bottom: 10px
}

.pir {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.pi img {
    max-height: 100%;
    max-width: 100%
}

.pr, .prl {
    font: bold 16px/26px arial;
    color: red
}

.prl {
    font-size: 18px !important
}

.op0 {
    height: 80px
}

.op {
    height: 120px;
    flex-direction: column
}

.op p, .op2 p {
    font: 12px/16px arial;
    color: #666
}

.op label {
    font-weight: 700;
    color: #1665ab;
    line-height: 25px
}

.pcta {
    height: 60px;
    float: left;
    width: 100%
}

.sum {
    text-align: justify;
    font-size: 12px;
    color: #666;
    margin-top: 10px
}

.s {
    background-image: url(/Content/img/bg.png);
    background-repeat: no-repeat;
    font-weight: 700;
    height: 15px;
    width: 70px;
    margin: 0 auto
}

.s0 {
    background-position: -367px -160px
}

.s1 {
    background-position: -367px -90px
}

.s2 {
    background-position: -367px -107px
}

.s3 {
    background-position: -367px -126px
}

.s4 {
    background-position: -367px -145px
}

.s5 {
    background-position: -367px -175px
}

.nhan {
    width: 100%;
    text-align: right;
    top: 10px;
    right: 10px;
    font: bold 12px arial
}

.nhan i {
    color: #fff;
    font: bold 9px/11px arial;
    height: 47px;
    padding: 5px 10px;
    text-align: center;
    text-transform: uppercase;
    width: 43px;
    background: url(/Content/img/iconm.png) 0 0
}

.bpq {
    border: 1px dashed #aaa;
    border-radius: 10px
}

.bpq strong {
    font: 13px/20px arial;
    padding: 0 8px;
    background: #fff;
    left: 30px;
    top: -10px;
    color: red
}

.bpq, .bpq2 {
    font: 12px/16px arial;
    text-align: left;
    padding: 15px 10px;
    color: #444
}

.bpq2 strong {
    font: bold 13px/20px arial;
    color: #1e5480;
    text-align: center;
    display: block;
    margin-bottom: 10px
}

.bpq strong:before, .bpq2 strong:before {
    content: "\f06b";
    font: 15px/20px FontAwesome;
    margin-right: 5px
}

.bpq b:last-child, .bpq2 b:last-child {
    color: red
}

.bpq img, .bpq2 img {
    max-height: 45px;
    margin-right: 3px;
    float: left
}

.numgift {
    font: 12px/20px arial
}

.numgift:before {
    content: "\f111";
    font: 5px/19px FontAwesome;
    margin-right: 5px;
    vertical-align: top
}

.btnprev {
    color: #4a90e2;
    border: 1px solid #4a90e2
}

.btnprev:hover {
    background: #4a90e2;
    color: #fff
}

.pp {
    font-size: 12px;
    line-height: 20px
}

.pp li {
    color: #666
}

.pw {
    background: #eee
}

#pmore::before {
    clear: both;
    content: "";
    display: block
}

#pmore p {
    clear: both;
    color: #666;
    cursor: pointer;
    font: bold 12px/20px Arial;
    margin: 15px auto;
    padding: 10px;
    text-align: center;
    width: 230px;
    border: 1px solid #ddd;
    border-radius: 5px
}
.pr2 {
    color: #ff6000;
    font: bold 19px/26px arial;
    margin: 10px 0;
    display: block
}

.bg {
    background-image: url(/public/frontend/images/bg.png);
    background-repeat: no-repeat
}

.bgh {
    height: 20px
}

.bgh:before {
    background-image: url(/public/frontend/images/bgh.png);
    background-repeat: no-repeat;
    display: inline-block;
    width: 80px;
    content: " ";
    background-size: 300px;
    height: 100%
}

.op2 {
    min-height: 40px
}

.qg {
    min-height: 65px
}


.bwranty {
    position: absolute;
    top: 0;
    left: 0;
    width: 99px;
    height: 95px;
    background-position: 0 -6px;
    z-index: 1
}

.bwranty span {
    font: bold 18px/108px arial;
    color: #fff;
    transform: rotate(-20deg);
    display: block;
    text-align: center;
    z-index: 1
}


.bi .cen {
    position: relative
}

/*icon*/
.fa:before {
    font: 14px/1px FontAwesome
}

.face:before {
    content: "\f09a"
}

.gplus:before {
    content: "\f0d5"
}

.ytb:before {
    content: "\f167"
}

.radio:before {
    font: 14px/1px FontAwesome;
    margin-right: 5px;
    color: #999
}

.select:before {
    content: "\f192"
}

.unselect:before {
    content: "\f10c"
}

.down:before {
    content: "\f0dd"
}

.home:before {
    content: "\f015"
}

.location:before {
    content: "\f041"
}

/*icon hang*/
.iaeg:before {
    background-position: 23px 3px;
    background-size: 280px
}

.iamica:before {
    background-position: -64px 1px;
    width: 60px
}

.iamts:before {
    background-position: -129px 4px;
    width: 40px
}

.iaosmith:before {
    background-position: -164px 2px;
    width: 72px
}

.iarber:before {
    background-position: -242px -4px;
    width: 64px
}

.ibalay:before {
    background-position: 1px -26px;
    width: 60px
}

.iberghoff:before {
    background-position: -71px -24px;
    width: 70px
}

.ibinova:before {
    background-position: -150px -24px;
    width: 60px
}

.iblanco:before {
    background-position: -228px -24px;
    width: 60px
}

.ibosch:before {
    background-position: 0 -50px;
    width: 73px
}

.icandy:before {
    width: 75px;
    background-size: 500px !important;
    background-position: -430px -557px
}

.ibrandt:before {
    background-position: -93px -57px;
    width: 63px;
    background-size: 330px
}

.icanzy:before {
    background-position: -154px -52px;
    width: 63px
}

.ielag:before {
    background-position: 20px -372px;
    width: 70px
}

.icariny:before {
    background-position: -222px -46px;
    width: 59px;
    background-size: 290px
}

.iberndes:before {
    background-position: -40px -372px;
    width: 70px
}

.izwilling:before {
    background-position: -111px -372px;
    width: 70px
}

.icarysil:before {
    background-position: 2px -76px;
    width: 70px
}

.icata:before {
    background-position: -65px -72px;
    width: 70px
}

.ichefs:before {
    background-position: -140px -73px;
    width: 56px
}

.iedesa:before {
    background-position: -202px -73px;
    width: 68px
}

.ielectrolux:before {
    background-position: 1px -111px;
    width: 81px;
    background-size: 330px
}

.ielmich:before {
    background-position: -84px -100px;
    background-size: 309px;
    width: 64px
}

.ielo:before {
    background-position: -148px -98px;
    width: 36px
}

.iemalia:before {
    background-position: -191px -95px;
    width: 68px
}

.ifaber:before {
    background-position: -235px -119px;
    width: 68px
}

.ifagor:before {
    background-position: -153px -120px;
    width: 68px
}

.ifaster:before {
    background-position: -80px -118px;
    width: 56px
}

.ifissler:before {
    background-position: 0 -133px;
    background-size: 280px;
    width: 39px
}

.ifivestar:before {
    background-position: 0 -142px;
    background-size: 350px;
    width: 82px
}

.ifranke:before {
    background-position: -45px -132px;
    background-size: 280px;
    width: 56px
}

.igiovani:before {
    background-position: -98px -133px;
    background-size: 280px;
    width: 56px
}

.ihafele:before {
    background-position: -161px -133px;
    background-size: 280px;
    width: 65px
}

.ihitachi:before {
    background-position: -185px -173px;
    background-size: 310px;
    width: 64px
}

.ikangaroo:before {
    background-position: -111px -189px;
    background-size: 340px;
    width: 76px
}

.ikernau:before {
    background-position: -32px -167px;
    width: 53px
}

.iking:before, .ikinghoff:before {
    background-position: -2px -201px;
    background-size: 310px;
    width: 73px
}

.ikitchinox:before {
    background-position: -91px -200px;
    background-size: 310px;
    width: 74px
}

.ikosco:before {
    background-position: -179px -202px;
    background-size: 310px;
    width: 74px
}

.ilg:before {
    background-position: -252px -193px;
    width: 44px
}

.ilorca:before {
    background-position: 0 -218px;
    width: 49px
}

.imalloca:before {
    background-position: -66px -232px;
    width: 75px;
    background-size: 320px
}

.imunchen:before {
    background-position: -150px -232px;
    width: 77px;
    background-size: 320px
}

.imunchen-l:before {
    background-position: -170px -262px;
    width: 86px;
    background-size: 360px
}

.inapoli:before {
    background-position: -228px -215px;
    width: 66px
}

.inapoliz:before {
    background-position: 0 -244px;
    width: 66px
}

.ineff:before {
    background-position: -69px -240px;
    width: 66px
}

.inodor:before {
    background-position: -147px -256px;
    width: 66px;
    background-size: 320px
}

.ipaloma:before {
    background-position: -219px -256px;
    width: 66px;
    background-size: 320px
}

.ipanasonic:before {
    background-position: -255px -298px;
    width: 66px;
    background-size: 340px
}

.ipyramis:before {
    background-position: -194px -354px;
    width: 80px;
    background-size: 400px
}

.irinnai:before {
    background-position: -72px -265px;
    width: 60px
}

.irobam:before {
    background-position: -3px -256px;
    width: 60px;
    background-size: 290px
}

.iseverin:before {
    background-position: 0 -288px;
    width: 70px
}

.ihenry:before {
    background-position: -79px -258px;
    background-size: 270px;
    width: 40px
}

.isevilla:before {
    background-position: -245px -162px;
    width: 61px
}

.isiemens:before {
    background-position: -145px -287px;
    width: 63px
}

.ismartcook:before {
    background-position: -258px -327px;
    width: 67px
}

.ismeg:before {
    background-position: 0 -310px;
    width: 60px
}

.isobisung:before {
    background-position: -68px -300px;
    width: 56px;
    background-size: 290px
}

.isunhouse:before {
    background-position: -142px -312px;
    width: 65px
}

.itaka:before {
    background-position: -214px -301px;
    width: 60px;
    background-size: 290px
}

.iteka:before {
    background-position: 0 -330px;
    width: 41px;
    height: 30px;
    background-size: 290px
}

.itopy:before {
    background-position: -51px -332px;
    background-size: 290px;
    width: 42px
}

.izelmer:before {
    background-position: -99px -332px;
    background-size: 290px;
    width: 66px
}

.ieurosun:before {
    background-position: -169px -333px;
    background-size: 290px;
    width: 82px
}
.igaggenau:before {
    background-position: -184px -365px;
    width: 74px
}
.ineff:before {
    background-position:4px -400px;
    width: 70px
}
.iliebherr:before {
    background-position: -66px -398px;
    width: 70px
}

/*search box*/
.search-box {
    display: none;
    position: absolute;
    left: -1px;
    top: 54px;
    background: #fff;
    border-top: none;
    width: 345px;
    right: 0;
    z-index: 9999;
    border: 1px solid #e2e2e2
}

.search-box li {
    float: left;
    width: 100%;
    border-bottom: 1px dotted #e8e8e8;
    background: #fff;
    padding: 10px;
    position: relative;
    box-sizing: border-box
}

.search-box li .search-img {
    float: left;
    width: 55px;
    object-fit: cover
}

.search-box li .search-img img {
    float: left;
    width: 100%
}

.search-box li .search-name {
    float: left;
    width: 70%;
    padding: 0 0 0 10px;
    box-sizing: border-box
}

.search-box li .search-name h4 {
    overflow: hidden;
    line-height: 1.3em;
    font-size: 14px;
    color: black;
    font-weight: 600;
    height: 36px
}

.search-box li .search-link {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.search {
    position: relative
}

ul.search-box:before {
    bottom: 100%;
    left: 80px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    border-color: rgba(218,218,218,0);
    border-bottom-color: #fff;
    border-width: 15px;
    margin-left: -9px
}

span.price_search {
    font-size: 12px;
    color: #c70100;
    float: none
}

.breadcrumb{display:flex;align-items:center;}
.breadcrumb p, .ds h1, .breadcrumb li {display: inline;}
.breadcrumb > p:after, .breadcrumb > li:after {padding: 0 5px;color: #337ab7;content: "\f105";font: normal normal normal 14px/1px FontAwesome;}
.breadcrumb a{font:bold 13px/15px arial;color: #337ab7;}

/*table*/
.table table{margin:15px auto;font-size:13px;text-align: left;border-collapse: collapse;border:1px solid #666;float:left;width:600px;}
.table table th{padding: 12px;font-weight: bold;font-size: 14px;color: #fff;background:#777 !important;}
.table table > tbody > tr > td{padding:8px;color: #333;}
.table table > tbody > tr:nth-child(2n+1) > td{background:#f9f9f9;}
.table table > tbody > tr:nth-child(2n) > td{background:#fff;}
.table table tfoot td{font-size: 11px;}

/*danh gia*/
.detail-rating{margin-left:20px;}
.rating-item label{float:left;width:58px;display:block;color:#0082f1;}
.detail-rating-mark {color: #949495; margin:0px 5px; text-align:left; float:left;font-size:14px;}
.rating-item { display: table; margin-bottom: 5px; width: 100%;}
.rating-item > span.rating-level { color: #0082f1; width: 50%;}
.rating-item > span { display: inline-block; position: relative;}
.rating-item > span.rating-bar { background: #d4d4d4;  border-radius: 3px;  box-shadow: 1px 1px 4px -1px rgba(0, 0, 0, 0.3) inset; height: 12px; width:60%; margin:8px 5px 0px 5px; float:left;}
.rating-item > span > span { background: #ffa63e; border-radius: 3px;  box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.4) inset; display: block;  height: 100%; left: 0; position: absolute; top: 0;}
.starRating:not(old){display: inline-block;width: 7.5em;height : 1.5em;overflow : hidden;vertical-align : bottom;}
.starRating:not(old) > input{display:none;}
.starRating:not(old) > label{display : block;float : right;position: relative;background: url('/Content/plugins/Rating/star-off.png');background-size : contain;}
.starRating:not(old) > label:before{content : '';display : block;width : 1.5em;height: 1.5em;background: url('/Content/plugins/Rating/star-on.png');background-size : contain;opacity : 0;transition: opacity 0.2s linear;}
.starRating:not(old) > label:hover:before,
.starRating:not(old) > label:hover ~ label:before,
.starRating:not(:hover) > :checked ~ label:before{opacity: 1;}
.ratings-pro span{font-size:13px;color:#fff;}
.rating-bc,.topmodule .detail-rating{display:inline-block;vertical-align:top;margin:-3px 0 0;}

  .head{color:#fff;height:77px;display:flex;}
.hleft div a{color:#eee;font-size:15px;margin:0 15px;}
.hleft{width:65%;}
.tongdai{font-size:15px;}
.tongdai:before {content: "\f095";border: 1px solid #fff;}
.tongdai:before {font: 12px/16px FontAwesome;border-radius: 50%;height:15px;width:15px;display:inline-block;text-align: center;border-radius: 50%;}
.tongdai label{font-weight:normal;margin-left:10px;color:#ddd;font-size:13px;}
.hright{width:30%;align-items:center;}
.tim {width:70%;position:relative;}
.tim input {border-radius:15px;width: 100%;height:26px;border: 1px solid #ccc;text-indent: 5px;padding-right:105px;font-size:12px;}
.tim button {color: #666;height: 26px;border: none;width: 100px;background:transparent;max-width: 15%;position:absolute;top:0;right:0;}
.tim button i:before {content: "\f002";font: 17px/1 FontAwesome}
.cart{color:#fff;margin-left:15px;}
.cart:before {content: "\f07a";font: 17px/1 FontAwesome}
.nav{background:#e7e7e7;}
.nav{overflow:hidden;position:relative;height:100%;}
.nav a{float:left;text-align:center;padding:0 3px;}
.nav img{height:110px;}
.nav span{display:block;text-transform:uppercase;font-size:12px;color:#333;height:30px;}