/* ==========================================================================
   ------------------ PRODUCT-RELATED PAGES ------------------------
   ========================================================================== */

.product-info-wrapper {width: 95%; margin: 0 auto 2em auto;}

img.product-hero {max-width: 100%; height: auto; display: block; margin: 0 auto;}

/* --------- Recommended Flavors -----------*/
/*#recommendations {width: 100%; margin: 0; font-size: .9em;}
#recommendations h2 {font-family: 'Raleway', verdana, 'Trebuchet MS', Helvetica, Arial, sans-serif; font-weight:700; font-size: .9em; color: #47a76e; text-transform: uppercase; padding: .5em 0; text-align:center;} 
#recommendations ul { list-style:none; margin:0; padding:0;}
#recommendations li { margin:0 1%; border-top: 1px solid #7fbee9; padding: 5px 0.5%; font-size: .9em; clear:both;}
#recommendations a { display:inline-block; float:left; width:65%; font-size:.9em; line-height:1.25em; color: #000; text-decoration: none; padding-top:5px;}
#recommendations li a.package {width:30%; max-width: 60px; margin-right:5%; padding-top:0;}
#recommendations img {width: auto; width:100%; margin: 0px auto;}
#recommendations a:hover {color: #47a76e; text-decoration: underline;}*/



#recommendations,
.recommendations {
	width: 100%;
	margin: 0;
	font-size: .9em;
}

    #recommendations th,
	.recommendations th{
        /*color: #47a76e;*/
        font-family: 'arpona', serif;
        font-weight: 700;
        font-style: normal;
        font-size: 1.1em;
        color: #AB0432;
        text-transform: uppercase;
        padding: .5em 0 1em;
    }

    #recommendations td,
	.recommendations td{
        border-top: 1px solid #7fbee9;
        padding: 5px;
        text-align: center;
        font-size: .9em;
    }

        #recommendations td.package,
		.recommendations td.package{
            width: 60px;
        }

    #recommendations img,
	.recommendations img{
        width: auto;
        height: 38px;
        margin: 0px auto;
    }

    #recommendations a,
	.recommendations a{
        color: #000;
        text-decoration: none;
    }

        #recommendations a:hover,
		.recommendations a:hover{
            color: #47a76e;
            text-decoration: underline;
        }

/* ---------------- Product Info Accordion ---------------- */
.product-info > .accordion {
    padding-top: 1em;
}

ul.accordion, ul.accordion ul {
  	list-style: none;
  	padding: 0;
}
ul.accordion .inner {
  	padding: 0.75em 1.25em;
	/*background-color:#d4e9f6;*/
    background-color:#faf3e5;
  	overflow: hidden;
  	display: none;
}
#page-content ul.accordion .inner p,
#page-content ul.accordion .inner li {
	font-size:.9375rem;
	line-height:1.25rem;	
}

#page-content ul.accordion .inner li {
	margin-bottom:.375em;
}

ul.accordion .inner ul.column-listings {
	column-count:3;
	column-gap:1.25em;
}

ul.accordion .inner.show {
  	/*display: block;*/
}
ul.accordion li {
  	margin: .125em 0;
}
#page-content ul.accordion li a.toggle {
	position:relative;
	/*font-family: 'Sorts Mill Goudy', Georgia, serif;
    font-weight: 400;*/
	text-decoration:none;
	font-size:1rem;
  	/*width: 94%;*/
  	display: block;
  	/*background-color:#4587b3;
  	color: #f9dc95;*/
    background-color:#AB0432;
  	color: #fff;
    text-transform: uppercase;
  	/*padding: .5em 4% .5em 2%;*/
    padding: .5em 4% .5em 4%;
  	transition: background .3s ease;
}
ul.accordion li a.toggle:hover {
  	/*background-color: rgba(69, 135, 179, 0.9);*/
}

#page-content ul.accordion li a.toggle .fa {
    color:#d4e9f6;
	text-align:center;
	width:34px;
}

#page-content ul.accordion li a.toggle .fa:first-child {
    display: none;
}

#page-content ul.accordion li a.toggle .fa img {
	width:23px;
	vertical-align:middle;
}

#page-content ul.accordion li a.toggle .fa-chevron-circle-down {
	color:#fff;
	position:absolute;
	right:0;
	font-size:1.5rem;
	padding-right:0.5em;
}

#page-content ul.accordion li.open a.toggle .fa-chevron-circle-down:before {
	content:'\f139';
}

/* --------------- product selector ----------------------*/
.product-selector {
	border:solid 1px #000;
	border-bottom:0;
	font-family: 'Raleway', verdana, 'Trebuchet MS', Helvetica, Arial, sans-serif;
}

.nutritionals-header {
	font-size: 1.25em;
    font-weight: bold;
    color: #fff;
    background-color: #4ba66f;
    padding: 0.75em;
	border-bottom:solid 1px #000;
}

#page-content .product-selector ul {
	margin:0;
	padding:0;
	list-style:none;
	background-color:#fff;
}

#page-content .product-selector ul li a {
	display:block;
	font-size:0.875rem;
	font-weight:800;
	color:#900028;
	padding:.75em;
}

#page-content .product-selector.no-links ul li {
	display:block;
	font-size:0.875rem;
	font-weight:800;
	color:#900028;
	padding:0.5em 0.75em;
}

#page-content .product-selector ul li:hover a {
	background-color:#fdf0d3;
}

#page-content .product-selector ul li.selected a {
	background-color:#f8db98;
}


/* --------------- NEW nutrition table ----------------------*/
#nutrition-table-ing, .nutrition-table-ing {background-color:#e2f3e6; font-family: 'Raleway', verdana, 'Trebuchet MS', Helvetica, Arial, sans-serif;}
.nutritionals-table  {border:solid 1px #000;}

#page-content .nutritionals-table p {
	margin: 0 10px;
    padding: 0.125em 0;
    border-top: solid 1px #000;
    line-height: 1.375em;
}

#page-content .nutritionals-table .servings {
	padding: 0.5em 0 0.25em;
}

#page-content .nutritionals-table .servings p {
	border:0;
	font-size: .9375rem;
    padding: 0;
}

#page-content .nutritionals-table p.cal-info {
	font-size:1.75rem;
	font-weight:700;
	line-height:2rem;
	border-bottom:solid 4px #000;
}

#page-content .nutritionals-table p.cal-info .align-right {
	font-size:2.25rem;
	line-height:1.5rem;
}

#page-content .nutritionals-table div.green-divider + div > p {
	border-top:0;
}

#page-content .nutritionals-table p.indent {padding-left:1em;}
#page-content .nutritionals-table p strong, #page-content .nutritionals-table p b {font-weight:900;}

.nutritionals-table .align-right {text-align:right; float:right;}
.green-divider {height:8px; background-color:#4ba66f; margin:0.25em 0;}

#page-content .nutritionals-table .upc-code p {text-align:center; padding:0.25em 0 0.5em;}

#page-content .nutritionals-table p.smallcopy {font-size:10px; line-height:12px; padding:0.75em 0;}


/* --------------- OLD nutrition table ----------------------*/
#nutrition-table {width: 280px; float: none; margin: 2em auto; font-size: .8em; line-height: 1.25em; font-family: Arial, Helvetica, sans-serif; background-color:#e2f3e6; border-collapse: collapse;}
#nutrition-table-int {background-color:#e2f3e6;}
.nutritionals td {background-color: #e2f3e6; padding:2px 5px; border: 1px solid black;}
.nutritionals td.amount {width: 45px;}
.nutritionals td.pdv {width: 45px;}
.nutritionals td.dark {background-color: #bce1c7;}
.nutritionals td.light {background-color:#e2f3e6;}
.nutritionals td.indent {padding-left:15px;}
.nutritionals td.align-right {text-align: right;}
.nutritionals_header {font-size: 1.0em; font-weight: bold;}
.nutritionals_subheader {font-weight: bold;}
.nutritionals table  {width: 100%;}
.nutritionals table td {width: 45%; border: none;}
.smallcopy {font:10px/10px Arial, Helvetica, sans-serif; padding:0 5px; color:#000000;}


/* --------- All Flavors -----------*/
#all-flavors {display:block; overflow: visible; float:none; clear: both; margin: 1.5em 0 0; padding: 0 0 1em 0; background-color: #b3f1e8; /*width: 95%; margin: 3em auto 1em auto; background: #d3e9f7 url('/images/ui/page-curl.png') top right no-repeat;
	-moz-box-shadow: -3px 3px rgba(0,0,0,0.7);
	-webkit-box-shadow: -3px 3px rgba(0,0,0,0.7);
	box-shadow: -3px 3px 3px rgba(0,0,0,0.4);*/
	}
#page-content #all-flavors h3 {position: relative; top: -.5em; width: 80%; float: none; margin: 0 auto; padding: 2.0em 0 .5em 0; color: #0b4b62; font-family: 'arpona', serif; font-weight: 700; font-style: normal; text-transform: uppercase; text-align: center; /*font-family: 'Sorts Mill Goudy', Georgia, serif; background: url('/images/ui/push-pin.png') top no-repeat;*/}
#all-flavors ul {width: 85%; float: none; list-style-type: none; margin: 0 auto; padding: 0;}
#all-flavors ul li {float:none; width: 100%; padding: 0; margin: .75em 4% .75em 0; font-size: .85em; line-height:1.25em; /*font-family: 'Raleway', verdana, 'Trebuchet MS', Helvetica, Arial, sans-serif;*/}
#all-flavors ul li a {/*color:#1e4c6c;*/ color: #0b4b62;}
#all-flavors ul li a:hover {/*color:#900028;*/ color: #AB0432;}
#all-flavors ul li:nth-child(2n+1) {clear: both;}



	/* -----------------------  MEDIA QUERIES    ------------------------ */

	/* 400px/16px = 25em */
	 @media all and (min-width: 400px) {
	/*#all-flavors ul {width: 95%; margin: 0 0 0 5%;}
	#all-flavors ul li {float: left; width: 45%; padding: 0; }*/
	}
	
	/* 480px/16px = 30em */
	 @media all and (min-width: 480px) {
	#all-flavors ul {width: 95%; margin: 0 0 0 5%;}
	#all-flavors ul li {float: left; width: 45%; padding: 0; margin: .5em 4% .5em 0; }
	/*#page-content p.call-to-action {width: 70%;}*/
	#enjoy, #recommendations, .recommendations {width: 80%; margin: .5em auto 2em auto;}
	}
	
	/* 580px/16px = 36.25em */
	 @media all and (min-width: 580px) {
	.product-info-wrapper {width: 50%; float: left; margin: 0 0 1em 0;}
	/*#page-content p.call-to-action {width: 90%;}*/
	#enjoy, #recommendations, .recommendations {width: 100%;}
	#nutrition-table {width: 250px; float: right; margin: 0 0 2em 0; font-size: .7em;}
	}

	/* 700px/16px = 43.75em */
	 @media all and (min-width: 700px) {
	.product-info-wrapper {width: 95%; float: none;}
	/*#page-content p.call-to-action {width: 70%;}*/
	#enjoy, #recommendations, .recommendations {width: 80%;}
	#nutrition-table {width: 280px; float: none; margin: 1em auto;}
	#recommendations li { clear:none;}
	#recommendations li { float:left; width:47%;}
	#recommendations li:nth-child(2n+3) {clear:both;}

	.recommendations li { clear:none;}
	.recommendations li { float:left; width:47%;}
	.recommendations li:nth-child(2n+3) {clear:both;}
	}

	/* 900px/16px = 56.25em */
	 @media all and (min-width: 900px) {
	.product-info-wrapper {width: 50%; float: left;}
	/*#page-content p.call-to-action {width: 90%;}*/
	#enjoy, #recommendations, .recommendations {width: 100%;}
	#nutrition-table {width: 250px; float: right; margin: 0 0 2em 0;}
	}

	/* 960px/16px = 60em */
	 @media all and (min-width: 960px) {
	#all-flavors ul {/*width: 97%; margin: 0 0 0 2%;*/ width: 75%; margin: 0 auto 1em;}
	/*#all-flavors ul li {float: left; width: 28%; margin: .5em 3% .5em 0;}
	#all-flavors ul li:nth-child(2n+1) {clear: none;}
	#all-flavors ul li:nth-child(3n+4) {clear: both;}*/
	}

	/* 980px/16px = 61.25em */
	 @media all and (min-width: 980px) {
	#nutrition-table {width: 250px; float: right; margin: 0 0 2em 0;}
	#recommendations li { width:30.3333%;}
	#recommendations li:nth-child(2n+3) {clear:none;}
	#recommendations li:nth-child(3n+4) {clear:both;}

	.recommendations li { width:30.3333%;}
	.recommendations li:nth-child(2n+3) {clear:none;}
	.recommendations li:nth-child(3n+4) {clear:both;}
	}

	/* 1160px/16px = 71.875em */
	 @media all and (min-width: 1160px) {
	.product-info-wrapper {width: 63%;}
	}

	/* -----------------------                    ------------------------ */
	
	
/* --------- Product Categories -----------*/
.product-float {float: none; width: 100%;}
.product {float: none; max-width: 330px; margin: 0 auto 3em auto; min-height: 0px;}
	.product:nth-child(odd) {clear: both;}
.product img {max-width: 100%; height: auto; display: block; margin: .5em 0;}
#page-content .product h3 a {text-decoration: none; color: #Ab0432;}
	#page-content .product h3 a:hover {text-decoration: underline;}

#page-content .explore {color: #007f61; font-size: 1em; line-height: 1.25em;}
	#page-content .explore a {color: #1f6f18;}
	#page-content .explore:hover, #page-content .explore a:hover {color: #900028;}

.flavors-box {display: none; width: 90%; margin: 0 0 2em .5em; padding: 0; list-style-type: none; background-color: #fff8e7; border: 1px solid #fff2d0;}

.flavors-box li {margin: .75em; font-size: .95em; line-height: 1.25em;}

	/* -----------------------  MEDIA QUERIES    ------------------------ */

	/* 480px/16px = 30em */
	 @media all and (min-width: 480px) {
	.product-float {float: left; width: 47%; margin: 0 1%;}
	.product {min-height: 370px; margin: 0 auto 1em auto;}
	}
	
	/* 680px/16px = 42.5em */
	 @media all and (min-width: 680px) {
	.product-float {float: none; width: 100%;}
	.product {min-height: 0px; margin: 0 auto 3em auto;}
	}
	
	/* 900px/16px = 56.25em */
	 @media all and (min-width: 900px) {
	.product-float {float: left; width: 47%; margin: 0 1%;}
	.product {min-height: 330px; margin: 0 auto 1em auto;}
	}
	

/* --------- New Products & Scoop Shop-----------*/
.product-box {border: 1px solid #d0e7f6; float: none; position: relative; width: 100%; margin: 0 auto 1.5em auto; text-align: center;}
		.product-box:nth-of-type(odd) {clear: both;}
#page-content .productFlavorHead {clear: both; margin: 3em 0 0 0; color: #007f61; font-weight: 700; font-size: 1.25em; line-height: 1.25em; font-family: "Raleway", verdana, "Trebuchet MS", Helvetica, Arial, sans-serif;}

.new-products img {width: auto; height: 110px; margin-top: .85em;}
.scoop-flavor img {width: auto; height: 68px; margin-top: .85em;}

#page-content .productLine {width: 90%; color: #7fbee9; margin: .75em auto 0 auto; font-style: italic; font-size: .95em; line-height: 1.25em; font-family: 'Sorts Mill Goudy', Georgia, serif;}	
#page-content .productFlavor {width: 90%; margin: .5em auto; color: #007f61; font-size: 1.125em; line-height: 1.125em; font-weight: 400;}
	#page-content .productFlavor a {color: #007f61;}
	#page-content .productFlavor a:hover {color: #7fbee9;}
	#page-content .productIngredients {width: 90%; margin: .5em auto 1.25em auto; color: #3f3f3f; font-size: .9em; line-height: 1.25em;}

.exclusive-banner {position: relative; bottom: -12px; width: 96%; max-width: 320px; height: 31px; margin: 0 auto; overflow: visible;}
	#page-content .exclusive-banner p {z-index: 10; position: absolute; top: 5px; left: -1px; width: 100%; color: #fff; margin: 0 auto; padding: 0; text-align: center; font-size: .85em; line-height: 1em;}
	.exclusive-banner img {z-index: 5; position: absolute; top: 0; left: 0; width:100%; max-width: 100%; height: 31px; display: inline; margin: 0 auto;}
	
	.scoop-search {display: block; width: 90%; clear: left; float: none; margin: 2em auto 3em auto; padding: 10px 5%; color: #900028; font-size: .9em; line-height: 1.125em; font-weight: bold; background-color: #f9dc94;}
	#page-content .scoop-search p {display: block; float: none; margin: 0 auto; text-align: center;}
	.scoop-search i {margin-right: .5em;}
	#page-content .scoop-search button {float: none; margin: .5em auto;}

	
	/* -----------------------  MEDIA QUERIES    ------------------------ */

	/* 430px/16px = 26.875em */
	 @media all and (min-width: 430px) {
	#page-content .exclusive-banner p {top: 6px; font-size: .9em;}
	}
	
	/* 520px/16px = 32.5em */
	 @media all and (min-width: 520px) {
	.product-box {float: left; width: 45%; margin: 0 4% 1.5em 0;}
	#page-content .exclusive-banner p {top: 7px; font-size: .75em;}
	#page-content .scoop-search p {float: left; margin: .4em .5em 0 1%;}
	#page-content .scoop-search button {float: right; margin: 0 1% 0 0;}
	}
	
	/* 580px/16px = 36.25em */
	 @media all and (min-width: 580px) {
	#page-content .scoop-search p {margin: .4em .5em 0 6%;}
	#page-content .scoop-search button {margin: 0 6% 0 0;}
	}

	/* 700px/16px = 43.75em */
	@media all and (min-width: 700px) {
	.product-box {float: none; width: 100%; margin: 1.5em auto;}
	#page-content .exclusive-banner p {top: 6px; font-size: .9em;}
	#page-content .scoop-search p {display: block; float: none; margin: 0 auto;}
	#page-content .scoop-search button {float: none; margin: .5em auto;}
	}
	
	/* 780px/16px = 48.75em */
	@media all and (min-width: 780px) {
	.product-box {float: left; width: 45%; margin: 0 4% 1.5em 0;}
	#page-content .exclusive-banner p {top: 7px; font-size: .75em;}
	}

	/* 850px/16px = 51.875em */
	 @media all and (min-width: 850px) {
	#page-content .scoop-search p {float: left; margin: .4em .5em 0 1%;}
	#page-content .scoop-search button {float: right; margin: 0 1% 0 0;}
	}

	/* 930px/16px = 58.125em */
	 @media all and (min-width: 930px) {
	#page-content .scoop-search p {margin: .4em .5em 0 7%;}
	#page-content .scoop-search button {margin: 0 7% 0 0;}
	}

	/* 1050px/16px = 65.625em */
	 @media all and (min-width: 1050px) {
	.product-box {float: left; width: 30%; margin: 0 3% 1.5em 0;}
	.product-box:nth-of-type(odd) {clear: none;}
	.product-box:nth-of-type(3n+1) {clear: both;}
	}


/* --------- limited edition flavor -----------*/
.limited-edition-flavor {border: 1px solid #d0e7f6; float: none; position: relative; width: 100%; margin: 0 auto 1.5em auto; text-align: center;}
		.limited-edition-flavor:nth-of-type(odd) {clear: both;}



	
	/* -----------------------  MEDIA QUERIES    ------------------------ */
	
	/* 520px/16px = 32.5em */
	 @media all and (min-width: 520px) {
	.limited-edition-flavor {float: left; width: 45%; margin: 0 4% 1.5em 0;}
	}

	/* 700px/16px = 43.75em */
	@media all and (min-width: 700px) {
	.limited-edition-flavor {float: none; width: 100%; margin: 1.5em auto;}
	}
	
	/* 780px/16px = 48.75em */
	@media all and (min-width: 780px) {
	.limited-edition-flavor {float: left; width: 45%; margin: 0 4% 1.5em 0;}
	}

	/* 1050px/16px = 65.625em */
	 @media all and (min-width: 1050px) {
	.limited-edition-flavor {float: left; width: 45%; margin: 0 3% 1.5em 0;}
	.limited-edition-flavor:nth-of-type(odd) {clear: none;}
	.limited-edition-flavor:nth-of-type(3n+1) {clear: both;}
	}



/* INGREDIENT POPUP MODAL */
.popup_content {
	background-color:#fff;
	padding: 2em 5%;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
    border-radius: 12px;
	border: 0px solid #000000;
	max-width:80%;
}

.popup_content h4 {
	font-size: 1.75rem;
    font-weight: 300;
    line-height: 1.75rem;
	margin-top:0;
    margin-bottom: 0.25em;
	color:#900028;
}

.popup_content .closebtn {
	position:absolute;
	top:12px;
	right:12px;
}

.popup_content .closebtn .fa {
	color:#900028;
}

@media all and (min-width: 600px) {
.popup_content {
	padding: 2em;
	max-width:280px;
}
}