#hypro-product-page{
--blue:#0875D1;
--navy:#063B7A;
--green:#08A84E;
--border:#DCE8F4;
--muted:#6B7F97;
max-width:1200px;
margin:0 auto;
padding:20px;
font-family:Arial,Helvetica,sans-serif;
color:var(--navy);
box-sizing:border-box;
}
#hypro-product-page *{box-sizing:border-box}
#hypro-product-page button,
#hypro-product-page a{
-webkit-tap-highlight-color:transparent!important;
}
#hypro-product-page button:focus,
#hypro-product-page a:focus{
outline:none!important;
box-shadow:none!important;
}
.hypro-breadcrumb{
display:flex;align-items:center;flex-wrap:wrap;
gap:9px;margin-bottom:22px;
font-size:13px;color:var(--muted);
}
.hypro-breadcrumb a{
color:#476B92!important;
text-decoration:none!important;
}
.hypro-breadcrumb a:hover,
.hypro-breadcrumb a:focus{
color:var(--blue)!important;
background:transparent!important;
}
.hypro-breadcrumb .separator{color:#9BAEC0}
.hypro-breadcrumb .current{color:#476B92}
.hypro-top{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
gap:40px;
align-items:start;
}
.hypro-gallery{min-width:0}
.hypro-main-image{
position:relative;
height:520px;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
background:#fff;
border:1px solid var(--border);
border-radius:14px;
}
.hypro-main-image img{
display:block;
width:100%;
height:100%;
object-fit:contain;
padding:20px;
}
.hypro-main-arrow{
position:absolute;
top:50%;
transform:translateY(-50%);
z-index:5;
width:42px;
height:42px;
padding:0!important;
display:flex;
align-items:center;
justify-content:center;
border:1px solid #D5E3EF!important;
border-radius:50%!important;
background:#fff!important;
color:var(--blue)!important;
font-size:28px;
line-height:1;
cursor:pointer;
box-shadow:0 3px 12px rgba(0,0,0,.08)!important;
}
.hypro-main-arrow:hover,
.hypro-main-arrow:focus,
.hypro-main-arrow:active{
background:var(--blue)!important;
color:#fff!important;
border-color:var(--blue)!important;
}
.hypro-main-prev{left:12px}
.hypro-main-next{right:12px}
.hypro-thumbnail-area{
display:flex;
align-items:center;
gap:8px;
margin-top:12px;
}
.hypro-thumb-arrow{
flex:0 0 34px;
width:34px;
height:34px;
padding:0!important;
display:flex;
align-items:center;
justify-content:center;
border:1px solid #D5E3EF!important;
border-radius:50%!important;
background:#fff!important;
color:var(--blue)!important;
font-size:21px;
cursor:pointer;
}
.hypro-thumb-arrow:hover,
.hypro-thumb-arrow:focus,
.hypro-thumb-arrow:active{
background:var(--blue)!important;
color:#fff!important;
border-color:var(--blue)!important;
}
.hypro-thumbnails{
display:flex;
flex:1;
gap:8px;
overflow-x:auto;
scroll-behavior:smooth;
padding:2px;
scrollbar-width:none;
}
.hypro-thumbnails::-webkit-scrollbar{display:none}
.hypro-thumb{
flex:0 0 90px;
width:90px;
height:76px;
padding:5px!important;
border:2px solid transparent!important;
border-radius:8px!important;
background:#F6F9FC!important;
cursor:pointer;
overflow:hidden;
}
.hypro-thumb img{
width:100%;
height:100%;
object-fit:contain;
display:block;
}
.hypro-thumb:hover{
border-color:#94C8F3!important;
background:#fff!important;
}
.hypro-thumb.active,
.hypro-thumb:focus,
.hypro-thumb:active{
border-color:var(--blue)!important;
background:#fff!important;
color:var(--blue)!important;
box-shadow:none!important;
}
.hypro-product-details{padding-top:3px}
.hypro-category{
display:inline-block;
padding:6px 15px;
background:var(--blue);
color:#fff;
border-radius:20px;
font-size:12px;
font-weight:700;
letter-spacing:.4px;
margin-bottom:12px;
}
.hypro-product-title{
margin:0 0 8px;
color:var(--navy);
font-size:38px;
line-height:1.08;
font-weight:800;
}
.hypro-product-subtitle{
margin:0 0 18px;
color:#536E8D;
font-size:16px;
line-height:1.55;
}
.hypro-price-row{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:16px;
margin:12px 0 18px;
}
.hypro-price{
color:#F21F45;
font-size:38px;
font-weight:800;
}
.hypro-old-price{
color:#7B8B9D;
font-size:18px;
text-decoration:line-through;
}
.hypro-saving{
padding:10px 15px;
background:#FFF0F4;
color:#F21F45;
border:1px solid #FFD2DC;
border-radius:9px;
font-size:14px;
font-weight:700;
}
.hypro-highlights{
margin-bottom:18px;
padding:16px 18px;
background:linear-gradient(135deg,#EDF8FF,#F8FCFF);
border-radius:12px;
}
.hypro-highlight{
display:flex;
align-items:flex-start;
gap:10px;
margin:8px 0;
color:#365B82;
font-size:14px;
line-height:1.45;
}
.hypro-check{
flex:0 0 21px;
width:21px;
height:21px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:var(--green);
color:#fff;
font-size:13px;
font-weight:bold;
}
.hypro-whatsapp{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
width:100%;
padding:15px 18px;
background:#08A84E!important;
color:#fff!important;
border:none!important;
border-radius:9px!important;
text-decoration:none!important;
font-size:18px;
font-weight:700;
transition:.2s ease;
}
.hypro-whatsapp:hover,
.hypro-whatsapp:focus,
.hypro-whatsapp:active{
background:#078E43!important;
color:#fff!important;
text-decoration:none!important;
box-shadow:none!important;
}
.hypro-wa-icon{
width:29px;
height:29px;
display:flex;
align-items:center;
justify-content:center;
border:2px solid #fff;
border-radius:50%;
font-size:16px;
}
.hypro-services{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:12px;
margin-top:22px;
}
.hypro-service{text-align:center}
.hypro-service-icon{
width:56px;
height:56px;
display:flex;
align-items:center;
justify-content:center;
margin:0 auto 8px;
border-radius:50%;
background:#EDF7FF;
color:var(--blue);
font-size:25px;
}
.hypro-service-title{
color:var(--navy);
font-size:12px;
line-height:1.35;
font-weight:700;
}
.hypro-tabs{
display:flex;
align-items:center;
gap:45px;
margin-top:38px;
border-bottom:1px solid var(--border);
}
.hypro-tab{
appearance:none!important;
-webkit-appearance:none!important;
position:relative;
padding:15px 5px 13px!important;
border:none!important;
border-radius:0!important;
background:transparent!important;
color:var(--navy)!important;
font-family:Arial,Helvetica,sans-serif;
font-size:16px;
font-weight:700;
cursor:pointer;
box-shadow:none!important;
outline:none!important;
}
.hypro-tab:hover,
.hypro-tab:focus,
.hypro-tab:focus-visible,
.hypro-tab:active{
background:transparent!important;
color:var(--blue)!important;
border:none!important;
box-shadow:none!important;
outline:none!important;
}
.hypro-tab.active{
background:transparent!important;
color:var(--blue)!important;
}
.hypro-tab.active::after{
content:"";
position:absolute;
left:0;
right:0;
bottom:-1px;
height:4px;
background:var(--blue);
border-radius:4px 4px 0 0;
}
.hypro-panel{
display:none;
padding:28px 0 5px;
}
.hypro-panel.active{display:block}
.hypro-section-title{
margin:0 0 10px;
color:var(--navy);
font-size:29px;
line-height:1.2;
font-weight:800;
}
.hypro-description{
max-width:1000px;
margin:0;
color:#4D6785;
font-size:15px;
line-height:1.7;
}
.hypro-info-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:28px 35px;
margin-top:30px;
}
.hypro-info-item{
display:flex;
align-items:flex-start;
gap:14px;
}
.hypro-info-icon{
flex:0 0 56px;
width:56px;
height:56px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:#EDF7FF;
color:var(--blue);
font-size:26px;
}
.hypro-info-content h4{
margin:3px 0 5px;
color:var(--navy);
font-size:16px;
}
.hypro-info-content p{
margin:0;
color:#58718E;
font-size:14px;
line-height:1.5;
}
.hypro-spec-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:30px;
}
.hypro-spec-card{
overflow:hidden;
border:1px solid var(--border);
border-radius:12px;
background:#fff;
}
.hypro-spec-row{
display:grid;
grid-template-columns:42% 58%;
border-bottom:1px solid #E5EDF5;
}
.hypro-spec-row:last-child{border-bottom:none}
.hypro-spec-label{
padding:14px 16px;
background:#F3F9FD;
color:var(--navy);
font-size:14px;
font-weight:700;
}
.hypro-spec-value{
padding:14px 16px;
color:#526C89;
font-size:14px;
line-height:1.45;
}
.hypro-layer-card{
padding:22px;
background:#F1F9FF;
border:1px solid var(--border);
border-radius:12px;
}
.hypro-layer-card h3{
margin:0 0 18px;
color:var(--navy);
font-size:21px;
}
.hypro-layer{
display:flex;
gap:12px;
padding:12px 0;
border-bottom:1px solid #DCEAF5;
}
.hypro-layer:last-child{border-bottom:none}
.hypro-layer-number{
flex:0 0 34px;
width:34px;
height:34px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:var(--blue);
color:#fff;
font-weight:700;
}
.hypro-layer-content strong{
display:block;
margin-bottom:4px;
color:var(--navy);
font-size:15px;
}
.hypro-layer-content p{
margin:0;
color:#526C89;
font-size:13px;
line-height:1.5;
}
.hypro-installation{
display:flex;
align-items:center;
justify-content:space-between;
gap:25px;
margin-top:38px;
padding:24px 26px;
background:linear-gradient(110deg,#EAF8FF,#DFF3FF);
border-radius:13px;
}
.hypro-installation-text h3{
margin:0 0 6px;
color:var(--navy);
font-size:22px;
}
.hypro-installation-text p{
margin:0;
color:#536E8D;
font-size:14px;
line-height:1.5;
}
.hypro-installation .hypro-whatsapp{
width:auto;
min-width:220px;
}
@media(max-width:900px){
.hypro-top{grid-template-columns:1fr}
.hypro-main-image{height:450px}
.hypro-info-grid{grid-template-columns:repeat(2,1fr)}
.hypro-spec-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
#hypro-product-page{padding:13px}
.hypro-main-image{height:350px}
.hypro-main-image img{padding:12px}
.hypro-main-arrow{width:36px;height:36px;font-size:23px}
.hypro-product-title{font-size:29px}
.hypro-price{font-size:31px}
.hypro-thumb{flex-basis:72px;width:72px;height:64px}
.hypro-services{
grid-template-columns:repeat(2,1fr);
row-gap:20px;
}
.hypro-tabs{gap:25px;overflow-x:auto}
.hypro-tab{white-space:nowrap;font-size:14px}
.hypro-info-grid{grid-template-columns:1fr}
.hypro-installation{
flex-direction:column;
align-items:flex-start;
}
.hypro-installation .hypro-whatsapp{
width:100%;
min-width:0;
}
}
Home
›
Outdoor Filter
›
Sand Filter Stainless Steel
‹
›
OUTDOOR FILTER
Sand Filter Stainless Steel
A practical outdoor water filtration system designed
to provide cleaner water throughout your home.
✓
Multi-layer filtration media system
✓
Backwash system for media self-cleaning
✓
Designed to minimize effect on water pressure
✓
Durable stainless steel tank
✓
Easy to operate and maintain
✓
Suitable for homes, shops and offices
☎
WhatsApp
Product Information
Specifications
Product Specifications
Operation Mode
Manual Backwash
Filtration System
5-Layer Filtration
Media Cleaning
Backwash System for Media Self-Cleaning
Water Pressure Impact
Designed to minimize
Multi-Layer Filtration System
01
Activated Carbon
Helps reduce chlorine, odour and selected
organic impurities while improving the
overall water condition.
02
Zeolite
Provides additional filtration support
for suspended impurities and selected
dissolved contaminants.
03
Fine Silica Sand
Helps capture finer sediment and
suspended particles in the water.
04
Medium Silica Sand
Provides intermediate filtration
for dirt and sediment.
05
Coarse Silica Sand
Helps trap larger particles, sediment
and mud while supporting the upper
filtration layers.
Installation in Kuantan, Kelantan & Surrounding Areas
For installation enquiries in Kuantan, Kelantan
and surrounding areas, please contact us via WhatsApp.
☎
WhatsApp
const hyproImages = [
"https://hyprowater.my/wp-content/uploads/2026/10/Slim-Stainless-Steel-Water-Filter-Tank-1.png",
"https://hyprowater.my/wp-content/uploads/2026/10/Slim-Stainless-Steel-Water-Filter-Tank-layer-1.png",
"https://hyprowater.my/wp-content/uploads/2026/10/haed-stainless-steel-sand-filter-1.png"
];
let hyproCurrentImage = 0;
// Pastikan gambar pertama dipaparkan setiap kali halaman dibuka.
if (document.readyState === "loading") {
document.addEventListener("DOMContentLoaded", function(){ hyproSelectImage(0); });
} else {
hyproSelectImage(0);
}
function hyproSelectImage(index){
if(index = hyproImages.length) return;
hyproCurrentImage = index;
const mainImage = document.getElementById("hyproMainImage");
if(mainImage){
mainImage.src = hyproImages[index];
}
document.querySelectorAll(
"#hypro-product-page .hypro-thumb"
).forEach(function(thumb){
thumb.classList.remove("active");
});
const selected = document.querySelector(
'#hypro-product-page .hypro-thumb[data-index="' + index + '"]'
);
if(selected){
selected.classList.add("active");
selected.scrollIntoView({
behavior:"smooth",
block:"nearest",
inline:"center"
});
}
}
function hyproNextImage(){
hyproSelectImage(
(hyproCurrentImage + 1) % hyproImages.length
);
}
function hyproPreviousImage(){
hyproSelectImage(
(hyproCurrentImage - 1 + hyproImages.length)
% hyproImages.length
);
}
function hyproScrollThumbnails(direction){
const thumbnails = document.getElementById("hyproThumbnails");
if(thumbnails){
thumbnails.scrollBy({
left:direction * 220,
behavior:"smooth"
});
}
}
function hyproOpenTab(panelId,button){
document.querySelectorAll(
"#hypro-product-page .hypro-panel"
).forEach(function(panel){
panel.classList.remove("active");
});
document.querySelectorAll(
"#hypro-product-page .hypro-tab"
).forEach(function(tab){
tab.classList.remove("active");
});
const selectedPanel = document.getElementById(panelId);
if(selectedPanel){
selectedPanel.classList.add("active");
}
button.classList.add("active");
button.blur();
}
#hypro-product-page .hypro-price{font-size:clamp(20px,2.5vw,30px)}