.livedemo-wrapper{height:400px;width:100%;padding:30px 0}.livedemo{height:350px;max-width:1170px;margin:25px auto}.livedemo-box{width:33%;height:306px;float:left;margin-left:2px;margin-top:20px}.livedemo-boxer{width:308px;text-align:center;margin:auto;height:306px;position:relative}.livedemo-boxer:before,.livedemo-boxer:after{content:'';position:absolute;width:calc(100% - 35px);height:calc(100% - 35px);border:1px solid #e5e7e9;pointer-events:none;transition:.33s all ease}.livedemo-boxer:before{top:0;left:0;border-width:1px 0 0 1px}.livedemo-boxer:after{bottom:0;right:0;border-width:0 1px 1px 0}.livedemo-boxer img{margin-top:55px;width:55px;height:55px;transition:.33s all ease;margin-bottom:5px}.livedemo-text1{font-size:19px;font-weight:bold;transition:.33s all ease}.livedemo-text2{font-size:14px;color:#9f9f9f;width:255px;margin:auto;transition:.33s all ease;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}.livedemo-line{width:49px;height:2px;max-width:100%;margin:13px auto;transition:.33s all ease;background:#93c83f}.livedemo-boxer:hover .livedemo-line{width:168px;margin-bottom:30px}.livedemo-boxer:hover img{margin-top:45px}.livedemo-boxer:hover:after{width:306px;height:304px;border-color:#93c83f}.livedemo-boxer:hover:before{width:306px;height:304px;border-color:#93c83f}@media(min-width:480px)and (max-width:990px){.livedemo-wrapper{height:790px;padding:0}.livedemo-box{width:100%;height:240px}.livedemo-boxer{max-width:445px;height:220px;width:auto}.livedemo-boxer img{margin-top:30px}.livedemo-boxer:hover img{margin-top:20px}.livedemo-boxer:hover:after{width:443px;height:219px;border-color:#93c83f}.livedemo-boxer:hover:before{width:443px;height:219px;border-color:#93c83f}}@media(min-width:320px)and (max-width:480px){.livedemo-wrapper{height:790px;padding:0;min-width:350px}.livedemo{height:350px;max-width:1170px;margin:25px auto;padding:0 20px}.livedemo-box{width:100%;height:240px;margin-left:-3px}.livedemo-boxer{max-width:445px;height:220px;width:auto}.livedemo-boxer img{margin-top:30px}.livedemo-boxer:hover img{margin-top:20px}.livedemo-boxer:hover:after{width:99.8%;height:219px;border-color:#93c83f}.livedemo-boxer:hover:before{width:99.8%;height:219px;border-color:#93c83f}}