*{box-sizing:border-box;}
body{margin:0; font-family: 'Roboto', sans-serif; font-size:17px;line-height:1.5;color:#333;overflow-x:hidden;letter-spacing:1px;}



.header-section {position:relative; top:35px;z-index:10; display: table; width: 100%; height:44px; background:#99cc00; background-image: radial-gradient(circle closest-corner,yellow, #99cc00, #99cc00);box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5), 0 3px 10px 0 rgba(0, 0, 0, 0.22);border-radius:15px 15px 0 0;}
.fullscreen-video-wrap{position:relative;top:80px;left:0;width:100%;/*overflow:hidden; z-index:-1; */ right: 0; height: 100%; }

.fullscreen-video-wrap video{min-width:99%;min-height:100%;}

.header-overlay{position: absolute; width: 100%; z-index: 30;}
.banner{position:relative;  /*max-width: 970px;*/ height: 410px;}


.grid-container {
  display: grid;
grid-template-columns: auto auto auto auto;
  grid-gap:0px;

  padding: 5px;
}
.grid-container > div {

  text-align: center;
  padding:  0;
  font-size: 20px;
  letter-spacing:0;
    padding: 5px;
}
.grid-container > div > ul > li {margin-bottom:7px;}

.item1 {

  grid-column-start: 1;
  grid-column-end: 3;
  background-color:#92d050;
}
.item2 {
	
  grid-column-start: 3;
  grid-column-end: 5;
  background-color:#5c0000;
  color:#fff;
}
.item7 {
  grid-column-start: 1;
  grid-column-end: 5;
}
.item7 h4{font-size:16px;color:red;}

.logo-overlay{
	display:block;
	height:140px;width:220px;
	position:absolute;
	top:0px;
	right:0;
	left:0;
	margin:auto;
	z-index:29;
	background-image:url("../images/logo.png"); 
	background-repeat: no-repeat; 
	background-size: 100%;
background-position: top center;
	}
.top-space{margin-top:40px;position:relative;}
.top-space-healthy, .top-space-olive, .top-space-story{margin-top:80px;position:relative;}

.imgContainer{position:relative;width:70%;margin: 0 auto;}	
#gmo{position:absolute;bottom:20px;right:20px;width:200px;}
.image-overlay{
width: 100%;
	position:absolute;
	height:100%;
	z-index:1000;
	background-image:url("../images/Premium_Front_Silver3.png"); 
	background-repeat: no-repeat; 
	bottom:0;
	right:13px;
	background-position: bottom right;
	background-size: 25%;
	z-index: 1;
	}
.header-text{font-family:'Bree Serif', serif;text-align:center; position: absolute;  z-index: 2;width:90%;margin-left:5%;margin-right:5%;top:75px;}
.header-text h1{font-size:30px;margin-bottom:0;color:#fff;text-align:center;margin-top:10px;text-shadow: 2px 2px 2px #000000;}
.header-text p{font-family: 'Lobster', cursive;font-size:30px;display:block;padding-bottom:0px;margin:0px;color:#000;text-align:center;}


.header-content{font-family:'Bree Serif', serif;text-align:center; position: absolute;  z-index: 2;width:90%;margin-left:5%;margin-right:5%;/*background-color:rgba(255, 255, 255, 0.3);*/}
.inner-header-content{top:20px;}
.inner-header-content1{top:40px;font-size:42px;}
.inner-header-content2{top:200px;font-size:42px;}
.inner-header-content2 h4{color:#fff;text-shadow:2px 2px 2px #000000;}
.header-content h1{font-size:30px;margin-bottom:0;color:#fff;text-align:center;margin-top:10px;text-shadow: 2px 2px 2px #000000;}


.header-content h4{font-size:50px;text-align:center;margin-top:0px;}

.header-content p{font-family: 'Lobster', cursive;font-size:32px;display:block;padding-bottom:0px;margin:0px;color:#fff;text-align:center;text-shadow: 2px 2px 2px #000000;}
.btn{background:#99cc00;color:#000;font-size:16px;padding:10px 20px;text-decoration:none;margin-top:15px;}

.inner-header-content1 h3{font-family: 'Lobster', cursive;font-size:40px;}
.sec1-box-row{display: flex; flex-wrap:wrap;width: 100%;margin-top:90px;}
.sec1-box-column{display: table-cell;padding: 16px;}
.sec1-box-content {
	background-color: #34b3a0;
	padding: 0px;
	
	border: 20px solid #fff;
	border-top: 50px solid white;
}

.sec1-boximg {width:100%; position: relative; overflow: hidden;}
.sec1-boximg img{width:100%;  transition: 0.7s all; -webkit-transition: 0.7s all; -moz-transition: 0.7s all;
	-ms-transition: 0.5s all;
	-o-transition: 0.5s all;}
.sec1-boximg:hover img{background: rgba(0, 0, 0, 0.3); transform: scale(1.5); transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-ms-transition: 0.5s all;
	-o-transition: 0.5s all;}
	
.sec1-boximg .overlay {
    opacity: 0;
    background-color: rgba(0,0,0,.2);
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
	position: absolute;
    top: 0;
    left: 0;
	width: 100%;
height: 100%;
	    
}	
.sec1-boximg:hover .overlay {
    opacity: 1;
}
.sec1-boximg h2 {
    -webkit-transform:translatey(-100px);
 transform:translatey(-100px);
 opacity:0;
 -webkit-transition:all .2s ease-in-out;
 transition:all .2s ease-in-out
    position: relative;
    font-size: 17px;
    padding: 10px;
    background: rgba(0,0,0,.6);
    text-transform: uppercase;
    color: #fff;
    text-align: center;
}

.sec1-boximg button.infosect {
 opacity:0;
 -webkit-transition:all .2s ease-in-out;
 transition:all .2s ease-in-out;
 text-decoration: none;
padding: 7px 14px;
border: 1px solid #fff;
margin: 50px 0 0;
border-radius: 0;
background-color: transparent;
display: block;
text-transform: uppercase;
color: #fff;
font-size:12px;
margin: 50px auto;
text-align: center;
}

.sec1-boximg:hover button.infosect,
.sec1-boximg:hover h2 {
 opacity:1;
 -webkit-transform:translatey(0);
 transform:translatey(0)
}
.sec1-boximg:hover button.infosect {
 -webkit-transition-delay:.2s;
 transition-delay:.2s
}
.sec1-boximg button.infosect:hover {
 box-shadow:0 0 5px #fff
}

.sec1-box-content {background-color: #84b001;padding: 0px;border:20px solid #fff;border-bottom:0;border-top: 50px solid #fff;}
.sec1-box-row h1{	font-family: 'Bree Serif', serif;font-size:18px;margin-bottom:0;color:#000;text-align:center;}
.sec1-box-row p{font-size:15px;display:block;padding:10px;color:#fff;text-align:center;margin:0;}
.sec1-btn{display:inline:block;background:#fff;color:#000;font-size:1.2rem;padding:.5rem 1rem;text-decoration:none;width:50%;}

.sec1-box1-row{display: flex; flex-wrap:wrap;width: 100%;text-align:center;}
.sec1-btn1{display:block;background:#fff;color:#000;font-size:10px;padding:5px;text-decoration:none;width:30%}
.sec1-box1-content {background-color: #34b3a0;padding: 10px;border:20px solid #fff;border-top:0;text-align:center;float:center;}


.sec2{position:relative;text-align:center;padding:50px 0 100px 0;width:100%;margin:20px 0 0 0;}
.sec2 h1{font-family: 'Lobster', cursive; font-size:40px;color:#336666;margin-bottom: 30px;}

.sec3{font-family: 'Lobster', cursive; position:relative;background-color:#1f2630;text-align:center;padding:60px 0;width:100%;margin:0;}
.sec3 h1{font-size:40px;color:#fff;padding-bottom:50px;}
.sec3 p{font-family:'Bree Serif', serif;font-size:15px;color:#fff;padding-bottom:5px;text-align:center;}
.sec3 form{padding-bottom:50px; margin: 0 auto; display: table;  width: 300px;}
.sec4{position:relative;background-color:#2c353e;text-align:center;padding:20px 0;width:100%;margin:0;}
.sec4 p{font-size:15px;color:#6d7a87;}

.storysec1 {margin:20px 10px; padding:10px 20px; background-color:#fff;}
.storysec1 h1{font-size:35px;font-family: 'Lobster', cursive;color:#336666; padding:10px 20px;}
.storysec1 p{font-size:20px;color:#444;padding-top:20px; padding:0px 20px;margin:15px 0;letter-spacing: 0px;}
.story-bottom-text{text-align:center;width:100%;padding:0 0;}
.parallax {padding:200px 35px;text-align:center;background: transparent;}

.healthy-sec1{text-align:left;padding:20px 20px 50px 20px;margin:0px;  -webkit-transition:all .4s ease-in-out;
 transition:all .4s ease-in-out;}
.healthy-sec1 h2{font-family: 'Lobster', cursive;text-align:center;color:#336666;font-size:30px;margin:22px;}
.healthy-sec1 h1{color:#8ebc04;font-size:26px;font-family: 'Bree Serif', serif;text-align:center;margin-bottom:20px;}
.healthy-sec1 p{color:#222;font-size:20px;letter-spacing: 0px;}
#healthy-title{font-family: 'Lobster', cursive;text-align:center;color:#336666;font-size:30px;margin:75px 0 20px;}

.healthy-sec2{position:relative;background-color:#fff;text-align:center;padding:20px;margin:9px 30px 0px 30px;}
.healthy-sec2 h2{font-family: 'Bree Serif', serif;text-align:center;color:#8ebc04;font-size:26px;margin:40px 100px;line-height:35px;}
.green-box{position:relative;font-size:10px;margin:0 auto;margin-bottom:0;border-radius:0;padding:5px;}
/*.green-box-r{position:relative;background-color:#aac169;color:#000;font-size:20px;margin:0 auto;margin-bottom:5px;border-radius:30px;width:80%;padding:10px;height:100px;}
.green-box img{position:absolute;top:0px;left:-20px;height:100px;}
.green-box-r img{position:absolute;top:0px;right:-20px;height:100px;}*/
.green-box h3{text-align:center;font-size:14px;color:#333;padding:0 20px;}
.green-box-r h3{text-align:center;margin:15px 75px 0 20px;font-size:20px;}
.healthy-sec3{background-color:#fff;}
.product-sec1{background-color:#99cc99;text-align:center;padding:40px 60px;margin:30px 0;}
.product-sec1 h2{font-size:24px;}
.product-sec1 h4{font-size:26px;}
.product-sec1 p{font-size:17px;}

.product-sec2{background-image:url('../images/vit-bg.png');opacity:0.6;background-position:center;background-repeat:no-repeat;background-color:#fff;text-align:center;padding:40px 60px;margin:80px 0 20px 0;border: 1px dotted;}
.product-sec2 p{font-size:17px;}
.product-sec3{margin-bottom:60px;text-align:center;}
.product-sec3 h4{font-size:40px;}
.product-sec4{text-align:center;padding:80px 50px 10px 50px ;margin:30px 0 10px 0;}
#pos2{margin-top:20px;font-size:13px;}
#product-title{font-family: 'Lobster', cursive;text-align:center;color:#336666;font-size:28px;margin:0px 0 10px;}
.product-sec1-col{position:relative;display:flex;flex-wrap: wrap;text-align:center;margin:22px 10px 0 10px;}
.product-sec1-col h4{padding:10px;margin:0}
.product-sec4 differ{padding:0px;}
.product-sec4 p{font-size:20px;color:#b61717;}
.product-sec4 h4{font-size:24px;font-family: 'Bree Serif', serif;}
.product-sec5 {padding:80px 0px;}
.product-sec6 {left:100px;}
.olive-sec1 {padding:70px 40px;}
.olive-sec1 h1{font-size:25px;text-align:center;}
.olive-sec1 p{font-size:20px;letter-spacing:0;}
.product-sec5 img{float:left; margin-right:20px;width:100%;}
.product-sec5 p{font-size:20px;}
.clearfix::after {
  content: "";
  clear: both;
  display: block;
}
.box-outline{	position: relative;
	min-height: 1px;
	padding-right:0;
	padding-left:0;
	border: 2px solid #fff;
	margin: 0;
	background-color:#fffdef;
	}



.navBot{text-align:center;width:100%;}
.navBot p{font-size:14px;}
.navBot{display:inline-block;font-family:'Bree Serif', serif;color:#000; z-index:1; width:100%;  text-align: center; margin:0; padding:0;letter-spacing: 1px}
.navBot ul{ padding:0;margin-bottom:0;}

/*.navBot li:hover{color:#fff;}*/
.navBot li{list-style:none;  font-size:18px; display: inline-block;padding: 15px 10px; }
.navBot li a{color:#d8d8d8;font-size:11px;}/*COLOR OF LINKS SET HERE*/
.navBot li a:hover{color:#000; text-decoration:none}
.navBot li:before {content: "  -  "; padding-right : 20px; font-size: 15px;text-align: center;}
.navBot li:first-child:before {content: "";}

.social-icons{padding:20px;}

.info{
z-index:2;
position:relative;
 background:rgba(255,255,255,.7);

padding:0;
margin:0;
padding:15px;
  }
  .info p{font-size:17px;color: #000;opacity:1;}

 
.sec3 input[type="text"], .sec3 input[type="email"], .sec3 input[type="tel"], .sec3 select, .sec3 textarea{
  width: 100%;
  padding: 12px 20px;
  border: 1px solid #ccc;
  border-radius: 2px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
   font-size:14px;
  font-family: 'roboto', serif;

}

.sec3 input[type=submit] {
  background-color: #99cc00;
  color: #000;
  padding: 12px 20px;
  border: none;
  cursor: pointer;
  border-radius: 2px;
  font-size:14px;
font-family: 'Bree Serif', serif;
margin-top: 15px;

}

.sec3 input[type=submit]:hover {
  background-color: #45a049;
}


.animated.fadeIn{animation-duration: 4s;}

.loader-overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.3);
  transition: opacity 500ms;
   visibility: visible;
  opacity: 1;
  z-index: 100;
  display: table;
width: 100%;
height: 100%;
}
.loader-overlay:target {
  visibility: visible;
  opacity: 1;
}
.popup {vertical-align: middle; display: table-cell; text-align: center;}

.success-text {width: 350px; margin: 0 auto; background-color: #fff; padding:30px 20px 20px 20px; border-radius:5px; font-family: 'Lobster', cursive; position: relative; font-size:23px;}
.success-text span {font-family: 'Bree Serif', serif; font-size:15px; display: inline-block; margin: 10px; line-height: 26px;}
.success-btn {margin: 10px 0 0 0;}
.success-btn input[type=submit] {
  background-color: #99cc00;
  color: #000;
  padding: 12px 20px;
  border: none;
  cursor: pointer;
  border-radius: 2px;
  font-size:14px;
font-family: 'Bree Serif', serif;
}

.success-btn input[type=submit]:hover {
  background-color: #45a049;
}

.success-popup-close {position: absolute; top: -10px; right: -10px; background-color: #99cc00; padding: 2px 0 0 0; border-radius: 50%; font-family: verdana; width: 22px; height: 23px; font-size: 13px; font-weight: bold; cursor:pointer;     letter-spacing: -1px;}


/*-------------------------Navigation------------------*/
span.menu {display: none;}
.top-menu{width:38%;}

.top-menu > ul > li {display:inline-block; 	position: relative;}
.top-menu > ul > li.active a{
}
.top-menu> ul > li img {
	vertical-align: middle;
}
.top-menu > ul > li > a {
	display: block;
	text-decoration:none;
	margin:0;
	font-family: 'Bree Serif', serif;
	font-size:17px;
}
.top-menu  > ul > li >:hover a {color: #000;}
.top-menu > ul > li.active a:hover {/*background-color:#ffe99e;*/ color: #000;}

.top-menu ul {list-style: none; position: relative; display: inline-flex; margin: 0; padding: 0;}
.top-menu ul li:hover > ul {display: block;  }
.top-menu ul li {float: left; padding:0;}
.top-menu ul li:nth-child(4), .top-menu ul li:nth-child(5), .top-menu ul li:nth-child(6) {display:none}
.top-menu ul li:hover a {/*background-color:#ffe99e;*/ color: #000;} 
.top-menu ul li a {display: block; text-decoration: none; color: #222; padding: 10px 10px; font-size: 16px;  }
.top-menu ul li a:hover {/*background-color:#ffe99e;*/ color: #fff;}
.top-bar-left{float:left; text-align:right}
.top-bar-right{float:right; text-align:left}

.top-menu ul ul {display: block; z-index:100; padding: 0; margin:0; 	position: absolute; top: 100%; left:-50%; right:-50%; -webkit-transform:translatey(-100px);
 transform:translatey(-100px);
 opacity:0;
 -webkit-transition:all .5s ease-in-out;
 transition:all .5s ease-in-out;}
.top-menu ul li:hover > ul {display: block; opacity:1;
 -webkit-transform:translatey(0);
 transform:translatey(0); -webkit-transition:all .5s ease-in-out;
 transition:all .5s ease-in-out; }
.top-menu ul ul li {
	float: none; 
	position: relative;
	/*background:#e46c32;*/
	margin:0 0 5px 0;
	padding:0;
	background: rgba(254, 254, 254, 0.7);
}
.top-menu ul ul li a {
	color: #fff;
	padding:8px 0;
	text-align:left;
	text-align:center;
	font-family: 'Bree Serif', serif;
	font-size:17px;
}	
.top-menu ul ul li a:hover {
	color: #336666;
	/*background: #804b2e;*/
	-webkit-transition: 0.9s;
	-moz-transition: 0.9s;
	-o-transition: 0.9s;
	transition: 0.9s;
}
.top-menu ul li:hover {}
.top-menu ul li:hover a {}
.top-menu ul ul ul {position: absolute; right: 100%; top:0; margin:0;  background:rgba(254, 254, 254, 0.8); padding: 30px;}
.top-menu ul ul ul li a {color: #a46831; 	padding:10px 0; 	text-align:center; 	/*background: #804b2e;*/}	
.top-menu ul ul ul li a:hover {
	color: #040404;
	/*background: #e46c32;*/
}
.top-menu ul ul li :hover {color: #a46831;}
.top-menu ul ul li :hover a {color: #a46831; }
.more_menu {right:0;}
.top-menu ul ul li a span {margin-top:5px;}

.section{padding:20px 0;}
.section-a{background:#111;color:#fff;}
.section-b{background:#333;color:#fff;}


/*------------------navigation ends-----------------------------------------*/

@media(max-width:992px){
		 .container{padding:0;margin:0;max-width:100%;}

	.top-bar-right {display:none;}
	span.menu {display: inline-block;  cursor: pointer;  margin: 2px 15px 0 0; background-image: url("../images/nav.png");    background-repeat: no-repeat;  height: 42px;  width: 42px;}
	.top-menu {width: 100%; top: 0; text-align: right; margin:0; position: absolute; z-index:1000}
.top-menu  ul{display:none; margin:6px 0; z-index: 999; position: absolute; width: 100%; text-align: center; padding-bottom:0; background: transparent; padding:0 40px; left:0;}
.top-menu  ul li {display:block; float:none; margin: 0em; border-bottom: none; border-right:none; padding:0; background-image: none;  background:rgba(170, 170, 170, 0.9);  border-radius:0;top:50px;}
.top-menu ul li:nth-child(4), .top-menu ul li:nth-child(5), .top-menu ul li:nth-child(6) {display:block}
.top-menu ul li span:hover {background:transparent;}
.top-menu ul li:hover a {}
.top-menu ul li a {padding:10px 15px; text-align:center; color: #fff; margin:0; font-size: 20px;}
.top-menu ul li a:hover { background:rgba(147, 198, 22, 0.8); color: #fff;}
.top-menu ul ul {width:100%; display:block! important; margin-top:0; position:relative; padding:0; left:0; -webkit-transform:translatey(0);
 transform:translatey(0);
 opacity:1;
 -webkit-transition:all .5s ease-in-out;
 transition:all .5s ease-in-out;}
.top-menu ul ul li {width:100%; margin:0; padding:0; border-radius:0;}
.top-menu ul ul li a {border-bottom: 1px solid #336666;  color: #040404; background:transparent);  padding:10px 30px; border-radius: 0;  font-size: 18px;}
.top-menu ul ul li a:hover {color: #040404; background:rgba(147, 198, 22, 0.8);}

.top-menu ul ul ul {right:0; position: relative; background:transparent; padding:0; left:0;}
.top-menu ul ul ul li a {border-bottom: 1px solid #000;   color: #fff; background:#403e3d;  padding:10px 40px; }

	}
	
 @media only screen and (max-width: 768px) {
	.container{padding:0;max-width:100%}
	.logo-overlay {width: 170px; background-size: 100%;top:16px;}
	.header-content h1{font-size:26px;}
	.header-content p{font-size:26px;margin-top:10px;padding-bottom: 0;}
	.sec2{padding:50px 0;margin:20px 0 0 0;}
	.product-sec4{padding-left:0;padding-right:0;}
	.header-text{top:50px;}
	.header-text h1{font-size:28px;}
	.header-text p{font-size:28px;}
	
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	.container{padding:0}
	.banner{position:relative; margin-top:-20px; max-width: 970px; height: 200px;}
	.logo-overlay {width: 110px; background-size: 100%;top:29px;}
	/*.v-header{height:350px;}*/
	.header-content{top:5px; z-index: 2;margin:0px;width:90%;margin-left:5%;margin-right:5%;}
	.header-content h1{font-size:17px;}
	.header-content p{font-size:18px;margin-top:5px;}
	.header-content h4{font-size:25px;}	
	.header-text{top:30px;}
	.header-text h1{font-size:16px;}
	.header-text p{font-size:16px;}
	
	.inner-header-content{top:1px;width:90%;}
	.inner-header-content1{top:40px;}
	.inner-header-content1 h3{font-size:20px;}
	.top-space{margin-top:50px;}

	.btn{font-size:10px;padding:2px 5px;}
	.healthy-sec2{padding:5px;margin:10px;}
	.healthy-sec2 h2{font-size:14px;margin:10px 50px;line-height:15px;}
	.green-box h3{margin:0 5px;font-size:14px;}
	.green-box-r h3{margin:0 5px;font-size:14px;}
	.healthy-sec1{padding:5px;margin:5px;}
	#healthy-title{margin:60px 0 20px;}
	.sec2{padding:50px 0;margin:10px 0 0 0;}
	.sec3{padding:20px 0;}
	.sec3 h1{font-size:20px;padding-bottom:20px;}
	.fullscreen-video-wrap{height:200px; }
	#gmo{position:absolute;bottom:0;right:0;width:100px;}
	.product-sec1-col{margin:20px 20px;}
	.product-sec1{padding:15px 6px;margin:10px 0;}
	.product-sec1 h2{font-size:20px;}
	.product-sec2{background-image:url('../images/vit-bg-v.png');background-position:center;background-repeat:no-repeat;padding:40px 10px;margin:30px 0;}
	.product-sec2 p{font-size:15px;}
	.product-sec4 h4{font-size:18px;}
	#certi-img{width:90%;}
	#img-size{width:90%;}
	
.grid-container {
  display: grid;
  grid-template-columns: auto auto;	
}
.item1{grid-area: 1 / 1 /2 / 3;}
.item2{grid-area: 3 / 1 / 4 / 3;}
.item3{grid-area:2 / 1 / 3 / 2;}
.item4{grid-area:2 / 2 / 3 / 3;}
.item5{grid-area:4 / 2 / 5 / 3;}
.item6{grid-area:4 / 1 / 5 / 2;}
.item7{grid-area:5 / 1 / 6 / 3;}

.item3 , .item6{font-size:16px;}


}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
	/*.container{max-width:100%}
	.v-header{height:450px;}*/
	
}


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

}

 @media only screen and (min-width: 768px) {
	/*.container{max-width:100%}
	.v-header{height:550px;}*/
}	
	/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	/*.v-header{height:650px;}*/
	.container{max-width:1300px;}

}
	/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

	
}