@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,300);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
    
  /*  normal*/
   * { box-sizing: border-box;
			   -webkit-box-sizing: border-box;
               -moz-box-sizing: border-box;
   }
 
   html, body {
    font-size : 16px;   
}	
  
   h1 {
            FONT-SIZE: 3rem;
            FONT-FAMILY: 標楷體, 新細明體;
            text-align: center;  
            margin-top : 10px;
            color : #000000;       
        }
   
    table {  margin : auto;
           width : 98%;
        }

        th {  text-align : center;
              padding-top : 15px;
              padding-bottom : 15px;
        }
        
         div { width : 100%;
              margin : auto;              
              /*border :1px solid black;*/
        }

        #header {
            background-image : url(115background.jpg);
            background-repeat :no-repeat;
            height : 390px;               
        }
       

      #footer {
          background : #effcde;       
          font-size : 1.2rem;
          font-weight : 600;
          margin :auto;
     }
	 
	 #footer p {margin-top:0.5rem; margin-bottom:0rem;}

        /*normal screen*/
        .header_content {           
             
            FONT-SIZE: 1.35rem;
            font-weight : 600;
            FONT-FAMILY: 新細明體;
            line-height : 1.3;  
            width:55%;  
            color : #000000;                
            margin-top: 60px;
            margin-left: 40px;
        }
               

            BODY {
                SCROLLBAR-FACE-COLOR: #FFE1A1;
                SCROLLBAR-HIGHLIGHT-COLOR: #ffffff;
                SCROLLBAR-SHADOW-COLOR: #ffffff;
                SCROLLBAR-3DLIGHT-COLOR: #FFE1A1;
                SCROLLBAR-ARROW-COLOR: #ffffff;
                SCROLLBAR-TRACK-COLOR: #ffffff;
                SCROLLBAR-DARKSHADOW-COLOR: #FFE1A1;    
                margin : 5px auto;  
				max-width : 880px;                 
            }

        input {
            border: 2px solid #a2bfa1;
            background-color: #f6f7e9;
            color: black;
            font-size: 1.2rem;
            margin-top: 25px;
            margin-bottom : 10px;
            margin-left : 10px;
            height: 38px;
}

        .text_box {
            padding : 20px 10px 20px 15px;
            line-height : 150%;
        }
            
   .dataTables tbody tr:nth-child(even) td,
   .dataTables th {
              background-color: #f8fcde;
        }

   /*dataTables*/

        .dataTables>tbody>tr>td,
        .dataTables>thead>th>td{
            padding: 8px;
            line-height: 1.5;
            vertical-align : middle;
            text-align : center;
            border-top: 1px solid #e3ebda;
        }
		
	.pos_left { margin-left : 5rem;
        }
		
		/* original */
		.fonttype1 {
            FONT-SIZE: 1rem;
        }

        .fonttype2 {
            FONT-SIZE: 1.1rem;
        }

        .fonttype3 {
            FONT-SIZE: 1.35rem;
            FONT-FAMILY: 華康中圓體, 新細明體;
        }

        .fonttype4 {
            FONT-SIZE: 1.9rem;
        }

        .fontface1 {
            FONT-FAMILY: Arial Narrow;
        }

		 .font-color-red {
            color : #f03e3e;
        }
		
		.font-color-blue {
              color : blue;
         } 
		
		.float_right { float :right;}
		.float_left  { float :left;}
        .float_clear { clear :both;}
		/* original */

@media (max-width: 767px) {

    html, body {
        max-width: 100%;
        overflow-x: hidden;
    }
	
	h1 {
            FONT-SIZE: 2.5rem;
            FONT-FAMILY: 新細明體;
            text-align: center;  
            margin-top : 5px;   
            color : #000000;       
        }

    .table > tbody > tr > td:before {
        content: "";
        display: none;
    }

    .table > tbody > tr {
        border: 1px solid #ccc;
        width: 90%;
        margin: 10px auto;
        border-radius: 6px;
        background: #fff;
        display: block;
        padding: 15px 15px;
        -webkit-box-shadow: 0 8px 30px -8px rgba(0,0,0,0.15);
        box-shadow: 0 8px 30px -8px rgba(0,0,0,0.15);
    }

        .table > tbody > tr > td {
            border-top: 0;
            display: block;
            line-height: 1.5;
            padding: 0;			
            text-align: center !important;
        }

    .table > thead {
        content: "";
        display: none;
    }

   .pos_left { margin-left : 5rem;  }
}


@media (max-width: 767px) {

    .header_content {
        margin-top: 50px;
        margin-left: 50px;
        margin-right: 10px;
        width: 85%;
        FONT-SIZE: 1.3rem;
        font-weight: 600;
        FONT-FAMILY: 新細明體;
        line-height: 1.3;
    }

       .fonttype1 {
            FONT-SIZE: 1rem;
        }

        .fonttype2 {
            FONT-SIZE: 0.9rem;
        }

        .fonttype3 {
            FONT-SIZE: 1.15rem;
            FONT-FAMILY: 華康中圓體, 新細明體;
        }

     .fonttype4 {
            FONT-SIZE: 1.45rem;
            FONT-FAMILY: 華康中圓體, 新細明體;
        }
}

@media (max-width: 420px) {

        .header_content {
            margin-top: 45px;
            margin-left: 15px;
            margin-right: 5px;
            width: 96%;
            FONT-SIZE: 1.2rem;
            font-weight: 600;
            FONT-FAMILY: 新細明體;
            line-height: 1.4;
        }

        .fonttype1 {
            FONT-SIZE: 1rem;
        }

        .fonttype2 {
            FONT-SIZE: 1rem;
        }

        .fonttype3 {
            FONT-SIZE: 1.15rem;
            FONT-FAMILY: 華康中圓體, 新細明體;
        }

        .fonttype4 {
            FONT-SIZE: 1.35rem;
        }

        h1 {
            FONT-SIZE: 2rem;
        }

        #footer {
            font-size: 1.1rem;
        }
    }

    @media (max-width: 320px) {

        .header_content {
            margin-top: 40px;
            margin-left: 10px;
            margin-right: 5px;
            width: 100%;
            FONT-SIZE: 1.05rem;
            font-weight: 500;
            FONT-FAMILY: 新細明體;
            line-height: 1.5;
        }
        h1 {
            FONT-SIZE: 1.45rem;                  
        }
    }
}