@charset "utf-8";
/* CSS Document */

.banner-show .plats-left {
  width: 540px;
  height: 400px;
  -webkit-animation: bann .5s  1 linear;
  -moz-animation: bann .5s  1 linear;
  -ms-animation: bann .5s  1 linear;
  -o-animation: bann .5s  1 linear;
  animation: bann .5s  1 linear;
}
@-webkit-keyframes bann {
  0% {
    -webkit-transform: translate(-150px, 0px);
    opacity: .3;
  }
}

@-moz-keyframes bann {
    0% {
      -moz-transform: translate(-150px, 0px);
      opacity: .3;
    }
}

@keyframes bann {
  0% {
    transform: translate(-150px, 0px);
    opacity: .3;
  }
}

.sdk-site-ban,
.push-ban,
.sdk-ban,
.exper-ban {
  -webkit-animation: opac .4s  1 linear;
  -moz-animation: opac .4s  1 linear;
  animation: opac .4s  1 linear;
}

@-webkit-keyframes opac {
  0% {
     filter: alpha(opacity=60);
    -moz-opacity: .6;
    -webkit-opacity: .6;
    opacity: .6;
  }
}
@-moz-keyframes opac {
  0% {
     filter: alpha(opacity=60);
    -moz-opacity: .6;
    -webkit-opacity: .6;
    opacity: .6;
  }
}
@keyframes opac {
  0% {
      filter: alpha(opacity=60);
    -moz-opacity: .6;
    -webkit-opacity: .6;
    opacity: .6;
  }
}

.banner-show  .computer-s {
  -webkit-animation: computer-s  .5s 1 linear;
  -moz-animation: computer-s .5s 1 linear;
  animation: computer-s .5s 1 linear;
}

@-webkit-keyframes computer-s {
  0% {
    -webkit-transform: translate(0px, -150px);
     filter: alpha(opacity=20);
    -moz-opacity: .2;
    -webkit-opacity: .2;
    opacity: .2;
  }
}

@-moz-keyframes computer-s {
  0% {
    -moz-transform: translate(0px, -150px);
     filter: alpha(opacity=20);
    -moz-opacity: .2;
    -webkit-opacity: .2;
    opacity: .2;
  }
}


@keyframes computer-s {
  0% {
    transform: translate(0px, -150px);
     filter: alpha(opacity=20);
    -moz-opacity: .2;
    -webkit-opacity: .2;
    opacity: .2;
  }
}


.banner-show .iphon {
  -webkit-animation: ipn 1.5s 1 linear;
  -moz-animation: ipn 1.5s 1 linear;
  animation: ipn 1.5s 1 linear;
}

@keyframes ipn {
   0% {
    -webkit-transform: translateY(-100px);
     filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }

  40% {
    -webkit-transform: translateY(-40px);
     filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

@-webkit-keyframes ipn {
  0% {
    -webkit-transform: translateY(-100px);
     filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }

  40% {
    -webkit-transform: translateY(-40px);
     filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

.banner-show  .flow {
  -webkit-animation: flow .7s 1 linear;
  -moz-animation: flow .7s 1 linear;
  animation: flow .7s 1 linear;
}

@keyframes flow {
  0% {
    transform: translateY(-70px);
     filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

@-webkit-keyframes flow {
  0% {
    -webkit-transform: translateY(-70px);
     filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

.banner-show .icon-roid {
  -webkit-animation: icon-roid .8s 1;
  -moz-animation: icon-roid .8s 1;
  animation: icon-roid .8s 1;
}

@keyframes icon-roid {
  0% {
    transform: translate(-200px,30px) rotate(0deg);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

@-webkit-keyframes icon-roid {
  0% {
    -webkit-transform: translate(-200px,30px) rotate(0deg);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

.banner-show .icon-ios {
  -webkit-animation: icon-ios .5s 1;
  -moz-animation: icon-ios .5s 1;
  animation: icon-ios .5s 1;
}

@keyframes icon-ios {
  0% {
    transform: translate(-300px,10px);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

@-webkit-keyframes icon-ios {
  0% {
    -webkit-transform: translate(-300px,10px);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

.banner-show .icon-java {
  -webkit-animation: icon-java .5s 1;
  -moz-animation: icon-java .5s 1;
  animation: icon-java .5s 1;
}

@keyframes icon-java {
  0% {
    transform: translate(400px,400px);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

@-webkit-keyframes icon-java {
  0% {
    -webkit-transform: translate(400px,400px);
    ofilter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

.banner-show .icon-php {
  -webkit-animation: icon-php .7s 1;
  -moz-animation: icon-php .7s 1;
  animation: icon-php .7s 1;
}

@keyframes icon-php {

  0% {
    transform: translate(400px,400px);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }

}

@-webkit-keyframes icon-php {
  0% {
    -webkit-transform: translate(400px,400px);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

.banner-show .plat-forms {
  -webkit-animation: plat-forms .5s 1 linear;
  -moz-animation: plat-forms .5s 1 linear;
  animation: plat-forms .5s 1 linear;
  position: relative;
  z-index: 10;
}

@keyframes plat-forms {
  0% {
    transform:scale(.5,.5);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

@-webkit-keyframes plat-forms {
  0% {
     -webkit-transform:scale(.5,.5);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
   
  }

}

.banner-show .exper-bk {
  -webkit-animation: exper-bk .5s 1;
  -moz-animation: exper-bk .5s 1;
  animation: exper-bk .5s 1;
}

@keyframes exper-bk {
  0% {
    transform: translateY(80px);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

@-webkit-keyframes exper-bk {
  0% {
    -webkit-transform: translateY(80px);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

.banner-show .exper-mar {
  -webkit-animation: exper-mar .5s 1;
  -moz-animation: exper-mar .5s 1;
  animation: exper-mar .5s 1;
}

@keyframes exper-mar {
  0% {
    transform: translateY(-80px);
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

@-webkit-keyframes exper-mar {
  0% {
    -webkit-transform: translateY(-80px);
     filter: alpha(opacity=0);
    -moz-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
  }
}

.banner-show .addis {
  -webkit-animation: addis 1s 1;
  -moz-animation: addis 1s 1;
  animation: addis 1s 1;
}

@keyframes addis {
  0% {
    opacity: 0.2;
    filter: alpha(opacity=20);
  }

  50% {
    opacity: 0.6;
    filter: alpha(opacity=60);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
  }
}

@-webkit-keyframes addis {
  0% {
    opacity: 0.2;
    filter: alpha(opacity=20);
  }

  50% {
    opacity: 0.6;
    filter: alpha(opacity=60);
  }

  100% {
    opacity: 1;
    filter: alpha(opacity=100);
  }
}

.banner-show .arrow {
  width: 105px;
  height: 81px;
  background: url(../images/arrow.png) no-repeat;
  position: absolute;
  top: 180px;
  left: 294px;
  -webkit-animation: arrow 1s 1 ease-in-out;
  -moz-animation: arrow 1s 1 ease-in-out;
  animation: arrow 1s 1 ease-in-out;
}

@keyframes arrow {
  0% {
    width: 0px;
  }

  5% {
    width: 15px;
  }

  10% {
    width: 30px;
  }

  20% {
    width: 40px;
  }

  30% {
    width: 50px;
  }

  40% {
    width: 60px;
  }

  50% {
    width: 70px;
  }

  60% {
    width: 80px;
    height: 20px;
  }

  70% {
    width: 90px;
  }

  80% {
    width: 100px
  }

  100% {
    width: 105px;
  }
}

@-webkit-keyframes arrow {
  0% {
    width: 0px;
  }

  5% {
    width: 15px;
  }

  10% {
    width: 30px;
  }

  20% {
    width: 40px;
  }

  30% {
    width: 50px;
  }

  40% {
    width: 60px;
  }

  50% {
    width: 70px;
  }

  60% {
    width: 80px;
    height: 20px;
  }

  70% {
    width: 90px;
  }

  80% {
    width: 100px
  }

  100% {
    width: 105px;
  }
}

.matic img {
  -webkit-animation: aimgs 2s 1 linear;
  -moz-animation: aimgs 2s 1 linear;
  animation: aimgs 2s 1 linear;
  vertical-align: middle;
}

@keyframes aimgs {
  0% {
    filter: alpha(opacity=10);
    -moz-opacity: .1;
    -webkit-opacity: .1;
    opacity: .1;
  }
}

@-webkit-keyframes aimgs {
  0% {
    filter: alpha(opacity=10);
    -moz-opacity: .1;
    -webkit-opacity: .1;
    opacity: .1;
  }
}