---
layout: home
title: Yoga
id: home
---

<div class="gridBlock alternateColor">
  <h3>C</h3>
  <div class="blockElement twoByGridBlock imageAlignSide">
    <div class="blockContent layoutsample">
      <div class="yoga sample" style="background-color: white; width: 500px; height: 120px; padding: 20px; flex-direction:row;">
        <div class="yoga" style="background-color: #97dccf; width: 80px; margin-right: 20px;"></div>
        <div class="yoga" style="background-color: #303846; flex-grow: 1; height: 25px; align-self: center;"></div>
      </div>
    </div>
    <div class="blockContent gistsample">
      <script src="https://gist.github.com/emilsjolander/40685eadad702e0227374f3e33daaa12.js"></script>
    </div>
  </div>
</div>

<div class="gridBlock">
  <h3>OBJ-C</h3>
  <div class="blockElement twoByGridBlock imageAlignSide">
    <div class="blockContent layoutsample">
      <div class="yoga sample" style="background-color: white; width: 500px; height: 300px; align-items: center; justify-content: center; padding: 20px;">
        <div class="yoga" style="background-color: #97dccf; width: 150px; height: 150px; margin-bottom: 20px;"></div>
        <div class="yoga" style="background-color: #303846; height: 25px; width: 100px;"></div>
      </div>
    </div>
    <div class="blockContent gistsample">
      <script src="https://gist.github.com/dshahidehpour/a426c443a1e02c5432b22b09c457ede0.js"></script>
    </div>
  </div>
</div>

<div class="gridBlock alternateColor">
  <h3>JAVA</h3>
  <div class="blockElement twoByGridBlock imageAlignSide">
    <div class="blockContent layoutsample">
      <div class="yoga sample" style="background-color: white; width: 500px; height: 300px; align-items: center; justify-content: center; padding: 20px;">
        <div class="yoga" style="background-color: #303846; height: 25px; width: 200px;"></div>
        <div class="yoga" style="background-color: #97dccf; width: 50px; height: 50px; position: absolute; right: 20px; top: 20px;"></div>
      </div>
    </div>
    <div class="blockContent gistsample">
      <script src="https://gist.github.com/emilsjolander/f7b9b5dc2b97577bab2f1e6e1bf80b62.js"></script>
    </div>
  </div>
</div>

<div class="gridBlock">
  <h3>C#</h3>
  <div class="blockElement twoByGridBlock imageAlignSide">
    <div class="blockContent layoutsample">
      <div class="yoga sample" style="background-color: white; width: 500px; height: 300px;">
        <div class="yoga" style="background-color: #97dccf; flex-grow: 1;"></div>
        <div class="yoga" style="background-color: #303846; margin: 20px; height: 25px; width: 300px;"></div>
      </div>
    </div>
    <div class="blockContent gistsample">
      <script src="https://gist.github.com/emilsjolander/29b91608b66d56d3df81f53101ad9d8b.js"></script>
    </div>
  </div>
</div>

<div class="gridBlock alternateColor">
  <h3>Android</h3>
  <div class="blockElement twoByGridBlock imageAlignSide">
    <div class="blockContent layoutsample">
      <div class="yoga sample" style="background-color: white; width: 500px; height: 300px; justify-content: stretch; flex-direction: column;">
        <div class="yoga" style="background-color: #97dccf; flex: 1;"></div>
        <div class="yoga" style="background-color: white; padding: 20px; flex-direction: row; align-items: center;">
          <div class="yoga" style="background-color: #97dccf; height: 50px; width: 50px;"></div>
          <div class="yoga" style="background-color: #303846; height: 25px; flex: 1; margin-left: 20px;"></div>
        </div>
      </div>
    </div>
    <div class="blockContent gistsample">
      <script src="https://gist.github.com/rspencer01/0b3e467a58ab56a23f60579ea193189f.js"></script>
    </div>
  </div>
</div>