SERVICESの下にある、スコアのようなものが書かれているデザインをコーディングします。
1.大まかなBOXを組む
カウンターのエリアでは4つのボックスが横並びになっています。
それに合わせてグリッドを組んでいきましょう。
こちらもヒーローエリアと同じように背景画像が固定なので、cssで設定します。

2.アイコンやテキストを配置
col-sm-3
を適応したdivの中にアイコンとテキストを入れていきます。
アイコンを円で囲ったデザインは「SERVICES」エリアで使用した.ico-circle
クラスのcssを一部変更(アレンジ)して使用します。
オリジナルcssを設定するのはcounter-box
、 ico-circle
、counter
クラス の3つ。
セレクタを.counter-box .ico-circle
とすることで「counter-boxクラスの要素の中にあるico-circleクラスは」と限定した形のスタイル指定になります。
ブラウザで表示を確認してみましょう。
設定したスタイルが効いていればOKです。
3.コピーして他3つも作成
一つのカウンターアイテムが出来たら、それをコピーして他3つを仕上げていきます。 ブラウザで確認してきれいに4つ並んでいれば完成です。