* {box-sizing: border-box}

body {
margin: 0;
padding: 0;
font-family: 'ProximaNova-Regular',Arial,Helvetica,sans-serif;
font-weight: 400;
font-style: normal;
font-size: 1.125em;
-webkit-text-size-adjust: 100%;
line-height: 1.5;
position: relative;
color: #444;
-webkit-font-smoothing: antialiased;
}

	body .blue-block
	{
	color: #fff;
	}

.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}

hr {
border: none;
border-top: 0.1875rem double #eee;
color: #eee;
overflow: visible;
text-align: center;
height: .25rem;
margin: 3rem 0;
}

.gray-block
{
background-color: #efefef;
}

.gray-block hr {
border-top: 0.1875rem double #fff;
color: #fff;
}

.blue-block
{
background-color: #005380;
}

a
{
color: #005380;
}

a:hover
{
color: #adc72e;
}

	.blue-block a
	{
	color: #fff;
	}

	.blue-block a:hover
	{
	color: #adc72e;
	}

h2, h3
{
color: #005380;
text-transform: uppercase;
font-size: 2.75rem;
line-height: 1.01;
margin: 0 auto;
font-family: 'ProximaNovaExCn-Semibold',sans-serif;
font-weight: 400;
font-style: normal;
text-align: center;
max-width: 40rem;
}

	.blue-block h2, .blue-block h3
	{
	color: #fff;
	text-align: left;
	}

.social-media h3
{
font-size: 2rem;
margin-top: 2rem;
margin-bottom: 2rem;
}

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 0;
height: 0;
margin: 1rem auto 1rem;
}

.video-container iframe, .video-container object, .video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


#jaw-header
{
width: 100%;
height: 100vh;
max-height: 60rem;
background: url("https://dh36nblqpps8a.cloudfront.net/assets/just-add-water/just-add-water-hero-2020-2.jpg") no-repeat right top;
background-size: cover;
position: relative;
}

#topNavBar
{
margin: 0 auto;
width: 100%;
height: 4rem;
max-width: 62.5rem;
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: center;
}

.nrs-logo
{
padding: .5rem;
-webkit-filter: drop-shadow(0 0 .25rem rgba(0,0,0,.5));
filter: drop-shadow(0 0 .25rem rgba(0,0,0,.5));
}

.nrs-logo a
{
display: block;
width: 8.5rem;
height: 1.875rem;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
margin: 0;
padding: 0;
background: url("https://dh36nblqpps8a.cloudfront.net/assets/just-add-water/nrs-logo-white.png") no-repeat;
background-size: contain;
}



#just-add-water-logo
{
width: 100%;
height: calc(100% - 5rem);
display: flex;
align-items: center;
-webkit-filter: drop-shadow(0 0 .25rem rgba(0,0,0,.5));
filter: drop-shadow(0 0 .25rem rgba(0,0,0,.5));
}


#jaw-header h1
{
width: 17.5rem;
height: 7.125rem;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
margin: 0 auto;
padding: 0;
background: url("https://dh36nblqpps8a.cloudfront.net/assets/just-add-water/just-add-water-logo.png") no-repeat;
background-size: contain;

}

.copyright-notice, .bios figcaption
{
position: absolute;
bottom: .25rem;
left: .5rem;
text-align: center;
color: #fff;
color: rgba(255,255,255,.9);
text-shadow: 1px 1px 2px rgba(0,0,0,.25);
font-size: .875rem;
}

.content
{
max-width: 62.5rem;
margin-left: auto;
margin-right: auto;
padding: 2rem;
}

.content p, .content li
{
max-width: 40rem;
margin-left: auto;
margin-right: auto;

}

.content li
{
margin-bottom: 1rem;
}

.content li:last-child
{
margin-bottom: 0;
}

.bios, .brand-logos, .social-media
{
text-align: center;
margin-left: auto;
margin-right: auto;
}

.bios img
{
max-width: 100%;
height: auto;
display: block;
margin: 1rem auto 0;
}

.bios figure
{
position: relative;
max-width: 50rem;
margin: 0 auto;
}

.social-media h2
{
max-width: 30rem;
margin-bottom: 1.5rem;
}

.brand-logos
{
max-width: 80rem;
}

.brand-logo-images
{
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: center;
}

.brand-logo-images a
{
flex: 100% 0 0;
}

.brand-logo-images a img
{
max-width: 100%;
height: auto;
}





#social-media-wrapper {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    margin-top: 2rem
}

#social-media-wrapper span {
    display: block;
    text-indent: 100%;
    white-space: nowrap;
    overflow:hidden
}

#social-media-wrapper a {
flex: 0 0 auto;
border-radius: 50%;
background-color: #005380;
color: #fff;
text-decoration: none;
text-align: center;

width: 2.75rem;
height: 2.75rem;
margin: .25rem;
line-height: 2.75rem;
font-size: 1.5rem;
}

#social-media-wrapper a:hover {
    background-color:#27aae1
}


.quoted
{
font-size: 1.5rem;
font-style: italic;
position: relative;
color: #005380;
margin-bottom: .25rem;
}


p.quoted:before {
content: open-quote;
}

.quote-credit
{
font-size: 1.5rem;
color: #27aae1;
margin-top: 0;
}

.itinerary h3
{
font-size: 1.75rem;
color: #27aae1;
line-height: 1.25;
height: 2rem;
margin-top: 1rem;
margin-bottom: 1rem;
text-transform: none;
}

.jaw-buttons
{
text-align: center;
margin-bottom: 2rem;
}

.jaw-buttons a
{
color: #005380;
background-color: #adc72e;
font-family: 'ProximaNovaExCn-Semibold',sans-serif;
font-weight: 400;
font-style: normal;
font-size: 1.4rem;
text-align: center;
border: none;
padding: .75rem .75rem .55rem .75rem;
border-radius: 20rem;
text-decoration: none;
}

.jaw-buttons a:hover
{
color: #fff;
background-color: #005380;
}


@media screen and (min-width:23rem) {

	#topNavBar
	{
	padding: 0 .75rem;
	}
}

/* 25.875rem / 414px */
@media screen and (min-width:25.875rem) {
	
	#jaw-header h1
	{
	width: 24.375rem;
	height: 9.9375rem;
	}
	
	.brand-logo-images a
	{
	flex: 50% 0 0;
	}

}

@media screen and (min-width:40rem) {

	
	#social-media-wrapper a {
	width: 3.75rem;
	height: 3.75rem;
	line-height: 3.75rem;
	font-size: 2rem;
	}
	
	.copyright-notice, .bios figcaption
	{
	color: #fff;
	text-shadow: 1px 1px 2px rgba(0,0,0,.75);
	font-size: 1rem;
	}



}

/* 48rem / 768px */
@media screen and (min-width:48rem) {

	#jaw-header h1
	{
	width: 35rem;
	height: 13.375rem;
	}
	
	.brand-logo-images a
	{
	flex: 25% 0 0;
	}
	
	.quoted, .quote-credit
	{
	font-size: 2rem;
	line-height: 1.3;
	}


	p.quoted:before {
	font-size: 16rem;
	position: absolute;
	top: -4.8rem;
	left: -8rem;
	color: #27aae1;
	}

}


@media screen and (min-width:62.5rem) {
	
	#topNavBar
	{
	padding: 1rem 1.5rem 0;
	}
	
	.nrs-logo a
	{
	width: 11.3125rem;
	height: 2.5rem;
	}
	
}