
/* ---------------------------------- */
/* Monetization Table
------------------------------------- */
.monetization-table {
        border: 2px solid #e6e6e6;
    border-radius: 0 0 8px 8px;
    border-top: none;
    border: none; box-shadow: 0 3px 15px rgba(0,0,0,0.09);
}


.monetization-table table {
	width: 100%;
	background: #fff;
	border-radius: 8px;
	box-shadow:  none;
	margin: 0;  border: none;
}

.monetization-table td,
.monetization-table th {  border: none;
  text-align: center;
/*   border-bottom: solid 1px #eee; */
  font-size: 14px;
  padding: 10px 5px;
  word-wrap: break-word;
  font-weight: 600;
  color: #333;
}

.monetization-table td {
  color: #ccc;
  border: none;
}

.monetization-table tr th:first-child {
  width:  30%;
  background:  #fff;
}

.monetization-table tr th {
  width:  20%;
  background:  #fff;
  padding: 20px 0px;
}

.monetization-table tr:nth-child(2n+1) {
	background:  #fafafa;
}

.monetization-table .price {
  font-size: 20px;
  line-height: 20px;
  display: inline-block;
  margin:  7px 0 -5px 0;
}

.monetization-table span.free-pack,
.monetization-table span.standard-pack,
.monetization-table span.premium-pack {
	background: #f2f2f2;
    color: #777;
    border-radius: 4px;
    padding: 3px 8px;
    font-weight: 500;
}

.monetization-table span.standard-pack,
.monetization-table span.premium-pack {
    background: #e7f2fa;
    color: #4a7e99;
}

.monetization-table span.premium-pack {
	background: #fcf3cd;
    color: #857843;
}

.monetization-table .check img {
  width:  24px;
}
.monetization-table .delete img {
  width:  21px;
}


.monetization-table-notice {
    font-size: 15px;
    font-weight: 500;
    border-radius: 8px 8px 0 0;
    padding: 16px 10px;
    margin-bottom: 10px;
    display: inline-block;
    line-height: 19px;
    display: inline-block;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    background: linear-gradient(180deg, #1B71FF 0%, #0060FF 100%);
    color: #fff;
/*     background-color: #fffae0;
    color: #97860f; */
}

.monetization-table-notice i {
    text-decoration: none;
    border-bottom: 2px solid #ffffffb5;
    line-height: 14px;
    display: inline-block;
    font-style: normal;
}

.monetization-table th:first-child,
.monetization-table td:first-child {
  font-weight: 600;
  color: #222;
  font-size:  14px;
  text-align: right;
}

@media screen and (max-width: 768px) {
  .monetization-table tr {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
  }
  .monetization-table td,
  .monetization-table th {
    display: block;
    width: 33.333333333333%;
  }
  .monetization-table th:first-child,
  .monetization-table td:first-child {
    width: 100%;
    text-align: center;
  }
 .monetization-table  th:first-child {
    display: none;
  }
	.monetization-table tr th { width:  33.3%; }

}

.monetization-table .p {
  text-align: center;
  font-size: 13px;
  padding-top: 130px;
}

.monetization-table #number {
  font-size: 16px;
  color: #333;
}

.monetization-table .overage {
  color: #777;
  font-weight: 400;
}

.monetization-table *:focus {
    outline: none;
}