/* ==============================================
Author Name: DohTheme
Author URI: http://www.dohtheme.com
Project Name: Pick,
Description: Pick – is a responsive unique Pricing Tables build with Bootstrap framework. It’s has been 6 Unique Style.It looks great with all types of devices.
================================================= */
/*=======================================
[Table of contents]
* General Classes
* Table Default CSS
* Table Style 4
=========================================*/
/* General Classes */
.grad1 {
  background: #e878d4;
  background: -webkit-linear-gradient(220deg, #e878d4, #b3ceeb);
  background: -o-linear-gradient(220deg, #e878d4, #b3ceeb);
  background: linear-gradient(230deg, #e878d4, #b3ceeb); }

.grad2 {
  background: #ffafbd;
  background: -webkit-linear-gradient(220deg, #ffafbd, #ffc3a0);
  background: -o-linear-gradient(220deg, #ffafbd, #ffc3a0);
  background: linear-gradient(230deg, #ffafbd, #ffc3a0); }

.grad3 {
  background: #ffafbd;
  background: -webkit-linear-gradient(220deg, #51a8c2, #a3dac4);
  background: -o-linear-gradient(220deg, #51a8c2, #a3dac4);
  background: linear-gradient(230deg, #51a8c2, #a3dac4); }

.button {
  display: inline-block;
  width: 100%;
  max-width: 180px;
  padding: 8px 18px;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

/* Table Default Style */
.table-default {
  background-color: #fff;
  text-align: center;
  padding: 24px 14px;
  border-radius: 8px;
  overflow: hidden;
  margin-top: 40px; }

.table {
  /* Table Header */ }
  .table__header--icon {
    max-width: 100%; }
  .table__header--price {
    position: relative; }
  .table__content {
    padding: 20px 0;
    /* Table List */ }
    .table__content--list li {
      /*font-size: 0.95rem;*/
      font-weight: 600;
      padding: 6px 0; }
      .table__content--list li.muted {
        opacity: 0.35; }
  .table__footer {
    margin-top: 20px; }

/*=======================
  Table Style 4
=========================*/
.table4 {
  padding: 0;
  border: 1px solid #e3ebee;
  border-radius: 6px;
  overflow: hidden;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }
  .table4 .table__header {
    position: relative; }
  .table4 .table__header--title {
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 28px 0;
    margin-bottom: 34px; }
  .table4 .table__header--icon {
    position: absolute;
    top: 15px;
    left: -26px;
    max-width: 64px;}
  .table4 .table__header--badge {
    display: inline-block;
    position: absolute;
    top: 76px;
    left: 0;
    right: 0;
    background-color: #f98aa5;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    max-width: 120px;
    border-radius: 44px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
    margin: auto; }
  .table4 .table__header--price {
    color: #878597;
    font-size: 24px;
    font-weight: 700; }
    .table4 .table__header--price span {
      position: relative;
      right: -6px;
      font-size: 0.9em; }
  .table4 .table__content {
    color: #a8bbc1; }
  .table4.green .table__header--title {
    background-color: #93edc1; }
  .table4.green .button {
    font-weight: 600;
    color: #70be9b;
    border: 1px solid #93edc1;
    border-radius: 44px;
    -webkit-box-shadow: 0 0 0px 4px rgba(147, 237, 193, 0.4);
    box-shadow: 0 0 0px 4px rgba(147, 237, 193, 0.4);
    margin-bottom: 34px; }
    .table4.green .button:hover {
      -webkit-box-shadow: 0 0 0px 6px rgba(147, 237, 193, 0.4);
      box-shadow: 0 0 0px 6px rgba(147, 237, 193, 0.4); }
  .table4.blue .table__header--title {
    background-color: #a0d8f2; }
  .table4.blue .button {
    font-weight: 600;
    color: #67c3ef;
    border: 1px solid #a0d8f2;
    border-radius: 44px;
    -webkit-box-shadow: 0 0 0px 4px rgba(160, 216, 242, 0.4);
    box-shadow: 0 0 0px 4px rgba(160, 216, 242, 0.4);
    margin-bottom: 34px; }
    .table4.blue .button:hover {
      -webkit-box-shadow: 0 0 0px 6px rgba(160, 216, 242, 0.4);
      box-shadow: 0 0 0px 6px rgba(160, 216, 242, 0.4); }
  .table4.red {
    border-color: #f98aa5; }
    .table4.red .table__header--title {
      background-color: #f98aa5; }
    .table4.red .button {
      font-weight: 600;
      color: #fe87a4;
      border: 1px solid #f98aa5;
      border-radius: 44px;
      -webkit-box-shadow: 0 0 0px 4px rgba(249, 138, 165, 0.4);
      box-shadow: 0 0 0px 4px rgba(249, 138, 165, 0.4);
      margin-bottom: 34px; }
      .table4.red .button:hover {
        -webkit-box-shadow: 0 0 0px 6px rgba(249, 138, 165, 0.4);
        box-shadow: 0 0 0px 6px rgba(249, 138, 165, 0.4); }
  .table4.yellow .table__header--title {
    background-color: #fedf85; }
  .table4.yellow .button {
    font-weight: 600;
    color: #fdcc4c;
    border: 1px solid #fedf85;
    border-radius: 44px;
    -webkit-box-shadow: 0 0 0px 4px rgba(254, 223, 133, 0.4);
    box-shadow: 0 0 0px 4px rgba(254, 223, 133, 0.4);
    margin-bottom: 34px; }
    .table4.yellow .button:hover {
      -webkit-box-shadow: 0 0 0px 6px rgba(254, 223, 133, 0.4);
      box-shadow: 0 0 0px 6px rgba(254, 223, 133, 0.4); }
  .table4:hover {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.12); }

@media only screen and (min-width: 992px) {
  .p-md-0 {
    padding: 0; } }

@media only screen and (max-width: 990px) {
  .table1.recommended,
  .table2.recommended {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1); }
  .table3:hover .table__header--price {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1); }
  .table3 .button {
    position: static;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    margin-top: 20px; } }
