1 files changed, 97 insertions, 52 deletions
diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css
index f4182d1..4bfa363 100755
--- a/public/assets/stylesheets/app.css
+++ b/public/assets/stylesheets/app.css
@@ -922,75 +922,120 @@ iframe.embed {
   width: 76vw;
   margin: 2vw 10vw;
 }
-.planbox {
-  padding: 2vw;
-  border: 1px solid #ddd;
-  background: white;
-  border-radius: 25px;
-  font-size: 15px;
-  line-height: 23px;
-  text-align: center;
-}
-.planbox h3 {
+
+ul#plans {
+  margin: 0 auto;
   text-align: center;
-  margin-bottom: 10px;
-}
-.about_plan ul {
-  margin-bottom: 60px;
+  font-size: 14px;
 }
-.planbox li {
-  list-style-type: none;
-  margin-bottom: 0;
-  font-size: 1.3vw;
-  padding: 0 1vw;
+
+ul#plans>li {
+  display: inline-block;
+  width: 300px;
+  vertical-align: top;
+  margin: 0 25px 25px 0;
+  position: relative;
 }
-.paidPlan .planbox li {
-  padding: 0 5.6vw;
+
+ul#plans>li.most-popular:before {
+  content: 'Most Popular';
+  display: block;
+  background: #F17E6F;
+  color: white;
+  font-size: 1em;
+  font-weight: 500;
+  letter-spacing: 1px;
+  text-transform: uppercase;
+  width: 100%;
+  position: absolute;
+  top: -31px;
 }
-.about_custom.planbox li {
-	padding: 10px;
-	font-size: 17px;
+
+ul#plans .top {
+  background: #3A3A3A;
+  color: white;
+  padding: 30px 0;
+  height: 266px;
 }
-.planbox.miscbox {
-  border: 0;
-  background: #f8f8f8;
+
+ul#plans h2 {
+  padding: 0;
+  font-size: 1.25em;
+  margin-bottom: 1.75em;
+  text-transform: uppercase;
+  letter-spacing: 3px;
+  font-weight: 500;
 }
-.about_custom a {
-  border-bottom: 1px solid;
+
+ul#plans h3 {
+  margin: 0 0 20px;
+  font-weight: 200;
 }
 
-/* Billing / Subscription Settings */
-.planList {
-	position: absolute;
-	left: 50%;
-	transform: translateX(-48%);
+ul#plans h3 span.dollar {
+  font-size: 1.25em;
+  vertical-align: top;
+  position: relative;
+  top: -14px;
 }
-.planList .about_custom {
-	width: 56vw;
-	margin: 1vw 4vw;
+
+ul#plans h3 span.price {
+  font-size: 5em;
+  font-weight: 100;
 }
-.planList .planbox {
-	padding: 0;
+
+ul#plans h4 {
+  font-size: 0.85em;
+  color: #e6e6e6;
+  margin: 0 auto;
+  width: 50%;
+  font-weight: 500;
+  line-height: 30px;
 }
-.planList .custombox {
-	margin: 2vw 4vw 4vw 4vw;
+
+ul#plans ul {
+  border-left: 1px solid #e5e5e5;
+  border-right: 1px solid #e5e5e5;
 }
-.planList .miscbox {
-	line-height: 2.7vw;
+
+ul#plans ul li {
+  text-align: left;
+  border-bottom: 1px solid #e5e5e5;
+  padding: 5px 20px;
+  font-weight: 700;
+  list-style: none;
+  background: white;
+	color:#333;
 }
-.mediaDrawer .planList h3 {
-	margin-top: 3px;
-	font-size: 21px;
-	font-weight: bold
+
+ul#plans .signup {
+  background: #3A3A3A;
+  padding: 25px 0;
 }
-.freePlan {
-	text-align: left;
+
+.signup .button {
+  font-weight: bold;
+  padding: 16px 30px 14px;
+  -o-transition: background 0.2s ease-in-out;
+  -webkit-transition: background 0.2s ease-in-out;
+  transition: background 0.2s ease-in-out;
+  display: inline-block;
+  background: #F17E6F;
+  color: white;
+  text-decoration: none;
+  font-size: 1em;
+  padding: 4px 30px 3px;
+  border: none;
+  cursor: pointer;
 }
-.planList .planbox li:first-child {
-	font-size: 1.9vw;
-	padding: 0;
+
+
+.signup .button:hover {
+  color: white;
+  background: #ef6958;
 }
 
+
 /* debug sync button */
 .editSubscription .gear {
 	position: absolute;