/********************************************************************************
 * slide 3
 ********************************************************************************/
#slide3 {
  font-family: Tahoma;
  font-weight: normal;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

#slide3 > div {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 100em;
  height: 164.1em;
}

/********************************************************************************
 * blue background
 ********************************************************************************/
#slide3 > div > .background {
  position: absolute;
  display: block;
  left: 0;
  top: 144.5em;
  width: 100%;
  height: 19.6em;
  z-index: 0;
  background-color: #6699cc;
}

/********************************************************************************
 * logos
 ********************************************************************************/
#slide3 .text-logo {
  left: 20.0em;
  top: 1.8em;
  text-align: left;
  color: #666666;
  z-index: 100;
}

#slide3 .text-logo > span {
  font-size: 3em;
}

#slide3 .text-logo > span > span {
  font-size: 1.2em;
}

#slide3 .top-logo {
  left: 0;
  top: 0;
  width: 17.4em;
  height: 12.8em;
  background-image: url(../images/slide3/top-logo.png);
  z-index: 100;
}

#slide3 .top-logo2 {
  left: 88.8em;
  top: 1.8em;
  width: 9.5em;
  height: 9.1em;
  background-image: url(../images/slide3/top-logo2.png);
  z-index: 100;
}

#slide3 .top-logo2 > div {
  left: 1.2em;
  top: 12.5em;
}

#slide3 .top-logo2 > div > a {
  font-size: 1.2em;
  text-decoration: underline;
}

/********************************************************************************
 * time-line
 ********************************************************************************/
#slide3 .castle {
  top: 113.4em;
  left: 0;
  background-image: url(../images/slide3/castle.png);
  width: 138em;
  height: 31.1em;
}

#slide3 .time-line {
  top: 143.2em;
  left: -30em;
  width: 256em;
}

#slide3 .time-line div.line {
  top: 0;
  left: 0;
  width: 100%;
  height: 2.6em;
  white-space: nowrap;
  text-align: left;
}

#slide3 .time-line div.line > div.p1 {
  display: inline-block;
  width: .8em;
  height: 100%;
  background-image: url(../images/slide3/line1.png);
  background-position: 0 0;
  background-size: 2px 2.6em;
  background-repeat: no-repeat;
  opacity: .75;
}

#slide3 .time-line div.line > div.p2 {
  display: inline-block;
  width: .8em;
  height: 100%;
  background-image: url(../images/slide3/line2.png);
  background-position: 0 0;
  background-size: 2px 2.6em;
  background-repeat: no-repeat;
  opacity: .75;
}

#slide3 .time-line .year-num {
  top: 5em;
  width: 9.6em;
  height: 3.4em;
  margin-left: -4.8em;
  line-height: 3.4em;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  color: #ffffff;
}

#slide3 .time-line .year-num > span {
  display: inline-block;
  font-size: 2.5em;
  vertical-align: middle;
}

#slide3 .time-line .circle {
  width: 6.4em;
  height: 6.4em;
  margin-left: -3.2em;
  margin-top: -3.2em;
  border: 2px solid #666666;
  border-radius: 3.2em;
  background-color: #ffffff;
}

#slide3 .time-line .circle-tail {
  opacity: .75;
  width: 2px;
  background-image: url(../images/slide3/dash-line.png);
  background-size: 2px 13px;
  background-position: 0 100%;
  background-repeat: repeat;
  /*border-left: 1px dashed #cccccc;*/
  -webkit-transform-origin: 0 100%;
  -moz-transform-origin: 0 100%;
  -ms-transform-origin: 0 100%;
  -o-transform-origin: 0 100%;
  transform-origin: 0 100%;
}

#slide3 .time-line .circle .text {
  position: absolute;
  display: block;
  left: 4.2em;
  top: 4.8em;
  width: 20em;
  font-size: 1.2em;
  color: #6699cc;
  text-align: left;
  text-transform: uppercase;
}

#slide3 .time-line .circle .text > span {
  font-size: 1.2em;
}

#slide3 .time-line-cursor {
  top: 141.9em;
  width: 5.7em;
  height: 5.7em;
  background-image: url(../images/slide3/cursor.png);
  cursor: pointer;
}

#slide3 .time-line-cursor.img2 {
  background-image: url(../images/slide3/cursor2.png);
}

#slide3 .time-line-cursor.drop {
  -webkit-transition: margin-left .5s ease-in-out;
  -moz-transition: margin-left .5s ease-in-out;
  -ms-transition: margin-left .5s ease-in-out;
  -o-transition: margin-left .5s ease-in-out;
  transition: margin-left .5s ease-in-out;
}

/********************************************************************************
 * top part
 ********************************************************************************/
#slide3 .top-part .chertez {
  left: 3.3em;
  top: 16.5em;
  width: 16.1em;
  height: 18.5em;
  background-image: url(../images/slide3/chertez.png);
  border: 3px solid #6699cc;
  border-radius: 1px;
}

#slide3 .top-part .chertez-line {
  left: 2.5em;
  top: 33.2em;
  width: 15.5em;
  height: 12.9em;
  background-image: url(../images/slide3/chertez-text.png);
}

#slide3 .top-part .chertez-text {
  left: 2.5em;
  top: 38.4em;
  width: 15.5em;
  height: 7.7em;
  text-align: left;
  letter-spacing: -.1em;
  text-transform: uppercase;
  color: #666666;
}

#slide3 .top-part .chertez-text > span {
  font-size: 1.2em;
}

#slide3 .top-part .map {
  left: 2.8em;
  top: 50.5em;
  width: 30.2em;
  height: 30.0em;
  background-image: url(../images/slide3/map.png);
  border: 3px solid #6699cc;
  border-radius: 1px;
}

#slide3 .top-part .map-line {
  left: 30.7em;
  top: 68.1em;
  width: 17.1em;
  height: 15.3em;
  background-image: url(../images/slide3/map-text.png);
}

#slide3 .top-part .map-text {
  left: 34.2em;
  top: 74.1em;
  width: 15.1em;
  height: 11.8em;
  text-align: left;
  letter-spacing: -.1em;
  text-transform: uppercase;
  color: #666666;
}

#slide3 .top-part .map-text > span {
  font-size: 1.2em;
}

#slide3 .top-part .tower {
  left: 51.4em;
  top: 61.6em;
  width: 20.6em;
  height: 18.9em;
  background-image: url(../images/slide3/tower.png);
  border: 3px solid #6699cc;
  border-radius: 1px;
}

#slide3 .top-part .tower-line {
  left: 69.6em;
  top: 66.1em;
  width: 30.1em;
  height: 16.4em;
  background-image: url(../images/slide3/tower-text.png);
}

#slide3 .top-part .tower-text {
  left: 73.6em;
  top: 68.5em;
  width: 30.1em;
  height: 10.0em;
  text-align: left;
  letter-spacing: -.1em;
  text-transform: uppercase;
  color: #666666;
}

#slide3 .top-part .tower-text > span {
  font-size: 1.2em;
}

#slide3 .top-part .big-image {
  left: 18em;
  top: 12.6em;
  width: 81.7em;
  height: 53.5em;
  background-image: url(../images/slide3/big-image.png);
  text-transform: uppercase;
  color: #666666;
}

#slide3 .top-part .big-image .top {
  position: relative;
  font-weight: bold;
  overflow: hidden;
  height: 5em;
  line-height: 5em;
}

#slide3 .top-part .big-image .bottom {
  position: relative;
  overflow: hidden;
}

#slide3 .top-part .big-image .top > span {
  position: relative;
  top: 6em;
}
#slide3 .top-part .big-image .bottom > span {
  position: relative;
  top: -5em;
}

#slide3 .top-part .big-image .top > span {
  display: inline-block;
  font-size: 4em;
  vertical-align: bottom;
  line-height: 1em;
}

#slide3 .top-part .big-image .top small {
  display: inline-block;
  font-size: .6em;
  line-height: 1em;
}

#slide3 .top-part .big-image .bottom span {
  font-size: 1.2em;
}

#slide3 .top-part .big-image .line {
  opacity: 0;
}

#slide3 .top-part .big-image .p1.text {
  left: 3em;
  top: 3.6em;
}
#slide3 .top-part .big-image .p2.text {
  left: 4.6em;
  top: 15.2em;
}
#slide3 .top-part .big-image .p3.text {
  left: 4.8em;
  top: 24.8em;
}
#slide3 .top-part .big-image .p4.text {
  left: 41em;
  top: 37.3em;
}
#slide3 .top-part .big-image .p5.text {
  left: 56em;
  top: 43.1em;
}
#slide3 .top-part .big-image .p6.text {
  left: 68.3em;
  top: 33.7em;
}

#slide3 .top-part .big-image .p1.line {
  left: 4.5em;
  top: 8.3em;
  width: 24.4em;
  height: 4.0em;
  background-image: url(../images/slide3/b-i-line1.png);
}
#slide3 .top-part .big-image .p2.line {
  left: 4.5em;
  top: 17.6em;
  width: 24.1em;
  height: 2.8em;
  background-image: url(../images/slide3/b-i-line2.png);
}
#slide3 .top-part .big-image .p3.line {
  left: 4.5em;
  top: 19.1em;
  width: 33.7em;
  height: 10.9em;
  background-image: url(../images/slide3/b-i-line3.png);
}
#slide3 .top-part .big-image .p4.line {
  left: 41em;
  top: 18.9em;
  width: 11.7em;
  height: 23.5em;
  background-image: url(../images/slide3/b-i-line4.png);
}
#slide3 .top-part .big-image .p5.line {
  left: 56.4em;
  top: 14.1em;
  width: 16.8em;
  height: 34.1em;
  background-image: url(../images/slide3/b-i-line5.png);
}
#slide3 .top-part .big-image .p6.line {
  left: 63.6em;
  top: 12.6em;
  width: 17.7em;
  height: 26.2em;
  background-image: url(../images/slide3/b-i-line6.png);
}

/********************************************************************************
 * animation
 ********************************************************************************/
#slide3 .tip-line,
#slide3 .tip-text {
  opacity: 0;
}

#slide3.anim1 .tip-line.chertez-line,
#slide3.anim2 .tip-line.map-line,
#slide3.anim3 .tip-line.tower-line {
  opacity: 1;
  -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.anim1 .tip-text.chertez-text,
#slide3.anim2 .tip-text.map-text,
#slide3.anim3 .tip-text.tower-text {
  opacity: 1;
  -webkit-transition: opacity .5s linear .5s;
  -moz-transition: opacity .5s linear .5s;
  -ms-transition: opacity .5s linear .5s;
  -o-transition: opacity .5s linear .5s;
  transition: opacity .5s linear .5s;
}
