/***********************************************************************	

	STYLES FOR HONDA.COM.MY - SERVICES
	Author: AGENDA Malaysia
	Version: 
	Last Modified: 
	
	File Contents: 
	- Backgrounds
	- Font Styles
	- Custom Layout

***********************************************************************/



/* Backgrounds
-------------------------------------------------*/

body.content #header {
height: 161px;
background: url('../images/services/header_pic.jpg') no-repeat 50% 45px;
}

#main {
background-image:url(../images/bg_gradient.jpg);
background-repeat:repeat-x;
background-position:0px 5px;
}

body.QM #header {
height: 161px;
background: url('../images/services/QM/header_pic.jpg') no-repeat 50% 45px;
}

body.mm2h #header{
	height: 161px;
	background: url('../images/services/mm2h/header_pic.jpg') no-repeat 50% 45px;
}


body.parts #header {
height: 161px;
background: url('../images/services/parts/header_pic.jpg') no-repeat 50% 45px;
}

body.merchandise #header {
height: 161px;
background: url('../images/services/merchandise/header_pic.jpg') no-repeat 50% 45px;
}

body.hondaowners #header {
	height: 161px;
	background: url('../images/services/hondaowners/header_pic.jpg') no-repeat 50% 45px;
	z-index:20;
}

body.hybridmaintenance #header {
	height: 161px;
	background: url('../images/civichybrid/inside_concept_banner.jpg') no-repeat 50% 45px;
	z-index:20;
}

body.odysseymaintenance #header {
	height: 161px;
	background: url('../images/odyssey/inside_concept_banner.jpg') no-repeat 50% 45px;
	z-index:20;
}

#sec_navibar {
	background:url('../images/default_2nd_tier_button_bg.png') repeat-x;
	/*height: 50px;*/
	border-bottom: none;
}


#bottom_ads {
	background: #000 url('../images/services/bottom_ads_panel_bg.jpg') repeat-x;
}


/* Font Styles
-------------------------------------------------*/

h1, h2, h3, h5 { color: #e91f30; }
h2 { line-height:20px; }
h4 { color: #e91f30; font-size:12px; padding-bottom:10px; }
a { color:#e91f30; }
a:hover { color:#e91f30; }



/* Custom Layout
-------------------------------------------------*/

.overview #sec_navibar,
.gallery #sec_navibar {
	height: 38px;
	border-bottom: 0;
}

.bp_block {
float: left;
}

#bp1 	{ width: 250px; padding-right: 30px; }
#bp2 	{ width: 120px; padding-right: 10px; }
#bp3 	{ width: 160px; padding-right: 10px; }
#bp4 	{ width: 125px; padding-right: 10px; }
#bp5 	{ width: 110px; padding-right: 10px; }
#bp6 	{ width: 125px; }




/* With Dreams form
-------------------------------------------------*/

form p {
margin-bottom: 5px;
}

#update_profile td {
padding: 0;
}

#update_profile .error_message { color:#FF0000; font-size:10px; margin-bottom:5px; margin-left:5px; }

#update_profile fieldset {
background: #EFEFEF;
margin-bottom: 20px;

}

input.checkbox {
vertical-align: middle;
}

input.radio {
vertical-align: text-bottom;
}

#update_profile .faux_legend {
background: #666666;
color: #FFFFFF;
font-size: 16px;
display: block;
padding: 5px;
margin: 0 0 10px;
}

#update_profile .field:after,
#update_profile .input_group:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

#update_profile .field,
#update_profile .input_group {
	display: inline-block;
}

* html #update_profile .field
* html #update_profile .input_group {
	height: 1%;
}

#update_profile .field {
	display: block;
	margin-bottom: 8px;
}

#update_profile .input_group {
display:block;
}

#update_profile .description {
font-size: 9px;
margin: 0 0 0 5px;
}

#update_profile label {
display: block;
}

#update_profile .text {
width: 240px;
}

#update_profile .select {
width: 245px;
padding: 2px;
}

#update_profile select#title {
width: 80px;
}

#update_profile select#nationality {
width: 120px;
}

#profile_ic,
#profile_id {
width: 180px;
float: left;
}

#profile_idconfirm {
width: 100px;
float: left;
}

#update_profile input#idNumber {
width: 138px;
}

#update_profile #newICNumber1 { width: 50px; }
#update_profile #newICNumber2 { width: 20px; }
#update_profile #newICNumber3 { width: 40px; }

#update_profile #contactNoMobilePrefix { width:70px; }

#update_profile #contactNoHomePrefix,
#update_profile #contactNoOfficePrefix {
width: 25px;
}

#update_profile #contactNoMobile,
#update_profile #contactNoHome,
#update_profile #contactNoOffice {
width: 128px;
}

#update_profile input.profile_regno {
width: 150px;
}

tr.vehicle td {

}

.vehicle_regno,
.vehicle_model,
.vehicle_variant {
float: left;
margin-right: 20px;
}

.vehicle_variant {
margin-right: 0;
}

#profile_yourvehicle label, #subscription_details label { margin-left:10px; }
#profile_yourvehicle p, #subscription_details p { margin-left:10px; }
#profile_addvehicle { margin-left:10px; }


/* CSS for parts
-------------------------------------------------*/
#listtable { padding-left:5px; }
#listtable li { padding-bottom:5px; list-style-position:outside; }
.box { border:#666666 1px dotted; }
.leftpad { padding-left:10px; }
.greybox {  background:#e4e4e4; height:400px; }
.illustration_text { color:#333333; font-size:10px; }

#benefits { padding-left:5px; width:200px; font-size:11px; }
#benefits li { padding-bottom:2px; list-style-position:outside; }

#cleaner_title { padding-left:0px; }
#benefits_cleaner { padding-left:10px; width:130px; font-size:10px; }
#benefits_cleaner li { padding-bottom:2px; list-style-position:outside; }
.beforeafter { /*padding-left:30px;*/ display:inline; }
.beforeafter_text { font-size:10px; color:#666666; }

.redbartitle { background:#e91f30; color:#FFFFFF; font-size:12px; height:20px; padding-top:5px; padding-bottom:5px; }
.bottomborder { border-bottom:#666666 1px dotted; padding-bottom:15px; padding-top:15px; }
.bottompad { border-bottom:#666666 1px dotted; padding-top:15px; padding-bottom:10px; }
.alt { background-color:#f2f2f2; }
.bottompad h5 { color:#333333; padding-left:15px; }
.bottomborder h1 { line-height:25px; width:190px; padding-left:15px; color: #e91f30; }
.bottomborder h5 { color:#333333; padding-left:15px; }
.bottomborder li { padding-bottom:5px; list-style-position:outside; line-height:13px; }
.advantage_title { color:#333333; }

.plugslist li { padding-bottom:5px; list-style-position:outside; line-height:13px; }
.fueltesttext { font-size:10px; color:666666; }
.greybg { background:#ededed; }
.padalign { padding-right:10px; padding-top:10px; }
.leftalign { padding-left:10px; }


/* CSS for Merchandise
-------------------------------------------------*/
.lowerdottedline { border-bottom:#666666 dotted 1px; }
.upperpad { padding-top:30px; }
.desctext { font-size:12px; color:#666666; }
.pricetext { font-size:12px; color:#e91f30; }
.tnctitle { color:#FFFFFF; padding-left:10px; font-size:16px; }
.redupper { background:url(../images/services/merchandise/services-merchandise-redupper.jpg); background-repeat:no-repeat; background-color:#ea1c1c;}
.redlower { background:url(../images/services/merchandise/services-merchandise-redlower.jpg); background-repeat:no-repeat; }
.redbg { background-image:url(../images/services/merchandise/services-merchandise-redbg.jpg); background-repeat:repeat-x; height:439px; background-color:#ea1318; }
.redbg ul { width:265px; padding-left:15px; color:#FFFFFF; }
.redbg li { padding-bottom:5px; list-style-position:outside; }



/* CSS for Honda Owners
-------------------------------------------------*/
.greytitle { color:#666666; }
.tnc ol { padding-left:5px; }
.tnc li { padding-bottom:5px; list-style-position:outside; }



/* CSS for MM2H
-------------------------------------------------*/
.fullredbg { background-color:#e71a01;}
.fullredbg ol { margin:10px 10px 10px 20px; color:#FFFFFF; }
.fullredbg li { padding-bottom:5px; list-style-position:outside; }
.fullredbg h4 { color:#FFFFFF; margin-left:10px; }
.mm2hmodels ul { padding-bottom:25px; padding-top:25px; }
.mm2hmodels li { display:inline; padding-right:15px; }
.mm2hmodels li a { color:#333333; font-size:90% !important;}
.mm2hmodels li a:hover { color:#e91f30; }
.mm2hmodels li.active a { font-weight:bold; color:#e91f30; font-size:90% !important; }
.tabletitle { background:#e91f30; color:#FFFFFF; }
.alttext { color:#e91f30; }
.spacing { width:350px; }
.mm2hprice th { width: 380px; border-bottom: 1px solid #cccccc; padding:10px 10px;} 
.mm2hprice td { border-bottom: 1px solid #cccccc; padding:10px 10px; }
.notetable ol { padding-left:10px; }
.notetable li { padding-bottom:2px; list-style-position:outside; padding-left:5px;  }
.language a { color:#333333; }
.language a:hover { color:#e91f30; }
.language a.active { color:#e91f30; }
.redasterisk { color:#e91f30; }



/* MM2H CONTACT US FORM
-------------------------------------------------*/

#contact_us td { padding: 0; }
#contact_us fieldset { background: #EFEFEF; margin-bottom: 20px;}
#contact_us .error_message { color:#FF0000; font-size:10px; margin-bottom:5px; margin-left:5px; }

input.checkbox { vertical-align: middle; }
input.radio { vertical-align: text-bottom; }
#contact_us .faux_legend { background: #666666; color: #FFFFFF; font-size: 16px; display: block; padding: 5px; margin: 0 0 10px; }

#contact_us .field:after,
#contact_us .input_group:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

#contact_us .field,
#contact_us .input_group {
	display: inline-block;
}

* html #contact_us .field
* html #contact_us .input_group {
	height: 1%;
}

#contact_us .field { display: block; margin-bottom: 8px; }
#contact_us .description { font-size: 9px; margin: 0 0 0 5px; }

#contact_us label { display:block; margin-right:40px; margin-top:3px; }
#contact_us .text { width:240px; }
#contact_us .textbox { width:240px; height:120px; }
#contact_us .select { width:245px; padding:2px; }
#contact_us select#title { width:80px; }
#contact_us select#nationality { width: 120px;}
#contact_us input#age { width:100px; }

#profile_ic,
#profile_id {
width: 180px;
float: left;
}

#contact_us #contactNoHomePrefix { width:50px; }

#contact_us #contactNoMobilePrefix,
#contact_us #contactNoOfficePrefix {
width: 70px;
}

#contact_us #contactNoMobile,
#contact_us #contactNoHome,
#contact_us #contactNoOffice {
width: 105px;
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
	position: fixed;
	z-index:100;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
	background-color:#000;
	filter:alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window {
	position: fixed;
	background: #ffffff;
	z-index: 102;
	color:#000000;
	display:none;
	border: 4px solid #525252;
	text-align:left;
	top:50%;
	left:50%;
}

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
	display:block;
	margin: 15px 0 0 15px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
}

#TB_caption{
	height:25px;
	padding:7px 30px 10px 25px;
	float:left;
}

#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
}

#TB_closeAjaxWindow{
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
}

#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
}

#TB_title{
	background-color:#e8e8e8;
	height:27px;
}

#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
	padding:15px;
}

#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
}

#TB_load{
	position: fixed;
	display:none;
	height:13px;
	width:208px;
	z-index:103;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect{
	z-index:99;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	filter:alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	height:100%;
	width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
	_margin-bottom:1px;
}




.nextbtn { font-weight:bold; color:#ff0000; font-size:11px;}
.nextbtnlink {color:#666666;}
.nextbtnlink a:hover {text-decoration:underline; color:#666666;}