/** 
Shanghai-travel CSS by HouShengnan @2013.02.28
**/

/** Reset **/
html, body, body div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, em, img, small, strong,
b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, hgroup, menu, nav, section, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

input, textarea {
  outline: none;
  resize: none;
}

ul, li {
  list-style: none;
}

/* force a vertical scrollbar to prevent a jumpy page */
html {
  overflow-y: scroll;
}

/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {
  outline: none;
}

img {
  max-width: 100%;
  border: none;
}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {
  margin: 0;
}

/* make buttons play nice in IE */
button {
  width: auto;
  overflow: visible;
}

/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic;
}

/* prevent BG image flicker upon hover */
.ie6 html {
  filter: expression(document.execCommand("BackgroundImageCache", false, true));
}

/* let's clear some floats */
.clearfix:before, .clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  zoom: 1;
}

/* common */
body {
  font: 14px 'Microsoft Yahei', arial, sans-serif;
  background: url(../img/bg.jpg) center top repeat;
}

a, a:link {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

p {
  line-height: 150%;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

.tl {
  text-align: left;
}

.tr {
  text-align: right;
}

.tc {
  text-align: center;
}

.c1, a.c1, a.c1:link {
  color: #ee090d;
}

.c2, a.c2, a.c2:link {
  color: #FFF;
}

.wrap {
  width: 1000px;
  margin: 0 auto;
}

.header {
  padding-top: 15px;
}

.home {
  padding-top: 80px;
}

.icon {
  display: inline-block;
  width: 37px;
  height: 37px;
  margin: 50px 2px 0;
}

.icon-weibo {
  background: transparent url(../img/icon_weibo.png) center top repeat;
}

.icon-txwb {
  background: transparent url(../img/icon_txwb.png) center top repeat;
}

.icon-wx {
  background: transparent url(../img/icon_wx.png) center top repeat;
}

.nav {
  margin-top: 20px;
  font-size: 0;
  text-align: center;
}

.nav-item {
  display: inline-block;
  width: 234px;
  height: 566px;
  margin-right: 18px;
  border: 1px solid #fff;
  position: relative;
  overflow: hidden;
}

.nav-item img {
  display: block;
  display: none;
}

.nav-about {
  background: url(../img/about.jpg) center top repeat;
}

.nav-games {
  background: url(../img/games.jpg) center top repeat;
}

.nav-join {
  background: url(../img/join.jpg) center top repeat;
}

.nav-contact {
  margin: 0;
  background: url(../img/contact.jpg) center top repeat;
}

.menu {
  width: 186px;
  height: 68px;
  position: absolute;
  left: -50px;
  top: 375px;
}

.menu-about {
  background: url(../img/menu_about.png) center top repeat;
}

.menu-games {
  background: url(../img/menu_games.png) center top repeat;
}

.menu-join {
  background: url(../img/menu_join.png) center top repeat;
}

.menu-contact {
  background: url(../img/menu_contact.png) center top repeat;
}

/* 二级页面 */
.page-nav {
  display: inline-block;
  margin-right: 20px;
  vertical-align: top;
}

.page-nav {
  *display: inline;
}

.page-nav.last {
  margin: 0;
}

.page-nav a {
  display: block;
  width: 235px;
  height: 67px;
}

.page-nav img {
  display: block;
  display: none;
}

.page-nav.current img {
  display: block;
}

.page-about {
  background: url(../img/p_about.jpg) center top repeat;
}

.page-games {
  background: url(../img/p_games.jpg) center top repeat;
}

.page-join {
  background: url(../img/p_join.jpg) center top repeat;
}

.page-contact {
  background: url(../img/p_contact.jpg) center top repeat;
}

.shadow {
  height: 31px;
  background: transparent url(../img/shadow.png) center top no-repeat;
}

.content {
  color: #747674;
}

.content p {
  line-height: 180%;
  margin-bottom: 10px;
}

.content h3 {
  margin: 10px 0;
  font-size: 16px;
  color: #757b75;
}

.title {
  height: 38px;
  margin-bottom: 30px;
  border-bottom: 2px solid #bfb8b8;
}

.title img {
  display: block;
  margin-bottom: -2px;
}

.notice {
  margin-top: 30px;
  padding: 2em 0 0;
  border-top: 2px solid #bfb8b8;
  text-align: center
}

.notice a {
  margin: 0 3em;
  text-decoration: none;
  color: red;
  font-size: 1.2em;
}

.subtitle {
  display: inline-block;
  margin-bottom: 15px;
  padding: 5px 10px;
  font-size: 1.5em;
  background: #61AEBC;
  color: #fff;
}

.w700 {
  width: 700px;
}

.w460 {
  width: 460px;
}

.w650 {
  width: 650px;
}

.w330 {
  width: 330px;
}

.footer {
  margin-top: 50px;
  padding-top: 35px;
  font-size: 14px;
  color: #6f6e6e;
  text-align: center;
}

.page-footer {
  background: transparent url(../img/footer.png) center top no-repeat;
}

.jiazhang {
  line-height: 30px;
  position: absolute;
  left: 10px;
  top: 0;
  color: red;
}

.jiazhang a {
  display: inline-block;
  padding-left: 28px;
  font-weight: bold;
  color: #f00;
  background: url(../jiazhang/images/shield.png) no-repeat left center;
}