@font-face {
    font-family: 'Noto Sans T Chinese';
    src: url(http://www.steamerbiz.com/fonts/NOTOSANSHANT-REGULAR.OTF);
}
body{
	font-family: 'Noto Sans T Chinese',Arial,sans-serif;
	/*background:url(http://www.steamerbiz.com/img/bg.png) repeat;*/
	padding-bottom:0;	
}
.bg2{
	background: #f2f2f2;
	padding-top: 30px;
	min-height: 700px;
}
.bg{
	background: #fff;
}
.bg3{
	background:#d9d9d9;
}
.container{
	width: 950px;
	-webkit-box-shadow: rgba(1, 1, 1, 0.3) 0px 0px 8px 0px;
	box-shadow: rgba(1, 1, 1, 0.3) 0px 0px 8px 0px;	
	padding: 0;
}
.container>.navbar-collapse{
	background: #fff
}
.carousel.slide{
	margin-bottom:10px; 
}
.item img{
	width: 100%
}
.well{
	border-radius: 0;
	color: #565f78;
	/*-webkit-box-shadow: rgba(1, 1, 1, 0.7) 0px 0px 3px 0px;
	box-shadow: rgba(1, 1, 1, 0.7) 0px 0px 3px 0px;	*/
	border-left: 0;
	border-right: 0;
	background: #fff
}
.well h3{
	margin-top: 0;
}
.nav-pills>li>a{
	background-color: rgba(86, 95, 120,0.7);
	color: #ffffff;
	border-radius: 0;
	/*font-weight: bold;*/
}
.nav-pills>li>a:hover, .nav-pills>li>a:focus{	
	border-radius: 0;
	padding-left:25px;
	background: rgba(86, 95, 120,0.7);
	color: #ffffff
}
.nav-pills>li.active>a, .nav-pills>li.active>a:hover, .nav-pills>li.active>a:focus{
	background: #f2f2f2;
	color: #565f78;
	border-radius: 0;
	padding-left:25px;
	font-weight: bold;
	border-left: 3px #565f78 dotted;
}
.about{
	padding-top: 40px;
}
.tab-content{
	padding:0 10px;
}
.unit{
	float: right;
}
.callout-info{
	border-left-color: #565f78;
	border-top:1px solid #e6e6e6;
	border-bottom:1px solid #e6e6e6;
	border-right:1px solid #e6e6e6;
	border-radius: 5px ;
	background: #fff; 
}
.callout-info h3{
	color: rgba(76, 67, 96,1);
}
.callout-info h5{
	line-height: 180%;
}
.table>thead>tr>td.info, .table>tbody>tr>td.info, .table>tfoot>tr>td.info, .table>thead>tr>th.info, .table>tbody>tr>th.info, .table>tfoot>tr>th.info, .table>thead>tr.info>td, .table>tbody>tr.info>td, .table>tfoot>tr.info>td, .table>thead>tr.info>th, .table>tbody>tr.info>th, .table>tfoot>tr.info>th {
	background-color: #565f78;
	color: #fff;
	font-weight: normal;
}
.table-hover>tbody>tr>td.info:hover, .table-hover>tbody>tr>th.info:hover, .table-hover>tbody>tr.info:hover>td, .table-hover>tbody>tr:hover>.info, .table-hover>tbody>tr.info:hover>th {
	background-color: #e6e6e6;
	color: #565f78;
}

tr.info th{
	text-align: center;
}
.col-md-6 img{
	width:100%
}
#footer{
	padding: 20px 0;
	background: #565f78;
	color: #f2f2f2
}
.ul-style{
	list-style-type: decimal;
}
.navbar-brand{
	height: 60px;
}
.nav.navbar-nav.navbar-right{
	line-height: 60px;
	margin-right: 5px;
}
.nav.navbar-nav.navbar-right a{
	margin: 0 5px;
	color: #565f78; 
}
.btn-menu-group{
	margin: 10px 20px 0 20px;
}
a.btn.btn-menu.active{
	color: #fff;
	background: #565f78;
}
a.btn.btn-menu:hover{
	color: #fff;
	background: #565f78;
	/*border-bottom: 5px double #555;*/
}
a.btn.btn-menu{
	color: #ffffff;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	/*border-bottom: 5px solid rgba(0,0,0,0);*/
	background: rgba(0,0,0,0.7);
	border-radius: 0
}

.products-pic{
	margin-bottom: 20px;
	width: 663px;
	overflow-x: auto;
}
.products-pic a img{
	border: 1px solid #eee;
	border-radius: 5px;
	background: #fff;
}
.btn-default{
	background: rgba(0,0,0,0.7);
	color: #ffffff;
	border-color: rgba(0,0,0,0);
	border-radius: 0;
}
.btn-default:hover{
	background: #565f78;
	color: #fff;
}
.h2-style{
	background: rgba(0, 0, 0,0.3);
}
.bg3 .col-md-3.column{
	padding:0;
}
.h6-style{
	padding:0 15px;
}
.table-bordered{
	background: #fff
}
.row{
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 20px;
}
.well .text-justify{
	height: 300px
}

/* ANIMATION */
@-moz-keyframes cycle {
	0%  { top:0px; }
	4%  { top:0px; } 
	16% { top:0px; opacity:1; z-index:0; } 
	20% { top:325px; opacity:0; z-index:0; } 
	21% { top:-325px; opacity:0; z-index:-1; }
	92% { top:-325px; opacity:0; z-index:0; }
	96% { top:-325px; opacity:0; }
	100%{ top:0px; opacity:1; }
	
}
@-moz-keyframes cycletwo {
	0%  { top:-325px; opacity:0; }
	16% { top:-325px; opacity:0; }
	20% { top:0px; opacity:1; }
	24% { top:0px; opacity:1; } 
	36% { top:0px; opacity:1; z-index:0; } 
	40% { top:325px; opacity:0; z-index:0; }
	41% { top:-325px; opacity:0; z-index:-1; } 
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-moz-keyframes cyclethree {
	0%  { top:-325px; opacity:0; }
	36% { top:-325px; opacity:0; }
	40% { top:0px; opacity:1; }
	44% { top:0px; opacity:1; } 
	56% { top:0px; opacity:1; } 
	60% { top:325px; opacity:0; z-index:0; }
	61% { top:-325px; opacity:0; z-index:-1; } 
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-moz-keyframes cyclefour {
	0%  { top:-325px; opacity:0; }
	56% { top:-325px; opacity:0; }
	60% { top:0px; opacity:1; }
	64% { top:0px; opacity:1; }
	76% { top:0px; opacity:1; z-index:0; }
	80% { top:325px; opacity:0; z-index:0; }
	81% { top:-325px; opacity:0; z-index:-1; }
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-moz-keyframes cyclefive {
	0%  { top:-325px; opacity:0; }
	76% { top:-325px; opacity:0; }
	80% { top:0px; opacity:1; }
	84% { top:0px; opacity:1; }
	96% { top:0px; opacity:1; z-index:0; }
	100%{ top:325px; opacity:0; z-index:0; }
}

@-webkit-keyframes cycle {
	0%  { top:0px; }
	4%  { top:0px; }
	16% { top:0px; opacity:1; z-index:0; } 
	20% { top:325px; opacity:0; z-index:0; }
	21% { top:-325px; opacity:0; z-index:-1; }
	50% { top:-325px; opacity:0; z-index:-1; }
	92% { top:-325px; opacity:0; z-index:0; }
	96% { top:-325px; opacity:0; }
	100%{ top:0px; opacity:1; }
	
}
@-webkit-keyframes cycletwo {
	0%  { top:-325px; opacity:0; }
	16% { top:-325px; opacity:0; }
	20% { top:0px; opacity:1; }
	24% { top:0px; opacity:1; } 
	36% { top:0px; opacity:1; z-index:0; } 
	40% { top:325px; opacity:0; z-index:0; }
	41% { top:-325px; opacity:0; z-index:-1; }  
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-webkit-keyframes cyclethree {
	0%  { top:-325px; opacity:0; }
	36% { top:-325px; opacity:0; }
	40% { top:0px; opacity:1; }
	44% { top:0px; opacity:1; } 
	56% { top:0px; opacity:1; z-index:0; } 
	60% { top:325px; opacity:0; z-index:0; } 
	61% { top:-325px; opacity:0; z-index:-1; }
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-webkit-keyframes cyclefour {
	0%  { top:-325px; opacity:0; }
	56% { top:-325px; opacity:0; }
	60% { top:0px; opacity:1; }
	64% { top:0px; opacity:1; }
	76% { top:0px; opacity:1; z-index:0; }
	80% { top:325px; opacity:0; z-index:0; }
	81% { top:-325px; opacity:0; z-index:-1; }
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-webkit-keyframes cyclefive {
	0%  { top:-325px; opacity:0; }
	76% { top:-325px; opacity:0; }
	80% { top:0px; opacity:1; }
	84% { top:0px; opacity:1; }
	96% { top:0px; opacity:1; z-index:0; }
	100%{ top:325px; opacity:0; z-index:0; }
}
@keyframes cycle {
	0%  { top:0px; }
	4%  { top:0px; } 
	16% { top:0px; opacity:1; z-index:0; } 
	20% { top:325px; opacity:0; z-index:0; } 
	21% { top:-325px; opacity:0; z-index:-1; }
	92% { top:-325px; opacity:0; z-index:0; }
	96% { top:-325px; opacity:0; }
	100%{ top:0px; opacity:1; }
	
}
@keyframes cycletwo {
	0%  { top:-325px; opacity:0; }
	16% { top:-325px; opacity:0; }
	20% { top:0px; opacity:1; }
	24% { top:0px; opacity:1; } 
	36% { top:0px; opacity:1; z-index:0; } 
	40% { top:325px; opacity:0; z-index:0; }
	41% { top:-325px; opacity:0; z-index:-1; } 
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@keyframes cyclethree {
	0%  { top:-325px; opacity:0; }
	36% { top:-325px; opacity:0; }
	40% { top:0px; opacity:1; }
	44% { top:0px; opacity:1; } 
	56% { top:0px; opacity:1; } 
	60% { top:325px; opacity:0; z-index:0; }
	61% { top:-325px; opacity:0; z-index:-1; } 
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@keyframes cyclefour {
	0%  { top:-325px; opacity:0; }
	56% { top:-325px; opacity:0; }
	60% { top:0px; opacity:1; }
	64% { top:0px; opacity:1; }
	76% { top:0px; opacity:1; z-index:0; }
	80% { top:325px; opacity:0; z-index:0; }
	81% { top:-325px; opacity:0; z-index:-1; }
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@keyframes cyclefive {
	0%  { top:-325px; opacity:0; }
	76% { top:-325px; opacity:0; }
	80% { top:0px; opacity:1; }
	84% { top:0px; opacity:1; }
	96% { top:0px; opacity:1; z-index:0; }
	100%{ top:325px; opacity:0; z-index:0; }
}

/* ANIMATION BAR */
@-moz-keyframes fullexpand {
    0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
    4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
   16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
   17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
   18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	
}
@-webkit-keyframes fullexpand {
    0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
    4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
   16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
   17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
   18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	
}
@keyframes fullexpand {
    0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
    4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
   16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
   17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
   18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	
}


/* CONTENT SLIDER */
#content-slider {
	width:100%;
	height:340px;
	margin:5px auto 0;
}
/* SLIDER */
#slider {
	background:#000;
	border:5px solid #eaeaea;
	/*box-shadow:0px 0px 5px rgba(0,0,0,0.7);*/
	height:330px;
	width:910px;
	margin:20px;
	overflow:visible;
	position:relative;
}
#mask {
	overflow:hidden;
	height:320px;
}
#slider ul {
	margin:0;
	padding:0;
	position:relative;
}
#slider li {
	width:910px;
	height:320px;
	position:absolute;
	top:-325px;
	list-style:none;
}

#slider li.firstanimation {
	-moz-animation:cycle 25s linear infinite;	
	-webkit-animation:cycle 25s linear infinite;
	animation:cycle 25s linear infinite;		
}
#slider li.secondanimation {
	-moz-animation:cycletwo 25s linear infinite;
	-webkit-animation:cycletwo 25s linear infinite;
	animation:cycletwo 25s linear infinite;		
}
#slider li.thirdanimation {
	-moz-animation:cyclethree 25s linear infinite;
	-webkit-animation:cyclethree 25s linear infinite;
	animation:cyclethree 25s linear infinite;		
}
#slider li.fourthanimation {
	-moz-animation:cyclefour 25s linear infinite;
	-webkit-animation:cyclefour 25s linear infinite;
	animation:cyclefour 25s linear infinite;		
}
#slider li.fifthanimation {
	-moz-animation:cyclefive 25s linear infinite;
	-webkit-animation:cyclefive 25s linear infinite;
	animation:cyclefive 25s linear infinite;		
}

#slider .tooltip {
	background:rgba(0,0,0,0.7);
	/*width:300px;*/
	height:60px;
	position:relative;
	bottom:75px;
	/*left:-320px;*/
	-moz-transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	transition:all 0.3s ease-in-out;
	filter: alpha(opacity=1);
	opacity: 1;  
}
#slider .tooltip h1 {
	color:#fff;
	font-size:24px;
	font-weight:300;
	line-height:60px;
	padding:0;
	text-align: center;
}
#slider li#first:hover .tooltip, 
#slider li#second:hover .tooltip, 
#slider li#third:hover .tooltip, 
#slider li#fourth:hover .tooltip, 
#slider li#fifth:hover .tooltip{
	left:0px;
}
#slider:hover li, 
#slider:hover .progress-bar {
	-moz-animation-play-state:paused;
	-webkit-animation-play-state:paused;
	animation-play-state:paused;
}

/* PROGRESS BAR */
.progress-bar { 
	position:relative;
	top:-5px;
	width:680px; 
	height:5px;
	background:#000;
	-moz-animation:fullexpand 25s ease-out infinite;
	-webkit-animation:fullexpand 25s ease-out infinite;
	animation:fullexpand 25s ease-out infinite;
}