diff --git a/about.html b/about.html
index afc16d566f02376839263127042ee3f022afcc03..dd7c5f042b4bf5eefdb489de8863a64474c03ec8 100644
--- a/about.html
+++ b/about.html
@@ -8,60 +8,64 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="about">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2>About us</h2>
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <p><strong>Michael Rogers</strong> started the Briar project to support freedom of expression, freedom of association and the right to privacy. He has studied and built peer-to-peer systems for over a decade, contributed to Freenet and LimeWire, and is now a postdoc researcher at TU Delft.</p>
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2>About us</h2>
+
+ <p><strong>Michael Rogers</strong> started the Briar project to support freedom of expression, freedom of association and the right to privacy. He has studied and built peer-to-peer systems for over a decade, contributed to Freenet and LimeWire, and is now a postdoc researcher at TU Delft.</p>
- <p><strong>Eleanor Saitta</strong> is a hacker, designer, artist, writer, and barbarian. She has ten years' experience as a security consultant, and makes a living and a vocation of understanding how complex systems operate and redesigning them to work, or at least fail, better.</p>
+ <p><strong>Eleanor Saitta</strong> is a hacker, designer, artist, writer, and barbarian. She has ten years' experience as a security consultant, and makes a living and a vocation of understanding how complex systems operate and redesigning them to work, or at least fail, better.</p>
- <p><strong>Bernard Tyers</strong> is an independent interaction designer and user researcher. He is interested in privacy and applying user-centred design to usable security. He is a long-time supporter of the Open Rights Group, Tor and free software projects.</p>
+ <p><strong>Bernard Tyers</strong> is an independent interaction designer and user researcher. He is interested in privacy and applying user-centred design to usable security. He is a long-time supporter of the Open Rights Group, Tor and free software projects.</p>
- <p><strong>Ximin Luo</strong> is a software engineer by trade, interested in decentralised systems, cryptography, and network security. He is a long-time supporter of anti-censorship and free software projects, and also contributes to Tor, Debian, and Freenet.</p>
+ <p><strong>Ximin Luo</strong> is a software engineer by trade, interested in decentralised systems, cryptography, and network security. He is a long-time supporter of anti-censorship and free software projects, and also contributes to Tor, Debian, and Freenet.</p>
+
+ <p>Briar has received funding from <a href="http://smallmediafoundation.com/">Small Media</a>, the <a href="https://openitp.org/">Open Internet Tools Project</a>, and <a href="https://accessnow.org/">Access</a>.</p>
- <p>Briar has received funding from <a href="http://smallmediafoundation.com/">Small Media</a>, the <a href="https://openitp.org/">Open Internet Tools Project</a>, and <a href="https://accessnow.org/">Access</a>.</p>
+ <p>To contact the team, please email <a href="mailto:contact@briarproject.org">contact@briarproject.org</a> [<a href="keys/contact.asc">PGP key</a>].</p>
- <p>To contact the team, please email <a href="mailto:contact@briarproject.org">contact@briarproject.org</a> [<a href="keys/contact.asc">PGP key</a>].</p>
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- intro -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -85,9 +89,6 @@
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/copyright.html b/copyright.html
index c9269be37850677f51b024e370bbd96c6a0f7f4e..1faaf9f0cd684b4c62609a988d983da5a0b18eb0 100644
--- a/copyright.html
+++ b/copyright.html
@@ -8,58 +8,61 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="copyright">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2 >Copyright</h2>
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2 >Copyright</h2>
- <p>Briar is free software. You can redistribute it and modify it under the terms of the <a href="https://gnu.org/licenses/gpl.txt">GNU General Public License</a>.</p>
+ <p>Briar is free software. You can redistribute it and modify it under the terms of the <a href="https://gnu.org/licenses/gpl.txt">GNU General Public License</a>.</p>
- <p>Google Play is a trademark of Google Inc. The Android robot is reproduced or modified from work created and shared by Google and used according to terms described in the <a href="https://creativecommons.org/licenses/by/3.0">Creative Commons 3.0 Attribution License</a>.</p>
+ <p>Google Play is a trademark of Google Inc. The Android robot is reproduced or modified from work created and shared by Google and used according to terms described in the <a href="https://creativecommons.org/licenses/by/3.0">Creative Commons 3.0 Attribution License</a>.</p>
- <p>The mobile phone image is reproduced or modified from work created and shared by <a href="https://secure.flickr.com/photos/vernieman">Vernon Chan</a> and used according to terms described in the <a href="https://creativecommons.org/licenses/by/2.0">Creative Commons 2.0 Attribution License</a>.</p>
+ <p>The mobile phone image is reproduced or modified from work created and shared by <a href="https://secure.flickr.com/photos/vernieman">Vernon Chan</a> and used according to terms described in the <a href="https://creativecommons.org/licenses/by/2.0">Creative Commons 2.0 Attribution License</a>.</p>
- <p>The server icon was created by <a href="http://www.visualpharm.com/">VisualPharm</a>.</p>
+ <p>The server icon was created by <a href="http://www.visualpharm.com/">VisualPharm</a>.</p>
- <p>All other content on this website is (c) 2014 Sublime Software Ltd. You can redistribute and modify it under the terms of the <a href="https://creativecommons.org/licenses/by/4.0">Creative Commons 4.0 Attribution License</a>.</p>
+ <p>All other content on this website is (c) 2014 Sublime Software Ltd. You can redistribute and modify it under the terms of the <a href="https://creativecommons.org/licenses/by/4.0">Creative Commons 4.0 Attribution License</a>.</p>
+
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- intro -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -83,9 +86,6 @@
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/css/styles.css b/css/styles.css
index 10076f6b6f483cf45f54026a63fec3978377c512..8fa00f040535b2ba430cb8e23b44969b789f1ab9 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1,9 +1,9 @@
/* CSS Document */
body, html {
- height: 100%;
- margin: 0px auto;
- padding: 0px auto;
+ height:100%;
+ margin:0;
+ padding:0;
background-color:#fff;
font-size:1em;
font-family:Arial, Helvetica, sans-serif;
@@ -16,42 +16,62 @@ body#how a#hownav,
body#about a#aboutnav,
body#involved a#involvednav {color:#87C214;}
+#wrapper {
+ min-height:100%;
+ margin-bottom:-2em;
+}
+
img {
- margin:0px;
+ margin:0;
display:inline;
- padding:0px;
+ padding:0;
border:none;
- vertical-align: middle;
+ vertical-align:middle;
}
-figure {text-align:center;margin:0px 0px 50px 0px;padding:0px;}
+figure {
+ text-align:center;
+ margin:0 0 50px 0;
+ padding:0;
+}
-figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
+figcaption {
+ margin:10px 0 0 0;
+ font-weight:bold;
+ text-align:center;
+}
@-ms-viewport{
- zoom: 1.0;
- width: extend-to-zoom;
+ zoom:1.0;
+ width:extend-to-zoom;
}
.clearboth {clear:both;}
#header_container {
height:120px;
- position:fixed;
+ position:static;
width:100%;
top:0;
background-color:#2D3E50;
+ float:left;
}
-#header {margin:20px auto 0 auto;width:65%;}
+#header {
+ margin:20px auto 0 auto;
+ width:700px;
+}
-#logo {float:left;width:20%;}
+#logo {
+ float:left;
+ width:20%;
+}
.logo {
border:3px solid #2D3E50;
- -webkit-border-radius: 20px;
- -moz-border-radius: 20px;
- border-radius: 20px;
+ -webkit-border-radius:20px;
+ -moz-border-radius:20px;
+ border-radius:20px;
background-color:#fff;
padding:30px 20px 17px 20px;
margin-top:-40px;
@@ -63,24 +83,41 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
#nav {
font-weight:bold;
- padding:0px 0px 0px 0px;
+ padding:0 0 0 0;
float:right;
- margin:0px auto 10px auto;
+ margin:10px auto 10px auto;
vertical-align:bottom;
width:80%;
}
-#nav a:link {text-decoration:none;color:#fff;}
-#nav a:visited {text-decoration:none;color:#fff;}
-#nav a:hover {text-decoration:none;color:#87C214;}
-#nav a:active {text-decoration:none;color:#fff;}
+#nav a:link {
+ text-decoration:none;
+ color:#fff;
+}
+
+#nav a:visited {
+ text-decoration:none;
+ color:#fff;
+}
+
+#nav a:hover {
+ text-decoration:none;
+ color:#87C214;
+}
+
+#nav a:active {
+ text-decoration:none;
+ color:#fff;
+}
+
+#nav label {display:none;}
#nav ul {
clear:both;
display:block;
list-style-type:none;
font-size:0.9em;
- padding:0px 0px 0px 0px;
+ padding:0 0 0 0;
margin:0;
text-align:right;
height:auto;
@@ -89,27 +126,34 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
#nav li {
list-style-type:none;
display:inline;
- padding:0px 0px 0px 20px;
+ padding:0 0 0 20px;
text-transform:uppercase;
- margin:0px;
+ margin:0;
font-weight:bold;
white-space:nowrap;
}
#nav a.current {color:#87C214;}
+#menu-toggle {display:none;}
+
#signup2 {display:none;}
-#signupform {height:30px;padding-bottom:10px;float:right;text-align:right;}
+#signupform {
+ height:30px;
+ padding-bottom:10px;
+ float:right;
+ text-align:right;
+}
#signupform2 {
height:auto;
- padding-bottom:10px;
+ padding-bottom:0;
float:left;
width:80%;
font-size:1.5em;
padding-top:10px;
- padding-left:0px;
+ padding-left:0;
}
#signupconf {
@@ -121,7 +165,7 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
color:#fff;
font-size:0.9em;
font-weight:bold;
- padding-bottom:0px;
+ padding-bottom:0;
padding-top:10px;
}
@@ -133,7 +177,7 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
width:80%;
font-size:1.5em;
padding-top:10px;
- padding-left:0px;
+ padding-left:0;
}
#signupform input, textarea {
@@ -144,7 +188,7 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
background-color:#E2E1E1;
color:#565555;
padding:3px 5px;
- border:0px;
+ border:0;
}
#signupform2 input, textarea {
@@ -155,17 +199,17 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
background-color:#E2E1E1;
color:#565555;
padding:3px 5px;
- border:0px;
+ border:0;
}
#signupform button {
width:auto;
background-color:#C1392B;
color:#fff;
- border:0px;
- -webkit-border-radius: 5px;
- -moz-border-radius: 5px;
- border-radius: 5px;
+ border:0;
+ -webkit-border-radius:5px;
+ -moz-border-radius:5px;
+ border-radius:5px;
text-transform:uppercase;
font-size:0.6em;
font-weight:normal;
@@ -176,10 +220,10 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
width:auto;
background-color:#C1392B;
color:#fff;
- border:0px;
- -webkit-border-radius: 5px;
- -moz-border-radius: 5px;
- border-radius: 5px;
+ border:0;
+ -webkit-border-radius:5px;
+ -moz-border-radius:5px;
+ border-radius:5px;
text-transform:uppercase;
font-size:0.6em;
font-weight:normal;
@@ -188,61 +232,105 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
#container {
margin:0 auto;
- padding:175px 0 30px 0;
- width:65%;
+ padding:175px 0 3em 0;
+ width:700px;
background:#fff;
- height: 100%;
+ height:auto;
}
#content {
- margin:20px 60px 20px 180px;
+ margin:20px 0 0 0;
font-size:0.9em;
line-height:1.4em;
}
#content ul {}
-#content li {margin:0px 0px 10px 0px;}
+
+#content li {margin:0 0 10px 0;}
#content h1 {
- margin:23px 20px 0px 0px;
+ margin:23px 20px 0 0;
font-size:3.5em;
line-height:1.1em;
font-weight:normal;
}
#content h2 {
- margin:23px 20px 0px 0px;
- font-size:2.9em;
+ margin:23px 20px 0 0;
+ font-size:2.5em;
line-height:1.1em;
font-weight:normal;
}
#content h3 {
- margin:20px 20px 0px 0px;
+ margin:20px 20px 0 0;
font-size:2em;
line-height:1.1em;
font-weight:normal;
}
-#content h4 {margin:20px 20px 0px 0px;}
-#content h5 {margin:20px 20px 0px 0px;}
-#content h6 {margin:20px 20px 0px 0px;}
-#content p {margin:20px 20px 20px 0px;}
+#content h4 {
+ margin:20px 20px 0 0;
+ font-size:1.5em;
+ line-height:1.1em;
+ font-weight:normal;
+}
-#content a:link {text-decoration:none;color:#87C214;font-weight:bold;}
-#content a:visited {text-decoration:none;color:#87C214;font-weight:bold;}
-#content a:hover {text-decoration:none;color:#C1392B;font-weight:bold;}
-#content a:active {text-decoration:none;color:#87C214;font-weight:bold;}
+#content h5 {
+ margin:20px 20px 0 0;
+ font-size:1em;
+ line-height:1.1em;
+ font-weight:normal;
+}
+
+#content h6 {
+ margin:20px 20px 0 0;
+ font-size:1em;
+ line-height:1.1em;
+ font-weight:normal;
+}
+
+#content p {margin:20px 20px 20px 0;}
+
+#content a:link {
+ text-decoration:none;
+ color:#87C214;
+ font-weight:bold;
+}
+
+#content a:visited {
+ text-decoration:none;
+ color:#87C214;
+ font-weight:bold;
+}
+
+#content a:hover {
+ text-decoration:none;
+ color:#C1392B;
+ font-weight:bold;
+}
+
+#content a:active {
+ text-decoration:none;
+ color:#87C214;
+ font-weight:bold;
+}
-#content .intro #introlist {margin:27px 0px 32px 0px;padding-left:15px;}
-#content .intro #introlist li {margin:1em 20px 0px 0px;}
+#content .intro #introlist {
+ margin:30px 0 32px 10px;
+ padding-left:20px;
+}
+
+#content .intro #introlist ul {}
+
+#content .intro #introlist li {margin:1em 20px 0 0;}
#content .intro #sublist {
clear:both;
display:block;
list-style-type:none;
- padding:0px;
- margin:10px 0 0px 0;
+ padding:0;
+ margin:10px 0 0 0;
line-height:1.4em;
height:auto;
}
@@ -251,33 +339,51 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
float:left;
list-style-type:none;
display:inline;
- padding:0px 20px 0px 0px;
- margin:10px 0px 0px 0px;
+ padding:0 20px 0 0;
+ margin:10px 0 0 0;
white-space:nowrap;
}
#sublist a.selected {color:#C1392B;}
-.intro {width:70%;float:left;padding-bottom:40px;}
-.full {width:100%;float:left;padding-bottom:40px;}
+.intro {
+ width:70%;
+ float:left;
+ padding-bottom:40px;
+}
+
+.full {
+ width:100%;
+ float:left;
+ padding-bottom:40px;
+}
+
+.intro .button {
+ margin-right:30px;
+ margin-bottom:20px;
+}
-.intro .button {margin-right:30px;margin-bottom:20px;}
.intro .button2 {margin-bottom:20px;}
-#phone {width:30%;float:left;display:inline;}
+#phone {
+ width:30%;
+ float:left;
+ display:inline;
+}
+
#phone2 {display:none;}
-#flattr {
- font-size:0.6em;
-}
+#flattr {font-size:0.6em;}
#footer_container {
- color:#666;
+ background-color:#87C214;
+ color:#fff;
bottom:0;
- height:30px;
+ height:2em;
left:0;
position:static;
width:100%;
+ clear:both;
}
#footer {
@@ -287,16 +393,15 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
text-align:center;
font-size:0.7em;
font-weight:bold;
- background-color:#87C214;
- color:#fff;
+ float:left;
}
#footer ul {
- width:65%;
+ width:700px;
display:block;
list-style-type:none;
font-size:0.9em;
- padding:0px 0px 0px 0px;
+ padding:0 0 0 0;
margin:0 auto;
text-align:left;
}
@@ -304,57 +409,57 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
#footer li {
list-style-type:none;
display:inline;
- padding:0px 10px 0px 0px;
- margin:0px;
+ padding:0 10px 0 0;
+ margin:0;
font-weight:normal;
}
-#footer a:link {text-decoration:none;color:#fff;}
-#footer a:visited {text-decoration:none;color:#fff;}
-#footer a:hover {text-decoration:none;color:#fff;}
-#footer a:active {text-decoration:none;color:#fff;}
-
-@media all and (max-width:1400px) {
- #header_container {
- position:static;
- float:left;
- width:100%;
- top:0;
- background-color:#2D3E50;
- }
- #header, #container {width:80%;}
- #footer ul {width:80%;}
- #content {margin-left:0px;margin-right:0px;}
+#footer a:link {
+ text-decoration:none;
+ color:#fff;
}
-@media all and (max-device-width:1100px) {
- #header_container {
- position:static;
- float:left;
- width:100%;
- top:0;
- background-color:#2D3E50;
- }
- #header, #container {width:80%;}
- #footer ul {width:80%;}
- #content {margin-left:0px;margin-right:0px;}
+#footer a:visited {
+ text-decoration:none;
+ color:#fff;
}
-@media all and (max-width:800px) {
- #nav {width:400px;}
- figure img {width:100%;}
+#footer a:hover {
+ text-decoration:none;
+ color:#fff;
}
-@media all and (max-device-width:800px) {
- #nav {width:400;}
- figure img {width:100%;}
+#footer a:active {
+ text-decoration:none;
+ color:#fff;
}
-@media all and (max-width:645px) {
- #nav {width:300px;}
- #header_container {height:auto;}
- #phone img {width:100px;}
- .intro {width:100%;}
+@media only screen and (max-width: 48em) {
+ #wrapper {margin-bottom:-5em;}
+
+ #content {
+ margin-left:0;
+ margin-right:0;
+ }
+
+ #content figure img {width:100%;}
+
+ #container {
+ width:90%;
+ padding-top:70px;
+ padding-bottom:5em;
+ }
+
+ #content h1 {
+ font-size:2em;
+ margin-top:15px;
+ }
+
+ #content h2 {
+ font-size:2em;
+ margin-top:15px;
+ }
+
#phone2 {
width:auto;
clear:both;
@@ -363,57 +468,107 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
margin:20px 20px 20px 0;
float:left;
}
+
#phone {display:none;}
- #logo {margin-bottom:20px;}
-}
-@media screen and (max-device-width:645px) {
- #nav {width:300px;}
- #header_container {height:auto;}
- #phone img {width:100px;}
.intro {width:100%;}
- #phone2 {
+
+ .logo {display:none;}
+
+ #header {
+ height:auto;
+ margin:0;
+ width:100%;
+ float:left;
+ padding:0;
+ }
+
+ #logo {
+ padding:0;
+ margin:0;
+ float:left;
+ width:50%;
+ height:71px;
+ background-size:129px 51px;
+ -webkit-background-size:129px 51px;
+ -moz-background-size:129px 51px;
+ -o-background-size:129px 51px;
+ background-image:url('../img/briar_logo_sm.png');
+ background-position:1em 10px;
+ background-repeat: no-repeat;
+ }
+
+ #header_container {
+ height:auto;
+ position:static;
+ float:left;
+ margin:0;
+ }
+
+ #nav {
+ float:left;
+ width:50%;
+ margin:0;
+ }
+
+ #nav a {
+ width:100%;
+ height:3em;
+ display:block;
+ }
+
+ #nav label {
+ display:block;
+ float:right;
+ margin:0 1em 0 0;
+ line-height:71px;
+ }
+
+ label {cursor:pointer;}
+
+ #nav ul {display:none;}
+
+ #menu-toggle {display:none;}
+
+ #menu {display:none;}
+
+ #menu-toggle:checked + #menu {display:block;}
+
+ #menu li {
+ background:#2D3E50;
+ border-top:1px solid #34495e;
+ border-bottom:1px solid #273646;
+ margin-left:-100%;
+ display:block;
+ font-size:0.9em;
+ line-height:3em;
+ text-align:left;
+ padding:2px 0 0 30px;
+ }
+
+ #footer_container {height:5em;}
+
+ #footer ul {
width:auto;
clear:both;
- text-align:center;
- display:inline;
- margin:20px 20px 20px 0;
- float:left;
+ margin:10px 10px 10px 15px;
}
- #phone {display:none;}
- #logo {margin-bottom:20px;}
-}
-@media all and (max-width:520px) {
- #nav {width:200px;}
- #signupform {height:auto;width:150px;}
- #signupform button {margin:10px 0 0px 0;}
- #signupform input, textarea {margin-right:0px;}
- #content .intro #introlist {clear:both;}
- .intro p {clear:both;}
-}
+ #footer {text-align:left;}
-@media screen and (max-device-width:520px) {
- #nav {width:200px;}
- #signupform {height:auto;width:150px;}
- #signupform button {margin:10px 0 0px 0;}
- #signupform input, textarea {margin-right:0px;}
- #content .intro #introlist {clear:both;}
- .intro p {clear:both;}
-}
+ #footer form {
+ margin:10px 10px 0 15px;
+ padding:0;
+ }
+
+ #signup2 {
+ width:100%;
+ display:inline;
+ }
-@media all and (max-width:400px) {
- #nav {width:150px;}
- #header, #container {width:90%;}
- #container {padding-top:140px;}
- #signup2 {display:inline;}
#signup {display:none;}
}
-@media screen and (max-device-width:400px) {
- #nav {width:150px;}
- #header, #container {width:90%;}
- #container {padding-top:140px;}
- #signup2 {display:inline;}
- #signup {display:none;}
+@media only screen and (max-width: 28em) {
+ #content .intro #introlist {clear:both;}
}
diff --git a/download.html b/download.html
index 7d7db746b8582e9e1b9917b2b0e1c6f588beb24d..6d18c3a972a2bd543276a5f8bed83da66e0e5310 100644
--- a/download.html
+++ b/download.html
@@ -8,50 +8,54 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="download">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2>Coming Soon</h2>
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <p>Briar for Android is currently in private beta and will be available for download soon. If you'd like to be informed when the app is available, please <a href="https://lists.sourceforge.net/lists/listinfo/briar-announce">join the announcement mailing list</a>.</p>
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2>Coming Soon</h2>
+
+ <p>Briar for Android is currently in private beta and will be available for download soon. If you'd like to be informed when the app is available, please <a href="https://lists.sourceforge.net/lists/listinfo/briar-announce">join the announcement mailing list</a>.</p>
+
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- intro -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -75,9 +79,6 @@
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/get-involved.html b/get-involved.html
index 4cbe91173e58922aac6ca4b01c2e7c6e2b84264d..72ca0a77bc13d52ebfc711dbd9aab985cc64f604 100644
--- a/get-involved.html
+++ b/get-involved.html
@@ -8,60 +8,64 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="involved">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2>Get Involved</h2>
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <p>The Briar project is looking for help! We need people to contribute to all aspects of the project, including design, development, documentation, translation and testing.</p>
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2>Get Involved</h2>
- <p>If you're a UX designer or a Java developer, we'd love to hear from you - we're happy to provide guidance or mentoring for less experienced developers. Knowledge of Android or Swing would be especially useful.</p>
+ <p>The Briar project is looking for help! We need people to contribute to all aspects of the project, including design, development, documentation, translation and testing.</p>
- <p>We're also looking for people who can help with technical documentation, user documentation, translations and testing.</p>
+ <p>If you're a UX designer or a Java developer, we'd love to hear from you - we're happy to provide guidance or mentoring for less experienced developers. Knowledge of Android or Swing would be especially useful.</p>
- <p>If you're interested in getting involved or following the progress of the project, please <a href="https://lists.sourceforge.net/lists/listinfo/briar-devel">join the development mailing list</a>.</p>
+ <p>We're also looking for people who can help with technical documentation, user documentation, translations and testing.</p>
- <p>All our software is open source - you can <a href="http://code.briarproject.org/akwizgran/briar/tree/master">browse the source code</a> or clone the Git repository:</p>
+ <p>If you're interested in getting involved or following the progress of the project, please <a href="https://lists.sourceforge.net/lists/listinfo/briar-devel">join the development mailing list</a>.</p>
- <p align="center"><strong> git clone http://code.briarproject.org/akwizgran/briar.git</strong></p>
+ <p>All our software is open source - you can <a href="https://code.briarproject.org/akwizgran/briar/tree/master">browse the source code</a> or clone the Git repository:</p>
+
+ <p align="center"><strong> git clone https://code.briarproject.org/akwizgran/briar.git</strong></p>
+
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- intro -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -85,9 +89,6 @@
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/how-it-works.html b/how-it-works.html
index 8171826204bf963cb2e2624d156a862885420517..ea5c13fd652ea1231255624ed8cc355cc46d204e 100644
--- a/how-it-works.html
+++ b/how-it-works.html
@@ -8,46 +8,50 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="how">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="full">
- <h2>How it Works</h2>
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <p>Briar is a messaging app designed for activists, journalists, and
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2>How it Works</h2>
+
+ <div class="clearboth"></div>
+
+ <p>Briar is a messaging app designed for activists, journalists, and
anyone else who needs a safe, easy and robust way to communicate.
Unlike traditional messaging tools such as email, Twitter or Telegram,
Briar doesn't rely on a central server - messages are synchronized
@@ -56,48 +60,49 @@ sync via Bluetooth or Wi-Fi, keeping the information flowing in a
crisis. If the Internet's up, Briar can sync via the Tor network,
protecting users and their relationships from surveillance.</p>
- <figure>
- <img src="img/diagram_secure.png" class="" alt="Briar"/>
- <figcaption>Briar uses direct, encrypted connections between users to
+ <figure>
+ <img src="img/diagram_secure.png" class="" alt="Briar"/>
+ <figcaption>Briar uses direct, encrypted connections between users to
prevent surveillance and censorship.</figcaption>
- </figure>
+ </figure>
- <figure>
- <img src="img/diagram_insecure.png" class="" alt="Typical messaging software"/>
- <figcaption>Typical messaging software relies on central servers and exposes messages and relationships to surveillance.</figcaption>
- </figure>
+ <figure>
+ <img src="img/diagram_insecure.png" class="" alt="Typical messaging software"/>
+ <figcaption>Typical messaging software relies on central servers and exposes messages and relationships to surveillance.</figcaption>
+ </figure>
- <p>Briar provides private messaging and public forums that are protected
-against the following surveillance and censorship threats:</p>
+ <p>Briar provides private messaging and public forums that are protected against the following surveillance and censorship threats:</p>
- <ul>
- <li><strong>Metadata surveillance.</strong> Briar uses the Tor network to prevent eavesdroppers from learning which users are talking to each other. Each user's contact list is encrypted and stored on her own device.</li>
- <li><strong>Content surveillance.</strong> All communication between devices is encrypted end-to-end, protecting the content from eavesdropping or tampering.</li>
- <li><strong>Content filtering.</strong> Briar's end-to-end encryption prevents keyword filtering, and because of its decentralized design there are no
+ <ul>
+ <li><strong>Metadata surveillance.</strong> Briar uses the Tor network to prevent eavesdroppers from learning which users are talking to each other. Each user's contact list is encrypted and stored on her own device.</li>
+ <li><strong>Content surveillance.</strong> All communication between devices is encrypted end-to-end, protecting the content from eavesdropping or tampering.</li>
+ <li><strong>Content filtering.</strong> Briar's end-to-end encryption prevents keyword filtering, and because of its decentralized design there are no
servers to block.</li>
- <li><strong>Takedown orders.</strong> Every user who subscribes to a forum keeps a copy of its content, so there's no single point where a post can be deleted.</li>
- <li><strong>Denial of service attacks.</strong> Briar's forums have no central server to attack, and every subscriber has access to the content even if they're offline.</li>
- <li><strong>Internet blackouts.</strong> Briar can operate over Bluetooth and Wi-Fi to keep information flowing during blackouts.</li>
- </ul>
+ <li><strong>Takedown orders.</strong> Every user who subscribes to a forum keeps a copy of its content, so there's no single point where a post can be deleted.</li>
+ <li><strong>Denial of service attacks.</strong> Briar's forums have no central server to attack, and every subscriber has access to the content even if they're offline.</li>
+ <li><strong>Internet blackouts.</strong> Briar can operate over Bluetooth and Wi-Fi to keep information flowing during blackouts.</li>
+ </ul>
- <p>Briar is designed to resist surveillance and censorship by an adversary with the following capabilities:</p>
+ <p>Briar is designed to resist surveillance and censorship by an adversary with the following capabilities:</p>
- <ul>
- <li>All long-range communication channels (internet, phone network, etc) are comprehensively monitored by the adversary.</li>
- <li>The adversary can block, delay, replay and modify traffic on long-range communication channels.</li>
- <li>The adversary has a limited ability to monitor short-range communication channels (Bluetooth, WiFi, etc).</li>
- <li>The adversary has a limited ability to block, delay, replay and modify traffic on short-range communication channels.</li>
- <li>The adversary can deploy an unlimited number of devices running Briar.</li>
- <li>There are some users who can keep their devices secure - those who can't are considered, for the purposes of the threat model, to be controlled by the adversary.</li>
- <li>The adversary has a limited ability to persuade users to trust the adversary's agents - thus the number of social connections between the adversary's agents and the rest of the network is limited.</li>
- <li>The adversary can't break standard cryptographic primitives.</li>
- </ul>
+ <ul>
+ <li>All long-range communication channels (internet, phone network, etc) are comprehensively monitored by the adversary.</li>
+ <li>The adversary can block, delay, replay and modify traffic on long-range communication channels.</li>
+ <li>The adversary has a limited ability to monitor short-range communication channels (Bluetooth, WiFi, etc).</li>
+ <li>The adversary has a limited ability to block, delay, replay and modify traffic on short-range communication channels.</li>
+ <li>The adversary can deploy an unlimited number of devices running Briar.</li>
+ <li>There are some users who can keep their devices secure - those who can't are considered, for the purposes of the threat model, to be controlled by the adversary.</li>
+ <li>The adversary has a limited ability to persuade users to trust the adversary's agents - thus the number of social connections between the adversary's agents and the rest of the network is limited.</li>
+ <li>The adversary can't break standard cryptographic primitives.</li>
+ </ul>
- <p>Our long-term plans go far beyond messaging: we'll use Briar's data synchronization capabilities to support secure, distributed applications including blogging, crisis mapping and collaborative document editing. Our goal is to enable people in any country to create safe spaces where they can debate any topic, plan events, and organise social movements.</p>
+ <p>Our long-term plans go far beyond messaging: we'll use Briar's data synchronization capabilities to support secure, distributed applications including blogging, crisis mapping and collaborative document editing. Our goal is to enable people in any country to create safe spaces where they can debate any topic, plan events, and organise social movements.</p>
+
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- full -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -121,9 +126,6 @@ servers to block.</li>
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/img/briar_logo_sm.png b/img/briar_logo_sm.png
new file mode 100644
index 0000000000000000000000000000000000000000..9921a10ab8161e0199cf5e97f2d3cdfb9e8cb59b
Binary files /dev/null and b/img/briar_logo_sm.png differ
diff --git a/img/menu.png b/img/menu.png
new file mode 100644
index 0000000000000000000000000000000000000000..e9f35656e397cb10a7307a4f96727c74cb1c9af4
Binary files /dev/null and b/img/menu.png differ
diff --git a/index.html b/index.html
index 37c345ec5535055c8d03a5284ddec07fba33a630..4d9be82b754be9a5835ba980381b37aea75844c7 100644
--- a/index.html
+++ b/index.html
@@ -8,67 +8,77 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="index">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2>Secure messaging, anywhere</h2>
- <div id="phone2">
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
+
+ <div id="container">
+ <div id="content">
+ <div class="intro">
+ <h2>Secure messaging, anywhere</h2>
+
+ <div id="phone2">
+ <img src="img/phone.gif" class="phone" alt="Screenshots"/>
+ </div>
+
+ <ul id="introlist">
+ <li>Peer-to-peer encrypted messaging and forums</li>
+ <li>Messages are stored securely on your device, not in the cloud</li>
+ <li>Connect directly with nearby contacts - no Internet access required</li>
+ <li>Free and open source software</li>
+ </ul>
+ </div> <!-- intro -->
+
+ <div id="phone">
<img src="img/phone.gif" class="phone" alt="Screenshots"/>
</div>
- <ul id="introlist">
- <li>Peer-to-peer encrypted messaging and forums</li>
- <li>Messages are stored securely on your device, not in the cloud</li>
- <li>Connect directly with nearby contacts - no Internet access required</li>
- <li>Free and open source software</li>
- </ul>
- </div> <!-- intro -->
- <div id="phone">
- <img src="img/phone.gif" class="phone" alt="Screenshots"/>
- </div>
- <div class="clearboth"></div>
- </div> <!-- content -->
- </div> <!-- container -->
- <div id='flattr'>
- <center>
- <a href='https://flattr.com/thing/592836/Briar-A-Secure-News-and-Discussion-System' target='_blank'><img src='img/flattr-badge-large.png' alt='Flattr this' title='Flattr this' border='0' /></a> <br />
-Bitcoin: 1NZCKkUCtJV2U2Y9hDb9uq8S7ksFCFGR6K
- </center>
- </div>
+ <div class="clearboth"></div>
+
+ <div id="flattr">
+ <center>
+ <a href="https://flattr.com/t/592836/" target="_blank"><img src="img/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0"/></a>
+ <br />
+ Bitcoin: 1NZCKkUCtJV2U2Y9hDb9uq8S7ksFCFGR6K
+ </center>
+ </div> <!-- flattr -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+
+ </div> <!-- wrapper -->
+
<div class="clearboth"></div>
<div id="footer_container">
@@ -92,9 +102,6 @@ Bitcoin: 1NZCKkUCtJV2U2Y9hDb9uq8S7ksFCFGR6K
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->