// Pricing //Pricing Card .pricing-card { text-align: center; p { font-size: 1rem; } ul { list-style-type:none; padding:0; } .header { border-radius:6px 6px 0 0; color: $white; @extend .z-depth-1-half; h4{ padding: 2.5rem; font-weight: 500; } } .price { position: relative; padding-top: 3rem; h1, h2 { font-size: 5rem; padding: 1.5rem; font-weight:300; &:before { content: "$"; font-size: 30px; position: absolute; margin-left: -1.2rem; margin-top: 0.7rem; } &:after { content: "/mo"; font-size: 30px; position: absolute; margin-top: 3rem; } } .version { position: absolute; top: 0; width: 100%; background-color: $rgba-black-light; padding: 1rem; @extend .z-depth-1; h5 { padding: 0; margin: 0; } } } .heading { h1 { font-size: 4rem; font-weight:400; } } .striped { padding: 0.6rem; .fa { margin-right: 5px; } .fa-check { color: green; } .fa-times { color: red; } li { border-bottom: 1px solid rgba(153, 153, 153, 0.298039); margin-bottom: 1rem; } } // Card overlay &.card-overlay { display: block; color: $white; p { color: $white; } .price { padding-top: 0; } } .green-striped { li { border-color: #33c28a ; } } .orange-striped { li { border-color: #e97d63 ; } } .purple-striped { li { border-color: #963c94 ; } } .orange-gradient { background: linear-gradient(to right, #FFC776 0%, #FB6262 80%); } .green-gradient { background: linear-gradient(to right, #558dff 0%, #10cea4 80%); } .purple-gradient { background-image: linear-gradient(to right, #8680ff , #ff66c4 ); } .card-background { background-color: #28283f; border-radius: 0 0 6px 6px; } } // Additional pricing cards .card { .card-circle { border: 2px solid #e0e0e0; height: 120px; width: 120px; margin-bottom: 2rem; @extend .flex-center; border-radius: 50%; .fa { font-size: 4rem; } } } .naked-card { h5 { margin-top: 1.2rem; } .price { padding-top: 0rem; } li p { color: color($grey, "darken-1"); strong { color: color($grey, "darken-2"); } } } .pink-gradient{ background: linear-gradient(40deg, #6faaff, #eb66ce); }