/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://creativecommons.org/licenses/MIT/	*/


/*	Resets
	------	*/

html, body, span, object, iframe, h1, h2, h3, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0 auto;
	padding: 0;
	border: 0;
	font-family:Arial, Helvetica, sans-serif;
}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
}

a img {border: 0; outline:none;}
#space{margin-top:10px;}
.clear{clear:both;}


/*	Typography presets
	------------------	*/
.sw{
	font-style:italic;
	font-weight:normal;
}
.white{
	color:#fdfdfd;
}
.brown-soft{
	color:#c4996c;
}
.brown-mid{
	color:#765233;
}
.brown-old{
	color:#613814;
}

.main-menu a{
	color:#c4996c;
	text-decoration:none;
	width:242px;
}
.main-menu a:hover{
	color:#613814;
	text-decoration:none;
	background:url(images/background-menu-hover-2.png) no-repeat top;
	width:242px;
}
.main-menu-active a{
	color:#613814;
	text-decoration:none;
	width:242px;
	background:url(images/background-menu-hover-2.png) no-repeat top;
}

.main-menu-soft a{
	color:#fde204;
	text-decoration:none;
}
.main-menu-soft a:hover{
	color:#fde204;
	text-decoration:none;
}
.main-menu-soft-active a{
	color:#fde204;
	text-decoration:none;	
}
.main-menu-soft2 a{
	color:#c4996c;
	text-decoration:none;
}
.main-menu-soft2 a:hover{
	color:#c4996c;
	text-decoration:none;
}
.main-menu-soft2-active a{
	color:#613814;
	text-decoration:none;	
}
.main-menu-old a{
	color:#fdfdfd;
	text-decoration:none;
}
.main-menu-old a:hover{
	color:#fdfdfd;
	text-decoration:none;
}
.main-menu-more a{
	color:#c40000;
	text-decoration:none;
}
.main-menu-more a:hover{
	color:#613814;
	text-decoration:none;
}
.gigantic {
	font-size: 123px;
	line-height: 132px;
	letter-spacing: -2px;
}

.huge, h1 {
	font-size: 76px;
	line-height: 84px;
	letter-spacing: -1px;
}

.large, h2 {
	font-size: 47px;
	line-height: 48px;
}

.bigger, h3 {
	font-size: 29px;
	line-height: 36px;
}

.big, h4 {
	line-height: 30px;
}

body {
	font-family:Arial, Helvetica, sans-serif;
	background:url(images/background-footer.png) no-repeat bottom center;
}

.small, small {
	font-size: 13px;
	line-height: 18px;
}

/* Selection colours (easy to forget) */

::selection 	 	{background: rgb(255,255,158);}
::-moz-selection 	{background: rgb(255,255,158);}
img::selection 		{background: transparent;}
img::-moz-selection	{background: transparent;}
body {-webkit-tap-highlight-color: rgb(255,255,158);}



/*		Default Layout: 992px. 
		Gutters: 24px.
		Outer margins: 48px.
		Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

body {
	width: 1000px;
	margin:0 auto;
	background:#a82020 url(images/background-footer-2.jpg) no-repeat top;
	background-attachment:fixed;
}
#all{
	width:1000px;
	float:left;
	background:#FFFFFF url(images/background-footer.png) no-repeat bottom center;
}
	#hunt-header{
		width:990px;
		float:left;
		}
		/*=====================1hunt*/
		#cari-1{
			float:left;
			margin-left:0px;
			margin-top:0px;
		}
		#image-hunt{
			width:90px;
			height:21px;
			margin-right:20px;
		}
			#hunt-1content, #hunt-2content, #hunt-3content, #hunt-4content, #hunt-5content, #hunt-6content, #hunt-7content, #hunt-8content, #hunt-9content {
						position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-20px; margin-top:20px; z-index:8000; background:url(images/transparent.png); font-size:12px;
					}
			.hunt-hunt a{
					background:url(images/transparent.png);
			}
			.hunt-hunt a:hover{
					background:url(images/collect-me.png) no-repeat center;
			}
		#cari-2{
				float:left;
				margin-left:0px;
				margin-top:0px;
			}
			#hunt-10content, #hunt-11content, #hunt-12content, #hunt-13content, #hunt-14content, #hunt-15content, #hunt-16content, #hunt-17content, #hunt-18content {
					position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-30px; margin-top:20px; z-index:8000; background:url(images/transparent.png); font-size:12px;
				}
		#cari-3{
			float:left;
			margin-left:0px;
			margin-top:0px;
		}
		#hunt-19content, #hunt-20content, #hunt-21content, #hunt-22content, #hunt-23content, #hunt-24content, #hunt-25content{
					position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-30px; margin-top:-150px; z-index:8000; background:url(images/transparent.png); font-size:12px;
				}
		/*=====================1huntabout*/
		#cari-4{
			float:left;
			margin-left:0px;
			margin-top:100px;
		}
		#cari-5{
			float:left;
			margin-left:0px;
			margin-top:-100px;
		}
		#hunt-26content, #hunt-27content, #hunt-28content{
			position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-20px; margin-top:20px; z-index:8000; background:url(images/transparent.png); font-size:12px;
		}
	#header{
		width:990px;
		float:left;
		text-align:left;
		}
		#header .col1{
			font-size:10px;	
			}
			#copyright{
				margin-left:450px;
				font-size:11px;
				font-style:italic;	
			}
			#flag{
				width:80px;
				margin-left:800px;
				margin-top:-26px;
				position:absolute;
			}
			#media{
				position:absolute;
				width:110px; /*original 70px*/
				margin-left:890px;
				margin-top:-26px;
				}
				#med-1{
					margin-right:5px;
					}
				#med-2{
					margin-right:5px;
					}
				#med-3{
					margin-right:5px;
					}
				#med-4{
					margin-right:5px;
					}
								
				#soc-1{
					margin-left:60px;
					margin-right:50px;
				}
				#soc-2{
					margin-right:50px;
				}
				#soc-3{
				
				}
		#header #col2{
			font-size:10px;
			}
			#menu{
				font-size:20px; font-style:italic; float:left; margin-left:476px;
			}
			.menu-m{display:none;}
		#gallery{
			width:1000px;
			float:left;
			}
			#logo-indomie{
				position:absolute;
				z-index:6000;
				margin-top:15px;
				float:left;
				width:190px;
				height:121px;
			}
			#banner-1{
				position:absolute;
				width:1000px;
				height:444px;
				}
			#social-media{
				margin-top:110px;
				margin-left:50px;
			}
		#gallery-product{
			width:900px;
			margin-top:80px;
			float:left;
			margin-left:50px;
			}
			#sudut{
				position:absolute;
				float:left;
				margin-left:962px;
				z-index:3000;
				margin-top:72px;
			}
			#bungkus{
				width:436px;
				float:left;
				margin-top:40px;
			}
			#bungkus-jumbo{
				width:436px;
				float:left;
			}
			#ket{
				width:300px;
				float:left;
				margin-left:90px;
				margin-top:-10px;
			}
			
			#event-ket{
				width:500px;
				float:right;
				margin-right:60px;
			}
			#detail-ket{
				width:500px;
				float:right;
				margin-right:50px;
				margin-bottom:15px;
			}
			#detail-ket-sp{
				width:870px;
				float:right;
				position:absolute;
				margin-right:30px;
				margin-bottom:15px;
			}
			#event-crum{
				float:right;
				margin-top:5px;
			}
			#visit-website{
				width:127px;
				float:right;
				margin-top:15px;
				margin-left:40px;
				margin-right:0px;
			}
			#download{
				width:96px;
				float:right;
				margin-top:15px;
				margin-left:10px;
				margin-right:10px
			}
			#back-list{
				width:127px;
				float:left;
				margin-left:65px;
				margin-bottom:20px;
			}
			#product-title{
				width:410px;
				float:left;
				margin-top:10px;
				font-size:35px;
			}
			#product-des{
				width:295px;
				float:left;
				margin-top:20px;
			}
			#product-back{
				width:320px;
				float:left;
				margin-top:30px;
			}
				#kategori{
					width:97px;
					float:left;
					margin-right:5px;
				}
			#arrow-left{
				float:left;
			}
			#arrow-right{
				float:right;
			}
		
		#hunt-shadow{
			width:1000px;
			background:url(images/shadow-gallery.png) no-repeat bottom;
			height:50px;
			float:left;
			margin-top:444px;
			}			
		#hunt-shadow-product{
			width:900px;
			background:url(images/shadow-gallery.png) no-repeat bottom;
			height:50px;
			float:left;
			margin-top:444px;
			margin-left:50px;
			}
		#hunt-shadow-2{
			width:900px;
			background:url(images/shadow-gallery.png) no-repeat bottom;
			height:50px;
			float:left;
			margin-top:484px;
			margin-left:50px;
			}
		#hunt-shadow-3{
			width:900px;
			background:url(images/shadow-gallery.png) no-repeat bottom;
			height:50px;
			float:left;
			margin-top:500px;
			margin-left:50px;
			}
		#hunt-shadow-k{
			width:900px;
			height:50px;
			float:left;
			margin-top:400px;
			margin-left:50px;
			}
		#main{
			width:900px;
			float:left;
			margin-top:-20px;
			margin-left:50px;
			}
			#main #kolomAjax{
				float:left;	
				margin-top:20px;
				}
				#main-menu{
					width:242px;
					float:left;
				}
				.line{
					width:262px;
					height:13px;
					background:url(images/line.png) no-repeat left top;
				}
				.line-2{
					width:178px;
					height:13px;
					background:url(images/line-2.png) no-repeat left top;
				}
				#main-content{
					float:left;
					width:290px;
					}
					.home-font{
					font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; line-height:16px; margin-top:10px; text-align:justify;
					}
				#main-content-about{
					float:left;
					width:415px;
				}
				#main-content-about-detail{
					float:left;
					width:415px;
				}
				#main-content-faq{
					float:left;
					width:415px;
				}
					#head-qa{
						float:left;
						width:415px;
					}
					#num-qa{
						float:left;
						background:url(images/background-num-qa.png) no-repeat;
						width:25px;
						height:25px;
						text-align:center;
						margin-right:10px;
						vertical-align:middle;
						padding-top:3px;
					}
					#ques-qa{
						float:left;
					}
				#title{
					font-size:45px;
				}
				#subtitle{
					font-size:25px;
				}
				#menubase{
					font-style:italic; font-size:25px; font-weight:normal;	
					width:242px;
				}
				#main-content-contact{
					float:left;
					width:650px;
					margin-left:250px;
				}
					#contact-crum{
						float:left;
						margin-right:30px;
					}
					#contact-msg{
						float:left;
						margin-right:20px;
						margin-top:12px;
					}
					.boxCust2{
						width: 120px;
						height: 14px;
						background:none;
						border: none;
						color: #000000;
						padding-top:0px;
						margin-top:1px;
						margin-left: 5px;
						font-size:11px;
					}
					#fieldHolderTxtCust2{
						width: 151px;
						height:17px;
						background:url(images/input-newsletter-off.png) no-repeat left;
						float:left;
						margin-top:10px;
					}
					#fieldHolderTxtCustK2{
						width: 151px;
						height:17px;
						background:url(images/input-newsletter.png) no-repeat left;
						float:left;
						margin-top:10px;
					}
					#go{
						position:absolute;
						margin-left:40px;
						margin-top:1px;
					}
				#consumer{
					float:right;
					width:650px;
					background:url(images/line-3.jpg) no-repeat left bottom;
					margin-bottom:30px;
				}
				#judul-faq{
					font-size:13px;
				}
				#award{
					float:left;
					width:420px;
					background:url(images/line-3.jpg) no-repeat left bottom;
					margin-top:8px;
					}
					#award-year{
						float:left;
						width:83px;
						height:35px;
						background:url(images/background-award-year.png) no-repeat center top;
					}
					#award-head{
						float:left;
						width:320px;
						margin-left:15px;
					}
					.year{
						font-family:Arial, Helvetica, sans-serif;
						font-size:15px;
						font-weight:normal;
						color:#FFF;
						text-align:center;
					}
				#banner-2{
					float:left;
					width:194px;
					height:200px;
					margin-top:130px;
					margin-left:30px;
					background:url(images/banner-2.png) no-repeat;
					}
				#banner-3{
					float:left;
					width:191px;
					height:186px;
					margin-top:130px;
					margin-left:30px;
					}
				#news-pic{
					float:left;
					margin-top:0px;
					margin-left:30px;
					}
			#news{
				float:left;
				width:200px;
				height:224px;
				background:url(images/background-news.png) no-repeat top center;
				margin-top:20px;
				margin-left:15px;
			}
			#motion{
				float:left;
				margin-left:20px;
				width:126px;
			}
			#kategoricontent{
					position:absolute; visibility: hidden; width: 380px; margin-left:-50px; margin-top:-20px; z-index:3000; background:url(images/transparent.png);
				}
		
		#footer{
			width:100%;
			float:left;
			}
			#hunt-footer{
				width:1000px;
				float:left;
				margin-top:80px;
				margin-bottom:30px;
				}
				#logo-indofood{
					float:left;
					margin-left:50px;
				}
				#logo-hunt{
					float:left;
					margin-left:780px;
					margin-top:-150px;
				}
			#button-open{
				width:900px;
				margin-left:50px;
				float:left;				
			}
			#footer_content {
				width: 1000px;
				float:left;
				display: none;
				text-align:center;
			}
			#footer_button {
			float:left;
			width: 1000px;
			font-size: 20px;
			cursor: pointer;
			}
/*=======================================================================================================================1gallery*/
.sliderwrapper{
position: absolute; /*leave as is*/
overflow: hidden; /*leave as is*/
width: 1000px; /*width of featured content slider*/
height: 444px;
z-index:2;
text-align:justify;
}

.sliderwrapper .contentdiv{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
width: 1000px; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
z-index:2;
}

.pagination{
position: absolute;
width: 182px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
text-align: right;
padding: 0px 5px;
z-index:300;
margin-top:402px;
margin-left:680px;

}

.pagination a{
padding:1px 8px 6px 8px;
text-decoration: none;
color: #838383;
text-align:right;
background:url(images/background-button-gallery.png) no-repeat top center;
font-size:14px;
}

.pagination a:hover, .pagination a.selected{
color: #838383;
background:url(images/background-button-gallery-hover.png) no-repeat top center;
text-align:right;
font-size:14px;
}

/*========================================================1galleryevent*/
.sliderwrapper5{
position: absolute; /*leave as is*/
overflow: hidden; /*leave as is*/
width: 1000px; /*width of featured content slider*/
height: 490px;
z-index:2;
text-align:justify;
}



.sliderwrapper5 .contentdiv5{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
width: 1000px; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
height: 100%;
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
z-index:2;
}

.pagination5{
position: absolute;
width: 600px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
padding: 5px 10px;
z-index:300;
float:left;
}

.pagination5 a{
padding: 0 5px;
text-decoration: none; 
}

.pagination5 a:hover, .pagination a.selected{
color: #000;
}

/*=======================================================================================================================1motion*/
#motioncontainer {
/*margin:0 auto;  Uncomment this line if you wish to center the gallery on page */
width: 740px; /* Set to gallery width, in px or percentage */
height: 178px; /* Set to gallery height */
}
#motioncontainer2 {
/*margin:0 auto;  Uncomment this line if you wish to center the gallery on page */
width: 740px; /* Set to gallery width, in px or percentage */
height: 178px; /* Set to gallery height */
margin-left:50px;
}
#motiongallery{
	margin-left:-30px;
}
#motiongallery2{
	margin-left:-80px;
}
#fix-motion{
	margin-left:140px;
}

#motioncontainer a img {
	padding-left:0px;
	padding-right:70px;
}

#motioncontainer a:hover img {
	padding-left:0px;
	padding-right:70px;
}

#motioncontainer2 a img {
	padding-left:0px;
	padding-right:70px;
}

#motioncontainer2 a:hover img {
	padding-left:0px;
	padding-right:70px;
}


/*=======================================================================================================================1box*/
#close-window{
	float:left;
	margin-left:860px;
	margin-top:40px;
}

/*=======================================================================================================================2*/
/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	
	body {
		width: 712px;
	}
	img{
		width:100%;
	}
	/*====================2index*/
	#menu-master{
		font-size:16px;
	}
	#dot-sm{
		width:7px;
		height:3px;
	}
	#dot-bg{
		width:22px;
		height:6px;
	}
	#kategoricontent{
		position:absolute; visibility: hidden; width: 380px; margin-left:-50px; margin-top:-20px; z-index:3000; background:url(images/transparent.png);
	}
	#title{
		font-size:35px;
	}
	#subtitle{
		font-size:25px;
	}
	
	/*======2product*/
	#gal{
		width:140px;
		height:150px;
	}
	#gal-about{
		width:166px;
		height:178px;
	}
	#gal-load{
		width:140px;
		height:109px;
	}
	#gal-faq{
		width:150px;
		height:144px;
	}
	#row{
		width:58px;
		height:94px;
		margin-top:10px;
	}
	#row2{
		width:58px;
		height:94px;
		margin-top:0px;
	}
	#product-img{
		width:350px;
		height:257px;
	}
	
	#all{
	width:100%;
	float:left;
	background:#FFFFFF url(images/background-footer.png) no-repeat bottom center;
	}
	#hunt-header{
		width:100%;
		float:left;
		}
		/*=====================2hunt*/
		#cari-1{
			float:left;
			margin-left:0px;
			margin-top:0px;
		}
		#image-hunt{
			width:60px;
			height:14px;
			margin-right:15px;
		}
			#hunt-1content, #hunt-2content, #hunt-3content, #hunt-4content, #hunt-5content, #hunt-6content, #hunt-7content, #hunt-8content, #hunt-9content {
						position:absolute; visibility: hidden; width: 130px; height:110px; margin-left:-20px; margin-top:20px; z-index:8000; background:url(images/transparent.png); font-size:12px;
					}
			.hunt-hunt a{
					background:url(images/transparent.png);
			}
			.hunt-hunt a:hover{
					background:url(images/collect-me-2.png) no-repeat center;
			}
			#item-hunt{
				width:130px;
				height:109px;
			}
			#cari-2{
				float:left;
				margin-left:0px;
				margin-top:5px;
			}
			#hunt-10content, #hunt-11content, #hunt-12content, #hunt-13content, #hunt-14content, #hunt-15content, #hunt-16content, #hunt-17content, #hunt-18content {
						position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-30px; margin-top:20px; z-index:8000; background:url(images/transparent.png); font-size:12px;
					}
			#cari-3{
			float:left;
			margin-left:0px;
			margin-top:0px;
		}
		#hunt-19content, #hunt-20content, #hunt-21content, #hunt-22content, #hunt-23content, #hunt-24content, #hunt-25content{
					position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-30px; margin-top:-150px; z-index:8000; background:url(images/transparent.png); font-size:12px;
				}
		/*=====================1huntabout*/
		#cari-4{
			float:left;
			margin-left:250px;
			margin-top:50px;
			position:absolute;
		}
		#cari-5{
			float:left;
			margin-left:50px;
			margin-top:-80px;
		}
		#hunt-26content, #hunt-27content, #hunt-28content{
			position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-20px; margin-top:20px; z-index:8000; background:url(images/transparent.png); font-size:12px;
		}
	#header{
		width:100%;
		float:left;
		text-align:left;
		height:55px;
		}
		#header .col1{
			font-size:10px;
			width:712px;
			float:left;	
			}
			#copyright{
				margin-left:210px;	
				font-size:11px;
				font-style:italic;
			}
			#flag{
				width:80px;
				margin-left:545px;
				margin-top:-26px;
				position:absolute;
			}
			#media{
				position:absolute;
				width:110px; /* original 70px*/
				margin-left:635px;
				}
				#med-1{
					width:18px;
					height:18px;
					}
				#med-2{
					width:18px;
					height:18px;
					}
				#med-3{
					width:18px;
					height:18px;
					}
				#med-4{
					width:18px;
					height:18px;
					}
				#langu{
					width:80px;
					height:19px;
					}
				#soc-1{
					width:180px;
					height:180px;
					margin-left:0px;
					margin-right:40px;
				}
				#soc-2{
					width:180px;
					height:180px;
					margin-right:40px;
				}
				#soc-3{
					width:180px;
					height:180px;
				}
		#header #col2{
			font-size:10px;
			float:left;
			width:712px;
			}
			#menu{
				float:right; width:450px; font-size:20px; font-style:italic;
			}
		#gallery{
			width:100%;
			float:left;
			}
			#logo-indomie{
				position:absolute;
				z-index:6000;
				margin-top:15px;
				float:left;
			}
			#banner-1{
				position:absolute;
				width:100%;
				height:auto;
				}
			#social-media{
				margin-top:110px;
				margin-left:50px;
			}
		#gallery-product{
			width:100%;
			margin-top:40px;
			float:left;
			margin-left:20px;
			}
			#sudut{
				display:none;
			}
			#bungkus{
				width:280px;
				float:left;
				margin-top:40px;
			}
			#bungkus-jumbo{
				width:280px;
				float:left;
			}
			#ket{
				width:250px;
				float:left;
				margin-left:90px;
				margin-top:-10px;
			}
			#event-ket{
				width:500px;
				float:right;
				margin-right:60px;
			}
			#detail-ket{
				width:500px;
				float:right;
				margin-right:50px;
				margin-bottom:15px;
			}
			#detail-ket-sp{
				width:712px;
				float:right;
				position:absolute;
				margin-right:30px;
				margin-bottom:15px;
			}
			#event-crum{
				float:right;
				margin-top:5px;
			}
			#visit-website{
				width:127px;
				float:right;
				margin-top:15px;
				margin-left:40px;
				margin-right:0px;
			}
			#download{
				width:96px;
				float:right;
				margin-top:15px;
				margin-left:10px;
				margin-right:10px
			}
			#back-list{
				width:127px;
				float:left;
				margin-left:60px;
				margin-bottom:20px;
			}
			#detail-back-list{
				width:127px;
				float:left;
				margin-left:-20px;
				margin-bottom:20px;	
			}
			#detail-link-1{
				position:absolute;
				margin-left:390px;
				margin-top:175px;
				z-index:400;
			}
			#detail-link-2{
				position:absolute;
				margin-left:550px;
				margin-top:175px;
				z-index:400;
			}
			#detail-link-img-1{
				width:132px;
				height:104px;
			}
			#detail-link-img-2{
				width:92px;
				height:135px;
			}
			#product-title{
				width:300px;
				float:left;
				margin-top:10px;
				font-size:35px;
			}
			#product-des{
				width:295px;
				float:left;
				margin-top:20px;
			}
			#product-back{
				width:320px;
				float:left;
				margin-top:10px;
			}
				#kategori{
					width:97px;
					float:left;
					margin-right:5px;
					margin-top:15px;
				}
			#arrow-left{
				float:left;
				margin-left:-30px;
			}
			#arrow-right{
				float:right;
				margin-right:65px;
			}
			
		
		#hunt-shadow{
			width:100%;
			height:50px;
			float:left;
			margin-left:0px;
			margin-top:315px;
			}
		#hunt-shadow-product{
			width:100%;
			height:50px;
			float:left;
			margin-left:0px;
			margin-top:315px;
			}
		#hunt-shadow-2{
			width:100%;
			height:50px;
			float:left;
			margin-top:484px;
			margin-left:50px;
			}
		#hunt-shadow-3{
			width:100%;
			height:50px;
			float:left;
			margin-top:370px;
			margin-left:0px;
			}
		#hunt-shadow-k{
			width:100%;
			height:50px;
			float:left;
			margin-top:300px;
			margin-left:50px;
			}
		#main{
			width:100%;
			float:left;
			margin-top:-20px;
			}
			#main #kolomAjax{
				float:left;	
				margin-top:20px;
				margin-left:-20px;
				}
				/*========2menuindex*/
				#main-menu{
					width:712px;
					float:left;
					position:absolute;
					z-index:100;
					margin-top:-20px;
					}
					#index-menu-1{
						width:189px;
						height:46px;
						margin-right:40px;
					}
					#index-menu-2{
						width:218px;
						height:46px;
						margin-right:40px;
					}
					#index-menu-3{
						width:159px;
						height:46px;
					}
					#line-index{
						width:240px;
						height:12px;
						margin-top:-1000px;
						margin-left:-720px;
						position:absolute;	
					}
				#main-content{
					float:left;
					width:300px;
					margin-top:40px;
					}
					.home-font{
					font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; line-height:16px; margin-top:10px; text-align:justify;
					}
				#news{
				float:left;
				width:200px;
				height:224px;
				background:url(images/background-news.png) no-repeat top center;
				margin-top:60px;
				margin-left:15px;
				}
				#motion{
					float:left;
					margin-left:20px;
					width:126px;
					margin-top:60px;
				}
				#main-content-about{
					float:left;
					width:415px;
					margin-top:60px;
				}
				#main-content-about-detail{
					float:left;
					width:415px;
					margin-top:10px;
				}
				#main-content-faq{
					float:left;
					width:415px;
					margin-top:0px;
				}
					#about-menu-1{
						width:210px;
						height:46px;
						margin-right:40px;
						margin-top:-10px;
					}
					#about-menu-2{
						width:210px;
						height:46px;
						margin-right:40px;
						margin-top:-10px;
					}
					#head-qa{
						float:left;
						width:415px;
					}
					#num-qa{
						float:left;
						background:url(images/background-num-qa.png) no-repeat;
						width:25px;
						height:25px;
						text-align:center;
						margin-right:10px;
						vertical-align:middle;
						padding-top:3px;
					}
					#ques-qa{
						float:left;
					}
				#menubase{
					font-style:italic; font-size:25px; font-weight:normal;	
					width:242px;
				}
				#main-content-contact{
					float:left;
					width:650px;
					margin-left:250px;
				}
					#contact-crum{
						float:left;
						margin-right:30px;
					}
					#contact-msg{
						float:left;
						margin-right:20px;
						margin-top:12px;
					}
					.boxCust2{
						width: 120px;
						height: 14px;
						background:none;
						border: none;
						color: #000000;
						padding-top:0px;
						margin-top:1px;
						margin-left: 5px;
						font-size:11px;
					}
					#fieldHolderTxtCust2{
						width: 151px;
						height:17px;
						background:url(images/input-newsletter-off.png) no-repeat left;
						float:left;
						margin-top:10px;
					}
					#fieldHolderTxtCustK2{
						width: 151px;
						height:17px;
						background:url(images/input-newsletter.png) no-repeat left;
						float:left;
						margin-top:10px;
					}
					#go{
						position:absolute;
						margin-left:40px;
						margin-top:1px;
					}
				#consumer{
					float:right;
					width:650px;
					background:url(images/line-3.jpg) no-repeat left bottom;
					margin-bottom:30px;
					margin-right:60px;
				}
				#judul-faq{
					font-size:12px;
				}
				#award{
					float:left;
					width:420px;
					background:url(images/line-3.jpg) no-repeat left bottom;
					margin-top:8px;
					}
					#award-year{
						float:left;
						width:83px;
						height:35px;
						background:url(images/background-award-year.png) no-repeat center top;
					}
					#award-head{
						float:left;
						width:320px;
						margin-left:15px;
					}
					.year{
						font-family:Arial, Helvetica, sans-serif;
						font-size:15px;
						font-weight:normal;
						color:#FFF;
						text-align:center;
					}
				#banner-2{
					float:left;
					width:194px;
					height:200px;
					margin-top:130px;
					margin-left:30px;
					background:url(images/banner-2.png) no-repeat;
					}
				#banner-3{
					float:left;
					width:191px;
					height:186px;
					margin-top:185px;
					margin-left:30px;
					}
				#news-pic{
					float:left;
					margin-top:0px;
					margin-left:30px;
					}
		
		#footer{
			width:100%;
			float:left;
			margin-bottom:0px;
			}
			#logo-hunt-2{
				margin-left:500px;
			}
			#hunt-footer{
				width:100%;
				float:left;
				margin-top:20px;
				}
				#logo-indofood{
					float:left;
					margin-left:10px;
				}
			#button-open{
				width:712px;
				margin-left:50px;
				float:left;				
			}
			#footer_content {
				width: 712px;
				float:left;
				display: none;
				text-align:center;
			}
			#footer_button {
			float:left;
			width: 712px;
			font-size: 20px;
			cursor: pointer;
			}
			#logo-hunt{
				float:left;
				margin-left:510px;
				margin-top:-100px;
				position:absolute;
			}
			#hunt-1{
				width:180px;
				height:175px;
			}
/*=======================================================================================================================2gallery*/
.sliderwrapper{
position: absolute; /*leave as is*/
overflow: hidden; /*leave as is*/
width:100%; /*width of featured content slider*/
z-index:2;
text-align:justify;
}

.sliderwrapper .contentdiv{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
width:100%; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
z-index:2;
}

.pagination{
position: absolute;
width: 182px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
text-align: left;
padding: 0px 5px;
z-index:300;
margin-top:270px;
background:url(images/background-button-gallery.png) no-repeat left top;
margin-left:510px;

}

.pagination a{
padding:9px 9px;
text-decoration: none; 
color: #613814;
text-align:right;
}

.pagination a:hover, .pagination a.selected{
color: #613814;
background:url(images/background-button-gallery-hover.png) no-repeat top center;
text-align:right;
}

/*========================================================2galleryevent*/
.sliderwrapper5{
position: absolute; /*leave as is*/
overflow: hidden; /*leave as is*/
width: 100%; /*width of featured content slider*/
z-index:2;
text-align:justify;
}



.sliderwrapper5 .contentdiv5{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
width: 100%; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
height: 100%;
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
z-index:2;
}

.pagination5{
position: absolute;
width: 182px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
padding: 5px 10px;
z-index:300;
float:left;
}

.pagination5 a{
padding: 0 5px;
text-decoration: none; 
}

.pagination5 a:hover, .pagination a.selected{
color: #000;
}

/*=======================================================================================2motion*/
#motioncontainer {
/*margin:0 auto;  Uncomment this line if you wish to center the gallery on page */
width: 550px; /* Set to gallery width, in px or percentage */
height: 150px; /* Set to gallery height */
z-index:1000;
}

#motioncontainer2 {
/*margin:0 auto;  Uncomment this line if you wish to center the gallery on page */
width: 580px; /* Set to gallery width, in px or percentage */
height: 150px; /* Set to gallery height */
z-index:1000;
margin-left:5px;
}

#motiongallery{
	margin-left:-175px;
}
#motiongallery2{
	margin-left:-180px;
}


#fix-motion{
	margin-left:200px;
	margin-top:20px;
}

#motioncontainer a img {
	padding-left:-10px;
	padding-right:50px;
	
}

#motioncontainer a:hover img {
	padding-left:-10px;
	padding-right:50px;
}

#motioncontainer2 a img {
	padding-left:-10px;
	padding-right:50px;
	
}

#motioncontainer2 a:hover img {
	padding-left:-10px;
	padding-right:50px;
}

#statusdiv {
background-color: lightyellow;
border: 1px solid gray;
padding: 2px;
position: absolute; /* Stop Editing Gallery Styles */
left: -300px;
visibility: hidden;
}

#motioncontainer a:hover {
color: red; /* Dummy definition to overcome IE bug */
}
}


/*=========================================================================================4*/
/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (max-width: 767px) {
	
	body {
		width: 252px;
	}
	img{
		width:100%;
	}
	/*====================4index*/
	#menu-master{
		font-size:10px;
	}
	#dot-sm{
		width:7px;
		height:3px;
	}
	#dot-bg{
		width:10px;
		height:2px;
	}
	
	
	/*======4product*/
	#gal{
		width:120px;
		height:112px;
	}
	#gal-about{
		width:166px;
		height:178px;
	}
	#gal-load{
		width:120px;
		height:94px;
	}
	#gal-faq{
		width:120px;
		height:115px;
		margin-top:40px;
	}
	#row{
		width:50px;
		height:80px;
		margin-top:10px;
	}
	#row2{
		width:50px;
		height:80px;
		margin-top:30px;
		display:none;
	}
	#product-img{
		width:210px;
		height:154px;
	}
	
	#all{
	width:100%;
	float:left;
	margin:0 auto;
	margin-top:20px;
	padding-bottom:40px;
	}
	#hunt-header{
		width:252px;
		float:left;
		}
		/*=====================4hunt*/
		#cari-1{
			float:left;
			margin-left:0px;
			margin-top:0px;
		}
		#image-hunt{
			width:20px;
			height:12px;
			margin-right:5px;
		}
			#hunt-1content, #hunt-2content, #hunt-3content, #hunt-4content, #hunt-5content, #hunt-6content, #hunt-7content, #hunt-8content, #hunt-9content {
						position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-20px; margin-top:10px; z-index:8000; background:url(images/transparent.png); font-size:12px;
					}
			.hunt-hunt a{
					background:url(images/transparent.png);
			}
			.hunt-hunt a:hover{
					background:url(images/collect-me-4.png) no-repeat center;
			}
		#item-hunt{
			width:100px;
			height:84px;
		}
		#cari-2{
			float:left;
			margin-left:0px;
			margin-top:0px;
			position:absolute;
			z-index:10;
		}
		#hunt-10content, #hunt-11content, #hunt-12content, #hunt-13content, #hunt-14content, #hunt-15content, #hunt-16content, #hunt-17content, #hunt-18content {
			position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-30px; margin-top:10px; z-index:8000; background:url(images/transparent.png); font-size:12px;
		}
		#cari-3{
			float:left;
			margin-left:0px;
			margin-top:180px;
			position:absolute;
			z-index:10;
		}
		#hunt-19content, #hunt-20content, #hunt-21content, #hunt-22content, #hunt-23content{
			position:absolute; visibility: hidden; width: 150px; height:88px; margin-left:-30px; margin-top:-110px; z-index:8000; background:url(images/transparent.png); font-size:12px;
		}
		/*=====================1huntabout*/
		#cari-4{
			float:left;
			margin-left:150px;
			margin-top:50px;
			position:absolute;
		}
		#cari-5{
			float:left;
			margin-left:80px;
			margin-top:-20px;
		}
		#hunt-26content, #hunt-27content, #hunt-28content{
			position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-20px; margin-top:10px; z-index:8000; background:url(images/transparent.png); font-size:12px;
		}
	#header{
		width:252px;
		float:left;
		text-align:left;
		}
		#header .col1{
			font-size:10px;
			width:252px;
			float:left;	
			}
			#copyright{
				margin-left:15px;	
				font-size:8px;
				font-style:italic;
			}
			#flag{
				width:80px;
				margin-left:120px;
				margin-top:-3px;
				position:absolute;
			}
			#media{
				position:absolute;
				width:110px; /* original 70px*/
				margin-left:200px;
				margin-top:-5px;
				}
				#med-1{
					width:15px;
					height:15px;
					}
				#med-2{
					width:15px;
					height:15px;
					}
				#med-3{
					width:15px;
					height:15px;
					}
				#med-4{
					width:15px;
					height:15px;
					}
				#langu{
					width:67px;
					height:16px;
					}
				#soc-1{
					width:70px;
					height:70px;
					margin-left:-30px;
					margin-right:2px;
				}
				#soc-2{
					width:70px;
					height:70px;
					margin-right:2px;
				}
				#soc-3{
					width:70px;
					height:70px;
				}
		#header #col2{
			font-size:10px;
			float:left;
			width:252px;
			}
			#menu{
				float:left; font-size:10px; font-style:italic; margin-top:-20px; margin-left:0px;
			}
		#gallery{
			width:100%;
			float:left;
			}
			#logo-indomie{
				position:absolute;
				z-index:500;
				margin-top:35px;
				float:left;
				width:90px;
				height:58px;				
			}
			#banner-1{
				position:absolute;
				width:100%;
				height:auto;
				}
			#social-media{
				margin-top:40px;
				text-align:center;
			}
		#gallery-product{
			width:100%;
			margin:0 auto;
			margin-top:40px;
			float:none;
			position:relative;
			}
			#sudut{display:none;}
			#bungkus{
				width:100%;
				float:left;
				margin-top:0px;
				text-align:center;
			}
			#bungkus-jumbo{
				width:100%;
				float:left;
			}
			#ket{
				width:100%;
				float:left;
				margin-left:10px;
				margin-top:-10px;
			}
			#event-ket{
				width:500px;
				float:right;
				margin-right:20px;
				margin-top:-10px;
			}
			#detail-ket{
				width:252px;
				float:right;
				margin-right:0px;
				margin-top:-10px;
			}
			#detail-ket-sp{
				width:252px;
				float:right;
				position:absolute;
				margin-right:30px;
				margin-bottom:15px;
			}
			#event-crum{
				float:right;
				margin-top:-50px;
				font-size:12px;
				margin-right:10px;	
			}
			#visit-website{
				width:100px;
				float:right;
				margin-top:40px;
				margin-right:10px;
			}
			#download{
				width:70px;
				float:right;
				margin-top:40px;
			}
			#btn-load{
				width:70px;
				height:15px;
			}
			#back-list{
				width:127px;
				float:left;
				margin-left:65px;
				margin-bottom:20px;
			}
			#detail-back-list{
				width:60px;
				float:left;
				margin-left:35px;
				margin-top:-35px;
			}
			#detail-link-1{
				position:absolute;
				margin-left:135px;
				margin-top:60px;
				z-index:400;
			}
			#detail-link-2{
				position:absolute;
				margin-left:190px;
				margin-top:55px;
				z-index:400;
			}
			#detail-link-img-1{
				width:50px;
				height:50px;
			}
			#detail-link-img-2{
				width:35px;
				height:45px;
			}
			#product-title{
				width:200px;
				float:left;
				margin-top:0px;
				font-size:25px;
			}
			#product-des{
				width:94%;
				float:left;
				margin-top:0px;
			}
			#product-back{
				width:320px;
				float:left;
				margin-top:10px;
			}
				#kategori{
					width:252px;
					float:left;
					margin-right:5px;
					margin-top:15px;
				}
			#arrow-left{
				float:left;
				margin-left:-60px;
			}
			#arrow-right{
				float:right;
				margin-right:65px;
			}
			
		
		#hunt-shadow{
			width:100%; height:50px; margin-top:140px;
			}
		#hunt-shadow-product{
			width:100%;
			height:50px;
			float:left;
			background:url(images/shadow-gallery.png) no-repeat bottom;
			margin-top:420px;
			margin-left:0px;
			}
		#hunt-shadow-2{
			width:252px;
			height:50px;
			float:left;
			margin-top:484px;
			margin-left:50px;
			}
		#hunt-shadow-3{
			width:100%;
			height:50px;
			float:left;
			margin-top:200px;
			margin-left:0px;
			}
		#hunt-shadow-k{
			width:252px;
			height:50px;
			float:left;
			margin-top:100px;
			margin-left:0px;
			}
		#main{
			width:300px;
			float:left;
			margin:0;
			margin-left:80px;
		}
			#main #kolomAjax{
				float:left;	
				margin-top:20px;
				margin-left:-20px;
				}
				/*========4menuindex*/
				#main-menu{
					width:252px;
					float:left;
					position:absolute;
					z-index:100;
					margin-top:10px;
					margin-left:-15px;
					}
					#index-menu-1{
						width:74px;
						height:18px;
					}
					#index-menu-2{
						width:85px;
						height:18px;
					}
					#index-menu-3{
						width:62px;
						height:18px;
					}
					#index-font{
						width:220px;
						height:24px;
					}
					#line-index{
						width:240px;
						height:12px;
						margin-top:-1000px;
						margin-left:-720px;
						position:absolute;	
					}
				#main-content{
					float:left;
					width:200px;
					margin-top:40px;
					}
					.home-font{
					font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; line-height:16px; margin-top:10px; text-align:justify;
					}
				#news{
				float:left;
				width:200px;
				height:224px;
				background:url(images/background-news.png) no-repeat top center;
				margin-top:20px;
				margin-left:-20px;
				}
				#motion{
					float:left;
					margin-left:20px;
					width:126px;
					margin-top:20px;
				}
				#main-content-about{
					float:left;
					width:200px;
					margin-top:40px;
					margin-left:-30px;
				}
				#main-content-about-detail{
					float:left;
					width:230px;
					margin-top:10px;
					margin-left:10px;
				}
				#main-content-faq{
					float:left;
					width:220px;
					margin-top:0px;
					margin-left:15px;
					margin-bottom:20px;
				}
					#about-menu-1{
						width:120px;
						height:26px;
						margin-top:-10px;
						margin-left:-20px;
					}
					#about-menu-2{
						width:120px;
						height:26px;
						margin-top:-10px;
					}
					#title{
						font-size:30px;
					}
					#subtitle{
						font-size:20px;
					}
					#head-qa{
						float:left;
						width:252px;
					}
					#num-qa{
						float:left;
						background:url(images/background-num-qa.png) no-repeat;
						width:25px;
						height:25px;
						text-align:center;
						margin-right:10px;
						vertical-align:middle;
						padding-top:3px;
					}
					#ques-qa{
						float:left;						
					}
				#menubase{
					font-style:italic; font-size:25px; font-weight:normal;	
					width:242px;
				}
				#main-content-contact{
					float:left;
					width:650px;
					margin-left:250px;
				}
					#contact-crum{
						float:left;
						margin-right:30px;
					}
					#contact-msg{
						float:left;
						margin-right:20px;
						margin-top:12px;
					}
					.boxCust2{
						width: 120px;
						height: 14px;
						background:none;
						border: none;
						color: #000000;
						padding-top:0px;
						margin-top:1px;
						margin-left: 5px;
						font-size:11px;
					}
					#fieldHolderTxtCust2{
						width: 151px;
						height:17px;
						background:url(images/input-newsletter-off.png) no-repeat left;
						float:left;
						margin-top:10px;
					}
					#fieldHolderTxtCustK2{
						width: 151px;
						height:17px;
						background:url(images/input-newsletter.png) no-repeat left;
						float:left;
						margin-top:10px;
					}
					#go{
						position:absolute;
						margin-left:40px;
						margin-top:1px;
					}
				#consumer{
					float:left;
					width:252px;
					background:url(images/line-3.jpg) no-repeat left bottom;
					margin-bottom:5px;
					margin-left:-50px;
				}
				#judul-faq{
					font-size:12px;
				}
				#award{
					float:left;
					width:240px;
					background:url(images/line-3.jpg) no-repeat left bottom;
					margin-top:8px;
					margin-left:-15px;
					padding-bottom:10px;
					}
					#award-year{
						float:left;
						width:200px;
						height:35px;
						margin-left:15px;
						background:url(images/background-award-year.png) no-repeat center top;
					}
					#award-head{
						float:left;
						width:200px;
						margin-left:20px;
					}
					.year{
						font-family:Arial, Helvetica, sans-serif;
						font-size:15px;
						font-weight:normal;
						color:#FFF;
						text-align:center;
					}
				#banner-2{
					float:left;
					width:194px;
					height:200px;
					margin-top:10px;
					margin-left:-20px;
					background:url(images/banner-2.png) no-repeat;
					}
				#banner-3{
					float:left;
					width:191px;
					height:186px;
					margin-top:20px;
					margin-left:-20px;
					}
				#news-pic{
					float:left;
					margin-top:-40px;
					margin-left:65px;
					}
				#gal-faq-detail{
					width:120px;
					height:115px;
					margin-top:40px;
				}
				#kategoricontent{
					position:absolute; visibility: hidden; width: 252px; margin-left:0px; margin-top:-15px; z-index:3000; background:url(images/transparent.png);
				}
		
		#footer{
			width:252px;
			float:left;
			}
			#tambah{
				height:100px;
			}
			#tambah-2{
				height:200px;
			}
			#hunt-footer{
				width:252px;
				float:left;
				margin-top:0px;
				padding-top:30px;
				position:relative;
				}
				#logo-indofood{
					position:absolute;
					left:5px; bottom:-60px; margin:0; padding:0; float:none; width:70px; height:auto;
				}
			#button-open{
				width:252px;
				margin-left:5px;
				float:left;				
			}
			#footer_content {
				width: 252px;
				float:left;
				display: none;
				text-align:center;
			}
			#footer_button {
			float:left;
			width: 252px;
			font-size: 20px;
			cursor: pointer;
			}
			#logo-hunt{
				float:left;
				margin-left:50px;
				margin-top:-20px;
				position:absolute;
			}
			#logo-hunt-2{
				float:left;
				margin-left:50px;
				margin-top:40px;
				position:absolute;
			}
			#hunt-1{
				width:150px;
				height:146px;
			}
/*=======================================================================================================================4gallery*/
.sliderwrapper{
position: absolute; /*leave as is*/
overflow: hidden; /*leave as is*/
width: 100%; /*width of featured content slider*/
height: 600px;
z-index:2;
text-align:justify;
}

.sliderwrapper .contentdiv{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
width: 100%; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
z-index:2;
}

.pagination{
position: absolute;
width: 182px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
text-align: left;
padding: 0px 5px;
z-index:300;
margin:0;
margin-top:100px;
margin-left:200px;
}

/*========================================================3galleryevent*/
.sliderwrapper5{
position: absolute; /*leave as is*/
overflow: hidden; /*leave as is*/
width: 100%; /*width of featured content slider*/
z-index:2;
text-align:justify;
}



.sliderwrapper5 .contentdiv5{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
width: 100%; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
height: 100%;
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
z-index:2;
}

.pagination5{
position: absolute;
width: 182px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
padding: 5px 10px;
z-index:300;
float:left;
}

.pagination5 a{
padding: 0 5px;
text-decoration: none; 
}

.pagination5 a:hover, .pagination a.selected{
color: #000;
}

/*=======================================================================================4motion*/

#motioncontainer {
/*margin:0 auto;  Uncomment this line if you wish to center the gallery on page */
width: 180px; /* Set to gallery width, in px or percentage */
height: 150px; /* Set to gallery height */
z-index:1000;
margin-left:-15px;
margin-top:10px;
}

#motioncontainer2 {
/*margin:0 auto;  Uncomment this line if you wish to center the gallery on page */
width: 180px; /* Set to gallery width, in px or percentage */
height: 150px; /* Set to gallery height */
z-index:1000;
margin-left:-15px;
margin-top:10px;
}


#motiongallery{
	margin-left:-115px;
}
#motiongallery2{
	margin-left:-115px;
}

#motioncontainer a img {
	padding-left:-10px;
	padding-right:30px;
	
}
#motioncontainer a:hover img {
	padding-left:-10px;
	padding-right:30px;
}

#motioncontainer2 a img {
	padding-left:-10px;
	padding-right:30px;
	
}
#motioncontainer2 a:hover img {
	padding-left:-10px;
	padding-right:30px;
}

#statusdiv {
background-color: lightyellow;
border: 1px solid gray;
padding: 2px;
position: absolute; /* Stop Editing Gallery Styles */
left: -300px;
visibility: hidden;
}

#motioncontainer a:hover {
color: red; /* Dummy definition to overcome IE bug */
}
}


/*=========================================================================================3*/
/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */

@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	body {
		width: 436px;
	}
	img{
		width:100%;
	}
	/*====================3index*/
	#menu-master{
		font-size:12px;
	}
	#dot-sm{
		width:7px;
		height:3px;
	}
	#dot-bg{
		width:12px;
		height:3px;
	}
	
	
	/*======3product*/
	#gal{
		width:120px;
		height:112px;
	}
	#gal-about{
		width:166px;
		height:178px;
	}
	#gal-load{
		width:120px;
		height:94px;
	}
	#gal-faq{
		width:120px;
		height:115px;
		margin-top:40px;
	}
	#row{
		width:50px;
		height:80px;
		margin-top:10px;
		display:block;
	}
	#row2{
		width:50px;
		height:80px;
		margin-top:30px;
		display:block;
	}
	#product-img{
		width:200px;
		height:147px;
	}
	
	#all{
	width:100%;
	float:left;
	background:#FFFFFF url(images/background-footer.png) no-repeat bottom center;
	margin:0;
	}
	#hunt-header{
		width:436px;
		float:left;
		}
		/*=====================3hunt*/
		#cari-1{
			float:left;
			margin-left:0px;
			margin-top:0px;
		}
		#image-hunt{
			width:40px;
			height:12px;
			margin-right:5px;
		}
			#hunt-1content, #hunt-2content, #hunt-3content, #hunt-4content, #hunt-5content, #hunt-6content, #hunt-7content, #hunt-8content, #hunt-9content {
						position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-20px; margin-top:10px; z-index:8000; background:url(images/transparent.png); font-size:12px;
					}
			.hunt-hunt a{
					background:url(images/transparent.png);
			}
			.hunt-hunt a:hover{
					background:url(images/collect-me-3.png) no-repeat center;
			}
		#item-hunt{
			width:100px;
			height:84px;
		}
		#cari-2{
			float:left;
			margin-left:0px;
			margin-top:10px;
			position:absolute;
			z-index:10;
		}
		#hunt-10content, #hunt-11content, #hunt-12content, #hunt-13content, #hunt-14content, #hunt-15content, #hunt-16content, #hunt-17content, #hunt-18content {
			position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-30px; margin-top:10px; z-index:8000; background:url(images/transparent.png); font-size:12px;
		}
		#cari-3{
			float:left;
			margin-left:0px;
			margin-top:0px;
			position:absolute;
			z-index:10;
		}
		#hunt-19content, #hunt-20content, #hunt-21content, #hunt-22content, #hunt-23content{
			position:absolute; visibility: hidden; width: 150px; height:88px; margin-left:-30px; margin-top:-110px; z-index:8000; background:url(images/transparent.png); font-size:12px;
		}
		/*=====================1huntabout*/
		#cari-4{
			float:left;
			margin-left:200px;
			margin-top:50px;
			position:absolute;
		}
		#cari-5{
			float:left;
			margin-left:80px;
			margin-top:-20px;
		}
		#hunt-26content, #hunt-27content, #hunt-28content{
			position:absolute; visibility: hidden; width: 150px; height:126px; margin-left:-20px; margin-top:10px; z-index:8000; background:url(images/transparent.png); font-size:12px;
		}
	#header{
		width:436px;
		float:left;
		text-align:left;
		height:60px;
		}
		#header .col1{
			font-size:10px;
			width:436px;
			float:left;	
			}
			#copyright{
				margin:0; float:right; right:0;
				margin-right:20px;	
				font-size:10px;
				font-style:italic;
			}
			#flag{
				width:80px; 
				margin:0; float:none; right:0; margin-right:155px; margin-top:35px;
				position:absolute;
			}
			#media{
				position:absolute;
				width:110px; /* original 70px*/
				margin:0; float:none; right:0; margin-right:50px; margin-top:33px;
				}
				#med-1{
					width:15px;
					height:15px;
					}
				#med-2{
					width:15px;
					height:15px;
					}
				#med-3{
					width:15px;
					height:15px;
					}
				#med-4{
					width:15px;
					height:15px;
					}
				#langu{
					width:67px;
					height:16px;
					}
				#soc-1{
					width:120px;
					height:120px;
					margin-left:-20px;
					margin-right:10px;
				}
				#soc-2{
					width:120px;
					height:120px;
					margin-right:10px;
				}
				#soc-3{
					width:120px;
					height:120px;
				}
		#header #col2{
			font-size:10px;
			float:left;
			width:436px;
			}
			#menu{
				float:left; font-size:10px; font-style:italic; margin-top:-15px; margin-left:125px;
			}
		#gallery{
			width:100%;
			float:left;
			}
			#logo-indomie{
				position:absolute;
				z-index:6000;
				margin-top:30px;
				float:left;
				width:120px;
				height:77px;				
			}
			#banner-1{
				position:absolute;
				width:100%;
				height:auto;
				}
			#social-media{
				margin-top:90px;
				margin-left:50px;
			}
		#gallery-product{
			width:100%;
			margin-top:30px;
			float:left;
			margin-left:20px;
			height:280px;
			}
			#sudut{
				position:absolute;
				float:left;
				margin-left:398px;
				z-index:3000;
				margin-top:58px;
			}
			#bungkus{
				width:200px;
				float:left;
				margin-top:40px;
			}
			#bungkus-jumbo{
				width:280px;
				float:left;
			}
			#ket{
				width:200px;
				float:left;
				margin-left:10px;
				margin-top:-10px;
			}
			#event-ket{
				width:500px;
				float:right;
				margin-right:20px;
				margin-top:-10px;
			}
			#detail-ket{
				width:500px;
				float:right;
				margin-right:0px;
				margin-top:-10px;
			}
			#detail-ket-sp{
				width:436px;
				float:right;
				position:absolute;
				margin-right:30px;
				margin-bottom:15px;
			}
			#event-crum{
				float:right;
				margin-top:5px;
			}
			#visit-website{
				width:127px;
				float:right;
				margin-top:15px;
				margin-left:40px;
				margin-right:0px;
			}
			#download{
				width:70px;
				float:right;
				margin-top:17px;
				margin-left:10px;
				margin-right:10px
			}
			#btn-load{
				width:70px;
				height:15px;
			}
			#back-list{
				width:127px;
				float:left;
				margin-left:65px;
				margin-bottom:20px;
			}
			#detail-back-list{
				width:100px;
				float:left;
				margin-left:20px;
				margin-top:-5px;
			}
			#detail-link-1{
				position:absolute;
				margin-left:240px;
				margin-top:110px;
				z-index:400;
			}
			#detail-link-2{
				position:absolute;
				margin-left:330px;
				margin-top:100px;
				z-index:400;
			}
			#detail-link-img-1{
				width:82px;
				height:65px;
			}
			#detail-link-img-2{
				width:56px;
				height:78px;
			}
			#product-title{
				width:200px;
				float:left;
				margin-top:0px;
				font-size:25px;
			}
			#product-des{
				width:180px;
				float:left;
				margin-top:0px;
			}
			#product-back{
				width:320px;
				float:left;
				margin-top:10px;
			}
			#title{
				font-size:30px;
			}
			#subtitle{
				font-size:20px;
			}
				#kategori{
					width:97px;
					float:left;
					margin-right:5px;
					margin-top:15px;
				}
			#arrow-left{
				float:left;
				margin-left:-30px;
			}
			#arrow-right{
				float:right;
				margin-right:65px;
			}
			
		
		#hunt-shadow{
			width:100%;
			height:50px;
			float:left;
			margin-top:190px;
			margin-left:0px;
			}
		#hunt-shadow-product{
			width:100%;
			height:50px;
			float:left;
			background:url(images/shadow-gallery.png) no-repeat bottom;
			margin-top:10px;
			margin-left:0px;
			}
			#hunt-shadow-product #hunt1{
			float:left;
			}
			#hunt-shadow-product #hunt2{
			float:left;
			}
			#hunt-shadow-product #hunt3{
			float:left;
			}
			#hunt-shadow-product #hunt4{
			float:left;
			}
		#hunt-shadow-2{
			width:100%;
			height:50px;
			float:left;
			margin-top:484px;
			margin-left:50px;
			}
		#hunt-shadow-3{
			width:100%;
			height:50px;
			float:left;
			margin-top:250px;
			margin-left:0px;
			}
		#hunt-shadow-k{
			width:100%;
			height:50px;
			float:left;
			margin-top:200px;
			margin-left:0px;
			}
		#main{
			width:436px;
			float:left;
			margin-top:-20px;
			}
			#main #kolomAjax{
				float:left;	
				margin-top:20px;
				margin-left:-20px;
				}
				/*========3menuindex*/
				#main-menu{
					width:436px;
					float:left;
					position:absolute;
					z-index:100;
					margin-top:-20px;
					margin-left:0px;
					}
					#index-menu-1{
						width:123px;
						height:30px;
						margin-right:15;
					}
					#index-menu-2{
						width:142px;
						height:30px;
						margin-right:15;
						cursor:default;
					}
					#index-menu-3{
						width:103px;
						height:30px;
					}
					#line-index{
						width:240px;
						height:12px;
						margin-top:-1000px;
						margin-left:-720px;
						position:absolute;	
					}
				#main-content{
					float:left;
					width:350px;
					margin-top:40px;
					}
					.home-font{
					font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; line-height:16px; margin-top:10px; text-align:justify;
					}
				#news{
				float:left;
				width:200px;
				height:224px;
				background:url(images/background-news.png) no-repeat top center;
				margin-top:20px;
				margin-left:-20px;
				}
				#motion{
					float:left;
					margin-left:20px;
					width:126px;
					margin-top:20px;
				}
				#main-content-about{
					float:left;
					width:380px;
					margin-top:60px;
					margin-left:-20px;
				}
				#main-content-about-detail{
					float:left;
					width:375px;
					margin-top:10px;
					margin-left:20px;
				}
				#main-content-faq{
					float:left;
					width:220px;
					margin-top:0px;
					margin-left:20px;
					margin-bottom:20px;
				}
					#about-menu-1{
						width:160px;
						height:35px;
						margin-right:5px;
						margin-top:-10px;
						margin-left:-30px;
					}
					#about-menu-2{
						width:160px;
						height:35px;
						margin-right:5px;
						margin-top:-10px;
					}
					#head-qa{
						float:left;
						width:415px;
					}
					#num-qa{
						float:left;
						background:url(images/background-num-qa.png) no-repeat;
						width:25px;
						height:25px;
						text-align:center;
						margin-right:10px;
						vertical-align:middle;
						padding-top:3px;
					}
					#ques-qa{
						float:left;
					}
				#menubase{
					font-style:italic; font-size:25px; font-weight:normal;	
					width:242px;
				}
				#main-content-contact{
					float:left;
					width:650px;
					margin-left:250px;
				}
					#contact-crum{
						float:left;
						margin-right:30px;
					}
					#contact-msg{
						float:left;
						margin-right:20px;
						margin-top:12px;
					}
					.boxCust2{
						width: 120px;
						height: 14px;
						background:none;
						border: none;
						color: #000000;
						padding-top:0px;
						margin-top:1px;
						margin-left: 5px;
						font-size:11px;
					}
					#fieldHolderTxtCust2{
						width: 151px;
						height:17px;
						background:url(images/input-newsletter-off.png) no-repeat left;
						float:left;
						margin-top:10px;
					}
					#fieldHolderTxtCustK2{
						width: 151px;
						height:17px;
						background:url(images/input-newsletter.png) no-repeat left;
						float:left;
						margin-top:10px;
					}
					#go{
						position:absolute;
						margin-left:40px;
						margin-top:1px;
					}
				#consumer{
					float:left;
					width:436px;
					background:url(images/line-3.jpg) no-repeat left bottom;
					margin-bottom:5px;
					margin-left:-40px;
				}
				#judul-faq{
					font-size:13px;
				}
				#award{
					float:left;
					width:410px;
					background:url(images/line-3.jpg) no-repeat left bottom;
					margin-top:8px;
					margin-left:-15px;
					}
					#award-year{
						float:left;
						width:83px;
						height:35px;
						margin-left:15px;
						background:url(images/background-award-year.png) no-repeat center top;
					}
					#award-head{
						float:left;
						width:270px;
						margin-left:20px;
					}
					.year{
						font-family:Arial, Helvetica, sans-serif;
						font-size:15px;
						font-weight:normal;
						color:#FFF;
						text-align:center;
					}
				#banner-2{
					float:left;
					width:194px;
					height:200px;
					margin-top:10px;
					margin-left:70px;
					background:url(images/banner-2.png) no-repeat;
					}
				#banner-3{
					float:left;
					width:191px;
					height:186px;
					margin-top:20px;
					margin-left:70px;
					}
				#news-pic{
					float:left;
					margin-top:0px;
					margin-left:30px;
					}
				#kategoricontent{
					position:absolute; visibility: hidden; width: 380px; margin-left:-165px; margin-top:-20px; z-index:3000; background:url(images/transparent.png);
				}
		
		#footer{
			width:436px;
			float:left;
			margin-bottom:20px;
			}
			#tambah{
				height:50px;
			}
			#tambah-2{
				height:70px;
			}
			#hunt-footer{
				width:436px;
				float:left;
				margin-top:30px;
				}
				#logo-indofood{
					position:absolute;
					left:10px; bottom:-80px; margin:0; padding:0; float:none; width:90px; height:auto;
				}
			#button-open{
				width:436px;
				margin-left:5px;
				float:left;				
			}
			#footer_content {
				width: 436px;
				float:left;
				display: none;
				text-align:center;
			}
			#footer_button {
			float:left;
			width: 436px;
			font-size: 20px;
			cursor: pointer;
			}
			#logo-hunt{
				float:left;
				margin-left:250px;
				margin-top:-50px;
				position:absolute;
			}
			#logo-hunt-2{
				float:left;
				margin-left:250px;
				margin-top:-30px;
				position:absolute;
			}
			#hunt-1{
				width:150px;
				height:146px;
			}
/*=======================================================================================================================3gallery*/
.sliderwrapper{
position: absolute; /*leave as is*/
overflow: hidden; /*leave as is*/
width: 100%; /*width of featured content slider*/
height: 100%;
z-index:2;
text-align:justify;
}

.sliderwrapper .contentdiv{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
width: 100%; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
z-index:2;
}


/*========================================================3galleryevent*/
.sliderwrapper5{
position: absolute; /*leave as is*/
overflow: hidden; /*leave as is*/
width: 100%; /*width of featured content slider*/
z-index:2;
text-align:justify;
}



.sliderwrapper5 .contentdiv5{
visibility: hidden; /*leave as is*/
position: absolute; /*leave as is*/
left: 0;  /*leave as is*/
top: 0;  /*leave as is*/
width: 100%; /*width of content DIVs within slider. Total width should equal slider's inner width (390+5+5=400) */
height: 100%;
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
z-index:2;
}

.pagination5{
position: absolute;
width: 182px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
padding: 5px 10px;
z-index:300;
float:left;
}

.pagination5 a{
padding: 0 5px;
text-decoration: none; 
}

.pagination5 a:hover, .pagination a.selected{
color: #000;
}

.pagination{margin-top:170px; margin-left:360px;}

/*=======================================================================================3motion*/

#motioncontainer {
/*margin:0 auto;  Uncomment this line if you wish to center the gallery on page */
width: 290px; /* Set to gallery width, in px or percentage */
height: 150px; /* Set to gallery height */
z-index:1000;
margin-left:-15px;
}

#motioncontainer2 {
/*margin:0 auto;  Uncomment this line if you wish to center the gallery on page */
width: 330px; /* Set to gallery width, in px or percentage */
height: 150px; /* Set to gallery height */
z-index:1000;
margin-left:0px;
}


#motiongallery{
	margin-left:-155px;
}
#motiongallery2{
	margin-left:-180px;
}

#fix-motion{
	margin-left:200px;
	margin-top:20px;
}

#motioncontainer a img {
	padding-left:-10px;
	padding-right:40px;
	
}
#motioncontainer a:hover img {
	padding-left:-10px;
	padding-right:40px;
}

#motioncontainer2 a img {
	padding-left:-15px;
	padding-right:25px;
	
}
#motioncontainer2 a:hover img {
	padding-left:-15px;
	padding-right:25px;
}

#statusdiv {
background-color: lightyellow;
border: 1px solid gray;
padding: 2px;
position: absolute; /* Stop Editing Gallery Styles */
left: -300px;
visibility: hidden;
}

#motioncontainer a:hover {
color: red; /* Dummy definition to overcome IE bug */
}
	
}

/*mobile320*/
@media only screen and (min-width: 10px) and (max-width: 990px) {
	body, html{width:100%; margin:0; padding:0; max-width:100%; overflow-x:hidden;}
	#all{background-size:700px auto;}
	#menu{display:none;}
	.menu-m{display:block; position:absolute; z-index:99999; width:100%;}
	.m-space-1{height:300px;}
	#title{font-size:20px;}
	
}

/*mobile568*/
@media only screen and (min-width: 540px) and (max-width: 748px) {
	.pagination{position:absolute; margin-top:200px; margin-left:370px;}
	#hunt-shadow{margin-top:250px;}
	#main{width:500px;}
		#main-content, #main-content-about{width:460px;}
	#copyright{position:absolute; top:0; right:45px;}
	#award{width:500px;}
		#award-head{width:360px;}
	#ket{width:350px;}
		#product-title{width:300px;}
		#product-des{width:300px;}
	#consumer{width:520px;}
		#main-content-faq{width:300px;}
	#main-content-about #product-title{width:100%;}
		#main-content-about-detail{width:460px; display:block; float:none; clear:both;}
		#head-qa{width:100%;}
}

/*mobile768*/
@media only screen and (min-width: 758px) and (max-width: 990px) {
	#all{background-size:100% auto;}
	#footer{position:relative; margin-top:40px;}
		#logo-indofood{position:absolute; bottom:5px; left:5px; width:120px; height:auto;}
	#hunt-shadow{margin-top:340px;}
	#hunt-shadow-3{margin-top:390px;}
	#consumer{margin-left:0px; float:left;}
	.m-space-1{height:600px;}
}


@media only screen and (min-width: 380px) and (max-width: 450px) {
	.pagination{margin:130px 0 0 260px;}
}
@media only screen and (min-width: 451px) and (max-width: 480px) {
	.pagination{margin:160px 0 0 300px;}
}

@media only screen and (min-width: 460px) and (max-width: 548px) {
	#hunt-shadow{margin-top:240px; background:none;}
}

@media only screen and (min-width: 600px) and (max-width: 720px) {
	#hunt-shadow{margin-top:300px; background:none;}
	.pagination{margin:230px 0 0 480px;}
}
@media only screen and (min-width: 630px) and (max-width: 700px) {
	#hunt-shadow-3{margin-top:340px;}
}
@media only screen and (min-width: 700px) and (max-width: 740px) {
	#all{background-size:750px auto;}
	#hunt-shadow-3{margin-top:360px;}
}
@media only screen and (min-width: 721px) and (max-width: 760px) {
	#all{background-size:760px auto;}
	#hunt-shadow{margin-top:340px; background:none;}	
	#hunt-shadow-3{margin-top:380px;}
	.pagination{margin:260px 0 0 550px;}
}
@media only screen and (min-width: 761px) and (max-width: 990px) {
	.pagination{background:none; margin:280px 0 0 600px;}
		.pagination a{padding-top:2px;}
	#hunt-shadow{margin-top:380px; background:none;}
	#motioncontainer, #motioncontainer2{height:200px;}
}
@media only screen and (min-width: 810px) and (max-width: 990px) {
	.pagination{margin:320px 0 0 680px;}
}
@media only screen and (min-width: 880px) and (max-width: 990px) {
	#hunt-shadow-3{margin-top:450px;}
}
@media only screen and (min-width: 930px) and (max-width: 990px) {
	#hunt-shadow{margin-top:420px;}
	.pagination{margin:360px 0 0 760px;}
	.m-space-1{height:730px;}
}
@media only screen and (min-width: 960px) and (max-width: 990px) {
	#hunt-shadow-3{margin-top:480px;}
}