@charset "UTF-8"; /** * * ------------------------------------------- * * Template : Bootplan - Bootstrap Pricing Tables * Author : thecodrops * Author URI : http://thecodrops.com * * ------------------------------------------- * */ /* Plan Animation */ .pricing-animation-yes .pricing-plan {-webkit-transition: .3s ease transform, .3s ease -webkit-transform;transition: .3s ease transform, .3s ease -webkit-transform;-webkit-transform: translateY(0px);transform: translateY(0px);} .pricing-animation-yes .pricing-plan:hover {-webkit-transform: translateY(-10px);transform: translateY(-10px);} /*====================== >> style1 >> ========================*/ .pricing-style1 .pricing-plan {text-align: center;padding: 35px 25px;margin-bottom: 35px;background-color: rgba(41, 41, 41, 0.05);-webkit-transition: .3s ease all;transition: .3s ease all;} .sec-color .pricing-style1 .pricing-plan {background: #fff;} .pricing-style1 .pricing-head .name {padding-bottom: 20px;font-size: 13px;text-transform: uppercase;color: #000;} .pricing-style1 .pricing-head span.value {display: block;font-size: 52px;line-height: normal;-webkit-transition: all .25s ease;transition: all .25s ease;} .pricing-style1 .pricing-head span.duration {margin-top: 7px;display: block;color: #999;font-size: 14px;} .pricing-style1 .pricing-body {padding-top: 40px;} .pricing-style1 .pricing-body ul {padding-left: 0;list-style: none;font-size: 12px;color: #999;} .pricing-style1 .pricing-body ul li:nth-child(n+2) {padding-top: 12px;} .pricing-style1 .pricing-footer {padding-top: 30px;} .pricing-style1 .pricing-footer .p-button {display: inline-block;padding: 5px 12px;font-size: 11px;min-width: 130px;text-transform: uppercase;border: 1px solid #444;color: #000;text-decoration: none;-webkit-transition: .3s all ease;transition: .3s all ease;} .pricing-style1 .pricing-footer .p-button:hover {background: #444;color: #fff;} .pricing-style1.sec-color .pricing-plan:hover {background: #f7f7f7;} .pricing-style1 .pricing-head {position: relative;} .pricing-style1 .badge {color: #fff;position: absolute;font-size: 11px;line-height: 20px;left: 50%;top: -50px;-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);transform: translateX(-50%);background: #337ab7;padding: 2px 15px 4px;border-radius: 0;} .pricing-style1 .badge:before, .pricing-style1 .badge:after {content: '';position: absolute;border: 15px solid transparent;z-index: -1;top: 0;} .pricing-style1 .badge:before {left: -30px;border-right-color: #fff;} .pricing-style1 .badge:after {right: -30px;border-left-color: #fff;} .pricing-style1 .pricing-plan.featured, .pricing-style1 .pricing-plan:hover {-webkit-box-shadow: 0 20px 30px 0px rgba(0, 0, 0, 0.1);box-shadow: 0 20px 30px 0px rgba(0, 0, 0, 0.1);} .pricing-style1 .pricing-plan:hover .pricing-head span.value, .pricing-style1 .pricing-plan.featured .pricing-head span.value {color: #337ab7;} .pricing-style1 .pricing-plan.featured .p-button, .pricing-style1 .pricing-plan:hover .p-button {border-color: #337ab7;color: #337ab7;} .pricing-style1 .pricing-plan:hover .p-button:hover {background: #337ab7;color: #fff;} /*====================== >> style2 >> ========================*/ .pricing-style2 .pricing-plan {text-align: center;margin-bottom: 35px;background-color: rgba(0, 0, 0, 0.03);padding: 35px;-webkit-transition: all .25s ease;transition: all .25s ease;} .sec-color .pricing-style2 .pricing-plan {background: #fff;} .pricing-style2 .pricing-head .name {font-size: 24px;line-height: normal;margin-bottom: 25px;margin-top: 15px;color: #999;} .pricing-style2 .pricing-head .price {color: #444;} .pricing-style2 .pricing-head .value {font-size: 75px;line-height: 75px;} .pricing-style2 .pricing-head .price sup {font-size: 40px;line-height: 40px;top: 0px;margin-right: -5px;vertical-align: top;} .pricing-style2 .pricing-body {padding-top: 40px;} .pricing-style2 .pricing-body ul {padding-left: 0;list-style: none;font-size: 13px;color: #999;margin: 0;} .pricing-style2 .pricing-body ul li + li {border-top: 1px solid rgba(42, 42, 42, 0.05);padding-top: 10px;margin-top: 10px;margin-left: -35px;margin-right: -35px;} .pricing-style2 .pricing-footer {padding-top: 30px;} .pricing-style2 .p-button {margin-right: -35px;margin-left: -35px;} .pricing-style2 .p-button a {display: inline-block;padding: 8px 12px;font-size: 13px;min-width: 100%;text-transform: uppercase;color: #444;text-decoration: none;-webkit-transition: .3s all ease;transition: .3s all ease;border-width: 1px 0 1px 0;border-style: solid;border-color: rgba(42, 42, 42, 0.05);} .pricing-style2 .pricing-plan:hover, .pricing-style2 .pricing-plan.featured {-webkit-box-shadow: 10px 10px 28px 0px rgba(0, 0, 0, 0.2);box-shadow: 10px 10px 28px 0px rgba(0, 0, 0, 0.2);} .pricing-style2 .pricing-plan:hover .price, .pricing-style2 .featured .price {color: #337ab7;} .pricing-style2 .pricing-plan:hover .p-button a, .pricing-style2 .featured .p-button a {color: #337ab7;border-color: #337ab7;} .pricing-style2 .pricing-plan:hover .p-button a:hover {background: #337ab7;color: #fff;} /*--------------------- Plan Animation -----------------------*/ [class*='tc-animation-'] {-webkit-animation-duration: 0.8s;animation-duration: 0.8s;-webkit-animation-timing-function: cubic-bezier(0, 0, 0.76, 0.85);animation-timing-function: cubic-bezier(0, 0, 0.76, 0.85);-webkit-animation-fill-mode: both;animation-fill-mode: both;} .tc-animation-fade {-webkit-animation-name: tc-fade;animation-name: tc-fade;-webkit-animation-duration: 0.8s;animation-duration: 0.8s;-webkit-animation-timing-function: linear !important;animation-timing-function: linear !important;} .tc-animation-slide-top {-webkit-animation-name: tc-fade-top;animation-name: tc-fade-top;} .tc-animation-slide-bottom {-webkit-animation-name: tc-fade-bottom;animation-name: tc-fade-bottom;} .tc-animation-slide-left {-webkit-animation-name: tc-fade-left;animation-name: tc-fade-left;} .tc-animation-slide-right {-webkit-animation-name: tc-fade-right;animation-name: tc-fade-right;} .tc-animation-scale-up {-webkit-animation-name: tc-animation-scale-up;animation-name: tc-animation-scale-up;} .tc-animation-scale-down {z-index: 11;-webkit-animation-name: tc-animation-scale-down;animation-name: tc-animation-scale-down;} .tc-animation-shake {-webkit-animation-name: tc-shake;animation-name: tc-shake;} .tc-animation-rotate {-webkit-animation-name: tc-rotate;animation-name: tc-rotate;} .tc-animation-scale {-webkit-animation-name: tc-scale;animation-name: tc-scale;} .tc-animation-hover:not(:hover), .tc-animation-hover:not(:hover) [class*='tc-animation-'] {-webkit-animation-name: none;animation-name: none;} /*------------------------- Fade ---------------------------*/ @-webkit-keyframes tc-fade { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes tc-fade { 0% {opacity: 0;} 100% {opacity: 1;} } /*--------------------------- Fade Top ------------------------------*/ @-webkit-keyframes tc-fade-top { 0% {opacity: 0;-webkit-transform: translateY(-30%);} 100% {opacity: 1;-webkit-transform: translateY(0);} } @keyframes tc-fade-top { 0% {opacity: 0;transform: translateY(-30%);} 100% {opacity: 1;transform: translateY(0);} } /*--------------------------- Fade Bottom ------------------------------*/ @-webkit-keyframes tc-fade-bottom { 0% {opacity: 0;-webkit-transform: translateY(30%);} 100% {opacity: 1;-webkit-transform: translateY(0);} } @keyframes tc-fade-bottom { 0% {opacity: 0;transform: translateY(30%);} 100% {opacity: 1;transform: translateY(0);} } /*--------------------------- Fade Left ------------------------------*/ @-webkit-keyframes tc-fade-left { 0% {opacity: 0;-webkit-transform: translateX(-60%);} 100% {opacity: 1;-webkit-transform: translateX(0);} } @keyframes tc-fade-left { 0% {opacity: 0;transform: translateX(-60%);} 100% {opacity: 1;transform: translateX(0);} } /*--------------------------- Fade Right ------------------------------*/ @-webkit-keyframes tc-fade-right { 0% {opacity: 0;-webkit-transform: translateX(60%);} 100% {opacity: 1;-webkit-transform: translateX(0);} } @keyframes tc-fade-right { 0% {opacity: 0;transform: translateX(60%);} 100% {opacity: 1;transform: translateX(0);} } /*------------------------------ Scale Up --------------------------------*/ @-webkit-keyframes tc-animation-scale-up { 0% {opacity: 0;-webkit-transform: scale(0.2);} 100% {opacity: 1;-webkit-transform: scale(1);} } @keyframes tc-animation-scale-up { 0% {opacity: 0;transform: scale(0.2);} 100% {opacity: 1;transform: scale(1);} } /*--------------------------- Scale Down ------------------------------*/ @-webkit-keyframes tc-animation-scale-down { 0% {opacity: 0;-webkit-transform: scale(1.6);} 100% {opacity: 1;-webkit-transform: scale(1);} } @keyframes tc-animation-scale-down { 0% {opacity: 0;transform: scale(1.6);} 100% {opacity: 1;transform: scale(1);} } /*--------------------------- Rotate ------------------------------*/ @-webkit-keyframes tc-rotate { 0% {-webkit-transform: rotate(280deg);} 100% {-webkit-transform: rotate(360deg);} } @keyframes tc-rotate { 0% {transform: rotate(280deg);} 100% {transform: rotate(360deg);} } /*--------------------------- Shake ------------------------------*/ @-webkit-keyframes tc-shake { 0%, 100% {-webkit-transform: translateX(0);} 10% {-webkit-transform: translateX(-9px);} 20% {-webkit-transform: translateX(8px);} 30% {-webkit-transform: translateX(-7px);} 40% {-webkit-transform: translateX(6px);} 50% {-webkit-transform: translateX(-5px);} 60% {-webkit-transform: translateX(4px);} 70% {-webkit-transform: translateX(-3px);} 80% {-webkit-transform: translateX(2px);} 90% {-webkit-transform: translateX(-1px);} } @keyframes tc-shake { 0%, 100% {transform: translateX(0);} 10% {transform: translateX(-9px);} 20% {transform: translateX(8px);} 30% {transform: translateX(-7px);} 40% {transform: translateX(6px);} 50% {transform: translateX(-5px);} 60% {transform: translateX(4px);} 70% {transform: translateX(-3px);} 80% {transform: translateX(2px);} 90% {transform: translateX(-1px);} } /*------------------- Scale ---------------------*/ @-webkit-keyframes tc-scale { 0% {-webkit-transform: scale(1.2);} 100% {-webkit-transform: scale(1);} } @keyframes tc-scale { 0% {transform: scale(1.2);} 100% {transform: scale(1);} } /*--------------------- Resonsive Medium -----------------------*/ @media (min-width: 768px) and (max-width: 959px) {.pricing-style13 > div:nth-child(n+3) > div {margin-top: 60px;}} @media screen and (max-width: 767px) {.pricing-style13 > div:nth-child(n+2) > div {margin-top: 100px;}} .blue .pricing-style1 .badge, .blue .pricing-style1 .pricing-plan:hover .p-button:hover, .blue .pricing-style2 .pricing-plan:hover .p-button a:hover, .blue .pricing-style3 .pricing-plan:hover, .blue .pricing-style3 .pricing-plan.featured, .blue .pricing-style4 .featured.pricing-plan .pricing-head .price, .blue .pricing-style4 .pricing-plan.featured .pricing-footer .p-button, .blue .pricing-style5 .pricing-plan:hover .pricing-head .price, .blue .pricing-style5 .pricing-plan.featured .pricing-head .price, .blue .pricing-style5 .pricing-plan .pricing-footer .p-button:hover, .blue .pricing-style6 .pricing-head .price, .blue .pricing-style6 .pricing-footer .p-button, .blue .pricing-style6 .pricing-plan.featured, .blue .pricing-style7 .pricing-plan:hover .pricing-head .price, .blue .pricing-style7 .pricing-plan.featured .pricing-head .price, .blue .pricing-style7 .pricing-plan .pricing-footer .p-button:hover, .blue .pricing-style8 .pricing-plan.featured .pricing-head, .blue .pricing-style8 .pricing-plan:hover .pricing-head, .blue .pricing-style8 .pricing-plan.featured .pricing-footer .p-button, .blue .pricing-style8 .pricing-plan:hover .pricing-footer .p-button, .blue .pricing-style11 .pricing-plan:hover .name:before, .blue .pricing-style11 .pricing-plan.featured .name:before { background: #337ab7; } .blue .pricing-style1 .pricing-plan.featured .p-button, .blue .pricing-style1 .pricing-plan:hover .p-button, .blue .pricing-style1 .pricing-plan:hover .pricing-head span.value, .blue .pricing-style1 .pricing-plan.featured .pricing-head span.value, .blue .pricing-style2 .pricing-plan:hover .price, .blue .pricing-style2 .featured .price, .blue .pricing-style2 .pricing-plan:hover .p-button a, .blue .pricing-style2 .featured .p-button a, .blue .pricing-style5 .pricing-plan:hover .p-button, .blue .pricing-style5 .pricing-plan.featured .p-button, .blue .pricing-style6 .pricing-plan.featured .pricing-head .price, .blue .pricing-style7 .pricing-plan:hover .p-button, .blue .pricing-style7 .pricing-plan.featured .p-button, .blue .pricing-style9 .pricing-plan:hover .p-button, .blue .pricing-style9 .pricing-plan.featured .p-button, .blue .pricing-style10 .featured a.p-button, .blue .pricing-style10 .pricing-plan:hover a.p-button, .blue .pricing-style11 .pricing-plan:hover .p-button, .blue .pricing-style11 .pricing-plan.featured .p-button { color: #337ab7; } .blue .pricing-style1 .pricing-plan.featured .p-button, .blue .pricing-style1 .pricing-plan:hover .p-button, .blue .pricing-style2 .pricing-plan:hover .p-button a, .blue .pricing-style2 .featured .p-button a, .blue .pricing-style5 .pricing-plan:hover .pricing-footer .p-button, .blue .pricing-style5 .pricing-plan.featured .pricing-footer .p-button, .blue .pricing-style7 .pricing-plan:hover .p-button, .blue .pricing-style7 .pricing-plan.featured .p-button, .blue .pricing-style9 .pricing-plan:hover .p-button, .blue .pricing-style9 .pricing-plan.featured .p-button, .blue .pricing-style10 .pricing-plan.featured, .blue .pricing-style10 .pricing-plan:hover, .blue .pricing-style10 .featured a.p-button, .blue .pricing-style10 .pricing-plan:hover a.p-button, .blue .pricing-style11 .pricing-plan:hover .p-button, .blue .pricing-style11 .pricing-plan.featured .p-button { border-color: #337ab7; } .blue .pricing-style4 .pricing-plan.featured .pricing-footer .p-button:hover, .blue .pricing-style6 .pricing-footer .p-button:hover { background: #1c66a5; } .blue .pricing-style4 .pricing-plan.featured { -webkit-box-shadow: 0px -14px #337ab7; box-shadow: 0px -14px #337ab7; } .blue .pricing-style10 .pricing-plan.featured::before, .blue .pricing-style10 .pricing-plan:hover::before {border-color: #337ab7;border-right: 20px solid transparent;} .green .pricing-style1 .badge, .green .pricing-style1 .pricing-plan:hover .p-button:hover, .green .pricing-style2 .pricing-plan:hover .p-button a:hover, .green .pricing-style3 .pricing-plan:hover, .green .pricing-style3 .pricing-plan.featured, .green .pricing-style4 .featured.pricing-plan .pricing-head .price, .green .pricing-style4 .pricing-plan.featured .pricing-footer .p-button, .green .pricing-style5 .pricing-plan:hover .pricing-head .price, .green .pricing-style5 .pricing-plan.featured .pricing-head .price, .green .pricing-style5 .pricing-plan .pricing-footer .p-button:hover, .green .pricing-style6 .pricing-head .price, .green .pricing-style6 .pricing-footer .p-button, .green .pricing-style6 .pricing-plan.featured, .green .pricing-style7 .pricing-plan:hover .pricing-head .price, .green .pricing-style7 .pricing-plan.featured .pricing-head .price, .green .pricing-style7 .pricing-plan .pricing-footer .p-button:hover, .green .pricing-style8 .pricing-plan.featured .pricing-head, .green .pricing-style8 .pricing-plan:hover .pricing-head, .green .pricing-style8 .pricing-plan.featured .pricing-footer .p-button, .green .pricing-style8 .pricing-plan:hover .pricing-footer .p-button, .green .pricing-style11 .pricing-plan:hover .name:before, .green .pricing-style11 .pricing-plan.featured .name:before { background: #4CAF50; } .green .pricing-style1 .pricing-plan.featured .p-button, .green .pricing-style1 .pricing-plan:hover .p-button, .green .pricing-style1 .pricing-plan:hover .pricing-head span.value, .green .pricing-style1 .pricing-plan.featured .pricing-head span.value, .green .pricing-style2 .pricing-plan:hover .price, .green .pricing-style2 .featured .price, .green .pricing-style2 .pricing-plan:hover .p-button a, .green .pricing-style2 .featured .p-button a, .green .pricing-style5 .pricing-plan:hover .p-button, .green .pricing-style5 .pricing-plan.featured .p-button, .green .pricing-style6 .pricing-plan.featured .pricing-head .price, .green .pricing-style7 .pricing-plan:hover .p-button, .green .pricing-style7 .pricing-plan.featured .p-button, .green .pricing-style9 .pricing-plan:hover .p-button, .green .pricing-style9 .pricing-plan.featured .p-button, .green .pricing-style10 .featured a.p-button, .green .pricing-style10 .pricing-plan:hover a.p-button, .green .pricing-style11 .pricing-plan:hover .p-button, .green .pricing-style11 .pricing-plan.featured .p-button { color: #4CAF50; } .green .pricing-style1 .pricing-plan.featured .p-button, .green .pricing-style1 .pricing-plan:hover .p-button, .green .pricing-style2 .pricing-plan:hover .p-button a, .green .pricing-style2 .featured .p-button a, .green .pricing-style5 .pricing-plan:hover .pricing-footer .p-button, .green .pricing-style5 .pricing-plan.featured .pricing-footer .p-button, .green .pricing-style7 .pricing-plan:hover .p-button, .green .pricing-style7 .pricing-plan.featured .p-button, .green .pricing-style9 .pricing-plan:hover .p-button, .green .pricing-style9 .pricing-plan.featured .p-button, .green .pricing-style10 .pricing-plan.featured, .green .pricing-style10 .pricing-plan:hover, .green .pricing-style10 .featured a.p-button, .green .pricing-style10 .pricing-plan:hover a.p-button, .green .pricing-style11 .pricing-plan:hover .p-button, .green .pricing-style11 .pricing-plan.featured .p-button { border-color: #4CAF50; } .green .pricing-style4 .pricing-plan.featured .pricing-footer .p-button:hover, .green .pricing-style6 .pricing-footer .p-button:hover { background: #58bb5c; } .green .pricing-style4 .pricing-plan.featured { -webkit-box-shadow: 0px -14px #4CAF50; box-shadow: 0px -14px #4CAF50; } .green .pricing-style10 .pricing-plan.featured::before, .green .pricing-style10 .pricing-plan:hover::before {border-color: #4CAF50;border-right: 20px solid transparent;} .red .pricing-style1 .badge, .red .pricing-style1 .pricing-plan:hover .p-button:hover, .red .pricing-style2 .pricing-plan:hover .p-button a:hover, .red .pricing-style3 .pricing-plan:hover, .red .pricing-style3 .pricing-plan.featured, .red .pricing-style4 .featured.pricing-plan .pricing-head .price, .red .pricing-style4 .pricing-plan.featured .pricing-footer .p-button, .red .pricing-style5 .pricing-plan:hover .pricing-head .price, .red .pricing-style5 .pricing-plan.featured .pricing-head .price, .red .pricing-style5 .pricing-plan .pricing-footer .p-button:hover, .red .pricing-style6 .pricing-head .price, .red .pricing-style6 .pricing-footer .p-button, .red .pricing-style6 .pricing-plan.featured, .red .pricing-style7 .pricing-plan:hover .pricing-head .price, .red .pricing-style7 .pricing-plan.featured .pricing-head .price, .red .pricing-style7 .pricing-plan .pricing-footer .p-button:hover, .red .pricing-style8 .pricing-plan.featured .pricing-head, .red .pricing-style8 .pricing-plan:hover .pricing-head, .red .pricing-style8 .pricing-plan.featured .pricing-footer .p-button, .red .pricing-style8 .pricing-plan:hover .pricing-footer .p-button, .red .pricing-style11 .pricing-plan:hover .name:before, .red .pricing-style11 .pricing-plan.featured .name:before { background: #ff5252; } .red .pricing-style1 .pricing-plan.featured .p-button, .red .pricing-style1 .pricing-plan:hover .p-button, .red .pricing-style1 .pricing-plan:hover .pricing-head span.value, .red .pricing-style1 .pricing-plan.featured .pricing-head span.value, .red .pricing-style2 .pricing-plan:hover .price, .red .pricing-style2 .featured .price, .red .pricing-style2 .pricing-plan:hover .p-button a, .red .pricing-style2 .featured .p-button a, .red .pricing-style5 .pricing-plan:hover .p-button, .red .pricing-style5 .pricing-plan.featured .p-button, .red .pricing-style6 .pricing-plan.featured .pricing-head .price, .red .pricing-style7 .pricing-plan:hover .p-button, .red .pricing-style7 .pricing-plan.featured .p-button, .red .pricing-style9 .pricing-plan:hover .p-button, .red .pricing-style9 .pricing-plan.featured .p-button, .red .pricing-style10 .featured a.p-button, .red .pricing-style10 .pricing-plan:hover a.p-button, .red .pricing-style11 .pricing-plan:hover .p-button, .red .pricing-style11 .pricing-plan.featured .p-button { color: #ff5252; } .red .pricing-style1 .pricing-plan.featured .p-button, .red .pricing-style1 .pricing-plan:hover .p-button, .red .pricing-style2 .pricing-plan:hover .p-button a, .red .pricing-style2 .featured .p-button a, .red .pricing-style5 .pricing-plan:hover .pricing-footer .p-button, .red .pricing-style5 .pricing-plan.featured .pricing-footer .p-button, .red .pricing-style7 .pricing-plan:hover .p-button, .red .pricing-style7 .pricing-plan.featured .p-button, .red .pricing-style9 .pricing-plan:hover .p-button, .red .pricing-style9 .pricing-plan.featured .p-button, .red .pricing-style10 .pricing-plan.featured, .red .pricing-style10 .pricing-plan:hover, .red .pricing-style10 .featured a.p-button, .red .pricing-style10 .pricing-plan:hover a.p-button, .red .pricing-style11 .pricing-plan:hover .p-button, .red .pricing-style11 .pricing-plan.featured .p-button { border-color: #ff5252; } .red .pricing-style4 .pricing-plan.featured .pricing-footer .p-button:hover, .red .pricing-style6 .pricing-footer .p-button:hover { background: #fd6e6e; } .red .pricing-style4 .pricing-plan.featured { -webkit-box-shadow: 0px -14px #ff5252; box-shadow: 0px -14px #ff5252; } .red .pricing-style10 .pricing-plan.featured::before, .red .pricing-style10 .pricing-plan:hover::before {border-color: #ff5252;border-right: 20px solid transparent;} .orange .pricing-style1 .badge, .orange .pricing-style1 .pricing-plan:hover .p-button:hover, .orange .pricing-style2 .pricing-plan:hover .p-button a:hover, .orange .pricing-style3 .pricing-plan:hover, .orange .pricing-style3 .pricing-plan.featured, .orange .pricing-style4 .featured.pricing-plan .pricing-head .price, .orange .pricing-style4 .pricing-plan.featured .pricing-footer .p-button, .orange .pricing-style5 .pricing-plan:hover .pricing-head .price, .orange .pricing-style5 .pricing-plan.featured .pricing-head .price, .orange .pricing-style5 .pricing-plan .pricing-footer .p-button:hover, .orange .pricing-style6 .pricing-head .price, .orange .pricing-style6 .pricing-footer .p-button, .orange .pricing-style6 .pricing-plan.featured, .orange .pricing-style7 .pricing-plan:hover .pricing-head .price, .orange .pricing-style7 .pricing-plan.featured .pricing-head .price, .orange .pricing-style7 .pricing-plan .pricing-footer .p-button:hover, .orange .pricing-style8 .pricing-plan.featured .pricing-head, .orange .pricing-style8 .pricing-plan:hover .pricing-head, .orange .pricing-style8 .pricing-plan.featured .pricing-footer .p-button, .orange .pricing-style8 .pricing-plan:hover .pricing-footer .p-button, .orange .pricing-style11 .pricing-plan:hover .name:before, .orange .pricing-style11 .pricing-plan.featured .name:before { background: #FF9800; } .orange .pricing-style1 .pricing-plan.featured .p-button, .orange .pricing-style1 .pricing-plan:hover .p-button, .orange .pricing-style1 .pricing-plan:hover .pricing-head span.value, .orange .pricing-style1 .pricing-plan.featured .pricing-head span.value, .orange .pricing-style2 .pricing-plan:hover .price, .orange .pricing-style2 .featured .price, .orange .pricing-style2 .pricing-plan:hover .p-button a, .orange .pricing-style2 .featured .p-button a, .orange .pricing-style5 .pricing-plan:hover .p-button, .orange .pricing-style5 .pricing-plan.featured .p-button, .orange .pricing-style6 .pricing-plan.featured .pricing-head .price, .orange .pricing-style7 .pricing-plan:hover .p-button, .orange .pricing-style7 .pricing-plan.featured .p-button, .orange .pricing-style9 .pricing-plan:hover .p-button, .orange .pricing-style9 .pricing-plan.featured .p-button, .orange .pricing-style10 .featured a.p-button, .orange .pricing-style10 .pricing-plan:hover a.p-button, .orange .pricing-style11 .pricing-plan:hover .p-button, .orange .pricing-style11 .pricing-plan.featured .p-button { color: #FF9800; } .orange .pricing-style1 .pricing-plan.featured .p-button, .orange .pricing-style1 .pricing-plan:hover .p-button, .orange .pricing-style2 .pricing-plan:hover .p-button a, .orange .pricing-style2 .featured .p-button a, .orange .pricing-style5 .pricing-plan:hover .pricing-footer .p-button, .orange .pricing-style5 .pricing-plan.featured .pricing-footer .p-button, .orange .pricing-style7 .pricing-plan:hover .p-button, .orange .pricing-style7 .pricing-plan.featured .p-button, .orange .pricing-style9 .pricing-plan:hover .p-button, .orange .pricing-style9 .pricing-plan.featured .p-button, .orange .pricing-style10 .pricing-plan.featured, .orange .pricing-style10 .pricing-plan:hover, .orange .pricing-style10 .featured a.p-button, .orange .pricing-style10 .pricing-plan:hover a.p-button, .orange .pricing-style11 .pricing-plan:hover .p-button, .orange .pricing-style11 .pricing-plan.featured .p-button { border-color: #FF9800; } .orange .pricing-style4 .pricing-plan.featured .pricing-footer .p-button:hover, .orange .pricing-style6 .pricing-footer .p-button:hover { background: #ffa31b; } .orange .pricing-style4 .pricing-plan.featured { -webkit-box-shadow: 0px -14px #FF9800; box-shadow: 0px -14px #FF9800; } .orange .pricing-style10 .pricing-plan.featured::before, .orange .pricing-style10 .pricing-plan:hover::before {border-color: #FF9800;border-right: 20px solid transparent;} .violet .pricing-style1 .badge, .violet .pricing-style1 .pricing-plan:hover .p-button:hover, .violet .pricing-style2 .pricing-plan:hover .p-button a:hover, .violet .pricing-style3 .pricing-plan:hover, .violet .pricing-style3 .pricing-plan.featured, .violet .pricing-style4 .featured.pricing-plan .pricing-head .price, .violet .pricing-style4 .pricing-plan.featured .pricing-footer .p-button, .violet .pricing-style5 .pricing-plan:hover .pricing-head .price, .violet .pricing-style5 .pricing-plan.featured .pricing-head .price, .violet .pricing-style5 .pricing-plan .pricing-footer .p-button:hover, .violet .pricing-style6 .pricing-head .price, .violet .pricing-style6 .pricing-footer .p-button, .violet .pricing-style6 .pricing-plan.featured, .violet .pricing-style7 .pricing-plan:hover .pricing-head .price, .violet .pricing-style7 .pricing-plan.featured .pricing-head .price, .violet .pricing-style7 .pricing-plan .pricing-footer .p-button:hover, .violet .pricing-style8 .pricing-plan.featured .pricing-head, .violet .pricing-style8 .pricing-plan:hover .pricing-head, .violet .pricing-style8 .pricing-plan.featured .pricing-footer .p-button, .violet .pricing-style8 .pricing-plan:hover .pricing-footer .p-button, .violet .pricing-style11 .pricing-plan:hover .name:before, .violet .pricing-style11 .pricing-plan.featured .name:before { background: #673AB7; } .violet .pricing-style1 .pricing-plan.featured .p-button, .violet .pricing-style1 .pricing-plan:hover .p-button, .violet .pricing-style1 .pricing-plan:hover .pricing-head span.value, .violet .pricing-style1 .pricing-plan.featured .pricing-head span.value, .violet .pricing-style2 .pricing-plan:hover .price, .violet .pricing-style2 .featured .price, .violet .pricing-style2 .pricing-plan:hover .p-button a, .violet .pricing-style2 .featured .p-button a, .violet .pricing-style5 .pricing-plan:hover .p-button, .violet .pricing-style5 .pricing-plan.featured .p-button, .violet .pricing-style6 .pricing-plan.featured .pricing-head .price, .violet .pricing-style7 .pricing-plan:hover .p-button, .violet .pricing-style7 .pricing-plan.featured .p-button, .violet .pricing-style9 .pricing-plan:hover .p-button, .violet .pricing-style9 .pricing-plan.featured .p-button, .violet .pricing-style10 .featured a.p-button, .violet .pricing-style10 .pricing-plan:hover a.p-button, .violet .pricing-style11 .pricing-plan:hover .p-button, .violet .pricing-style11 .pricing-plan.featured .p-button { color: #673AB7; } .violet .pricing-style1 .pricing-plan.featured .p-button, .violet .pricing-style1 .pricing-plan:hover .p-button, .violet .pricing-style2 .pricing-plan:hover .p-button a, .violet .pricing-style2 .featured .p-button a, .violet .pricing-style5 .pricing-plan:hover .pricing-footer .p-button, .violet .pricing-style5 .pricing-plan.featured .pricing-footer .p-button, .violet .pricing-style7 .pricing-plan:hover .p-button, .violet .pricing-style7 .pricing-plan.featured .p-button, .violet .pricing-style9 .pricing-plan:hover .p-button, .violet .pricing-style9 .pricing-plan.featured .p-button, .violet .pricing-style10 .pricing-plan.featured, .violet .pricing-style10 .pricing-plan:hover, .violet .pricing-style10 .featured a.p-button, .violet .pricing-style10 .pricing-plan:hover a.p-button, .violet .pricing-style11 .pricing-plan:hover .p-button, .violet .pricing-style11 .pricing-plan.featured .p-button { border-color: #673AB7; } .violet .pricing-style4 .pricing-plan.featured .pricing-footer .p-button:hover, .violet .pricing-style6 .pricing-footer .p-button:hover { background: #7a56bb; } .violet .pricing-style4 .pricing-plan.featured { -webkit-box-shadow: 0px -14px #673AB7; box-shadow: 0px -14px #673AB7; } .violet .pricing-style10 .pricing-plan.featured::before, .violet .pricing-style10 .pricing-plan:hover::before {border-color: #673AB7;border-right: 20px solid transparent;} .pricing-style2 .pricing-plan:hover .p-button a:hover{ color: #fff !important; }