html, body{ padding:0; margin:0; width:100%; font-family: 'Lato', sans-serif; background-color:#FFF;}
.main_content{ position:relative;  padding:0; margin: 0;}
.inner_part{ width:80%; margin:0 auto;}
#main_navi{ position:fixed; width:100%; top:0; z-index:20; background-color:#fff;}
#top_sec{ background-color:#000; color:#fff; text-align:right; font-size:12px; padding:10px 0;}
.tbl_container{display:table;}
.tbl_row{display:table-cell;}
.half_row{width:50%;}
.navi_btn, .navi_btn_footer{color:#4c4c4c; font-size:16px; text-decoration:none; margin-right:80px;}
.navi_btn_footer{ font-size:18px; font-style:normal; font-weight:normal;}
#menu_holder{width:100%; padding:0px 0;}
#float_ws{position:fixed; bottom:10px; right:10px; z-index:20; width:320px;}

#c1{}
#coconut_bg{background-image:url(images/upper_bg.jpg); background-repeat:no-repeat; background-size:100% auto; background-position:center 220px; margin-top:150px;}
.c1_cert{width:100%; margin:0 auto; padding:100px 0 0px; text-align:center;}
.c1_cert img{max-width:668px; width:100%;}
.maintxt{ font-size:48px; color:#1a1a1a; text-align:center; font-family: "Bebas Neue", sans-serif;}
.maintxt1{ font-size:24px; color:#1a1a1a; text-align:center; line-height:37px;}
#main_img_1{ width:100%; max-width:441px;}
#main_img_2{ width:100%; max-width:605px;}
#our_cert{padding:100px 0 200px;}
.c1_cert2{ max-width:666px; width:100%; margin:20px auto 0px;}


#c2{ padding:300px 0 0;}
#c2_1{ padding:100px 0; background-color:#4e7038;}
#product_col{margin:10px auto 0; text-align:center;}
#product_col img{ width:100%; max-width:479px;}
.product_gap{width:40px;}

#c3{ padding: 180px 0 50px; }
.coconut_product{width:100%; max-width:605px; margin:0 auto; padding-bottom:50px;}
.sg_box{}
.b_img{ width:110px;}
.sgtxt1{color:#0c0c0c; font-size:32px; font-weight:bold; font-family: "Bebas Neue", sans-serif;}
.sgtxt2{color:#0c0c0c; font-size:18px;}
.sg_row{width:500px;}
.sg_gap{ width:80px;}
.sg_tbl{margin:0 auto 50px;} 
#benefit_col{margin:0 auto; padding:50px 0 100px;}
.sub_txt1{ font-size:24px; color:#0c0c0c; text-align:center; width:100%; max-width:780px; margin:0 auto; padding:10px 0 40px;}
.sub_txt2{ font-size:30px;  color:#292929; font-family: "Bebas Neue", sans-serif; text-align:center;}
.sub_txt3{ font-size:20px; color:#292929; text-align:center;}
#ingre_img{width:100%; max-width:440px;}
#nutrition_img{width:100%; max-width:440px;}
#nutrition_col{ padding:0 0 80px; display:none; position:relative;}
.sub3_10{padding-left:10%;}
.nut_tbl{margin:0 auto; width:80%;}
#close_nutri{float:right; position:relative; z-index:10; cursor:pointer;}


#footer{padding:30px 0 40px; background-color:#2c1a05;}
.footxt1{color:#b4b4b4; font-size:15px;}
.footxt2{text-align:right;}
.footxt2 .navi_btn{ color:#b4b4b4; font-size:18px; padding-left:0px; font-weight:normal;}

#contact{padding: 100px 0; background-color:#4e7038;}
.contact_part{width:90%;}
.cttxt1{color:#ffffff; font-size:58px; font-family: "Bebas Neue", sans-serif;  margin-bottom:0px;}
.cttxt2{color:#efefef; font-size:20px; font-weight:bold;}
.cttxt3{color:#efefef; font-size:20px;}
.cttxt4, .contact_tbl a{color:#eee3ab; font-size:20px; font-weight:bold; text-decoration:none;}
.contact_tbl a:hover{text-decoration:underline;}
.contact_tbl{margin-top:50px;}

.form_tbl{width:100%; max-width:400px; margin:20px auto 0;}
.input_txt, .msg_txt{font-family: 'Lato', sans-serif; color:#000; font-size:14px; outline:none; border:1px solid #c8c8c8; border-radius:25px; width:100%; padding:15px 18px; margin-bottom:30px; background-color:#ececec;}
.msg_txt{height:100px; resize:none;}
#contact_main{width:100%; padding:0px 0 0px;}
.submit_btn{ background-color:#c1aa40; border:none; outline:none; border-radius:25px; padding:10px 50px; color:#fff; font-family: 'Lato', sans-serif; font-size:20px; cursor:pointer;}

#mobile_navi, #mb_side_menu, #footer_mb{display:none;}

/*#c1, #c2, #c3, #c4{display:none;}*/

@media only screen and (max-width: 1320px) {
	.inner_part{ width:90%;}	
	#coconut_bg{background-position:center 250px;}
	#c2{ padding:0px 0 0;}
	.c1_cert{padding:80px 0 180px;}
}

@media only screen and (max-width: 1024px) {
	#desktop_navi, .addheight, #footer_desktop, #maintxt{ display:none;}
	.tbl_container, #mobile_navi, #mb_side_menu, #footer_mb{display:block;}
	.tbl_row{display:block; padding-bottom:50px;}
	.half_row{width:100%;}
	#float_ws{width:120px;}
	
	body{ background:none;}
	
	.inner_part{ width:90%;}
	
	#mb_side_menu{position:fixed; top:0px; z-index:9; height:100vh; background:#FFFFFF; width:100%; left:100%;}
	#mb_side_menu div{ width:80%; margin:0 auto; padding-top:20px;}
	#mb_side_menu .mb_top{ padding-top:100px;}
	#mobile_navi{padding:10px 0; background:#FFFFFF; border-bottom:1px solid #CCC;}
	.navi_btn{font-size:18px;}
	#mb_logo{width:100%; text-align:center;}
	#mb_logo img{ width:150px;}
	#mb_menu{ position:absolute; cursor:pointer; width:45px; height:30px; background-image:url(images/menuicon.png); background-repeat:no-repeat; background-size:auto 100%; background-position:0px 0px; top:20px; left:5%;}

	#c1{}
	#coconut_bg{background-image:none; margin-top:80px;}
	.c1_cert{ margin-bottom:0px; background:url(images/bg.jpg) repeat-x; background-size:auto 100%; padding:10px 0 100px;}
	.c1_cert img{width:90%;}
	
	.maintxt{ font-size:28px;}
	.maintxt1{ font-size:16px; line-height:22px;}
	#main_img_1{ width:100%;}
	#main_img_2{ width:100%;}
	#our_cert{padding:60px 50px 100px;}
	.c1_cert2{}
	
	#c2{ padding:0px 0 0;}
	#c2_1{ padding:50px 0;}
	#product_col img{ width:100%; max-width:479px;}
	.product_gap{ display:none;}
	
	#c3{ padding: 100px 50px 50px; }
	.coconut_product{width:100%; max-width:605px; margin:0 auto; padding-bottom:50px;}
	.b_img{ width:110px;}
	.sgtxt1{color:#0c0c0c; font-size:22px; font-weight:bold; font-family: "Bebas Neue", sans-serif;}
	.sgtxt2{color:#0c0c0c; font-size:16px;}
	.sg_row{width:100%; }
	.sg_gap{ display:none !important;}
	.sg_tbl{margin:0 auto 0px;} 
	#benefit_col{margin:0 auto; padding:50px 0 0px;}
	.sub_txt1{ font-size:18px; }
	.sub_txt2{ font-size:24px; }
	.sub_txt3{ font-size:18px;}
	.sub3_10{padding-left:0%;}
	.nut_tbl{width:100%;}
	#close_nutri{float:none; position:absolute; top:-25px; left:auto; right:-5vw;}
	#close_nutri img{width:30px;}
	
	
	#contact{ height:auto; padding:60px 0px 0px; background-size:100% 80px;}
	.contact_part{width:100%;}
	.cttxt1{font-size:25px;}
	.cttxt2{font-size:16px;}
	.cttxt3{font-size:16px;}
	.cttxt4, .contact_tbl a{font-size:16px;}
	.input_txt, .msg_txt{width:73%;}
	.form_tbl{width:100%; max-width:100%;}
	#contact_main{padding:50px 0px 50px;}
	
	#footer{ padding:25px 0 20px;}
	.footxt1{font-size:14px; text-align:center;}
}