/*======================================================================== 
  Copyright: 匯豐汽車網路事業
  Author: Shanny
  ========================================================================*/

@media screen, projection{

.mainContent { overflow: hidden; min-height: 350px;}
.rightContent h3{ color: #4174a3; font-size: 17px; margin: 10px;}
.rightContent h4{ color: #2e6ca3; font-size: 15px; margin: 10px;
  background-image: url(../../images/lineChick.gif);
  background-repeat: no-repeat; background-position: 0 center;}
.rightContent h4 span{ display: inline-block; background: #fff; padding: 5px; margin-left: 25px;}
.rightContent h5{ font-size: 15px; margin: 10px; padding-left: 20px;
  background-image: url(../../images/icon/pointBlue01.gif);
  background-repeat: no-repeat; background-position: 7px center;}
.rightContent h6{ font-size: 16px; color: #285e8f; margin-bottom: 20px; padding-left: 15px;
  background: url(../../images/icon/arrowRed01.gif) no-repeat 5px 5px;
}
.rightContent h6 span{ color: #999; font-size: 14px;}
.rightContent p{ margin: 0 10px 35px 10px; font-size: 14px;}
.rightContent .btn-primary:link,.rightContent .btn-primary:visited,.rightContent .btn-primary:hover,.rightContent .btn-primary:active{ color: #fff;}
.rightContent .btn-default{ color: #333; font-weight: bold;}

.rightContent .numChinese{ overflow: hidden; font-size: 14px;}
.rightContent .numChinese dt,.rightContent .numChinese dd{ margin-bottom: 10px;
/*以下為居家旅行必備良方*/
/*solve the vertical-align problem of horizontal divs*/
vertical-align:top;
display:-moz-inline-stack;
display:inline-block;
zoom:1;
*display:inline;
height:auto!important;
height:24px;
min-height:24px;
}
.rightContent .numChinese dt{ width: 30px; margin-left: 40px;}
.rightContent .numChinese dd{ width: 700px;}
.rightContent .numChinese b{ color: #333; display: block;}

.rightContent .num{ padding: 0; margin-bottom: 35px; font-size: 14px;}
.rightContent .num li{ margin: 0 0 10px 63px; list-style: decimal;}
.rightContent .numChinese dd .num{ margin-bottom: 0;}
.rightContent .numChinese dd .num li{ margin: 5px 0 5px 23px;}

.rightContent .arrowGreen{ margin-bottom: 35px; padding: 5px 0 0 20px; font-size: 14px;}
.rightContent .arrowGreen li{
  background-image: url(../../images/icon/arrowGreen01.gif);
  background-repeat: no-repeat;
  background-position: 0 center;
  padding-left: 15px;
  margin: 7px 10px;
}

.rightContent .putCenter img{ padding-top: 10px;}

.rightContent table{ margin: 0 10px 35px 30px; font-size: 14px;}
.rightContent th,.rightContent td{ padding: 8px;}
.rightContent td{ border-bottom: dotted 1px #ccc;}
.rightContent th{ color: #333; font-size: 15px; text-align: center;
  background: #e6eef5; border-right: solid 1px #fff;}
.rightContent td.black{ width: 150px; background: #f6f6f6; color: #000; text-align: center;
  border-bottom: solid 1px #fff;}
	
/* 服務港口及報價 */
.oceanShipping table a{ display: block;}

/* 海運服務 - 船期查詢 */
.searchFactor{ border: solid 1px #ccc; overflow: hidden; position: relative; margin: -25px 0 40px 0;
  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
}
.searchFactor .form-horizontal{ background: #f5f5f5; padding: 15px 5px;
  -webkit-box-shadow:inset 0 -3px 5px 0 rgba(0,0,0,0.05);
  box-shadow:inset 0 -3px 5px 0 rgba(0,0,0,0.05);
}
.searchFactor .form-horizontal .btn-primary:link{ position: absolute; right: 15px; bottom: 30px;}

.searchFactor .form-horizontal select,.searchFactor .form-horizontal input{ margin: 3px 5px 5px 0;}
.searchFactor .form-group{ margin: 0 5px;}
.searchFactor .form-group label{ width: 100px; float: left;}
.searchFactor .form-group > div{ float: left;}
.searchFactor .form-group > div.twoCol{ width: 240px;}
.searchFactor .put-inline { display: inline-block; width: auto;}

.rightContent .searchAnswer{ margin: -10px 0 0 0; border: solid 1px #e5e5e5;}
.rightContent .searchAnswer th span{ color: #777; display: block; font-size: 12px;}
.rightContent .searchAnswer td{ font-size: 12px;}
.rightContent .searchAnswer tr:nth-child(odd){ background: #f9f9f9;}

.oceanShipping .notes{ font-size: 14px; padding-left: 35px; margin: 15px 0;
  background-image: url(../../images/icon/exclamation.png); background-repeat: no-repeat; background-position: 12px 1px;
}
.oceanShipping .notes strong{ display: block; color: #ee3409; font-size: 15px; margin-bottom: 5px;}

/* 海運服務 - 全省營業據點 */
/*.site{ width: 770px; margin: 0; line-height: 160%;}
.site td{ width: 150px; padding: 5px 0; text-align: center; font-size: 15px;
  border-left: solid 1px #e1e1e1; border-bottom: none;
}
.site td.taipei{ width: 330px; border-left: none; padding-left: 40px; box-sizing: border-box; text-align: left; vertical-align: bottom; font-size: 13px;
  background-image: url(../../images/contact_site.gif); background-repeat: no-repeat; background-position: 0 0;}
.site td img{ margin: 0 5px 3px 0; vertical-align: middle;}
.site td strong{ color: #000; font-size: 17px; font-weight: normal;}*/

#tabs ul{ border-bottom: solid 3px #e5e5e5; margin: 0 -5px 0 0; padding: 0; line-height: 170%;}
#tabs ul a{ display: block; padding: 10px 16px; margin: 0; font-size: 15px; color: #333;}
#tabs .ui-state-default{
  display: inline-block; border-right: solid 3px #fff; margin: 0 -3px -3px 0; padding: 0;
}
#tabs .ui-state-active{
background: rgb(81,142,193); /* Old browsers */
background: -moz-linear-gradient(top,  rgb(81,142,193) 0%, rgb(40,92,138) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgb(81,142,193) 0%,rgb(40,92,138) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgb(81,142,193) 0%,rgb(40,92,138) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#518ec1', endColorstr='#285c8a',GradientType=0 ); /* IE6-9 */
}
#tabs .ui-state-hover{
  background: rgb(81,142,193); /* Old browsers */
background: -moz-linear-gradient(top,  rgb(81,142,193) 0%, rgb(40,92,138) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgb(81,142,193) 0%,rgb(40,92,138) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgb(81,142,193) 0%,rgb(40,92,138) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#518ec1', endColorstr='#285c8a',GradientType=0 ); /* IE6-9 */
}
#tabs .ui-state-active a,#tabs .ui-state-hover a{ color: #fff;}

.theList{ width: 782px; width: 784px\0; padding: 15px 15px 0 15px; margin-bottom: 30px; box-sizing: border-box;
  border: solid 1px #e5e5e5; border-top: none;}
.theList h3{ color: #666; font-size: 14px; padding: 5px 5px 10px 5px; margin: 0 0 10px 0;
  border-bottom: solid 1px #aed0f1;}
.theList h3 strong{ color: #3d76a7; font-size: 17px; font-weight: normal;}

.theList a.map{ width: 13px; height: 17px; margin-left: 10px; display: inline-block;
  background-image: url(../../images/icon/map.png);}

.theList p{ font-size: 14px; color: #666; line-height: 180%; margin: 20px 20px 30px 20px;}
.theList p strong{ font-size: 16px; font-weight: normal; color: #333; display: block;}
.theList p span{ display: inline-block; padding-left: 25px;
  background-repeat: no-repeat; background-position: 2px 4px;}
.theList p span.tel{ background-image: url(../../images/icon/tel.gif);}
.theList p span.fax{ background-image: url(../../images/icon/fax.gif); margin-left: 50px;}
.theList p span.email{ background-image: url(../../images/icon/email.gif); margin-left: 50px;}
.theList p a{ text-decoration: underline;}

}