
.desktop, html.mobile { display: block !important; }
.mobile { display: none !important; }

/* ------------------------------------------------------------ *\ 
	Sections
\* ------------------------------------------------------------ */

.section-meatless { width: 100%; position: relative; overflow: hidden; background-color: #fff; font-family: 'friz_quadrataregular', Arial, sans-serif; font-weight: normal; }
.section-meatless p { margin: 0 !important; }
.section-meatless .section-head { width: 100%; }
.section-meatless .section-head-image { width: 100%; position: relative; }
.section-meatless .section-head-image img { display: block; width: 100%; height: auto; }
.section-meatless .section-head-content { max-width: 600px; margin: 0 auto; padding: 20px 20px 40px 20px; text-align: center; }
.section-meatless .section-head-content p { font-size: 15px; }
.section-meatless .section-body { padding: 0 34px; }
.section-meatless .section-foot { width: 100%; }
.section-meatless .section-foot-image { width: 100%; position: relative; }
.section-meatless .section-foot-image img { display: block; width: 100%; height: auto; }

/* ------------------------------------------------------------ *\ 
	Lists
\* ------------------------------------------------------------ */

.list-meatless ul { list-style: none; font-size: 0; line-height: 0; text-align: center; position: relative; margin: 0; padding: 0; }
.list-meatless li { position: relative; display: inline-block; vertical-align: top; font-size: 16px; line-height: 1.25; width: 33.333%; padding: 0 23px 75px 23px; max-width: 295px; -webkit-box-sizing: border-box; box-sizing: border-box; }
.list-meatless li.list-arrow-right .list-head:before { background: url(../images/meatless/ico-arrow-right.png) no-repeat 0 0; background-size: 26px 28px; width: 26px; height: 28px; }
.list-meatless li:nth-child(3n) .list-image-primary { margin-right: -23px; }
.list-meatless li:nth-child(3n+1) .list-head:after { left: 0; }
.list-meatless li:nth-child(6n) .list-head:after,
.list-meatless li:nth-child(21) .list-head:after  { right: 0; }
.list-meatless li:nth-child(6n) .list-head:before { width: 3px; height: auto; background: #ce559a; right: 0; bottom: 0; top: -242px; }
.list-meatless li:nth-child(7) .list-image-primary,
.list-meatless li:nth-child(13) .list-image-primary,
.list-meatless li:nth-child(22) .list-image-primary { margin-left: -23px; }
.list-meatless li:nth-child(7):before,
.list-meatless li:nth-child(13):before,
.list-meatless li:nth-child(19):before,
.list-meatless li:nth-child(25):before,
.list-meatless li:nth-child(31):before { content: ' '; position: absolute; left: 23px; top: -235px; bottom: 166px; width: 3px; background-color: #ce559a; }
.list-meatless li:nth-child(13):before { top: -190px; }
.list-meatless li:nth-child(19):before { bottom: 211px; top: -190px; }
.list-meatless li:nth-child(25):before { bottom: 212px; }
.list-meatless li:nth-child(31):before { bottom: 211px; top: -242px; }
.list-meatless li:nth-child(13):after { content: ' '; position: absolute; left: 40px; top: 66px; background: url(../images/meatless/ico-arrow-right.png) no-repeat 0 0; background-size: 26px 28px; width: 26px; height: 28px; }
.list-meatless li:nth-child(9) .list-head:after { right: 0; }
.list-meatless li:nth-child(9) .list-head:before,
.list-meatless li:nth-child(21) .list-head:before,
.list-meatless li:nth-child(33) .list-head:before { right: -12px; top: 228px; background: url(../images/meatless/ico-arrow-bottom.png) no-repeat 0 0; background-size: 28px 26px; width: 28px; height: 23px; }
.list-meatless li:nth-child(18):before,
.list-meatless li:nth-child(19):after,
.list-meatless li:nth-child(31):after { content: ' '; position: absolute; right: 11px; top: -13px; background: url(../images/meatless/ico-arrow-bottom.png) no-repeat 0 0; background-size: 28px 26px; width: 28px; height: 23px; }
.list-meatless li:nth-child(19):after { right: auto; left: 10px; }
.list-meatless li:nth-child(31):after { right: auto; left: 10px; }
.list-meatless li:nth-child(24) .list-head:before { top: -214px; }
.list-meatless li:nth-child(36) .list-head:before { top: -211px; }
.list-meatless li:nth-child(29) .list-head:before { content: ' '; position: absolute; left: auto; right: 0; top: 66px; background: url(../images/meatless/ico-arrow-left.png) no-repeat 0 0; background-size: 26px 28px; width: 26px; height: 28px; }
.list-meatless li:nth-child(27) .list-head:before { display: none; }
.list-meatless li:nth-child(33) .list-head:after,
.list-meatless li:nth-child(27) .list-head:after { right: 0; }
.list-meatless li:nth-child(30):before { content: ' '; position: absolute; right: 23px; top: -213px; bottom: 100px; background-color: #ce559a; width: 3px; }
.list-meatless li:nth-child(34) .list-head:after { left: -110px; }
.list-meatless li:first-child .list-head:after { left: -110px; }
.list-meatless .list-image-primary { position: relative; z-index: 30; }
.list-meatless .list-image-primary img { display: block; width: 100%; height: auto; }
.list-meatless .list-image-secondary { position: absolute; top: 0; z-index: 30; }
.list-meatless .list-image-secondary img { display: block; max-width: 100%; height: auto; }
.list-meatless .list-head { color: #ffb718; position: relative; margin-bottom: 20px; padding-bottom: 20px; z-index: 20; }
.list-meatless .list-head:after { content: ' '; position: absolute; left: -80px; right: -80px; bottom: 0; height: 3px; background-color: #ce559a; }
.list-meatless .list-head:before { content: ' '; position: absolute; right: -24px; bottom: -13px; background: url(../images/meatless/ico-heart.png) no-repeat 0 0; width: 26px; height: 22px; background-size: 26px 22px; }
.list-meatless .list-head p { font-size: 20px; line-height: 1; text-transform: uppercase; font-family: 'FrizQuadrataBold', Arial, sans-serif; font-weight: normal; }
.list-meatless .list-head strong { display: block; font-family: 'friz_quadrataregular', Arial, sans-serif; font-weight: normal; font-size: 42px; line-height: 1; }
.list-meatless .list-body { padding: 0 20px; position: relative; z-index: 20; }
.list-meatless .list-body p { font-size: 18px; line-height: 24px; color: #ce559a; }
.list-meatless .list-body p a { color: #ce559a; }
.list-meatless .list-body p a:hover { color: #ce559a; }
.list-meatless .list-body strong { display: block; position: relative; margin-top: 10px; padding-top: 10px; color: #007481; font-weight: normal; }
.list-meatless .list-body strong a { color: #007481; }
.list-meatless .list-body strong a:hover { color: #007481; }
.list-meatless .list-body strong:before { content: ' '; width: 90px; height: 3px; position: absolute; left: 50%; top: 0; background-color: #ffb718; margin-left: -45px; }
.list-meatless li:nth-child(1) .list-image-secondary { width: 240px; left: -111px; top: -72px; }
.list-meatless li:nth-child(6) .list-image-secondary { width: 191px; right: -130px; top: 124px; }
.list-meatless li:nth-child(16) .list-image-secondary { width: 245px; left: -110px; top: -151px; }
.list-meatless li:nth-child(21) .list-image-secondary { width: 187px; right: -130px; top: -122px; }
.list-meatless li:nth-child(27) .list-image-secondary { width: 389px; right: -263px; top: -200px; }
.list-meatless li:nth-child(31) .list-image-secondary { width: 444px; left: -86px; top: -110px; }

/* ------------------------------------------------------------ *\ 
	Media
\* ------------------------------------------------------------ */

@media only screen and (max-width: 960px) {
	.list-meatless li:nth-child(7):before, 
	.list-meatless li:nth-child(13):before, 
	.list-meatless li:nth-child(19):before, 
	.list-meatless li:nth-child(25):before, 
	.list-meatless li:nth-child(31):before { top: -261px; }

	.list-meatless li:nth-child(6n) .list-head:before { top: -214px; }

	.list-meatless li:nth-child(13):before { top: -237px; bottom: 212px; }
	.list-meatless li:nth-child(19):before { top: -237px; bottom: 259px; }
	.list-meatless li:nth-child(24) .list-head:before { top: -262px; }
	.list-meatless li:nth-child(25):before { bottom: 235px; }
	.list-meatless li:nth-child(30):before { top: -261px; }
	.list-meatless li:nth-child(31):before { bottom: 236px; top: -238px; }
	.list-meatless li:nth-child(36) .list-head:before { top: -237px; }

	.list-meatless li:nth-child(1) .list-image-secondary { left: -149px; }
	.list-meatless li:nth-child(6) .list-image-secondary { top: 182px; right: -148px; }
	.list-meatless li:nth-child(16) .list-image-secondary { left: -190px; top: -102px; }
	.list-meatless li:nth-child(27) .list-image-secondary { right: -303px; top: -175px; }
	.list-meatless li:nth-child(31) .list-image-secondary { left: -125px; top: -87px; }
	.list-meatless .list-body { padding: 0 10px; }
	
}

@media only screen and (max-width: 760px) {

	.desktop { display: none !important; }
	.mobile { display: block !important; }

	/* ------------------------------------------------------------ *\ 
		Sections
	\* ------------------------------------------------------------ */

	.section-meatless .section-body { padding: 0 20px; }

	/* ------------------------------------------------------------ *\ 
		Lists
	\* ------------------------------------------------------------ */
	
	.list-meatless ul { padding: 0; }
	.list-meatless li { padding: 0 0 20px 0; width: 100%; }
	.list-meatless li:before,
	.list-meatless li:after { display: none; }
	.list-meatless li:nth-child(3n) .list-image-primary,
	.list-meatless li:nth-child(7) .list-image-primary, 
	.list-meatless li:nth-child(13) .list-image-primary, 
	.list-meatless li:nth-child(22) .list-image-primary { margin: 0 -20px; }
	.list-meatless li:nth-child(3n+1) .list-head:after,
	.list-meatless li:nth-child(6n) .list-head:after,
	.list-meatless li:nth-child(9) .list-head:after,
	.list-meatless li:nth-child(6n) .list-head:after, 
	.list-meatless li:nth-child(21) .list-head:after,
	.list-meatless li:nth-child(33) .list-head:after, 
	.list-meatless li:nth-child(27) .list-head:after { left: -20px; right: -20px; }
	.list-meatless li:nth-child(9) .list-head:before, 
	.list-meatless li:nth-child(21) .list-head:before, 
	.list-meatless li:nth-child(33) .list-head:before,
	.list-meatless li:nth-child(29) .list-head:before,
	.list-meatless li:nth-child(24) .list-head:before,
	.list-meatless li:nth-child(6n) .list-head:before,
	.list-meatless .list-head:before,
	.list-meatless li.list-arrow-right .list-head:before { left: auto; top: auto; right: 50%; margin-right: -13px; bottom: -13px; background: url(../images/meatless/ico-heart.png) no-repeat 0 0; width: 26px; height: 22px; background-size: 26px 22px; }

	.list-meatless .list-image-secondary { display: none; }
}