.plan {
    padding: 10px;
    text-align: center;
    background: white;
    border: 1px solid #dbe3ec;
    margin-bottom: 20px; 
}

.plan-title {
    margin-bottom: 12px;
    font-size: 24px;
    color: #333333; 
}

.plan-price {
    margin-bottom: 20px;
    line-height: 1;
    font-size: 28px;
    font-weight: bold;
    color: #d66061; 
}

.plan-unit {
    display: block;
    margin-top: 5px;
    font-size: 13px;
    font-weight: normal;
    color: gray; 
}

ul.plan-details {
    margin: 0;
    padding: 0;
    list-style-type: none; 
}

ul.plan-details li {
    cursor: pointer;
    width: 30%;
    display: inline-block;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    text-align: center;
    border: 1px solid #a9bcd2;
    background-color: #e9eef3;
    /* Fallback Color */
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f9fbfc), to(#e9eef3));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #f9fbfc, #e9eef3);
    /* Chrome 10+, Saf5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(top, #f9fbfc, #e9eef3);
    /* FF3.6 */
    background-image: -ms-linear-gradient(top, #f9fbfc, #e9eef3);
    /* IE10 */
    background-image: -o-linear-gradient(top, #f9fbfc, #e9eef3);
    /* Opera 11.10+ */
    background-image: linear-gradient(top, #f9fbfc, #e9eef3);
    padding: 15px 0;
    margin: 0 5px 10px 0;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    color: gray; 
}

ul.plan-details li h4.plan-name {
    font-size: 11px;
    margin: 0; 
}

ul.plan-details li span {
    font-size: 15px;
    font-weight: 600; 
}

ul.plan-details li:hover {
    background-color: #a4c2dc;
    /* Fallback Color */
    background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#a4c2dc));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, white, #a4c2dc);
    /* Chrome 10+, Saf5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(top, white, #a4c2dc);
    /* FF3.6 */
    background-image: -ms-linear-gradient(top, white, #a4c2dc);
    /* IE10 */
    background-image: -o-linear-gradient(top, white, #a4c2dc);
    /* Opera 11.10+ */
    background-image: linear-gradient(top, white, #a4c2dc);
    color: #5b90bf;
    border: 1px solid #a4c2dc; 
}

ul.plan-details li:last-child {
    margin-right: 0; 
}

.plan-recommended {
    margin: -11px auto -16px auto;
    width: 70%;
    font-weight: 600;
    color: white;
    background: #d66061;
    padding: 5px; 
}

@media (min-width: 768px) and (max-width: 991px) {
    .plan {
        margin-bottom: 10px; 
    } 
}