/*
Theme Name: Handepay
Theme URI: 
Description: 
Version: 1.0
Author: Tim Lenton
Tags: 
*/

/*
Undo Browser Defauls --------------------- */

*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, 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 }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h5, h5, h6 { font-size:100% }
q:before, q:after { content:''}



/*
Reset Some Styles --------------------- */

ul, ol { margin: 0 0 10px 15px; }
ul li { margin: 0 0 5px 0; list-style: disc; }
ol li { margin: 0 0 5px 0; list-style: decimal;font-size: 0.75em; line-height: 1.5; }

strong { font-weight: bold; }
em { font-style: italic; }

 p        { font-size: 0.75em; margin: 0 0 1em; line-height: 1.5;}
#mainSection ul { font-size: 0.75em;}

p.contact-form           { font-size: 0.75em; margin: 0 0 0.5em; line-height: 1;}


p img.left  { float: left; margin: 0.75em 0.75em 0.75em 0; padding: 0; }
p img.right { float: right; margin: 0.75em 0.75em 0.75em; }

a:focus, 
a:hover     { color: #2870c6; text-decoration: none; }
a           { color: #2870c6; text-decoration: underline; font-weight:bold; }
a:visited	{ color: #2870c6; }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre 		{ margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }

img { display: block; }

table { border: none; border-collapse: collapse; border-spacing: 0; }
th { }
td { border: none; margin: 0px; padding: 2px; }

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

h1,h2,h3,h4,h5,h6 { font-weight: bold; font-style:normal; color: #2870c6; }

h1 { font-size: 1.125em; margin-bottom: 0.75em; }
h2 { font-size: 0.875em; line-height: 1.5; margin: 0 0 0.75em 0;}
h3 { font-size: 0.75em;  line-height: 1.5; margin-bottom: 0.75em;}
h4 { font-size: 0.5em; margin-bottom: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img {
  margin: 0;
}

h1.cut-your-costs { margin-bottom: 5px; width: 236px; height: 37px; text-indent: -900em; background: url(images/header-cut-your-costs.jpg) top left no-repeat; }

.find-out-more { margin-bottom: 0px; width: 140px; height: 56px; text-indent: -900em; background: url(images/header-find-out-more.jpg) top left no-repeat; cursor:pointer; }

.find-out-more-right { margin-bottom: 5px; width: 140px; height: 56px; text-indent: -900em; background: url(images/header-find-out-more.jpg) top left no-repeat; float:right; cursor:pointer; }

.find-out-more-benefits { margin: 115px 15px 0 0; width: 140px; height: 56px; text-indent: -900em; background: url(images/header-find-out-more.jpg) top left no-repeat; float:right; cursor:pointer; }

h2.terminals { margin-bottom: 5px; width: 104px; height: 17px; text-indent: -900em; background: url(images/header-terminals.jpg) top left no-repeat; float:right; }

p.terminals-txt { margin: 10px 0 10px 0; text-align:right; }

p.future-proof { margin: -47px 0 0 -33px ; width: 80px; height: 80px; text-indent: -900em; background: url(images/future-proof.gif) top left no-repeat; float:left; }

.new-to-cards { margin-bottom: 5px ; width: 165px; height: 87px; text-indent: -900em; background: url(images/btn-new-to-cards-up.jpg) top left no-repeat; float:left; cursor:pointer; }

.switching-suppliers { margin: 0 ; width: 165px; height: 87px; text-indent: -900em; background: url(images/btn-switching-suppliers-up.jpg) top left no-repeat; float:left; cursor:pointer; }

.special_offer_txt { font-size: 12px; display: block; position: absolute; bottom: -10px; right: 10px; width: 130px; line-height: 1.2; text-decoration: none; color: #EB414C !important; }
.special_offer_txt:hover { color: #000 !important; }

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

form { }
fieldset { margin-left: 0px; border:0px; }
legend { padding: 2px 6px; color: #71949B; }
label { width: 150px; display: block; float: left; height: 22px; position: relative; font-weight: bold; vertical-align: middle; }
select { border: 1px solid #80805E; color: #000; padding: 2px; width: 250px; }
option { }
textarea { border: 1px solid #b6b8ba; color: #000; padding: 5px; }
input[type="button"] {  }
input[type="checkbox"] { }
input[type="file"] { }
input[type="hidden"] { }
input[type="image"] { }
input[type="password"] { border: 1px solid #80805E; color: #000; padding: 2px; }
input[type="radio"] { }
input[type="reset"] { }
input[type="submit"] {  }
input[type="text"] {  }
button { }

.wpcf7-not-valid-tip { color: red !important; }

/*
General Styles --------------------- */

.require { color: red; position: absolute; top: 0; right: 10px; }
.alignleft { float: left; margin-right: 20px; margin-bottom: 10px; }
.alignright { float: right; margin-left: 20px; margin-bottom: 10px; }
.aligncenter { margin-left: auto; margin-right: auto; }
#content { float: right; width: 550px; }
.quote_highlight { color: #6ea91c; font-size: 16px; }
.left_block { float: left; width: 470px; }
.right_block { float: right; width: 470px; }
.highlight { color: #407e24; }
.bold { font-weight: bold; }
.small_margin { margin-bottom: 5px !important; }
.right { text-align: right; }
.highlight_lnk { font-size: 16px; font-weight: bold; }
.larger_txt { font-size: 19px; line-height: 24px; }
.larger_txt small { font-size: 12px; }
.mailing { text-decoration: underline; }
.clearfix { clear: both; }

.blue-square {background: url(images/blue-square.jpg); width:300px; height:335px; margin-bottom: 20px;}
.float-left {float:left}
.float-right {float:right}
.blue-square h3 {padding: 30px 0 0 100px; color:#FFF}
.blue-square li {padding: 0 0 0 30px; color:#FFF}
.bs-text {padding: 7px 0 0 45px; color:#FFF; font-weight: bold; font-size: 13px;}
.blue-tick-box {padding: 0 30px 0 5px; float:right;}

.header-text {color: #000;}
.header-number {color: #2870C6;}
/*
Layout --------------------- */

body { font-family: Tahoma, Arial, sans-serif; font-size: 100%; width: 100%;  margin: 0; position: relative; color: #5b5b5b !important; background: #e2e8f6;  }
.site_size { width: 900px !important; margin-right: auto !important; margin-left: auto !important; padding: 0 20px 20px 20px; background: #fff; z-index: -2px; }


/* You might find the following useful */
br.dirtyLittleTrick { clear:both; display:block; height:1px; margin:-1px 0 0 0 } /* Use this br class to clear your floated columns */
div { position:relative } /* This will save you having to declare each div's position as 'relative' and allows you to absolutely position elements inside them */
li#theme-switcher { background:#fff; border:10px solid red; padding:20px; position:fixed; top:0; right:0 } /* Use this if you have the Theme Switcher Reloaded plugin (http://themebot.com/webmaster-tools/1-wordpress-theme-switcher-reloaded) installed and want to make it nice and obvious */

#leftSection ul { margin: 0; }
#leftSection ul li { list-style: none; }
#leftSection ul ul { margin: 0 0 20px 0; }
#leftSection ul ul ul { margin-left: 10px; margin-right: 10px; margin-top: 5px; }
#leftSection ul ul ul li { margin-bottom: 3px !important; }
#leftSection ul li ul li a { font-weight: normal !important; font-size: 14px !important; }
#leftSection h3 a { text-decoration: none !important; font-size: 16px; }

.post { margin-bottom: 30px; }
.post h2, .post h3 { padding: 0 !important; margin-bottom: 0 !important; }
.post p { margin-bottom: 10px !important; }
.post p.info { margin-bottom: 5px !important; font-size: 10px !important; }

.sociable ul { clear: both; overflow: hidden; }
.sociable ul li { display: inline; float: left; }

code { font-weight:normal !important; font-size: 10px !important;  }

form p { margin-bottom: 5px !important; }

.comments { margin: 0; overflow: hidden; }
.comments li { list-style: none; clear:both; overflow: hidden; margin-bottom: 10px; }
.comments .details { float: left; width: 130px; }
.comments .message { float: right; width: 450px; }
#comments { margin-bottom: 5px !important; }

.commentlist { margin: 0 0 20px 0; }
.commentlist li { list-style: none; border-bottom: 1px solid #ccc; }
.comment-author { width: 100px; float: left; }

.oldPosts { margin: 0; }
.oldPosts li { list-style: none; }

/* Header */
#header { height: 81px; position: relative; padding: 44px 20px 0 20px; }
#logo {float:left; width: 200px; height: 52px; background: url(images/logo.jpg); display: block; text-indent: -3000px; }
#referal {float:left; width: 105px; height: 81px; background: url(images/referal.jpg); display: block; text-indent: -3000px; margin:-20px 0 0 100px; }
#nav_bar { background: url(images/footer.jpg) repeat-x; height: 35px; position: relative; margin-bottom: 15px; padding-left: 9px; }
#testimonial { position: absolute; top: 20px; right: 10px; width: 426px; font-style: italic; }
#testimonial a {  }
#testimonial a:hover { color: #000; }
#minimenu { position: absolute; top: 100px; right: 0; width: 300px;font-size:80%;font-weight:bold; }

#contact_info { position: absolute; bottom: 25px; right: 10px; color: #525459 !important; font-size: 16px; font-weight: bold; text-align: right; }
#contact_info a { color: #525459; }
#contact_info p { margin: 0 0 10px 0 !important; }



/* Left Section */
#leftSection { width: 220px;  float: right; line-height: 19px; min-height:495px; }
#leftSection p { margin: 0 !important; }


#mainSection {  line-height: 20px; float: left; width: 665px; }

.home_box { width: 436px; float: left; background: url(images/home_box.jpg) no-repeat; margin-bottom: 10px; min-height: 200px; position: relative; padding-bottom: 10px; height:210px; }
.home_box .index-cut-your-costs-base { position: absolute; bottom: 0; left: 0; margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 20px;
width: 416px;
height: 16px;
background: #fff url(images/index-cut-your-costs-base.jpg) top left no-repeat;  }
.home_box h2 { padding: 10px 20px 0 20px; }
.home_box p { padding: 0 20px; margin-bottom: 10px !important; }
.right_box { margin-left: 26px; height:210px; }


/* Middle Section */
#middleSection { line-height: auto; position: relative; width: 900px !important; margin-bottom: 5px; overflow: hidden; }
object { z-index: -1; }



/* Footer */
#footer {  clear: both; overflow: hidden; position: relative; background: url(images/footer.gif) no-repeat; color: #fff; height: 53px; padding: 10px 20px 0 20px; font-size: 10px; text-align: center; }
#footer a { color: #fff; text-decoration: underline; font-weight: bold; }

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

#dropmenu, #dropmenu ul {margin:0; padding:0; list-style-type:none; list-style-position:outside; position:relative;z-index:300; width:100%; z-index: 100; }
#dropmenu a {display:block; padding: 13px 0 7px 0; color:#fff;text-decoration:none; background: url(images/btn-up.jpg) no-repeat; width: 126px; text-transform: uppercase; font-weight: normal; font-size: 0.7em; text-align: center;}
#dropmenu a:hover {background: url(images/btn-over.jpg) no-repeat; color:#fff;}
#dropmenu li {float:left; position:relative;list-style: none;margin: 0;}
#dropmenu ul {position:absolute; display:none; width:12em; top:2.0em; left:0px;}
#dropmenu ul a {}
#dropmenu li ul { background: url(images/btn-link-base.jpg) bottom left no-repeat; padding-bottom: 9px; z-index: 100;}
#dropmenu li ul a {width:126px; height:auto; float:left; background: url(images/btn-link-up.jpg) no-repeat;padding: 0; text-align: left; padding: 4px 10px; font-size: 0.65em; color: #2870c6; }
#dropmenu li ul a:hover {background: url(images/btn-link-over.jpg) no-repeat;  }
#dropmenu ul ul {top:auto;}
#dropmenu li ul ul {left:12em; margin:0px 0 0 10px;}
#dropmenu li:hover ul ul, #dropmenu li:hover ul ul ul, #dropmenu li:hover ul ul ul ul {display:none;}
#dropmenu li:hover ul, #dropmenu li li:hover ul, #dropmenu li li li:hover ul, #dropmenu li li li li:hover ul {display:block;}



#index-cut-your-costs {
	margin: 0px 0px 0px 0px;
	padding: 30px 0px 9px 20px;
	width: 416px;
	height: 200px;
	background: #fff url(images/index-cut-your-costs.jpg) top left no-repeat;
	float:left;
}

#index-cut-your-costs-base {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 20px;
	width: 416px;
	height: 16px;
	background: #fff url(images/index-cut-your-costs-base.jpg) top left no-repeat;
	float:left;
}

#index-right-wrap {
	margin: 0px;
	padding: 0px;
	width: 215px;
	float:right;
}

#index-terminals {
	margin: 0px;
	padding: 0px 20px 9px 20px;
	width: 175px;
	height: 230px;
	background: #fff url(images/index-terminals.jpg) top left no-repeat;
	float: right;
}

.terminals { margin-top: 22px !important; }

#index-terminals-base {
	margin: 0px;
	padding: 0px 0px 0px 20px;
	width: 195px;
	height: 16px;
	background: transparent url(images/index-terminals-base.gif) top left no-repeat;
	float: right;
}
#callback-panel {
	margin: 0px;
	padding: 45px 10px 0px 12px;
	width: 198px;
	background: #fff url(images/callback-panel.jpg) top left no-repeat;
	float:right;
}

#callback-panel p { margin-bottom: 2px !important; }

#callback-panel-base {
	margin: 0px 0px 0px 0px;
	padding: 0px 20px 0px 20px;
	width: 180px;
	height: 12px;
	background: #fff url(images/callback-base2.jpg) top left no-repeat;
	float:right;
}
input[type=text], textarea {width:120px !important;
margin: 0px 0px 0px 0px !important;
padding: 5px !important;
background: #2870c6 !important;
color: white !important;
font: 11px 'andale mono', 'lucida console', monospace;
}

select { width: 150px;
background: #2870c6 !important;
color: white !important; }

#mainSection input[type=text], #mainSection textarea { width: 300px !important; }

input:focus {
background: #fff !important;
color: black !important;
}

input[type=submit] {width:130px !important;
height: 30px;
border: none;
margin: 0 !important;
padding: 0 !important;
background: url(images/btn-call-me.jpg) top left no-repeat !important;
color: white;
font: 16px 'andale mono', 'lucida console', monospace;
line-height:16px;
cursor:pointer;
display:block;
}
#index-content-buttons {
	margin: 10px 10px 0px 0px;
	padding: 0px 0px 9px 0px;
	width: 165px;
	background: #fff url() top left no-repeat;
	float:left;
}

#index-content-benefits {
	margin: 10px 0 0 0 ;
	width: 490px;
	height: 179px;
	background: #fff url(images/index-benefits2.jpg) top left no-repeat;
	float:left;
}
#index-content-benefits p { font-size:12px; line-height:17px; }
#index-content-benefits h2 { font-size:14px !important; }
#index-content-benefits img, #index-content-benefits div { margin:10px; }

#christmas-btn { margin: 10px 0 0 0 ; width: 490px; height: 179px; display: block; float: left;  }
#content {

	padding: 20px 20px 9px 20px;
	width: 625px;
	background: #fff url(images/content.jpg) top left no-repeat;
	float:left;
}
#content-base-exclusive {
	margin-bottom: 10px;
	padding: 0px 20px 0px 20px;
	width: 625px;
	height: 11px;
	background: #fff url(images/content-base.jpg) top left no-repeat;
	float:left;
}
#content-right {
	margin: 0px;
	padding: 20px 20px 9px 20px;
	width: 180px;
	background: #fff url(images/advert_placeholder.jpg) top left no-repeat;
	float:right;
}

#content-right-base {
	margin: 0px;
	padding: 0px 20px 15px 20px;
	width: 180px;
	height: 6px;
	background: #fff url(images/advert_placeholder_base.jpg) top left no-repeat;
	float:right;
}
.page2 { background: url(images/content-about.jpg) top left no-repeat !important; }
.page11 { background: url(images/content-new-to-cards.jpg) top left no-repeat !important; }
.page13 { background: url(images/content-switching.jpg) top left no-repeat !important; }
.page15 { background: url(images/content-service.jpg) top left no-repeat !important; }
.page17 { background: url(images/content-cost.jpg) top left no-repeat !important; }
.page27 { background: url(images/content-moto.jpg) top left no-repeat !important; }
.page29 { background: url(images/content-ecom.jpg) top left no-repeat !important; }

#index-right-wrap #refer-a-friend ol { margin-left:30px; }
#index-right-wrap #refer-a-friend ol li { font-size:10px; line-height:14px; }
.clear { clear:both; }
#index-right-wrap #refer-a-friend .left { width:300px; display:inline; float:left; }
#index-right-wrap #refer-a-friend .right { width:350px; display:inline; float:left; }
#index-right-wrap #refer-a-friend .friend-input, #index-right-wrap #refer-a-friend input[type="text"] { width:150px !important; display:inline; float:left; }
#index-right-wrap #refer-a-friend p label { display:inline; float:left; width:100px; text-align:left; margin-right:10px; font-size:12px; font-weight:normal; line-height:normal; }
#index-right-wrap #refer-a-friend p { margin-bottom:5px; }
#index-right-wrap #refer-a-friend .right p label { width:150px; }

div.folder_wrapper h2 { font-style:italic; color:#404040; }
div.folder_wrapper ul li { margin:0; line-height:18px; }
div.folder_wrapper ul li a { font-size:12px; }
#login-form { width:100%; text-align:center; margin-top:40px; }
#login-form form { width:320px; margin:0 auto; border: 1px solid #80805E; padding:10px; }
#login-form input[type="password"], #index-right-wrap #login-form input[type="text"] { border: 1px solid #80805E; color: #000000; padding: 2px !important; margin:0 !important; font-size:12px !important; width:160px !important; }
#index-right-wrap #login-form input[type="text"] { margin-left:2px !important; }
p#error { color:#F30; font-weight:600; }
p#succ { color:#093; font-weight:600; }
#member_search { margin:20px 0; }
#member_search tr th { font-size:12px;  font-weight:600; line-height:16px;}
#member_search tr td { font-size:12px; }
#member_search tr th, #member_search tr td { padding:3px; border:1px solid #F5F5F5; }
.high { display:inline-block; background-color:#F30; color:white; padding:2px; }
#slider1 { list-style:none !important; margin:0; }
#slider1 li { margin-top:0; padding-top:0; }
.small_txt { font-size: 11px !important; text-align: left; }

ul.list-tick {
  margin: 0;
  padding: 0;
}
ul.list-tick li {
  margin: 0;
  padding: 2px 0 2px 36px;
  list-style: none;
  background: url('images/a-tick.jpg') no-repeat top left;
}
.bluebox {float:left;width:30%;height:200px;background-color:#ccccff;margin-right:10px;padding:4px;}