diff --git a/source/components/CDD.js b/source/components/CDD.js
index dc70df262..23fa2e9c3 100644
--- a/source/components/CDD.js
+++ b/source/components/CDD.js
@@ -1,6 +1,5 @@
 import React, {Component} from 'react'
 import './CDD.css'
-import IntroCDD from './IntroCDD'
 import Results from './Results'
 import {reduxForm, formValueSelector} from 'redux-form'
 import {connect} from 'react-redux'
@@ -35,7 +34,6 @@ export default class CDD extends Component {
 
 		return (
       <div id="sim">
-        <IntroCDD />
         <div id="conversation">
           <section id="questions-answers">
             {conversation}
diff --git a/source/components/CDDIntro.css b/source/components/CDDIntro.css
new file mode 100644
index 000000000..1b6d108bc
--- /dev/null
+++ b/source/components/CDDIntro.css
@@ -0,0 +1,60 @@
+#CDDIntro {
+	background: radial-gradient(ellipse at center, #4A89DC -160%,#333350 100%);
+	color: white;
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+
+#CDDIntro h1 {
+	text-align: center;
+	font-size: 350%;
+	font-weight: 800;
+}
+
+#CDDIntro .subtitle {
+	text-align: center;
+	font-size: 110%;
+	font-weight: 300;
+}
+
+#CDDIntro #introduction {
+	margin-top: 4%;
+}
+
+#CDDIntro p {
+	font-size: 120%;
+	color: white;
+	opacity: .9;
+	width: 35%;
+	margin: 2em auto;
+}
+
+#CDDIntro #introduction .insist {
+	font-weight: 600;
+	/*font-style: italic;*/
+}
+
+
+#CDDIntro #action {
+	color: white;
+	margin-top: 5%;
+	display: block;
+	text-align: center;
+}
+#CDDIntro #action button {
+	color: inherit;
+	background: #4A89DC;
+	padding: .6em 1.2em;
+	font-size: 140%;
+	margin: 0 1em;
+	width: 12em;
+	border: none;
+	box-shadow: 0px 9px 14px 0px rgba(0, 0, 0, 0.1)
+}
+#CDDIntro #action button:hover {
+	box-shadow: none;
+	opacity: .95;
+}
diff --git a/source/components/CDDIntro.js b/source/components/CDDIntro.js
new file mode 100644
index 000000000..ce1e1881c
--- /dev/null
+++ b/source/components/CDDIntro.js
@@ -0,0 +1,42 @@
+import React from 'react'
+import colours from './themeColours'
+import PageTypeIcon from './PageTypeIcon'
+import './CDDIntro.css'
+import {Link} from 'react-router'
+
+export default () => (
+  <div id="CDDIntro">
+    <PageTypeIcon type="simulation" />
+    <h1>Simulateur CDD</h1>
+    <div className="subtitle">
+      Découvrir le surcoût pour l'employeur du CDD par rapport au CDI
+    </div>
+    <section id="introduction">
+      <p>
+        En France, le contrat à durée déterminée{' '}
+        <span className="insist">est un contrat d'exception au CDI</span>
+        , apportant à l'employeur plus de souplesse dans un cadre précis prévu par la loi. Une contrepartie financière peut en échange lui être imposée.
+      </p>
+      <p>
+        Ce simulateur vous aidera calculer les 4 éléments de ce surcoût :
+        <ul>
+          <li>l'indemnité de fin de contrat</li>
+          <li>le CIF</li>
+          <li>la majoration chômage</li>
+          <li>l'indemnité compensatrice de congés payés</li>
+        </ul>
+      </p>
+      <p>
+        Sur ce simulateur 17.0, <span className="insist">vous avez le droit de ne pas savoir</span> : certains termes utilisés dans la simulation ne sont pas évidents, cliquez simplement sur le symbôle • qui les suit pour ouvrir une aide contextuelle. Et n'hésitez pas à nous écrire &nbsp;
+        <i style={{cursor: 'pointer'}} className="fa fa-envelope-o" />
+      </p>
+      {/*
+				<p>
+				*: écrivez à contact@contact.contact (on fera mieux après). La loi française est complexe, souvent à raison. Nous ne la changerons pas, mais pouvons la rendre plus transparente.
+			</p>
+			*/
+      }
+      <Link id="action" to="/cdd"><button>C'est parti !</button></Link>
+    </section>
+  </div>
+)
diff --git a/source/components/IntroCDD.js b/source/components/IntroCDD.js
deleted file mode 100644
index 6634c175e..000000000
--- a/source/components/IntroCDD.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from 'react'
-import colours from './themeColours'
-import PageTypeIcon from './PageTypeIcon'
-
-export default () =>
-	<div>
-		<PageTypeIcon type="simulation"/>
-		<h1>Simulateur CDD</h1>
-		<section id="introduction">
-			<p>
-				Le CDD en France est un contrat d'exception au CDI, apportant à l'employeur plus de souplesse dans un cadre précis prévu par la loi. Souvent, des contreparties financières lui sont demandées. Ce simulateur vous aidera à les calculer.
-			</p>
-			<p>
-				Ici, vous avez le droit de ne pas savoir : certains termes utilisés dans la simulation ne sont pas évidents, cliquez simplement sur le symbôle • pour ouvrir une aide contextuelle. Et n'hésitez pas à nous écrire &nbsp;<i style={{cursor: 'pointer'}} className="fa fa-envelope-o"></i>
-			</p>
-			{/*
-				<p>
-				*: écrivez à contact@contact.contact (on fera mieux après). La loi française est complexe, souvent à raison. Nous ne la changerons pas, mais pouvons la rendre plus transparente.
-			</p>
-			*/}
-		</section>
-	</div>
diff --git a/source/containers/Home.js b/source/containers/Home.js
index a28877402..dbcfe9226 100644
--- a/source/containers/Home.js
+++ b/source/containers/Home.js
@@ -59,7 +59,7 @@ export default class Home extends Component {
             <ul>
               <li key="cdd">
                 <span className="simulateur">Surcoût du CDD</span>
-                <Link to="/cdd"><button>Essayer</button></Link>
+                <Link to="/cdd-intro"><button>Essayer</button></Link>
               </li>
               <li key="embauche">
                 <span className="simulateur">Prix global de l'embauche</span>
diff --git a/source/routes.js b/source/routes.js
index c3bc6d338..1b08f58cc 100644
--- a/source/routes.js
+++ b/source/routes.js
@@ -5,6 +5,7 @@ import Home from './containers/Home'
 import Rule from './components/Rule'
 import About from './components/About'
 import CDD from './components/CDD'
+import CDDIntro from './components/CDDIntro'
 
 
 let RouteNotFound = () =>
@@ -23,8 +24,9 @@ let RouteNotFound = () =>
 export default (
   <Route path="/" component={Layout}>
     <Route path="regle/:name" component={Rule} />
+    <Route path="cdd-intro" component={CDDIntro} />
     <Route path="cdd" component={CDD} />
-      <Route path="a-propos" component={About} />
+    <Route path="a-propos" component={About} />
     <IndexRoute component={Home} />
     <Route path="*" component={RouteNotFound} />
   </Route>