@media screen and (max-width: 1169px) {
    .IndexContainer, .IndexContainerStep, .IndexContainerMain, .IndexContainerMain1 {
        width: 100%;
    }
}

@media (min-width: 577px) and (max-width: 991px) {
    .header-logo {
        width: 100px;
    }

        .header-logo:after {
            margin: 0;
            content: "獨門料理雞";
        }

    #template-navbar {
        padding: 0;
        padding: 0;
    }
}

@media screen and (max-width: 750px) {
    /*********************************************
 mispig : MasterPage
*********************************************/
    #wrap {
        padding: 0;
    }

    #template-navbar {
        padding: 0;
        padding: 0;
    }

    .container {
        padding: 0;
    }

    .header-logo {
        width: 135px;
        height: 32px;
        margin: 7px 0;
        position: relative;
    }

        .header-logo:after {
            position: absolute;
            content: "獨門料理雞";
            margin: 0;
            top:5px;
            left:35px;
            font-size:.85em;
        }

        .header-logo:before {
            position: absolute;
            margin: 0;
            content: url(../../Images/logo-default-m.png);
        }



    .IndexContainerStep {
        display: none;
    }

    .IndexContainerMain {
        padding: 5px;
    }

    .IndexContainerMain1 {
        padding: 3px;
    }
    /* 4 .header styles */

    .single-header-info {
        float: right;
        padding-left: 0;
        margin-top: 5px;
    }

    #textOrderSearch {
        display: none;
    }

    .single-header-info .header-icon-box .SearchOrder {
        padding-top: 3px;
    }

    .single-header-info .header-icon-box .inner-box {
        border: 1px solid rgb(255, 255, 255);
        border-image: none;
        width: 27px;
        height: 27px;
        line-height: 25px;
        margin-right: 3px;
    }

    .single-header-info .SearchBox {
        border: 0;
        border-image: none;
        width: 0;
        height: 0;
        line-height: 0;
        margin-right: 0;
    }

    .single-header-info .icon-box .inner-box i:before {
        color: rgb(255, 255, 255);
        font-size: 100%;
    }

    .single-header-info .header-icon-box .inner-box i:before {
        font-size: 14pt;
    }

    .single-header-info .content {
        padding-top: 4px;
    }

        .single-header-info .content h3 {
            display: none;
        }

        .single-header-info .content p b {
            color: rgb(255, 255, 255);
            font-size: 1.6em;
            font-weight: 500;
        }

        .single-header-info .content div {
            margin-right: 6px;
            padding: 2px 3px;
            border: solid 1px #FFF;
            border-radius: 3px;
            background-color: #92122d;
            cursor: pointer;
            font-size: 0.85em;
        }

    .single-header-info-dislay-none {
        display: none;
    }

    .single-header-info .thm-btn {
        margin: 0;
    }

    .summary {
        display: block;
    }

    #template-footer {
        font-size: 0.6em;
        text-align: center;
        padding: 5px 0;
        margin-top: 100px;
    }

    .footer-Right {
        bottom: 35px;
        left: 50%;
        right: 50%;
        width: 280px;
        margin-left: -140px;
        margin-right: -140px;
    }

    .social-media li {
        margin-right: 3px;
    }

    .fb, .twit, .g-plus, .link {
        float: left;
        height: 60px;
        width: 60px;
        background-size: 60px 60px;
    }

        .fb:hover, .twit:hover, .g-plus:hover, .link:hover {
            background-size: 60px 60px;
        }

    #Main {
        padding-top: 120px;
    }

    .PageMain1 {
        padding-top: 46px;
    }
    /*********************************************
    mispig : Index
    *********************************************/
    /* IndexCode styles */
    .IndexForm {
        width: 100%;
    }

    .IndexForm2 {
        padding: 15px 5px;
    }

    .IndexCodeTable {
        margin: 10px 0 40px 0;
        padding-left: 0;
    }

    .IndexCode {
        float: left;
        padding: 18px 10px 0 0;
    }

    .IndexCodeTxt {
        float: left;
        margin-top: 8px;
    }

    .IndexCodeTxtWidth {
        width: 100px;
    }

    .IndexCodeCaptcha {
        float: left;
        margin: 7px 0 10px 5px;
    }

    .IndexCodeBtn {
        clear: both;
        margin-left: 65px;
    }

    .Index-btnSearch {
        margin-top: 30px;
    }

    .IndexInfoTitle {
        text-align: center;
    }

    .BnnnerBox {
        margin-top: 3px;
    }

    .IndexInfo {
        line-height: 28px;
        margin-bottom: 20px;
        padding: 10px 10px 10px 0;
        font-size: 0.95em;
        border: 5px solid #999999;
        border-radius: 15px;
        border-radius: 10px 10px;
    }

    .DeliverBoxSpace {
        margin-left: 20px;
    }

    .IndexChkDeliverNotesBox {
        width: 100%;
    }

    #formControlbtnCheckAddrBox {
        position: relative;
        height: auto;
        margin-left: auto;
    }

    #divSearchDeliverStore,
    #divDeliverStoreResultMsg {
        position: relative;
        margin-top: 15px;
    }

    .IndexChkDeliverNotesBox,
    .IndexChkDeliverNotesStoreBox {
        width: 100%;
        padding: 10px 0;
    }

        .IndexChkDeliverNotesStoreBox:before {
            left: -65px;
        }
    /**Deliver*/
    .btnDeliver {
        float: none;
        padding: 12px 5px;
        height: 75px;
        width: 100%;
    }

    .chkBoxDeliver {
        font-size: 1.3em;
    }

    .checkmark {
        left: 130px;
    }
    /* 取貨方式:外送小圖 */
    .iconDeliver:before {
        float: left;
        content: url(../../images/iconDelivery.png);
        background-image: url(../../images/iconDelivery.png);
        margin-left: 40px;
        margin-top: -5px;
    }
    /* 取貨方式:外帶小圖 */
    .iconDeliverStore:before {
        float: left;
        content: url(../../images/iconDeliveryStore.png);
        margin-left: 40px;
        margin-top: -5px;
    }

    .divDeliverStore {
        margin-left: 0;
        margin-top: 15px;
    }

    .formControlSelectRoad {
        width: 100%;
    }

    .formControlDeliverStroe {
        margin-top: 5px;
        width: 340px;
    }

    .IndexChkDeliverNotesBox .chkAddrBox {
        margin-top: 10px;
    }

    .IndexChkDeliverNotesBox .AddrRoadBox .col-lg-7 {
        padding-left: 0;
        padding-right: 0;
    }

    .IndexChkDeliverNotesBox .AddrRoadBox select {
        width: 305px;
    }
    /*********************************************
 mispig : OrderQuery
*********************************************/
    .divQueryBox {
        width: 100%;
    }

    .divbtnQueryBox input[type="button"] {
        width: 100%;
    }

    /*********************************************
    mispig : 控制項
    *********************************************/
    input[type="text"] {
        font-size: 1.5em;
        height: 45px;
    }

    /*********************************************
    mispig : Product
    *********************************************/
    .navbar-default {
        padding-top: 80px;
    }

    .Step, .Step2, .Step3, .Step4 {
        display: none;
    }

    .ProdTable {
        margin-top: 50px;
    }

    .product {
        padding: 0px 0 30px 0;
    }

        .product img {
            width: 100%;
        }

        .product .prod-div-width {
            float: none;
            width: 100%;
        }

        .product .Prod-div-Info {
            float: none;
            margin-left: 3px;
            margin-bottom: 30px;
            width: 100%;
        }

        .product .Prod-div-qty {
            width: 100%;
            float: none;
        }

        .product .Prod-food-margin {
            margin: 20px 0 10px 0;
        }

        .product .Prod-Cart {
            display: block;
            margin: 40px 0 0 95px;
            position: absolute;
        }

        .product .Prod-qty {
            font-size: 1.2em;
        }

        .product .Prod-qty-control {
            width: 80px;
        }
    /*********************************************
 mispig : Order3
*********************************************/
    .FormDataBox {
        width: 100%;
    }

    .FormTitle {
        float: left;
        width: 100%;
        padding: 5px 0;
        text-align: left;
    }

        .FormTitle > .FormStarsBox {
            float: left;
        }

        .FormTitle > .FormTitleBox {
            float: none;
        }

    .FormData {
        background-color: #eeeeee;
        padding: 5px 0;
        width: 100%;
        color: #0065b0;
        margin-bottom: 10px;
    }

    .font-color-price {
        color: #f14646;
    }

    .FromNotes {
        background-color: #eeeeee;
        color: #0065b0;
        padding: 20px;
        margin: 20px 0;
        font-size: 0.9em;
    }

    .IndexTitleBar1 {
        margin-bottom: 20px;
    }

    .FormControl {
        width: 100%;
        margin-bottom: 10px;
    }

    .FormControlAreaCode {
        width: 60px;
    }

    .FormControlTel {
        width: 150px;
    }

    .ControlDateBox {
        width: 100%;
    }

    /*-----------------------
	news & events
-----------------------*/
    .news-events ul li .inner {
        margin-bottom: 30px;
    }

    .news-events ul li .cnt-block {
        padding: 3px 10px;
    }

    .news-events ul li .price-block {
        font-size: 0.9em;
    }

    .news-events ul li .bottom-block {
        font-size: 0.85em;
    }

    .news-events ul li .date span, .news-events ul li .comment span {
        font-weight: initial;
    }

    .news-events figcaption {
        position: relative;
    }

    /* Caption Style 3 */
    .cs-style-3 figure {
        padding-bottom: 10px;
    }

        .cs-style-3 figure:hover img {
            -webkit-transform: translateY(0px);
            -moz-transform: translateY(0px);
            -ms-transform: translateY(0px);
            transform: translateY(0px);
        }

    .cs-style-3 figcaption {
        -webkit-transform: translateY(0%);
        -moz-transform: translateY(0%);
        -ms-transform: translateY(0%);
        transform: translateY(0%);
    }

    .cs-style-3 figure:hover figcaption {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        transform: translateY(0px);
    }

    /* OrderList Style 3 */
    .woocommerce .woocommerce-cart-form .woocommerce-cart-table tfoot tr td .form-coupon .form-group {
        width: 100%;
        max-width: 100%;
        margin-bottom: 15px;
        padding: 0;
    }

        .woocommerce .woocommerce-cart-form .woocommerce-cart-table tfoot tr td .form-coupon .form-group.update-cart {
            margin-top: 0;
            margin-bottom: 0;
        }

    .woocommerce .woocommerce-subtotal {
        padding: 20px 0;
    }

        .woocommerce .woocommerce-subtotal .woocommerce-subtotal-box {
            float: none;
        }

        .woocommerce .woocommerce-subtotal .woocommerce-subtotal-back {
            float: none;
            margin: 15px 0;
        }

        .woocommerce .woocommerce-subtotal .marginLeft {
            margin-left: 0;
        }

    .divSubProduct .ProdInfo {
        width: 100%;
        margin: 0px;
        background-color: #F00;
    }

    .divSubProduct .SubProdList {
        clear: both;
        margin-top: 20px;
        width: 100%;
    }

    .divSubProduct .ProdImgD {
        width: 100%;
        padding: 3px;
    }

        .divSubProduct .ProdImgD img {
            width: 100%;
            height: auto;
        }

    .divSubProduct .ProdInfo .AddProdAnimation {
        float: none;
    }

    .divSubProduct .ProdInfo .QtyBox .PriceBox, .QtyBoxBody, .AddCartBox {
        float: right;
        width: 300px;
        text-align: right;
    }

    .divSubProduct .ProdInfo .QtyBox .AddCartBox {
        clear: none;
    }
    /*********************************************
 mispig : Order4
*********************************************/
    .divSucess {
        background-color: #FFF;
        text-align: center;
        padding: 20px;
    }

        .divSucess span {
            font-size: 3em;
        }

    .FormTitleSucess {
        float: left;
        width: 100%;
        padding: 13px 0;
        text-align: left;
    }

        .FormTitleSucess:after {
            content: '';
        }

    .divOrderMasterIDTitle {
        display: inline-block;
        float: left;
        margin-top: 10px;
    }

    .divQrcodeBox {
        display: inline-block;
    }

    .divOrderMasterID {
        text-align: center;
    }

    .divOrderBankBtn {
        display: block;
    }

    .divOrderBankBtnBar {
        margin: 20px 0px;
    }
    /*********************************************
 mispig : 控制項
*********************************************/
    .btnRed {
        border: 0px;
        padding: 6px 20px;
        font-size: 1.3em;
        color: #fff;
        font-family: "Roboto","Microsoft JhengHei";
        border-radius: 5px;
        /*-moz-box-shadow: inset 0px 50px 0px -24px #f66a6b;
        -webkit-box-shadow: inset 0px 50px 0px -24px #f66a6b;
        box-shadow: inset 0px 50px 0px -24px #f66a6b;*/
        background-color: #217cb7;
        text-align: center;
    }

        .btnRed:hover {
            -moz-box-shadow: inset 0px 50px 0px -24px #cc3939;
            -webkit-box-shadow: inset 0px 50px 0px -24px #cc3939;
            box-shadow: inset 0px 50px 0px -24px #cc3939;
            background-color: #c32525;
        }

        .btnRed a {
            color: #FFF;
        }

    #MenuPath {
        display: block;
        background-color: #da2029;
        margin-bottom: 10px;
        padding-left: 20px;
        color: #FFF;
        font-size: 0.9em;
    }

    .divSerachControl {
        width: 100%;
    }

    .IndexInfo3 {
        padding: 20px 7px;
        background-color: transparent;
    }
}


@media screen and (max-width: 980px) {
    .woocommerce .woocommerce-cart-form {
        width: 100%;
    }

        .woocommerce .woocommerce-cart-form .woocommerce-cart-table {
            width: 100%;
        }

            .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr:first-child {
                border-top: 1px solid #cccccc;
            }

            .woocommerce .woocommerce-cart-form .woocommerce-cart-table thead {
                display: none;
            }

            .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr {
                display: block;
            }

                .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr td {
                    display: block;
                    text-align: right;
                    padding: 0 15px;
                    /*height: 40px;*/
                    line-height: 40px;
                }

                    .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr td:nth-child(odd) {
                        background-color: #fafafa;
                    }

                    .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr td:before {
                        display: block;
                    }

                    .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr td.product-thumbnail {
                        display: none;
                    }

                    .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr td.product-quantity input.qty {
                        width: 60px;
                        height: 28px;
                    }

                    .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr td.product-add-to-cart:before {
                        display: none;
                    }

                    .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr td.product-remove {
                        text-align: right;
                    }

                        .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody tr td.product-remove:before {
                            display: none;
                        }



            .woocommerce .woocommerce-cart-form .woocommerce-cart-table tbody td.product-remove .remove {
                margin: 10px 0;
            }

            .woocommerce .woocommerce-cart-form .woocommerce-cart-table .product-quantity, .product-price, .product-subtotal, .product-remove {
                width: auto;
            }

            .woocommerce .woocommerce-cart-form .woocommerce-cart-table .product-thumbnail {
                width: auto;
            }
}