
img {width:48px}

.default {font-size:16px;
    font-family: sans-serif;
}
.store-button {
    width:auto;
    padding:6px;
    font-weight:bold;
    border-radius:8px;
    border:2px solid #4682b4;
    background-color:#4682b4;
    color:white;
    cursor:pointer;
    text-align:center;
    
}
.store-button .text {color:#ffffff}
.store-button:hover {
    background-color:#ffffff;
    color:#4682b4;
    
}
.store-button:hover .text { color :#4682B4;}

.active {
    padding:4px;
    cursor:pointer;
    border-bottom:2px solid transparent ;
}
.active:hover { border-bottom:2px solid #4682B4}
.current-plan {
    
    border-color: #20B2AA #20B2AA transparent transparent;
    border-style: solid;
    border-width: 15px 15px 15px 15px;
    height: 0px;
    width: 0px;
    
}
.bold { font-weight:bold; }
.caption {
    font-size:28px; font-weight:bold ;
    font-family:sans-serif;
    text-transform:capitalize;

    }
.medium-caption {
    font-size:18px;
    font-weight:lighter;
    font-family:sans-serif ;
    text-transform:capitalize;
}
.plan {		
    padding:4px;
    margin:4px;
    border-radius: 4px;
    border:1px solid #CAD5E0
}
.pricing  {
    display:grid;
    
    grid-template-columns: repeat(auto-fit,minmax(250px, 1fr) );
    ;
    
    /* align-content:center; */
}
 .header {
    display:grid;
    grid-template-columns: 50% auto;
    grid-template-rows: 100px;
    gap:2px;
    align-items: center;
    margin-left:25%;
    margin-right:25%;
    margin-bottom:2%;
    
}
.header img {width:100px}
.pricing-frame {
    display:grid;
    
    margin-left:10%;
    margin-right:10%;

    height:85%;
    align-content:center;
}
.footer {
    bottom:10px;
    position:fixed;
    margin-left:10%;
    width: 80%;
    padding:8px;
    text-align:center;
    display:grid;
    grid-template-columns: 10% auto 10%;
    grid-gap: 2px;
    background-color:#f3f3f3;
}
.plan .title { 
    display:grid;
    grid-template-columns: auto 32px; 
    grid-gap:2px;
    font-size:24px; font-family:verdana; text-transform: capitalize; border-bottom:1px solid #CAD5E0;  }
.plan .feature {display:grid; grid-template-columns: 60% 40%; grid-gap:2px; margin:4px;}
.plan .feature .label {text-transform: uppercase; grid-column:1; font-size:14px;}
.plan .feature .status {font-size:14px; text-align: right; }
