.hf {
    width: 100%;
}

.ns {
    width: 1096px;
    margin: 0 auto;
}

header {
    background-color: #FFF;
    height: 60px;
    position: relative;
}

    header .menu {
        background: #FFF;
        height: 60px;
        position: absolute;
        bottom: 0;
        left: 0;
        align-items: center;
        display: flex;
    }

        header .menu .menu-items {
            color: #000;
            float: left;
            /*    margin-right: 15px;*/
            cursor: pointer;
            line-height: 60px;
            margin: 0 8px;
        }

            header .menu .menu-items:last-child {
                margin-right: 0;
            }

            header .menu .menu-items i {
                float: left;
                transition: .3s;
                height: 34px;
                margin: 7px 5px 4px 0;
            }

                header .menu .menu-items i.bottom {
                    position: absolute;
                    left: 0;
                }

                header .menu .menu-items i.top {
                    position: relative;
                    z-index: 1;
                }

            header .menu .menu-items a {
                position: relative;
                width: 100%;
                float: left;
            }

            header .menu .menu-items label {
                font-size: 14px;
                font-weight: bold;
                margin: 0;
                cursor: inherit;
                transition: .3s;
                color: #1c1c1c;
            }

.menu-items.active i.top, .menu-items:hover i.top {
    opacity: 0;
}

.menu-items.active label, .menu-items:hover label {
    color: #a78b4d !important;
}

i.home-icon:before {
    content: url(../images/new_add_2022/logo.png);
    /*content: url(../images/new_add_2023/logo_chris.png?v01);*/
}

i.home-icon-h:before {
    content: url(../images/new_add_2022/logo.png);
    /*content: url(../images/new_add_2023/logo_chris.png?v01);*/
}

/* dropdown */
.menu-dropdowns {
    position: absolute;
    left: 0;
    width: 100%;
    top: 60px;
    background: rgba(70, 55, 23, 0.84);
    height: 300px;
    z-index: 9;
    display: none;
    cursor: initial;
}

.md-item {
    display: table-cell;
    cursor: pointer;
    transition: .3s;
    text-align: center;
}

.mdi-btn-bg {
    height: 25px;
    position: absolute;
    bottom: 0;
    background: rgb(0 0 0 / 80%);
    z-index: -1;
}

.mdi-btn {
    text-align: center;
    color: #fff;
    font-size: 14px;
    height: 25px;
    font-weight: 600;
    line-height: 1.7;
    transition: .3s;
    background: transparent;
}

.mdi-img {
    height: 300px;
}

    .mdi-img img {
        max-height: 300px;
    }

.md-item:hover {
    background: rgba(167, 139, 77, 1.0);
}

    .md-item:hover .mdi-btn {
        background: #f9d43d;
        color: #000;
    }

.menu-dropdowns .ns {
    display: table;
}
/* dropdown end */

/* PopUp */
.modal-content {
    /*background-color: #a69049;*/
    background-color: transparent;
    border: none !important;
}

.modal-body-content {
    padding: 10px;
    text-align: center;
}

.modal-body-title {
    text-align: center;
    color: #FFF;
    text-transform: uppercase;
    font-size: 18px;
}

.modal-body-table {
    color: #FFF;
}

    .modal-body-table table {
        color: #FFF;
        width: 80%;
        margin: 0 auto;
    }

.modal-body-tr-space {
    padding-top: 10px;
}

.modal-body-td table {
    background-color: #FFF;
    border-radius: 5px;
    color: #000;
    width: 100%;
}

.modal-body-td1 {
    width: 10%;
    padding: 1%;
    border-right: 1px solid #b4b4b4;
}

.modal-body-td2 {
    width: 90%;
    padding: 1%;
}

.modal-body-td3 {
    width: 70%;
    padding: 1%;
}

.modal-body-td4 {
    width: 20%;
}

    .modal-body-td4 img {
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        /*padding-right: 1%;*/
    }

.modal-body-td input {
    border: none !important;
    width: 100%;
}

.reset-btn {
    border: 2px solid #FFF;
    border-radius: 5px;
    background-color: #000;
    color: #FFF;
    font-size: 16px;
    padding: 3px 20px;
}

.modal-body-content-announcement {
    padding-top: 10px;
}

.modal-body-table-announcement {
    background-color: #FFF;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding: 10px;
}
/* Promo Tab */
.PromoDiv {
    width: 100%;
}

.PromoTable {
    display: table; /* Allow the centering to work */
    margin: 0 auto;
}

ul.PromoList {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-image: url("../images/new_add_2022/promo-tab-bg.png");
    border: 1px solid #000;
}

.PromoList li {
    float: left;
    border-right: 1px solid #000;
}

    .PromoList li:last-child {
        border-right: none;
    }

    .PromoList li a {
        display: block;
        color: white;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
        text-transform: uppercase;
        font-size: 18px;
        font-weight: bold;
    }

        .PromoList li a:hover, .PromoList li a.active {
            background-image: url("../images/new_add_2022/promo-tab-bg-h.png");
        }

.nopadding {
    padding-right: 0px !important;
}

.displayNone {
    display: none;
}

/* Promo Tab Mobile*/
.PromoDiv-mob {
    width: 100%;
}

.PromoTable-mob {
    display: table; /* Allow the centering to work */
    margin: 0 auto;
}

ul.PromoList-mob {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid #000;
}

.PromoList-mob li {
    float: left;
    border-right: 1px solid #000;
    /*background-image: url("../images/common/Inactive.png");*/
    background-repeat: no-repeat;
    background-position: initial;
    background-size: initial;
}

    .PromoList-mob li:last-child {
        border-right: none;
    }

    .PromoList-mob li a {
        display: block;
        color: black;
        text-align: center;
        padding: 5px;
        text-decoration: none;
        text-transform: uppercase;
        font-size: 2.4vw;
        font-weight: 600;
    }

        .PromoList-mob li a:hover, .PromoList-mob li a.active {
            background-image: url("../images/common/Inactive.png");
        }

.PromoDiv-mob {
    /* width: 100%;*/
    overflow-x: auto;
    overflow-y: hidden;
}

.PromoTable-mob {
    display: table; /* Allow the centering to work */
    margin: 0 auto;
    width: 115%;
}