diff --git a/src/App.js b/src/App.js
index f489176..92ba364 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,12 +1,14 @@
import React, { Component } from 'react';
import HomePage from "./components/HomePage";
import Login from "./components/SignIn";
+import PricingPlan from "./components/PricingPlan";
import LogInContainer from "./components/LogInContainer";
import { BrowserRouter, Route, Switch } from 'react-router-dom';
class App extends Component {
render(){
return (
+
diff --git a/src/components/PricingPlan.js b/src/components/PricingPlan.js
new file mode 100644
index 0000000..df30b09
--- /dev/null
+++ b/src/components/PricingPlan.js
@@ -0,0 +1,25 @@
+import React, { Component } from 'react';
+import './pricing-plan.css';
+
+class PricingPlan extends Component {
+
+ render(){
+ return(
+
+
+ )
+ }
+
+}
+export default PricingPlan;
\ No newline at end of file
diff --git a/src/components/pricing-plan.css b/src/components/pricing-plan.css
new file mode 100644
index 0000000..c66f34e
--- /dev/null
+++ b/src/components/pricing-plan.css
@@ -0,0 +1,41 @@
+.pricing-plan {
+
+ width:300px;
+ border-radius: 25px;
+ box-shadow: 0 0 5px rgba(0,0,0,0.2);
+ overflow: hidden;
+ font-family: sans-serif;
+ font-size: 16px;
+ line-height: 1.5;
+ color: #555555;
+ margin: 15px;
+
+}
+
+.pricing-plan__header{
+
+ padding:25px;
+ background: #009578;
+ color: #ffffff;
+
+}
+
+.pricing-plan__title,
+.pricing-plan__summary{
+
+ margin: 0;
+ text-align: center;
+}
+
+.pricing-plan__title{
+
+ font-size: 1.5em;
+ font-weight: 400;
+
+}
+
+.pricing-plan__summary {
+
+ font-size: 1em;
+ font-weight:300;
+}
\ No newline at end of file