/* membership Plan*/
section.membership-plans{
    overflow: hidden;
}

.row.basePlan .membership-plan-wrap,
.row.topUpPlan .membership-plan-wrap,
.membership-plan-wrap{
    display: block;
	width: 100%;
    max-width: 100%;
    margin: 0 auto;
}

.membership-plan-wrap:after{
    content: " ";
    display: table;
    clear: both;
}

.membership-plan{
    width: 100%;
    max-width: 100%;
    background: #FFFFFF;
    text-align: center;
    border: 1px solid #E1E1E1;
    padding: 30px 30px 25px 30px;
    float: left;
    position: relative;
    z-index: 0;
	height: 100% !important;
    margin-top: 15px;
}

.container section.membership-plans > .row{
    float: left;
    /*width: 100%;*/
    text-align: center;
}

section.membership-plans > .row,
section.membership-plans .row.basePlan,
section.membership-plans .row.topUpPlan {
    float: left;
    width: auto;
    margin: 0 auto;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}

.membership-plan > h3,
.membership-plan-wrap > a h3{
    padding: 0;
    margin: 0 0 14px;
    font-family : Source Sans Pro; 
    font-size : 21px; 
    color : #6E6F71;
}

.membership-plan-wrap > a > h3{
	margin-top: 30px
}

.membership-plan-wrap > a > span,
.membership-plan > span{
    font-family : Source Sans Pro; 
    font-size : 35px; 
    color : #6E6F71;
}

.membership-plan-wrap > a > p,
.membership-plan > p{
    margin: 14px 0 0;
    font-family : Source Sans Pro; 
    font-size : 14px; 
    line-height : 18px; 
    color : #6E6F71;
}

.membership-plan-wrap > a > button,
.membership-plan > button{
    background: #A5C755;
    color: #FFFFFF;
    border-radius: 0;
    margin-top: 25px;
    margin-bottom: 5px;
    padding: 9px 25px;
    text-transform: uppercase;
}

.membership-plan-wrap > a > button:hover,
.membership-plan > button:hover{
    color: #FFFFFF;
    background: #D4E2B0;
}

.membership-plan-wrap > .membership-plan.selectPlan, 
.membership-plans > .basePlan > .membership-plan-wrap.membership-plan > a.selectPlan,
.membership-plans > .topUpPlan > .membership-plan-wrap.topUpPlan > a > .membership-plan.selectPlan{
    border: 1px solid #6D6E70;
}

.membership-plan-wrap > a,
.membership-plan-wrap > a:focus .membership-plan,
.membership-plan-wrap.addPlan >  a .membership-plan{
	position: relative;
    margin-top: 15px;
}

/*.membership-plan-wrap.addPlan > a:after,
.membership-plan-wrap.addPlan > .membership-plan:after{
    content: "";
	background: url(/tick.png) no-repeat;
    width: 30px;
    height: 30px;
    position: absolute;
    left: 50%;
    top: -15px;
    z-index: 1000;
    margin-left: -15px;
}*/

.membership-plans > .basePlan > .membership-plan-wrap.membership-plan > a.selectPlan:after, 
.membership-plans > .topUpPlan > .membership-plan-wrap.topUpPlan > a > .membership-plan.selectPlan:after,
.membership-plan-wrap > .membership-plan.selectPlan:after{
    content: "";
	background: url(/tick.png) no-repeat;
    width: 30px;
    height: 30px;
    position: absolute;
    left: 50%;
    top: -15px;
    z-index: 1000;
    margin-left: -15px;
}


/*.basePlan .membership-plan-wrap > a:hover .membership-plan:after,
.topUpPlan .membership-plan-wrap > a:hover .membership-plan:after{
	display: none;
}


.membership-plan-wrap.addPlan >  a .membership-plan:after{
	top: 0;
}*/

/* Membership Plan*/

input#btnPayRenewal{
	font-weight : bold;
	font-size : 14px;
	color : #FFFFFF;
	color : rgb(255, 255, 255);
	background : #A5C755;
	background : rgba(165, 199, 85, 1);
	height : 40px;
	padding: 0 30px;
	border: none;
	text-transform: uppercase;
}

.membership-plans .basePlan .membership-plan,
.membership-plans .topUpPlan .membership-plan{
    margin-bottom: 20px;
}

.membership-plans .basePlan .membership-plan{
        margin-bottom: 20px;
}

/*Media Queries Start Here*/

.container input#btnPayRenewal{
    margin-top: 10px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}

.container section.membership-plans > .row > div h2 {
    text-align: center;
    font-size: 21px;
    font-weight: bold;
    color: #6E6F71;
    text-transform: capitalize;
    margin: 60px 0 20px 0 !important;
}

section.membership-plans .row.titleTopUpPlan{
    width: 100%;
}

section.membership-plans .membership-plan-wrap{
    margin-bottom: 20px;
    cursor: pointer;
}

section.membership-plans .row.basePlan {
    width: 100%;
}

section.membership-plans .row.basePlan .membership-plan-wrap{
    border: none;
    padding: 0;
    padding-top: 15px;
}

section.membership-plans .row.basePlan .membership-plan-wrap > a{
    margin-top: 0;
    border: 1px solid #E1E1E1;
    width: 100%;
    float: left;
    padding: 0 15px 15px 15px;
}

/*section.membership-plans .row.topUpPlan .membership-plan-wrap > a,
section.membership-plans .row.topUpPlan .membership-plan-wrap.addPlan >  a .membership-plan{
    margin-top: 0;
}


section.membership-plans .row.topUpPlan .membership-plan-wrap > a:hover .membership-plan:after{
    top: 0;
}*/

section.membership-plans .row.titleTopUpPlan h2{
    padding-bottom: 20px; 
}

@media (min-width: 768px){

    .row.basePlan .membership-plan-wrap,
    .row.topUpPlan .membership-plan-wrap,
    .membership-plan-wrap{
        margin: 15px auto 30px;
    }

	section.membership-plans .row .membership-plan-wrap,
    section.membership-plans .row.basePlan .membership-plan-wrap,
    section.membership-plans .row.topUpPlan .membership-plan-wrap
    {
        max-width: 220px;
		padding: 0;
        margin: 0 10px !important;
        float: left;
	}
    
    .membership-plan-wrap > a,
    .membership-plan-wrap > a > .membership-plan{
		width: 100%;
        float: left;
    }
	
	section.membership-plans .row .membership-plan-wrap:first-child:nth-last-child(1),
	section.membership-plans .row .membership-plan-wrap:first-child:nth-last-child(2),
	section.membership-plans .row .membership-plan-wrap:first-child:nth-last-child(2) ~ div,
	section.membership-plans .row .membership-plan-wrap > div:first-child:nth-last-child(3),
	section.membership-plans .row .membership-plan-wrap > div:first-child:nth-last-child(3) ~ div{
	  margin: 0 15px;
	}

    .container section.membership-plans:last-child > .row{
        width: 100%;
    }
    
    section.membership-plans .row.basePlan {
        width: auto;
    }
    	
    .container section.membership-plans:last-child > .row,
    .container section.membership-plans > .row.basePlan,
    .container section.membership-plans > .row.topUpPlan{
        width: auto;
    }
	
    section.membership-plans .row.basePlan .membership-plan-wrap{
        border: none;
        padding-top: 15px;
    }

    section.membership-plans .row.basePlan .membership-plan-wrap > a{
        margin-top: 0;
        border: 1px solid #E1E1E1;
    }

}

@media (min-width: 991px) {
    section.membership-plans .row .membership-plan-wrap,
    section.membership-plans .row.basePlan .membership-plan-wrap,
    section.membership-plans .row.topUpPlan .membership-plan-wrap {
        max-width: 290px;
        min-width: 290px;
    }

    .container section.membership-plans:last-child > .row{
        width: 100%;
    }
    	
    .container section.membership-plans:last-child > .row,
    .container section.membership-plans > .row.basePlan,
    .container section.membership-plans > .row.topUpPlan{
        width: auto;
    }
}

@media (min-width: 1200px){

    section.membership-plans .row .membership-plan-wrap,
    section.membership-plans .row.basePlan .membership-plan-wrap,
    section.membership-plans .row.topUpPlan .membership-plan-wrap,
    section.membership-plans .row.basePlan .membership-plan-wrap > a,
    section.membership-plans .row.topUpPlan .membership-plan-wrap > a{
        max-width: 370px;
        min-width: 370px;
    }
    
    .container section.membership-plans:last-child > .row{
        width: 100%;
    }
    	
    .container section.membership-plans:last-child > .row,
    .container section.membership-plans > .row.basePlan,
    .container section.membership-plans > .row.topUpPlan{
        width: auto;
    }

}