update token page

content/tft/index.md

@@ -0,0 +1,211 @@
+---
+title: "TFT"
+description: "About a decade ago, a group of passionate Internet & Cloud veterans came together to build a system." # quotation marks to allow colons where used
+template: "page.html"
+insert_anchor_links: "left"
+extra:
+  author: Your name here
+  imgPath: tfy/tft_header.png
+---
+
+<!-- section 1 (header) -->
+<div class="container mx-auto">
+
+{% row(style="header") %} 
+
+<h1 class="leading-none font-semibold"> All Transactions Use One Token: <span class="blue">TFT</span></h1>
+
+#### <span class="blue">No Intermediaries</span>
+
+<br>
+
+Whether you are hosting the cloud or deploying solutions on the Grid you will earn or use TFT. 
+
+
+<br>
+
+<button class="green">[Get A Node](https://marketplace.3node.global/?sl=en)</button> 
+<button class="blue_b">[How To Buy TFT](https://manual.grid.tf/documentation/threefold_token/buy_sell_tft/buy_sell_tft.html)</button>
+
+|||
+
+![Image](tft_header.png#mx-auto)
+
+{% end %}
+
+</div>
+
+
+
+<!-- section 2 arming Process -->
+
+
+<div style="background-color:#F6F6F6">
+
+<div class="container mx-auto">
+
+
+{% row( style="mtop semiNarrow") %}
+
+### **<span class="green_text font-semibold">EARN TFT**</span>
+
+## **The Farming Process**
+
+#### <span class="blue">Host The Cloud </span> And Become A ThreeFold Farmer.
+
+{% end %}
+
+<br>
+
+{% row( style="center semiNarrow") %}
+
+![Image](step1.png#mx-auto)
+
+<br>
+
+**Set up and connect a node to the ThreeFold Grid.**
+
+|||
+
+<div class="arrow">
+
+![Image](arrow_right2.png#mx-auto)
+
+</div>
+
+|||
+
+![Image](step2.png#mx-auto)
+
+<br>
+
+**Your node and its capacity is verified by the ThreeFold blockchain.**
+
+|||
+
+<div class="arrow">
+
+![Image](arrow_right2.png#mx-auto)
+
+</div>
+
+|||
+
+![Image](step3.png#mx-auto)
+
+<br>
+
+**Earn TFT for the uptime and capacity you provide to the Grid.**
+
+{% end %}
+
+<br>
+
+{% row( style="mbottom center semiNarrow") %}
+
+<button class="green">[Dive Deeoper](https://manual.grid.tf/documentation/farmers/farmers.html)</button> 
+
+{% end %}
+
+</div>
+
+</div>
+
+
+
+
+<!-- section 3 Utilization Process -->
+
+<div class="container mx-auto">
+
+{% row( style="mtop semiNarrow") %}
+
+### **<span class="green_text font-semibold">USE TFT**</span>
+
+## **The Utilization Process**
+
+#### <span class="blue">Access  </span> ThreeFold Grid Capacity and <span class="blue">Build</span>
+
+{% end %}
+
+<br>
+
+{% row( style="center narrow") %}
+
+![Image](step3.png#mx-auto)
+
+<br>
+
+**Users pay utilization fees (using TFT) to use compute, storage and network capacity.**
+
+|||
+
+<div class="arrow">
+
+![Image](arrow_right2.png#mx-auto)
+
+</div>
+
+|||
+
+![Image](capacity_2.png#mx-auto)
+
+<br>
+
+**They can then use this capacity to build or deploy on top of the ThreeFold Grid.**
+
+
+{% end %}
+
+<br>
+
+{% row( style="mbottom center semiNarrow") %}
+
+<button class="green">[Dive Deeoper](https://manual.grid.tf/knowledge_base/cloud/cloud_toc.html)</button> 
+
+{% end %}
+
+</div>
+
+
+
+
+
+
+<style>
+
+.green{
+    background-color:#58CF77 !important;
+    color: #fff !important;
+}
+
+.green:hover {
+  background-color:#7ad993 !important;
+}
+.green a{
+     color: #fff !important;
+}
+ 
+.green:hover {
+  background-color:#7ad993 !important;
+}
+
+.green_text{
+  color: #58CF77 ;
+}
+
+.blue_b{
+
+    background-color:#2E83FF !important;
+    color: #fff !important;
+
+}
+.blue_b a{
+     color: #fff !important;
+  }
+
+.blue_b:hover {
+  background-color:#5596f5 !important;
+}
+ 
+</style>