basics_01 #3
@ -53,7 +53,9 @@ LAYOUT
|
|||||||
padding-bottom: 0.75rem;
|
padding-bottom: 0.75rem;
|
||||||
padding-left: 3rem;
|
padding-left: 3rem;
|
||||||
}
|
}
|
||||||
|
.gapExtra {
|
||||||
|
grid-gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
/* ---------------------------------------------------
|
/* ---------------------------------------------------
|
||||||
TYPOGRAPHY
|
TYPOGRAPHY
|
||||||
|
@ -1,13 +1,13 @@
|
|||||||
<svg width="768" height="432" viewBox="0 0 768 432" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg width="768" height="432" viewBox="0 0 768 432" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
<rect width="768" height="432" fill="#E9500A"/>
|
<rect width="768" height="432" fill="#E9500A"/>
|
||||||
<ellipse cx="70" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="70" cy="97" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="70" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="70" cy="319" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="698" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="698" cy="97" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="698" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="698" cy="319" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="384" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="384" cy="97" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="384" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="384" cy="319" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="227" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="227" cy="97" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="227" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="227" cy="319" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="541" cy="97" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="541" cy="97" rx="70" ry="69" fill="#4B1202"/>
|
||||||
<ellipse cx="541" cy="319" rx="70" ry="69" fill="#D9D9D9"/>
|
<ellipse cx="541" cy="319" rx="70" ry="69" fill="#4B1202"/>
|
||||||
</svg>
|
</svg>
|
||||||
|
After Width: | Height: | Size: 748 B |
@ -35,32 +35,122 @@
|
|||||||
|
|
||||||
<!-- FOLD -->
|
<!-- FOLD -->
|
||||||
|
|
||||||
<div class="w-100 colorOrange bgColorWhite pv5 mt5">
|
<div class="w-100 colorWine bgColorOrange pv5 mt5">
|
||||||
|
|
||||||
<div class="mw7 center paddingExtra">
|
<div class="mw7 center paddingExtra">
|
||||||
|
|
||||||
<h3 class="f4 f2-ns fw7 fw4-ns ma0 mb3">
|
|
||||||
Humane computer programs
|
|
||||||
</h3>
|
|
||||||
<p class="ma0 mb3">
|
<p class="ma0 mb3">
|
||||||
The world is in flux, and it’s a unique opportunity to <span class="fw7">facilitate change </span>for the better.
|
The world is in flux, and it’s a unique opportunity to <span class="fw7">facilitate change for the better.</span>
|
||||||
</p>
|
</p>
|
||||||
<p class="ma0">
|
<p class="ma0 mb3">
|
||||||
We want to enable the makers that are driving this change by providing them with <span class="fw7">independent, fair and tailor made software </span>that meet the highest standards when it comes to transparency, integrity and privacy.
|
We want to enable the makers that are driving this change by providing them with <span class="fw7">independent, fair and tailor made software </span>that meet the highest standards when it comes to transparency, integrity and privacy.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h3 class="f4 f2-ns fw7 fw4-ns ma0 mt5 mb3">
|
|
||||||
Simple, resilient and accessible
|
|
||||||
</h3>
|
|
||||||
<p class="ma0 mb3">
|
<p class="ma0 mb3">
|
||||||
Located in Berlin, we’re a small, reliable and well-rehearsed team of seniors that can take care of your software project from first brainstorming to going live.
|
<span class="fw7">Located in Berlin</span>, we’re a small, reliable and well-rehearsed team of seniors that can take care of your software project from first brainstorming to going live.
|
||||||
</p>
|
</p>
|
||||||
<p class="ma0 mb3">
|
<p class="ma0 mb3">
|
||||||
Working fully open source allows us to be transparent, keep in touch with the community, and contribute back to an ever growing common body of freely available knowledge.
|
<span class="fw7">Working fully open source </span>allows us to be transparent, keep in touch with the community, and contribute back to an ever growing common body of freely available knowledge.
|
||||||
</p>
|
</p>
|
||||||
<p class="ma0">
|
<p class="ma0">
|
||||||
Our clients value simple, resilient and accessible tools that are effortless to run and maintain, and that everyone can use, reuse and benefit from.
|
Our clients value <span class="fw7">simple, resilient and accessible tools </span>that are effortless to run and maintain, and that everyone can use, reuse and benefit from.
|
||||||
</p>
|
</p>
|
||||||
|
<div class="flex justify-center pt6 pb4">
|
||||||
|
<a class="link dim br1 f5 fw7 ttu tc trackedExtraWide buttonPadding colorWhite bgColorWine" href="###" rel="noopener">Work with us</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- FOLD -->
|
||||||
|
|
||||||
|
<div class="w-100 pv5 ph3">
|
||||||
|
|
||||||
|
<div class="flex flex-wrap justify-center gapExtra">
|
||||||
|
|
||||||
|
<div class="colorWhite bgColorOrange pa4">
|
||||||
|
<p class="fw7 ma0 mb3">
|
||||||
|
We offer
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Web Application and website development
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Independent infrastructure solutions
|
||||||
|
</p>
|
||||||
|
<p class="ma0">
|
||||||
|
Support and guidance with self hosting
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="colorWhite bgColorOrange pa4">
|
||||||
|
<p class="fw7 ma0 mb3">
|
||||||
|
We created
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Offen Fair Web Analytics
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
analytics.txt
|
||||||
|
</p>
|
||||||
|
<p class="ma0">
|
||||||
|
docker-volume-backup
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="colorWhite bgColorOrange pa4">
|
||||||
|
<p class="fw7 ma0 mb3">
|
||||||
|
We worked with
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
NLNet
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
RBB
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Ecosia
|
||||||
|
</p>
|
||||||
|
<p class="ma0">
|
||||||
|
Wikimedia
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="colorWhite bgColorOrange pa4">
|
||||||
|
<p class="fw7 ma0 mb3">
|
||||||
|
We are Frederik Ring
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Currently interested in
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Minimal Kubernetes distributions
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Open Source Tomato Seeds
|
||||||
|
</p>
|
||||||
|
<p class="ma0">
|
||||||
|
Psychological aspects of Software Development
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="colorWhite bgColorOrange pa4">
|
||||||
|
<p class="fw7 ma0 mb3">
|
||||||
|
We are Hendrik Niefeld
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Currently interested in
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Generative systems
|
||||||
|
</p>
|
||||||
|
<p class="ma0 mb2">
|
||||||
|
Literal present tense in Korean
|
||||||
|
</p>
|
||||||
|
<p class="ma0">
|
||||||
|
Sociological aspects of hyperpolitics
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user