/* CSS Document */

* {
	margin:0; padding:0;
	font-size:100%;
}

body{
	background:#f4f3ef;
}

img {vertical-align:top;}
a img { border:0;}

ul { list-style-type:disc; padding: 0 0 0 20px; margin: 0 0 0 -5px; }
ol { padding: 0 0 0 15px;}

.left { float:left;}
.right {float:right;}
.clear  { clear:both;}


html, input, textarea
	{
		font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size:0.75em;
		line-height:1.2em;
		color:#525252;
	}
	
input, select { vertical-align:middle; font-weight:normal;}

a {color:#37b7dd;}
a:hover{text-decoration:none;}
p {padding-top:15px;}

/* ============================= main layout ====================== */

.top-tail {background:url(images/header-tail.gif) top repeat-x #fff;}
.bottom-tail {background:url(images/footer-tail.gif) top repeat-x;}

/*ul li { background:url(images/marker1.gif) no-repeat 0 10px; padding-left:15px; line-height:2em;}
ul li a {color:#9e71b1;}
.boxes ul li { background:url(images/marker2.gif) no-repeat 0 10px;}
.price li {background:url(images/price-bg.gif) bottom left repeat-x; line-height:1.333em; padding:0;}
.price li a {background:#fff; color:#656565; text-decoration:none;}
.price li a:hover {font-weight:bold; color:#9e71b1;}
.price li span {background:#fff; float:right;}

ol { line-height:1.167em; margin-bottom:-10px;}
ol li {list-style-position:inside; font-weight:bold; margin-bottom:17px;}
ol li span {font-weight:normal;}*/

.imgindent {margin:0 5px 0 0; float:left;}
.imgindent2 {margin:0 30px 0 0; float:left;}

/* ============================= header ====================== */

object {vertical-align:top;}
.menu {margin:0 0 0 -10px;}
.logo {padding:12px 0 0 0;}
.boxes-flash {margin:10px -20px 0 -20px;}
.boxes-flash object { position:relative;}

.boxes {padding:10px 0 0 0;}


/* ============================= content box ====================== */

#content-box {padding:70px 15px 0 150px; text-align:left; color:#FFFFFF;}
.box-font {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:12px;}
#more a {color:#FFFFFF;text-decoration: underline;}
#more a:hover {color:#FFFFFF; font-weight:bold; text-decoration: underline; }

/* ============================= content box2 ====================== */

#content-box2 {padding:55px 15px 0 140px; text-align:left; color:#FFFFFF; vertical-align:top}


/* ============================= content box2 ====================== */

#content-box3 {padding:15px 20px 0 20px; text-align:left;}
.title-content-box3 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#f26522; font-size:18px; font-weight:bold;}


/* ============================= content text1 ====================== */

#content-text1 {text-align:left;font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF;}
.title-content-text1 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:20px;line-height:0.8em;}
.title-content-text2 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:30px;line-height:1em;}


/* ============================= top bar ====================== */

#topbar {text-align:right; color:#FFFFFF; font-size:12px; line-height:1.6em;}
.homebtn a {color:#FFFFFF; text-decoration: none; padding:0 6px 0 6px;}
.homebtn a:hover{color:#37b7dd; text-decoration: underline;}

/* ============================= home promosi ====================== */

#promosi-box {text-align:left; color:#FFFFFF; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:12px; line-height:1.1em;}
#promosi-box a {color:#FFFFFF;text-decoration: underline;}
#promosi-box a:hover {color:#FFFFFF; font-weight:bold; text-decoration: underline; }

/* ============================= activiti ====================== */

#activiti {text-align:left; color:#000000; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:12px; line-height:1.1em; table-layout:auto;}
#activiti .activiti-padding {padding:5px 5px;}


/* ============================= content ====================== */

#content {padding:15px 0 15px 0;}
.product-list-titlebar {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#333333; font-size:27px;line-height:1em; 
                        text-align:left; background-image:url(images/product_listtitlebar.gif); background-repeat:no-repeat; 
						background-position:top; background-position:left; padding: 10px 0 10px 50px; display:inline-block;}
.backtomain { margin: -30px 20px 0 0; text-align:right;}
.backtomain a {color:#adadad; text-decoration: none; font-size:13px;}
.backtomain a:hover {color:#37b7dd; text-decoration: underline;}
.col-pad1 {padding-right:12px;}
.col-pad2 {padding-right:11px;}
.col-pad3 {padding-right:6px;}
.col-pad4 {padding-right:50px;}
.col-pad5 {padding-right:30px;}
.col-pad6 {padding-right:37px;}
.col-pad7 {padding-right:43px;}
.link {display:inline-block; margin-top:14px; font-weight:bold;}
.title {margin-bottom:14px;}
.boxes .link {color:#fff; margin-top:4px;}
.boxes .title2 {margin-bottom:2px;}
.boxes a {color:#fff;}
.boxes strong a {text-decoration:none;}
.boxes strong a:hover {text-decoration:underline;}
.phone {width:90px; display:inline-block;}

.extra1 {margin:0 5px 0 -39px; float:left; position:relative;}
.extra2 {margin:0 5px 0 -31px; float:left; position:relative;}

.text2 {color:#9e71b1;}

.margin1 {margin-left:19px;}
.margin2 {margin-top:19px;}
.margin3 {margin-top:25px;}
.padding1 {padding-top:10px;}
.padding2 {padding-bottom:10px;}

/*==purple box==*/
.box1 {background:#FFFFFF; color:#fff;}
.box1 .corner-right-bottom {background:url(images/product_listlbox04.gif) right bottom no-repeat;}
.box1 .corner-left-bottom {background:url(images/product_listlbox03.gif) left bottom no-repeat;}
.box1 .corner-right-top {background:url(images/product_listlbox02.gif) right top no-repeat;}
.box1 .corner-left-top {background:url(images/product_listlbox01.gif) left top no-repeat; width:100%;}
.box1 .indent {padding:15px 15px 10px 24px;}
.box1 .indent2 {padding:24px 24px 18px 24px;}
.box1 ul {color:#FFFFFF; list-style-type: none; list-style-image:url(images/arrow03.gif);}
.box1 li a {color:#000000; font-size:13px; line-height: 16px; text-decoration: none;}
.box1 li a:hover {color:#37b7dd; font-weight:bold; text-decoration: underline;}

.box1-1 {background:#875f9e; color:#fff;}
.box1-1 .corner-right-bottom {background:url(images/box1-corner-right-bottom.gif) right bottom no-repeat;}
.box1-1 .corner-left-bottom {background:url(images/box1-corner-left-bottom.gif) left bottom no-repeat;}
.box1-1 .corner-right-top {background:url(images/box1-corner-right-top.gif) right top no-repeat;}
.box1-1 .corner-left-top {background:url(images/box1-corner-left-top.gif) left top no-repeat; width:100%;}
.box1-1 .indent {padding:15px 15px 10px 24px;}
.box1-1 .indent2 {padding:20px 15px 27px 29px;}
.box1-1 .title {font-size:25px;}

/*==orange box==*/
.box2 {background:#39b9de; color:#fff;}
.box2 .corner-right-bottom {background:url(images/box2-corner-right-bottom.gif) right bottom no-repeat;}
.box2 .corner-left-bottom {background:url(images/box2-corner-left-bottom.gif) left bottom no-repeat;}
.box2 .corner-right-top {background:url(images/box2-corner-right-top.gif) right top no-repeat;}
.box2 .corner-left-top {background:url(images/box2-corner-left-top.gif) left top no-repeat; width:100%;}
.box2 .indent {padding:15px 15px 10px 24px;}
.box2 .indent2 {padding:20px 15px 27px 29px; }
.box2 .title {
	font-size: 25px;
}
.box2 ul {color:#FFFFFF; list-style-type: none; list-style-image:url(images/marker2.gif);}
.box2 li a {color:#FFFFFFF; font-size:13px; line-height: 17px; text-decoration: none;}
.box2 li a:hover {color:#FFFFFF; font-weight:bold; text-decoration: underline;}

.box2-1 {background:#f59e2a; color:#fff;}
.box2-1 .corner-right-bottom {background:url(images/box2_orange-corner-right-bottom.gif) right bottom no-repeat;}
.box2-1 .corner-left-bottom {background:url(images/box2_orange-corner-left-bottom.gif) left bottom no-repeat;}
.box2-1 .corner-right-top {background:url(images/box2_orange-corner-right-top.gif) right top no-repeat;}
.box2-1 .corner-left-top {background:url(images/box2_orange-corner-left-top.gif) left top no-repeat; width:100%;}
.box2-1 .indent {padding:15px 15px 10px 24px;}
.box2-1 .indent2 {padding:20px 15px 27px 29px;}
.box2-1 .title {font-size:25px;}

/*==green box==*/
.box3 {background:#39b9de; color:#fff;}
.box3 .corner-right-bottom {background:url(images/box3_green-corner-right-bottom.gif) right bottom no-repeat;}
.box3 .corner-left-bottom {background:url(images/box3_green-corner-left-bottom.gif) left bottom no-repeat;}
.box3 .corner-right-top {background:url(images/box3_green-corner-right-top.gif) right top no-repeat;}
.box3 .corner-left-top {background:url(images/box3_green-corner-left-top.gif) left top no-repeat; width:100%;}
.box3 .indent {padding:15px 15px 10px 24px;}
.box3 .indent2 {padding:20px 15px 27px 29px; }
.box3 .title {font-size:25px;}
.box3 ul {color:#FFFFFF; list-style-type: none; list-style-image:url(images/marker2.gif);}
.box3 li a {color:#FFFFFFF; font-size:13px; line-height: 17px; text-decoration: none;}
.box3 li a:hover {color:#FFFFFF; font-weight:bold; text-decoration: underline;}

.box3-1 {background:#8ab915; color:#fff;}
.box3-1 .corner-right-bottom {background:url(images/box3_green-corner-right-bottom.gif) right bottom no-repeat;}
.box3-1 .corner-left-bottom {background:url(images/box3_green-corner-left-bottom.gif) left bottom no-repeat;}
.box3-1 .corner-right-top {background:url(images/box3_green-corner-right-top.gif) right top no-repeat;}
.box3-1 .corner-left-top {background:url(images/box3_green-corner-left-top.gif) left top no-repeat; width:100%;}
.box3-1 .indent {padding:15px 15px 10px 24px;}
.box3-1 .indent2 {padding:20px 15px 27px 29px;}
.box3-1 .title {font-size:25px;}


/* ============================= Product page ====================== */

#product-list {padding:0 0 5px 5px; text-align:left; vertical-align:top; color:#CCCCCC;}
.product-menu {color:#adadad; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:11px;}
#product-menub a {color:#adadad; text-decoration: none;}
#product-menub a:hover {color:#37b7dd; text-decoration: underline;}
.product-title-content-text1 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#333333; font-size:30px;line-height:1.5em; text-align:left; background-image:url(images/icon_title_grey.gif); background-repeat:no-repeat; background-position:top; background-position:left; padding: 0 0 0 30px; }
.product-title-content-text2 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#426877; font-size:20px;line-height:1.2em; text-align:left; }
.product-title-content-text3{font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#426877; font-size:15px;line-height:1.4em; text-align:left; }
.product-title-content-price1 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#2e3192; font-size:20px;line-height:1em; text-align:left; }
#productmain-box1 {padding:45px 15px 23px 23px; text-align:left; vertical-align:top}
#productmain-box1 .box-font {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:13px; line-height:1.4em;}

/*===========================Jadual Jelajah======================*/
.tarikh {
	font-family: Arial;
	font-size: 14px;
	color: #FFFFFF;
	font-weight: bold; }

.alamat {
	color: #FFFFFF;
	font-family: Arial;
	line-height: 20px;
	font-size: 13px;
}
/* ============================= Add Cart ====================== */

#addcart {text-align:left; padding: 6px 10px;  margin: 0 0 0 580px; background:url(images/btn_addtocart.gif) top left no-repeat;}
#addcart a {color:#66797c; text-decoration: none;}
#addcart a:hover{color:#000000; text-decoration: underline;}

#risalah {text-align:left; padding:6px 0 6px 13px; margin: -26px 0 0 710px; background:url(images/btn_risalahproduk.gif) top left no-repeat;}
#risalah  a {color:#66797c; text-decoration: none;}
#risalah  a:hover{color:#000000; text-decoration: underline;}

/* ============================= edagang ====================== */

#edagang { background:url(images/edagang_box1.gif) top left no-repeat; color:#585858; font-size:16px; padding:20px 20px; height:44px;}
#edagang1 { background:url(images/edagang_box2.gif) top left no-repeat; color:#000000; font-size:14px; padding:25px 25px; height:74px;}
#edagang a {font-weight:none; font-size:11px; color:#585858; text-decoration: none; line-height:1.6em;}
#edagang a:hover {font-weight:none; color:#37b7dd; text-decoration: underline;}
.title-content-text3 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#426877; font-size:17px;line-height:1.6em;}
.address-title {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:15px;line-height:1.3em; font-weight:bold;}
.address-title2 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#000000; font-size:13px;line-height:1.3em; font-weight:bold;}


/* ============================= footer ====================== */

#footer {color:#585858; padding:5px 0 0 0;}
#footer a {font-weight:none; color:#585858; text-decoration: none; line-height:2.1em;}
#footer a:hover {font-weight:none; color:#37b7dd; text-decoration: underline;}

/* ============================= forms ============================= */

#OrderForm {padding:13px 0 0 0;}
#OrderForm .rowi {height:30px;}
#OrderForm .col-1 {width:297px !important;}
#OrderForm .col-2 {width:279px !important;}	
#OrderForm .definition {display:inline-block; width:112px; vertical-align:top;}
#OrderForm .input {width:159px; height:16px; border:1px solid #FFFFFF; background:#fff; padding:0 0 0 5px; font-size:1em;}
#OrderForm .radio {margin:0 10px 0 0; padding:0;}
#OrderForm .buttons {text-align:right; padding:0 10px 0 0;}
#OrderForm .buttons a {margin-left:30px; font-weight:bold;}

#OrderForm2 .rowi {height:32px;}
#OrderForm2 .input {width:31px; height:18px; border:1px solid #848278; background:#fff; padding:0 0 0 5px; font-size:1em;}
#OrderForm2 textarea {width:274px; height:156px; border:1px solid #848278; background:#fff; padding:0 0 0 5px; overflow:auto; font-size:1em;}

#ContactForm {padding:20px 0 0 0;}
#ContactForm .rowi {height:41px;}
#ContactForm .col-1 {width:294px !important;}
#ContactForm .col-2 {width:288px !important;}
#ContactForm .buttons {text-align:right; padding:20px 0 0 0;}
#ContactForm .buttons a {margin-left:23px; font-weight:bold;}

.input {width:277px; height:18px; border:1px solid #848278; background:#fff; padding:0 0 0 5px; font-size:1em;}
textarea {width:281px; height:101px; border:1px solid #848278; background:#fff; padding:0 0 0 5px; overflow:auto; font-size:1em;}


