body, div, ul, li, h1, h2, h3, h4, h5, h6, form, textarea, td { margin: 0; padding:0;}

/* layout */
body {
    line-height: 19px;
    font-size: 12px;
    font-family: Verdana, Arial, Helvetica, Simsun;
    background-color: #d5d6d7;
}

#page {
    background-color: white;
    width: 950px;
    margin: 20px auto;
}
 
#header {
    background: url(/stylesheets/default/header.jpg) no-repeat top center;
    width: 100%;
}

#content {
    background: url(/stylesheets/default/bodybkg.jpg) repeat-y top;
    width: 100%;
    float:left;
}

#footer {
    background: url(/stylesheets/default/footer.jpg) no-repeat bottom;
    width: 100%;
    height: 63px;
    clear: both;
}

/* header */
#headerimg { padding: 18px 20px 0px 20px; margin: 0; text-align: center; }

/* menu */
#menu {
    text-align: center;
    font-size:14px;
    height: 29px; /* this height = "body line height" + "#menu a span padding top + buttom" + "#menu ul padding-top" 
    /*line-height:normal; this cause problem in IE 6 */
    border-bottom:1px solid #DD740B;
    margin: 0px 20px 0 20px;
    width:910px;
}
#menu ul {
    padding:5px 0px 0 20px;
}
#menu li {
    display:inline;
}
#menu a {
    float:left;
    background:url(/stylesheets/default/tableft.gif) no-repeat left top;
    padding:0 5px 0 5px;
    text-decoration:none;
}
#menu a span {
    float:left;
    display:block;
    background:url(/stylesheets/default/tabright.gif) no-repeat right top;
    padding:3px 0px 2px 0px;
    width:136px;
    color:#FFF;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#menu a span {float:none;}
/* End IE5-Mac hack */
#menu a:hover span {color:#FFF;}
#menu a:hover {background-position:0% -42px;}
#menu a:hover span {background-position:100% -42px;}


/* page element */
#main {
    float: left;
    width: 672px;
    padding: 10px 5px 0 18px;
    text-align: left;
}

#sidebar {
    float: left;
    width: 214px;
    padding: 10px 20px 0 5px;
}

#whole {
    float:left;
    text-align: center;
    width: 910px;
    padding: 10px 20px 0 20px;
}

/* smaller elements */
#about {
    width: 700px;
    text-align: center;
    margin: auto;
}

#travel_page {
    margin: 0px 12px 0 20px;
}

/* footer */
#copyright {
    text-align: center;
    font-size: 10px;
    padding-top: 20px;
}

/* general element */
a { color: #04a1ff; text-decoration: none; }
a:hover { color: #E47317; }
a.comment { color: black; }
a.comment:hover { text-decoration: underline; }

hr {
    height: 1px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid gray;
}

h1,h2,h3,h4 { color: #E47317; }
h1 { font-size: 24px; margin: 10px auto; }
h2 { font-size: 18px; margin: 5px auto; }
h3 { font-size: 14px; margin: 2px auto; }
h4 { font-size: 12px; margin: 1px auto; font-weight: normal; }

ul { list-style:none; }

small { color: gray; }
img { border: 0; vertical-align: middle; margin: 0; padding: 0; }
input { border: 1px solid gray; background: none; }
select { border: 1px solid gray; }
p { margin: 10px 0 10px 0; padding: 0;}
blockquote {border: 1px solid gray; background-color: #FAFAFA; padding: 5px; }

fieldset { border: 1px solid gray; margin: 0px 0 10px 0; padding: 3px 5px 3px 5px;}
fieldset legend {}
fieldset label {text-align:right; float:left; margin:0 0 0 3px; color: gray; }
fieldset nobr { display:none; }
fieldset input { float:left; border:0; border-bottom: 1px solid gray; margin: 0 2px 3px 2px;}
fieldset textarea { margin: 0; border: none; overflow: auto; }

.highlight { color: #E47317; font-weight: bold;}
.odd { border-top: 1px solid #eee; background-color: #f8f8f8; }
.even {	border-top: 1px solid #eee; }
.center { text-align: center; }	
.left {	float: left; text-align: left; }
.right { float: right; text-align: right; }
.field_name { color: gray;}
.gray { color: gray }

/* sidebar list */
div.list { display: block; border: 2px solid #ddd; margin-bottom: 15px; overflow: hidden;}
div.list h3 { text-align: center; padding: 3px 5px 0 5px; margin: 0;}
div.list div.listbox { padding: 4px; overflow: hidden; }
div.list .row { padding: 3px; overflow: hidden; position: relative;  width: 97%; }
div.list .tld { width: 50px; text-align: right; right: 2px; top: 2px; position: absolute; }
div.list .list_icon { float: left; margin: 0; padding-top: 1px; width: 23px; }

.post { margin: 5px 10px 40px 20px; width: 640px; } /* this is fix for IE6 shit! */
#post_comments ul { list-style: none; padding: 0; margin: 10px 0 0 0;  }
#post_comments ul li { padding: 10px 10px 10px 10px; }
#post_navigation { margin: 0 10px 0 20px; }

/* comment form */
#comment_form {}
#comment_form fieldset input { width: 148px; }
#comment_form fieldset textarea { width: 100%; }

/* album */
.album {
    float: left;
    width: 200px;
    margin: 0;
    padding: 13px;
    text-align: center;
}
.album span { color: gray; }
.album_thumbnail {
    width: 194px;
    height: 194px;
    text-align: center;
    padding: 0;
    background: url(/stylesheets/default/album_background.gif) no-repeat left;
}
#album_photo {float: left; width: 668px; padding: 0px; text-align: center;}
#album_navigation { float: left; width: 650px; text-align: center; padding: 10px 10px 10px 10px; }
#nav_links { width: 89%; text-align: center; }
#photo {}
#album_photos { float: left; width: 100%; text-align: center; padding: 0;}
#photo_description { font-weight: bold; }
#slideshow_nav { float:left; padding: 10px 45px 10px 45px; }
.album_image { margin-top: 17px; border: 1px solid gray; }
.photo_thumbnail {float: left; width: 150px; height: 200px; text-align: center; padding: 0 9px; }
.photo_thumbnail img { border: 1px solid gray; vertical-align:  top; }

/* movie */
.movie { margin: 0; padding: 0; text-align: center; }
.movie_comments {padding: 10px 35px 10px 35px;}
.movie_comments ul {list-style: none; padding: 0;}
.movie_comments ul li {padding: 5px 10px 5px 10px;}
.movie_thumbnail { float: left; text-align: left; width: 410px; height: 130px; padding: 10px 20px 10px 20px; }
.movie_thumbnail_image { float: left; border: 1px solid gray; padding: 5px 5px 5px 5px; margin: 0 10px 0 0; }
.movie_thumbnail_info {}
.movie_description {color: gray;}
.movie_count {color: #E47317;}
.movie_length {color: #E47317;}

#homeimg { border: 0px solid red; width: 100%; clear: both; }

/* utility */
#spinner { float: left; position: absolute; }
.new_window { position: absolute; margin: 5px 0 0 180px; padding: 0; }

/* speical for the travel map */
.map { border: 1px solid #959596; text-align: left; }
.map_legend { margin: 0 0 0 10px; padding: 0;}
.map_legend span { margin: 0 15px 0 0; padding: 0; }
#big_map { margin: 0 0 10px 8px; width: 660px; height: 400px; }
#map { float: right; width: 400px; height: 400px; margin: 5px; }

/* will paginate */
.pagination {text-align: center;}
.pagination a {
    padding: 2px 5px 2px 5px;
    margin: 2px;
    font-weight: bold;
}
.pagination a:hover, .pagination a:active {}
.pagination span.current {
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border: 1px solid #000099;
    font-weight: bold;
    background-color: #000099;
}
.pagination span.disabled {display: none;}

/* special for google map in IE */
v\: * { behavior: url(#default#VML); }