/* pricing table */ .pricing-box { &:not(:first-child) { padding-left:7px; } &:not(:last-child) { padding-right:7px; } .price{ font-size:22px; line-height:20px; height:28px; text-align:center; color:#555; small { font-size:14px; } } .btn { font-size:16px; } /* the purchase button */ .widget-header {/* the title */ text-align:center; padding-left:0; } } @media only screen and (max-width: @screen-tablet) { .pricing-box { margin: 0; margin-bottom:16px; padding-left:0 !important; padding-right:0 !important; margin-left: -1px; &:nth-child(odd) { padding-left: @grid-gutter-width / 2 !important; } &:nth-child(even) { padding-right: @grid-gutter-width / 2 !important; } } } @media only screen and (max-width: @screen-topbar-down) { .pricing-box { margin: 0; margin-bottom:16px; width:100%; padding-left:@grid-gutter-width / 2 !important; padding-right:@grid-gutter-width / 2 !important; } } .pricing-table-header { padding-top:0; margin-top:0; text-align:left; > li { padding:7px 0 7px 11px; font-size:13px; } } .pricing-table { margin-top:0; > li { text-align:center; padding:7px 0; font-size:13px; } } .list-striped { > li { &:nth-child(odd) { background-color:#FFF; } &:nth-child(even) { background-color:#F2F3EB; } } &.pricing-table-header > li:nth-child(even) { background-color:#EEE; } } .pricing-box-small { box-shadow:none; margin-left:-2px; background-color:#FFF; position:relative; z-index:10; .price { line-height:20px; height:28px; text-align:center; .label { &:before, &:after { margin-top:-2px; .opacity(0.9); } } } &:hover { box-shadow:0 0 4px 2px rgba(0,0,0,0.15); z-index:11; .scale(1.04); //-webkit-transform:none;/*chrome blurs when scaled, so disable it!*/ .price > .label { .scale(0.96); //-webkit-transform:none; } } } .pricing-span { margin:0; width:19%; max-width:150px !important; min-width:110px !important; float:left !important; } .pricing-span-header { padding-right: 0; } @media only screen and (min-width: @screen-xs-min) { .pricing-span-body { padding-left: 0; padding-right: 0; } } @media only screen and (max-width: @screen-xs) { .pricing-span-header , .pricing-span-body { width: 100%; padding-right: @grid-gutter-width / 2; } }