ethvpn · tetratorus · Aug 13, 2017 · Aug 15, 2017
diff --git a/css/style.css b/css/style.css
diff --git a/images/bg.gif b/images/bg.gif
diff --git a/images/favicon.ico b/images/favicon.ico
diff --git a/images/favicon2.ico b/images/favicon2.ico
diff --git a/images/ssocks.jpg b/images/ssocks.jpg
diff --git a/index.html b/index.html
@@ -12,34 +12,34 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 
     <!-- =========================
-    FAV AND TOUCH ICONS  
+    FAV AND TOUCH ICONS
     ============================== -->
     <link rel="icon" href="images/favicon.ico">
     <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
     <link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
     <link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
 
     <!-- =========================
-    STYLESHEETS 
+    STYLESHEETS
     ============================== -->
     <!-- BOOTSTRAP CSS -->
     <link rel="stylesheet" href="css/bootstrap.min.css">
 
-    
+
     <!-- EXTERNAL PLUGIN CSS -->
     <link rel="stylesheet" href="css/swiper.min.css"> <!-- Screenshot Slider -->
     <link rel="stylesheet" href="css/nivo-lightbox.css"> <!-- Screenshot Slider -->
     <link rel="stylesheet" href="css/themes/default/default.css"> <!-- Nivo Lightbox -->
 
     <!-- TYPOGRAPHY -->
     <link id="toTypography" href="css/typography/typography-1.css" rel="stylesheet">
-
-    <!-- CUSTOM CSS -->
-    <link rel="stylesheet" href="css/style.css">
 
     <!-- COLORS -->
     <link id="toColor" href="css/colors/green.css" rel="stylesheet">
 
+    <!-- CUSTOM CSS -->
+    <link rel="stylesheet" href="css/style.css">
+
     <!-- RESPONSIVE FIXES -->
     <!-- <link rel="stylesheet" href="css/responsive.css"> -->
 
@@ -50,14 +50,14 @@
 
 </head>
 <body class="body-container">
-<div id="page" class="page">    <!-- start page --> 
+<div id="page" class="page">    <!-- start page -->
 
 
 
-<!-- start page --> 
+<!-- start page -->
 
 <!-- =========================
-     NAVBAR 
+     NAVBAR
 ============================== -->
 <div class="navbar navbar-nemo navbar-fixed-top">
 	<div class="container">
@@ -92,36 +92,40 @@
 
 
 <!-- =========================
-     APP HOME 
+     APP HOME
 ============================== -->
-<section class="home app-home-2 polygon-bg cover-bg text-center editBG" id="app-home-2" style="outline-offset: -3px;">
-	<div class="container">
-		<div class="row">
-			<div class="col-md-12">
-
-				<h1 class="heading-text">EthVPN: Airbnb for VPNs</h1>
-				<p class="sub-heading mb50">Decentralized VPN powered by Ethereum.</p>
-
-				<div class="home-download-btn">
-
-					<a href="https://github.com/ethvpn/code/blob/master/HOWTO.md" class="btn btn-white btn-lg">Try it out!</a>
-					<div class="stores-on text-center">
-						Available on &nbsp;
-						<i class="icon svg-apple"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M17.5 3.813c1-1.25 2.75-2.125 4.188-2.188 0.188 1.688-0.5 3.375-1.5 4.563-1 1.25-2.625 2.188-4.25 2.063-0.188-1.688 0.625-3.375 1.563-4.438zM25.688 26.813c-1.188 1.75-2.438 3.5-4.375 3.563-1.938 0-2.563-1.188-4.75-1.188s-2.875 1.125-4.688 1.188c-1.875 0.125-3.313-1.875-4.563-3.625-2.438-3.563-4.313-10.125-1.813-14.5 1.25-2.188 3.5-3.563 5.938-3.625 1.875 0 3.625 1.25 4.75 1.25s3.25-1.563 5.5-1.313c0.938 0.063 3.563 0.375 5.25 2.875-0.125 0.063-3.125 1.813-3.125 5.438 0.063 4.375 3.813 5.813 3.875 5.875-0.063 0.063-0.625 2.063-2 4.063z"></path> </svg> </i>
-						<i class="icon svg-playstore"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M12.188 8.813l6.5 6.5 3.75-3.75-7.938-4.438c-4.375-2.438-8.125-4.5-8.375-4.625-0.313-0.125 0.875 1.125 6.063 6.313zM4.5 2.875c-0.438 0.438-0.438 0.75-0.438 13.188 0 12.5 0 12.75 0.438 13.125 0.125 0.125 0.813-0.5 6.813-6.5l6.688-6.688-6.688-6.688c-6.25-6.25-6.688-6.625-6.813-6.438zM21.375 14l-2 2 2 1.938 1.938 2 2.438-1.375c1.375-0.75 2.625-1.563 2.813-1.75 0.563-0.563 0.563-1.125 0-1.688-0.188-0.188-1.25-0.813-2.375-1.438-1.063-0.625-2.188-1.25-2.438-1.375l-0.438-0.25zM14.875 20.375c-9.063 9.188-9.188 9.313-8.75 9.125 0.375-0.125 14.875-8.25 16-8.938l0.313-0.125-3.813-3.813z"></path> </svg> </i>
-						<i class="icon svg-windows-1"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M30 16.563v13.438l-15.5-2.25v-11.188zM13.5 16.563v11.063l-11.5-1.688v-9.375zM30 2v13.563h-15.5v-11.375zM13.5 4.375v11.188h-11.5v-9.563z"></path> </svg> </i>
-					</div>
-
-				</div>
-
-				<img src="https://raw.githubusercontent.com/ethvpn/ethvpn.github.io/master/uploaded_images/ssocks.png" alt="" class="img-responsive img-center" style="border-radius: 0px; border-color: rgb(255, 255, 255); border-style: none; border-width: 1px;">
-			</div>
-		</div>	<!-- /.row -->
-	</div>
-</section><!-- start page --> 
+<div class="clearfix"></div>
+<section class="home app-home-2 cover-bg text-center editBG" id="app-home-2" style="outline-offset: -3px;">
+  <div class="container padbot">
+    <div class="row">
+      <div class="col-md-12">
+
+        <h1 class="heading-text">EthVPN: Airbnb for VPNs</h1>
+        <p class="sub-heading mb50">Decentralized VPN powered by Ethereum.</p>
+
+        <div class="home-download-btn">
+
+          <a href="https://github.com/ethvpn/code/blob/master/HOWTO.md" class="btn btn-white btn-lg">Try it out!</a>
+          <div class="stores-on text-center">
+            Available on &nbsp;
+            <i class="icon svg-apple"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M17.5 3.813c1-1.25 2.75-2.125 4.188-2.188 0.188 1.688-0.5 3.375-1.5 4.563-1 1.25-2.625 2.188-4.25 2.063-0.188-1.688 0.625-3.375 1.563-4.438zM25.688 26.813c-1.188 1.75-2.438 3.5-4.375 3.563-1.938 0-2.563-1.188-4.75-1.188s-2.875 1.125-4.688 1.188c-1.875 0.125-3.313-1.875-4.563-3.625-2.438-3.563-4.313-10.125-1.813-14.5 1.25-2.188 3.5-3.563 5.938-3.625 1.875 0 3.625 1.25 4.75 1.25s3.25-1.563 5.5-1.313c0.938 0.063 3.563 0.375 5.25 2.875-0.125 0.063-3.125 1.813-3.125 5.438 0.063 4.375 3.813 5.813 3.875 5.875-0.063 0.063-0.625 2.063-2 4.063z"></path> </svg> </i>
+            <i class="icon svg-playstore"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M12.188 8.813l6.5 6.5 3.75-3.75-7.938-4.438c-4.375-2.438-8.125-4.5-8.375-4.625-0.313-0.125 0.875 1.125 6.063 6.313zM4.5 2.875c-0.438 0.438-0.438 0.75-0.438 13.188 0 12.5 0 12.75 0.438 13.125 0.125 0.125 0.813-0.5 6.813-6.5l6.688-6.688-6.688-6.688c-6.25-6.25-6.688-6.625-6.813-6.438zM21.375 14l-2 2 2 1.938 1.938 2 2.438-1.375c1.375-0.75 2.625-1.563 2.813-1.75 0.563-0.563 0.563-1.125 0-1.688-0.188-0.188-1.25-0.813-2.375-1.438-1.063-0.625-2.188-1.25-2.438-1.375l-0.438-0.25zM14.875 20.375c-9.063 9.188-9.188 9.313-8.75 9.125 0.375-0.125 14.875-8.25 16-8.938l0.313-0.125-3.813-3.813z"></path> </svg> </i>
+            <i class="icon svg-windows-1"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M30 16.563v13.438l-15.5-2.25v-11.188zM13.5 16.563v11.063l-11.5-1.688v-9.375zM30 2v13.563h-15.5v-11.375zM13.5 4.375v11.188h-11.5v-9.563z"></path> </svg> </i>
+          </div>
+
+        </div>
+
+        <img src="./images/ssocks.jpg" alt="" class="img-responsive img-center" style="border-radius: 0px; border-color: rgb(255, 255, 255); border-style: none; border-width: 1px;">
+      </div>
+    </div>	<!-- /.row -->
+  </div>
+  <video autoplay loop id="video-background" muted plays-inline>
+    <source src="./video/bgimg.mp4" type="video/mp4">
+  </video>
+</section><!-- start page -->
 
 <!-- =========================
-     APP FEATURES 
+     APP FEATURES
 ============================== -->
 <section class="features app-features-5 padding-120-75 secondary-bg" id="app-features-5-2" style="outline-offset: -3px;">
 	<div class="container">
@@ -145,10 +149,10 @@ <h2 class="heading-text">Features</h2>
 			</div>
 
 			<div class="col-md-6 col-sm-8 col-md-offset-0 col-sm-offset-2 mb50">
-				
+
 				<div class="media media-chained">
 					<div class="media-left">
-						
+
 						<i class="icon svg-lightning-regular icon-shape width-75 radius-30 icon-border-1"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M32 0l-27.063 11.063 8 8-12.938 12.938 27.063-11.063-8-8zM24.875 20.438l-19.688 8 8.625-8.625 0.813-0.875-0.813-0.875-6.688-6.625 19.688-8-9.438 9.5 0.813 0.875z"></path> </svg> </i>
 
 					</div>
@@ -162,9 +166,9 @@ <h3 class="title-text">1. Use your Ether currency!</h3>
 
 				<div class="media media-chained">
 					<div class="media-left">
-						
+
 						<i class="icon svg-gift-regular icon-shape width-75 radius-30 icon-border-1"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M32 8h-10.188c0.563-0.625 0.938-1.5 0.938-2.438 0-2.125-1.563-3.688-3.688-3.688-1.188 0-2.438 0.563-3.063 1.563-0.625-1-1.813-1.563-3.063-1.563-2.125 0-3.688 1.563-3.688 3.688 0 0.938 0.375 1.813 0.938 2.438h-10.188v4.938h1.25v17.188h29.5v-17.188h1.25zM19.063 3.063c1.375 0 2.5 1.125 2.5 2.5 0 1.313-1.125 2.438-2.5 2.438h-2.438v-2.438c0-1.375 1.125-2.5 2.438-2.5zM10.438 5.563c0-1.375 1.125-2.5 2.5-2.5 1.313 0 2.438 1.125 2.438 2.5v2.438h-2.438c-1.375 0-2.5-1.125-2.5-2.438zM1.25 9.25h14.125v2.438h-14.125zM2.438 12.938h12.938v16h-12.938zM29.563 28.938h-12.938v-16h12.938zM30.75 11.688h-14.125v-2.438h14.125z"></path> </svg> </i>
-						
+
 					</div>
 					<div class="media-body">
 
@@ -176,7 +180,7 @@ <h3 class="title-text">2. Installs on any platform.</h3>
 
 				<div class="media media-chained">
 					<div class="media-left">
-						
+
 						<i class="icon svg-basic-geolocalize-05 icon-shape width-75 radius-30 icon-border-1"><!--?xml version="1.0" encoding="utf-8"?-->  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"> <path d="M18.5 9.5c0-1.375-1.125-2.5-2.5-2.5s-2.5 1.125-2.5 2.5c0 1.375 1.125 2.5 2.5 2.5s2.5-1.125 2.5-2.5zM14.5 9.5c0-0.813 0.688-1.5 1.5-1.5s1.5 0.688 1.5 1.5c0 0.813-0.688 1.5-1.5 1.5s-1.5-0.688-1.5-1.5zM16 24.313l0.375-0.5c0.25-0.313 6.625-8.188 6.625-13.313 0-4.125-3.188-7.5-7-7.5-3.875 0-7 3.375-7 7.5 0 5.125 6.313 13 6.625 13.313zM16 4c3.313 0 6 2.938 6 6.5 0 4.063-4.625 10.375-6 12.188-1.375-1.813-6-8.125-6-12.188 0-3.563 2.688-6.5 6-6.5zM21.5 18v1h4.188l4.938 9h-29.25l4.938-9h4.188v-1h-4.813l-6.063 11h32.75l-6.063-11z"></path> </svg> </i>
 
 					</div>
@@ -191,10 +195,10 @@ <h3 class="title-text">3. Even works in China.</h3>
 			</div>
 		</div>	<!-- /.row -->
 	</div>
-</section><!-- start page --> 
+</section><!-- start page -->
 
 <!-- =========================
-     FAQ 
+     FAQ
 ============================== -->
 <section class="faqs faqs-2 padding-120-60" id="faqs-2">
 	<div class="container">
@@ -243,10 +247,10 @@ <h5 class="title-text">Is this in any way related to or sponsored by the illustr
 		</div>	<!-- /.row -->
 
 	</div>
-</section><!-- start page --> 
+</section><!-- start page -->
 
 <!-- =========================
-     	COURSE INSTRUCTORS 
+     	COURSE INSTRUCTORS
 ============================== -->
 <section class="course-instructors white-bg padding-120-75" id="course-instructors" style="background-image: none; background-color: rgb(217, 210, 233);" src="https://raw.githubusercontent.com/ethvpn/ethvpn.github.io/master/uploaded_images/eth%20floaty%20logo.png">
 	<div class="container">
@@ -289,7 +293,7 @@ <h4 class="title-text">Loi Luu</h4>
 						<p>Contributor</p>
 					</figcaption>
 				</figure>
-				
+
 			</div>
 
 			<div class="col-md-3 col-xs-6 p_lr45 mb40">
@@ -303,21 +307,21 @@ <h4 class="title-text">You?</h4>
 						<p></p>
 					</figcaption>
 				</figure>
-				
+
 			</div>
 
 			<div class="col-md-3 col-xs-6 p_lr45 mb40">
 
 				<figure class="intro-vio">
 					<div class="img-scale thumbnail-circle">
-						
+
 					</div>
 					<figcaption>
 						<h4 class="title-text"></h4>
 						<p></p>
 					</figcaption>
 				</figure>
-				
+
 			</div>
 
 		</div> <!-- /.row -->
@@ -328,7 +332,7 @@ <h4 class="title-text"></h4>
 
 				<figure class="intro-vio">
 					<div class="img-scale thumbnail-circle">
-						
+
 					</div>
 					<figcaption>
 						<h4 class="title-text"></h4>
@@ -342,50 +346,50 @@ <h4 class="title-text"></h4>
 
 				<figure class="intro-vio">
 					<div class="img-scale thumbnail-circle">
-						
+
 					</div>
 					<figcaption>
 						<h4 class="title-text"></h4>
 						<p></p>
 					</figcaption>
 				</figure>
-				
+
 			</div>
 
 			<div class="col-md-3 col-xs-6 p_lr45 mb40">
 
 				<figure class="intro-vio">
 					<div class="img-scale thumbnail-circle">
-						
+
 					</div>
 					<figcaption>
 						<h4 class="title-text"></h4>
 						<p></p>
 					</figcaption>
 				</figure>
-				
+
 			</div>
 
 			<div class="col-md-3 col-xs-6 p_lr45 mb40">
 
 				<figure class="intro-vio">
 					<div class="img-scale thumbnail-circle">
-						
+
 					</div>
 					<figcaption>
 						<h4 class="title-text"></h4>
 						<p></p>
 					</figcaption>
 				</figure>
-				
+
 			</div>
 
 		</div>	<!-- /.row -->
 	</div>
-</section><!-- start page --> 
+</section><!-- start page -->
 
 <!-- =========================
-     SMALL TEXT SECTION 
+     SMALL TEXT SECTION
 ============================== -->
 <div class="small-content text-center secondary-bg" id="small-content-1">
 	<div class="container">
@@ -395,21 +399,21 @@ <h4 class="title-text"></h4>
 			</div>
 		</div>	<!-- /.row -->
 	</div>
-</div><!-- start page --> 
+</div><!-- start page -->
 
 <!-- =========================
-     CLIENT REVIEW UNDERNETH A SECTION 
+     CLIENT REVIEW UNDERNETH A SECTION
 ============================== -->
 <div class="small-review text-center" id="small-review" height="300" background="#000000">
 	<div class="container" height="300px" background="#000000">
 
         <img src="https://raw.githubusercontent.com/ethvpn/ethvpn.github.io/master/uploaded_images/poweredby.png" align="center">
 
 	</div>
-</div></div> <!-- /end page --> 
+</div></div> <!-- /end page -->
 
 <!-- =========================
-     SCRIPTS 
+     SCRIPTS
 ============================== -->
 <script src="js/jquery-1.11.3.min.js"></script>
 <script src="js/bootstrap.min.js"></script>