BODY {font-family:Verdana,LiHei Pro,'微軟正黑體';color:#666;}
    a {color: #00403d;transition: all 0.25s ease;
  -webkit-transition: all 0.25s ease;
  -moz-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  text-decoration:none;}
    a:hover {color:#fff!important;text-shadow:0px 0px 5px #000, 0px 0px 8px #000;}
    a:visited {color: #00403d;}
    H1 {font-size: 24pt; text-align:center;; color:#00651f;}
    H2 {font-size: 18pt; text-align:center; font-weight:bold; color:#000;}
    H3 {font-size: 14pt; text-align:center; font-weight:300; color:#000;}
    
@media screen and (min-width:769px){
    BODY {background:#00403d url('./bg03.jpg')no-repeat fixed center;}
    
    .wrap{  
    	position: absolute;
    	left:50%;
    	top:50%;
    	width: 900px;
        background:rgba(238, 238, 238, 0.9);
        margin-left:-450px;
        margin-top:-280px;
        border-radius: 50px;
        box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.58);
    }
    
    .tbody{
        padding:50px;
    }
    
    table{
        width: 800px;
    }
}
@media screen and (max-width:768px){
    BODY {background:#00403d url('./bg03.jpg')no-repeat top center;}
    
    .wrap {
        position: relative;
        background: rgba(238, 238, 238, 0.9);
        border-radius: 50px;
        box-shadow: 0px 0px 50px rgb(0 0 0 / 58%);
    }
    
    .tbody{
        padding:20px;
        display: flex;
        justify-content: space-around;
    }

}
.scar_bar{margin: 20px;text-align:center;}
.toptr {
    background: #eee;
    height: 40px;
    color: #333;
}
tr.toptr th {
    font-weight: 300;
}
    

tbody.databody tr:hover {
    background: #d1d7da;
    color:#24485a;
}

tbody.databody {
    line-height: 30px;
    color:#666;
}

input[type="text"] {
    border-radius: 30px;
    line-height: 24px;
    width: 250px;
    color: #666;
    padding-left: 10px;
    font-family: Verdana,LiHei Pro,'微軟正黑體';
    border: none;
}