tutorial.html

---
title: Tutorial
layout: default
style: tutorial
permalink: /tutorials/
---

<a name="top"></a>
<div class="team-reg mdl-typography--text-justify" style="margin-bottom: 0;">
	<div class="mdl-grid" style="padding-bottom: 0;">
	    <div class="mdl-cell mdl-cell--2-offset-desktop mdl-cell--8-col mdl-cell--8-col-tablet mdl-cell--4-col-phone" >
	    	<center><h1 class="evnt-tit">TUTORIALS</h1></center>
	    </div>
	</div>
	</div>
<div class="tut-section mdl-typography--text-justfiy">
	
  <div class="tut-grid mdl-grid">
  	<div class="mdl-cell mdl-cell--2-col mdl-cell--0-col-tablet mdl-cell--0-col-phone"></div>
  	{% assign count = 0 %}
  	{% for tut in site.data.tutorials %}
  	{% assign count = count | plus:1 %}
    <div class="mdl-cell mdl-cell--2-col mdl-cell--2-col-tablet mdl-cell--4-col-phone">
		<a class="tut-card mdl-card" href="{{ tut.link }}">
			<div class="mdl-card__title mdl-shadow--2dp" style="background-color:  #46B6AC;">
				<h2 class="mdl-card__title-text">{{ tut.name }}</h2>
			</div>
			<div class="tut-details mdl-card__supporting-text">
				<!-- <center> -->
				<table class="mdl-data-table mdl-js-data-table " style="width: 100%">
				  <tr><td class="mdl-data-table__cell--non-numeric">{{ tut.one }}</td></tr>
				  <tr><td class="mdl-data-table__cell--non-numeric">{{ tut.two }}</td></tr>
				  <tr><td class="mdl-data-table__cell--non-numeric">{{ tut.three }}</td></tr>
				</table>
				<!-- </center> -->
			</div>
		</a>
    </div>
    {% if count == 4 %}
    	<div class="mdl-cell mdl-cell--2-col mdl-cell--0-col-tablet mdl-cell--0-col-phone"></div>
    	<div class="mdl-cell mdl-cell--2-col mdl-cell--0-col-tablet mdl-cell--0-col-phone"></div>
    	{% assign count = 0 %}
    {% endif %}
    {% endfor %}
  </div>
</div>