﻿/* ------- CSS Document -------- */
/* ----- Section-by-Section ----- */
/* Main Container
/* Text
/* Header Login Panel
/* Timer Bar
/* Top Navigation
/* Side Navigation
/* Main Content
/* Product & Price Content
/* Homepage Content
/* Get Started Membership
/* Footer
/* Form
/* Accordion
/* Accordion Multi Open
/* Interaction Cues
/* Trade Event Accordion
/* Product Spec
/* Get Started 
/* Inspire Zone
/* X-ccessories
/* Artwork Spec
/* Blank Template
/* Dyanamic Page
/* Tooltips
/* Sticker
/* Voucher
/* Packaging
/* Best seller */

/* --------------------- Main Container ---------------------- */
html {
    height: 100%;
    width: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
}

h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 20px;
    color: #2b333d;
    margin: 0px;
}

body {
    margin: 0px;
    padding: 0px;
    background: #ffffff;
    font-family: "Roboto",Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 0.9rem !important;
    /*font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#5d5c5c;*/
    height: 100%;
    width: 100%;
}

.clearBoth {
    clear: both;
}

.divBreakLine {
    display: none;
}

.divBreakLine2 {
    display: inline-block;
    height: 20px;
}

img {
    max-width: 100% !important;
    border: none;
}

a:link {
    /*color:#097793;*/
    text-decoration: none;
    outline: none;
    cursor: pointer;
}
/* unvisited link */
a:visited {
    color: #097793;
    text-decoration: none;
    outline: none;
    cursor: pointer;
}
/* visited link */
a:hover {
    color: #043275;
    text-decoration: none;
    outline: none;
    cursor: pointer;
}
/* mouse over link */
a:active {
    color: #097793;
    text-decoration: none;
    outline: none;
    cursor: pointer;
}
/* selected link */
a.imgBorder {
    color: #ffffff;
    text-decoration: none;
    border: none;
    outline: none;
}

a.button1 {
    display: block;
    float: left; /* Change 13px as desired */
    line-height: 39px; /* Width of left menu image */
    text-decoration: none;
    background-color: transparent;
    background-image: url(../../images/master/button1_left.png);
    background-repeat: no-repeat;
    background-position: left top;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 39px;
    font-style: normal;
    width: auto;
    padding-left: 10px;
    text-align: center;
}

a:link.button1, a:visited.button1, a:hover.button1, a:active.button1 {
    color: #ffffff; /*button text color*/
    cursor: pointer;
}

a.button1 span {
    display: block; /*Set 10px to be equal or greater than'padding-left' value above*/
    background-color: transparent;
    background-image: url(../../images/master/button1_right.jpg);
    background-repeat: no-repeat;
    background-position: right top;
    height: 39px;
    padding-right: 10px;
    margin-left: 2px;
}

a:hover.button1 { /* Hover state CSS */
    color: #fffbb4;
    background-image: url(../../images/master/button1_left.png);
    height: 39px;
}

    a:hover.button1 span {
        background-image: url(../../images/master/button1_right.jpg);
        color: #fffbb4;
        text-align: center;
    }

.borderBottom {
    border-bottom: 1px solid #2b333d;
    padding-bottom: 5px;
}

.borderTop {
    border-top: 1px solid #e5e2da;
    padding-top: 15px;
}

.borderBottom-yellow {
    border-bottom: 1px solid #efe7d2;
    padding-bottom: 10px;
}

.borderLeft-lightYellow {
    border-left: 1px solid #e3e2de;
}

.border-lightYellow {
    border: 1px solid #f4e7b3;
    padding: 10px;
}

.borderBottom-lightYellow {
    border-bottom: 1px solid #f4e7b3;
    padding-bottom: 5px;
}

.container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.container_main {
    margin-left: auto;
    margin-right: auto;
    width: 995px;
}

bgWhite {
    background: #ffffff;
}

.bgGrey {
    background-color: #e6ebee;
}

.mainBg {
    /* Main Background for Top Menu */
}

#wrap {
    min-height: 100%;
    margin-bottom: -155px;
    position: relative;
}

#wrapper {
    min-height: 100%;
    margin-left: auto;
    margin-right: auto;
    width: 995px;
}

.breadcrumb {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #2b333d;
}

    .breadcrumb a {
        text-decoration: none;
        color: #a2977a;
        cursor: pointer;
    }

        .breadcrumb a:visited, .breadcrumb a:active {
            color: #a2977a;
        }

        .breadcrumb a:hover {
            text-decoration: none;
        }

.zoomIn-container {
    background: url(../../images/master/icon_zoom-in.jpg) left no-repeat;
    padding: 5px 0px 0px 20px;
    margin-left: 30px;
}

#check-box-maroon {
    list-style-image: url(../../images/master/icon_check-box-tick-maroon.jpg);
}

@media (max-width: 1010px) {
    .container_main {
        margin-left: auto;
        margin-right: auto;
        width: 760px;
    }

    #wrapper {
        min-height: 100%;
        margin-left: auto;
        margin-right: auto;
        width: 760px;
        /*background: url(../../images/master/background_side_menu.jpg) top left repeat-y;*/
    }
}

@media (max-width: 767px) {
    .divBreakLine {
        display: inline-block;
        height: 10px;
    }

    .container_main {
        width: 680px;
    }

    #wrapper {
        width: 680px;
    }

    .breadcrumb {
        display: none;
    }

    .divBreakLine2 {
        display: none;
    }
}

@media (max-width: 680px) {
    .container_main {
        width: 540px;
    }

    #wrapper {
        width: 540px;
    }
}

@media (max-width: 569px) {
    .container_main {
        width: 410px;
    }

    #wrapper {
        width: 410px;
    }

    body {
        font-size: 12px;
    }
}

@media (max-width: 459px) {
    .container_main {
        width: 350px;
    }

    #wrapper {
        width: 350px;
    }
}

@media (max-width: 349px) {
    .container_main {
        width: 320px;
    }

    #wrapper {
        width: 320px;
    }
}

/*----------------------------Text-------------------------------------------*/
.text-HL {
    background: #fffc00;
    color: #5d6166;
}

.text-grey-15-bold {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    color: #5d6166;
    font-weight: bold;
}

.text-grey-18 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #5d6166;
}

.text-grey-13 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #5d6166;
}

.text-blue-15-bold {
    font-size: 15px;
    text-decoration: none;
    color: #005a85;
    font-weight: bold;
}

.text-darkGreen-18-bold {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #1b4040;
    font-weight: bold;
}

.text-darkGrey-18-bold {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #2b333d;
    font-weight: bold;
}

.text-lightMaroon-15-bold {
    font-size: 15px;
    text-decoration: none;
    color: #9b6666;
    font-weight: bold;
}

.text-lightMaroon-12 {
    font-size: 12px;
    text-decoration: none;
    color: #9b6666;
}

.text-blue-11 {
    font-size: 11px;
    text-decoration: none;
    color: #39a7c0;
}

.text-lightGrey-11 {
    font-size: 11px;
    text-decoration: none;
    color: #acafb4;
}

.text-Grey-11 {
    font-size: 11px;
    text-decoration: none;
    color: #707070;
}

.text-white-11 {
    font-size: 11px;
    text-decoration: none;
    color: #ffffff;
}

    .text-white-11 a:link {
        color: #ffffff;
        text-decoration: none;
    }

    .text-white-11 a:visited {
        color: #ffffff;
        text-decoration: none;
    }

    .text-white-11 a:hover {
        color: #c4fdfe;
        text-decoration: none;
    }

.text-white-12 {
    font-size: 12px;
    text-decoration: none;
    color: #ffffff;
}

    .text-white-12 a:link {
        color: #ffffff;
        text-decoration: none;
    }

    .text-white-12 a:visited {
        color: #ffffff;
        text-decoration: none;
    }

    .text-white-12 a:hover {
        color: #c4fdfe;
        text-decoration: none;
    }

.text-white-16 {
    font-size: 16px;
    text-decoration: none;
    color: #ffffff;
}

.text-dark-grey-12 {
    font-size: 12px;
    text-decoration: none;
    color: #0c0c0c;
}

    .text-dark-grey-12 a:link {
        color: #0c0c0c;
        text-decoration: none;
    }

    .text-dark-grey-12 a:visited {
        color: #0c0c0c;
        text-decoration: none;
    }

    .text-dark-grey-12 a:hover {
        color: #0b79be;
        text-decoration: none;
    }

.text-dark-grey-11 {
    font-size: 11px;
    text-decoration: none;
    color: #0c0c0c;
}

    .text-dark-grey-11 a:link {
        color: #0c0c0c;
        text-decoration: none;
    }

    .text-dark-grey-11 a:visited {
        color: #0c0c0c;
        text-decoration: none;
    }

    .text-dark-grey-11 a:hover {
        color: #0b79be;
        text-decoration: none;
    }

.text-white-13 {
    font-size: 13px;
    text-decoration: none;
    color: #ffffff;
}

.text-white-18 {
    font-size: 18px;
    text-decoration: none;
    color: #ffffff;
}

.text-grey-12 {
    font-size: 12px;
    text-decoration: none;
    color: #5d6166;
}

.text-lightMaroon-12-bold {
    font-size: 12px;
    text-decoration: none;
    color: #9b6666;
    font-weight: bold;
}

.text-red-12-bold {
    font-size: 12px;
    text-decoration: none;
    color: #df2026;
    font-weight: bold;
}

.text-red-12 {
    font-size: 12px;
    text-decoration: none;
    color: #df2026;
}

.text-yellow-14 {
    font-size: 14px;
    text-decoration: none;
    color: #fff8bc;
}

.text-blue-12-bold {
    font-size: 12px;
    text-decoration: none;
    color: #005a85;
    font-weight: bold;
}

.text-lightBlue-12-bold {
    font-size: 12px;
    text-decoration: none;
    color: #009fdc;
    font-weight: bold;
}

.text-grey-12-bold {
    font-size: 12px;
    text-decoration: none;
    color: #5d5c5c;
    font-weight: bold;
}

.text-darkBlue-12-bold {
    font-size: 12px;
    text-decoration: none;
    color: #2b333d;
    font-weight: bold;
}

.text-price-cut {
    text-align: left;
    font-weight: normal;
    text-decoration: line-through;
}

.text-turquoise-20-bold {
    font-size: 20px;
    text-decoration: none;
    color: #108ba1;
    font-weight: bold;
}

.text-grey-10 {
    font-size: 10px;
    text-decoration: none;
    color: #707070;
}

.text-grey-11 {
    font-size: 11px;
    text-decoration: none;
    color: #707070;
}

.text-green-13 {
    font-size: 13px;
    text-decoration: none;
    color: #30ff00;
}

    .text-green-13 a:link {
        color: #60e740;
        text-decoration: underline;
    }

    .text-green-13 a:visited {
        color: #30ff00;
        text-decoration: underline;
    }

    .text-green-13 a:hover {
        color: #60e740;
        text-decoration: underline;
    }

.text-signIn-11 {
    font-size: 11px;
    color: #39a7c0;
    text-decoration: underline;
}

    .text-signIn-11 a:link {
        color: #39a7c0;
        text-decoration: underline;
    }

    .text-signIn-11 a:visited {
        color: #39a7c0;
        text-decoration: underline;
    }

    .text-signIn-11 a:hover {
        color: #6b7374;
        text-decoration: underline;
    }

.text-signIn-white-11 {
    font-size: 11px;
    text-decoration: underline;
    color: #ECF5F7;
}

    .text-signIn-white-11 a:link {
        color: #ECF5F7;
        text-decoration: underline;
    }

    .text-signIn-white-11 a:visited {
        color: #ECF5F7;
        text-decoration: underline;
    }

    .text-signIn-white-11 a:hover {
        color: #ECF5F7;
        text-decoration: underline;
    }

@media (max-width: 459px) {
    .text-signIn-11 {
        width: 70px;
    }
}

@media (max-width: 349px) {
    .text-signIn-11 {
        width: 65px;
    }

    .text-dark-grey-11 {
        width: 80px;
    }
}


/*----------------------- Header Logo -------------------------- */
.row_main {
    height: 150px;
}

.logo {
    display: inline-block;
    padding-top: 30px;
}

@media (max-width: 680px) {
    .row_main {
        height: 100px;
    }

    .logo {
        padding-top: 0px;
    }
}

@media (max-width: 349px) {
    .row_main {
        /*text-align: center;*/
    }
}

/*----------------------------Header Login Panel-------------------------------------------*/
.panel-heading {
    background-color: #0095B5;
    color: #ffffff;
    height: 100%;
    padding: 2px !important;
}

.panel-body {
    background-color: #ECF5F7;
    height: 100%;
    padding: 2px !important;
}

.div-table {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    border-spacing: 3px; /*cellspacing:poor IE support for  this*/
}

.div-table-row {
    display: table-row;
    width: auto;
    clear: both;
}

.div-table-col {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 60px;
}

.div-table-col-xs {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 30px;
}

.div-table-col-sm {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 70px;
}

.div-table-col-sm-1 {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 80px;
}

.div-table-col-sm-2 {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 70px;
}

.div-table-col-md-1 {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 100px;
}

.div-table-col-md-2 {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 120px;
}

.div-table-col-lg-1 {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 140px;
}

.div-table-col-lg-2 {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 180px;
}

.div-table-col-float {
    float: right;
}

.visitorSignIn-panel {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #6b7374;
    height: 100%;
    background-color: transparent;
}

.visitorSignUp-panelBg {
    background: url(../../images/visitor/background_sign_in_panel.jpg) top repeat-x;
    line-height: 26px;
}

.signUp-icon {
    background: url(../../images/visitor/icon_sign_up.jpg) top no-repeat;
    line-height: 24px;
    float: left;
}

.login-icon {
    background: url(../../images/visitor/icon_login.jpg) bottom no-repeat;
    line-height: 19px;
    float: left;
}

textarea:focus, input:focus {
    outline: none
}

#rnd_container {
    background: #e4ebed;
    margin: 1px;
}

.rnd_top, .rnd_bottom {
    display: block;
    background: #e4ebed;
    font-size: 1px;
}

.rnd_b1, .rnd_b2, .rnd_b3, .rnd_b4 {
    display: block;
    overflow: hidden;
}

.rnd_b1, .rnd_b2, .rnd_b3 {
    height: 0px;
}

.rnd_b2, .rnd_b3, .rnd_b4 {
    background: #FFFFFF;
    border-left: 1px solid #ecf5f7;
    border-right: 1px solid #ecf5f7;
}

.rnd_b1 {
    margin: 0 5px;
    background: #ecf5f7;
}

.rnd_b2 {
    margin: 0 3px;
    border-width: 0 2px;
}

.rnd_b3 {
    margin: 0 2px;
}

.rnd_b4 {
    height: 1px;
    margin: 0 1px;
}

.rnd_content {
    display: block;
    border: 0 solid #ECF5F7;
    border-width: 0 1px;
    padding: 0px;
    background: #FFFFFF;
    color: #5d5c5c;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}

.member-panelBg {
    background: url(../../images/visitor/background_sign_in_panel.jpg) bottom repeat-x;
    color: #ffffff;
    height: 100%;
    font-size: 11px;
}

.member-talkBubble {
    background: url(../../images/member/background_pink_bubble.jpg) bottom left no-repeat;
    height: 100%;
    width: 22px;
    color: #ffffff;
    font-size: 11px;
    padding-left: 5px;
}

.member-talkBubble-no {
    height: 100%;
    width: 22px;
    color: #ffffff;
    font-size: 11px;
    padding-left: 5px;
}

.member-row {
    display: inline-block;
}

.member-icon {
    background: url(../../images/member/icon_member.jpg) bottom no-repeat;
    height: 100%;
    display: inline-block;
}

.member-shoppingCart-icon {
    background: url(../../images/member/icon_shopping_cart.jpg) bottom no-repeat;
    height: 100%;
    display: inline-block;
}

.member-logout-icon {
    background: url(../../images/member/icon_logout.jpg) bottom no-repeat;
    height: 100%;
    display: inline-block;
}

.openLoginPanel {
    visibility: hidden;
}

#master_login_table_id {
    height: 100%;
    width: 460px; /* 430px */
    display: inline-block;
    background-color: #fff;
    float: right;
}

@media (max-width: 767px) {
}

@media (max-width: 680px) {
    #master_login_div_id {
        width: 0;
        position: fixed;
        float: right;
        z-index: 1;
        top: 0;
        right: 0;
        background-color: #fff;
        /*transition: 0.4s;*/
    }

    #master_login_table_id {
        width: 0;
        position: fixed;
        z-index: 2;
        top: 0;
        right: 0;
        background-color: transparent;
        /*transition: 0.4s;*/
    }

        #master_login_table_id.active {
            width: 100%;
            height: 150px;
            position: fixed;
            z-index: 2;
            top: 0;
            right: 0;
            background-color: transparent;
            /*transition: 0.4s;*/
        }

    .openLoginPanel {
        display: table-cell;
        visibility: visible;
        vertical-align: middle;
        text-align: center;
        font-weight: bold;
        font-size: 14px;
        color: rgb(51, 122, 183);
    }

    #pnlTop__login_status_pnlLogOn {
        box-shadow: 0px 8px 5px 2px rgba(0, 0, 0, 0.3);
        -moz-box-shadow: 0px 8px 5px 2px rgba(0, 0, 0, 0.3);
        -webkit-box-shadow: 0px 8px 5px 2px rgba(0, 0, 0, 0.3);
    }

    #pnlTop__login_status_pnlLogOff {
        box-shadow: 0px 8px 5px 2px rgba(0, 0, 0, 0.3);
        -moz-box-shadow: 0px 8px 5px 2px rgba(0, 0, 0, 0.3);
        -webkit-box-shadow: 0px 8px 5px 2px rgba(0, 0, 0, 0.3);
    }
}

@media (max-width: 569px) {
}

@media (max-width: 459px) {
    .div-table-col-sm {
        width: 50px !important;
    }

    .div-table-col-sm-1 {
        width: 80px !important;
    }

    .div-table-col-sm-2 {
        width: 70px !important;
    }

    .div-table-col-md-2 {
        width: 90px !important;
    }

    .div-table-col-md-1 {
        width: 70px;
    }

    .div-table-col-lg-2 {
        float: left; /*fix for  buggy browsers*/
        display: table-column;
        width: 140px;
    }

    .openLoginPanel {
        text-align: center;
    }
}

@media (max-width: 349px) {
    /*.container_main_table tr:nth-child(1) td:nth-child(1) { height: 100px; }*/
    .div-table-col-md-2 {
        width: 80px !important;
    }

    .div-table-col-md-1 {
        width: 65px;
    }
}

/*------------------- Line ------------------------ */
.thinLine {
    width: 100%;
    margin-bottom: 2px;
    border-bottom: 1px solid #015778;
}

/*----------------------------Timer Bar-------------------------------------------*/
.extTimerBar {
    height: 20px;
    background-color: #045877;
}

.timerBar {
    width: 995px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #ffffff;
    margin: 0 auto;
}

@media (max-width: 1010px) {
    .timerBar {
        width: 760px;
    }
}

@media (max-width: 767px) {
    .timerBar, .timerBar td {
        font-size: 9.5px;
    }

    .timerBar {
        width: 680px;
    }
}

@media (max-width: 680px) {
    .timerBar, .timerBar td {
        font-size: 8px;
    }

    .timerBar {
        width: 540px;
    }
}

@media (max-width: 569px) {
    .timerBar table {
        display: none;
    }
}
/*----------------------------Top Navigation-------------------------------------------*/

.topNavi {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

    .topNavi ul {
        list-style-type: none;
        padding: 0;
        margin: 0;
        z-index: 1000;
    }

    .topNavi li {
        float: left;
        position: relative;
        padding: 0px 7px 0px 7px;
        line-height: 40px;
        width: auto;
        cursor: pointer;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        font-weight: bold;
    }

        .topNavi li:hover {
            background: url(../../images/master/background_top_menu_over.jpg) repeat-x;
        }

        .topNavi li a {
            display: block;
            padding: 0px;
            color: #005a7f;
            text-decoration: none;
        }

            .topNavi li a:hover {
                color: #005a7f;
            }

        .topNavi li ul {
            display: none;
        }

        .topNavi li:hover ul {
            color: #7d7d7d;
            background: #f5f5f5;
        }

        .topNavi li ul li {
            float: none;
            background: none;
            font-family: Arial, Helvetica, sans-serif;
            font-size: 12px;
            font-weight: normal;
            line-height: 24px;
        }

        .topNavi li:hover ul li {
            background: #f5f5f5;
        }

        .topNavi li ul li a {
            color: #7d7d7d;
            background: none;
        }

            .topNavi li ul li a:hover {
                color: #0094b2;
                background: #f5f5f5;
            }

        .topNavi li a:hover, .topNavi li:hover ul li, .menuhover {
            color: #005a7f;
        }

.endmenu {
    clear: left;
}

.extMenuZone {
    background: linear-gradient(#ffffff, #CAE9FA); /* For IE10 or above */
    background: -webkit-linear-gradient(#ffffff, #CAE9FA); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#ffffff, #CAE9FA); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#ffffff, #CAE9FA); /* For Firefox 3.6 to 15 */
    filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#ffffff", endColorStr="#CAE9FA"); /* For IE9 or below */
}

.menuZone {
    width: 995px;
    margin: 0 auto;
}

.topNaviOpenCollapse {
    display: none;
}

.OpenCollapseDiv {
    display: none;
}

@media (max-width: 1010px) {
    .menuZone {
        width: 760px;
    }

        .menuZone ul li ul li ul.level3.dynamic {
            position: static !important;
            list-style: circle !important;
            padding: 0px 0px 0px 15px !important;
        }

            .menuZone ul li ul li ul.level3.dynamic li {
                padding: 0 !important;
            }

        .menuZone ul li ul li ul.level4.dynamic {
            position: static !important;
        }

            .menuZone ul li ul li ul.level4.dynamic li {
                padding: 0 !important;
            }
}

@media (max-width: 767px) {
    .menuZone {
        width: 680px;
    }

    #pnlTop__menu_top_menuTop {
        width: 680px;
    }

    ul.level1.topNavi.static li {
        display: none;
    }

        ul.level1.topNavi.static li a {
            display: none;
            z-index: 1000 !important;
        }

        ul.level1.topNavi.static li.icon {
            float: right;
            display: inline-block;
        }

    ul.level1.topNavi.static {
    }

        ul.level1.topNavi.static.responsive {
        }

            ul.level1.topNavi.static.responsive li.icon {
                position: absolute;
                right: 0;
                top: 0;
            }

            ul.level1.topNavi.static.responsive li {
                display: inline-block;
                position: static;
                float: none;
                width: 665px;
            }

                ul.level1.topNavi.static.responsive li a {
                    display: inline-block;
                    position: static;
                    text-align: left;
                    z-index: 1000 !important;
                }

    .OpenCollapseDiv {
        display: table;
        width: 100%;
        height: 50px;
    }

    .topNaviOpenCollapse {
        display: table-cell;
        text-align: left;
        vertical-align: middle;
        font-size: x-large;
        color: #005A7F;
        background: rgba(0, 0, 0, 0);
    }

    /* Show and Hide */
    /*li.dynamic {
        display: none !important;height: auto !important;
        -webkit-transition: height 2s ease-in-out;
        -moz-transition:height 2s ease-in-out;
        -o-transition:height 2s ease-in-out;
        transition:height 2s ease-in-out !important;
    }
    
    li.dynamic.active {
        display: inline-block !important;height: auto !important;
        -webkit-transition: height 2s ease-in-out;
        -moz-transition:height 2s ease-in-out;
        -o-transition:height 2s ease-in-out;
        transition:height 2s ease-in-out !important;
    }*/

    /* Enable top menu to be able push down sub menu to sub menu */
    ul.level2.dynamic {
        position: static !important;
        -webkit-transition: height 2s ease-in-out;
        -moz-transition: height 2s ease-in-out;
        -o-transition: height 2s ease-in-out;
        transition: height 2s ease-in-out !important;
    }

        ul.level2.dynamic active {
            position: static !important;
            -webkit-transition: height 2s ease-in-out;
            -moz-transition: height 2s ease-in-out;
            -o-transition: height 2s ease-in-out;
            transition: height 2s ease-in-out !important;
        }
}

@media (max-width: 680px) {
    .menuZone {
        width: 540px;
    }

    #pnlTop__menu_top_menuTop {
        width: 540px;
    }

    ul.level1.topNavi.static.responsive li {
        width: 525px;
    }

    .topNaviOpenCollapse {
        text-align: center;
    }
}

@media (max-width: 569px) {
    .menuZone {
        width: 410px;
    }

    #pnlTop__menu_top_menuTop {
        width: 410px;
    }

    ul.level1.topNavi.static.responsive li {
        width: 395px;
    }
}

@media (max-width: 459px) {
    .menuZone {
        width: 350px;
    }

    #pnlTop__menu_top_menuTop {
        width: 350px;
    }

    ul.level1.topNavi.static.responsive li {
        width: 335px;
    }
}

@media (max-width: 349px) {
    .menuZone {
        width: 320px;
    }

    #pnlTop__menu_top_menuTop {
        width: 320px;
    }

    ul.level1.topNavi.static.responsive li {
        width: 300px;
    }
}

/*----------------------------Side Navigation-------------------------------------------*/
.sideMenu {
    width: 190px;
    float: left;
    margin-left: 0px;
    padding-top: 0px;
}

.sideMenu_title {
    width: 190px;
    height: 43px;
    float: left;
    margin-left: 0px;
    background: url(../../images/master/title_side_menu.jpg) left no-repeat;
}

.sideMenu_title_main {
    width: 190px;
    height: 43px;
    float: left;
    /*margin-left:0px;*/
    /*background: url(../../images/master/title_side_menu_main.jpg) left no-repeat;*/
}

.sideMenu_title_main_2 {
    width: 190px;
}

    .sideMenu_title_main_2 > .sideMenu__img {
        margin-top: 2px;
    }

.sideMenu_text {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    color: #71633e;
    font-weight: bold;
    padding: 10px 15px 5px 15px;
}

.sideMenu_text_main {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    /*color:#ffffff;*/
    color: #71633e;
    font-weight: bold;
    padding: 10px 15px 5px 15px;
}

.favourite_text {
    padding: 5px;
    margin-left: 0px;
    height: 30px;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    color: #71633e;
    font-weight: bold;
}

.dropdown {
    float: left;
    position: relative;
    padding-right: 5px;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: bold;
    text-transform: normal;
    letter-spacing: 0.2px;
    line-height: 1.5em;
    z-index: 88888;
    left: 23%;
    padding-top: 1px;
}

    .dropdown dt {
        padding: 0px;
        font-weight: bold;
    }

        .dropdown dt:hover {
            padding: 0px;
        }

    .dropdown dd {
        position: absolute;
        overflow: hidden;
        width: 180px;
        display: none;
        z-index: 9999999;
        opacity: 0;
    }

    .dropdown ul {
        width: 180px;
        list-style: none;
    }

    .dropdown li {
        display: inline;
    }

    .dropdown a, .dropdown a:active, .dropdown a:visited {
        display: block;
        padding: 5px;
        color: #000000;
        text-decoration: none;
        width: 187px;
    }

        .dropdown a:hover {
            color: #ba0005;
            /*opacity: .9;
				 For IE 5-7  */
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
            /* For IE 8 */
            -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
        }

    .dropdown .underline {
        border-bottom: 0px solid #cdd0d7;
    }

/*------------------------ Accordion Menu (Master Products Left Side Menu) CSS -------------------------*/
#accordion {
    width: 170px;
    margin: 0px auto 10px 0px;
    z-index: 90;
}

    #accordion img {
        max-width: 100%
    }

.accordion {
    width: 170px;
    font: 12px Arial;
    color: #5f012b;
    font-weight: bolder;
    line-height: 17.15px;
    border-spacing: 0px !important;
    border-bottom-width: 0px !important;
}

    .accordion dt {
        width: 170px;
        padding-left: 11px;
        padding-bottom: 0px;
        padding-top: 0px;
        padding-right: 0px;
        margin-top: 0px;
        color: #7d7d7d;
        cursor: pointer;
    }

        .accordion dt:hover {
            color: #0094b2;
            cursor: pointer;
        }

    .accordion .accordionOn {
        font-weight: bold;
        color: #7d7d7d;
    }

        .accordion .accordionOn a:link, .accordion .accordionOn a:visited, .accordion .accordionOn a:hover {
            color: #ffffff !important
        }

    .accordion dd {
        overflow: hidden;
        width: 175px;
        margin-left: 0px;
        cursor: pointer;
        z-index: 8888;
    }

        .accordion dd ul {
            cursor: pointer;
            margin-top: 0px;
            margin-bottom: 0px;
        }

    .accordion li {
        list-style-type: none;
        margin-left: -4px;
        padding: 3px 3px 3px 0px;
        font-family: Arial, Helvetica, sans-serif;
        cursor: pointer;
    }

        .accordion li a:link, .accordion li a:visited {
            list-style-type: none;
            margin-left: -4px;
            padding: 3px 3px 3px 0px;
            font-family: Arial, Helvetica, sans-serif;
        }

    .accordion a:link, .accordion a:visited {
        color: #7d7d7d;
        text-decoration: none;
    }

    .accordion a:hover {
        color: #0094b2;
        text-decoration: none;
    }

.sub li {
    border: 0px;
}

    .sub li:hover {
        background: #ffffff;
    }

    .sub li a:link, .sub li a:visited {
        color: #7d7d7d;
    }

    .sub li a:hover {
        color: #0094b2;
    }

#sidebar {
    width: 190px;
    float: left;
    position: relative;
    overflow-y: hidden;
    background-color: #f5f5f5;
}

    #sidebar .closeSidebar {
        display: none;
    }

    #sidebar .sidebar-top {
        display: none;
    }

.openSidebar {
    display: none;
}

.lnr-cross {
    display: none;
}

@media (max-width: 767px) {
    #sidebar {
        height: 100%;
        width: 0;
        position: fixed;
        z-index: 3;
        top: 0;
        left: 0;
        background-color: #fff;
        overflow-x: hidden;
        overflow-y: hidden;
        transition: 0.5s;
        box-shadow: 10px 0px 10px rgba(0,0,0,0.5);
        -moz-box-shadow: 10px 0px 10px rgba(0,0,0,0.5);
        -webkit-box-shadow: 10px 0px 10px rgba(0,0,0,0.5);
    }

        #sidebar.active {
            width: 190px;
            overflow-y: scroll;
            background-color: #f5f5f5;
        }

        #sidebar .sidebar-top {
            display: block;
            vertical-align: middle;
            text-align: center;
        }

        #sidebar .closeSidebar {
            display: inline-block;
            font-size: 30px;
        }

    #lnr-cross-id {
        display: none;
        position: fixed;
        height: 6%;
        top: 0px;
        margin-left: 0px;
        background-color: #F5F5F5;
        z-index: 1001;
    }

        #lnr-cross-id.active {
            display: inline-block;
            margin-left: 76px;
        }

    .openSidebar {
        display: table-cell;
        vertical-align: middle;
        font-size: 14px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bolder;
        letter-spacing: 0.5px;
        color: rgb(51, 122, 183);
    }
}

/*----------------------------Main Content-------------------------------------------*/
.mainContent {
    width: 755px;
    margin-top: 0px;
    margin-right: 0px;
    float: right;
    padding: 10px 0px 5px 5px;
}

.content-headerBg {
    background: url(../../images/master/background_content_main_title.jpg) no-repeat;
    height: 62px;
    width: 696px;
    float: left;
}

.content-header-subBg {
    background: url(../../images/master/background_content_main_title_sub.jpg) no-repeat;
    height: 62px;
    width: 696px;
    float: left;
}

.tab-topBg {
    background: url(../../images/master/background_tab_menu_top.jpg) top repeat-x;
    padding-top: 15px;
}

.tab-bottomBg {
    background: url(../../images/master/background_tab_menu_bottom.jpg) top repeat-x;
    padding-top: 15px;
}

.tab-seperator {
    color: #108ba1;
    text-align: left;
    padding-right: 6px;
}

#content-a {
    width: 750px;
    margin: 15px auto;
}

#tab_container {
    width: 100%!important;
    padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto
}
@media (min-width:576px) {
	#tab_container {
		max-width: 540px!important;
	}
}

@media (min-width:768px) {
	#tab_container {
		max-width: 720px!important;
	}
}

@media (min-width:992px) {
	#tab_container {
		max-width: 960px!important;
	}
}

@media (min-width:1200px) {
	#tab_container {
		max-width: 1200px!important;
	}
}


#tab_content-a {
    padding: 15px 0px 0px 15px;
}

ul.tab_header {
    margin: 0px 0px 0px 35px;
    padding: 0px;
    margin-top: 5px;
    margin-bottom: 20px;
    list-style: none;
}

    ul.tab_header li {
        display: inline;
        list-style: none;
    }

        ul.tab_header li a {
            color: #108ba1;
            text-align: left;
            padding-right: 6px;
            padding-left: 0px;
            list-style: none;
        }

            ul.tab_header li a.hover {
                list-style: none;
                color: #0000FF !important;
            }

    ul.tab_header a.active {
        color: #2b333d;
        list-style: none;
        text-decoration: none;
        padding-bottom: 5px;
        background: url(../../images/master/icon_content_sub_title_arrow.jpg) bottom center no-repeat;
    }

ul.tab_header_vertical {
    margin: 0px 0px 0px 35px;
    padding: 0px;
    list-style: none;
    line-height: 18px;
}

    ul.tab_header_vertical li {
        display: block;
        list-style: none;
    }

        ul.tab_header_vertical li a {
            color: #108ba1;
            text-align: left;
            padding-right: 6px;
            padding-left: 8px;
            list-style: none;
        }

            ul.tab_header_vertical li a.hover {
                list-style: none;
                color: #0000FF !important;
            }

    ul.tab_header_vertical a.active {
        color: #2b333d;
        list-style: none;
        text-decoration: none;
        padding-left: 8px;
        background: url(../../images/master/icon_tab_menu_arrow.jpg) left no-repeat;
    }

ul.tab_template {
    margin: 0px 0px 0px 35px;
    padding: 0px;
    margin-top: 5px;
    margin-bottom: 20px;
    list-style: none;
}

    ul.tab_template li {
        display: inline;
        list-style: none;
    }

ul.tab_templateli a {
    color: #108ba1;
    text-align: left;
    padding-right: 6px;
    padding-left: 0px;
    list-style: none;
}

ul.tab_template li a.hover {
    list-style: none;
    color: #0000FF !important;
}

ul.tab_template a.active {
    color: #2b333d;
    list-style: none;
    text-decoration: none;
}

.link_button {
    margin: 0px; /*margin:0px 0px 0px 35px;*/
    list-style: none;
    line-height: 18px;
}

    .link_button a:link {
        color: #108ba1;
        text-align: left;
        padding-right: 6px;
        padding-left: 8px;
        list-style: none;
    }

    .link_button a:hover {
        list-style: none;
        color: #0000FF !important;
    }

    .link_button a:active {
        color: #2b333d;
        text-decoration: none;
        padding-left: 8px;
        background: url(../../images/master/icon_tab_menu_arrow.jpg) left no-repeat;
    }

a.tab {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-decoration: none;
}

a.tab {
    color: #097793;
    text-decoration: none;
    font-family: Arial;
    font-size: 12px;
    cursor: pointer !important;
}

    a.tab:hover {
        color: #043275;
        text-decoration: none;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        cursor: pointer !important;
    }

.content-a ul {
    margin: 10px 0px;
    padding: 0px;
    list-style: none;
}

    .content-a ul li {
        margin-bottom: 3px;
        font-size: 12px;
        list-style: none;
    }

        .content-a ul li a {
            color: #3f4c4f;
            list-style: none;
        }

            .content-a ul li a:hover {
                color: #0000FF !important;
                list-style: none;
            }

#order, #pay, #join, #PrintTech, #ProPrint, #bookletStd, #bookletQuote, #bookmark, #bc, #computerForm, #contractProof, #envelope,
#folder, #letterhead, #looseSheet, #looseSheetQuote, #moneyPacket, #notePad, #paperBag, #stamp, #tentCard, #ticket, #kadKahwin,
#kotak, #tag, #litho, #sales, #paperbag, #certs, #ProcessDO, #ProcessPackaging, #Skynet, #calculateLO, #calculateDO, #CorelDraw,
#InDesign, #kotakCenderahati, #labelsticker, #ProcessBusinessCard, #ProcessKC, #ProcessLH, #ProcessSoftDC {
    display: none;
}


@media (max-width: 1010px) {
    .mainContent {
        width: 565px;
        margin-top: 0px;
        margin-right: 0px;
        float: left;
        padding: 10px 0px 0px 5px;
    }

    .content-headerBg {
        width: 560px;
    }

    .content-header-subBg {
        width: 560px;
    }

    #content-a {
        width: 560px;
        margin: 15px auto;
    }

    #tab_container {
        width: 560px;
        margin: 0px;
        padding: 0px;
    }

        #tab_container table {
            width: 100% !important;
            max-width: 100% !important;
            border-spacing: 0 !important;
            border-collapse: collapse !important;
            /*display: block;
        overflow: auto;
        word-break: break-all;
        table-layout:fixed;*/
        }

            #tab_container table th, #tab_container table td, #tab_container table tr {
                padding: 0px !important;
            }

    table#mainContent_rdTemplate table {
        display: block;
    }

    table#mainContent_rdTemplate tbody {
        display: block;
    }

    table#mainContent_rdTemplate td {
        display: block;
    }

    table#mainContent_rdTemplate tr {
        display: block;
    }
}

@media (max-width: 767px) {
    .mainContent {
        width: 675px;
        padding: 10px 0px 0px 0px;
    }

    .content-headerBg {
        width: 660px;
    }

    .content-header-subBg {
        width: 660px;
    }

    #content-a {
        width: 660px;
        margin: 15px auto;
    }

    #tab_container {
        width: 660px;
    }

        #tab_container table {
            width: 100% !important;
            max-width: 600px !important;
        }
}

@media (max-width: 680px) {
    .mainContent {
        width: 540px;
    }

    .content-headerBg {
        width: 530px;
    }

    .content-header-subBg {
        width: 530px;
    }

    #content-a {
        width: 530px;
        margin: 15px auto;
    }

    #tab_content-a {
        padding: 0px;
    }

    #tab_container {
        width: 530px;
    }

        #tab_container table {
            width: 100% !important;
            max-width: 530px !important;
        }
}

@media (max-width: 569px) {
    .mainContent {
        width: 410px;
    }

    .content-headerBg {
        width: 400px;
    }

    .content-header-subBg {
        width: 400px;
    }

    #content-a {
        width: 400px;
        margin: 15px auto;
    }

    #tab_container {
        width: 400px;
    }

        #tab_container table {
            width: 100% !important;
            max-width: 400px !important;
        }
}

@media (max-width: 459px) {
    .mainContent {
        width: 350px;
    }

    .content-headerBg {
        width: 340px;
    }

    .content-header-subBg {
        width: 340px;
    }

    #content-a {
        width: 350px;
        margin: 15px auto;
    }

    #tab_container {
        width: 350px;
    }

        #tab_container table {
            width: 100% !important;
            max-width: 350px !important;
        }
}

@media (max-width: 349px) {
    .mainContent {
        width: 320px;
    }

    .content-headerBg {
        width: 310px;
    }

    .content-header-subBg {
        width: 310px;
    }

    #content-a {
        width: 320px;
        margin: 15px auto;
    }

    #tab_container {
        width: 320px;
    }

        #tab_container table {
            width: 100% !important;
            max-width: 320px !important;
        }
}

/*----------------------------Product & Price Content-------------------------------------------*/
.product-borderRight {
    border-right: 1px solid #e5e2da;
    padding-right: 25px;
    float: left;
    width: 280px;
}

.product-Right {
    padding-right: 0px;
    float: left;
    width: 250px;
}

.product-borderleft {
    border-left: 1px solid #e5e2da;
}

.product-spec {
    float: right;
    padding-top: 50px;
    width: 455px;
}

.product-detail {
    float: left;
    margin-left: 25px;
    width: 395px;
}

.PS-padding {
    padding-left: 30px;
}

.container-line {
    padding: 8px 0px 10px 30px;
    border-bottom: 1px solid #efe7d2;
    width: 220px;
    margin-bottom: 18px;
}

.Lo-container {
    background: url(../../images/master/icon_Lo.jpg) left no-repeat;
    padding: 5px 0px 0px 30px;
}

.Lo-container-line {
    background: url(../../images/master/icon_Lo.jpg) left no-repeat;
    padding: 8px 0px 10px 30px;
    border-bottom: 1px solid #efe7d2;
    width: 220px;
    margin-bottom: 18px;
}

.Do-container {
    background: url(../../images/master/icon_Do.jpg) left no-repeat;
    padding: 5px 0px 0px 30px;
}

.Do-container-line {
    background: url(../../images/master/icon_Do.jpg) left no-repeat;
    padding: 8px 0px 10px 30px;
    border-bottom: 1px solid #efe7d2;
    width: 220px;
    margin-bottom: 18px;
}

.product-spec-container {
    background: url(../../images/master/icon_product_spec.jpg) left no-repeat;
    padding: 5px 0px 5px 30px;
    line-height: 26px;
}

.artwork-spec-container-line {
    background: url(../../images/master/icon_artwork_spec.jpg) left no-repeat;
    padding: 8px 0px 10px 30px;
    border-bottom: 1px solid #efe7d2;
    width: 220px;
    margin-bottom: 8px;
}

.artwork-spec-container-line-1 {
    background: url(../../images/master/icon_artwork_spec.jpg) left top no-repeat;
    padding: 0px 0px 10px 30px;
    border-bottom: 1px solid #efe7d2;
    width: 220px;
    margin-bottom: 8px;
}

.artwork-spec-container {
    background: url(../../images/master/icon_artwork_spec.jpg) left no-repeat;
    padding: 5px 0px 0px 30px;
    line-height: 26px;
}

.delivery-container {
    background: url(../../images/master/icon_delivery.jpg) left no-repeat;
    padding: 5px 0px 5px 30px;
    line-height: 26px;
}

.tips-tricks-container {
    background: url(../../images/master/icon_tips_tricks.jpg) left no-repeat;
    padding: 5px 0px 5px 30px;
    line-height: 26px;
}

.xccessorries-container {
    background: url(../../images/master/icon_xccessories.jpg) left no-repeat;
    padding: 5px 0px 5px 30px;
    line-height: 26px;
}

.dl-size-container {
    background: url(../../images/master/icon_download_product_size.jpg) left no-repeat;
    padding: 5px 0px 5px 30px;
    line-height: 26px;
}

.dl-template-container {
    background: url(../../images/master/icon_download_template.jpg) left no-repeat;
    padding: 5px 0px 5px 30px;
    line-height: 26px;
}

.dl-pdf-container {
    background: url(../../images/master/icon_download_template.jpg) left no-repeat;
    padding: 5px 0px 5px 30px;
    line-height: 26px;
}

@media (max-width: 1010px) {
    .product-borderRight {
        padding-right: 15px;
        width: 250px;
    }

    .product-detail {
        margin-left: 15px;
        width: 265px;
    }
}

@media (max-width: 680px) {
    .product-borderRight {
        width: 230px;
    }

    .product-detail {
        width: 245px;
    }
}
/*----------------------------Homepage Content-------------------------------------------*/
.promotion-box {
    width: 240px;
    height: 200px;
    padding: 0px;
    border: 1px solid #ebebeb;
    vertical-align: top;
}

.promotion-box-content {
    padding: 5px;
    text-align: left;
}

.gettingStarted {
    padding-top: 10px;
    text-align: center;
}
/*----------------------------Get Started Membership-------------------------------------*/
#member-highlights {
    list-style-image: url(../../images/master/icon_check-box-tick.jpg);
}

.table-header {
    background-color: #fbf8f3;
    border-bottom: 1px solid #e2ddd1;
    border-top: 1px solid #e2ddd1;
    text-align: center;
    color: #9b6666;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 0px 10px 0px;
}

.table-header-L {
    background-color: #fbf8f3;
    border-bottom: 1px solid #e2ddd1;
    border-top: 1px solid #e2ddd1;
    text-align: left;
    color: #9b6666;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 0px 10px 15px;
}

.table-subHeader {
    background-color: #fbf8f3;
    padding: 2px 0px 2px 0px;
}

.table-greyBg {
    background-color: #5a6675;
    display: block;
    text-align: center;
    color: #ffffff;
    font-size: 14px;
    font-weight: normal;
    padding: 5px 0px 5px 0px;
}

.table-greyBg-L {
    background-color: #5a6675;
    display: block;
    text-align: left;
    color: #ffffff;
    font-size: 14px;
    font-weight: normal;
    padding: 5px 0px 5px 15px;
}

.tableBg {
    background-color: #fbf8f3;
    border-bottom: 1px solid #e2ddd1;
    border-top: 1px solid #e2ddd1;
    padding: 10px 35px 10px 10px;
    vertical-align: top;
}

.tableWhiteBg-left {
    background-color: #ffffff;
    border-right: 1px solid #e2ddd1;
    padding: 12px 5px 10px 25px;
    vertical-align: top;
}

.tableWhiteBg-right {
    background-color: #ffffff;
    padding: 12px 15px 10px 25px;
    vertical-align: top;
}

.tableBg-left {
    background-color: #fbf8f3;
    border-bottom: 1px solid #e2ddd1;
    border-right: 1px solid #e2ddd1;
    padding: 22px 35px 20px 25px;
    vertical-align: top;
}

.tableBg-left-no-pdg {
    background-color: #fbf8f3;
    border-bottom: 1px solid #e2ddd1;
    border-right: 1px solid #e2ddd1;
    padding: 0px;
}

.tableBg-left-no-pdg-new {
    background-color: #fbf8f3;
    border: 1px solid #e2ddd1;
    padding: 0px 20px;
}

.tableBg-right {
    background-color: #fbf8f3;
    border-bottom: 1px solid #e2ddd1;
    padding: 22px 35px 20px 35px;
    vertical-align: top;
}

.tableBg-right-default {
    background-color: #fbf8f3;
    border-bottom: 1px solid #e2ddd1;
    padding: 22px 35px 20px 35px;
    font-size: 18px;
    font-weight: bold;
    color: #d2d2d2;
}

.tableBg-bottom {
    border-bottom: 1px solid #e2ddd1;
    padding: 20px;
    vertical-align: top;
}

.inner-tableBg {
    background-color: #ffffff;
    border: 1px solid #e2ddd1;
    padding: 10px;
    text-align: center;
    width: 260px;
}

.inner-tableBg-signup {
    background-color: #ffffff;
    border: 1px solid #e2ddd1;
    padding: 5px;
    width: 600px;
}

.inner-tableBg-new {
    background-color: #ffffff;
    border: 1px solid #e2ddd1;
    padding: 10px;
    text-align: center;
    /*width:400px;*/
    margin-bottom: 5px;
}

.inner-priceBg {
    background-color: #ede5d9;
    display: block;
    text-align: center;
    color: #9b6666;
    font-size: 30px;
    font-weight: bold;
    padding: 5px 0px 3px 0px;
}

.inner-price-text {
    text-align: center;
    color: #9b6666;
    font-size: 30px;
    font-weight: bold;
}

.inner-LightmaroonBg {
    background-color: #ede5d9;
    display: block;
    color: #707070;
    padding: 5px 10px;
    text-align: left;
}

.inner-table-border {
    border-bottom: 1px solid #e2ddd1;
    padding: 8px;
    text-align: center;
    font-size: 12px;
    color: #707070;
}

.inner-table-yellowBg {
    background-color: #fbf9f4;
    padding: 8px;
    text-align: center;
    font-size: 12px;
    color: #707070;
}
/*-------------------------------------Footer--------------------------------------------*/
#footer-container {
    height: 160px;
    position: relative;
    background-color: #14586b;
    bottom: 0px;
    padding-top: 0px;
    background-image: url(../../images/master/background-footer.jpg);
    background-position: top;
    background-repeat: repeat-x;
}

.clearfooter {
    height: 145px;
    clear: both;
}

.footer {
    margin: 0px;
    padding-top: 5px;
    padding-bottom: 0px;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    color: #ffffff;
    height: 110px;
}

    .footer a:link {
        color: #ffffff;
        text-decoration: none;
    }

    .footer a:visited {
        color: #ffffff;
        text-decoration: none;
    }

    .footer a:hover {
        color: #c4fdfe;
        text-decoration: none;
    }

.footer-top {
    margin: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    color: #005a7f;
}

    .footer-top a:link {
        color: #005a7f;
        text-decoration: none;
    }

    .footer-top a:visited {
        color: #005a7f;
        text-decoration: none;
    }

    .footer-top a:hover {
        color: #0059fb;
        text-decoration: none;
    }

.left-container {
    float: left;
    width: 700px;
    margin-left: 0px;
    padding-top: 0px;
}

.right-container {
    float: left;
    width: 295px;
    margin-right: 0px;
    text-align: right;
}

@media (max-width: 767px) {
    .left-container {
        float: left;
        width: 500px;
        margin-left: 0px;
        padding-top: 0px;
    }
}

@media (max-width: 680px) {
    .left-container {
        width: 400px;
        padding-top: 0px;
    }

    #footer-container img {
        display: none;
    }
}

@media (max-width: 569px) {
    .left-container {
        width: 400px;
        margin-left: 0px;
    }
}

@media (max-width: 459px) {
    .left-container {
        width: 340px;
        margin-left: 0px;
    }
}

@media (max-width: 349px) {
    .left-container {
        width: 310px;
        margin-left: 0px;
    }
}

/*----------------------------Form -------------------------------------------*/
.text_area {
    padding: 2px;
    background: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #5d5c5c;
    border: 1px solid #e6dfcc;
}

a.button2 {
    line-height: 26px; /* Width of left menu image */
    text-decoration: none;
    background-color: transparent;
    padding: 0px 10px 2px 10px;
    background: url(../../images/master/button2_off.jpg)no-repeat;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #065865;
    text-align: center;
    border: 0px;
    height: 26px;
    width: 78px;
    cursor: pointer;
}

    a.button2:hover {
        line-height: 26px; /* Width of left menu image */
        text-decoration: none;
        background-color: transparent;
        padding: 0px 10px 2px 10px;
        background: url(../../images/master/button2_on.jpg)no-repeat;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #065865;
        text-align: center;
        border: 0px;
        height: 26px;
        width: 78px;
        cursor: pointer;
    }

.error_message {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #e5041e;
}

.row_blue {
    padding: 2px;
    background: #e5fafd;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #5d5c5c;
    text-align: left;
}

.nonDefaultTable {
    width: 100%;
    border: 1px solid #80c0e4;
    padding: 4px;
}

    .nonDefaultTable tr {
        background: #fffff;
        padding: 4px;
    }

    .nonDefaultTable td {
        border: 1px solid #d3d1cd;
        padding: 4px;
    }

.nonDefaultTable-header {
    padding: 5px;
    background: #918a80;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #ffffff;
    font-weight: bold;
    text-align: left;
}
/*-------------------------------------------------------Accordion---------------------------------------------------------------*/
.Dyn_11 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    color: #836d4f;
}

    .Dyn_11 a:link {
        color: #836d4f;
        text-decoration: none;
    }

    .Dyn_11 a:hover {
        color: #ca7f19;
        text-decoration: none;
    }

.Dyn_12px {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #448ebf;
}

.CollapsiblePanel {
    margin: 0px;
    padding: 0px;
}

.CollapsiblePanelTab {
    margin: 0px;
    cursor: pointer;
    color: #2b333d;
    -moz-user-select: none;
    -khtml-user-select: none;
    font-size: 12px;
    font-weight: bold;
    padding-top: 6px;
    padding-right: 3px;
    padding-bottom: 4px;
    padding-left: 8px;
    border-bottom: 1px solid #ffffff;
    background: #e1ded7;
    font-family: Arial, Helvetica, sans-serif;
}

.CollapsiblePanelContent {
    color: #5d5c5c;
    margin: 0px;
    padding-top: 5px;
    padding-right: 15px;
    padding-bottom: 5px;
    padding-left: 32px;
    background: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
}

.CollapsiblePanelTab a {
    color: #2b333d;
    text-decoration: none;
}

.CollapsiblePanelOpen .CollapsiblePanelTab {
    background: #e1ded7;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    color: #2b333d;
}

.CollapsiblePanelTabHover, .CollapsiblePanelOpen .CollapsiblePanelTabHover {
    color: #2b333d;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
}

.CollapsiblePanelFocused {
    background: #e1ded7;
    color: #2b333d;
    margin: 0px;
    cursor: pointer;
    -moz-user-select: none;
    -khtml-user-select: none;
    font-size: 12px;
    font-weight: bold;
    padding-top: 6px;
    padding-right: 3px;
    padding-bottom: 4px;
    padding-left: 8px;
    border-bottom: 1px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
}

.ChangeColor span {
    color: #2b333d;
    font-size: 12px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
}

@media (max-width: 1010px) {
    .center_main_table_padding span {
        display: inline !important;
        width: 660px;
        margin: 0 auto;
    }

    .CollapsiblePanelTab {
        margin: 0px;
        padding-top: 6px;
        padding-right: 3px;
        padding-bottom: 4px;
        padding-left: 8px;
        width: 650px;
    }
}

@media (max-width: 767px) {
    .center_main_table_padding span {
        width: 640px;
    }

    .CollapsiblePanelTab {
        width: 630px;
    }
}

@media (max-width: 680px) {
    .center_main_table_padding span {
        width: 540px;
    }

    .CollapsiblePanelTab {
        width: 530px;
    }
}

@media (max-width: 569px) {
    .center_main_table_padding span {
        width: 410px;
    }

    .CollapsiblePanelTab {
        margin: 0px;
        padding-top: 4px;
        padding-right: 2px;
        padding-bottom: 4px;
        padding-left: 2px;
        width: 400px;
    }
}

@media (max-width: 459px) {
    .center_main_table_padding span {
        width: 350px;
    }

    .CollapsiblePanelTab {
        width: 340px;
    }
}

@media (max-width: 349px) {
    .center_main_table_padding span {
        width: 320px;
    }

    .CollapsiblePanelTab {
        width: 310px;
    }
}
/* ------------------------------------------Accordion Multi Open----------------------------------*/
.ui-helper-hidden {
    display: none;
}

.ui-helper-hidden-accessible {
    position: absolute !important;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px,1px,1px,1px);
}

.ui-helper-reset {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    text-decoration: none;
    font-size: 100%;
    list-style: none;
}

.ui-helper-clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.ui-helper-clearfix {
    display: inline-block;
}
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix {
    height: 1%;
}

.ui-helper-clearfix {
    display: block;
}
/* end clearfix */
.ui-helper-zfix {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
}

.ui-state-disabled {
    cursor: default !important;
}

.ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
}

.ui-widget {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

    .ui-widget .ui-widget {
        font-size: 12px;
    }

    .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
    }

.ui-widget-content {
    background: #ffffff;
    color: #5d5c5c;
}

.ui-widget-header {
    color: #2b333d;
    font-weight: bold;
    background: url(../../images/master/icon_arrow.png) left no-repeat #e1ded7;
}

    .ui-widget-header a {
        color: #2b333d;
    }

    .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
        background: url(../../images/master/icon_arrow.png) left no-repeat #e1ded7;
        color: #2b333d;
    }

        .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
            color: #2b333d;
            text-decoration: none;
        }

    .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
        background: url(../../images/master/icon_arrow.png) left no-repeat #e1ded7;
        font-weight: bold;
        color: #2b333d;
    }

        .ui-state-hover a, .ui-state-hover a:hover {
            color: #2b333d;
            text-decoration: none;
        }

    .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
        background: url(../../images/master/icon_arrow.png) left no-repeat #e1ded7;
        font-weight: bold;
        color: #2b333d;
    }

        .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
            color: #2b333d;
            text-decoration: none;
        }

.ui-widget :active {
    outline: none;
}
/* Interaction Cues
----------------------------------*/
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    background: #e1ded7;
    color: #2b333d;
}

    .ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a {
        color: #2b333d;
    }

.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {
    background: #e1ded7;
    color: #2b333d;
}

    .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a {
        color: #2b333d;
    }

.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text {
    color: #2b333d;
}

.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary {
    font-weight: bold;
}

.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary {
    font-weight: normal;
}

.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
    background-image: none;
}

.ui-accordion {
    width: 100%;
}

    .ui-accordion .ui-accordion-header {
        cursor: pointer;
        position: relative;
        margin-top: 1px;
        zoom: 1;
    }

    .ui-accordion .ui-accordion-li-fix {
        display: inline;
    }

    .ui-accordion .ui-accordion-header-active {
        border-bottom: 0 !important;
    }

    .ui-accordion .ui-accordion-header a {
        display: block;
        font-size: 1em;
        padding: .5em .5em .5em .7em;
    }

.ui-accordion-icons .ui-accordion-header a {
    padding-left: 2.2em;
}

.ui-accordion .ui-accordion-header .ui-icon {
    position: absolute;
    left: .5em;
    top: 50%;
    margin-top: -8px;
}

.ui-accordion .ui-accordion-content {
    padding: 0px;
    border-top: 0;
    margin-top: -2px;
    position: relative;
    top: 1px;
    margin-bottom: 2px;
    overflow: auto;
    display: none;
    zoom: 1;
}

.ui-accordion .ui-accordion-content-active {
    display: block;
}
/*----------------------------------------------- Trade Event Accordion----------------------------------*/
.view-container {
    background: url(../../images/master/icon_zoom-in.jpg) left no-repeat;
    padding: 5px 0px 0px 20px;
    margin-left: 0px;
    margin-top: 3px;
}

.padding {
    padding: 10px 10px;
    /*padding: 1em 2.2em;*/
}

.member-privilege-fieldset {
    border: 2px #F99C1B solid;
}

.member-privilege-legend {
    border: 2px #F99C1B solid;
    color: white;
    background-color: #F99C1B;
    margin: 0px;
    padding: 5px 25px 5px 25px;
    font-size: 14px;
    text-align: center;
}
/*----------------------------------------------- Product Spec----------------------------------*/
.table-white {
    border-bottom: 1px solid #e3e2de;
    background: #ffffff;
    padding: 2px 25px;
    text-align: left;
}

.DS-table-white {
    border-bottom: 1px solid #e3e2de;
    border-right: 1px solid #e3e2de;
    background: #ffffff;
    padding: 2px 15px;
    text-align: left;
}

.DS-table-white2 {
    background: #ffffff;
    padding: 2px 15px;
    text-align: left;
}

.DS-table-white-c {
    border-bottom: 1px solid #e3e2de;
    border-right: 1px solid #e3e2de;
    background: #ffffff;
    padding: 2px 15px;
    text-align: center;
}

.DS-table-white-cR {
    border-bottom: 1px solid #e3e2de;
    background: #ffffff;
    padding: 2px 15px;
    text-align: center;
}

.DS-table-white-right {
    border-right: 1px solid #e3e2de;
    background: #ffffff;
    padding: 2px 15px;
    text-align: left;
}

.DS-table-white-bottom {
    border-bottom: 1px solid #e3e2de;
    background: #ffffff;
    padding: 2px 15px;
    text-align: left;
}

.table-border-left {
    border-left: 1px solid #e3e2de;
    text-align: left;
    padding-left: 20px;
}

.table-brown {
    border-bottom: 1px solid #e3e2de;
    background: #b8b2a5;
    padding: 2px 15px;
    text-align: center;
    color: #ffffff;
}

.DS-table-brown {
    border-bottom: 1px solid #e3e2de;
    border-right: 1px solid #ffffff;
    background: #b8b2a5;
    padding: 2px 15px;
    text-align: center;
    color: #ffffff;
}

.table-lightMaroon {
    border-bottom: 1px solid #e3e2de;
    background: #b9abad;
    padding: 2px 15px;
    text-align: center;
    color: #ffffff;
}

.DS-table-lightMaroon {
    border-bottom: 1px solid #e3e2de;
    border-right: 1px solid #ffffff;
    background: #b9abad;
    padding: 2px 15px;
    text-align: center;
    color: #ffffff;
}

.table-lightBrown-right {
    border-right: 1px solid #b8b2a5;
    background: #e1ded6;
    padding: 5px 25px;
}

.table-lightBrown {
    background: #e1ded6;
    padding: 5px 25px;
}

.DS-table-header-grey {
    background: #5a6675;
    padding: 4px 5px;
    color: #ffffff;
    border-right: 1px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
}

.terms-table-header-grey {
    background: #5a6675;
    padding: 4px 15px;
    color: #ffffff;
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    text-align: left;
}

.DS-table-header-brown {
    background: #b8b2a5;
    padding: 4px 5px;
    color: #ffffff;
    border-right: 1px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
}

.DS-table-header-lightMaroon {
    background: #b9abad;
    padding: 4px 5px;
    color: #ffffff;
    border-right: 1px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
}

.BT-table-header-brown {
    background: #b8b2a5;
    padding: 2px 3px;
    color: #ffffff;
    border-right: 1px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    text-align: center;
}

.BT-table-header-lightMaroon {
    background: #b9abad;
    padding: 2px 3px;
    color: #ffffff;
    border-right: 1px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    text-align: center;
}

.BT-table-header-grey {
    background: #5a6675;
    padding: 2px 3px;
    color: #ffffff;
    border-right: 1px solid #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-align: center;
}

.table-header-grey {
    background: url(../../images/master/background_product_spec_header_grey.jpg) repeat-x;
    padding: 2px 15px;
    color: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    height: 48px;
    line-height: 35px;
    vertical-align: bottom;
}

.table-header-brown {
    background: url(../../images/master/background_product_spec_header_brown.jpg) no-repeat;
    padding: 2px 15px 1px 60px;
    color: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    height: 48px;
    line-height: 35px;
    vertical-align: bottom;
    border-right: 1px solid #ffffff;
}

.table-header-lightMaroon {
    background: url(../../images/master/background_product_spec_header_lightMaroon.jpg) no-repeat;
    padding: 2px 15px 1px 60px;
    color: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    height: 48px;
    line-height: 35px;
    vertical-align: bottom;
}

.table-lightYellow {
    background: #fbf8f3;
    padding: 2px 25px;
    text-align: left;
    font-weight: bold;
}

table#mainContent_order_spec_controller1_order_spec_bizcard1_rblPackage td {
    display: block;
    float: left;
    width: 50%;
}

table#mainContent_order_spec_controller1_order_spec_standard1_rblPackage td {
    display: block;
    float: left;
    width: 50%;
}
/*----------------------------------------------- Get Started ----------------------------------*/
.floatLeft {
    width: 350px;
    float: left;
    margin-left: 0px;
}

.floatRight {
    width: 350px;
    float: right;
    margin-right: 0px;
}

.table_header {
    background: #5a6675;
    color: #ffffff;
    text-align: center;
    border-right: 1px solid #ffffff;
}

.table_outer_border {
    border: 1px solid #e5e2da;
}

.table_border {
    border-bottom: 1px solid #e5e2da;
    border-right: 1px solid #e5e2da;
}

.table_border_bottom {
    border-bottom: 1px solid #e5e2da;
}

.table_border_bottom-white {
    border-bottom: 1px solid #ffffff;
}

.table_header_bottom {
    background: #5a6675;
    color: #ffffff;
    text-align: center;
    border-bottom: 1px solid #ffffff;
    padding: 5px 0px;
}

.table_header_bottom_right {
    background: #5a6675;
    color: #ffffff;
    text-align: center;
    border-bottom: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
    padding: 5px 0px;
}

.table_header_bg {
    background: #5a6675;
    color: #ffffff;
    text-align: center;
}

.sales_table_alt_row {
    background: #fdf3e2;
    text-align: left;
    border-bottom: 1px solid #e5e2da;
    border-right: 1px solid #e5e2da;
    padding: 5px 2px;
}

.sales_table_alt_col {
    background: #fdf3e2;
    text-align: center;
    border-bottom: 1px solid #e5e2da;
    border-right: 1px solid #e5e2da;
    padding: 5px 0px;
}

.sales_table_alt_col_left {
    background: #fdf3e2;
    text-align: center;
    border-bottom: 1px solid #e5e2da;
    border-right: 1px solid #e5e2da;
    border-left: 1px solid #e5e2da;
    padding: 5px 0px;
}

.sales_table_row {
    text-align: left;
    border-bottom: 1px solid #e5e2da;
    border-right: 1px solid #e5e2da;
    padding: 5px 2px;
}

.sales_table_col {
    text-align: center;
    border-bottom: 1px solid #e5e2da;
    border-right: 1px solid #e5e2da;
    padding: 5px 0px;
}

.sales_table_col_none {
    text-align: center;
    border-bottom: 1px solid #e5e2da;
    padding: 5px 0px;
}

.sales_table_col_left {
    text-align: center;
    border-bottom: 1px solid #e5e2da;
    border-right: 1px solid #e5e2da;
    border-left: 1px solid #e5e2da;
    padding: 5px 0px;
}

.sales_table_bottom {
    text-align: left;
    border-bottom: 1px solid #e5e2da;
}

.sales_table_bottom-c {
    text-align: center;
    border-bottom: 1px solid #e5e2da;
}

.sales_table_footer {
    background: #5a6675;
    text-align: right;
    color: #ffffff;
    padding: 5px;
}

.reload_table_alt_row {
    background: #d2f9d2;
    text-align: left;
    border-bottom: 1px solid #e5e2da;
    border-right: 1px solid #e5e2da;
}

.alt_row_lightYellow {
    background: #fbf8f3;
    padding-left: 20px;
}

.alt_row_border_lightYellow {
    background: #fbf8f3;
    text-align: center;
    border-left: 1px solid #ffffff;
}

.alt_row_lightBrown {
    background: #ede5d9;
    padding-left: 20px;
}

.alt_row_border_lightBrown {
    background: #ede5d9;
    text-align: center;
    border-left: 1px solid #ffffff;
}

.tutorial_Bottom {
    border-bottom: 1px solid #efe7d2;
    padding-left: 15px;
}

.tutorial_Left {
    border-left: 1px solid #efe7d2;
    border-bottom: 1px solid #efe7d2;
    padding-left: 15px;
}

.tutorial_header {
    background: #e1ded7;
    color: #2b333d;
    font-weight: bold;
    text-align: left;
    padding-left: 15px;
}

.tutorial_padding {
    padding-left: 15px;
}

.tutorial_center {
    border-left: 1px solid #efe7d2;
    border-bottom: 1px solid #efe7d2;
    text-align: center;
}

.tutorial-header-grey {
    background: url(../../images/master/background_product_spec_header_grey.jpg) repeat-x;
    padding: 2px 15px;
    color: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    height: 48px;
    line-height: 28px;
    vertical-align: bottom;
}
/*----------------------------------------------- Inspire Zone ----------------------------------*/
.inspire_bg {
    background: #fbf8f3;
    padding: 20px;
}

.inspire_banner {
    background: url(../../images/master/help_inspire-zone-top-banner.jpg) no-repeat;
    height: 111px;
    padding: 67px 0px 0px 350px;
    color: #1b4040;
    font-weight: bold;
    font-size: 18px;
}

.inspire_numbering {
    background: url(../../images/master/help_inspire-zone-number.jpg) no-repeat;
    padding: 11px 0px 0px 15px;
    height: 30px;
    text-align: left;
    color: #9b6666;
    font-weight: bold;
    font-size: 18px;
}

.inspire_padding {
    padding: 0px 50px 0px 50px;
}

.inspire-maroonBg {
    background: #beb0b2;
    color: #beb0b2;
    padding: 15px;
    text-align: left;
    color: #ffffff;
}

@media (max-width: 680px) {
    .inspire_banner {
        padding: 0px;
        width: 343px;
        height: 111px;
        text-align: right;
        vertical-align: bottom;
        background-size: 100% 100%;
    }
}

@media (max-width: 569px) {
    .inspire_banner {
        padding: 0px;
        width: 343px;
        height: 111px;
    }
}

@media (max-width: 459px) {
    .inspire_banner {
        padding: 0px;
        width: 343px;
        height: 111px;
    }
}

@media (max-width: 349px) {
    .inspire_banner {
        padding: 0px;
        width: 308px;
        height: 99px;
    }
}
/*----------------------------------X-ccessories-------------------------------------------*/
.Xccessories-right {
    padding-left: 25px;
    float: right;
    width: 375px;
}

.Xccessories-left {
    padding-left: 10px;
    float: left;
    width: 280px;
}

.Xccessories-container {
    width: 700px;
    padding: 0px;
}

.Xccessories-footer {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #707070;
    text-align: center;
}

.Xccessories-tableBg {
    background-color: #fbf8f3;
    border-bottom: 1px solid #e2ddd1;
    border-top: 1px solid #e2ddd1;
    padding: 10px 20px;
    vertical-align: top;
}

.Xccessories-desc {
    padding: 2px 25px;
    text-align: left;
    font-weight: bold;
}

.Xccessories-lightYellow {
    background: #fbf8f3;
    padding: 8px 25px;
    text-align: left;
}

.Xccessories-lightMaroon {
    background: #ede5da;
    padding: 8px 25px;
    text-align: left;
    font-weight: bold;
    color: #3d3d3d;
}

.Xccessories-div {
    height: 40px;
}

.lblXCart {
}

@media (max-width: 569px) {
    .Xccessories-div {
        height: 90px;
    }
}
/*----------------------------------Artwork Spec-------------------------------------------*/
.artwork-box {
    background-color: #ffffff;
    border: 1px solid #e2ddd1;
    padding: 10px;
    text-align: left;
    width: 660px;
}

@media (max-width: 1010px) {
    .artwork-box {
        width: 540px;
    }
}

@media (max-width: 767px) {
    .artwork-box {
        width: 540px;
    }
}

@media (max-width: 680px) {
    .artwork-box {
        width: 420px;
    }
}

@media (max-width: 569px) {
    .artwork-box {
        width: 360px;
    }
}

@media (max-width: 459px) {
    .artwork-box {
        width: 320px;
    }
}

@media (max-width: 349px) {
    .artwork-box {
        width: 290px;
    }
}
/*----------------------------------Blank Template-------------------------------------------*/
.BT-seperator {
    background: #e1dfd6;
}
/*----------------------------------Dyanamic Page-------------------------------------------*/
.orderpanel_blue {
    background: #ede5d9;
    height: 35px;
    font-size: 13px;
    color: #2b333d;
    font-weight: bold;
    text-align: center;
    border-right: 1px solid #ffffff;
}

.orderpanel_gray {
    background: #e1ded7;
    height: 35px;
    font-size: 13px;
    color: #9b6666;
    font-weight: bold;
    text-align: center;
    border-right: 1px solid #ffffff;
}

.cartTable-header {
    padding: 4px;
    background: #918a80;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #ffffff;
    font-weight: bold;
    text-align: left;
}

.cartTable-alt-row {
    padding: 4px;
    background: #fff8ef;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #5d5c5c;
    text-align: left;
}

.cartTable-alt-white {
    padding: 4px;
    background: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #5d5c5c;
    text-align: left;
}

.cartTable-footer {
    padding: 4px;
    background: #d3d1cd;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #8c857b;
    font-weight: bold;
    text-align: left;
}
/*----------------------------------Dyanamic Page-------------------------------------------*/
.orderpanel_blue {
    background: #ede5d9;
    height: 35px;
    font-size: 13px;
    color: #2b333d;
    font-weight: bold;
    text-align: center;
    border-right: 1px solid #ffffff;
}

.orderpanel_gray {
    background: #e1ded7;
    height: 35px;
    font-size: 13px;
    color: #9b6666;
    font-weight: bold;
    text-align: center;
    border-right: 1px solid #ffffff;
}

.cartTable-header {
    padding: 4px;
    background: #918a80;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #ffffff;
    font-weight: bold;
    text-align: left;
}

.cartTable-alt-row {
    padding: 4px;
    background: #fff8ef;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #5d5c5c;
    text-align: left;
}

.cartTable-alt-white {
    padding: 4px;
    background: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #5d5c5c;
    text-align: left;
}

.cartTable-footer {
    padding: 4px;
    background: #d3d1cd;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #8c857b;
    font-weight: bold;
    text-align: left;
}

#divOrderSpec {
    background-image: url(../../images/member/Package_order/banner.png);
    height: 95px;
    background-repeat: no-repeat;
}

.OrderSpec_PromotionMessage span {
    height: 95px;
    font-family: Verdana;
    font-size: 14px;
}
/*----------------------------------Tooltips-------------------------------------------*/
a.tooltip {
    outline: none;
}

    a.tooltip strong {
        line-height: 30px;
    }

    a.tooltip:hover {
        text-decoration: none;
    }

    a.tooltip span {
        z-index: 10;
        display: none;
        padding: 5px;
        margin-top: -60px;
        margin-left: 15px;
        width: 150px;
        line-height: 16px;
    }

    a.tooltip:hover span {
        display: inline;
        position: absolute;
        color: #111;
        border: 1px solid #999998;
        background: #ffffff;
    }

.callout {
    z-index: 20;
    position: absolute;
    top: 70px;
    border: 0;
    left: -11px;
}

/*----------------------------------Sticker-------------------------------------------*/
.hotspot {
    color: #900;
    cursor: pointer;
}

#tt {
    position: absolute;
    display: block;
    background: url(../../images/master/tt_left.gif) top left no-repeat;
    z-index: 9999;
}

#tttop {
    display: block;
    height: 5px;
    margin-left: 5px;
    background: url(../../images/master/tt_top.gif) top right no-repeat;
    overflow: hidden;
    z-index: 9999;
}

#ttcont {
    display: block;
    padding: 0px 5px 0px 3px;
    margin-left: 5px;
    background: #666;
    color: #FFF;
    z-index: 9999;
}

#ttbot {
    display: block;
    height: 5px;
    margin-left: 5px;
    background: url(../../images/master/tt_bottom.gif) top right no-repeat;
    overflow: hidden;
    z-index: 9999;
}
/*------------------------------------ Voucher---------------------------*/
a.button3 {
    display: block;
    float: left; /* Change 13px as desired */
    line-height: 39px; /* Width of left menu image */
    text-decoration: none;
    background-color: transparent;
    background-image: url(../../images/master/button3_left.png);
    background-repeat: no-repeat;
    background-position: left top;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 39px;
    font-style: normal;
    width: auto;
    padding-left: 10px;
    text-align: center;
}

a:link.button3, a:visited.button3, a:hover.button3, a:active.button3 {
    color: #ffffff; /*button text color*/
    cursor: pointer;
}

a.button3 span {
    display: block; /*Set 10px to be equal or greater than'padding-left' value above*/
    background-color: transparent;
    background-image: url(../../images/master/button3_right.png);
    background-repeat: no-repeat;
    background-position: right top;
    height: 39px;
    padding-right: 15px;
    margin-left: 2px;
}

a:hover.button3 { /* Hover state CSS */
    color: #fffbb4;
    background-image: url(../../images/master/button3_left.png);
    height: 39px;
}

    a:hover.button3 span {
        background-image: url(../../images/master/button3_right.png);
        color: #fffbb4;
        text-align: center;
    }

/*----------------------------Packaging-------------------------------------------*/
#packaging-main1 {
    width: 800px;
    padding: 0px;
    margin: 0 auto;
    background-color: #FFF;
}

#packaging-content1 {
    width: 766px;
    padding: 0px;
    margin: 0 auto;
    background-color: #ffffff;
}

.packaging-guide {
    width: 50px;
    padding: 0px;
    margin: 0 auto;
    background-color: #FFF;
}

.packaging-table1 {
    width: 700px;
    padding: 0px 15px 0px 0px;
    margin: 0 auto;
    border: #5b443e solid 1px;
}

.packaging-table-container {
    width: 715px;
    padding: 0px;
    margin: 10px auto;
}

.packaging-table-blue {
    width: 685px;
    padding: 15px;
    background-color: #005b7f;
}

.packaging-table-1 {
    width: 340px;
    padding: 0px 10px 10px 0px;
    margin: 0 auto;
    border: #5b443e solid 1px;
}

.packaging-table-seperator {
    border-right: #5b443e solid 1px
}

.packaging-padding-top {
    padding-top: 10px;
}

.packaging-padding-top-5 {
    padding-top: 5px;
}

.packaging-padding {
    padding: 10px;
}

.packaging-float_l {
    float: left;
    margin-right: 0px;
}

.packaging-float_r {
    float: right;
    margin-right: 0px;
    margin-left: 0px;
    width: 160px;
}

.packaging-float_c {
    float: right;
    margin-right: 0px;
    margin-left: 0px;
    width: 130px;
}

.packaging-float_d {
    display: inline-block;
}

.packaging-wrapper {
    overflow: hidden;
    clear: both;
    text-align: center;
}

.packaging-td-line {
    vertical-align: top;
    border-right: #5b443e solid 1px;
    border-bottom: #5b443e solid 1px;
    width: 125px;
}

.packaging-td-line-1 {
    vertical-align: top;
    border-bottom: #5b443e solid 1px;
    padding: 10px 0px 10px 20px;
}

.packaging-label {
    background-color: #005b7f;
    width: 170px;
    height: 30px;
    padding: 10px 25px;
}

.packaging-label-text {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 20px;
    color: #f3f2e0;
}

.packaging-label-text-big {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 30px;
    color: #f3f2e0;
    line-height: 30px;
}

.packaging-text-yellow {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 17px;
    color: #f3f2e0;
    line-height: 20px;
}

.packaging-text-red {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 20px;
    color: Red;
    line-height: 20px;
}

.packaging-header {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 17px;
    color: #5b443e;
    line-height: 20px;
}

.packaging-text {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 13px;
    color: #5b443e;
    line-height: 14px;
}

    .packaging-text a:link {
        color: #af695a;
        text-decoration: underline;
    }

    .packaging-text a:visited {
        color: #af695a;
        text-decoration: underline;
    }

    .packaging-text a:hover {
        color: #5b443e;
        text-decoration: underline;
    }

.packaging-text-small {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 13px;
    color: #5b443e;
    line-height: 14px;
}

.packaging-align-center {
    text-align: center;
}

.packaging-text-brown {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    color: #BA6C58;
    line-height: 14px;
}

    .packaging-text-brown a:link {
        color: #af695a;
        text-decoration: underline;
    }

    .packaging-text-brown a:visited {
        color: #af695a;
        text-decoration: underline;
    }

    .packaging-text-brown a:hover {
        color: #5b443e;
        text-decoration: underline;
    }

.button-packaging-float-none {
    float: none;
}

a.button-packaging {
    display: block;
    float: left; /* Change 13px as desired */
    line-height: 39px; /* Width of left menu image */
    text-decoration: none;
    background-color: transparent;
    background-image: url(../../images/master/packaging/buttonP_left.png);
    background-repeat: no-repeat;
    background-position: left top;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 39px;
    font-style: normal;
    width: auto;
    padding-left: 9px;
    text-align: center;
}

a:link.button-packaging, a:visited.button-packaging, a:hover.button-packaging, a:active.button-packaging {
    color: #f3f2e0; /*button text color*/
    cursor: pointer;
}

a.button-packaging span {
    display: block; /*Set 10px to be equal or greater than'padding-left' value above*/
    background-color: transparent;
    background-image: url(../../images/master/packaging/buttonP_right.png);
    background-repeat: no-repeat;
    background-position: right top;
    height: 39px;
    padding-right: 10px;
    margin-left: 2px;
}

a:hover.button-packaging { /* Hover state CSS */
    color: #000000;
    background-image: url(../../images/master/packaging/buttonP_left.png);
    height: 39px;
}

    a:hover.button-packaging span {
        background-image: url(../../images/master/packaging/buttonP_right.png);
        color: #000000;
        text-align: center;
    }

@media (max-width: 767px) {
    #packaging-main1 {
        width: 100%;
    }

    #packaging-content1 {
        width: 100%;
    }

    .packaging-guide {
        width: 100%;
    }

    .packaging-table1 {
        width: 100%;
        padding: 0;
    }

        .packaging-table1 > table {
            table-layout: fixed;
        }

    .packaging-table-container {
        width: 100%;
        padding: 0px;
        margin: 10px auto;
    }

    .packaging-label {
        padding: 10px 0px;
        width: 125px;
    }

    a.button-packaging {
    }

    .text-span-1 {
        line-height: 1.6 !important;
    }

    .packaging-text-red {
        line-height: 0px;
    }

    .packaging-table-blue {
        width: 100%;
        padding: 0px;
    }

    .packaging-table-inner-blue {
        width: 100%;
        padding: 0px;
    }
}


/*----------------------------Best seller-------------------------------------------*/
#best-seller-main {
    width: 700px;
    padding: 0px;
    height: 510;
    background-image: url(../../images/master/best-seller/Best-seller-bg.jpg);
    background-repeat: no-repeat;
    background-position: right top;
}

a.button-BSBC {
    display: block;
    background-color: transparent;
    background-image: url(../../images/master/best-seller/BS-BC-light.png);
    background-repeat: no-repeat;
    background-position: left top;
    height: 173px;
    width: 151px;
}

a:link.button-BSBC, a:visited.button-BSBC, a:hover.button-BSBC, a:active.button-BSBC {
    cursor: pointer;
}

a:hover.button-BSBC { /* Hover state CSS */
    background-image: url(../../images/master/best-seller/BS-BC-dark.png);
    height: 173px;
}

a.button-BSBK {
    display: block;
    background-color: transparent;
    background-image: url(../../images/master/best-seller/BS-BK-light.png);
    background-repeat: no-repeat;
    background-position: left top;
    height: 173px;
    width: 154px;
}

a:link.button-BSBK, a:visited.button-BSBK, a:hover.button-BSBK, a:active.button-BSBK {
    cursor: pointer;
}

a:hover.button-BSBK { /* Hover state CSS */
    background-image: url(../../images/master/best-seller/BS-BK-dark.png);
    height: 173px;
}

a.button-BSLS {
    display: block;
    background-color: transparent;
    background-image: url(../../images/master/best-seller/BS-LS-light.png);
    background-repeat: no-repeat;
    background-position: left top;
    height: 173px;
    width: 151px;
}

a:link.button-BSLS, a:visited.button-BSLS, a:hover.button-BSLS, a:active.button-BSLS {
    cursor: pointer;
}

a:hover.button-BSLS { /* Hover state CSS */
    background-image: url(../../images/master/best-seller/BS-LS-dark.png);
    height: 173px;
}

a.button-BSEV {
    display: block;
    background-color: transparent;
    background-image: url(../../images/master/best-seller/BS-EV-light.png);
    background-repeat: no-repeat;
    background-position: left top;
    height: 173px;
    width: 151px;
}

a:link.button-BSEV, a:visited.button-BSEV, a:hover.button-BSEV, a:active.button-BSEV {
    cursor: pointer;
}

a:hover.button-BSEV { /* Hover state CSS */
    background-image: url(../../images/master/best-seller/BS-EV-dark.png);
    height: 173px;
}

.RBL td {
    vertical-align: top;
}


/* ------------- rTable (Div -> Table) Format ------------------ */
.rTable {
    display: table;
}

.rTableRow {
    display: table-row;
}

.rTableHeading {
    display: table-header-group;
}

.rTableBody {
    display: table-row-group;
}

.rTableFoot {
    display: table-footer-group;
}

.rTableCell, .rTableHead {
    display: table-cell;
}

/* DivTable.com */
.divTable {
    display: table;
}

.divTableRow {
    display: table-row;
}

.divTableHeading {
    display: table-header-group;
}

.divTableCell, .divTableHead {
    display: table-cell;
    /*width: 200px;*/
}

.divTableFoot {
    display: table-footer-group;
}

.divTableBody {
    display: table-row-group;
}

@media (max-width: 767px) {
    .divTableCell {
        /*width: 160px;*/
    }
}

@media (max-width: 569px) {
    .divTableCell {
        /*width: 140px;*/
    }
}

@media (max-width: 459px) {
    .divTableCell {
        /*width: 60px;*/
    }
}

@media (max-width: 349px) {
    .divTableCell {
        /*width: 40px;*/
    }
}



/* ------------- Controling almost all <table> tag to Resize ------------------ */
/* Some <table> tag is not fitted nicely for other pages due to hardcode
/* (width, colspan, etc) in the <table> tag style
*/
#table10 {
    border-collapse: separate !important;
}

@media (max-width: 1010px) {
    #divCart table {
        border-top-width: 0px !important;
        border-right-width: 0px !important;
        border-bottom-width: 0px !important;
        border-left-width: 0px !important;
        width: 100% !important;
        border-spacing: 0 !important;
        border-collapse: collapse !important;
        border-width: 0px;
    }

    #divCart th, #divCart td, #divCart tr {
        padding: 1px;
        border-top-width: 0px !important;
        border-right-width: 0px !important;
        border-bottom-width: 0px !important;
        border-left-width: 0px !important;
        border-width: 0px;
    }
}

@media (max-width: 767px) {
    table {
        width: 100% !important;
        border-spacing: 0 !important;
        border-collapse: collapse !important;
        border-width: 0px !important;
    }

    #divCart table {
        border-top-width: 0px !important;
        border-right-width: 0px !important;
        border-bottom-width: 0px !important;
        border-left-width: 0px !important;
        width: 100% !important;
        border-spacing: 0 !important;
        border-collapse: collapse !important;
        border-width: 0px;
    }

    #divCart th, #divCart td, #divCart tr {
        padding: 1px;
        border-top-width: 0px !important;
        border-right-width: 0px !important;
        border-bottom-width: 0px !important;
        border-left-width: 0px !important;
        border-width: 0px;
    }

    .rd_eTemplate table {
        width: 680px;
    }
}

@media (max-width: 680px) {
    table {
        width: 100% !important;
        border-spacing: 0 !important;
        border-collapse: collapse !important;
        border-width: 0px !important;
    }

    #divCart table {
        width: 100% !important;
        border-spacing: 0 !important;
        border-collapse: collapse !important;
        border-width: 0px !important;
    }

    #divCart th, #divCart td, #divCart tr {
        padding: 1px !important;
        border-width: 0px !important;
    }

    .rd_eTemplate table {
        width: 540px;
    }
}

@media (max-width: 569px) {
    table {
        width: 100% !important;
        border-spacing: 0 !important;
        border-collapse: collapse !important;
        border-width: 0px !important;
    }

    #divCart table {
        width: 100% !important;
        border-spacing: 0 !important;
        border-collapse: collapse !important;
        border-width: 0px !important;
    }

    #divCart th, #divCart td, #divCart tr {
        padding: 1px !important;
        border-width: 0px !important;
    }

    .rd_eTemplate table {
        width: 410px;
    }
}

@media (max-width: 459px) {
    table {
        max-width: 350px !important;
    }
}

@media (max-width: 349px) {
    table {
        font-size: 11px;
    }
}

/*------------------ Misc ------------------- */
@media (max-width: 1010px) {
    #mainContent_PaymentMethod1_ddlPayMethod {
        width: 100%;
    }
}

@media (max-width: 569px) {
    .table-header {
        background-color: #fbf8f3;
        border-bottom: 1px solid #e2ddd1;
        border-top: 1px solid #e2ddd1;
        text-align: center;
        color: #9b6666;
        font-size: 14px;
        font-weight: bold;
        padding: 10px 0px 10px 0px;
    }

    .table-header-L {
        background-color: #fbf8f3;
        border-bottom: 1px solid #e2ddd1;
        border-top: 1px solid #e2ddd1;
        text-align: left;
        color: #9b6666;
        font-size: 14px;
        font-weight: bold;
        padding: 10px 0px 10px 15px;
    }

    .table-subHeader {
        background-color: #fbf8f3;
        padding: 2px 0px 2px 0px;
    }

    .table-greyBg {
        background-color: #5a6675;
        display: block;
        text-align: center;
        color: #ffffff;
        font-size: 14px;
        font-weight: normal;
        padding: 5px 0px 5px 0px;
    }

    .table-greyBg-L {
        background-color: #5a6675;
        display: block;
        text-align: left;
        color: #ffffff;
        font-size: 14px;
        font-weight: normal;
        padding: 5px 0px 5px 15px;
    }

    .tableBg {
        background-color: #fbf8f3;
        border-bottom: 1px solid #e2ddd1;
        border-top: 1px solid #e2ddd1;
        padding: 10px 35px 10px 10px;
        vertical-align: top;
    }

    .tableWhiteBg-left {
        background-color: #ffffff;
        border-right: 1px solid #e2ddd1;
        padding: 12px 5px 10px 25px;
        vertical-align: top;
    }

    .tableWhiteBg-right {
        background-color: #ffffff;
        padding: 12px 15px 10px 25px;
        vertical-align: top;
    }

    .tableBg-left {
        background-color: #fbf8f3;
        border-bottom: 1px solid #e2ddd1;
        border-right: 1px solid #e2ddd1;
        padding: 22px 35px 20px 25px;
        vertical-align: top;
    }

    .tableBg-left-no-pdg {
        background-color: #fbf8f3;
        border-bottom: 1px solid #e2ddd1;
        border-right: 1px solid #e2ddd1;
        padding: 0px;
    }

    .tableBg-left-no-pdg-new {
        background-color: #fbf8f3;
        border: 1px solid #e2ddd1;
    }

    .tableBg-right {
        background-color: #fbf8f3;
        border-bottom: 1px solid #e2ddd1;
        padding: 22px 35px 20px 35px;
        vertical-align: top;
    }

    .tableBg-right-default {
        background-color: #fbf8f3;
        border-bottom: 1px solid #e2ddd1;
        padding: 22px 35px 20px 35px;
        font-size: 18px;
        font-weight: bold;
        color: #d2d2d2;
    }

    .tableBg-bottom {
        border-bottom: 1px solid #e2ddd1;
        padding: 20px;
        vertical-align: top;
    }

    .inner-tableBg {
        background-color: #ffffff;
        border: 1px solid #e2ddd1;
        padding: 10px;
        text-align: center;
        width: 260px;
    }

    .inner-tableBg-signup {
        background-color: #ffffff;
        border: 1px solid #e2ddd1;
        padding: 5px;
    }

    .inner-tableBg-new {
        background-color: #ffffff;
        border: 1px solid #e2ddd1;
        padding: 0px;
        text-align: center;
        margin-bottom: 0px;
    }

    .inner-priceBg {
        background-color: #ede5d9;
        display: block;
        text-align: center;
        color: #9b6666;
        font-size: 30px;
        font-weight: bold;
        padding: 5px 0px 3px 0px;
    }

    .inner-price-text {
        text-align: center;
        color: #9b6666;
        font-size: 30px;
        font-weight: bold;
    }

    .inner-LightmaroonBg {
        background-color: #ede5d9;
        display: block;
        color: #707070;
        padding: 5px 10px;
        text-align: left;
    }

    .inner-table-border {
        border-bottom: 1px solid #e2ddd1;
        padding: 8px;
        text-align: center;
        font-size: 12px;
        color: #707070;
    }

    .inner-table-yellowBg {
        background-color: #fbf9f4;
        padding: 0px;
        text-align: center;
        font-size: 12px;
        color: #707070;
    }
}

/* ------------------ Main Content Update Panel ------------------------*/
div#mainContent_UpdatePanel1 td {
    padding: 2px;
    max-width: 100% !important;
}

@media (max-width: 1010px) {
    div#mainContent_UpdatePanel1 table {
        /*display: block;*/
        max-width: 100% !important;
    }

    div#mainContent_UpdatePanel1 tr {
        /*display: block;*/
        max-width: 100% !important;
        padding-bottom: 3px;
    }

    div#mainContent_UpdatePanel1 td {
        /*display: block;*/
        padding: 2px;
        max-width: 100% !important;
    }
}

@media (max-width: 767px) {
    div#mainContent_UpdatePanel1 table {
        /*display: block;*/
        max-width: 100% !important;
    }

    div#mainContent_UpdatePanel1 tr {
        /*display: block;*/
        max-width: 100% !important;
        padding-bottom: 3px;
    }

    div#mainContent_UpdatePanel1 td {
        /*display: block;*/
        max-width: 100% !important;
    }
}

@media (max-width: 680px) {
    div#mainContent_UpdatePanel1 table {
        /*display: block;*/
        max-width: 100% !important;
    }

    div#mainContent_UpdatePanel1 tr {
        /*display: block;*/
        max-width: 100% !important;
        padding-bottom: 3px;
    }

    div#mainContent_UpdatePanel1 td {
        /*display: block;*/
        max-width: 100% !important;
    }
}
/* it will affect other shared UpdatePanel1... e.g Price List, Xccessories, ...etc */
@media (max-width: 569px) {
    div#mainContent_UpdatePanel1 table {
        /*display: block;*/
        max-width: 100% !important;
    }

    div#mainContent_UpdatePanel1 tr {
        /*display: block;*/
        max-width: 100% !important;
        padding-bottom: 3px;
    }

    div#mainContent_UpdatePanel1 td {
        /*display: block;*/
        max-width: 100% !important;
    }
}


/* -------------------------- SIGN UP PAGE -------------------------------- */
.memberInfo table {
}

@media (max-width: 1010px) {
}

@media (max-width:961px) {
    .memberInfo table {
        display: block !important;
    }

    .memberInfo tr {
        display: block !important;
    }

    .memberInfo td {
        display: block !important;
    }

    td.colon {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .memberInfo table {
        display: table !important;
    }

    .memberInfo tr {
        display: table-row !important;
    }

    .memberInfo td {
        display: table-cell !important;
    }

    td.colon {
        display: none !important;
    }

    td.tdBlock1 {
        height: 0px !important;
        display: block !important;
    }

    td.tdBlock2 {
        display: block !important;
    }
}

@media (max-width: 680px) {
    .memberInfo table {
        display: block !important;
    }

    .memberInfo tr {
        display: block !important;
    }

    .memberInfo td {
        display: block !important;
    }

    td.colon {
        display: none !important;
    }
}

/* ---------- SIGN UP EAST / WEST ---------- 
.signUp-table {
    display: table;
    width: 100%;
    height: 100%;
}
.signUp-cell {
    display: table-cell;
    width: 100%;
    border: 1px solid black;    
}
.signUp-row {
    display: table-row;
}*/
.mascot {
    height: 130px;
    display: inline-block;
    margin-bottom: -20px;
    margin-left: 20px;
}

@media (max-width: 1010px) {
    .mascot {
        height: 50px;
        display: inline-block;
        margin-bottom: -100px;
        margin-left: 0px;
    }
}

@media (max-width:961px) {
    .mascot {
        height: 50px;
        display: inline-block;
        margin-bottom: -100px;
        margin-left: 0px;
    }
}

@media (max-width: 767px) {
    .mascot {
        display: none;
    }
}

@media (max-width: 680px) {
    .mascot {
        height: 80px;
        display: inline-block;
        margin-bottom: -30px;
        margin-left: 0px;
    }
}

@media (max-width: 569px) {
    .mascot {
        height: 60px;
        display: inline-block;
        margin-bottom: -50px;
        margin-left: 0px;
    }
}

@media (max-width: 459px) {
    .mascot {
        height: 60px;
        display: inline-block;
        margin-bottom: -50px;
        margin-left: 0px;
    }
}

@media (max-width: 349px) {
    .mascot {
        height: 40px;
        display: inline-block;
        margin-bottom: -30px;
        margin-left: 0px;
    }
}

input[type="radio"] + * {
    margin-right: 10px;
}

input[type="radio"] {
    margin-right: 2.5px;
}

/*
    add by wei, 2017-10-07
    @ customize tooltips for company profile
*/

.panelTooltips {
    position: relative;
    display: inline-block;
    margin-left: 2px;
    width: 15px;
    height: 15px;
}

    .panelTooltips > span {
        position: absolute;
        display: none;
        font-size: 11px;
        background-color: #333;
        color: White;
        top: 20px;
        left: -30px;
        padding: 5px;
        z-index: 2;
        width: 250px;
        opacity: 0;
        transition: opacity .5s;
    }

    .panelTooltips > a:hover + span {
        display: inline-block;
        opacity: 1;
    }

    .panelTooltips > .caret-top:after {
        display: block;
        position: absolute;
        top: -6px;
        left: 32px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 5px 10px 5px;
        border-color: transparent transparent #333 transparent;
        content: " ";
    }

/*
 * --- temp fix for new website
 * --- will remove in future
*/

.temp-fix-page-wrapper {
    width: 100%;
    margin: 0 auto;
    padding: 5px 15px;
}


@media (min-width: 576px) {
    .temp-fix-page-wrapper {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .temp-fix-page-wrapper {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .temp-fix-page-wrapper {
        max-width: 960px;
        padding: 5px 5px;
    }
}

@media (min-width: 1200px) {
    .temp-fix-page-wrapper {
        max-width: 1200px;
        padding: 5px 0px;
    }
}
