/********************************************************************************
 * 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: 96em;
  height: 76.8em;
  -webkit-transform: rotateZ(0);
  -moz-transform: rotateZ(0);
  -ms-transform: rotateZ(0);
  -o-transform: rotateZ(0);
  transform: rotateZ(0);
}

.corner-button {
  position: absolute;
  /*display: none !important;*/
  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);
}

#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: rotateX(0);
  -moz-transform: rotateX(0);
  -ms-transform: rotateX(0);
  -o-transform: rotateX(0);
  transform: rotateX(0);
}

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

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

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

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

#slide6 {
  background-color: #333366;
}

#slide7 {
  background-color: #000033;
}

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

.box {
  position: absolute;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/********************************************************************************
 * slide 2
 ********************************************************************************/
#slide2 {
  font-family: Tahoma;
}

#slide2:after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url(images/slide2/back-cover.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  content: "";
  z-index: 0;
}

#slide2 header {
  position: absolute;
  left: 4.4em;
  top: 2.0em;
  width: auto;
  white-space: nowrap;
  height: auto;
  text-align: left;
  line-height: 2.4em;
  z-index: 10;
  color: #000000;
}

#slide2 header > span {
  font-size: 2.4em;
}

#slide2 .big-text {
  left: 15.9em;
  top: 64.7em;
  width: 63.6em;
  height: 12em;
  text-align: left;
  z-index: 10;
}

#slide2 .big-text > span {
  font-size: 1.4em;
}

#slide2 .small-picture {
  left: 81.4em;
  top: 2.2em;
  width: 11.5em;
  height: 16.6em;
  background-image: url(images/slide2/small-ramka.png);
  padding: .6em .5em .5em .5em;
  z-index: 10;
}

#slide2 .small-picture > div {
  position: absolute;
  display: block;
  left: .5em;
  top: .5em;
  width: 10.5em;
  height: 15.5em;
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
  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;
}

#slide2 .small-text {
  left: 69.2em;
  top: 3em;
  width: 11.3em;
  height: auto;
  text-align: left;
  z-index: 10;
}

#slide2 .small-text > span {
  font-size: 1.4em;
}

#slide2 .arrow-left {
  left: 21.3em;
  top: 32.3em;
  width: 2.9em;
  height: 5.2em;
  background-image: url(images/slide2/arrow-left.png);
  cursor: pointer;
  z-index: 400;
}

#slide2 .arrow-right {
  left: 64em;
  top: 32.3em;
  width: 3.0em;
  height: 5.2em;
  background-image: url(images/slide2/arrow-right.png);
  cursor: pointer;
  z-index: 400;
}

#slide2 .hand {
  left: 72.6em;
  top: 8.3em;
  width: 6.2em;
  height: 7.3em;
  background-image: url(images/slide2/hand.png);
  z-index: 10;
}

#slide2 .big-image {
  position: absolute;
  left: 29.6em;
  top: 24.7em;
  width: 29.2em; /*38.9em*/;
  height: 19.7em; /*26.3em;*/
  z-index: 10;
}

#slide2 .big-image > div {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
  -webkit-transition: -webkit-transform .4s linear;
  -moz-transition: -moz-transform .4s linear;
  -ms-transition: -ms-transform .4s linear;
  -o-transition: -o-transform .4s linear;
  transition: transform .4s linear;
  -webkit-transform: scale(1.3);
  -moz-transform: scale(1.3);
  -ms-transform: scale(1.3);
  -o-transform: scale(1.3);
  transform: scale(1.3);
}

#slide2 .big-image > div:after {
  position: absolute;
  left: -0.4em;
  top: -0.4em;
  width: 30.0em; /*39.7em;*/
  height: 20.5em;/*27.1em;*/
  background-image: url(images/slide2/big-ramka.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  content: "";
}

/*#slide2 .big-image > div.left {*/
  /*-webkit-transform: translate(-31.6em,2.7em) perspective(80) skewY(-20deg) rotateY(-8deg) scale(.5);*/
  /*-moz-transform: translate(-31.6em,2.7em) perspective(80) skewY(-20deg) rotateY(-8deg) scale(.5);*/
  /*-ms-transform: translate(-31.6em,2.7em) perspective(80) skewY(-20deg) rotateY(-8deg) scale(.5);*/
  /*-o-transform: translate(-31.6em,2.7em) perspective(80) skewY(-20deg) rotateY(-8deg) scale(.5);*/
  /*transform: translate(-31.6em,2.7em) perspective(80) skewY(-20deg) rotateY(-8deg) scale(.5);*/
/*}*/

/*#slide2 .big-image > div.right {*/
  /*-webkit-transform: translate(32.2em,2.7em) perspective(80) skewY(13deg) rotateY(5deg) scale(.5);*/
  /*-moz-transform: translate(32.2em,2.7em) perspective(80) skewY(13deg) rotateY(5deg) scale(.5);*/
  /*-ms-transform: translate(32.2em,2.7em) perspective(80) skewY(13deg) rotateY(5deg) scale(.5);*/
  /*-o-transform: translate(32.2em,2.7em) perspective(80) skewY(13deg) rotateY(5deg) scale(.5);*/
  /*transform: translate(32.2em,2.7em) perspective(80) skewY(13deg) rotateY(5deg) scale(.5);*/
/*}*/

#slide2 .big-image > div.left {
  -webkit-transform: translate(-316px,27px) perspective(80px) skew(0,-20deg) rotateY(-8deg) scale(.5);
  -moz-transform: translate(-316px,27px) perspective(80px) skew(0,-20deg) rotateY(-8deg) scale(.5);
  -ms-transform: translate(-316px,27px) perspective(80px) skew(0,-20deg) rotateY(-8deg) scale(.5);
  -o-transform: translate(-316px,27px) perspective(80px) skew(0,-20deg) rotateY(-8deg) scale(.5);
  transform: translate(-316px,27px) perspective(80px) skew(0,-20deg) rotateY(-8deg) scale(.5);
}

#slide2 .big-image > div.right {
  -webkit-transform: translate(322px,27px) perspective(80px) skew(0,13deg) rotateY(5deg) scale(.5);
  -moz-transform: translate(322px,27px) perspective(80px) skew(0,13deg) rotateY(5deg) scale(.5);
  -ms-transform: translate(322px,27px) perspective(80px) skew(0,13deg) rotateY(5deg) scale(.5);
  -o-transform: translate(322px,27px) perspective(80px) skew(0,13deg) rotateY(5deg) scale(.5);
  transform: translate(322px,27px) perspective(80px) skew(0,13deg) rotateY(5deg) scale(.5);
}

#slide2 .info-icon {
  left: 23.2em;
  top: 43.0em;
  width: 3.7em;
  height: 3.4em;
  background-image: url(images/slide2/info-icon.png);
  z-index: 400;
  -webkit-transition: opacity .1s linear;
  -moz-transition: opacity .1s linear;
  -ms-transition: opacity .1s linear;
  -o-transition: opacity .1s linear;
  transition: opacity .1s linear;
}

#slide2 .info-arrow {
  left: 19.5em;
  top: 45.7em;
  width: 6.0em;
  height: 16.2em;
  background-image: url(images/slide2/info-arrow.png);
  z-index: 400;
  -webkit-transition: opacity .1s linear;
  -moz-transition: opacity .1s linear;
  -ms-transition: opacity .1s linear;
  -o-transition: opacity .1s linear;
  transition: opacity .1s linear;
}

/********************************************************************************
 * slide 3
 ********************************************************************************/
#slide3 {
  font-family: "Tahoma";
  font-weight: normal;
  -webkit-transform: rotateX(0);
  -moz-transform: rotateX(0);
  -ms-transform: rotateX(0);
  -o-transform: rotateX(0);
  transform: rotateX(0);
}

#slide3 header {
  position: absolute;
  left: 3.9em;
  top: 1.9em;
  width: auto;
  white-space: nowrap;
  height: auto;
  text-align: left;
  line-height: 2.4em;
  z-index: 10;
}

#slide3 header > .text1 {
  font-size: 2.4em;
  color: #000000;
}

#slide3 header > .text2 {
  font-size: 2.4em;
  color: #cc0000;
}

#slide3 .molbert {
  left: 28.3em;
  top: 4.5em;
  width: 65.4em;
  height: 72.3em;
  background-image: url(images/slide3/molbert.png);
}

#slide3 .picture {
  left: 39.6em;
  top: 8.9em;
  width: 41.9em;
  height: 54.6em;
}

#slide3 .picture > div {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: transparent;
  background-position: 50% 50%;
  background-size: contain;
  background-repeat: no-repeat;
  -webkit-transition: opacity .5s linear;
  -moz-transition: opacity .5s linear;
  -ms-transition: opacity .5s linear;
  -o-transition: opacity .5s linear;
  transition: opacity .5s linear;
}

#slide3 .picture-name {
  left: 38.8em;
  top: 64.5em;
  width: 40.0em;
  text-align: center;
  color: #000000;
  line-height: 1.4em;
}

#slide3 .picture-name > span {
  font-size: 1.4em;
}

#slide3 .color-text {
  left: 5.2em;
  top: 9.1em;
  width: 25.2em;
  max-height: 33.8em;
  line-height: 1.4em;
  color: #000000;
  text-align: left;
}

#slide3 .color-text > span {
  font-size: 1.4em;
}

#slide3 .red-arrow {
  left: 83.2em;
  top: 33.9em;
  width: 4.1em;
  height: 4.5em;
  background-image: url(images/slide3/red_arrow.png);
  z-index: 5;
  cursor: pointer;
}

#slide3 .red-arrow2 {
  left: 33.7em;
  top: 33.9em;
  width: 4.1em;
  height: 4.5em;
  background-image: url(images/slide3/red_arrow2.png);
  z-index: 5;
  cursor: pointer;
}

#slide3 .palette {
  left: 7.4em;
  top: 55.7em;
  width: 30.1em;
  height: 16.8em;
  background-image: url(images/slide3/palette.png);
}

#slide3 .pen {
  left: 0;
  top: 0;
  width: 8.4em;
  height: 21.0em;
  background-image: url(images/slide3/pen.png);
  -webkit-transition: left .4s linear,top .4s linear;
  -moz-transition: left .4s linear,top .4s linear;
  -ms-transition: left .4s linear,top .4s linear;
  -o-transition: left .4s linear,top .4s linear;
  transition: left .4s linear,top .4s linear;
}

#slide3.color_red .pen {
  left: 21.7em;
  top: 45.9em;
}

#slide3.color_blue .pen {
  left: 14.2em;
  top: 46.5em;
}

#slide3.color_black .pen {
  left: 4.6em;
  top: 42.2em;
}

#slide3.color_white .pen {
  left: 19.5em;
  top: 39.5em;
}

#slide3.color_green .pen {
  left: 23.9em;
  top: 42.2em;
}

#slide3.color_brown .pen {
  left: 15.2em;
  top: 41.1em;
}

#slide3.color_red header .text2 { color: #cc3838; }
#slide3.color_blue header .text2 { color: #3737cc; }
#slide3.color_black header .text2 { color: #000000; }
#slide3.color_white header .text2 { color: #909090; }
#slide3.color_green header .text2 { color: #1d661d; }
#slide3.color_brown header .text2 { color: #67411c; }

#slide3 .color_place {
  cursor: pointer;
}

#slide3 .color_place.red {
  left: 27.0em;
  top: 65.0em;
  width: 5.5em;
  height: 4em;
  border-radius: 6em/4em;
}

#slide3 .color_place.green {
  left: 30.5em;
  top: 61.6em;
  width: 4.6em;
  height: 3.5em;
  border-radius: 8em/6em;
}

#slide3 .color_place.blue {
  left: 18.0em;
  top: 65.1em;
  width: 7.4em;
  height: 3.9em;
  border-radius: 12em/6em;
}

#slide3 .color_place.black {
  left: 11.5em;
  top: 60.8em;
  width: 6.6em;
  height: 3.8em;
  border-radius: 8em/6em;
}

#slide3 .color_place.white {
  left: 26.0em;
  top: 58.8em;
  width: 4.6em;
  height: 3.0em;
  border-radius: 8em/6em;
}

#slide3 .color_place.brown {
  left: 21.3em;
  top: 60.7em;
  width: 6.0em;
  height: 3.0em;
  border-radius: 4em 40em;
}

/********************************************************************************
 * slide 4
 ********************************************************************************/
#slide4 header {
  position: absolute;
  left: 2.5em;
  top: 2.5em;
  width: 100%;
  height: auto;
  font-family: "Tahoma";
  font-weight: normal;
  text-align: left;
  line-height: 2.4em;
  color: #000000;
  z-index: 10;
}

#slide4 header > span {
  font-size: 2.4em;
  vertical-align: top;
}

#slide4 .zanaves {
  position: absolute;
  left: 32.1em;
  top: 21.9em;
  width: 60.8em;
  height: 36.1em;
  background-image: url(images/slide4/zanaves.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
}

#slide4 .top-light {
  position: absolute;
  left: 39.3em;
  top: 10.6em;
  width: 29.7em;
  height: 11.0em;
  background-image: url(images/slide4/top_light.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .top-light .active-view {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url(images/slide4/top_light_a.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;
}

#slide4 .top-light.selected .active-view {
  opacity: 1;
}

#slide4 .commonText {
  position: absolute;
  left: 8.6em;
  top: 60.3em;
  width: 46.4em;
  height: auto;
  coolor: #333333;
  font-family: "Tahoma";
  font-weight: normal;
  text-align: left;
  line-height: 1.4em;
}

#slide4 .commonText > span {
  font-size: 1.4em;
}

#slide4 .active-item {
  cursor: pointer;
}

#slide4 .pictures {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: rotateX(0);
  -moz-transform: rotateX(0);
  -ms-transform: rotateX(0);
  -o-transform: rotateX(0);
  transform: rotateX(0);
}

#slide4 .pictures .pic {
  position: absolute;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transform: rotateX(0);
  -moz-transform: rotateX(0);
  -ms-transform: rotateX(0);
  -o-transform: rotateX(0);
  transform: rotateX(0);
}

#slide4 .pictures .pic .active-view {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  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;
}

#slide4 .pictures .pic.pic1 {
  left: 3.2em;
  top: 16.8em;
  width: 17em;
  height: 15.9em;
  background-image: url(images/slide4/pic1.png);
}

#slide4 .pictures .pic.pic2 {
  left: 3.2em;
  top: 32.4em;
  width: 17em;
  height: 12em;
  background-image: url(images/slide4/pic2.png);
}

#slide4 .pictures .pic.pic3 {
  left: 22.4em;
  top: 24.3em;
  width: 16.9em;
  height: 17.3em;
  background-image: url(images/slide4/pic3.png);
}

#slide4 .pictures .pic.pic4 {
  left: 45.2em;
  top: 27.5em;
  width: 5.6em;
  height: 12.5em;
  background-image: url(images/slide4/pic4.png);
}

#slide4 .pictures .pic.pic5 {
  left: 42.1em;
  top: 39em;
  width: 9em;
  height: 9.7em;
  background-image: url(images/slide4/pic5.png);
}

#slide4 .pictures .pic.pic6 {
  left: 56.6em;
  top: 26.7em;
  width: 4.4em;
  height: 10.1em;
  background-image: url(images/slide4/pic6.png);
}

#slide4 .pictures .pic.pic7 {
  left: 63em;
  top: 26.7em;
  width: 5.6em;
  height: 10.1em;
  background-image: url(images/slide4/pic7.png);
}

#slide4 .pictures .pic.pic8 {
  left: 69.9em;
  top: 26.7em;
  width: 5.5em;
  height: 10em;
  background-image: url(images/slide4/pic8.png);
}

#slide4 .pictures .pic.pic9 {
  left: 77.2em;
  top: 26.7em;
  width: 5.2em;
  height: 10em;
  background-image: url(images/slide4/pic9.png);
}

#slide4 .pictures .pic.pic10 {
  left: 53.3em;
  top: 36.7em;
  width: 31.1em;
  height: 11.5em;
  background-image: url(images/slide4/pic10.png);
}

#slide4 .pictures .pic.pic1 .active-view {
  background-image: url(images/slide4/pic1a.png);
}
#slide4 .pictures .pic.pic2 .active-view {
  background-image: url(images/slide4/pic2a.png);
}
#slide4 .pictures .pic.pic3 .active-view {
  background-image: url(images/slide4/pic3a.png);
}
#slide4 .pictures .pic.pic4 .active-view {
  background-image: url(images/slide4/pic4a.png);
}
#slide4 .pictures .pic.pic5 .active-view {
  background-image: url(images/slide4/pic5a.png);
}
#slide4 .pictures .pic.pic6 .active-view {
  background-image: url(images/slide4/pic6a.png);
}
#slide4 .pictures .pic.pic7 .active-view {
  background-image: url(images/slide4/pic7a.png);
}
#slide4 .pictures .pic.pic8 .active-view {
  background-image: url(images/slide4/pic8a.png);
}
#slide4 .pictures .pic.pic9 .active-view {
  background-image: url(images/slide4/pic9a.png);
}
#slide4 .pictures .pic.pic10 .active-view {
  background-image: url(images/slide4/pic10a.png);
}

#slide4 .pictures .pic.selected .active-view {
  opacity: 1;
}

#slide4 .i-tip {
  position: absolute;
  left: 0;
  top: 0;
  width: 3.4em;
  height: 3.2em;
  background-image: url(images/slide4/i-tip.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .pictures .pic.pic1 .i-tip {
  left: 14.6em;
  top: 13.5em;
}
#slide4 .pictures .pic.pic3 .i-tip {
  left: 0;
  top: -1em;
}
#slide4 .pictures .pic.pic4 .i-tip {
  left: 3.4em;
  top: 9.5em;
}
#slide4 .pictures .pic.pic9 .i-tip {
  left: 2.2em;
  top: 7em;
}
#slide4 .top-light .i-tip {
  left: 27.7em;
  top: 3.6em;
}

/********************************************************************************
 * informational pages
 ********************************************************************************/
#slide4 .info-page {
  position: absolute;
  display: none;
  opacity: 0;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,.85);
  -webkit-transition: opacity .4s linear;
  -moz-transition: opacity .4s linear;
  -ms-transition: opacity .4s linear;
  -o-transition: opacity .4s linear;
  transition: opacity .4s linear;
  font-family: "Tahoma";
  font-weight: normal;
  text-align: left;
  line-height: 1.7em;
  z-index: 1000;
}

#slide4 .info-page.show {
  opacity: 1;
}

/********************************************************************************
 * info page 1
 ********************************************************************************/
#slide4 .info-page.num1 .arrow1 {
  position: absolute;
  left: 19.9em;
  top: 15.5em;
  width: 19.8em;
  height: 23.3em;
  background-image: url(images/slide4/info1_arrow1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num1 .i-tip {
  left: 17.8em;
  top: 30.3em;
}

#slide4 .info-page.num1 .picture1 {
  position: absolute;
  left: 11.3em;
  top: 38.8em;
  width: 45.5em;
  height: 35.3em;
  background-image: url(images/slide4/info1_picture1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num1 .picture2 {
  position: absolute;
  left: 42.2em;
  top: 4.4em;
  width: 48.4em;
  height: 34.3em;
  background-image: url(images/slide4/info1_picture2.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num1 .text1 {
  position: absolute;
  left: 63.3em;
  top: 48.2em;
  width: 30em;
  text-align: left;
}

#slide4 .info-page.num1 .text1 > span {
  font-size: 1.4em;
}

/********************************************************************************
 * info page 3
 ********************************************************************************/
#slide4 .info-page.num3 .arrow1 {
  position: absolute;
  left: 13.0em;
  top: 25.2em;
  width: 10.1em;
  height: 30.9em;
  background-image: url(images/slide4/info3_arrow1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num3 .i-tip {
  left: 22.4em;
  top: 23.3em;
}

#slide4 .info-page.num3 .picture1 {
  position: absolute;
  left: 25.9em;
  top: 9.4em;
  width: 67.3em;
  height: 45.5em;
  background-image: url(images/slide4/info3_picture1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num3 .picture2 {
  position: absolute;
  left: 42.2em;
  top: 4.4em;
  width: 48.4em;
  height: 34.3em;
  background-image: url(images/slide4/info1_picture2.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num3 .text1 {
  position: absolute;
  left: 3.9em;
  top: 58.0em;
  width: 70em;
  text-align: left;
}

#slide4 .info-page.num3 .text1 > span {
  font-size: 1.4em;
}

/********************************************************************************
 * info page 4
 ********************************************************************************/
#slide4 .info-page.num4 .arrow1 {
  position: absolute;
  left: 45.0em;
  top: 29.3em;
  width: 12.1em;
  height: 18.4em;
  background-image: url(images/slide4/info4_arrow1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num4 .arrow2 {
  position: absolute;
  left: 2.1em;
  top: 45.2em;
  width: 3.9em;
  height: 14.8em;
  background-image: url(images/slide4/info4_arrow2.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num4 .arrow3 {
  position: absolute;
  left: 86.2em;
  top: 49.9em;
  width: 8.1em;
  height: 12.3em;
  background-image: url(images/slide4/info4_arrow3.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num4 .i-tip {
  left: 48.6em;
  top: 37.0em;
}

#slide4 .info-page.num4 .picture1 {
  position: absolute;
  left: 0.9em;
  top: 17.1em;
  width: 48.9em;
  height: 35.5em;
  background-image: url(images/slide4/info4_picture1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num4 .picture2 {
  position: absolute;
  left: 53.5em;
  top: 5.9em;
  width: 41em;
  height: 53.1em;
  background-image: url(images/slide4/info4_picture2.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num4 .text1 {
  position: absolute;
  left: 5.9em;
  top: 55.8em;
  width: 40em;
  text-align: left;
}

#slide4 .info-page.num4 .text2 {
  position: absolute;
  left: 58.0em;
  top: 63.1em;
  width: 34em;
  text-align: left;
}

#slide4 .info-page.num4 .text1 > span,
#slide4 .info-page.num4 .text2 > span {
  font-size: 1.4em;
}

/********************************************************************************
 * info page 9
 ********************************************************************************/
#slide4 .info-page.num9 .arrow1 {
  position: absolute;
  left: 79.7em;
  top: 26.6em;
  width: 10.5em;
  height: 20.7em;
  background-image: url(images/slide4/info9_arrow1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num9 .arrow2 {
  position: absolute;
  left: 6.6em;
  top: 60.0em;
  width: 4.8em;
  height: 8.0em;
  background-image: url(images/slide4/info9_arrow2.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num9 .i-tip {
  left: 79.4em;
  top: 33.7em;
}

#slide4 .info-page.num9 .picture1 {
  position: absolute;
  left: 10.7em;
  top: 6.4em;
  width: 15.7em;
  height: 29.9em;
  background-image: url(images/slide4/info9_picture1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num9 .picture2 {
  position: absolute;
  left: 30.1em;
  top: 6.4em;
  width: 15.5em;
  height: 29.9em;
  background-image: url(images/slide4/info9_picture2.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num9 .picture3 {
  position: absolute;
  left: 49.4em;
  top: 6.4em;
  width: 14.9em;
  height: 29.9em;
  background-image: url(images/slide4/info9_picture3.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num9 .picture4 {
  position: absolute;
  left: 67.8em;
  top: 6.4em;
  width: 12.0em;
  height: 29.9em;
  background-image: url(images/slide4/info9_picture4.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num9 .picture5 {
  position: absolute;
  left: 10.2em;
  top: 37.8em;
  width: 76.0em;
  height: 27.8em;
  background-image: url(images/slide4/info9_picture5.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num9 .text1 {
  position: absolute;
  left: 11.5em;
  top: 66.5em;
  width: 74em;
  text-align: left;
}

#slide4 .info-page.num9 .text1 > span {
  font-size: 1.4em;
}

/********************************************************************************
 * info page 11
 ********************************************************************************/
#slide4 .info-page.num11 .arrow1 {
  position: absolute;
  left: 64.3em;
  top: 16.8em;
  width: 8em;
  height: 14.2em;
  background-image: url(images/slide4/info11_arrow.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num11 .i-tip {
  left: 67em;
  top: 14.2em;
}

#slide4 .info-page.num11 .text1 {
  position: absolute;
  left: 64em;
  top: 40em;
  width: 31em;
  text-align: left;
}

#slide4 .info-page.num11 .text1 > span {
  font-size: 1.4em;
}

#slide4 .info-page.num11 .picture {
  position: absolute;
  left: 1.7em;
  top: 4.8em;
  width: 61.8em;
  height: 61.3em;
  background-image: url(images/slide4/info11_pic.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num11 .colors {
  position: absolute;
  left: 5.9em;
  top: 66.1em;
  width: 4.4em;
  height: 8.4em;
  background-image: url(images/slide4/info11_colors.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide4 .info-page.num11 .text2 {
  position: absolute;
  left: 12.1em;
  top: 66.1em;
  width: 48em;
  text-align: left;
  line-height: 1.5em;
}

#slide4 .info-page.num11 .text2 > span {
  font-size: 1.4em;
}

#slide4 .animStep1 {
  -webkit-transform: scale(1.05) translate(0px, -1px);
  -moz-transform: scale(1.05) translate(0px, -1px);
  -ms-transform: scale(1.05) translate(0px, -1px);
  -o-transform: scale(1.05) translate(0px, -1px);
  transform: scale(1.05) translate(0px, -1px);
}

#slide4 .animStep2 {
  -webkit-transform: translate(0px, 0px);
  -moz-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -o-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
}

/********************************************************************************
 * slide 5
 ********************************************************************************/
#slide5 header {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
  font-family: "Tahoma";
  font-weight: normal;
  text-align: left;
  line-height: 2.4em;
  padding: 2em 0 0 4.5em;
  color: #000000;
  z-index: 10;
}

#slide5 header > span {
  font-size: 2.4em;
  vertical-align: middle;
}

#slide5 header > span > span {
  color: #330066;
}

/* big book */

#slide5 .big-book {
  position: absolute;
  left: 0;
  top: 6em;
  width: 100%;
  height: 59.7em;
}

#slide5 .big-book > div {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transition: opacity .4s linear;
  -moz-transition: opacity .4s linear;
  -ms-transition: opacity .4s linear;
  -o-transition: opacity .4s linear;
  transition: opacity .4s linear;
  opacity: 0;
}

#slide5 .big-book .cover1 {
  background-image: url(images/slide5/bookBack1.png);
}

#slide5 .big-book .cover2 {
  background-image: url(images/slide5/bookBack2.png);
}

#slide5 .big-book .cover3 {
  background-image: url(images/slide5/bookBack3.png);
}

#slide5 .big-book .leaves {
  opacity: 1;
  background-image: url(images/slide5/bookLeaves.png);
}

#slide5 .big-book.type1 .cover1,
#slide5 .big-book.type2 .cover2,
#slide5 .big-book.type3 .cover3 {
  opacity: 1;
}

/* small books */

#slide5 .small-book {
  position: absolute;
  cursor: pointer;
}

#slide5 .book1 {
  left: 16.0em;
  top: 59.9em;
  width: 16.8em;
  height: 14.0em;
}

#slide5 .book2 {
  left: 40.1em;
  top: 59.9em;
  width: 16.9em;
  height: 14.2em;
}

#slide5 .book3 {
  left: 66.0em;
  top: 59.9em;
  width: 17.0em;
  height: 14.5em;
}

#slide5 .small-book > div {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  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 .small-book.selected .active,
#slide5 .small-book .non-active { /* :not(.selected) */
  opacity: 1;
}

#slide5 .book1 .non-active {
  background-image: url(images/slide5/smallbook1.png);
}

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

#slide5 .book2 .non-active {
  background-image: url(images/slide5/smallbook2.png);
}

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

#slide5 .book3 .non-active {
  background-image: url(images/slide5/smallbook3.png);
}

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

#slide5 .small-book .text {
  position: absolute;
  opacity: 1;
  top: 1.5em;
  font-family: "Tahoma";
  font-size: 1.5em;
  line-height: 1.2em;
  text-align: left;
  color: #000000;
}

#slide5 .small-book.book1 .text {
  left: 3.1em;
  top: .3em;
  -webkit-transform: rotateX(56deg) rotateZ(15deg);
  -moz-transform: rotateX(56deg) rotateZ(15deg);
  -ms-transform: rotateX(56deg) rotateZ(15deg);
  -o-transform: rotateX(56deg) rotateZ(15deg);
  transform: rotateX(56deg) rotateZ(15deg);
}

#slide5 .small-book.book2 .text {
  left: 3.8em;
  top: .2em;
  -webkit-transform: rotateX(56deg) rotateZ(15deg);
  -moz-transform: rotateX(56deg) rotateZ(15deg);
  -ms-transform: rotateX(56deg) rotateZ(15deg);
  -o-transform: rotateX(56deg) rotateZ(15deg);
  transform: rotateX(56deg) rotateZ(15deg);
}

#slide5 .small-book.book3 .text {
  left: 3.8em;
  top: .5em;
  -webkit-transform: rotateX(56deg) rotateZ(15deg);
  -moz-transform: rotateX(56deg) rotateZ(15deg);
  -ms-transform: rotateX(56deg) rotateZ(15deg);
  -o-transform: rotateX(56deg) rotateZ(15deg);
  transform: rotateX(56deg) rotateZ(15deg);
}

/* book content*/

#slide5 .content {
  position: absolute;
  left: 0;
  top: 10em;
  width: 100%;
  height: 49.6em;
  -webkit-transition: opacity .2s linear;
  -moz-transition: opacity .2s linear;
  -ms-transition: opacity .2s linear;
  -o-transition: opacity .2s linear;
  transition: opacity .2s linear;
  opacity: 1;
}

#slide5 .content .image {
  position: absolute;
  left: 12.2em;
  top: 0;
  width: 33.6em;
  height: 46.1em;
  background-position: 50% 50%;
  background-size: contain;
  background-repeat: no-repeat;
}

#slide5 .content .image-name {
  position: absolute;
  left: 12.2em;
  top: 47em;
  width: 33.6em;
  height: auto;
  font-family: Tahoma;
  line-height: 1.7em;
  text-align: center;
  color: #000000;
}

#slide5 .content .image-name > span {
  font-size: 1.4em;
}

#slide5 .content .description {
  position: absolute;
  left: 52.8em;
  top: 0;
  width: 32.2em;
  height: 49em;
  font-family: Tahoma;
  line-height: 1.7em;
  text-align: left;
  color: #000000;
}

#slide5 .content .description > * {
  font-size: 1.4em;
}

#slide5 .content .description > .right {
  text-align: right;
}

#slide5 .content .description > .center {
  text-align: center;
}

#slide5 .content .description > .italic {
  font-style: italic;
}

#slide5 .content .description > .bold {
  font-weight: bold;
}

/* page's leaves */
#slide5 .pages-left {
  position: absolute;
  left: 6.3em;
  top: 8.2em;
  width: 4.5em;
}
#slide5 .pages-right {
  position: absolute;
  left: 87.1em;
  top: 8.2em;
  width: 4.5em;
}
#slide5 .page {
  position: absolute;
  left: 0;
  width: 4.5em;
  height: 4.7em;
  cursor: pointer;
  visibility: visible;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transition: left .4s linear, width .4s linear, visibility .4s linear;
  -moz-transition: left .4s linear, width .4s linear, visibility .4s linear;
  -ms-transition: left .4s linear, width .4s linear, visibility .4s linear;
  -o-transition: left .4s linear, width .4s linear, visibility .4s linear;
  transition: left .4s linear, width .4s linear, visibility .4s linear;
}

#slide5 .pages-left .page.hide {
  left: 4.5em !important;
  width: 0;
  visibility: hidden;
}
#slide5 .pages-right .page.hide {
  width: 0;
  visibility: hidden;
}

/********************************************************************************
 * slide 7
 ********************************************************************************/
#slide7 {
  font-family: "Tahoma";
  font-weight: normal;
}

#slide7 header {
  position: absolute;
  left: 4.5em;
  top: 1.8em;
  width: auto;
  height: auto;
  white-space: nowrap;
  font-family: "Tahoma";
  font-weight: normal;
  text-align: left;
  line-height: 2.4em;
  color: #ffffff;
  z-index: 10;
}

#slide7 header > span {
  font-size: 2.4em;
  vertical-align: middle;
}

#slide7 .cover {
  left: -2em;
  top: 0;
  width: 100em;
  height: 76.8em;
  background-image: url(images/slide7/cover.png);
  pointer-events: none;
}

#slide7 .puzzle-item-cover {
  cursor: pointer;
  opacity: 0;
}

#slide7 .puzzle-item > div {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  opacity: 0;
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-transition: opacity .4s linear;
  -moz-transition: opacity .4s linear;
  -ms-transition: opacity .4s linear;
  -o-transition: opacity .4s linear;
  transition: opacity .4s linear;
}

#slide7 .puzzle-item.active > div {
  width: 100%;
  height: 100%;
  opacity: 1;
}

#slide7 .item1 {
  left: 1.3em;
  top: 5.9em;
  width: 55.0em;
  height: 37.8em;
  background-image: url(images/slide7/item01.png);
}
#slide7 .item1.active > div {
  background-image: url(images/slide7/item01a.png);
}

#slide7 .item2 {
  left: 15.1em;
  top: 6.0em;
  width: 28.6em;
  height: 27.1em;
  background-image: url(images/slide7/item02.png);
}
#slide7 .item2.active > div {
  background-image: url(images/slide7/item02a.png);
}

#slide7 .item3 {
  left: 85.0em;
  top: 31.6em;
  width: 14.3em;
  height: 40.2em;
  background-image: url(images/slide7/item03.png);
}
#slide7 .item3.active > div {
  background-image: url(images/slide7/item03a.png);
}

#slide7 .item4 {
  left: 46.7em;
  top: 52.8em;
  width: 23.3em;
  height: 19.5em;
  background-image: url(images/slide7/item04.png);
}
#slide7 .item4.active > div {
  background-image: url(images/slide7/item04a.png);
}

#slide7 .item5 {
  left: 43.7em;
  top: 5.9em;
  width: 16.4em;
  height: 24.9em;
  background-image: url(images/slide7/item05.png);
}
#slide7 .item5.active > div {
  background-image: url(images/slide7/item05a.png);
}

#slide7 .item6 {
  left: 44.0em;
  top: 31.2em;
  width: 26.3em;
  height: 23.9em;
  background-image: url(images/slide7/item06.png);
}
#slide7 .item6.active > div {
  background-image: url(images/slide7/item06a.png);
}

#slide7 .item7 {
  left: 1.1em;
  top: 40.5em;
  width: 16.9em;
  height: 31.3em;
  background-image: url(images/slide7/item07.png);
}
#slide7 .item7.active > div {
  background-image: url(images/slide7/item07a.png);
}

#slide7 .item8 {
  left: 68.7em;
  top: 22.5em;
  width: 17.8em;
  height: 50.0em;
  background-image: url(images/slide7/item08.png);
}
#slide7 .item8.active > div {
  background-image: url(images/slide7/item08a.png);
}

#slide7 .item9 {
  left: 60.1em;
  top: 5.8em;
  width: 27.1em;
  height: 26.7em;
  background-image: url(images/slide7/item09.png);
}
#slide7 .item9.active > div {
  background-image: url(images/slide7/item09a.png);
}

#slide7 .item10 {
  left: 85.5em;
  top: 5.5em;
  width: 13.5em;
  height: 25.6em;
  background-image: url(images/slide7/item10.png);
}
#slide7 .item10.active > div {
  background-image: url(images/slide7/item10a.png);
}

#slide7 .item11 {
  left: 15.1em;
  top: 40.9em;
  width: 35.0em;
  height: 31.1em;
  background-image: url(images/slide7/item11.png);
}
#slide7 .item11.active > div {
  background-image: url(images/slide7/item11a.png);
}

#slide7 .info-window {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: -1;
  background-color: #000033;
  -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: rotateX(0);
  -moz-transform: rotateX(0);
  -ms-transform: rotateX(0);
  -o-transform: rotateX(0);
  transform: rotateX(0);
}

#slide7 .info-window .small-img {
  left: 5.1em;
  top: 2.0em;
  width: 14.4em;
  height: 11.0em;
  background-image: url(images/slide7/small-pic.png);
}

#slide7 .info-window .small-img:after {
  position: absolute;
  display: block;
  left: -0.7em;
  top: -0.9em;
  width: 15.9em;
  height: 12.7em;
  background-image: url(images/slide7/small-ramka.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  content: "";
  z-index: -1;
}

#slide7 .info-window .small-text {
  left: 21.2em;
  top: 2rem;
  color: #ffffff;
  text-align: left;
  width: 22em;
}

#slide7 .info-window .small-text > span {
  font-size: 1.4em;
}

#slide7 .info-window .description {
  left: 4.6em;
  top: 15.4em;
  width: 40.2em;
  color: #ffffff;
  text-align: left;
}

#slide7 .info-window .description > span {
  font-size: 1.4em;
}

#slide7 .info-window .big-img {
  position: absolute;
  left: 46em;
  top: 0.7em;
  width: 49.1em;
  height: 75.0em;
  /*background-image: url(images/slide7/big-img.png);*/
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
}

#slide7 .info-window .big-img .place {
  cursor: pointer;
}

#slide7 .info-window .big-img .place1,
#slide7 .info-window .big-img .place2,
#slide7 .info-window .big-img .place3 {
  top: 6.4em;
  height: 22em;
}

#slide7 .info-window .big-img .place4,
#slide7 .info-window .big-img .place5,
#slide7 .info-window .big-img .place6 {
  top: 28.4em;
  height: 22.3em;
}

#slide7 .info-window .big-img .place7,
#slide7 .info-window .big-img .place8,
#slide7 .info-window .big-img .place9 {
  top: 50.7em;
  height: 22.5em;
}

#slide7 .info-window .big-img .place1,
#slide7 .info-window .big-img .place4,
#slide7 .info-window .big-img .place7 {
  left: 0;
  width: 16.1em;
}

#slide7 .info-window .big-img .place2,
#slide7 .info-window .big-img .place5,
#slide7 .info-window .big-img .place8 {
  left: 16.1em;
  width: 17.1em;
}

#slide7 .info-window .big-img .place3,
#slide7 .info-window .big-img .place6,
#slide7 .info-window .big-img .place9 {
  left: 33.2em;
  width: 15.9em;
}

#slide7 .info-window .cover {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 99;
}

#slide7 .info-window .popup-img {
  border: 0 solid #ffff00;
  -webkit-transition: left .3s linear, top .3s linear, width .3s linear, height .3s linear, -webkit-transform .3s linear, border .3s linear;
  -moz-transition: left .3s linear, top .3s linear, width .3s linear, height .3s linear, -moz-transform .3s linear, border .3s linear;
  -ms-transition: left .3s linear, top .3s linear, width .3s linear, height .3s linear, -ms-transform .3s linear, border .3s linear;
  -o-transition: left .3s linear, top .3s linear, width .3s linear, height .3s linear, -o-transform .3s linear, border .3s linear;
  transition: left .3s linear, top .3s linear, width .3s linear, height .3s linear, transform .3s linear, border .3s linear;
  -webkit-transform: scale(.1);
  -moz-transform: scale(.1);
  -ms-transform: scale(.1);
  -o-transform: scale(.1);
  transform: scale(.1);
  z-index: 100;
}

#slide7 .info-window .popup-img.big {
  left: 56.6em !important;
  top: 54.9em !important;
  border: .7em solid #ffff00;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

#slide7 .info-window .popup-img.img1,
#slide7 .info-window .popup-img.img2,
#slide7 .info-window .popup-img.img3,
#slide7 .info-window .popup-img.img4,
#slide7 .info-window .popup-img.img5,
#slide7 .info-window .popup-img.img6,
#slide7 .info-window .popup-img.img7,
#slide7 .info-window .popup-img.img8,
#slide7 .info-window .popup-img.img9 {
  width: 60em;
  height: 30em;
  margin-left: -30em;
  margin-top: -15em;
  background-image: url(images/slide7/big/img5.jpg);
}

#slide7 .info-window .float-big-image {
  position: absolute;
  left: 45.7em; /*29.6em;*/
  top: 27em; /*39.9em;*/
  width: 42.7em; /*61.7em;*/
  height: 30.7em;
  box-shadow: 0 0 0 4px #ffff00 inset;
  background-position: 50% 50%;
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity .5s linear,visibility .5s linear;
  -moz-transition: opacity .5s linear,visibility .5s linear;
  -ms-transition: opacity .5s linear,visibility .5s linear;
  -o-transition: opacity .5s linear,visibility .5s linear;
  transition: opacity .5s linear,visibility .5s linear;
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  -ms-transform-origin: 50% 0;
  -o-transform-origin: 50% 0;
  transform-origin: 50% 0;
}

#slide7 .info-window .float-big-image.show {
  opacity: 1;
  visibility: visible;
}

#slide7 .info-window .float-big-image .yellow_top {
  position: absolute;
  left: 0;
  top: -7.9em;
  width: 42.7em; /*61.7em;*/
  height: 7.9em; /*11.4em;*/
  background-image: url(images/slide7/yellow_top.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/********************************************************************************
 * slide 6
 ********************************************************************************/
#slide6 {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

#slide6 header {
  position: absolute;
  left: 6.7em;
  top: 1.3em;
  width: auto;
  height: auto;
  font-family: "Tahoma";
  font-weight: normal;
  text-align: left;
  line-height: 2.4em;
  white-space: nowrap;
  color: #ffffff;
  z-index: 10;
}

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

#slide6 .images {
  position: absolute;
  left: 6em;
  top: 5.5em;
  width: 84em;
  height: 66.8em;
  /*background-image: url(images/slide6/back_image.png);*/
  overflow: hidden;
}

#slide6 .images .image {
  width: 100%;
}

#slide6 .photo-name {
  left: 8em;
  bottom: 1.5em;
  font-family: "Tahoma";
  font-weight: normal;
  text-align: left;
  line-height: 1.4em;
  white-space: nowrap;
  color: #ffffff;
}

#slide6 .photo-name > span {
  font-size: 1.4em;
}

#slide6 .moving {
  opacity: .6;
}
#slide6 .melnitsa {
  left: 5.2em;
  top: 52.8em;
  width: 11.2em;
  height: 18.0em;
  background-image: url(images/slide6/melnitsa.png);
}

#slide6 .melnitsa-vint {
  left: .6em;
  top: 45.9em;
  width: 20.9em;
  height: 20.9em;
  background-image: url(images/slide6/melnitsa-vint.png);
  -webkit-animation: roll_roll 3s normal infinite linear;
  -moz-animation: roll_roll 3s normal infinite linear;
  animation: roll_roll 3s normal infinite linear;
}

#slide6 .big-cloud {
  opacity: 0;
  left: 41.9em;
  top: 40.1em;
  width: 50.8em;
  height: 26.1em;
  background-image: url(images/slide6/big-cloud.png);
  padding: 5.5em 4.8em 5.6em 6.1em;
  -webkit-transition: opacity .3s linear;
  -moz-transition: opacity .3s linear;
  -ms-transition: opacity .3s linear;
  -o-transition: opacity .3s linear;
  transition: opacity .3s linear;
}

#slide6 .big-cloud.show {
  opacity: 1;
}

#slide6 .big-cloud > span {
  font-size: 1.4em;
}

#slide6 .arrow-down {
  left: 46.5em;
  top: 66.8em;
  width: 5.5em;
  height: 4.8em;
  background-image: url(images/slide6/arrow_down.png);
  cursor: pointer;
  /*pointer-events: none;*/
}

#slide6 .arrow-up {
  left: 45.6em;
  top: 7.8em;
  width: 5.4em;
  height: 4.5em;
  background-image: url(images/slide6/arrow_up.png);
  cursor: pointer;
  /*pointer-events: none;*/
}

#slide6 .air-craft {
  left: 4.2em;
  top: 31.5em;
  width: 23.2em;
  height: 11.4em;
  background-image: url(images/slide6/air_craft1.png);
}
#slide6.step2 .air-craft {
  background-image: url(images/slide6/air_craft2.png);
}

#slide6 .air-ball {
  left: 3.2em;
  top: 11.8em;
  width: 16em;
  height: 21.6em;
  background-image: url(images/slide6/air_ball.png);
}

#slide6 .small-cloud {
  left: 78.4em;
  top: 28.0em;
  width: 14.7em;
  height: 9.3em;
  background-image: url(images/slide6/small_cloud1.png);
  cursor: pointer;
}
#slide6.step2 .small-cloud {
  background-image: url(images/slide6/small_cloud2.png);
}

#slide6 .bird1 {
  left: 58.7em;
  top: 16.0em;
  width: 11.7em;
  height: 6.3em;
  background-image: url(images/slide6/bird1_1.png);
}
#slide6.step2 .bird1 {
  background-image: url(images/slide6/bird1_2.png);
}

#slide6 .bird2 {
  left: 48.6em;
  top: 13.4em;
  width: 9.7em;
  height: 10.7em;
  background-image: url(images/slide6/bird2_1.png);
}
#slide6.step2 .bird2 {
  background-image: url(images/slide6/bird2_2.png);
}

@-webkit-keyframes roll_roll {
  0% { -webkit-transform: rotate(-360deg); }
  /*50% { -webkit-transform: rotate(-180deg); }*/
  100% { -webkit-transform: rotate(0deg); }
}

@-moz-keyframes roll_roll {
  0% { -moz-transform: rotate(-360deg); }
  /*50% { -moz-transform: rotate(-180deg); }*/
  100% { -moz-transform: rotate(0deg); }
}

@keyframes roll_roll {
  0% { transform: rotate(-360deg); }
  /*50% { transform: rotate(-180deg); }*/
  100% { transform: rotate(0deg); }
}

/********************************************************************************
 * slide 8
 ********************************************************************************/
#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: 68.4em;
  top: 17.6em;
  width: 15em;
  height: 5em;
  background-image: url(images/s8_logo1.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

#slide8 .logo2 {
  position: absolute;
  left: 68.4em;
  top: 40.6em;
  width: 17.0em;
  height: 5.1em;
  background-image: url(images/s8_logo2.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}