/*

Theme Name: FirstCom Solutions

Author: FirstCom Solutions

Author URI: http://firstcom.com.sg/

Version: 1.0

*/

.simple-pagination-previous, .simple-pagination-next{
display: none;
}

@media (max-width: @screen-md) {

	body{font-size: 40px;}

}



@media (max-width: @screen-md) {

	body{font-size: 40px;}

}



header{

	border-top: 8px solid #FFA31F;

	border-bottom: 8px solid #FFA31F;

}



.logo-container, .nav-container{

	display: inline-block;

}



nav.navbar{

	margin-top: 20px;

	margin-bottom: 20px;

}



.navbar-nav{

	/*	float: right;*/

}



nav.navbar li:first-child{

	display: none;

}



nav.navbar li{

	padding-right: 19px;

	margin-right: 19px;

	border-right: 1px solid #333;

}



nav.navbar li:last-child{

	padding-right: 0px;

	margin-right: 0px;

	border-right: 0px solid #333;

}



nav.navbar li a{

	padding: 0px;

	text-transform: uppercase;

}



.navbar-default{

	background-image:none;

	box-shadow:none;

}



nav.navbar ul{

	margin-top: 25px;

}



.navbar-default{

	border-color: transparent;

	background-color: transparent;

}


.search-btn{
	position: relative;
	margin-top: 20px;
	float: right;
}

.search-btn button{
	background-color: #FFA133;
	border: 0px;
	padding: 12px;
	color: #FFF;
}


input[name="s"]{ 
	padding: 10px;
	margin-right: -5px;
	width: 170px;
}

/*Footer CSS*/

.footer{

	border-top: 8px solid #FFA31F;

	padding-top: 50px;

}



.copyright{

	padding:0px;

	color: #A5A5A5;

}



.footer-heading{

	font-weight: bold;

	color: #000;

	text-transform: uppercase;

	font-size: 16px;

}



.footer-col{

	margin-bottom: 20px;

}



.footer-col ul li a{

	color: #ccc;

}



.footer-col p{

	margin-bottom: 0px;

	color: #A5A5A5;

}



.site-map{

	padding:0px;

	list-style: none;

}



.site-map a{

	color: #A5A5A5;

}



.title{

	font-size: 32px;

	text-transform: uppercase;

	font-weight: bold;

}



/*Detail CSS*/

.detail{

	font-style: italic;

	margin-bottom: 50px;

	margin-top: 25px;

	padding-left: 0px;

}



.about-image{

	margin-bottom: 50px;

	padding-left:0px;

}





.image{

	text-align: center;

}



/*Product && Brands CSS*/



.break{

	clear: both;

	width: 100%;

	height: 5px;

}



.left-nav{

	margin-bottom: 30px;

}



.left-nav, .left-nav ul{

	padding: 0px;

}



.left-nav a{

	color: #333;

	text-decoration: none;

}



.left-nav li{

	background-color: #ffa320;

	list-style: none;

	padding: 10px 0px 6px 10px;

	color: #FFF;

	font-size: 14px;

	font-weight: bold;

	text-transform: uppercase;

	width: 230px;

}



.left-nav ul {

	border: 1px solid;

	margin-top: 10px;

	position: relative;

	left: -10px;

	width: 105%;

	border: 0px;

}



.left-nav ul li{

	background-color: #F4F4F4;

	background-image: url('./img/plus.png') ;

	background-size: 50px 50px;

	background-repeat: no-repeat;

	background-position: 190px -10px;

}



.left-nav ul li a{

	color: #ffa320;

	/* padding-left: 10px; */

}



.left-nav ul li:last-child{

	padding-bottom: 5px;

}



.left-nav ul li.current-cat-parent:hover, {}



.left-nav ul li.current-cat-parent ul{

	display: block;

}



.left-nav ul li:hover, .left-nav ul li.current-cat-parent:hover,

.left-nav ul li.current-cat-parent{

	background-image: url('./img/minus.png') ;

	background-size: 20px 20px;

	background-position: 205px 8px;

}

.left-nav ul li:hover ul li{

	background-image: none;

}



.left-nav ul li:hover ul{

	display: block;

}



.left-nav ul li ul{

	margin-top: 5px;

	border-left: 0px;

	border-right: 0px;

	width: 104%;

	display:none;

}



.left-nav ul li ul li{

	background-color: #F4F4F4;

	padding: 5px 10px;

	font-weight: normal;

	text-transform: none;

	border-bottom: 1px solid #ccc;

	background-image: none;

}



.left-nav ul li ul li:first-child{

	border-bottom: 1px solid #ccc;

	border-top: 1px solid #ccc;

}



.left-nav ul li ul li a{

	color: #333;

}







.cat-head{

	font-size: 32px;

	color: #333;

	margin-bottom: 20px;

	text-align: center;

}



.cat-head .line{

	background: url('./img/line.png') no-repeat right;

	background-size: 100% 15%;

	height: 22px;

	display: inline-block;

	opacity: 0.5;

}



.button{

	padding: 3px 20px;

	color: #FFF;

	background-color: #FFA320;

}



.button:hover{

	text-decoration: none;

	background-color: #000;

	color: #FFF;

}



.breadcrumb{

	margin-top: 10px;

	background: none;

}



.breadcrumb span a{

	color: #333;

}



.breadcrumb span{

	color: #ffa320;

}



.cat-container{

	border: 1px solid #EAEAEA;

	background-color: #FFFDFE;

	padding-left: 15px;

	margin: 10px 4%;

	min-height: 190px;

}



.cat-container .cat-desc{

	display: table-cell;

	vertical-align: middle;

	padding-left: 30px;

}



.img-container{

	width: 220px;

	height: 150px;

	display: table-cell;

	vertical-align: middle;

}



.img-container img{

    width: 183px;
    height: 170px;

}



.cat-container p.title, .name{

	font-size: 14px;

	font-weight: bold;

	color: #747474;

	text-align: left;

	min-height: 80px;
	margin-top: 15px;

}



.product, .Description{

	text-align: left;

	color: #ABABAB;

	font-size: 12px;

}



.product-grid{

	text-align: center;

	border: 1px solid #EAEAEA;

	margin-left: 20px;

	padding: 5px;

	background-color: #FFFDFE;

margin-bottom: 20px;
}



.hidden-show{

	max-height:1px;

	opacity: 0;

	transition: max-height 1s, opacity 0.5s ease-out;

	-moz-transition:  max-height 1s, opacity 0.5s ease-out;

	-webkit-transition:  max-height 1s, opacity 0.5s ease-out;

}



.product-grid:hover .hidden-show{

	max-height: 500px;

	display: block;

	opacity: 1;

	transition: max-height 1s, opacity 1.5s ease-in-out;

	-moz-transition:  max-height 1s, opacity 1.5s ease-in-out;

	-webkit-transition:  max-height 1s, opacity 1.5s ease-in-out;



}



.product-grid img{

	clear: both;

	display: block;

	margin-left: auto;

	margin-right: auto;

}



ul.product, ul.brand{

	padding: 0px;

	text-align: left;

	margin: 0px;

}



ul.product li, ul.brand li{

	list-style: none;

	border: 1px solid #EAEAEA;

	font-weight: bold;

	font-size: 14px;

	padding: 5px 5px;

	color: #ffa320;

	background-color: #F9F9F9;

}



ul.product ul li, ul.brand ul li{

	list-style: none;

	border: 1px solid #EAEAEA;

	font-weight: bold;

	font-size: 14px;

	padding: 5px 5px;

	background-image: url('./img/right.png');

	background-repeat: no-repeat;

	background-position: 180px 10px;

	background-color: #F9F9F9;

	color: #ffa320;

}



ul.product li, ul.brand li{

	background-image: none;

}



ul.product ul.post-categories li{

	display: none ;

}



ul.product ul.post-categories li:first-child{

	display: block ;

}





ul.brand ul.post-categories li:first-child{

	display: none;

}



ul.product ul.post-categories, ul.brand ul.post-categories{

	padding: 0px;

}



ul.product ul.post-categories li, ul.brand ul.post-categories li{

	border-top: 0px;

}



ul.product ul.post-categories li a, ul.brand ul.post-categories li a{

	color: #ffa320;

	text-decoration: none;

	font-weight: normal;

}



#frame{

	height:326px;

}



/*Services CSS*/

.img-services{

	text-align: center;

}



.service-description{

	padding:50px 50px 270px 0px;

}



/*Contact CSS*/

.contact{

	background-color: #000;

	color: #FFF;

}



#element_to_pop_up{

	width: 100% !important;

}



input[type="submit"]{

	float: right;

	padding: 10px 20px;

	background-color: #FFA320;

	border: 0px;

}



textarea{

	width: 100%;

}





/*MOBILE CSS*/



@media(max-width: 800px) {


	.navbar-header {
		float: none;
	}
	.navbar-left,.navbar-right {
		float: none !important;
	}
	.navbar-toggle {
		display: block;
	}
	.navbar-collapse {
		border-top: 1px solid transparent;
		box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
	}
	.navbar-fixed-top {
		top: 0;
		border-width: 0 0 1px;
	}
	.navbar-collapse.collapse {
		display: none!important;
	}
	.navbar-nav {
		float: none!important;
		margin-top: 7.5px;
	}
	.navbar-nav>li {
		float: none;
	}
	.navbar-nav>li>a {
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.collapse.in{
		display:block !important;
	}

	#logo img{

		width: 82%;

	}



	.navbar-nav{

		float: left;

	}

	nav.navbar ul{

		margin: 25px;

	}


	nav.navbar li{

		padding: 0px;

		margin: 0px;

		border: 0px;

	}



	nav.navbar li a{

		font-size: 16px;

		margin: 15px 0px 15px 0px;

	}



	nav.navbar{

		margin-top: 10px;

		margin-bottom: 10px;

	}



	.navbar-toggle{

		margin-top: 15px;

	}



	.carousel-inner>.item>a>img, .carousel-inner>.item>img, 

	.img-responsive, .thumbnail a>img, .thumbnail>img{

		display: inline-block;

		width: 100%;

		height: auto;

	}



	.product-grid .img-container{

		display: block;

		height: auto;

		margin-left: auto;

		margin-right: auto;

	}

.search-btn{ display: block; 
clear: both;
float:left ;}

	.img-container img{     width: 75%;}



	.product-grid{	text-align: center;	border: 1px solid #3c3c3c;	margin-left: 0px;	margin-bottom: 10px;	padding: 5px; }

	

	.cat-container{ padding:2px ;margin: 10px 0px;}

	.cat-container .img-container{ display: table-cell; text-align: center; vertical-align: middle; height: 120px; width: 220px;  }

	.cat-container .cat-desc{ display: table-cell;}



	.previous, .next{ display: none;	}

	

	.col-md-4{ width: 100% !important}



	.cat-container:nth-child(even), .cat-container:nth-child(odd){

		margin: 0px 0px 10px 0px;

		height: 125px;

	}



	ul.product li, ul.brand li{

		background-position: 300px 10px;

	}



	ul.product ul li, ul.brand ul li{

		background-position: 300px 10px;

	}



	.left-nav li{

		width: 345px;

	}



	#frame{ height: auto;	}

	.simple-pagination-previous, .simple-pagination-next{ display: none;}



	.white-popup{

		max-width: 100% !important;

	} 



}



.col-md-4{ width: 30.33333333%;}





.col-md-1{

	width: 7.333333% !important;

}







.next{

	background: url('./img/arrow1.png') no-repeat;

	background-position: -50px 0px;

	width: 59px;

	height: 125px;

}



.next:hover{

	background: url('./img/arrow-hover.png') no-repeat;

	background-position: -45px 0px;

	width: 59px;

	height: 125px;

}



.simple-pagination-previous, .simple-pagination-next{

	position: relative;

	z-index: 999;

	height: 379px;

}



.simple-pagination-previous{



}



.simple-pagination-next{

	top: -150px;

	float: right;

	height: 110px;

}





.previous{

	background: url('./img/arrow1.png') no-repeat;

	width: 59px;

	height: 125px;

	position: relative;

	top: 180px;

}



.previous:hover{

	background: url('./img/arrow-hover.png') no-repeat;

	width: 59px;

	height: 125px;

}



.my-navigation{

	padding-top: 50px;

}



.simple-pagination-page-numbers a{

	background: #ccc;

	margin: 5px;

	padding: 10px;

	color: #FFF;

	text-decoration: none;

}





.wpcf7-validation-errors{

	width: 132%;

	font-size: 12px;

}



.pop-up{

	position: fixed;

	right: 0px;

	z-index: 999;

	top: 30%;

}



.enquiry{

    background: url('./img/enquire-btn.jpg') no-repeat;
    background-size: 100% 100%;
    width: 84px;
    height: 50px;
    position: absolute;
    left: -84px;

}



.contact-form{

	display: none;

}



.pop-up:hover .contact-form{

	display: inline-table;

}



div.wpcf7-validation-errors{

	width: 310px;

}



/*customize Bootstrap CSS*/

.table>thead>tr>th, .table>tbody>tr>th, 

.table>tfoot>tr>th, .table>thead>tr>td, 

.table>tbody>tr>td, .table>tfoot>tr>td{

	border: 0px;

}





.white-popup {

	min-height: 255px;

	position: relative;

	background: #000;

	padding: 25px;

	width:auto;

	max-width: 50%;

	margin: 0 auto; 

	color: #FFF;

	border-top: 3px solid #FFA133;

	border-bottom: 3px solid #FFA133;

}



.mfp-close{

	color: #FFF !important;

}

}

/* 



====== Move-horizontal effect ======



*/

.mfp-move-horizontal {



	/* start state */

	.mfp-with-anim {

		opacity: 0;

		transition: all 0.3s;



		transform: translateX(-50px);

	}



	&.mfp-bg {

		opacity: 0;

		transition: all 0.3s;

	}

}


li.cat-item-1{ display: none}

