Fade In Right Animation Effect with CSS

CSS Code:

           .wrapper
            {
                text-align: center;
                width: 800px;
                margin: auto;
                font-family: Muli !important;
            }
            img{
                width: 100%;
            }
            p{
                font-size: 16px;
            }
            .item{
                display: inline-block;
                width: 21%;
                border: 1px solid silver;
                height: 288px;
                vertical-align: top;
                padding: 12px;
            }
            .animated{
                -webkit-animation-duration:1s;
                animation-duration:1s;
                -webkit-animation-fill-mode:both;
                animation-fill-mode:both
            }

            @-webkit-keyframes fadeInRight{
                0%{
                    opacity:0;
                    -webkit-transform:translateX(200px);
                    transform:translateX(200px)
                }
                100%{
                    opacity:1;
                    -webkit-transform:translateX(0);
                    transform:translateX(0)
                }
            }
            @keyframes fadeInRight{
                0%{
                    opacity:0;
                    -webkit-transform:translateX(200px);
                    -ms-transform:translateX(200px);
                    transform:translateX(200px)
                }
                100%{
                    opacity:1;
                    -webkit-transform:translateX(0);
                    -ms-transform:translateX(0);
                    transform:translateX(0)
                }
            }
            .fadeInRight{
                -webkit-animation-name:fadeInRight;
                animation-name:fadeInRight
            }

HTML Code:

<div class="wrapper">
              
            <!-- item -->
            <div class="item animated fadeInRight">
                <img src="logo.png" alt=""  />
                <h3>Web Designing</h3>

                <p>Our designers offer services to small to mid size, and High level companies to expand their business</p>
            </div>
            <!-- End item -->

            <!-- item -->
            <div class="item animated fadeInRight">
                <img src="logo.png" alt=""  />
                <h3>Web Development</h3>

                <p>Our development team has efficiency to achieve the output specifically to meet up your requirements and your adequate level.</p>
            </div>
            <!-- End item -->

            <!-- item -->
            <div class="item animated fadeInRight">
                <img src="logo.png" alt=""  />
                <h3>Mobile App Development</h3>

                <p>Our dedicated mobile app experts are creative and familiar to accomplish your requirements as well as your business needs in cost-effective approach.</p>
            </div>
            <!-- End item -->

            <!-- item -->
            <div class="item animated fadeInRight">
                <img src="logo.png" alt="" />
                <h3>Software Development</h3>

                <p>Our Highly skilled software Developers offers services to small to mid size, and High level companies in cost effective approach.</p>
            </div>
            <!-- End item -->
        </div>