Price Table

<div class="container">
        <div class="row"> 

          <!-- Pricing Table -->
          <div class="col-md-4 col-sm-12">
            <div class="pricing-table">
              <div class="txt-blue fw-6">Starter</div>
              <div class="service-icon mx-auto">
                  <i class="fa fa-briefcase"></i>
              </div>
              <div class="pricing">
                10<sup>$</sup>
              </div>

              <ul class="list-unstyled">
                <li><strong>10GB</strong> Disk Space</li>
                <li><strong>100GB</strong> Monthly Bandwidth</li>
                <li><strong>20</strong> Email Accounts</li>
                <li><strong>Unlimited</strong> subdomains</li>
              </ul>

              <a href="#" class="btn-theme btn-dark">Signup Now</a>
            </div>
          </div>
          <!-- Pricing Table -->

          <!-- Pricing Table -->
          <div class="col-md-4 col-sm-12">
            <div class="pricing-table best-seller">
              <div class="txt-blue fw-6">Professional</div>
              <div class="service-icon mx-auto">
                  <i class="fa fa-paper-plane"></i>
              </div>
              <div class="pricing">
                40<sup>$</sup>
              </div>

              <ul class="list-unstyled">
                <li><strong>Unlimited</strong> Disk Space</li>
                <li><strong>Unlimited</strong> Monthly Bandwidth</li>
                <li><strong>Unlimited</strong> Email Accounts</li>
                <li><strong>Unlimited</strong> subdomains</li>
              </ul>

              <a href="#" class="btn-theme btn-danger">Signup Now</a>
            </div>
          </div>
          <!-- Pricing Table -->

          <!-- Pricing Table -->
          <div class="col-md-4 col-sm-12">
            <div class="pricing-table">
              <div class="txt-blue fw-6">Basic</div>
              <div class="service-icon mx-auto">
                  <i class="fa fa-plane"></i>
              </div>
              <div class="pricing">
                20<sup>$</sup>
              </div>

              <ul class="list-unstyled">
                <li><strong>2GB </strong> Disk Space</li>
                <li><strong>25GB</strong> Monthly Bandwidth</li>
                <li><strong>5</strong> Email Accounts</li>
                <li><strong>Unlimited</strong> subdomains</li>
              </ul>

              <a href="#" class="btn-theme btn-dark">Signup Now</a>
            </div>
          </div>
          <!-- Pricing Table -->
        </div>
 
      </div>

 <title>Document</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <style>
        body { background: #f1f1f1; font-family: 'Poppins', sans-serif; font-size: 16px;} 
        .pricing-table{
    text-align: center;
    background: #fafafa;
    padding: 4rem 2rem;
}
.pricing {
    position: relative;
    font-size: 2.25rem;
    font-weight: 600;
    color: #ff3514;
    padding: 35px 15px 0;
    display: inline-block;
}
.pricing sup{
    font-size: 50%;
    color: #232323;
    padding: 0 0 0 4px;
}
.pricing-table ul li{
    padding: 10px 0;
    font-size: 1rem.
}
.pricing-table .service-icon {
    width: 105px;
    height: 105px;
    font-size: 2.825rem;
    margin-top: 10px;
}
.best-seller{
    background: #FFF;
    border-style: solid;
    border-width: 1px;
    border-color: rgb(255, 53, 20);
    box-shadow: 0px 0px 52px 0px rgba(28, 28, 28, 0.09);
}
        .service-icon{
      border-radius: 50%;
    margin-right: 20px;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 6px 10px 0px rgba(255, 53, 20, 0.2);
    width: 65px;
    height: 65px;
    z-index: 101;
    text-align: center;
    font-size: 24px;
    color: rgb(183, 183, 183);
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.service-inner-content{
  font-size: 14px;
  color: #6f6f6f;
  line-height: 1.571;
}
.service-inner-content h4{
  color: #06163a;
  line-height: 1.2;
  text-align: left;
  margin-bottom: 15px;
}
        .btn-center{
  margin-top: 70px;
  margin-bottom: -20px;
}
.btn-theme{
  color: #FFF !important;
  padding: 0.5rem 1.9rem;	
  font-weight: 400;
  font-size: 0.875rem;
  display: inline-block;
  display: inline-flex;
  outline: none;
  border: none;
  cursor: pointer;
  overflow: hidden;
  z-index: 2;
  align-items: center;
    position: relative;
    cursor: pointer;

  -webkit-box-shadow: 0px 14px 47px 0px rgba(28, 28, 28, 0.24);
  -moz-box-shadow: 0px 14px 47px 0px rgba(28, 28, 28, 0.24);
  box-shadow: 0px 14px 47px 0px rgba(28, 28, 28, 0.24);

  -webkit-border-radius: 70px;
  -moz-border-radius: 70px;
  border-radius: 70px;
}
 
    </style>