/* ==========================================================================
   Pricing Tables
   ========================================================================== */


/* --- Plans ---------------------------- */

.my_planHeader {
    text-align: center;
    color: white;
    padding-top:0.2em;
    padding-bottom:0.2em;
}

.my_planFooter {
    text-align: center;
    color: white;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.my_planTitle {
    font-size:1.5em;
    font-weight: bold;
}
.my_planPrice {
    font-size:1.4em;
    font-weight: bold;    
}
.my_planDuration {
    margin-top: -0.6em;
}

@media (max-width: 768px) {
    .my_planTitle {
        font-size:small;
    }    
}

.pad1em {padding-top:1em;}
.pad5 {padding:5px;}
.pad10 {padding:10px;}
.pad20 {padding:20px;}

/* --- Features ------------------------- */

.my_feature {
    line-height:1.2em; 
    vertical-align:middle;
    color: #000;
}

@media (max-width: 768px) {
    .my_feature {
        text-align: center
    }
 }

.my_featureRow {
    margin-top: 0.2em;
    margin-bottom: 0.2em;
    border: 0.1em solid #CBCBCB;
}    



/* --- Plan 1 --------------------------- */
.my_plan1 {
    background: rgb(224,234,242);
    /*background: rgb(105, 153, 193);*/
}

.my_planFooter.my_plan1 a, .my_planHeader.my_plan1 a {
    background: rgb(72, 109, 139);
    color:white;
}

.my_planHeader.my_plan1 {
    background: rgb(105, 153, 193);
    border-bottom: thick solid rgb(72, 109, 139);
}

.footerTopBorder.my_plan1 {
    border-top: thick solid rgb(72, 109, 139);
}

.my_planFooter.my_plan1 {
    background: rgb(105, 153, 193);
}



/* --- Plan 2 --------------------------- */
.my_plan2 {
    background: rgb(230,235,218);
    /*background: rgb(134, 162, 77);*/
}

.my_planFooter.my_plan2 a, .my_planHeader.my_plan2 a {
    background: rgb(108, 131, 62);
    color:white;
}

.my_planHeader.my_plan2 {
    background: rgb(134, 162, 77);
    border-bottom: thick solid rgb(108, 131, 62);
}

.footerTopBorder.my_plan2 {
    border-top: thick solid rgb(108, 131, 62);
}

.my_planFooter.my_plan2 {
    background: rgb(134, 162, 77);
}

/* --- Plan 3 --------------------------- */
.my_plan3 {
    background: rgb(254,235,212);
    /*background: rgb(253, 161, 49);*/
}

.my_planFooter.my_plan3 a, .my_planHeader.my_plan3 a {
    background: rgb(199, 127, 40);
    color:white;
}

.my_planHeader.my_plan3 {
    background: rgb(253, 161, 49);
    border-bottom: thick solid rgb(199, 127, 40);
}

.footerTopBorder.my_plan3 {
    border-top: thick solid rgb(199, 127, 40);
}

.my_planFooter.my_plan3 {
    background: rgb(253, 161, 49);
}


.my_planFeature {
    text-align: center;
    font-size: 1.3em;
    padding-top:0.3em;
    padding-bottom:0.3em;

}

.my_planFeature i.my_check {
    color: green;
}