/* ==============================================
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 1
* Table Style 2
* Table Style 3
* Table Style 4
* Table Style 5
* Table Style 6
=========================================*/
/* 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;*/
 margin-top: 12px; }

.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__header h1,h1,h3,h4,h5{
  color:#fff !important;
}
.table__header--title {
  color:#fff !important;
}
/*=======================
  Table Style 1
=========================*/
.table1 {
  position: relative;
  color: #fff;
  margin-top: 80px;
  z-index: 1; }
  .table1 .table__header--title {
    position: relative;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 36px; }
    .table1 .table__header--title::after {
      content: ' ';
      position: absolute;
      bottom: -6px;
      left: 0;
      right: 0;
      width: 16px;
      height: 3px;
      background-color: #fff;
      border-radius: 10px;
      margin: auto; }
  .table1 .table__header--price {
    font-size: 46px;
    font-weight: 700; }
    .table1 .table__header--price span {
      position: relative;
      top: -20px;
      right: -10px;
      font-size: 0.45em; }
    .table1 .table__header--price::after {
      content: attr(data-price);
      position: absolute;
      top: -30px;
      left: 30px;
      width: 100%;
      color: inherit;
      font-size: 90px;
      opacity: 0.1; }
  .table1 .button {
    background-color: #fff;
    color: #333;
    border-radius: 44px; }
    .table1 .button:hover {
      -webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.12);
      box-shadow: 0 0 50px rgba(0, 0, 0, 0.12); }
  .table1.recommended {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
    z-index: 2; }

/*=======================
  Table Style 2
=========================*/
.table2 {
  position: relative;
  margin-top: 80px;
  z-index: 1; }
  .table2 .table__header--title {
    font-size: 1.1rem; }
  .table2 .table__header--icon {
    height: 140px;
    padding: 30px 0; }
  .table2 .table__header--price {
    font-size: 1.8rem;
    font-weight: 700; }
    .table2 .table__header--price span {
      position: relative;
      right: -6px;
      font-size: 0.9em; }
  .table2 .table__content--list {
    color: #bdbdbd; }
  .table2 .button {
    border-radius: 8px; }
  .table2.blue .table__header--price {
    color: #3486ff; }
  .table2.blue .button {
    background-color: #3486ff;
    color: #fff; }
    .table2.blue .button:hover {
      -webkit-box-shadow: 0 0 50px rgba(52, 134, 255, 0.35);
      box-shadow: 0 0 50px rgba(52, 134, 255, 0.35); }
  .table2.cyan .table__header--price {
    color: #2de8d0; }
  .table2.cyan .button {
    background-color: #2de8d0;
    color: #fff; }
    .table2.cyan .button:hover {
      -webkit-box-shadow: 0 0 50px rgba(45, 232, 208, 0.35);
      box-shadow: 0 0 50px rgba(45, 232, 208, 0.35); }
  .table2.yellow .table__header--price {
    color: #fee366; }
  .table2.yellow .button {
    background-color: #fee366;
    color: #fff; }
    .table2.yellow .button:hover {
      -webkit-box-shadow: 0 0 50px rgba(254, 227, 102, 0.35);
      box-shadow: 0 0 50px rgba(254, 227, 102, 0.35); }
  .table2.recommended {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
    z-index: 2; }

/*=======================
  Table Style 3
=========================*/
.table3 {
  -webkit-box-shadow: 0 0 40px rgba(0, 0, 0, 0.12);
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.12); }
  .table3 .table__header--icon {
    height: 80px;
    padding: 20px 0; }
  .table3 .table__header--title {
    font-size: 1.25rem;
    font-weight: 700; }
  .table3 .table__content--list {
    padding: 20px 0;
    border-top: 1px solid #f6f6f6;
    border-bottom: 1px solid #f6f6f6; }
  .table3 .table__header--price {
    font-size: 1.6rem;
    font-weight: 700;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #4568dc), to(#b06ab3));
    background: -webkit-linear-gradient(left, #4568dc 0, #b06ab3 100%);
    background: -o-linear-gradient(left, #4568dc 0, #b06ab3 100%);
    background: linear-gradient(to right, #4568dc 0, #b06ab3 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; }
  .table3 .button {
    position: absolute;
    bottom: 40px;
    right: 0;
    left: 0;
    width: 60px;
    height: 60px;
    line-height: 60px;
    background: #4568dc;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #4568dc), to(#b06ab3));
    background: -webkit-linear-gradient(left, #4568dc 0, #b06ab3 100%);
    background: -o-linear-gradient(left, #4568dc 0, #b06ab3 100%);
    background: linear-gradient(to right, #4568dc 0, #b06ab3 100%);
    color: #fff;
    font-size: 22px;
    padding: 0;
    border-radius: 100%;
    margin: auto;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0); }
  .table3:hover .table__header--price {
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0); }
  .table3:hover .button {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1); }

/*=======================
  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: 16px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 28px 0;
    margin-bottom: 34px; }
  .table4 .table__header--icon {
    position: absolute;
    top: 15px;
    right: -10px;
    max-width: 50px; }
  .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: 27px;
    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.violet .table__header--title {
    background-color: #B489D7; }
  .table4.violet .button {
    font-weight: 600;
    color:  #B489D7;
    border: 1px solid  #B489D7;
    border-radius: 44px;
    -webkit-box-shadow: 0 0 0px 4px rgba(254, 223, 133, 0.4);
    box-shadow: 0 0 0px 4px rgba(206, 171, 228, 0.64);
    margin-bottom: 34px; }
    .table4.violet .button:hover {
      -webkit-box-shadow: 0 0 0px 6px rgba(254, 223, 133, 0.4);
      box-shadow: 0 0 0px 6px rgba(193, 119, 239, 0.64); }
  .table4:hover {
   
  -webkit-animation: zoomin 0.5s 1;
  }

 
@media only screen and (min-width : 1200px) {
     .table4 .table__header--title {
        font-size:28px;
    }
}


@media only screen and (min-width : 992px) and (max-width : 1200px)  {
    .table4 .table__header--title {
        font-size:14px;
    }
}
@-webkit-keyframes zoomin {
    0% {
        -webkit-transform: scale(1);
    }
    100% {
        -webkit-transform: scale(1.1);
    }

}
/*=======================
  Table Style 5
=========================*/
.table5 {
  padding: 0;
  -webkit-box-shadow: 0 0 40px rgba(0, 0, 0, 0.12);
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.12);
  overflow: hidden; }
  .table5 .table__header {
    position: relative;
    color: #fff;
    padding: 20px 0;
    margin-bottom: 46px; }
  .table5 .table__header--title {
    font-size: 28px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 60px; }
  .table5 .table__header--price {
    /* position: absolute; */
    /* top: 80px; */
    /* left: 0; */
    right: 0;
    /* width: 100px; */
    height: 100px;
    /* line-height: 100px; */
    font-size: 26px;
    font-weight: 700;
    border-radius: 100%;
    margin: auto;
    }
    .table5 .table__header--price span {
      position: relative;
      right: -6px;
      font-size: 0.9em; }
  .table5 .table__content--list {
    color: #6b7c93; }
  .table5 .button {
    background-color: #00aeef;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 4px;
    margin-bottom: 26px; }

/*=======================
  Table Style 6
=========================*/
.table6 {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); }
  .table6 .table__header--icon {
    height: 80px; }
  .table6 .table__header--title {
    font-size: 28px;
    text-transform: uppercase;
    margin: 10px 0 20px; }
  .table6 .table__header--price {
    font-size: 34px;
    font-weight: 700; }
    .table6 .table__header--price span {
      position: relative;
      right: -6px;
      font-size: 0.7em;
      font-weight: 400; }
  .table6 .table__content--list {
    color: #8295ad;
    padding: 20px 0;
    border-top: 1px solid #e8f3ff;
    border-bottom: 1px solid #e8f3ff; }
  .table6 .button {
    background-color: #7460ee;
    color: #fff;
    font-size: 0.9rem;
    text-transform: uppercase;
    border-radius: 44px; }
    .table6 .button:hover {
      background-color: #ff7381; }
  .table6.red .table__header--title {
    color: #ff7381; }
  .table6.orange .table__header--title {
    color: #fcb755; }
  .table6.green .table__header--title {
    color: #2cca70; }

@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(0.5);
    -ms-transform: scale(0.5);
    transform: scale(0.5); }
  .table3 .button {
    position: static;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    margin-top: 20px; } }


    .table__content--list li{
            text-align:center;
            margin-bottom:3px;
            font-size:16px;
        }
      .table4 .table__header--badge {
    height: 37px;
    bottom: 60px;
    display: inline-block;
    position: absolute;
    top: 76px;
    left: 0;
    right: 0;
    background-color: #f98aa5;
    color: #fff;
    font-size: 1.3rem;
    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;
    padding: 6px;
      }
.table__content p{
    text-align: center !important;
    margin-bottom: 3px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    padding: 6px 0 !important;
}
.badge_red{
    background-color: #f98aa5 !important;
}
.badge_violet{
    background-color:#DCB1FF !important;
}
.badge_blue{
    background-color:#a0d8f2 !important;
}
.badge_green{
    background-color:#93edc1 !important;
}
.table__content--list{
    margin-top:5px !important;
}
.table4{
  height:630px;
}