<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<html lang="en">
<Head>
<meta name="Description" content="S&P Santan Coconut Products.">
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta, title, CSS, favicons, etc. -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>
S&P International Holding Limited
</title>
<!-- Bootstrap core CSS -->
<!-- <link href="env/css/bootstrap.min.css?v=1.0" rel="stylesheet"> -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Fonts -->
<link href='http://fonts.googleapis.com/css?family=Roboto:400,100,300,700,400italic,700italic' rel='stylesheet' type='text/css'>
<!-- <script type="text/javascript">
if (screen.width <= 699) {
document.location = "landing-m.asp";
}
</script> -->
<!-- Pixel's CSS -->
<link href="assets/css/logos.css?v=1.0" rel="stylesheet">
<link href="assets/css/class-banners.css?v=1.0" rel="stylesheet">
<link href="assets/css/product-banners.css?v=2.3" rel="stylesheet">
<link href="assets/css/product.css?v=3.1" rel="stylesheet">
<link href="env/css/earlybreak.css?v=1.0" rel="stylesheet">
<link href="assets/css/schedule.css?v=1.8" rel="stylesheet">
<link href="assets/css/course_types.css?v=1.1" rel="stylesheet">
<link href="assets/css/recommended_product.css?v=1.0" rel="stylesheet">
<!-- <link href="assets/css/member.css?v=1.2" rel="stylesheet"> -->
<link href="assets/css/login.css?v=1.0" rel="stylesheet">
<!-- Pixel's CSS -->
<!-- Rocket extras -->
<link href="env/css/animate.css?v=1.0" rel="stylesheet">
<link href="env/css/prettyPhoto.css?v=1.0" rel="stylesheet">
<link href="env/css/style.css?v=1.11" rel="stylesheet">
<!--[if lt IE 9]><script src="assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
<!-- Favicons -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="../docs-assets/ico/apple-touch-icon-144-precomposed.png">
<link rel="shortcut icon" href="../docs-assets/ico/favicon.png">
<Style>
/* FindCond Navbar */
nav.navbar-findcond { background: #000000; border-color: #000000; box-shadow: 0 0 0 0 #ccc; }
nav.navbar-findcond a { color: #5fadef; }
nav.navbar-findcond ul.navbar-nav a { color: #5fadef; border-style: solid; border-width: 0 0 0 0; border-color: #fff; padding-left: 5px; padding-right: 5px;}
nav.navbar-findcond ul.navbar-nav a:hover,
nav.navbar-findcond ul.navbar-nav a:visited,
nav.navbar-findcond ul.navbar-nav a:focus,
nav.navbar-findcond ul.navbar-nav a:active { background: orange; }
nav.navbar-findcond ul.navbar-nav a:hover { border-color: orange; color: #FFFFFF; padding-left: 5px; padding-right: 5px;}
nav.navbar-findcond li.divider { background: #ccc; }
nav.navbar-findcond button.navbar-toggle { background: orange; border-radius: 10px;}
nav.navbar-findcond button.navbar-toggle:hover { background: red; }
nav.navbar-findcond button.navbar-toggle > span.icon-bar { background: #fff; }
nav.navbar-findcond ul.dropdown-menu { border: 0; background: #fff; border-radius: 4px; margin: 4px 0; box-shadow: 0 0 4px 0 #ccc; }
nav.navbar-findcond ul.dropdown-menu > li > a { color: #888;}
nav.navbar-findcond ul.dropdown-menu > li > a:hover { background: orange; color: #fff; padding-left: 30px;}
nav.navbar-findcond span.badge { background: #f14444; font-weight: normal; font-size: 10px; margin: 0 4px; }
nav.navbar-findcond span.badge.new { background: rgba(255, 0, 0, 0.8); color: #fff; }
/* FindCond Navbar */
/* Footer */
* {
margin: 0;
}
html, body {
height: 100%;
}
/* Footer */
</Style>
</head>
<!-- Start Rocket -->
<!-- ********************* -->
<!-- Start Header
================================================== -->
<nav class="navbar navbar-findcond navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="sp_landing_main.asp">
<img src="http://via.placeholder.com/150x50" class="img-responsive visible-lg visible-md">
<img src="http://via.placeholder.com/150x50" class="img-responsive visible-sm visible-xs" width=50% style="padding-left: 20px; padding-top: 20px">
</a>
</div>
<div class="collapse navbar-collapse" id="navbar">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="company.asp">Our Company <span class="sr-only">(current)</span></a></li>
<li class="active"><a href="products.asp">Our Products <span class="sr-only">(current)</span></a></li>
<li class="active"><a href="technology.asp">Our Technology <span class="sr-only">(current)</span></a></li>
<li class="dropdown">
<a href="investors.asp" class="active dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="true">Investor Relations <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<!-- <li><a href="corporate_governance.asp">Announcements & Circulars</a></li> -->
<!-- <li class="divider"></li> -->
<li><a href="ir_formal_notice_en.asp">Announcements & Circulars</a></li>
<!-- <li><a href="financial_information.asp">Announcement of Offer Price & Allotment Results</a></li> -->
<!-- <li><a href="financial_information.asp">List Of Directors & Roles & Functions</a></li> -->
<li class="divider"></li>
<li><a href="ir_corp_governance_en.asp">Corporate Governance</a></li>
<li class="divider"></li>
<!-- <li style="background-color: powderblue;"><strong>Listing Documents</strong></li> -->
<li><a href="ir_prospectus_en.asp">Prospectus</a></li>
<li><a href="ir_green_form_en.asp">Green Application Form</a></li>
<li><a href="ir_white_form_en.asp">White Application Form</a></li>
<li><a href="ir_yellow_form_en.asp">Yellow Application Form</a></li>
<!-- <li><a href="#" OnClick="login()";>Login</a></li> -->
<!-- <li class="divider"></li>
<li><a href="financial_information.asp">Corporate Governance</a></li>
<li><a href="financial_information.asp">Procedures for Shareholders to Nominate a Director</a></li>
<li><a href="financial_information.asp">Terms of Reference of Audit Committee</a></li>
<li><a href="financial_information.asp">Terms of Reference of Nomination Committee</a></li>
<li><a href="financial_information.asp">Amended & restated memorandum of association</a></li>
<li><a href="financial_information.asp">Amended & restated articles of association</a></li> -->
</ul>
</li>
<!-- Chinese IR -->
<li class="dropdown">
<a href="investors.asp" class="active dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="true">投資者關係 <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<!-- <li><a href="corporate_governance.asp">Announcements & Circulars</a></li>
<li class="divider"></li> -->
<li><a href="ir_formal_notice_2_cn.asp">公告及通函</a></li>
<!-- <li><a href="financial_information.asp">Announcement of Offer Price & Allotment Results</a></li>
<li><a href="financial_information.asp">List Of Directors & Roles & Functions</a></li> -->
<li class="divider"></li>
<li><a href="ir_corp_governance_cn.asp">企業管治</a></li>
<li class="divider"></li>
<!-- <li style="background-color: powderblue;"><strong>Listing Documents</strong></li> -->
<li><a href="ir_prospectus_cn.asp">招股書</a></li>
<li><a href="ir_green_form_cn.asp">绿表</a></li>
<li><a href="ir_white_form_cn.asp">白表</a></li>
<li><a href="ir_yellow_form_cn.asp">黄表</a></li>
<!-- <li class="divider"></li>
<li><a href="financial_information.asp">Corporate Governance</a></li>
<li><a href="financial_information.asp">Procedures for Shareholders to Nominate a Director</a></li>
<li><a href="financial_information.asp">Terms of Reference of Audit Committee</a></li>
<li><a href="financial_information.asp">Terms of Reference of Nomination Committee</a></li>
<li><a href="financial_information.asp">Amended & restated memorandum of association</a></li>
<li><a href="financial_information.asp">Amended & restated articles of association</a></li> -->
</ul>
</li>
<li class="active"><a href="contact.asp">Contact <span class="sr-only">(current)</span></a></li>
</ul>
</div>
</div>
</nav>
<div class="row" align="center" style="background-color: orange;">
</div>
<!-- ================================================== -->
<!-- ================================================== -->
<!-- ================================================== -->
<!-- ================================================== -->
<!-- End Header -->
<!-- Bootstrap core JavaScript -->
<!-- ================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="env/js/jquery-1.10.2.min.js?v=1.0"></script>
<script src="env/js/bootstrap.js?v=1.0"></script>
<script src="env/js/waypoints.min.js?v=1.0"></script>
<script src="env/js/jquery.scrollto.min.js?v=1.0"></script>
<script src="env/js/jquery.localscroll.min.js?v=1.0"></script>
<script src="env/js/jquery.prettyPhoto.js?v=1.0"></script>
<script src="env/js/scripts.js?v=1.0"></script>
<!-- Rocket extras -->
<link href="env/css/animate.css?v=1.0" rel="stylesheet">
<link href="env/css/prettyPhoto.css?v=1.0" rel="stylesheet">
<link href="env/css/style.css?v=1.11" rel="stylesheet">
<!-- Color Box pop-up-->
<link href="assets/css/colorbox.css?v=1.9" rel="stylesheet">
<script src="assets/js/jquery.colorbox.js?v=1.9"></script>
<script src="assets/js/jquery.colorboxsystemmessage.js?v=1.5"></script>
<script>
////////////////////////////////////////////////////////
//Responsive Colorbox!!!! OPTION 1
var cboxOptions = {
width: '85%',
height: '85%',
maxWidth: '960px',
maxHeight: '960px',
}
$('.cbox-link').colorbox(cboxOptions);
$(window).resize(function(){
$.colorbox.resize({
width: window.innerWidth > parseInt(cboxOptions.maxWidth) ? cboxOptions.maxWidth : cboxOptions.width,
height: window.innerHeight > parseInt(cboxOptions.maxHeight) ? cboxOptions.maxHeight : cboxOptions.height
});
});
//Responsive Colorbox!!!!
////////////////////////////////////////////////////////
////////////////////////////////////////////////////////
//Responsive Colorbox!!!! OPTION 2
/* function resizeColorBox()
{
if (jQuery('#cboxOverlay').is(':visible')) {
jQuery.colorbox.resize({width:'100%', height:'100%'});
}
}
// Resize Colorbox when resizing window or changing mobile device orientation
jQuery(window).resize(resizeColorBox);
window.addEventListener("orientationchange", resizeColorBox, false); */
// OPTION 2
////////////////////////////////////////////////////////
function login(){
$.colorbox({width: "80%", height: "80%", iframe:true, fixed: true, href:"login.asp"});
}
</script>
<Style>
</Style>
</Head>
<Body>
<Img Src="http://via.placeholder.com/1920x700" class="visible-lg visible-md animate img-responsive" data-animate="fadeInDown"/>
<Img Src="http://via.placeholder.com/1920x700" class="visible-xs visible-sm animate img-responsive" data-animate="fadeInDown"/>
<section style="padding-top: 30px;">
<div class="row" align="center"><H3>Our Products</H3></div>
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-4">
<p class="text-justify"><br>
We manufacture, package and sell coconut cream powder under company’s own brands.
We also manufacture and sell products to our OEM customers packaged under their brands.
Our line of Products:<br></p>
<li>Coconut cream powder</li>
<li>Low fat desiccated coconut</li>
<li>Coconut milk</li>
<li>Non-dairy creamer</li>
<li>Rice dumplings (ketupat)</li>
<li>Toasted coconut paste (kerisik)</li>
</div>
<div class="col-lg-4"></div>
</div>
</Section>
<section style="padding-top: 100px;">
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-2">
<h4>Santan<br> Coconut Cream Powder</h4>
<h5>Original </h4>
<br>6 x 24 x 50g
</div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2"><h4>Santan<br> Coconut Cream Powder</h4>
<h5>Pandan </h4>
<br>6 x 24 x 50g
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-2">
<h4>Santan<br> Coconut Cream Powder</h4>
<h5>Omega-3 </h4>
<br>6 x 24 x 50g
</div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2" align="center"><h4>Cocos<br> Coconut Cream Powder</h4>
<br>48 x 150g
<br>24 x 300g
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2" align="center"><h4>Rasa Enak<br> Coconut Cream Powder</h4>
<br>4 x 36 x 50g
<br>6 x 24 x 50g
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-2" align="center">
<h4>Santan<br> Coconut Cream Powder</h4>
<br>Industrial Bulk Packing</h4>
<br>1 x 25kg
</div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2" align="center"><h4>Cocos<br> Coconut Cream Powder</h4>
<br>Industrial Bulk Packing</h4>
<br>1 x 25kg
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2"><h4>Santan<br> Low Fat Desiccated Coconut</h4>
<br>3 x 24 x 100g
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2" align="center"><h4>Low Fat Desiccated Coconut</h4>
<br>Industrial Bulk Packing</h4>
<br>1 x 25kg
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2"><h4>Santan<br> Coconut Milk</h4>
<br>36 x 200ml
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-2" align="center">
<h4>Rasa Enak<br> Coconut Milk</h4>
<br>36 x 200ml
</div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-2" align="center">
<h4>Non Dairy Creamer</h4>
<br>Industrial Bulk Packing</h4>
<br>1 x 25kg
</div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2" align="center"><h4>Santan<br> Rice dumplings (ketupat)</h4>
<br>12 x 650g
<br>12 x 780g
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row" align="right">
<div class="col-lg-4"></div>
<div class="col-lg-2" align="center"><h4>Rasa Enak<br> Rice dumplings (ketupat)</h4>
<br>12 x 650g
<br>12 x 780g
</div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-2"><img src ="http://via.placeholder.com/200x200" class="img-responsive"></div>
<div class="col-lg-2" align="center">
<h4>Rasa Enak<br> Toasted Coconut Paste (kerisik)</h4>
<br>10 x 12 x 100g
<br>16 x 1kg
</div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br>
<!-- <div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-2"><img src="images/products/Cocos_InstantMilkPowder-350.png" class="img-responsive"></div>
<div class="col-lg-2" align="center">
<h4>Cocos<br> Instant Coconut Milk Powder</h4>
<br>50g per pack
</div>
<div class="col-lg-4"></div>
</div>
<br><br><hr><br><br> -->
</section>
</body>
<!-- ============ Footer ================ -->
<section id="image" style="background-color:#000000;">
<div class="row" align="center">
<br>
<!-- <small><strong><a href="#" OnClick="terms(); return false;" style="color: #5fadef;">Terms & Conditions</a></strong>. </small> -->
<!-- <small><strong><a href="#" OnClick="privacy(); return false;" style="color: #5fadef;">Privacy Policies</a></strong>. </small> -->
<br>
<font size="1.5em" color="#ccc">版權所有，未經授權，不得轉載. All rights reserved & copyrighted 2017.</font>
<br><br>
</div>
</section>
<!-- Color Box pop-up-->
<link href="assets/css/colorbox.css?v=1.9" rel="stylesheet">
<script src="assets/js/jquery.colorbox.js?v=1.9"></script>
<script src="assets/js/jquery.colorboxsystemmessage.js?v=1.5"></script>
<script>
////////////////////////////////////////////////////////
//Responsive Colorbox!!!! OPTION 1
var cboxOptions = {
width: '85%',
height: '85%',
maxWidth: '960px',
maxHeight: '960px',
}
$('.cbox-link').colorbox(cboxOptions);
$(window).resize(function(){
$.colorbox.resize({
width: window.innerWidth > parseInt(cboxOptions.maxWidth) ? cboxOptions.maxWidth : cboxOptions.width,
height: window.innerHeight > parseInt(cboxOptions.maxHeight) ? cboxOptions.maxHeight : cboxOptions.height
});
});
//Responsive Colorbox!!!!
////////////////////////////////////////////////////////
////////////////////////////////////////////////////////
//Responsive Colorbox!!!! OPTION 2
/* function resizeColorBox()
{
if (jQuery('#cboxOverlay').is(':visible')) {
jQuery.colorbox.resize({width:'100%', height:'100%'});
}
}
// Resize Colorbox when resizing window or changing mobile device orientation
jQuery(window).resize(resizeColorBox);
window.addEventListener("orientationchange", resizeColorBox, false); */
// OPTION 2
////////////////////////////////////////////////////////
function terms(){
$.colorbox({width: "80%", height: "80%", iframe:true, fixed: true, href:"terms.asp"});
}
function privacy(){
$.colorbox({width: "80%", height: "80%", iframe:true, fixed: true, href:"privacy.asp"});
}
</script>
<!-- ============ Footer ================ -->
</html>
