.content {
    display: block;
    clear: both;
    padding: 2em 0;
}

h1, h2, h3 {font-family:'Gilroy-Bold', sans-serif; line-height:125%; padding:0.25em 0; text-transform:none; font-weight:bold; color:#4E2112}
h5 { font-size:90%; line-height:125%; padding:0.5em 0; font-weight:700; text-transform:uppercase; letter-spacing:2px; border-bottom:none;}
.guide .icon {display:inline-block; vertical-align:bottom; width:30%; padding:0.5em; text-align:right; margin-right:-5px; float:right;}
	.guide h3 {font-size:100%; padding:0.5em; display:inline-block; vertical-align:bottom; width:60%; margin-right:-5px; }
	.guide table {width:100%}
	.guide td {background:white}
	.guide tr td:first-of-type {-webkit-border-radius:4px 0 0 4px; border-radius:4px 0 0 4px}
	.guide tr td:last-of-type {-webkit-border-radius:0 4px 4px 0; border-radius:0 4px 4px 0}
	.guide.pink table tr:nth-of-type(odd) td {background:#f9dee6}
	.guide.blue table tr:nth-of-type(odd) td {background:#dbeafa}
	.guide.lightblue table tr:nth-of-type(odd) td {background:#e8f5fa}
	.guide.green table tr:nth-of-type(odd) td {background:#eef9f0}
	.guide.orange table tr:nth-of-type(odd) td {background:#fbecd2}
	.guide.purple table tr:nth-of-type(odd) td {background:#f1d6ff}
	.guide.red table tr:nth-of-type(odd) td {background:#fccbcc}
	.guide table td {font-size:90%; line-height:125%; padding:0.75em 0.5em}
	.guide table tr td:last-of-type { text-align:right}

    .accordion { width:100%; margin:1em 0; clear:both;}		
	.accordion-item {cursor:pointer; display:block; text-decoration:none; padding:0.5em 0; border-top:4px solid #F4F4F4; font-weight:bold}	
	.accordion-item:first-of-type {display:block; border:0}		
	.accordion-item:after {float:right; padding:4px 0; font-family:"Font Awesome 5 Free"; content:url(/img/ServingGuide/Arrow.png);}
	.accordion-item.open:after {font-family:"Font Awesome 5 Free";  content:url(/img/ServingGuide/ArrowDown.png);}
	.accordion .data {padding:0; display:block; display:none; font-size:90%}
	.accordion .data label {display:block; padding:4px 0; line-height:100%}	
	.accordion .data input {margin:0 4px 0 0; display:inline-block; vertical-align:top}
	
@media only screen and (min-width:769px) {
		.formobile {display:none}

        .row {}
		.row:after { content:""; display:table; clear:both}
		.row .column.half:first-of-type {padding-right:2em}
		.row .column.half:last-of-type {padding-left:2em}
       
		.guide {margin:1em 1.4%; display:inline-block; width:22%; vertical-align:bottom}			
		.row .guide:first-of-type {margin-left:0}

		.serving-intro {display:inline-block; width:70%; padding-right:5%; vertical-align:middle; margin-right:-5px}

		.portions {display:inline-block; width:25%; vertical-align:middle; margin-right:-5px}
		.portion {display:block; padding:0.5em 0}
		.portion .icon, .portion h5 {display:inline-block; vertical-align:top}
		.portion .icon {width:60px}
		.portion h5 {display:inline-block; vertical-align:top; padding:0 1em; font-size: 90%; line-height: 125%; padding: 0.5em 0; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; border-bottom:none; color: #512100; font-family:Lato sans-serif;}

		.serving-guide {margin:1.5em 0}	
		.serving-guide h3 {font-size:100%; padding:0; display:inline-block; vertical-align:bottom; width:75%; margin-right:-5px}
        .serving-guide table {width:100%;}
		.serving-guide table td {background:white; text-align:center; font-size:90%; line-height:125%; padding:0.75em 0.5em}
		.serving-guide table tr:nth-of-type(odd) td {background:white}
		.serving-guide table tr.pink td {background:#f9dee6}			
		.serving-guide table tr.blue td {background:#dbeafa}
		.serving-guide table tr.lightblue td {background:#e8f5fa}
		.serving-guide table tr.green td {background:#eef9f0}
		.serving-guide table tr.orange td {background:#fbecd2}
		.serving-guide table tr.purple td {background:#f1d6ff}
		.serving-guide table tr.red td {background:#fccbcc}
		.serving-guide tr td:first-of-type {-webkit-border-radius:4px 0 0 4px; border-radius:4px 0 0 4px; text-align:left}
		.serving-guide tr td:last-of-type {-webkit-border-radius:0 4px 4px 0; border-radius:0 4px 4px 0}		
		.serving-guide table p.blue {background:#DFE3FB; text-align:center; padding:0.75em 0.5em; color: #4E2112; font-weight: bold; }
		.serving-guide table p.lightblue {background:#DFFBEB; text-align:center; padding:0.75em 0.5em; color: #4E2112; font-weight: bold;}

	}
@media only screen and (max-width:768px) {
		.content {padding:1.5em 0}
		
        .fordesktop {display:none}
        .formobile {}
			.guide .icon, .guide h3 {vertical-align:middle}
			.accordion.guide { }
			.accordion.guide .accordion-item {padding:1em; border-top:4px solid #F4F4F4; font-weight:bold; font-size:16px; font-family:'Lato', sans-serif !important; -webkit-text-size-adjust:none; }	
			.guide .icon {width:40%; margin-top:-10px;}
			.guide h3 {width:40%}			
			.accordion.guide h3, .guide .icon {padding:1em}
			.accordion.guide td {padding:1em; text-align:center !important}	
			.accordion.guide tr td:first-of-type {text-align:left !important}
            .accordion.guide tr td:last-of-type {text-align:right !important}	
			.accordion.guide .guide {margin:2em 0.25em 2em}
			.data.serving-guide table tr:nth-of-type(odd) td {background:white}
			.data.serving-guide table td {padding:0.5em}
			.data.serving-guide h4 {padding:0.75em; margin:1em 0 0; -webkit-border-radius:4px; border-radius:4px}
			/*.data.serving-guide h4.pink {background:#FBDFE6}			
			.data.serving-guide h4.blue {background:#dbeafa}
			.data.serving-guide h4.lightblue {background:#EDF9F0}
			.data.serving-guide h4.green {background:#D9EAFA}
			.data.serving-guide h4.orange {background:#fbecd2}
			.data.serving-guide h4.purple {background:#f1d6ff}
			.data.serving-guide h4.red {background:#fccbcc}
		    .data.serving-guide h4.indigo {background:#DFE3FB;}
            .data.serving-guide h4.lightgreen {background:#DFFBEB;}*/
            .data table{font-family:'Lato', sans-serif; font-size:16px;}
            .data table tr.lightblue td {background:#EDF9F0; font-weight:bold;  }
            .data table tr.orange td {background:#fbecd2; font-weight:bold;  }
            .data table tr.red td {background:#fccbcc; font-weight:bold;  }
            .data table tr.green td {background:#D9EAFA; font-weight:bold;  }
            .data table tr.purple td {background:#f1d6ff; font-weight:bold;  }
            .data table tr.blue td {background:#dbeafa; font-weight:bold;  }
            .data table tr.pink td {background:#FBDFE6; font-weight:bold;  }
             .data table tr.indigo td {background:#DFE3FB; font-weight:bold;  }
             .data table tr.lightgreen td {background:#DFFBEB; font-weight:bold;  }
            .tab {
              overflow: hidden;
              text-align:center;
            }
            .tab a {
              background-color: inherit;
              border: 2px solid #D8D8D8;
              outline: none;
              cursor: pointer;
              padding: 14px 16px;
              transition: 0.3s;
              font-size: 15px;
              margin:0 2%;
              color:#512100;
              font-weight: bold;
              font-family: 'Lato', sans-serif;
            }

            /* Change background color of buttons on hover */
            .tab a:hover {
              background-color: #ddd;
            }


            /* Create an active/current tablink class */
            .tab a.active {
              background-color: #95D4E7;
            }

            /* Style the tab content */
            .tabcontent {
              display: none;
              
              
            }
	}