input, select, textarea {
	font-family: 'muli_regular';
	border: none;
	outline: none;
	background: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}
input[type=submit], input[type=button] {
	cursor: pointer;
}
textarea {
	resize: none;
}

.roundedBtn {
	display: inline-block;
	font: 1.4em 'muli_bold';
	padding: 1em 3.5em;
	border-radius: 1.6em;
	-webkit-border-radius: 1.6em;
	-moz-border-radius: 1.6em;
}
.roundedBtn.white {
	background: #fff;
	color: var(--primary-color);
}
.roundedBtn.dark {
	background: var(--primary-color);
	color: #fff;
}
.roundedBtn.light {
	background: var(--secondary-color);
	color: #fff;
}
.roundedBtn.white:hover, .roundedBtn.dark:hover, .roundedBtn.white.active, .roundedBtn.dark.active {
	background: var(--secondary-color);
	color: #fff;
}
.roundedBtn.light:hover, .roundedBtn.light.active {
	background: var(--primary-color);
	color: #fff;
}

article {
	font-size: 1.2em;
	color: var(--primary-color);
}
article p:not(:first-child), article ul:not(:first-child), article ol:not(:first-child), article h1:not(:first-child), article h2:not(:first-child), article h3:not(:first-child), article h4:not(:first-child), article h5:not(:first-child), article h6:not(:first-child) {
	margin-top: 1.4em;
}
article a {
	color: var(--secondary-color);
	display: inline-block;
	text-decoration: underline;
}
article a:hover {
	text-decoration: none;
}
article ul li, article ol li {
	margin-left: 1.3em;
}
article ul li {
	list-style: disc;
}
article img, article iframe {
	max-width: 100%;
}
article h1, article h2 {
	font-family: 'muli_black';
}
article h1 {
	font-size: 1.4em;
}
article h2 {
	font-size: 1.3em;
}
article h3, article h4, article h5, article h6 {
	font-family: 'muli_bold';
}
article h3 {
	font-size: 1.2em;
}
article h4 {
	font-size: 1.1em;
}
article h5, article h6 {
	font-size: 1em;
}

header {
	position: relative;
	z-index: 500;
	background: var(--primary-color);
	text-align: center;
	color: #fff;
	padding: 2.1em 0;
}
header.fixedNav {
	margin-bottom: 11em;
}
header p:not(:first-child) {
	display: none;
}

#navContainer {
	width: 100%;
	position: relative;
	z-index: 10;
}
#navContainer.fixed {
	position: fixed;
	top: 0;
	left: 0;
}

nav {
	height: 11em;
	background: #fff;
	position: relative;
	z-index: 1000;
}
nav .container, nav a.logo, nav ul, nav ul a, nav .btns, nav .btns a {
	height: 100%;
}
nav a.logo {
	float: left;
	width: 9.2%;
	min-width: 75px;
	position: relative;
}
nav ul {
	float: left;
	margin-left: 16%;
}
nav ul a, nav .mobileMenuBtnContainer a {
	font: 1.4em 'muli_bold';
	color: var(--primary-color);
}
nav ul a {
	float: left;
	margin-right: 3.5em;
}
nav ul a:nth-last-child(2) {
	margin-right: 0;
}
nav ul a:hover, nav ul a.active {
	color: var(--secondary-color);
}
nav .btns {
	float: right;
	position: relative;
}
nav .btns a {
	float: left;
	width: 5em;
	margin-right: 1.2em;
}
nav .btns a:nth-last-child(2) {
	margin-right: 0;
}
nav .mobileMenuBtnContainer {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	text-align: center;
}
nav .mobileMenuBtnContainer a {
	height: 100%;
	display: inline-block;
	padding-right: 30px;
	background: url(../images/mobile_nav_icon.png) right center no-repeat;
}

#searchForm {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	z-index: 250;
	background: var(--primary-color);
	padding: 4em 0;
	transform: translate(0,-110%);
	-webkit-transform: translate(0,-110%);
	-moz-transform: translate(0,-110%);
	-ms-transform: translate(0,-110%);
	-o-transform: translate(0,-110%);
}
#searchForm.active {
	transform: translate(0,0);
	-webkit-transform: translate(0,0);
	-moz-transform: translate(0,0);
	-ms-transform: translate(0,0);
	-o-transform: translate(0,0);	
}
#searchForm input[type=text], #searchForm select {
	float: left;
	font-size: 1.4em;
	padding: 1em 0;
}
#searchForm input[type=text] {
	width: 55%;
	font-size: 1.4em;
	color: #fff;
}
#searchForm select {
	width: 15%;
	color: var(--secondary-color);
	background-image: url(../images/dropdown_arrow.png);
	background-position: right center;
	background-repeat: no-repeat;
}
#searchForm input[type=submit] {
	float: right;
}

nav, #searchForm {
	box-shadow: 0 .3em .3em rgba(0,0,0,.4);
	-webkit-box-shadow: 0 .3em .3em rgba(0,0,0,.4);
	-moz-box-shadow: 0 .3em .3em rgba(0,0,0,.4);
}

.products .title, #productListing menu .title {
	font: 1.7em 'muli_bold';
	margin-bottom: .8em;
}
.products ul {
	position: relative;
}
.products ul a {
	float: left;
	margin-bottom: 3.7em;
	box-shadow: 0 2px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: 0 2px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 2px 2px rgba(0,0,0,.2);
	border-radius: .6em;
	-webkit-border-radius: .6em;
	-moz-border-radius: .6em;
	overflow: hidden;
}
.products ul.four a {
	width: 22%;
	margin-right: 4%;
}
.products ul.four a:nth-child(4n) {
	margin-right: 0;
}
.products ul.three a {
	width: 30%;
	margin-right: 5%;
}
.products ul.three a:nth-child(3n) {
	margin-right: 0;
}
.products ul a .imgContainer {
	position: relative;
	background-position: center;
	background-size: cover;
}
.products ul a .imgContainer .viewDetails {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background: rgba(0,0,0,.6);
	opacity: 0;
	-webkit-opacity: 0;
	-moz-opacity: 0;
}
.products ul a .imgContainer .viewDetails .roundedBtn {
	opacity: 0;
	-webkit-opacity: 0;
	-moz-opacity: 0;
	transform: translate(0,20px);
	-webkit-transform: translate(0,20px);
	-moz-transform: translate(0,20px);
	-ms-transform: translate(0,20px);
	-o-transform: translate(0,20px);
	transition-delay: .2s;
	-webkit-transition-delay: .2s;
	-moz-transition-delay: .2s;
	-o-transition-delay: .2s;
}
.products ul a .imgContainer .viewDetails .roundedBtn:hover {
	background: var(--secondary-color);
	color: #fff;
}
.products ul a:hover .viewDetails, .products ul a:hover .imgContainer .viewDetails .roundedBtn {
	opacity: 1;
	-webkit-opacity: 1;
	-moz-opacity: 1;
}
.products ul a:hover .imgContainer .viewDetails .roundedBtn {
	transform: translate(0,0);
	-webkit-transform: translate(0,0);
	-moz-transform: translate(0,0);
	-ms-transform: translate(0,0);
	-o-transform: translate(0,0);
}
.products ul a .labelInfo {
	height: 9.5em;
	padding: 2.5em 1.4em 0;
	overflow: hidden;
}
.products ul a h2, .products ul a .weight {
	display: inline-block;
	font-size: 1.8em;
}
.products ul a h2 {
	font-family: 'muli_bold';
	color: var(--primary-color);
	margin-right: .5em;
}
.products ul a .weight {
	color: var(--secondary-color);
}
.products ul a article {
	margin-top: .4em;
}
.products ul .clear {
	clear: left;
}
.products ul .loading {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 5em;
	height: 5em;
	margin-left: -2.5em;
	background: url(../images/loading_icon.gif) center no-repeat;
	background-size: 100%;
}

#newsletter {
	background: #cbe4ba;
	text-align: center;
	padding: 4em 0;
}
#newsletter .txt, #newsletter form {
	display: inline-block;
}
#newsletter .txt {
	margin-right: 1.5em;
	margin-top: .2em;
	margin-bottom: .2em;
}
#newsletter form input[type=email], #newsletter form input[type=submit] {
	display: inline-block;
}
#newsletter form input[type=email] {
	border: 1px solid #c5cbc2;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	font-size: 1.4em;
	width: 24em;
	color: var(--primary-color);
	padding: .66em 1em;
	background: #fff;
	margin-right: .66em;
}
#newsletter form .outputMsg {
	position: absolute;
	right: 0;
	bottom: -2em;
	font-size: 1.4em;
	text-align: right;
}

footer {
	height: 9.5em;
}
footer .container, footer a.logo, footer .copyrights, footer .social, footer .social a {
	height: 100%;
}
footer a.logo {
	width: 6em;
	float: left;
}
footer .copyrights {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	text-align: center;
}
footer a.logo, footer .social {
	position: relative;
	z-index: 10;
}
footer .social {
	float: right;
}
footer .social a {
	display: inline-block;
	width: 3em;
}
footer .social a:not(:last-child) {
	margin-right: 1em;
}

#productListing menu {
	float: left;
	width: 23%;
	background: #f4f4f4;
	padding: 2em;
}
#productListing menu ul a {
	height: 2.5em;
	padding-left: 3.2em;
	font-size: 1.4em;
	color: var(--primary-color);
	background: url(../images/radio_inactive.png) left center no-repeat;
	background-size: auto 100%;
	margin-top: .8em;
}
#productListing menu ul a:not(.active):hover {
	color: var(--secondary-color);
}
#productListing menu ul a.active {
	font-family: 'muli_black';
	background-image: url(../images/radio_active.png);
}
#productListing section {
	float: right;
	width: 74%;
}

#productDetails .left {
	float: left;
	width: 28%;
}
#productDetails .right {
	float: right;
	width: 69%;
	background: #f5f5f5 url(../images/product_info_bg.png) left bottom no-repeat;
	padding: 1.6em;
}
#productDetails .left img, #productDetails .left .nutrition, #productDetails .right {
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	overflow: hidden;
}
#productDetails .left .nutrition {
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
#productDetails .left .nutrition ul li {
	padding: 1em;
}
#productDetails .left .nutrition ul li:nth-child(odd) {
	background: #eef2eb;
}
#productDetails .left .nutrition ul li:nth-child(even) {
	background: #fff;
}
#productDetails .left .nutrition ul li .block {
	float: left;
	width: 33.33%;
}

#static {
	padding-top: 5.5em;
}
#static .container {
	background: #f4f4f4 url(../images/about_bg.png) right top no-repeat;
	background-size: auto 100%;
	padding: 2.5em 3em;
	border-radius: .5em;
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
}
#static .title {
	font: 2.8em 'muli_black';
	margin-bottom: .6em;
}
#static article {
	width: 62%;
}
#static form {
	width: 51%;
	margin-top: 2em;
}
#static form input[type=text], #static form input[type=email], #static form input[type=tel], #static form textarea {
	width: 100%;
	border: 1px solid #cecece;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	font-size: 1.2em;
	padding: .5em 1em;
	background: #fff;
}
#static form textarea {
	height: 12em;
}
#static form .inputContainer {
	margin-bottom: 1.2em;
}
#static form .inputContainer .half {
	width: 48%;
}
#static form .inputContainer .half:first-child {
	float: left;
}
#static form .inputContainer .half:nth-child(2) {
	float: right;
}
#static form input[type=submit] {
	float: left;
}
#static form .outputMsg {
	float: right;
	font: 1.4em 'muli_bold';
	padding-top: 1em;
	color: var(--secondary-color);
}

#partners {
	text-align: center;
}
#partners a {
	display: inline-block;
	width: 17.5%;
	margin-right: 3.125%;
	margin-bottom: 4em;
	padding: 1.5em 3.5em;
	border: 1px solid #f7f7f7;
	border-bottom-left-radius: .7em;
	-webkit-border-bottom-left-radius: .7em;
	-moz-border-bottom-left-radius: .7em;
	border-bottom-right-radius: .7em;
	-webkit-border-bottom-right-radius: .7em;
	-moz-border-bottom-right-radius: .7em;
}
#partners a:hover {
	border-color: var(--primary-color);
}
#partners a:nth-child(5n) {
	margin-right: 0;
}

a.whatsapp {
	position: fixed;
	right: 1em;
	bottom: 2em;
	width: 8em;
	z-index: 1000;
	transform: translate(12em, 0);
	-webkit-transform: translate(12em, 0);
	-moz-transform: translate(12em, 0);
	-ms-transform: translate(12em, 0);
	-o-transform: translate(12em, 0);
}
a.whatsapp.active {
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	-moz-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
}
a.whatsapp .chat {
	position: absolute;
	right: 8em;
	top: 50%;
	width: 15em;
	margin-top: -3.3em;
	transform: translate(50%, 0);
	-webkit-transform: translate(50%, 0);
	-moz-transform: translate(50%, 0);
	-ms-transform: translate(50%, 0);
	-o-transform: translate(50%, 0);
	opacity: 0;
	-webkit-opacity: 0;
	-moz-opacity: 0;
}
a.whatsapp:hover .chat, a.whatsapp .chat.active {
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	-moz-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	opacity: 1;
	-webkit-opacity: 1;
	-moz-opacity: 1;
}
a.whatsapp.bottom {
	bottom: 12em;
}

#credits {
	height: 5em;
	background: #f1f1f1;
}
#credits .container, #credits .block, #credits .block .txt, #credits .block a {
	height: 100%;
}
#credits .block {
	font-size: 1em;
}
#credits .designed {
	float: left;
}
#credits .developed {
	float: right;
}
#credits .block .txt, #credits .block a {
	display: inline-block;
}
#credits .block .txt {
	margin-right: 5px;
}


@media screen and (max-width:1024px) {
	nav ul {
		margin-left: 8%;
	}
	nav ul a {
		margin-right: 1.7em;
	}
}

@media screen and (max-width:768px) {
	.products ul.four a {
		width: 30.66%;
	}
	.products ul.four a:nth-child(4n) {
		margin-right: 4%;
	}
	.products ul.four a:nth-child(3n) {
		margin-right: 0;
	}
	.products ul.three a {
		width: 47.5%;
	}
	.products ul.three a:nth-child(3n) {
		margin-right: 5%;
	}
	.products ul.three a:nth-child(2n) {
		margin-right: 0;
	}
}

@media screen and (max-width:740px) {
	nav .mobileMenuBtnContainer {
		display: block;
	}
	nav ul, nav ul a {
		height: auto;
	}
	nav ul {
		float: none;
		margin-left: 0;
		position: absolute;
		top: 100%;
		left: -5%;
		width: 110%;
		background: #fff;
		box-shadow: 0 .3em .3em rgba(0,0,0,.4);
		-webkit-box-shadow: 0 .3em .3em rgba(0,0,0,.4);
		-moz-box-shadow: 0 .3em .3em rgba(0,0,0,.4);
		transform: translate(-105%,0);
		-webkit-transform: translate(-105%,0);
		-moz-transform: translate(-105%,0);
		-ms-transform: translate(-105%,0);
		-o-transform: translate(-105%,0);
	}
	nav ul.active {
		transform: translate(0,0);
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-o-transform: translate(0,0);
	}
	nav ul a {
		float: none;
		text-align: center;
		margin-right: 0;
		padding: .6em 0;
		border-bottom: 1px solid var(--primary-color);
	}
	nav ul a:nth-last-child(2) {
		margin-right: 0;
		border-bottom: none;
	}
	#searchForm {
		padding: 2em 0;
	}
	#searchForm input[type=text], #searchForm select, #searchForm input[type=submit] {
		float: none;
	}
	#searchForm input[type=text], #searchForm select {
		width: 100%;
	}
	#searchForm input[type=submit] {
		display: block;
		width: 100%;
		max-width: 350px;
		margin: 0 auto;
	}
	#static article, #static form {
		width: auto;
	}
	#partners a {
		width: 31.25%;
	}
	#partners a:nth-child(5n) {
		margin-right: 3.125%;
	}
	#partners a:nth-child(3n) {
		margin-right: 0;
	}
}

@media screen and (max-width:640px) {
	.products ul.four a {
		width: 48%;	
	}
	.products ul.four a:nth-child(3n) {
		margin-right: 4%;
	}	
	.products ul.four a:nth-child(2n) {
		margin-right: 0;
	}
	.products ul a .labelInfo {
		padding-top: 1.4em;	
	}
	.products .loadMore {
		text-align: center;
	}
	#newsletter .txt, #newsletter form, #newsletter form input[type=email], #newsletter form input[type=submit] {
		display: block;
	}
	#newsletter .txt {
		margin-right:0;
		margin-top: 0;
		margin-bottom: .5em;
	}
	#newsletter form input[type=email] {
		width: 100%;
	}
	#newsletter form input[type=submit] {
		width: 100%;
		max-width: 350px;
		margin: .5em auto 0;
	}
	#newsletter form .outputMsg {
		position: static;
		text-align: center;
		margin-top: .5em;
	}
	.btnsContainer {
		text-align: center;
	}
	#productListing menu, #productListing section {
		float: none;
		width: auto;
	}
	#productListing menu {
		text-align: center;
		margin-bottom: 2em;
	}
	#productListing menu ul a {
		display: inline-block;
		margin-left: .8em;
		margin-right: .8em;
	}
	#productDetails .left, #productDetails .right {
		float: none;
		width: auto;
	}
	#productDetails .right {
		margin-top: 2em;
	}
	#productDetails .left {
		max-width: 450px;
		margin: 0 auto;
	}
	#static form .inputContainer .half, #static form .inputContainer .half:first-child, #static form .inputContainer .half:nth-child(2), #static form input[type=submit], #static form .outputMsg {
		width: 100%;
		float: none;
	}
	#static form .inputContainer .half:first-child {
		margin-bottom: 1em;
	}
	#static form input[type=submit] {
		margin: 0 auto;
		width: 100%;
		max-width: 350px;
	}
	#static form .outputMsg {
		text-align: center;
	}
}

@media screen and (max-width:425px) {
	footer {
		height: auto;
		padding: 2.5em 0;
		text-align: center;
	}
	footer .container, footer a.logo, footer .copyrights, footer .social, footer .social a {
		height: auto;
	}
	footer a.logo, footer .social {
		float: none;
	}
	footer a.logo {
		margin: 0 auto;
	}
	footer .copyrights {
		position: static;
		padding: 2em 0;
	}
	footer a.logo, footer .social {
		position: relative;
		z-index: 10;
	}
	#partners a {
		padding-left: 1.5em;
		padding-right: 1.5em;
	}
	#credits, #credits .container {
		height: auto;
	}
	#credits .block {
		height: 5em;
	}
	#credits .designed, #credits .developed {
		float: none;
		text-align: center;
	}
}



