==============================================
=            Flexslider control nav            =
==============================================*/


@media only screen and (max-width:40em) {
  .Entreprise_Resource_Planning .flex-control-nav,
  .Property_Asset_Management_System .flex-control-nav{
    bottom: 370px !important;
  }
}

.flexslider-home:hover .flex-next {
  right: 200px;
}

.flexslider-home:hover .flex-prev {
  left: 200px;
}

@media only screen and (min-width:40.063em) and (max-width:64em) {
  .Entreprise_Resource_Planning .flex-control-nav,
  .Property_Asset_Management_System .flex-control-nav{
    bottom: 250px !important;
  }
  .Entreprise_Resource_Planning .flex-control-nav,
  .Property_Asset_Management_System .flex-viewport{
    max-height: 800px !important;
  }
  .Customer .content-text{
    display: none !important;
  }
}
.Customer .content-list{
  /*margin-left: -90px;
  padding: 0 50px;*/
  margin-left: -40px;
  padding: 0 90px 0 45px;
}
@media only screen and (max-width:40em){
  .Customer .flex-control-nav{
    bottom: -50px;
  }
}

/*-----  End of Flexslider control nav  ------*/

@media only screen and (max-width:64em) {
  [class*="play-"]{
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: center;
  }
}

@media only screen and (max-width:40em) {
  .content-list {
    margin-left: 0;
  }
}

@media only screen and (min-width:40.063em) {
  .content-list {
    margin-left: -25px;
  }
}

.content-list > h1{width:49% !important;}
.content-list > p{width:49% !important;}
.content-text > p{width:80% !important;}

@media only screen and (max-width:64em) {
  .content-list > h1{display: none;}
  .content-list > p{display: none;}
}
@media only screen and (max-width:64em) {
  .content-text{
    padding-top: 20px;
  }
}
.askcust{
  float: left;
  text-align: right;
  margin-left: 130px;
  margin-top: 150px;
}
.content-text .askcust,
.content-text .img-askcust
{
  display: none !important;
}
@media only screen and (max-width:40em) {
  .askcust{
    float: left;
    text-align: right;
    margin-left: 0;
    margin-top: 0;
  }
  .img-askcust{
    margin-left: 0;
  }
}
/*========================================
=            banner home page            =
========================================*/
@media only screen and (max-width:64em) and (orientation: landscape) {
  .main-bg-image{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
  }
}
/* banner index small*/
@media only screen and (max-width:40em) {
  .play-bg-animate01,
  .play-bg-animate02,
  .play-bg-animate03,
  .play-animate01,
  .play-animate02,
  .play-animate03{
    width: 300px;
    height: 225px;
  }

  .play-bg-animate01,
  .play-animate01{
    background-image:url(../images/small/banner01animate.jpg);
  }

  .play-bg-animate02,
  .play-animate02{
    background-image:url(../images/small/banner02animate.jpg);
  }

  .play-bg-animate03,
  .play-animate03{
    background-image:url(../images/small/banner03animate.jpg);
  }

}
/* banner index medium*/
@media only screen and (min-width:40.063em) and (max-width:64em) {

  .play-bg-animate01,
  .play-animate01,
  .play-bg-animate02,
  .play-animate02,
  .play-bg-animate03,
  .play-animate03{
    width: 700px;
    height: 525px;
  }

  .play-bg-animate01{
    background-image: url('../images/medium/banner01animate.jpg');
  }
  .play-bg-animate02{
    background-image: url('../images/medium/banner02animate.jpg');
  }
  .play-bg-animate03{
    background-image: url('../images/medium/banner03animate.jpg');
  }

}


/*max width 1280*/
@media only screen and (min-width:64.063em) {
  .main-bg-image{
    background-image: url('../images/bg_1366.png');
    height: 488px;
    /*width: 1366px;*/
  }

  .play-animate01,
  .play-bg-animate01{
    background-image:url(../images/banner01animate_1366.png);
    height: 488px;
    /*width: 1366px;*/
  }

  .play-animate02,
  .play-bg-animate02{
    background-image:url(../images/banner02animate_1366.png);
    height: 488px;
    /*width: 1366px;*/
  }

  .play-animate03,
  .play-bg-animate03{
    background-image:url(../images/banner03animate_1366.png);
    height: 488px;
    /*width: 1366px;*/
  }
}

/*max width 1440*/
@media only screen and (min-width:85.438em) and (max-width:90.000em) {
  .main-bg-image{
    background-image: url('../images/bg_1440.png');
    height: 515px;
    /*width: 1440px;*/
  }

  .play-animate01,
  .play-bg-animate01{
    background-image:url(../images/banner01animate_1440.png);
    height: 515px;
    /*width: 1440px;*/
  }
  .play-animate02,
  .play-bg-animate02{
    background-image:url(../images/banner02animate_1440.png);
    height: 515px;
    /*width: 1440px;*/
  }
  .play-animate03,
  .play-bg-animate03{
    background-image:url(../images/banner03animate_1440.png);
    height: 515px;
    /*width: 1440px;*/
  }
}

/*max width 1600*/
@media only screen and (min-width:90.063em) and (max-width:100em) {
  .main-bg-image{
    background-image: url('../images/bg_1600.png');
    height: 572px;
    /*width: 1600px;*/
  }


  .play-animate01,
  .play-bg-animate01{
    background-image:url(../images/banner01animate_1600.png);
    height: 572px;
    /*width: 1600px;*/
  }
  .play-animate02,
  .play-bg-animate02{
    background-image:url(../images/banner02animate_1600.png);
    height: 572px;
    /*width: 1600px;*/
  }
  .play-animate03,
  .play-bg-animate03{
    background-image:url(../images/banner03animate_1600.png);
    height: 572px;
    /*width: 1600px;*/
  }
}

/*max width 1920*/
@media only screen and (min-width:100.063em) and (max-width:120em) {

  .main-bg-image{
    background-image: url('../images/bg_1920.png');
    height: 686px;
    /*width: 1920px;*/
  }

  .play-animate01,
  .play-bg-animate01{
    background-image:url(../images/banner01animate_1920.png);
    height: 686px;
    /*width: 1920px;*/
  }
  .play-animate02,
  .play-bg-animate02{
    background-image:url(../images/banner02animate_1920.png);
    height: 686px;
    /*width: 1920px;*/
  }
  .play-animate03,
  .play-bg-animate03{
    background-image:url(../images/banner03animate_1920.png);
    height: 686px;
    /*width: 1920px;*/
  }
}

@-webkit-keyframes playedAnimatedBanner {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes playedAnimatedBanner {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

/*-----  End of banner home page  ------*/


/*===========================================
=            Vision mission page            =
===========================================*/


/*vission mission small*/
@media only screen and (max-width:40em) {
  .play-bg-vissionmission,
  .play-vissionmission{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/vission-mission.jpg);
  }
}
/*vission mission medium*/
@media only screen and (max-width:64em) {
  .play-bg-vissionmission,
  .play-vissionmission{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/vission-mission.jpg);
  }
}

/*vission mission large*/
@media only screen and (min-width:64.063em) {
  .play-bg-vissionmission,
  .play-vissionmission{
    width: 580px;
    height: 350px;
    background-image:url(../images/vission-mission.png);
    float: right;
  }
  /*==========  vission mission keyframe  ==========*/
}
@-webkit-keyframes played-vissionmission {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-vissionmission {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}
/*-----  End of Vision mission page  ------*/


/*============================================
=            Logo philosophy page            =
=============================================*/

/*vission mission small*/
@media only screen and (max-width:40em) {
  .play-bg-logo-philosophy,
  .play-logo-philosophy{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/logo-philosophy.jpg) !important;
  }
}
/*vission mission medium*/
@media only screen and (min-width:40.063em) and (max-width:64em) {
  .play-bg-logo-philosophy,
  .play-logo-philosophy{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/logo-philosophy.jpg);
  }
}

@media only screen and (min-width:64.063em) {
  .play-bg-logo-philosophy,
  .play-logo-philosophy{
    width: 654px;
    height: 222px;
    background-image:url(../images/logo-philosophy.png);
  }
}
@-webkit-keyframes played-logo-philosophy {
   0% { background-position: 0%  0%; }
   100% { background-position: 0% -100%; }
 }

@keyframes played-logo-philosophy {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*-----  End of Logo philosophy  ------*/


/*====================================================
=            Banner Property Assets Management            =
====================================================*/

/*==========  Meter utilities  ==========*/

@media only screen and (max-width:40em) {
  .play-bg-meter_utilities,
  .play-meter_utilities{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/meter_utilitis.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64em) {
  .play-bg-meter_utilities,
  .play-meter_utilities{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/meter_utilitis.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-bg-meter_utilities,
  .play-meter_utilities{
    width: 907px;
    height: 350px;
    background-image:url(../images/meter_utilitis.png);
    background-position: 0% -4200px;
  }
}
@-webkit-keyframes played-meter_utilities {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-meter_utilities {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}
/*==========  Property management  ==========*/
@media only screen and (max-width:64em) {

  .product{
    background-image: none;
  }
  .content-list .product h1,
  .content-list .product p{
    display: none;
  }

  .content-text .product h1,
  .content-text .product p{
    margin-left: 0;
    width: 80%;
  }

}
@media only screen and (max-width:40em) {
  .play-bg-property-management,
  .play-property-management{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/property_management_system.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-bg-property-management,
  .play-property-management{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/property_management_system.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-bg-property-management,
  .play-property-management{
    width: 907px;
    height: 350px;
    background-image:url(../images/property_management_system.png);
  }
}
@-webkit-keyframes played-property-management {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-property-management {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  Call center  ==========*/
@media only screen and (max-width:40em) {
  .play-callcenter,
  .play-bg-callcenter{
    width: 300px;
    height: 280px;
    background-image:url(../images/small/call_center.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-callcenter,
  .play-bg-callcenter{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/call_center.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-callcenter,
  .play-bg-callcenter{
    width: 907px;
    height: 350px;
    background-image:url(../images/call_center.png);
    background-position:0px -2100px;
  }
}
@-webkit-keyframes played-callcenter {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-callcenter {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  Facility management  ==========*/
@media only screen and (max-width:40em) {
  .play-facility_management,
  .play-bg-facility_management{
    width: 300px;
    height: 265px;
    background-image:url(../images/small/facility_management.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-facility_management,
  .play-bg-facility_management{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/facility_management.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-facility_management,
  .play-bg-facility_management{
    width: 907px;
    height: 350px;
    background-image:url(../images/facility_management.png);
    background-position:0px -2800px;
  }
}
@-webkit-keyframes played-facility_management {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }

}

@keyframes played-facility_management {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  prospect marketing  ==========*/

@media only screen and (max-width:40em) {
  .play-prospect_marketing,
  .play-bg-prospect_marketing{
    width: 300px;
    height: 225px;
    margin-right:100px;
    background-image:url(../images/small/prospect_marketing.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-prospect_marketing,
  .play-bg-prospect_marketing{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/prospect_marketing.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-prospect_marketing,
  .play-bg-prospect_marketing{
    width: 907px;
    height: 350px;
    background-image:url(../images/prospect_marketing.png);
    background-position: 0% -2450px;
  }
}
@-webkit-keyframes played-prospect_marketing {
 0% { background-position: 0%  0%; }
 100% { background-position: 0% -100%; }
}
@keyframes played-prospect_marketing {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  Tenancy management  ==========*/
@media only screen and (max-width:40em) {
  .play-tenancy_management,
  .play-bg-tenancy_management{
    width: 300px;
    height: 255px;
    background-image:url(../images/small/tenancy_management.jpg);
  }

}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-tenancy_management,
  .play-bg-tenancy_management{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/tenancy_management.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-tenancy_management,
  .play-bg-tenancy_management{
    width: 907px;
    height: 350px;
    background-image:url(../images/tenancy_management.png);
    background-position:0px -1400px;
  }

}
@-webkit-keyframes played-tenancy_management {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}
@keyframes played-tenancy_management {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  Maintenence management ==========*/
@media only screen and (max-width:40em) {
  .play-maintenance-management,
  .play-bg-maintenance-management{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/maintenance-management.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-maintenance-management,
  .play-bg-maintenance-management{
    width: 700px;
    height: 525px;
    background-image:url(../images/medium/maintenance-management.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-maintenance-management,
  .play-bg-maintenance-management{
    width: 907px;
    height: 350px;
    margin-right: auto;
    margin-left: 0;
    background-image:url(../images/maintenance-management.png);
    background-position: 0% -350px;
  }
}
@-webkit-keyframes played-maintenance-management {
  0% { background-position: 0% 0%; }
  100% { background-position: 0% -700px; }
}
@keyframes played-maintenance-management {
  0% { background-position: 0%  0%; }
  100% { background-position: 0% -700px; }
}

/*-----  End of Properti Assets management page  ------*/

/*===================================================
=            Developer management system            =
===================================================*/


/*==========  Sales management  ==========*/
@media only screen and (max-width:40em) {
  .play-bg-sales_management,
  .play-sales_management{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/sales_management.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-bg-sales_management,
  .play-sales_management{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/sales_management.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-bg-sales_management,
  .play-sales_management{

    width: 907px;
    height: 350px;
    background-image:url(../images/sales_management.png);
    background-position:0px -12600px;
  }
}

@-webkit-keyframes played-sales_management {
  0% { background-position:0px 0px; }
  100% { background-position:0px -100%; }
}

@keyframes played-sales_management {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  Developer management  ==========*/
@media only screen and (max-width:40em) {
  .play-developer_management,
  .play-bg-developer_management{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/developer_management.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-developer_management,
  .play-bg-developer_management{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/developer_management.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-developer_management,
  .play-bg-developer_management{
    width: 907px;
    height: 350px;
    background-image:url(../images/developer_management.png);
    background-position:0px -7000px;
  }
}
@-webkit-keyframes played-developer_management {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-developer_management {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}


/*==========  Prospective buyer  ==========*/
@media only screen and (max-width:40em) {
  .play-prospecting,
  .play-bg-prospecting{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/prospecting.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-prospecting,
  .play-bg-prospecting{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/prospecting.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-prospecting,
  .play-bg-prospecting{
    width: 907px;
    height: 350px;
    background-image:url(../images/prospecting.png);
    background-position: 0% -6300px;
  }
}

@-webkit-keyframes played-prospecting {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-prospecting {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}



/*-----  End of Developer management system  ------*/


/*===========================
=            ERP            =
===========================*/

/*==========  Dashboard  ==========*/
@media only screen and (max-width:40em) {
  .play-dashboard,
  .play-bg-dashboard{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/dashboard.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-dashboard,
  .play-bg-dashboard{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/dashboard.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-dashboard,
  .play-bg-dashboard{
    width: 907px;
    height: 350px;
    background-image:url(../images/dashboard.png);
    background-position:0px -8750px;
  }
}
@-webkit-keyframes played-dashboard {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-dashboard {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}


/*==========  planning  ==========*/
@media only screen and (max-width:40em) {
  .play-enterprise_resource_planing,
  .play-bg-enterprise_resource_planing{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/enterprise_resource_planing.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-enterprise_resource_planing,
  .play-bg-enterprise_resource_planing{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/enterprise_resource_planing.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-enterprise_resource_planing,
  .play-bg-enterprise_resource_planing{
    width: 907px;
    height: 350px;
    background-image:url(../images/enterprise_resource_planing.png);
    background-position:0px -4900px;
  }
}
@-webkit-keyframes played-enterprise_resource_planing {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-enterprise_resource_planing {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}


/*==========  inventory control  ==========*/
@media only screen and (max-width:40em) {
  .play-iventory,
  .play-bg-iventory{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/iventory.jpg);
  }

}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-iventory,
  .play-bg-iventory{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/iventory.jpg);
  }

}
@media only screen and (min-width:64.063em) {
  .play-iventory,
  .play-bg-iventory{
    width: 907px;
    height: 350px;
    background-image:url(../images/iventory.png);
    background-position:0px -1400px;
  }
}
@-webkit-keyframes played-iventory {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-iventory {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}


/*==========  purchasing  ==========*/
@media only screen and (max-width:40em) {
  .play-purchasing,
  .play-bg-purchasing{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/purchasing.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-purchasing,
  .play-bg-purchasing{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/purchasing.jpg);
  }

}
@media only screen and (min-width:64.063em) {
  .play-purchasing,
  .play-bg-purchasing{
    width: 907px;
    height: 350px;
    background-image:url(../images/purchasing.png);
    background-position:0px -14700px;
  }
}
@-webkit-keyframes played-purchasing {
  0% { background-position: 0% 0%; }
  100% { background-position: 0% -100%; }
}

@keyframes played-purchasing {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  cash and bank  ==========*/
@media only screen and (max-width:40em) {
  .play-cash_and_bank,
  .play-bg-cash_and_bank{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/cash_and_bank.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-cash_and_bank,
  .play-bg-cash_and_bank{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/cash_and_bank.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-cash_and_bank,
  .play-bg-cash_and_bank{
    width: 907px;
    height: 350px;
    background-image:url(../images/cash_and_bank.png);
    background-position: 0% -2800px;
  }
}
@-webkit-keyframes played-cash_and_bank {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-cash_and_bank {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}


/*==========  account payable ==========*/
@media only screen and (max-width:40em) {
  .play-account_payable,
  .play-bg-account_payable{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/account_payable.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-account_payable,
  .play-bg-account_payable{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/account_payable.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-account_payable,
  .play-bg-account_payable{
    width: 907px;
    height: 350px;
    background-image:url(../images/account_payable.png);
    background-position: 0% -5600px;
  }
}
@-webkit-keyframes played-account_payable {
 0% { background-position: 0% 0%; }
 100% { background-position: 0% -100%; }
}

@keyframes played-account_payable {
 0% { background-position: 0%  -100%; }
 100% { background-position: 0% 0%; }
}


/*==========  account receiveable ==========*/
@media only screen and (max-width:40em) {
  .play-account_receivable,
  .play-bg-account_receivable{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/account_receivable.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-account_receivable,
  .play-bg-account_receivable{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/account_receivable.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-account_receivable,
  .play-bg-account_receivable{
    width: 907px;
    height: 350px;
    background-image:url(../images/account_receivable.png);
    background-position:0px -4900px;
  }
}
@-webkit-keyframes played-account_receivable {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-account_receivable {
  0% { background-position: 0%  0%; }
  100% { background-position: 0% 0%; }
}


/*==========  fixed asset  ==========*/
@media only screen and (max-width:40em) {
  .play-fixed-asset,
  .play-bg-fixed-asset{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/fixed-asset.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-fixed-asset,
  .play-bg-fixed-asset{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/fixed-asset.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-fixed-asset,
  .play-bg-fixed-asset{
    width: 907px;
    height: 350px;
    background-image:url(../images/fixed-asset.png);
    background-position:0px -7350px;
  }
}
@-webkit-keyframes played-fixed-asset {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}
@keyframes played-fixed-asset {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  ledger  ==========*/
@media only screen and (max-width:40em) {
  .play-general_leader,
  .play-bg-general_leader{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/general_leader.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-general_leader,
  .play-bg-general_leader{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/general_leader.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-general_leader,
  .play-bg-general_leader{
    width: 907px;
    height: 350px;
    background-image:url(../images/general_leader.png);
    background-position:0px -8050px;
  }
}
@-webkit-keyframes played-general_leader {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-general_leader {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  budget  ==========*/
@media only screen and (max-width:40em) {
  .play-budget_control,
  .play-bg-budget_control{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/budget_control.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-budget_control,
  .play-bg-budget_control{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/budget_control.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-budget_control,
  .play-bg-budget_control{
    width: 907px;
    height: 350px;
    background-image:url(../images/budget_control.png);
    background-position:0px -9450px;
  }
}
@-webkit-keyframes played-budget_control {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-budget_control {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%;}
}



/*-----  End of ERP  ------*/


/*====================================
=            Why Us value            =
====================================*/

/*==========  value our product  ==========*/
@media only screen and (max-width:40em) {
  .play-value-our_product,
  .play-bg-value-our_product{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/value-our_product.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-value-our_product,
  .play-bg-value-our_product{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/value-our_product.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-value-our_product,
  .play-bg-value-our_product{
    width: 907px;
    height: 350px;
    background-image:url(../images/value-our_product.png);
    background-position:0px -8400px;
  }
}
@-webkit-keyframes played-value-our_product {
  0% { background-position: 0% 0%; }
  100% { background-position: 0% -100%; }
}

@keyframes played-value-our_product {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  IT compnay  ==========*/
@media only screen and (max-width:40em) {
  .play-value-it-company,
  .play-bg-value-it-company{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/value-it-company.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-value-it-company,
  .play-bg-value-it-company{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/value-it-company.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-value-it-company,
  .play-bg-value-it-company{
    width: 907px;
    height: 350px;
    background-image:url(../images/value-it-company.png);
    background-position:0px -1050px;
  }
}
@-webkit-keyframes played-value-it-company {
  0% { background-position: 0% 0%; }
  100% { background-position: 0% -100%; }
}

@keyframes played-value-it-company {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}


/*==========  value best solution  ==========*/
@media only screen and (max-width:40em) {
  .play-value-best-solution,
  .play-bg-value-best-solution{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/value-best-solution.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-value-best-solution,
  .play-bg-value-best-solution{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/value-best-solution.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-value-best-solution,
  .play-bg-value-best-solution{
    width: 907px;
    height: 350px;
    background-image:url(../images/value-best-solution.png);
    background-position:0px -20px;
  }
}
@-webkit-keyframes played-value-best-solution {
  0% { background-position: 0% 350px; }
  100% { background-position: 0% 100%; }
}

@keyframes played-value-best-solution {
  0% { background-position: 0% 350px; }
  100% { background-position: 0% 100%; }
}

/*==========  value system  ==========*/
@media only screen and (max-width:40em) {
  .play-value-system,
  .play-bg-value-system{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/value-system.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-value-system,
  .play-bg-value-system{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/value-system.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-value-system,
  .play-bg-value-system{
    width: 907px;
    height: 350px;
    background-image:url(../images/value-system.png);
    background-position:0px -10150px;
  }
}
@-webkit-keyframes played-value-system {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}
@keyframes played-value-system {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}


/*==========  value we are  ==========*/
@media only screen and (max-width:40em) {
  .play-value-we_are,
  .play-bg-value-we_are{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/value-we-are.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-value-we_are,
  .play-bg-value-we_are{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/value-we-are.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-value-we_are,
  .play-bg-value-we_are{
    width: 907px;
    height: 350px;
    background-image:url(../images/value-we-are.png);
    background-position:0px -3850px;
  }
}
@-webkit-keyframes played-value-we_are {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-value-we_are {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*==========  value simple  ==========*/
@media only screen and (max-width:40em) {
  .play-value-simple,
  .play-bg-value-simple{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/value-simple.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-value-simple,
  .play-bg-value-simple{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/value-simple.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-value-simple,
  .play-bg-value-simple{
    width: 907px;
    height: 350px;
    background-image:url(../images/value-simple.png);
    background-position:0px -10150px;
  }
}

@-webkit-keyframes played-value-simple {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-value-simple {
  0% { background-position: 0%  -100%; }
  100% { background-position: 0% 0%; }
}

/*-----  End of Why Us value  ------*/


/*========================================
=            Why Us testimony            =
=========================================*/



/*-----  End of Why Us testimony  ------*/


/*==========================================
=            Why us Methodology            =
==========================================*/

@media only screen and (max-width:40em) {
  .play-methodology_animate,
  .play-bg-methodology_animate{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/methodology_animate.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-methodology_animate,
  .play-bg-methodology_animate{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/methodology_animate.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-methodology_animate,
  .play-bg-methodology_animate{
    width: 907px;
    height: 350px;
    background-image:url(../images/methodology_animate.png);
    background-position:0px -11200px;
  }
}
@-webkit-keyframes played-methodology_animate {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}
@keyframes played-methodology_animate {
  0% { background-position: 0% -100%;}
  100% { background-position: 0% 0%;}
}

/*-----  End of Why us Methodology  ------*/


/*==========================================
=            Service Custom Dev            =
==========================================*/
@media only screen and (max-width:40em) {
  .play-custome_developer,
  .play-bg-custome_developer{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/custome_developer.jpg);
  }
}

@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-custome_developer,
  .play-bg-custome_developer{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/custome_developer.jpg);
  }
}

@media only screen and (min-width:64.063em) {
  .play-custome_developer,
  .play-bg-custome_developer{
    width: 907px;
    height: 350px;
    background-image:url(../images/custome_developer.png);
    background-position:0px -5250px;
  }
}
@-webkit-keyframes played-custome_developer {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}
@keyframes played-custome_developer {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}



/*-----  End of Service Custom Dev  ------*/


/*============================================
=            Service Intergration            =
============================================*/
@media only screen and (max-width:40em) {
  .play-system_integrator,
  .play-bg-system_integrator{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/system_integrator.jpg);
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-system_integrator,
  .play-bg-system_integrator{
    width: 700px;
    height: 525px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/system_integrator.jpg);
  }
}
@media only screen and (min-width:64.063em) {
  .play-system_integrator,
  .play-bg-system_integrator{
    width: 907px;
    height: 350px;
    background-image:url(../images/system_integrator.png);
    background-position:0px -3500px;
  }
}
@-webkit-keyframes played-system_integrator {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-system_integrator {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}



/*-----  End of Service Intergration  ------*/


/*=================================
=            Placement            =
=================================*/
@media only screen and (max-width:40em) {
  .play-resource_placement,
  .play-bg-resource_placement{
    width: 300px;
    height: 225px;
    background-image:url(../images/small/resource_placement.jpg);
  }
  .resource_placement .content-list{
    margin-left: -10px !important;
  }
}
@media only screen and (min-width:40.063em) and (max-width:64.063em) {
  .play-resource_placement,
  .play-bg-resource_placement{
    width: 907px;
    height: 350px;
    margin-right: auto;
    margin-left: auto;
    background-image:url(../images/medium/resource_placement.jpg);
  }
  .resource_placement .content-list{
    margin-left: -100px !important;
  }
}
@media only screen and (min-width:64.063em) {
  .play-resource_placement,
  .play-bg-resource_placement{
    width: 907px;
    height: 350px;
    background-image:url(../images/resource_placement.png);
    background-position:0px -1400px;
  }
}
@-webkit-keyframes played-resource_placement {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

@keyframes played-resource_placement {
  0% { background-position: 0% -100%; }
  100% { background-position: 0% 0%; }
}

/*-----  End of Placement  ------*/


/* /media queri animation */
@media screen and (min-width:64.063em){
  .play-bg-vissionmission,
  .play-vissionmission{
    -webkit-animation: played-vissionmission 10.0s steps(10) infinite;
            animation: played-vissionmission 10.0s steps(10, start) infinite;
  }

  .play-animate01,
  .play-bg-animate01{
    -webkit-animation-name: playedAnimatedBanner;
            animation-name: playedAnimatedBanner;
    -webkit-animation-duration: 12s;
            animation-duration: 12s;
    -webkit-animation-timing-function: steps(11,end);
            animation-timing-function: steps(11,start);
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
  }

  .play-animate02,
  .play-bg-animate02{
    -webkit-animation-name: playedAnimatedBanner;
            animation-name: playedAnimatedBanner;
    -webkit-animation-duration: 12s;
            animation-duration: 12s;
    -webkit-animation-timing-function: steps(12,end);
            animation-timing-function: steps(12,start);
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
  }

  .play-animate03,
  .play-bg-animate03{
    -webkit-animation-name: playedAnimatedBanner;
            animation-name: playedAnimatedBanner;
    -webkit-animation-duration: 12s;
            animation-duration: 12s;
    -webkit-animation-timing-function: steps(12,end);
            animation-timing-function: steps(12,start);
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
  }

  .play-bg-logo-philosophy,
  .play-logo-philosophy{
    -webkit-animation: played-logo-philosophy 6.0s steps(11) infinite;
            animation: played-logo-philosophy 6.0s steps(11, start) infinite;
  }

  .play-value-it-company,
  .play-bg-value-it-company{
    -webkit-animation: played-value-it-company 3.0s steps(2) infinite;
            animation: played-value-it-company 3.0s steps(2, start) infinite;
  }

  .play-value-best-solution,
  .play-bg-value-best-solution{
    -webkit-animation: played-value-best-solution 8.0s steps(15, start) infinite;
            animation: played-value-best-solution 8.0s steps(15, start) infinite;
  }

  .play-value-system,
  .play-bg-value-system{
    -webkit-animation: played-value-system 8.0s steps(5) infinite;
            animation: played-value-system 8.0s steps(5, start) infinite;
  }

  .play-value-we_are,
  .play-bg-value-we_are{
    -webkit-animation: played-value-we_are 8.0s steps(10) infinite;
            animation: played-value-we_are 8.0s steps(10, start) infinite;
  }

  .play-value-simple,
  .play-bg-value-simple{
    -webkit-animation: played-value-simple 8.0s steps(28) infinite;
            animation: played-value-simple 8.0s steps(28, start) infinite;
  }

  .play-value-our_product,
  .play-bg-value-our_product{
    -webkit-animation: played-value-our_product 14.0s steps(23) infinite;
            animation: played-value-our_product 14.0s steps(23, start) infinite;
  }

  .play-property-management,
  .play-bg-property-management{
    -webkit-animation: played-property-management 8.0s steps(2) infinite;
            animation: played-property-management 8.0s steps(2, start) infinite;
  }
  .play-faq,
  .play-bg-faq{
    -webkit-animation: played-property-management 8.0s steps(9) infinite;
            animation: played-property-management 8.0s steps(9, start) infinite;
  }
  .play-callcenter,
  .play-bg-callcenter{
    -webkit-animation: played-callcenter 8.0s steps(5) infinite;
            animation: played-callcenter 8.0s steps(5, start) infinite;
  }
  .play-maintenance-management,
  .play-bg-maintenance-management{
    -webkit-animation: played-maintenance-management 3.0s steps(2) infinite;
            animation: played-maintenance-management 3.0s steps(2, start) infinite;
  }
  .play-prospect_marketing,
  .play-bg-prospect_marketing{
    -webkit-animation: played-prospect_marketing 8.0s steps(6) infinite;
            animation: played-prospect_marketing 8.0s steps(6, start) infinite;
  }
  .play-facility_management,
  .play-bg-facility_management{
    -webkit-animation: played-facility_management 8.0s steps(9) infinite;
            animation: played-facility_management 8.0s steps(9, start) infinite;
  }
  .play-tenancy_management,
  .play-bg-tenancy_management{
    -webkit-animation: played-tenancy_management 8.0s steps(3) infinite;
            animation: played-tenancy_management 8.0s steps(3, start) infinite;
  }
  .play-meter_utilities , .play-bg-meter_utilities{
    -webkit-animation: played-meter_utilities 8.0s steps(11) infinite;
            animation: played-meter_utilities 8.0s steps(11, start) infinite;
  }
  .play-prospecting , .play-bg-prospecting{
   -webkit-animation: played-prospecting 8.0s steps(17) infinite;
           animation: played-prospecting 8.0s steps(17, start) infinite;
 }
 .play-sales_management, .play-bg-sales_management{
  -webkit-animation: played-sales_management 25.0s steps(35) infinite;
          animation: played-sales_management 25.0s steps(35, start) infinite;
}
.play-account_payable , .play-bg-account_payable{
  -webkit-animation: played-account_payable 8.0s steps(15) infinite;
          animation: played-account_payable 8.0s steps(15, start) infinite;
}
.play-budget_control , .play-bg-budget_control{
  -webkit-animation: played-budget_control 8.0s steps(26) infinite;
          animation: played-budget_control 8.0s steps(26, start) infinite;
}
.play-cash_and_bank , .play-bg-cash_and_bank{
  -webkit-animation: played-cash_and_bank 8.0s steps(4) infinite;
          animation: played-cash_and_bank 8.0s steps(4, start) infinite;
}
.play-enterprise_resource_planing, .play-bg-enterprise_resource_planing {
  -webkit-animation: played-enterprise_resource_planing 8.0s steps(13) infinite;
          animation: played-enterprise_resource_planing 8.0s steps(13, start) infinite;
}
.play-fixed-asset, .play-bg-fixed-asset {
  -webkit-animation: played-fixed-asset 8.0s steps(20) infinite;
          animation: played-fixed-asset 8.0s steps(20, start) infinite;
}
.play-general_leader, .play-bg-general_leader {
  -webkit-animation: played-general_leader 15.0s steps(22) infinite;
          animation: played-general_leader 15.0s steps(22, start) infinite;
}
.play-purchasing , .play-bg-purchasing{
  -webkit-animation: played-purchasing 15.0s steps(41) infinite;
          animation: played-purchasing 15.0s steps(41, start) infinite;
}
.play-custome_developer , .play-bg-custome_developer{
  -webkit-animation: played-custome_developer 8.0s steps(14) infinite;
          animation: played-custome_developer 8.0s steps(14, start) infinite;
}
.play-resource_placement , .play-bg-resource_placement{
  -webkit-animation: played-resource_placement 8.0s steps(3) infinite;
          animation: played-resource_placement 8.0s steps(3, start) infinite;
}
.play-system_integrator, .play-bg-system_integrator {
  -webkit-animation: played-system_integrator 8.0s steps(9) infinite;
          animation: played-system_integrator 8.0s steps(9, start) infinite;
}
.play-banner_01_animate {
  -webkit-animation: played-banner_01_animate 8.0s steps(4) infinite;
          animation: played-banner_01_animate 8.0s steps(4, start) infinite;
}
.play-banner_02_animate {
  -webkit-animation: played-banner_02_animate 8.0s steps(4) infinite;
          animation: played-banner_02_animate 8.0s steps(4, start) infinite;
}
.play-banner_03_animate {
  -webkit-animation: played-banner_03_animate 8.0s steps(4) infinite;

          animation: played-banner_03_animate 8.0s steps(4, start) infinite;
}
.play-ask_your_customer, .play-bg-ask_your_customer{
  -webkit-animation: played-ask_your_customer 8.0s steps(1) infinite;
          animation: played-ask_your_customer 8.0s steps(1, start) infinite;
}
.play-developer_management, .play-bg-developer_management {
  -webkit-animation: played-developer_management 8.0s steps(19) infinite;
          animation: played-developer_management 8.0s steps(19, start) infinite;
}
.play-account_receivable, .play-bg-account_receivable {
  -webkit-animation: played-account_receivable 6.0s steps(15) infinite;
          animation: played-account_receivable 6.0s steps(15, start) infinite;
}
.play-methodology_animate, .play-bg-methodology_animate {
  -webkit-animation: played-methodology_animate 10.0s steps(31) infinite;
          animation: played-methodology_animate 10.0s steps(31, start) infinite;
}
.play-benefit, .play-bg-benefit {
  -webkit-animation: played-benefit 8.0s steps(2) infinite;
          animation: played-benefit 8.0s steps(2, start) infinite;
}
.play-iventory , .play-bg-iventory{
  -webkit-animation: played-iventory 8.0s steps(3) infinite;
          animation: played-iventory 8.0s steps(3, start) infinite;
}
.play-dashboard , .play-bg-dashboard{
  -webkit-animation: played-dashboard 15.5s steps(24) infinite;
          animation: played-dashboard 15.5s steps(24, start) infinite;
}

}/* /media queri animation