diff --git a/CNAME b/CNAME deleted file mode 100644 index d203b29..0000000 --- a/CNAME +++ /dev/null @@ -1 +0,0 @@ -kleros.io diff --git a/assets/one-pager.pdf b/assets/one-pager.pdf new file mode 100644 index 0000000..fd7ca90 Binary files /dev/null and b/assets/one-pager.pdf differ diff --git a/fonts/Dosis-Bold.ttf b/fonts/Dosis-Bold.ttf deleted file mode 100644 index d5e938e..0000000 Binary files a/fonts/Dosis-Bold.ttf and /dev/null differ diff --git a/fonts/metropolis-bold-webfont.woff b/fonts/metropolis-bold-webfont.woff new file mode 100755 index 0000000..4dae9a8 Binary files /dev/null and b/fonts/metropolis-bold-webfont.woff differ diff --git a/fonts/metropolis-bold-webfont.woff2 b/fonts/metropolis-bold-webfont.woff2 new file mode 100755 index 0000000..887893c Binary files /dev/null and b/fonts/metropolis-bold-webfont.woff2 differ diff --git a/fonts/metropolis-light-webfont.woff b/fonts/metropolis-light-webfont.woff new file mode 100755 index 0000000..aad4b4d Binary files /dev/null and b/fonts/metropolis-light-webfont.woff differ diff --git a/fonts/metropolis-light-webfont.woff2 b/fonts/metropolis-light-webfont.woff2 new file mode 100755 index 0000000..a036b8e Binary files /dev/null and b/fonts/metropolis-light-webfont.woff2 differ diff --git a/fonts/metropolis-medium-webfont.woff b/fonts/metropolis-medium-webfont.woff new file mode 100755 index 0000000..fb480c1 Binary files /dev/null and b/fonts/metropolis-medium-webfont.woff differ diff --git a/fonts/metropolis-medium-webfont.woff2 b/fonts/metropolis-medium-webfont.woff2 new file mode 100755 index 0000000..9093d72 Binary files /dev/null and b/fonts/metropolis-medium-webfont.woff2 differ diff --git a/fonts/metropolis-regular-webfont.woff b/fonts/metropolis-regular-webfont.woff new file mode 100755 index 0000000..52d3313 Binary files /dev/null and b/fonts/metropolis-regular-webfont.woff differ diff --git a/fonts/metropolis-regular-webfont.woff2 b/fonts/metropolis-regular-webfont.woff2 new file mode 100755 index 0000000..ac19d07 Binary files /dev/null and b/fonts/metropolis-regular-webfont.woff2 differ diff --git a/fonts/metropolis-semibold-webfont.woff b/fonts/metropolis-semibold-webfont.woff new file mode 100755 index 0000000..bc9cd4d Binary files /dev/null and b/fonts/metropolis-semibold-webfont.woff differ diff --git a/fonts/metropolis-semibold-webfont.woff2 b/fonts/metropolis-semibold-webfont.woff2 new file mode 100755 index 0000000..3eaf592 Binary files /dev/null and b/fonts/metropolis-semibold-webfont.woff2 differ diff --git a/fonts/museosans-500.otf b/fonts/museosans-500.otf deleted file mode 100644 index e5e860a..0000000 Binary files a/fonts/museosans-500.otf and /dev/null differ diff --git a/fonts/riftsoft-regular-webfont.woff b/fonts/riftsoft-regular-webfont.woff deleted file mode 100755 index a115149..0000000 Binary files a/fonts/riftsoft-regular-webfont.woff and /dev/null differ diff --git a/fonts/riftsoft-regular-webfont.woff2 b/fonts/riftsoft-regular-webfont.woff2 deleted file mode 100755 index 124d61b..0000000 Binary files a/fonts/riftsoft-regular-webfont.woff2 and /dev/null differ diff --git a/img/Romina-team-photo.png b/img/Romina-team-photo.png deleted file mode 100644 index 1486b2e..0000000 Binary files a/img/Romina-team-photo.png and /dev/null differ diff --git a/img/Telegram-icon-sq.png b/img/Telegram-icon-sq.png deleted file mode 100644 index 9d9df38..0000000 Binary files a/img/Telegram-icon-sq.png and /dev/null differ diff --git a/img/Tete.png b/img/Tete.png deleted file mode 100644 index beae7f7..0000000 Binary files a/img/Tete.png and /dev/null differ diff --git a/img/addison.png b/img/addison.png new file mode 100755 index 0000000..28b6646 Binary files /dev/null and b/img/addison.png differ diff --git a/img/alex.jpg b/img/alex.jpg deleted file mode 100644 index af3096f..0000000 Binary files a/img/alex.jpg and /dev/null differ diff --git a/img/alex.png b/img/alex.png deleted file mode 100644 index 1a3df68..0000000 Binary files a/img/alex.png and /dev/null differ diff --git a/img/anonymous.png b/img/anonymous.png deleted file mode 100644 index c06ee24..0000000 Binary files a/img/anonymous.png and /dev/null differ diff --git a/img/anonymous_rh.png b/img/anonymous_rh.png deleted file mode 100644 index e14a9c8..0000000 Binary files a/img/anonymous_rh.png and /dev/null differ diff --git a/img/arbitration.png b/img/arbitration.png deleted file mode 100644 index d1d47ed..0000000 Binary files a/img/arbitration.png and /dev/null differ diff --git a/img/arrow-down.svg b/img/arrow-down.svg new file mode 100644 index 0000000..abb6ca5 --- /dev/null +++ b/img/arrow-down.svg @@ -0,0 +1,17 @@ + + + + arrow down + Created with Sketch. + + + + + + + + + + + + \ No newline at end of file diff --git a/img/arrow-right.svg b/img/arrow-right.svg new file mode 100644 index 0000000..2f8551e --- /dev/null +++ b/img/arrow-right.svg @@ -0,0 +1,15 @@ + + + + arrow right + Created with Sketch. + + + + + + + + + + \ No newline at end of file diff --git a/img/assembly.jpg b/img/assembly.jpg deleted file mode 100644 index bedcefc..0000000 Binary files a/img/assembly.jpg and /dev/null differ diff --git a/img/assembly.png b/img/assembly.png deleted file mode 100644 index b4acc48..0000000 Binary files a/img/assembly.png and /dev/null differ diff --git a/img/clesaege.png b/img/clesaege.png new file mode 100755 index 0000000..83e51e9 Binary files /dev/null and b/img/clesaege.png differ diff --git a/img/contract.png b/img/contract.png deleted file mode 100644 index 690d8d8..0000000 Binary files a/img/contract.png and /dev/null differ diff --git a/img/contract.svg b/img/contract.svg new file mode 100644 index 0000000..4099e03 --- /dev/null +++ b/img/contract.svg @@ -0,0 +1,33 @@ + + + + contract + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/copyright.png b/img/copyright.png deleted file mode 100644 index f1d9be3..0000000 Binary files a/img/copyright.png and /dev/null differ diff --git a/img/courts-diagram.png b/img/courts-diagram.png new file mode 100755 index 0000000..f52ff07 Binary files /dev/null and b/img/courts-diagram.png differ diff --git a/img/crowd-funding.svg b/img/crowd-funding.svg new file mode 100644 index 0000000..871a855 --- /dev/null +++ b/img/crowd-funding.svg @@ -0,0 +1,29 @@ + + + + features/crowdf + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/crowdfunding.png b/img/crowdfunding.png deleted file mode 100644 index 558c094..0000000 Binary files a/img/crowdfunding.png and /dev/null differ diff --git a/img/crowdjury.png b/img/crowdjury.png deleted file mode 100644 index 96cf6c7..0000000 Binary files a/img/crowdjury.png and /dev/null differ diff --git a/img/curated-lists.svg b/img/curated-lists.svg new file mode 100644 index 0000000..560c001 --- /dev/null +++ b/img/curated-lists.svg @@ -0,0 +1,23 @@ + + + + features/cureated lists + Created with Sketch. + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/decision.png b/img/decision.png deleted file mode 100644 index fa51d76..0000000 Binary files a/img/decision.png and /dev/null differ diff --git a/img/dispute.png b/img/dispute.png deleted file mode 100644 index c56e11a..0000000 Binary files a/img/dispute.png and /dev/null differ diff --git a/img/dispute.svg b/img/dispute.svg new file mode 100644 index 0000000..95e3534 --- /dev/null +++ b/img/dispute.svg @@ -0,0 +1,16 @@ + + + + dispute + Created with Sketch. + + + + + + + + + + + \ No newline at end of file diff --git a/img/enforcement.svg b/img/enforcement.svg new file mode 100644 index 0000000..2eb57e4 --- /dev/null +++ b/img/enforcement.svg @@ -0,0 +1,38 @@ + + + + enforcement + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/epiqueras.png b/img/epiqueras.png new file mode 100755 index 0000000..9b28269 Binary files /dev/null and b/img/epiqueras.png differ diff --git a/img/escrow.svg b/img/escrow.svg new file mode 100644 index 0000000..9c419f6 --- /dev/null +++ b/img/escrow.svg @@ -0,0 +1,22 @@ + + + + features/escrow + Created with Sketch. + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/ethereum_logo.png b/img/ethereum_logo.png deleted file mode 100644 index 7c5aa23..0000000 Binary files a/img/ethereum_logo.png and /dev/null differ diff --git a/img/facebook.svg b/img/facebook.svg new file mode 100644 index 0000000..a634e9e --- /dev/null +++ b/img/facebook.svg @@ -0,0 +1,13 @@ + + + + fb + Created with Sketch. + + + + + + + + \ No newline at end of file diff --git a/img/fb.png b/img/fb.png deleted file mode 100644 index fbbbeeb..0000000 Binary files a/img/fb.png and /dev/null differ diff --git a/img/federico-ast.png b/img/federico-ast.png new file mode 100755 index 0000000..6b54221 Binary files /dev/null and b/img/federico-ast.png differ diff --git a/img/federico_ast.png b/img/federico_ast.png deleted file mode 100644 index 54d7b40..0000000 Binary files a/img/federico_ast.png and /dev/null differ diff --git a/img/footer.svg b/img/footer.svg new file mode 100644 index 0000000..8df3e4b --- /dev/null +++ b/img/footer.svg @@ -0,0 +1,27 @@ + + + + bg footer + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/github.svg b/img/github.svg deleted file mode 100644 index 5b2fa95..0000000 --- a/img/github.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/img/github_icon.png b/img/github_icon.png deleted file mode 100644 index 86de3e9..0000000 Binary files a/img/github_icon.png and /dev/null differ diff --git a/img/header.svg b/img/header.svg new file mode 100644 index 0000000..bd2b9ea --- /dev/null +++ b/img/header.svg @@ -0,0 +1,23 @@ + + + + header bg + Created with Sketch. + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/how-kleros-works.svg b/img/how-kleros-works.svg new file mode 100644 index 0000000..925abbf --- /dev/null +++ b/img/how-kleros-works.svg @@ -0,0 +1,15 @@ + + + + bg how kleros works + Created with Sketch. + + + + + + + + + + \ No newline at end of file diff --git a/img/iMac.png b/img/iMac.png deleted file mode 100644 index 1f165b0..0000000 Binary files a/img/iMac.png and /dev/null differ diff --git a/img/insurance.svg b/img/insurance.svg new file mode 100644 index 0000000..fa47d50 --- /dev/null +++ b/img/insurance.svg @@ -0,0 +1,24 @@ + + + + features/insurance + Created with Sketch. + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/ipad.png b/img/ipad.png deleted file mode 100644 index c314c1d..0000000 Binary files a/img/ipad.png and /dev/null differ diff --git a/img/jury.png b/img/jury.png deleted file mode 100644 index e9545ed..0000000 Binary files a/img/jury.png and /dev/null differ diff --git a/img/kleroterion.png b/img/kleroterion.png deleted file mode 100644 index e7c4a27..0000000 Binary files a/img/kleroterion.png and /dev/null differ diff --git a/img/lesaege.png b/img/lesaege.png deleted file mode 100644 index aed4c16..0000000 Binary files a/img/lesaege.png and /dev/null differ diff --git a/img/linked-in.svg b/img/linked-in.svg new file mode 100644 index 0000000..13b9e91 --- /dev/null +++ b/img/linked-in.svg @@ -0,0 +1,13 @@ + + + + ln + Created with Sketch. + + + + + + + + \ No newline at end of file diff --git a/img/linkedIn_icon.png b/img/linkedIn_icon.png deleted file mode 100644 index 41e17ec..0000000 Binary files a/img/linkedIn_icon.png and /dev/null differ diff --git a/img/logo_footer.png b/img/logo_footer.png deleted file mode 100644 index a2c3c1c..0000000 Binary files a/img/logo_footer.png and /dev/null differ diff --git a/img/logo_kleroterion.png b/img/logo_kleroterion.png deleted file mode 100644 index 78793e7..0000000 Binary files a/img/logo_kleroterion.png and /dev/null differ diff --git a/img/medium.svg b/img/medium.svg index 5dce025..21579d4 100644 --- a/img/medium.svg +++ b/img/medium.svg @@ -1,43 +1,16 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + medium + Created with Sketch. + + + + + + + + + + + \ No newline at end of file diff --git a/img/n1c0.png b/img/n1c0.png new file mode 100644 index 0000000..356f4af Binary files /dev/null and b/img/n1c0.png differ diff --git a/img/nico.png b/img/nico.png deleted file mode 100644 index 4023234..0000000 Binary files a/img/nico.png and /dev/null differ diff --git a/img/oracles.svg b/img/oracles.svg new file mode 100644 index 0000000..a8da914 --- /dev/null +++ b/img/oracles.svg @@ -0,0 +1,18 @@ + + + + features/oracle + Created with Sketch. + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/phone_pinakion.png b/img/phone_pinakion.png deleted file mode 100644 index 64ec763..0000000 Binary files a/img/phone_pinakion.png and /dev/null differ diff --git a/img/pinakion.png b/img/pinakion.png deleted file mode 100644 index bd0bbc8..0000000 Binary files a/img/pinakion.png and /dev/null differ diff --git a/img/pnk-cluster.svg b/img/pnk-cluster.svg new file mode 100644 index 0000000..0c4cce4 --- /dev/null +++ b/img/pnk-cluster.svg @@ -0,0 +1,76 @@ + + + + PNK illustration + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/profile.png b/img/profile.png new file mode 100755 index 0000000..d6bc037 Binary files /dev/null and b/img/profile.png differ diff --git a/img/reddit.png b/img/reddit.png deleted file mode 100644 index 7cd42ec..0000000 Binary files a/img/reddit.png and /dev/null differ diff --git a/img/reddit.svg b/img/reddit.svg new file mode 100644 index 0000000..43aa24d --- /dev/null +++ b/img/reddit.svg @@ -0,0 +1,15 @@ + + + + reddit + Created with Sketch. + + + + + + + + + + \ No newline at end of file diff --git a/img/romina.png b/img/romina.png new file mode 100755 index 0000000..e7aa5b2 Binary files /dev/null and b/img/romina.png differ diff --git a/img/ryan.png b/img/ryan.png deleted file mode 100644 index d6e99a9..0000000 Binary files a/img/ryan.png and /dev/null differ diff --git a/img/sam.png b/img/sam.png deleted file mode 100644 index c27934c..0000000 Binary files a/img/sam.png and /dev/null differ diff --git a/img/satello.png b/img/satello.png new file mode 100755 index 0000000..716fefd Binary files /dev/null and b/img/satello.png differ diff --git a/img/security.png b/img/security.png new file mode 100644 index 0000000..1f67863 Binary files /dev/null and b/img/security.png differ diff --git a/img/selection.svg b/img/selection.svg new file mode 100644 index 0000000..bccef2c --- /dev/null +++ b/img/selection.svg @@ -0,0 +1,18 @@ + + + + selection + Created with Sketch. + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/ship.svg b/img/ship.svg new file mode 100644 index 0000000..c02ebef --- /dev/null +++ b/img/ship.svg @@ -0,0 +1,30 @@ + + + + ship + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/sjj.png b/img/sjj.png new file mode 100755 index 0000000..e582776 Binary files /dev/null and b/img/sjj.png differ diff --git a/img/slack.svg b/img/slack.svg deleted file mode 100644 index 47232d6..0000000 --- a/img/slack.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/img/social-media.svg b/img/social-media.svg new file mode 100644 index 0000000..130b683 --- /dev/null +++ b/img/social-media.svg @@ -0,0 +1,23 @@ + + + + features/like + Created with Sketch. + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/social_media.png b/img/social_media.png deleted file mode 100644 index 9367ed9..0000000 Binary files a/img/social_media.png and /dev/null differ diff --git a/img/solution.png b/img/solution.png new file mode 100755 index 0000000..4d98e94 Binary files /dev/null and b/img/solution.png differ diff --git a/img/team-SJJ.png b/img/team-SJJ.png deleted file mode 100644 index c29df91..0000000 Binary files a/img/team-SJJ.png and /dev/null differ diff --git a/img/team-addison.png b/img/team-addison.png deleted file mode 100644 index a0c0dd9..0000000 Binary files a/img/team-addison.png and /dev/null differ diff --git a/img/team-enrique.png b/img/team-enrique.png deleted file mode 100644 index d910836..0000000 Binary files a/img/team-enrique.png and /dev/null differ diff --git a/img/telegram.png b/img/telegram.png deleted file mode 100644 index ee0756d..0000000 Binary files a/img/telegram.png and /dev/null differ diff --git a/img/telegram.svg b/img/telegram.svg new file mode 100644 index 0000000..6597d29 --- /dev/null +++ b/img/telegram.svg @@ -0,0 +1,15 @@ + + + + telegram + Created with Sketch. + + + + + + + + + + \ No newline at end of file diff --git a/img/telegram_button.png b/img/telegram_button.png deleted file mode 100644 index cbec4eb..0000000 Binary files a/img/telegram_button.png and /dev/null differ diff --git a/img/tete.png b/img/tete.png new file mode 100644 index 0000000..4785761 Binary files /dev/null and b/img/tete.png differ diff --git a/img/the-guardian.png b/img/the-guardian.png new file mode 100755 index 0000000..fa60a01 Binary files /dev/null and b/img/the-guardian.png differ diff --git a/img/the-verge.png b/img/the-verge.png new file mode 100755 index 0000000..9107307 Binary files /dev/null and b/img/the-verge.png differ diff --git a/img/twitter.png b/img/twitter.png deleted file mode 100644 index 1f907dc..0000000 Binary files a/img/twitter.png and /dev/null differ diff --git a/img/twitter.svg b/img/twitter.svg new file mode 100644 index 0000000..8800680 --- /dev/null +++ b/img/twitter.svg @@ -0,0 +1,13 @@ + + + + tw + Created with Sketch. + + + + + + + + \ No newline at end of file diff --git a/img/twitter_icon.png b/img/twitter_icon.png deleted file mode 100644 index e3c5d13..0000000 Binary files a/img/twitter_icon.png and /dev/null differ diff --git a/img/use-cases.png b/img/use-cases.png new file mode 100644 index 0000000..e744d6a Binary files /dev/null and b/img/use-cases.png differ diff --git a/img/video.svg b/img/video.svg new file mode 100644 index 0000000..e277b10 --- /dev/null +++ b/img/video.svg @@ -0,0 +1,141 @@ + + + + security bg copy + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/img/w-george.png b/img/w-george.png new file mode 100755 index 0000000..da631d9 Binary files /dev/null and b/img/w-george.png differ diff --git a/img/william.png b/img/william.png deleted file mode 100644 index 5fc7819..0000000 Binary files a/img/william.png and /dev/null differ diff --git a/index.html b/index.html index 351f02d..0cca48a 100644 --- a/index.html +++ b/index.html @@ -1,1025 +1,519 @@ - - - - - + + + + + - - - + + + - - - - + + The Blockchain Dispute Resolution Layer + + + + - - - - + + + + -
- + +
+

Token sale starts on May 15th, 2018.

+
+
+
-
+
DAYS
+
+
+
-
+
HOURS
+
+
+
-
+
MIN
+
+
+
+ -
-
-
-
- pinakion -
-
-
-
-

Based on Ethereum ethereum logo Blockchain

-

The Blockchain Dispute Resolution Layer

-

- Fast, secure and affordable arbitration for virtually anything. + +

+ +
+ -

- -
-
- -
- -
-
-
-
-
+ +
+

The Challenge

+

Disputes in the global, digital, and decentralized economy occur in areas where they cannot be solved by state courts + and existing dispute resolution methods.

+ + Arrow Pointing Down + +
+ -
-
-
-

TRIBUNALS
ON DEMAND

-

- Smart contracts are designed to self-execute, but not to evaluate - subjective information or to interpret complex evidence. -

-

- Kleros uses blockchain and crowdsourcing for evaluating complex - evidence and adjudicating claims in a fast, transparent and - decentralized way. -

- How it works? -
-
-
- screen mac kleros -
-
+ +
+
+

The Solution

+

Kleros connects users who need to solve disputes with jurors who have the skills to fairly settle them. Our resolution + layer uses blockchain technology and crowdsourced jurors to adjudicate disputes in a fast, secure, and affordable manner.

+
+ The Solution +
+
+ + + +
+

How Does Kleros Work?

+
+
+
+
1
+ Contract +

Contract

+

Users create a smart contract and choose Kleros as its adjudication protocol.

+
+
+
2
+ Dispute +

Dispute

+

The relevant information is securely sent to Kleros.

+
+
+
3
+ Selection +

Selection

+

A tribunal is drawn from the crowd. Jurors evaluate evidence and cast their vote.

-
+
+
4
+ Enforcement +

Enforcement

+

The decision is enforced by the smart contract.

+
+
+ +

Crowdsourcing taps into a global pool of jurors, while the blockchain guarantees evidential integrity and transparency + in jury selection, and incentives for honest rulings.

+ + -
-
-
-

HOW IT WORKS?

-
+ +
+

Use Cases

+
+
+
+
+ Escrow +
+

Arbitration

+
A freelance job is contracted between two people working cross continent. The service is not rendered to a satisfactory + standard and a jury of experts analyze the evidence, vote, and find a verdict.
-
-
-
- contract kleros -
-

Contract

-

- Users create a smart contract and choose Kleros as adjudication - protocol. -

-
-
-
- dispute kleros -
-

Dispute

-

- The relevant information is securely sent to Kleros. -

+
+
+ Social Media
-
-
- jury kleros -
-

Selection

-

- A tribunal is drawn from the crowd. Jurors evaluate evidence and - cast their vote. -

+

Social Media

+
An unsavoury comment posted in a decentralized social media platform is deemed to have broken terms and conditions. + Kleros jurors rule to deduct reputation points from the user.
+
+
+
+ Insurance +
+

Gaming

+
Online gaming is a huge market which now has superstar players. With expected exponential growth in the professional + market, a highly skilled group of jurors will be needed both to arbitrate disputes, and the provision of safe + spaces to play in.
+
+
+
+ Crowdfunding
-
-
- decision kleros -
-

Enforcement

-

- The decision is enforced by the smart contract. -

+

Crowdfunding

+
A startup backed by crowdfunders never materialises a viable product. The funds have been locked in a smart contract + escrow adjudicated by Kleros jurors and are returned to the investors.
+
+
+
+ Curated Lists
+

E-Commerce

+
A product purchased online does not meet the advertised standard. Kleros adjudicates in favour of the buyer and + a smart contract returns the funds.
-
-
- +
+
+ Oracles
+

Oracles

+
“Did it rain in Ulaanbaatar today?” An oracle bridges the gap between the outside world and blockchain allowing + smart contracts to use real world data in their outcomes.
-
+ + + + -
-
-
-

TRANSPARENT DECISIONS

-

- Kleros can be used for dispute resolution and in a large number of - situations where a decision has to be made transparently because - it affects the interest of parties. -

-

- An entrepreneur hires a freelancer - for a software development gig. -
- A dispute arises about the scope of the contract. -

-

- Should the freelancer give the money back to his client? -

-

- A jury of software experts analyze the evidence and votes a - verdict. -
- A smart contract transfers the money to the winning party. -

-
+ +
+

Pinakion Token (PNK)

+

Users have an economic interest in serving as jurors in Kleros; They want to collect the arbitration fee that every juror + receives for their work.

+
+
+
+ Pinakion Feature +

First, they protect the system against sybil attacks.

+ + Find out more + Right Arrow +
-
-
- kleroterion kleros -
-
-

- - The Kleroterion was an allotment machine used by the Athenian - polis to select citizens to court juries. - -
-
- On trial days, citizen wishing to serve as jurors went to the - courthouse and inserted their pinakion (a bronze ID token) into a - slot of the Kleroterion. A justice official threw white and black - dice on a tube attached on a side of the machine. Candidates - having a black ball on their row were dismissed. Candidates with a - white ball were selected for paid jury duty. -
-
- https://en.wikipedia.org/wiki/Kleroterion -

-
+
+ Pinakion Feature +

Second, PNK provides jurors the incentive to vote honestly by making incoherent jurors pay part of their deposit + to coherent ones.

+ + Find out more + Right Arrow +
+
+
+
+ -
-
-

USES CASES

-
+ +
+

Security for Users and Jurors Alike

+

Bribe and attack resistant whilst offering user privacy through intelligent design.

+
+ + + +
+
+

Team

+
+
+
+ Team Member Portrait +
Federico Ast
+

CEO

-
-
-
 
-
-
-
 
-
+
+ Team Member Portrait +
Clément Lesaege
+

CTO

-
-
-
-
-

Arbitration

-

- An entrepreneur hires a freelancer for a software development - gig. A dispute arises about the scope of the contract. A jury - of software experts analyze the evidence and votes a verdict. - A smart contract transfers the money to the winning party. -

-
- Arbitration -
-
-
-
-
-

Crowdfunding

-

- A startup raises money with a crowdfunding campaign. Funds - will be released after the company presents a working - prototype. The company presents a prototype and requests that - the funds be disbursed. Kleros jurors vote that the prototype - does not meet the requirements. The payment is withheld. -

-
- Crowdfunding -
-
+
+ Team Member Portrait +
Nicolas Wagner
+

WEB3 DEVELOPER

- -
-
-
 
-
-
-
 
-
+
+
+ Team Member Portrait +
Sam Vitello
+

DAPP DEVELOPER

-
-
- -
-
- -
+
+ Team Member Portrait +
Romina Kavcic
+

DESIGN LEAD

-
-
-
 
-
-
-
 
-
+
+ Team Member Portrait +
Maria T. Vidal
+

COMMUNICATIONS LEAD

-
- -
-
-
-

TEAM

-
-
-
-
- Federico Ast -

Federico Ast

-

- CEO -
- linkedin icon - -

-
-
-
-
-
-
- -

Clément Lesaege

-

- CTO -
- linkedin icon - github icon -

-
-
-
-
-
-
- Sam Vitello -

Nicolas Wagner

-

- WEB3 DEVELOPER -
- linkedin icon - github icon - twitter icon -

-
-
-
-
-
-
-

JOIN OUR TEAM

-
-
- Anomymous -

- Want to contribute to
the justice revolution? -

-

- Jobs - or - Contact us -

-
-
-
+
+
+ Team Member Portrait +
Enrique Piqueras
+

DAPP DEVELOPER

-
-
-
-
-
-
- Sam Vitello -

Sam Vitello

-

- DAPP DEVELOPER -
- linkedin icon -

-
-
-
-
-
-
- Romina -

Romina Kavcic

-

- UI/UX DESIGNER -
- linkedin icon -

-
-
-
-
-
-
- Maria T. Vidal -

Maria T. Vidal

-

- COMMUNICATIONS
LEAD
-
- linkedin icon -

-
-
-
-
-
+
+ Team Member Portrait +
William George
+

CRYPTO-ECONOMIC RESEARCHER

-
-
-
-
-
-
- Sam Vitello -

Enrique Piqueras

-

- FRONT DEVELOPER -
- linkedin icon - github icon -

-
-
-
-
-
-
- William George -

William George

-

- CRYPTO-ECONOMIC
RESEARCHER
-
- linkedin icon -

-
-
-
-
-
-
- Romina -

Addison Huegel

-

- PUBLIC RELATIONS -
- linkedin icon -

-
-
-
-
-
+
+ Team Member Portrait +
Addison Huegel
+

PR

-
-
-
-
- Stuart -

Stuart James

-

- - COMMUNITY MANAGER - -
- linkedin icon -

-
-
-
+
+
+ Team Member Portrait +
Stuart James
+

COMMUNITY MANAGER

-
-
-

ADVISORS

-
-
- Ryan Polychain -

Ryan Zurrer

-

- - PRINCIPAL -
- POLYCHAIN CAPITAL -
-
- linkedin icon -

-
-
-
+
+ Team Member Portrait +
+ You? +
+

JOIN THE KLEROS TEAM!

-
+ + + + -
-
-
-

FREQUENTLY ASKED QUESTIONS

-
-
- -
-
- A decision protocol is a procedure that follows a number of - steps to reach a result. Kleros is a protocol that selects, - organizes, and incentivizes a tribunal of experts to make - transparent decisions. The tribunal is dissolved after the - decision is made. -
-
-
-
- -
-
- In Ancient Athens, all citizens had the right to opt-in for - paid jury duty for court and public office. In order to - avoid corruption and collusion, the Greek developed a - sophisticated selection procedure. Citizens were drawn by - sortition (kleros) using an allotment machine called - kleroterion (sortition machine). Kleros is inspired by the - sortition principle used in Greek democracy. Hence, the - name. -
-
-
-
- -
-
- Sortition is the random selection of political officials - from a pool of eligible candidates. Throughout history, - political systems have used sortition in order to avoid - corruption, collusion and factions. In Classical Athens, - randomly selected citizens carried out most administrative - duties. Florence and Venice, the most prosperous city states - of the Renaissance, mixed random selection with voting. The - founding fathers of the United States discussed sortition - for selecting the President and decided to use it for jury - selection in the justice system. Modern political theorists - believe that sortition has the potential of correcting many - of the flaws of representative democracy. To know more about - the potential of sortition for improving governance, take a - look at these books: The Principles of Representative - Government, The Political Potential of Sortition: A study of - the random selection of citizens for public office and - Sortition: Theory and Practice. -
-
-
-
- -
-
- Kleros’ early applications are connected to small claim - arbitration, such as freelance software development. Over - time, the protocol will be used for a wide range of - decisions requiring technical expertise for the allocation - of resources (real or symbolic) between parties. - For example: -
    -
  • - Doctors evaluating if a patient is eligible for - receiving an organ for a transplant. -
  • -
  • - Scholars deciding if a paper should be accepted for - publication. -
  • -
  • - Recruiters evaluating a candidate for a government - position. -
  • -
  • - Moderators deciding if a user violated terms and - conditions in a social media platform. -
  • -
  • - Technical experts evaluating if a song infringed copyright. -
  • -
  • - Analysts deciding if a user cheated in an e-gaming tournament. -
  • -
-
-
-
-
- -
-
- Kleros relies on concepts from game theory, cryptography and - blockchain for securing evidence, selecting jurors and - providing incentives to make honest decisions. The protocol - token (the pinakion, PNK) is used for jurors deposits. - Jurors voting incoherently loose some tokens to coherent - jurors. Incentives are based on a game - theoretical concept known as focal point. The fundamental - insight is that jurors voting coherently with the majority - should be rewarded. Jurors voting incoherently should be - punished. Users doing high quality and honest work will make - money. Users doing poor quality or dishonest work will lose - money. To learn more about the incentive structure, read our - white paper. -
-
-
-
- -
-
- The number of jurors is decided by the parties. They may - agree to have one, three, five or any number of jurors. If, - after a decision is made, one of the parties is not - satisfied, it can appeal and have the decision reviewed. The - case will be sent to a new tribunal with twice as many - jurors. -
-
-
-
- -
-
- Since decisions affect the allocation of resources, parties - may try to intimidate or bribe the tribunal. Jurors are - anonymous in order to protect them from intimidation and - retaliation. -
-
-
-
- -
-
- Satoshi Nakamoto taught us that a number of anonymous - computers who do not trust each can still reach consensus, - provided incentives are correctly structured. Kleros extends - this principle to human decision making. A number of - anonymous jurors who do not trust each other can reach - consensus on a right decision, provided incentives are - correctly structured. To learn more, read our - white paper. -
-
-
-
- -
-
- Kleros is an opt-in system, which means that parties have to - accept it beforehand. Enforcement mechanisms will depend on - the use case. In arbitration applications (e.g., small - claims), enforcement could be made by the government as in - any private arbitration court. In financial applications, - funds could stay in escrow to be enforced by a smart - contract when the decision is made. In other cases, Kleros - decisions could be enforced by the partner. Imagine a - decentralized social media platform using Kleros to punish - abuse. Kleros jury will decide whether abuse existed in a - specific case. Then, the social media platform enforces the - decision by taking reputation points away from the abuser. - In this case, the use of the platform automatically implies - accepting Kleros as dispute resolution mechanism. -
-
-
-
- -
-
- Anyone can earn money as a juror in the Kleros network. The - better the quality of your work, the more money you can make - as a juror. We are starting a number of pilots. If you would - like to participate, please contact us. -
-
-
-
- -
-
- Yes. We are starting to run pilots in a number of use cases. - Please contact us to see if your case - is eligible for a pilot. -
-
-
-
- -
-
- Kleros is an emerging technology involving blockchain, game - theory, collective intelligence, business, political science - and law. We are actively looking for Masters and PhD - students as well as senior scholars wishing to study Kleros. - Scholarly contributions will help improve our technology and - have a meaningful impact in the world. If you want to do - research about Kleros, please - contact us. -
-
-
-
- -
-
- Yes, we are actively seeking technical talent. Please - contact us. -
-
-
-
- -
-
- Kleros is an open source project that works as a - decentralized autonomous organization on Ethereum. The - community is the owner of Kleros and decide the evolution of - the protocol with a liquid democracy mechanism. -
-
-
-
-
+ + +
+ +
+ Media Ship +
+
+ + -
-
-
-

STAY TUNED

+ + +
- - + +
+ + + + + + + + + + + - - - - - - - - + \ No newline at end of file diff --git a/js/scrollSpy.js b/js/scrollSpy.js deleted file mode 100644 index f732827..0000000 --- a/js/scrollSpy.js +++ /dev/null @@ -1,21 +0,0 @@ - -$('body').scrollspy({ target: '#navbar-top' }); -$("#navbar-top ul li a[href^='#']").on('click', function(e) { - // prevent default anchor click behavior - e.preventDefault(); - // store hash - var hash = this.hash; - // animate - $('html, body').animate({ - scrollTop: $(hash).offset().top - }, 500, function(){ - // when done, add hash to url - // (default click behaviour) - window.location.hash = hash; - }); -}); -$(document).scroll(function () { - console.log('scroll'); - var $nav = $(".navbar-fixed-top"); - $nav.toggleClass('scrolled', $(this).scrollTop() > $nav.height()); -}); diff --git a/sitemap.xml b/sitemap.xml index ade61c4..32600dd 100644 --- a/sitemap.xml +++ b/sitemap.xml @@ -5,18 +5,18 @@ xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"> - https://kleros.io/ - 2017-11-14T16:26:04+00:00 + https://kleros.io + 2018-02-28T00:00:00+00:00 1.00 https://kleros.io/assets/whitepaper.pdf - 2017-11-14T16:26:04+00:00 + 2018-02-28T00:00:00+00:00 0.80 - https://kleros.io/assets/Kleros_One_Pager.pdf - 2017-11-14T16:26:04+00:00 + https://kleros.io/assets/kleros-one-pager.pdf + 2018-02-28T00:00:00+00:00 0.80 diff --git a/style.css b/style.css index 1b1c6d0..e2088ca 100644 --- a/style.css +++ b/style.css @@ -1,748 +1,789 @@ /**************** Fonts ****************/ @font-face { - font-family: "Museo Sans"; - src: url("fonts/museosans-500.otf"); + font-family: 'Metropolis'; + src: url('fonts/metropolis-bold-webfont.woff2') format('woff2'), + url('fonts/metropolis-bold-webfont.woff') format('woff'); + font-weight: 700; + font-style: normal; } @font-face { - font-family: 'Rift Soft'; - src: url('fonts/riftsoft-regular-webfont.woff2') format('woff2'), - url('fonts/riftsoft-regular-webfont.woff') format('woff'); - font-weight: normal; + font-family: 'Metropolis'; + src: url('fonts/metropolis-semibold-webfont.woff2') format('woff2'), + url('fonts/metropolis-semibold-webfont.woff') format('woff'); + font-weight: 600; font-style: normal; } -/**************** End fonts ****************/ - -body { - position: relative; - padding-top: 65px; - color: #fff; - font-family: "Museo Sans"; - background: url('img/assembly.jpg') no-repeat #1a1b23; +@font-face { + font-family: 'Metropolis'; + src: url('fonts/metropolis-medium-webfont.woff2') format('woff2'), + url('fonts/metropolis-medium-webfont.woff') format('woff'); + font-weight: 500; + font-style: normal; } -.no-padding { - padding: 0; +@font-face { + font-family: 'Metropolis'; + src: url('fonts/metropolis-regular-webfont.woff2') format('woff2'), + url('fonts/metropolis-regular-webfont.woff') format('woff'); + font-weight: 400; + font-style: normal; } -@media (max-width: 576px) { - h2, h3 { - text-align: center; - } +@font-face { + font-family: 'Metropolis'; + src: url('fonts/metropolis-light-webfont.woff2') format('woff2'), + url('fonts/metropolis-light-webfont.woff') format('woff'); + font-weight: 300; + font-style: normal; } +/**************** End Fonts ****************/ -/**************** Navbar ****************/ +/**************** Global ****************/ -.navbar { - padding: 1vh 16vh 1vh 16vh; - background: transparent; +* { + font-family: 'Metropolis', sans-serif !important; + scroll-behavior: smooth !important; } -.navbar-brand { - color: #777 !important; +html { + border: 0; + height: 100%; + margin: 0; + overflow-x: hidden; + padding: 84px 0 0; + width: 100%; } -.navbar-inverse .navbar-nav .nav-link { - color: #fff; +body { + overflow-x: hidden; + position: relative; } -.navbar-inverse .navbar-nav .nav-link:hover { - color: #777; +a { + color: #fff; } -.navbar-inverse .navbar-nav .nav-link:visited { +a:hover { color: #fff; + text-decoration: underline !important; } -.navbar-fixed-top { - top: 30px; +h1 { + font-size: 50px; + font-weight: 700; + line-height: 63px; } -.navbar-fixed-top.scrolled .navbar-brand { - color: #000; +h2 { + font-size: 55px; + font-weight: 500; + line-height: 49px; } -.navbar-fixed-top.scrolled { - background-color: #fff !important; - transition: background-color 200ms linear; +h3 { + font-size: 22px; + font-weight: 300; + line-height: 30px; } -.navbar-fixed-top.scrolled .nav-link { - color: #000; +h4 { + font-size: 20px; + line-height: 32px; } -.navbar-fixed-top.scrolled .nav-link:hover { - color: #777; +h5 { + font-size: 18px; + line-height: 30px; } -.navbar-fixed-top.scrolled .nav-link:visited { - color: #000; +h6 { + font-size: 16px; + line-height: 24px; } -.navbar-fixed-top.scrolled { - top: 0; +p { + font-size: 14px; + line-height: 24px; } -.active { - color: gray !important; +.btn.btn-lg { + font-size: 20px; + font-weight: 700; + height: 60px; + padding: 17px 1.5rem; + width: 241px; } -@media (max-width: 576px) { - .navbar { - padding: 10px;; - } - - .navbar-fixed-top { - top: 0; - } - - .navbar-fixed-top.scrolled .navbar-toggler { - background: lightgray; - } - - .btn { - margin: 0; - padding: 20px 0; - border-radius: 0; - } +.btn.btn-secondary { + color: #1b1b1b; + font-size: 15px; + font-weight: 700; } -/**************** End Navbar ****************/ - -/**************** Sections ****************/ - -.kleros { - height: 100vh; +/* For smooth scroll-to */ +.anchor { + height: 0; + position: relative; + top: -168px; + visibility: hidden; + width: 0; } -.protocol { - height: 100vh; +.rightArrow { + width: 30px; + margin-left: 10px; } -/**************** End Sections ****************/ +/**************** End Global ****************/ -/**************** Kleros section ****************/ +/**************** Header ****************/ -.img-phone-pinakion { - padding-top: 8vh; - width: 60vh; -} - -.kleros-based { - font-weight: bold; - font-size: 16px; +.Header { + background-image: url('img/header.svg'); + background-position: 50% 0; + background-repeat: no-repeat; + background-size: cover; + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-bottom: 278px; + padding-left: 12.75%; + padding-right: 12.75%; + padding-top: 122px; +} + +.Header-navbar { + background: #1a1b23; + height: 84px; + justify-content: center; + position: fixed; + top: 0; + z-index: 100; } -.kleros-title { - position: relative; - font-size: 70px; - font-family: "Rift Soft"; - color: rgb(161, 166, 203); +.Header-navbarToggler { + background: #fff; + text-align: center; + line-height: 9px; + z-index: 101; } -.kleros-wording { - padding-top: 30vh; +.Header-navbarBrand { + align-items: center; + display: flex; + flex: 1; + font-size: 13px; + font-weight: 300; + justify-content: flex-start; + letter-spacing: 5px; + margin-left: -40px; + padding-left: 12.75%; } -.kleros-description { - font-size: 20px; +.Header-navbarBrand:hover { + text-decoration: none !important; } -.btn-how-it-works { - color: rgb(49, 56, 68); - background-color: #fff; - font-weight: bold; +/* < medium */ +@media (max-width: 767px) { + .Header-navbarBrand { + justify-content: center; + padding-left: 0; + } } -.btn-wp { - margin-left: 20px; - font-weight: bold; - background-color: rgb(78, 81, 104); - border-color: transparent; +.Header-logo { + margin-right: 8px; } -.powered { +.Header-navbarContent { + background: #1a1b23; + flex: 2; font-size: 14px; - padding-top: 1vh; - color: rgb(219, 180, 113); - text-align: center; - opacity: 0.5; + font-weight: 700; + justify-content: flex-end; + width: initial !important; } -.powered img { - padding: 0 3px 0 7px; +.Header-navbarContent.show { + margin: 0 -16px; + padding: 13px 16px; + position: fixed; + top: 0; + width: 100% !important; } -.powered a { - color: red; +.Header-navbarContent.show .Header-btn-readTheWhitepaper { + margin-left: 0; } -.powered_crossjury { - width: 40px; +.Header-btn-readTheWhitepaper { + border: none; + margin-left: 61px; + margin-right: 60px; } -.btn-telegram { - width: 52px; - margin-left: 12px; +.Header-banner { + color: #fff; } -@media (max-width: 576px) { - .kleros-wording { - padding: 0; - } - - .kleros-based { - display: none; - } - - .kleros-title { - padding-top: 10vh; - font-size: 40px; - text-align: center; - } - - .kleros-description { - text-align: center; - } - - .btn-how-it-works { - margin-top: 10vh; - } +.Header-title { + margin-bottom: 5px; } -@media (max-width: 991px) { - .btn-wp { - margin-left: 0px; - } +.Header-tagline { + color: #a3a2a5; + margin-bottom: 34px; } -@media (max-width: 1200px) { - .btn-telegram { - display: none; - } +.Header-btn-learnMore { + margin-bottom: 73px; } -/**************** End Kleros section ****************/ - -/**************** Protocol section ****************/ - -#protocol { - padding-top: 130px; +.Header-social { + align-items: center; + display: flex; + font-weight: 500; + line-height: 19px; } -.protocol-title { - font-family: "Rift Soft"; - color: rgb(161, 166, 203); - font-size: 70px; +.Header-socialIcon { + cursor: pointer; + margin-left: 27px; } -.protocol-subtitle { - font-family: "Rift Soft"; - color: rgb(161, 166, 203); - font-size: 100px; -} +/**************** End Header ****************/ -.protocol-introduction { - font-size: 30px; -} +/**************** CountDown ****************/ -.protocol-smart-contract { - color: rgb(161, 166, 203); +.CountDown { + margin-left: -40px; + margin-right: -40px; + padding-bottom: 92px; + padding-left: 12.75%; + padding-right: 12.75%; } -.protocol-btn-how-it-works { - border-style: solid; - border-width: 2px; - border-color: rgb(124, 127, 150); - border-radius: 3px; - color: #fff; - background-color: #000; - font-weight: bold; +.CountDown-title { + color: #1a1b23; + margin-bottom: 0; + text-align: center; } -.protocol-btn-how-it-works:hover { - cursor: pointer; - color: #fff; - background-color: rgba(217, 217, 217, 0); +.CountDown-blocks { + align-items: center; + display: flex; + flex-wrap: wrap; + justify-content: center; + margin-top: 31px; } -.iMac { - overflow-x: hidden; +.CountDown-block { + align-items: center; + box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.09); + display: flex; + flex-direction: column; + height: 110px; + justify-content: center; + width: 120px; } -.img-iMac { - width: 90vh; +.CountDown-amount { + color: #1a1b23; + font-size: 32px; } -@media (max-width: 576px) { - #protocol { - padding-top: 0px; - } - - .protocol-title { - font-family: "Rift Soft"; - color: rgb(161, 166, 203); - font-size: 30px; - } - - .protocol-subtitle { - font-family: "Rift Soft"; - color: rgb(161, 166, 203); - font-size: 50px; - } - - .protocol-introduction { - font-size: 18px; - } +.CountDown-unit { + font-size: 14px; } -/**************** End Protocol section ****************/ - +/**************** End CountDown ****************/ -/**************** How it works section ****************/ +/**************** Video ****************/ -#how-it-works { - padding: 130px 0; +.Video { + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-left: 12.75%; + padding-right: 12.75%; } -.how-it-works-title { - padding: 10px 0; - font-family: "Rift Soft"; - color: rgb(255, 255, 255); - font-size: 60px; +.Video-container { + height: 0; + padding-bottom: 37.5%; + position: relative; } -.how-it-works-items { - margin-top: 10vh; +.Video-iframe { + height: 100%; + left: 0; + position: absolute; + top: 0; + width: 100%; } -.how-it-works-img { - height: 150px; -} +/**************** End Video ****************/ -.how-it-works-img-jury, .how-it-works-img-decision { - padding-top: 17px; -} +/**************** Challenge ****************/ -.how-it-works-content { - padding: 0 30px; - opacity: 0.5; - font-size: 16px; +.Challenge { + align-content: flex-start; + background: linear-gradient(#fff, transparent 50%), url('img/video.svg'); + background-position: 50% 0; + background-repeat: no-repeat; + background-size: cover; + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-bottom: 223px; + padding-left: 12.75%; + padding-right: 12.75%; + padding-top: 397px; + position: relative; + text-align: center; } -.how-it-works-btn-applications { - margin-top: 8vh; - border-style: solid; - border-width: 2px; - border-color: rgb(124, 127, 150); - border-radius: 3px; - color: #fff; - background-color: #000; - font-weight: bold; +.Challenge-text { + margin-top: 26px; } -.how-it-works-btn-applications:hover { +.Challenge-arrow { + bottom: 65px; cursor: pointer; - color: #fff; - background-color: rgba(217, 217, 217, 0); + display: block; + position: absolute; } -@media (max-width: 576px) { - #how-it-works { - padding: 20px 0; - } +.Challenge-arrowImage { + height: 72px; + width: 72px; +} - .how-it-works-content { - padding: 0; - } +/**************** End Challenge ****************/ - .how-it-works-title { - padding: 5px 0; - font-size: 50px; - } +/**************** Solution ****************/ + +.Solution { + align-content: flex-start; + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-bottom: 205px; + padding-left: 12.75%; + padding-right: 12.75%; + padding-top: 68px; + text-align: center; } +.Solution-text { + margin-top: 31px; +} -/**************** End How it works section ****************/ +.Solution-image { + width: 87.5%; +} +/**************** End Solution ****************/ -/**************** Applications section ****************/ +/**************** HowKlerosWorks ****************/ -#section-applications { - min-height: 70vw; - background: url("img/ipad.png") no-repeat; +.HowKlerosWorks { + background-image: url('img/how-kleros-works.svg'); + background-position: 50% 0; + background-repeat: no-repeat; background-size: cover; - background-position: -500px -200px, top; + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-bottom: 175px; + padding-left: 12.75%; + padding-right: 12.75%; + text-align: center; } -.applications-title { - padding-top: 50px; - font-family: "Rift Soft"; - font-size: 100px; +.HowKlerosWorks-steps { + margin-top: 86px; + text-align: left; } -.applications-introduction-text { - width: 410px; - color: rgb(127, 131, 163); - font-size: 1.2rem; - font-weight: bold; +.HowKlerosWorks-step { + padding: 0 10%; } -.applications-content-text-1 { - color: gray; - width: 400px; +/* >= large */ +@media (min-width: 992px) { + .HowKlerosWorks-step:nth-child(even) { + margin-top: 186px !important; + } } -.applications-content-text-2 { +.HowKlerosWorks-number { + color: #f2f5fa; + font-size: 70px; + font-weight: 700; + left: 35%; + position: absolute; + top: -60px; + z-index: -1; } -.applications-kleroterion { - font-size: 11px; +.HowKlerosWorks-icon { + float: left; + height: 80px; } -@media (max-width: 576px) { - #section-applications { - padding-top: 30px; - } - - .applications-title { - font-size: 40px; - } +.HowKlerosWorks-title { + font-weight: 700; +} - .applications-introduction-text { - width: 100%; - } +.HowKlerosWorks-description { + overflow: hidden; +} - .applications-content-text-1 { - width: 100%; - } +.HowKlerosWorks-crowdsourcing { + margin-top: 170px; } -/**************** End Applications section ****************/ +/**************** End HowKlerosWorks ****************/ -/**************** Uses cases section ****************/ +/**************** UseCases ****************/ -#uses-cases { - padding-top: 130px; +.UseCases { + background-image: url('img/use-cases.png'); + background-position: 50% 0; + background-repeat: no-repeat; + background-size: cover; + color: #fff; + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-bottom: 318px; + padding-left: 12.75%; + padding-right: 12.75%; + padding-top: 118px; + text-align: center; } -.uses-cases-title { - padding: 100px 40px; - font-family: "Rift Soft"; - color: rgb(255, 255, 255); - font-size: 60px; +.UseCases-useCases { + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding: 0 40px; + text-align: left; } -.uses-cases-col-left { - padding-right: 5vh; +.UseCases-useCase { + margin-top: 101px; } -.uses-cases-col-right { - padding-right: 5vh; +.UseCases-icon { + float: left; + height: 100%; + margin-right: 18px; + width: 60px; } -.uses-cases-border { - border-style: solid; - border-width: 0.05em 0 0 0; - border-color: rgb(219, 180, 113); - background-color: rgba(217, 217, 217, 0); - opacity: 0.2; +.UseCases-description { + font-weight: 300; + overflow: hidden; } -.uses-cases-item { - margin-bottom: 20px 40px 15px 20px; -} +/**************** End UseCases ****************/ -.uses-cases-img { - margin-right: 10px; -} +/**************** Pinakion ****************/ -.uses-cases-p { - padding: 20px; +.Pinakion { + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-bottom: 161px; + padding-left: 12.75%; + padding-right: 12.75%; + padding-top: 82px; + text-align: center; } -@media (max-width: 576px) { - .uses-cases-item-arbitration::before { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: .4; - z-index: -1; - background: url("img/arbitration.png") no-repeat top right; - background-position-x: 95%; - } +.Pinakion-description { + margin-top: 44px; +} - .uses-cases-item-crowdfunding::before { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: .4; - z-index: -1; - background: url("img/crowdfunding.png") no-repeat top right; - background-position-x: 95%; - } +.Pinakion-features { + justify-content: center; + text-align: left; +} - .uses-cases-item-copyright::before { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: .4; - z-index: -1; - background: url("img/copyright.png") no-repeat top right; - background-position-x: 95%; - } +.Pinakion-featureImage { + margin-bottom: 40px; + margin-top: 125px; + width: 100%; +} - .uses-cases-item-social::before { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: .4; - z-index: -1; - background: url("img/social_media.png") no-repeat top right; - background-position-x: 95%; - } +.Pinakion-findOutMore { + color: #0059ab; } +.Pinakion-findOutMore:hover { + color: #0059ab; +} -/**************** End Uses cases section ****************/ +/**************** End Pinakion ****************/ -/**************** Team section ****************/ +/**************** Security ****************/ -#team { - padding-top: 60px; +.Security { + background-image: url('img/security.png'); + background-position: 50% 0; + background-repeat: no-repeat; + background-size: cover; + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-bottom: 715px; + padding-left: 12.75%; + padding-right: 12.75%; + padding-top: 119px; + text-align: center; } -.team-title { - padding-top: 50px; - font-family: "Rift Soft"; - font-size: 50px; +.Security-description { + margin-top: 27px; } -.team-advisors-title { - font-family: "Rift Soft"; - font-size: 40px; -} +/**************** End Security ****************/ -.team-join { - line-height: 53px; - font-size: 30px; - text-align: right; -} +/**************** Team ****************/ -.team-name { - margin: 0; - padding: 5px; - font-size: 20px; - font-weight: bold; +.Team { + justify-content: center; + margin-left: -40px; + margin-right: -40px; + padding-bottom: 182px; + padding-left: 12.75%; + padding-right: 12.75%; + text-align: center; } -.contributor { - margin: 0; - padding: 0; - padding-top: 5px; - font-size: 15px; +.Team-members { + justify-content: space-between; + margin-top: 15%; } -.status { - font-variant: small-caps; - color: #bca161; +.Team-member { + margin-top: 60px; + min-width: 230px; + position: relative; } -.team-img-federico { - +.Team-member--you { + margin-left: auto; + margin-right: auto; } -.team-img-lesaege { - padding-top: 3px; +.Team-memberPortrait { + background: #f5f6f8; + border-radius: 100px; + height: 200px; + width: 200px; } -.team-img-wagner { - padding-top: 7px; +.Team-memberName { + font-weight: 700; + margin-top: 21px; } -@media (max-width: 576px) { - #team { - padding-top: 0; - } +.Team-memberRole { + color: #47525d; +} - .team-name { - font-size: 17px; - } +.Team-jobsLink { + color: #0059ab; +} - .team-join { - text-align: center; - } +.Team-jobsLink:hover { + color: #0059ab; } -/**************** End Team section ****************/ +/**************** End Team ****************/ -/**************** FAQ section ****************/ +/**************** Media ****************/ -#FAQ { - padding-top: 60px; +.Media { + justify-content: center; + padding-top: 100px; + text-align: center; } -.faq-title-section { - padding: 30px 0; - font-family: "Rift Soft"; - color: rgb(255, 255, 255); - font-size: 50px; +.Media-cards { + justify-content: center; + margin-top: 68px; + text-align: left; } -.card, .card-header { - padding: 5px 0 5px 0; - background: transparent; - border: none; +.Media-card { + border: 1px solid #f2f5fa; + border-radius: 4px; + box-shadow: 0 2px 1px 0 #d2d1ce; + margin: 38px 15px; + padding: 40px 30px 20px; } -/**************** End FAQ section ****************/ - -/**************** Contact section ****************/ - -#contact { - padding-top: 60px; +.Media-titleImage { + height: 23px; + margin-bottom: 35px; } -.contact-title-section { - padding: 40px 0; - font-family: "Rift Soft"; - color: rgb(255, 255, 255); - font-size: 40px; +.Media-date { + color: #9b9b9b; + font-weight: normal; } -.contact-icon-bottom { - padding-top: 30px; +.Media-readMore { + color: #0059ab; + font-size: 16px; + font-weight: 500; + margin-top: 60px; + text-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.27); } -.contact-slack-icon { - width: 70px; +.Media-outlets { + height: 59px; + max-width: 100%; } -.contact-twitter-icon { +.Media-ship { + height: 288px; + margin-top: 200px; position: relative; - top: -10px; - width: 80px; + top: 13px; } -.contact-fb-icon { - width: 65px; -} +/**************** End Media ****************/ -.contact-github-icon { - width: 70px; -} +/**************** Footer ****************/ -.contact-medium-icon { - width: 70px; +.Footer { + text-align: center; } -.contact-telegram-icon { - width: 70px; +.Footer-callToAction { + background-image: url('img/footer.svg'); + background-position: 50% 0; + background-repeat: no-repeat; + background-size: cover; + color: #fff; + justify-content: center; + padding: 84px 0 64px 0; } -.contact-reddit-icon { - width: 70px; - opacity: 0.9; - filter: alpha(opacity=90); +.Footer-signUpMessage { + font-size: 30px; + font-weight: 700; } -.form-input { - background: transparent; - border-radius: 0; - border: none; - border-bottom: solid 1px rgb(127, 131, 163); +.Footer-quote { + font-weight: 300; + margin-top: 16px; + text-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.27); } -.form-input:hover { - border-radius: 0; - border: none; - border-bottom: solid 1px rgb(127, 131, 163); +.Footer-signUpInput { + margin-top: 28.5px; } -.form-control:focus {border-color:rgba(100,100,100,1) !important; - -webkit-box-shadow: none !important; - -moz-box-shadow: none !important; - box-shadow: none !important; +.Footer-inputGroup { + height: 65px; } -.submit { - text-decoration: none; - color: #000; - margin-top: 1rem; - padding: 8px 12px; - border: none; +.Footer-formControl { + background: #ffffff; + border: 1px solid rgba(151, 151, 151, 0.21); border-radius: 3px; - background-color: rgb(131, 137, 177); - font-size: 14px; + box-shadow: 10px 10px 20px 0 rgba(0, 0, 0, 0.05); + padding-left: 29.5px; } -.submit:hover { - text-decoration: none; +.btn-signUpButton { + background: #dd042b; + border: none; + border-radius: 0 3px 3px 0; + box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.1), + 0 2px 9px 0 rgba(0, 0, 0, 0.17); + color: #fff !important; cursor: pointer; + width: 100%; } -.jobs { - padding-top: 10px; +.btn-signUpButton:hover { + background: #000; } -@media (max-width: 576px) { - .contact-twitter-icon { - padding-top: 17px; - } +.Footer-signUpPrivacy { + color: rgba(255, 255, 255, 0.35); + font-size: 13px; + font-weight: 300; + margin-top: 23.5px; + text-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.27); } -/**************** End Contact section ****************/ +.Footer-separator { + background: #fff; + height: 2px; + margin-bottom: 80px; + margin-top: 59px; + opacity: 0.11; +} +.Footer-links { + text-align: left; +} -/**************** Footer ****************/ +.Footer-linksList { + font-weight: 300; +} -footer { - padding: 3vh 15vh 2vh 10vh; - font-size: 14px; - color: #ccc; +.Footer-socialLink:hover { + text-decoration: none; } -.footer-logo { - display: inline; - width: 50px; +.Footer-socialIcon { + height: 37px; + margin-right: 8px; + margin-top: 6px; + width: 37px; } -.footer-right { - line-height: 48px; +.Footer-end { + color: #1a1b23; + justify-content: space-around; + padding-bottom: 65px; + padding-top: 35px; } -footer-right a { - color: gray; - text-decoration: underline; +.Footer-brand { + align-items: center; + color: #1a1b23; + display: flex; + font-size: 13px; + font-weight: 300; + letter-spacing: 5px; } -@media (max-width: 576px) { - footer { - text-align: center; - } +.Footer-brand:hover { + color: #1a1b23; + text-decoration: none !important; +} - footer-right { - position: relative; - } +.Footer-logo { + margin-right: 8px; +} - .telegram-button { - display: none; - } +.Footer-copyright { + text-align: right; } /**************** End Footer ****************/