/*tem20-service*/
.tem20-service{text-align:left;}
.tem20-service .service-box{overflow:hidden;width:100%;padding:60px 0;}
.tem20-service .service-box a{color:#fff;}
.tem20-service .text{transition:all 0.6s ease-out;}
.tem20-service .title{font-size:17px;height:22px;line-height:22px;overflow:hidden;margin:0;white-space:nowrap;text-overflow:ellipsis;transition:all 0.4s ease-in 0s;}
.tem20-service .description{display:block;font-size:12px;margin-top:10px;line-height:20px;font-weight:normal;height:40px;overflow:hidden;opacity:.93;}
.tem20-service .icon{font-size:50px;}
@media (min-width:769px){
    .tem20-service .service-box:hover::before{top:0;}
    .tem20-service .service-box:hover .text{transform:translateX(25px);}
}
@media (max-width:768px){
    .tem20-service .container,
    .tem20-service.full-screen-spacing .container.full-screen{padding-left: 3%!important;padding-right: 3%!important}
    .tem20-service .service-box{margin:0;padding: 0;}
    .tem20-service .icon{font-size:30px;margin:10px 0;}
    .tem20-service .description{margin-top: 6px;height: auto;}
    .tem20-service .service-box a{padding:3% 0;display: flex;display: -webkit-flex;}
    .tem20-service .service-box .col-xs-3{flex-shrink: 0;width:auto!important;}
    .tem20-service .service-box .col-xs-9{padding:0 0 0 5%!important;width: 100%!important;}
    .tem20-service .title{white-space: normal;}
}
@media (max-width:480px){
    .tem20-service .service-box .col-xs-3,
    .tem20-service .service-box .col-xs-9{width:100%;max-width: 100%;text-align: left;}
    .tem20-service .icon{font-size: 1.75rem;margin-bottom: 10px;display: block;}
}
