/* Pricing Table */
.thb-pricing-table {
	.thb-pricing-column {
		display: flex;
		flex-direction: column;
		margin-bottom: 30px;

		@include min-break($break-medium) {
			margin-bottom: 40px;
		}
		.pricing-description {
			font-size: 14px;

			p {
				font-size: inherit;
				margin-bottom: 10px;
			}
		}
	}
  .thb-price {
    small {

      color: inherit;
      font-size: 50%;
    }
  }
  &.style2,
  &.style3 {
    img:not(.retina_active) {
      visibility: hidden;
    }
  }

  &.style1 {
    .btn {
    	border-radius: 0 0 3px 3px;
    }
    .thb-pricing-column {

      .pricing-container {
      	background: #fff;
      	display: flex;
      	height: 100%;
      	flex-direction: column;
      	border-radius: 3px;
      	border: 1px solid $border;
      	text-align: center;
      	padding: 15px;

      	@include min-break($break-small) {
      		padding: 40px;
      	}
      	img {
      		display: block;
      		border-radius: 3px;
      		margin: 0 auto 40px;
      		flex-shrink: 0;
      	}
      	.thb_pricing_head {
      		border-bottom: 1px solid rgba(0,0,0,0.07);

      		h4 {
      			font-size: 20px;
      			font-weight: 400;
      			margin-bottom: 15px;
      			line-height: 1;
      		}
      		h3 {
      			font-size: 30px;
      			font-weight: 600;
      			line-height: 1;
      			margin-bottom: 25px;
      		}
      		.pricing_sub_title {
      			font-size: 13px;
      			margin-bottom: 39px;
      		}
      	}
      	&.has-button {
      		border-radius: 3px 3px 0 0;
      		border-bottom: 0;
      	}
      	.pricing-description {
      		padding-top: 40px;
      		text-align: left;
      		font-size: 14px;
      		color: $black;

      		p {
      			font-size: inherit;
      			color: inherit;
      		}
      	}
      }
      .btn {
      	width: 100%;
      }
      &.highlight-true {
      	.pricing-container {
      		border-width: 3px;
      		border-color: $border;
      	}
      }
    }
  } // .style1
	&.style2 {
    position: relative;
    text-align: center;
    .pricing-column.highlight-true .pricing-container {
      position: relative;
    }

    .pricing-style2-highlight {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      z-index: 0;
      pointer-events: none;
      background: #f6f6f6;
      opacity: 0;
      @extend .quick-transition;
    }
    .thb_pricing_head,
    .pricing-description,
    .btn,
    img {
      position: relative;
      z-index: 10;
    }
    .pricing-container {
    	padding: 15%;
    	height: 100%;
			display: flex;
			flex-direction: column;
      img {
        display: block;
        margin: 0 auto 35px;
      }
      .thb_pricing_head {
        h4 {
          font-size: 20px;
          font-weight: 600;
					margin-bottom: 20px;
        }
        .thb-price {
          display: flex;
					text-align: center;
					align-items: center;
					flex-direction: column;
          line-height: 1;
          font-size: 40px;
					font-weight: 400;
          margin-bottom: 20px;
          color: $accent;

					small {
						margin: 30px 0 0 0;
						color: $black;
						opacity: 0.4;
						font-size: 14px;
						text-transform: none;
					}
        }

        .pricing_sub_title {
          display: block;
          font-size: 14px;
          margin: 0;
					padding: 0;
        }
      }
      .pricing-description {
        font-size: 14px;
				margin: 35px 10%;
				padding-top: 35px;
				border-top: 1px solid $border;
				flex: 1;

				@include ie11() {
					flex: none;
				}
        >*:last-child {
          margin-bottom: 0;
        }
        ul {
          list-style: none;
          padding: 0;
        }
      }
			.btn {
				margin: 0 auto;
			}
    }
    &.active {
      .pricing-column.highlight-true .pricing-container {
        position: static;
      }
      .pricing-style2-highlight {
      	opacity: 1;
      }
    }
  } // .style2
  &.style3 {
    .pricing-container {
      border: 1px solid rgba(#000,0.08);
      border-radius: 4px;
      display: flex;
      flex-direction: column;
      height: 100%;
      position: relative;
      img {
        display: none;
        position: absolute;
        top: 15px;
        right: 15px;
        max-width: 25%;
        @include min-break($break-small) {
          display: block;
          top: 30px;
          right: 30px;
        }
        @include min-break($break-medium) {
          top: 45px;
          right: 45px;
        }
      }
    }
    .thb-pricing-style3-container {

    	flex: 1;
      padding: 15px;

      @include min-break($break-small) {
        padding: 30px;
      }
      @include min-break($break-medium) {
        padding: 45px;
      }
    }
    .thb_pricing_head {
      padding: 0;

      @include min-break($break-small) {
        padding: 0 30% 0 0;
      }
      .pricing_sub_title {
        font-size: 14px;
        line-height: 1.4;
        margin-bottom: 40px;
      }
    }
    .pricing-description {
      ul, ol {
        font-size: 12px;
        list-style: none;
        padding: 0;
        @extend .cf;
        li {
          margin-bottom: 5px;
          @include min-break($break-small) {
            width: 50%;
            float: left;
          }
        }
      }
    }

    .thb-pricing-footer {
      display: flex;
      background: #f6f9fb;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      padding: 15px;
      border-top: 1px solid rgba(#000,0.06);
      @include min-break($break-small) {
        padding: 30px;
        flex-direction: row;
        justify-content: space-between;

        .thb-price {
          margin-bottom: 0;
        }
      }
    }
  } // .style3
}