

/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://opensource.org/licenses/mit-license.php	*/

/*COLOR*/
	/*
	GREY DARK #787878
	GREY LIGHT #797979
	BLACK DARK #0c0c0c
	BLACK LIGHT #3a3a3a
	BLUE #00529b
	WHITE #FFF
	RED #ed1e30
	*/
	
	
/*FONT*/
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
/* font-family: "Inter", serif;
font-family: "Lato", serif; */

	
/*	Resets
	------	*/

html, body, div, span, object, iframe, h1, h2, h3, h4, 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;
	padding: 0;
	border: 0;	
}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
}

a {text-decoration:none; border:none; outline:0;}
img{border:none; outline:0;}
.cursor{cursor:pointer;}
textarea {
    resize: none;
}
ul li{
	padding:0;
	}
p{}
#clear{
	clear:both;
	height:0;
	}
	
	
/*LINK*/
.link-black15b a{font-size:15px; line-height: 22px; color:#0c0c0c; font-family: "Lato", serif; font-weight: bold;}
.link-grey12 a{font-size:12px; line-height: 17px; color:#787878; font-family: "Lato", serif;}
.link-readmore a{font-size:15px; line-height: 22px; color:#ed1e30; font-family: "Lato", serif;}
	.link-readmore a:hover{font-size:15px; line-height: 22px; color:#3a3a3a; font-family: "Lato", serif;}
.link-out a{font-size:12px; line-height: 17px; color:#00529b; font-family: "Lato", serif;}
	.link-out a:hover{font-size:12px; line-height: 17px; color:#787878; font-family: "Lato", serif;}
.link-blue13 a{font-size:13px; line-height: 18px; color:#00529b; font-family: "Lato", serif;}
	.link-blue13 a:hover{font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif;}

/*SPACE*/
.space-0{margin-top:5px;}
.space-1{margin-top:10px;}
.space-2{margin-top:20px;}
.space-3{margin-top:30px;}
.space-4{padding-top:40px;}
.space-6{margin-top:60px;}

/*	Typography presets
	------------------	*/

.gigantic {
	font-size: 110px;
	line-height: 120px;
	letter-spacing: -2px;
}

.huge, h1 {
	font-size: 68px;
	line-height: 72px;
	letter-spacing: -1px;
}

.large, h2 {
	font-size: 42px;
	line-height: 48px;
}

.bigger, h3 {
	font-size: 26px;
	line-height: 36px;
}

.big, h4 {
	font-size: 22px;
	line-height: 30px;
}

body {
	font: 16px/24px;
}

.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);}


/*TEXTFIELD*/
.boxsearch{
	width: 160px;
	height: 20px;
	border: none;
	background:none;
	color: #787878;
	font-size:10px;
	padding:4px 0 0 12px;	
	border:none;
	outline:none;
}
#fieldsearch{
	float:right;
	width:170px;
	height:29px;
	background:url(../images/microsite/background/txt-search.png) no-repeat top left;
}
.btn-search{float:right;}

.boxtxt{
	width: 270px;
	height: 20px;
	border: none;
	background:none;
	color: #787878;
	font-size:12px; line-height: 17px;
	padding:6px 0 0 12px;	
	border:none;
	outline:none;
}
#fieldtxt{
	width:288px;
	height:28px;
	background:url(../images/microsite/background/txt-k.jpg) no-repeat top left;
}
.boxtxt2{
	width: 270px;
	height: 20px;
	border: none;
	background:none;
	color: #787878;
	font-size:12px; line-height: 17px;
	padding:4px 0 0 12px;	
	border:none;
	outline:none;
}
#fieldtxt2{
	width:288px;
	height:28px;
	background:url(../images/microsite/background/txt-k2.jpg) no-repeat top left;
}
.boxtxts{
	width: 100px;
	height: 20px;
	border: none;
	background:none;
	color: #787878;
	font-size:12px; line-height: 17px;
	padding:4px 0 0 12px;	
	border:none;
	outline:none;
}
#fieldtxts{
	width:113px;
	height:28px;
	background:url(../images/microsite/background/txt-ks.jpg) no-repeat top left;
}
.boxtxtm1{
	width: 180px;
	height: 20px;
	border: none;
	background:none;
	color: #787878;
	font-size:12px; line-height: 17px;
	padding:6px 0 0 12px;	
	border:none;
	outline:none;
}
#fieldtxtm1{
	width:191px;
	height:28px;
	background:url(../images/microsite/background/txt-km1.jpg) no-repeat top left;
}
.boxtxtm2{
	width: 180px;
	height: 20px;
	border: none;
	background:none;
	color: #787878;
	font-size:12px; line-height: 17px;
	padding:4px 0 0 12px;	
	border:none;
	outline:none;
}
#fieldtxtm2{
	width:191px;
	height:28px;
	background:url(../images/microsite/background/txt-km2.jpg) no-repeat top left;
}

.boxarea{
	width: 278px;
	height: 65px;
	background:none;
	border: none;
	color: #787878;
	font-size:12px; line-height: 17px;
	padding:5px 0 0 8px;
}
#fieldarea{
	width:288px;
	height:74px;
	background:url(../images/microsite/background/txt-area.jpg) no-repeat top left;
}


/*SELECT*/
form div{position:relative;} 
/* setting the width and height of the SELECT element to match the replacing graphics */
select.select{
	position:relative;
	z-index:10;
	width:191px !important;
	height:28px !important;
	line-height:30px;
}
/* dynamically created SPAN, placed below the SELECT */
span.select{
	position:absolute;
	bottom:0;
	float:left;
	left:0;
	width:191px;
	height:28px;
	line-height:30px;
	text-indent:10px;
	background:url(../images/microsite/background/txt-option1.jpg) no-repeat 0 0;
	cursor:default;
	z-index:1;
	padding-top:2px;
	}

select.select2{
	position:relative;
	z-index:10;
	width:191px !important;
	height:28px !important;
	line-height:30px;
}

/* dynamically created SPAN, placed below the SELECT */
span.select2{
	position:absolute;
	bottom:0;
	float:left;
	left:0;
	width:191px;
	height:28px;
	line-height:30px;
	text-indent:10px;
	background:url(../images/microsite/background/txt-option2.jpg) no-repeat 0 0;
	cursor:default;
	z-index:1;
	padding-top:2px;
	}

select.select3{
	position:relative;
	z-index:10;
	width:196px !important;
	height:29px !important;
	line-height:30px;
}

/* dynamically created SPAN, placed below the SELECT */
span.select3{
	position:absolute;
	bottom:0;
	float:right;
	left:0;
	width:191px;
	height:28px;
	line-height:30px;
	text-indent:10px;
	background:url(../images/microsite/background/txt-option2.jpg) no-repeat 0 0;
	cursor:default;
	z-index:1;
	}

/*		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: 100%;
	/*padding: 72px 48px 84px;
	background: rgb(232,232,232);
	color: rgb(60,60,60);*/
	margin:0 auto;
	-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
	overflow-x:hidden;
}

/*HEADER*/
.header{width:100%; margin:0 auto; padding-top:20px; height:63px; background:url(../images/microsite/19/bg-header.jpg) repeat-x top center;}
	.header-content{width:960px; margin:0 auto; background:none;}
		.header-l{float:left; width:320px;}
			.hl-1 {float:left; width: 39px; height: 35px; background: url(../images/microsite/background/icon.png) 0px 0px; text-indent: -99999px; cursor:pointer;}
				.hl-1:hover {background-position: 0px -35px;}
			.hl-2 {float:left; width: 39px; height: 35px; background: url(../images/microsite/background/icon.png) -39px 0px; text-indent: -99999px; cursor:pointer;}
				.hl-2:hover {background-position: -39px -35px;}
				.hl-2a {float:left; width: 39px; height: 35px; background: url(../images/microsite/background/icon.png) -39px -35px; text-indent: -99999px; cursor:pointer;}
			.hl-3 {float:left; width: 39px; height: 35px; background: url(../images/microsite/background/icon.png) -78px 0px; text-indent: -99999px; cursor:pointer;}
				.hl-3:hover {background-position: -78px -35px;}
				.hl-3a {float:left; width: 39px; height: 35px; background: url(../images/microsite/background/icon.png) -78px -35px; text-indent: -99999px; cursor:pointer;}		
        .header-r{float:right; width:200px; padding:5px 6px 0 0;}
		.header-r2{float:right; width:150px; margin-right:20px;}
		.header img{display: none;}
	/*menu*/
	.menu{width:960px; margin:0 auto; padding-top:22px; background:url(../images/microsite/background/line-menu.jpg) repeat-x bottom center; height:46px; text-align:center;}
	.menu-tablet{display:none;}
		.menu-link a{font-size:30px; font-family: "Inter", serif; font-weight: 300; color:#797979; padding:0 22px 18px 22px; cursor:pointer;}
			.menu-link a:hover{font-size:30px; font-family: "Inter", serif; font-weight: 300; color:#797979; padding:0 22px 18px 22px; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
			.menu-linka a{font-size:30px; font-family: "Inter", serif; font-weight: 300; color:#797979; padding:0 22px 18px 22px; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
	.menu-mobile{display:none;}
	
	/*banner*/
	#main-slider{display:block;}
	#main-sliderm{display:none;}
	
		
/*FOOTER*/
.footer{width:960px; margin:0 auto; padding:10px 0;}
	.footer-line{background:url(../images/microsite/background/line.jpg) repeat-x center; height:20px; width:100%;}
	.footer-l{float:left;}
		.link-footer{color:#787878; font-size:13px; line-height: 18px; font-family: "Inter", serif; padding:0 5px; float:left;}
			.link-footer a{color:#787878; font-size:13px; line-height: 18px; font-family: "Inter", serif; padding:0 5px;}
			.link-footer a:hover{color:#00529b; font-size:13px; line-height: 18px; font-family: "Inter", serif; padding:0 5px;}
		.copyright{font-size:11px; line-height: 21px; font-family: "Inter", serif; color:#b6b6b6; float:left; padding-top:10px;}
	.footer-r{float:right;}
		.icon-mail-footer{float:left; width: 27px; height: 27px; background: url(../images/microsite/background/icon-mail.jpg) 0px 0px; text-indent: -99999px; cursor:pointer;}
				.icon-mail-footer:hover {background-position: 0px -27px;}

/*MAIN*/
.main{width:960px; margin:0 auto;}
.main-content{width:960px; margin:0 auto; padding-top:40px;}
	.main-head{width:100%; padding-bottom:35px;}
	.main-title{font-size:45px; color:#3a3a3a; font-family: "Inter", serif; font-weight: 300; letter-spacing: .6px; word-spacing: 7px; padding-top:5px; line-height:42px; text-align:left;}
		.main-subtitle{font-size:30px; color:#787878; font-family: "Inter", serif; font-weight: 200; padding-top:30px; float:left; text-align:left;}
		.main-subtitle2{font-size:30px; color:#787878; font-family: "Inter", serif; font-weight: 300; padding-top:30px; float:left; text-align:left;}
		.main-subtitle3{font-size:25px; color:#787878; font-family: "Inter", serif; font-weight: 200; text-align:left;}
		.main-select{font-size:12px; line-height: 17px; color:#787878; font-family: "Lato", serif; padding-top:30px; float:right;} 		
	.main-text{font-family: "Lato", serif; font-size:14px; line-height:20px; color:#787878; text-align:justify;}
		.main-space1{float:left; display:block; width:30px;}
		.main-space2{float:left; display:block; width:23px;}
		.main-space3{float:left; display:block; width:10px;}
		.main-text p{padding-bottom:10px;}
		.main-text ul{padding-left:15px;}
		.main-texts{font-family: "Lato", serif; font-size:12px; line-height: 22px; color:#787878; text-align:justify;}
		.main-textm{font-family: "Lato", serif; font-size:15px; line-height: 23px; color:#787878; text-align:justify;}
		.main-textl{font-family: "Lato", serif; font-size:18px; line-height: 23px; color:#787878; text-align:justify;}
	.main-isi{float:right; padding-right:5px; width:713px;}
	.main-line{background:url(../images/microsite/background/line.jpg) repeat-x center; height:2px;}
	.star{font-size:13px; line-height: 18px; color:#00529b;font-family: "Lato", serif; font-style:italic;}
	#secret-contact{display: none; width:222px; padding-top:10px;}
	/*time*/
	.time{float:left; background:url(../images/microsite/background/date.jpg) no-repeat top left; width:42px; height:64px; margin-top:5px; font-family: "Inter", serif; text-align:center;}
		.date{font-size:20px; color:#787878; padding-top:8px;}
		.mon{font-size:15px; line-height: 22px; color:#FFF; padding-top:8px;}
		.year{font-size:18px; line-height: 23px; color:#b6b6b6; padding-top:6px;}
	
	/*icon*/
	.icon-x {float:inherit; width: 40px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-x.jpg) 0px 0px;}
		.icon-x:hover {background-position: 0px -39px;}
	.icon-web {float:left; width: 40px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-web.jpg) 0px 0px;}
		.icon-web:hover {background-position: 0px -39px;}
	.icon-all {float:left; width: 40px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-all.jpg) 0px 0px;}
		.icon-all:hover {background-position: 0px -39px;}
	.icon-prev {float:right; width: 36px; height:36px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-prev.jpg) 0px 0px; margin-right:10px;}
		.icon-prev:hover {background-position: 0px -36px;}
	.icon-next {float:right; width: 36px; height:36px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-next.jpg) 0px 0px;}
		.icon-next:hover {background-position: 0px -36px;}
	.icon-up {float:left; width: 36px; height:36px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-up.jpg) 0px 0px;}
		.icon-up:hover {background-position: 0px -36px;}
	.icon-down {float:left; width: 36px; height:36px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-down.jpg) 0px 0px;}
		.icon-down:hover {background-position: 0px -36px;}
	.icon-contactus {float:left; width: 182px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/contact-us.jpg) 0px 0px;}
		.icon-contactus:hover {background-position: 0px -39px;}
	.icon-read {float:left; width: 40px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-read.jpg) 0px 0px;}
		.icon-read:hover {background-position: 0px -39px;}
	.icon-save {float:left; width: 40px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-save.jpg) 0px 0px;}
		.icon-save:hover {background-position: 0px -39px;}
	.icon-thumb {float:left; width: 40px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-thumb.jpg) 0px 0px; margin-right:10px;}
		.icon-thumb:hover {background-position: 0px -39px;}
	.icon-view {float:left; width: 40px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-view.jpg) 0px 0px;}
		.icon-view:hover {background-position: 0px -39px;}
	.icon-more {float:left; width: 40px; height:39px; text-indent:-99999px; cursor:pointer; background: url(../images/microsite/background/icon-more.jpg) 0px 0px;}
		.icon-more:hover {background-position: 0px -39px;}
	.icon-space1{float:left; width:40px;}
	
	/*navigation*/
	.navigation{float:left; width:222px;}
	.navigation-mobile{display:none;}
		.nav-title{font-size:13px; line-height: 18px; color:#787878; font-family: "Inter", serif;}
		.nav-titlea{font-size:13px; line-height: 18px; color:#00529b; font-family: "Inter", serif;}
		.nav-dot{background:url(../images/microsite/background/menu-line.png) repeat-x center; height:10px; width:100%;}
		.nav-line{background:url(../images/microsite/19/) repeat-x center; height:10px; width:100%;}
		.nav-link a{background:url(../images/microsite/background/arrow-menu.jpg) no-repeat left; padding-left:10px; color:#787878; font-size:13px; line-height: 18px; font-family: "Inter", serif;}
			.nav-link a:hover{background:url(../images/microsite/background/arrow-menu.jpg) no-repeat left; padding-left:10px; color:#00529b; font-size:13px; line-height: 18px; font-family: "Inter", serif;}
			.nav-linka a{background:url(../images/microsite/background/arrow-menu.jpg) no-repeat left; padding-left:10px; color:#00529b; font-size:13px; line-height: 18px; font-family: "Inter", serif;}
		.nav-link2 a{color:#787878; font-size:13px; line-height: 18px; font-family: "Inter", serif;}
			.nav-link2 a:hover{color:#00529b; font-size:13px; line-height: 18px; font-family: "Inter", serif;}
			.nav-link2a a{color:#00529b; font-size:13px; line-height: 18px; font-family: "Inter", serif;}
		.nav-space{padding-left:10px;}
		
	/*home*/
	.home1{float:left; width:960px; padding:15px 0;}
	.home-content{float:left; width:215px; padding-top:15px;}
	.home-space{float:left; width:30px;}	
	.home-text, .home-texte{float:right; width:155px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
		.home-text a{font-size:15px; line-height: 22px; color:#3a3a3a; font-family: "Lato", serif; font-weight: bold; display:block; min-height:50px; }
		.home-text img{padding-top:10px;}
		
	/*products*/
	.iaag{padding:20px 0;}
		.iaag-1{float:left; width:238px;}
		.iaag-2{float:right; width:470px;}
			
	/*news events*/
	.event{padding:15px 0;}
		.event-text{float:left; width:650px; padding:5px 0 0 20px;}
			.event-detail-text{float:left; width:540px; padding:5px 0 0 20px;}	
				.event-detail-text img{padding-top:10px;}
			.event-detail-icon{float:right; width:95px; padding:5px 0 0 10px; text-align:right;}
		.event-img{padding-left:60px;}
			.event-thumb{width:196px; float:left; padding:0 0 20px 0;}
	.new-product{padding:15px 0;}
		.np-text{float:left; padding-left:20px; width:400px;}
		.np-img{float:right;}
	
	/*recipes*/
	.recipes{}
		.ingredients p{font-family: "Lato", serif; font-weight: bold; font-size:12px; line-height: 17px;}
			.ingredients ul li{margin-left:15px; padding-left:0px;}
		.directions p{font-family: "Lato", serif; font-weight: bold; font-size:12px; line-height: 17px;}
			.directions ul li{margin-left:15px; padding-left:0px;}
	
	/*faq*/
	.job{cursor: hand; cursor: pointer; padding-top:10px;}	
		.thejob{padding-top:10px;}
		.openjob{color: #00529b; font-family: "Lato", serif; font-size:20px; background:url(../images/microsite/background/icon-up.jpg) no-repeat bottom right; height:36px;}		
		.closedjob{color: #787878; font-family: "Lato", serif; font-size:20px; background:url(../images/microsite/background/icon-down.jpg) no-repeat bottom right; height:36px;}
		.jv-1{float:left; width:455px;}
			.jv-1 ul{padding-left:15px; list-style-image:url(../images/microsite/background/list-style-min.jpg);}
		.menu-faq{width:100%; margin:0 auto; padding-top:22px; background:url(../images/microsite/background/line-menu.jpg) repeat-x bottom center; height:36px;}
			.submenu-line{width:100%; margin:0 auto; background:url(../images/microsite/background/line-menu.jpg) repeat-x center; height:20px;}
		.faq-link a{font-size:20px; font-family: "Lato", serif; color:#797979; padding:12px 0; cursor:pointer;}
			.faq-link a:hover{font-size:20px; font-family: "Lato", serif; color:#797979; padding:12px 0; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
			.faq-linka a{font-size:20px; font-family: "Lato", serif; color:#797979; padding:12px 0; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
		.faq-space{padding-left:30px;}
	
	/*contact us*/
	.ea-1{float:left; width:180px; height:28px; background:url(../images/microsite/background/titik-dua.jpg) no-repeat right; font-size:13px; line-height: 18px; font-family: "Lato", serif; color:#787878}
	.ea-1n{float:left; width:180px; font-size:13px; line-height: 18px; font-family: "Lato", serif; color:#787878}			
	.ea-2{float:left; width:400px; font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif; }
	.ea-3{float:left; width:195px; font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif; }
	.ea-4{float:left; width:130px; height:28px; background:url(../images/microsite/background/titik-dua.jpg) no-repeat right; font-size:13px; line-height: 18px; font-family: "Lato", serif; color:#787878; padding-left:20px;}
	.ea-5{float:left; width:195px; font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif; }
	.ea-6{float:right; width:195px; font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif; }

    /*sosmed*/
	.sos-fb, .sos-tw, .sos-yt{float:right; width:35px; height:35px; background:url(../images/microsite/background/sosmed.png) no-repeat; margin-left:10px;}
		.sos-fb:hover, .sos-tw:hover, .sos-yt:hover{opacity:0.9;}
		.sos-fb{background-position:0 0;}
		.sos-tw{background-position:-37px 0;}
		.sos-yt{background-position:-74px 0;}


/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.tablet
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 600px) and (max-width: 991px) {
	
	body {
		/*width: 528px;
		padding: 48px 34px 60px;*/		
		width: 768px;
	}
	.space-2{display:none;}
	.space-2m{margin-top:10px;}
	.space-6{display:none;}	
	.space-4m{padding-top:0px;}
	.header-content{width:768px; margin:0 auto; background:none; height:45px;}
		.header-l{float:left; width:117px;}
		.header-r{float:right; width:196px;}
	
	/*menu*/
	.menu{width:768px; margin:0 auto; padding-top:22px;}
		.menu-tablet{display:block;}
		.menu-link a{font-size:24px; padding:0 18px 20px 18px; cursor:pointer;}
			.menu-link a:hover{font-size:24px; padding:0 18px 20px 18px;}
			.menu-linka a{font-size:24px; padding:0 18px 20px 18px;}

/*FOOTER*/
.footer{width:768px; margin:0 auto; padding:10px 0;}

/*MAIN*/
.main{width:748px; margin:0 auto;}
.main-content{width:748px; margin:0 auto; padding-top:0px;}
.main-contentm{padding-top:40px;}
.main-head{width:748px; padding-bottom:10px; padding-top:35px;}
	.main-title{font-size:25px; color:#3a3a3a; font-family: "Inter", serif; font-weight: 300; padding-top:5px; text-align:left;}
		.main-subtitle{font-size:22px; color:#787878; font-family: "Inter", serif; font-weight: 300; width:748px; margin-top:-20px; text-align:left;}		
		.main-subtitle2{font-size:22px; color:#787878; font-family: "Inter", serif; font-weight: 300; width:748px; padding-bottom:20px; margin-top:-20px; text-align:left;}
	.main-text{font-family: "Lato", serif; font-size:13px; line-height: 18px; line-height:20px; color:#787878; text-align:justify;}
		.main-space1{float:left; display:block; width:10px;}
			.main-space1m{float:left; display:block; width:10px;}
		.main-space2{display:none;}
		.main-space3{float:left; display:block; width:10px;}
		.main-text p{padding-bottom:10px;}
		.main-text ul{padding-left:15px;}
		.main-texts{font-family: "Lato", serif; font-size:12px; line-height: 17px; color:#787878; text-align:justify;}
		.main-textm{font-family: "Lato", serif; font-size:15px; line-height: 22px; color:#787878; text-align:justify;}
		.main-textl{font-family: "Lato", serif; font-size:18px; line-height: 23px; color:#787878; text-align:justify;}
	.main-isi{float:left; width:748px;}
	.main-line{background:url(../images/microsite/background/line.jpg) repeat-x center; height:2px;}
	.star{font-size:13px; line-height: 18px; color:#00529b;font-family: "Lato", serif; font-style:italic;}
	
	/*home*/
	.home1{float:left; width:748px; padding:15px 0 15px 30px;}
	.home-content{float:left; width:360px; padding-top:15px;}
	.home-text{float:right; width:300px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
	.home-texte{float:left; width:300px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a; padding-left:20px;}
	.home-space{float:left; width:20px;}
		.home-space:nth-child(2n){float:left; width:0px;}
	
	/*navigation*/
	.navigation{display:none;}
	
	/*product*/
	.iaag{padding:10px 0;}
		.iaag-1{float:left; width:238px;}
		.iaag-2{float:right; width:510px;}	

}


/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout. mobile320
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (min-width: 300px) and (max-width: 595px) {
	
	body {
		/*width: 252px;
		padding: 48px 34px 60px;*/
		width: 320px;
	}
	/*TEXTFIELD*/
	.boxtxts{
		width: 270px;
		height: 20px;
		border: none;
		background:none;
		color: #787878;
		font-size:12px; line-height: 17px;
		padding:6px 0 0 12px;	
		border:none;
		outline:none;
	}
	#fieldtxts{
		width:288px;
		height:28px;
		background:url(../images/microsite/background/txt-k2.jpg) no-repeat top left;
	}
	.boxtxtm1{
		width: 270px;
		height: 20px;
		border: none;
		background:none;
		color: #787878;
		font-size:12px; line-height: 17px;
		padding:6px 0 0 12px;	
		border:none;
		outline:none;
	}
	#fieldtxtm1{
		width:288px;
		height:28px;
		background:url(../images/microsite/background/txt-k.jpg) no-repeat top left;
	}
	.boxtxtm2{
		width: 270px;
		height: 20px;
		border: none;
		background:none;
		color: #787878;
		font-size:12px; line-height: 17px;
		padding:6px 0 0 12px;	
		border:none;
		outline:none;
	}
	#fieldtxtm2{
		width:288px;
		height:28px;
		background:url(../images/microsite/background/txt-k2.jpg) no-repeat top left;
	}
	.icon-space1{display:none;}
	.space-6{display:none;}
	.space-2{display:none;}
	.space-2m{margin-top:20px;}
	.space-3m{margin-top:0;}
	.space-4m{padding-top:0px;}
	.header{height:44px; padding-top:15px; background:url(../images/microsite/19/bg-headerm.jpg) no-repeat top center;}
		.header-l{width:117px; position:absolute;}			
		.header-r{width:196px; position:absolute; margin-right:0px; margin-top:35px; right:0;}
		.header-r2{position:absolute; float:none; right:0; margin-right:6px;}
	
	/*menu*/
	.menu{display:none;}
	.menu-tablet{display:none;}
	.menu-mobile{display:block; width:320px; margin:0 auto;}
		.iphone .dl-menu{top:35px;}
		.mm-l{display:inline-block; margin-left:10px;}
		.mm-r{display:inline-block; margin:5px 0 0 220px;}
		.iphone .mm-l{float:left; margin:0; padding:5px 0 0 0;}
		.iphone .mm-r{float:left; margin:0; padding:3px 0 0 220px;}
	
	/*banner*/
	#main-slider{display:none;}
	#main-sliderm{display:block; padding-top:0px;}

/*FOOTER*/
.footer{width:320px; margin:0 auto; padding:0;}
	.footer-line{background:url(../images/microsite/background/line.jpg) repeat-x center; height:20px; width:100%;}
	.footer-l{float:none;}
		.link-footer{width:320px; text-align:center;}
		.copyright{width:320px; padding-top:0px; text-align:center; position:absolute; padding-top:80px;}
	.footer-r{float:none; padding-left:60px; position:absolute; padding-top:50px;}
		.icon-mail-footer{float:left; width: 27px; height: 27px; background: url(../images/microsite/background/icon-mail.jpg) 0px 0px; text-indent: -99999px; cursor:pointer;}
				.icon-mail-footer:hover {background-position: 0px -27px;}

/*MAIN*/
.main{width:300px; margin:0 auto;}
.main-content{width:300px; margin:0 auto; padding-top:0px;}
.main-contentm{padding-top:10px;}
	
.main-head{width:300px; padding-bottom:10px;}
	.main-title{font-size:25px; color:#3a3a3a; font-family: "Inter", serif; font-weight: 300; padding-top:5px; text-align:left;}
		.main-subtitle{font-size:22px; color:#787878; font-family: "Inter", serif; font-weight: 300; width:320px; padding-bottom:20px; margin-top:-20px; text-align:left;}
		.main-subtitle2{font-size:22px; color:#787878; font-family: "Inter", serif; font-weight: 300; width:320px; padding-bottom:20px; margin-top:-20px; text-align:left;}
	.main-text{font-family: "Lato", serif; font-size:13px; line-height: 18px; line-height:20px; color:#787878; text-align:justify;}
		.main-space1{float:left; display:block; width:30px;}
		.main-space2{float:left; display:block; width:23px;}
		.main-space3{float:left; display:block; width:10px;}
		.main-text p{padding-bottom:10px;}
		.main-text ul{padding-left:15px;}
		.main-texts{font-family: "Lato", serif; font-size:12px; line-height: 17px; color:#787878; text-align:justify;}
		.main-textm{font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#787878; text-align:justify;}
		.main-textl{font-family: "Lato", serif; font-size:16px; color:#787878; text-align:justify;}
	.main-isi{float:left; width:300px; padding-top:15px;}
		.main-isi .element{ padding-left:40px;}
	.main-line{background:url(../images/microsite/background/line.jpg) repeat-x center; height:2px;}
	.star{font-size:13px; line-height: 18px; color:#00529b;font-family: "Lato", serif; font-style:italic;}
	
	/*home*/
	.home1{float:left; width:300px; padding:15px 0;}
	.home2{float:right; width:300px; padding:15px 0;}
	.home-content{float:left; width:300px; padding-top:15px; min-height:90px;}
	.home-text{float:right; width:240px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
	.home-texte{float:left; width:260px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
	.home-linem{background:url(../images/microsite/19/) repeat-x center; height:30px; display:block;}
	#home-carousel{width:320px; margin-left:0px; margin-top:20px;}
		#home-carousel ul{padding-left:24px;}
	.title-img{width:220px;}
		
	/*navigation*/
	.navigation{display:none;}	
	
	/*product*/
	.iaag{padding:10px 0;}
		.iaag-1{float:left; width:300px; text-align:center;}
		.iaag-2{float:left; width:300px;}
	
	/*news & events*/
		/*news*/
		.event{padding:10px 0;}
			.event-text{float:right; width:245px; padding:5px 0 0 0px;}
				.event-detail-text{float:left; width:240px; padding:5px 0 0 15px;}
				.event-detail-icon{float:left; width:95px; padding:5px 0 10px 60px; text-align:right;}
			.event-img{padding-left:60px;}
				.event-thumb{width:196px; float:left; padding:0 0 20px 0;}
					.event-thumb .main-texts{line-height:14px;}
		
		/*new product*/
		.new-product{padding:10px 0;}
			.np-text{float:left; padding-left:15px; width:230px;}
			.np-img{float:left; padding-left:55px; padding-top:5px;}
	
	/*faq*/	
		.jv-1{float:left; width:300px; padding-left:0px;}
			.jv-1 ul{padding-left:15px; list-style-image:url(../images/microsite/background/list-style-min.jpg);}
		.faq-link a{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 6px 0; cursor:pointer;}
			.faq-link a:hover{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 6px 0; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
			.faq-linka a{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 6px 0; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
			
	/*contact us*/
		.ea-1{float:left; width:100px; height:28px; background:url(../images/microsite/background/titik-dua.jpg) no-repeat right; font-size:13px; line-height: 18px; font-family: "Lato", serif; color:#787878}
		.ea-1n{float:left; width:100px; font-size:13px; line-height: 18px; font-family: "Lato", serif; color:#787878}		
		.ea-1m{display:none;}
		.ea-2{float:left; width:320px; font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif; }
		.ea-3{float:left; width:195px; font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif; padding-bottom:5px;}
		.ea-4{float:left; width:100px; height:28px; background:url(../images/microsite/background/titik-dua.jpg) no-repeat right; font-size:13px; line-height: 18px; font-family: "Lato", serif; color:#787878; padding-left:0px;}
		.ea-5{float:left; width:195px; font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif; }
		.ea-6{float:left; width:195px; font-size:13px; line-height: 18px; color:#787878; font-family: "Lato", serif; margin-top:5px;}
}

/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout. mobile380
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (min-width: 360px) and (max-width: 390px) {
	
	body {
		/*width: 252px;
		padding: 48px 34px 60px;*/
		width: 380px;
	}
	
		.header-l{width:117px; position:absolute;}			
		.header-r{width:196px; margin:0 0 0 170px; position:absolute;}
	
	/*menu*/
	.menu-mobile{display:block; width:380px; margin:0 auto;}
		.mm-l{display:inline-block; margin-left:10px;}
		.mm-r{display:inline-block; margin:5px 0 0 270px;}

/*FOOTER*/
.footer{width:380px; margin:0 auto; padding:0;}
		.link-footer{width:380px; text-align:center;}
		.copyright{width:380px; padding-top:0px; text-align:center; position:absolute; padding-top:80px;}
	.footer-r{float:none; padding-left:80px; position:absolute; padding-top:50px;}
		.icon-mail-footer{float:left; width: 27px; height: 27px; background: url(../images/microsite/background/icon-mail.jpg) 0px 0px; text-indent: -99999px; cursor:pointer;}
				.icon-mail-footer:hover {background-position: 0px -27px;}

/*MAIN*/
.main{width:360px; margin:0 auto;}
.main-content{width:360px; margin:0 auto; padding-top:0px;}
.main-head{width:360px; padding-bottom:10px;}
	.main-isi{float:left; width:360px; padding-top:15px;}
		.main-isi .element{ padding-left:70px;}
	
	/*home*/
	.home1{float:left; width:360px; padding:15px 0 15px 30px;}
	.home2{float:right; width:360px; padding:15px 0 15px 30px;}
	.home-content{float:left; width:360px; padding-top:15px; min-height:90px;}
	.home-text{float:right; width:300px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
	.home-texte{float:left; width:300px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
	
	/*product*/
		.iaag-1{float:left; width:360px; text-align:center;}
		.iaag-2{float:left; width:360px;}
	
	/*news & events*/
		/*news*/
			.event-detail-text{float:left; width:240px; padding:5px 0 0 15px;}
				.event-detail-icon{float:left; width:40px; padding:5px 0 10px 15px; text-align:right;}
			.event-img{padding-left:60px;}
				.event-thumb{width:196px; float:left; padding:0 0 20px 0;}
					.event-thumb .main-texts{line-height:14px;}
		
		/*new product*/
		.new-product{padding:10px 0;}
			.np-text{float:left; padding-left:15px; width:300px;}
			.np-img{float:left; padding-left:80px; padding-top:5px;}
	
	/*faq*/	
		.jv-1{float:left; width:360px; padding-left:0px;}
}

/*		Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout. mobile480
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 420px) and (max-width: 490px) {
	
	body {
		/*width: 252px;
		padding: 48px 34px 60px;*/
		width: 480px;
	}	
	.header-r{width:196px; margin:0 0 0 280px; position:absolute;}
	
	/*menu*/
	.menu-mobile{display:block; width:480px; margin:0 auto;}
		.mm-r{display:inline-block; margin:5px 0 0 370px;}

/*FOOTER*/
.footer{width:480px; margin:0 auto; padding:0;}
		.link-footer{width:480px; text-align:center;}
		.copyright{width:480px; padding-top:0px; text-align:center; position:absolute; padding-top:80px;}
	.footer-r{float:none; padding-left:130px; position:absolute; padding-top:50px;}

/*MAIN*/
.main{width:460px; margin:0 auto;}
.main-content{width:460px; margin:0 auto; padding-top:0px;}
.main-head{width:460px; padding-bottom:10px;}
	.main-isi{float:left; width:460px; padding-top:15px;}
		.main-isi .element{ padding-left:0px;}
	
	/*home*/
	.home1{float:left; width:460px; padding:15px 0;}
	.home2{float:right; width:460px; padding:15px 0;}
	.home-content{float:left; width:215px; padding-top:15px;}
	.home-text, .home-texte{float:right; width:155px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
		.home-text a{font-size:15px; line-height: 22px; color:#3a3a3a; font-family: "Lato", serif; font-weight: bold; display:block; min-height:50px;}
		.home-text img{padding-top:10px;}
	.home-space{float:left; width:20px;}
		.home-space:nth-child(4n){float:left; width:0px; padding-left:0;}
		
	/*product*/
		.iaag-1{float:left; width:460px; text-align:center;}
		.iaag-2{float:left; width:460px;}
	
	/*news & events*/
		/*news*/
			.event-text{float:right; width:400px; padding:5px 0 0 0px;}
				.event-detail-text{float:left; width:340px; padding:5px 0 0 15px;}
				.event-detail-icon{float:left; width:40px; padding:5px 0 10px 15px; text-align:right;}
			.event-img{padding-left:60px;}
				.event-thumb{width:196px; float:left; padding:0 0 20px 0;}
					.event-thumb .main-texts{line-height:14px;}
		
		/*new product*/
		.new-product{padding:10px 0;}
			.np-text{float:left; padding-left:15px; width:400px;}
			.np-img{float:left; padding-left:130px; padding-top:5px;}
	
	/*faq*/	
		.jv-1{float:left; width:460px; padding-left:0px;}
		.faq-link a{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 6px 0; cursor:pointer;}
			.faq-link a:hover{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 6px 0; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
			.faq-linka a{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 6px 0; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
}

/*		Mobile Layout: 568px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout. mobile568
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 500px) and (max-width: 580px) {
	
	body {
		/*width: 252px;
		padding: 48px 34px 60px;*/
		width: 568px;
	}	
	.header{position:relative; width:568px; height:50px; padding-top:8px;}
	.header-r, .header-r2{position:absolute; float:right; margin:0;}
	.header-r{margin-right:5px;}
	.header-r2{margin-right:220px;}
	
	/*menu*/
	.menu-mobile{display:block; width:568px; margin:0 auto;}
		.iphone .dl-menu{top:35px;}
		.mm-r{display:inline-block; margin:5px 0 0 460px;}
		.iphone .mm-l{float:left; margin:0; padding:5px 0 0 0;}
		.iphone .mm-r{float:left; margin:0; padding:3px 0 0 460px;}

/*FOOTER*/
.footer{width:568px; margin:0 auto; padding:0;}
		.link-footer{width:568px; text-align:center;}
		.copyright{width:568px; padding-top:0px; text-align:center; position:absolute; padding-top:80px;}
	.footer-r{float:none; padding-left:180px; position:absolute; padding-top:50px;}

/*MAIN*/
.main{width:548px; margin:0 auto;}
.main-content{width:548px; margin:0 auto; padding-top:0px;}
.main-head{width:548px; padding-bottom:10px;}
	.main-isi{float:left; width:548px; padding-top:15px;}
	
	/*home*/
	.home1{float:left; width:548px; padding:15px 0;}
	.home2{float:right; width:548px; padding:15px 0;}
	.home-content{float:left; width:215px; padding-top:15px;}
	.home-text, .home-texte{float:right; width:155px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
		.home-text a{font-size:15px; line-height: 22px; color:#3a3a3a; font-family: "Lato", serif; font-weight: bold; display:block; min-height:50px;}
		.home-text img{padding-top:10px;}
	.home-space{float:left; width:60px;}
		.home-space:nth-child(4n){float:left; width:0px; padding-left:0;}
		
	/*product*/
		.iaag-1{float:left; width:548px; text-align:center;}
		.iaag-2{float:left; width:548px;}
	
	/*news & events*/
		/*news*/
				.event-detail-text{float:left; width:430px; padding:5px 0 0 15px;}
				.event-detail-icon{float:left; width:40px; padding:5px 0 10px 15px; text-align:right;}
			.event-img{padding-left:60px;}
				.event-thumb{width:196px; float:left; padding:0 0 20px 0;}
					.event-thumb .main-texts{line-height:14px;}
		
		/*new product*/
		.new-product{padding:10px 0;}
			.np-text{float:left; padding-left:15px; width:275px;}
			.np-img{float:right; padding:0;}
	
	/*faq*/	
		.jv-1{float:left; width:548px; padding-left:0px;}
		.faq-link a{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 13px 0; cursor:pointer;}
			.faq-link a:hover{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 13px 0; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
			.faq-linka a{font-size:16px; font-family: "Lato", serif; color:#797979; padding:8px 0 13px 0; cursor:pointer; background:url(../images/microsite/background/line-hover.jpg) repeat-x bottom center;}
}

/*		Tablet Layout: 600px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.mobile600
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 595px) and (max-width: 620px) {
	
	body {
		/*width: 528px;
		padding: 48px 34px 60px;*/		
		width: 600px;
	}
	.header-content{width:600px; margin:0 auto; background:none; height:45px;}
	
	/*menu*/
	.menu{width:600px; margin:0 auto; padding-top:20px;}
		.menu-link a{font-size:20px; padding:0 12px 20px 12px; cursor:pointer;}
			.menu-link a:hover{font-size:20px; padding:0 12px 20px 12px;}
			.menu-linka a{font-size:20px; padding:0 12px 20px 12px;}

/*FOOTER*/
.footer{width:600px; margin:0 auto; padding:0;}
	.footer-l{padding-left:80px; width:600px; }
		.copyright{position:absolute; padding:50px 0 0 80px;}
	.footer-r{float:none; width:600px; padding:10px 0 0 290px; position:absolute;}

/*MAIN*/
.main{width:580px; margin:0 auto;}
.main-content{width:580px; margin:0 auto; padding-top:0px;}
.main-contentm{padding-top:10px;}
.main-head{width:580px; padding-bottom:10px; padding-top:35px;}	
	.main-isi{float:left; width:600px;}
	
	/*home*/
	.home1{float:left; width:580px; padding:15px 0 15px 30px;}
	.home-content{float:left; width:280px; padding-top:15px;}
	.home-text, .home-texte{float:left; width:200px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a; padding-left:15px;}
	.home-space{float:left; width:10px;}
		.home-space:nth-child(2n){float:left; width:0px;}
	
	/*new product*/
		.event-detail-text{float:left; width:470px; padding:5px 0 0 15px;}
			.event-detail-icon{float:left; width:40px; padding:5px 0 10px 15px; text-align:right;}
		.new-product{padding:10px 0;}
			.np-text{float:left; padding-left:15px; width:320px;}
			.np-img{float:right; padding:0;}
	
	/*product*/
	.iaag{padding:10px 0;}
		.iaag-1{float:left; width:238px;}
		.iaag-2{float:right; width:350px;}	
	
	/*faq*/
	.jv-1{float:left; width:580px; padding-left:0px;}

}


/*		Tablet Layout: 685px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.mobile685
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 645px) and (max-width: 690px) {
	
	body {
		/*width: 528px;
		padding: 48px 34px 60px;*/		
		width: 685px;
	}
	.header-content{width:685px; margin:0 auto; background:none; height:45px;}
	
	/*menu*/
	.menu{width:685px; margin:0 auto; padding-top:22px;}
		.menu-link a{font-size:22px; padding:0 16px 20px 16px; cursor:pointer;}
			.menu-link a:hover{font-size:22px; padding:0 16px 20px 16px;}
			.menu-linka a{font-size:22px; padding:0 16px 20px 16px;}

/*FOOTER*/
.footer{width:685px; margin:0 auto; padding:10px 0;}

/*MAIN*/
.main{width:665px; margin:0 auto;}
.main-content{width:665px; margin:0 auto; padding-top:0px;}
.main-contentm{padding-top:10px;}
.main-head{width:665px; padding-bottom:10px; padding-top:35px;}	
	.main-isi{float:left; width:665px;}
	
	/*home*/
	.home1{float:left; width:665px; padding:15px 0 15px 30px;}
	.home-content{float:left; width:320px; padding-top:15px;}
	.home-text{float:right; width:270px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a;}
	.home-texte{float:left; width:270px; font-family: "Lato", serif; font-size:13px; line-height: 18px; color:#3a3a3a; padding-left:20px;}
	.home-space{float:left; width:20px;}
		.home-space:nth-child(2n){float:left; width:0px;}
	
	/*new product*/
		.event-detail-text{float:left; width:550px; padding:5px 0 0 15px;}
			.event-detail-icon{float:left; width:40px; padding:5px 0 10px 15px; text-align:right;}
		.new-product{padding:10px 0;}
			.np-text{float:left; padding-left:15px; width:390px;}
			.np-img{float:right; padding:0;}
	
	/*product*/
	.iaag{padding:10px 0;}
		.iaag-1{float:left; width:238px;}
		.iaag-2{float:right; width:420px;}	
	
	/*faq*/
	.jv-1{float:left; width:668px; padding-left:0px;}

}

/*revisi 09Dec2016*/
.owl-title{position:relative; text-align:center; min-height:50px; padding-bottom:5px;}
a .owl-title{font-size:15px; line-height: 22px; color:#3a3a3a; font-family: "Lato", serif; font-weight: bold;}
.owl-carousel img{max-width:180px; margin:0 auto;}

@media only screen and (min-width: 10px) and (max-width: 350px) {
	.header{width:100%; height:40px;}
		.header-l{width:117px;}			
		.header-r{width:196px; margin-top:0px; padding-top:2px;}
	.hl-1 {float:left; width: 34px; height: 30px; background: url(../images/microsite/background/icon.png) 0px 0px; background-size:99px 60px; text-indent: -99999px; cursor:pointer;}
		.hl-1:hover {background-position: 0px -30px;}
	.hl-2 {float:left; width: 34px; height: 30px; background: url(../images/microsite/background/icon.png) -34px 0px; background-size:99px 60px; text-indent: -99999px; cursor:pointer;}
		.hl-2:hover {background-position: -34px -30px;}
		.hl-2a {float:left; width: 34px; height: 30px; background: url(../images/microsite/background/icon.png) -34px -30px; background-size:99px 60px; text-indent: -99999px; cursor:pointer;}
	.hl-3 {float:left; width: 30px; height: 30px; background: url(../images/microsite/background/icon.png) -69px 0px; background-size:99px 60px; text-indent: -99999px; cursor:pointer;}
		.hl-3:hover {background-position: -69px -30px;}
		.hl-3a {float:left; width: 30px; height: 30px; background: url(../images/microsite/background/icon.png) -69px -30px; background-size:99px 60px; text-indent: -99999px; cursor:pointer;}
	
	.menu-mobile{z-index:99; position:absolute;}
	.owl-carousel{padding-top:25px;}
	.footer-r{text-align:center; float:none; width:100%; margin:0 auto; padding-left:0; padding-right:0; position:relative;}
		
}

@media only screen and (min-width: 351px) and (max-width: 900px) {
	body, .main, .home1{width:100%;}
	.header{width:100%; display:block; position:relative;}
	.header-content{width:95%; margin:0 auto; position:relative;}
	.header-l{margin-left:0; left:0; padding-left:0;}
	.header-r{margin-right:0; right:0;}
	.menu-mobile{z-index:99; position:absolute;}
	.owl-carousel{padding-top:25px;}
	.footer-r{text-align:center; float:none; width:100%; margin:0 auto; padding-left:0; padding-right:0; position:relative;}
}

/* paging */
.numb {
	float: left;
}
.numb a{
	font: bold 10pt;
	color: #fff;
	background-color: #a0cf67;
	padding: 6px 10px;
	text-decoration: none;
}
.numb a.on,
.numb a:hover{
	background-color: #6ab70e;
}

/*paging*/
	.paging{}
		.link-paging{font-size:20px; color:#787878; font-family: "Lato", serif; padding:3px 3px;}
		.link-paging a{font-size:20px; color:#787878; font-family: "Lato", serif; padding:3px 3px;}
			.link-paging a:hover, .link-paging a.on {font-size:20px; color:#FFF; font-family: "Lato", serif; padding:3px 3px; background:#00529b;}

/*revisi 07Feb2025*/
body{font-family: "Lato", serif; line-height: normal;}
a{color: inherit;}
.nav-link a{letter-spacing: -.5px;}