/*********************
MODAL (Shop - Checkout)
*********************/

.reveal.small.block--popup {
	max-width: 622px;
	outline: none;
	padding: 0;
}
	.pop-container .main {
		padding: 40px 60px;
	}
		.block--popup .pop-container footer.main {
			background: #F1F1F1;
			color: #0F5C89;
			padding: 30px 40px;
		}
			.block--popup footer.main p {
				color: #0F5C89;
				margin: 0;
				font-size: 16px;
			}
				.block--popup footer.main p a {
					color: #0F5C89;
				}
					.block--popup footer.main p a:hover {
						text-decoration: underline; 
					}
		.block--popup .facebook-form {
			border-top: 1px solid #EEEFF0;
			padding: 40px 0 0;
		}
		
		.block--popup .facebook-form label,
		.block--popup .help-text {
			text-transform: none; 
			letter-spacing: 0;
			color: #AAB2B5;
			font-size: 14px;
			margin: 0 0 10px;
		}
		.block--popup [type=button].facebook {
		max-width: 260px;
		margin: 0 auto 16px;
		}
	
.block-subscription-list {}

	.block-subscription-list .grid-item {
		width: 100%;
		max-width: 500px;
		margin: 0 auto 20px;
	}
		.block-subscription-list .grid-item input {
			width: 0;
			height: 0;
			display: none;
		}	
		.block-subscription-list .grid-item label {
			box-shadow: 0 2px 4px 0 rgba(0,0,0,.07);
			background: #FBFBFB; 
			width: 100%;
			padding: 20px;
		}
		.block-subscription-list .grid-item label:hover {
			box-shadow: 0 2px 8px 0 rgba(0,0,0,.15);
			transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: 0.2s all; -ms-transition: all 0.2s;
		}
			.grid-label {
				-webkit-flex-flow: row nowrap;
				-moz-flex-flow: row nowrap;
				-ms-flex-flow: row nowrap;
				flex-flow: row nowrap;
				
				-webkit-box-align: center;
				-ms-flex-align: center;
				-webkit-align-items: center;
				-moz-align-items: center;
				align-items: center;
				display: -webkit-box;
				display: -webkit-flex;
				display: -moz-flex;
				display: -ms-flexbox;
				display: flex;
			}
			.grid-label > div { 
				flex: 1; 
			}
			.grid-label p { 
				margin: 0;
				 
			}
				.grid-label .title {
					text-align: left;
					font-size: 16px;
					font-family:'Ridley Grotesk';
					font-weight: 600;
				}
				.grid-label .price {
					width: 100px;
					flex: none;
					text-align: center; 
					font-family:'Ridley Grotesk';
					font-weight: 600;
					font-size: 24px;
					line-height: 1;
				}
					.grid-label .price span {
						text-transform: uppercase;
						letter-spacing: 0;
						font-size: 10px;
						display: block;
						text-align: center;
						margin: 0;
						line-height: 1;
					}
				.grid-label .checkmark {
					flex: none;
					margin: 0 40px 0 0;
					width: 24px;
					height: 24px;
					border: 2px solid #0F5C89;
					border-radius: 50%;
					-webkit-border-radius: 50%;
					position: relative;
				}
					.grid-label .checkmark:after {
						content: '';
						position: absolute;
						top: 50%;
						left: 50%;
						transform: translate(-50%,-50%);
						-webkit-transform: translate(-50%,-50%);
						width: 14px;
						height: 10px;
						background: url('../icon-checkmark.html') no-repeat;
						background-size: contain;
						opacity: 0;
						transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: 0.2s all; -ms-transition: all 0.2s;
					}
				input:checked + label .grid-label .checkmark {
					background: rgb(184,233,134);
					background: -moz-linear-gradient(180deg, rgba(184,233,134,1) 0%, rgba(126,211,33,1) 100%);
					background: -webkit-linear-gradient(180deg, rgba(184,233,134,1) 0%, rgba(126,211,33,1) 100%);
					background: linear-gradient(180deg, rgba(184,233,134,1) 0%, rgba(126,211,33,1) 100%);
					border: none; 
					box-sizing: content-box; 
				}
					input:checked + label .grid-label .checkmark:after {
						opacity: 1;
					}








/*********************
GLOBAL STYLES
*********************/
h1 { font-size: 3.025em; }

.button-group { margin: 0 auto; }
.btn.green { background: #3DCB6B;}
	.btn.green:hover { background: #258E47; }
	
.btn.red { background: #d53847; color: #fff; }	
	.btn.red:hover { background: #be2533; color: #fff; }
	
.button-cancel,
.input-form [type=submit].button-cancel { 
	font-size: 13px; 
	color: #bdbdbd;
	margin: 0 30px 0 0; 
	vertical-align: middle;
	position: relative; 
	background: none;
	text-transform: none;
	letter-spacing: normal;
	line-height: 1.6;
	font-weight: 500; 
	font-family: 'Ridley Grotesk', 'helvetica', sans-serif;
	height: auto; padding: 0; 
	}	
	.button-cancel:hover,
	.input-form [type=submit].button-cancel:hover {
		background: none;
		}
	.input-form [type=submit].button-cancel:after {
		content: '';
		position: absolute; display: block; 
		width: 100%; height: 1px; background: transparent; 
		left: 0; top: 100%;
		transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: 0.2s all; -ms-transition: all 0.2s;
		}
	.input-form [type=submit].button-cancel:hover:after {
		background: #bdbdbd;
		}

.cancel-section [type=button], 
.cancel-section [type=submit] { height: auto; }

.cancel-section .form-container {
	-webkit-flex-flow: row wrap;
	-moz-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-box-align: start;
	-ms-flex-align: start;
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	align-items: flex-start;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: flex;
	max-width: 660px; 
	margin: 0 auto; 
	position: relative; 
	}
	.cancel-section .form-container .col-50 	{ width: calc(50% - 40px); margin: 0 20px; }
	.cancel-section .form-container .col-100 	{ width: calc(100% - 40px); margin: 0 20px; }
	
		@media screen and (max-width: 640px) {
				.cancel-section .form-container .col-50 { width: calc(100% - 40px); }
			}
	
	.cancel-section .input-form label,
	.cancel-section label { text-transform: none; letter-spacing: 0; font-size: 15px; }
	

	.cancel-section label { color: #0f5c89; font-size: 15px; font-family: 'Ridley Grotesk', sans-serif; }
	.cancel-section .input-form [type=color], 
	.cancel-section .input-form [type=date], 
	.cancel-section .input-form [type=datetime-local], 
	.cancel-section .input-form [type=datetime], 
	.cancel-section .input-form [type=email], 
	.cancel-section .input-form [type=month], 
	.cancel-section .input-form [type=number], 
	.cancel-section .input-form [type=password], 
	.cancel-section .input-form [type=search], 
	.cancel-section .input-form [type=tel], 
	.cancel-section .input-form [type=text], 
	.cancel-section .input-form [type=time], 
	.cancel-section .input-form [type=url], 
	.cancel-section .input-form [type=week], 
	.cancel-section .input-form textarea { height: 51px; background-color: #f2f2f2; line-height: 1.2; border: 2px solid transparent; }
	.cancel-section .input-form select { height: 51px; background-color: #f2f2f2; line-height: 1.2; border: 2px solid transparent; }
	
	[type=file].file-input {
		background: #f2f2f2; border: 2px solid transparent; padding: 12px; color: #0f5c89; outline: none;
		}
	
	div.wpcf7 input[type="file"] {
		background-color: rgba(255,255,255,1); outline: none; color: #0f5c89; font-weight: 400; font-family: 'Ridley Grotesk', sans-serif;
		}
	div.wpcf7 .cancel { display: inline-block; }	
	
	.cancel-section [type=submit].link-text { 
		background: transparent; 
		font-size: 13px; color: #bdbdbd; margin: 0 30px 0 0;
		text-transform: none; letter-spacing: 0; 
		font-family: 'Ridley Grotesk', 'helvetica', sans-serif;
		display: inline-block;
		margin: 0; 
		}
		
	.pop-container .form-error { font-family: 'Ridley Grotesk', 'helvetica', sans-serif; color: #fff; }
	
	
	.input-form [type=color].is-invalid-input:not(:focus), .input-form [type=date].is-invalid-input:not(:focus), .input-form [type=datetime-local].is-invalid-input:not(:focus), .input-form [type=datetime].is-invalid-input:not(:focus), .input-form [type=email].is-invalid-input:not(:focus), .input-form [type=month].is-invalid-input:not(:focus), .input-form [type=number].is-invalid-input:not(:focus), .input-form [type=password].is-invalid-input:not(:focus), .input-form [type=search].is-invalid-input:not(:focus), .input-form [type=tel].is-invalid-input:not(:focus), .input-form [type=text].is-invalid-input:not(:focus), .input-form [type=time].is-invalid-input:not(:focus), .input-form [type=url].is-invalid-input:not(:focus), .input-form [type=week].is-invalid-input:not(:focus), .input-form textarea.is-invalid-input:not(:focus), .input-form select.is-invalid-input:not(:focus) { border: 2px solid #f13f3f !important; }
	
	.cancel-section .form-error { font-weight: 300; color: #fff; font-size: 14px; }
	.cancel-section #shippingzip:not(:focus) { border: 2px solid transparent; }
	


/*********************
MODAL/POPUP STYLES
*********************/
.reveal.box-main {
	max-width: 1120px; 
	width: 100%; 
	outline: none; 
	padding: 0; 
	border: none;
	margin: 0 auto 60px;  
	}
	.pop-container { padding: 0; }
	.pop-container [type=button].close-button { z-index: 900; color: rgba(15, 92, 137, 0.65); }
	.pop-container .box-blue [type=button].close-button { color: rgba(255,255,255,.5); }
	.pop-container header.main {position: relative;  margin: 0 auto; text-align: center; padding: 60px 80px; max-width: 800px; }
	.pop-container header.main p { max-width: 700px; margin: 0 auto; }
	.pop-container .content-main { padding: 0 20px 20px; margin: 0 0 60px; }
	.pop-container .content-main .single-img img { max-width: 560px; margin: 0 auto; padding: 0 40px; display: block;  }
	.pop-container footer.main { position: relative; display: block; background: #fff; width: 100%; padding: 20px; }
	.pop-container footer.main .submit-btn { display: inline-block; }
		.pop-container footer.main .btn { margin: 0; }
		.pop-container footer.main .button-group .cancel { font-size: 13px; color: #bdbdbd; margin: 0 30px 0 0; position: relative; transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: 0.2s all; -ms-transition: all 0.2s; vertical-align: middle; }
		.pop-containerfooter.main .button-group .cancel:after	{
			content: '';
			position: absolute; display: block; 
			width: 100%; height: 1px; background: transparent; 
			left: 0; top: 100%;
			transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: 0.2s all; -ms-transition: all 0.2s;
			}
		.pop-container footer.main .button-group .cancel:hover:after { background: #bdbdbd; }	
	
	.pop-container ul.cancel-topics { 
		list-style-type: none; margin: 0 50px 50px; padding: 0; 
		-webkit-flex-flow: row wrap;
		-moz-flex-flow: row wrap;
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		-webkit-justify-content: flex-start;
		-moz-justify-content: flex-start;
		justify-content: flex-start;
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		-webkit-align-items: stretch;
		-moz-align-items: stretch;
		align-items: stretch;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flexbox;
		display: flex;
		}
	.pop-container ul.cancel-topics li { width: calc(50% - 60px); margin: 0 30px 30px; }
	.pop-container ul.cancel-topics li button { background: #fafafa; padding: 24px 30px; display: block; height: 100%; font-family: 'Ridley Grotesk'; font-weight: 700; color: rgba(15, 92, 137, 0.65); width: 100%; text-align: left; }
	.pop-container ul.cancel-topics li button:hover { background: #40CDF0; color: #fff; }
	.pop-container ul.cancel-topics li button:active,
	.pop-container ul.cancel-topics li button:focus { background: #FF9E19; color: #fff; }
	
	.pop-container .form-container { 
		-webkit-flex-flow: row wrap;
		-moz-flex-flow: row wrap;
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		-webkit-justify-content: flex-start;
		-moz-justify-content: flex-start;
		justify-content: flex-start;
		-webkit-box-align: start;
		-ms-flex-align: start;
		-webkit-align-items: flex-start;
		-moz-align-items: flex-start;
		align-items: flex-start;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flexbox;
		display: flex;
		max-width: 660px;
		}
		.reveal.box-main .input-form .form-container { margin: 0 auto 40px; }
		.pop-container .form-container .col-50 { width: calc(50% - 40px); margin: 0 20px; }
		.pop-container .form-container .col-100 { width: calc(100% - 40px); margin: 0 20px;  }
	.reveal.box-main .input-form { padding: 0; }	
	.reveal.box-main .input-form label { text-transform: none; letter-spacing: 0; }


/*********************
CANCEL STYLES
*********************/
.grid-container { max-width: 1200px; padding: 0 40px; position: relative; margin: 0 auto; }

.cancel-section {
	background: #EEEFF0; 
	position: relative;
	padding: 80px 0 80px;
	}
	.cancel-section h1 { font-size: 46px; line-height: 1.2; }
	.cancel-section h2 {}
	.cancel-section h3 {}
	.cancel-section h4 {}
	
	.cancel-section header.main { 
		position: relative; 
		margin: 0 auto;
		text-align: center; 
		padding: 60px 80px; 
		}
	.cancel-section header.main p { max-width: 700px; margin: 0 auto; }	
	.cancel-section .content-main { padding: 0 20px 20px; }
		.cancel-section .content-main { margin: 0 0 60px; }
		.cancel-section .content-main .single-img img {
			max-width: 560px; margin: 0 auto; padding: 0 40px; display: block;  
			}
	.cancel-section footer.main { 
		position: relative; 
		display: block; 
		background: #fff; 
		width: 100%; 
		padding: 20px; 
		}
		.cancel-section footer.main .submit-btn { display: inline-block; }
		.cancel-section footer.main .btn { margin: 0; }
		.cancel-section footer.main .button-group .cancel { 
			font-size: 13px; color: #bdbdbd; margin: 0 30px 0 0; 
			position: relative; 
			vertical-align: middle; 
			transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: 0.2s all; -ms-transition: all 0.2s;
			}
		.cancel-section footer.main .button-group .cancel:after,
		.pop-container footer.main .button-group .cancel:after	{
			content: '';
			position: absolute; display: block; 
			width: 100%; height: 1px; background: transparent; 
			left: 0; top: 100%;
			transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: 0.2s all; -ms-transition: all 0.2s;
			}
		.cancel-section footer.main .button-group .cancel:hover:after,
		.pop-container footer.main .button-group .cancel:hover:after {
			background: #bdbdbd;
			}	
	
.box-main { 
	background: #fff;
	box-shadow: 0px 4px 20px 0 rgba(0,0,0,.1);
	position: relative;
	margin: 0 auto;
	display: block; 
	padding: 0; 
	}	
	.box-main.box-blue { background-color: #40CDF0; color: #fff; }
	.box-main.box-blue h1 { color: #fff; }
	.box-main.box-blue h2 { color: #fff; }
	.box-main.box-blue h3 { color: #fff; }
	.box-main.box-blue h4 { color: #fff; }
	.box-main.box-blue h5 { color: #fff; }
	.box-main.box-blue h6 { color: #fff; }
	.box-main.box-blue p { color: #fff; }
	.box-main.box-blue a { color: rgba(15, 92, 137, 0.44); }
		.box-main.box-blue a:hover { color: rgba(15, 92, 137, 0.6); }
		.box-main.box-blue a.btn { color: #fff; }
		.box-main.box-blue a.btn:hover { color: #fff; }

.cancel-section ul.cancel-topics { 
	list-style-type: none; margin: 0 50px 50px; padding: 0; 
	-webkit-flex-flow: row wrap;
	-moz-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	-webkit-align-items: stretch;
	-moz-align-items: stretch;
	align-items: stretch;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: flex;
	}
.cancel-section ul.cancel-topics li { width: calc(50% - 60px); margin: 0 30px 30px; }
.cancel-section ul.cancel-topics li a { background: #fafafa; padding: 24px 30px; display: block; height: 100%; font-family: 'Ridley Grotesk'; font-weight: 700;}
.cancel-section ul.cancel-topics li a:hover { background: #40CDF0; color: #fff; }
.cancel-section ul.cancel-topics li a:active,
.cancel-section ul.cancel-topics li a:focus { background: #FF9E19; color: #fff; }


.flex-50-50 {
	position: relative; 
	-webkit-flex-flow: row nowrap;
	-moz-flex-flow: row nowrap;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: flex;
	margin: 0 60px; 
	}
	.flex-50-50 .item-50 { width: calc(100% / 2 - 60px); margin: 0 30px; }
	.flex-50-50 .item-70 { width: calc(70% - 60px); margin: 0 30px; }
	.flex-50-50 .item-30 { width: calc(30% - 60px); margin: 0 30px; }
	
	
	
.cancel-section .content-main .description,
.pop-container .content-main .description { text-align: left; }
.cancel-section .content-main .description h2,
.pop-container .content-main .description h2 { font-size: 34px; line-height: 1.2; font-family: 'Ridley Grotesk'; margin: 0 0 20px; font-weight: 700;}	
.cancel-section .content-main .description h3,
.pop-container .content-main .description h3 { font-size: 24px; line-height: 1.2; font-family: 'Ridley Grotesk'; color: #FCEE4C; font-weight: 700;}

@media screen and (max-width: 1024px) {
		.flex-50-50 {
			-webkit-flex-flow: column nowrap;
			-moz-flex-flow: column nowrap;
			-ms-flex-flow: column nowrap;
			flex-flow: column nowrap;
			}
		.flex-50-50 .item-50 { width: 100%; margin: 0 30px 40px; }
		.flex-50-50 .item-70 { width: 100%; margin: 0 30px 40px; }
		.flex-50-50 .item-30 { width: 100%; margin: 0 30px 40px; }
		.cancel-section .content-main .description { text-align: center; }
		.cancel-section .content-main .description ul { list-style-type: none; margin: 0; padding: 0; }
	}

/*********************
PROMO STYLES
*********************/
.promo-popup {}
.promo-popup .pop-container header.main { padding-bottom: 30px; }
.promo-popup .pop-container .content-main .single-img img { margin-bottom: 30px; width: 100%; }
.promo-popup .pop-container .content-main .caption { /* font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em;  */ }


@media screen and (max-width: 750px) { 
		
		/* TYPOGRAPHY */
		.pop-container header.main h1 { font-size: 38px; }
		
		
		/* CANCEL HOME */
		.pop-container ul.cancel-topics { 
			-webkit-flex-flow: column nowrap;
			-moz-flex-flow: column nowrap;
			-ms-flex-flow: column nowrap;
			flex-flow: column nowrap;
			margin: 0 auto 50px; 
			}	
			.pop-container ul.cancel-topics li { width: calc(100% - 20px); margin: 0 10px 30px; }
			.pop-container .content-main .single-img img { width: 100%; }
			.flex-50-50 .item-70 { margin: 0 0 40px; }
		
		
		/* PROMO - DRINK */
		.pop-container header.main { padding: 40px 40px 30px; }	
		.pop-container .content-main .single-img img { padding: 0; }
		.promo-popup .pop-container .content-main .single-img img { max-width: 280px; }
		.pop-container .content-main { margin: 0 0 10px; }
		.box-main.box-blue h1 { font-size: 38px; }
		.pop-container .button-group a,
		.pop-container footer.main .button-group .cancel { margin: 0 auto 20px; display: block; }
		.pop-container footer.main .button-group .btn { max-width: 300px; margin: 0 auto; }
		.cancel-section footer.main .button-group .cancel:hover:after, .pop-container footer.main .button-group .cancel:hover:after { display: none; }
		.reveal.box-main { margin-bottom: 0; }
	}