#container
{
    top:0px;
    width:100%;
    border:0px;
    color:Black;
    padding:0px;
    margin:0px;
    height:600px;
    
    /*background:red;*/
           }


.attention
{
    /*position:fixed;*/
    left:15%;
    width:80%;
    top:75%;
    font-size:larger;
    
    }

.attention2
{
    /*position:absolute;*/
    left:15%;
    width:80%;
    top:55%;
    font-size:larger;
}

.bgc_yellow
{
    background-color:Yellow;
    }
    
.ftc_red
{
    color:Red;
}


/*Radio button list style;*/
.contactTypeRadio input {
    width: 25px;
    height: 25px;
    margin-top: 20px;
    border: solid thin black;
    float: left;
}

.contactTypeRadio label {
    width: 11%;
    border: solid thin green;
    float: left;
    text-align: center;
    background-color:palegreen;
}

.contactTypeRadio {
    width: 50%;

}

#header{
    background-color:#FFA500;
    text-align:center;   
    margin:0px 0 10px 0;
    border:0px;
    padding:20px 0 20px 0;
    position:relative;   
    /*width:787px;*/
    width:100%;
    
}

/*#menu{background-color:Yellow;height:200px;width:25%;float:left;}*/
#content
{
    /*background-color:#EEEEEE;*/
    height:860px;
    width:100%;
    float:left;
    margin:0.5px 0px 10px 0px;
}

#footer
{
    background-color:#FFA500;
    /*clear:both;*/
    text-align:center;
    width:100%;
    padding:0;
    border:0px;
    margin:0px 0px 0px 0px;
    height:70px;
    
    bottom:0px;
    position:relative;
    float:left;
    /*position:absolute;
    bottom:0px;*/
    }

.AA
{
    
    width:390px;
    height:100px;
    margin: 1% 0.5% 0 22px;
    float:left;
    position:fixed;
    left:10px;
    /*
    background-color:lightGreen;    
    padding:0px;
    margin:auto;
    width:49.9%;
    float:left;
    text-align:center;*/
    }
.BB
{
    
    width:390px;
    height:100px;
    margin:1% 5px 0 18px;
    float:left;
    position:fixed;
    left:400px;
    /*
    background-color:orange;
    padding:0px;
    margin:auto;
    width:50%;
    float:left;
    text-align:center;*/
    }

.section{
    /*background-color: lightblue; /* Green */
    width:100%;
    height:5%;
    float:left;    
    border:none;
    margin: 0 0 1% 0;
    
}
.VISASection {
    /*background-color: lightblue; /* Green */
    width: 100%;
    height: 25%;
/*    float: left;*/
    border: none;
    margin: 0 0 2% 0;
    text-align:center;
}

.EMsection {
    /*background-color: lightblue; /* Green */
    width: 100%;
    height: 25%;
    float: left;
    border: none;
    margin: 0 0 1% 1%;
}


.EMWAITsection{
    /*background-color: lightblue; /* Green */
    width:100%;
    height:30%;
    float:left;    
    border:none;
    margin: 0 0 1% 0;   
}
.label_test
{
    background-color: green; /* Green */
    display: inline-block;
    color: yellow;
    text-align: center;
    font-size: 32px;
    width:100%;
    padding:4px 0 4px 0;
    }

.label_error
{
    background-color: red; /* Green */
    display: inline-block;
    color: yellow;
    text-align: center;
    font-size: 32px;
    width:100%;
    padding:4px 0 4px 0;
}

.label_0
{
    background-color: #FFA500; /* Green */
    display: inline-block;
    color: black;
    text-align: center;
    font-size: 32px;
    width:100%;
    padding:4px 0 4px 0;
    }

.label_max
{
    background-color: yellow; /* Green */
    display: inline-block;
    color: black;
    text-align: center;
    font-size: 40px;
    width:100%;
    padding:4px 0 4px 0;
    }

.label_A
{
    background-color: #4CAF50; /* Green */
    display: inline-block;
    color: white;
    text-align: center;
    font-size: 32px;
    width:100%;
    padding:4px 0 4px 0;
    }

.label_BOOKING {
    background-color: #80d9d4; /* Green */
    display: inline-block;
    color: black;
    font-weight:bold;
    text-align: center;
    font-size: 32px;
    width: 100%;
    padding: 4px 0 4px 0;
}

.label_B
{
    background-color: #008CBA; /* 深藍 */
    display: inline-block;
    color: white;
    text-align: center;
    font-size: 32px;
    width:100%;
    padding:4px 0 4px 0;
    }


.label_C
{
    background-color: black; /* BLACK */
    display: inline-block;
    color: white;
    text-align: center;
    font-size: 32px;
    width:100%;
    padding:4px 0 4px 0;
    }


.buttonGetNum {
    background-color: #ff5a5a;
    color: white;
    border: none;
    padding: 10px 20px;
    font-size: 20px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.buttonGetNum:hover {
    background-color: #e04a4a;
}

.button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 30px 20%;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 40px;
    margin: 20px 20px 16px 20%;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
}

.buttonVSA {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 30px 10%;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 40px;
    margin: 10px 10px 20px 5%;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
}
.loginbutton {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 10px 5% ;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 40px;
    margin: 20px 26px 16px 30%;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
    
}

.button1 {
    background-color: white;
    color: black;
    border: 2px solid #4CAF50;
}

.button1:hover {
    background-color: #4CAF50;
    color: white;
}

.button2 {
    background-color: white;
    color: black;
    border: 2px solid #008CBA;
}

.button2:hover {
    background-color: #008CBA;
    color: white;
}

.button3 {
    background-color: white;
    color: black;
    border: 2px solid #FFA500;
}

.button3:hover {
    background-color: #FFA500;
    color: blue;
}

.button4 {
    background-color: white;
    color: black;
    border: 2px solid #efb8b8;
}

.button4:hover {
        background-color:lightcyan;
        color: blue;
}

.buttonN
{
    border-style: none;
    border-color: inherit;
    border-width: medium;
    background-color: #886600; /* Green */
    color: white;
    text-align: center;
    text-decoration: none;
    transition-duration: 0.4s;
    
    cursor: pointer;
    display: inline-block;
    margin: 0px 26px 16px 0px;
    padding: 22px 22%;
    font-size: 40px;
    -webkit-transition-duration: 0.4s;
    width: 100%;
}

.buttonW {
    background-color: white;
    color: black;
    border: 2px solid Black;
    border-style: groove;
    border-color: inherit;
    border-width: medium;
    background-color: lightpink;
    color: black;
/*    text-align: center;*/
    text-decoration: none;
    transition-duration: 0.4s;
    cursor: pointer;
    display: inline-block;
    margin: 0px 26px 16px 0px;
    padding: 22px 22%;
    font-size: 40px;
    -webkit-transition-duration: 0.4s;
    width: 100%;
}
    .buttonW:hover {
        background-color: yellow;
        color: blue;
    }

.button_full {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 32px 14% 32px 14%;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 40px;
    margin: 20px 26px 16px 20%;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: not-allowed;
    
}

.temp
{
    
    }
    
    
#search{ 
    position:relative;
    /*padding-top:0px;*/
    height:100px;
    width:100%;
    font-size: 42px;
    top: 0px;
    left: 0px;
}
    
#input
{
    position:absolute;
    font-size:40px;
    width:240px;
    height:47px;
    border:0;
    background:#FFFFFF;
    border:1px solid #CCCCCC;
    left:35%;
    top:42%;
    }
#IDNOinput {
    position: relative;
    font-size: 40px;
    width: 240px;
    height: 47px;
    border: 0;
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
}
    
#btn_cancel
{
    font-size: 20px;
    color: #FFFFFF;
    position:absolute;
    height: 30px;
    cursor:pointer;
    border: 0;
    background: red;
    border: 1px solid;
    border-radius: 5px;
}
#btn_cancelTJVSA {
    height:60px;
    font-size: 20px;
    color: #FFFFFF;
    cursor: pointer;
    border: 0;
    background: red;
    border: 1px solid;
    border-radius: 5px;
}
    
#btn_search
{
    border-style: solid;
    border-color: inherit;
    border-width: 1px;
    font-size: 30px;
    color: #FFFFFF;
    position:absolute;
    width: 90px;
    height: 60px;
    cursor:pointer;
    background: #4876FF;
    border-radius: 5px;
}

#btn_searchTJVSA {
    border-style: solid;
    border-color: inherit;
    border-width: 1px;
    font-size: 30px;
    color: #FFFFFF;
    position: absolute;
    height: 60px;
    cursor: pointer;
    background: #4876FF;
    border-radius: 5px;
}


#btn_TJVSASubmit {
    border-style: solid;
    border-color: inherit;
    border-width: 1px;
    font-size: 30px;
    color: #FFFFFF;
    height: 60px;
    cursor: pointer;
    background: #4876FF;
    border-radius: 5px;
}

#btn_print
{
    position:absolute;
    font-size:30px;
    background: #66B3FF;
    width:140px; 
    height:60px;
    cursor:pointer;
    color: #FFFFFF;
    text-align:center;
    border: 0;
    }
#btn_printTJVSA {
    font-size: 30px;
    background: #66B3FF;
    height: 60px;
    cursor: pointer;
    color: #FFFFFF;
    text-align: center;
    border: 0;
}
#btn_backToDefault
{
    font-size: 30px;
    color: #FFFFFF;
    position:absolute;
    width: 105px;
    height: 60px;
    cursor:pointer;
    border: 0;
    background: #4CAF50;
    border: 1px solid;
    border-radius: 5px;
    text-align:center;
    }

#btn_backToDefaultTJVSA {
    font-size: 30px;
    color: #FFFFFF;
    position: absolute;
    height: 60px;
    cursor: pointer;
    border: 0;
    background: #4CAF50;
    border: 1px solid;
    border-radius: 5px;
    text-align: center;
}

#btn_Next {
    font-size: 30px;
    color: #000000;
    position: absolute;
    width: 105px;
    height: 50px;
    cursor: pointer;
    border: 0;
    background: #fbd1d1;
    border: 1px solid;
    border-radius: 5px;
    text-align: center;
}
#btn_modify {
    font-size: 30px;
    color: Black;
    position: absolute;
    width: 105px;
    height: 50px;
    cursor: pointer;
    border: 0;
    background: #efb8b8;
    border: 1px solid;
    border-radius: 5px;
    text-align: center;
}
    
#btn_clear
{
    font-size: 30px;
    color: #FFFFFF;
    position:absolute;
    width: 76px;
    height: 30px;
    cursor:pointer;
    border: 0;
    background: gray;
    border: 1px solid;
    border-radius: 5px;
    text-align:center;
    }
#btn_clearTJVSA {
    font-size: 30px;
    color: #FFFFFF;
    position: absolute;
    height: 30px;
    cursor: pointer;
    border: 0;
    background: gray;
    border: 1px solid;
    border-radius: 5px;
    text-align: center;
}
    
    /**********************/
#main {
  width: 600px;
  margin: 0 auto; 
}

.lbl_status
{
    background:yellow;
    margin-left:calc(30%);
    font-size:40px;
    
    }
.lbl_result
{
    /*margin-left:calc(30%);*/
    font-size:30px;
        }

.BigItem input 
 {
   width:25px; height:25px;
  }

input[type=radio]:checked + label {
    background-color: yellow;
}

input[type=radio]:disabled + label {
    /*Radio button disable的顏色*/
    color: #E0E0E0;
}

.calendar {
    width: 100%;
    border-collapse: collapse;
}

/*    .calendar th, .calendar td {
        border: 1px solid #ccc;
        padding: 5px;
        vertical-align: top;
        text-align: center;
        width: 14.2%;
        
    }*/

    .calendar th {
        background-color: Black;
        color: white;
        text-align: center;
        padding: 5px;
        border: 1px solid #ccc;
    }

    .calendar td {
        vertical-align: top;
        width: 120px;
        height: 80px;
        text-align: center;
        padding: 5px;
        border: 1px solid #ccc;
    }

.cell-full {
    background-color: #e0e0e0; /* 灰色 */
}

.cell-selectable {
    background-color: white; 
}

.calendar-header {
    background-color: Black;
    font-weight: bold;
}

.overlay {
    position: fixed; /* 固定在視窗上 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* 半透明黑色 */
    z-index: 9999; /* 確保它在最上層 */
    display: none; /* 預設為隱藏 */
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
}

/* 旋轉圖示的樣式 */
.spinner {
    border: 8px solid #f3f3f3; /* 淺灰色邊框 */
    border-top: 8px solid #3498db; /* 藍色邊框 */
    border-radius: 50%; /* 圓形 */
    width: 60px;
    height: 60px;
    animation: spin 1s linear infinite; /* 執行旋轉動畫 */
}

/* 定義旋轉動畫 */
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.disabled-item label {
    color: darkgrey; /* 淺灰色，可以根據你的需求調整 */
    font-style: italic;
}