/* copy from (https://www.piaa.com.au/)*/
@import url("https://use.typekit.net/mwd5xry.css");


body { 
    background: #fafafa;
	font-family: futura-pt, sans-serif;
	font-size: 18px; font-size: 17.99px; font-weight: 500; color: #000000; line-height: 1.3;
	scroll-behavior: smooth;
}
body.home { background: #fff; }
h1, h2, h3, h4, h5, h6 { 
    font-family: futura-pt, sans-serif;
	font-weight: 900; line-height: 1.2; color: #000000;
}
h1, h2, h3 { letter-spacing: 0; }
h5 { font-size: 20px; }
h6 { font-size: 18px; font-size: 17.99px; }
ol, ul { line-height: 1.3; }
p { line-height: 1.3; }
p:last-child { margin-bottom: 0; }
a { color: #405878; }
a:hover,
a:focus { color: #000000; }
a[href*=mailto],
a[href*=http] { word-break: break-word; }
a[href*=javascript] { cursor: auto; }

html.is-reveal-open.zf-has-scroll { overflow-y: hidden; }
html.is-reveal-open body { position: fixed; width: 100%; overflow-y: scroll; }
.reveal-overlay { overflow-y: scroll; }

@media screen and (max-width: 639px) {
    body { font-size: 16px; }

    h1 { font-size: 38px; }
    h2 { font-size: 30px; }
    h3 { font-size: 25px; }
    h4 { font-size: 20px; }
    h5 { font-size: 18px; font-size: 17.99px; }
    h6 { font-size: 16px; }
}


/*=====================================================================*/
/* CONTENT */
/*=====================================================================*/
.nilpadding { padding: 0; }
.relative { position: relative; }
.text-bigger { font-size: 1.15em; }

.content-wrap { padding: 70px 0; overflow-x: hidden; }
/*--*/
.img.deco { position: relative; padding-top: 10%; }
.img.deco:before {
    content: ''; width: 90%; height: 88%; background: #f7f7f7;
    position: absolute; top: 0; left: -50px;
}
.img.deco img { position: relative; }
/*--*/
.titlehead { margin-bottom: 40px; text-transform: uppercase; word-break: break-word; }
.titlehead h1 { 
    position: relative; 
    font-size: 50px; line-height: 1.1; 
}
.titlehead.sub h1 { color: #cccccc; margin-bottom: 0; }
.titlehead.sub h1:after { content: '-'; }
.titlehead.sub h2 { font-size: 40px; line-height: 1.1; margin-bottom: 0; }
.titlehead.desc h1 { margin-bottom: 15px; }
.titlehead.desc p { text-transform: none; }
/*===========================*/
/*====== display table ======*/
.dtable_wrap { width: 100%; display: table; table-layout: fixed; }
.dtable_wrap > div { display: table-cell; vertical-align: middle; }
.dtable_wrap.vb > div { vertical-align: bottom; }
.dtable_wrap.vt > div { vertical-align: top; }
/*==================*/
/*====== Form ======*/
.space_submit { margin-top: 50px; }
.input-wrap { margin-bottom: 13px; position: relative; }
/*--*/
label { 
    font-size: 16px; color: #000; line-height: 1.3; 
    margin-bottom: 3px; 
}
textarea,
input[type]:not([type="submit"]):not([type="button"]) {
    font-size: 16px; color: #000; line-height: 1.3;
    background-color: transparent; height: 45px; margin: 0; padding: 10px 15px; 
    box-shadow: none; border: 3px solid #000; 
}
textarea { height: 10em; }
textarea:focus,
input[type]:not([type="submit"]):not([type="button"]):focus { box-shadow: none; background-color: transparent; border: 3px solid rgba(0, 0, 0, 0.2); }
/*--*/
textarea::-webkit-input-placeholder,
input::-webkit-input-placeholder { color: #999; }
textarea:-moz-placeholder,
input:-moz-placeholder { color: #999; opacity: 1; }
textarea::-moz-placeholder,
input::-moz-placeholder { color: #999; opacity: 1; }
textarea:-ms-input-placeholder,
input:-ms-input-placeholder { color: #999; }
/*--*/
textarea.error:not(:focus),
input.error[type]:not([type="submit"]):not([type="button"]):not(:focus) { border-color: #ff7449; }
label.error { font-size: 11px; font-weight: 700; color: #ff7449; padding: 5px 0px; }
label.error:empty { display: none; }
select.error + .nice-select { border-color: #ff7449; }
.nice-select + label.error { padding: 0; }
/*====================*/
/*====== Button ======*/
.btn-line { 
    position: relative; outline: 0; z-index: 1; 
    -webkit-transition: color .3s cubic-bezier(.165,.84,.44,1) 0s;
            transition: color .3s cubic-bezier(.165,.84,.44,1) 0s;
}
.btn-line:before { 
    content: ''; display: block; width: 100%; height: 100%; background: #000;
    position: absolute; top: 1px; left: 0; z-index: -1;
    -webkit-transform: scale(0,1); transform: scale(0,1);
    -webkit-transform-origin: 100% 0; transform-origin: 100% 0;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.165,.84,.44,1) 0s;
            transition: transform .3s cubic-bezier(.165,.84,.44,1) 0s;
}
.btn-line:hover { 
    color: #fff; 
    -webkit-transition: color .45s cubic-bezier(.86,0,.07,1) 0s;
            transition: color .45s cubic-bezier(.86,0,.07,1) 0s;
}
.btn-line:hover::before { 
    -webkit-transform: scale(1); transform: scale(1);
    -webkit-transform-origin: 0 0; transform-origin: 0 0;
    -webkit-transition: -webkit-transform .45s cubic-bezier(.86,0,.07,1) 0s;
            transition: transform .45s cubic-bezier(.86,0,.07,1) 0s;
}
/*--*/
/*!
 * Button Styles Inspiration
 * © Codrops 2020 (https://tympanus.net/Development/ButtonStylesInspiration/)
 **/
.btn-solidbg {
    font-size: 20px; font-weight: 700; color: #fff; text-align: center; text-transform: uppercase;
    position: relative; display: inline-block; margin: 0; padding: 0.6em 1em; outline: 0; border: none; cursor: pointer; z-index: 1; overflow: hidden;
    -webkit-transition: color 0.3s cubic-bezier(0.75, 0, 0.125, 1);
            transition: color 0.3s cubic-bezier(0.75, 0, 0.125, 1);
}
.btn-solidbg:before,
.btn-solidbg:after {
    content: ''; width: 100%; height: 100%; border-radius: inherit; z-index: -1;
    position: absolute; top: 0; left: 0;
    -webkit-backface-visibility: hidden; backface-visibility: hidden;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
            transition: transform 0.3s, opacity 0.3s;
    -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
            transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.btn-solidbg:before {
    border: 3px solid; opacity: 0;
    -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1);
}
.btn-solidbg:after { background: #000; }

.btn-solidbg:hover,
.btn-solidbg:focus { border: none; background: transparent; color: #000; }
.btn-solidbg:hover::before,
.btn-solidbg:focus::before {
    opacity: 1;
    -webkit-transform: scale(1, 1); transform: scale(1, 1);
}
.btn-solidbg:hover::after,
.btn-solidbg:focus::after {
    opacity: 0;
    -webkit-transform: scale(0.9, 0.9); transform: scale(0.9, 0.9);
}
/*--*/
.btn-border {
    font-size: 20px; font-weight: 900; color: #000; text-align: center; text-transform: uppercase; line-height: 1;
    position: relative; display: inline-block; padding: 0.45em 0.8em; border: 3px solid #000;
    cursor: pointer; z-index: 1; overflow: hidden; outline: 0;
    -webkit-transition: background 0.1s 0s ease-out, transform 0.1s ease-out; 
            transition: background 0.1s 0s ease-out, transform 0.1s ease-out; 
}
.btn-border:before { 
    content: ""; width: 100%; height: 100%; background: #000; 
    position: absolute; bottom: 0px; left: 0; z-index: -1;
    -webkit-transform: scale(0,1); transform: scale(0,1); 
    -webkit-transform-origin: 100% 0; transform-origin: 100% 0;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.165,.84,.44,1) 0s;
            transition: transform .3s cubic-bezier(.165,.84,.44,1) 0s;
}
.btn-border:hover {
    color: #fff;
    -webkit-transition: color .45s cubic-bezier(.86,0,.07,1) 0s;
            transition: color .45s cubic-bezier(.86,0,.07,1) 0s;
}
.btn-border:hover::before { 
    -webkit-transform: scale(1); transform: scale(1);
    -webkit-transform-origin: 0 0; transform-origin: 0 0;
    -webkit-transition: -webkit-transform .45s cubic-bezier(.86,0,.07,1) 0s;
            transition: transform .45s cubic-bezier(.86,0,.07,1) 0s; 
}
/*--*/
.linkoutbtn.btn-border { position: relative; padding-left: 1.7em; padding-right: 1.7em; }
.linkoutbtn.btn-border:after {
    content: '\f08e'; font-family: 'FontAwesome'; font-size: 0.7em; font-weight: normal;
    position: absolute; top: 50%; right: 10px; margin-top: -6px;
    -webkit-backface-visibility: hidden; backface-visibility: hidden;
}
/*--*/
.btn-viewall {
    font-size: 30px; font-weight: 700; color: #0084ff; line-height: 1; letter-spacing: 0;
    display: inline-block; vertical-align: middle;
}
.btn-viewall:after { 
    content: ''; margin-left: 10px;
    border: inset 7px; border-left-style: solid;
    border-color: transparent transparent transparent #0084ff;
    display: inline-block; -webkit-transition: 0.3s ease-out; transition: 0.3s ease-out; 
}
.btn-viewall:hover,
.btn-viewall:focus { color: #0084ff; }
.btn-viewall:hover::after { -webkit-transform: translateX(8px); transform: translateX(8px); }
/*====================*/
/*====== Reveal ======*/
.reveal { 
    margin: 0px auto 30px; padding: 4em 1.5em 2.5em; overflow: visible; 
    border: none; border-radius: 10px; outline: 0; box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.10);
}
.reveal .close-btn {
    cursor: pointer;
    font-size: 3em; font-weight: 300; color: #ccc; 
    position: absolute; right: 20px; top: 8px;
    -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1);
    -webkit-backface-visibility: hidden; backface-visibility: hidden;
    -webkit-transition: 0.3s; transition: 0.3s;
}
.reveal .close-btn:hover { -ms-transform: scale(0.9); -webkit-transform: scale(0.9); transform: scale(0.9); }


@media screen and (min-width: 1024px) {
    .large-offset-2-right { margin-right: 16.66667%; }
}
@media screen and (min-width: 1600px) {
    .xlarge-offset-3 { margin-left: 25%; }
    .xlarge-offset-3-right { margin-right: 25%; }
}
@media screen and (max-width: 1023px) {
    .dtable_wrap.medium-block,
    .dtable_wrap.medium-block > div { display: block; }
}
@media screen and (max-width: 639px) {
    .content-wrap { padding: 50px 0; }
    /*--*/
    .titlehead { margin-bottom: 30px; }
    .titlehead h1 { font-size: 38px; }
    .titlehead.sub h2 { font-size: 30px; }
    /*--*/
    .dtable_wrap.small-block,
    .dtable_wrap.small-block > div { display: block; }
    /*--*/
    label { font-size: 15px; }
    textarea, 
    input[type]:not([type="submit"]):not([type="button"]) { font-size: 15px; height: 40px; border-width: 2px; padding: 8px 10px; }
    textarea:focus,
    input[type]:not([type="submit"]):not([type="button"]):focus { border-width: 2px; }
    textarea { height: 7em; }
    /*--*/
    .btn-solidbg { font-size: 18px; font-size: 17.99px; }
    .btn-solidbg:before { border-width: 2px; }
    .btn-border { font-size: 18px; font-size: 17.99px; }
    .btn-border:before { 
        /* when in small screen, it got blank gap, dunno what caused it, temp use this solution to make gap disappear */
        height: 101%;
        -webkit-backface-visibility: hidden; backface-visibility: hidden;
    }
    .btn-viewall { font-size: 25px; }
    /*--*/
    .reveal { width: 85%; max-width: inherit; height: inherit; min-height: inherit; }
}


/*=====================================================================*/
/* HEADER */
/*=====================================================================*/
header { background: rgba(255,255,255,1); box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.1); position: relative; z-index: 5; }
header > div.row { max-width: 80rem; }
header a { 
    font-weight: 700; color: #000; text-transform: uppercase; outline: 0; 
    -webkit-transition: all 0.3s ease; transition: all 0.3s ease; 
}
a.logo { 
    max-width: 10em; display: inline-block; 
    -webkit-backface-visibility: hidden; backface-visibility: hidden; 
}
/*--*/
.responsive-menu > .menu > li > a { position: relative; }
.responsive-menu > .menu > li > a:before { 
    content: ''; display: block; width: 5px; height: 5px; background: #000; 
    position: absolute; opacity: 0; visibility: hidden;
    -webkit-transition: all 0.3s ease; transition: all 0.3s ease; 
}
.responsive-menu .menu li a:focus,
.responsive-menu .menu li a:hover { color: #000; }
.responsive-menu .menu li.active a,
.responsive-menu .menu li.is-active a { background: none; color: #000; }
.responsive-menu > .menu > li > a:hover::before,
.responsive-menu > .menu > li.active > a:before,
.responsive-menu > .menu > li.is-active > a:before { opacity: 1; visibility: visible; }
/*=================*/
/*====== ... ======*/
header.navibnw { 
    background: none; box-shadow: none; 
    position: absolute; left: 0; top: 0; width: 100%; 
}
/*=============================*/
/*====== Preventing FOUC ======*/
.no-js #responsive-menu { display: none; }


@media screen and (min-width: 1024px) {
    #responsive-menu { display: block; }
    .off-canvas.reveal-for-large { position: static; background: none; width: auto; overflow: inherit; }
    /*=================*/
    /*====== ... ======*/
    header { padding: 5px 25px; }
    header > div.row { width: 100%; display: table; display: -ms-flexbox; display: flex; }
    .menuham-wrap { display: none; }
    .logo-wrap { display: table-cell; vertical-align: middle; margin: auto 0; }
    .navi-wrap { display: table-cell; vertical-align: middle; margin: auto 0 auto 60px; }
    /*--*/
    .responsive-menu > .menu > li { margin: 0 23px; vertical-align: middle; }
    .responsive-menu > .menu > li:first-child { margin-left: 0; }
    .responsive-menu > .menu > li:last-child { margin-right: 0; }
    .responsive-menu > .menu > li > a { 
        padding: 1.8em 0; 
        font-size: 17.99px; /*(bcz seem not pixel perfect, can remove if ntg in other screen)*/
    }
    .responsive-menu > .menu > li > a:before { 
        bottom: 16px; left: 50%; 
        -webkit-transform: translate(-50%,0); transform: translate(-50%,0);
    }
    /*--*/
    .responsive-menu .dropdown.menu > li.is-dropdown-submenu-parent { padding-right: 1em; }
    .responsive-menu .dropdown.menu > li.is-dropdown-submenu-parent > a { padding-right: 0; }
    .responsive-menu .dropdown.menu > li.is-dropdown-submenu-parent > a:after { 
        border: inset 5px; border-top-style: solid; border-color: #000000 transparent transparent; right: -1em; 
    }
    .responsive-menu .dropdown.menu > li.is-dropdown-submenu-parent > ul.first-sub { top: calc(100% + 5px); }
    /*--*/
    .dropdown.menu ul.is-dropdown-submenu { 
        border: none; background: none; min-width: 150px; min-width: calc(100% + 35px); z-index: 2;
        font-size: 16px; word-break: break-word;
    }
    .dropdown.menu ul.is-dropdown-submenu li:not(:last-child) { margin-bottom: 2px; }
    .dropdown.menu ul.is-dropdown-submenu li a { background: rgba(0, 0, 0, 1); padding: 10px 15px; color: #fff; }
    .dropdown.menu ul.is-dropdown-submenu li.is-dropdown-submenu-parent a { padding-right: 25px; }
    .dropdown.menu ul.is-dropdown-submenu li.opens-left a:after { left: auto; right: 10px; border: inset 4px; border-left-style: solid; border-color: transparent #fff transparent transparent; }
    .dropdown.menu ul.is-dropdown-submenu li.opens-right a:after { right: 10px; border: inset 4px; border-left-style: solid; border-color: transparent transparent transparent #fff; }
    .dropdown.menu ul.is-dropdown-submenu li a:hover,
    .dropdown.menu ul.is-dropdown-submenu li.active > a { background: #454645; }
    /*=================*/
    /*====== ... ======*/
    header.navibnw a { color: #fff; }
    header.navibnw .responsive-menu > .menu > li > a:before { background: #fff; }
    header.navibnw .responsive-menu .menu li a:focus,
    header.navibnw .responsive-menu .menu li a:hover { color: #fff; }
    header.navibnw .responsive-menu > .menu > li.active > a,
    header.navibnw .responsive-menu > .menu > li.is-active > a { color: #fff; }
    header.navibnw .responsive-menu .dropdown.menu > li.is-dropdown-submenu-parent > a:after { border-color: #fff transparent transparent; 
    }
}
/*@media screen and (min-width: 640px) and (max-width: 850px) {*/
/*    a.logo { max-width: 8em; }*/
/*    .navi-wrap { margin: auto 0 auto 40px; }*/
/*    .responsive-menu > .menu > li { margin: 0 9px; }*/
/*    .responsive-menu > .menu > li > a { font-size: 16px; }*/
/*    .dropdown.menu ul.is-dropdown-submenu { font-size: 14px; }*/
/*}*/
@media screen and (max-width: 1023px) {
    .js-off-canvas-overlay { background: rgba(0, 0, 0, 0.25); }
    .no-js .navi-wrap.off-canvas { display: none; }
    .navi-wrap.off-canvas { 
        padding: 2.5em; padding-top: 8em; padding-right: 0; background: #fff; 
        -ms-transform: translateX(330px); -webkit-transform: translateX(330px); transform: translateX(330px);
    }
    .navi-wrap.off-canvas.is-open { 
        max-width: 330px; width: 100%;
        box-shadow: 0 0 10px rgba(10, 10, 10, 0.3); 
        -ms-transform: translate(0,0); -webkit-transform: translate(0,0); transform: translate(0,0);
    }
    .navi-wrap > div { height: 100%; padding-right: 2rem; overflow-y: auto; }
    /*=================*/
    /*====== ... ======*/
    header { padding: 20px 25px; }
    header > div.row { width: 100%; display: table; display: -ms-flexbox; display: flex; align-items: center; }
    .logo-wrap { 
        display: table-cell; vertical-align: middle; width: 50%; flex: 50%; 
    }
    .menuham-wrap { 
        display: table-cell; vertical-align: middle; width: 50%; flex: 50%; text-align: right; 
    }
    /*--*/
    /*- Hamburger -*/
    .menuham { position: relative; z-index: 14; transition: 0.3s; }
    .menuham:hover { opacity: 0.8; transform: scale(0.95); }
    /*--*/
    .menuham { cursor: pointer; outline: 0; }
    .menuham div {
        display: block; width: 25px; height: 2px; margin-bottom: 4px; background: #000; border-radius: 2px;
        -ms-transform-origin: 4px 1px; -webkit-transform-origin: 4px 1px; transform-origin: 4px 1px;
        -webkit-transition: transform 0.3s cubic-bezier(0.77,0.2,0.05,1.0), -webkit-transform 0.3s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease;
        transition: transform 0.3s cubic-bezier(0.77,0.2,0.05,1.0), -webkit-transform 0.3s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease;
    }
    .menuham div:nth-child(3) { margin: 0; }
    .menuham[aria-expanded="true"] div:first-child { -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
    .menuham[aria-expanded="true"] div:nth-child(2) { opacity: 0; -ms-transform: rotate(0deg) scale(0.2, 0.2); -webkit-transform:rotate(0deg) scale(0.2, 0.2); transform: rotate(0deg) scale(0.2, 0.2); }
    .menuham[aria-expanded="true"] div:nth-child(3) { -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
    /*--*/
    .responsive-menu > .menu > li > a { padding: 12px 10px; }
    .responsive-menu > .menu > li > a:before { 
        top: 50%; left: 0; 
        -ms-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); transform: translate(0,-50%);
    }
    .responsive-menu > .menu > li.has-submenu-toggle:hover > a:before { opacity: 1; visibility: visible; }
    /*--*/
    .responsive-menu .menu li { border-bottom: 1px solid #eaeaea; }
    .responsive-menu .menu li:last-child { border-bottom: none; }
    .responsive-menu .menu li a:not([href*=javascript]):hover { background: rgba(0, 0, 0, 0.05); padding-left: 15px; }
    .responsive-menu .menu li.has-submenu-toggle > a { border-right: 1px solid #eaeaea; }
    .submenu-toggle::after { border-color: #000 transparent transparent; }
    .submenu-toggle:hover,
    .submenu-toggle[aria-expanded="true"] { background: rgba(0, 0, 0, 0.05); }
    /*--*/
    .responsive-menu .is-accordion-submenu { font-size: 14px; padding-left: 25px; border-top: 1px solid #eaeaea; border-left: 1px solid #ccc; background: #f9f9f9; }
    .responsive-menu .is-accordion-submenu a { padding: 12px 0; line-height: 1.2; }
    .responsive-menu .is-accordion-submenu li.active > a { background: rgba(0, 0, 0, 0.05); }
    /*=================*/
    /*====== ... ======*/
    header.navibnw .menuham[aria-expanded="false"] div { background: #fff; }
}


/*=====================================================================*/
/* FOOTER */
/*=====================================================================*/
footer { 
    background: #000; padding: 5em 10px;
    font-size: 16px; color: #fff;
}
footer a { color: #fff; outline: 0; }
footer b.title { font-size: 18px; font-size: 17.99px; text-transform: uppercase; display: block; margin-bottom: 1.5em; }
footer ul { margin: 0; list-style: none; }
/*--*/
.copyright { max-width: 250px; }
.copyright img { 
    margin-bottom: 15px; 
    -webkit-backface-visibility: hidden; backface-visibility: hidden; 
}
/*--*/
footer .navi li + li { margin-top: 3px; }
footer .navi li a.btn-line:hover { color: #000; }
footer .navi li a.btn-line:before { background: #fff; }
footer .navi li.active a.btn-line:before { -webkit-transform: scale(1); transform: scale(1); }
/*--*/
footer .socialicon li { display: inline-block; }
footer .socialicon li + li { margin-left: 10px; }
footer .socialicon li a { 
    width: 1.8em; height: 1.8em; display: inline-block; background: #fff;
    font-size: 20px; color: #000; text-align: center; line-height: 1.9; vertical-align: middle; 
    -webkit-transform: none; transform: none;
    -webkit-transition: 0.3s; transition: 0.3s;
}
footer .socialicon li a:hover { -ms-transform: translateY(-3px); -webkit-transform: translateY(-3px); transform: translateY(-3px); }


@media screen and (min-width: 1024px) {
    .footleft { padding-right: 60px; }
    .footright { padding-left: 60px; }
}
@media screen and (max-width: 639px) {
    footer { padding: 3.5em 10px; font-size: 14px; }
    .footleft,
    .footright { margin-bottom: 2em; padding-bottom: 2em; border-bottom: 1px dotted #777; }
    footer b.title { font-size: 16px; }
    .copyright { max-width: inherit; }
    .copyright img { max-width: 160px; }
    footer .socialicon li a { font-size: 18px; font-size: 17.99px; }
}


/*=====================================================================*/
/* HOME */
/*=====================================================================*/
/*====================*/
/*====== Slider ======*/
.homeslider { background: #000 url(../js/slick/ajax-loader.gif) no-repeat center; position:relative; height: 640px; }
.homeslider.slick-initialized { background: #000; height: auto; }
.homeslider .home_slide { display: none; }
.homeslider.slick-initialized .home_slide { display: block; }
.home_slide {
    position: relative; outline: 0; min-height: 630px; 
    background-size: cover; background-position: center; background-repeat: no-repeat;
}
.home_slide:before {
    content: ''; width: 100%; height: 100%; background: rgba(0,0,0,0.3);
    position: absolute; top: 0; left: 0;
}
/*--*/
.homeslider .slick-arrow { 
    width: 40px; height: 40px; right: 10px; z-index: 1; overflow: hidden;
    border: 1px dashed #777777; border-radius: 50%;
    -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
    -ms-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); transform: translate(0,-50%);
}
.homeslider .slick-arrow:before { 
    content: '\f105'; position: relative; right: 0; opacity: 1;
    font-family: fontawesome; font-size: 25px;
    -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
}
.homeslider .slick-prev { 
    left: inherit; top: 49%;
    -ms-transform: translate(0,-50%) rotate(180deg); -webkit-transform: translate(0,-50%) rotate(180deg); transform: translate(0,-50%) rotate(180deg); 
}
.homeslider .slick-next { top: 56%; }
.homeslider .slick-prev:not(.slick-disabled):hover::before,
.homeslider .slick-next:not(.slick-disabled):hover::before { right: -5px; }
.homeslider .slick-prev:not(.slick-disabled):active::before,
.homeslider .slick-next:not(.slick-disabled):active::before { right: -10px; }
.homeslider .slick-disabled { cursor: auto; }
.homeslider .slick-disabled:before { opacity: 0.5; }
/*--*/
.homeslide-desc {
    color: #fff; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
    max-width: 715px; margin: 330px 0 80px; 
}
.homeslide-desc h1, .homeslide-desc h2, .homeslide-desc h3,
.homeslide-desc h4, .homeslide-desc h5, .homeslide-desc h6 { color: #fff; }
.homeslide-desc .title { font-size: 50px; font-weight: 900; color: #fff; line-height: 1.1; letter-spacing: 0; text-transform: uppercase; }
.homeslide-desc .desc { font-size: 18px; font-size: 17.99px; }
.homeslide-desc .title + .desc { margin-top: 10px; }
/*===================================*/
/*====== Product Filter Search ======*/
.product-filter-wrap { position: relative; padding-bottom: 40px; background-color: #000; color: #fff; }
.product-filter-wrap:before {
    content: ''; position: absolute; bottom: 100%; left: 0; width: 100%; height: 80px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+1,1+21 */
    background-image: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 1%,rgba(0,0,0,1) 100%,rgba(0,0,0,1) 100%); 
    background-image: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 1%,rgba(0,0,0,1) 100%,rgba(0,0,0,1) 100%);
}
/*--*/
.nice-select {
    background: none; border: 3px solid #464646; border-radius: 0; margin-bottom: 10px; padding: 10px 20px; float: none;
    font-size: 18px; font-size: 17.99px; font-weight: 700; color: #000;
}
.nice-select:hover { border-color: #777; }
.nice-select.open { border-radius: 0; }
.nice-select.disabled { box-shadow: none; opacity: 0.7; }
.nice-select > span.current { white-space: normal; word-break: break-word; color: #fff; }
.nice-select > span.current.disabled { color: #777; }
.nice-select > span:after,
.nice-select.disabled > span:after { border-color: #777; }
.nice-select .nice-select-search-box { width: 100%; left: 0; border: none; box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2); z-index: 2; }
.nice-select.open .nice-select-search-box { z-index: 2; }
.nice-select input[type].nice-select-search { border: 3px solid rgba(0, 0, 0, 0.2); }
.nice-select.wide .list { width: 100%; left: 0 !important; border: none; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.13); overflow-y: auto; margin-top: 50px; z-index: 2; }
.nice-select .list::-webkit-scrollbar { width: 14px; height: 18px; }
.nice-select .list::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.15); height: 6px; border: 4px solid transparent; background-clip: padding-box;
    -webkit-border-radius: 7px;
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0), inset 1px 1px 0px rgba(0, 0, 0, 0);
}
.nice-select .list::-webkit-scrollbar-button { width: 0; height: 0; display: none; }
.nice-select .list::-webkit-scrollbar-corner { background-color: transparent; }
.nice-select .option { font-size: 16px; }
.nice-select .option:hover, 
.nice-select .option.focus, 
.nice-select .option.selected.focus { font-weight: inherit; }
.nice-select ul.list li.option.disabled { opacity: 0.7; font-weight: 500; }
/*--*/
.product-filter-wrap select.select-filter { display: none; }
.product-filter-wrap .submit-wrap { margin-top: 28px; }
.product-filter-wrap .btn-solidbg { text-transform: none; vertical-align: middle; min-height: 46px; /*(for same height purpose)*/ }
.product-filter-wrap .btn-solidbg:after { background: #363636; }
.product-filter-wrap .btn-submit { padding: 0.6em; min-width: 46px; /*(bcz above declare height)*/ }
.btn-reset span { vertical-align: middle; }
.btn-reset span.small { font-size: 0.6em; margin-right: 10px; }
.product-filter-wrap .btn-reset { color: #999; }
.product-filter-wrap .btn-solidbg:hover,
.product-filter-wrap .btn-solidbg:focus { color: #fff; }
/*==========================*/
/*====== Home Product ======*/
.homeplist-wrap { padding-bottom: 30px; }
.viewallbtn-wrap { position: relative; }
.viewallbtn-wrap:before {
    content: ''; width: 100%; border-top: 1px solid #ebebeb;
    position: absolute; top: 50%; left: 0;
}
.viewallbtn-wrap .btn-viewall { position: relative; background: #fff; padding: 0 10px; }
/*==================================*/
/*====== Home Feature content ======*/
.featurecontent-wrap .desc { padding: 0 20px; }
.piaa_why { margin-top: 30px; margin-bottom: 100px; text-align: center; }
.piaa_mean span { color: #777; }


@media screen and (min-width: 1024px) {
    .featurecontent-wrap { padding-bottom: 100px; }
    .featurecontent-wrap .rightwrap .desc { padding-left: 4rem; padding-right: 1rem; }
    .featurecontent-wrap .rightwrap[class*=pull] .desc { padding-left: 1rem; padding-right: 4rem; }
}
@media screen and (max-width: 1023px) {
    .homeslide-desc { padding: 0 10px; padding-right: 45px; }
    /*--*/
    .product-filter-wrap { padding-left: 10px; padding-right: 10px; }
    /*--*/
    .homeplist-wrap .row { padding-left: 10px; padding-right: 10px; }
    /*--*/
    .featurecontent-wrap .img { padding-right: 50px; margin-bottom: 30px; }
}
@media screen and (max-width: 639px) {
    .home_slide { min-height: 535px; }
    .homeslide-desc { margin: 250px 0 50px; padding-right: 35px; max-width: 480px; }
    .homeslide-desc .title { font-size: 38px; }
    .homeslide-desc .desc { font-size: 16px; }
    .homeslider .slick-arrow { width: 35px; height: 35px; }
    /*--*/
    .product-filter-wrap:before { height: 50px; }
    .nice-select { margin-bottom: 5px; padding: 7px 15px; border-width: 2px; font-size: 16px; }
    .nice-select input[type].nice-select-search { border-width: 2px; }
    .nice-select.wide .list { margin-top: 45px; }
    .nice-select .option { font-size: 15px; }
    .product-filter-wrap .btn-solidbg { min-height: 41px; }
    .product-filter-wrap .btn-submit { min-width: 41px; }
    /*--*/
    .piaa_why { text-align: left; margin-bottom: 50px; }
}


/*=====================================================================*/
/* PRODUCT LISTING */
/*=====================================================================*/
/*==============================*/
/*====== Listing (common) ======*/
.plist-wrap ul { margin-bottom: 0; }
.plist-wrap ul li { list-style: none; margin-bottom: 4em; }
.plist-wrap ul li > a { position: relative; display: block; color: #000; }
/*--*/
.plistimg { position: relative; border: 1px solid #ebebeb; overflow: hidden; text-align: center; }
.plistimg .imgwrap:before {
    content: '\f002'; width: 2em; height: 2em; background: #000; 
    position: absolute; top: 50%; left: 50%; opacity: 0; visibility: hidden; z-index: 1; 
    font-family: fontawesome; font-size: 24px; color: #fff; text-align: center; line-height: 2em;
    -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
     -webkit-transition: 0.3s ease-out; transition: 0.3s ease-out;
}
.plistimg img { 
    -webkit-backface-visibility: hidden; backface-visibility: hidden;
    -webkit-transition: 0.3s ease-out; transition: 0.3s ease-out; 
}
.plistimg img.hover { 
    opacity: 0; visibility: hidden; 
    position: absolute; top: 50%; left: 50%;
    -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
}
.plistimg a.btn-border {
    position: absolute; right: 0; bottom: 0; left: 0; background: #fff;
    -webkit-backface-visibility: hidden; backface-visibility: hidden;
    -webkit-transform: translateY(103%); transform: translateY(103%);
    -webkit-transition: transform .3s ease, opacity .3s ease; transition: transform .3s ease, opacity .3s ease;
}
.plistimg a.btn-border:hover {
    -webkit-transition: color .45s cubic-bezier(.86,0,.07,1) 0s;
            transition: color .45s cubic-bezier(.86,0,.07,1) 0s;
}
.no-js .plistimg img.hover,
.no-js .plistimg a.btn-border { display: none; transition: none; }
/*--*/
.plistdesc { margin-top: 20px; }
.plistdesc .title { font-weight: 700; line-height: 1.2; }
.plistdesc .title a { color: #000; }
.plistdesc .price { font-size: 20px; font-weight: 900; color: #405878; text-transform: uppercase; margin-top: 30px; }
/*--*/
.plistproduct:hover .plistimg .imgwrap:before { opacity: 1; visibility: visible; }
.plistproduct:hover a.btn-border { -webkit-transform: translateY(0); transform: translateY(0); }
.plistproduct:hover .hoverimg.plistimg { background: #efefef; }
.plistproduct:hover .hoverimg img:first-child { opacity: 0; visibility: hidden; }
.plistproduct:hover .hoverimg img.hover { 
    opacity: 1; visibility: visible;    
    -ms-transform: translate(-50%,-50%) scale(0.85); -webkit-transform: translate(-50%,-50%) scale(0.85); transform: translate(-50%,-50%) scale(0.85);
}
/*============================*/
/*====== Listing (page) ======*/
.plist_leftcontentcon { background: #fff; }
.plist_leftcontent ul li a { color: #000; }
.plist_leftcontent .menu li a:hover,
.plist_leftcontent .menu li a:hover::before { background: #ebebeb; color: #000; }
.plist_leftcontent .menu .is-active > a { background: none; color: #000; }
.plist_leftcontent .separate-toggle li.active > span a,
.plist_leftcontent .menu li.active > a,
.plist_leftcontent .menu li.active > a:before { background: #000; color: #fff; }
/*--*/
.plist_leftcontent > ul { border-top: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb; }
.plist_leftcontent > ul > li:not(:last-child) { border-bottom: 1px solid #ebebeb; }
.plist_leftcontent > ul > li > a,
.plist_leftcontent li a[class*=title] { 
    font-size: 20px; font-weight: 900; line-height: 1.2; text-transform: uppercase; 
    padding: 15px 35px; width: 100%; flex: 100%; 
}
.plist_leftcontent li a.accordion-title { border: none; padding-right: 60px; }
.plist_leftcontent li a.accordion-title::before { right: 1.5em; margin-top: -0.5em; }
/*--*/
.plist_leftcontent > .separate-toggle > li { 
    width: 100%; display: block;
    display: -ms-flexbox; display: flex; flex-wrap: wrap;
}
.plist_leftcontent > .separate-toggle > li > span { 
    border-right: 1px solid #ebebeb; display: inline-block; vertical-align: middle; 
    width: 80%; flex: 80%;
}
.plist_leftcontent > .separate-toggle > li > span + a.accordion-title { 
    padding: 0; display: inline-block; vertical-align: middle; 
    width: 17%; flex: 20%;
}
.plist_leftcontent > .separate-toggle > li > span + a.accordion-title:before { 
    right: inherit; left: 50%; margin: 0; width: 40px; line-height: 40px; text-align: center;
    -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
}
/*--*/
.plist_leftcontent .accordion-content { 
    border: none; /*border-top: 1px solid rgb(235, 235, 235);*/ padding: 0px 35px 20px; background: none; color: #000; 
    width: 100%; flex: 100%;
}
.plist_leftcontent .accordion-content li a { font-weight: 700; padding: 8px 12px; }
/*--*/
/*- pagination -*/
.pagination { margin-top: 50px; margin-bottom: 70px; text-align: center; font-size: 0; letter-spacing: 0; }
.pagination li { 
    width: 2.9em; height: 3.3em; display: inline-block; margin: 0; margin-top: -1px; margin-left: -1px; border: 1px solid #ddd; 
    font-size: 16px; font-weight: 700; vertical-align: middle; line-height: 3.3;
}
.pagination li > a { color: #000; padding: 0; }
.pagination li > a:hover { color: #000; background: #ebebeb; }
.pagination .current { color: #000; background: #ebebeb; padding: 0; }
.pagination .disabled { cursor: default; padding: 0; }


@media screen and (min-width: 640px) {
    .plistcon { display: table; width: 100%; border-collapse: collapse; max-width: 80rem; }
    /*--*/
    .plist_leftcontentcon { display: table-cell; vertical-align: top; width: 300px; }
    .plist_leftcontent { padding: 80px 0; overflow-x: hidden; overflow-y: auto; height: 100vh; }
    .plist_leftcontent::-webkit-scrollbar { width: 14px; height: 18px; }
    .plist_leftcontent::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0.15); height: 6px; border: 4px solid transparent; background-clip: padding-box;
        -webkit-border-radius: 7px;
        -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0), inset 1px 1px 0px rgba(0, 0, 0, 0);
    }
    .plist_leftcontent::-webkit-scrollbar-button { width: 0; height: 0; display: none; }
    .plist_leftcontent::-webkit-scrollbar-corner { background-color: transparent; }
    /*--*/
    .plist_rightcontentcon { display: table-cell; vertical-align: top; }
    .plist_rightcontent { padding: 80px 40px 30px; }
}
@media screen and (min-width: 1024px) {
    .plistdesc { max-width: 90%; }
}
@media screen and (min-width: 1300px) {
    .plist_rightcontent { padding-left: 50px; }
}
@media screen and (max-width: 900px) {
    .plist_leftcontentcon { width: 200px; }
    /*--*/
    .plist_leftcontent > ul > li > a, 
    .plist_leftcontent li a[class*=title] { padding: 15px 20px; font-size: 18px; font-size: 17.99px;}
    .plist_leftcontent > .separate-toggle > li > span + a.accordion-title { width: 16%; }
    .plist_leftcontent .accordion-content { padding: 0px 30px 20px; }
}
@media screen and (max-width: 639px) {
    .plist-wrap ul li { margin-bottom: 3em; }
    .plistdesc { margin-top: 12px; }
    .plistdesc .price { font-size: 18px; font-size: 17.99px; margin-top: 20px; }
    /*--*/
    .plist_leftcontentcon { display: table-footer-group; }
    /*--*/
    .plist_rightcontentcon { display: table-header-group; } 
    .plist_rightcontent { padding: 50px 20px 30px; } 
    /*--*/
    .pagination { margin-top: 10px; margin-bottom: 60px; }
    .pagination li { font-size: 14px; }
}
@media screen and (max-width: 350px) {
    .plist-wrap .small-up-2 > .column { width: 100%; }
}


/*=====================================================================*/
/* PRODUCT DETAIL */
/*=====================================================================*/
/*========================*/
/*====== BREADCRUMB ======*/
.breadcrumb-wrap { background: #ebebeb; padding: 1.2em 10px; font-size: 14px; color: #999; }
.breadcrumb-wrap ul { margin: 0; }
.breadcrumb-wrap li { display: inline-block; float: left; }
.breadcrumb-wrap li:not(:last-child):after { content: '\f105'; font-family: fontawesome; padding: 0 10px; }
.breadcrumb-wrap li a { color: #999; }
.breadcrumb-wrap li a:hover { color: #000; }
.breadcrumb-wrap li.active { font-weight: 700; color: #000 }
/*=================*/
/*====== ... ======*/
.pdetail-wrap { padding-top: 60px; padding-left: 10px; padding-right: 10px; }
/*=================*/
/*====== ... ======*/
.pdetailslider { background: url(../js/slick/ajax-loader.gif) no-repeat center; height: 500px; overflow: hidden; }
.pdetailslider.slick-initialized { background: #fff; height: auto; }
.pdetailslider .pdetail_slide { display: none; }
.pdetailslider.slick-initialized .pdetail_slide { display: inherit; }
.pdetail_slide { 
    outline: 0; position: relative; 
    white-space: nowrap; overflow: hidden; font-size: 0; text-align: center;
}
.pdetail_slide:before { content: ''; display: inline-block; width: 0px; height: 100%; vertical-align: middle; }
.pdetail_slide img { 
    margin: auto; 
    display: inline-block; vertical-align: middle; max-height: 100%;
}
.pdetail_slide .caption { display: none; }
/*--*/
.zoomimg { 
    width: 1.3em; height: 1.3em; background: rgba(0, 0, 0, 0.5); opacity: 0;
    font-size: 42px; font-weight: 100; color: #fff; text-align: center; line-height: 1.3;
    position: absolute; top: 50%; left: 50%; cursor: pointer;
    -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
    -webkit-transition: 0.3s ease-out; transition: 0.3s ease-out;
}
.zoomimg:before { content: '+'; }
.pdetailslider:hover .zoomimg:hover,
.pdetailslider:hover .zoomimg:focus { background: rgba(0, 0, 0, 1); color: #fff; }
.pdetailslider:hover .zoomimg { background: rgba(0, 0, 0, 0.5); opacity: 1; }
/*--*/
.pdetailslider .slick-arrow { 
    width: 40px; height: 40px; background: rgba(0, 0, 0, 0.3); z-index: 1; 
    -webkit-transition: background 0.3s ease, left 0.3s ease, right 0.3s ease; transition: background 0.3s ease, left 0.3s ease, right 0.3s ease; 
}
.pdetailslider .slick-arrow:before { content: '\f105'; font-family: fontawesome; font-size: 25px; opacity: 1; }
.pdetailslider .slick-prev { 
    left: -45px; 
    -ms-transform: translate(0,-50%) rotate(180deg); -webkit-transform: translate(0,-50%) rotate(180deg); transform: translate(0,-50%) rotate(180deg); 
}
.pdetailslider .slick-next { right: -45px; }
.pdetailslider .slick-prev:not(.slick-disabled):hover,
.pdetailslider .slick-next:not(.slick-disabled):hover { background: rgba(0, 0, 0, 1); }
.pdetailslider .slick-disabled { cursor: auto; opacity: 0.3; }
/*.pdetailslider .slick-disabled:before { opacity: 0.5; }*/
.pdetailslider:hover .slick-prev { left: 0; }
.pdetailslider:hover .slick-next { right: 0; }
/*=================*/
/*====== ... ======*/
.slick-no-slide .slick-track { transform: inherit !important; }
/*.slick-no-slide .slick-slide { float: none; display: inline-block !important; }*/
/*--*/
.pdetailthumb { background: url(../js/slick/ajax-loader.gif) no-repeat center; height: 50px; overflow: hidden; margin: 0; margin-top: 20px; }
.pdetailthumb.slick-initialized { background: inherit; height: auto; }
.pdetailthumb li { display: none; }
.pdetailthumb.slick-initialized li { display: inherit; }
.pdetailthumb .slick-list { margin: 0 -5px; }
.pdetailthumb .slick-track { margin: 0; }
.pdetailthumb li { 
    outline: 0; cursor: pointer; margin: 0 5px; height: 130px; border: 1px solid transparent;
    background-color: #fff; background-repeat: no-repeat; background-size: 100%; background-position: center;
}
.pdetailthumb li:hover { opacity: 0.6; }
.pdetailthumb li.slick-current { border: 1px solid #ebebeb; opacity: 1; }
/*--*/
.pdetailthumb .slick-arrow { 
    width: 30px; height: 100%; background: rgba(0, 0, 0, 0.3); z-index: 1; 
    -webkit-transition: background 0.3s ease, left 0.3s ease, right 0.3s ease; transition: background 0.3s ease, left 0.3s ease, right 0.3s ease; 
}
.pdetailthumb .slick-arrow:before { content: '\f105'; font-family: fontawesome; font-size: 20px; opacity: 1; }
.pdetailthumb .slick-prev { 
    left: -35px; 
    -ms-transform: translate(0,-50%) rotate(180deg); -webkit-transform: translate(0,-50%) rotate(180deg); transform: translate(0,-50%) rotate(180deg); 
}
.pdetailthumb .slick-next { right: -35px; }
.pdetailthumb .slick-prev:not(.slick-disabled):hover,
.pdetailthumb .slick-next:not(.slick-disabled):hover { background: rgba(0, 0, 0, 0.6); }
.pdetailthumb .slick-disabled { cursor: auto; display: none !important; }
.pdetailthumb .slick-disabled:before { opacity: 0.5; }
.pdetailthumb:hover .slick-prev { left: 0; }
.pdetailthumb:hover .slick-next { right: 0; }
/*=================*/
/*====== ... ======*/
.pswp__bg { background: rgba(0,0,0,0.8); }
.pswp__button { color: #fff; opacity: 0.4 !important; -webkit-transition: opacity .25s; transition: opacity .25s; }
.pswp__button:hover { opacity: 1 !important; }
.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before { background: none !important; width: 1em; height: 1em; font-family: fontawesome; font-size: 35px; }
.pswp__button--arrow--left:before { content: '\f104'; }
.pswp__button--arrow--right:before { content: '\f105'; }
/*=================*/
/*====== ... ======*/
/*.pdetaildesc { font-size: 16px; }*/
.pdetaildesc .title { font-size: 40px; font-weight: 900; text-transform: uppercase; line-height: 1.1; }
.pdetaildesc .price { font-size: 30px; font-weight: 900; color: #405878; text-transform: uppercase; margin-top: 50px; }
.pdetaildesc .desc { margin-top: 20px; }
.pdetaildesc .desc ul li,
.pdetaildesc .desc ol li { margin-bottom: 1em; }
.pdetaildesc .detail { margin-top: 10px; }
.pdetaildesc .detail ul { margin: 0; list-style: none; }
.pdetaildesc .btn-border.linkoutbtn { margin-top: 30px; max-width: 240px; width: 100%; }
/*=================*/
/*====== ... ======*/
.pdetailtab-wrap { padding-top: 10px; padding-left: 10px; padding-right: 10px; }
.pdetailtab > ul li a { 
    font-size: 20px; font-weight: 900; color: #999; text-transform: uppercase; 
    background: #ebebeb; outline: 0; word-break: break-word;
    -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
}
.pdetailtab > ul li a[aria-selected="true"] { background: #fff; color: #000; }
/*--*/
.pdetailtab .tabs { border: none; background: none; }
.pdetailtab .tabs a { padding: 0.9em 2.2em; }
.pdetailtab .tabs a:hover:not([aria-selected="true"]), 
.pdetailtab .tabs a:focus:not([aria-selected="true"]) { background: #ebebeb; color: #999; padding-bottom: 30px; margin-top: -30px; }
/*--*/
.pdetailtab .tabs-content { border: none; background: #fff; /*font-size: 16px;*/ color: #000; }
.pdetailtab .tabs-panel { padding: 50px 40px; }
.pdetailtab .tabs-panel b { font-size: 18px; font-size: 17.99px; }
.pdetailtab .tabs-panel ul li,
.pdetailtab .tabs-panel ol li { margin-bottom: 1em; }
/*--*/
.pdetailtab .accordion { background: none; }
.pdetailtab .accordion a.accordion-title { padding: 0.9em 1.5em; padding-right: 2em; border: none; color: #000; }
.pdetailtab .accordion a[aria-selected="true"] { background: #ebebeb; }
/*--*/
.pdetailtab .accordion-content { border: none; border-top: 1px solid #ebebeb; background: #fff; padding: 40px 30px; /*font-size: 16px;*/ color: #000; }
.pdetailtab .accordion-content b { font-size: 18px; font-size: 17.99px; }
.pdetailtab .accordion-content ul li,
.pdetailtab .accordion-content ol li { margin-bottom: 1em; }
/*=================*/
/*====== ... ======*/
.prelated-wrap { padding-left: 10px; padding-right: 10px; }
.prelated-wrap .btn-reset { 
    margin-bottom: 40px; float: right; max-width: 150px; width: 100%; border-width: 2px;
    font-size: 14px; font-weight: 700; text-transform: none;
}
/*--*/
ul.prelatedslider { background: url(../js/slick/ajax-loader.gif) no-repeat center; height: 500px; }
ul.prelatedslider.slick-initialized { background: inherit; height: auto; }
ul.prelatedslider li { display: none; }
ul.prelatedslider.slick-initialized li { display: inherit; }
ul.prelatedslider li { margin-bottom: 30px; }
/*--*/
ul.prelatedslider .slick-arrow { 
    width: 40px; height: 40px; background: rgba(0, 0, 0, 0.3); z-index: 1; top: 45%;
    -webkit-transition: background 0.3s ease, left 0.3s ease, right 0.3s ease; transition: background 0.3s ease, left 0.3s ease, right 0.3s ease; 
}
ul.prelatedslider .slick-arrow:before { content: '\f105'; font-family: fontawesome; font-size: 25px; opacity: 1; }
ul.prelatedslider .slick-prev { 
    left: 0;
    -ms-transform: translate(0,-50%) rotate(180deg); -webkit-transform: translate(0,-50%) rotate(180deg); transform: translate(0,-50%) rotate(180deg); 
}
ul.prelatedslider .slick-next { right: 0; }
ul.prelatedslider .slick-prev:not(.slick-disabled):hover,
ul.prelatedslider .slick-next:not(.slick-disabled):hover { background: rgba(0, 0, 0, 1); }
ul.prelatedslider .slick-disabled { cursor: auto; opacity: 0.3; }


@media screen and (min-width: 1024px) {
    .pdetailtab .tabs { display: table; }
    .pdetailtab .tabs li { display: table-cell; vertical-align: bottom; float: none; }
}
@media screen and (min-width: 640px) {
    .pdetail_left-wrap { padding-right: 20px; }
    .pdetail_right-wrap { padding-left: 10px; }
}
@media screen and (max-width: 639px) {
    .pdetail-wrap { padding-top: 40px; }
    .pdetail_right-wrap { margin-top: 30px; }
    /*--*/
    .zoomimg { font-size: 32px; }
    .pdetailslider .slick-arrow { width: 30px; height: 30px; }
    .pdetailslider .slick-arrow:before { font-size: 20px; }
    /*--*/
    /*.pdetaildesc { font-size: 15px; }*/
    .pdetaildesc .title { font-size: 30px; }
    .pdetaildesc .price { font-size: 25px; margin-top: 40px; }
    .pdetaildesc .desc { margin-top: 10px; }
    .pdetaildesc .detail { margin-top: 5px; }
    .pdetaildesc .btn-border.linkoutbtn { margin-top: 20px; max-width: 210px; }
    /*--*/
    .pdetailtab > ul li a { font-size: 18px; font-size: 17.99px; }
    /*.pdetailtab .tabs-content,
    .pdetailtab .accordion-content { font-size: 15px; }*/
    /*.pdetailtab .tabs-panel b,
    .pdetailtab .accordion-content b { font-size: 16px; }*/
    .pdetailtab .accordion-content { padding: 30px 25px; }
    /*--*/
    .prelated-wrap .btn-reset { float: none; margin-bottom: 30px; }
}


/*=====================================================================*/
/* CONTACT */
/*=====================================================================*/
.contact-wrap { padding-left: 10px; padding-right: 10px; }
/*=================*/
/*====== ... ======*/
.contactinfo-wrap ul { 
    margin: 0 0 20px 0; list-style: none; 
    font-size: 30px; font-weight: 900;
}
.contactinfo-wrap li { margin-bottom: 10px; table-layout: inherit; }
.contactinfo-wrap li a { color: #000; display: block; }
.contactinfo-wrap li a:hover { text-decoration: underline; }
.contactinfo-wrap li .icon,
.contactinfo-wrap li .icon i { width: 2em; line-height: 2; /*font-size: 1.1em;*/ }
.contactinfo-wrap li .icon i {
    height: 2em; background: #000; 
    color: #fff; text-align: center; 
}
.contactinfo-wrap li .text { padding-left: 20px; }
/*=================*/
/*====== ... ======*/
.contactform-wrap { background: #fff; padding: 40px 35px; }
/*--*/
/*- effect label -*/
.effectt + label.label-tag { 
    background: #000; padding: 10px 15px; 
    position: absolute; top: 0px; left: 0; opacity: 0; visibility: hidden;
    font-size: 16px; color: #fff;
    -ms-transform: translate(0,0); -webkit-transform: translate(0,0); transform: translate(0,0);
    transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}
.effectt:focus + label.label-tag, 
.effectt:active + label.label-tag { 
    opacity: 1; visibility: visible;
    -ms-transform: translate(0,-100%); -webkit-transform: translate(0,-100%); transform: translate(0,-100%); 
}
/*--*/
.contactform-wrap .btn-solidbg { max-width: 300px; width: 100%; }


@media screen and (min-width: 640px) {
    .contactinfo-wrap { padding-right: 20px; }
}
@media screen and (max-width: 800px) {
    .contactform-wrap { padding: 30px 25px; }
    .contactinfo-wrap ul { font-size: 25px; }
}
@media screen and (max-width: 639px) {
    .contactform-wrap { margin-bottom: 50px; }
}

/*- guarantee 15-Oct-2021 -*/
.content-wrap .content p { font-size: 18px; }
.content-wrap ul.content-listing { margin-top: 2rem; }
.content-wrap ul.content-listing li { list-style-type: auto; margin: 0 0 1rem; }
.content-wrap ul.content-listing li p { font-size: 20px; font-weight: 700; margin: 0; }
.content-wrap ul.content-listing li ul { margin: 0 0 0 15px; }
.content-wrap ul.content-listing li ul li { list-style-type: none; }
.content-wrap ul.content-listing li ul li p { font-size: 18px; font-weight: 500; }
.content-wrap .content-part-2 { background-color: #ededed; margin: 3rem 0 0; padding: 15px; }
.content-wrap .content-part-2 p a { font-weight: 700; text-decoration: underline; }

/*=================*/
/*====== ... ======*/
.video-frame-bottom { padding: 10px 0 90px; }
.video-frame { padding: 90px 0; }
.video-frame-top { padding: 90px 0 10px; }
.item-categories .items { background-position: center; background-repeat: no-repeat; background-size: cover; min-height: 500px; position: relative; }
.item-categories .items:before { background-color: #0000004a; content: ""; height: 100%; left: 0; position: absolute; width: 100%; }
.item-categories .items .items-title { margin: 180px 0 60px; position: relative; }
.item-categories .items .items-title h1 { color: #ffffff; font-size: 50px; }

@media screen and (max-width: 991px) {
    .item-categories .items { min-height: 300px; }
    .item-categories .items .items-title { margin: 100px 0 60px; }
    .item-categories .items .items-title h1 { font-size: 40px; }
    .item-categories .items .items-title .btn-viewall { font-size: 20px; }
}


/*=================*/
/* 24 March 2023 */
/*====== ... ======*/
.installation .thumbnail { cursor: pointer; width: 100%; }
.installation .thumbnail .bg-image { background-position: center; background-repeat: no-repeat; background-size: cover; height: 300px; margin: auto auto 15px; position: relative; }
.installation .thumbnail .bg-image:after { background: #000000; content: ''; height: 100%; left: 0; opacity: 0; position: absolute; right: 0; transition: 0.3s; width: 100%; }
.installation .thumbnail:hover .bg-image:after { opacity: 0.5; }
.installation .thumbnail .bg-image:before { background: #ffffff; content: ''; height: 30px; left: 0; margin: auto; right: 0; opacity: 0; position: absolute; top: 50%; transition: 0.2s; width: 30px; z-index: 1;
 mask-image: url('../images/play-alt.svg'); mask-position: center; mask-repeat: no-repeat; mask-size: contain; -webkit-mask-image: url('../images/play-alt.svg'); -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; -webkit-mask-size: contain; }
 .installation .thumbnail:hover .bg-image:before { opacity: 1; }
.installation .thumbnail h4 { margin: auto auto 10px; padding: 0 15px; text-align: center; }
#installation1, #installation2, #installation3, #installation4, #installation5, #installation6 { padding: 2em 1.5em 2.5em; }
#installation1 h4, #installation2 h4, #installation3 h4, #installation4 h4, #installation5 h4, #installation6 h4 { margin: auto auto 15px; }


/*=================*/
/* 07 June 2023 */
/*====== ... ======*/
.clients-review .title { margin: 0 0 2rem; text-align: center; }
.clients-review .title h4 { color: #cccccc; margin: auto auto 10px; text-transform: uppercase; }
.clients-review .title h1 { text-transform: uppercase; }
.clients-review .review-slider .item { position: relative; border: 1px solid #ebebeb; overflow: hidden; text-align: center; }
.clients-review .review-slider .plistproduct { margin: 10px; -webkit-box-shadow: 0px 5px 5px 0px rgba(212,212,212,1); -moz-box-shadow: 0px 5px 5px 0px rgba(212,212,212,1); box-shadow: 0px 5px 5px 0px rgba(212,212,212,1); }
.clients-review .review-slider .plistproduct .review-desc { padding: 15px; min-height: 190px; text-align: center; }
.clients-review .review-slider .plistproduct .review-desc img { margin: auto auto 5px; }
.clients-review .review-slider .plistproduct .review-desc .platform-user { font-weight: 800; margin: 0 0 5px; }
.clients-review .review-slider .plistproduct .review-desc .platform-user.shopee { color: #F53D2D; }
.clients-review .review-slider .plistproduct .review-desc .platform-user.lazada { color: #0F136D; }
.clients-review .review-slider .plistproduct .review-desc p { font-size: 16px; }
.clients-review .review-slider .slick-arrow { border-radius: 50%; border: 1px dashed #000000; height: 60px; overflow: hidden; right: 10px; width: 60px; z-index: 1; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; -ms-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); transform: translate(0,-50%); }
.clients-review .review-slider .slick-arrow:before { color: #000000; content: '\f105'; font-family: fontawesome; font-size: 30px; opacity: 1; position: relative; right: 0; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.clients-review .review-slider .slick-arrow.slick-prev { left: -70px; -ms-transform: translate(0,-50%) rotate(180deg); -webkit-transform: translate(0,-50%) rotate(180deg); transform: translate(0,-50%) rotate(180deg); }
.clients-review .review-slider .slick-arrow.slick-next { right: -70px; }

@media screen and (max-width: 1023px) {
    .video-frame-bottom, .video-frame-top { text-align: center; }
    .video-frame-bottom iframe, .video-frame-top iframe { height: 400px; margin: auto; width: 80%; }
}

@media screen and (max-width: 765px) {
    .clients-review .review-slider .slick-arrow.slick-prev { left: 10px; }
    .clients-review .review-slider .slick-arrow.slick-next { right: 10px; }
    .clients-review .review-slider .slick-arrow { background-color: #ffffff; }

    .video-frame-bottom iframe, .video-frame-top iframe { height: 250px; width: 100%; }
    .home_slide.other_slide { min-height: 350px; }
    .home_slide.other_slide .homeslide-desc { margin: 140px 0 50px; }

    .item-categories .items { min-height: 220px; }
    .item-categories .items .items-title { margin: 70px 0 40px; }
}



/*=================*/
/* 14 July 2023 */
/*====== ... ======*/
/* Official Distributor */
.official { background-color: #ffffff; font-size: 14px; padding: 4px; text-align: center; }

/* Header */
header.navibnw { top: 3%; }
header { box-shadow: 0px 9px 10px rgba(0, 0, 0, 0.1); }
.official p { font-weight: 600; text-transform: uppercase; }

@media screen and (max-width: 765px) {
    .official { font-size: 10px; }
}