diff --git a/src/App.js b/src/App.jsx
similarity index 61%
rename from src/App.js
rename to src/App.jsx
index c81d9c3..684b086 100644
--- a/src/App.js
+++ b/src/App.jsx
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { HashRouter as Router, Route } from 'react-router-dom';
 import { Jumbotron as Jumbo, Container } from 'react-bootstrap';
-import { CSSTransition } from 'react-transition-group';
+import { TransitionGroup } from 'react-transition-group';
 import { Navbar } from './components/Navbar';
 import Footer from './components/Footer';
 import Privacy from './pages/Privacy';
@@ -20,46 +20,25 @@ class App extends Component {
         <Jumbo className="jumbo">
           <Container style={{ minHeight: "50vh"}}>
             <Route exact path="/resume" component={Resume} >
-              {({ match }) => (
-                <CSSTransition
-                  in={match != null}
-                  timeout={300}
-                  classNames="page"
-                  unmountOnExit
-                >
+                <TransitionGroup>
                   <div className="page">
                     <Resume />
                   </div>
-                </CSSTransition>
-              )}
+                </TransitionGroup>
             </Route>
             <Route exact path="/work" component={Work}>
-              {({ match }) => (
-                <CSSTransition
-                  in={match != null}
-                  timeout={300}
-                  classNames="page"
-                  unmountOnExit
-                >
+                <TransitionGroup>
                   <div className="page">
                     <Work />
                   </div>
-                </CSSTransition>
-              )}
+                </TransitionGroup>
             </Route>
             <Route exact path="/" component={About} >
-              {({ match }) => (
-                <CSSTransition
-                  in={match != null}
-                  timeout={300}
-                  classNames="page"
-                  unmountOnExit
-                >
+                <TransitionGroup>
                   <div className="page page-about">
                     <About />
                   </div>
-                </CSSTransition>
-              )}
+                </TransitionGroup>
             </Route>
             <Route path="/privacy" component={Privacy} />
           </Container>
diff --git a/src/css/resume.css b/src/css/resume.css
index 0ed859b..cb7a259 100644
--- a/src/css/resume.css
+++ b/src/css/resume.css
@@ -18,4 +18,14 @@ a:hover {
     justify-content: center!important;
     align-items: center!important;
     height: 100%!important;
+}
+
+.mail-div-p {
+    color: rgb(255, 255, 255)!important;
+    font-size: 1.5rem!important;
+    text-decoration: none!important;    
+}
+.mail-div-a {
+    font-size: 1.5rem!important;
+    text-decoration: none!important;
 }
\ No newline at end of file
diff --git a/src/css/work.css b/src/css/work.css
index 421f3a4..0075cef 100644
--- a/src/css/work.css
+++ b/src/css/work.css
@@ -1,6 +1,10 @@
 .page-inner {
     display: block!important;
     max-width: 50rem!important;
+    height: 60vh!important;
+    overflow-y: scroll;
+    border: 2px solid silver;
+    padding: 10px;
 }
 
 .jumbo {
diff --git a/src/pages/Resume.jsx b/src/pages/Resume.jsx
index d51c84f..d86e3c1 100644
--- a/src/pages/Resume.jsx
+++ b/src/pages/Resume.jsx
@@ -28,8 +28,8 @@ export default class Resume extends Component {
     render() {
         return (
           <div className="mail-div">
-              <p>send an email for my resume</p>
-              <a href="mailto:mirkanbaba1@gmail.com&subject=Resume Request">Request Resume</a>
+              <p className="mail-div-p" >Send me an email for my resume by clicking button</p>
+              <a className="mail-div-a"  href="mailto:mirkanbaba1@gmail.com&subject=Resume Request">Request Resume</a>
           </div>
             )
         }