/* CSS Document */

#store {
}

.ptitle {
text-align: center;
font-size: 30px;
margin-bottom: 10px;
margin-top:0px;
width: 100%;
padding: 10px;
color: #225790;
font-weight: bold;
background: url('/siteimages/p6.webp');
border: 1px solid lightgrey;
}

.pprice {
text-align: center;
font-size: 28px;
margin: 5px auto;
width: 100%;
color: #444;
font-weight:bold;
line-height: 1em;
}

#store #leftcol{
float: left;
margin-right: 20px;
margin-bottom: 1px;
}

#store .tvbutton{
	font-size:22px;
}

#store #rightcol{
}

#store #detailcol{
width:70%;
float:left;
margin-top:0px;
}

#store #buttoncol{
width: 28%;
float: right;
text-align: center;
}

.producticon {
max-width: 25%;
max-height: 220px;
margin-right:12px;
margin-top:7px;
float:left;
}

.productsummary {
font-size: 22px;
}
.productsummary p,
.productincludes p{
	margin: 0px;
    padding: 10px 7px;
}

.productincludes {
font-size: 22px;
text-align: left;
}

.membersonly {
font-size: 20px;
text-align: center;
padding: 10px;
margin-bottom: 15px;
background: url(/siteimages/floor-tile.png);
}

.comingsoon {
font-size: 18px;
text-align: center;
padding: 0px 10px;
}

.addons {
font-size: 18px;
text-align: center;
padding: 0px 8px;
border: 1px solid black; 
background: #fdfcb2; 
text-align: left; 
margin-bottom: 15px
}

.coupons {
margin-top: 15px;
font-size: 18px;
text-align: left;
padding: 0px 8px;
}
.coupons input{
	float:left;
	margin-right: 5px;
    margin-top: 3px;
}
.coupons label{
	float:left;
}
.coupons .couponblock{
	margin-bottom:10px;
	float:left;
}

#store .submit{
	text-align: center;
	margin: 10px auto;
}


#store .message{	
	text-align: left;
	font-size: 18px;
	margin: 20px;
}

#store .message p{	
	text-align: left;
	font-size: 16px;
	margin: 20px;
}

#store label {
    display: block;
    padding-left: 20px;
    text-indent: -20px;
    font-size: 18px;
}

#store input[type='checkbox'] {
    width: 13px;
    height: 13px;
    padding: 0;
    margin:0;
    vertical-align: bottom;
    position: relative;
    top: -4px;
    margin-right: 3px;
}

#thescript{
font-size: 18px;
color: #225790;
padding: 3px;
width: 98%;
margin-bottom: 7px;
font-family:inherit;
}

p.productheader{
	font-size:30px;
	color: #544b48;
	font-weight:bold;
	text-align:center;
	padding:8px;
	border:1px solid grey;
	background: url(/siteimages/floor-tile.png);
	margin: 0px 0px 9px 0px;
	float:left;
	width:100%;
}
p.productp,
ul.productp{
	font-size:22px;
	margin: 0px;
	float:left;
	width:100%;
	color:#13505b;
}
.bluep{
	font-size:22px;
	color:#13505b;
}
.benefitstable tr{
	vertical-align:top;
}
.scriptuploader{
	padding:5px;
	width:100%;
}
.scriptuploader p.bigcenter{
	font-size:20px;
	margin:0px;
	margin-bottom:5px;
}
#store .scriptchoose{
	display:none;
	float:right;
	width: calc(100% - 20px);
	font-size:18px;
}
#store .scriptuploader label{
	text-align:left;
	width:100%;
	font-size:16px;
	margin-bottom:2px;
}
#store #purchaseproductbutton{
margin-top:10px;
width: 100%;
height: 40px;
}
.scriptuploader input[type='text'],
.scriptuploader select,
.scriptuploader textarea{
	width:100%;
	font-size:18px;
	margin-bottom:5px;
	font-family:inherit;
}

.pricing {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	color: #13505b;
  
	.plan,
	.apart {
		background-color: #fff;
		padding: 5px;
		margin: 5px;
		border-radius: 5px;
		text-align: center;
		transition: 0.3s;
		cursor: pointer;
		border: 2px solid #225790;
		width:28%;
		background: url(/siteimages/p6.webp);
		display: flex;
        flex-direction: column;
        justify-content: center;
        height: 110px;
  
	  h2 {
		font-size: 26px;
		margin-bottom: 6px;
		margin-top:0px;
	  }
  
	  ul{
		  margin: 0;
		  padding: 0;
		  box-sizing: border-box;
	  }
  
	  .price {
		font-size: 26px;
	  }
  
	  ul.features {
		list-style-type: none;
		text-align: left;
		font-size:18px;
		li {
		  margin: 8px;
		  .fas {
			margin-right: 4px;
		  }
		  
		}
	  }
  
	  button {
		border: none;
		width: 100%;
		padding: 12px 35px;
		margin-top: 1rem;
		background-color: #6ab04c;
		color: #fff;
		border-radius: 5px;
		cursor: pointer;
		font-size: 16px;
	  }
  
	  &.popular {
		border: 2px solid #6ab04c;
		position: relative;
		transform: scale(1.08);
  
		span {
		  position: absolute;
		  top: -20px;
		  left: 50%;
		  transform: translateX(-50%);
		  background-color: #6ab04c;
		  color: #fff;
		  padding: 4px 20px;
		  font-size: 18px;
		  border-radius: 5px;
		}
	  }
  
	  &:hover {
		box-shadow: 5px 7px 67px -28px rgba(0, 0, 0, 0.37);
	  }
	}
	.apart{
	  	width:21%;
	  	padding: 0px;
	  	display: flex;
        flex-direction: column;
        justify-content: center;
		height: 100px;
	}
	.plan table,
	.apart table{
	  text-align:left;
	  font-size:18px;
  
	}
	.plan table td,
	.apart table td{
	  vertical-align: top;
	  line-height:1.1em;
	}
	.fa-check-circle,
	.fa-check {
	  color: #6ab04c;
	}
	.fa-times-circle {
	  color: #eb4d4b;
	}
  }
  
@media only screen and (max-width: 900px) {
	  .pricing {
		  .plan,.apart {
			  width:40%;
		  }
	  }
}
@media only screen and (max-width: 600px) {
	  .pricing {
		  .plan,.apart {
			  width:100%;
		  }
	  }
}

@media only screen and (max-width: 768px) {
	#purchase #leftcol{
		width:100%;
	}
	#purchase #rightcol{
		width:100%;
		margin-left: 0px;
	}
	#store #buttoncol{
		width:100%;
	}
	#store #detailcol {
		margin-right:0px;
		width:100%;
	}
}