body {
  background: white;
	margin-top:0;
	text-align:center; /* for IE */
	margin:0 auto; /* for the rest */
	width:940px;
	font-size:12px;
	family-name: "新細明體", "PMingLiU", "細明體", "MingLiU", "標楷體", "DFKai-sb", "微軟正黑體", "Microsoft JhengHei", serif;
}

body,th,td,input, select {
	font-size:12px;	
	color:#333333;	
}


#main{
  text-align:left;
  width:950px;
  background:white;	
}                  

#banner{            
  position:relative;
  background: white url('/imgs/heading.jpg')  no-repeat 0px 5px;  
  width:110px;
  height:116px;  
  padding:0px;
  display: inline-block;
}

.carousel { 
  max-width: 825px; 
  height: 116px; 
  overflow: hidden; 
  position: relative; 
  display: inline-block; 
  left: 10px;
} 
 
.carousel .container { 
  width: max-content; 
  height: 100%; 
  position: relative; 
  display: inline-flex; 
  flex-wrap: nowrap; 
  animation: scroll var(--_animation-duration, 81s) 
    var(--_animation-direction, forwards) linear infinite; 
} 
 
@keyframes scroll { 
  to { 
    transform: translate(calc(-50%)); 
  } 
} 
 
.carousel .container img { 
  width: 180px; 
  height: 116px; 
} 


/*
ver2
.top_banner{
  width: 835px;
  height: 116px;
  position:relative;
  display: inline-block;
  overflow: hidden;
}
.top_banner img{
  width: 100%;
  height: 100%;
  position:absolute;
  left:5px;
  z-index:1;
}
.top_banner img.current{
  z-index:2;
}
*/

#menu{
  clear:both;
  width:950px;
  background:#f5ef03; /*#99cc33;*/
  height:37px;
  margin-top:0px;
  overflow:hidden;
}   

#menu ul{    
   list-style-type: none;
    margin: 0 auto;
    padding: 0;
    width:100%;
    border:none;      
}
#menu li{     
  display:inline;
  position: relative;
  float: left;
  padding:10px;
  padding-left:30px;
  padding-right:30px;
  font-size:14px;
  border-right:1px solid white;
  width:95px;
  _width:148px;
  text-align:center;
}
#menu li.last{
  border-right:none !important;
}                              
#menu li a{
  color:black;
  text-decoration:none;
  letter-spacing:5px;
}

#bigbox{
  margin-top:5px;  
  clear:both;
}

.big_banner{
  width:950px;
  height:320px;
  position:relative;
}
.big_banner img{
  position:absolute;
  top:0px;
  left:0px;
  z-index:1;
}
.big_banner img.current{
  z-index:2;
}

.squares{
  clear:both;
  background:white;
  width:950px;
  padding-top:20px;    
}
.squares a{ 
  text-decoration:none;
}
.squares .square{  
  width:440px;
  margin-right:50px;
  height:200px;
  float:left;
}
.squares .square.last{
  margin-right:0px !important;
}
.squares .square img{  
  margin-right:10px;
  width:150px;
  float:left;
  clear:both;
}
.squares .square .title{
  margin-bottom:10px;
  border-bottom:1px solid grey;
  width:100%;
  font-weight:bold;
  color:#006DAF;
  display:block;
  font-size:12px;
}
.squares .square .content{
  font-size:11px;
}   
.squares .square span{  
  letter-spacing:5px;
  line-height:15px;    
  color:black;
}
.squares .square .more{
  padding-top:5px;
  float:right;
  font-size:11px;
  letter-spacing:5px;  
  margin-top:10px;  
  display:block;
  color:blue;
}
.squares .square .more a{
  text-decoration:none;
  color:blue;
}                     

#footer{
  clear:both;
  margin-top:10px;
  _width:950px;
  width:950px;
  background:#f5ef03; /*#99cc33;*/
  text-align:center; 
  letter-spacing:5px;   
}
#footer p{
  padding:10px;
}
#footer,
#footer a{
  color:black;
  font-size:10px;
  text-decoration:none;
}
#footer a:hover{
  text-decoration:underline;
}
               
#main_content{
  clear:both;
  width:950px;  
  margin-top:10px;
  padding:0px;
  padding-bottom:20px;
  color:black;
  font-size:14px;
  line-height:25px;
  letter-spacing:5px;
}
#main_content h1{
  color:#006daf;
  font-size:20px;
}
#main_content p{  
  text-align:adjust;
}

#printing_category_boxes{
  width:950px;
  text-align:center;
  margin-left:0px;
}
#printing_category_boxes a, #printing_category_boxes_left a{
  text-decoration:none;
  color:black;
}
.printing_category_box{
  float:left;    
  border:1px solid #006daf;  
  margin-right:23px;  
  _margin-right:20px;
  text-align:center;
  width:200px;
}
.printing_category_box span{
  padding:8px;
  text-align:center;
  display:block;
  width:184px;
  _width:200px;
  background:#006daf;
  color:white;
  font-size:13px;
}
.printing_category_box img{
  display:block;
  width:200px;
}
#printing_category_boxes_left{
  width:120px;
  text-align:center;
  float:left;
}
#printing_category_boxes_left .printing_category_box{
  margin:10px;  
  width:100px;
}
#printing_category_boxes_left .printing_category_box span{
  padding:5px;
  width:90px;
  _width:100px;
  font-size:12px;
}
#printing_category_boxes_left .printing_category_box img{
  width:100px;
}

#boxes_right_content{
  float:left;
  margin-left:100px;
  width:720px;  
  _padding-top:10px;
}

#boxes_items .boxes_item{
  width:150px;
  height:190px;
  float:left;
  margin-right:20px;
  margin-bottom:20px;
}

#boxes_items .boxes_item img{
  border:1px solid grey;
  _width:150px;
  width:148px;
  height: 140px;
}
#boxes_items .boxes_item span{
  display:block;
  text-align:center;
}

#boxes_items.teaching_items .boxes_item{
  height:auto;
  overflow:hidden;
}

.contact_us{
  position: relative;
  display:block;
  width: 130px;
  height: 130px;
  float: right;
}
/********* common ************/

.bold{
  font-weight:bold;
}

.hidden{
  display:none;
}

.clear{
  clear:both;
}

img{
  border:none;
}

table th{
  text-align:left;
}
table th, table td{
  vertical-align:top;
}

/********** pop up ******************/

#background{
   background-color: black;
  opacity:0.6;
  filter:alpha(opacity=60);
  width:100%;
  height:100%;
  position:absolute;
  top:0px;
  left:0px;
  z-index: 9;
  display:none;
}
#popup, #zoom_photo{
  z-index: 10;
  display:none;
  position:absolute;
  width:600px;
  height:500px;
  background: #E0C0C3;
  border:#92272D 15px solid;  
}
#zoom_photo{
  width:400px !important;
  height:auto;/*400px !important;*/
  background:white; 
  border:white 15px solid; /*#99CC33*/
}
#popup .content, #zoom_photo .content{  
  /*margin-top:20px;*/
  /*background: #E0C0C3;*/  
  width: 568px;
  height:auto;/*450px;*/
  /*padding:8px;  
  padding-top:15px;*/
  overflow-y: scroll;  
  padding:15px;  
}
#zoom_photo .content{
  overflow-y: hidden !important;
  width: 400px !important;
  padding:0px !important;
}
#zoom_photo .content img{
  width:400px;
}
#popup .close, #zoom_photo .close{
  position:absolute;
  left:535px;
  top: 4px;
  /*float:right;*/  
  /*padding:2px;*/
  background: url('/imgs/popup_close.gif') no-repeat 0px 0px;
  width: 23px;
  height: 25px;
}
#zoom_photo .close{
  top: 1px;
  left:376px;
}