new interface

css/grayscale.css

@@ -8,8 +8,8 @@ body {
     width: 100%;
     height: 100%;
     font-family: Lora,"Helvetica Neue",Helvetica,Arial,sans-serif;
-    color: #fff;
+    color: #333;
-    background-color: #000;
+    background: url('../img/transp_bg.png');
 }
 
 html {
@@ -45,7 +45,7 @@ p {
 }
 
 a {
-    color: #42dca3;
+    color: #69CB01;
     -webkit-transition: all .2s ease-in-out;
     -moz-transition: all .2s ease-in-out;
     transition: all .2s ease-in-out;
@@ -153,6 +153,7 @@ a:focus {
     -moz-background-size: cover;
     background-size: cover;
     -o-background-size: cover;
+    border-bottom: 5px solid #ccc;
 }
 
 .intro .intro-body {
@@ -168,6 +169,12 @@ a:focus {
     font-size: 18px;
 }
 
+.intro .intro-body .intro-text span {
+    background: #fff;
+    color: #333;
+    padding: 10px;
+}
+
 @media(min-width:768px) {
     .intro {
         height: 100%;
@@ -279,21 +286,6 @@ a:focus {
     margin-top: 100px;
 }
 
-@media(min-width:767px) {
-    .content-section {
-        padding-top: 250px;
-    }
-
-    .download-section {
-        padding: 100px 0;
-    }
-
-    #map {
-        height: 400px;
-        margin-top: 250px;
-    }
-}
-
 .btn {
     border-radius: 0;
     text-transform: uppercase;
@@ -305,43 +297,26 @@ a:focus {
 }
 
 .btn-default {
-    border: 1px solid #42dca3;
+    border: 1px solid #69CB01;
-    color: #42dca3;
+    color: #69CB01;
     background-color: transparent;
 }
 
 .btn-default:hover,
 .btn-default:focus {
-    border: 1px solid #42dca3;
+    border: 1px solid #69CB01;
     outline: 0;
     color: #000;
-    background-color: #42dca3;
+    background-color: #69CB01;
 }
 
 ul.banner-social-buttons {
     margin-top: 0;
 }
 
-@media(max-width:1199px) {
-    ul.banner-social-buttons {
-        margin-top: 15px;
-    }
-}
-
-@media(max-width:767px) {
-    ul.banner-social-buttons li {
-        display: block;
-        margin-bottom: 20px;
-        padding: 0;
-    }
-
-    ul.banner-social-buttons li:last-child {
-        margin-bottom: 0;
-    }
-}
-
 footer {
     padding: 50px 0;
+    background: #ddd;
 }
 
 footer p {

index.html

@@ -54,7 +54,11 @@
                 <div class="row">
                     <div class="col-md-8 col-md-offset-2">
                         <h1 class="brand-heading">GITNET</h1>
-                        <p class="intro-text">Free web hosting using <a href="https://gitnet.fr/">git repository</a></p>
+                        <p class="intro-text">
+							<span>
+								Free web hosting using <a href="https://gitnet.fr/">git repository</a>
+							</span>
+						</p>
                         <a href="#about" class="btn btn-circle page-scroll">
                             <i class="fa fa-angle-double-down animated"></i>
                         </a>
@@ -82,25 +86,19 @@
 				<p><a href="https://www.deblan.io/contact">Send me</a> an email with the url of the repository. I will send you back an API Key and a Payload URL. You will have to configure a new webhook with this informations.</p>
 
 				<p>Push on the branch "master" to update your static website accessible via https://gitnet.fr/project/your-project.</p>
+                
+				<p><a id="startnow" href="https://gitnet.fr/user/sign_up" class="btn btn-default btn-lg">Start with free registration</a></p>
 			</div>
         </div>
     </section>
 
     
-    <section id="startnow" class="content-section text-center">
-        <div class="download-section">
-            <div class="container">
-				<h2>Start now</h2>
-                <div class="col-lg-8 col-lg-offset-2">
-                    <a href="https://gitnet.fr/user/sign_up" class="btn btn-default btn-lg">Start with free registration</a>
-                </div>
-            </div>
-        </div>
-    </section>
-    
     <footer>
         <div class="container text-center">
-            <p>Simon Vieille - <a href="https://gitnet.fr/deblan/gitnet-project">Source code</a></p>
+            <p>
+				Simon Vieille
+				- <a href="https://gitnet.fr/deblan/gitnet-project">Fork me!</a>
+			</p>
         </div>
     </footer>