
html {
    font-size: 18px;
    font-family: 'Microsoft JhengHei','Noto Sans TC','DFKai-SB','sans-serif'
}

.v-center {
    display: block;
    align-content: center;
    -webkit-align-content: center;
    align-items: center;
    -webkit-align-items: center;
}

input[type=checkbox] {
    accent-color: #66976e;
}

.text_justify {
    text-align-last: justify;
    text-align: justify;
}

.shopping-table {
    table-layout: fixed;
    font-size: 14px;
    word-wrap: break-word;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bg-shoppingcart {
    --bs-bg-opacity: 1;
    background-color: #f08300 !important;
}

.shoppingcart {
    color: #f08300;
}

.btn-shoppingcart {
    color: #fff;
    background-color: #f08300;
    border-color: #f08300;
}

.btn-green {
    color: white;
    background-color: #66976e;
    border: none;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    font-size: 12px;
}

.btn-green2 {
    color: white;
    background-color: #66976e;
    text-align: center;
    display: inline-block;
    cursor: pointer;
}

.btn-black {
    color: white;
    background-color: black;
    border: none;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    font-size: 12px;
}

.btn-green:disabled {
    color: #fff;
    background-color: #66976e;
}

.btn-green:hover {
    color: #fff;
    background-color: #66976e;
    border-color: #66976e;
}

.btn-green2:hover {
    color: #fff;
    background-color: #66976e;
    border-color: #66976e;
}

.btn-shoppingcart:hover {
    color: #fff;
    background-color: #f08300;
    border-color: #f08300;
}
.btn-check:focus + .btn-shoppingcart, .btn-shoppingcart:focus {
    color: #fff;
    background-color: #f08300;
    border-color: #f08300;
    box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
}
.btn-shoppingcart:disabled, .btn-shoppingcart.disabled {
    color: #fff;
    background-color: #f08300;
    border-color: #f08300;
}

.shake {
    animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    transform: translate3d(0, 0, 0);
}

@keyframes shake {
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }

    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}

.form-control2 {
    margin-top: 5px;
    margin-bottom: 5px;
}

.ordertablefont {
    font-family: 'Microsoft JhengHei','sans-serif','DFKai-SB';
    font-size: 15px;
}

.stdfont {
    font-family: 'Noto Sans TC', 'Microsoft JhengHei','sans-serif','DFKai-SB';
}

.greengcolor {
    color: #66976e;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.font-13size {
    font-size: 13px;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    position: relative;
    min-height: 100vh;
    background-image: url(/images/home/body_bg.png)
}

body.no-scroll {
    overflow:hidden;
    height:100vh !important;
}

footer {
    position: static;
    top: 100vh;
}
input[type=file]:disabled, input[type=radio]:disabled {
    cursor: not-allowed;
    pointer-events: all !important;
}

.text-gray {
    color: gray
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.ng-invalid {
    border-color: lightpink;
    outline-color: lightpink;
    background-color: #eff4ff;
}

.ng-valid {
    border-color: green;
    outline-color: green;
}

select {
    text-align: center;
    text-align-last: center;
}

input[type=number] {
    -moz-appearance: textfield;
}

.blink {
    animation-duration: 1s;
    animation-name: blink;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}

a {
    cursor: pointer;
}

select:disabled {
    cursor: not-allowed;
    pointer-events: all !important;
}

button:disabled {
    cursor: not-allowed;
    pointer-events: all !important;
}

@keyframes blink {
    0% {
        opacity: 1;
    }

    80% {
        opacity: 1;
    }

    81% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

input[type=checkbox] {
    -moz-transform: scale(2);
    -webkit-transform: scale(2);
    -o-transform: scale(2);
    padding: 10px;
}

.spcfont {
    font-weight: bold;
    font-family: 'Microsoft JhengHei UI','DFKai-SB'
}

.none {
    display: none;
}

.div_HW_center {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    border: 0;
}
.h-center {
    display: flex;
    justify-content: center;
    padding: 0;
    border: 0;
}

.Quot {
    position: fixed;
    width: 520px;
    height: 7rem;
    left: 80px;
    background-color: ghostwhite;
}


.bottom0 {
    bottom: 100px;
}

.nav-pills .nav-link {
    background: none;
    border: 0;
    border-radius: 0.25rem;
}

#tab_content .nav-link {
    display: block;
    padding: 0.5rem 1rem;
    color: black;
    text-decoration: none;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.btn-outline-green {
    color: #66986e;
    border-color: #66986e;
}

.BgColor {
    background-color: #66986e;
}

.btn-outline-green:hover {
    color: #000;
    background-color: #66986e;
    border-color: #66986e;
}
/*Goto Top*/
#toTop {
    display: none;
    text-decoration: none;
    position: fixed;
    bottom: 60px;
    right: 10px;
    overflow: hidden;
    width: 115px;
    height: 195px;
    border: none;
    text-indent: -999px;
    background: url(../images/TOP-05.png) no-repeat left top;
}

    #toTop:active, #toTop:focus {
        outline: none
    }
    #toTop:hover {
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }

#_sub ul li a :hover {
    border-bottom: 2px solid #ae9489;
}
.EngFont {
    font-family: Georgia;
    font-weight: bold;
    font-size: 13px;
}
.Color-717071 {
    color: #898989;
}

.Color-727171 {
    color: #727171;
}

.Color-ae9489 {
    color: #ae9489;
}

.Color-d3d3d3 {
    color: #d3d3d3;
}

.nav-pills2 .nav-link {
    background: none;
    border: 0;
}

    .nav-pills2 .nav-link.active,
    .nav-pills2 .show > .nav-link {
        background: white;
        opacity: 0.7;
        border-bottom: 3px solid #ae9489;
    }

a {
    text-decoration: none;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
}
.btn-Reset {
    color: #727171;
    background-color: #c9caca;
    border-color: #c9caca
}

.breadcrumb a:hover {
    text-decoration: none;
    background: none;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    color: #aaabaa;
}
.breadcrumbfontsize {
    font-size: 22px;
    --bs-breadcrumb-divider: '>';
}
.breadcrumbbotomLine {
    height: 5px;
    width: 100%;
    background-color: #66976e;
    margin-top: -14px;
}

.std_a_color a {
    text-decoration: none;
    color: #717171;
}

    .std_a_color a:hover {
        text-decoration: none;
        color: #66976E;
        
    }

