/* fade slider */
        .slides {
            height:137px;
            overflow:hidden;
            position:relative;
            right:20px;
            top:0;
            width:300px;
            z-index: 10;
        }
        .slides ul {
            list-style:none;
        }

        /* SLIDER */
        /* keyframes #anim_slides */
        @-webkit-keyframes anim_slides {
          0% {
              opacity:0;
              z-index: 0;
          }
          2% {
              opacity:1;
              z-index: 99999;
          }
          8% {
              opacity:1;
              z-index: 99999;
          }
          11% {
              opacity:0;
              z-index: 1;
          }
          100% {
              opacity:0;
              z-index: 1;
          }
      }
      @-moz-keyframes anim_slides {
          0% {
              opacity:0;
              z-index: 0;
          }
          2% {
              opacity:1;
              z-index: 99999;
          }
          8% {
              opacity:1;
              z-index: 99999;
          }
          11% {
              opacity:0;
              z-index: 1;
          }
          100% {
              opacity:0;
              z-index: 1;
          }
      }

        .slides ul li {
            opacity:0;
            position:absolute;
            top:0;
            width: 300px;
            height: 137px;
            /* css3 animation */
            -webkit-animation-name: anim_slides;
            -webkit-animation-duration: 54.0s;
            -webkit-animation-timing-function: ease-out;
            -webkit-animation-iteration-count: infinite;
            -webkit-animation-direction: normal;
            -webkit-animation-delay: 0;
            -webkit-animation-play-state: running;
            -webkit-animation-fill-mode: forwards;

            -moz-animation-name: anim_slides;
            -moz-animation-duration: 54.0s;
            -moz-animation-timing-function: ease-out;
            -moz-animation-iteration-count: infinite;
            -moz-animation-direction: normal;
            -moz-animation-delay: 0;
            -moz-animation-play-state: running;
            -moz-animation-fill-mode: forwards;
        }

        /* css3 delays */
        .slides ul  li:nth-child(2), .slides ul  li:nth-child(2) div {
            -webkit-animation-delay: 6.0s;
            -moz-animation-delay: 6.0s;
        }
        .slides ul  li:nth-child(3), .slides ul  li:nth-child(3) div {
            -webkit-animation-delay: 12.0s;
            -moz-animation-delay: 12.0s;
        }
        .slides ul  li:nth-child(4), .slides ul  li:nth-child(4) div {
            -webkit-animation-delay: 18.0s;
            -moz-animation-delay: 18.0s;
        }
        .slides ul  li:nth-child(5), .slides ul  li:nth-child(5) div {
            -webkit-animation-delay: 24.0s;
            -moz-animation-delay: 24.0s;
        }
        .slides ul  li:nth-child(6), .slides ul  li:nth-child(6) div {
            -webkit-animation-delay: 30.0s;
            -moz-animation-delay: 30.0s;
        }
        .slides ul  li:nth-child(7), .slides ul  li:nth-child(7) div {
            -webkit-animation-delay: 36.0s;
            -moz-animation-delay: 36.0s;
        }
        .slides ul  li:nth-child(8), .slides ul  li:nth-child(8) div {
            -webkit-animation-delay: 42.0s;
            -moz-animation-delay: 42.0s;
        }
        .slides ul  li:nth-child(9), .slides ul  li:nth-child(9) div {
            -webkit-animation-delay: 48.0s;
            -moz-animation-delay: 48.0s;
        }
        .slides ul li img {
            display:block;
        }

        /* keyframes #anim_titles */
        @-webkit-keyframes anim_titles {
            0% {
                bottom: 30px;
                left: 60px;
                opacity:0;
                -webkit-transform: scale3d(0.2,0.2,0.2) rotate(0deg) translateX(80px) rotate(0deg);
                -moz-transform: scale3d(0.2,0.2,0.2) rotate(0deg) translateX(80px) rotate(0deg);
            }
            2% {
                bottom: 0;
                opacity:1;
                -webkit-transform: scale3d(1,1,1) rotate(-180deg) translateX(80px) rotate(180deg);
                -moz-transform: scale3d(1,1,1) rotate(-180deg) translateX(80px) rotate(180deg);
            }
            8% {
                bottom: 0;
                opacity:1;
                -webkit-transform: scale3d(1,1,1) rotate(-180deg) translateX(80px) rotate(180deg);
                -moz-transform: scale3d(1,1,1) rotate(-180deg) translateX(80px) rotate(180deg);
            }
            11% {
                bottom: -137px;
                opacity:0;
            }
            100% {
                bottom: 30px;
                left: 60px;
                opacity:0;
            }
        }
        @-moz-keyframes anim_titles {
            0% {
                bottom: 30px;
                left: 60px;
                opacity:0;
                -moz-transform: scale3d(0.2,0.2,0.2) rotate(0deg) translateX(80px) rotate(0deg);
            }
            2% {
                bottom: 0;
                opacity:1;
                -moz-transform: scale3d(1,1,1) rotate(-180deg) translateX(80px) rotate(180deg);
            }
            8% {
                bottom: 0;
                opacity:1;
                -moz-transform: scale3d(1,1,1) rotate(-180deg) translateX(80px) rotate(180deg);
            }
            11% {
                bottom: -137px;
                opacity:0;
            }
            100% {
                bottom: 30px;
                left: 60px;
                opacity:0;
            }
        }

        .slides ul li div {
            position:absolute;
            width: 300px;
            /* css3 animation */
            -webkit-animation-name: anim_titles;
            -webkit-animation-duration: 54.0s;
            -webkit-animation-timing-function: ease-out;
            -webkit-animation-iteration-count: infinite;
            -webkit-animation-direction: normal;
            -webkit-animation-delay: 0;
            -webkit-animation-play-state: running;
            -webkit-animation-fill-mode: forwards;

            -moz-animation-name: anim_titles;
            -moz-animation-duration: 54.0s;
            -moz-animation-timing-function: ease-out;
            -moz-animation-iteration-count: infinite;
            -moz-animation-direction: normal;
            -moz-animation-delay: 0;
            -moz-animation-play-state: running;
            -moz-animation-fill-mode: forwards;
        }
        .slides ul li div img {
            display: block;
            margin: 0 auto;

        }