input:focus, a:focus, textarea:focus, button:focus{
    outline: 0;
}
@font-face{
	src: url('fonts/Roboto-Regular.ttf');
	font-family: 'Roboto-Regular';
}
@font-face{
	src: url('fonts/Magnificent.ttf');
	font-family: 'Magnificent';
}
@font-face{
	src: url('fonts/DK-Lemon-Yellow-Sun.otf');
	font-family: 'DK-Lemon-Yellow-Sun';
}
@font-face{
	src: url('fonts/BebasNeue-Regular.ttf');
	font-family: 'BebasNeue-Regular';
}
@font-face{
	src: url('fonts/Omnes-Regular.otf');
	font-family: 'Omnes-Regular';
}
@font-face{
	src: url('fonts/Omnes-Semibold.otf');
	font-family: 'Omnes-Semibold';
}
@font-face{
	src: url('fonts/Gotham-Black.otf');
	font-family: 'Gotham-Black';
}
@font-face{
	src: url('fonts/GothamRnd-Book.otf');
	font-family: 'GothamRnd-Book';
}
.btnicon #wrapper{
	display: none;
}
html {
	scroll-behavior: smooth;
}
body{
	font-family: 'DK-Lemon-Yellow-Sun';
	margin: 0;
	font-size: 15px;
	background: #fff url(../img/background.png);

}
.columns, .center{
	display: flex;
	justify-content: center;
}
#wrapper{
	min-width: 1200px;
	max-width: 1200px;
}
ul{
	list-style: none;
	padding: 0;
	margin: 0;
}
a{
	text-decoration: none;
}
header{
	padding: 80px 0;
	position: relative;
	z-index: 1;
}
header input[type="checkbox"] {
	display: none;
}
header div.log{
	width: 100%;
	height: 2px;
}
div.log img{
	width: 180px;
	position: relative;
	margin: -58px 0 0 0;
}
ul#menu{
	border-top: solid 10px #83c347;
	font-size: 25px;
	background: #fff;
}
ul#menu ul.logo{
	max-width: 200px;
}
ul#menu ul{
	flex:1;
}
ul#menu ul li{
	flex: 1;
	background: #fff;
	border-right: solid 1px gray;
}
ul#menu li:last-child{
	border: none;
}
ul#menu li a{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 50px;
	background: #fff;
	color: #4f625c;
	transition: all .5s;
}
ul#menu li a:hover{
	background: rgba(0,0,0,.05);
}
ul#menu  li ul.submenu a{
	justify-content: flex-start;
	padding: 0 20px;
	text-align: left;
	height: 60px;
}
ul.submenu{
	position: absolute;
	max-width: 175px;
	min-width: 175px;
	opacity: 0;
	visibility: hidden;
	transition: all .2s;
	height: 0px;
	z-index: 2;
}
ul#menu ul.submenu li{
	border: none;
}
ul.submenu li{
	border-bottom: solid 1px rgba(0,0,0,.05);
	text-align: center;
	line-height: 25px;
}
ul.submenu li:last-child{
	border: none;
}
ul.sub-submenu{
	position: absolute;
	margin: -60px 0 0 175px;
	max-width: 180px;
	min-width: 180px;
	height: 0px;
	opacity: 0;
	visibility: hidden;
	transition: all .5s;
}
ul li:hover ul.submenu{
	opacity: 1;
	visibility: visible;
	height: auto;
}
ul li ul.submenu li:hover ul.sub-submenu{
	opacity: 1;
	visibility: visible;
	height: auto;
}
main{
	margin: -80px 0 0 0;
}
#slider{
	background: #fff url(../img/background-green.png);
	padding: 100px 0 0 0;
}
#intro{
	background: #fff url(../img/background-green.png);
	padding: 50px 0;
	color: #fff;
}
#intro article:first-child img{
	height: 130px;
	position: absolute;
	margin: -40px 0 0 -100px;
}
#intro article:first-child img.detal{
	margin: -40px 0 0 0;
}
.title{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	text-transform: uppercase;
	font-family: 'Gotham-Black';
	padding: 30px 0;
}
.title h1{
	font-size: 50px;
	line-height: 45px;
	margin: 0 0 20px 0;
}
.title h1 o{
	padding: 10px;
}
.title h1 o:last-child{
	padding: 10px 0 5px 0;
}
.title img{
	max-width: 100px;
}
#intro .title{
	padding: 0;
}
#intro p{
	max-width: 880px;
	font-size: 30px;
	line-height: 30px;
	text-align: center;
	margin: 0;
	border-top: dotted 3px #fff;
	padding: 10px 0 0 0;
}
#intro p span{
	color: #004500;
	font-family: 'BebasNeue-Regular';
	font-weight: bolder;
}
#aboutus {
	background-color: #fff;
	width: 100%;
}
#aboutus .imagen {
	display: block;
	width: 100%;
	text-align: center;
}
#aboutus .imagen img {
	display: block;
	margin: auto;
	width: 100%;
	max-width: 1200px;
}
#aboutus .franja-verde {
	background: #83c347 url('../img/background-green.png') repeat-x center center;
	background-size: auto 100%;
	height: 20px;
	width: 100%;
}
#products{
	padding: 0 0 130px 0;
}
#products div.hoja-superior{
	justify-content: flex-end;
}
#products div.hoja-superior img{
	position: absolute;
	margin: -175px 0 0 0;
	max-width: 300px;
}
#products div.hoja-inferior{
	justify-content: flex-start;
}
#products div.hoja-inferior img{
	position: absolute;
	margin: -48px 0 0 0;
	max-width: 300px;
}
#products div.hoja-inferior-2{
	justify-content: flex-end;
}
#products div.hoja-inferior-2 img{
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
}
#products p.descrip{
	margin: -40px 0 60px 0;
	font-size: 24px;
	color: #444444;
	font-family: 'DK-Lemon-Yellow-Sun';
}
#products ul.columns{
	align-items: center;
	margin: 30px 0 0 0;
}
#products ul.columns li{
	flex: 1;
	text-align: center;
	margin: 5px;
	display: flex;
	justify-content: center;
}
#products ul.columns li.sup{
	margin: -70px 0 0 0;
}
#products a{
	color: #fff;
	width: 300px;
	height: 300px;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all .10s;
}
#products a.superfoods{
	background: transparent url(../img/products/superfoods.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.superfoods:hover{
	background: transparent url(../img/products/superfoods-hover.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.rawproducts{
	background: transparent url(../img/products/rawproducts.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.rawproducts:hover{
	background: transparent url(../img/products/rawproducts-hover.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.medicinalherbs{
	background: transparent url(../img/products/medicinalherbs.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.medicinalherbs:hover{
	background: transparent url(../img/products/medicinalherbs-hover.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.naturalextracts{
	background: transparent url(../img/products/naturalextracts.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.naturalextracts:hover{
	background: transparent url(../img/products/naturalextracts-hover.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.grainsseeds{
	background: transparent url(../img/products/grainsseeds.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.grainsseeds:hover{
	background: transparent url(../img/products/grainsseeds-hover.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.freshfruitsvegetables{
	background: transparent url(../img/products/freshfruitsvegetables.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.freshfruitsvegetables:hover{
	background: transparent url(../img/products/freshfruitsvegetables-hover.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.privatelabel{
	background: transparent url(../img/products/privatelabel.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.privatelabel:hover{
	background: transparent url(../img/products/privatelabel-hover.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.qullana{
	background: transparent url(../img/products/qullana.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#products a.qullana:hover{
	background: transparent url(../img/products/qullana-hover.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#certifications{
	background: #fff url(../img/background-green.png);
	color: #04460E;
	padding: 0 0 50px 0;
}
#certifications .sub-title img{
    transform: rotate(-6deg);
    margin: 80px 12px 0 0;
}
#certifications .sub-title img:last-child{
    transform: rotate(6deg);
    margin: 80px 0 0 12px;
}
#certifications p{
	max-width: 90%;
	text-align: center;
	font-size: 25px;
	line-height: 27px;
}
#certifications p.descrip{
	margin: -40px 0 40px 0;
	font-size: 22px;
	font-weight: bolder;
	max-width: 630px;
}
#certifications p.descrip o{
	color: #fff;
	font-family: 'BebasNeue-Regular';
}
#certifications ul{
	color: #fff;
	align-items: flex-end;
}
#certifications ul li.mod{
	border-right: dotted 3px #fff;
	text-align: center;
	flex: 1;
}
#certifications ul li.mod p{
	margin: 0 0 20px 0;
	max-width: 100%;
	font-family: 'BebasNeue-Regular';
}
#certifications ul li.mod:last-child{
	border: none;
}
#certifications ul img{
		height: 80px;
		margin: 0 10px;
}
#processes{
	padding: 0 0 60px 0;
}
#processes .sub-title img{
    transform: rotate(0deg);
    margin: 80px 0 0 0;
}
#processes .sub-title img:last-child{
    transform: rotate(0deg);
}
#processes div.hoja-superior{
	justify-content: flex-end;
}
#processes div.hoja-superior img{
	position: absolute;
	margin: -175px 0 0 0;
	max-width: 300px;
}
#processes .sub-title, #products .sub-title{
	color: #f08302;
}
#processes .sub-title h3, #products .sub-title h3{
    font-size: 55px;
    line-height: 145px;
    margin: 30px 0 0 0;
}
#processes .sub-title o, #products .sub-title o{
	color: #004207;
}
#processes p, #products p{
	max-width: 90%;
	text-align: center;
	font-size: 25px;
	line-height: 27px;
}
#products p{
	font-size: 45px;
	line-height: 45px;
	font-family: 'BebasNeue-Regular';
}
#processes p.descrip{
	margin: -30px 0 40px 0;
	font-size: 28px;
	max-width: 1000px;
	color: #444444;
}
#processes p.descrip-about{
	font-family: 'GothamRnd-Book';
    font-size: 18px;
    margin: 35px 0 0 0;
}
#processes p.descrip-about b{
	font-family: 'Gotham-Black';
	color: #004207;
}
#processes ul.images img{
	width: 100%;
}
#socialvalue{
	background: #fff url(../img/background-green.png);
	color: #004207;
}
#socialvalue .sub-title img:last-child{
    transform: rotate(0deg);
    margin: 70px 0 0 15px;
}
.sub-title{
	font-family: 'Gotham-Black';
	font-size: 40px;
	text-transform: uppercase;
	display: flex;
	justify-content: center;
	margin: 0;
	text-align: center;
}
.sub-title o{
	color: #fff;
}
.sub-title img{
	max-height: 50px;
	margin: 120px 0 0 0;
	transform: rotate(-30deg);
}
.sub-title img:last-child{
    transform: rotate(30deg);
}
#socialvalue article.img img{
	max-width: 350px;
	position: absolute;
	margin: -127px 0 0 0;
}
#socialvalue div#wrapper article:first-child{
	width: 350px;
	height: 100%;
}
#socialvalue div#wrapper article:last-child{
	width: calc(100% - 350px);
	display: flex;
	justify-content: center;
	padding: 0 0 40px 0;
}
#socialvalue div#wrapper article:last-child p{
	max-width: 500px;
	font-size: 25px;
	line-height: 40px;
	text-align: center;
	font-weight: bolder;
}
#socialvalue div#wrapper article:last-child p o{
	color: #fff;
	font-family: 'BebasNeue-Regular';
}
footer{
	background: url('../img/background-footer.png');
	background-repeat: repeat;
	background-position: top center;
	background-size: 100px 100%;
	padding: 80px 0 40px 0;
	margin: -30px 0 0 0;
	color: #fff;
	font-size: 18px;
	font-family: 'Omnes-Regular';
	position: relative;
	z-index: 1;
}
footer div#wrapper{
	align-items: center;
}
footer img{
	max-width: 150px;
	max-height: 150px;
	margin: 0 20px 0 0;
}
footer ul{
	width: calc(100% - 385px);
}
footer ul li{
	text-align: left;
	margin: 5px 0;
}
footer ul li.title{
	text-align: left;
	color: #83c347;
	text-transform: uppercase;
	display: block;
	padding: 0;
	font-family: 'Omnes-Semibold';
	margin: 0 0 0 15px;
}
footer ul li.list-item {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
footer ul li.list-item .footer-icon {
	width: 20px;
	text-align: center;
	margin-right: 5px;
}
footer ul li:last-child{
	margin: 20px 0 0 15px;
}
footer ul li i{
	color: #83c347;
	font-size: 20px;
}
footer ul li a{
	color: #83c347 !important;
}
footer div.marc-peru{
	border-left: dotted 2px #fff;
	border-right: dotted 2px #fff;
	padding: 0 20px;
}
footer div.subir img{
	max-width: 25px;
	margin: 0 0 0 20px;
}

@media screen and (max-width: 1220px){
	#wrapper{
		min-width: 950px;
		max-width: 950px;
	}
	ul#menu{
		font-size: 20px;
	}
	#certifications ul img{
		height: 60px;
		margin: 0 10px;
	}
	#socialvalue article.img img{
		max-width: 250px;
		margin: -64px 0 0 0;
	}
	footer{
		font-size: 15px;
		margin: -12px 0 0 0;
	}
	#products div.bode-superfoods img{
		height: 280px;
	}
	#products div.tabla-superfoods img{
		height: 680px;
	}
	#products div.bode-medicinal-herbs img{
		height: 400px;
	}
	#products div.descrip-medicinal p{
		max-width: 800px;
		font-size: 30px;
	}
	#products div.tabla-medicinal-herbs img{
		height: 600px;
	}
	#categ-tables h3{
	    font-size: 35px;
	}
	#categ-tables p{
	    font-size: 14px;
	}
	#categ-tables article.content p, #categ-tables article.content ul{
	    font-size: 12px;
	}
	#certifications p{
	    font-size: 20px;
	}
    #products a{
    	width: 250px;
    	height: 250px;
    }
}
@media screen and (max-width: 1075px){
    #intro article:first-child img{
        display: none;
    }
}
@media screen and (max-width: 1030px){
    #products a{
    	width: 200px;
    	height: 200px;
    }
    #products p{
        font-size: 30px;
        line-height: 30px;
    }
}
@media screen and (max-width: 980px){
	#wrapper{
		min-width: 95%;
		max-width: 95%;
	}
    #intro article:first-child img{
        display: block;
    }
	header div.log{
	    position:fixed;
	    top: 5px;
	    left: 0;
	    z-index: 9999;
	    height: 2px;
	}
	div.log img{
	    width: 70px;
	    margin: 0;
	    transition: all .5s;
	}
	ul#menu{
	    border-top: solid 5px #83c347;
	}
	ul#menu, input.btn, .btnicon #wrapper{
		display: block;
	    position: fixed;
	    width: 100%;
	    height: 60px;
	    top: 0;
	    z-index: 999;
	    background: white;
	}
	ul#menu ul li{
	    border: 0;
	}
	input.btn, input.btnsubmenu, input.btnsubsubmenu{
	    display: block;
	    right: 0;
	    width: 150px;
	    height: 65px;
    	appearance: none;
    	-webkit-appearance: none;
    	-moz-appearance: none;
    	-o-appearance: none;
    	z-index: 999999;
    	background: transparent;
    	margin: 0;
    	cursor: pointer;
	}
	input.btnsubmenu, input.btnsubsubmenu{
	    position: absolute;
	    height: 50px;
	    margin: -50px 0 0 0;
	}
	input.btnsubsubmenu{
	    height: 60px;
	    margin: -60px 0 0 0;
	}
	ul#menu #wrapper{
	    display: block;
	    position: absolute;
	    opacity: 0;
	    top: -100vh;
	    height: auto;
	    width: 100%;
	    max-width: 100%;
	    min-width: 100%;
	    overflow: overlay;
	    background: #fff;
	    transition: all .5s;
	}
	header input[type="checkbox"] {
		display: block;
	}
	.btnicon, ul#menu ul.columns{
	    display: block;
	}
	.btnicon #wrapper{
	    display: flex;
	    justify-content: flex-end;
	    align-items: center;
	    z-index: 9999;
	    height: 65px;
	    background: transparent;
	}
	.btnicon #wrapper i{
	    margin: 0 0 0 20px;
	    width: 40px;
	    height: 40px;
	    background: #83c347;
	    color: #fff;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    border-radius: 10px;
	    transition: all .5s;
	}
	.btnsubicon{
	    position: absolute;
	    right: 5%;
	    width: 40px;
	    height: 40px;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    margin: -45px 0 0 0;
	    transform: rotate(90deg);
	    background: #83c347;
	    color: #fff;
	    border-radius: 10px;
	    transition: all .5s;
	}
	ul.submenu, ul.sub-submenu{
	    max-width: 100%;
	    min-width: 100%;
    	margin: 0;
    	display: none;
	}
	ul#menu  li ul.submenu a{
	    justify-content: center;
	    background: rgba(0,0,0,.1);
	}
	ul#menu  li ul.submenu li ul.sub-submenu a{
	    background: rgba(0,0,0,.05);
	}
    ul li ul.submenu, ul li:hover ul.submenu, ul li ul.submenu li:hover ul.sub-submenu{
    	opacity: 0;
    	visibility: hidden;
    	height: 0px;
    	display: none;
    }
	.btn[type="checkbox"]:checked ~ ul#menu #wrapper{
	    top: 60px;
	    opacity: 1;
	}
	.btn[type="checkbox"]:checked ~ div.log img{
	    width: 60px;
	}
	.btn[type="checkbox"]:checked ~ .btnicon #wrapper i{
	    background: #f9a128;
	    transform: rotate(360deg);
	}
	.btnsubmenu[type="checkbox"]:checked ~ ul.submenu{
	    display: block;
	    position: relative;
	    opacity: 1;
	    visibility: visible;
	}
	.btnsubmenu[type="checkbox"]:checked ~ .btnsubicon{
	    transform: rotate(270deg);
	    background: #f9a128;
	}
	.btnsubsubmenu[type="checkbox"]:checked ~ ul.sub-submenu{
	    display: block;
	    position: relative;
	    opacity: 1;
	    visibility: visible;
	    height: auto;
	}
	.btnsubsubmenu[type="checkbox"]:checked ~ .btnsubicon{
	    transform: rotate(270deg);
	    background: #f9a128;
	}
	main{
	    margin: -95px 0 0 0;
	}
	#certifications ul, footer div#wrapper, #form #wrapper, div.modulos, div.options{
	    display: block;
	    margin: 0;
	}
	#products ul.columns, #certifications ul.columns.brands {
		margin: 0;
		display: flex;
		flex-wrap: wrap;
	}
	#certifications {
		padding-top: 40px;
	}
	#certifications p.descrip {
		margin: 0 0 30px;
	}
	#products ul.columns li, #products ul.columns li.sup{
	    margin: 0;
	    width: calc(100%/2.02);
	    display: inline-block;
	    text-align: center;
	}
	#products ul.columns li.sup{
	    position: relative;
	    top: -20px;
	}
	#products ul.columns li a{
	    position: relative;
	    left: calc(50% - 110px);
	    width: 180px;
	    height: 180px;
	}
	.title h1, .sub-title, div.modulos ul li:first-child, div.parraf div.encabe h4, div.options h4{
	    font-size: 25px;
	    display: block;
	}
	#products div.super-foods-title, #products div.medicinal-herbs-title, #products div.grains-seeds-title h3{
	    font-size: 35px;
	    line-height: 40px;
	}
	#products div.medicinal-herbs-title{
	    line-height: 30px;
	}
	.sub-title img{
	    max-height: 30px;
	}
	#intro article:first-child img{
	    height: 80px;
	    margin: -40px 0 0 -40px;
	}
	#intro p{
	    max-width: 500px;
	}
	#products div.hoja-superior img, #products div.hoja-inferior img, #processes div.hoja-superior img, #socialvalue div#wrapper article:first-child, footer div.subir, footer div.img, .sub-title img{
	    display: none;
	}
	#products p.descrip{
	    margin: -30px 0 50px 0;
	}
	#certifications ul li.mod{
	    border: none;
	    margin: 0 0 40px 0;
	}
	#socialvalue div#wrapper article:last-child, footer div, footer ul, #form article, div.modulos ul{
	    width: 100%;
	}
	#socialvalue {
		padding-top: 40px;
	}
	footer{
	    margin: -20px 0 0 0;
	}
	footer div.marc-peru{
	    margin: 40px 0 0 0;
	    padding: 0;
	    display: flex;
	    justify-content: center;
	    border: 0;
	}
	footer div.marc-peru img{
	    height: 50px;
	}
}
@media screen and (max-width: 500px){
	.title h1 {
		font-size: 25px;
		line-height: 35px;
	}
    #intro article:first-child img, #intro article:first-child img.detal{
        display: none;
    }
    #products ul.columns li, #products ul.columns li.sup{
        width: 100%;
        margin: 0 0 30px 0;
        display: flex;
        justify-content: center;
    }
    #products ul.columns li.sup{
        top: 0;
    }
    #products ul.columns li a{
        left: 0;
    }
    #products .sub-title h3, #processes .sub-title h3 {
        font-size: 30px;
        line-height: 30px;
        margin: 30px 0;
    }
	#processes p.descrip {
		margin: 0 0 30px;
	}
    .back-our-processes, .back-our-products{
        height: 150px;
    }
    #products p.descrip{
        font-size: 15px;
        margin: 0 0 20px 0;
    }
}
