/*********************
GENERAL STYLES
*********************/
.b2b-hero .btn { padding: 16px 26px; display: inline-block; margin: 0 0 0; }

/* .page-template-page-b2b #main { padding: 0; } */
/*
.page-template-page-b2b .headroom--top .top-bar, .top-bar ul { background: transparent; }
.page-template-page-b2b .headroom--top .menu>li>a { color: #fff; }
.page-template-page-b2b .headroom--top .menu>li>a:hover { color: #ff8919; }
.page-template-page-b2b .headroom--top .menu>li.menu-item-17>a:hover { color: #fff; }

.page-template-page-b2b .headroom--top { }
.page-template-page-b2b .headroom--unpinned .top-bar { background: transparent; }
.page-template-page-b2b .headroom--top #icon-logo { background: url('../images/logo-snackcrate-white-2.svg') no-repeat center; }
*/

.page-template-page-office-claim .header-alt .top-bar { display: none; }

.page-template-page-b2b .menu>li.menu-item-17 { display: none !important; }
.page-template-page-b2b #menu-primary-1.menu>li { height: 41px; }

#b2b-form { 
	position: absolute; 
	background: #0f5c89;
	left: 0; right: 0; top: 0; bottom: 0; 
	padding: 60px;
	width: 100%; height: 100%; 
	display: block; 
	z-index: 999999999999999998;
	opacity: 0; 
	transform: translate(0, -110%);
	-webkit-transform: translate(0, -110%);
	transition: all 0.8s; -webkit-transition: all 0.8s; -moz-transition: 0.8s all; -ms-transition: all 0.8s;
	color: #fff;
	}
#b2b-form.active { 
	opacity: 1; 
	transform: translate(0, 0%);
	-webkit-transform: translate(0, 0%);
	}
	#b2b-form .close-form-btn { position: absolute; top: 40px; right: 40px; background: rgba(255,255,255,.2); color: #0f5c89; width: 40px; height: 40px; text-align: center; border-radius: 50%; -webkit-border-radius: 50%; padding: 8px; font-weight: 700; }
	#b2b-form .close-form-btn:hover { background: rgba(255,255,255,.5); }
	
.b2b-hero {
	position: relative;
	height: calc(100vh - 90px); min-height: 600px; max-height: 980px;
	display: block;
	background: #FFFFFF;
	overflow: hidden; 
	}	
	.b2b-hero h1 { font-size: 2.625em; color: #fff; }
	.b2b-hero p { font-size: 1.25em; color: #fff; }
	#bgvid { width: 600px; position: absolute; right: 50%; left: 50%; top: 50%; bottom: 0; z-index: 90; min-height: 100%; min-width: 100%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); }
	.b2b-hero #bgvid { width: 100vw; }
	
	
	.b2b-hero .video-headline { position: relative; z-index: 950; max-width: 500px; display: block; margin: 300px 0px 0px 0px; padding: 0 5% 0 0; text-align: left; }
	.b2b-hero .video-headline h1 { margin: 0 0 50px; }
	.b2b-hero .overlay-bg { background: linear-gradient(90deg, rgba(0,0,0,0.27) 0%, rgba(0,0,0,.05) 54%); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 91; }
	
	.overlay-bg.vertical { background: linear-gradient(90deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,.05) 26%); position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100vw; z-index: 91; transform: rotate(90deg); -webkit-transform: rotate(90deg); }
	
	
.page-template-page-b2b .whats-inside { 
	background: #00A6CF; 
	position: relative;
	padding: 0 0;
	overflow: hidden; 
	}
	.page-template-page-b2b .whats-inside img.main { width: 100%; }
	.page-template-page-b2b .whats-inside header { position: absolute; z-index: 100; top: 86px; left: 50%; right: auto; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); }	

.page-template-page-b2b .office-feature { padding: 84px 0; position: relative; }
.page-template-page-b2b .office-feature header.title h2,
.page-template-page-b2b .office-feature header.title p { color: #0F5C89; }
.page-template-page-b2b .office-feature h3 { font-size: 1.375em; text-transform: none; letter-spacing: normal; font-family: 'Ridley Grotesk', 'helvetica', sans-serif; font-weight: 700; }
.page-template-page-b2b .office-feature .content-group { position: relative; margin: 0 0 34px; }
.office-feature .flex-grid { 
	-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: 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;
	}
	.office-feature .flex-grid .media-container { width: calc(66.6667% - 100px); margin: 0 100px 0 0; position: relative; }
	.office-feature .flex-grid .content-container { width: 33.3333%; position: relative; }
	
.page-template-page-b2b .how-it-works { background: #FCEE4C; position: relative; display: block; padding: 84px 0; }	
	.page-template-page-b2b .how-it-works header.title,
	.page-template-page-b2b .how-it-works header.title h2,
	.page-template-page-b2b .how-it-works header.title p { color: #0F5C89; }
	.page-template-page-b2b .how-it-works .flex-grid { 
		-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: 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;
		}
		.page-template-page-b2b .how-it-works .flex-grid .item {
			width: 33.333%;
			position: relative;
			}
			.page-template-page-b2b .how-it-works .icon-container { 
				border-radius: 50%; -webkit-border-radius: 50%; 
				background: #fff; 
				width: 296px; height: 296px; 
				text-align: center; margin: 0 auto 40px; overflow: hidden; 
				}
			.page-template-page-b2b .how-it-works .item article { text-align: center; padding: 0 5%; margin: 0 auto; display: block; max-width: 375px; }
			.page-template-page-b2b .how-it-works .item article h3 { font-size: 1.375em; text-transform: none; letter-spacing: normal; font-family: 'Ridley Grotesk', 'helvetica', sans-serif; font-weight: 700;}
			
.page-template-page-b2b .customer-quotes { position: relative; padding: 84px 0; }
	.page-template-page-b2b .customer-quotes h2 { color: #00A6CF; font-size: 2em; text-transform: none; letter-spacing: 0; line-height: 1.28; }			
	.page-template-page-b2b .customer-quotes p.quote-author { color: #00A6cf; margin: 0; }
	.page-template-page-b2b .customer-quotes .quote-item { max-width: 940px; padding: 0 5%; display: block; margin: 0 auto; text-align: center; }
	
.page-template-page-b2b header.title { text-align: center; max-width: 660px; margin: 0 auto 60px; }
	.page-template-page-b2b header.title h2 { color: #fff; font-size: 2em; text-transform: none; letter-spacing: 0; }
	.page-template-page-b2b header.title p { color: #fff; }
	
	
.related-customers { position: relative; padding: 80px 0 0; }
.related-customers .title { text-align: center; max-width: 600px; margin: 0 auto; display: block; position: relative; }
.related-customers .title h2 { font-size: 2em; text-transform: none; letter-spacing: normal; }
.related-customers .list-logos ul { list-style-type: none; 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: 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: 70px 0 0;
	}
	.related-customers .list-logos ul li { width: calc(25% - 160px); margin: 0 80px 50px; display: block; text-align: center; }
	.related-customers .cap-height { max-height: 84px; }

.footer-cta { position: relative; padding: 0 0 400px; }
.footer-cta { background: url('../footer-snacks-2.html') no-repeat center bottom; background-size: 1200px auto; }
.footer-cta h2 { text-align: center; font-size: 2em; text-transform: none; letter-spacing: normal; margin: 60px 0 20px; }
.footer-cta .btn { text-align: center; margin: 0 auto; padding: 16px 26px; display: inline-block; margin: 0 0 0; }
.footer-cta p { text-align: center; }


/*********************
CLAIM
*********************/
.page-id-5845 .med-breadcrumbs { display: none; }
.page-id-5845 #main { padding: 0; }

/* .page-template-page-b2b-claim .header-alt { display: none; } */
.page-template-page-b2b-claim .header-alt .top-bar,
.page-template-page-office-claim .header-alt .top-bar { position: fixed; background: transparent; z-index: 99999; display: none; }

.hero-banner-bg { position: relative; top: 0; left: 0; right: 0; margin: 0 auto 0; }

.claim-main { background: #f3f3f3; position: relative; padding: 0 0 80px; }
.claim-main h1 { font-size: 2.625em; }
.claim-main .form-container { position: relative; padding: 0; max-width: 960px; margin: 15px auto 50px; background: #fff; box-shadow: 0 0 20px 0 rgba(0,0,0,.02); }
.form-container .form-inner { padding: 40px; }
.claim-main .form-container header { text-align: center; padding: 0 11%; }

.claim-main form { 
	-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: 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: 60px 0; 
	}
	.claim-main form .size-50 { width: calc(50% - 60px); margin: 0 30px; }
	.claim-main form .size-100 { width: calc(100% - 60px); margin: 0 30px; }
.claim-main label { font-size: 1em; color: #0f5c89; }
.claim-main [type=color], .claim-main [type=date], .claim-main [type=datetime-local], .claim-main [type=datetime], .claim-main [type=email], .claim-main [type=month], [type=number], .claim-main [type=password], .claim-main [type=search], .claim-main [type=tel], .claim-main [type=text], .claim-main [type=time], .claim-main [type=url], .claim-main [type=week], .claim-main  textarea { background: #f9f9f9; color: #0f5c89; }
.claim-main select { height: auto; background-color: #f9f9f9; border: none; outline: none; padding: 1rem 1.5rem 1rem 1rem; height: 51px; color: #0f5c89; }
	.claim-main select:focus,
	.claim-main select:hover { box-shadow: none; }

.claim-main .order-submit { min-width: 240px; display: block; width: 100%; margin: 0 30px; }
.claim-main .order-submit .btn { min-width: 140px; max-width: 300px; text-align: center; margin: 30px auto 0; display: block; }

.claim-main .divider-line { position: relative; display: block; margin: 30px 30px; width: 100%; text-align: center; }
.claim-main .divider-line:after { content: ''; position: absolute; top: 50%; left: 0; right: 0; width: 100%; display: block; background: #eee; z-index: 1; height: 2px; }
.claim-main .divider-line span { position: relative; text-align: center; padding: 20px; background: #fff; z-index: 10; font-size: 11px; text-transform: uppercase; letter-spacing: 0.11em; color: #b3b3b3; }
  
.claim-main .disclaimer { text-align: center; max-width: 500px; padding: 0 3%; margin: 0 auto; display: block; }

.claim-main .alert { margin: 30px; position: relative; background: #00a6cf; padding: 24px; width: 100%; text-align: center; display: none; }
.claim-main .alert article {}
.claim-main .alert article p,
.claim-main .alert p { color: #fff; margin: 0; }
.claim-main .alert article p a { color: #fff; text-decoration: underline; }



.page-template-page-b2b .mobile-only { display: none; }

/* Fixes */
@media screen and (min-width: 1025px) and (max-height: 1500px) {
			#content #inner-content.video-container { height: 100%; }
			.b2b-hero .video-headline { margin: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); }
			#bgvid { height: 164vh; }
			.b2b-hero { height: 50vw; min-height: 300px; }
			
			.page-template-page-b2b .how-it-works .icon-container { width: 240px; height: 240px; }
	}
	
/* TABLET */
@media screen and (min-width: 641px) and (max-width: 1024px) {
		
		.page-template-page-b2b-claim .header-alt { display: none; }
		
		#content #inner-content.video-container { height: 100%; }
			.b2b-hero .video-headline { margin: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); }
			#bgvid { height: 164vh; }
			.b2b-hero { height: 50vw; min-height: 300px; }
		
		.office-feature .flex-grid .media-container { width: calc(66.666% - 50px); margin: 0 50px 0 0; }
		.related-customers .list-logos ul li { width: calc(25% - 94px); margin: 0 47px 50px; }
		
}


@media screen and (max-width: 1024px) and (min-width: 901px) {
		.page-template-page-b2b .how-it-works .icon-container { width: 240px; height: 240px; }
}	


@media screen and (min-width: 641px) and (max-width: 900px) {
		.page-template-page-b2b .mobile-only { display: none; }
		.page-template-page-b2b header .subscribe-action { display: none; }
		
		.page-template-page-b2b .how-it-works .flex-grid { 
			-webkit-flex-flow: column nowrap;
			-moz-flex-flow: column nowrap;
			-ms-flex-flow: column nowrap;
			flex-flow: column nowrap;
			}
			.page-template-page-b2b .how-it-works .flex-grid .item { width: 100%; max-width: 600px; display: block; margin: 0 auto 90px; }
		
		.whats-inside { background: #fff; }
		.whats-inside header { position: relative; top: auto; left: auto; right: auto; transform: translate(0,0); -webkit-transform: translate(0,0); }
		.page-template-page-b2b header.title h2,
		.page-template-page-b2b header.title p { color: #0f5c89; }
		.overlay-bg.vertical { display: none; }
		
}

/* MOBILE */
@media screen and (max-width: 640px) {
	.page-template-page-b2b-claim .header-alt { display: none; }
	.form-container .form-inner { }
	.page-template-page-b2b .mobile-only { display: block; }
	.footer-cta { background-size: 700px auto; padding: 0 0 200px; }
		.page-template-page-b2b header .subscribe-action { display: none; }
		
		.b2b-hero { height: auto; min-height: 0; background: #00a6cf; }
		.b2b-hero .video-headline { margin: 50px auto 50px auto; padding: 0;  }
		.b2b-hero .video-headline h1 { margin: 0 auto 20px; text-align: center; }
		.b2b-hero .video-headline p { text-align: center; }
		.b2b-hero .video-headline .btn { display: block; margin: 0 auto; }
		#bgvid { display: none; height: auto; min-height: 0; position: relative; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); width: 120%; bottom: -8px; }
		.b2b-hero .overlay-bg { display: none; }
		
		.page-template-page-b2b .how-it-works .flex-grid,
		.office-feature .flex-grid {
			-webkit-flex-flow: column nowrap;
			-moz-flex-flow: column nowrap;
			-ms-flex-flow: column nowrap;
			flex-flow: column nowrap;
			}
		.page-template-page-b2b .how-it-works .flex-grid .item { width: 100%; margin: 0 0 60px; }
		.office-feature .flex-grid .media-container { width: 100%; margin: 0 0 60px; }
		.office-feature .flex-grid .content-container { width: 100%; }
		.related-customers .list-logos ul li { width: calc(50% - 50px); margin: 0 25px 50px; }
		
		.page-template-page-b2b .whats-inside { background: #fff; }
		.page-template-page-b2b .whats-inside header { position: relative; top: auto; left: auto; right: auto; transform: translate(0,0); -webkit-transform: translate(0,0); margin: 50px auto; }
		.page-template-page-b2b header.title h2,
		.page-template-page-b2b header.title p { color: #0f5c89; }
		.overlay-bg.vertical { display: none; }
		
		
		.claim-main .form-container header { padding: 0; }
		
		.claim-main form { 
			-webkit-flex-flow: column nowrap;
			-moz-flex-flow: column nowrap;
			-ms-flex-flow: column nowrap;
			flex-flow: column nowrap;
			margin: 60px 0; 
			}
			.claim-main form .size-50 { width: 100%; margin: 0 0; }
			.claim-main form .size-100 { width: 100%; margin: 0 0; }
}