Не работают стили

HTML:

1. <div class="container">
2.     <div class="row">
3.         @foreach($rooms as $room)
4.         <div class="col-4">
5.             <div class="card">
6.                 <div class="card-body">
7.                     <div class="card-title">
8.                         <h4>{{ $room->name }}</h4>
9.                     </div>
10.                     <div class="card-img" style="background-image: url({{ $room->image ?? asset('img/default.jpg') }})"></div>
11.                     <p class="card-text">{{ $room->description }}</p>
12.                 </div>
13.                 <ul class="list-group list-group-flush">
14.                     <li class="list-group-item">Площадь: {{ $room->square }} кв.м.</li>
15.                     <li class="list-group-item">Стоимость: {{ $room->rent_price }} руб/мес</li>
16.                 </ul>
17.                 <a href="" class="btn btn-outline-primary">Дополнительно</a>
18.             </div>
19.         </div>
20.         @endforeach
21.     </div>
22.     {{ $rooms->links() }}
23. </div>

Код (CSS):

1. .card {
2.     margin-bottom: 10px;
3. }
4. .card-img {
5.     height: 200px;
6.     background-position: center center;
7.     -webkit-background-size: cover;
8.     background-size: cover;
9.     background-repeat: no-repeat;
10. }

Должна отображаться картинка по дефолту, но ее нет. Дополнительно не работают отступы

 

в упор не вижу. Подсветку-то видно что что-то не так, а вот в видеоуроке вроде бы один в один, но у автора работает. Покажите плиз пальцем