.wdk-dashwidget-element .dash-widgets-statistics-usage { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; margin-left: -5px; margin-right: -5px; .stat-card { font-size: 13px; text-decoration: none; padding: 15px 15px; display: inline-flex; border: 1px solid #eee; margin: 5px 5px; align-items: center; flex: 1 2 150px; transition: all .35s; background: linear-gradient(to right,#0ac282,#0df3a3); color: #fff; border-radius: 5px; -webkit-box-shadow: 0 1px 20px 0 rgba(69,90,100,.08); box-shadow: 0 1px 20px 0 rgba(69,90,100,.08); &.red { background: -webkit-gradient(linear,left top,right top,from(#fe5d70),to(#fe909d)); background: linear-gradient(to right,#fe5d70,#fe909d); background-color: rgba(0, 0, 0, 0); background-clip: border-box; } &.orange { background: -webkit-gradient(linear,left top,right top,from(#fe9365),to(#feb798)); background: linear-gradient(to right,#fe9365,#feb798); background-color: rgba(0, 0, 0, 0); background-clip: border-box; } &.blue { background: -webkit-gradient(linear,left top,right top,from(#01a9ac),to(#01dbdf)); background: linear-gradient(to right,#01a9ac,#01dbdf); background-color: rgba(0, 0, 0, 0); background-clip: border-box; } &.active, &:not(.nohover):hover { box-shadow: inset 0 0 40px 2px #00000052; } .side { width: 40px; flex: 0 0; font-size: 20px; } .body { flex: 1 2 auto; .count { margin-bottom: 5px; font-size: 30px; line-height: 32px; font-family: inherit; font-weight: 500; } .title { font-weight: 500; } } border: 1px solid #eee; } @media(max-width:767px) { } }