@charset "utf-8";
/*-------------------------------------------------------------------------------------------------------------

NAME: THEME GLOBAL CSS DOCUMENT
TYPE: GLOBAL PAGE STYLING FOR ENTIRE SITE
PROJECT NAME: LHN GROUP - SPACE OPTIMISED
AUTHOR(S): 
- SOH WEI WEN

-------------------------------------------------------------------------------------------------------------*/

body
{
	background-color: #FFE !important;
	color: #484848;
	font: 400 14px/1.4 'DIN-Regular', Arial, Helvetica, sans-serif;
}

.container, .container-fluid
{
	padding:0 15px;
}

p a { font-family: 'DIN-Medium'; }

.btn-blue
{
	background-color: #125688;
	border: 2px solid #125688;
	color: #fff;
	font-family: 'DIN-Medium';
	font-size: 16px;
	padding: 8px;
}

.btn-blue:hover { background-color: #3a84bb;}

.btn-transparent
{
	border: 1px solid #fff;
	color: #fff;
	font-size: 16px;
	min-width: 140px;
	padding: 8px 12px;
	text-align: center;
}

.btn-transparent:hover
{
	background-color: #FFE !important;
	background-color: rgba(255,255,255,0.6);
	color: #000;
	font-weight: 700;
}


/* Headings
------------------------------------------------------*/

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
th, dt
{
	font-weight: 400;
	font-family: 'DIN-Bold';
}

h5 { font-size: 14px; margin: 20px 0 5px; }

h2.first-child { margin-top: 0 !important; }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; }

/* Table
------------------------------------------------------*/

.table
{
	font-size: 12px;
	text-align: justify;
}

.table th,
.table td { padding: 1em; }

.table-bordered thead th
{
	border-bottom-width: 1px;
	color: #333333;
	font-size: 16px;
	text-align: center;
	text-transform: uppercase;
}

/* Figure 
------------------------------------------------------*/

.sub-banner { margin-bottom: 1em; }

.sub-banner img { width: 100%; }


/* Form Elements 
------------------------------------------------------*/

.c-select
{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f6f6f6+0,ffffff+100 */
	background: #f6f6f6; /* Old browsers */
	background-image: url(../img-layout/select-caret.png); /* fallback */
	background-image: url(../img-layout/select-caret.png), -moz-linear-gradient(top, #f6f6f6 0%, #ffffff 100%); /* FF3.6+ */
	background-image: url(../img-layout/select-caret.png), -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6f6f6), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
	background-image: url(../img-layout/select-caret.png), -webkit-linear-gradient(top, #f6f6f6 0%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
	background-image: url(../img-layout/select-caret.png), -o-linear-gradient(top, #f6f6f6 0%,#ffffff 100%); /* Opera 11.10+ */
	background-image: url(../img-layout/select-caret.png), -ms-linear-gradient(top, #f6f6f6 0%,#ffffff 100%); /* IE10+ */
	background-image: url(../img-layout/select-caret.png), linear-gradient(to bottom, #f6f6f6 0%,#ffffff 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	
	background-repeat: no-repeat;
	background-position: right 12px center;
}

.c-select option
{
	background-color: #fafafa;
}

.form-float .form-group
{
	clear: none;
	float: left;
}

textarea { resize: none; }

.fieldset-widget
{
	clear: both;
	padding-bottom: 2em;
	padding-top: 1em;
}

.fieldset-widget + .fieldset-widget { border-top: 1px solid #e7e7e7; }

.fieldset-widget h4
{
	clear: both;
	margin: 0 0 1em;
}

.btn-input
{
	background-color: #125688;
	border: 2px solid #125688;
	color: #fff;
	font-family: 'DIN-Medium';
	font-size: 16px;
	min-width: 120px;
	padding: 8px;
}

.btn-input:hover { background-color: #3a84bb;}


/* Category Types
------------------------------------------------------*/

.category-types 
{
	color: #fff;
	display: inline-block;
	font: 400 12px 'DIN-Medium';
	padding: 2px 4px;
	text-shadow: 0 2px 2px rgba(0,0,0,0.3);
	text-transform: uppercase;
}

.category-types.com { background-color: #d6c301; }
.category-types.ind { background-color: #ec1e26; }
.category-types.res { background-color: #079353; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

	[START OF PAGE DESIGN]

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#wrapper
{
	margin: auto;
	max-width: 1400px;
	/*width:1400px;*/ // anti-responsive
}

/*------------------------------------------------------------------------------------------------------------- 
	1. Header / #header
-------------------------------------------------------------------------------------------------------------*/

#header
{
	background-color: #FFE !important;
	box-shadow: 0 3px 5px rgba(0,0,0,0.15);
	-moz-box-shadow: 0 3px 5px rgba(0,0,0,0.15);
	-webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.15);
	z-index: 2;
}

.color-strip
{
	height: 6px;
	float: left;
	width: 16.66667%;
}

.strip-1 { background-color: #c8bf36; }
.strip-2 { background-color: #0e8aa3; }
.strip-3 { background-color: #1b6b36; }
.strip-4 { background-color: #09b1df; }
.strip-5 { background-color: #e02826; }
.strip-6 { background-color: #aca796; }

.siteHeader
{
	clear: both;
	padding: 1.4em 0;
}

.logo { float: left; }

.logo img { width: 127px; }

/*-------------------------------
	1.1 Sub Navigation
-------------------------------*/

.sub-navigation
{
	clear: both;
	margin-top: 10px;
	float: right;
}

.sub-navigation .fa { font-weight: 700; }

.sub-navigation > ul > li
{
	display: inline-block;
	margin-left: 10px;
}

.sub-navigation > ul > li > a
{
	font-family: 'DIN-Bold';
	padding: 5px 10px;
}

.sub-navigation > ul > li > a
{
	color: #ffffff;
	background: #7e7e83;
	background: -moz-linear-gradient(top, #7e7e83 0%, #6d6d72 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7e7e83), color-stop(100%,#6d6d72));
	background: -webkit-linear-gradient(top, #7e7e83 0%,#6d6d72 100%);
	background: -o-linear-gradient(top, #7e7e83 0%,#6d6d72 100%);
	background: -ms-linear-gradient(top, #7e7e83 0%,#6d6d72 100%);
	background: linear-gradient(to bottom, #7e7e83 0%,#6d6d72 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7e7e83', endColorstr='#6d6d72',GradientType=0 );
}

.sub-navigation .submenu
{
	display: none;
	padding-top: 1em;
	position: absolute;
	right: 0;
	top: 100%;
	width: 195px;
	z-index: 2;
}

.sub-navigation li:hover .submenu { display: block; }

.sub-navigation .submenu:before
{
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-bottom: 7px solid #4b4b4f;
	
	content: '';
	display: block;
	height: 0;
	position: absolute;
	right: 3em;
	top: 0.5em;
	width: 0;
}

.sub-navigation .submenu li
{
	background-color: #4b4b4f;
	display: block;
}

.sub-navigation .submenu a
{
	color: #f1f1f1;
	font-family: 'DIN-Medium';
	padding: 8px 12px;
}

.sub-navigation .submenu a:hover {	background-color: #74706f; }

/*-------------------------------
	1.2 Main Navigation
-------------------------------*/

.main-navigation 
{
	clear: both;
	float: right;
	margin-top: 1em;
}

.main-navigation .submenu 
{
	display: none;
	position: absolute;
	width: 220px;
	z-index: 2;
}

.main-navigation li:hover > .submenu  { display: block; }

.main-navigation .submenu > ul { padding: 10px 0; }

.main-navigation .submenu a
{
	color: #fff;
	padding: 10px 8px 10px 16px;
}

.main-navigation .show { display: block; } /* troubleshooting */

/*~~~~~ Top Level ~~~~~*/

.main-navigation .parent > li { float: left; }

.main-navigation .parent > li > a
{
	color: #3c3c3c;
	font-weight: 700;
	padding: 5px 12px;
	text-transform: uppercase;
}

.main-navigation .parent > li:last-child > a { padding-right: 0; }

/*-------------------------------
	1.3 Main Navigation - Sub Menu
-------------------------------*/

.main-navigation .level-one
{
	left: 0;
	padding: 20px 0 0;
	top: 100%;
}

.main-navigation .level-one:before
{
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-bottom: 7px solid #4b4b4f;
	
	content: '';
	display: block;
	height: 0;
	left: 15%;
	position: absolute;
	top: 13px;
	width: 0;
}

.main-navigation .level-one > ul { background-color: #3d3b3a; }

.main-navigation .level-one > ul > li:hover > a {	background-color: #74706f; }

.main-navigation .level-one .dropdown-submenu:after
{
	color: #fff;
	content:"\f105";
	display: block;
	font-family:'FontAwesome';
	font-size: 16px;
	height: 100%;
	padding: 8px;
	position: absolute;
	right: 5px;
	top: 0;
}

.main-navigation .level-two
{
	background-color: #74706f;
	left: 100%;
	top: 0%;
}

.main-navigation .level-two a:hover { background-color: #929090; }

/*-------------------------------
	1.4 Main Navigation - Mobile
-------------------------------*/

#mobile_offcanvas
{
	background-color: #353537;
	color: #c5c5c5;
	display: none;
	height: 100%;
	position: absolute;
	right: 0;
	top: 0;
	width: 250px;
	z-index: 0;
}


#mobile_offcanvas a 
{
	color: inherit;
	text-transform: capitalize;
}

.mobile-navigation .parent > li { border-bottom: 1px solid #74706f; }
.mobile-navigation .parent > li > a { padding: 8px 16px; }
.mobile-navigation .parent > li > a:hover { background-color: #5b595a; }

.mobile-navigation .submenu-parent > a {}
.mobile-navigation .submenu-parent > button 
{
	border-left: 1px solid #74706f;
	font-size: 15px;
	height: 35px;
	padding: 5px;
	position: absolute;
	right: 0;
	top: 0;
	width: 35px;
	z-index: 2;
}

.mobile-navigation .submenu-parent > button .spot
{
	border-radius: 50%;
	display: none;
	height: 22px;
	transition: all 0.3s ease-in-out;
	width: 22px;
}

.mobile-navigation .submenu-parent > button .fa
{
	position: absolute;
	right: 10px;
	top: 10px;
}
.mobile-navigation .submenu-parent > button .fa:before { content:"\f107" }
.mobile-navigation .submenu-parent.open > a { background-color: #5b595a; }
.mobile-navigation .submenu-parent.open .spot 
{
	background-color: #c5c5c5; 
	box-shadow: 0 0 8px rgba(255,255,255,0.8);
}
.mobile-navigation .submenu-parent.open .fa:before { content:"\f106" }

.mobile-navigation .submenu
{
	background-color: #2a2b2d;
	clear: both;
	display: none;
	font-size: 12px;
	padding: 5px 2em;
}

.mobile-navigation .submenu a { padding: 5px 0; }

#mobileToggle
{
	display: none;
	float: left;
	margin-top: 1em;
	padding: 10px 5px;
	position: relative;
	width: 32px;
}

#mobileToggle:before
{
	content: '';
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 2;
}

.icon-bar
{
	/*background-color: #4b4b4f;*/
	background-color: #9a6b57;
	border-radius: 4px;
	display: block;
	height: 3px;
	position: relative;
	width: 100%;
	z-index: 0;
}

.icon-bar + .icon-bar { margin-top: 4px; }

.mobile-dropdown
{
	background: #fbfaf9 url(../img-layout/select-angle-down.png) no-repeat;
	background-position: right 1em center;
	border: 0;
	font-family: 'DIN-Regular';
	font-size: 14px;
	padding: 8px;
	width: 100%;
}

.mobile-dropdown optgroup 
{
	/*font-family: 'DIN-Medium'; 
	font-weight: 300; */
}

.mobile-dropdown optgroup option { padding-left: 20px; }
.mobile-dropdown option:checked { color: #125688; font-family: 'DIN-Bold'; }

/*------------------------------------------------------------------------------------------------------------- 
	2. Masthead / .masthead
-------------------------------------------------------------------------------------------------------------*/

.masthead
{
	background-color: #FFE !important;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 400px;
}

.masthead .container-fluid
{
	color: #fff;
	height: 100%;
	display: table;
	max-width: 1000px;
	padding: 0;
	text-align: center;
	width: 100%;
}

.masthead .masthead-content
{
	display: table-cell;
	padding: 0 15px;
	vertical-align: middle;
}

.masthead-title 
{
	font-size: 60px;
	text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}

.masthead-links
{
	list-style: none;
	padding: 0;
}

.masthead-links li { display: inline-block; }

.masthead-links a
{
	border: 1px solid #fff;
	color: #fff;
	display: block;
	font-size: 16px;
	min-width: 140px;
	padding: 8px 12px;
	text-align: center;
}

.masthead-links a:hover
{
	background-color: #FFE !important;
	background-color: rgba(255,255,255,0.6);
	color: #000;
	font-weight: 700;
}

/*------------------------------------------------------------------------------------------------------------- 
	3. Content / #main
-------------------------------------------------------------------------------------------------------------*/

#main .container 
{
	background-color: #FFE !important;
	padding: 0; 
}

.bd-container
{
	overflow: hidden;
	position: relative;
}

.bd-container:after
{
	clear: both;
	content: '';
	display: table;
}

.main-content p { line-height: 1.6; }

/*-------------------------------
	3.1 BD Sidebar
-------------------------------*/

.bd-sidebar
{
	background-color: #fbfaf9;
	padding: 2em 0;
}

.bd-sidebar-module
{
	clear: both;
	padding: 0 2em;
}

.bd-navigation-module
{
	padding-left: 8em;
}

.bd-sidebar .sidebar-navigation
{
	float: none;
	/*padding-left: 2em;*/
}

.sidebar-title 
{
	margin: 2.6em 0 14px;
	text-transform: uppercase;
}

.bd-mobile-navigation
{
	display: none;
	padding: 0;
}

/* Subpage Nav
------------------------------------------------------*/

.subpage-nav 
{
	font-size: 13px;
	line-height: 1.6; 
}

.subpage-nav h4 { margin: 0 0 12px; }

.subpage-nav > ul { margin-bottom: 12px; }
.subpage-nav ul ul { display: none; padding-left: 1em; }

.subpage-links > li
{
	display: block;
	margin-bottom: 8px;
}

.subpage-links a
{
	color: inherit;
	padding: 3px 0;
}

.subpage-links li:hover > a,
.subpage-links .active
{	
	color: #125688;
	font-family: 'DIN-Bold';
}

.subpage-links li:hover > a:after,
.subpage-links .active:after
{
	border-right: 2px solid #9a6b57;
	content: '';
	display: block;
	height: 100%;
	position: absolute;
	right: -30px;
	top: 0;
	z-index: 2;
}

/* Arrow Nav
------------------------------------------------------*/

.arrow-nav .subpage-links > li { padding-left: 2em ; }

.arrow-nav .subpage-links > li:before
{
	content: '>';
	display: block;
	left: 0;
	padding: 3px 0;
	position: absolute;
}

/*-------------------------------
	3.2 BD Content
-------------------------------*/

.bd-content 
{
	background-color: #FFE !important;
	min-height: 400px;
	padding: 2em 0 3em;
}

.bd-content h2 { margin: 2em 0 13px; }

/*-------------------------------
	3.3 Layout With / Without Sidebar
-------------------------------*/

.layout-with-sidebar 
{
	background-color: #fbfaf9;
}

.layout-with-sidebar .bd-sidebar
{
	border-left: 1px solid #dcdcdc;
	border-right: 1px solid #f7f7f7;
	bottom: 0;
	left: 0;
	position: absolute;
	top: 0;
	width: 30%;
}

.layout-with-sidebar .bd-content
{
	border-left: 1px solid #dcdcdc;
	border-right: 1px solid #dcdcdc;
	margin-left: 30%;
	min-height: 800px;
	padding-left: 2em;
	padding-right: 2em;
	/*width: 70%;*/
}

.layout-no-sidebar
{
	border-left: 1px solid #dcdcdc;
	border-right: 1px solid #dcdcdc;
}

/*~~~~~[ Table Type ]~~~~~*/

.layout-table
{
	background-color: #fbfaf9; 
	display: table;
	height: 100%;
	vertical-align: top;
	width: 100%;
}

.layout-table .bd-sidebar,
.layout-table .bd-content
{
	display: table-cell;
	height: 100%;
	vertical-align: inherit;
}

.layout-table .bd-sidebar
{
	border-left: 1px solid #dcdcdc;
	border-right: 1px solid #f7f7f7;
	width: 30%;
}

.layout-table .bd-content
{
	border-left: 1px solid #dcdcdc;
	padding-left: 2em;
	width: 70%;
}

/*-------------------------------
	3.4 Breadcrumbs
-------------------------------*/

.breadcrumb 
{
	color: #484848;
	font-size: 12px; 
	margin-bottom: 2em;
}

.breadcrumb a
{
	color: inherit;
	font-family: 'DIN-Medium';
}

.breadcrumb a:hover { text-decoration: underline; }

.breadcrumb li { vertical-align: middle; }

.breadcrumb li+li:before 
{
	color: #484848;
	content: '>'; 
	font-size: 10px;
	vertical-align: top;
}

.page-title
{
	font: 400 32px/1 'DIN-Bold';
	margin: 0 0 1em;
}

.innermost-link { display: none; }
.innermost-link:before
{
	content: '<';
	display: inline-block;
	font-size: 12px;
	margin-right: 4px;
	position: relative;
	top: 2px;
	vertical-align: top;
}

/*------------------------------------------------------------------------------------------------------------- 
	4. Footer / #footer
-------------------------------------------------------------------------------------------------------------*/

#footer
{
	background-color: #434247;
	color: #98989b;
}

#footer a { color: inherit; }
#footer a:hover { color: #fff; }

#footer .container
{
	font-size: 12px;
	padding: 1.2em 1em;
}

.ft-left .list-inline > li 
{
	margin-left: -4px;
	padding: 0 8px;
	position: relative;
}

.ft-left .list-inline > li:first-child { margin-left: 0; }
.ft-left .list-inline > li:not(:last-child):after
{
	background-color: #98989b;
	content: '';
	display: block;
	height: 12px;
	position: absolute;
	right: 0;
	top: 2px;
	width: 1px;
}

.ft-right { float: right; }

.ft-social { display: inline-block; }
.ft-social li { vertical-align: middle; }
.ft-social .fa { font-size: 15px; }


/*------------------------------------------------------------------------------------------------------------- 
	5. Others
-------------------------------------------------------------------------------------------------------------*/

#back-to-top
{
	bottom: 1em;
	display: none;
	position: fixed;
	right: 2em;
	z-index: 5;
}

#back-to-top a
{
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
}

#back-to-top a
{
	background-color: #f3f3f3;
	border: 1px solid #cfcfcf;
	color: #cfcfcf;
	display: block;
	height: 60px;
	font-size: 32px;
	font-weight: 700;
	text-align: center;
	width: 60px;
}

#back-to-top a:hover 
{
	border-color: #333333;
	color: #333333;
}

#back-to-top .fa 
{
	display: block;
	height: 100%;
	padding: 10px;
}

/* Responsive
------------------------------------------------------*/

.grid:before, .grid:after
{
	clear: both;
	content: '';
	display: table;
}

.module { padding: 1.11111rem; }

.col-grid-list
{
	clear: both;
	list-style: none;
	padding: 0;
}

.col-grid-list:before, .col-grid-list:after
{
	clear: both;
	content: '';
	display: table;
}

.col-grid-list > li
{
	display: block;
	float: left;
}

.col-grid-list > li:nth-of-type(1n) { clear: none; }

.col-width-1 > li { width: 100%; }
.col-width-2 > li { width: 50%; }
.col-width-3 > li { width: 33.33333%; }
.col-width-4 > li { width: 25%; }
.col-width-5 > li { width: 20%; }
.col-width-6 > li { width: 16.66667%; }
.col-width-7 > li { width: 14.28571%; }
.col-width-8 > li { width: 12.5%; }
.col-width-9 > li { width: 11.11111%; }
.col-width-10 > li { width: 10%; }
.col-width-11 > li { width: 9.09091%; }
.col-width-12 > li { width: 8.33333%; }

.col-width-1 > li:nth-of-type(1n+1),
.col-width-2 > li:nth-of-type(2n+1),
.col-width-3 > li:nth-of-type(3n+1),
.col-width-4 > li:nth-of-type(4n+1),
.col-width-5 > li:nth-of-type(5n+1),
.col-width-6 > li:nth-of-type(6n+1),
.col-width-7 > li:nth-of-type(7n+1),
.col-width-8 > li:nth-of-type(8n+1),
.col-width-9 > li:nth-of-type(9n+1),
.col-width-10 > li:nth-of-type(10n+1),
.col-width-11 > li:nth-of-type(11n+1),
.col-width-12 > li:nth-of-type(12n+1) { clear:both; }