/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.net/yui/license.txt version: 2.3.0


Whitespace Reset 
----------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup,sub{vertical-align:text-top;}sub{vertical-align:text-bottom;}input, textarea, select{font-family:inherit;font-size:inherit;font-weight:inherit;} table {font-size:inherit;font-size:100%;}  pre,code,kbd,samp,tt {font-family:monospace; line-height:99%;}

/* Reset Whitespace 
-------------------*/
strong,th,h1,h2,h3,h4,h5,h6{ font-weight: bold; }h1,h2,h3,h4,h5,h6{padding: 1em 0;}em{font-style: italic;}ul li{list-style: disc;}ol li{list-style: decimal;}

body{
	color:#2F2F2F; background:#FFF; font-family: arial,helvetica,clean,sans-serif; font-size: 100%;
} 

/* Outlines (for development) -  :temp note: Delete before deployment
--------------------------------*/
/* #wrapper{
	outline: black 1px dashed; border: #000 1px dashed; background-color: #F2F2F2;
}

#content-wrapper,
#sub-wrapper{
	outline: #808000 1px dashed; background-color: #E0E0E0;
}

#header{
	outline: #ff0 1px solid; background-color: #F2F4C6;
}
 
#section-navigation,
#main-navigation{
	outline: #008000 1px solid; background-color: #E1FFE1;
}	
 
#content{
	outline: #00f 1px solid; background-color: #D2E4FF; font-size: .75em;
} 
 
#footer{
	outline: #f0f  1px solid; background-color: #FFCEFF; clear: both;
}*/
 
 
/*Board members*/
#content .board-member h3{
	color: #000; /*margin: 17px 0 20px 130px;*/ padding: 17px 0 20px 130px;
}

#content .board-member p{
	margin: 0 0 0 130px; color: #000; padding: 0; 
}


.John-Ridding{
	 background: url(i/board_members/John_Ridding.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Ben-Hughes{
	 background: url(i/board_members/Ben_Hughes.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Lionel-Barber{
	 background: url(i/board_members/Lionel_Barber.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Caspar-de-Bono{
	 background: url(i/board_members/Caspar_De_Bono.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Frances-Brindle{
	 background: url(i/board_members/Frances_Brindle.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Rob-Grimshaw{
	 background: url(i/board_members/Rob_Grimshaw.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Emma-Gilpin-Jacobs{
	 background: url(i/board_members/Emma_Gilpin_Jacobs.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Scott-Henderson{
	 background: url(i/board_members/Scott_Henderson.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Sarah-Hopkins{
	 background: url(i/board_members/Sarah_Hopkins.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Steve-Howe{
	 background: url(i/board_members/Steve_Howe.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Yasmin-Jetha{
	 background: url(i/board_members/Yasmin_Jetha.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Angela-Mackay{
	 background: url(i/board_members/Angela_Mackay.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.Greg-Zorthian{
	 background: url(i/board_members/Greg_Zorthian.jpg) top left no-repeat; border-right: 2px solid #fff;
}

.board-member{
	min-width: 264px; min-height: 115px; background-color: #eee; border-bottom: 2px solid #fff; float: left;
} 

 
/*  Generic styles
-------------------*/  
.hide{
	position: absolute; top: -1000em;
}

/* Clearing :note: In IE < v.7 This relies on the Holly Hack being prescent ie specific css file*/
.clear:after {
	content: "."; height: 0; visibility: hidden; display: block; clear: both;
}

strong{
	font-weight: bold;
}


body{
	background: #FDD6B9 url(i/body-bg.gif) repeat-y 0px 0px;  	
}

/* Wrappers
----------------------------*/ 
#wrapper{
	position: relative; width: 1021px; border-left: 7px #fff solid; /*background: #fff url(i/wrapper-bg.gif) repeat-y 721px 0px;*/
}

#sub-wrapper{
	width: 722px; float: left; background-color: #fff;
}

	
/* Header
----------------------------*/ 
#header{
	height: 153px; width: 713px; position: relative; background: url(i/ftcareers-logo.gif) no-repeat 0px 0px;
}

#header a.ft-logo{
	position: absolute; display: block; width: 230px; height: 103px; top: 0x; left: 0px;
}

/* Navigation
----------------------------*/

/*Main
------*/
#main-navigation{
	/*padding-left: 166px;*/ padding-top: 107px;  
}

#main-navigation ul{
	padding-left: 166px; background-color: #FDD6B9;
}

#main-navigation li{
	float: left; list-style-type: none; 
}

#main-navigation li.about{
	width: 116px;
}

#main-navigation li.life{
	width: 114px;
}

#main-navigation li.location{
	width: 153px;
}

#main-navigation li.opportunities{
	width: 163px;
}


#main-navigation a:link, 
#main-navigation a:visited{
	text-transform: uppercase; color: #000; font-size: .8em; font-weight: bold; text-decoration: none; display: block; padding: 5px 0px 12px 7px; background-color: #FDD6B9; border-left: 1px solid #fff; 
}

#main-navigation a:focus, 
#main-navigation a:hover,
#main-navigation a:active{
	
}

#main-navigation a.selected{
	
}

/*Section
------*/
#section-navigation{
	width: 166px; float: left; background-color: #fff;
}

#section-navigation li{
	border-bottom: 1px solid #fff;
}

#section-navigation a:link, 
#section-navigation a:visited{
	font-size: 0.75em; background-color: #FDD6B7; display: block; color: #000; padding: .2em 0 .2em 20px; text-decoration: none;
} 

#section-navigation a.selected{
	background-color: #FFF; 
}

#section-navigation a:focus, 
#section-navigation a:hover,
#section-navigation a:active{
	background-color: #000; color: #fff;
}



#section-navigation h3 a:link, 
#section-navigation h3 a:visited{
	font-size: 1em; background-color: #FAF1E2; display: block; color: #000; padding: 0; text-decoration: none;
} 

#section-navigation h3 a:focus, 
#section-navigation h3 a:hover,
#section-navigation h3 a:active{
	background-color: #FAF1E2; text-decoration: underline;
}



#section-navigation ul{
	padding-bottom: 22px;
}

#section-navigation h3{
	margin-bottom: 6px; background: #FAF1E2 url(i/black-arrow.gif) no-repeat 5px 50%; font-size: 0.75em; padding: .2em 20px; font-weight: normal;
}


#section-navigation a.virtual-tour{
	background: url(i/virtualtour-link.gif) no-repeat; width: 166px; height: 133px; display: block; padding: 0;	
}


#section-navigation ul#ftblogs{
	padding-bottom: 17px;
}

#section-navigation ul#share-links li{
	padding:0pt 0pt 14px; text-align:center; list-style: none;
}

#section-navigation ul#share-links li a:link,
#section-navigation ul#share-links li a:visited,
#section-navigation ul#share-links li a:hover,
#section-navigation ul#share-links li a:active{
	background-color: #fff; padding: 0; 
}

/* footer-share-links */
#footer-share-links{
	display: none;
}

body.default #footer-share-links{
	display: block;
}

#footer ul{ /*lets the social media line up beside teh footer links*/ 
	float: left;
}

#footer-share-links ul{
	/* float: right; background: #0ff; */
}

ul#footer-share-links li{
	padding:0pt 0pt 14px; text-align:center; list-style: none; float: left;
}

ul#footer-share-links li a:link,
ul#footer-share-links li a:visited,
ul#footer-share-links li a:hover,
ul#footer-share-links li a:active{
	background-color: #fff; padding: 0; 
}


/* Location map 
----------------*/
#location-map{
	width: 532px; height: 240px; background: url(../ft/i/global_FT_map.gif) no-repeat; position: relative;
}

#location-map a.office{
	display: block; position: absolute; width: 30px; height: 30px; /*outline: #f00 dashed 1px; */
}

#location-map a.london{
	left: 94px; top: 22px;
}

#location-map a.london-europe{
	right:67px; top:56px;
}

#location-map a.new-york{
	left: 5px; top:48px;
}

#location-map a.hong-kong{
	left: 207px; top: 76px;	
}


/* Content
----------------------------*/
#content{
	margin-left: 180px; width: 533px; background-color: #fff; font-size: .75em;
	padding-right: 8px;
}

/* content area defaults */
#content h1{
	font-weight: bold; margin: 0.5em 0 0.5em 0; background-color: #eee; padding: .2em .4em; margin-top: 0;
}

#content h2{
	font-size: 120%; margin: 0.5em 0 0.5em 0;
}

#content p {
	margin: 1em 0; padding: 0 .4em;
}

#content  ul, 
#content ol {
	margin: 1em 0; margin-left: 40px;
}

#content a:link, 
#content a:visited{
	text-decoration:underline; color: #105C96;
}

#content a:focus, 
#content a:hover,
#content a:active{
	text-decoration: none;	
} 

img.map-image{
	float: left; margin:8px 10px 10px 0;
}

/*Home page specific layout
---------------------------*/
body.default #section-navigation,
body.about_interactive-tool #section-navigation{
	display: none;
}

body.default #content,
body.about_interactive-tool #content{
	margin-left: 0px; width: 713px;
}

#hm-video{
	width: 150px; height: 119px; background: url(i/hm-videolink.jpg) no-repeat; 
}

body.default h1{
	display: none;
}

body.default h1.show{
	display: block;
}

body.default #content a.go-link:link,
body.default #content a.go-link:visited{
	background-color: #000; padding: .2em 2.3em .2em .5em; color: #fff; text-decoration: none !important; border: none; 
}

body.default a.go-link:focus, 
body.default a.go-link:hover,
body.default a.go-link:active{
	
} 

#hm-intro{
	width: 440px; float: left;
}

#hm-virtual-tour{
	float: right; width: 250px;
}

#hm-departments{
	float: right; width: 250px; margin-top: .5em; margin-bottom: 1em;
}

#hm-departments img{
	padding-left: 0.4em;
}


#hm-virtual-tour H2{
	background-color:#EEEEEE; font-weight:bold; margin:0pt 0pt 0.5em; padding:0.2em 0.4em; font-size: 1em; 
}


body.default a.hm-virtual-tour{
	background: url(i/virtualtour-link.gif) no-repeat; width: 247px; height: 191px; display: block; 
}

#hm-intro,
hm-virtual-tour{
	margin-bottom: 75px;
}

body.default #profile-quicklinks{
	 clear:both; background-color: #eee; height: 175px; margin-bottom: 9px; position: relative; /*margin-top: 70px; float:left;*/
}

body.default #hm-video-profiles{
	float: right;	padding-right: 94px;
}

#profile-quicklinks h2{
	padding-top: 0;
}

body.default #hm-video-profiles a.screenshot{
	width: 160px; height: 130px; background: url(i/hm-videoprofiles.jpg) no-repeat; display: block; 
	position: absolute; right: 144px; top: 8px;
}

body.default #hm-video-profiles a.go-link{
	position: absolute; right: 144px; bottom: 0;
}

body.default #hm-meet-the-team{
	float: left; width: 174px; padding-left: 218px;
	
}

body.default #hm-meet-the-team h2{
	color: #2f2f2f; font-size: 1em;
}

body.default #hm-video-profiles h2{
	color: #2f2f2f; font-size: 1em; padding-bottom: 0;
}

body.default #hm-meet-the-team p,
body.default #hm-video-profiles p{
	margin: 0; padding: 0;
}

body.default #hm-meet-the-team a.hm-meet-the-team-imglink{
	position: absolute; left: 0; top: -66px; display: block; width: 218px; height: 250px; background: url(i/hm-team.jpg) no-repeat 0;  
}

/*Profile section*/
body.section-videos #content h1{
	float: left; margin: 0 !important; padding:0.3em 0pt 0.3em 4px; width:364px;
}

#video-profiles{
	width: 362px;
}

#content ul.profile-links{
	margin-left: 6px;
}

.video-profiles .profile-movie{
	width: 360px; height: 280px; background-color: #0ff;
}

.video-profiles h3{
		font-weight: bold; margin: 0.5em 0 0 0; background-color: #eee; padding: .2em 0 .2em 4px; margin-top: 0; width: 356px;
}

.video-profiles h4{
	float: right; width: 118px; background:#FAF1E2 url(i/black-arrow.gif) no-repeat scroll 5px 50%;
font-size: 1em; font-weight:normal; padding:0.2em 20px;
}

.video-profiles .profile-details{
	background-color: #eee; width: 368px; padding: 8px 0;
}

#content .video-profiles .profile-details p{
	/*float: left; clear: left;*/ padding-bottom: 8px; color: #000; margin: 0; 
}	

.video-profiles .profile-details a{
	/*float: right;*/ background-color:#000000; border:medium none; color:#FFFFFF; padding:0.2em 2.5em 0.2em 0.5em; text-decoration:none !important; display: block; margin-bottom: 5px;  
}

.video-profiles .profile-details .profile-links{
	float: right;
}

.video-profiles ul.profile-links{
	float: right; clear: right; margin-top: 4px !important;
}

.video-profiles ul.profile-links li{
	margin: 2px 0; list-style: none; 
}

.video-profiles ul.profile-links li a{
	width: 158px; height: 65px; display: block; background: #F6F2EE url(i/go.gif) bottom right no-repeat; position: relative; text-decoration: none !important;
}

.video-profiles ul.profile-links li a span{
	padding: 5px 0; position: absolute; top: 1; left: 70px;  color: #000; font-weight: bold;
}

/*Admin menu*/
ul#ft-adminmenu{
	/*float: left; padding: 0 0 0 .3em;*/
	position: absolute; left: 728px; top: 0; z-index: 100;
}

ul#ft-adminmenu li{
	float: left; margin: 0.7em 0em 0.5em 0.4em;  list-style: none;
}

ul#ft-adminmenu a:link, 
ul#ft-adminmenu a:visited{
	display: block; background-color: #000; padding: .2em 1em .2em .5em; color: #fff; font-size: .75em; text-decoration: none;
}

ul#ft-adminmenu li a:focus, 
ul#ft-adminmenu lia:hover,
ul#ft-adminmenu li a:active{
	
}



/*Career info
--------------*/
#career-info{
	float: right; width: 100px; /*border: 1px dashed #f0f;*/ float: right;
	margin: 99px 70px 0 0; width: 216px;
}

#career-info h3{
	text-transform: uppercase;  font-size: .8125em; border-bottom: 15px solid #000; margin: 0; padding: 0 0 7px 0;  
}


#career-info #ft-jobsearch{
	
}

#career-info #ft-careerstats{
	
}

#career-info #ft-careerstats a.career-stat-link{
	display: block; width: 217px; height: 172px; background: url(i/career-stats-link.gif) no-repeat;
}

#career-info #ft-locations{
	position: relative;
}

#career-info #ft-locations div{
	width: 217px; height: 135px; background-image: url(i/location-widget-placeholder.gif); margin-top: 10px; position: relative;
}

#career-info #ft-locations div a.america,
#career-info #ft-locations div a.europe,
#career-info #ft-locations div a.asia{
	position: absolute; display: block; height: 25px; width: 25px; /*border: 1px dashed green;*/
}


#career-info #ft-locations div a.america{
	left: 39px; top: 54px;
}

#career-info #ft-locations div a.europe{
	left: 91px; top: 46px;	
}

#career-info #ft-locations div a.asia{
	left: 156px; top: 68px;	
}


/*Latest vacancies*/
table#latestvacancies{
	margin-bottom: 20px;
}

table#latestvacancies caption{
	display: none;
}

table#latestvacancies td{
	padding-top: 20px;
}

table#latestvacancies td a,
#ft-jobsearch p a{
	color: #105C96; text-decoration: underline; font-size: .8em; font-weight: bold; margin-right: 5px;
}

#ft-jobsearch{
	padding-bottom: 22px;
}

table#latestvacancies td.date{
	color: #2f2f2f; font-size: 0.6875em; vertical-align: top;
}

/* JOIN specific styles 
-----------------------*/

/*FormSection*/
#ctl00_content_psectionGuidance p,
body #content div.instructions p{
	padding-left: 0;
}

/*application form*/
.apply_appform .appformsubmit input#ctl00_content_Submit{
	margin-top: 1em;
}

.apply_appform #content p{
	padding-left: 0;
}



.apply_cv label#ctl00_content_cvuploadmsg{
	width: 32%;
}


#content table td{
	font-size: 1em; padding: .3em;
}


/*Jobsearch*/
body.jobsearch fieldset{
	background-color: #f1f1f1; border: none; 
}

body.jobsearch fieldset legend{
	display: none;
}

body.jobsearch fieldset label{
	font-weight: bold; color: #102053; width: 34%; /*was 3*/ font-size: 1em;
}

body.jobsearch fieldset input#ctl00_content_keywords_avpTextBox1,
body.jobsearch fieldset select#ctl00_content_careerarea,
body.jobsearch fieldset select#ctl00_content_location{
	width: 316px; color: #2f2f2f; font-size: 1em; 
} 

#ctl00_flash{
	background-color: #FAF1E2; padding: .6em; color: #2f2f2f; font-size: 1em;
}

/*Recruitment agent page*/
label#ctl00_content_cvuploadmsg{
	width: 38%;	
}


/*:note: login link*/
#navigation a#ctl00_LoginControl1{
	
}

/*:note: register link*/
#navigation a#ctl00_UserTypeLink1{
	 
}

/* :note: Generated menu */
#CMSMenu{
	
}

/* :note: Turn off ordered list numbering for application pages */ 
ol#jobappform li{
	list-style: none;
}

/* :note: Edit Page link */
.editlink{ /* :note: use !important to override same styles in form.css */
	
}

.editlink:hover{
	
}
 
/* flash msg :note: change these styles to suit the design.*/
/*.flash{ 
	background-color: #999;  padding: .5em 1em; margin-bottom: 1em; color: #2f2f2f; font-size: 1.5em; font-weight: bold;
}*/

/* :note: flash msg change these styles to suit the design.*/
body #content .flash{ 
	background-color: #999;  padding: .5em 1em; margin-bottom: 1em; /*color: #e23d3b;   font-size: 1em; font-weight: bold; */
}

body #content .flash p{ 
	padding: 0; margin: 0; /* :note: reset <p> */
	color: #2f2f2f; font-size: 1.5em; font-weight: bold;
}

span.mandatory {
	color: #f00 !important; /*font-size:  :temp note: <p> font size em;*/
}

/* :note: validation summary */
.validationerrors {
	color: #f00 !important; /*font-size:  :temp note: <p> font size em;*/
}

/* :note: from legend color */
fieldset legend {
	color:#000;
}

/* Form input sizes */
fieldset label,
fieldset select,
fieldset input{ /* :note: also exists in form.css */
	font-size: 1em;
}

/* :note: candidate zone */
.apply_default #content ul li{
	list-style: disc;	
}

#candidate-greeting{
	padding-top: 10px;
}

#candidate-vacancy{
	padding-bottom: 10px;
}	

#applicant-info p{
	font-size: .75em; padding: .3em 0; color: #2F2F2F; margin: 0;
}

#applicant-info .candidate-current-vacancy,
#applicant-info .candidate-name{
	font-weight: bold;
}

/*Tables*/
.apply_default .prettytable th{
	font-weight: bold;
}

table.prettytable tr.AlternatingItem, table.appform tr.AlternatingItem {

}

/* :note: fixes table spacing issue in RegisterPrefs.aspx :temp note: can also apply to sitemap if activated */
.registerprefs table{
	width: auto;
}

.registerprefs table td{
	padding: 0; vertical-align: middle; 
}

#loggedinview{
	position: absolute; left: 0; top:0;
}

/* Application form pages */
div.job-result{
	/* :temp note: often need bottom dividing border between jobs */
}

div.job-result h2{
	 background: #FDD6B9 url(i/job-title-bg.gif) no-repeat 6px center; padding: .3em 0 .3em 20px;  
}

div.job-result h2 a{
	color: #010000; font-size: 1.1em;
}

.job-result .jobdescription{
	margin: 1em 0; color: #2f2f2f;
}

#content .cibbutton{
	margin-bottom: 1em; padding-bottom: 1.5em; border-bottom: 2px solid #999; 
}

#content .cibbutton a.jobdetails,
#content .cibbutton a.jobapply{
	/* :temp note: will need margin-bottom: Xem; for dividing border to clear buttons */
	margin-left: 10px;
}

#content .cibbutton input{
	cursor: pointer;
}

/* Apply process Input buttons + details and apply links */ 
input.button,
input#ctl00_content_CancelPb,
input#ctl00_content_ApplyCancel1,
#content .cibbutton .jobdetails,
#content .cibbutton .jobapply,
#content .cibbutton input{
	/* :temp note:buttonise job links and buttons */
	background-color: #000; padding: .2em 1em .2em .5em; color: #fff; text-decoration: none !important; border: none; 
}

/* Ensure job description text size is consistant whether in <p> or not */ 
.job-result .jobdescription{
	margin: 1em 0;  /*font-size: <p> font size em;*/
}

#content .job-result .jobdescription p{
	font-size: 100%; padding: 0;
}

.job-result dl{ /* :note: space job details from job title*/ 
	margin-top: 5px; 
}

.job-result dt{
	color: #2f2f2f; clear: right !important; /* :note: override forms.css*/
}

.job-result dd{
	color: #2f2f2f;
}

.content .job-result .jobdescription p, #jobappform h3, #jobappform p{

}

#content ol#jobappform{
	margin-left: 0px;
}

#content ol#jobappform li{
	
}

div.appformsubmit{

}

/* Target all canditate zone pages */
body.apply_appform, 
body.apply_appformcourse, 
body.apply_appformeducation, 
body.apply_appformemployment, 
body.apply_appformmembership, 
body.apply_appformprint, 
body.apply_appformreference, 
body.apply_cv, 
body.apply_, 
body.apply_eeo, 
body.apply_formsection, 
body.apply_mediasource,
body.apply_default{
	
}

/*login screen*/

/*:note: space register / enter password options*/
body.login div#ctl00_content_bob{
	margin-top: 10px;
}

span.forgot-password{
	/*font-size:  :temp note: <p> font size em;*/
}

/* :note: content area defaults */
#content  ul, 
#content ol {
	margin: 1em 0; margin-left: 1.5em;
}

 /* Footer
----------------------------*/
#footer{
	width: 713px; background-color: #fff; padding-top: 20px; border-top: 15px solid #FDD6B9; margin-top: 1em; clear: both;
}

.default #footer{
	 margin-top: 0;
}

#footer li{
	float: left; color: #999; font-size: .6875em; list-style-type: none; margin: 0 .5em !important; line-height: 1.5em;
}

#footer li a:link,
#footer li a:visited{
	color: #999; font-size: 1em; text-decoration: none; 
}

#footer a:focus, 
#footer a:hover,
#footer a:active{
	text-decoration: underline !important;
}

/* Image replacement 
--------------------*/
/*h1.logo span{
	background-image: url([replacement image].gif);
}

h1.logo{
	width: 202px; height: 22px; margin: 0; padding: 0;
}

.replace{
	position: relative; overflow: hidden;
}

.replace span{
	display: block; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background-color: transparent; background-repeat: no-repeat;
}*/

/* :note: Leahy/Langridge IR Method - used for form input buttons (also works with legands in ie7 no ffox 2) - Delete if not used*/

/* Apply this style to all IR buttons
[button]{
	background-repeat: no-repeat; height: 0px !important; border: none; cursor: pointer; overflow: hidden; 
	:note: apply this in ie stylesheet -> border-bottom: 0px #fff solid; height: [of image] !important;
}

The apply this style to each individual button
[button]{
	padding: [button image height]px 0 0 0;  width:[button image]px;  background-image: url(i/[button image]); }
*/