/*
Theme Name: Sparkling Child
Author: Locus-T
Author URI: http://www.locus-t.com.my
Description: Sparkling Child Theme created to suit Locus-T purposes
Template: sparkling
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sparkling-child
*/

@font-face { font-family: Century Gothic; src: url('fonts/GOTHIC.TTF'); font-weight: normal; }
@font-face { font-family: Century Gothic; src: url('fonts/GOTHICB.TTF'); font-weight: bold; }
/* GLOBAL */
body { color: #272727; background: #f2f2f2; font-family: 'Century Gothic', sans-serif; font-size: 15px; line-height: 1.6; max-width: 1600px; margin: 0 auto; }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { line-height: 1.3; color: inherit; font-weight: normal; }
.h1, .h2, .h3, h1, h2, h3, .entry-title { margin-top: 10px; margin-bottom: 10px; }
.h1, h1 { font-size: 40px; }
.h2, h2 { font-size: 34px; }
.h3, h3 { font-size: 28px; }
.h4, h4 { font-size: 22px; }
.h5, h5 { font-size: 20px; }
.h6, h6 { font-size: 18px; }
.entry-content h1, .entry-content h2, .entry-content h3 { font-weight: bold; }
.entry-title { color: inherit; font-size: 24px; }
a { color: #333; outline: 0!important; }
a:focus, a:hover,.entry-title a:hover { color: #ffc107; text-decoration: none!important; }
p { margin: 0 0 1em; }

.fa-smile-o { color: #272727; font-size: 4em!important; text-align: center!important; margin: 0; }
.scroll-to-top:hover { background: #ffc107; }
.scroll-to-top i{ color: #fff!important; }

.btn{ border-radius: 0!important; font-weight: bold; font-size: 1em; min-width: 100px; padding: 12px 20px; text-transform: initial; 
	position: relative; 
}
.btn.btn-default { background: #f7d245; border: none; border-left: 5px solid #272727; color: #272727; }
.btn.btn-default:hover, .btn.btn-default:focus { background: #272727; color: #f7d245; border-color: #272727; }
.btn.btn-default.black { background: #272727; color: #f7d245; border: 1px solid #272727;}
.btn.btn-default.black:hover, .btn.btn-default.black:focus { background: transparent; color: #272727; }
.btn-lg { padding-left: 2.5em; padding-right: 2.5em; }
.wpcf7 input[type='submit']:hover,.wpcf7 input[type='submit']:focus { background: #272727; border-color: #272727; }

#content { background: #fff; }
.container-fluid.main-content-area, .container-fluid.main-content-area > .row > .main-content-inner { padding: 0!important; }
.container-fluid.main-content-area > .row, .main-content-area { margin: auto; }
.page-header { border: none; margin: 0; padding: 0; }
.post-inner-content { padding: 0!important; border: none!important; background: none!important; }

/*SEARCH*/
.entry-content, .entry-summary, .single-view, .blog-item-wrap { margin: 0; }
.search .hentry:not(:last-of-type) { border-bottom: 1px solid #ddd; }
.entry-meta { margin-bottom: 0.5em; }
.no-results.not-found { margin: 2em 0; }
.search .btn.btn-default.read-more { font-size: 1em!important; }
.search article:not(:last-of-type) { border-bottom: 1px solid #e5e5e5; }

#search-form { padding-left: 10px; }
input.search-query { outline: none; background: #272727 url(img/search-icon.png) no-repeat 9px center; border:none; padding: 9px 10px 9px 32px; 
	width: 35px; height: 35px; padding-left: 25px; color: #272727; cursor: pointer; box-shadow: none; -webkit-transition: all .5s; -moz-transition: all .5s; transition: all .5s;
}
input.search-query:hover { border-radius: 50%; }
input.search-query:hover, input.search-query:focus { background-color: #fff; }
input.search-query:focus { border-radius: 5px; width: 150px; padding-left: 35px; cursor: auto; }

.padding-0 {padding: 0;}
.padding-15 {padding-top: 1em; padding-bottom: 1em;}
.padding-30 {padding-top: 2em; padding-bottom: 2em;}
.add-xtra-padding { padding-left: 2em; padding-right: 2em; }
.flex-center { display: flex; align-items: center; }
.flex-bg { display: flex; }
.shadowline { margin: 0; height: 10px; border: 0; box-shadow: inset 0 12px 12px -12px rgba(0,0,0,.65); }

/*WIDGET MENU*/
.widget ul li { border: none!important; padding-bottom: 0; }
.widget ul { font-size: inherit; line-height: 1.6; }
.widget-container { list-style: none!important; }

/*HEADER*/
.navbar.navbar-default { background: #272727; border: none; border-radius: 0; font-family: inherit; }
.site-navigation-inner { padding: 1em; display: table; }
.navbar-header, .navbar-collapse.collapse, #search-form { display: table-cell!important; vertical-align: middle; }
#logo { display: inline-block; }

/*NAV*/
.navbar-collapse.collapse { border: none; padding: 0!important; }
.navbar-default .navbar-nav > li { padding: 8px 0; }
.navbar-default .navbar-nav > li > a, .navbar-default .navbar-nav > .open > a { border-right: 1px dashed #f7d245!important; }
.navbar-default .navbar-nav li a { font-size: 15px; background: none!important; color: #f7d245!important; line-height: 1; padding: 0 20px; 
	font-family: inherit; font-weight: bold;
}
.navbar-default .navbar-nav li > a:hover, .navbar-default .navbar-nav li > a:focus, 
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    color: #fff!important;
}
.navbar-default .navbar-nav > .active { border: 1px dashed #f7d245; margin-left: -1px; }
.navbar-default .navbar-nav > .active > a { border: none!important; }
.navbar-default .navbar-nav .current-menu-ancestor a.dropdown-toggle { color: #272727; }
.navbar-default .navbar-nav .open .dropdown-menu > li > a  { color: #272727; }
.navbar-default .navbar-nav .dropdown-menu { border: none; background: #191919; border-radius: 0; }
.navbar-default .navbar-nav .dropdown-menu li a { color: #272727; text-transform: uppercase; padding: 1em; }
.navbar-default .navbar-nav .dropdown-menu .active > a { background: #f7d245!important; color: #272727!important; }
.navbar-default .navbar-nav .dropdown-menu li a:hover, .navbar-default .navbar-nav .dropdown-menu li a:focus,
.navbar-default .navbar-nav .dropdown-menu > .active a:hover, .navbar-default .navbar-nav .dropdown-menu > .active a:focus { color: #fff!important; }

#responsive-menu-button { position: relative!important; top: 15px!important; left: 0!important; right: 0!important; bottom: 0!important; 
	float: right; margin-left: 1em!important; z-index: initial!important; border-radius: 0!important;
}
.responsive-menu-box { height: 25px!important; }
.admin-bar #responsive-menu-container { margin-top: 32px; }
.admin-bar #click-menu { margin-top:0!important; }
#responsive-menu-container { box-shadow: 3px 3px 15px 0px rgba(147, 147, 147, 0.3); }
#responsive-menu ul { padding: 0; }

#logo #responsive-menu-button, #logo #responsive-menu-container { display: none!important; }

/*PAGES*/
.page-banner { background-size: cover; background-repeat: no-repeat; background-position: top center; padding: 3.7em 1em; }
.page-banner .page-title { margin: 0; font-weight: bold; text-transform: uppercase; color: #f7d245; text-align: center; font-size: 3.5em; }
#welcome-msg { background: linear-gradient(rgba(39,39,39,.9),rgba(39,39,39,.9)), url('/wp-content/uploads/2016/11/soccer-ball.jpg') center no-repeat; 
	color: #fff; background-size: cover; 
}
#featured-product { background: linear-gradient(rgba(39,39,39,.9),rgba(39,39,39,.9)), url('/wp-content/uploads/2016/11/tennis-ball-on-a-tennis-court.jpg') center no-repeat;
	background-size: cover;
}
.grey-bg { background: #e7e7e7; }
.yellow-bg { background: #f7d245; }
.asian-worker-bg { background: url('/wp-content/uploads/2016/11/Asian-worker-in-factory-at-metal-skip-machine-putting-work-piece-in.jpg') center / cover no-repeat; }
.sports-equipment-bg { background: url('/wp-content/uploads/2016/11/sports-equipment-bg.jpg') center / contain no-repeat; }
.su-gmap { margin: 0!important; }

/*FOOGALLERY*/
/*.foogallery-album-gallery-list .foogallery-pile .foogallery-pile-inner { background-color: #f7d245; }*/
[id*='foogallery-album'] .foogallery-album-gallery-list .foogallery-pile { margin: 1em!important; }
.foogallery-album-gallery-list .foogallery-pile .foogallery-pile-inner { text-align: initial; }
.foogallery-album-gallery-list .foogallery-pile img { transition: all 0.3s ease-in-out; }
.foogallery-album-gallery-list .foogallery-pile:hover img { opacity: 0.8; }
.foogallery-album-gallery-list .foogallery-pile h3 { font-size: 1.3em; }
.foogallery-default a img { border: 1px solid #ccc; padding: 5px; }
.foogallery-default a { margin-right: 20px!important; margin-bottom: 30px!important; }
/*NAVIGATION*/
.navigation { clear: both; }
.navigation .pagination { margin: 1em 0; }
.navigation .wp-pagenavi-pagination span, .navigation .wp-pagenavi-pagination a { font-size: 13px; text-transform: uppercase;}
.pagination>li>a, .pagination>li>span, .pagination>li>span:focus, .pagination>li>span:hover { color: #272727; }
.pagination>li>a:focus, .pagination>li>a:hover { color: #272727; }
.navigation .wp-pagenavi-pagination span.current, .navigation .wp-pagenavi-pagination a:hover { background-color: #272727; border-color: #272727; color: #fff; }

/*FOOTER*/
#footer-area { background-color: #272727!important; }
#footer-area .footer-widget-area { background: none!important; padding: 0; margin: 30px 0 15px; color: #fff; font-size: 14px; }
#footer-area .footer-widget { padding-left: 2em; padding-right: 2em; }
#footer-area .footer-widget:not(:last-child) { border-right: 1px dashed; }
#footer-area .widgettitle { color: #f7d245; font-weight: bold; margin-bottom: 10px; }
.footer-widget i { font-size: 18px; margin-bottom: 5px; }
.footer-widget i.fa-mobile { font-size: 22px; width: 1em; }
#colophon { border:none; padding: 0; background: none; }
.site-info { color: #c5c5c5; font-size: 12px; }
.copyright { width: 100%; float: none; text-align: center; margin: 10px 0; }
#footer-area a{ color: inherit; }
#footer-area a:hover{ color: #f7d245; }
#menu-footer li { margin-bottom: 5px; }
.social-icons, #menu-social { text-align: initial; }
#footer-area #menu-social li a { background: #d7d9e1; color: #272727; color: #272727; width: 28px; height: 28px; line-height: 30px; 
	font-size: 18px; border-radius: 50%; 
}
#footer-area #menu-social li a:hover { color: inherit; }

/*FORM ELEMENTS*/
::-webkit-input-placeholder { font-weight: bold; color: rgba(39,39,39,.5); }
::-moz-placeholder { font-weight: bold; color: rgba(39,39,39,.5); }
:-ms-input-placeholder { font-weight: bold; color: rgba(39,39,39,.5); }
:-moz-placeholder { font-weight: bold; color: rgba(39,39,39,.5); }
.form-control { height: 38px; }
input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="password"], select, textarea { 
	width: 100%; font-size: inherit; padding: 5px 10px; border-radius: 0; margin: 10px 0; color: #272727; background-color: rgba(255,255,255,0.7); 
	border: 1px solid #cfcfcf;
}
input, optgroup, select, textarea { color: #272727; box-shadow: inset 1px 1px 3px 1px rgba(200,200,200, 0.2); }
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, textarea:focus {
    color: #272727;
}
input[type="submit"], input[type="reset"] { box-shadow: none; }
textarea { height: 150px; }
.wpcf7-submit { margin: 1em 0; }

/*RESPONSIVE*/
@media ( max-width: 1199px ){
	.foogallery-album-gallery-list .foogallery-pile img { max-width: 250px; }
	.foogallery-default a img { max-width: 290px; }
}
@media ( max-width: 991px ){
	.navbar-header { display: block!important; width: 100%; }
	.page-banner { padding-top: 3em; padding-bottom: 3em; }
	.foogallery-album-gallery-list .foogallery-pile img { max-width: 200px; }
	[id*='foogallery-album'] .foogallery-album-gallery-list .foogallery-pile { margin-left: 0!important; margin-right: 20px!important; }
	.foogallery-default a img { max-width: 215px; }
}
@media ( max-width: 767px ){
	.page-banner { padding-top: 2.3em; padding-bottom: 2.3em; }
	.flex-bg { display: block; position: relative; }
	.flex-bg > *:not([class*='-bg']) { width: 100%; z-index: 1; }
	.flex-bg > [class*='-bg'] { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; z-index: 0; opacity: .2; }
	.foogallery-album-gallery-list .foogallery-pile img { max-width: 180px; }
	.foogallery-default a img { max-width: 190px; }
	.foogallery-default a { margin-right: 20px!important; }
}
@media ( max-width: 700px ){
	.foogallery-default a { margin-right: 10px!important; }
	.foogallery-default a img { max-width: 170px; }
}
@media ( max-width: 620px){
	[id*='foogallery-album'] .foogallery-album-gallery-list .foogallery-pile { margin: 15px 10px!important; }
	.foogallery-album-gallery-list .foogallery-pile img { max-width: 150px; }
}
@media ( max-width: 600px ){
	.foogallery-default a img { max-width: 212px; }
}
@media ( max-width: 550px ){
	.page-banner .page-title { font-size: 2.7em; }
	#footer-area .footer-widget{ width: 100%; float: none; border: none!important; }
}
@media ( max-width: 490px ){
	.foogallery-default.alignment-left, .foogallery-album-gallery-list.alignment-left { text-align: center!important; }
	[id*='foogallery-album'] .foogallery-album-gallery-list .foogallery-pile { float: none!important; display: inline-block; }
	.foogallery-album-gallery-list .foogallery-pile img { max-width: 200px; }
}
@media ( max-width: 420px ){
	#logo img { max-width: 120px; }
	#responsive-menu-button { margin-top: -1.5%!important; }
	.foogallery-album-gallery-list { text-align: center!important; }
	.foogallery-album-gallery-list .foogallery-pile { float: none!important; display: inline-block; }
	.foogallery-album-gallery-list .foogallery-pile img { max-width: 180px; }
}