/*

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.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: 'Raleway', 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: blue; text-decoration: none; }

/* Link of the Awards page */

/* .heading-awards a:visited {
	color: blue;
} */

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: #000033; border-color: #0c4ea0; color: #fff; font-size: 14px; padding: 12px; 

	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; }

#menu-primary li { display: block; position: relative; margin-bottom: 0; }

#menu-primary ul.sub-menu { display: none; z-index: 999; text-align: left; }

#menu-primary li:last-child { margin-right: 0; }

#menu-primary li a { padding: 10px 20px; display: block; }

#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; }

#menu-primary ul.sub-menu li a { padding: 5px; }

#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; }

figure.thumbnail { max-width: 100%; }



/* 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: 14%; right: 20%; cursor: pointer; display: fixed; position: none; 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[href*="tiktok.com"] i:before { content: "\e07b"; }


.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; }

.social-icons li a[href*="tiktok.com"]:hover { background-color: #fff; color:#353535!important; }

/* 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: 1200px) {

    .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; }

}*/

@media (max-width: 768px) {
    #menu-primary {
        display: none !important;
    }
}