/*** 共用 ***/

.right {
    float: right;
}

.left {
    float: left;
}

.height100 {
    height: 100%;
}

::-webkit-scrollbar {
    display: none;
}

/* 避免按到其他按鈕 */
#divGray {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: dimgrey;
    filter: Alpha(Opacity=80, Style=0);
    opacity: 0.8;
}

/* 避免按到其他按鈕 */
#UCCTOSBanner_divGray {
    z-index: 10;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: dimgrey;
    filter: Alpha(Opacity=80, Style=0);
    opacity: 0.8;
}

/* 避免按到其他按鈕 */
#LeftItemList_divGray {
    z-index: 10;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: dimgrey;
    filter: Alpha(Opacity=80, Style=0);
    opacity: 0.8;
}

/** 上方橫幅 **/
.logo {
    /*
    width: 160px;
    height: 90px;
    border: 0px solid blue;
    float: left;
    background-image: url("/CTOSC/KZ/images/logo.png");
    background-repeat: no-repeat;
    margin: 0px auto;
    background-position:left;*/
}

.subMenu {
    /*
    width: 100%;
    border: 0px solid red;
    */
}

/* 上方選單項目 */
.subMenuItem {
    border: 0px solid #8E8E8E;
    font-size: 15pt;
    font-weight: normal;
    text-align: center;
    float: left;
    padding: 1px;
    border-radius: 6px;
    margin-right: 5px;
    height: 24px;
    width: 90px;
}

/* 上方選單項目 */
.subMenuItemLabel {
    margin-top: 3px;
    margin-left: 3px;
    border-radius: 6px;
    float: left;
}

/* 上方選單項目 */
.subMenuItemButton {
    border-radius: 6px;
    float: left;
}

.color2 {
    color: Black;
    background-color: #FFCC99;
}

.color4 {
    color: Black;
    background-color: #FFCCCC;
}

.colorOk {
    color: Black;
    background-color: #FFC1E0;
}

/* desk */
.stepInActive {
    background-color: #BEBEBE;
    cursor: not-allowed;
}

.like-table {
    display: table;
}

.like-table-cell {
    height: 23px;
    display: table-cell;
    vertical-align: middle;
    width: 23px;
}

.w18 {
    width: 8px;
    border: 0px;
    padding: 0px 2px 0px 2px;
    background-color: #967459;
}

.divTopR {
    width: auto;
    float: right;
    position: relative;
    right: 5%;
}

.divOk {
    top: 80px;
    background-color: #FF9797;
    color: Black;
}

/* 換桌用 */
#divChgDesk {
    width: -webkit-calc(100% - 26px);
    top: 66px;
    background-color: White;
    position: fixed;
    font-size: 20pt;
    padding: 10px;
    padding-left: 0px;
    border-radius: 6px;
}

/* 換桌用 */
#UCCTOSBanner_divReason {
    z-index: 2100000000;
    width: -webkit-calc(100% - 80px);
    top: 66px;
    background-color: White;
    position: fixed;
    font-size: 20pt;
    padding: 10px;
    margin-left: 30px;
    border-radius: 6px;
}

/*** myOrder ***/


/* food */


.food {
    position: relative;
    border: 1px solid #8E8E8E;
    /*font-size: 1.5em;*/
    width: 252px;
    /*margin: 5px;*/
    /*float: left;*/
    height: 250px;
    background-color: White;
    padding: 5px;
    border-radius: 6px;
    /*overflow: overlay;*/
}

.pna1 {
    width: 144px;
    font-size: 20pt;
    float: left;
}

.image2 {
    border: 0px solid blue;
    width: 144px;
    margin: 0x;
    height: 112px;
    float: left;
    border-radius: 6px;
    margin-top: 4px;
}

.order {
    background-color: #36369f;
    color: White;
    width: 100%;
    height: 28px;
    font-size: 20px;
    float: right;
    font-weight: bold;
    border-radius: 6px;
    opacity: 1;
}

/* myOrderDetail */
/* 上一頁 */
.divBack {
    border: 0px solid blue;
    height: 2.6em;
    margin: 1px 1px;
}

/* 上一頁 */
.odBack {
    background-color: #0080FF;
    border-radius: 6px;
    border: 0px solid blue;
    color: white;
    float: left;
    font-size: 1.5em;
    margin: 0.1em;
    padding: 0.1em 0.5em;
    position: relative;
}

/* 點餐 */
.divfooter {
    background-color: black;
    border: 0px solid blue;
    bottom: 0;
    height: 3.5em;
    left: 0;
    position: fixed;
    width: 100%;
}

.oddivfooter {
    border: 0px solid blue;
    bottom: 0;
    height: 0em;
    left: 0;
    position: fixed;
    width: 100%;
}

.foot2 {
    background-color: black;
    border: 0px solid blue;
    height: 3.5em;
    width: 100%;
}

.PriceTop {
    color: white;
    font-size: 2.2em;
    font-weight: bold;
    left: -webkit-calc(50% - 100px);
    position: absolute;
}

/* 點餐 btn */
.addCart {
    border-radius: 6px;
    border: 0px solid blue;
    font-size: 1.5em;
    padding: 0.1em 0.5em;
    position: absolute;
    min-width: 6em;
    top: -2em;
    left: -webkit-calc(100% - 9em);
}

/* 取消修改 btn */
.CancelEdit {
    border-radius: 6px;
    border: 0px solid blue;
    font-size: 1.5em;
    padding: 0.1em 0.5em;
    position: absolute;
    min-width: 6em;
    top: -2em;
    left: 2em;
}

/* 內容區 */
.odcontent {
    border: 0px solid sliver;
    background-color: #d0d0d0;
    margin: 0px auto;
    margin-top: 4px;
    padding: 2px;
    border-radius: 6px;
    height: -webkit-calc(100% - 150px);
}

/* 中間商品說明區塊 */
.foodDesc {
    border: 0px solid red;
    margin: 1px auto;
    padding: 0px;
    border-radius: 6px;
    overflow: scroll;
    background-color: #FFFFFF !important;
    height: -webkit-calc(100% - 0em);
}

/* 商品說明區塊 子區塊 */
.fcont1 {
    border: 0px solid red;
    position: relative;
    width: 100%;
    padding: 0px;
    margin: 0px auto;
    height: 290px;
    overflow: hidden;
}

/* 商品說明區塊 子子區塊 */
.fcont12 {
    border: 0px solid green;
    position: absolute;
    left: 0px;
    top: 0px;
    padding: 2px;
    width: 370px;
    height: 100%;
}

/* 商品名稱 */
/* 商品desc */
/* 商品說明區塊 口味、加料 */
.fcont13 {
    border: 1px solid green;
    position: absolute;
    left: 400px;
    top: 250px;
}

/* 商品口味按鈕 */
.masterFlavor {
    position: absolute;
    left: 850px;
    top: 1em;
}

/* 商品加料按鈕 */
.masterFeedIn {
    position: absolute;
    left: 850px;
    top: 5.5em;
}

.flavorDesc {
    font-size: 1.5em;
    width: -webkit-calc(100% - 900px);
    text-align: left;
    border: 0px solid black;
    position: absolute;
    left: 870px;
    top: 9.5em;
}

/* 商品說明區塊 子子區塊 */
.fcont14 {
    border: 0px solid green;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 390px;
    height: 260px;
    margin-left: 450px;
}

/* 商品圖 */
.odfoodimg {
    border: 0px solid blue;
    width: 100%;
    margin-top: 20px;
    border-radius: 6px;
}

/* 商品說明區塊 子區塊 */
.fcont2 {
    border: 0px solid blue;
    width: 100%;
    margin: 0px auto;
    height: -webkit-calc(100% - 22em);
}

/* 商品價格 */
.foodPrice2 {
    font-size: 15pt;
}

/* 已點餐點清單區塊 */
.flist1 {
    border-top: 2px dashed darkgreen;
    height: 2px;
    width: 100%;
}

.foodName2 {
    border: 0px solid blue;
    font-size: 1.5em;
    width: 100%;
    text-align: left;
    float: left;
    padding-left: 5px;
}

/* 附餐區塊 */
.odSubMeal {
    border: 0px solid darkgray;
    float: left;
    text-align: left;
    margin: 0.5em 0em 0em 0.5em;
    background-color: lightgray;
}

/* meal pic*/
.odPhotoS {
    float: left;
    width: 60px;
    height: 60px;
    margin-right: 1em;
    border: 1px solid darkgray;
}

/* meal pic*/
.odPhotoSChg {
    width: 60px;
    height: 60px;
    margin-right: 1em;
    border: 1px solid darkgray;
}

.MealName {
    float: left;
    font-size: 34px !important;
    color: #000000 !important;
    margin-right: 1em;
    margin-top: 0em;
}

/* 換菜 btn */
.chgMeal {
    float: left;
    background-color: #26629C !important;
    border-radius: 6px;
    font-size: 40px !important;
    margin-right: 0.3em;
    margin-top: 0em;
    padding: 0 5px;
    text-align: center;
    color: #FFFFFF !important;
}

.meallist {
    overflow: scroll;
    width: 100%;
    height: -webkit-calc(100% - 0px);
}

/* 刪商品清單的按鈕 */
.CancleC1 {
    height: 12px;
    display: none;
}

#ddlPCount {
    font-size: 14pt;
    width: auto;
}

#forChange {
    display: block;
    width: -webkit-calc(100% - 4em);
    top: -webkit-calc(10%);
    background-color: White;
    position: fixed;
    font-size: 16pt;
    padding: 10px;
    padding-left: 0px;
    border-radius: 6px;
    margin: 2em;
}

/* 確定點餐 */
.oook {
    position: relative;
    width: 180px;
    height: 50px;
    background-color: #FF9797;
    border: 0px solid blue;
    border-radius: 6px;
    margin: 0px 5px 5px 0px;
    font-size: 30pt;
    color: White;
    left: 200px;
    top: -45px;
    padding: 2px 10px 2px 10px;
}

/* 取消點餐 */
#btnCancleF {
    display: none;
    position: relative;
    top: -100px;
    left: 260px;
}



/* 確定點餐 */
.oook {
    position: relative;
    width: 180px;
    height: 50px;
    border: 0px solid blue;
    border-radius: 6px;
    margin: 0px 5px 5px 0px;
    font-size: 22pt;
    left: 310px;
    top: -90px;
    padding: 2px 10px 2px 10px;
}



/* 取消點餐 */
.ooCancel {
    position: relative;
    height: 25px;
    background-color: silver;
    color: white;
    border: 0px solid blue;
    float: left;
    border-radius: 6px;
    margin: -6px 5px -2px 0px;
    font-size: 15pt;
    padding: 2px 10px 2px 10px;
}

.chglist {
    width: 24px;
    height: 24px;
    padding-bottom: 12px;
}

/* radio button list */
input[type=checkbox]:not(old),
input[type=radio]:not(old) {
    width: 18px;
    height: 18px;
    margin-left: 15px;
}

/* 確定換菜 */
.okChangeMeal {
    width: 180px;
    height: 30px;
    background-color: #0080FF;
    border: 0px solid blue;
    border-radius: 6px;
    margin: 0px 5px 5px 0px;
    font-size: 20pt;
    color: White;
    padding: 2px 10px 2px 10px;
}

/* 確定換菜 */
.cancelChangeMeal {
    width: 180px;
    height: 30px;
    border: 0px solid blue;
    border-radius: 6px;
    margin: 0px 5px 5px 0px;
    font-size: 20pt;
    color: #0080FF;
    padding: 2px 10px 2px 10px;
}

/* 口味 btn */
.flavor {
    float: left;
    border-radius: 6px;
    font-size: 1.8em;
    margin: 0em 0.3em;
    padding: 0 5px;
    text-align: center;
}

#forFeedIn {
    display: block;
    width: -webkit-calc(100% - 4em);
    top: -webkit-calc(10%);
    background-color: White;
    position: fixed;
    font-size: 16pt;
    padding: 10px;
    padding-left: 0px;
    border-radius: 6px;
    margin: 2em;
}

.mealflavor {
    font-size: 1em;
}

.cbflavor {
    border: 0px solid blue;
    font-size: 1em;
    text-align: left;
    min-width: 100px;
}

/* "喜好" 的選項 */
.cbfeedIn {
    border: 3px solid lightgray;
    padding: 0.7vh;
    font-size: 3vw;
    text-align: left;
    /*min-width: 20vw;
     max-width: 20vw;*/
    width: 20vw;
    border-radius: 2vh;
    display: inline-block;
}

.c-pink {
    background-color: #FF3399 !important;
    color: #000000 !important;
    font-size: 40px !important;
}

.c-orange {
    background-color: #ff6633;
    color: black;
}

/* MyOrderList */
.divLeft2 {
    float: Left;
    width: -webkit-calc(100% - 112px);
    padding: 4px;
    border: 0px solid black;
    height: 46px;
    background-color: white;
    border-radius: 6px;
    overflow: hidden;
    font-size: 15pt;
}

.divLeft3 {
    width: -webkit-calc(100% - 20px);
    padding: 10px;
    border: 0px solid black;
    height: -webkit-calc(100% - 78px);
    background-color: #FFFFFF !important;
    border-radius: 6px;
    overflow: scroll;
    font-size: 16pt;
    position: relative;
    top: 1%;

}

.divLeft4 {
    width: 180px;
    height: 30px;
    position: relative;
    top: 4%;
    left: 65%;
}

/**/
.flist5 {
    border-top: 2px dashed darkgreen;
    width: -webkit-calc(100% + 8px);
    height: auto;
    margin-bottom: 5px;
    overflow: hidden;
    margin-left: -4px;
    margin-top: -4px;
}

.pna1 {
    border: 0px solid blue;
    font-size: 15pt;
    width: 144px;
    height: 100%;
    float: left;
    margin-left: 2px;
}

.pprice1 {
    float: right;
    font-size: 15pt;
    border: 0px solid green;
    font-weight: bold;
    margin-right: 4px;
}

.ul1 {
    float: left;
    width: -webkit-calc(100% - 240px);
    text-align: left;
    border: 0px solid green;
    margin-top: 0px;
    margin-left: -10px;
}

.li1 {
    width: 100%;
    text-align: left;
    border: 0px solid green;
    font-size: 15pt;
}

.chglist {
    text-align: left;
}

.editProd {
    background-color: #0080FF;
    border: 0px solid blue;
    float: right;
    border-radius: 6px;
    margin: 5px -4px 0px 8px;
    font-size: 14pt;
    color: White;
    padding: 2px 10px 2px 10px;
    position: relative;
    bottom: 5px;
}





.ddLangListItem {
    font-size: x-large;
    background-color: white;
    color: black;
    font-family: 微軟正黑體;
}

.BannerLabel {
    font-size: 22px !important;
    background-color: transparent;
    color: #FFFFFF !important;
    font-family: 微軟正黑體;
}

#divBackGray {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: dimgrey;
    filter: Alpha(Opacity=80, Style=0);
    opacity: 0.8;
}

#divDeskIPMatch {
    width: 100%;
    width: -webkit-calc(100% - 26px);
    top: 66px;
    background-color: White;
    position: fixed;
    font-size: 20pt;
    padding: 10px;
    padding-left: 0px;
    border-radius: 6px;
}

#ChkIpIsTrue {
    width: 100%;
    width: -webkit-calc(100% - 26px);
    top: 66px;
    background-color: White;
    position: fixed;
    font-size: 20pt;
    padding: 10px;
    padding-left: 0px;
    border-radius: 6px;
}

.ChkIpIsTrueText {
    font-size: 16pt;
    color: Blue;
}

.DeskIPMatchLabel {
    font-size: 16pt;
}

.DeskIPMatchText {
    border-radius: 4px;
    font-size: 16pt;
    width: 250px;
    width: -webkit-calc(100% - 92px);
}

.DeskIPMatchText2 {
    border-radius: 4px;
    font-size: 16pt;
    width: 250px;
    width: -webkit-calc(100% - 88px);
}

.box1 {
    background: linear-gradient(to left bottom,
            transparent 50%,
            rgba(0, 0, 0, 0.4) 0) no-repeat 100% 0 / 1.42em 1.42em,
        linear-gradient(-135deg, transparent 1em, #5588aa 0);
}

.amt1 {
    font-size: 2em;
    color: White;
    margin-right: 0.5em;
    margin-left: 0.5em;
    border: 0px solid white;
}

.not-allowed {
    cursor: not-allowed;
}

#divDeskIPMatch {
    z-index: 100;
}

#ChkIpIsTrue {
    z-index: 100;
}

#cblFlavor td {
    text-align: left;
}

#cblFeedIn td {
    text-align: left;
}

.FlavorList {
    font-size: 1em;
    margin-bottom: 0.5em;
    padding-bottom: 1em;
    /*border-bottom: 1px solid gray;*/
    text-align: left;
}

.ExHeader {
    position: absolute;
    margin: 8px;
    padding: 2px;
    background: burlywood;
    width: -webkit-calc(100% - 60px);
    height: -webkit-calc(100% - 120px);
}

.AllRadius {
    border-radius: 5px;
}

.ExlblTitle {
    font-size: 30px;
    text-align: left;
    color: White;
    top: 16px;
    position: fixed;
    left: 86px;
}

.OrderListFont {
    font-size: 22px !important;
    color: #000000 !important;
}

.OrderListFontSmall {
    font-size: calc(100% - 6px) !important;
    color: Black !important;
}

.Button2nd {
    background-color: #0080FF !important;
    font-size: 30px !important;
    color: #FFFFFF !important;
}

.Button3rd {
    background-color: #0080FF !important;
    font-size: 30px !important;
    color: #FFFFFF !important;
}



a:active {
    color: Orange;
}

a:link,
a:visited {
    text-decoration: none;
    /*background-color:black;
color: White;*/
}

.stepDesc {}

.ExHeader {
    position: absolute;
    margin: 8px;
    padding: 2px;
    background: white;
    width: -webkit-calc(100% - 20px);
    height: 80%;
    top: 12.5%;
}

.AllRadius {
    border-radius: 5px;
}