#services{margin: 0 auto;  width:100%; max-width:1280px;}
 
.service-box{width: 100%;height: 300px;overflow: hidden;position: relative;-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-o-transition: all 300ms linear;-ms-transition: all 300ms linear;transition: all 300ms linear;padding: 20px;margin: 20px auto; background-color:#F2F3F3;}
.service-box .wrap{text-align: left;width: 100%;height: 100%;display: block;color: #333;position: relative;}
.service-box .wrap span{color: #2C909E;font-size: 75px;text-shadow: 1px 0px 1px rgba(255,255,255,0.7);line-height: 130px;position: absolute;width: 100%;height: 50%;left: 0px;top: 0px;text-align: center;-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-o-transition: all 300ms linear;-ms-transition: all 300ms linear;transition: all 300ms linear;}
.service-box .wrap .content{position: absolute;left: 0px;width: 100%;height: 50%;top: 50%;}
.service-box .wrap .content h4{text-align: center;color: #555;-webkit-transition: all 200ms linear;-moz-transition: all 200ms linear;-o-transition: all 200ms linear;-ms-transition: all 200ms linear;transition: all 200ms linear;}
.service-box .wrap .content p{text-align:center;color: #555;-webkit-transition: all 200ms linear;-moz-transition: all 200ms linear;-o-transition: all 200ms linear;-ms-transition: all 200ms linear;transition: all 200ms linear;}
.service-box:hover{background: rgba(255,163,0,1);}
.service-box:hover .wrap span{font-size: 100px;color: #FFF;-webkit-animation: moveFromLeft 400ms ease;-moz-animation: moveFromLeft 400ms ease;-ms-animation: moveFromLeft 400ms ease;}
.service-box:hover .wrap h4{color: #FFF;-webkit-animation: moveFromRight 300ms ease;-moz-animation: moveFromRight 300ms ease;-ms-animation: moveFromRight 300ms ease;}
.service-box:hover .wrap p{color: #FFF;-webkit-animation: moveFromBottom 500ms ease;-moz-animation: moveFromBottom 500ms ease;-ms-animation: moveFromBottom 500ms ease;}