<div class="lists">
<span>Wybierz urządzenie:</span>
</div>
<div class="machine-list">
	<div class="row row-list">
		<div class="col-md-3 col-xs-3">
			<button class="room-button" style="color: green; border-color: green;">
				PLAYSTATION
			</button>
		</div>
		<div class="col-md-3 col-xs-3">
			<button class="room-button">
				PIŁKARZYKI 1
			</button >
		</div>
		<div class="col-md-3 col-xs-3">
			<button class="room-button">
				PIŁKARZYKI 2
			</button>
		</div>
		<div class="col-md-3 col-xs-3">
			<button class="room-button">
				DART
			</button>
		</div>
		
	</div>
	</div>










<div class="row machine-row">
  <div class="col-md-5  col-xs-11">
    <p class="text-center machine-text">
      - <span>Playstation</span> -
    </p>
  
    <p class="machine-status">
      Status: <img  src="../assets/img/busy.png" alt="{{status}}">
      <span>Zajęte</span>
    </p>
      <p class="machine-status2">
          Zajęte od: <span>23 min</span>

      </p>
     
  </div>
  <div class="col-md-7 col-xs-1">
   <img  class="machine-image" src="../assets/img/football2.jpg" alt="{{status}}">
  </div>
</div>
<div class="row statistics-row">
  <div class="col-md-6 stat-wrapper">
    <p class="stat-text">
      <span>Statystyki szczegółowe:</span>
    </p>
    <ul class="list-group">
       
           <p style="margin-bottom:15px"> <span>Średni czas gry: </span>  <span class="boldMe">23</span><span> min</span><br/></p>

            <span>Przewidywane zakończenie: </span>  <span class="boldMe">10</span><span> min</span>
       
    </ul>
  </div>
</div>
  <div class="row">
      <div id="tabel" class="col-md-6">
      <canvas id="lineChart"></canvas>
    </div>
    <div id="tabel" class="col-md-6">
      <canvas id="barChart"></canvas>
    </div>
 </div>