/********************************************************************************
 * fonts
 ********************************************************************************/
@font-face {
  font-family: 'HeliosCondLight';
  src: url('fonts/HeliosCondLight.eot');
  src: url('fonts/HeliosCondLight.eot?#iefix') format('embedded-opentype'),
  url('fonts/HeliosCondLight.woff') format('woff'),
  url('fonts/HeliosCondLight.ttf') format('truetype'),
  url('fonts/HeliosCondLight.svg#open_sansbold') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'HeliosUltraCompressed';
  src: url('fonts/HeliosUltraCompressed.eot');
  src: url('fonts/HeliosUltraCompressed.eot?#iefix') format('embedded-opentype'),
  url('fonts/HeliosUltraCompressed.woff') format('woff'),
  url('fonts/HeliosUltraCompressed.ttf') format('truetype'),
  url('fonts/HeliosUltraCompressed.svg#open_sansbold') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'HeliosCondBlack';
  src: url('fonts/HeliosCondBlack.eot');
  src: url('fonts/HeliosCondBlack.eot?#iefix') format('embedded-opentype'),
  url('fonts/HeliosCondBlack.woff') format('woff'),
  url('fonts/HeliosCondBlack.ttf') format('truetype'),
  url('fonts/HeliosCondBlack.svg#open_sansbold') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'HeliosCondThin';
  src: url('fonts/HeliosCondThin.eot');
  src: url('fonts/HeliosCondThin.eot?#iefix') format('embedded-opentype'),
  url('fonts/HeliosCondThin.woff') format('woff'),
  url('fonts/HeliosCondThin.ttf') format('truetype'),
  url('fonts/HeliosCondThin.svg#open_sansbold') format('svg');
  font-weight: normal;
  font-style: normal;
}

/********************************************************************************
 * global styles
 ********************************************************************************/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, textarea,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header,
hgroup, nav, section {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  color: inherit;
  text-decoration: inherit;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
}

html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

html, body {
  font-family: Arial;
  font-size: 10px;
  text-align: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

/********************************************************************************
 * main content styles
 ********************************************************************************/
#content {
  position: relative;
  margin: 0 auto;
  width: 80em;
  height: 60em;
  -webkit-transform: rotateZ(0);
  -moz-transform: rotateZ(0);
  -ms-transform: rotateZ(0);
  -o-transform: rotateZ(0);
  transform: rotateZ(0);
}

.corner-button {
  position: absolute;
  bottom: 0;
  width: 9.3em;
  height: 7.8em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 100;
  cursor: pointer;
}

.corner-button.left {
  left: 0;
  background-image: url(images/corner_left.png);
}
.corner-button.right {
  right: 0;
  background-image: url(images/corner_right.png);
}

.curSlide1 .corner-button.left {
  display: none;
}
.curSlide8 .corner-button.right {
  display: none;
}

#slide1,
#slide2,
#slide3,
#slide4,
#slide5,
#slide6,
#slide7,
#slide8 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transition: opacity .3s linear;
  -moz-transition: opacity .3s linear;
  -ms-transition: opacity .3s linear;
  -o-transition: opacity .3s linear;
  transition: opacity .3s linear;
  -webkit-transform: rotateZ(0);
  -moz-transform: rotateZ(0);
  -ms-transform: rotateZ(0);
  -o-transform: rotateZ(0);
  transform: rotateZ(0);
}

#slide1 {
  background-image: url(images/back1.png);
}

#slide2 {
  background-image: url(images/back2.png);
}

#slide3 {
  background-image: url(images/back3.png);
}

#slide4 {
  background-image: url(images/back4.png);
}

#slide5 {
  background-image: url(images/back5.png);
}

#slide6 {
  background-image: url(images/back6.png);
}

#slide7 {
  background-image: url(images/back7.png);
}

#slide8 {
  background-image: url(images/back3.png);
}

/********************************************************************************
 * slide 1
 ********************************************************************************/
#slide1 header {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3.7em;
  font-family: "HeliosCondLight";
  font-weight: normal;
  background-image: url(images/s1_header_back.png);
  background-repeat: repeat-x;
  background-position: 0 0;
  background-size: 1px 3.7em;
  text-align: center;
  line-height: 3.7em;
  color: #2f2f2f;
}

#slide1 header > span {
  font-size: 3.2em;
  vertical-align: middle;
}

/* left,center,right parts */
#slide1 .left-part,
#slide1 .center-part,
#slide1 .right-part {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  -webkit-transition: left .3s linear;
  -moz-transition: left .3s linear;
  -ms-transition: left .3s linear;
  -o-transition: left .3s linear;
  transition: left .3s linear;
}
#slide1 .center-part {
  left: 27.9em;

}
#slide1 .right-part {
  left: 71.2em;
}

/* small photo and descriptions */
#slide1 .small-photo {
  position: absolute;
  left: 1.8em;
  top: 5.8em;
  width: 8em;
  height: 8.3em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-shadow: 0 0 0 .2em rgba(82,85,85);
}

#slide1 .left-part .small-photo {
  background-image: url(images/s1_small_photo.png);
}

#slide1 .right-part .small-photo {
  /*background-image: url(images/s1/photo69.jpg);*/
  left: 0;
  -webkit-transition: left .4s linear;
  -moz-transition: left .4s linear;
  -ms-transition: left .4s linear;
  -o-transition: left .4s linear;
  transition: left .4s linear;
}

#slide1 .small-photo-info {
  position: absolute;
  left: 10.7em;
  top: 5.8em;
  text-align: left;
  white-space: nowrap;
  color: rgb(164,164,164);
  opacity: 0;
  -webkit-transition: opacity .3s linear;
  -moz-transition: opacity .3s linear;
  -ms-transition: opacity .3s linear;
  -o-transition: opacity .3s linear;
  transition: opacity .3s linear;
}

#slide1 .small-photo-info .name {
  font-family: "HeliosCondBlack";
  line-height: 1.6em;
  margin-bottom: .8em;
}

#slide1 .small-photo-info .name > span {
  font-size: 1.9em;
  vertical-align: middle;
}

#slide1 .small-photo-info .birthday {
  font-family: "Myriad Pro";
  line-height: 1.4em;
}

#slide1 .small-photo-info .birthday > span {
  font-size: 1.2em;
  vertical-align: middle;
}

/* fix for right item */
#slide1 .right-part .small-photo-info {
  left: 12.7em;
}

#slide1 .right-part .small-photo-info .name,
#slide1 .right-part .small-photo-info .birthday {
  white-space: normal;
  width: 16em;
}

/* center part - diagramm */
#slide1 .circle-diagramm {
  position: absolute;
  left: 0;
  top: 10.5em;
  width: 42em;
  height: 42em;
  -webkit-transition: left .3s linear;
  -moz-transition: left .3s linear;
  -ms-transition: left .3s linear;
  -o-transition: left .3s linear;
  transition: left .3s linear;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

#slide1 svg .text-year {
  /*cursor: pointer;*/
  cursor: default;
  font-size: 14px;
}

#slide1.s1901 svg .text-year.year1901,
#slide1.s1902 svg .text-year.year1902,
#slide1.s1903 svg .text-year.year1903,
#slide1.s1904 svg .text-year.year1904,
#slide1.s1905 svg .text-year.year1905,
#slide1.s1906 svg .text-year.year1906,
#slide1.s1907 svg .text-year.year1907,
#slide1.s1908 svg .text-year.year1908,
#slide1.s1909 svg .text-year.year1909,
#slide1.s1910 svg .text-year.year1910,
#slide1.s1911 svg .text-year.year1911,
#slide1.s1912 svg .text-year.year1912,
#slide1.s1913 svg .text-year.year1913,
#slide1.s1914 svg .text-year.year1914,
#slide1.s1915 svg .text-year.year1915,
#slide1.s1916 svg .text-year.year1916,
#slide1.s1917 svg .text-year.year1917,
#slide1.s1918 svg .text-year.year1918,
#slide1.s1919 svg .text-year.year1919,
#slide1.s1920 svg .text-year.year1920,
#slide1.s1921 svg .text-year.year1921,
#slide1.s1922 svg .text-year.year1922,
#slide1.s1923 svg .text-year.year1923,
#slide1.s1924 svg .text-year.year1924,
#slide1.s1925 svg .text-year.year1925,
#slide1.s1926 svg .text-year.year1926,
#slide1.s1927 svg .text-year.year1927,
#slide1.s1928 svg .text-year.year1928,
#slide1.s1929 svg .text-year.year1929,
#slide1.s1930 svg .text-year.year1930,
#slide1.s1931 svg .text-year.year1931,
#slide1.s1932 svg .text-year.year1932,
#slide1.s1933 svg .text-year.year1933,
#slide1.s1934 svg .text-year.year1934 {
  color: #fff;
  fill: #fff;
  font-weight: bold;
}

/*#slide1 svg .text-year:hover {*/
  /*font-weight: bold;*/
/*}*/

/* center part - legend */
#slide1 .bottom-legend {
  position: absolute;
  left: 3.3em;
  bottom: 0;
  width: 36.2em;
  /*height: 5.3em;*/
  height: 6em;
  /*background-color: rgba(2,2,2,.85);*/
  white-space: nowrap;
  text-align: left;
}

#slide1 .bottom-legend .left-block,
#slide1 .bottom-legend .right-block {
  position: relative;
  /*display: inline-block;*/
  display: block;
  /*width: 17.1em;*/
  width: 100%;
  /*padding: .5em 0 0 3.1em;*/
  font-family: "Myriad Pro";
  color: rgb(164,164,164);
  /*line-height: 1.4em;*/
  line-height: 2.3em;
  text-align: center;
  vertical-align: top;
}

#slide1 .bottom-legend .right-block {
  /*width: 14.1em;*/
  padding-left: 2.2em;
}

#slide1 .bottom-legend .left-block > span {
  font-size: 1.8em;
  vertical-align: top;
  font-weight: bold;
}

#slide1 .bottom-legend .right-block > span {
  font-size: 1.7em;
  vertical-align: top;
}

#slide1 .bottom-legend .box {
  position: absolute;
  left: 0;
  display: block;
  width: 1em;
  height: 1.1em;
}
#slide1 .bottom-legend .right-block .box1 {
  top: .7em;
  background-color: #4da23e;
  /*background-color: #7a1216;*/
  left: 10em;
}
/*#slide1 .bottom-legend .right-block .box2 {*/
  /*top: 2.4em;*/
  /*background-color: #4da23e;*/
/*}*/




#slide1 .bracket.gray-bracket:not(.selected){
  width: 6.1em !important;
  height: 5.9em !important;
}
#slide1 .bracket.gray-bracket:not(.selected) .text {
  width: 2.3em !important;
  height: 5.9em !important;
}



#slide1 .bracket {
  width: 6.1em;
  height: 5.9em;
  cursor: pointer;
  color: #fff;
  -webkit-transition: width .4s linear, height .4s linear;
  -moz-transition: width .4s linear, height .4s linear;
  -ms-transition: width .4s linear, height .4s linear;
  -o-transition: width .4s linear, height .4s linear;
  transition: width .4s linear, height .4s linear;
}
#slide1 .bracket .left {
  position: absolute;
  left: 0;
  top: 0;
  width: 1.9em;
  height: 5.9em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide1 .bracket .text {
  position: absolute;
  display: block;
  left: 1.9em;
  top: 0;
  width: 2.3em;
  height: 5.9em;
  font-family: "Myriad Pro";
  font-weight: normal;
  line-height: 1.4em;
  opacity: 0;
  -webkit-transition: opacity .4s linear, width .4s linear, height .4s linear;
  -moz-transition: opacity .4s linear, width .4s linear, height .4s linear;
  -ms-transition: opacity .4s linear, width .4s linear, height .4s linear;
  -o-transition: opacity .4s linear, width .4s linear, height .4s linear;
  transition: opacity .4s linear, width .4s linear, height .4s linear;
  text-align: left;
  overflow: hidden;
  z-index: 1;
}
#slide1 .bracket.selected .text {
  opacity: 1;
}
#slide1 .bracket .text span {
  font-size: 1.4em;
}
#slide1 .bracket .arrow {
  position: absolute;
  left: 1.9em;
  top: 0;
  width: 2.3em;
  height: 5.9em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  opacity: 1;
  -webkit-transition: opacity .4s linear;
  -moz-transition: opacity .4s linear;
  -ms-transition: opacity .4s linear;
  -o-transition: opacity .4s linear;
  transition: opacity .4s linear;
  z-index: 2;
}
#slide1 .bracket.selected .arrow {
  opacity: 0;
  z-index: 0;
}
#slide1 .bracket .right {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 1.9em;
  height: 5.9em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  -webkit-transition: left .4s linear;
  -moz-transition: left .4s linear;
  -ms-transition: left .4s linear;
  -o-transition: left .4s linear;
  transition: left .4s linear;
}





#slide1 .white-bracket {
  position: absolute;
  left: 1.7em;
  top: 16em;
}
#slide1 .white-bracket.selected {
  width: 24.1em; /* 20.3+3.8 */
  height: 31.6em;
}
#slide1 .white-bracket .left {
  background-image: url(images/s1_skob_white.png);
}
#slide1 .white-bracket .arrow {
  background-image: url(images/s1_arrow_white.png);
}
#slide1 .white-bracket.selected .text {
  width: 20.3em;
  height: 31.6em;
}
#slide1 .white-bracket .text > div {
  display: inline-block;
  width: 20.3em;
  height: 31.6em;
  padding-top: 0.7em;
}
#slide1 .white-bracket .right {
  background-image: url(images/s1_skob_white.png);
}
/* ******************************************************************************** */
#slide1 .gray-bracket {
  position: absolute;
  left: 1.7em;
  top: 16em;
  -webkit-transition: top .4s linear, width .4s linear, height .4s linear;
  -moz-transition: top .4s linear, width .4s linear, height .4s linear;
  -ms-transition: top .4s linear, width .4s linear, height .4s linear;
  -o-transition: top .4s linear, width .4s linear, height .4s linear;
  transition: top .4s linear, width .4s linear, height .4s linear;
}
#slide1 .gray-bracket.selected {
  width: 27.3em; /* 20.3+3.8 */
  height: 29.6em;
}
#slide1 .gray-bracket .left {
  background-image: url(images/s1_skob_gray.png);
}
#slide1 .gray-bracket .arrow {
  background-image: url(images/s1_arrow_gray.png);
}
#slide1 .gray-bracket.selected .text {
  width: 23.5em;
  height: 29.6em;
}
#slide1 .gray-bracket .text > div {
  display: inline-block;
  width: 23.5em;
  height: 29.6em;
  padding-top: 0.7em;
}
#slide1 .gray-bracket .right {
  background-image: url(images/s1_skob_gray.png);
}





/* big-text in brackets */
/*#slide1 .big-text {*/
  /*position: absolute;*/
  /*left: 1.7em;*/
  /*top: 16em;*/
  /*width: 3.8em;*/
  /*height: 5.9em;*/
  /*padding: .8em 0 0 1.9em;*/
  /*font-family: "Myriad Pro";*/
  /*text-align: left;*/
  /*color: #ffffff;*/
  /*line-height: 1.4em;*/
  /*overflow: hidden;*/
  /*cursor: pointer;*/
  /*-webkit-transition: width .3s linear, height .3s linear;*/
  /*-moz-transition: width .3s linear, height .3s linear;*/
  /*-ms-transition: width .3s linear, height .3s linear;*/
  /*-o-transition: width .3s linear, height .3s linear;*/
  /*transition: width .3s linear, height .3s linear;*/
/*}*/

/*#slide1 .big-text:before {*/
  /*position: absolute;*/
  /*left: 0;*/
  /*top:  0;*/
  /*width: 1.9em;*/
  /*height: 5.9em;*/
  /*background-position: 0 0;*/
  /*background-size: 100% 100%;*/
  /*background-repeat: no-repeat;*/
  /*content: " ";*/
/*}*/

/*#slide1 .left-part .big-text:before   { background-image: url(images/s1_left_bracker.png); }*/
/*#slide1 .right-part .big-text:before { background-image: url(images/s1_left_bracker2.png); }*/

/*#slide1 .big-text:after {*/
  /*position: absolute;*/
  /*right: 0;*/
  /*bottom:  0;*/
  /*width: 1.9em;*/
  /*height: 5.9em;*/
  /*background-position: 0 0;*/
  /*background-size: 100% 100%;*/
  /*background-repeat: no-repeat;*/
  /*content: " ";*/
/*}*/
/*#slide1 .left-part .big-text:after   { background-image: url(images/s1_right_bracker.png); }*/
/*#slide1 .right-part .big-text:after { background-image: url(images/s1_right_bracker2.png); }*/

/*#slide1 .big-text > div {*/
  /*opacity: 0;*/
  /*width: 20.3em;*/
  /*height: 29.2em;*/
  /*-webkit-transition: opacity .3s linear;*/
  /*-moz-transition: opacity .3s linear;*/
  /*-ms-transition: opacity .3s linear;*/
  /*-o-transition: opacity .3s linear;*/
  /*transition: opacity .3s linear;*/
/*}*/

#slide1 .pic-name {
  display: block;
  cursor: pointer;
}

/*#slide1 .pic-name:hover {*/
  /*text-decoration: underline;*/
/*}*/

/*#slide1 .big-text > div > span,*/
/*#slide1 .pic-name > span {*/
  /*font-size: 1.4em;*/
/*}*/

/* animations */
#slide1.show-right-part .center-part {
  left: 9em;
}
#slide1:not(.show-right-part) .left-part .small-photo-info,
#slide1.show-right-part .right-part .small-photo-info {
  opacity: 1;
}
#slide1.show-right-part .right-part {
  left: 50.2em;
}
/*#slide1 .left-part .small-photo {*/
  /*background-image: url(images/s1_small_photo.png);*/
/*}*/
#slide1.show-right-part .right-part .small-photo {
  left: 4em;
}

/*#slide1.open-left-text .left-part .big-text,*/
/*#slide1.open-right-text .right-part .big-text {*/
  /*width: 23.0em;*/
  /*height: 29.2em;*/
/*}*/
/*#slide1.open-left-text .left-part .big-text div,*/
/*#slide1.open-right-text .right-part .big-text div {*/
  /*opacity: 1;*/
/*}*/

/********************************************************************************
 * slide 2
 ********************************************************************************/
#slide2 header {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3.9em;
  font-family: "HeliosCondLight";
  font-weight: normal;
  background-image: url(images/s2_header_back.png);
  background-repeat: repeat-x;
  background-position: 0 0;
  background-size: 1px 3.9em;
  text-align: center;
  line-height: 3.9em;
  color: #2f2f2f;
  z-index: 10;
  padding-right: 28em;
}

#slide2 header > span {
  font-size: 3.2em;
  vertical-align: middle;
}

#slide2 .text-block {
  position: absolute;
  /*display: none;*/
  /*left: 3.1em;*/
  left: 1.1em;
  top: 10.6em;
  /*width: 45.7em;*/
  width: 43.7em;
  height: 41em;
  background-image: url(images/s2_text_back.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  border: 1px solid #82a503;
  padding: 1em 1.7em;
  opacity: 0;
  overflow: hidden;
  cursor: default;
  -webkit-transition: opacity .4s linear, left .4s linear, top .4s linear, width .4s linear, height .4s linear;
  -moz-transition: opacity .4s linear, left .4s linear, top .4s linear, width .4s linear, height .4s linear;
  -ms-transition: opacity .4s linear, left .4s linear, top .4s linear, width .4s linear, height .4s linear;
  -o-transition: opacity .4s linear, left .4s linear, top .4s linear, width .4s linear, height .4s linear;
  transition: opacity .4s linear, left .4s linear, top .4s linear, width .4s linear, height .4s linear;
  -webkit-transform: rotateZ(0);
  -moz-transform: rotateZ(0);
  -ms-transform: rotateZ(0);
  -o-transform: rotateZ(0);
  transform: rotateZ(0);
  z-index: 2000000000;
}

#slide2 .text-block .title {
  font-family: "Myriad Pro";
  font-weight: bold;
  text-align: left;
  color: #b7b7b7;
}

#slide2 .text-block .title > span {
  font-size: 3em;
  color: rgb(152,179,50);
}

#slide2 .text-block .text {
  font-family: "Myriad Pro";
  font-weight: normal;
  text-align: left;
  color: #b7b7b7;
  margin: 1em 0;
}

#slide2 .text-block .text > span {
  font-size: 1.6em;
}

#slide2 .image-line {
  position: absolute;
  left: 52.2em;
  top: 0;
  width: 17.3em;
  height: 100%;
  /*overflow: hidden;*/
  z-index: 1;
  -webkit-transform: rotateZ(0);
  -moz-transform: rotateZ(0);
  -ms-transform: rotateZ(0);
  -o-transform: rotateZ(0);
  transform: rotateZ(0);
}

#slide2 .image-line.anim {
  -webkit-transition: top .5s linear;
  -moz-transition: top .5s linear;
  -ms-transition: top .5s linear;
  -o-transition: top .5s linear;
  transition: top .5s linear;
}

#slide2 .image-line .image {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 17.3em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-shadow: 0 0 0 2px #787878 inset;

  -webkit-transition: -webkit-transform 1s;
  -webkit-backface-visibility: hidden;
}

#slide2 .image-line .image.active {
  box-shadow: 0 0 0 1px #a2ca04 inset, 0 0 0 2px #787878 inset;
}

#slide2 .words-layer {
  position: absolute;
  left: 0;
  top: 0;
}

#slide2 .words-layer .word {
  position: absolute;
  height: 3.3em;
  font-family: "Myriad Pro";
  font-weight: normal;
  color: #b7b7b7;
  cursor: pointer;
  text-align: center;
  line-height: 3.3em;
}

#slide2 .words-layer .word > span {
  display: inline-block;
  font-size: 2.8em;
  vertical-align: middle;
  -webkit-transition: all .4s linear;
  -moz-transition: all .4 linear;
  -ms-transition: all .4 linear;
  -o-transition: all .4 linear;
  transition: all .4 linear;
}

#slide2 .words-layer .word.selected > span {
  color: #ffffff;
  -webkit-transform: scale(1.357);
  -moz-transform: scale(1.357);
  -ms-transform: scale(1.357);
  -o-transform: scale(1.357);
  transform: scale(1.357);
  text-shadow: 0 0 1.2em #c4f946;
  font-weight: bold;
}

/*#slide2 .image-line .image.active {*/
  /*-webkit-transform: matrix3d(0.882947592858927, 0, 0.4694715627858908, -0.0005868394534823636, 0, 1.06, 0, 0, -0.4694715627858908, 0, 0.882947592858927, -0.0011036844910736587, -11.372365097068313, 0, -6.04679378240903, 1.0075584922280112);*/
  /*-moz-transform: matrix3d(0.882947592858927, 0, 0.4694715627858908, -0.0005868394534823636, 0, 1.06, 0, 0, -0.4694715627858908, 0, 0.882947592858927, -0.0011036844910736587, -11.372365097068313, 0, -6.04679378240903, 1.0075584922280112);*/
  /*-ms-transform: matrix3d(0.882947592858927, 0, 0.4694715627858908, -0.0005868394534823636, 0, 1.06, 0, 0, -0.4694715627858908, 0, 0.882947592858927, -0.0011036844910736587, -11.372365097068313, 0, -6.04679378240903, 1.0075584922280112);*/
  /*-o-transform: matrix3d(0.882947592858927, 0, 0.4694715627858908, -0.0005868394534823636, 0, 1.06, 0, 0, -0.4694715627858908, 0, 0.882947592858927, -0.0011036844910736587, -11.372365097068313, 0, -6.04679378240903, 1.0075584922280112);*/
  /*transform: matrix3d(0.882947592858927, 0, 0.4694715627858908, -0.0005868394534823636, 0, 1.06, 0, 0, -0.4694715627858908, 0, 0.882947592858927, -0.0011036844910736587, -11.372365097068313, 0, -6.04679378240903, 1.0075584922280112);*/
  /*transform: perspective(800) rotateY(-28deg) translate(-1.6em,0) scaleY(1.06);*/
  /*z-index: 10;*/
/*}*/

/*#slide2 .image-line .image.active:after,*/
/*#slide2 .image-line .image.waitActive:after {*/
  /*position: absolute;*/
  /*left: 100%;*/
  /*top: 0;*/
  /*width: 5em;*/
  /*height: 100%;*/
  /*background-color: #787878;*/
  /*content: " ";*/
  /*-webkit-transform: perspective(800) rotateY(62deg) translateX(-2.8em) scaleY(0.95);*/
  /*-moz-transform: perspective(800) rotateY(62deg) translateX(-2.8em) scaleY(0.95);*/
  /*-ms-transform: perspective(800) rotateY(62deg) translateX(-2.8em) scaleY(0.95);*/
  /*-o-transform: perspective(800) rotateY(62deg) translateX(-2.8em) scaleY(0.95);*/
  /*transform: perspective(800) rotateY(62deg) translateX(-2.8em) scaleY(0.95);*/
/*}*/

#slide2 .box {
  position: absolute;
  left: 50em;
  top: 19em;
  width: 22em;
  height: 22em;
  z-index: 10;
}
#slide2 .box > * {
  position: absolute;
  left: 0;
  top: 0;
  width: 22em;
  height: 22em;
  border: .8em solid #b7de4d;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
}
#slide2 .box {
  -webkit-transform: rotateZ(0);
  -moz-transform: rotateZ(0);
  -ms-transform: rotateZ(0);
  -o-transform: rotateZ(0);
  transform: rotateZ(0);
  -webkit-perspective: 600px;
  -moz-perspective: 600px;
  -ms-perspective: 600px;
  -o-perspective: 600px;
  perspective: 600px;
}

#slide2 .box > div {
  display: none;
  background-color: #101010;
  background-size: cover;
  background-repeat: no-repeat;
}

#slide2 .box .side1 {
  display: block;
  background-image: url(images/s2/2.png);
  -webkit-transform: rotateY(-27deg) translateX(-11em) rotateY(-90deg);
  -moz-transform: rotateY(-27deg) translateX(-11em) rotateY(-90deg);
  -ms-transform: rotateY(-27deg) translateX(-11em) rotateY(-90deg);
  -o-transform: rotateY(-27deg) translateX(-11em) rotateY(-90deg);
  transform: rotateY(-27deg) translateX(-11em) rotateY(-90deg);
  -webkit-backface-visibility: none;
  z-index: 2;
}
#slide2 .box .side2 {
  display: block;
  background-image: url(images/s2/2.png);
  -webkit-transform: rotateY(-27deg) translateZ(11em);
  -moz-transform: rotateY(-27deg) translateZ(11em);
  -ms-transform: rotateY(-27deg) translateZ(11em);
  -o-transform: rotateY(-27deg) translateZ(11em);
  transform: rotateY(-27deg) translateZ(11em);
  z-index: 3;
}
#slide2 .box .side3 {
  display: block;
  background-image: url(images/s2/2.png);
  -webkit-transform: rotateY(-27deg) translateX(11em) rotateY(90deg);
  -moz-transform: rotateY(-27deg) translateX(11em) rotateY(90deg);
  -ms-transform: rotateY(-27deg) translateX(11em) rotateY(90deg);
  -o-transform: rotateY(-27deg) translateX(11em) rotateY(90deg);
  transform: rotateY(-27deg) translateX(11em) rotateY(90deg);
  z-index: 4;
}
#slide2 .box .side4 {
  display: block;
  background-image: url(images/s2/2.png);
  -webkit-transform: rotateY(-27deg) translateZ(-11em) rotateY(180deg);
  -moz-transform: rotateY(-27deg) translateZ(-11em) rotateY(180deg);
  -ms-transform: rotateY(-27deg) translateZ(-11em) rotateY(180deg);
  -o-transform: rotateY(-27deg) translateZ(-11em) rotateY(180deg);
  transform: rotateY(-27deg) translateZ(-11em) rotateY(180deg);
  z-index: 1;
}
/********************************************************************************
 * slide 3
 ********************************************************************************/
#slide3 .notify {
  position: absolute;
  left: -9.5em;
  top: 29em;
  width: 32em;
  color: rgba(255,255,255,.54);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
#slide3 .notify span {
  font-family: "Myriad Pro";
  font-size: 1.8em;
}

/********************************************************************************
 * title
 ********************************************************************************/
#slide3 header {
  display: block;
  width: 100%;
  height: 4.6em;
  font-family: "HeliosCondLight";
  font-weight: normal;
  text-align: center;
  line-height: 4.6em;
  color: white;
}
#slide3 header span {
  font-size: 2.8em;
}

/********************************************************************************
 * content
 ********************************************************************************/
#slide3 .center-box {
  position: relative;
  display: inline-block;
  margin: 0 auto;
  width: 62em;
  height: 52.4em;
  background-color: rgba(0,0,0,.72);
}

#slide3 .image-item {
  position: absolute;
  cursor: pointer;
}
#slide3 .image-item .cover {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
#slide3 .image-item .picture {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide3 .image-item .picture span  {
  position: absolute;
  display: block;
  bottom: .1em;
  left: .1em;
  color: #c7c8c8;
  font-family: "HeliosUltraCompressed";
  font-size: 4.6em;
  line-height: 1em;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
#slide3 .image-item .cover span {
  position: absolute;
  display: inline-block;
  top: 50%;
  left: 0;
  right: 0;
  margin-top: -.5em;
  text-align: center;
  color: #c7c8c8;
  font-family: "HeliosUltraCompressed";
  font-size: 6em;
  line-height: 1em;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
#slide3 .image-item.item1 {
  left: 1em;
  top: .7em;
  width: 16.4em;
  height: 15.0em;
}
#slide3 .image-item.item1 .picture {
  background-image: url(images/small01.png);
}
#slide3 .image-item.item1 .cover {
  background-color: #655063;
}
#slide3 .image-item.item2 {
  left: 1em;
  top: 16em;
  width: 16.3em;
  height: 14.7em;
}
#slide3 .image-item.item2 .picture {
  background-image: url(images/small02.png);
}
#slide3 .image-item.item2 .cover {
  background-color: #c2949d;
}
#slide3 .image-item.item3 {
  left: 17.7em;
  top: .7em;
  width: 13.9em;
  height: 16.7em;
}
#slide3 .image-item.item3 .picture {
  background-image: url(images/small03.png);
}
#slide3 .image-item.item3 .cover {
  background-color: #b9565b;
}
#slide3 .image-item.item4 {
  left: 17.7em;
  top: 17.8em;
  width: 13.9em;
  height: 12.9em;
}
#slide3 .image-item.item4 .picture {
  background-image: url(images/small04.png);
}
#slide3 .image-item.item4 .cover {
  background-color: #b67172;
}
#slide3 .image-item.item5 {
  left: 1em;
  top: 31.1em;
  width: 15.8em;
  height: 10.4em;
}
#slide3 .image-item.item5 .picture {
  background-image: url(images/small05.png);
}
#slide3 .image-item.item5 .cover {
  background-color: #b81701;
}
#slide3 .image-item.item6 {
  left: 1em;
  top: 42.0em;
  width: 15.8em;
  height: 9.4em;
}
#slide3 .image-item.item6 .picture {
  background-image: url(images/small06.png);
}
#slide3 .image-item.item6 .cover {
  background-color: #bc5b14;
}
#slide3 .image-item.item7 {
  left: 17.1em;
  top: 31.1em;
  width: 14.5em;
  height: 10.2em;
}
#slide3 .image-item.item7 .picture {
  background-image: url(images/small07.png);
}
#slide3 .image-item.item7 .cover {
  background-color: #7d1f12;
}
#slide3 .image-item.item8 {
  left: 17.2em;
  top: 41.7em;
  width: 14.4em;
  height: 9.7em;
}
#slide3 .image-item.item8 .picture {
  background-image: url(images/small08.png);
}
#slide3 .image-item.item8 .cover {
  background-color: #9a643f;
}
#slide3 .image-item.item9 {
  left: 31.9em;
  top: .7em;
  width: 15.0em;
  height: 9.2em;
}
#slide3 .image-item.item9 .picture {
  background-image: url(images/small09.png);
}
#slide3 .image-item.item9 .cover {
  background-color: #4c853f;
}
#slide3 .image-item.item10 {
  left: 31.9em;
  top: 10.3em;
  width: 15.0em;
  height: 9.2em;
}
#slide3 .image-item.item10 .picture {
  background-image: url(images/small10.png);
}
#slide3 .image-item.item10 .cover {
  background-color: #285817;
}
#slide3 .image-item.item11 {
  left: 31.9em;
  top: 19.7em;
  width: 15.0em;
  height: 9.1em;
}
#slide3 .image-item.item11 .picture {
  background-image: url(images/small11.png);
}
#slide3 .image-item.item11 .cover {
  background-color: #2e4a15;
}
#slide3 .image-item.item12 {
  left: 47.3em;
  top: .7em;
  width: 13.7em;
  height: 9.6em;
}
#slide3 .image-item.item12 .picture {
  background-image: url(images/small12.png);
}
#slide3 .image-item.item12 .cover {
  background-color: #72832f;
}
#slide3 .image-item.item13 {
  left: 47.2em;
  top: 10.5em;
  width: 13.8em;
  height: 9.0em;
}
#slide3 .image-item.item13 .picture {
  background-image: url(images/small13.png);
}
#slide3 .image-item.item13 .cover {
  background-color: #b69c24;
}
#slide3 .image-item.item14 {
  left: 47.2em;
  top: 19.9em;
  width: 13.8em;
  height: 9.0em;
}
#slide3 .image-item.item14 .picture {
  background-image: url(images/small14.png);
}
#slide3 .image-item.item14 .cover {
  background-color: #e2b323;
}
#slide3 .image-item.item15 {
  left: 31.9em;
  top: 29.0em;
  width: 8.0em;
  height: 15.4em;
}
#slide3 .image-item.item15 .picture {
  background-image: url(images/small15.png);
}
#slide3 .image-item.item15 .cover {
  background-color: #e7c218;
}
#slide3 .image-item.item16 {
  left: 40.2em;
  top: 29.0em;
  width: 7.1em;
  height: 15.4em;
}
#slide3 .image-item.item16 .picture {
  background-image: url(images/small16.png);
}
#slide3 .image-item.item16 .cover {
  background-color: #0f3c51;
}
#slide3 .image-item.item17 {
  left: 31.9em;
  top: 44.7em;
  width: 15.4em;
  height: 6.7em;
}
#slide3 .image-item.item17 .picture {
  background-image: url(images/small17.png);
}
#slide3 .image-item.item17 .cover {
  background-color: #527383;
}
#slide3 .image-item.item18 {
  left: 47.5em;
  top: 29.0em;
  width: 13.5em;
  height: 7.6em;
}
#slide3 .image-item.item18 .picture {
  display: block;
  background-image: url(images/small18.png);
  -webkit-transform: none !important;
  -moz-transform: none !important;
  -ms-transform: none !important;
  -o-transform: none !important;
  transform: none !important;
}
#slide3 .image-item.item18 .cover {
  display: none;
  background-color: #655063;
}
#slide3 .image-item.item19 {
  left: 47.5em;
  top: 36.9em;
  width: 13.5em;
  height: 7.2em;
}
#slide3 .image-item.item19 .picture {
  background-image: url(images/small19.png);
}
#slide3 .image-item.item19 .cover {
  background-color: #285c84;
}
#slide3 .image-item.item20 {
  left: 47.5em;
  top: 44.4em;
  width: 13.5em;
  height: 7.0em;
}
#slide3 .image-item.item20 .picture {
  background-image: url(images/small20.png);
}
#slide3 .image-item.item20 .cover {
  background-color: #2c71ac;
}

#slide3 .image-item.item15 .cover span,
#slide3 .image-item.item16 .cover span {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
}


#slide3 .image-item .cover {
  -webkit-transition: left .25s linear, width .25s linear, -webkit-transform .25s linear;
  -moz-transition: left .25s linear, width .25s linear, -moz-transform .25s linear;
  -ms-transition: left .25s linear, width .25s linear, -ms-transform .25s linear;
  -o-transition: left .25s linear, width .25s linear, -o-transform .25s linear;
  transition: left .25s linear, width .25s linear, transform .25s linear;
}
#slide3 .image-item .picture {
  -webkit-transition: left .25s linear, width .25s linear, -webkit-transform .25s linear;
  -moz-transition: left .25s linear, width .25s linear, -moz-transform .25s linear;
  -ms-transition: left .25s linear, width .25s linear, -ms-transform .25s linear;
  -o-transition: left .25s linear, width .25s linear, -o-transform .25s linear;
  transition: left .25s linear, width .25s linear, transform .25s linear;
  overflow: hidden;
}

#slide3 .image-item .cover.hide {
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  transform: scaleX(0);
  /*left: 50%;*/
  /*width: 0;*/
}
#slide3 .image-item .picture {
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  transform: scaleX(0);
  /*left: 50%;*/
  /*width: 0;*/
}
#slide3 .image-item .picture.show {
  display: block;
  -webkit-transform: scaleX(1);
  -moz-transform: scaleX(1);
  -ms-transform: scaleX(1);
  -o-transform: scaleX(1);
  transform: scaleX(1);
  /*left: 0;*/
  /*width: 100%;*/
}

/********************************************************************************
 * preview image
 ********************************************************************************/
#slide3 .preview {
  position: absolute;
  left: 0;
  top: 0;
  /*left: 10.3em;*/
  /*top: 5.3em;*/
  width: 41.5em;
  height: 41.7em;
  background-color: rgba(0,0,0,.9);
  box-shadow: -1px -1px 2px rgba(255,255,255,0.4), 0 0 0 7px rgba(0,0,0,.7) inset;
  z-index: 10;
  pointer-events: none;
  -webkit-transition: left .5s linear, top .5s linear, width .5s linear, height .5s linear, -webkit-transform .5s linear, opacity .5s linear;
  -moz-transition: left .5s linear, top .5s linear, width .5s linear, height .5s linear, -moz-transform .5s linear, opacity .5s linear;
  -ms-transition: left .5s linear, top .5s linear, width .5s linear, height .5s linear, -ms-transform .5s linear, opacity .5s linear;
  -o-transition: left .5s linear, top .5s linear, width .5s linear, height .5s linear, -o-transform .5s linear, opacity .5s linear;
  transition: left .5s linear, top .5s linear, width .5s linear, height .5s linear, transform .5s linear, opacity .5s linear;
  overflow: hidden;
}
#slide3 .preview .image {
  margin: 2em 2em;
  width: 37.5em;
  height: 31.9em;
  /*background-image: url("images/picture01.png");*/
  background-size: contain;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
#slide3 .preview .name {
  font-family: "Myriad Pro";
  text-align: center;
  font-weight: bold;
  width: 100%;
  height: 2.4em;
  line-height: 2.4em;
  color: rgba(255,255,255,.69);
}
#slide3 .preview .name span {
  font-size: 2.4em;
}
#slide3 .preview .desc {
  font-family: "Myriad Pro";
  text-align: center;
  width: 100%;
  height: 2.2em;
  line-height: 2.2em;
  color: rgba(255,255,255,.69);
}
#slide3 .preview .desc span {
  font-size: 2.2em;
}

/********************************************************************************
 * slide 4
 ********************************************************************************/
#slide4 .picture {
  position: absolute;
  left: 18.4em;
  top: 4.3em;
  width: 42.5em;
  height: 52.8em;
  background-image: url(images/s4_pic.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 header {
  display: block;
  width: 100%;
  height: 4.3em;
  font-family: "HeliosCondLight";
  font-weight: normal;
  text-align: center;
  line-height: 4.3em;
  /*color: #516168;*/
  color: rgba(255,255,255,.54);
}
#slide4 header span {
  font-size: 2.8em;
}

#slide4 .notify {
  position: absolute;
  left: -10.5em;
  top: 29em;
  width: 48em;
  /*color: #4e1010;*/
  color: rgba(255,255,255,.54);
  -webkit-transform: rotate(-90deg) rotateZ(0);
  -moz-transform: rotate(-90deg) rotateZ(0);
  -ms-transform: rotate(-90deg) rotateZ(0);
  -o-transform: rotate(-90deg) rotateZ(0);
  transform: rotate(-90deg) rotateZ(0);
}
#slide4 .notify span {
  display: block;
}
#slide4 .notify .line1 {
  font-family: "HeliosCondBlack";
  font-size: 2.2em;
}
#slide4 .notify .line2 {
  font-family: "HeliosCondLight", "HeliosCondThin";
  font-size: 2.2em;
}
#slide4 .notify .line3 {
  font-family: "Myriad Pro";
  font-size: 1.7em;
}

#slide4 .i-item {
  position: absolute;
  opacity: 0;
  -webkit-transition: opacity .5s linear;
  -moz-transition: opacity .5s linear;
  -ms-transition: opacity .5s linear;
  -o-transition: opacity .5s linear;
  transition: opacity .5s linear;
}

#slide4 .i-item.show {
  opacity: 1;
}

#slide4 .i-item .desc {
  position: absolute;
  left: 0;
  top: 0;
  color: #4a5966;
  font-family: "Myriad Pro";
  font-weight: bold;
  text-align: left;
}

#slide4 .i-item .desc span {
  line-height: 1em;
  font-size: 1.5em;
}

#slide4 .i-item1 {
  left: 22.4em;
  top: 44.0em;
  width: 10em;
  height: 11.5em;
  background-image: url(images/s4_book.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide4 .i-item1 .desc {
  left: -.5em;
  top: -4.4em;
}
#slide4 .i-item2 .desc {
  left: 2.3em;
  top: 9.8em;
}
#slide4 .i-item3 .desc {
  left: 8.4em;
  top: 3.6em;
}
#slide4 .i-item4 .desc {
  left: 1.4em;
  top: 1.9em;
}
#slide4 .i-item5 .desc {
  left: -1.8em;
  top: 5.8em;
}
#slide4 .i-item6 .desc {
  left: 12.1em;
  top: 6.0em;
}
#slide4 .i-item7 .desc {
  left: 13.0em;
  top: 3.6em;
}
#slide4 .i-item2 {
  left: 32.0em;
  top: 36.9em;
  width: 8.9em;
  height: 9.5em;
  background-image: url(images/s4_teapot.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide4 .i-item3 {
  left: 28.3em;
  top: 3.5em;
  width: 10.6em;
  height: 15.4em;
  background-image: url(images/s4_trees.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide4 .i-item4 {
  left: 4.3em;
  top: 28.1em;
  width: 34.9em;
  height: 5.6em;
  -webkit-transform: rotateZ(0);
  -moz-transform: rotateZ(0);
  -ms-transform: rotateZ(0);
  -o-transform: rotateZ(0);
  transform: rotateZ(0);
  overflow: hidden;
}
#slide4 .i-item4 .pic-cover {
  position: absolute;
  left: 9.5em;
  top: -.1em;
  width: 18.4em;
  height: 5.8em;
  background-image: url(images/s4_pic_cover.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
}
#slide4 .i-item4 .car {
  position: absolute;
  left: -11.0em;
  top: 1.3em;
  width: 10.7em;
  height: 3.2em;
  background-image: url(images/s4_car.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transform: rotateZ(0);
  transform: rotateZ(0);
}
#slide4 .i-item4.show .car,
#slide4.over .i-item4 .car {
  left: 35.7em;
  -webkit-transition: left 3s linear;
  -moz-transition: left 3s linear;
  -ms-transition: left 3s linear;
  -o-transition: left 3s linear;
  transition: left 3s linear;
}
#slide4 .i-item4 .desc {
  width: 0;
  overflow: hidden;
  white-space: nowrap;
  color: #ffffff;
}
#slide4 .i-item4.show .desc,
#slide4.over .i-item4 .desc {
  width: 15em;
  -webkit-transition: width 1s linear .8s;
  -moz-transition: width 1s linear .8s;
  -ms-transition: width 1s linear .8s;
  -o-transition: width 1s linear .8s;
  transition: width 1s linear .8s;
}

#slide4 .i-item5 {
  left: 0.0em;
  top: 38.2em;
  width: 12.6em;
  height: 16.7em;
  background-image: url(images/s4_fashion.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide4 .i-item6 {
  left: 22.4em;
  top: 18.9em;
  width: 6.4em;
  height: 10.9em;
  background-image: url(images/s4_mask.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide4 .i-item7 {
  left: 4.6em;
  top: 7.4em;
  width: 10.7em;
  height: 8.1em;
  background-image: url(images/s4_palitra.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/********************************************************************************
 * slide 5
 ********************************************************************************/
#slide5 header {
  display: block;
  width: 100%;
  height: 3.9em;
  font-family: "HeliosCondLight";
  font-weight: normal;
  text-align: center;
  line-height: 3.9em;
  color: rgba(255,255,255,0.77);
}
#slide5 header span {
  font-size: 3.2em;
}
/* ******************************************************************************** */
#slide5 .top-part {
  position: relative;
  width: 100%;
  height: 48.3em;
  /*background-image: url(images/s5_gray_back.png);*/
  /*background-position: 0 0;*/
  /*background-size: 100% 100%;*/
  /*background-repeat: no-repeat;*/
}
#slide5 .top-part .text-block {
  position: relative;
  width: 100%;
  height: 7.7em;
  z-index: 30;
}
#slide5 .top-part .map-block {
  position: relative;
  width: 100%;
  height: 40.6em;
  background-image: url(images/s5_map.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide5 .top-part .map-block svg {
  position: absolute;
  left: 0;
  top: -3.3em;
  width: 100%;
  height: 43.9em;
}
/* ******************************************************************************** */
#slide5 .map-block .city-place {
  position: absolute;
  box-shadow: .3em .3em .4em 0 rgba(0,0,0,.3) inset;
  background-color: rgba(47,47,47,0.79);
}
#slide5 .map-block .city-name {
  position: absolute;
  font-family: "Myriad Pro";
  font-weight: bold;
  text-shadow: .3em .3em .3em rgba(0,0,0,.75);
  color: #e3e3e3;
}
#slide5 .map-block .city-name.city1 {
  left: 22.1em;
  top: -.7em;
}
#slide5 .map-block .city-name.city2 {
  left: 39.0em;
  top: -3em;
}
#slide5 .map-block .city-name.city3 {
  left: 46.5em;
  top: -2em;
}
#slide5 .map-block .city-name.city4 {
  left: 54.3em;
  top: .4em;
}
#slide5 .map-block .city-name.city5 {
  left: 56.4em;
  top: 2.5em;
}
#slide5 .map-block .city-name.city6 {
  left: 47.1em;
  top: 4.3em;
}
#slide5 .map-block .city-name.city7 {
  left: 62.1em;
  top: 6.9em;
}
#slide5 .map-block .city-name.city8 {
  left: 52.1em;
  top: 13.1em;
}
#slide5 .map-block .city-name.city9 {
  left: 42.2em;
  top: 17.8em;
}
#slide5 .map-block .city-name.city10 {
  left: 36.4em;
  top: 22.2em;
}
#slide5 .map-block .city-name.city11 {
  left: 21.8em;
  top: 23.5em;
}
#slide5 .map-block .city-name.city12 {
  left: 40.9em;
  top: 27.5em;
}
#slide5 .map-block .city-name.city13 {
  left: 39.2em;
  top: 32.7em;
}
#slide5 .map-block .city-name.city14 {
  left: 36.0em;
  top: 36.0em;
}
#slide5 .map-block .city-name.city15 {
  left: 25.1em;
  top: 34.6em;
}
#slide5 .map-block .city-name.city16 {
  left: 16.8em;
  top: 28.4em;
}
#slide5 .map-block .city-name.city17 {
  left: 15.3em;
  top: 20.9em;
}
#slide5 .map-block .city-name.city18 {
  left: 10.8em;
  top: 37.1em;
}
#slide5 .map-block .city-name.city19 {
  left: 2.2em;
  top: 32.9em;
}
#slide5 .map-block .city-place.city1 {
  left: 11.0em;
  top: 15.1em;
  width: 3.9em;
  height: 3.9em;
}
#slide5 .map-block .city-place.city2 {
  left: 33.9em;
  top: 10.6em;
  width: 2.2em;
  height: 2.2em;
}
#slide5 .map-block .city-place.city3 {
  left: 36.6em;
  top: 12.0em;
  width: 2.2em;
  height: 2.2em;
}
#slide5 .map-block .city-place.city4 {
  left: 50.2em;
  top: 7.7em;
  width: 1.8em;
  height: 1.8em;
}
#slide5 .map-block .city-place.city5 {
  left: 55.6em;
  top: 7.2em;
  width: 2.5em;
  height: 2.5em;
}
#slide5 .map-block .city-place.city6 {
  left: 45.8em;
  top: 8.8em;
  width: 5.3em;
  height: 5.3em;
}
#slide5 .map-block .city-place.city7 {
  left: 69.6em;
  top: 10.0em;
  width: 2.5em;
  height: 2.5em;
}
#slide5 .map-block .city-place.city8 {
  left: 52.9em;
  top: 11.1em;
  width: 1.8em;
  height: 1.8em;
}
#slide5 .map-block .city-place.city9 {
  left: 47.5em;
  top: 14.4em;
  width: 1.9em;
  height: 1.9em;
}
#slide5 .map-block .city-place.city10 {
  left: 50.2em;
  top: 9.8em;
  width: 2.5em;
  height: 2.5em;
}
#slide5 .map-block .city-place.city11 {
  left: 42.7em;
  top: 4.9em;
  width: 4.6em;
  height: 4.6em;
}
#slide5 .map-block .city-place.city12 {
  left: 51.7em;
  top: 15.1em;
  width: 2.5em;
  height: 2.5em;
}
#slide5 .map-block .city-place.city13 {
  left: 56.8em;
  top: 8.4em;
  width: 2.5em;
  height: 2.5em;
}
#slide5 .map-block .city-place.city14 {
  left: 48.1em;
  top: 15.4em;
  width: 2.2em;
  height: 2.2em;
}
#slide5 .map-block .city-place.city15 {
  left: 42.7em;
  top: 11.6em;
  width: 2.5em;
  height: 2.5em;
}
#slide5 .map-block .city-place.city16 {
  left: 31.9em;
  top: 13.6em;
  width: 3.1em;
  height: 3.1em;
}
#slide5 .map-block .city-place.city17 {
  left: 14.2em;
  top: 18.4em;
  width: 1.7em;
  height: 1.7em;
}
#slide5 .map-block .city-place.city18 {
  left: 30.8em;
  top: 10.2em;
  width: 4.1em;
  height: 4.1em;
}
#slide5 .map-block .city-place.city19 {
  left: 10.6em;
  top: 18.1em;
  width: 2.5em;
  height: 2.5em;
}
/* ******************************************************************************** */
#slide5 .bracket {
  width: 6.1em;
  height: 5.9em;
  -webkit-transition: width .4s linear;
  -moz-transition: width .4s linear;
  -ms-transition: width .4s linear;
  -o-transition: width .4s linear;
  transition: width .4s linear;
}
#slide5 .bracket .left {
  position: absolute;
  left: 0;
  top: 0;
  width: 1.9em;
  height: 5.9em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
#slide5 .bracket .text {
  position: absolute;
  display: block;
  left: 1.9em;
  top: 0;
  width: 2.3em;
  height: 5.9em;
  font-family: "Myriad Pro";
  font-weight: normal;
  opacity: 0;
  -webkit-transition: opacity .4s linear, width .4s linear;
  -moz-transition: opacity .4s linear, width .4s linear;
  -ms-transition: opacity .4s linear, width .4s linear;
  -o-transition: opacity .4s linear, width .4s linear;
  transition: opacity .4s linear, width .4s linear;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
}
#slide5 .bracket.selected .text {
  opacity: 1;
}
#slide5 .bracket .text span {
  font-size: 1.6em;
}
#slide5 .bracket .arrow {
  position: absolute;
  left: 1.9em;
  top: 0;
  width: 2.3em;
  height: 5.9em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  opacity: 1;
  -webkit-transition: opacity .4s linear;
  -moz-transition: opacity .4s linear;
  -ms-transition: opacity .4s linear;
  -o-transition: opacity .4s linear;
  transition: opacity .4s linear;
}
#slide5 .bracket.selected .arrow {
  opacity: 0;
}
#slide5 .bracket .right {
  position: absolute;
  left: 4.2em;
  top: 0;
  width: 1.9em;
  height: 5.9em;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  -webkit-transition: left .4s linear;
  -moz-transition: left .4s linear;
  -ms-transition: left .4s linear;
  -o-transition: left .4s linear;
  transition: left .4s linear;
}

/* ******************************************************************************** */
#slide5 .red-bracket {
  position: absolute;
  left: 2.1em;
  top: .5em;
  cursor: pointer;
  opacity: .6;
}
#slide5 .red-bracket.selected {
  width: 24.1em;
}
#slide5 .red-bracket .left {
  background-image: url(images/s5_skob_red.png);
}
#slide5 .red-bracket .arrow {
  background-image: url(images/s5_arrow_red.png);
}
#slide5 .red-bracket .text {
  color: #d63104;
}
#slide5 .red-bracket.selected .text {
  width: 20.2em;
}
#slide5 .red-bracket .right {
  background-image: url(images/s5_skob_red.png);
}
#slide5 .red-bracket.selected .right {
  left: 22.2em;
}
/* ******************************************************************************** */
#slide5 .white-bracket {
  position: absolute;
  right: 2.1em;
  top: .5em;
  cursor: pointer;
  opacity: .6;
}
#slide5 .white-bracket.selected {
  width: 22.1em;
  opacity: .72;
}
#slide5 .white-bracket .left {
  background-image: url(images/s5_skob_white.png);
}
#slide5 .white-bracket.selected .left {
  background-image: url(images/s5_skob_gray.png);
}
#slide5 .white-bracket .arrow {
  background-image: url(images/s5_arrow_white.png);
}
#slide5 .white-bracket .text {
  color: #2f2f2f;
  padding-top: 0.7em;
}
#slide5 .white-bracket.selected .text {
  width: 18.8em;
}
#slide5 .white-bracket .right {
  background-image: url(images/s5_skob_white.png);
}
#slide5 .white-bracket.selected .right {
  left: 20.2em;
  background-image: url(images/s5_skob_gray.png);
}
/* ******************************************************************************** */
#slide5 .bottom-part {
  width: 100%;
  height: 7.8em;
  /*padding-left: 10em;*/
  padding-left: 12em;
  padding-top: .8em;
  text-align: left;
}
/* ******************************************************************************** */
#slide5 .yellow-bracket {
  position: relative;
  display: inline-block;
  cursor: pointer;
  opacity: .79;
}
#slide5 .yellow-bracket.selected {
  /*width: 24.1em;*/
  width: 33.1em;
}
#slide5 .yellow-bracket .left {
  background-image: url(images/s5_skob_yellow.png);
}
#slide5 .yellow-bracket .arrow {
  background-image: url(images/s5_arrow_yellow.png);
}
#slide5 .yellow-bracket .text {
  color: #d4d213;
}
#slide5 .yellow-bracket.selected .text {
  width: 20.2em;
}
#slide5 .yellow-bracket .right {
  background-image: url(images/s5_skob_yellow.png);
}
#slide5 .yellow-bracket.selected .right {
  left: 22.2em;
}
/* ******************************************************************************** */
#slide5 .green-bracket {
  position: relative;
  display: inline-block;
  cursor: pointer;
  opacity: .95;
}
#slide5 .green-bracket.selected {
  width: 22.7em;
}
#slide5 .green-bracket .left {
  background-image: url(images/s5_skob_green.png);
}
#slide5 .green-bracket .arrow {
  background-image: url(images/s5_arrow_green.png);
}
#slide5 .green-bracket .text {
  color: #97df49;
}
#slide5 .green-bracket.selected .text {
  width: 18.8em;
}
#slide5 .green-bracket .right {
  background-image: url(images/s5_skob_green.png);
}
#slide5 .green-bracket.selected .right {
  left: 20.8em;
}
/* ******************************************************************************** */
#slide5 .top-part .info-block {
  position: absolute;
  display: none;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url(images/s5_info_bg.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-shadow: 0 0 8.1em 0 rgba(0,0,0,.16) inset;
  opacity: 0;
  -webkit-transition: opacity .4s linear;
  -moz-transition: opacity .4s linear;
  -ms-transition: opacity .4s linear;
  -o-transition: opacity .4s linear;
  transition: opacity .4s linear;
}
#slide5 .info-block .cover {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url(images/s5_info_over.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  opacity: .7;
}
#slide5 .info-block .map {
  position: absolute;
  left: 0;
  top: 7.7em;
  width: 100%;
  height: 40.6em;
  background-image: url(images/s5_map_gray.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  opacity: .17;
  box-shadow: 0 0 5.4em 0 rgba(0,0,0,.18) inset;
  font-family: "Myriad Pro";
  font-weight: normal;
  text-align: left;
  color: #2f2f2f;
}
#slide5 .info-block .text {
  position: absolute;
  left: 0;
  top: 7.7em;
  width: 100%;
  height: 40.6em;
  font-family: "Myriad Pro";
  font-weight: normal;
  text-align: left;
  color: #232323;
  line-height: 1.5em;
}
#slide5 .info-block .text span:first-child {
  display: inline-block;
  width: 3.7em;
  padding-left: 1.666em;
}
#slide5 .info-block .text span {
  font-size: 1.8em;
}
/* ******************************************************************************** */
#slide5 .top-part .path-block {
  position: absolute;
  display: none;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url(images/s5_info_bg.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  opacity: 0;
  -webkit-transition: opacity .4s linear;
  -moz-transition: opacity .4s linear;
  -ms-transition: opacity .4s linear;
  -o-transition: opacity .4s linear;
  transition: opacity .4s linear;
}
#slide5 .path-block .map {
  position: absolute;
  left: 0;
  top: 7.7em;
  width: 100%;
  height: 40.6em;
  background-image: url(images/s5_map_gray.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-shadow: 0 0 5.4em 0 rgba(0,0,0,.18) inset;
  font-family: "Myriad Pro";
  font-weight: normal;
  text-align: left;
  color: #2f2f2f;
}
#slide5 .path-block .map-lines {
  position: absolute;
  left: 0;
  top: 7.7em;
  width: 100%;
  height: 40.6em;
  opacity: .5;
}
#slide5 .path-block .city-date {
  position: absolute;
  left: 0;
  top: 7.7em;
  width: 100%;
  height: 40.6em;
}
#slide5 .path-block .city-point {
  position: absolute;
  width: 1em;
  height: 1em;
  border-radius: .5em;
  background-color: #d63104;
  /*cursor: pointer;*/
}
#slide5 .path-block .city-name {
  position: absolute;
  color: #3e3e3b;
  font-family: "Myriad Pro";
  font-weight: normal;
  /*cursor: pointer;*/
}
#slide5 .path-block .city-year {
  position: absolute;
  background-image: url(images/s5_map_years.png);
  background-position: 0 0;
  background-size: 80em 40.6em;
  background-repeat: no-repeat;
  opacity: 0;
}
#slide5 .path-block .city-name span {
  font-size: 1.5em;
}
#slide5 .path-block .city-point.city1 {
  left: 79.4em;
  top: 25.5em;
}
#slide5 .path-block .city-name.city1 {
  left: 74.4em;
  top: 23.8em;
}
#slide5 .path-block .city-point.city2 {
  left: 48.6em;
  top: 10.9em;
}
#slide5 .path-block .city-name.city2 {
  left: 49.6em;
  top: 9.3em;
}
#slide5 .path-block .city-point.city3 {
  left: 11.4em;
  top: 18.7em;
}
#slide5 .path-block .city-name.city3 {
  left: 4.5em;
  top: 18.2em;
}
#slide5 .path-block .city-point.city4 {
  left: 37.5em;
  top: 12.4em;
}
#slide5 .path-block .city-name.city4 {
  left: 36.5em;
  top: 13.0em;
}
#slide5 .path-block .city-point.city5 {
  left: 40.7em;
  top: 11.8em;
}
#slide5 .path-block .city-name.city5 {
  left: 41.9em;
  top: 11.3em;
}
#slide5 .path-block .city-point.city6 {
  left: 45.0em;
  top: 6.5em;
}
#slide5 .path-block .city-name.city6 {
  left: 46.2em;
  top: 5.3em;
}
#slide5 .path-block .city-year.path1 {
  left: 37.7em;
  top: 4.3em;
  width: 8em;
  height: 2.2em;
  background-position: -37.7em -4.3em;
}
#slide5 .path-block .city-year.path2 {
  left: 33.5em;
  top: 8.4em;
  width: 8em;
  height: 2.2em;
  background-position: -33.5em -8.4em;
}
#slide5 .path-block .city-year.path3 {
  left: 22.3em;
  top: 6.4em;
  width: 8em;
  height: 2.2em;
  background-position: -17.3em -7.4em;
}
#slide5 .path-block .city-year.path4 {
  left: 24.4em;
  top: 24.4em;
  width: 8em;
  height: 2.2em;
  background-position: -31.4em -27.4em;
}
#slide5 .path-block .city-year.path5 {
  left: 62.2em;
  top: 24.7em;
  width: 8em;
  height: 2.2em;
  background-position: -62.2em -24.7em;
}

/********************************************************************************
 * slide 6
 ********************************************************************************/
#slide6 header {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3.7em;
  font-family: "HeliosCondLight";
  font-weight: normal;
  background-color: rgba(0,0,0,.21);
  text-align: center;
  line-height: 3.7em;
  color: rgba(255,255,255,0.77);
}

#slide6 header > span {
  font-size: 3.2em;
  vertical-align: middle;
}

#slide6 .thumb-layer {
  position: absolute;
  left: 0;
  top: 0;
}

#slide6 .thumb-layer .small-image {
  position: absolute;
  width: 7.8em;
  height: 5.6em;
  background-image: url(images/s6_small_img_back.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding: .4em 1em 1.2em .8em;
  cursor: pointer;
}

#slide6 .thumb-layer .small-image > div {
  width: 6em;
  height: 4em;
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}

#slide6 .image-view {
  position: absolute;
  display: none;
  left: 0;
  top: 5.6em;
  width: 100%;
  height: 48.8em;
  background-color: rgba(0,0,0,1);
  -webkit-transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  -moz-transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  -ms-transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  -o-transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  padding: 1em;
}

#slide6 .image-view > div {
  position: relative;
  width: 100%;
  height: 100%;
  background-position: 50% 50%;
  background-size: contain;
  background-repeat: no-repeat;
}

#slide6 .image-text {
  position: absolute;
  display: none;
  left: 9.4em;
  top: 55em;
  font-family: "Myriad Pro";
  text-align: left;
  vertical-align: top;
  line-height: 1.6em;
  color: #e3e3e3;
  opacity: 0;
  -webkit-transition: opacity .4s linear;
  -moz-transition: opacity .4s linear;
  -ms-transition: opacity .4s linear;
  -o-transition: opacity .4s linear;
  transition: opacity .4s linear;
}

#slide6 .image-text > span {
  font-size: 1.8em;
}

/********************************************************************************
 * slide 7
 ********************************************************************************/
#slide7 header {
  display: block;
  width: 100%;
  height: 3.9em;
  font-family: "HeliosCondLight";
  font-weight: normal;
  text-align: center;
  line-height: 3.9em;
  color: rgba(255,255,255,0.77);
}
#slide7 header span {
  font-size: 3.2em;
}
#slide7 section {
  position: absolute;
  left: 10.2em;
  top: 4.4em;
  width: 59.6em;
  height: 54em;
  background-color: #000000;
}
#slide7 section .block {
  position: absolute;
  background-image: url(images/s7_box_bg.png);
  background-position: 0 0;
}
#slide7 section .block,
#slide7 section .block > div,
#slide7 section .block .image,
#slide7 section .block4 > div > div {
  -webkit-transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  -moz-transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  -ms-transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  -o-transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
  transition: left .4s linear,top .4s linear,width .4s linear,height .4s linear,opacity .4s linear;
}
#slide7 section .block .name {
  position: absolute;
  left: .8em;
  top: .8em;
  font-family: Arial;
  font-weight: bold;
  text-align: left;
}
#slide7 section .block .image {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: rgba(0,0,0,0.5);
  opacity: 0;
}
#slide7 section .block .name span {
  font-size: 2em;
}
#slide7 section .block2 .name,
#slide7 section .block3 .name {
  left: -2.5em;
  bottom: 4em;
  top: auto;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
/* ******************************************************************************** */
#slide7 section .block1 {
  left: .4em;
  top: .4em;
  width: 25.8em;
  height: 28.9em;
}
#slide7 section .block1 > div {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 17.9em;
  border-bottom: .4em solid #000000;
  background-color: #a9d305;
  padding-top: 6em;
}
#slide7 section .block2 {
  left: 26.6em;
  top: .4em;
  width: 32.6em;
  height: 28.9em;
}
#slide7 section .block2 > div {
  position: absolute;
  right: 0;
  top: 0;
  width: 16.5em;
  height: 100%;
  border-left: .4em solid #000000;
  background-color: #eeb504;
  padding-left: 6em;
}
#slide7 section .block3 {
  left: .4em;
  top: 29.7em;
  width: 13.5em;
  height: 23.9em;
  background-image: none;
  background-color: #e17b0c;
  padding-left: 4em;
}
#slide7 section .block4 {
  left: 14.3em;
  top: 29.7em;
  width: 28.4em;
  height: 23.9em;
}
#slide7 section .block4 > div {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 19.5em;
  border-bottom: .4em solid #000000;
}
#slide7 section .block4 > div > .box {
  position: absolute;
  right: 0;
  top: 0;
  width: 16.5em;
  height: 100%;
  border-left: .4em solid #000000;
  padding-top: 4em;
  background-color: #0c658d;
  color: #c4c5c7;
  z-index: 1;
}
#slide7 section .block4 > div > .line {
  position: absolute;
  left: 0;
  top: 6.3em;
  width: 100%;
  height: .4em;
  background-color: #000000;
  z-index: 0;
}
#slide7 section .block5 {
  left: 43.1em;
  top: 29.7em;
  width: 16.1em;
  height: 23.9em;
}
/* ******************************************************************************** */
#slide7.state1 section .block1 {
  width: 37.8em;
}
#slide7.state1 section .block1 > div {
  height: 24.7em;
}
#slide7.state1 section .block2 {
  left: 38.6em;
  width: 20.6em;
}
/* ******************************************************************************** */
#slide7.state2 section .block1 {
  width: 21em;
}
#slide7.state2 section .block1 > div {
  height: 17.9em;
}
#slide7.state2 section .block2 {
  left: 21.8em;
  width: 37.4em;
}
#slide7.state2 section .block2 > div {
  width: 33em;
}
/* ******************************************************************************** */
#slide7.state3 section .block3 {
  width: 32.5em;
}
#slide7.state3 section .block4 {
  left: 33.3em;
  width: 20.7em;
}
#slide7.state3 section .block4 .box {
  width: 16.1em;
}
#slide7.state3 section .block5 {
  left: 54.5em;
  width: 4.8em;
}
/* ******************************************************************************** */
#slide7.state4 section .block1,
#slide7.state4 section .block2 {
  height: 22.9em;
}
#slide7.state4 section .block3,
#slide7.state4 section .block4,
#slide7.state4 section .block5 {
  top: 23.7em;
  height: 29.9em;
}
#slide7.state4 section .block4 {
  width: 39.7em;
}
#slide7.state4 section .block4 > div {
  height: 25.6em;
}
#slide7.state4 section .block4 .box {
  width: 34.7em;
}
#slide7.state4 section .block4 .line {
  top: 8em;
}
#slide7.state4 section .block5 {
  left: 54.5em;
  width: 4.7em;
}
#slide7.state1 section .block1 .image {
  opacity: 1;
}
#slide7.state2 section .block2 .image {
  opacity: 1;
}
#slide7.state3 section .block3 .image {
  opacity: 1;
}
#slide7.state4 section .block4 .image {
  opacity: 1;
}



/* ** */
.slider_item {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}





#slide8 {
  text-align: left;
  padding: 3em;
  font-family: Tahoma;
  color: #b7b7b7;
}

#slide8 .text {
  font-size: 1.5em;
}

#slide8 a {
  color: #00f;
  text-decoration: underline;
}

#slide8 a:hover {
  text-decoration: underline;
}

#slide8 .logo1 {
  position: absolute;
  left: 36.4em;
  top: 16.6em;
  width: 15em;
  height: 5em;
  background-image: url(images/s8_logo1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}