/* 
************************	
	公用
************************
*/
form {
    margin-block-end: 0;
    margin-bottom: 0;
}
table {
    font-size: inherit;
}
:root {
    --main_green:#05dfc8;
    --main_blue:#05a9df; 
}

@media (max-width: 1400px){
    .navbar-custom-menu .menuOnline:before{
        content: '\f2ba';
        font-family: 'FontAwesome';
    }
    .navbar-custom-menu .menuUser:before{
        content: '\f2c0';
        font-family: 'FontAwesome';
    } 
    .menuOnline span, .menuUser span{
        display: none;
    }
}
@media (max-width: 767px){
    .logo{
        float:left !important;
    }
}
@media screen and (max-width: 800px) {
    body {
        overflow: unset !important;
        background: #cac0bf !important;
        min-width: min-content !important;
    }
    .wrapper, .content-wrapper, .content-middle{
        overflow: unset !important;
        height: min-content !important;
    }
    .content {
        min-width: 1000px;
    }
    .content.setGtypePage {
        min-width: 600px;
    }
}
html, body{    
    overflow: auto;
    width: 100%;
    height: 100%;
}

*, h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: '微軟正黑體';
}
/* loading */
#loadDiv {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999999999;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, .5);
}
#loadDiv > .loading {
    position: relative;
    top: 50%;
    left: 50%;
    margin-top: -73px;
    margin-left: -73px;
    width: 146px;
    height: 146px;    
    background: url('/image/adm/common/loading.gif');
}
/* 球種圖式 ICON */
.game_BS{ background: url(/image/sport/icon_game_bs.svg) no-repeat; }
.game_BK{ background: url(/image/sport/icon_game_bk.svg) no-repeat; }
.game_HO{ background: url(/image/sport/icon_game_ho.svg) no-repeat; }
.game_AF{ background: url(/image/sport/icon_game_af.svg) no-repeat; }
.game_SC{ background: url(/image/sport/icon_game_sc.svg) no-repeat; }
/* 指數SK 彩球LO 賽馬RH*/
.game_TN{ background: url(/image/sport/icon_game_tn.svg) no-repeat; }
.game_VB{ background: url(/image/sport/icon_game_vb.svg) no-repeat; }
.game_BB{ background: url(/image/sport/icon_badminton.svg) no-repeat; }
/* 電竟ES */
.game_TT{ background: url(/image/sport/icon_game_tt.svg) no-repeat;}
.game_PB{ background: url(/image/sport/icon_game_bib.svg) no-repeat; }
.game_HB{ background: url(/image/sport/icon_game_hb.svg) no-repeat; }
/* 沙灘排球 */

.game_favs{ background: url(/image/sport/icon_myfavorite.svg) no-repeat; }
.game_cs{ background: url(/image/sport/icon_comingsport.svg) no-repeat; }
.game_cl{ background: url(/image/sport/icon_inplaycenter.svg) no-repeat; }
.game_inc{ background: url(/image/sport/icon_inplaycenter.svg) no-repeat; }
.game_bgs{ background: url(/image/sport/icon_ballgjls.svg) no-repeat; }
.game_bws{ background: url(/image/sport/icon_ballwdls.svg) no-repeat; }
.game_ih{ background: url(/image/sport/icon_game_ih.svg) no-repeat; }
.game_es{ background: url(/image/sport/icon_game_es.svg) no-repeat; }
.game_fb{ background: url(/image/sport/icon_game_fb.svg) no-repeat; }

.game_gf{ background: url(/image/sport/icon_game_gf.svg) no-repeat; }

.game_other{ background: url(/image/sport/icon_game_other.svg) no-repeat; }
.game_mixpass{ background: url(/image/sport/icon_mixedpass.svg) no-repeat; }

.game_walking{background:url(/image/sport/icon_game_walking.png) no-repeat;}
.svgIcon { 
    display:inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 23px;
    background-size: 55% 30px;
    background-position: center;
    background-repeat: no-repeat;
}
.ctl_icon{
    width: 22px;
    height: 22px;
}

.ctl_icon2{
    width: 32px;
    height: 22px;
}
/* layout */
#contentBlock{
    overflow: auto;
}
.content-top {    
    margin-bottom: 15px;
    padding: 10px 20px;
    background: #fff;
    width: 100%;
    display: table;
    min-width:max-content;
}
.content-middle {
    overflow: auto;
    margin-bottom: 15px;
    background: #FFFFFF;
    width: 100%;
}
.content-middle .img-content {
    overflow: auto;
    padding: 20px;
}
.content-middle .img-content .img-box { 
    position: relative;
    display: inline-block; 
    margin: 5px .3%; 
    width: 8%; 
    height: 154px; 
    border: 2px solid #ccc;
    cursor: pointer;
    transition: all .1s;
}
.content-middle .img-content .img-box.active {
    border: 2px solid #1eb71e;
}
.content-middle .img-content .img-box.disabled:before {
    content: '圖片使用中';
    display: block;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;    
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 90px;
    color: #efefef;
    background: rgba(0, 0, 0, .6);
}
.content-middle .img-content .img-box .num {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 99;
    margin-top: -20px;
    margin-left: -20px;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    background: #1eb71e;
    color: #efefef;
    border-radius: 50%;
}
.content-footer {    
    padding: 0;
    width: 100%;     
    height:50px; 
    text-align: center;   
    background: #eff5f9;     
}
.content-footer .pagination {
    margin: 0;
}
/* color-bg */
.btn[class*='bg-']:hover {
    box-shadow: none;
}
.btn[class*='bg-']:focus {
    color: #efefef;
}
.bg-lightgreen {
    background: #d8f781 !important;
}
.bg-color-deepBlue {
    background: #3e67a5;
}
.bg-color-deepPurple {
    background: #6053ab;
}
.bg-color-deepGreen {
    background: #058c9b;
}
.bg-color-deepBrown {
    background: #987530;
}
.bg-color-cream {
    background: #FFFFBB !important;
}
.bg-blue {
    color: #efefef;
    background: #263863 !important;
    border: none;
    box-shadow: none;    
}
.bg-name-label {
    letter-spacing: 2px;
    color: #efefef;
    background: #5966cc;
    border: none;
    box-shadow: none;    
}
.bg-name-label:hover {    
    color: #efefef;
    background: #5966cc;
    border: none;
    box-shadow: none;    
}
.bg-name-label-2 {
    letter-spacing: 2px;
    color: #efefef;
    background: #6f6bab;
    border: none;
    box-shadow: none;    
}
.bg-name-label-2:hover {    
    color: #efefef;
    background: #6f6bab;
    border: none;
    box-shadow: none;    
}
.bg-name-label-3 {
    letter-spacing: 2px;
    color: #efefef;
    background: #a26bab;
    border: none;
    box-shadow: none;    
}
.bg-name-label-3:hover {    
    color: #efefef;
    background: #a26bab;
    border: none;
    box-shadow: none;    
}
/* 顯示列表 */
.bg-list-on {
    letter-spacing: 2px;
    color: #efefef;
    background: #03a9f4;
    border: none;
    box-shadow: none;    
}
.bg-list-on:hover {
    color: #efefef;
    background: #0469cd;
    border: none;
    box-shadow: none; 
}
/* 關閉列表 */
.bg-list-off {
    letter-spacing: 2px;
    color: #efefef;
    background: #716f6f;
    border: none;
    box-shadow: none;    
}
.bg-list-off:hover {
    color: #efefef;
    background: #404040;
    border: none;
    box-shadow: none; 
}
/* 搜尋 */
.bg-search {
    letter-spacing: 2px;
    vertical-align: middle;
    color: #efefef;
    background: #59c4cc;
    border: none;
    box-shadow: none;
    outline: none;
}
.bg-search:hover {
    color: #efefef;
    background: #59c4cc;
    border: none;
    box-shadow: none;
}
/* 新增、展開(過關注單) */
.bg-add {
    letter-spacing: 2px;
    color: #efefef;
    background: #5996cc;
    border: none;
    box-shadow: none;
}
.bg-add:hover {
    color: #efefef;
    background: #18374e;
    border: none;
    box-shadow: none;
}
/* 額外功能 */
.bg-other {
    letter-spacing: 2px;
    color: #efefef;
    background: #bf589f;
    border: none;
    box-shadow: none;
}
.bg-other:hover {
    color: #efefef;
    background: #800080;
    border: none;
    box-shadow: none;
}
/* 刪除 */
.bg-delete {
    letter-spacing: 2px;
    color: #efefef;
    background: #ea6858;
    border: none;
    box-shadow: none;
}
.bg-delete:hover {    
    color: #efefef;
    background: #a42313;
    border: none;
    box-shadow: none;
}
/* 儲存 */
.bg-save {
    letter-spacing: 2px;
    color: #efefef;
    background: #059083;
    border: none;
    box-shadow: none;
}
.bg-save:hover {    
    color: #efefef;
    background: #176e41;
    border: none;
    box-shadow: none;
}
/* 取消/關閉 */
.bg-cancel {
    letter-spacing: 2px;
    color: #efefef;
    background: #df5e2c;
    border: none;
    box-shadow: none;
}
.bg-cancel:hover {    
    color: #efefef;
    background: #df5e2c;
    border: none;
    box-shadow: none;
}
/* 複製 */
.bg-copy {
    letter-spacing: 2px;
    color: #efefef;
    background: #005594;
    border: none;
    box-shadow: none;
}
.bg-copy:hover {    
    color: #efefef;
    background: #18374e;
    border: none;
    box-shadow: none;
}
/* 編輯/修改/更新 */
.bg-edit {
    letter-spacing: 2px;
    color: #efefef;
    background: #58bf91;
    border: none;
    box-shadow: none;
}
.bg-edit:hover {    
    color: #efefef;
    background: #176e41;
    border: none;
    box-shadow: none;
}
/* 上傳 */
.bg-upload {
    letter-spacing: 2px;
    color: #efefef;
    background: #676464;
    border: none;
    box-shadow: none;
}
.bg-upload:hover {    
    color: #efefef;
    background: #676464;
    border: none;
    box-shadow: none;
}
/* 狀態開啟、模組管理-基設 */
.bg-status-up {
    letter-spacing: 2px;
    color: #efefef;
    background: #e0519b;
    border: none;
    box-shadow: none;
}
.bg-status-up:hover {    
    color: #efefef;
    background: #b92773;
    border: none;
    box-shadow: none;
}
/* 狀態關閉、模組管理-詳設 */
.bg-status-down {
    letter-spacing: 2px;
    color: #efefef;
    background: #f78d30;
    border: none;
    box-shadow: none;
}
.bg-status-down:hover {    
    color: #efefef;
    background: #d9741c;
    border: none;
    box-shadow: none;
}
.bg-status-center {
    letter-spacing: 2px;
    color: #efefef;
    background: #1b6f90;
    border: none;
    box-shadow: none;    
}
.bg-status-center:hover {
    color: #efefef;
    background: #1b6f90;
    border: none;
    box-shadow: none;    
}

.bg_blue{
    background-color:var(--main_blue) !important;
}
.bg_green{
    background-color:var(--main_green) !important;
}

/* display */
.inline-block {
    display: inline-block !important;
}
/* position */
.t-left {
    text-align: left !important;
}
.t-center {
    text-align: center !important;
}
.t-right {
    text-align: right !important;
}
.all-center {
    vertical-align: middle !important;
    text-align: center !important;
}
.all-vertical {
    vertical-align: middle !important;
}
.all-align {
    text-align: center !important;    
}
/* width, height */
.w05p {width: 5% !important;}
.w10p {width: 10% !important;}
.w20p {width: 20% !important;}
.w25p {width: 25% !important;}
.w30p {width: 30% !important;}
.w40p {width: 40% !important;}
.w50p {width: 50% !important;}
.w60p {width: 60% !important;}
.w70p {width: 70% !important;}
.w80p {width: 80% !important;}
.w90p {width: 90% !important;}
.w98p {width: 98% !important;}
.w100p {width: 100% !important;}
.w10 {width: 10px}
.w20 {width: 20px}
.w30 {width: 30px}
.w40 {width: 40px}
.w50 {width: 50px}
.w60 {width: 60px}
.w70 {width: 70px}
.w80 {width: 80px}
.w100 {width: 100px}
.w110 {width: 110px}
.w120 {width: 120px}
.w130 {width: 130px}
.w150 {width: 150px}
.w160 {width: 160px}
.w170 {width: 170px}
.w180 {width: 180px}
.w200 {width: 200px}
.w250 {width: 250px}
.w300 {width: 300px}
.w350 {width: 350px}
.w400 {width: 400px}
.w450 {width: 450px}
.w500 {width: 500px}
.w550 {width: 550px}
.w600 {width: 600px}
.w700 {width: 700px}
.w800 {width: 800px}
.line20{height: 20px;line-height: 20px;display:block;}
.line30{height: 30px;line-height: 30px;display:block;}
.line40{height: 40px;line-height: 40px;display:block;}
.line60{height: 60px;line-height: 60px;display:block;}
.line80{height: 80px;line-height: 80px;display:block;}
.line90{height: 90px;line-height: 90px;display:block;}
/* form */
.form-ul {
    overflow-y: auto;
    /* display: block; */
    display: contents;
    margin: 0 auto;    
    padding: 20px;
    padding-right: 60px;
    width: 80%;
    background: #eff5f9;
}
.form-ul > li {
    float: left;
    display: table;
    /* margin: 0 1%; */
    padding: 10px 0;

    margin: 0px;
    padding: 10px 1%;

    width: 35%;
}
.form-ul > li.baseline {    
    padding: 8px 0;
    text-align: center;
    color: #fff;
    background: #485d94;
}
.form-ul > li > .title {
    display: table-cell;
    width: 160px;
    padding-right: 10px;
    font-size: 14px;
    line-height: 35px;
    letter-spacing: 2px;
    vertical-align: top;
    text-align: right;
    color: #586db9;
}
.form-ul > li > .title.must:before {
    content: '*';
    color: #ff5757;
}
.form-ul > li > ul.leag_choose{
    background-color:#FAFAFA;
    list-style:none;
    padding-left:0;
    width:250px;
}
.form-ul > li > ul.leag_choose > li{
    padding: 2px 10px;
}
.form-ul > li > .title + div {
    display: table-cell;
}
.form-ul > li > .title + div .icheckbox_square-blue {
    top: 8px;
}
.form-ul > li > .title + div.inline span,
.form-ul > li > .title + div.inline + div.inline span {    
    display: inline-block;
    margin-top: 2px;
    margin-right: -4px;
    padding: 6px 12px 6px 12px;
    font-size: 14px;
    line-height: 20px;
    background: #fff;
    color: #777;
    border: 1px solid #ccc;
}
.form-ul > li > .title + div.inline input {
    display: inline-block;
    width: 80%;
}
.form-ul > li > .title + div + div.inline input {
    display: inline-block;
    width: 80%;    
}
.form-ul > li > .title + div.last {
    width: 200px;
}
.form-ul .multiselect-container {
    width: 100%;
}
.form-ul .multiselect-container > li > a {
    padding: 10px;
    letter-spacing: 1px;
    color: #845f5f;
    transition: all .3s;
}
.form-ul .multiselect-container > li > a:hover {
    background-color: #ffff80;
}
.form-ul .dropdown-menu > .active > a,
.form-ul .dropdown-menu > .active > a:hover,
.form-ul .dropdown-menu > .active > a:focus {
    color: #fff;
}
.form-ul .text {
    font-size: 14px;
    letter-spacing: 2px;
    line-height: 35px;
    color: #555;
}
.form-ul .red-text {
    margin-left: 5px;
    font-size: 14px;
    letter-spacing: 2px;    
    color: #ec8274;
}
.search-line {
    position: relative;
    display: inline-block;    
    vertical-align: middle;
}
.search-line .search-list {
	margin-bottom: 0;
    padding-left: 0;
}
.search-line .search-list>li {
    display: table-cell;
}

.search-line .search-list li>.title {
    display: inline-block;
    margin-right: 10px;
    letter-spacing: 1px;
    color: #736b6b;
}
.search-line .search-list li>.value {
    margin-right: 10px;
}
.search-line .search-list li>.form-style {
    display: inline-block; 
    margin-right: 10px;
    padding: 6px 12px;
    min-width: 100px;
    height: 34px;
    font-size: 14px;
    line-height: normal;
    vertical-align: middle;
    color: #555;
    background: #fff;
    border-radius: 0;
    border: 1px solid #abb7de;
    outline: none;
}
.content-middle .form-style {
    display: inline-block;
    margin-right: 10px;
    padding: 6px 12px;
    min-width: 100px;
    height: 34px;
    font-size: 14px;
    line-height: normal;
    vertical-align: middle;
    color: #555;
    background: #fff;
    border-radius: 0;
    border: 1px solid #abb7de;
    outline: none;
}
.features-line {
    /*float: right;*/
    display: inline-block;
    vertical-align: middle;
}
/* table */
#tableContent tr:nth-child(odd){
    background:#fff;
}
.required::before{
    content: '*';
    display:inline-block;
    color:#ef5050;
    line-height: 12px;
    vertical-align:middle;
    margin-right: 5px;
    font-weight:normal;
}
/*賽程管理 start*/
.games_manage {
    text-align:center;
    line-height:30px;
    background-color: #434375;
}
body.ad .games_manage {
    text-align:center;
    line-height:30px;
    background-color: #4173ace3;
}
/*賽程管理 end*/

/*通路管理 start*/
body .user_manage {
    text-align:center;
    line-height:30px;
    background-color: #434375;
}
body.ad .user_manage {
    text-align:center;
    line-height:30px;
    background-color: #4173ace3;
}
body.ag .user_manage {
    text-align:center;
    line-height:30px;
    background-color: #730d0d;
}
/*賽通路管理管理 end*/

.table-header { 
    /*padding-right: 8px;           */
    width: 100%;
    background-color: #4a6379;
    min-width: 1250px;
}
.table-content {
    overflow: auto;
    width: 100%;        
    background: #eff5f9;
    min-width: 1250px;
}
.table-footer { 
    /*padding-right: 8px;           */
    width: 100%;
    background-color: #cac8e4;
    color: #F00;
    min-width: 1250px;
    margin-bottom: 20px;
    padding: 5px;
}
.table-div {
    overflow-x: auto;
    display: table;
    width: 100%;
    max-width: 100%;    
    vertical-align: middle;  
    table-layout: fixed;  
}
.table-div-head { display: table-header-group; }
.table-div-tr { display: table-row; }

.table-div-th {
    display: table-cell;
    padding: 10px 5px;
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #434375;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
}
body.ad .table-div-th {
    display: table-cell;
    padding: 10px 5px;
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #4173ace3;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
}
body.ag .table-div-th {
    display: table-cell;
    padding: 10px 5px;
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #730d0d;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
}

.res_table-div-th {
    display: table-cell;
    padding: 10px 5px;
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #434375;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
}

body.ad .res_table-div-th {
    display: table-cell;
    padding: 10px 5px;
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #4173ace3;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
}
body.ag .res_table-div-th {
    display: table-cell;
    padding: 10px 5px;
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #730d0d;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
}

.table-div-td {
    display: table-cell;
    padding: 8px 5px;  
    text-align: center;
    vertical-align: middle;
    color: #666;
    background-color: #eff5f9;
    border-right: 1px solid #ccc;  
    border-bottom: 1px solid #ccc;
}
/* 初始帳號 #s3 需顯示右邊框 所以先註解 */
.table-div-td:last-child {
	/*border-right: none;*/
}
.table.team_info {
    min-width: 1250px;
    white-space: normal;
}
.table.team_info > thead > tr > td,
.table.team_info > tbody > tr > td{
    vertical-align:  middle;
    border: 1px solid #ccc;
}

.modal-body, .modal-footer{
    background:#eff5f9;
}
.modal-content .bg_sucess{
    color: #efefef;
    background: #0073b7 !important;
    border: none;
    box-shadow: none;
}
.modal-content .bg_error{
    color: #efefef;
    background: #ea6858 !important;
    border: none;
    box-shadow: none;
}
#msg_content .btn-warning:hover{
    background-color:#f39c12;
    border:1px solid #f39c12;
}
/* game-items 選單 */
.game-items {
	display: inline-block;
	margin-right: 10px;
	padding: 5px 10px;
	color: #7aacd8;
	border: 1px solid #7aacd8;	
	cursor: pointer;
	transition: all .5s;
}
.game-items:hover {
    color: #fff;
    background: #7aacd8;
}
.game-items.active {
	color: #fff;
	background: #7aacd8;
}
/* 
************************	
	後台登入頁面 (login.blade)
************************
*/
.login {
	margin: 0 auto;
	width: 480px;
}
.login-logo {
	padding-top: 30vh;
	letter-spacing: 2px;
	color: #efefef;
}
/* 
************************	
	後台首頁 (index.blade)
************************
*/
/* main-header */
.main-sidebar, .left-side {
	width: 180px;
	background: #f1e57d;
}
.main-header {
	background: #171e31;	
}
.main-header .logo {
	width: 180px;
}
.navbar-nav > li > a {
    letter-spacing: 2px;
    color: #fff !important;
    border-left: 1px solid #4a5d8c;
    transition: all .3s;
}
.navbar-nav > li > a:hover {
    background: #337ab7;
}
/*main-sidebar*/
.main-header .logo {
    width: 180px;
    color: #efefef;
    background: #283150; 
}
.main-sidebar, 
.left-side {
    width: 180px;
    color: #efefef;
    background: #434375;    
}
body.ad .main-sidebar, 
body.ad .left-side {
    width: 180px;
    color: #efefef;
    background: #4173ace3;    
}
body.ag .main-sidebar, 
body.ag .left-side {
    width: 180px;
    color: #efefef;
    background: #730d0d;    
}

.main-sidebar button {
    margin-left: 5px;
    padding: 5px;
    color: #e1e1f3 !important;
    background: #5873d4;    
    border: none;
}
.main-header .logo {
    line-height: 50px;
    background: #171e31;
}

.sidebar-menu > li {
    position: relative;
    border-bottom: 1px solid #596080;
}
body.ad .sidebar-menu > li {
    position: relative;
    border-bottom: 1px solid #656d91;
}
body.ag .sidebar-menu > li {
    position: relative;
    border-bottom: 1px solid #c13b47;
}

.sidebar-menu > li > a {
    font-size: 15px;
    letter-spacing: 2px;
    color: #fff;
    transition: all .3s;
}
.sidebar-menu > li > a > i:first-child {
    margin-right: 5px;
    color: #7173c1;
}

.sidebar-menu > li:hover > a {    
    color: #efefef;
    background: #000000;
}
body.ad .sidebar-menu > li:hover > a {    
    color: #efefef;
    background: #000000;
}
body.ag .sidebar-menu > li:hover > a {    
    color: #efefef;
    background: #000000;
}

.sidebar-menu .treeview-menu {
    padding-left: 0;
}
/*
.sidebar-menu .treeview-menu > li > a {
    padding: 10px 0;
    letter-spacing: 2px;
    text-align: center;
    color: #5c6c96;
    background: #0c1429;
    border-bottom: 1px solid #202741;
    transition: all .3s;
}*/
.sidebar-menu .treeview-menu > li > a {
    padding: 10px 0;
    letter-spacing: 2px;
    text-align: center;
    color: #fff;
    background: #333359;
    border-bottom: 1px solid #596080;
    transition: all .3s;
}
body.ad .sidebar-menu .treeview-menu > li > a {
    padding: 10px 0;
    letter-spacing: 2px;
    text-align: center;
    color: #fff;
    background: #366091e3;
    border-bottom: 1px solid #656d91;
    transition: all .3s;
}
body.ag .sidebar-menu .treeview-menu > li > a {
    padding: 10px 0;
    letter-spacing: 2px;
    text-align: center;
    color: #fff;
    background: #bf5353;;
    border-bottom: 1px solid #c13b47;
    transition: all .3s;
}

.sidebar-menu .treeview-menu > li.active > a{
    background:#c13b47;
    color:#ffffff;
}
body.ad .sidebar-menu .treeview-menu > li.active > a{
    background:#c13b47;
    color:#ffffff;
}
body.ag .sidebar-menu .treeview-menu > li.active > a{
    background:#423939;
    color:#ffffff;
}

.sidebar-menu .treeview-menu > li > a:hover {
    color: #efefef;    
    background: #000000;
    font-weight: bolder;
}
body.ad .sidebar-menu .treeview-menu > li > a:hover {
    color: #efefef;    
    background: #000000;
    font-weight: bolder;
}
body.ag .sidebar-menu .treeview-menu > li > a:hover {
    color: #efefef;    
    background: #000000;
    font-weight: bolder;
}

.sidebar-menu .treeview-menu > li > a > .fa {
    display: none;
}
.treeview-menu > li:hover::before {
    width: 0;
}
.treeview > .expandable {
    color: #fff;
}
.treeview .hover {
    color: #4cd097 !important;
}
/* breadcrumb */
.breadcrumb {
	display: inline-block;
	margin-top: 8px;
	margin-bottom: 0px;
	background: none;
}
.breadcrumb > li > a > i {
	margin-right: 3px;
}
/* content-wrapper */
.content-wrapper, .right-side {
	margin-left: 180px;
	background: #cac0bf;
}
@media (max-width: 767px) {
  .content-wrapper {
    /*margin-left: 0px;*/
  }
}
.main-header > .navbar {
	margin-left: 180px;
}
/* second-nav */
#secondNav.second-nav {
    position: relative;
    margin-left: 180px;
    background: #434375;
}
body.ad #secondNav.second-nav {
    position: relative;
    margin-left: 180px;
    background: #4173ace3;
}

body.ag #secondNav.second-nav {
    position: relative;
    margin-left: 180px;
    background: #730d0d;
}
@media (max-width: 767px) {
  #secondNav.second-nav {
    /*margin-left: 0px;*/
  }
}
#secondNav .second-nav-link {
    display: inline-block;
    padding: 6px 25px;
}
#secondNav .second-nav-link a {
    color: #fff !important;
    display: inline-block;
    margin-right: 5px;
    padding: 4px 10px;
    letter-spacing: 1px;    
}
#secondNav .gtypes-game-sum {
    color: #555;
}
#secondNav .gtypes-game-sum a {
    display: inline-block;
    color: #8ff5ff;
}
#secondNav .online-block {
    float: right;
    /* display: inline-block;     */
}
#secondNav .online-block a {
    display: inline-block;    
    padding: 5px 25px;
    letter-spacing: 2px;
    line-height: 48px;
    color: #fff;    
    transition: all .5s;
}
.online-block a:hover {
    background: #ffb23f;
}
/* 
************************
  iframe_main blade用 
************************    
*/
@media (max-width: 991px) {
    .fancybox-content {
        position: absolute;
        left: 100px;
    }
}
@media (max-width: 800px) {
    .fancybox-content {
        position: absolute;
        left: 0px;
        max-width: unset !important;
        width: 800px !important;
    }
}
.iframe_wapper{
    margin : 0px;
    /* padding : 20px; */
    background-color:#FFFFFF;
    width : 100%;
    height : 100%;
    overflow: auto;
}
.iframe_wapper .iframe_close{
    height : 100%;
}
.iframe_wapper .content .iframe_form{
    padding: 10px 20px;
    height : 100%;
    overflow: hidden;
}

.iframe_wapper .content .iframe_form .iframe_title{
    padding: 8px 0;
    color: #fff;
    background: #485d94;
    height : 87px;
    font-size: 24px;
    display: grid;
    align-items: center;
    text-align: center;
}
body.ad .iframe_wapper .content .iframe_form .iframe_title{
    padding: 8px 0;
    color: #fff;
    background: #4173ace3;
    height : 87px;
    font-size: 24px;
    display: grid;
    align-items: center;
    text-align: center;
}
body.ag .iframe_wapper .content .iframe_form .iframe_title{
    padding: 8px 0;
    color: #fff;
    background: #730d0d;
    height : 10%;
    font-size: 24px;
    display: grid;
    align-items: center;
    text-align: center;
}

.iframe_wapper .content .iframe_form .iframe_content{
    padding:10px;
    height : 78%;
    overflow-y: scroll;
    overflow-x: auto;
}
.iframe_wapper .content .iframe_form .iframe_button{
    /* padding-top: 20px; */
    text-align: center;
    height : 10%;
}

@media (max-width: 800px) {
    .iframe_wapper .content .iframe_form .iframe_button{
        padding-top: 5px;
    }
}

.iframe_wapper .content .iframe_form .iframe_button a{
    margin: 5px;
}
.iframe_wapper .content .iframe_form form ul{
    padding: 0px;
    margin: 0px;
}
/*分欄用*/
.iframe_wapper .content .iframe_form .iform-1{
    width : 100%;
}
.iframe_wapper .content .iframe_form .iform-1>li{
    width: 100%;
}
.iframe_wapper .content .iframe_form .iform-2{
    width : 100%;
}
.iframe_wapper .content .iframe_form .iform-2>li{
    width: 50%;
    margin: 0;
}
.iframe_wapper .content .iframe_form .iform-3{
    width : 100%;
}
.iframe_wapper .content .iframe_form .iform-3>li{
    width: 30%;
    margin:0;
}
/* 
************************
        各選單頁面css 
************************    
*/
/* 10 -------------------------------------------------------------------------- */
/* 賽程管理 */
/* 賽程管理-聯盟管理 */
#LeaguesSetting .content-footer {
    padding: 8px;
    height: 50px; 
    background: #eff5f9;
}
/* 賽程管理-聯盟管理-聯盟新增 */
#LeaguesSettingCreate #btnGroup {margin-top: 15px;}
#LeaguesSettingCreate #btnGroup .bg-add {margin-right: 15px;}
/* 賽程管理-球隊管理 */
#TeamsSetting 
#TeamsSetting .content-footer {
    padding: 8px;
    height: 50px; 
    background: #eff5f9;
}
/* 賽程管理-球隊管理-新增(修改)球隊 */
#TeamsSettingCreate #btnGroup {margin-top: 15px;}
#TeamsSettingCreate #btnGroup .bg-add {margin-right: 15px;}
#TeamsSettingCreate .leag_li {margin: 0px;}
#TeamsSettingCreate .leag_choose {
    width : 95%;
    display: inline-block;
}
#TeamsSettingCreate .leag_choose li{
    width : 30%;
    float : left;
}
/* 賽程管理-模組管理 */
#ModulesSetting .content-footer {
    padding: 8px;
    height: 50px; 
    background: #eff5f9; 
}
/* 賽程管理-模組管理-模組詳情更新 */
#ModulesSettingDetails .content-footer {
    height: 50px; 
    line-height: 50px; 
    background: #eff5f9;
}
#ModulesSettingDetails #Cpanel {
    overflow-x: hidden;
    overflow-y: auto;
    position:relative;
    width: 100%;   
    height: 100%; 
    background: #ececec;
}
/* fixTable */
#ModulesSettingDetails #fixTable {
    display: table;
    position: absolute;
    width: 230px;
}
#ModulesSettingDetails #fixTable .header {display: table-header-group}
#ModulesSettingDetails #fixTable .header div {display: table-cell;}
#ModulesSettingDetails #fixTable .header .th_1 {
    padding: 4px 6px;
    width: 160px;
    text-align: center;
    background: #f9f9f9;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#ModulesSettingDetails #fixTable .header .th_2 {    
    text-align: center;
    background: #f9f9f9;   
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;    
    cursor: pointer;
}
#ModulesSettingDetails #fixTable .trigger-jump {
    display: table-cell;
    height: 31px;
    text-align: center;    
    vertical-align: middle;
    background: #5df9a3;   
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;    
    cursor: pointer;    
}
#ModulesSettingDetails #fixTable .trigger-jump.active {background: #fb8778;}
#ModulesSettingDetails #fixTable .is_re_trigger.active {background: #fb8778;}
#ModulesSettingDetails #fixTable .header .trigger-rtype {background: #5df9a3;}
#ModulesSettingDetails #fixTable .header .trigger-rtype.active {background: #fb8778;}
#ModulesSettingDetails #fixTable .header .th_2 .icheckbox_square-blue {
    left: 110%;
    top: -4px;
}
#ModulesSettingDetails #fixTable .body {display: table-row-group;}
#ModulesSettingDetails #fixTable .body .tr {display: table-row;}
#ModulesSettingDetails #fixTable .body .td {
    display: table-cell;    
    padding-right: 5px;
    width: 160px;    
    height: 31px;    
    text-align: right;
    vertical-align: middle;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#ModulesSettingDetails #fixTable .body .td.td_1 {background: #FF7878;}
#ModulesSettingDetails #fixTable .body .td.td_2 {background: #FFFF96;}
#ModulesSettingDetails #fixTable .body .td.td_3 {background: #fd81d7;}
#ModulesSettingDetails #fixTable .body .input-fast-setting {
    padding-left: 5px;
    width: 70px;
    height: 31px;    
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    border-left: 0px;
    border-top: 0px;
}
#ModulesSettingDetails #fixTable .footer {display: table-footer-group;}
/* floatTable */
#ModulesSettingDetails #floatBox {
    overflow-x: scroll;
    position: relative;
    margin-left: 230px;
    width: calc(100% - 230px);    
}
#ModulesSettingDetails #floatBox .float_table {
    overflow-y: hidden;
    position: relative;
    table-layout: fixed;    
    display: table;
    width: 100%;    
}
#ModulesSettingDetails #floatBox .float_table .header {
    display: table-header-group;
    position: relative;

}
#ModulesSettingDetails #floatBox .float_table .header label {
    margin-bottom: 0px;
    font-size: 12px;
    cursor: pointer;
}
#ModulesSettingDetails #floatBox .float_table .header div {display: table-cell;}
#ModulesSettingDetails #floatBox .float_table .header .th {
    padding: 3px 6px;    
    width: 115px;
    height: 29px;    
    text-align: center;    
    border-right: 1px solid #fff;    
    border-bottom: 1px solid #fff;
	word-break: keep-all;
	white-space: nowrap;
}
#ModulesSettingDetails #floatBox .float_table .header .th_0,
#ModulesSettingDetails #floatBox .float_table .header .th_1,
#ModulesSettingDetails #floatBox .float_table .header .th_2,
#ModulesSettingDetails #floatBox .float_table .header .th_3,
#ModulesSettingDetails #floatBox .float_table .header .th_4,
#ModulesSettingDetails #floatBox .float_table .header .th_5,
#ModulesSettingDetails #floatBox .float_table .header .th_6,
#ModulesSettingDetails #floatBox .float_table .header .th_7,
#ModulesSettingDetails #floatBox .float_table .header .th_8,
#ModulesSettingDetails #floatBox .float_table .header .th_9,
#ModulesSettingDetails #floatBox .float_table .header .th_10,
#ModulesSettingDetails #floatBox .float_table .header .th_11 {
    padding: 3px 6px;    
    width: 115px;
    height: 29px;   
    text-align: center;    
    border-right: 1px solid #fff;    
    border-bottom: 1px solid #fff;
	word-break: keep-all;
	white-space: nowrap;
}
#ModulesSettingDetails #floatBox .float_table .header .th_0,
#ModulesSettingDetails #floatBox .float_table .header .th_3,
#ModulesSettingDetails #floatBox .float_table .header .th_6,
#ModulesSettingDetails #floatBox .float_table .header .th_9 {
    background: #9eccfd;
}
#ModulesSettingDetails #floatBox .float_table .header .th_1,
#ModulesSettingDetails #floatBox .float_table .header .th_4,
#ModulesSettingDetails #floatBox .float_table .header .th_7,
#ModulesSettingDetails #floatBox .float_table .header .th_10 {
    background: #ececec;
}
#ModulesSettingDetails #floatBox .float_table .header .th_2,
#ModulesSettingDetails #floatBox .float_table .header .th_5,
#ModulesSettingDetails #floatBox .float_table .header .th_8,
#ModulesSettingDetails #floatBox .float_table .header .th_11 {
    background: #e2b1a2;
}
#ModulesSettingDetails #floatBox .float_table .header .icheckbox_square-blue,
#ModulesSettingDetails #floatBox .float_table .body .icheckbox_square-blue {
    display: inline-block;
    border: 1px solid #2489c5;
}
#ModulesSettingDetails #floatBox .float_table .body {display: table-row-group;}
#ModulesSettingDetails #floatBox .float_table .body .tr {display: table-row;}
#ModulesSettingDetails #floatBox .float_table .body .td {
    display: table-cell;    
    height: 31px !important;       
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    transition: all .3s;
    cursor: pointer;
}
#ModulesSettingDetails #floatBox .float_table .body .td.active {background: #827f7f;}
#ModulesSettingDetails #floatBox .float_table .body .td[data-status="1"] {background: #5df9a3;}
#ModulesSettingDetails #floatBox .float_table .body .td[data-status="0"] {background: #fb8778;}
#ModulesSettingDetails #floatBox .float_table .body .td.td_0,
#ModulesSettingDetails #floatBox .float_table .body .td.td_1,
#ModulesSettingDetails #floatBox .float_table .body .td.td_2,
#ModulesSettingDetails #floatBox .float_table .body .td.td_3 {
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#ModulesSettingDetails #floatBox .float_table .body .td_0,
#ModulesSettingDetails #floatBox .float_table .body .td_3,
#ModulesSettingDetails #floatBox .float_table .body .td_6,
#ModulesSettingDetails #floatBox .float_table .body .td_9 {
    background: #9eccfd;
}
#ModulesSettingDetails #floatBox .float_table .body .td_1,
#ModulesSettingDetails #floatBox .float_table .body .td_4,
#ModulesSettingDetails #floatBox .float_table .body .td_7,
#ModulesSettingDetails #floatBox .float_table .body .td_10 {
    background: #ececec
}
#ModulesSettingDetails #floatBox .float_table .body .td_2,
#ModulesSettingDetails #floatBox .float_table .body .td_5,
#ModulesSettingDetails #floatBox .float_table .body .td_8,
#ModulesSettingDetails #floatBox .float_table .body .td_11 {
    background: #e2b1a2;
}
#ModulesSettingDetails #floatBox .float_table .body .td_input input {          
    padding-left: 5px;      
    width: 60%;    
    height: 30px !important;  
}
/* 賽程管理-模組管理-新增模組 */
#ModulesSettingCreate .baseline {
    width: 98%;
    letter-spacing: 2px;
}
#ModulesSettingCreate #btnGroup {margin-top: 15px;}
#ModulesSettingCreate #btnGroup #Submit {margin-right: 15px;}

/* 賽程管理-賽事列表 */
#GameList .date-box {
    display: inline-block; 
    margin-right: 5px; 
    vertical-align: middle;
}
#GameList table#contentMiddle{
    min-width: 1250px;
}
#GameList #contentMiddle th{
    text-align: center;
}
#GameList #contentMiddle td.center{
    text-align: center;
}
#GameList .content-footer {
    padding: 8px;
    height: 50px; 
    background: #eff5f9; 
}
/* 賽程管理-賽事列表-新增賽事 */
#GameListCreate .date-box {
    display: inline-block; 
    margin-right: 5px; 
    vertical-align: middle;
}
#GameListCreate .date-box .time {    
    display: inline-table;
    width:24%;
    vertical-align: top;
}
#GameListCreate .form-ul > li.baseline {
    width: 98%;
    letter-spacing: 2px;
}
#GameListCreate #btnGroup {margin-top: 15px;}
#GameListCreate #btnGroup .bg-add {margin-right: 15px;}
/* 賽程管理-賽事列表-賽事詳情 */
#gamesDetails #contentTop {
    margin-bottom: 0px;
    background: #666;
}
#gamesDetails #contentMiddle {
    margin-bottom: 0px;    
}
#gamesDetails #Cpanel {
    overflow-x: hidden;
    overflow-y: auto;
    position:relative;
    width: 100%;   
    height: 100%; 
    background: #ececec;
}
/* fixTable */
#gamesDetails #fixTable {
    display: table;
    position: absolute;
    width: 230px;
}
#gamesDetails #fixTable .header {
    display: table-header-group
}
#gamesDetails #fixTable .header div {
    display: table-cell;
}
#gamesDetails #fixTable .header .th_1 {
    padding: 4px 6px;
    width: 160px;
    text-align: center;
    background: #f9f9f9;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#gamesDetails #fixTable .header .th_2 {
    /* width: 70px; */
    text-align: center;
    background: #f9f9f9;   
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;    
    cursor: pointer;
}
#gamesDetails #fixTable .trigger-jump {
    display: table-cell;
    height: 31px;
    text-align: center;    
    vertical-align: middle;
    background: #5df9a3;   
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;    
    cursor: pointer;    
}
#gamesDetails #fixTable .trigger-jump.active {
    background: #fb8778;
}
#gamesDetails #fixTable .is_re_trigger.active {
    background: #fb8778;
}
#gamesDetails #fixTable .header .trigger-rtype {
    background: #5df9a3;
}
#gamesDetails #fixTable .header .trigger-rtype.active {
    background: #fb8778;
}
#gamesDetails #fixTable .header .th_2 .icheckbox_square-blue {
    left: 110%;
    top: -4px;
}
#gamesDetails #fixTable .body {
    display: table-row-group;
}
#gamesDetails #fixTable .body .tr {
    display: table-row;
}
#gamesDetails #fixTable .body .td {
    display: table-cell;    
    padding-right: 5px;
    width: 160px;    
    height: 31px;    
    text-align: right;
    vertical-align: middle;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#gamesDetails #fixTable .body .td.td_1 {background: #FF7878;}
#gamesDetails #fixTable .body .td.td_2 {background: #FFFF96;}
#gamesDetails #fixTable .body .td.td_3 {background: #fd81d7;}
#gamesDetails #fixTable .body .input-fast-setting {
    padding-left: 5px;
    width: 70px;
    height: 31px;    
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    border-left: 0px;
    border-top: 0px;
}
#gamesDetails #fixTable .footer {display: table-footer-group;}
/* floatTable */
#gamesDetails #floatBox {
    overflow-x: scroll;
    position: relative;
    margin-left: 230px;
    width: calc(100% - 230px);    
}
#gamesDetails #floatBox .float_table {
    overflow-y: hidden;
    position: relative;
    table-layout: fixed;    
    display: table;
    width: 100%;    
}
#gamesDetails #floatBox .float_table .header {
    display: table-header-group;
    position: relative;
}
#gamesDetails #floatBox .float_table .header label {
    margin-bottom: 0px;
    font-size: 12px;
    cursor: pointer;
}
#gamesDetails #floatBox .float_table .header div {display: table-cell;}
#gamesDetails #floatBox .float_table .header .th {
    padding: 3px 6px;    
    width: 100px;
    height: 29px;    
    text-align: center;    
    border-right: 1px solid #fff;    
    border-bottom: 1px solid #fff;
	word-break: keep-all;
	white-space: nowrap;
}
#gamesDetails #floatBox .float_table .header .th_0,
#gamesDetails #floatBox .float_table .header .th_1,
#gamesDetails #floatBox .float_table .header .th_2,
#gamesDetails #floatBox .float_table .header .th_3,
#gamesDetails #floatBox .float_table .header .th_4,
#gamesDetails #floatBox .float_table .header .th_5,
#gamesDetails #floatBox .float_table .header .th_6,
#gamesDetails #floatBox .float_table .header .th_7,
#gamesDetails #floatBox .float_table .header .th_8,
#gamesDetails #floatBox .float_table .header .th_9,
#gamesDetails #floatBox .float_table .header .th_10,
#gamesDetails #floatBox .float_table .header .th_11 {
    padding: 3px 6px;    
    width: 100px;
    height: 29px;   
    text-align: center;    
    border-right: 1px solid #fff;    
    border-bottom: 1px solid #fff;
	word-break: keep-all;
	white-space: nowrap; 
}
#gamesDetails #floatBox .float_table .header .th_0,
#gamesDetails #floatBox .float_table .header .th_3,
#gamesDetails #floatBox .float_table .header .th_6,
#gamesDetails #floatBox .float_table .header .th_9 {
    background: #9eccfd;
}
#gamesDetails #floatBox .float_table .header .th_1,
#gamesDetails #floatBox .float_table .header .th_4,
#gamesDetails #floatBox .float_table .header .th_7,
#gamesDetails #floatBox .float_table .header .th_10 {
    background: #ececec;
}
#gamesDetails #floatBox .float_table .header .th_2,
#gamesDetails #floatBox .float_table .header .th_5,
#gamesDetails #floatBox .float_table .header .th_8,
#gamesDetails #floatBox .float_table .header .th_11 {
    background: #e2b1a2;
}
#gamesDetails #floatBox .float_table .header .icheckbox_square-blue,
#gamesDetails #floatBox .float_table .body .icheckbox_square-blue {
    display: inline-block;
    border: 1px solid #2489c5;
}
#gamesDetails #floatBox .float_table .body {display: table-row-group;}
#gamesDetails #floatBox .float_table .body .tr {display: table-row;}
#gamesDetails #floatBox .float_table .body .td {
    display: table-cell;    
    height: 31px !important;       
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    transition: all .3s;
    cursor: pointer;
}
#gamesDetails #floatBox .float_table .body .td.active {background: #827f7f;}
#gamesDetails #floatBox .float_table .body .td[data-status="1"] {background: #5df9a3;}
#gamesDetails #floatBox .float_table .body .td[data-status="0"] {background: #fb8778;}
#gamesDetails #floatBox .float_table .body .td.td_0,
#gamesDetails #floatBox .float_table .body .td.td_1,
#gamesDetails #floatBox .float_table .body .td.td_2,
#gamesDetails #floatBox .float_table .body .td.td_3 {
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#gamesDetails #floatBox .float_table .body .td_0,
#gamesDetails #floatBox .float_table .body .td_3,
#gamesDetails #floatBox .float_table .body .td_6,
#gamesDetails #floatBox .float_table .body .td_9 {
    background: #9eccfd;
}
#gamesDetails #floatBox .float_table .body .td_1,
#gamesDetails #floatBox .float_table .body .td_4,
#gamesDetails #floatBox .float_table .body .td_7,
#gamesDetails #floatBox .float_table .body .td_10 {
    background: #ececec
}
#gamesDetails #floatBox .float_table .body .td_2,
#gamesDetails #floatBox .float_table .body .td_5,
#gamesDetails #floatBox .float_table .body .td_8,
#gamesDetails #floatBox .float_table .body .td_11 {
    background: #e2b1a2;
}
#gamesDetails #floatBox .float_table .body .td_input input {          
    padding-left: 5px;      
    width: 60%;    
    height: 30px !important;  
}

/* 11 -------------------------------------------------------------------------- */
/* 運動盤口 */
/* 運動盤口-賽事盤口 */
.gray{ background: rgb(221, 221, 221); }
.yellow{ background: rgb(251, 228, 16); }
.light_yellow{ background: rgb(251 248 218); }
.white{ color: #fff; }
.black{ color: #000; }
.purple{ color: #5858FA; cursor: pointer;}
.blue{ color: #0000ff; cursor: pointer;}
.bule1{ color: #337ab7; cursor: pointer;}
.green{ color: #008000; cursor: pointer;}
.green2{ color: #808000; cursor: pointer; }
.green3{ background: #c8ff72; }
.red{ color: #FF0000; cursor: pointer;}
.darkred{ color: #bc0000; cursor: pointer;}
.orange{ color: #ff8100; }
.orangebg{ background: #f5d0a9; }
.pink{ background: #e1bfe7; }
.pink_ga { background-color: rgba(247, 132, 131, 0.4) !important; }
  
.text_color_blue{color:#0000ff;}
.text_color_red{color:#FF0000;}
.text_color_green{ color: #008000;}
.wg_gray{ color: #7e7e7e; }
.fl_teamid_color{ color: #FF8282; }
.teamid_color{ color: #227fd0; }
.darkviolet{ color: #9400d3; cursor: pointer; }
.center{ text-align: center; }
.openStyle{ width: 15px; height: 21px; text-align: center;}
.pk-style{ width: 50px; height: 17px; }
.pkStyle{     
    text-align: center;
    background-color: #7e7e7e;
    color: #ffffff; 
    cursor: pointer;
}
.team_H_name{
    color:#008aff;
}

/* 開關樣式 */
.fullButton{
    border-radius: 5px;
    display: inline-block;
    margin: 0;
    padding: 1px;
    width: 100%;
    cursor: pointer;
    text-align: center;
    background-color: #ff0000;
    color: #ffffff;
}
.fullButton.open{ background-color: #008000; color: #fff; }
/* star */
.star-style{ 
    color: #337ab7; 
    cursor: pointer; 
    font-size: 18px;
}
/* 箭頭 */
.handicapTop-midd .fa-arrow-circle-up.green,
.handicapTop-midd .fa-arrow-circle-up.red,
.handicapTop-midd .fa-arrow-circle-up.purple,
.handicapTop-midd .fa-arrow-circle-down.green,
.handicapTop-midd .fa-arrow-circle-down.red,
.handicapTop-midd .fa-arrow-circle-down.purple{
    font-size: 16px;
}
.handicapTop-midd .fa-arrow-circle-up.red:hover, 
.handicapTop-midd .fa-arrow-circle-down.red:hover{ 
    color: #b20000; 
}
.handicapTop-midd .fa-arrow-circle-up.purple:hover,
.handicapTop-midd .fa-arrow-circle-down.purple:hover{ 
    color: #39399b; 
}
[data-block="handicap-block"],
[data-block="handicap-block-half"],
[data-block="handicap-block-oddOne"],
[data-block="handicap-block-evenTwo"],
[data-block="handicap-block-oddThree"],
[data-block="handicap-block-evenFour"]{
    position: relative;
}
.table-block{ margin-bottom: 10px; }
.table-bar {
    width: 100%;
    height: 40px;
    font-weight: bolder;
    background-color: #fff1a8;
    border:  1px solid #ccc;
    padding: 10px;
}
.table-bar a{ color: #333333; }
#scSp .form-group, #cpSp .form-group{
    margin: 0 10px 0 0;
    min-width: 100px;
    height: 34px;
    font-size: 14px;
    line-height: normal;
    vertical-align: middle;
    color: #555;
    background: #fff;
    border-radius: 0;
    border: 1px solid #abb7de;
    outline: none;
}
#scSp .title,
#scSp .form-group,
#cpSp .title,
#cpSp .form-group{
    display: inline-block;
    vertical-align: middle;
}

[data-table="time"] div{ line-height: 20px; }
[data-table="time"] .gameTime{ letter-spacing: 1px; }
[data-id="leagueTeam"] div,
[data-id="leagueTeam"] .icon-div{ text-align: left; }
[data-id="leagueTeam"] .icon-div,
.icon-i{ font-size: 16px; cursor: pointer; }

.handicap{ width: 100%; text-align: left; }
.handicap div div,
.handicap div i,
.handicap div,
.handicap-bottom div,
.handicapTop-right div{
    display: inline-block;
    vertical-align: middle;
}
.handicapTop-right a{ 
    text-align: right; 
    display: inline-block;
    vertical-align: middle;
}
.handicapMidd-right,
.handicapTop-right{ float: right; text-align: right; }
.handicap-bottom{
    /* width:240px;  */
    height: 17px; 
    /* position: relative; */
}
.handicap-bottom div{ float: left; text-align: center; }
.handicap-bottom span:first-child{ margin-left: 20px; }
.handicap-bottom p + div{ width: 50px; height: 17px; }
.handicap-bottom div:first-child{ width: 50px; height: 17px; }
.handicap-bottom div:last-child{ width: 79px; height: 17px; }
.handicap-bottom div.none,
.handicap-bottom p.Strong.none,
.handicap-bottom span.none{ visibility: hidden; }
.handicap-bottom p.Strong{ 
    position: absolute; 
    top: 65px;
    left: 5px;
    width: 50px;
    text-align: center;
    margin: 0;
}
[data-block="capot-block"] .handicap-bottom{ width: 23%; text-align: center; }
[data-block="single-block"].table-div-td{ vertical-align: top; padding: 10px 5px;}

[data-SpCtl="sc"].handicap-bottom {
    width: 28%;
    text-align: center;
}
[data-SpCtl="sc"].handicap-bottom span{
    display: inline-block;
}
[data-SpCtl="sc"].handicap-bottom span:first-child{
    margin-left: 0px;
}
#SpCtl .game-items.disabled {
    opacity: 0.5;    
    cursor: not-allowed;
}
#SpCtl .form-group {
    display: inline-block;
    margin: 0px;
    margin-right: 10px;
    vertical-align: middle;
}
#SpCtl .fixed_1 {
    position: sticky;
    left: 0px;        
    z-index: 90;  
}
#SpCtl .fixed_2 {
    position: sticky;
    left: 80px;        
    z-index: 90;  
}
#SpCtl .table-bet thead .tr-groups {background: #2b5663;}
#SpCtl .table-bet thead th { 
    padding: 5px 10px;
    padding-left: 25px;
    letter-spacing: 2px;
    text-align: left;    
    color: #fffa27;    
    background: #2b5663     
}
/* #SpCtl .table-bet td.title:first-child {border-right: 0;} */
#SpCtl .table-bet .tr-leagues td {
    padding: 5px 0px;
    padding-left: 10px;
    background: #fff1a8;
}
#SpCtl .table-bet .tr-leagues td a {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 4px;
    letter-spacing: 1px;
    color: #efefef;
    background: #337ab7;
    border-radius: 2px;
}

#SpCtl .table-bet td.title {
    padding: 2px 0px;
    letter-spacing: 1px;
    text-align: center;    
    color: #efefef;
    background: #434375;
    border-right: 1px solid #fff;    
}
body.ad #SpCtl .table-bet td.title {
    padding: 2px 0px;
    letter-spacing: 1px;
    text-align: center;    
    color: #efefef;
    background: #4173ace3;
    border-right: 1px solid #fff;    
}
body.ag #SpCtl .table-bet td.title {
    padding: 2px 0px;
    letter-spacing: 1px;
    text-align: center;    
    color: #efefef;
    background: #730d0d;
    border-right: 1px solid #fff;    
}

#SpCtl .table-bet tbody td {
    vertical-align: top;
    z-index: 1;
}
/* tr */
#SpCtl .table-bet tr.off td {background: #DDDDDD;}
#SpCtl .table-bet tr.on td {background: #FFFFFF;}
#SpCtl .table-bet tr.single td {background: #FFFFDE;}
#SpCtl .table-bet .td-rtype.off td {background: #b6b6b8;}
/* game-time */
#SpCtl .table-bet tr .td-game-time {
    padding: 2px;
    text-align: center;    
    height: 70px;
}
#SpCtl .table-bet tr.on .td-game-time {background:#FFFFFF;}
#SpCtl .table-bet .td-game-time .times {
    display: block;
    margin-left: 15%;
    width: 70%;    
    color: #434375;    
    cursor: pointer;
}
#SpCtl .table-bet .td-game-time .switch-all {
    display: block;
    margin: auto;
    width: 70%;
    font-size: 13px;
    text-align: center;
    color: #fff;
    background: #ea6858;
    border-radius: 2px;
    cursor: pointer;
    position: absolute;
    bottom: 10px;
    left: 0px;
    right: 0px;
}
#SpCtl .table-bet .td-game-time .switch-all-sp {
    display: block;
    margin-left: 15%;
    width: 70%;
    font-size: 13px;
    text-align: center;
    color: #000;
    background: #ea6858;
    border-radius: 2px;
    cursor: pointer;
}
/* game-team */
#SpCtl .table-bet tr.on .td-game-teams {    
    background:#FFFFFF;
    border-bottom: 1px solid #DCDCDC;
}
#SpCtl .table-bet .td-game-time,
#SpCtl .table-bet .scroll-fixed-game-time {
    position: relative;
    z-index: 90;    
    box-shadow: 0 0 0 1px #ccc;
}
#SpCtl .table-bet .scroll-fixed-game-teams,
#SpCtl .table-bet .td-game-teams {
    position: relative;
    z-index: 90;    
    box-shadow: 0 0 0 1px #ccc;
}
#SpCtl .table-bet .td-game-time,
#SpCtl .table-bet .td-game-teams {border-bottom: 1px solid #DCDCDC;}   
#SpCtl .table-bet .td-game-teams i {    
    margin-right: 4px;
    font-size: 16px;
    cursor: pointer;
    display: block;
    float: left;
}

#SpCtl .table-bet .td-game-teams .fl_stype,
.table-bet .fl_stype_all,
#cpSp .fl_stype,
#cpSp .fl_stype_all {
    display: inline-block;
    cursor: pointer;
    width: 20px;
    height: 16px;
    border-radius: 100%;
}
#SpCtl .table-bet .td-game-teams .fl_stype.selected,
#cpSp .fl_stype.selected {
    background-color: #FFFFBB;
}
#SpCtl .table-bet .fl_PN {
    left: 40px;
    background-image: url(/image/adm/site_icon/PN.png);
}
#SpCtl .table-bet .fl_1X {
    left: 65px;
    background-image: url(/image/adm/site_icon/1X.png);
}
#SpCtl .table-bet .fl_HG {
    left: 90px;
    background-image: url(/image/adm/site_icon/HG.png);
}
#cpSp .fl_BT {
    left: 90px;
    background-image: url(/image/adm/site_icon/BT.png);
}
#SpCtl .table-bet .td-game-teams table {
    width: 100%;
} 
#SpCtl .times_blue a {
    color: #2196f3;
    cursor: pointer;
}
/* operation */
#SpCtl .table-bet .td-operation {
    padding: 2px;
    text-align: center;
    border-left: 1px solid #DCDCDC;
}
#SpCtl .table-bet .td-operation i {
    font-size: 16px;
    cursor: pointer;
}
/* rtype */
#SpCtl .table-bet .td-rtype {
    padding: 2px;
    /* border-left: 1px solid #fff;
    border-bottom: 1px solid #fff; */
}
#SpCtl .table-bet .td-rtype.on {}
#SpCtl .table-bet .td-rtype.off {
    background: #b6b6b8;
}
/* style-R style-OU  讓分大小 */
#SpCtl .table-bet .td-io i,
#SpCtl .table-bet .td-fl i {
    font-size: 16px;
}
#SpCtl .table-bet .td-rtype table.style-R td, 
#SpCtl .table-bet .td-rtype table.style-OU td, 
#SpCtl .table-bet .td-rtype table.style-EO td,
#SpCtl .table-bet .td-rtype table.style-M td,
#SpCtl .table-bet .td-rtype table.style-RM td {    
    vertical-align: top;
    font-size: 12px;
}
#SpCtl .table-bet .td-rtype table.style-R .td-con,
#SpCtl .table-bet .td-rtype table.style-OU .td-con,
#SpCtl .table-bet .td-rtype table.style-R .td-con-unique,
#SpCtl .table-bet .td-rtype table.style-OU .td-con-unique{
    display: inline-block;
    width: 50px;    
    text-align: center;    
    color: #fff;
    background: #7e7e7e;
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-R .td-num,
#SpCtl .table-bet .td-rtype table.style-OU .td-num {    
    width: 40px;
    text-align: center;    
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-R .td-io,
#SpCtl .table-bet .td-rtype table.style-OU .td-io,
#SpCtl .table-bet .td-rtype table.style-R .td-fl,
#SpCtl .table-bet .td-rtype table.style-OU .td-fl  {    
    width: 20px;
    text-align: center;
}
#SpCtl .table-bet .td-rtype table.style-R .td-switch,
#SpCtl .table-bet .td-rtype table.style-OU .td-switch {    
    width: 20px;
    text-align: center;    
}
#SpCtl .table-bet .td-rtype table.style-R .td-gold,
#SpCtl .table-bet .td-rtype table.style-OU .td-gold {
    width: 120px;
    text-align: right;    
}
#SpCtl .table-bet .td-rtype table.style-R .td-gold a,
#SpCtl .table-bet .td-rtype table.style-OU .td-gold a {
    color: #2196f3;
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-R .td-last,
#SpCtl .table-bet .td-rtype table.style-OU .td-last {
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
#SpCtl .table-bet .td-rtype table.style-OU .td-pl-gold {
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
#SpCtl .table-bet .td-rtype table.style-R .td-con-count,
#SpCtl .table-bet .td-rtype table.style-OU .td-con-count,
#SpCtl .table-bet .td-rtype table.style-RM .td-con-count,
#SpCtl .table-bet .td-rtype table.style-R .td-con-pk,
#SpCtl .table-bet .td-rtype table.style-OU .td-con-pk,
#SpCtl .table-bet .td-rtype table.style-RM .td-con-pk {    
    width: 50px;    
    text-align: center;        
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-R .td-fl-count,
#SpCtl .table-bet .td-rtype table.style-OU .td-fl-count {               
    text-align: center;        
    cursor: pointer;
}
/* style2 單雙 */
#SpCtl .table-bet .td-rtype table.style-EO .td-con .td-con-unique {
    width: 20px;    
    text-align: center; 
}
#SpCtl .table-bet .td-rtype table.style-EO .td-num {
    width: 40px;
    text-align: center;    
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-EO .td-fl  {    
    width: 20px;
    text-align: center;
}
#SpCtl .table-bet .td-rtype table.style-EO .td-switch {    
    width: 20px;
    text-align: center;    
}
#SpCtl .table-bet .td-rtype table.style-EO .td-gold {
    width: 80px;
    text-align: right;    
}
#SpCtl .table-bet .td-rtype table.style-EO .td-gold a {
    color: #2196f3;
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-EO .td-last {
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
#SpCtl .table-bet .td-rtype table.style-EO .td-pl-gold {
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
/* styleM 獨贏,搶首分,搶尾分 */
#SpCtl .table-bet .td-rtype table.style-M .td-io,
#SpCtl .table-bet .td-rtype table.style-M .td-fl  {    
    width: 20px;
    text-align: center;
}
#SpCtl .table-bet .td-rtype table.style-M .td-num {
    width: 40px;
    text-align: center;    
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-M .td-switch {    
    width: 20px;
    text-align: center;    
}
#SpCtl .table-bet .td-rtype table.style-M .td-gold {
    width: 100px;
    text-align: right;    
}
#SpCtl .table-bet .td-rtype table.style-M .td-gold a {
    color: #2196f3;
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-M .td-last {
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
#SpCtl .table-bet .td-rtype table.style-M .td-pl-gold {
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
#SpCtl .table-bet .td-rtype table.style-M .td-fl-count {               
    text-align: center;        
    cursor: pointer;
}
/* style-RM 一輸 */
#SpCtl .table-bet .td-rtype table.style-RM .td-con {
    display: inline-block;
    width: 50px;    
    text-align: center;    
    color: #fff;
    background: #7e7e7e;
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-RM .td-con-2 {
    display: inline-block;
    width: 25px;    
    text-align: center;    
    color: #fff;
    background: #7e7e7e;
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-RM .td-io,
#SpCtl .table-bet .td-rtype table.style-RM .td-fl  {    
    width: 20px;
    text-align: center;
}
#SpCtl .table-bet .td-rtype table.style-RM .td-num {
    width: 40px;
    text-align: center;    
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-RM .td-switch {    
    width: 20px;
    text-align: center;    
}
#SpCtl .table-bet .td-rtype table.style-RM .td-gold {
    width: 80px;
    text-align: right;    
}
#SpCtl .table-bet .td-rtype table.style-RM .td-last {
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
#SpCtl .table-bet .td-rtype table.style-RM .td-pl-gold {
    width: 60px;
    text-align: right;
    padding-right: 4px;
}
#SpCtl .table-bet .td-rtype table.style-RM .td-fl-count {               
    text-align: center;        
    cursor: pointer;
}
#SpCtl .table-bet .td-rtype table.style-R .td-con-count.show,
#SpCtl .table-bet .td-rtype table.style-R .td-con-pk.show,
#SpCtl .table-bet .td-rtype table.style-R .td-fl-count.show,
#SpCtl .table-bet .td-rtype table.style-OU .td-con-count.show,
#SpCtl .table-bet .td-rtype table.style-OU .td-con-pk.show,
#SpCtl .table-bet .td-rtype table.style-OU .td-fl-count.show,
#SpCtl .table-bet .td-rtype table.style-EO .td-con-count.show,
#SpCtl .table-bet .td-rtype table.style-EO .td-con-pk.show,
#SpCtl .table-bet .td-rtype table.style-EO .td-fl-count.show,
#SpCtl .table-bet .td-rtype table.style-M .td-con-count.show,
#SpCtl .table-bet .td-rtype table.style-M .td-con-pk.show,
#SpCtl .table-bet .td-rtype table.style-M .td-fl-count.show,
#SpCtl .table-bet .td-rtype table.style-RM .td-con-count.show,
#SpCtl .table-bet .td-rtype table.style-RM .td-con-pk.show,
#SpCtl .table-bet .td-rtype table.style-RM .td-fl-count.show {
    display: table-cell !important;
}
/* 球頭彈窗 */
#floatWin,
#floatWinIO { 
    display: none;
    position: fixed;
    top: 20%;
    left: 20%;    
    width: 8%; 
    height: auto;     
    background: #fff;     
    border-radius: 5px;    
    box-shadow: 1px 5px 15px #555;    
    text-align: center;
    min-width: 150px;
}
.floatBtm button,
.floatBtm input,
#floatWin div,
#floatWinIO div {
    display: inline-block; 
    vertical-align: middle; 
}
.floatBtm button{ 
    padding: 2px 0;
    width: 100%;
    text-align: center;    
}
.floatBtm { 
    margin-top: 5px; 
    width: 100%; 
}
#floatWin input,
#floatWinIO input { 
    display: inline-block;
    margin: 10px auto; 
    width: 40%;
}
.floaTop { 
    padding: 5px 0;
    width: 100%; 
    text-align: center;     
    background: #f39c12;
    border-top-right-radius: 4px;
    border-top-left-radius:  4px;
    text-align:right;
    right:10px;
    padding-right: 10px;
}
.floatBtm [name="cancel"] {
    border-top-right-radius:  0;
    border-bottom-left-radius:  0;
}
.ui-timepicker-standard a{padding:0;}
/* 運動盤口-足球特別玩法 */
#ScSp {}
.group { display: table-row-group; }
.row { display:table-row; }
.caption { caption-side: top;  display: table-caption;  }
.table-div-td-rowspan{ display: table-row-group; }
.sc_sp{ margin-bottom: 10px; }
.table-block.bgcolors table tr td,
.Bgcolors{
    background: #e1e1e1;
}
.btm-line{ border-bottom: 1px solid #fff; }
.league-block a,
.league-block div,
.game-block i,
.game-block div{ display: inline-block;}
.game-block i,
.game-block div{
    vertical-align: middle;
    font-size: 12px;
}
.league-block a,
.league-block div{ vertical-align: top; }
.game-block{ background: #e5dede; }
.league-block a{ 
    background: #334b88; 
    padding: 0 5px; 
    border-radius: 5px; 
    color: #fff;
}
.switch[data-type="full-field"]{
    width: 45px;
    height: 20px;
    border-radius: 99em;
    background: #4CAF50;
    border: 1px solid #307633;
    position: relative;
    cursor: pointer;
    box-shadow: 0 0 1px #307633 inset;
    display: inline-block;
    transform: 0.5s;
}
.switch .ball{
    width: 17px;
    height: 17px;
    background: #fff;
    border-radius: 99em;
    position: absolute;
    top: 0;
    right: 26px;
    box-shadow: 2px 0px 1px #2c612e;
    transition: 0.5s;
}
.switch .ball + div{
    position: absolute;
    top: 1px;
    right: 7px;
    color: #fff;
}
[data-block="half-full-field"] .ball + div,
[data-block="num-goals"] .ball + div{
    top: -1px;
}
.switch[data-type="full-field"].closed{
    background: #ff1f3e;
    border: 1px solid #851222;
    box-shadow: 0 0 1px #851222 inset;
    transition: 0.5s;
}
.switch[data-type="full-field"].closed .ball{
    right: 0;
    box-shadow: 0 2px 1px #851222;
}
.switch[data-type="full-field"].closed .ball + div{ right: 25px; }

.game-setting{ margin-left: 5px; }
.game-setting i{ font-size: 14px; color: #334b88;}

.scSp-block .table-div-th, 
.scSp-block .table-div-td,
.cpSp-block .table-div-th, 
.cpSp-block .table-div-td {
    width: 115px;
}
.scSp-block td, .cpSp-block td{ 
    width: 120px; 
    padding: 2px 5px !important;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.switch-block{ width: 100%; color: #000;}
.switch-block i{ font-size: 16px; }
.switch-block i, 
.switch-block div{ display: inline-block; vertical-align: middle; }
.switch-block .scSp-num{ margin-left: 10px; }

.note-block{ 
    width: 100%; 
    display: inline-block;     
    text-align: right;
}

[data-block="half-field"] .game-block i,
[data-block="full-field"] .game-block i{
    font-size: 16px;
}
[data-block="half-full-field"] .switch-block,
[data-block="num-goals"] .switch-block{
    text-align: left;
    padding-left: 31px;
}
[data-block="half-full-field"] .switch-block div,
[data-block="num-goals"] .switch-block div{
    margin: 0 14px;
}
[data-block="half-full-field"] .handicap-bottom,
[data-block="num-goals"] .handicap-bottom{
    width: 100%;
    text-align: center;
}
[data-block="half-full-field"] .handicap-bottom div,
[data-block="num-goals"] .handicap-bottom div{
    width: 70%;
}
[data-block="num-goals"] .numGoals-header{ width: 715px; padding: 10px 0 0; }
[data-block="num-goals"] .numGoals-header > div{ padding: 0 0 10px; }
[data-block="num-goals"] .numGoals-tr .table-div-th{ width: 1%; border-top: 1px solid #ccc; }
[data-block="num-goals"] .numGoals-tr .table-div-th:last-child{ border-right: none; }

[data-block="half-full-field"] .numGoals-header{ padding: 10px 0 0; }
[data-block="half-full-field"] .numGoals-header > div{ padding: 0 0 10px; }
[data-block="half-full-field"] .numGoals-tr .table-div-th{ width: 1%; border-top: 1px solid #ccc; }
[data-block="half-full-field"] .numGoals-tr .table-div-th:last-child{ border-right: none; }
[data-block="half-full-field"] .switch-block{ padding-left: 24px; }
.tix_total {
    width: 100px;
    font-size: 14px !important;
    padding-left: 5px;
    text-align: right;
    color: #3c8dbc;
}
/* 運動盤口-已開賽 */
#GamePlaying {}
[data-page="gamePlaying"] .openStyle { width: 50px; }
[data-page="gamePlaying"] .pk-style { margin-left: 15px; }
[data-page="gamePlaying"] [data-block="capot-block"] .handicapTop-midd{ margin-left: 15px; }
[data-page="gamePlaying"] [data-block="single-block"] .handicapTop-midd{ margin-left: 15px; }
#gamesResult thead th, #gamesResult tbody td{
    border : 1px solid #cac0bf;
    text-align: center;
    white-space: nowrap;
}
#gamesResult tfoot input,#gamesResult tfoot span{
    margin-left: 10px;
}
#gamesResult .ipt-checkbox{
    float : left;
    text-align: left;
    width : 10%;
    font-size : 14px;
    margin: 5px 0px 5px 15px;
}
#gamesResult tfoot tr:first-child td:first-child {
    padding-top: 10px;
}
#gamesResult tfoot tr:first-child .ipt-checkbox {
    width: 5%;
}
#gamesResult .ipt-checkbox label{
    cursor: pointer;
}
#gamesResult .btn-input{
    cursor: pointer;
}
#gamesResult .bg-white input[type=text]{
    margin: 10px;
    width : 60px;
}
#gamesResult .btn-send{
    font-size: 14px !important;
    font-weight: bold !important;
    padding: 10px !important;
    color: #efefef !important;

    white-space: nowrap;
    letter-spacing: 2px;
    background: #286090;
    box-shadow: none;
    width: -webkit-fill-available;
    cursor: pointer;
}
#gamesResult .btn-send-disabled {
    background: #999999;
    cursor: not-allowed;
}
#gamesResult .walk{
    background : #c7ffc4;
}
#gamesResult .single{
    background : #e7f9ec;
}
#gamesResult .remark_column{
    padding: 0px 10px;
    margin: 0px;
}
/* 運動盤口-歷史比賽 */
#HistoryGames .content-footer {
    height: 50px; 
    background: #eff5f9;
}
/* 運動盤口-即時注單 & 運動盤口-延遲注單 & 運動盤口-賽事盤口>賽事注單   共用*/
#windowOpne{ margin-left: 0; }
#windowOpne .search-list .text{ padding-right: 20px; font-size: 12px;}
#windowOpne .search-list .textInput{ height: 34px; }
#windowOpne .search-list .padStyle{ 
    width: 100px; 
    height: 34px;;
    padding: 6px 12px; 
    margin-right: 20px;
}
#windowOpne [data-icon="volume"]{ font-size: 18px; }
[data-block="initBetting-block"] .table-div-td div{ text-align: center; }
[data-block="initBetting-block"] .table-div-td.time-block div,
[data-block="initBetting-block"] .table-div-td.money-block div{ 
    text-align: center; 
}
[data-block="initBetting-block"] .table-div-td.team-block div{
    text-align: right;
}
[data-block="delayBetting-block"] .table-div-td.team-block div{
    text-align: right;
}
.table-wrapper-scroll-y{
    background: #fff;
    position: relative;
    min-width: 1250px;
    height: 840px;
    /* overflow: auto; */
    display: block;
}
.left-box {
    float: left;
}
#immediateTicket,
#delayTicket,
#gamesbetTicket{
    font-family: '微軟正黑體';
    font-size: 14px;
}

#immediateTicket thead, #immediateTicket tbody, #immediateTicket tfoot,
#delayTicket thead, #delayTicket tbody, #delayTicket tfoot,
#gamesbetTicket thead, #gamesbetTicket tbody, #gamesbetTicket tfoot{
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #434375;
}
body.ad #immediateTicket thead, body.ad #immediateTicket tbody, body.ad #immediateTicket tfoot,
body.ad #delayTicket thead, body.ad #delayTicket tbody, body.ad #delayTicket tfoot,
body.ad #gamesbetTicket thead, body.ad #gamesbetTicket tbody, body.ad #gamesbetTicket tfoot{
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #4173ace3;
}
body.ag #immediateTicket thead, body.ag #immediateTicket tbody, body.ag #immediateTicket tfoot,
body.ag #delayTicket thead, body.ag #delayTicket tbody, body.ag #delayTicket tfoot,
body.ag #gamesbetTicket thead, body.ag #gamesbetTicket tbody, body.ag #gamesbetTicket tfoot{
    letter-spacing: 2px;
    text-align: center;
    vertical-align: middle;
    color: #efefef;
    background-color: #730d0d;
}

#immediateTicket thead th, #immediateTicket tfoot td,
#delayTicket thead th, #delayTicket tfoot td,
#gamesbetTicket thead th, #gamesbetTicket tfoot td{
    text-align: center;
    border-right: 1px solid;
}
#immediateTicket tbody tr:nth-child(even),
#delayTicket tbody tr:nth-child(even),
#gamesbetTicket tbody tr:nth-child(even){
    background: #FFFFFF;
}
#immediateTicket tbody tr:nth-child(odd),
#delayTicket tbody tr:nth-child(odd),
#gamesbetTicket tbody tr:nth-child(odd){
    background: #FFFFFF;
}
#immediateTicket tbody td,
#delayTicket tbody td,
#gamesbetTicket tbody td{
    color:#000000;
    text-align:center;
    vertical-align: middle;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
#immediateTicket tbody td.notice,
#delayTicket tbody td.notice,
#gamesbetTicket tbody td.notice{
    background: #DDDDDD;
}
#gamesbetsearch .multiSelect .btn-group ul,
#immediateTicket .dropdown,
#delayTicket .dropdown,
#popoverBox .dropdown,
#gamesbetTicket .dropdown{
    /* border-color: #ccc6c6;
    box-shadow: 3px 3px 12px #868686;
    padding: 3px; */
    border: 1px solid #ccc;
    border-radius: 5px;
}
#immediateTicket .dropdown .active,
#delayTicket .dropdown .active,
#popoverBox .dropdown .active,
#gamesbetTicket .dropdown .active{
    border-color: #ccc6c6;
    box-shadow: 3px 3px 12px #868686;
    padding: 3px;
}
#delayTicket .col_func .wrapper {
    display: grid;
}
#delayTicket .col_func .wrapper .btn{
    margin: 3px;
}
/* 比賽結果 - 運動結果 */
#SportsResult table{
    width : 100%;
}
#SportsResult table tbody tr:nth-child(4n){
    background-color: #e0f0ff;
}
#SportsResult table tbody div:not(.cs_title) {
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
#SportsResult table tbody td{
    /* border: 1px solid #ccc; */
    text-align: center;
    vertical-align : top;
}
#SportsResult table tbody .colLeague{
    padding-left : 20px;
    text-align : left;
}
#SportsResult tbody .cs_title{
    display : block;
    height: 30px;
    line-height: 10px;
    border-right: none;
    border-bottom: 1px solid #d2c7c7;
    background-color : #FFFFBF;
    color:black;
}
#SportsResult .date-box{
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}

#HisgamesRcd table .leagues {
    background-color : #FFFFBF;
    color:black;
    text-align: left;
    font-weight:bold;
}

#HisgamesRcd table tbody tr.evenBk {
    background-color: #e0f0ff;
}

/* 運動盤口-跟盤水位 */
#FollowOther #date {
    z-index: 99999;
}
#FollowOther #ModalRtype {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999999;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,.4);
}
#FollowOther #RtypeBox {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -400px;
    margin-top: -325px;
    padding: 50px;
    padding-top: 0px;
    width: 800px; 
    height: 650px;
    background: #efefef;
    -webkit-box-shadow: 4px 3px 5px 1px rgba(0,0,0,0.1);
    -moz-box-shadow: 4px 3px 5px 1px rgba(0,0,0,0.1);
    box-shadow: 4px 3px 5px 1px rgba(0,0,0,0.1);
}
#FollowOther #RtypeBox ul.fast-setting {
    text-align: center;
}
#FollowOther #RtypeBox ul.fast-setting li {
    display: inline-block;
    margin-right: 10px;
    padding: 5px 10px;
    color: #7aacd8;
    border: 1px solid #7aacd8;
    cursor: pointer;
    transition: all .5s;
}
#FollowOther #RtypeBox ul.fast-setting li.active,
#FollowOther #RtypeBox ul.fast-setting li:hover {
    color: #fff;
    background: #7aacd8;
}
#FollowOther #RtypeBox .chk-div {
    display: inline-block;
    margin-top: 5px;
    width: 19%;  
    font-weight: normal;
    letter-spacing: 1px;
    color: #4e4c4c;
    cursor: pointer;     
}

#FollowOther.follow_sccoca #RtypeBox .chk-div {
    width: 24%;
}
#RtypeBox #TopLine {
    position: relative; 
    width: 100%; 
    height: 60px; 
    line-height: 60px;     
}
#BetTable .bet-table thead tr th {
    position: sticky;
    top: 0px;
    z-index: 100;
    padding: 8px;
    letter-spacing: 2px;    
    text-align: center; 
    color: #d2ecec;   
    background: #234fa7;
}
#BetTable .bet-table .league {
    height: 30px;
    letter-spacing: 1px;
    background: #f5b147;  
}
#BetTable .bet-table .league .game-time {
    position: sticky;
    left: 0;
    z-index: 99;      
}
#BetTable .bet-table .league .game-team {
    position: sticky;
    left: 0px;
    z-index: 99;    
}
#BetTable .bet-table .game-row {
    border-bottom: 1px solid #d2c7c7;
}
#BetTable .bet-table .game-row.game-row-last {
    border-bottom: 0px;
}
#BetTable .bet-table .game-row .game-time {
    position: sticky;
    left: 0;
    z-index: 99;
    text-align: center;    
    background: rgb(255, 255, 255);
    box-shadow: 0 0 0 1px #ccc;
    border-style: solid;
    border-width: 1px;
    border-color: #ccc;
}

#BetTable .bet-table .game-row .game-time::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    border-right: 1px solid #ccc;
    display: block;
    top : 1px;
    left: 0;
}

#BetTable .bet-table .game-row .game-time .time {
    color: #f14c4c;
}
#BetTable .bet-table .game-row .game-time .web {
    color: #227fd0;
}
#BetTable .bet-table .game-row .game-team {
    position: sticky;
    left: 60px;
    z-index: 99;    
    padding-left: 10px;    
    color: rgb(51, 52, 57);
    background: rgb(255, 255, 255);
    box-shadow: 0 0 0 1px #ccc;
    border-style: solid;
    border-width: 1px;
    border-color: #ccc;
}
#BetTable .bet-table .game-row .game-team::before {
    content: '';
    position: absolute;
    width: 1px;
    height: 100%;
    border-right: 1px solid #ccc;
    display: block;
    top : 1px;
    right: 0;
}
#BetTable .bet-table .game-row .game-team .gid {
    letter-spacing: 1px;
    color: #f14c4c;
}
#BetTable .bet-table .game-row .float-td {
    background: rgb(255, 255, 255);
    border-right: 1px solid #d2c7c7;    
    transition: all .5s;
}


#BetTable #TableLeft {
    display: inline-block;
    position: relative;
    z-index: 9999;
    vertical-align: top;
}
#BetTable #TableRight {    
    display: inline-block;
    position: relative;
    left: -4px;    
    width: 1400px;
}
#FollowOther #FixTable {    
    width: 300px;
    border: 1px solid #ccc;
    background: #fff;
}
#FollowOther #FixTable th {
    position: sticky;
    top: 0;
    padding: 8px 0;    
    text-align: center;
    font-weight: normal;
    font-size: 14px;
    color: #efefef;
    letter-spacing: 2px;
    border-right: 1px solid #e0dbdb;
    background: #434375;
}
#FollowOther #FixTable tr.league,
#FollowOther #FloatTable tr.league {        
    height: 30px;
    text-align: center;        
    letter-spacing: 1px;
    background: #fbb039;    
}
#FollowOther #FixTable tr.league td {}
#FollowOther #FixTable tr.game-row,
#FollowOther #FloatTable tr.game-row {
    height: 70px;
    border-bottom: 1px solid #e0dbdb;
    border-top: 1px solid #e0dbdb;
}
#FollowOther #FixTable td.game-time {        
    text-align: center;
    border-right: 1px solid #e0dbdb;
}
#FollowOther #FixTable td.game-time span {
    display: inline-block;
    width: 100%;
}
#FollowOther #FixTable td.game-time span.web_1XB {
    letter-spacing: 1px;
    color: #df5e2c;
}
#FollowOther #FixTable td.game-time span.web_PINN {
    letter-spacing: 1px;
    color: blue;
}
#FollowOther #FixTable td.game-team span {    
    display: inline-block;
    padding-left: 5px;
    letter-spacing: 0px;
    width: 100%;
}
#FollowOther #FixTable td.game-team span.gid {
    letter-spacing: 1px;
    color: #df5e2c
}
#FloatTable {
    table-layout: fixed;     
    width: 800px;
    border: 1px solid #ccc;
    border-left: 0px; 
    background: #fff;
}
#FollowOther #FloatTable thead {
    position: -webkit-sticky;
    top: 0;
}
#FollowOther #FloatTable th {
    position: sticky;
    top: 0;
    padding: 8px 0;    
    text-align: center;
    font-weight: normal;
    font-size: 14px;
    color: #efefef;
    letter-spacing: 2px;
    border-right: 1px solid #e0dbdb;
    background: #4c5c92;
}
#FloatTable td.float-td {
    /* padding: 0 10px; */
    border-right: 1px solid #e0dbdb;
    transition: all .5s;
}
#FloatTable td.float-td .io1_str {
    color: #df5e2c
}
#FloatTable td.float-td .io2_str {
    color: #03a9f4
}
#FloatTable td.float-td .io3_str {
    color: #00a65a
}
#FloatTable td.float-td.change-bet {
    animation-name: betChange;
    animation-duration: 1s;
    animation-timing-function:step-start;
} 
#FollowOther .span_bet {
    display: inline-block; 
    width: 48%; 
    text-align: center;
}
#FollowOther .span_bet_other {
    display: inline-block; 
    width: 85%; 
    text-align: right;
    color: red;
}
#FollowOther .span_bet_bottom {
    display: inline-block; 
    width: 50%;
    text-align: center;
    background-color: #f5d0a9 !important;
}
@keyframes betChange {
    0%{        
        background:#fff;
    }
    33%{        
        background: #ffd4db;
    }
    100%{        
        background:#c0f188;
    }    
}
#FollowOther #BetTable td.float-td.td_1_3,
#FollowOther #BetTable td.float-td.td_11_3,
#FollowOther #BetTable td.float-td.td_21_3,
#FollowOther #BetTable td.float-td.td_31_3,
#FollowOther #BetTable td.float-td.td_41_3,
#FollowOther #BetTable td.float-td.td_51_3,
#FollowOther #BetTable td.float-td.td_61_3,
#FollowOther #BetTable td.float-td.td_201_3,
#FollowOther #BetTable td.float-td.td_211_3,
#FollowOther #BetTable td.float-td.td_301_3,
#FollowOther #BetTable td.float-td.td_311_3,
#FollowOther #BetTable td.float-td.td_2_3,
#FollowOther #BetTable td.float-td.td_12_3,
#FollowOther #BetTable td.float-td.td_22_3,
#FollowOther #BetTable td.float-td.td_32_3,
#FollowOther #BetTable td.float-td.td_42_3,
#FollowOther #BetTable td.float-td.td_52_3,
#FollowOther #BetTable td.float-td.td_62_3,
#FollowOther #BetTable td.float-td.td_202_3,
#FollowOther #BetTable td.float-td.td_212_3,
#FollowOther #BetTable td.float-td.td_302_3,
#FollowOther #BetTable td.float-td.td_312_3{                
    box-shadow: inset 0px 0px 0px 0.5px #00c0ef;
    color: red;
}
#FollowOther .float-td.pink {
    background: #ffd4db !important;
}
/* 12 -------------------------------------------------------------------------- */
/* 比賽結果 */
/* 比賽結果-運動結果 */
#SportsResult .content-footer {
    height: 50px; 
    background: #eff5f9;
}
.icon{ 
    display: block;
    position: relative;
    line-height: 30px;
    width: 100%;
    height: 30px;
}
.game_bs{ background-image: url(/image/sport/icon_game_bs.svg); }
.game_sc{ background-image: url(/image/sport/icon_game_sc.svg); }
.game_sc2{ background-image: url(/image/sport/icon_game_sc2.svg); }
.game_bk{ background-image: url(/image/sport/icon_game_bk.svg); }


.game_tn{ background-image: url(/image/sport/icon_game_tn.svg); }
.game_vb{ background-image: url(/image/sport/icon_game_vb.svg); }
.game_bv{ background-image: url(/image/sport/icon_game_vb.svg); }
.game_bb{ background-image: url(/image/sport/icon_game_bb.svg); }
.game_es{ background-image: url(/image/sport/icon_game_es.svg); }
.game_tt{ background-image: url(/image/sport/icon_game_tt.svg); }
.game_pb{ background-image: url(/image/sport/icon_game_pb.svg); }
.game_hb{ background-image: url(/image/sport/icon_game_hb.svg); }
.game_data{ background-image: url(/image/sport/icon_game_data.svg); }
.svgIcon{ 
    background-size: 55% 30px;
    background-position: center;
    background-repeat: no-repeat;
}
/* .games_result #contentBlock .table-block{display:none;} */
/* .games_result #contentBlock .table-block.active{display:block;} */

/* 13 -------------------------------------------------------------------------- */
/* 模組設定 */
/* 模組設定-模組玩法 */
#ModulesRtype .content-middle {
    min-width: 1250px;
    overflow: hidden;
}
#ModulesRtype .content-footer a {
    margin-top: 10px;
}
#ModulesRtype #LeftBox {
    overflow-y: auto;
    float: left;
    width: 70%;
    height: 100%;    
}
#ModulesRtype #LeftBox .sort-section {
    display: inline-block; 
    margin-top: 20px;
    width: 80%;    
}
#ModulesRtype #LeftBox .sortable {
    margin-left: 1%;
    padding-top: 2px;
    padding-left: 2px;
    width: 98%;    
    height: 182px;
    background: #444;    
}
#ModulesRtype #RightBox {
    overflow-y: auto;
    float: left;
    width: 30%;
    height: 100%;
    background: #565353;
}
#ModulesRtype #RightBox .sortable2 {     
    padding: 10px;    
    height: 100%;
}
#ModulesRtype #LeftBox .sortable span,
#ModulesRtype #RightBox .sortable2 span {
    overflow: hidden;
    float: left;
    display: block;
    margin-right: 3px;
    margin-bottom: 3px;
    padding: 10px;
    width: 140px;    
    letter-spacing: 1px;
    text-overflow: ellipsis;
    white-space: nowrap; 
    text-align: center;
    background: #cecebb;
    border: 1px solid #c7c0c0;
    cursor: pointer;
    transition: all .3s;
}
#ModulesRtype #LeftBox .sortable span:hover,
#ModulesRtype #RightBox .sortable2 span:hover {
    background: #e2e2b9;
}
/* 模組設定-模組玩法-新增玩法 */
#ModulesRtypeCreate #btnGroup {
    margin-top: 15px;
}
#ModulesRtypeCreate #btnGroup a,
#ModulesRtypeCreate #btnGroup input {
    margin-right: 15px;
}
/* 模組設定-模組玩法-玩法列表 */
#ModulesRtypeShowList #RtypeList .p-tag {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 6px 8px;
    color: #666;
    background: #fff;
    border: 1px solid #666;
    transition: all .5s;
    cursor: pointer;
}
#ModulesRtypeShowList #RtypeList .p-tag:hover {
    color: #222;
    background: #f39c12;
    border: 1px solid #222;
}
#ModulesRtypeShowList #RtypeList .p-tag.active {
    color: #222;
    background: #f39c12;
    border: 1px solid #222;    
}
/* 模組設定-模組控制項 */
#ModulesControllers .content-middle {overflow: hidden; min-width: 1250px;}  
#ModulesControllers .content-footer a {margin-top: 10px;}
#ModulesControllers #LeftBox {
    overflow-y: auto;
    float: left;
    width: 70%;
    height: 100%;    
}
#ModulesControllers #LeftBox .sort-section {margin-top: 20px;}
#ModulesControllers #LeftBox .sortable {
    margin-left: 1%;
    padding-top: 2px;
    padding-left: 2px;
    width: 98%;    
    height: 182px;
    background: #444;    
}
#ModulesControllers #RightBox {
    overflow-y: auto;
    float: left;
    width: 30%;
    height: 100%;
    background: #565353;
}
#ModulesControllers #RightBox .sortable2 { 
    overflow-y: auto;
    padding: 10px;   
    height: 100%; 
}
#ModulesControllers #LeftBox .sortable span,
#ModulesControllers #RightBox .sortable2 span {
    overflow: hidden;
    float: left;
    display: block;
    margin-right: 3px;
    margin-bottom: 3px;
    padding: 10px;
    width: 140px;    
    letter-spacing: 1px;
    text-overflow: ellipsis;
    white-space: nowrap; 
    text-align: center;
    background: #cecebb;
    border: 1px solid #c7c0c0;
    cursor: pointer;
    transition: all .3s;
}
#ModulesControllers #LeftBox .sortable span:hover,
#ModulesControllers #RightBox .sortable2 span:hover {
    background: #e2e2b9;
}
/* 模組設定-模組控制項-新增控制項 */
#ModulesControllersCreate #btnGroup {
    margin-top: 15px;
}
#ModulesControllersCreate #btnGroup a,
#ModulesControllersCreate #btnGroup input {
    margin-right: 15px;
}
/* 控制項列表 */
#ModulesControllersShowList #ControllerList .c-tag {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 6px 8px;
    color: #666;
    background: #fff;
    border: 1px solid #666;
    transition: all .5s;
    cursor: pointer;
}
#ModulesControllersShowList #ControllerList .c-tag:hover {
    color: #222;
    background: #f39c12;
    border: 1px solid #222;
}
#ModulesControllersShowList #ControllerList .c-tag.active {
    color: #222;
    background: #f39c12;
    border: 1px solid #222;    
}
/* 模組設定-模組狀態 */
#rtypeStatuslist .content-footer {
    padding: 8px;
}
#rtypeStatuslist #Cpanel {
    overflow-x: hidden;
    overflow-y: auto;
    position:relative;
    width: 100%;   
    height: 100%; 
    background: #ececec;
}
/* fixTable */
#rtypeStatuslist #fixTable {
    display: table;
    position: absolute;
    width: 230px;
}
#rtypeStatuslist #fixTable .header {
    display: table-header-group
}
#rtypeStatuslist #fixTable .header div {
    display: table-cell;
}
#rtypeStatuslist #fixTable .header .th_1 {
    padding: 4px 6px;
    width: 160px;
    text-align: center;
    background: #f9f9f9;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#rtypeStatuslist #fixTable .header .th_2 {
    /* width: 70px; */
    text-align: center;
    background: #f9f9f9;   
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;    
    cursor: pointer;
}
#rtypeStatuslist #fixTable .body {
    display: table-row-group;
}
#rtypeStatuslist #fixTable .body .tr {
    display: table-row;
}
#rtypeStatuslist #fixTable .body .td {
    display: table-cell;    
    padding-right: 5px;
    width: 160px;    
    height: 31px;    
    text-align: right;
    vertical-align: middle;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#rtypeStatuslist #fixTable .body .td.td_1 {    
    background: #FF6E6E;
}
#rtypeStatuslist #fixTable .body .td.td_2 {
    background: #f3d771;
}
#rtypeStatuslist #fixTable .body .td.td_3 {
    background: #fd81d7;
}
#rtypeStatuslist #fixTable .footer {
    display: table-footer-group;    
}
/* floatTable */
#rtypeStatuslist #floatBox {
    overflow-x: scroll;
    position: relative;
    margin-left: 230px;
    width: calc(100% - 230px);    
}
#rtypeStatuslist #floatBox .float_table {
    position: relative;
    table-layout: fixed;    
    display: table;
    width: 100%;    
}
#rtypeStatuslist #floatBox .float_table .header {
    display: table-header-group;
    position: relative;
}
/*#rtypeStatuslist #floatBox .float_table .header .th_0 {
    padding: 3px 6px;    
    width: 120px;
    height: 29px;   
    text-align: center;   */ 
    /* background: #9eccfd; */
    /*border-right: 1px solid #fff;    
    border-bottom: 1px solid #fff;    
}*/
#rtypeStatuslist #floatBox .float_table .header .th_0,
#rtypeStatuslist #floatBox .float_table .header .th_2,
#rtypeStatuslist #floatBox .float_table .header .th_4,
#rtypeStatuslist #floatBox .float_table .header .th_6,
#rtypeStatuslist #floatBox .float_table .header .th_8{
    background: #9eccfd;
}
#rtypeStatuslist #floatBox .float_table .header .th_1,
#rtypeStatuslist #floatBox .float_table .header .th_3,
#rtypeStatuslist #floatBox .float_table .header .th_5,
#rtypeStatuslist #floatBox .float_table .header .th_7,
#rtypeStatuslist #floatBox .float_table .header .th_9 {
    background: #AAAAAA;
}

#rtypeStatuslist #floatBox .float_table .header label {
    margin-bottom: 0px;
    font-size: 12px;
    cursor: pointer;
}
#rtypeStatuslist #floatBox .float_table .header div {
    display: table-cell;
}
#rtypeStatuslist #floatBox .float_table .header .th {
    padding: 3px 6px;    
    width: 145px;
    height: 29px;    
    text-align: center;    
    border-right: 1px solid #fff;    
    border-bottom: 1px solid #fff;    
}
#rtypeStatuslist #floatBox .float_table .body {
    display: table-row-group;
}
#rtypeStatuslist #floatBox .float_table .body .tr > div{
    display: table-cell;
}
#rtypeStatuslist #floatBox .float_table .body .tr {
    display: table-row;
}
#rtypeStatuslist #floatBox .float_table .body .td {
    display: table-cell;    
    height: 31px !important; 
    width:120px;      
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    transition: all .3s;
    cursor: pointer;
}
#rtypeStatuslist #floatBox .float_table .body .td.active { 
    background: #827f7f;
}
#rtypeStatuslist #floatBox .float_table .body .td[data-status="1"] {
    background: #5df9a3;
}
#rtypeStatuslist #floatBox .float_table .body .td[data-status="0"] {
    background: #fb8778;
}
#rtypeStatuslist .no-data {
    padding-top: 10px;
    letter-spacing: 1px;
}
/* 14 -------------------------------------------------------------------------- */
/* 球種設定 */
/* 球種設定-群組管理 */
#Groups .content-middle {overflow: hidden;}
#Groups li .btn-group {margin-right: 20px;}
#Groups #LeftBox {
    overflow-y: auto;
    float: left;
    width: 70%;
    height: 100%;    
}
#Groups #LeftBox .rowSection{
    min-height: 182px;
    height:182px;
    display:inline-table;
    margin-top: 20px;
    width:100%;
}
#Groups #LeftBox .other-section {
    display: inline-table;
    margin-left: 20px;
    padding-left: 10px;
    padding-top: 10px;
    height: 100%;
    width:200px;
    vertical-align: top;
    background: #ffbe00;
}
#Groups #LeftBox .other-section .group,
#Groups #LeftBox .other-section .area {
    display: block;
    margin-top: 10px;
}
#Groups #LeftBox .sort-section {
    display: inline-block; 
    width: 80%;
    height: 100%;
}
#Groups #LeftBox .sort-section .delete{
    height:100%;
    width: 70px;
    float: right;
    color:#ccc;
    line-height:160px;
    border: 0px;
    margin-right:10px;
    background: content-box;

    text-align: center;
    display: inline-grid;
    align-items: center;

}
#Groups #LeftBox .sort-section .delete:hover{
    background: #984646;
}
#Groups #LeftBox .sortable {
    margin-left: 1%;
    padding-top: 10px;
    padding-left: 2px;
    width: 98%;
    min-height:182px;
    background: #444;
    height:100%;
}
#Groups #RightBox {
    overflow-y: auto;
    float: left;
    width: 30%;
    height: 100%;
    background: #565353;
}
#Groups #RightBox .sortable2 {
    padding: 10px;
    height: 100%;
}
#Groups #LeftBox .sortable div,
#Groups #RightBox .sortable2 div {
    overflow: hidden;
    /* float: left; */
    /* display: block; */
    display: inline-table;
    margin-right: 3px;
    margin-bottom: 3px;
    padding: 10px;
    width: 135px;  
    height:40px;  
    letter-spacing: 1px;
    text-overflow: ellipsis;
    white-space: nowrap; 
    text-align: center;
    background: #cecebb;
    border: 1px solid #c7c0c0;
    cursor: pointer;
}
#Groups #LeftBox .sortable div:hover,
#Groups #RightBox .sortable2 div:hover {background: #e2e2b9;}

#Groups .content-footer {
    height:50px; 
    background: #eff5f9; 
    text-align: center
}
#Groups .content-footer a {margin-top: 10px;}
/* 球種設定-群組管理-新增群組 */
#GroupsCreate #UlBox {width: 98%};
#GroupsCreate #UlBox .title {width: 100px};
/* ----------------------------------*/
/*隊伍管理*/

/* 30 -------------------------------------------------------------------------- */
/* 報表結果 */
/* 報表結果-近期報表 */


.whiteBg{ background: #fff; }
[data-block="recentReports-block"]{ margin-bottom: 50px; }
[data-block="recentReports-block"] .table-div-head .table-div-th{ 
    border-bottom: 1px solid #ccc; 
    text-align: right;
}
[data-block="recentReports-block"] .table-div-head .table-div-td{ text-align: left;}
[data-block="recentReports-block"] .dateBlock > div{ display: inline-block; vertical-align: middle; }
[data-block="recentReports-block"] .startDate + div{ height: 34px; }
[data-block="recentReports-block"] .table-div-head .recentReports-table .table-div-th{
    text-align: center;
}
.quick-select a{
    background-color: #fff;
    border: 1px solid #df3333;
    color: #df3333;
    padding: 2px 4px;
    border-radius: 3px;
}
.quick-select a.active{
    background-color: #df3333;
    border: 0px solid #d2d2d2;
    color: #fff;
}
[name="start"],
[name="submit"],
[name="reset"]{
    background-color: #df3333;
    color: #fff;
    padding: 2px 4px;
    border-radius: 3px;
    border: 0px solid #d2d2d2;
}
.sports-number label,
.betting-platform label{
    margin-right: 10px;
}
[for="allcheck-sport"] input,
[for="allcheck-betting"] input,
.sports-number label input, 
.betting-platform label input{ 
    width: 15px; 
    height: 15px; 
    margin: 0;
}
[for="allcheck-sport"] input,
[for="allcheck-sport"] span,
[for="allcheck-betting"] input,
[for="allcheck-betting"] span,
.sports-number label input,
.sports-number label span, 
.betting-platform label input,
.betting-platform label span{ 
    display: inline-block;
    vertical-align: middle;
}
[data-block="recentReports-block"] + .table-bordered > thead > tr > th, 
[data-block="recentReports-block"] + .table-bordered > tbody > tr > th, 
[data-block="recentReports-block"] + .table-bordered > tfoot > tr > th,
[data-block="recentReports-block"] + .table-bordered > thead > tr > td, 
[data-block="recentReports-block"] + .table-bordered > tbody > tr > td, 
[data-block="recentReports-block"] + .table-bordered > tfoot > tr > td {
    border: 1px solid #dad0d0;
}
.recentReports-table td{ background: #fff; }
.reports-table-div{
    text-align: center; 
    color: #efefef;
    background-color: #434375;
    border-right: 1px solid #ccc;
    padding: 10px 5px;
    letter-spacing: 2px;
}
/* 40 -------------------------------------------------------------------------- */
/* 訊息管理 */
/* 訊息管理-訊息管理 */
/* 訊息管理-交辦事項 */
#MessageManage .content-footer,
#TaskMessage .content-footer {
    padding: 8px;
    height: 50px; 
    background: #eff5f9;
}
[data-block="taskMsg-top-block"] .condition{
    margin-right: 10px;
    padding: 6px 12px;
    min-width: 100px;
    height: 34px;
    font-size: 14px;
    line-height: normal;
    color: #555;
    background: #fff;
}
#addMessage{ 
    background: #fff; 
    margin: 10px 0;
    padding: 10px;
}
.addMsg{ margin-right: 10px; }
[data-block="taskMsg-top-block"] .date-block,
[data-block="message-top-block"] .date-block{ margin-left: 10px; }

#addMessage .msgTime > div,
#addMessage .msgTime .form-group,
[data-block="message-top-block"] .date-block > div,
[data-block="message-top-block"] .date-block .form-group, 
[data-block="taskMsg-top-block"] .date-block > div,
[data-block="taskMsg-top-block"] .date-block .form-group{ 
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 0;
}
[data-block="taskMsg-top-block"] .date-block .form-group,
[data-block="message-top-block"] .date-block .form-group{ width: 45%; }
[data-block="taskMsg-top-block"] .search-input input,
[data-block="message-top-block"] .search-input input{ height: 35px; padding-left: 10px; }
/* [data-block="taskMsg-top-block"] .search-input input::placeholder,
[data-block="message-top-block"] .search-input input::placeholder{ padding-left: 10px; } */
.msg-table-div{
    text-align: center;
    color: #efefef;
    background-color: #434375;
    border-right: 1px solid #ccc;
    padding: 10px 5px;
    letter-spacing: 2px;
}
#addMessage .table-bordered > thead > tr > th, 
#addMessage .table-bordered > tbody > tr > th, 
#addMessage .table-bordered > tfoot > tr > th,
#addMessage .table-bordered > thead > tr > td, 
#addMessage .table-bordered > tbody > tr > td, 
#addMessage .table-bordered > tfoot > tr > td{
    border: 1px solid #dad0d0;
}
#addMessage [name="msgTitle_select"]{ height: 26px; }
#addMessage .move-select label{
    margin-right: 10px;
}
/* [data-block="messageTable-block"] .checkIn div, */
#addMessage .path-block > div,
#addMessage .path-block > label,
#addMessage .member-block > div,
#addMessage .member-block > label,
#addMessage .own-block label input,
#addMessage .move-select label input,
#addMessage .move-select label span{
    display: inline-block;
    vertical-align: middle;
}
#addMessage .own-block label input, 
#addMessage .move-select label input{ 
    width: 18px; 
    height: 18px; 
    margin-top: 0;
}
#addMessage .move-select label span{ font-size: 16px; }
#addMessage [name="msgUrl"]{ width: 50%; }
#addMessage [for="memberAll"],
#addMessage [for="pathAll"]{ 
    margin-right: 20px;
}
#addMessage .own-block i{ color: #00a65a; }

[data-block="messageTable-block"] .form-style{
    background: transparent;
    border: none;
    color: #fff;
}
[data-block="messageTable-block"] .table-block, 
[data-block="messageTable-block"].table-block{ 
    margin-bottom: 0; 
}
[data-block="messageTable-block"] .ownBlock,
[data-block="messageTable-block"] .textBlock,
[data-block="messageTable-block"] .showTime{ text-align: left; }

[data-block="taskMsg-top-block"] .condition,
[data-block="taskMsg-top-block"] .condition input,
[data-block="taskMsg-top-block"] .condition span,
[data-block="messageTable-block"] .selectBlock label input,
[data-block="messageTable-block"] .selectBlock label span{
    display: inline-block;
    vertical-align: middle;
    margin-top: 0;
}
[data-block="messageTable-block"] .checkIn .checkIn-block{
    max-width: 108px;
    font-size: 12px;
    word-break: break-all;
    text-align: left;
}
[data-block="messageTable-block"] .s_day,
[data-block="messageTable-block"] .e_day{
    min-width: 88px;
}
[data-block="messageTable-block"] .carouselBlock{
    max-width: 88px;
    min-width: 88px;
}
[data-block="messageTable-block"] .signUp-btn{
    padding: 0;
    width: 100%;
}
[data-block="messageTable-block"] .checkIn-num{
    width: 100%;
    color: #fff;
    background: #49588d;
    margin: 10px 0;
    border-radius: 3px;
    font-weight: bold;
}
#msg_status label{width: 50%;}
/* 50 -------------------------------------------------------------------------- */
/* 連水設定 */
/* 連水設定-連水現有賽事 */
#FlowGames .content-footer {    
    height: 50px;
    background: #eff5f9;
}    
#FlowGames .content-footer div {
    padding: 8px;
}
/* 連水設定-連水隊伍設定 */
#FlowTeams {}
#FlowTeams .content-footer {
    height: 50px;
    background: #eff5f9;
}
/* 連水設定-匯入聯盟 */
#ImportLeagues {}
#ImportLeagues .content-footer {
    padding: 8px;
    height: 50px;
    background: #eff5f9;
}

/* 70 -------------------------------------------------------------------------- */
/* 系統設定 */
/* 系統設定-管理員清單 */
#AdmManager {}
#add_adm {margin-right: 10px;}
#adm_manager_list [name="s_text"] {height: 34px;}
#adm_manager_list [name="s_text"] {padding-left: 10px;}
[data-block="admManager-block"] {margin: 0;}
[data-block="admManager-block"] .time {letter-spacing: 1px;}
[data-block="admManager-block"] .setUp-time div,
.admManager_add_th .table-div-th span,
.admManager_add_th .table-div-th div,
[data-id="admManager_th"] div div,
[data-id="admManager_th"] div i {
    display: inline-block;
    vertical-align: middle;
}
.select_status [value="1"] {
    color: #fff;
    background: #f00;     
}
.accInfo-block{ text-align: left; padding-left: 20px;}
/* 系統設定-管理員清單-新增 */
[data-block="admManager-add-block"] {width: 50%;}
#adm_manager_add .goBack {margin-right: 10px;}
[data-block="admManager-add-block"] .table-div-td {
    background: #fff;
    border-right: 1px solid #ccc;     
}
[data-block="admManager-add-block"] .table-div-th {border-bottom: 1px solid #ccc;}
.admManager_add_th .table-div-th span {         
    font-size: 25px; 
    height: 25px; 
}
[data-block="admManager-add-block"] #acc {width: 100px; height: 26px;}
[data-block="acc-block"] > div:first-child {width: 52%; }
[data-block="acc-block"] > div:last-child {text-align: left; padding-left: 15px;}
.admManager_add_lockBlock label,
.admManager_add_th [name="acc-type"],
.admManager_add_th [name="acc-status"],
.admManager_add_th [name="acc-name"],
.admManager_add_th [type="password"] { 
    float: left; 
    margin-left: 15px;
} 
.admManager_add_th [name="acc-type"],
.admManager_add_th [name="acc-status"] {
    width: 100px;
    height: auto;
}
.admManager_add_th .table-div-th {text-align: right;} 
.admManager_add_lockBlock label {cursor: pointer;}
#manger-add-save {
    padding: 5px 0;
    background: #fff; 
    text-align: center; 
    border: 1px solid #ccc;
}
/* 系統設定-子站清單 */
#SubsiteList {}
.siteName-block {width: 15%;}
[data-block="subsiteList-block"] .table-block {margin: 0;}
[data-block="subsiteList-block"] .num-block,
[data-block="subsiteList-block"] .update-block,
[data-block="subsiteList-block"] .switch-block,
[data-block="subsiteList-block"] .sort-block,
[data-block="subsiteList-block"] .games-block,
[data-block="subsiteList-block"] .order-block,
[data-block="subsiteList-block"] .me-block,
[data-block="subsiteList-block"] .ag-block,
[data-block="subsiteList-block"] .ad-block { 
    width: 6%; 
}
[data-block="subsiteList-block"] .switch-block{color: #fff;}
[data-block="subsiteList-block"] .webStyle,
[data-block="subsiteList-block"] .type-block {
    width: 9%;
}
[data-block="subsiteList-block"] #contentBlock {height: 745px;}

/* 系統設定-初始帳號 */
#InitAccount {}
#InitAccount .gtyps-section {margin-top: 20px;}
#InitAccount .content-footer {
    height: 50px; 
    line-height: 50px; 
    background: #eff5f9
}
#s3 {
    position: relative;
    /*padding: 30px 50px;*/
}
#s3 section, #s3 > div {
    padding: 0px 50px 0px 50px;
}
.gtyps-section .table-div-td {
    background: #fff;
    transition: all .5s;
}
.gtyps-section.active .table-div-td {
    background: #f90;
}
.init_account_table .table-div {
    width: auto;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
.init_account_table .table-header {
    background-color: #eff5f9;
}

/*初始帳號 單式玩法(rtype) start*/
.re_0 .table-div-th,
.re_0 .contollers-td,
.table-div-th {
    color: #f9f9f9;
    background-color: #434375;    
}

#InitAccount2 #contentMiddle {
    padding: 20px;
}

#InitAccount2 #contentMiddle .search {
    margin-bottom: 10px;
}

#InitAccount2 #contentMiddle table {
    margin-bottom: 30px;
}

body.ad .re_0 .table-div-th,
body.ad .re_0 .contollers-td,
body.ad .table-div-th {
    color: #f9f9f9;
    background-color: #4173ace3;    
}

/*初始帳號 單式玩法(rtype) end*/

/*初始帳號 走地玩法(rtype) start*/
.re_1 .table-div-th,
.re_1 .contollers-td {
    color: #f9f9f9;
    background-color: #f44336;
}
body.ad .re_1 .table-div-th,
body.ad .re_1 .contollers-td {
    color: #f9f9f9;
    background-color: #f44336;
}
/*初始帳號 走地玩法(rtype) end*/

.ballname_td {
    border-bottom: 1px solid #ccc;
}
.ballname_td a.followMax {
    color: #fff;
}
.ballname_td a.followMax:hover {
    color: #0c4d96;
    text-decoration: underline;
}
/* 系統設定-系統設定 */
#SysSetting {}
.updateBtn { float: left; }
.sysSetting-style { float: left; margin-right: 10px;}
.sysSetting-style div { margin-top: 2px; }
.sysSetting-style div,
.sysSetting-style input {
    margin-right: 2px;
    display: inline-block;
    vertical-align: middle;
}
[data-block="sysSetting-block"] .table-div-th{ border-bottom: 1px solid #ccc; }
[data-block="sysSetting-block"] .table-div-td input[type="text"] {
    width: 50px;
    height: 35px;
    text-align: center;
}
[data-block="sysSetting-block"] [type="checkbox"]{
    float: left !important;
    display: inline !important;
    background: #fff;
    border: 1px solid #ccc;
    width: 22px;
    height: 22px;
    cursor: pointer;
}
#apiOddsList [type="checkbox"]{
    display: inline !important;
    background: #fff;
    border: 1px solid #ccc;
    width: 18px;
    cursor: pointer;
}
.sySetting-btn {padding-left: 10px;}
/* 系統設定-匯差設定 */
#ExchangeRate {}
[data-block="sysIpSetting-block"] .sysIpSetting-style input{ width: 50%; }
#exchangeRate_edit_btn{
    text-align: center;
    margin: 10px 0;
}
#exchangeRate_edit_btn a,
#exchangeRate_edit_btn button{
    margin-right: 10px;
}
[data-block="exchangeRate-block"] .table-div-th{ width: 12.5%; }
[data-block="exchangeRate-block"] .table-div-td{ width: 12.5%; }
[data-block="exchangeRate-block"] .table-div-td input::placeholder{ color: #bababa; }
[data-block="exchangeRate-block"] .table-div-td input{ padding-left: 10px;  }
[data-block="exchangeRate-block"] .insExchange,
[data-block="exchangeRate-block"] .staExchange{ font-weight: bold; }
[data-block="exchangeRate-block"] .modifyProject div span,
[data-block="exchangeRate-block"] .modifyProject div{
    display: inline-block;
    vertical-align: middle;
}
[data-block="exchangeRate-block"] .modifyProject div:first-child span,
[data-block="exchangeRate-block"] .modifyProject div:last-child span{ 
    display: block; 
}
[data-block="exchangeRate-block"] .modifyProject div:last-child span{ text-align: left; padding-left: 10px; }
[data-block="exchangeRate-block"] .modifyProject div:first-child span{ text-align: right; }

/* 99 -------------------------------------------------------------------------- */
/* 系統功能 */
/* 系統功能-系統使用者管理-使用者列表 */
#SysUser .content-footer {padding-top: 8px;}
/* 系統功能-系統使用者管理-使用者列表-新增修改 */
#SysUserEdit {}
/* 系統功能-系統登入記錄-記錄列表 */
#LoginLog {}
#LoginLog .content-footer {padding-top: 8px;}
/* 系統功能-系統操作記錄-記錄列表 */
#SystemLog {}
#SystemLog .content-footer {padding-top: 8px;}
#InitAccount2 .content-footer {padding: 15px;}
.bg-white{
    background-color: #fff;
}

/*自訂的隱藏class*/
.hidden{
    display:none;
}
/*自訂的總和class*/
.sum{
    display:inline;
}

.closeBtn:hover{
    cursor: pointer;
}


.switch-all-bg-red{
    background-color:red;
}

.switch-all-bg-gray{
    background-color:gray;
}


.highlight {
    animation: 1s blink 3 steps(1);
}
/* 賽事有更新，球頭加底線 */
.highline2{
    border-bottom: 2px solid #f39800;
}
/* 賽事有更新，賠率加底線 */
.highline3{
    border-bottom: 2px solid #ea68a2;
}
/* 賽事有更新，td-gold背景 */
.eventlist-background {
    background: #f3bebe !important;
}


.border-line{
    border: 1px solid #ccc;
}

.opened_con_text{
    display:inline-block;
    width: 50px;
    text-align: center;
    background:#cccccc;
    cursor: pointer;
}
.opened_num_text{
    cursor: pointer;
}

.close_line{
    z-index:100;
    background:#cdcdcd !important;  
}

.gold-inline{
    display: inline-block;

}

.td-win{
    display: none;
}

.td-win-gold{
    display: none;
    width: 60px;
    text-align: right;
}



/*特別玩法*/
#SpCtl .search-line .search-list>li, #scSp .search-line .search-list>li, #cpSp .search-line .search-list>li{
    display: inline-table;
}
.btn-default{
    border:1px solid #abb7de;
    background-color:white;
}
.border-line.status{
    text-align: center;
    /* margin-top: 50%; */
    vertical-align: middle !important;
}

/*控盤*/
ul.dropdown-menu.inner{
    display:grid;
}

td.sc_sp{
    border-color:transparent !important;
    color:#000000;
    text-align: left;
}

.sp_width{
    width:10% !important;
    vertical-align: middle !important;
}

.width10{
    width:10% !important;
}

.width9{
    width:9% !important;
}

.width625{
    width:6.25% !important;
}

table#recentReportsDetail thead tr:nth-child(1) td {
    position: sticky;
    top: 0;
    z-index: 10;
}
table#recentReportsDetail thead tr:nth-child(2) td {
    position: sticky;
    top: 42px;
    z-index: 10;
}

.text-delete {
    text-decoration: line-through;
}

.setGtypePage {
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    padding: 15px;
}

.cursor-pointer {cursor: pointer;}

.res_rco {
    background-color: #A42D00;
}

.res_rca {
    background-color: #F09C00;
}

.word-break-keep{
	word-break: keep-all;
	white-space: nowrap;
}

.pagination {
    margin: 0;
}

/**彈窗廣告**/
.adModal .modal-header{
    background-color: #730d0d;
    color:#fff;
    border: none;
}
.adModal .modal-header .modal-title{
    display: inline-block;
}
.adModal .modal-header .close{
    margin: 0;
    color:#fff;
    opacity: 1;
}
.adModal .modal-body{
    padding: 0;
    background-color: #fff;
}
.adModal img{
    width: 100%;
}
.adModal .modal-footer{
    background-color: #fff;
}

.adModal .button_box{
    display: flex;
    margin: 1vw;
    justify-content: center;
    gap: 1vw;
}
.adModal .button_box button {
    background: 0 0;
    border: 0;
}
.adModal .button_box button .btn{
    color: #fff;
}
.adModal .admodal_carousel .carousel-control-next,
.adModal .admodal_carousel  .carousel-control-prev{
    position: relative;
    opacity: 1;
    width: auto;
}

.adModal .donshowbox {
    position: absolute;
    right: 15px;
}

.switchOnOff {
    position: relative;
    display: inline-block;
    width: 75px;
    height: 25px;
}

.switchOnOff input { 
    opacity: 0;
    width: 0;
    height: 0;
}

.switchOnOff .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ea6858;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 34px;
}

.switchOnOff .slider:before {
    position: absolute;
    content: "";
    height: 17px;
    width: 17px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 50%;
}

.switchOnOff .slider:after {
    position: absolute;
    content: 'OFF';
    top:50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
}

.switchOnOff input:checked + .slider {
    background-color: #00a65a;
}

.switchOnOff input:checked + .slider:after {
    content: 'ON';
}

.switchOnOff input:checked + .slider:before {
    -webkit-transform: translateX(50px);
    -ms-transform: translateX(50px);
    transform: translateX(50px);
}
.switchOnOff input:disabled + .slider {
    cursor: no-drop;
    background-color: #f19d92;
}
.switchOnOff input:checked:disabled + .slider {
    cursor: no-drop;
    background-color: #5cc595;
}