body {
  font-family: Arial, Verdana, sans-serif Simhei;
  color: #333333;
  padding: 0px;
  margin: 0px auto;
  font-size:12px;
  background-color: #ffffff;

}
/*--------------------------------------*/
/*start of unifing all common html tags*/
/*--------------------------------------*/

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
}

h1 {
  font-size: 18px;
  color: #e60b02;
  font-size:18px;
  font-weight:bold;
}

h2 {
  /*font-size: 18px;
  color: #e60b02;
  font-size:18px;
  font-weight:bold;*/
  font-size: 12px;
  font-weight:bold;
}

h3 {
  font-size: 12px;
  padding: 0px;
  margin: 0px;
  font-weight:normal;

}

h5 {
  font-size: 12px;
  color:#333333;
  padding: 0px;
  margin: 0px;
  font-weight:bold;
}

img {
  border: none;
  padding: 0px;
  margin: 0px;
}

p {}

a, a:visited {
  text-decoration: none;
  color:#ae0609;
}

a:hover
{
  text-decoration:underline;
}

.input, textarea {
    color: #333333;
}

.table {
clear:both;
}

/* clearfix div class, using at the bottom of all container */
div.clearfix {
  visibility: hidden;
  height: 0px;
  font-size: 1px;
  color:  #FFFFFF;
  clear: both;
}

/*End of unifing all common html tags*/


/*--------------------------------------*/
/*  webiste main container
/*--------------------------------------*/

div#container {
 width: 980px;
 margin: 0 auto;
 padding: 0;
 background-image:url(../images/viva-header.gif);
 background-position:right top;
 background-repeat: no-repeat;
}

/*--------------------------------------*/
/*  Viva logo, language
/*--------------------------------------*/

  /*logo and language links*/
#hder {
  height:78px;
  width: 980px;

}

  /*logo container*/
#logo {
  width: 250px;
  float:left;
  padding-top: 10px;
  padding-left: 8px;
}

  /*language and donate button container*/
#lang {
  margin-right: 0px;
  padding: 8px;
  text-align:right;
  float:right;
}

#lang ul {
  padding: 0px;
  margin: 0px;
}

#lang ul li {

  margin-left: 10px;
  list-style: none;
  float:left;

}

#lang ul li a {
  color: #FFFFFF;
  font-weight: bold;
  font-size: 12px;
}

#lang select {
  font-size:11px;
  border:#FFFFFF;
  height: 19px;
  padding:2px;
}

/*--------------------------------------*/
/*  Navigation Menu
/*--------------------------------------*/

#nav {
  width:980px;
  margin:0;
  padding:0;
  font-weight:normal;
  text-transform:uppercase;
  font-weight:bold;
  height:44px;
  clear:both;
}

#nav ul {margin:0; padding:0px; text-align:center;}
#nav li {margin:0px; padding:0px; list-style-type:none; float:left; }
#nav li a {
  text-decoration:none;
  display: block;
  height:27px; /*this height + padding height is 44px*/
  width: 122px;
  background-image:url(/images/bg-nav.png);
  background-repeat:no-repeat;
  background-position: bottom;
  color:#e60b02;
  font-size:15px;
  padding-top: 17px;
  font-weight: bold;
}
/* nav menu - last item's width, to show right border*/
.nav-w {
width: 123px !important;
}

#nav li a:hover {
  background-image:url(/images/bg-nav-mo.png);
  background-repeat:no-repeat;
}
#nav li a.current, a.current:hover {
  background-image:url(/images/bg-nav-mo.png);
  background-repeat:no-repeat;
}

/*--------------------------------------*/
/*  Page Body
/*--------------------------------------*/

#body{
  width:980px;
  margin: 1px 0 0 0;
  padding: 10px 0 0 0;
  background-image:url(/images/bg-bdy.gif);
  background-repeat:repeat-x;

}

#pg-left {
  width: 202px;
  float: left;
}

/*Home page mid section*/
#pg-right {
    width: 772px;
  float:right;
  position:relative;
}

#home-right {
width: 250px;
float:right;
}

#home-mid {
width: 517px;

float:left;
}

#hot-offer {
border:#CCCCCC 1px solid;
_width: 516px;
padding: 0px;
margin: 0px;
height: 218px;
_position: relative;
}

.home-256x218 {
#padding-left: 3px; _position: absolute; right:0px; _padding: 0px;
}

.offer {
margin-top: 3px;
margin-bottom: 3px;
_margin-bottom: 2px;
clear: both;
}

.offer ul {
padding: 0px;
margin: 0px;
position:relative;
}

.offer ul li {
list-style-type:none;
list-style-image:none;
list-style:none;
padding: 0px !important;
margin: 0px !important;
display:inline;
}

.last-offer {
right: 1px;
position:absolute;
}

.mid-ad {
margin-bottom: 3px;
_margin-bottom: 0px;
}

#inner-banner {
width: 772px;
height: 153px; /* origianl height is 148 + light-grn-bx -5 margin equals 153px */
background-color: #b3d334;
clear: both;
}

/*--------------------------------------*/
/*  Page headings and page content
/*--------------------------------------*/

.green-box {
  background-color: #b3d334;
  padding: 0px;
  margin: 0px;
}
.title {
    background-image:url(/images/bg-right-title.gif);
  background-repeat:no-repeat;
  background-position:right;
  color: #ae0609;
  display:block;
  font-weight:bold;
  float: left;
}

.title-h {
background-image:url(/images/bg-left-title.gif);
background-position:left;
background-repeat:no-repeat;
display: block;
float: left;
}

.light-grn-bx {

margin-top: -5px;
_margin-top: 0px; /*ie 6 fix*/
#margin-top: -1px; /*ie 6 fix*/
left: 0px; border: 8px solid #f0f6d6; padding: 3px;background-color:#FFFFFF; clear: left; 

}

.bx-space{
  padding: 5px;
  clear: both;
}


.title-s {
height: 17px; margin-top: 3px;padding: 5px 15px 0px 7px;
_height: 21px;
}

.title-spacing {
padding: 7px 15px 1px 7px;
height: 21px;
}

.left-panel-hder {
margin-left: -8px;
_margin-left: -5px;
clear: both;
}

/* white box with white corner */

.bx-tl {

background-color:#FFFFFF;
margin: -5px 3px 3px 2px;
position:relative;
background-image:url(/images/cr-tl.gif); background-repeat:no-repeat;
float:left;
_float: none;
}

.bx-tr {
background-image:url(/images/cr-tr.gif); position:relative; background-repeat:no-repeat; background-position:right top;
}

.bx-bl {
background-image:url(/images/cr-bl.gif); position:relative; background-repeat:no-repeat; background-position:left bottom;
}

.bx-br {
background-image:url(/images/cr-br.gif); position:relative; background-repeat:no-repeat; background-position:right bottom; padding: 3px; _padding: 0px;
clear: both;
}

/*dark green box*/

.gr-tl {

background-image:url(/images/cr-grn-tl.gif);
 background-position: left top;
background-repeat:no-repeat;
clear:both;
}

.gr-tr {
background-image:url(/images/cr-grn-tr.gif); position:relative; background-repeat:no-repeat; background-position:right top; clear:both; font-size: 14px; font-weight:normal; color:#333333;}

.gr-bl {
background-image:url(/images/cr-grn-bl.gif); position:relative; background-repeat:no-repeat; background-position:left bottom;
}

.gr-br {
background-image:url(/images/cr-grn-br.gif); position:relative; background-repeat:no-repeat; background-position:right bottom; padding: 8px;
clear: both;
}

.gr-ex {
margin-bottom: 5px;
clear: both;
background-color: #b3d334;
}

/* left panel */

#pg-left ul { padding: 0px; margin: 0px;}

#pg-left ul li { height: 35px; list-style: none; list-style-type:none; float:left;  margin:0 1px 0px 0px;  background-color:#e0e0e0; background-image:url(/images/cr-gy-tl.gif); background-repeat:no-repeat; background-position: left top;}
#pg-left ul li a { color:#e60b02; font-size: 14px; text-decoration:none;display:block; text-align:center; padding: 10px; background-image:url(/images/cr-gy-tr.gif); background-repeat:no-repeat; background-position: right top;}
#pg-left ul li a:hover { text-decoration:underline;}
#pg-left ul li.current { text-decoration:none; background-color:#b3d334; background-image:url(/images/cr-grn-tl.gif); background-repeat:no-repeat; background-position:left top; font-size: 14px;}

#pg-left ul li h1 {
padding: 10px;
}

/*booking panel style*/
table.booking-panel {
font-size: 11px;
clear: both; _clear: none;
}

/*select box style*/
table.booking-panel select {
  font-size:11px;
  border:#FFFFFF;
  height: 19px;
  padding:2px;
}
table.booking-panel option {
    color: #333333;
}

table.booking-panel input {
    font-size:11px;
  border:#FFFFFF 1px solid;
}

.redlink a {
font-size:12px;
text-decoration:underline !important;
color:#ee3224 !important;
}

.redlink a:hover {
text-decoration:none !important;
font-size: 12px;
color:#ee3224;
}

/*--------------------------------------*/
/*  Footer ad spots
/*--------------------------------------*/

#ft-ad {
clear:both;
width: 750px;
float:right;
text-align:center;
margin: 5px;

}

/*--------------------------------------*/
/*  Footer -copyright and sub-nav
/*--------------------------------------*/
#footer {
  padding: 10px;
  _padding-top:10px; /*ie6 fix*/
  font-size:11px;
  background-color:#f0f6d6;
  clear:both;
  width: 960px;
}



#footer ol#ft-breadcrumbs {
font-size:11px;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0px;
padding: 0px;
}

#footer ol#ft-breadcrumbs li {
display:inline;
margin: 0px;
padding: 0px;
}

#footer ol#ft-breadcrumbs li a.home {
background-image:url(/images/icons/home-grn.gif);
background-repeat:no-repeat;
background-position:left;
}

#footer ol#ft-breadcrumbs li a{
background-image:url(/images/icons/bc-arrow.gif);
background-repeat:no-repeat;
background-position:left;
text-decoration: none;
color:#333333;
padding: 0 10px 0 13px;
float:left;
}

#footer ol#ft-breadcrumbs li a:hover {
color:#ff6600;
}

#directorynav {
margin: 20px 0 0 0;
_margin: 0px; /*ie6 fix*/
#margin: 0px; /*ie7 fix*/
padding: 5px;
border-top: #999999 solid 1px;
_background-color:#f0f6d6; /*ie6 fix*/
#background-color:#f0f6d6; /*ie7 fix*/
clear: both;
}

#directorynav .column {
width: 134px;
float:left;
}

#directorynav .column ul {
padding: 0px;
margin: 0px;
}

#directorynav .column ul li {
list-style-position:outside;
list-style-type: none;
list-style-image: none;
}

#directorynav .column ul li a {
color:#666666;
}

#directorynav .column ul li a:hover {
color:#ff6600;
}

#directorynav h5 a:hover, #directorynav h5 a {
  text-decoration: none;
  color: #333333;
}

#ft-links {
 clear:both; border-top:#999999 1px solid; padding-top: 3px; 
}

#ft-links ul{ padding:30px 0 0 0; margin: 0px 0 0 0; }
#ft-links ul li{ list-style-position:outside;
list-style-type: none;
list-style-image: none;float: left;display:block; padding-bottom: 5px;}
#ft-links ul li a{
padding: 0 5px 0 5px;
color: #333333;
font-size: 11px;
font-weight:bold;
}
#ft-links p {
margin: 0px;
padding: 5px 0 0 0px;
clear:both;
color:#666666;
}

/*Hotels*/
/*Start - contact info and page body heading style, e.g tel/fax/email, hotel name, page header*/
div.red-hder {
  background-repeat:no-repeat;
  background-image:url(/images/red-rtop.gif);
  background-position: 8px top;
  padding-top: 1px; /*show rounded top*/
  padding-bottom: 3px; /*show rounded bottom*/
  border-bottom:solid 1px #cccccc;
  margin-bottom: 5px;
  clear:both;
  margin: 10px;
  padding-left:8px;
  margin-top: 15px;

}
div.red-vertical {
  background-image:url(/images/red.gif);
  background-repeat:repeat-y;
}
div.red-cr-bottom {
  background-repeat:no-repeat;
  background-image:url(/images/red-rbottom.gif);
  background-position:left bottom;
}
div.red-hder-body {
  padding-left: 10px;
  margin: 0px;
}
h1.red-title {
  color: #e60b02;
  font-size:18px;
  font-weight:bold;
}

/*breadcrumbs*/
 ol#breadcrumbs {
font-size:11px;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0px;
padding: 5px 0 0 5px;
background-color: #f0f6d6;
height: 18px;
}

ol#breadcrumbs li {
display:inline;
margin: 0px;
padding: 0px;
}

ol#breadcrumbs li a.home {
background-image:url(/images/icons/home-grn.gif);
background-repeat:no-repeat;
background-position:left;
}

ol#breadcrumbs li a{
background-image:url(/images/icons/bc-arrow.gif);
background-repeat:no-repeat;
background-position:left;
text-decoration: none;
color:#ae0609;
padding: 0 10px 0 13px;
float:left;
}

ol#breadcrumbs li a:hover, ol#breadcrumbs li a.current {
text-decoration:underline;
}

div#body-left {
width: 485px;
float:left;
margin-left:12px;
_margin-left:8px;
position:relative;
}

div.full-body{
width: 725px !important;
}

div#body-left ul {
margin: 0px 0 0 20px;
padding: 0px;
}

div#body-left ul li {
list-style-position:outside;
list-style-image:url(../images/arrow-circle.gif);


}

div#body-right {
_width: 230px;
width: 240px;
float:right;
margin-right:8px;
position:relative;
_margin-right: 0px;
_padding:0px;
}

.right-ad {
margin-top: 5px;
width: 235px;
}

#right-menu {
width: 240px;
_width: 230px;
background-image:url(../images/bg-submenu.gif);
background-repeat:repeat-y;
}

#right-menu-top {
background-image:url(../images/bg-submenu-top.gif);
background-repeat:no-repeat;
background-position:left top;
}

#right-menu ul {
display: block;
width: 240px;
_width: 230px;
background-image:url(../images/bg-submenu-bt.gif);
background-repeat:no-repeat;
background-position:left bottom;
margin: 0px;
padding: 20px 5px 5px 5px;
min-height: 158px;
}

#right-menu ul li {
display:block;
color: #b3d334;
font-weight:bold;
font-size:15px;
text-indent: 5px;
}

#right-menu ul li a {
font-weight:bold;
font-size:14px;
color:#ee3224;
display:block;
width: 200px;
height: 22px;
padding: 5px 0 0 24px;
background-image:url(../images/bullet.gif);
background-repeat:no-repeat;
background-position:12px 50%;
}

#right-menu ul li a:hover, #right-menu ul li a.current {
background-color: #ee3224;
color:#FFFFFF;
text-decoration:none;
background-image:url(../images/bullet-red.gif);
background-repeat:no-repeat;
background-position:12px 50%;
}

/*Hotel listing style*/
.hotel { width:233px; height:56px; margin:0 6px 14px 0; position:relative; float:left; padding: 10px 0 0 3px;}
.hotel img { border:0; float:left; }
img.thm { margin:0 4px 0 0; width:66px; height:56px; }
img.thumb { margin:0 1px 0 1px; _padding: 3px 0 0 4px;}

.hotel a { color:#333333; font-size: 12px;}
 .hotel a.book { position:absolute; right:0; bottom:0; }
 a.book { background:url(../images/btn-booknow.gif) no-repeat; width:79px; height:31px; padding:5px; text-align:center; vertical-align:middle; line-height:16px; color:#fff; text-decoration:none; font-weight:bold; float:left; }
.hotel span.area { font-size:10px; color:#666; line-height:15px; text-transform:capitalize; }

/*Vocation listing style*/
.package { width:479px; margin:10px 0 5px 0; position:relative; float:left; clear:both; }
.package img { border:0; float:left;}
.package a { color:#333333; font-size: 12px;}
.package a.book { margin-left:5px; color:#ffffff;}
.package a.book small { font-size:9px; color:#fff; font-weight:normal; text-transform:lowercase; }
.package th { text-align:center; font-weight:normal; font-size: 11px; color:#333333; }
.package small, .package th { font-size:11px; color:#666; line-height:12px; }

/*level two breadcrumb */
div.tabmenu {
margin: 0px 0px 5px; padding:0px; height: 33px; border-bottom:dotted 1px #CCCCCC; clear:both;
}

p.sub-breadcrumb {
margin: 0px;
padding: 5px 10px 5px 0;
}

p.sub-breadcrumb a {
color:#999999;
font-weight:bold;
}

p.sub-breadcrumb a.current, p.sub-breadcrumb a:hover, p.sub-breadcrumb a.current:hover {
text-decoration:underline;
background-image:none;
color:#ee3224;
font-weight:bold;
}

span.stars-and-area {
color: #999999;
padding: 0 7px 0 7px;
}

/*End of level two breadcrumb*/

p.more a {
display:block;
height: 16px;
background-color:#eeeeee;
color:#ee3224;
clear:both;
text-align:center;
font-size: 11px;
font-weight:bold;
padding-top: 3px;
}

p.more a:hover {
text-decoration:underline;
}

/*booking steps*/
ol#step {
padding: 10px;
margin:0px 10px 10px 10px;
border-bottom: solid 1px #cccccc;
height: 38px;
}

ol#step li {
background-image:url(/images/circle-grey.jpg);
background-repeat:no-repeat;
background-position:left 35%;
text-decoration: none;
color: #999999;
float:left;
font-weight:bold;
height: 24px;
padding: 10px 23px 10px 0px;
font-size:16px;
text-indent: 8px;
list-style-type: decimal;
list-style-position: inside;
}

ol#step li.current {
background-image:url(/images/circle-green.jpg);
background-repeat:no-repeat;
background-position:left 35%;
color:#e60c02;
}

/*End of booking steps*/

/**********************/
/*Ferry book page*/
/**********************/
.green-title {
color: #b3d334;
font-weight: bold;
font-size:16px;
}

/*Hot vacation packages*/
.item {
  padding:0 0px 0px 0px;
  margin-bottom: 10px;
  width:480px;
  float:left;
  border-bottom:#CCCCCC 1px dotted;
  clear:both;
}

.info {
  background:no-repeat;
  font-size:12px;
  line-height:13px;
  padding:102px 0px 7px 0px;
  margin:9px 0 10px 5px;
  border:solid 1px #fff;
  width:150px;
  height:39px;
  float:left;
}
span.title-packages {
  color:#FF0000; text-decoration:none;}
span.choice {
  color:#333333; text-decoration:none;}
span.price {
  color:#a80004; text-decoration:none;}
/*End of Hot vacation packages*/


#body-left {}
#body-left ul.bx-i {list-style-type:none;position:relative; margin:10px 0 0; padding:0 0 0 2px;height:100%;}
#body-left ul.bx-i li {float:left; margin:0 0 3px 0; display:inline;}
#body-left ul.bx-i li * {display:block;}
#body-left ul.bx-i a { width:161px; border:0; color:#333333;}
#body-left ul.bx-i a:hover {background-color:transparent; text-decoration:underline; background-color:#eeeeee;}
#body-left ul.bx-i a img {margin:0 auto; padding:2px;}
#body-left ul.bx-i span { font-size:.9em; padding:5px 6px; text-align:center;  height: 30px;}

/************************/
/********Price list******/
/************************/
ul.grey {
list-style-type:none;
padding: 2px 5px 5px 5px;
margin: 0px 0 5px;
width: 221px;

}

.price-list {
font-size:11px;
position:relative;
}

ul.grey li {
margin:1px 0;
list-style:none;
color:#333333;
}

ul.grey li a {
color:#333333;
padding:1px 2px;
white-space:nowrap;
font-weight:bold;
}

ul.grey a span.from {
font-size: 11px;
padding-right: 2px;
color:#333333;
}
.price-list li a span.price {
color: #b3d334;
position: absolute;
right:5px;
white-space: nowrap;
font-weight:bold;
}

p.listing-title {
color: #999999;
font-weight:bold;
padding: 3px 0 0 7px;
margin: 0px;
}

/*right panel, macau shows and ticket sales thumbnail/container */
.show-thm {
clear: both; float: left; width:156px; margin: 5px 0 0 2px; _margin-left: 2px;
}

.ticket-thm {
float: right; margin: 5px 0 0 0;
}

/*homepage latest deals*/
.col {
width: 490px; float: left; position:relative; padding-bottom: 5px; _padding-bottom: 0px;
}

p.hotline {
clear:both; margin: 0px;  font-size:11px; padding:0 5px 5px 15px; _padding:0 5px 5px 8px;
background-image:url(../images/icons/tel.gif);
background-position:left 10%;
background-repeat:no-repeat;
}

.red {
color:#ae0609;
}

.green {
color:#87d300;
}

ul.deals {
margin: 0 0 10px 0;
padding: 0px;
}

ul.deals li {
white-space:nowrap;
width: 240px;
_width: 237px;
list-style:none;
float:left;
margin-right: 5px;
display:block;
}

ul.deals li a {
height: 20px;
padding: 5px 0 0px 0;
margin: 0px;
border-bottom: dotted 1px #e60b02;
background-image:url(../images/arrow-circle.gif);
background-repeat:no-repeat;
background-position:3px 50%;
display:block;
text-indent: 17px;
color:#333333;
font-weight:bold;
position:relative;
}

ul.deals li a:hover {
background-color:#ffc799;
text-decoration:none;
background-image:url(../images/arrow-circle-mo.gif);
background-repeat:no-repeat;
background-position:3px 50%;
}

ul.deals a span.price {
white-space:nowrap;
right: 2px;
color:#ee3224;
position:absolute;
font-weight:normal;
text-decoration:underline;

}
/*end of homepage latest deals*/

/*Homepage travel tool*/

ul.icon-list {
margin: 10px;
_margin: 8px;
padding: 0px;
list-style:none;
}

ul.icon-list li {
width: 150px;
height: 43px;
float:left;
position:relative;

padding: 4px;
margin:0px;
background-repeat:no-repeat;

}

ul.icon-list li a {
padding-left: 35px;
color:#ee3224 !important;
white-space:pre-line;
display:block;
text-decoration:underline !important;
}

ul.icon-list li a:hover {
text-decoration:none !important;
}

#errorExplanation {
  width: 450px;
  border: 2px solid red;
  padding: 7px;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

#errorExplanation h2 {
  text-align: left;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  font-size: 12px;
  margin: -7px;
  background-color: #c00;
  color: #fff;
}

#errorExplanation p {
  color: #333;
  margin-bottom: 0;
  padding: 5px;
}

#errorExplanation ul li {
  font-size: 12px;
  list-style: url(/images/icons/error.gif) !important;
}

.fieldWithErrors {
  padding: 2px;
  color: #ee3224;
  font-weight: bold;
  float: left;
}

/*latest deal city tab*/
div.city {
bottom: 0px;
padding-left: 5px;
}

.city h6 {
  font-size: 12px;
  font-weight:bold;
}

.city a {
padding: 5px 3px 0 2px;
height: 20px;
display: inline;
color: #e60b02;
float: left;
}

.city a:hover {
background-color: #e60b02;
text-decoration:underline;
color: #FFFFFF;
}

.city a.current, .city a:hover.current {
background-color: #e60b02;
background-image:none !important;
text-decoration:underline;
color: #FFFFFF;
}
/*end of city tab*/

/*timetable style*/
  .flight-timetables table {border-collapse:collapse; margin-bottom:1em; width:100%;}
  .flight-timetables table th {background-color:#ccc; padding:3px; color:#fff;}
  .flight-timetables table td {padding: 3px;}
  
/*timetable */
  table.timetable {background-color:#cccccc; width: 98%;}
  table.timetable th {background-color:#eeeeee; }
  table.timetable td {background-color:#ffffff;}  

/*press releases*/
  div#body-left .all-press-releases-list, div#body-left .all-press-releases-list li {list-style-image:none; list-style-type:none; margin-left:0;}
  .all-press-releases-list span {float:left; width:95px; text-align:right; w00hite-space:nowrap;}
  .all-press-releases-list a {display:block;margin-left:100px;}
  
/*home attention msg*/ 
div.home-attention-msg { text-align: center; padding: 0px 0 3px 0;}
