/* DIRTY Responsive pricing table CSS */

/* 
- make mobile switch sticky
*/
* {
  box-sizing:border-box;
  padding:0;
  margin:0;
  outline: 0;
}
#pricing-table table tbody {
	background-color: #F0FFF0;
}

article {
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	position: relative;
}
#pricing-table ul {
	display: flex;
	top: 0px;
	z-index: 10;
	padding-bottom: 0px;
	width: 99%;
}
#pricing-table li {
  list-style:none;
  flex:1;
}
#pricing-table li:last-child {
  border-right:1px solid #DDD;
}
#pricing-table button {
	width: 100%;
	border-left: 1px solid #FFFFFF;
	border-right: 0 solid #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
	border-top: 0 solid #FFFFFF;
	padding: 10px;
	font-size: 14px;
	font-weight: bold;
	height: 60px;
	color: #FFFFFF;
	background-color: #007855;
	transition: .6s;
}
#pricing-table button:hover {
	background-color: #009C6F;
}
#pricing-table li.active button {
	background: #9B9B9B;
	color: #FFFFFF;
}
#pricing-table table {
	border-collapse: collapse;
	table-layout: fixed;
	width: 99%;
}
#pricing-table th { background:#F5F5F5; display:none; }
td, th {
	height: 40px;
	font-size: 18px;
}
#pricing-table td,th {
	border: 1px solid #DDD;
	padding-top: 6px;
	padding-right: 15px;
	padding-left: 15px;
	padding-bottom: 6px;
	empty-cells: show;
}
#pricing-table td,th {
  text-align:left;
}
#pricing-table td+td, th+th {
  text-align:center;
  display:none;
}
#pricing-table td.default {
  display:table-cell;
}
#pricing-table .table-heading {
	background-color: #E4FFE4;
}
#pricing-table .bg-1 {
	/* [disabled]border-top: 3px solid #222222; */
}
#pricing-table .bg-2 {
	/* [disabled]border-top: 3px solid #7C7C7C; */
}
#pricing-table .bg-3 {
	/* [disabled]border-top: 3px solid #ACACAC; */
}
#pricing-table .bg-4 {
  border-top:3px solid #0097CF;
}
#pricing-table .sep {
	/* [disabled]font-weight: bold; */
	font-size: 1.3rem;
	text-align: center;
	color: #fff;
	letter-spacing: 2px;
	width: 0%;
	background-color: #9B9B9B;
}
#pricing-table .txt-l { font-size:28px; font-weight:bold; }
#pricing-table .txt-top { position:relative; top:-9px; left:-2px; }
#pricing-table .tick {
	font-size: 18px;
	color: #000000;
}
#pricing-table .hide {
  border:0;
  background:none;
}

@media (min-width: 970px) {
  #pricing-table ul {
    display:none;
  }
  #pricing-table td,th {
    display:table-cell !important;
  }
  #pricing-table td,th {
	width: 280px;
  
  }
  #pricing-table td+td, th+th {
    width: auto;
  }
}
