update css1

content/_index.md

@@ -18,7 +18,7 @@ extra:
 
 ### Join the peer-to-peer revolution
 
-#### Powered by the ThreeFold blockchain the People’s Internet is the layer 0 infrastructure for an open source P2P Internet owned by humanity.
+Powered by the ThreeFold blockchain the People’s Internet is the layer 0 infrastructure for an open source P2P Internet owned by humanity.
 
 
 
@@ -36,9 +36,9 @@ extra:
 
 {% row(style="center margin") %}
 
-### EXPAND THE PEOPLE’S INTERNET <br> **AND EARN TFT**
+### EXPAND THE PEOPLE’S INTERNET **AND EARN TFT**
 
-By connecting hardware at your home or office, support the growth of <br> a decentralized Internet and earn a new digital currency, TFT.
+By connecting hardware at your home or office, support the growth of a decentralized Internet and earn a new digital currency, TFT.
 
 <button>[Become a farmer](/farm)</button>
 
@@ -46,12 +46,16 @@ By connecting hardware at your home or office, support the growth of <br> a dece
 
 |||
 
-### DECENTRALIZE YOUR <br> **DATA AND WORKLOADS**
+### DECENTRALIZE YOUR **DATA AND WORKLOADS**
 
-Companies and developers have already started using ThreeFold for <br> it’s autonomous, decentralization and privacy features.
+
+
+Companies and developers have already started using ThreeFold for it’s autonomous, decentralization and privacy features.
 
 <button>[Deploy](/cloud)</button>
 
+
+
 ![Image](/images/network_new.jpg#mx-auto)
 
 {% end %}

content/cloud/_index.md

@@ -47,6 +47,7 @@ Native support for containers and virtual machines. Migrate existing application
 
 Private overlay networks and global end-to-end encryption minimize attack surface. Handle inbound traffic with uniquely secure web gateways.
 
+
 <button> [Learn More]( https://library.threefold.me/info/manual/#/cloud/threefold__planetary_network) </button>
 
 {% end %}
@@ -190,7 +191,7 @@ A carefully designed collection of lightweight components that minimize overhead
 <br/>
 <br/>
 
-{% row(gradient="linear-gradient(351deg, #8f8f8f, #383838)" style="center margin text-white") %}
+{% row(gradient="linear-gradient(351deg, #8f8f8f, #8c8c8c)" style="center margin text-white") %}
 
 ## **TAKE THREEFOLD** <br> **CLOUD ON A TEST DRIVE**
 

content/footer/_index.md

@@ -10,7 +10,7 @@ extra:
 
 {% row(style="lean") %}
 
-##### THREEFOLD UNIVERSE
+##### THREEFOLD <br> UNIVERSE
 
 <br>
 

content/grid/_index.md

@@ -98,6 +98,9 @@ A decentralized autonomous OS designed to dedicate hardware capacity to the Peop
 
 {% end %}
 
+<br>
+<br>
+
 {% row() %}
 
 ## A DECENTRALIZED INTERNET ECONOMY

content/mission/_index.md

@@ -8,6 +8,8 @@ insert_anchor_links: "left"
 
 {% row(style="center") %}
 
+<br>
+
 # OUR MISSION
 
 <br>

content/tft/_index.md

@@ -41,7 +41,7 @@ The People’s Internet creates an entirely new decentralized Internet economy t
 
 <!-- section 2 (Meeting Emerging Demand) -->
 
-{% row(style="center narrow") %}
+{% row(style="center ") %}
 
 ## **MEETING EMERGING DEMAND**
 
@@ -224,17 +224,17 @@ Get TFT today and participate in the realization of a truly decentralized world.
 
 <div class="quicklinks">
 <a class="center" href="https://gettft.com/gettft/" rel="some text" target="_blank"> 
- <img class="py-2 my-2 px-5 border-2 border-black" src="/images/get_tft_button.png" alt ="cointelegraph">
+ <img class="py-2 mr-2 my-2 px-5 border-2 border-black" src="/images/get_tft_button.png" alt ="cointelegraph">
  
  </a>
 
 <a class="center" href="https://pancakeswap.finance/swap?exactField=output&exactAmount=100&outputCurrency=0x8f0FB159380176D324542b3a7933F0C2Fd0c2bbf&inputCurrency=0xe9e7cea3dedca5984780bafc599bd69add087d56?use=v2" rel="some text" target="_blank"> 
- <img class="py-2 my-2 px-5 border-2 border-black" src="/images/pancack_button.png" alt ="cointelegraph">
+ <img class="py-2 mr-2 px-5 border-2 border-black" src="/images/pancack_button.png" alt ="cointelegraph">
  
  </a>
 
  <a class="center" href="https://app.1inch.io/#/56/swap/BNB/TFT" rel="some text" target="_blank"> 
- <img class="py-2 my-2 px-5 border-2 border-black" src="/images/iinch_button.png" alt ="cointelegraph">
+ <img class="py-2 my-2 mr-2 px-5 border-2 border-black" src="/images/iinch_button.png" alt ="cointelegraph">
  
  </a>
  </div>

css/index.css

@@ -75,6 +75,9 @@ img[src*="#absolute"] {
   width:200px
 }
 
+h1 {
+  line-height: 4rem;
+}
 
 @layer components {
   h1 {
@@ -119,8 +122,8 @@ img[src*="#absolute"] {
     lg:text-lg
     px-12
     py-1
-    mr-5
+    lg:mr-5
-    my-6
+    my-3
     border-2
     shadow
     border-black
@@ -218,7 +221,7 @@ header {
   -webkit-filter: grayscale(100%);
   filter: grayscale(100%);
   position: relative;
-  margin-right: 30px;
+  
   -webkit-transition: all 0.2s ease;
   transition: all 0.2s ease;
   opacity: 0.5;
@@ -354,6 +357,11 @@ header {
 .zola-anchor {
   display: none;
 }
+@media (min-width: 1024px){
+  h2 {
+    font-size: 3.5rem;
+}
+}
 @media (max-width: 640px) {
   .banner h2 {
     font: 600 7vw/10vw;

templates/shortcodes/cloud_stats.html

@@ -17,7 +17,7 @@
           uppercase
           my-2
           leading-none
-          font-bold font-heading
+          font-normal font-heading
         
           ">
         A GLOBAL EDGE INFRASTRUCTURE

templates/shortcodes/row.html

@@ -10,7 +10,7 @@ Parameters:
 -->
 
 {% set columns = body | safe | markdown | split(pat="|||") %}
-{% set row_class =  "relative pt-12 p-4 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 xl:flex xl:flex-row"%}
+{% set row_class =  "relative pt-6 p-4 flex flex-col sm:grid sm:grid-cols-2 sm:gap-10 xl:flex xl:flex-row"%}
 
 <!-- aligns columns depending on col number-->
 {% if 2 < columns | length %}

templates/shortcodes/team_sec.html

@@ -1,4 +1,4 @@
-<div class="lg:my-32 flex flex-col mt-5 p-auto lg:px-40">
+<div class="lg:my-32 flex flex-col mt-5 p-auto lg:px-20">
     <h2 class="flex py-2 mx-auto uppercase font-normal lg:text-6xl">
         THE TEAM
     </h2>
@@ -501,8 +501,8 @@
     /* #70dfc9, #ee7bf7 */
     .box {
         position: relative;
-        height: 150px;
+        height: 130px;
-        width: 150px;
+        width: 130px;
     }
 
     .box::before {
@@ -522,8 +522,8 @@
 
     .box img {
         filter: grayscale(100%);
-        height: 130px;
+        height: 110px;
-        width: 130px;
+        width: 110px;
     }
 
     .box img:hover {