.member-background{
    background: var(--ThemeBackground);
    /*-webkit-background-size: cover;*/
    /*-moz-background-size: cover;*/
    /*-o-background-size: cover;*/
    /*background-size: auto;*/
    height: 100%;
    position: absolute;
    width: 100%;
    overflow: hidden;
}
.member-site-main{
    background: var(--ThemeBackground);
    position: fixed;
    height: 100%;
    width: 100%;
}

.slick-dots li.slick-active button:before {
    color: whitesmoke;
}
.slick-dots li button:before {
    color: whitesmoke;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes menu-open-animate {
    from {height: 0;}
    to {height: 280px;}
}

/* Standard syntax */
@keyframes menu-open-animate {
    from {height: 0;}
    to {height: 280px;}
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes menu-close-animate {
    from {height: 280px;}
    to {height: 0;}
}

/* Standard syntax */
@keyframes menu-close-animate {
    from {height: 280px;}
    to {height: 0;}
}

/********************* 上下拉動畫 標準板 *********************/
/* Safari 4.0 - 8.0 */
@-webkit-keyframes drop-down-animate {
    from {height: 2rem;}
    to {height: 12rem;}
}
/* Standard syntax */
@keyframes drop-down-animate {
    from {height: 2rem;}
    to {height: 12rem;}
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes drop-up-animate {
    from {height: 12rem;}
    to {height: 2rem;}
}
/* Standard syntax */
@keyframes drop-up-animate {
    from {height: 12rem;}
    to {height: 2rem;}
}
/**********************************************************/

/********************* 上下拉動畫 圖表板 *********************/
/* Safari 4.0 - 8.0 */
@-webkit-keyframes drop-down-animate-chart {
    from {height: 0;}
    to {height: 600px;}
    /*to {height: 11rem;}*/
}
/* Standard syntax */
@keyframes drop-down-animate-chart {
    from {height: 0;}
    to {height: 600px;}
    /*to {height: 11rem;}*/
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes drop-up-animate-chart {
    from {height: 600px;}
    to {height: 0;}
}
/* Standard syntax */
@keyframes drop-up-animate-chart {
    from {height: 600px;}
    to {height: 0;}
}
/**********************************************************/

@media only screen and (min-width : 320px) and (max-width : 767px) {

    /********************* 上下拉動畫 標準板 *********************/
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes drop-down-animate {
        from {height: 0;}
        to {height: 25rem;}
    }
    /* Standard syntax */
    @keyframes drop-down-animate {
        from {height: 0;}
        to {height: 25rem;}
    }
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes drop-up-animate {
        from {height: 25rem;}
        to {height: 0;}
    }
    /* Standard syntax */
    @keyframes drop-up-animate {
        from {height: 25rem;}
        to {height: 0;}
    }
    /**********************************************************/

    /********************* 上下拉動畫 圖表板 *********************/
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes drop-down-animate-chart {
        from {height: 0;}
        to {height: 800px;}
    }
    /* Standard syntax */
    @keyframes drop-down-animate-chart {
        from {height: 0;}
        to {height: 800px;}
    }
    /* Safari 4.0 - 8.0 */
    @-webkit-keyframes drop-up-animate-chart {
        from {height: 800px;}
        to {height: 0;}
    }
    /* Standard syntax */
    @keyframes drop-up-animate-chart {
        from {height: 800px;}
        to {height: 0;}
    }
    /**********************************************************/
}

.odt-anim-open {
    animation-name: menu-open-animate;
    animation-duration: 0.3s;
    animation-fill-mode: forwards;
}
.odt-anim-close {
    animation-name: menu-close-animate;
    animation-duration: 0.3s;
    animation-fill-mode: both;
}

/* 服務平台->設備詳細資訊的下拉動畫 標準板 */
.odt-device-detail-anim-drop-down {
    animation-name: drop-down-animate;
    animation-duration: 0.3s;
    animation-fill-mode: forwards;
}
.odt-device-detail-anim-drop-up {
    animation-name: drop-up-animate;
    animation-duration: 0.3s;
    animation-fill-mode: both;
}
/* 服務平台->設備詳細資訊的下拉動畫 統計板 */
.odt-device-detail-with-chart-anim-drop-down {
    animation-name: drop-down-animate-chart;
    animation-duration: 0.3s;
    animation-fill-mode: forwards;
}
.odt-device-detail-with-chart-anim-drop-up {
    animation-name: drop-up-animate-chart;
    animation-duration: 0.3s;
    animation-fill-mode: both;
}

.odt-application-content{
    overflow: auto;
    box-shadow: var(--ThemePopupShadow);
    background-color: var(--ThemeContainer);
    border-radius: .5rem;
    padding: 1rem;
    max-width: 1200px;
    width: 100%;
    margin: 1rem auto;
}
.odt-application-grid {
    display: grid;
    height: fit-content;
    padding: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(300px, auto));
    grid-template-rows: repeat(auto-fill, minmax(250px, auto));
    grid-gap: 1rem;
}
.odt-member-application {
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: var(--ThemePopupShadow);
    background: var(--ThemeContainer);
}
.odt-member-application-icon {
    text-align: center;
    align-self: center;
}
.odt-member-application-server-state {
    height: fit-content;
    text-align: end;
}
.odt-member-application-option {
    /*border-bottom: var(--ThemeDivider) 1px solid;*/
    color: var(--ThemeButton1Color);
    align-self: center;
    padding: 1rem 0;
    cursor: pointer;
}
.odt-member-application-option:hover {
    color: var(--ThemeHover1);
    /*filter: drop-shadow(4px 4px 2px black);*/
}
.odt-member-cart{
    margin: unset;
    overflow: auto;
    /*height: calc(100vh - 120px);*/
    /*background-color: rgba(0, 0, 0, 0.8);*/
    position: inherit;
}
.odt-member-cart-list{
    max-width: 1400px;
    margin: auto;
    position: inherit;
}
.odt-member-cart-check-out{
    position: inherit;
}
.odt-member-nav-bar-dropdown{
    display: contents;
    float: left;
    overflow: hidden;
}
.odt-member-nav-bar-drop-btn{
    display: none;
}
.odt-member-nav-bar-dropdown-content {
    display: contents;
    height: auto;
    overflow-y: hidden;
    position: unset;
    background-color: transparent;
    min-width: 160px;
    z-index: 1;
}
.odt-member-nav-bar-dropdown-content a {
    text-decoration: none;
}
.odt-member-nav-drop-btn-title {
    display: none;
    color: var(--ThemeLabelColor);
    vertical-align: text-top;
}
.nav-sign-out-tab{
    /*margin-left: auto;*/
    margin-right: 1rem;
    align-self: center;
    font-size: x-large;
    cursor: pointer;
    height: 100%;
}

.odt-member-mail{
    margin: unset;
    background-color: transparent;
    /*word-break: break-all;*/
    overflow: hidden;
    text-overflow: ellipsis;
}

.odt-member-card{
    background: transparent;
    border-width: 0;
    position: inherit;
}
#cart-equal-checkbox{
    width: 20px;
    height: 20px;
}
.product-overview-img{
    max-width: 100%;
    max-height: 100%;
}
.store-nav-tab-content{
    margin-top: 16px;
}
.store-product-overview-img{
    text-align: center;
}
.cart-checkout-total-font{
    font-size: 18px;
    color: #ffc312;
}
.cart-quantity-input{
    max-width: 60px;
    font-size: 18px;
    margin: auto;
    text-align: center;
    color: var(--ThemeColor);
    background: transparent;
}
.cart-quantity-input:focus, .cart-quantity-input.active{
    background: transparent;
    font-size: 18px;
    color: var(--ThemeColor);
}
.cart-row{
    align-self: center;
    text-align: center;
    position: inherit;
}
.cart-row-remove{
    max-width: 60px;
    max-height: 60px;
    margin: auto;
    background: transparent;
    cursor: pointer;
    position: inherit;
}
.cart-row-product-icon {
    max-width: 200px;
    height: 150px;
    margin: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: inherit;
}
.cart-empty {
    font-size: 24px;
    color: var(--ThemeLabelColor);
    text-align: center;
}

/* Tags style*/
.nav-tabs .nav-link.active {
    /*color: var(--ThemeLabelColor);*/
    /*background-color: var(--ThemeBackground);*/
    /*border-color: #dee2e6 #dee2e6 transparent;*/
}
.odt-member-tab-content-sub{
    /*background-color: rgba(0, 0, 0, 0.8);*/
    /*overflow: auto;*/
    /*height: calc(100vh - 270px);*/
    background-color: var(--ThemePop);
    box-shadow: 6px 6px 6px rgb(0 0 0);
    border-radius: 2vh;
}
.odt-member-nav-app-content-card-form{
    color: var(--ThemeColor);
    border-bottom: var(--ThemeTableDivider) solid 1px;
    max-width: 1200px;
    /*margin-top: 1rem;*/
    margin-left: auto;
    margin-right: auto;
    /*padding: 12px;*/
    /*background: transparent;*/
}
.odt-member-nav-cart-content-body{
    border-bottom: 1px solid white;
    position: inherit;
}
.odt-member-nav-cart-content-footer{
    text-align: end;
    position: inherit;
    padding: 1rem;
    background: unset;
    border-top: unset;
}
.odt-member-nav-cart-content-form{
    max-width: 1400px;
    margin-top: 24px;
    margin-left: auto;
    /*margin-right: auto;*/
    /*padding: 2rem;*/
    background: transparent;
    position: inherit;
}
.odt-cart-row{
    position: inherit;
    padding: 0 1rem;
}

@keyframes drop {
    0% {
        max-height: 0;
    }
    100% {
        max-height: 100%;
    }
}
@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fade-out {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
.truncate {
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.odt-member-container {
    overflow: auto;
    opacity: 0;
    height: 100%;
    /* init main page animate from 0 to 100% need setup "max-height" to 0 */
    /*max-height: 0;*/
    background-color: var(--ThemeBackground) !important;
    animation: fade-in 0.5s forwards 0.5s;
}
.odt-member-nav {
    display: flex;
    /*grid-template-rows: 10% 80% 10%;*/
    /*grid-template-columns: 100%;*/
    user-select: none;
    /*height: 100%;*/
    /*max-width: 200px;*/
    /*border-right: 1px var(--ThemeDivider) solid;*/
    border-bottom: 1px var(--ThemeDivider) solid;
}
.odt-member-nav-logo {
    /*width: 100%;*/
    /*padding-right: 1rem;*/
    /*border-bottom: 1px var(--ThemeDivider) solid;*/
    color: var(--ThemeLabelColor);
    font-size: 3vh;
    display: flex;
    /*height: 100%;*/
    align-items: center;
}
.odt-member-nav-logo-text {
    display: unset;
}
.odt-member-nav-menu {
    align-items: center;
    /*display: grid;*/
    /*grid-template-rows: repeat(auto-fit, 7vh);*/
    /*row-gap: 1vh;*/
    /*border-bottom: 1px var(--ThemeDivider) solid;*/
}
.odt-member-nav-account {
    overflow: auto;
    margin-right: 0;
    margin-left: auto;
    text-align: end;
    padding: 1rem;
    cursor: pointer;
    font-size: 12px;
    align-self: center;
    color: var(--ThemeButton1Color);
    /*border-bottom: 1px var(--ThemeDivider) solid;*/
    background: unset;
}
.odt-member-nav-account:focus, .odt-member-nav-account.active{
    /*box-shadow: 0 0 6px var(--StripeBlue);*/
    /*background: var(--ThemeButton1Background);*/
    /*filter: drop-shadow(4px 4px 2px black);*/
}
.odt-member-nav-sub{
    margin: 0 2rem;
    /*background-color: rgba(0, 0, 0, 0.8);*/
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
/* 母項目 - dashboard 上面的選項 */
.nav-item-dashboard {
    display: flex;
    height: fit-content;
    padding: .5rem 1rem;
    color: var(--ThemeButton1Color);
}
.nav-item-dashboard:hover {
    text-decoration: none;
    color: var(--ThemeHover1);
}
.nav-item-dashboard:focus, .nav-item-dashboard.active {
    background: var(--ThemeButton1Background);
    border-radius: 12px;
}
/* 子項目 - 服務平台、訂單列表 */
.nav-link-1 {
    padding: 1rem;
    color: var(--ThemeColor);
    background-color: transparent;
    text-decoration: none;
    height: fit-content;
    align-self: center;
}
.nav-link-1:hover{
    color: var(--ThemeHover1);
}
.nav-link-1:focus, .nav-link-1.active{
    color: var(--ThemeHover1);
    border-bottom: var(--StripeBlue) 4px solid;
}

.odt-nav-link{
    /*border-radius: 6px;*/
    padding: 1rem;
    color: var(--ThemeColor);
    background-color: transparent;
    text-decoration: none;
    height: fit-content;
    align-self: center;
}
.odt-nav-link:hover{
    color: var(--ThemeHover1);
}
.odt-nav-link:focus, .odt-nav-link.active{
    color: var(--ThemeHover1);
    /*background: var(--ThemeContainer);*/
    border-bottom: var(--StripeBlue) 4px solid;
}
.odt-member-content {
    height: 100%;
    background: var(--ThemeBackground);
}
.odt-member-content-sub {
    background: var(--ThemePop);
    border-radius: 1vh;
    word-break: break-word;
    padding: 2rem;
}
.odt-member-nav-tab {
    height: 100%;
}
.odt-member-content-nav-tab {
    height: 100%;
    color: var(--ThemeColor);
    /*background: var(--ThemeContainer);*/
}
@keyframes overflowDelay {
    from {
        overflow-y: unset;
    }
    to {
        overflow-y: auto;
    }
}
.odt-member-container-box{
    /*padding: 0 3% 0;*/
    width: 100%;
    height: auto;
    float: left;
    margin-bottom: 2rem;
    /*animation-name: overflowDelay;*/
    /*animation-delay: 2s;*/
    /*animation-fill-mode: forwards;*/
}
.odt-member-all-application-nav{
    text-align: center;
    font-size: x-large;
}
.odt-member-user-container-box{
    color: var(--ThemeColor);
    height: fit-content;
    /*max-height: calc(100vh - 190px);*/
    border-bottom: 1px var(--ThemeDivider) solid;
}
.odt-member-app-nav{
    /*border-bottom: white solid 1px;*/
    padding: 1rem .5rem;
    /*margin-top: 1rem;*/
    margin: unset;
}
.odt-member-app-nav-object{
    display: grid;
    text-align: center;
    font-size: larger;
    min-height: 160px;
    position: inherit;
}
.odt-member-app-obj-btn{
    cursor: pointer;
    border-radius: 1rem;
    align-content: center;
}
.odt-member-app-obj-btn:hover{
    /*box-shadow: 0 0 12px 0 rgba(208, 223, 226, 0.3), 0 0 16px 0 rgba(0,123,255,.25);*/
    /*background-color: rgba(75, 86, 105, 0.3);*/
}
.odt-member-app-obj-click{
    cursor: pointer;
    border-radius: 1rem;
    align-content: center;
}
.odt-member-app-nav-icon{
    height: 110px;
    object-fit: scale-down;
    justify-self: center;
}
.odt-member-app-nav-license{
    height: 110px;
    font-size: 6rem;
    font-family: monospace;
}
.odt-member-app-nav-user-plan{
    height: 110px;
    padding: 1rem;
}
.odt-member-search-bar-container{
    /*margin-top: 2rem;*/
    position: inherit;
}
.odt-member-search-bar-input{
    width: 90%;
    height: 2rem;
    background: transparent;
    border: 0;
    border-bottom: var(--ThemeTableDivider) solid 1px;
    color: var(--ThemeColor);
}
.odt-member-search-bar-button{
    width: 10%;
    /*height: 2rem;*/
    font-size: x-large;
    background: transparent;
    color: var(--StripeBlue);
    opacity: 1;
    border: 0;
    cursor: pointer;
}
.odt-member-search-bar-button:hover{
    color: var(--StripeBlue);
    opacity: 0.5;
}
.odt-member-input-required{
    border-color: #ff4343;
    border-width: 2px;
}
.odt-dashboard-device-title{
    padding: 12px;
    font-size: 30px;
    color: #4daf7c;
}
.odt-dashboard-app-device-delete{
    font-weight: bold;
    margin: auto;
    width: fit-content;
    height: 70%;
    color: var(--AlertRed);
    background-color: rgba(185, 198, 195, 0.2);
    padding: 1rem .75rem;
}
.odt-dashboard-app-device-delete:hover, .odt-dashboard-app-device-delete:active {
    color: white;
    background-color: var(--AlertRed);
}
.odt-dashboard-app-device-close{
    font-weight: bold;
    margin: auto;
    width: fit-content;
    color: var(--StripeBlue);
    background-color: rgba(208, 223, 226, 0.2);
    padding: 1rem .75rem;
}
.odt-dashboard-app-device-close:hover, .odt-dashboard-app-device-close:active {
    background-color: rgba(208, 223, 226, 0.3);
}
.odt-dashboard-app-content-table-cell-detail-close {
    width: 100%;
    color: var(--ThemeButton1Color);
    border-radius: 1vh 1vh 0 0;
}
.odt-dashboard-app-content-table-cell-detail-close:hover, .odt-dashboard-app-content-table-cell-detail-close:active {
    color: var(--ThemeHover1);
}
.odt-member-app-text-layout{
    /*width: 100%;*/
    height: 100%;
    text-align: center;
    word-break: break-all;
    /*padding: 1rem .5rem;*/
    padding: unset;
    margin: auto;
    position: inherit;
}
.odt-member-app-text-main{

}
.odt-member-app-text-key{

}
.odt-member-app-text-value{
    word-break: keep-all;
}
.odt-member-app-text-label{
    margin-top: 1rem;
    color: var(--ThemeLabelColor);
    font-weight: bold;
    /*font-size: 2vh;*/
}

/* odt member store product nav css*/
.odt-member-products-nav {
    display: flex;
    align-items: center;
    height: 100%;
    border-bottom: var(--ThemeDivider) 1px solid;
    font-size: 3vh;
    padding-bottom: 1rem;
}
.odt-member-product-slider-img {
    max-width: 400px;
    max-height: 400px;
    object-fit: scale-down;
    /*height: 25vh;*/
    margin: auto;
}
.odt-member-store-product-nav{
    /*margin-top: 5%;*/
    background-color: transparent;
    /*padding: 1rem;*/
}
.odt-member-store-product-nav-item{
    height: fit-content;
    width: fit-content;
    /*min-width: 125px;*/
    text-align: center;
    border-radius: 1vh 1vh 0 0;
    padding: 1rem 1rem;
    color: #f3f3f3;
    background-color: transparent;
    font-size: 2vh;
    /*margin-top: 8px;*/
    /*margin-left: 1rem;*/
    cursor: pointer;
}
.odt-member-store-product-nav-item:hover{
    color: rgb(77, 175, 124);
    text-decoration: none;
}
.odt-member-store-product-nav-item:focus, .odt-member-store-product-nav-item.active{
    color: rgb(77, 175, 124);
    background-color: var(--ThemePop);
}
.odt-member-store-product-nav-item-previous{
    height: fit-content;
    width: fit-content;
    text-align: center;
    border-radius: .25rem;
    padding: 1rem 2rem;
    color: #f3f3f3;
    background-color: rgba(66, 66, 66, 0.95);
    cursor: pointer;
}
.odt-member-store-product-nav-item-previous:hover{
    background-color: rgba(33, 33, 33, 0.95);
}
.odt-member-store-product-nav-item-buy{
    height: fit-content;
    width: fit-content;
    min-width: 95px;
    text-align: center;
    border-radius: .25rem;
    padding: 1rem 2rem;
    color: #f3f3f3;
    background-color: rgba(66, 66, 66, 0.95);
    font-size: 1rem;
    cursor: pointer;
}
.odt-member-store-product-nav-item-buy:hover{
    background-color: #78acf8;
    color: #f3f3f3;
    text-decoration: none;
}
.odt-member-store-product-nav-item-buy:focus, .odt-member-store-product-nav-item-buy.active{

}
.odt-member-cart-go-store-btn {
    height: auto;
    padding: 1rem 2rem;
    color: rgb(77, 175, 124);
    cursor: pointer;
    background-color: rgba(185, 198, 195, 0.2);
    font-size: x-large;
}
.odt-member-cart-go-store-btn:hover, .odt-member-cart-go-store-btn:active {
    height: auto;
    padding: 1rem 2rem;
    color: white;
    background-color: rgb(77, 175, 124);
}
.odt-order-list-form{
    padding: .75rem 1.25rem;
}
#odt-order-list-content{
    /*overflow: auto;*/
    /*height: calc(100vh - 190px);*/
    /*background-color: rgba(0, 0, 0, 0.8);*/
}
.odt-order-list-content-header{
    color: var(--ThemeLabelColor);
    border-bottom: 1px ridge var(--ThemeDivider);
    margin-top: 1rem;
    text-align: center;
    position: inherit;
}
.odt-order-list-content-body{
    padding: unset;
    margin: unset;
    position: inherit;
}
.odt-order-list-content-body-obj{
    color: var(--ThemeLabelColor);
    width: 100%;
    padding: 1rem 0;
    background-color: rgba(255, 255, 255, 0.1);
    margin: 1rem 0;
    line-break: anywhere;
}
.odt-order-list-img{
    margin: auto;
    display: flex;
    justify-content: center;
    position: inherit;
}
.odt-order-list-row{
    margin: auto;
    position: inherit;
    padding: unset;
}
.odt-order-detail-btn {
    width: fit-content;
    height: auto;
    padding: 1rem .5rem;
    color: var(--ThemeColor);
    cursor: pointer;
    background-color: rgba(185, 198, 195, 0.2);
}
.odt-order-detail-btn:hover, .odt-order-detail-btn:active {
    color: var(--ThemeHover1);
}
.odt-order-rtn-label {
    width: 100%;
    min-width: 175px;
    height: auto;
    margin-top: 1rem;
}
.odt-order-rtn-label:hover, .odt-order-rtn-label:active {
    width: 100%;
    height: auto;
}
.odt-member-app-content-table-cell {
    display: flex;
    text-align: center;
    cursor: pointer;
    color: var(--ThemeLabelColor);
    border-bottom: var(--ThemeTableDivider) solid 1px;
    /*width: fit-content;*/
    word-break: break-all;
}
.odt-member-app-content-table-cell:hover, .odt-member-app-content-table-cell:active {
    background-color: rgba(208, 223, 226, 0.2);
}
.odt-member-app-content-table-cell-name {
    min-width: 300px;
    margin-bottom: unset;
    align-self: center;
    padding: 4px 0;
}
.odt-member-app-content-table-cell-imei {
    min-width: 300px;
    margin-bottom: unset;
    align-self: center;
    padding: 4px 0;
}
.odt-member-app-content-table-cell-iimei {
    min-width: 230px;
    margin-bottom: unset;
    align-self: center;
    padding: 4px 0;
}
.odt-member-app-content-table-cell-expired-date {
    min-width: 200px;
    width: 100%;
    margin-bottom: unset;
    align-self: center;
    padding: 4px 0;
}
.odt-member-app-content-table-cell-bind-account {
    min-width: 400px;
    width: 100%;
    margin-bottom: unset;
    align-self: center;
    padding: 4px 0;
}
.odt-member-app-content-table-cell-subscription {
    min-width: 160px;
    width: 100%;
    margin-bottom: unset;
    align-self: center;
    padding: 4px 0;
}
.odt-member-app-content-table-cell-data-usage {
    min-width: 160px;
    width: 100%;
    margin-bottom: unset;
    align-self: center;
    padding: 4px 0;
}
.table-header {
    background-color: var(--ThemeTableHeader);
}
.table-cell {
    border-width: 0 0 1px 0;
    border-color: var(--ThemeTableDivider);
}

.odt-member-application-sub-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    background-color: transparent;
}
.odt-member-application-iridium-grid {
    display: grid;
    grid-template-rows: minmax(20vh, auto) auto;
    grid-gap: 1rem;
}
.odt-member-application-iridium-secrion1-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(20vh, auto));
    grid-gap: 1rem;
}
.odt-member-account-option-btn {
    display: flex;
    padding: 1vh;
    margin: 1vh;
    align-items: center;
    text-align: center;
    justify-content: center;
    background-color: var(--ThemeButton1Background);
    color: var(--ThemeButton1Color);
}

.odt-nav-logo {
    display: flex;
    width: 150px;
    object-fit: contain;
}
.odt-nav-logo-small {
    display: none;
    width: 100%;
    height: 100%;
    max-width: 65px;
    padding: 1rem;
    object-fit: contain;
}

/* other screen size */
@media only screen and (min-width : 490px) and (max-width : 767px) {
    .odt-member-tab-content-sub {
        /*height: calc(100vh - 305px);*/
    }
    #odt-order-list-content{
        /*height: calc(100vh - 250px);*/
    }
    .odt-application-content{
        /*height: calc(100vh - 250px);*/
    }
    .odt-member-cart{
        /*height: calc(100vh - 160px);*/
    }
}
/* 4 inch IPhone SE */
@media only screen and (min-width : 400px) and (max-width : 490px) {
    .odt-member-tab-content-sub {
        /*height: calc(100vh - 330px);*/
    }
    #odt-order-list-content{
        /*height: calc(100vh - 250px);*/
    }
    .odt-application-content{
        /*height: calc(100vh - 270px);*/
        padding: unset;
    }
    .odt-member-cart{
        /*height: calc(100vh - 180px);*/
    }
}
/* mobile screen */
@media only screen and (min-width : 320px) and (max-width : 767px) {
    .odt-member-container {
        grid-template-columns: unset;
        grid-template-rows: fit-content(15%) auto;
    }
    .odt-member-nav {
        grid-template-rows: 100%;
        grid-template-columns: fit-content(20%) 30% auto;
        height: fit-content;
        border-right: unset;
        border-bottom: 1px var(--ThemeDivider) solid;
        max-width: unset;
    }
    .odt-member-nav-logo {
        width: fit-content;
        border-bottom: unset;
    }
    .odt-member-nav-logo-text {
        display: none;
    }
    .odt-member-nav-menu {
        display: unset;
        grid-template-rows: unset;
        row-gap: unset;
        border-bottom: unset;
        align-self: center;
    }
    .odt-member-nav-account {
        margin-right: 1rem;
        margin-left: auto;
        width: fit-content;
        text-align: end;
    }
    .odt-member-nav-bar-dropdown {
        display: block;
    }
    .odt-member-nav-bar-drop-btn {
        display: unset;
        font-size: 24px;
        border: none;
        color: var(--ThemeLabelColor);;
        padding: 8px;
        background-color: transparent;
    }
    .odt-member-nav-bar-drop-btn:focus{
        outline: none;
    }
    .odt-member-nav-bar-dropdown-content {
        display: grid;
        height: 0;
        align-items: center;
        overflow-y: hidden;
        position: absolute;
        background-color: var(--ThemeBackground);
        min-width: 160px;
        z-index: 1;
        padding: 0 .5rem;
        box-shadow: 0 0 3px rgb(0 0 0);
        border-radius: .5rem;
    }
    .odt-member-nav-bar-dropdown-content a {
        /*float: none;*/
        /*height: 60px;*/
        display: flex;
        /*align-items: center;*/
    }
    .odt-member-nav-drop-btn-title {
        display: unset;
    }
    /*.odt-member-app-content-table-cell-imei {*/
    /*    display: none;*/
    /*}*/
    /*.odt-member-app-content-table-cell-expired-date {*/
    /*    display: none;*/
    /*}*/
    .odt-member-app-content-table-cell-bind-account {
        display: none;
    }
    /*.odt-member-store-product-nav-item-buy {*/
    /*    padding: 14px;*/
    /*    font-size: 12px;*/
    /*}*/

    .nav-item {
        margin-left: unset;
    }
    .nav-item:focus, .nav-item.active{
        color: white;
        background: var(--ThemeButtonSelectedColor);
        /*border-radius: 12px;*/
        border-radius: unset;
        /*box-shadow: 0 4px 6px rgb(0 0 0);*/
    }
    .odt-nav-logo {
        display: none;
    }
    .odt-nav-logo-small {
        display: flex;
    }
    .odt-member-mail {
        overflow: unset;
    }

    .odt-order-list-img {
        display: none;
    }
}
@media only screen and (min-width : 0) and (max-width : 700px) {
    .odt-member-app-content-table-cell-name {
        min-width: 160px;
    }
    .odt-member-app-content-table-cell-expired-date {
        display: none;
    }
    .odt-member-app-content-table-cell-imei {
        /*display: none;*/
        min-width: 160px;
        width: 100%;
    }
    .odt-member-app-content-table-cell-iimei {
        display: none;
    }
}
@media only screen and (min-width : 700px) and (max-width : 900px) {
    .odt-member-app-content-table-cell-name {
        min-width: 200px;
    }
    .odt-member-app-content-table-cell-imei {
        min-width: 200px;
    }
    .odt-member-app-content-table-cell-expired-date {
        min-width: unset;
        /*display: none;*/
    }
}
@media only screen and (min-width : 900px) and (max-width : 1072px) {
    .odt-member-app-content-table-cell-name {
        min-width: 160px;
    }
    .odt-member-app-content-table-cell-expired-date {
        min-width: 160px;
        /*display: none;*/
    }
}