#menuWrapper {
    /* left: 0; */
}

#menuWrapper, #menuWrapperS1 {
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 15;
}

#menuWrapper.inactive {
    display: none;
}

#innerWrapper {
    position: relative;
    /*     min-width: 768px; */
    max-width: 1920px;
    left: 0;
    height: 60px;
}

#menuWrapper > #innerWrapper {
    /* right: 0; */
    /* margin: 0 auto; */
    /* left: 50%; */
    /* transform: translateX(-50%); */
    /* -webkit-transform: translateX(-50%); */
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

#menuWrapper-sticky-wrapper.is-sticky #menuWrapper > #innerWrapper {
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

#topMenu {
    position: relative;
    height: 40px;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style-type: none;
    z-index: 2;
}

.topMenu {
    position: relative;
    z-index: 2;
    height: 60px;
}

#topMenu li {
    cursor: pointer;
}

li#mLeft {
    /* width: 14px; */
    /* height: 14px; */
    /* background-image: url(../images/TSM_Home-05.png); */
    position: absolute;
    top: 13px;
    /* width: 100%; */
    background-repeat: no-repeat;
}

a#btnNav {
    background-image: url(../../zh-hk/images/TSM_menu_btn.png);
    position: absolute;
    width: 14px;
    height: 14px;
    left: 70px;
    animation: bubble 4s infinite;
    -webkit-animation-name: bubble;
    -webkit-animation-duration: 4s;
    -webkit-animation-fill-mode: infinite;
}

li#mLeft:hover a#btnNav, .left_header:hover #btnNav2 {
    background-image: url(../../zh-hk/images/TSM_menu_btn.png);
    /* -webkit-animation: spin 0.2s forwards linear; */
    /*      -moz-animation: spin 0.7s forwards linear;
    -o-animation: spin 0.7s forwards linear;
    -ms-animation: spin 0.7s forwards linear; */
    width: 156px;
    height: 31px;
    /*     position: absolute; */
    background-repeat: no-repeat;
    padding-bottom: 23px;
    /* transform-origin: 11px 11px; */
    background-position: 65px 0px;
}

#menuLogo {
    background-image: url(../images/tsm_small_logo.png);
    width: 78px;
    height: 48px;
    left: 0;
    right: 0;
    margin: 0 auto;
    position: absolute;
    transition: 0.3s all;
    top: 5px;
}


#menuWrapper.menuLogo_small #menuLogo {
    background-image: url(../images/tsm_small_logo.png);
    width: 78px;
    height: 48px;
    /* left: 0; */
    /* right: 0; */
    top: 5px;
    margin: 0 auto;
    position: absolute;
    background-repeat: no-repeat;
    /* padding-top: 4px; */
    transition: 0.3s all;
}

#menuWrapper.menuLogo_small #layer {
    height: 58px;
}

#menuWrapperS1.menuLogo_small #menuLogo {
    background-image: url(../images/tsm_small_logo.png);
    width: 78px;
    height: 48px;
    /* left: 0; */
    /* right: 0; */
    top: 5px;
    margin: 0 auto;
    position: absolute;
    background-repeat: no-repeat;
    /* padding-top: 4px; */
    transition: 0.3s all;
}

#menuWrapperS1.menuLogo_small #layer {
    height: 58px;
}


@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(-90deg);
    }
    100% {
        -webkit-transform: rotate(0deg);
    }
}

@-moz-keyframes spin {
    0% {
        -moz-transform: rotate(-90deg);
    }
    100% {
        -moz-transform: rotate(0deg);
    }
}

@-o-keyframes spin {
    0% {
        -o-transform: rotate(-90deg);
    }
    100% {
        -o-transform: rotate(0deg);
    }
}

@-ms-keyframes spin {
    0% {
        -ms-transform: rotate(-90deg);
    }
    100% {
        -ms-transform: rotate(0deg);
    }
}

li#mLeft:hover ul#subMenu {
    display: block;
}

li#mFontL {
    background-image: url(../images/font_size.png);
    position: absolute;
    right: 1%;
    background-size: 100%;
    width: 33px;
    height: 15px;
}

li#langIcon {
    position: absolute;
    right: 60px;
    top: 15px;
    width: 21px;
    height: 27px;
}

ul#topMenu > li {
    list-style-type: none;
}

body.zh-hk li#langIcon, li#langIcon {
    background-image: url(../images/lang_tc.png);
    background-repeat: no-repeat;
}

body.zh-cn li#langIcon {
    background-image: url(../images/lang_sc.png);
    background-repeat: no-repeat;
}

body.en li#langIcon {
    background-image: url(../images/lang_en.png);
    background-repeat: no-repeat;
}

li#langIcon > ul, li#fontIcon > ul, li#mLeft > ul {
    display: none;
}

li#langIcon:hover ul#selectLang, li#fontIcon:hover ul#selectFont {
    display: block;
    width: 27px;
    height: 80px;
    margin: 0;
    padding: 0;
    position: relative;
    list-style-type: none;
    top: 25px;
    background-color: #ffffff;
    margin-left: -4px;
    padding-top: 6px;
}

ul#selectLang > li {
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-top: 10px;
    background-repeat: no-repeat;
    display: inline-block;
}

ul#selectLang, ul#selectFont {
    list-style-type: none;
    margin-top: 0;
    padding: 0;
    margin-bottom: 0;
}

ul#selectFont {
    margin-top: 28px;
}

ul#selectFont > li {
    width: 19px;
    height: 16px;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-bottom: 10px;
    position: relative;
    background-repeat: no-repeat;
}

#fontIcon {
    right: 25px;
    position: absolute;
    top: 14px;
    width: 21px;
    height: 27px;
    background-repeat: no-repeat;
}

body.fontsize_small .font_btn {
    background-image: url(../images/text_size_S.png);
}

body.fontsize_normal .font_btn {
    background-image: url(../images/text_size_M.png);
}

body.fontsize_large .font_btn {
    background-image: url(../images/text_size_L.png);
}

li#mFontS {
    background-image: url(../images/text_size_S.png);
}

li#mFontM {
    background-image: url(../images/text_size_M.png);
}

li#mFontL {
    background-image: url(../images/text_size_L.png);
}

li#mFontS:hover {
    background-image: url(../images/text_size_S_hover.png);
}

li#mFontM:hover {
    background-image: url(../images/text_size_M_hover.png);
}

li#mFontL:hover {
    background-image: url(../images/text_size_L_hover.png);
}

li#mZHCN {
    background-image: url(../images/lang_sc.png);
    width: 19px;
    height: 15px;
    background-size: 100%;
    position: relative;
    right: 4%;
}

body.zh-cn li#mZHCN, li#mZHCN:hover {
    background-image: url(../images/lang_sc_hover.png);
}

li#mZHHK {
    background-image: url(../images/lang_tc.png);
    width: 19px;
    height: 15px;
    background-size: 100%;
    position: relative;
    right: 6%;
}

body.zh-hk li#mZHHK, li#mZHHK:hover {
    background-image: url(../images/lang_tc_hover.png);
}

li#mEN {
    background-image: url(../images/lang_en.png);
    width: 19px;
    height: 15px;
    background-size: 100%;
    position: relative;
    right: 8%;
    /* top: 30%; */
}

body.en li#mEN, li#mEN:hover {
    background-image: url(../images/lang_en_hover.png);
}

li#mFB {
    background-image: url(../images/ico_fb.png);
    width: 14px;
    height: 14px;
    background-size: 100%;
    position: absolute;
    right: 100px;
    top: 15px;
}

li#mFB:hover {
    background-image: url(../images/ico_fb_hover.png);
}

ul#subMenu {
    margin: 0;
    padding: 0;
    width: 140px;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    -moz-writing-mode: vertical-rl;
    -ms-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    font-size: 17px;
    /* margin-left: 22px; */
    padding-top: 43px;
}

ul#subMenu > li {
    list-style-type: none;
    margin: 0;
    glyph-orientation-vertical: 0;
    letter-spacing: 8px;
    text-indent: -9999px;
    width: 24px;
    height: 112px;
}


/*-----------------------ERIC------------------*/
/* .b{ */
.popupItem {
    display: inline-block;
    width: 194px;
    height: 300px;
    /* margin-left:20px; */
    background-repeat: no-repeat;
    cursor: pointer;
    float: left;
    transition: all 0.5s ease 0s;
}

.popupItem:lang(en) {
    display: inline-block;
    width: 194px;
    height: 220px;
    /* margin-left:20px; */
    background-repeat: no-repeat;
    cursor: pointer;
    float: left;
    transition: all 0.5s ease 0s;
}

.third_layer {
    display: none;
}

.third_layer.active {
    display: block;
    width: 100%;
}

/* .popupItem:hover{
	background-image: url("http://develop.dashserver.net/tsm/common/zh-hk/images/TSM_Home_menu-02.png");
}

 */
.mask {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: .6;
}

#btnNav2 {
    background-image: url(../../zh-hk/images/TSM_menu_btn_hover.png);
    position: absolute;
    width: 186px;
    height: 41px;
    left: 0px;
    background-position: 65px 0px;
    /* padding-left: 40px; */
    /* animation: bubble 4s infinite; */
    /*  -webkit-animation-name: bubble;
    -webkit-animation-duration: 4s;
    -webkit-animation-fill-mode: infinite; */
    background-repeat: no-repeat;
    transition: all 0.5s ease 0s;
    z-index: 123;
}

@-webkit-keyframes bubble {
    0% {
        -webkit-transform: scale(1);
        opacity: 0.8;
    }
    50% {
        -webkit-transform: scale(1.2);
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(1);
        opacity: 0.8;
    }
}

@keyframes bubble {
    0% {
        transform: scale(1);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.2);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 0.8;
    }
}

#btnNav2.active {
    background-image: url(http://develop.dashserver.net/tsm/common/images/TSM_Home-06.png);
    /*     -webkit-animation: spin 0.2s forwards linear;
        -moz-animation: spin 0.7s forwards linear;
        -o-animation: spin 0.7s forwards linear;
        -ms-animation: spin 0.7s forwards linear; */
    width: 14px;
    height: 14px;
    /*     position: absolute; */

}

.a_mask {
    opacity: 0.4;
    z-index: 1;
    width: 100%;
    height: 300px;
    background: black;
    position: absolute;
}

/* .b_wrapper{ */
.popupwrapper {
    z-index: 11;
    position: relative;
    float: left;
    transition: all 0.5s ease 0s;
}


li#mLeft {
    width: 100%;
    /* height: 14px; */
    /* background-image: url(../images/TSM_Home-05.png); */
    position: absolute;
    top: 13px;
    /* width: 100%; */
    background-repeat: no-repeat;
}

.second_layer_item {
    width: 32px;
    height: 133px;
    background-repeat: no-repeat;
    float: left;
    /* margin-left:20px; */
    /* position: relative; */
    cursor: pointer;
    /* background-image: url("http://develop.dashserver.net/tsm/zh-hk/images/TSM_Home-16.png"); */
    transition: all 0.5s ease 0s;
    z-index: 123;
}

.second_layer_item:hover {
    /* background-image: url("http://develop.dashserver.net/tsm/zh-hk/images/TSM_Home-11.png"); */
}

.second_layer_item_wrapper {
    float: left;
    transition: all 0.5s ease 0s;
    /* padding-left: 21px; */
    z-index: 123;
    /* position: absolute; */
    width: 100%;
}

#btnNav2 .second_layer {
    display: none;
}

.second_layer.active {
    display: block;
    margin-top: 30px;
}

.left_header {
    float: left;
    /* width: 100%; */
}

body.en .left_header {
    width: 200px;
    height: 60px;
}

.right_header {
    float: right;
    position: relative;
    right: 30px;
    top: 20px;
    top: 14px;
    /* width: 200px; */
}

.right_header a {
    display: block;
    width: 25px;
    height: 24px;
}

.fb_btn, .lang_btn, .font_btn {
    float: left;
}

.fb_btn {
    background-image: url(../images/ico_fb.png);
    width: 25px;
    height: 24px;
    background-size: 100%;
    /*     position: absolute;
    right: 100px;
    top: 15px; */
    transition: all 0.8s;
}

.fb_btn:hover {
    background-image: url(../images/ico_fb_hover.png);
    cursor: pointer;
}


.ig_btn {
    background-image: url(../images/ig_icon.png);
    width: 25px;
    height: 24px;
    background-size: 22px;
    /*     position: absolute;
    right: 100px;
    top: 15px; */
    transition: all 0.8s;
    float: left;
    margin-right: 30px;
    margin-top: 4px;
    background-repeat: no-repeat;
}

/* .ig_btn:hover {
    background-image: url(../images/ico_fb_hover.png);
    cursor: pointer;
} */

ul#selectLang > li {
    padding-top: 0px;
    /* padding-bottom:10px; */
}

.fb_btn {
    margin-right: 15px;
    margin-top: 3px;
}

.lang_btn {
    margin-right: 20px;
    /* position: absolute; */
    right: 60px;
    /* top: 15px; */
    width: auto;
    /* height: 27px; */
    cursor: pointer;
    /* background-position: 0px 7px; */
    padding-top: 6px;
}

#btnNav2 {
    position: relative;
    top: 18px;
    cursor: pointer;
}


#btnNav2:lang(en) {
    top: 18px;
}

#menuLogo:lang(en) {
    top: 5px;
}

.right_header:lang(en) {
    float: right;
    position: absolute;
    right: 30px;
    top: 14px;
}

body.zh-hk .lang_btn, .lang_btn {
    /* background-image: url(../images/lang_tc.png); */
    background-repeat: no-repeat;
    /* background-position: 0px 5px; */
    /* margin-bottom: 0px; */
}

body.zh-cn .lang_btn {
    /* background-image: url(../images/lang_sc.png);*/
    background-repeat: no-repeat;
}

body.en .lang_btn {
    /*  background-image: url(../images/lang_en.png);*/
    background-repeat: no-repeat;
}


body.zh-cn li#mLeft:hover a#btnNav, body.zh-cn .left_header:hover #btnNav2 {

    background-image: url(../../zh-cn/images/TSM_menu_btn.png);
}

body.zh-cn #btnNav2 {
    background-image: url(../../zh-cn/images/TSM_menu_btn_hover.png);
}

#selectLang {
    /* display:none; */
}

.lang_btn:hover #selectLang {
    display: inline-block;
    /* background-color: #FFFFFF; */
}

#selectFont {
    display: none;
    margin-top: 20px;
}

.font_btn:hover #selectFont {
    display: block;
    background-color: rgba(255, 255, 255, 0.9);
}

.font_btn {
    /* 	right: 25px;
        position: absolute;
        top: 14px; */
    width: 21px;
    height: 27px;
    background-repeat: no-repeat;
    cursor: pointer;
    background-position: 0px 5px;
    padding-bottom: 15px;
}

/*body.normal .font_btn, .font_btn {
    background-image: url(../images/text_size_M.png);
}*/

.left_header .s1.active {
    background-image: url(../images/TSM_Home-07.png);
}

.left_header .s2.active {
    background-image: url(../images/TSM_Home-08.png);
}

.left_header .s3.active {
    background-image: url(../images/TSM_Home-09.png);
}

.left_header .s4.active {
    background-image: url(../images/TSM_Home-10.png);
}

.left_header .s5.active {
    background-image: url(../images/TSM_Home-11.png);
}

#btnNav2:hover .second_layer:hover .third_layer {
    display: block;
    width: 100%;
}


.second_layer {
    display: none;
    padding-top: 20px;
}

.left_header:hover .second_layer {
    display: block;
    /* margin-left: 21px; */
    transition: all 0.5s ease 0s;
    z-index: 123;
}


li#mLeft:hover a#btnNav, .left_header:hover #btnNav2:lang(en) {
    background-image: url(../../en/images/TSM_menu_btn.png);
    /* -webkit-animation: spin 0.2s forwards linear; */
    width: 156px;
    height: 35px;
    /* position: absolute; */
    background-repeat: no-repeat;
    padding-bottom: 23px;
    /* transform-origin: 11px 11px; */
    background-position: 65px 1px;
}

#btnNav2:lang(en) {
    background-image: url(../../en/images/TSM_menu_btn_hover.png);
    position: absolute;
    width: 186px;
    height: 41px;
    left: 0px;
    background-position: 65px 1px;
    /* padding-left: 40px; */
    /* animation: bubble 4s infinite; */
    background-repeat: no-repeat;
    transition: all 0.5s ease 0s;
    z-index: 123;
}

.left_header:hover .second_layer:lang(en) {
    background: #EFEBE0;
    top: 4px;
    position: absolute;
    width: 100%;
    top: 58px;
    opacity: 1;
}

.second_layer:lang(en) {
    padding-top: 0px;
    padding-bottom: 0px;
    opacity: 0;
    display: block;
    height: 60px;
}


.menuLogo_small .right_header {
    top: 14px;
}

.menuLogo_small #btnNav2 {
    top: 18px;
}

.second_layer_item:hover .third_layer {
    display: block;
    width: 100%;
    position: absolute;
    top: 207px;
    left: 0px;
    z-index: 1111111;
    transition: all 0.5s ease 0s;
}

#layer {
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0.9;
    height: 60px;
    position: absolute;
    z-index: 1;
}

@media screen and (max-width: 780px) {
    .popupItem {
        width: 185px;
        /* 		background-size: 100%;
                height: 287px; */
    }

    .s1.second_layer_item .p1 {
        background-image: url("../zh-hk/images/TSM_Home_menu-10.png");
    }

    .s1.second_layer_item .p2 {
        background-image: url("../zh-hk/images/TSM_Home_menu-12.png");
    }

    .s1.second_layer_item .p3 {
        background-image: url("../zh-hk/images/TSM_Home_menu-14.png");
    }

    .s1.second_layer_item .p4 {
        background-image: url("../zh-hk/images/TSM_Home_menu-16.png");
    }

    .s2.second_layer_item .p1 {
        background-image: url("../zh-hk/images/TSM_Home_menu-02.png");
    }

    .s2.second_layer_item .p2 {
        background-image: url("../zh-hk/images/TSM_Home_menu-04.png");
    }

    .s2.second_layer_item .p3 {
        background-image: url("../zh-hk/images/TSM_Home_menu-06.png");
    }

    .s2.second_layer_item .p4 {
        background-image: url("../zh-hk/images/TSM_Home_menu-08.png");
    }


    .s3.second_layer_item .p1 {
        background-image: url("../zh-hk/images/TSM_Home_menu-18.png");
    }

    .s3.second_layer_item .p2 {
        background-image: url("../zh-hk/images/TSM_Home_menu-20.png");
    }

    .s3.second_layer_item .p3 {
        background-image: url("../zh-hk/images/TSM_Home_menu-22.png");
    }

    .s4.second_layer_item .p1 {
        background-image: url("../zh-hk/images/TSM_Home_menu-24.png");
    }

    .s4.second_layer_item .p2 {
        background-image: url("../zh-hk/images/TSM_Home_menu-26.png");
    }

    .s4.second_layer_item .p3 {
        background-image: url("../zh-hk/images/TSM_Home_menu-28.png");
    }

    .s4.second_layer_item .p4 {
        background-image: url("../zh-hk/images/TSM_Home_menu-30.png");
    }

    .s4.second_layer_item .p5 {
        background-image: url("../zh-hk/images/TSM_Home_menu-38.png");
    }

    .s4.second_layer_item .p6 {
        background-image: url("../zh-hk/images/TSM_Home_menu-40.png");
    }

    .s4.second_layer_item .p7 {
        background-image: url("../zh-hk/images/TSM_Home_menu-42.png");
    }

    .s5.second_layer_item .p1 {
        background-image: url("../zh-hk/images/TSM_Home_menu-32.png");
    }

    .s5.second_layer_item .p2 {
        background-image: url("../zh-hk/images/TSM_Home_menu-mobile_34.png");
    }

    .s5.second_layer_item .p3 {
        background-image: url("../zh-hk/images/TSM_Home_menu-mobile_36.png");
    }
}

@media screen and (max-width: 767px) {
    #innerWrapper {
        display: none;
    }

    body.menuOpen {
        left: 280px;
        /* 		position: relative;
        -moz-transition: left 0.3s ease;
        -o-transition: left 0.3s ease;
        -webkit-transition: left 0.3s ease;
        transition: left 0.3s ease;
        overflow: hidden; */
    }

    body {
        -moz-transition: left 0.3s ease;
        -o-transition: left 0.3s ease;
        -webkit-transition: left 0.3s ease;
        transition: left 0.3s ease;
        position: relative;
        left: 0;
    }

    body.zh-hk #mZHHK, body.en #mEN, body.zh-cn #mZHCN {
        display: none;
    }

    #mainWrapper.menuOpen {
        overflow: hidden;
    }

    #mmenuWrapper {
        background-color: #FFFFFF;
        width: 100%;
        height: 50px;
        position: fixed;
    }

    #mmenuWrapper {
        position: fixed;
        z-index: 15;
        top: 0;
        left: 0;
    }

    #mainWrapper.menuOpen #mmenuWrapper {
        position: fixed;
        left: 280px;
    }

    ul#selectLang {
        margin: 0;
        padding: 0;
        list-style-type: none;
        margin-top: 40px;
        padding: 0;
        padding-top: 10px;
    }

    #mNav {
        width: 40px;
        height: 21px;
        display: inline-block;
        position: absolute;
        left: 5px;
        top: 14px;
    }

    #mNav:hover {
        cursor: pointer;
    }

    #mNav > span {
        width: 30px;
        height: 2px;
        display: block;
        background: #986A50;
        position: absolute;
        left: 0;
        top: 10px;
        margin-bottom: 10px;
        transition: all 0.3s;
        transform: rotate(0deg);
    }

    li#mZHCN {
        background-image: url(../images/lang_sc.png);
        width: 19px;
        height: 15px;
        background-size: 100%;
        position: relative;
        right: 4%;
    }

    li#mZHCN:hover {
        background-image: url(../images/lang_sc_hover.png);
    }

    li#mZHHK {
        background-image: url(../images/lang_tc.png);
        width: 19px;
        height: 15px;
        background-size: 100%;
        position: relative;
        right: 6%;
    }

    li#mZHHK:hover {
        background-image: url(../images/lang_tc_hover.png);
    }

    li#mEN {
        background-image: url(../images/lang_en.png);
        width: 19px;
        height: 15px;
        background-size: 100%;
        position: relative;
        right: 8%;
        /* top: 30%; */
    }

    li#mEN:hover {
        background-image: url(../images/lang_en_hover.png);
    }

    body.zh-hk #mLang, #mLang {
        background-image: url(../images/lang_tc.png);
        background-repeat: no-repeat;
        background-position: 10px 13px;
        /* margin-bottom: 0px; */
    }

    body.zh-cn #mLang {
        background-image: url(../images/lang_sc.png);
        background-repeat: no-repeat;
    }

    body.en #mLang {
        background-image: url(../images/lang_en.png);
        background-repeat: no-repeat;
    }

    #mLang {
        position: absolute;
        top: 5px;
        right: 10px;
        width: 40px;
        height: 40px;
        /* background-color: rebeccapurple; */
    }

    #mLang:hover #selectLang {
        display: block;
        background-color: #FFFFFF;
    }

    #selectLang {
        list-style-type: none;
        margin-top: 40px;
        padding: 0;
        padding-top: 10px;
    }

    #mNav > span.top {
        transform: translateY(-9px);
        -ms-transform: translateY(-9px);
        -webkit-transform: translateY(-9px);
        -moz-opacity: translateY(-9px);
    }

    #mNav.active > span.top {
        transform: rotate(-45deg) translateY(0px);
        -ms-transform: rotate(-45deg) translateY(0px);
        -webkit-transform: rotate(-45deg) translateY(0px);
        -moz-opacity: rotate(-45deg) translateY(0px);
    }

    #mNav.active > span.middle {
        background-color: #fff;
        background: rgba(255, 255, 255, 0);
    }

    #mNav > span.bottom {
        transform: translateY(9px);
        -ms-transform: translateY(9px);
        -webkit-transform: translateY(9px);
        -moz-opacity: translateY(9px);
    }

    #mNav.active > span.bottom {
        transform: rotate(45deg) translateY(0px);
        -ms-transform: rotate(45deg) translateY(0px);
        -webkit-transform: rotate(45deg) translateY(0px);
        -moz-opacity: rotate(45deg) translateY(0px);
    }

    #mLogo {
        background-image: url(../images/tsm_small_logo.png);
        width: 78px;
        height: 48px;
        margin: 0 auto;
        display: block;
    }


    #mMeunContentWrapper {
        width: 100%;
        height: auto;
        background-color: #514342;
        color: #F6F6F6;
        position: absolute;
        z-index: 15;
        -moz-box-shadow: inset -7px 0 10px -7px #666;
        /* -webkit-box-shadow: inset -7px 0 10px -7px #666; */
        /* box-shadow: inset -7px 0 10px -7px #666; */
        -moz-transition: left 0.3s ease;
        -o-transition: left 0.3s ease;
        -webkit-transition: left 0.3s ease;
        transition: left 0.3s ease;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        position: fixed;
        top: 0;
        left: -280px;
        width: 280px;
        /* background: #ffffff; */
        height: 100%;
    }

    #mMeunsubWrapper > div {
        line-height: 3em;
        text-align: center;
    }

    #ms11 {
        position: relative;
    }

    .menuNewTag {
        right: 30px;
        position: absolute;
        /* top: 0; */
        background: #FFF;
        display: inline;
        line-height: 1em;
        color: #514342;
        padding: 6px;
        /* bottom: 0; */
        margin: auto 0;
        top: 50%;
        transform: translateY(-50%);
        font-size: 16px;
    }

    #mMeunsubWrapper a {
        text-decoration: none;
        color: #FFF;
    }

    #mMeunsubWrapper:hover {
        cursor: pointer;
    }

    .mlayer1 {
        border-bottom: 1px solid #7D5B4A;
    }

    #mMeunContentWrapper.active {
        display: block;
        left: 0;
    }

    #mMeunContentWrapper.inactive {
        /* display: none; */
    }

    .mpopupwrapper.inactive {
        display: none;
    }

    #inner1.mpopupwrapper, #inner2.mpopupwrapper, #inner3.mpopupwrapper, #inner4.mpopupwrapper, #inner5.mpopupwrapper, #inner6.mpopupwrapper {
        display: none;
    }

    #inner1.mpopupwrapper.active, #inner2.mpopupwrapper.active, #inner3.mpopupwrapper.active, #inner4.mpopupwrapper.active, #inner5.mpopupwrapper.active, #inner6.mpopupwrapper.active {
        display: block;
    }

    .mpopupwrapper.active > a {
        display: block;
        background-color: #615654;
        color: #F6F6F6;
        /* padding: 10px 0; */
        text-decoration: none;
        border-bottom: 1px solid #7D5B4A;
    }

    .mlayer1.ms7 > a {
        display: inline-block;
        border-bottom: none;
    }

    span.signC:after {
        content: '+';
    }

    span.signO:after {
        content: '-';
    }

    span.signC, span.signO {
        position: absolute;
        right: 30px;
    }

    #ms7Bnts {
        width: 80%;
        height: 90px;
        left: 0;
        right: 0;
        margin: 0 auto;
        border-bottom: 0;
    }

    #ms7 {
        padding: 30px 10px;
        border-bottom: 0;
    }

    #ms7 > a {
        width: 40px;
        height: 11%;
        background-size: cover;
        display: inline-block;
        /* width: 88px; */
        height: 40px;
        margin-right: 2%;
        background-size: contain;
        background-repeat: no-repeat;
    }

    a#mbtnOnlineB {
        background-image: url(../images/mmenuBtn1.png);
    }

    a#mbtnOnlineB:hover {
        background-image: url(../images/mmenuBtn1H.png);
    }

    a#mbtnMapS {
        background-image: url(../images/mmenuBtn3.png);
    }

    a#mbtnMapS:hover {
        background-image: url(../images/mmenuBtn3H.png);
    }

    #mbtnElearningS {
        background-image: url(../images/TSM-Agenda-icon_n.png);
    }

    #mbtnElearningS:hover {
        background-image: url(../images/TSM-Agenda-icon_n-hover.png);
    }

    a#mbtnCalendarS {
        background-image: url(../images/mmenuBtn4.png);
    }

    a#mbtnCalendarS:hover {
        background-image: url(../images/mmenuBtn4H.png);
    }

    a#mbtnmFB {
        background-image: url(../images/mmenuBtn2.png);
    }

    a#mbtnmFB:hover {
        background-image: url(../images/mmenuBtn2H.png);
    }

    a#mbtnmIG {
        background-image: url(../images/ig_icon.png);
    }

    #ms7Bnts > a:last-child {
        margin-right: 0;
    }

    a#mbtnOnlineB, a#mbtnMapS, a#mbtnCalendarS, a#mbtnmFB {
        display: inline-block;
    }

    #ms8, #ms9 {
        border-bottom: 1px solid #7D5B4A;
        text-align: center;
        line-height: 3em;
        background-color: #403030;
    }

    #ms8 > div, #ms9 > div {
        display: inline-block;
        margin-left: 15px;
    }

    #ms8 > div > a, #ms9 > div > a {
        text-decoration: none;
        color: #FFFFFF;
    }

    body.zh-hk #ms8 > div > a#btnmZHHK, body.en #ms8 > div > a#btnmEN, body.fontsize_normal #mmfontN, body.fontsize_small #mmfontS, body.fontsize_large #mmfontL, #ms8 .hoverbtn:hover a, #ms9 .hoverbtn:hover {
        color: #805947;
    }

    #ms9 .hoverbtn:hover {
        cursor: pointer;
    }
}