/* SlideShow Wrapper----------------------*/

/* slideshow -----------------*/
#slideshow-wrapper {
  background: transparent url(../images/slideshow-shadow.png) no-repeat;
  clear: both;
  height: 414px;
  margin: 0 auto;
  padding-top: 8px;
  position: relative;
  width: 976px;
  z-index: 1;
}


#slideshow-outer {
  height: 398px;
  margin: 0 auto;
  width: 960px;/*in this slideshow, whitebull have 2 division , slideshow-outer and slideshow-inner, if you want to costumize the slideshow wrapper, you just modified the two of that division */
}

#slideshow-inner {
  position: relative;
  z-index: 1;
}

.slideshow {
  height: 398px;
  margin: 0 auto;
  max-width: 100%;
  min-width: 960px;
  overflow: hidden;
  text-align: center;
  z-index: 3;
}

.slideshow h2 .block-title {
  display: none;
}

/* end of slideshow----------------*/

/* slideshow note and mission wrapper--------------*/

#mission-and-slideshow-note {
  background: transparent url(../images/slideshow-note.png) no-repeat bottom;
  bottom: 0;
  float: left;
  left: 0;
  max-height: 398px;
  padding: 10px 0px 10px 0px;
  position: absolute;
  text-align: right;
  width: 960px;
  z-index: 5;
}

/*slideshow note-----------------*/
.slideshow-note {
  float: left;
  padding-left: 5px;
  text-align: left;
}
/*end of slideshow note--------------------*/

/*mission ---------------------*/
#mission {
  float: right;
  font-size: 22px;
  padding-right: 5px;
  text-align: right;
}
/*end of mission-----------------------*/

/*end of misssion and slideshow note------------------------*/


/* Preface------------------*/

#preface-wrapper {
  margin: 8px auto 0;
  width: 950px;
}

#preface-style {
  background: #e1e1e1;
  border: 1px solid #d1d1d1;
  border-radius: 2px;/*not compatible with IE 6, IE7 and IE 8,just for modern browser : D*/
  margin: 0 auto;
  padding-bottom: 15px;/*fix IE 7 bug*/
}

#preface-style .triplet-wrapper {
  margin: 0 auto;/*fix IE 7 bug*/
  padding: 15px 0 0;
  width: 920px;
}

#preface-wrapper .column {
  float: left;
}

#preface-wrapper .in1 .column {
  width: 100%;
}

#preface-wrapper .in2 .column {
  width: 49.9%;/* why not 50%? : D this is to fix the IE 7 bug, so don't touch : D */
}

#preface-wrapper .in3 .column {
  width: 33.3%;
}

#preface-wrapper .block {
  padding-left: 20px;
  padding-right: 20px;
}

/* end of preface----------------------*/
/* Bottom Teaser----------------------------*/

#bottom-teaser {
  margin: 0 auto;
  padding-bottom: 15px;
  width: 976px;
}

#bottom-teaser .column {
  float: left;
}

#bottom-teaser .in1 .column {
  width: 100%;
}

#bottom-teaser .in2 .column {
  width: 49.9%;/*this is to fix the IE 7 bug*/
}

#bottom-teaser .in3 .column {
  width: 33.3%;
}

#bottom-teaser .block {
  padding-left: 20px;
  padding-right: 20px;
}

/*end of bottom teaser-----------------------------*/

/* Bottom Wrapper-------------------------------*/

#bottom-wrapper {
  margin: 0 auto;
  width: 976px;
}

#bottom-wrapper .column {
  float: left;
}

#bottom-wrapper .in1 .column {
  width: 100%;
}

#bottom-wrapper .in2 .column {
  width: 49.9%;/*this is to fix the IE 7 bug*/
}

#bottom-wrapper .in3 .column {
  width: 33.3%;
}

#bottom-wrapper .block {
  padding-left: 20px;
  padding-right: 20px;
}

/* bottom note---------*/
.bottom-note {
  background: transparent url(../images/bottom-note-separator.png) repeat-x top;
  margin-top: 20px;
  padding-top: 20px;
}
/*end of bottom note---------*/

/*end of bottom wrapper------------------*/