.fee-comparision-div{
  display: flex;
  flex-wrap: wrap;
  font-size: 16px;
  justify-content: center;
  font-family: 'Source Sans Pro', Arial, sans-serif;
}

.fee-comparision-div ul.theplan{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  color: black;
  width: 100%; /* width of each table */
  margin-right: 20px; /* spacing between tables */
  margin-bottom: 1em;
  border: 1px solid gray;
  transition: all .5s;
}

.fee-comparision-div ul.theplan:hover{ /* when mouse hover over pricing table */
  /*transform: scale(1.05);
  transition: all .5s;
  z-index: 100;
  box-shadow: 0 0 10px gray;*/
}

.fee-comparision-div ul.theplan .center{
  margin: 0 auto;
  text-align: center;
}

.fee-comparision-div ul.theplan img{
  max-width: 80%;
  height: auto;
}

.fee-comparision-div ul.theplan li{
  padding: 10px 10px;
  position: relative;
  border-bottom: 1px solid #eee;
}

.fee-comparision-div ul.theplan li.title{
  font-weight: bold;
  text-align: left;
  padding: 15px 10px;
  background: #63B143;
  color: #fff;
  box-shadow: 0 -10px 5px rgba(0,0,0,.1) inset;
  text-transform: uppercase;
}

.fee-comparision-div ul.theplan:nth-of-type(2) li.title{
  background: rgb(249, 111, 118);
  color: #fff;
}
    
.fee-comparision-div ul.theplan:nth-of-type(3) li.title{
  background: rgb(210, 117, 251);
  color: #fff;
}

.fee-comparision-div ul.theplan li b{
  text-transform: uppercase;
}
.fee-comparision-div ul.theplan li.title b{
  font-size: 250%;
}

.fee-comparision-div ul.theplan:last-of-type{ /* remove right margin in very last table */
  margin-right: 0;
  border-radius:10px;
  overflow:hidden;
  border-color:#63B143;
}

/*very last LI within each pricing UL */
.fee-comparision-div ul.theplan li:last-of-type{
  text-align: left;
  margin-top: auto; /*align last LI (price botton li) to the very bottom of UL */
}  

.fee-comparision-div a.pricebutton{
  background: red;
  text-decoration: none;
  padding: 10px;
  display: inline-block;
  margin: 10px auto;
  border-radius: 5px;
  color: #fff;
  font-weight: bold;
  border-radius: 5px;
  text-transform: uppercase;
}

.fee-comparision-div .row{display:block; width:100%;}
.fee-comparision-div .col-sm-12, .fee-comparision-div .col-md-6{display:block; float:left;}
.fee-comparision-div ul li b{display:block; width:100%; margin-bottom:5px; text-align:left;}
.criteria ul{border-radius:10px; overflow:hidden; margin:0; padding:0; border:1px solid #63B143; }
.criteria li ul{border:0;}

.criteria li ul li{list-style-type:none; 
    background: url(../image/Check-Circle.png);
    background-size: 16px;
    background-position: left 2px;
    background-repeat: no-repeat;
    padding-left: 25px;
    margin-bottom: 15px;
    
}
.criteria li.title{ font-weight: bold;
  text-align: left;
  padding: 15px 10px;
  background: #63B143;
  color: #fff;
  box-shadow: 0 -10px 5px rgba(0,0,0,.1) inset;
  text-transform: uppercase;
    
}


@media only screen and (max-width: 600px) {
  .fee-comparision-div ul.theplan{
    border-radius: 0;
    width: 100%;
    margin-right: 0;
  }
  
  .fee-comparision-div ul.theplan:hover{
    transform: none;
    box-shadow: none;
  }
  
  .fee-comparision-div a.pricebutton{
    display: block;
  }
}