
<% include ../partials/header %>

<div class="container">
  <header class="jumbotron">
    <div class="container">
      <h1>Welcome to your classroom</h1>
      <p>View your subjects classes</p>
      <p>
        <a class="btn btn-primary btn-large" href="/campgrounds/new">New Class</a>
      </p>
    </div>
  </header>



  

    <div class="row" style="display:flex; flex-wrap: wrap;">

    <% campgrounds.forEach(function(campground){ %>
      <div class="col-md-4 col-sm-6">
        <div class="thumbnail" >
          <span>
              <img src="<%= campground.image %>" id="index_images">
              <div class="caption text-center">
                <h4><%= campground.name %></h4>
                <p>
                  <a href="/campgrounds/<%= campground._id %>" class="btn btn-primary">More Info</a>
                </p>
              </div>
          </span>
        </div>
      </div>
    <% }); %>

  </div>



</div>

<% include ../partials/footer %>