/*
Theme Name: Ninja
Author: Locus-T
Author URI: http://www.locus-t.com.my/
Description: Ninja theme is awesome. That's all you need to know.
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: grid-layout, footer-widgets, education, entertainment, food-and-drink, news, photography, portfolio, e-commerce
*/

/* Global
----------------------------------------------- */
body { font-family: 'Open Sans', sans-serif; line-height: 1.6; font-size: 15px; max-width: 1920px; margin: 0 auto; color: #191919; }
a { color: #333; text-decoration: none; cursor: pointer; transition: all 0.3s; }
a i { pointer-events: none; }
a:hover, a:focus { color: #DADADA; text-decoration: none; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { margin-top: 0; }
h1, .h1 { font-size: 2.4em; }
h2, .h2 { font-size: 2em; }
h3, .h3 { font-size: 1.6em; }
h4, .h4 { font-size: 1.2em; }
h5, .h5 { font-size: 1em; }
h6, .h6 { font-size: 12px; }
img { height: auto; max-width: 100%; }
button, input, select, textarea { font-size: 100%; margin: 0;
    vertical-align: baseline; /* Improves appearance and consistency in all browsers */
    *vertical-align: middle; /* Improves appearance and consistency in all browsers */
}
input[type="checkbox"], input[type="radio"] { padding: 0; }
input[type="search"] { -webkit-appearance: textfield; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
label.screen-reader-text { display: none; }
input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="password"], input[type="search"], textarea, select {
    color: #666; border: 1px solid #E8E8E8; border-radius: 3px; padding: 5px;
}
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, textarea:focus, select:focus {
    color: #111;
}
iframe { max-width: 100%; }
textarea { overflow: auto; vertical-align: top; width: 100%; }
.wpcf7-form input:not([type="submit"]):not([type="reset"]), .wpcf7-form textarea, .wpcf7-form select { width: 100%; margin-bottom: 10px; }

/* Alignment
----------------------------------------------- */
.alignleft { display: inline; float: left; }
.alignright { display: inline; float: right; }
.aligncenter { clear: both; display: block; margin: 0 auto; }

/* Search - Search form & Search Page
----------------------------------------------- */
.search-form { border: none; background: #fff; padding-left: 10px; margin-bottom: 15px; width: 275px; float: right; }
.search-submit { background: #fff url('images/search.jpg') center no-repeat; color: transparent; border: none; padding: 5px 16px; margin: 5px; }
.header-middle .search-field { background: none; border: none; }

.search-results-list article { box-shadow: 0px 5px 5px 0px rgba(50, 50, 50, 0.31); padding: 15px; margin-bottom: 15px; }
.search-results-list article .page-header { border-bottom: 0; margin: 0; padding-bottom: 0; }

/* Background Colours
----------------------------------------------- */
.bg-light-grey { background-color: #E1E1E1; }
.bg-dark-grey { background-color: #191919; color: #fff; }
.bg-black { background-color: #000; color: #fff; }
.bg-white { background-color: #fff; }

.bg-dark-grey a, .bg-black a { color: inherit; }

/* Full-width 50-50 content
----------------------------------------------- */
.nfluid-wrapper { position: relative; }
.nxposition { position: initial; }

/* Full-width Layout
----------------------------------------------- */
.container-fluid, .container-fluid > .row > [class*='col-'], .container-fluid.main-content-area, .container-fluid.main-content-area > .row > .main-content-inner { 
	padding-left: 0; padding-right: 0; 
}
.container-fluid > .row { margin: 0; }
.container-fluid.main-content-area > .row { margin: auto; }

/* Archive Sidebar
----------------------------------------------- */
.sidebar { margin-bottom: 15px; }
.sidebar aside { background-color: #f3f3f3; padding-bottom: 15px; }
.widget_archive select { width: calc(100% - 10px * 2); margin: 10px auto 0; display: block; outline: 0!important; }
.widget_archive h3 { background-color: #000; color: #fff; padding: 5px 15px; text-transform: uppercase; font-size: 24px; }

/* Archive Post Listing
----------------------------------------------- */
.post-listing { padding: 0; list-style-type: none; }
.post-listing li { overflow: hidden; margin: 0 0 20px; border: 5px solid #f3f3f3; padding: 15px; }
.post-listing .featured-img { float: left; margin-right: 10px; }

/* Buttons
----------------------------------------------- */
.btn.btn-default { background-color: #0c4ea0; border-color: #0c4ea0; color: #fff; font-size: 14px; padding: 5px 20px; 
	margin-top: 15px; transition: all 0.3s ease 0s;
}
.btn.btn-default:hover { color: #0c4ea0; border-color: currentColor; background-color: transparent; }

/* Spacing
----------------------------------------------- */
.np15 { padding: 15px; }
.np30 { padding: 30px; }
.np45 { padding: 45px; }

.nm15 { margin: 15px; }
.nm30 { margin: 30px; }
.nm45 { margin: 45px; }

.nvp15 { padding-top: 15px; padding-bottom: 15px; }
.nvp30 { padding-top: 30px; padding-bottom: 30px; }
.nvp45 { padding-top: 45px; padding-bottom: 45px; }

.nvm15 { margin-top: 15px; margin-bottom: 15px; }
.nvm30 { margin-top: 30px; margin-bottom: 30px }
.nvm45 { margin-top: 45px; margin-bottom: 45px }

.nhp15 { padding-left: 15px; padding-right: 15px; }
.nhp30 { padding-left: 30px; padding-right: 30px; }
.nhp45 { padding-left: 45px; padding-right: 45px; }

.nhm15 { margin-left: 15px; margin-right: 15px; }
.nhm30 { margin-left: 30px; margin-right: 30px; }
.nhm45 { margin-left: 45px; margin-right: 45px; }

.nxp { padding: 0; }
.nxvp { padding-top: 0; padding-bottom: 0; }
.nxhp { padding-left: 0; padding-right: 0; }

.nxm { margin: 0; }
.nxvm { margin-top: 0; margin-bottom: 0; }
.nxhm { margin-left: 0; margin-right: 0; }

/* Flex
----------------------------------------------- */
.nflex { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; }
.nflex-center { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.nflex-bottom { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-align-items: flex-end; align-items: flex-end; -webkit-justify-content: flex-end; justify-content: flex-end; }
.nflex-top { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-justify-content: flex-start; justify-content: flex-start; }

/* Float items when flex it */
.nmla { margin-left: auto; }
.nmra { margin-right: auto; }

/* List
----------------------------------------------- */
ul, li { margin-bottom: 10px; }
ul ul, ol ol, ul ol, ol ul { padding-left: 20px; }

.ninline-col-4 { -webkit-column-count: 4; -moz-column-count: 4; column-count: 4; }
.ninline-col-3 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; }
.ninline-col-2 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; }
.ninline-col-1 { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; }
[class*='ninline-col'] { -webkit-column-gap: 40px; column-gap: 40px; }
[class*='ninline-col'] li { -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; -moz-page-break-inside: avoid; page-break-inside: avoid; break-inside: avoid-column; }

ul.menu { list-style: none; padding-left: 0; margin-bottom: 0; }

/* Header
----------------------------------------------- */
.header-middle > .container { padding-top: 15px; padding-bottom: 15px; }

/* Header Navigation
----------------------------------------------- */
.navbar-collapse { clear: both; float: right; padding-left: 0; padding-right: 0; }
ul#menu-primary li { display: block; position: relative; margin-bottom: 0; }
#menu-primary ul.sub-menu { display: none; z-index: 999; text-align: left; }
ul#menu-primary li:last-child { margin-right: 0; }
ul#menu-primary li a { padding: 10px 20px; display: block; }
ul#menu-primary li a:hover { color: #000; }
.dropdown-menu { padding: 0!important; border: 0!important; border-radius: 0; }
ul.sub-menu { position: absolute; top: 40px; left: 0; padding: 0 5px; background: #000; }
ul#menu-primary ul.sub-menu li a { padding: 5px; }
ul#menu-primary ul.sub-menu li a:hover { color: #fff; }
ul.nav li.dropdown:hover > ul.dropdown-menu { display: block; }
ul.nav li.dropdown:hover > ul.dropdown-menu ul.dropdown-menu { margin-left: 160px; margin-top: -40px; }

/* Thank You Page
----------------------------------------------- */
.ninja-tq-icon { font-size: 40px; color: #fff; margin-bottom: 30px; background-color: #ee1b24; padding: 30px; border-radius: 50%; border: 5px solid #fff; box-shadow: 7px 7px 24px 0px rgba(50, 50, 50, 0.41); }

/* Coming Soon Page
----------------------------------------------- */
.ninja-comingsoon-icon { font-size: 40px; color: #fff; margin-bottom: 30px; background-color: #ee1b24; padding: 30px; border-radius: 50%; border: 5px solid #fff; box-shadow: 7px 7px 24px 0px rgba(50, 50, 50, 0.41); }
.ninja-thank-you > .row { height: 100vh; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
.countdown { position: relative; margin: auto; height: 40px; width: 40px; text-align: center; }
.countdown-number { color: #000; display: inline-block; line-height: 38px; }
.ninja-thank-you svg { position: absolute; top: 0; right: 0; width: 40px; height: 40px; transform: rotateY(-180deg) rotateZ(-90deg); -webkit-transform: rotateY(-180deg) rotateZ(-90deg); }
.ninja-thank-you svg circle { stroke-dasharray: 113px; stroke-dashoffset: 0px; stroke-linecap: round; stroke-width: 2px; stroke: black; fill: none; animation: countdown 10s linear forwards; -webkit-animation: countdown 10s linear forwards; }
@-webkit-keyframes countdown {
    from { stroke-dashoffset: 0px; }
    to { stroke-dashoffset: 113px; }
}
@keyframes countdown {
    from { stroke-dashoffset: 0px; }
    to { stroke-dashoffset: 113px; }
}

/* Parallax Elements - Periscope
----------------------------------------------- */
.nperiscope { background-position: center 0px; background-repeat: repeat-y; background-attachment: fixed; position: relative; }
.nperiscope.circle { border-radius: 50%; }
.nperiscope .nperiscope-tint { background-color: rgba(0, 0, 0, 0.5); color: #fff; position: absolute; top: 0; left: 0; right: 0; bottom: 0; text-align: center; opacity: 0; padding: 30px; transition: all 0.8s;
    display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
}
.nperiscope-content { transition: all 0.8s; }
.nperiscope.circle, .nperiscope.circle .nperiscope-tint { border-radius: 50%; }

/* Parallax Elements - Floating Elements
----------------------------------------------- */
.nfloating-box-list-wrapper { overflow: hidden; }
.nfloating-box-list { list-style: none; margin-bottom: 0; padding-left: 0; }

/* Parallax Elements - Landing Elements
----------------------------------------------- */
.nlanding-box-list { list-style: none; padding-left: 0; margin-bottom: 0; overflow: hidden; }
.nlanding-box-list .nbox { position: relative; opacity: 0; transform: translateX(30px); transition: all 0.4s ease-in-out; overflow: hidden; }
.nlanding-box-list.nalign-left .nbox { transform: translateX(-30px); }
.nlanding-box-list.nalign-top .nbox { transform: translateY(-30px); }
.nlanding-box-list.nalign-bottom .nbox { transform: translateY(30px); }
.nlanding-box-list .nbox.is-showing { opacity: 1; transform: translateX(0px); }
.nlanding-box-list.nalign-top .nbox.is-showing, .nlanding-box-list.nalign-bottom .nbox.is-showing {transform: translateY(0px); }

/* Misc
----------------------------------------------- */
p:empty { display: none; }
a.waze-app, a.whatsapp { display: none; }
.nboxes .ncaption { margin-bottom: 15px; }
.nboxes img { width: 100%; }
.page-featured-banner h1 { text-align: center; }
.fullpage-header { position: absolute; z-index: 1; color: #fff; }
#wc_category_accordion-2 .widgettitle { margin-bottom: 0; }

/* Fixed button float right*/
.nbtnfr { -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); position: fixed; transform-origin: right bottom; top: 20%; }

/* Footer
----------------------------------------------- */
#footer { background: #191919; padding-top: 15px; color: #fff; }
#footer .footer-inner { padding-top: 25px; padding-bottom: 25px; padding-left: 30px; padding-right: 30px; }
#footer .widgettitle { font-size: 14px; }
#footer .widgettitle:after { content: ""; background-color: #fff; width: 20px; height: 3px; display: block; margin-top: 15px; }
#footer ul { padding-left: 0; }
#colophon { background: #fff; color: initial; }
#copyright { text-align: center; padding: 10px 15px; }

/* Floating Widget
----------------------------------------------- */
#floating-widget { position: fixed; right: 0; top: 38%; z-index: 999; }

/* Scroll To Top
----------------------------------------------- */
.scroll-to-top { background: rgba(100, 100, 100, 0.4); color: #fff; bottom: 4%; cursor: pointer; display: none; position: fixed; right: 20px; z-index: 999; font-size: 16px;
    text-align: center; line-height: 40px; width: 40px; border-radius: 4px; transition: background-color 0.3s linear;
}
.scroll-to-top:hover { background: #222; opacity: .8; }

/* Social Menu
----------------------------------------------- */
.social-icons ul { margin-bottom: 0; }
.social-icons ul, .social-icons li { border: 0!important; list-style: none; padding-left: 0; }
.social-icons li { border: none; display: inline-block; margin: 0; }
.social-icons li a span { display: none; }
.social-icons li a { font-size: 18px; line-height: 37px; list-style: none; display: inline-block; text-align: center; height: 35px; width: 35px; margin-right: 5px; margin-bottom: 5px;
    border-radius: 50%; background-color: #fff; color: #000; transition: background-color 0.5s;
}
.social-icons li a[href*="facebook.com"] i:before { content: "\f09a"; }
.social-icons li a[href*="twitter.com"] i:before { content: "\f099"; }
.social-icons li a[href*="skype"] i:before { content: "\f17e"; }
.social-icons li a[href*="youtube.com"] i:before { content: "\f167"; }
.social-icons li a[href*="instagram.com"] i:before { content: "\f16d"; }
.social-icons li a[href*="flickr.com"] i:before { content: "\f16e"; }
.social-icons li a[href*="tumblr.com"] i:before { content: "\f173"; }
.social-icons li a[href*="pinterest.com"] i:before { content: "\f0d2"; }
.social-icons li a[href*="plus.google.com"] i:before { content: "\f0d5"; }
.social-icons li a[href*="linkedin.com"] i:before { content: "\f0e1"; }
.social-icons li a:hover { color: #fff!important; }
.social-icons li a[href*="facebook.com"]:hover { background-color: #4265b9; }
.social-icons li a[href*="twitter.com"]:hover { background-color: #55ACEE; }
.social-icons li a[href*="skype"]:hover { background-color: #0bbff2; }
.social-icons li a[href*="youtube.com"]:hover { background-color: #df3333; }
.social-icons li a[href*="instagram.com"]:hover { background-color: #F95B60; }
.social-icons li a[href*="flickr.com"]:hover { background-color: #ff0084; }
.social-icons li a[href*="tumblr.com"]:hover { background-color: #35506b; }
.social-icons li a[href*="pinterest.com"]:hover { background-color: #c31e26; }
.social-icons li a[href*="plus.google.com"]:hover { background-color: #d62408; }
.social-icons li a[href*="linkedin.com"]:hover { background-color: #005987; }

/* Responsive
----------------------------------------------- */
@media (min-width: 1200px) {
    .lg-center { text-align: center; }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .md-center { text-align: center; }
}
@media (min-width: 992px) {
    /* Make telephone numbers unclickable in desktop */
    a[href*='tel:'] { pointer-events: none; }
    /* Full-width 50-50 content */
    .nimg-wrapper { position: initial; }
    .nimg-container-right, .nimg-container-left { position: absolute; bottom: 0; top: 0; }
    .nimg-container-right { left: 50%; right: 0; }
    .nimg-container-left { left: 0; right: 50%; }
    .nimg-container-right img, .nimg-container-left img { object-fit: cover; width: 100%; height: 100%; }
    .nfluid-wrapper .row.nflex > [class*='col-'] { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; max-width: 50%; }
    .nfluid-wrapper .nflex-reverse { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-direction: row-reverse!important; flex-direction: row-reverse!important; }
}
@media (max-width: 991px) {
    .navbar-collapse.collapse { display: none !important; }
    .sidebar, .content-with-sidebar { float: none; width: 100%; }
    .search-form { display: none; }
    .nflex { display: block; }
    #logo img { width: auto; }
    a.waze-app, a.whatsapp { display: inline-block; }
    a.waze { display: none; }
    .nfloating-box-list .nbox { transform: none!important; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .sm-center { text-align: center; }
}
@media (max-width: 767px) {
    .xs-center { text-align: center; }
    .nimg-wrapper img { margin-bottom: 15px; } 
    .np45 { padding: 30px; }
}
@media (max-width: 480px) {
    #floating-widget { right: inherit; top: initial; bottom: 0; width: 100%; text-align: center; }
}