diff --git a/Roboto-Regular.woff b/Roboto-Regular.woff
new file mode 100644
index 0000000..b070d8e
Binary files /dev/null and b/Roboto-Regular.woff differ
diff --git a/Roboto-Regular.woff2 b/Roboto-Regular.woff2
new file mode 100644
index 0000000..30370cf
Binary files /dev/null and b/Roboto-Regular.woff2 differ
diff --git a/front.php b/front.php
index d461aff..e3a3a2c 100644
--- a/front.php
+++ b/front.php
@@ -1,19 +1,31 @@
-<html>
+
 <head>
 <title>VirtIT ft</title>
 <link rel="stylesheet" type="text/css" href="<?php print(_HTTP_PATH . "style.css"); ?> ">
 <link rel="icon" type="image/x-icon" href="<?php print(_HTTP_PATH . "favicon.ico"); ?> ">
 
 <script src="<?php print(_HTTP_PATH . "script.js"); ?> "></script>
+
+<style>
+@font-face {
+        font-family: 'Roboto';
+        src: url('<?php print(_HTTP_PATH . "Roboto-Regular.woff2"); ?>') format('woff2'),
+            url('<?php print(_HTTP_PATH . "Roboto-Regular.woff"); ?> ') format('woff');
+        font-weight: normal;
+        font-style: normal;
+}
+</style>
+
 </head>
 
 <body>
+<div class=core>
 <h1>File Transfer</h1>
 <div id=dragzone class=dragndrop ondrop="file_dropped(event);" ondragover="return false" ondragenter="change_color_ondrag('ondragenter');" ondragleave="change_color_ondrag('ondragleave');" >
-Drag and Drop your file or <input type="button" value="Select File" onclick="file_explorer();">
+Drag and Drop your file or <input class="button" type="button" value="Select File" onclick="file_explorer();">
 <input type="file" id="uploadfile" hidden>
 <br><br><br><br>
-<div id=divresponse></div><button id=copytoclipboard style="visibility: hidden;" onclick="copytoclipboard();">Copy to clipboard</button>
+<div id=divresponse></div><button class="button" id=copytoclipboard style="visibility: hidden;" onclick="copytoclipboard();">Copy to clipboard</button>
 </div>
 <div class=infobox>
 This tool is usable with <b>curl</b> or <b>wget</b>.<br><br>
@@ -27,7 +39,10 @@ To download file :<br>
 <li> wget -O hello.txt <?php print(_HTTP_PROTO . '://' . _HTTP_DOMAIN . _HTTP_PATH . _DATA_DIR . '/99999/file');?>
 
 </div>
-<div class=footer>
-File transfer was created by <a href="https://twitter.com/AmazingBeu">@AmazingBeu</a>. You can find sources <a href="https://git.virtit.fr/VirtIT/web-ft">here</a>.
 </div>
+<footer>
+File transfer was created by <a href="https://twitter.com/AmazingBeu">@AmazingBeu</a>. You can find sources <a href="https://git.virtit.fr/VirtIT/web-ft">here</a>.
+</footer>
+
 </body> 
+</html>
\ No newline at end of file
diff --git a/style.css b/style.css
index 3a522fb..8e594b3 100644
--- a/style.css
+++ b/style.css
@@ -1,14 +1,34 @@
-html {
-        max-width: 1500px;
+body{
+        position: relative;
+        min-height: 100vh;
+        margin: 0;
+}
+.core {
+        font-family: 'Roboto', sans-serif;
+        max-width: 900px;
         margin: auto;
-        display: inline-block;
+        padding: 5px;
         padding-top:50px;
-        text-align: center;
-     
+        text-align: center; 
+        padding-bottom: 85px;
+}
+
+@media  (min-width: 370px) {
+        .core {
+                padding-bottom: 65px;
+        }
+}
+@media  (min-width: 600px) {
+        .core {
+                padding-bottom: 45px;
+        }
+}
+
+h1 {
+        font-size: 38;
 }
        
 .dragndrop { 
-        margin: 20%;
         margin-top: 5%;
         margin-bottom: 3%;
         background-color: #a3a3a3;
@@ -16,34 +36,37 @@ html {
         padding-top: 5%;
         height:40%; 
         font-size: 20px;   
-        cursor: pointer;
         border: 6px dashed #444444;
         border-radius: 20px;
         
 }
-.dragover {
-        background-color: #888888;
+.dragndrop .button {
+        cursor: pointer;
 }
-.dragndrop:hover { 
+.dragover {
         background-color: #888888;
 }
 
 .infobox {
         text-align: left;
         background: #eeeeee;
-        margin-left: 20%;
-        margin-right:20%;
         border-radius: 20px;
         border: 4px solid #a3a3a3;
         padding: 10px;
 }
 
-.footer {
-        position: fixed;
-        padding: 1%;
+footer {
+        position: absolute;
+        padding-top: 10px;
+        padding-bottom: 10px;
         bottom: 0;
-        left: 0;
         width: 100%;
         text-align: center;
         background-color: #eeeeee;
 }
+
+footer a {
+        color: #555;
+        font-weight: bold;
+        text-decoration: none;
+}
