diff --git a/src/App.css b/src/App.css
index b41d297..cf4d964 100644
--- a/src/App.css
+++ b/src/App.css
@@ -1,22 +1,27 @@
-.App {
-  text-align: center;
+body {
+  background-color: #d9534f;
 }
 
-.App-logo {
-  animation: App-logo-spin infinite 20s linear;
-  height: 40vmin;
-  pointer-events: none;
+.title {
+  font-size: 60px;
+  font-weight: lighter;
+}
+
+.App {
+  text-align: center;
+  color: #131313;
 }
 
 .App-header {
-  background-color: #282c34;
-  min-height: 100vh;
+  background-color: #d9534f;
   display: flex;
+  min-height: 20vh;
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  font-size: calc(10px + 2vmin);
+  font-size: calc(50px + 2vmin);
   color: white;
+  text-shadow: 0 0 2px #cf4242, 0 0 4px #2B2D1F;
 }
 
 .App-link {
diff --git a/src/App.js b/src/App.js
index ffe120d..0e1975e 100644
--- a/src/App.js
+++ b/src/App.js
@@ -6,8 +6,9 @@ class App extends Component {
   render() {
     return (
       <div className="App">
-       <h1>tomadoro</h1>
-       
+       <div className="App-header title">
+        tomadoro
+      </div>
        <Timer />
       </div>
     );