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

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


#slideshow-outer {
  height: 350px;
  margin: 0 auto;
  position: relative;
  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: 350px;
  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: 350px;
  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;
}

#mission p {
  margin: 6% 0;
}

/*end of mission-----------------------*/

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


/* Start For Column Style-------------------------------------*/

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

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

#preface-wrapper {
  margin: 23px 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: 15px auto 0;/*fix IE 7 bug*/
  padding: 0;
  width: 920px;
}

#preface-wrapper .column {
  float: left;
  padding: 5px 0;
}

#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 Wrapper----------------------------*/

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

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

.triplet-wrapper {
  padding: 20px 0;
}

.column {
  float: left;
}

.in1 .column {
  width: 100%;
}

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

.in3 .column {
  width: 33.3%;
}

#bottom-teaser .block,
#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: 5px;
  padding: 20px 0;
}
/*end of bottom note---------*/

/*end of bottom teaser and bottom wrapper------------------*/