.why { padding: 30px 10px 10px; position: relative; counter-reset: why-section; }
.why:before { content: ''; position: absolute; left: -900px; right: -900px; top: 0; bottom: 0; background-color: rgba(41, 170, 184,.1) }
.why h2 { text-align: center;  }
.why ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; position: relative; z-index: 2; list-style: none; color: #fff; }
.why ul li { max-width: 240px; -webkit-box-flex: 1; -ms-flex: 1 1 33%; flex: 1 1 33%; padding: 0; margin: 10px; width: 100%; overflow: visible; color: #000; line-height: 1.2;text-align: center; }
.why ul li:before { content: ''; position: relative; z-index: 2; display: block; margin: 0 auto 10px; counter-increment: why-section; content: counter(why-section); font-size: 30px; color: #fff; border-radius: 50%; height: 50px; width: 50px; line-height: 50px; background-color: rgba(41, 170, 184,.3); color: #000;}
@media (max-width: 730px) { .why ul { -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0; }
  .why ul li { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } }