Update services.html

services.html

@@ -3,43 +3,34 @@ layout: default
 section_id: pages
 services:
 - title: Branding
-  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vitae,
+  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-    expedita obcaecati, commodi distinctio accusamus mollitia ratione ipsam cupiditate
+  icon: icon-basic-bolt
-    odio ea.
+- title: Development
-  image: images/@stock/service-3.jpg
+  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-  image_position: left
+  icon: icon-basic-laptop
-- title: Website
+- title: Web Design
-  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vitae,
+  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-    expedita obcaecati, commodi distinctio accusamus mollitia ratione ipsam cupiditate
+  icon: icon-basic-mouse
-    odio ea.
+- title: Marketing
-  image: images/@stock/service-1.jpg
+  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-  image_position: right
+  icon: icon-basic-signs
 - title: Print
-  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vitae,
+  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-    expedita obcaecati, commodi distinctio accusamus mollitia ratione ipsam cupiditate
+  icon: icon-basic-printer
-    odio ea.
-  image: images/@stock/service-2.jpg
-  image_position: left
 - title: Packaging
-  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vitae,
+  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-    expedita obcaecati, commodi distinctio accusamus mollitia ratione ipsam cupiditate
+  icon: icon-basic-book
-    odio ea.
-  image: images/@stock/service-4.jpg
-  image_position: right
 
-principles:
+steps:
-- title: Work with passion
+- title: Research
-  desc: Lorem ipsum dolor sit amet adipisicing elit. Maxime eos facilis
+  desc: Lorem ipsum dolor sit amet adipisicing elit. Maxime eos facilis veniam obcaecati,
-    veniam obcaecati, fugiat illo soluta accusantium?
+    fugiat illo soluta accusantium?
-  icon: icon-basic-heart
+- title: Design
-- title: Fail and Learn
+  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatum, nihil
-  desc: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatum,
+    accusamus sint et repudiandae ea sapiente voluptatibus fuga.
-    nihil accusamus sint et repudiandae.
+- title: Management
-  icon: icon-basic-flag2
+  desc: Dolor sit amet, consectetur adipisicing elit. Maxime eos facilis veniam obcaecati,
-- title: Repeat and Success
+    fugiat illo soluta accusantium?
-  desc: Dolor sit amet, consectetur adipisicing elit. Maxime eos facilis
-    veniam obcaecati, fugiat illo soluta accusantium?
-  icon: icon-basic-paperplane
 ---
 
 <div class="full centered-text light-cyan lamp">
@@ -60,57 +51,39 @@ principles:
   </div>
   <div class="two spacing"></div>
 </div>
-<div class="four spacing"></div>
+<div class="full">
-<div class="two spacing"></div>
-{% for service in page.services %}
-  <div class="full no-padding">
   <div class="row">
-      {% if service.image_position == 'left' %}
+    <div class="large-12 columns">
-        <div class="medium-6 columns">
+      <div class="services">
-          <img src="{{site.url}}/{{service.image}}" alt="">
+        {% for service in page.services %}
-        </div>
+          <div class="large-4 columns">
-        <div class="medium-6 columns">
+            <a href="#" class="icon-text">
-          <div class="service-info right-text">
+              <i class="{{service.icon}}"></i>
-            <h2>{{service.title}}</h2>
+              <h3>{{service.title}}</h3>
-            <p>{{service.desc}}</p>
-            <div class="two spacing"></div>
-            <a href="#" class="button brown">Case study</a>
-          </div>
-        </div>
-      {% else %}
-        <div class="medium-6 columns">
-          <div class="service-info right-text">
-            <h2>{{service.title}}</h2>
               <p>{{service.desc}}</p>
-            <div class="two spacing"></div>
+            </a>
-            <a href="#" class="button brown">Case study</a>
           </div>
+        {% endfor %}
       </div>
-        <div class="medium-6 columns">
-          <img src="{{site.url}}/{{service.image}}" alt="">
     </div>
-      {% endif %}
   </div>
-    <div class="four spacing"></div>
-    <div class="two spacing"></div>
 </div>
-{% endfor %}
+
-<div class="full light-grey centered-text">
+<div class="full light-grey">
   <div class="section-title">
     <div class="row">
       <div class="medium-10 medium-centered columns">
-        <h2>Our values</h2>
+        <h2>Our process</h2>
-        <p>We have principles to do things</p>
+        <p>We do things step by step</p>
       </div>
     </div>
   </div>
   <div class="row">
-    {% for principle in page.principles %}
+    {% for step in page.steps %}
       <div class="large-4 columns">
-        <div class="principle">
+        <div class="process">
-          <i class="{{principle.icon}}"></i>
+          <h3><span>0{{forloop.index}}.</span>{{step.title}}</h3>
-          <h4>{{principle.title}}</h4>
+          <p>{{step.desc}}</p>
-          <p>{{principle.desc}}</p>
         </div>
       </div>
     {% endfor %}