/* Site Colors:
#1e1f22; header bg
#333537 comment bg
#333437; line above footer?
*/

/* Responsive Wed Design:
	3 devices: Desktop, Tablet & Phone
	8 styles: (could be 12 styles if Tablet is the same as phone style)

Type of CSS device view
	Desktop:(1 device with 2 styles)
		Responsive & Adaptive

	Tablet: (1 device with 2 styles) or (4 styles like phone devices)
		Portrait w Responsive & Landscape w Adaptive

	Phone: (1 device with 4 styles)
		Mobile View
		- Portrait w Responsive
		- Landscape w Responsive
		Desktop view
		- Portrait w Adaptive
		- Landscape w Adaptive

Desktop: (1 device with 2 styles)
	Responsive - increase or decrease browser size
	Adaptive - increase or decrease view size in full screen, style with @media screen and (min-width: 901px) and @media screen and (min-width:1250px)

		Steps:
		1. Style in Responsive view with decrease browser size
		2. Style in @media screen and (min-width: 901px) with increase browser size
		3. Style in @media screen and (min-width: 1250px) with full screen size and decrease/increase view size 

Tablet: (1 device with 2 styles) also can have 4 styles like mobile devices
	Portrait (Responsive)
	Steps:
	1. Copy n Paste Desktop Steps 1
	2. Adjust accordingly

	Landscape (Adaptive)
	1. Copy n Paste Desktop Steps 2 n 3
	2. Adjust accordingly

Phone (iPhone & Android): (1 device with 4 styles: mobile=>portrait/landscape & Desktop=>portrait/landscape)
With switch view button
	Mobile View (Responsive)
		Portrait
		Steps:
		1. Copy n Paste Desktop Step1
		2. Adjust accordingly

		Landscape
		Steps:
		1. Use Portrait style @media screen and (min-width: 480px)
		2. Adjust accordingly

	Desktop View (Adaptive)
		Portrait & Landscape
		Steps:
		1. Copy n Paste Desktop ADaptive style
		2. Adjust accordingly
*/

/* Fonts
-------------------------------------------------------------- */

@font-face { font-family: 'TitilliumText22LRegular';
	src: url('../../fonts/titillium/TitilliumText22L003-webfont.eot');
	src: url('../../fonts/titillium/TitilliumText22L003-webfont.eot?#iefix') format('embedded-opentype'),
		 url('../../fonts/titillium/TitilliumText22L003-webfont.woff') format('woff'),
		 url('../../fonts/titillium/TitilliumText22L003-webfont.ttf') format('truetype'),
		 url('../../fonts/titillium/TitilliumText22L003-webfont.svg#TitilliumText22LRegular') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face { font-family: 'TitilliumText22LMedium';
	src: url('../../fonts/titillium/TitilliumText22L004-webfont.eot');
	src: url('../../fonts/titillium/TitilliumText22L004-webfont.eot?#iefix') format('embedded-opentype'),
		 url('../../fonts/titillium/TitilliumText22L004-webfont.woff') format('woff'),
		 url('../../fonts/titillium/TitilliumText22L004-webfont.ttf') format('truetype'),
		 url('../../fonts/titillium/TitilliumText22L004-webfont.svg#TitilliumText22LMedium') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {font-family: 'NobileRegular';
	src: url('../../fonts/nobile/nobile-webfont.eot');
	src: url('../../fonts/nobile/nobile-webfont.eot?#iefix') format('embedded-opentype'),
		 url('../../fonts/nobile/nobile-webfont.woff') format('woff'),
		 url('../../fonts/nobile/nobile-webfont.ttf') format('truetype'),
		 url('../../fonts/nobile/nobile-webfont.svg#NobileRegular') format('svg');
	font-weight: normal;
	font-style: normal;
}



html {
	width: 100%;
	margin: 0;
	padding: 0;
	overflow-y: scroll; /* Keeps page centred in all browsers regardless of content height */
	/*-webkit-text-size-adjust: 100%;*/ /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
	/*-ms-text-size-adjust: 100%;*/ /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
	min-width: 345px;
}
body {
	width: 100%;
	margin: 0;
	padding: 0; 
	background-image:url(http://www.hr-consultancy.com.sg/images/pri_bg.png);
}
#wrapperI{ /* outline: 1px solid #fff; */
	width: 100%;
	margin: 0;
	padding:0;
	float: left;
}
#wrapperII{ /* outline: 1px solid blue; */
	width: 100%;
	margin: 0;
	padding: 0;
	padding-bottom: 20px;
	display: block;
	float: left;
	background: #1e1f22;
}
.wrapperIII{/*outline: 5px solid blue;*/
	width: 97%;/* remove space on the right edge */
	margin: 0 auto;
}
#wrapperIV{ /* outline:5px solid blue; */
	display: block;
	width: 90%;
	float: left;
	margin: 5%;
}
#wrapper_slider{ /*outline: 5px solid #fff;*/
	display: none;
}
#hide_banner{
	display: none;
}

h1,h2,h3{text-align: center;}
/*make spacing infont first letter of paragragh */
p{ 

}
p.errors{
	padding-top: 50px;
	margin-left: 30%;
}
img {
	border: none;
}
hr {
	color: blue;
}
a { color: #fff;
}
a:link{ color:#fff;
}
a:visited{
}
a:hover{ color:#000; cursor:pointer; outline: none;
}
a:active{ color:#383838; outline: none;
}



/* -- Site Header -- */
/* Include Company Logo & Menu*/

#header { /*outline: 1px solid yellow; */
	width: 100%;
	display: block;
	float: left;
	padding-bottom: 20px;
}
#header a{
	color: #fff;
	text-decoration: none;
}
#header a:hover{
color: silver;
}

/* -- Company Logo -- */
#co_container{ border-bottom: 1.5px solid #080808;
	display: block;
	margin: 0 auto 0 auto;
	width: 100%;
	height: 110px;
	padding-bottom: 10px;
}
#co_container2{ /*outline: 1px solid blue;*/ /* align logo to center in mobile device*/
	display: block;
	width: 325px;
	margin: 0 auto;
}
#co1{ /*outline: 1px solid #fff;*/
	font-size: 105px;/* 85px; */
	font-family: 'Monotype Corsiva';
	height: 110px;
	width: 325px;
	position:absolute;
	transition: all 0.5s linear;
}
#co2{ /*outline:1px solid blue;*/
	font-size: 42px; 
	font-family: 'Monotype Corsiva';
	font-weight:bold;
	margin-top:-70px;
	padding-left:130px;
	transition: all 0.5s linear;
}
#co3{ /*outline:1px solid blue;*/
	font-size: 16px;
	font-family: 'Monotype Corsiva';
	margin-top: -10px;
	padding-left: 180px;
	transition: all 0.5s linear;
}

/* -- End of Company Logo -- */

/* -- SOCIAL MEDIA -- */
#hide_social_media_container{ /*outline: 1px solid yellow;*/
	display: none;
}
#hide_footer_social_media_container{/*outline: 1px solid yellow;*/
	display: block;
	padding-top: 10px;
	height: 30px;
}
/* -- END of SOCIAL MEDIA -- */

/* -- FRONTEND NAVIGATION BAR -- */
/*I need to try border-style: none; to remove white dot issue*/
/* - CONTAINERS - */
/* CONTAIN ALL MENUS */
#nav_container{ border: 3px solid #000;
	display: inline-block;
	width: 80%;
	margin: 0 10%;
	background-image:url(http://www.hr-consultancy.com.sg/images/pri_bg.png);
	color: #fff;
}
#nav{ border:2px solid #505050;
	list-style: none;
	margin:0;
	padding: 32px 5px 10px 10px;
	margin-top: -70px;
}
#nav_header{ /*outline: 1px solid #fff;*/
	font-size: 20px;
	display: block;
	padding: 10px 15px 10px 10px;
	margin: 0;
	cursor: pointer;
}
.nav_header_arrow_down{
	float:right;
	font-size: 14px;
	/*outline: 1px solid #fff;*/
	margin-top: 6px;
	margin-right: -3px;
}
#nav_container ul{
	margin: 0;
	padding: 0;
	line-height: 30px
}
#nav li ul li{/*outline:1px solid blue;*/
	margin-top: 5px;
	padding: 5px 0 0 0;
	font-size: 16px;
	display: none;
}
#nav li ul li ul li{ /*background: red;*/
	padding: 5px 0 0 0;
}
#nav li ul li ul li a{color: white;}
#nav li ul li ul li ul li a{color: #b0b0b0;}
#nav li ul li ul li span{ /*background: green;*/
	padding: 0 10px 0 5px;
}
#nav li ul li ul li ul li{ /*background: green;*/
	padding: 3px 0 0 0;
}
#nav li ul li ul li ul li span{ /*background: red;*/
	padding: 0 10px 0 25px;
}
#nav li ul li ul li ul li ul li{ /*background: blue;*/
	padding: 0px 0 0 0;
}
#nav li ul li ul li ul li ul li span{ /*background: blue;*/
	padding: 0 10px 0 45px;
}
#nav:hover li{
	display: block;
}
#nav a{/* outline:1px solid #fff;*/
	text-indent: 0;
	text-decoration: none;
	display: block;
	width: 100%;
	padding: 5px 0 5px 5px;
	margin-left: 0;
}
#nav a:hover{
	transition: all 0.3s linear;
	background: #000;
	color: #fff;
}
/* hightlight menu for current page */
a.current{
	background: #000;
	color: #fff;
}

/* -- End of Site Header -- */

#site_body {
	float:left;
	width: 100%;
	font-family: 'NobileRegular', Arial, 'sans serif';
	font-size:16px;
	color: #fff;
}
#col_1{ display: none;}


/* Price Table */
#price_container{ /*outline:5px solid #333537;*/
	width: 100%;
	display: block;
	padding-bottom: 100px;
}
#price_container_border{ outline:5px solid #333537;
	width: 80%;
	/*min-width: 597px;*/
	margin: 0 auto;
	display: block;
	background: #505050;
	text-align: center;
	padding: 0 0 10px 0;
}
.price_col{ outline: 5px solid #505050;
	/*width: 15%;*/
	width: auto;
	background: #505050;
	display: inline-block;
	text-align: center;
	margin-top: 5px;
	/*background-image:url(http://www.hr-consultancy.com.sg/images/pri_bg.png);*/
}
.price_col_hide{
	display: block;
	width: auto;
	background: #505050;
	display: inline-block;
	text-align: center;
	margin-top: 5px;
}
.price_inner_col{background: #1e1f22;
	padding: 5px 5px;
	display: inline-block;
	text-align: center;
	float: left;
}
.price_inner_col_side{outline: 5px solid #505050;
	background: #1e1f22;
	padding: 5px 10px;
	display: inline-block;
	float: left;
}
.price_row{ /*outline: 1px solid yellow;*/
	display: block;
	padding: 5px 10px;
}

/* Portfolio */
#portfolio_box{/*outline: 1px solid #fff;*/
	width: 100%;
}
#portfolio_box img{/*outline: 3px solid #1e1f22;*/outline:5px solid #333537;
	width: 100%;
	margin: 0 auto;
	display: block;background: #505050;
}
.portfolio_text{ /*outline: 1px solid #fff;*/
	text-align: center;
	display: block;
	text-decoration: underline;
	padding: 5px 0 40px 0;
}
#hide_slider{
	display: none;
}

/* Contact Us Form */
.formLayout{outline: 5px solid #333537;
	margin: 0 auto;
	display: block;
	width: 80%;
	min-width: 315px;
	padding:20px;
	background: #505050;
}
.message_box{/*outline: 1px solid yellow;*/
	margin: 0;
	padding-bottom: 10px;
	display: block;
	float: left;
	width: 100%;
}
h4{
	margin: 0;
	display: block;
}
.message_box p{ /*outline: 1px solid yellow;*/
	/*text-indent: 20px;*/
	margin: 0;
	/*float: left;*/
	display: block;
	width: 100%;
}
.fieldname{/*outline: 1px solid yellow;*/
	padding: 5px 0;
}
.service_type{/*outline: 1px solid #fff;*/
	padding: 5px 40px 5px 0;
}
.name{/*outline: 1px solid #fff;*/
	padding: 5px 110px 5px 0;
}
.mobile_num{/*outline: 1px solid #fff;*/
	padding: 5px 73px 5px 0;
}
.email{/*outline: 1px solid #fff;*/
	padding: 5px 113px 5px 0;
}
.company_name{/*outline: 1px solid #fff;*/
	padding: 5px 30px 5px 0;
}
.contact_person{/*outline: 1px solid #fff;*/
	padding: 5px 36px 5px 0;
}
.contact_num{/*outline: 1px solid #fff;*/
	padding: 5px 64px 5px 0;
}
.contact_email{/*outline: 1px solid #fff;*/
	padding: 5px 47px 5px 0;
}
.enquiry{/*outline: 1px solid #fff;*/
	padding: 5px 10px 5px 0;
}
.message{/*outline: 1px solid #fff;*/
	padding: 5px 10px 5px 0;
}
#name, #mobile_num, #email, #company_name, #contact_person, #contact_num, #contact_email, #service_type{
	width: 50%;
	min-width: 200px;
	font-size: 14px;
	color: #000;
}
#enquiry, #others, #improve, #feel{
	font-size: 14px;
	color: #000;
}
label{/*outline: 1px solid yellow;*/}
textarea{/*outline: 1px solid yellow;*/
	margin-top: 5px;
	width: 99%;
	height: 138px;
	display: block;
	color: #000;
}
.feedback_field{/*border: 1px solid red;*/ padding: 20px;}
.text1{/*width: 70%; */height: 25px}
.text2{/*width: 70%; */height: 69px}
.recaptcha_box{/*outline: 1px solid #fff;*/
	padding: 20px 0 30px 0;
	margin: 0 auto;
	width: 318px;
}
/*
 #recaptcha_challenge_image{
    margin: 0 !important;
    width: 100% !important;
    height: auto !important;
    }
    #recaptcha_response_field
    {
    margin: 0 !important;
    width: 100% !important;
    height: auto !important;
    }
    .recaptchatable #recaptcha_image {
    margin: 0 !important;
    width: 100% !important;
    height: auto !important;
    }
*/
/*
    .recaptchatable .recaptcha_r1_c1, 
    .recaptchatable .recaptcha_r3_c1, 
    .recaptchatable .recaptcha_r3_c2, 
    .recaptchatable .recaptcha_r7_c1, 
    .recaptchatable .recaptcha_r8_c1, 
    .recaptchatable .recaptcha_r3_c3, 
    .recaptchatable .recaptcha_r2_c1, 
    .recaptchatable .recaptcha_r4_c1, 
    .recaptchatable .recaptcha_r4_c2, 
    .recaptchatable .recaptcha_r4_c4, 
    .recaptchatable .recaptcha_image_cell {

    margin: 0 !important;
    width: 100% !important;
    background: none !important;
    height: auto !important;
    }
*/
/*
 #recaptcha_challenge_image{
        margin: 0 !important;
        width: 100% !important;
        }
        #recaptcha_response_field
        {
        margin: 0 !important;
        width: 100% !important;
        }
        .recaptchatable #recaptcha_image {
        margin: 0 !important;
        width: 100% !important;
        }
        .recaptchatable .recaptcha_r1_c1, 
        .recaptchatable .recaptcha_r3_c1, 
        .recaptchatable .recaptcha_r3_c2, 
        .recaptchatable .recaptcha_r7_c1, 
        .recaptchatable .recaptcha_r8_c1, 
        .recaptchatable .recaptcha_r3_c3, 
        .recaptchatable .recaptcha_r2_c1, 
        .recaptchatable .recaptcha_r4_c1, 
        .recaptchatable .recaptcha_r4_c2, 
        .recaptchatable .recaptcha_r4_c4, 
        .recaptchatable .recaptcha_image_cell {

        margin: 0 !important;
        width: 100% !important;
        background: none !important;
        }
*/

.lowerButtonLayout{/*outline: 1px solid yellow;*/
	float: right;
	display: block;
	margin-top: -20px;
}
.lowerButtonLayout input{ border: 2px solid #1e1f22;
	background-color: gray;
	font-family: 'NobileRegular', 'sans serif';
	font-size: 16px;
	color: #fff;
	background: #1e1f22;
	background: #1f2022;
	background: #333437;
}
.lowerButtonLayout input:hover{ border: 2px solid #333437;
	background: #1e1f22;
}

/* Feedback Form */
	.formLayout ol li ul{
		margin-left: -40px;
	}
	.formLayout ol li ul li{
		list-style: none;
	}

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


/* styles for 901px - 1200px */

@media screen 
and (min-width : 901px) {

	#wrapperI{}
	#wrapperII{ /* outline: 5px solid blue; */
		height: 100px;
		position: fixed;
		z-index: 999;
	}
	.wrapperIII{ /* outline: 5px solid blue; */
		width: 80%;/*width: 1200px;*/
		margin: 0 auto;
	}
	#wrapperIV{ /* outline:5px solid yellow; */
		width: 100%;
		margin: 0;
		margin-top: 10px;
		padding-bottom: 10px;
	}
	#wrapper_slider{ /* outline: 5px solid #fff; */
		width: 100%;/*width: 1200px;*/
		margin: 0 auto;
		/*height: 312px;*/
		display: inline-block;
		padding: 130px 0 0 0;
		
	}

	/* -- Site Header -- */
	/* Include Company Logo & Menu*/
	h1, h2, h3{text-align: left;}
	#header { /* outline: 1px solid yellow; */
		height: 100px;
		width: 45%;
	}


	/* -- Company Logo -- */
	
	#co_container{/*outline: 5px solid red;*/
		border-bottom: 0px solid #080808;
		height: auto;
		width:auto;
	}
	#co_container2{ /*outline: 5px solid #fff;*/ /* align logo to left in desktop */
		float: left;
		width: 0;
	}
	
	
	/* -- SOCIAL MEDIA -- */
	
	#hide_social_media_container{
		background: #1e1f22;
		display: inline-block;
		margin-top: 130px;
		height: 186px;
		float: right;
		/*width: 26%;*/
		width: 40px;
		/*-webkit-border-radius:	0.5em 0 0 0.5em;*/	/*for Chrome and Safari*/
		/*-moz-border-radius: 	0.5em 0 0 0.5em;*/	/*for Firefox*/
		/*-khtml-border-radius: 	0.5em 0 0 0.5em;*/	/*for Konquerer*/
		border-radius: 			0.5em 0 0 0.5em;
	}
	
	.social_media_container{ /*outline: 1px solid gray;*/
	float: right;
	margin-top: -18px;
	padding: 4px 0 0px 1px;
	}
	#hide_footer_social_media_container{display: none;}
	/*
	.social_media_container .st_facebook_large{}
	.social_media_container .st_facebook_large .stButton{}
	.social_media_container .st_facebook_large .stButton .stLarge{}
	.social_media_container .st_facebook_large .stButton  img{}
	.social_media_container .st_twitter_large{}
	.social_media_container .st_twitter_large .stButton{}
	.social_media_container .st_twitter_large .stButton .stLarge{}
	.social_media_container .st_twitter_large .stButton  img{}
	.social_media_container .st_linkedin_large{}
	.social_media_container .st_linkedin_large .stButton{}
	.social_media_container .st_linkedin_large .stButton .stLarge{}
	.social_media_container .st_linkedin_large .stButton  img{}
	.social_media_container .st_email_large{}
	.social_media_container .st_email_large .stButton{}
	.social_media_container .st_email_large .stButton .stLarge{}
	.social_media_container .st_email_large .stButton  img{}
	.social_media_container .st_sharethis_large{}
	.social_media_container .st_sharethis_large .stButton{}
	.social_media_container .st_sharethis_large .stButton .stLarge{}
	.social_media_container .st_sharethis_large .stButton  img{}
	*/
	
	/* -- END of SOCIAL MEDIA -- */


	/* -- FRONTEND NAVIGATION BAR -- */
	/*I need to try border-style: none; to remove white dot issue*/
	/* - CONTAINERS - */
	/* CONTAIN ALL MENUS */
	#nav_container{ /*outline: 1px solid red; */
		border: 0px solid #000;
		width: 55%;
		margin: auto;
		margin-top: 60px;
		background-image:none;
	}
	#nav{
		border: 0px solid #505050;
	}
	#nav span{
		display: none;/* Hide Navigation, bullets n arrows*/
	}
	#nav:hover li{
		display: inline-block;
	}
	
	#nav li {/*Navigation*/}
	#nav  li ul li{/*Home, Abt Us, Our Sve, Contact Us*/
		outline: 2px solid #505050;
		display: inline-block;
		font-size: 16px;
		padding: 0 3px;
	}
	#nav li ul li ul li{/*EA, Web Design*//*outline: 1px solid yellow;*/
		outline: 0px solid #505050;
	}
	#nav li ul li ul li ul{
		padding: 0px 0 0 0;
	}
	#nav  li ul li ul li ul li{/*Recruitment, Wk Pass App n renewal, PR App*/
		/*outline: 1px solid yellow;*/
		width: 100%;
		font-size: 16px;
		padding: 0px 0 0px 0;
		margin: 0;
	}
	#nav li ul li ul li ul li ul li{/*EP, SP, WP, LTVP, DP*/
		/*outline: 1px solid yellow;*/
	}
	#nav a{ /*outline: 1px solid #fff;*/
		padding: 6px 3px;
		margin-bottom: -2px;
		margin-left: -2px;
	}
	#nav a:hover{
		background: #000;
		color: #fff;
	}
	/* styling drop down menu */
	#drop_down_list:hover #drop_down{/*outline: 1px solid yellow;*/
		display: block;
		position: absolute;
		width: 650px;
		background: #1e1f22;
		margin-top: 2px;
		margin-left: -380px;
		padding: 10px;
	}
	#drop_down_list span {display: inline-block;}
	#drop_down_list ul li ul li{/*outline: 1px solid yellow;*/
		display: block;
		padding: 0;
		margin: 0;
	}
	#drop_down{ 
		display: none;
	}
	#drop_down a{outline: 0px solid #1e1f22;
		padding: 5px 0 5px 5px;
		margin: 0;
		color: #b0b0b0;
	}
	.hide_sub_menu_col1{/*outline: 1px solid #fff;*/
		width: 320px;
		display:block;
		vertical-align: top;
		padding: 20px 10px 10px 20px;
	}
	.col_box{
		padding-top: 10px;
		margin-left: 20px;
	}
	.hide_sub_menu {/* outline: 1px solid blue;*/
		/*display: none;*/
		display: block;
	}
	.hide_sub_menu:hover{
		position: relative;
	}
	/* End of styling drop down menu */
	
	/* styling drop down menu - Contact Us */
	#drop_down_list1:hover #drop_down1{/*outline: 1px solid yellow;*/
		display: block;
		position: absolute;
		width: 326px;
		background: #1e1f22;
		margin-top: 2px;
		margin-left: -164px;
		padding: 10px;
	}
	#drop_down_list1 span {display: inline-block;}
	#drop_down_list1 ul li ul li{/*outline: 1px solid yellow;*/
		display: block;
		padding: 0;
		margin: 0;
	}
	#drop_down1{ 
		display: none;
	}
	#drop_down1 a{outline: 0px solid #1e1f22;
		padding: 5px 0 5px 5px;
		margin: 0;
		color: #b0b0b0;
	}
	.hide_sub_menu_col2{/*outline: 1px solid #fff;*/
		width: 320px;
		display:block;
		vertical-align: top;
		padding: 20px 10px 10px 20px;
	}

	/* End of styling drop down menu - Contact Us */
	
	/* -- End of Site Header -- */

	/* Banner */
	
	#hide_banner{ border: 5px solid #333537;
		width: 100%;
		display: inline-block;
		background: #505050;
	}
	#banner_box{/* outline: 1px solid yellow;*/
		width: 100%;
		display: block;
	}
	#banner_box img{/*outline: 1px solid yellow;*/
		width: 100%;
		margin: 0 auto;
		display: block;
	}
	.banner_text{ /*outline: 1px solid yellow;*/
		text-align: center;
		padding: 5px 0;
		font-family: 'NobileRegular', 'sans serif';
		font-size:16px;
		color: #fff;
	}
	#banner_button_wrapper{ /*outline: 1px solid yellow;*/
		display: inline-block;
		float: right;
		margin-top: -27px;
		padding-right: 7px;
	}
	#banner_button_box{/* outline: 2px solid red;*/
		display: inline;
		margin: 0 auto;
		text-decoration: none;
	}
	.banner_button{ border: 2px solid #1e1f22;
		margin: 0;
		background: #333537;
		padding: 0;
		display: inline-block;
		border-radius: 3px;
	}
	.banner_button:hover{ border: 2px solid #333537;
		background: #1e1f22;
	}
	.banner_button a{ /*outline: 1px solid red;*/
		margin: 0;
		display: block;
		text-decoration: none;
		padding: 0 5px;
		
	}
	/*
	.banner_button_play{ border: 2px solid #1e1f22;
		margin: 0;
		background: #333537;
		padding: 0;
		display: inline-block;
	}
	.slider_button_play:hover{border: 2px solid #333537;
		background: #1e1f22;
	}
	.slider_button_play a{
		display: block;
		text-decoration: none;
		padding: 0 13px;
		font-size: 20px;
	}
	*/
	
	/* -- End of Banner -- */
	
	/* - Body - */
	
	/* - Side Navi - */
	#col_1{ border: 5px solid #333537;
		display: inline-block;
		vertical-align: top;
		width: 30%;
		margin: 0;
		padding: 10px;
		background: #505050;

	}
	#col_1 div{ /*color:yellow;*/
		font-size:20px;
		background-color: #1f2022;
		float:left;
		width:100%;
		text-align:center;
		padding: 5px 0;
		/*margin-left: -30px;*/
		/*text-align: center;*/
	}
	#col_1 ul{color:#b0b0b0;
		margin:0;
		padding:0;
		display:inline-block;
		padding: 10px 0;
		font-size:16px;
		list-style: none;
	}
	.col_1_menu_header{
		font-weight: bold;
	}
	#col_1 ul li{
		margin-top: 5px;
	}
	#col_1 ul li a{/*outline:1px solid #fff;*/
		font-size:14px;
		list-style: none;
		padding: 3px 10px;
		text-decoration: none;
	}
	#col_1 ul li a:hover{
		/*background: #1f2022;*/
		color: #888888;
	}
	#col_1 .arrow_right{/*outline:1px solid #fff;*/
		margin-left: 20px;
	}
	#col_1 span{/*outline:1px solid #fff;*/
		font-size: 14px;
		margin-left: 8px;
	}
	/* - End of side navi - */
	
	/* - Content - */
	#col_2{/* outline:1px solid #fff;*/
		display: inline-block;
		vertical-align: top;
		width: 58.2%;/*57.4%;*/
		padding: 0 2% 2% 5%;
	}
	#col_2 h2, #col_2 h3{text-decoration: underline;}
	#col_2_content{/* outline:1px solid #fff;*/
		display: inline-block;
		float: left;
		width: 100%;
	}
	#col_2_content a{color: #d0d0d0;}
	#col_2_content a:hover{color: #b0b0b0;}
	
	/* Price Table */
	#price_container{ /*outline:5px solid #333537;*/
		width: 100%;
		display: block;
		float: left;
	}
	#price_container_border{ outline:5px solid #333537;
		width: 579px;
		display: block;
		background: #505050;
		text-align: center;
		padding: 0 0 10px 0;
		float: left;
	}
	.price_col{ outline: 5px solid #505050;
		/*width: 15%;*/
		background: #505050;
		display: inline-block;
		text-align: center;
		float: left;
		/*background-image:url(http://www.hr-consultancy.com.sg/images/pri_bg.png);*/
	}
	.price_col_hide{ outline: 5px solid #505050;
	/*width: 15%;*/
	width: auto;
	background: #505050;
	display: inline-block;
	text-align: center;
	margin-top: 5px;
	display: none;
}
	.price_inner_col{background: #1e1f22;
		padding: 5px 5px;
		display: inline-block;
		text-align: center;
		float: left;
	}
	.price_inner_col_side{outline: 5px solid #505050;
		background: #1e1f22;
		padding: 5px 10px;
		display: inline-block;
		float: left;
	}
	.price_row{ /*outline: 1px solid yellow;*/
		display: block;
		padding: 5px 10px;
	}
	
	/* Portfolio */
	#portfolio_box{ display:none; }
	#hide_slider{border: 5px solid #333537;
		display: block;
		background: #505050;
		width: 100%;
	}
	#slider_box{/* outline: 1px solid yellow;*/
		width: 100%;
		display: block;
	}
	#slider_box img{/*outline: 1px solid yellow;*/
		width: 100%;
		margin: 0 auto;
		display: block;
	}
	.slider_text{/*outline: 1px solid yellow;*/
		text-align: center;
	}
	#slider_button_wrapper{/*outline: 1px solid yellow;*/
		display: block;
		margin: 0;
		padding: 25px 0;
	}
	#slider_button_box{/* outline: 2px solid red;*/
		display: block;
		width: 124px;
		margin: 0 auto;
		text-decoration: none;
		padding-left: 5px;
	}
	.slider_button{ border: 2px solid #1e1f22;
		margin: 0;
		background: #333537;
		padding: 0;
		display: inline-block;
		vertical-align: bottom;
	}
	.slider_button:hover{ border: 2px solid #333537;
		background: #1e1f22;
	}
	.slider_button a{ /*outline: 1px solid red;*/
		margin: 0;
		display: block;
		text-decoration: none;
		padding: 0 10px;
		font-size: 20px;
	}
	.slider_button_play{ border: 2px solid #1e1f22;
		margin: 0;
		background: #333537;
		padding: 0;
		display: inline-block;
	}
	.slider_button_play:hover{border: 2px solid #333537;
		background: #1e1f22;
	}
	.slider_button_play a{/*outline: 1px solid red;*/
		display: block;
		text-decoration: none;
		padding: 0 13px;
		font-size: 20px;
	}
	
	/* Contact Us Form */
	.formLayout{
		width: 100%;
		padding: 12px 20px 20px 20px;
	}
	
	/* - End of content - */
	
	/* - End of body - */
	
	/*- Footer - */
	#footer_navi{outline: 1px solid #fff;
		display: none;
	}
}

@media screen 
and (min-width : 1250px) { /* keep logo and navi in the center */
	.wrapperIII{ /* outline: 5px solid blue; */
		width: 1100px;
		margin: 0 auto;
	}
	#wrapperIV{ /* outline:5px solid red; */
		width: 100%;
		/*margin: 0 auto;*/
	}
	#wrapper_slider{ /* outline: 5px solid red; */
		width: 1100px;
		margin: 0 auto;
	}
	#col_2{ /*outline:1px solid #fff;*/
		width: 59.8%;
	}
}


#footer {  border-top: 20px solid #333437; 
	float:left;
	width: 100%;
	font-family: 'NobileRegular', 'sans serif';
	font-size:16px;
	text-align: center;
	color: #fff;
	background: #1f2022;
}
#footer_navi{/*outline: 1px solid #fff;*/
	padding: 10px;
	margin: 0;
}
#footer_navi ul{
	padding: 0;
	margin: 0;
}
#footer_navi ul li{
	padding: 5px 0 5px 0;
	margin: 0;
}
.footer_navi_header{
	border-bottom: 1px dashed #000;
	padding: 20px 0 5px 0;
	font-weight: bold;
}
#footer_navi li{list-style: none;}
#footer_navi a{
	text-decoration: none;
	padding: 0 10px 3px 10px;
	border-radius: 25px;
}
#footer_navi a:hover{
	background-image:url(http://www.hr-consultancy.com.sg/images/pri_bg.png);
	color: #fff;
}
#footer_navi_col1{/*outline: 1px solid red;*/}
#footer_navi_col2{/*outline: 1px solid yellow;*/}
#footer_navi_col3{/*outline: 1px solid blue;*/}