The website of Ura Design
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

138 lines
4.1 KiB

---
layout: default
section_id: pages
---
<div class="full light-grey centered-text tree">
<div class="four spacing"></div>
<div class="section-title">
<div class="row">
<div class="medium-10 medium-centered columns">
<h1 class="wow slideInUp">About</h1>
</div>
</div>
</div>
</div>
<div class="full">
<div class="section-title">
<div class="row">
<div class="medium-10 medium-centered columns">
<h2>The team</h2>
<p>We are happy to work together</p>
</div>
</div>
</div>
<div class="row">
{% for member in page.members %}
<div class="large-3 columns">
<div class="member">
<img src="{{site.url}}/{{member.avatar}}" alt="">
<img class="colored" src="{{site.url}}/{{member.avatar_hover}}" alt="">
<div class="member-info">
<h4>{{member.name}}</h4>
<p class="position">{{member.position}}</p>
<ul class="socials">
{% for social in member.socials %}
<li><a href="{{social.url}}"><i class="fa fa-{{social.name}}"></i></a></li>
{% endfor %}
</ul>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
<div class="full light-grey">
<div class="section-title">
<div class="row">
<div class="medium-10 medium-centered columns">
<h2>Our skills</h2>
<p>We work to improve our skills</p>
</div>
</div>
</div>
<div class="row">
<div class="medium-6 columns">
<div class='mod modBarGraph'>
<ul class='bars'>
{% for skill in page.skills_left %}
<li>
<h4>{{skill.title}}<strong>{{skill.percent}}%</strong></h4>
<p class="highlighted" data-percent="{{skill.percent}}"></p>
</li>
{% endfor %}
</ul>
</div>
</div>
<div class="medium-6 columns">
<div class='mod modBarGraph'>
<ul class='bars'>
<ul class='bars'>
{% for skill in page.skills_right %}
<li>
<h4>{{skill.title}}<strong>{{skill.percent}}%</strong></h4>
<p class="highlighted" data-percent="{{skill.percent}}"></p>
</li>
{% endfor %}
</ul>
</ul>
</div>
</div>
</div>
</div>
<div class="full">
<div class="section-title">
<div class="row">
<div class="medium-10 medium-centered columns">
<h2>Testimonials</h2>
<p>We are happy to work with our clients and let thme happy</p>
</div>
</div>
</div>
<div class="row">
<div class="large-6 columns">
{% for testimonial in page.testimonials_left %}
<div class="quote wow slideInLeft" data-wow-delay="{{ 0.2 | times:forloop.index0 }}s">
<div class="row">
<div class="small-3 columns">
<img src="{{testimonial.avatar}}" alt="auhor">
</div>
<div class="small-9 columns">
<p>{{testimonial.content}}</p>
<p class="author">{{testimonial.author}}</p>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="large-6 columns">
{% for testimonial in page.testimonials_right %}
<div class="quote reverse wow slideInRight" class="wow" data-wow-delay="{{ 0.2 | times:forloop.index0 }}s">
<div class="row">
<div class="small-3 columns">
<img src="{{testimonial.avatar}}" alt="auhor">
</div>
<div class="small-9 columns">
<p>{{testimonial.content}}</p>
<p class="author">{{testimonial.author}}</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
<div class="full light-grey no-padding">
<div class="two spacing"></div>
<div class='row'>
<div class='large-12 columns'>
<div class='clients'>
{% for client in page.clients %}
<div><a href="#"><img alt="" src="{{site.url}}/{{client.image}}"></a></div>
{% endfor %}
</div>
</div>
</div>
<div class="two spacing"></div>
</div>