/*
-----------------------------------------------
Webtel.mobi/pc supplemental stylesheet: Screen

Supports front page changes set out by William
Getts 25/03/2010
----------------------------------------------- */

HTML {
    background: #a5a5a5 url('../images/supplemental/bg-body.jpg') top repeat-x;
}

BODY {
    background: #a5a5a5 url('../images/supplemental/bg-body.jpg') top repeat-x;
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
}

.home H1 {
    font-size: 24px;
    color: #820000;
	margin: 8px 0 10px 0;
	width: 315px;
}

#outerwrapper {
    background: None;
}

#wrapper {
    background: Transparent url('../images/supplemental/bg-paper.png') repeat-y;
}

div#header {
	padding-right: 12px;
	width: auto;
}

INPUT {
    font-family: Arial, Helvetica, sans-serif;
}

#nav {
	width: 761px;
}

#nav TD {
    font-size: 12px;
    font-weight: bold;
	width: auto;
	padding: 0 18px;
}

#nav-account {
	margin: 6px;
}

#nav-account li {
	font-size: 12px;
}

/*
  ------------------------------------------------
  Sliding door buttons
  ------------------------------------------------
*/
.button-grey,
.button-red {
    position: relative;
    display: block;
    height: 21px;
	width: 102px;
    margin: 0;
    padding: 0;
    overflow: visible;
	background-color: Transparent;
	background-repeat: no-repeat;
	background-position: right -38px;
    font-weight: bold;
}

.button-grey b,
.button-red b {
    position: relative;
    display: block;
	color: #000;
    padding: 0;
    height: 21px;
    line-height: 21px;
    text-align: center;
	white-space: nowrap;
	background-color: Transparent;
	background-repeat: no-repeat;
	background-position: left 0px;
    font-weight: bold;
    font-size: 12px;
	cursor: pointer;
	text-align: center;
}

a.button-red {
	padding: 0;
}

.button-grey:hover,
.button-red:hover {
	background-position: right -114px;
}

.button-grey:hover b,
.button-red:hover b {
	background-position: left -76px;
}

.button-grey,
.button-grey b {
	background-image: url(../images/supplemental/button-grey.png);
}

.button-grey:hover b {
	color: #000;
}

a.button-red,
.button-red b,
.button-red:hover {
	text-decoration: None;
	color: #FFF;
}

.button-red,
.button-red b {
	background-image: url(../images/supplemental/button-red.png);
}

/*
  ------------------------------------------------
  home_content
  ------------------------------------------------
*/
ul.list {
	margin-left: -6px;
	width: 315px;
}

ul.list li {
    background: Transparent url(../images/supplemental/bullet.gif) no-repeat scroll 8px 4px;
    font-size: 12px;
	margin: 6px 0;
}

.home #body {
	background:transparent url(../images/supplemental/phone.jpg) no-repeat scroll 35px 9px;
    padding-top: 12px;
	width: 761px;
	position: relative;
}

.home #primary {
	width: 504px;
	min-height: 280px;
	padding-left: 257px;
	float: none;
	display: block;
}

#primary p.instruction {
    font-weight: bold;
    font-size: 12px;
	margin: 0;
}

#primary .buttonmenu {
	margin: 18px 0 16px 0;
}

.home .buttonmenu a.button-grey {
	margin-right: 8px;
	width: 102px;
}

.home .buttonmenu a.button-grey b {
	width: 102px;
	font-weight: bold;
}

/*
  ------------------------------------------------
  info_panel
  ------------------------------------------------
*/
#home-promo-container {
	width: 761px;
	background: url(../images/supplemental/bg-home-promo.png) no-repeat bottom left;
	margin-top: 10px;
}

#home-promo-container-inner {
	min-height: 117px;
	background: url(../images/supplemental/bg-home-promo.png) no-repeat top right;
	position: relative;
}

.home #primary-promo,
.home #secondary-promo,
.home #tertiary-promo {
	position: absolute;
	top: 0;
}

.home #primary-promo {
	left: 0;
}

.home #secondary-promo {
	left: 257px;
}

.home #tertiary-promo {
	left: 518px;
}

.home #primary-promo,
.home #tertiary-promo {
	width: 245px;
}

.home #secondary-promo {
	width: 247px;
}

.home-promo,
.home-promo .inner {
	background: none;
	padding: 0;
	margin: 0;
}

.home-promo .inner {
	padding: 6px;
}

.home .home-promo span.icon {
	width: 92px !important;
	height: 86px !important;
	float: left;
	position: relative;
	top: 0;
	left: 0;
}

.home #primary-promo span.icon {
	background: Transparent url(../images/supplemental/homepromo-advantages2.png) no-repeat 2px 4px;
}

.home #secondary-promo span.icon {
	background: Transparent url(../images/supplemental/homepromo-partner2.png) no-repeat 0 0;
}

.home #tertiary-promo span.icon {
	background: Transparent url(../images/supplemental/homepromo-challenge.png) no-repeat 2px 4px;
}

.home-promo h2,
.home-promo p {
	font-size: 12px;
	font-weight: bold;
	width: auto;
}

.home-promo h2 {
	margin-top: 17px;
}

.home-promo p.call-to-action {
	text-align: center;
	position: absolute;
	bottom: 18px;
	left: 0;
	width: 245px;
}

.home-promo p.call-to-action a.button-red {
	margin: 0 auto;
	width: 107px;
	color: #FFF;
	text-decoration: none;
	background-image: url(../images/supplemental/button-red.png);
}

.home-promo p.call-to-action a.button-red b {
	font-weight: bold;
}

#tertiary {
	padding: 0 0 12px 0;
}

/*
  ------------------------------------------------
  widget_login
  ------------------------------------------------
*/
.home #secondary {
	width: 180px;
	right: 14px;
	top: 12px;
}

.home #account-module {
	background: Transparent url(../images/supplemental/bg-account-module.png) no-repeat bottom left;
}

.home #account-module .inner {
	min-height: 265px;
	background: Transparent url(../images/supplemental/bg-account-module.png) no-repeat top right;
	width: auto;
	padding: 6px 0 6px 6px;
}

#form_login a.button-red {
	width: 81px;
	float: left;
}

.home #account-module-title {
	background: Transparent url(../images/supplemental/bg-account-module-panel.png) bottom left;
	width: 172px;
}

.home #account-module-title h2 {
	min-height: 28px;
	width: auto;
	font-size: 18px;
	color: #820000;
	text-align: center;
	padding: 1px 6px;
	margin: 0;
	background: Transparent url(../images/supplemental/bg-account-module-panel.png) top right;
}

.home #account-module p.intro {
	min-height: 28px;
	text-align: center;
	background: Transparent url(../images/supplemental/bg-account-module-panel.png) bottom left;
	width: 172px;
	margin: 8px 0 0 0;
}

.home #account-module p.intro strong {
	color: #820000;
	display: block;
	padding: 1px 6px 6px;
	background: Transparent url(../images/supplemental/bg-account-module-panel.png) top right;
}

.home #account-module form,
.home #account-module div.submit {
	width: auto;
}

.home #account-module div.field {
	margin: 2px 0;
}

.home #account-module div.submit {
	margin-top: 6px;
}

#form_login #id_join {
	margin-left: 6px;
}

#forgotten-password-container {
	text-align: center;
	margin-top: 12px;
	padding-right: 6px;
}

#forgotten-password-container a {
	color: #000;
	font-size: 10px;
}

.home #account-module div.field .field-help {
	color: #000;
	font-size: 10px;
}

.home #account-module div.text input {
	-moz-border-radius: 0;
	border: 1px solid #b0b0b2;
	width: 160px;
	height: 12px;
}

.home #account-module div.checkorradio {
	padding: 0 6px 0 0;
	margin-top: 6px;
}

.home #account-module div.checkorradio label {
	padding-left: 20px;
	font-size: 12px !important;
	margin-bottom: 2px;
	margin-top: 2px;
}

/*
  ------------------------------------------------
  rates ticker
  ------------------------------------------------
*/
#rates-ticker {
	background:transparent url(../images/supplemental/bg-ticker.png) no-repeat scroll 0 0;
	width: 761px;
	position: relative;
	margin: 0;
}

#rates-ticker h2 {
	position: absolute;
	top: 8px;
	left: 13px;
}

#rates-ticker h2 a {
	font-size: 12px;
	font-weight: bold;
	padding: 0;
	color: #000;
}

#rates-ticker ul {
	position: absolute;
	top: 8px;
	left: 155px;
	width: 555px;
}

#rates-ticker span.separator {
	position: absolute;
	display: block;
	top: 9px;
	left: 138px;
	font-size: 10px;
}

#rates-ticker li {
	font-size: 12px;
	padding: 0;
	margin: 0;
}

#rates-ticker li span.inner {
	width: 550px;
}

#rates-ticker li span.rate,
#rates-ticker li span.rate span.inner,
#rates-ticker li span.rate-value {
	border: none;
	background: Transparent;
}

#rates-ticker li span.rate-value {
	color: #820000;
	font-weight: bold;
}

#rates-ticker li span.rate span.rates-src,
#rates-ticker li span.rate span.rates-dest {
	font-weight: bold;
}

#ticker-next,
#ticker-prev
{
	right: 10px;
	width: 11px;
	height: 11px;
	background-image: url(../images/supplemental/icon-nextprev.gif);
	text-indent: 10px;
}

#ticker-next,
#ticker-next:hover {
	background-position: -11px 0;
	right: 10px;
}

#ticker-prev,
#ticker-prev:hover {
	background-position: 0 0;
	right: 27px;
}

/*
  ------------------------------------------------
  footer
  ------------------------------------------------
*/
#footer {
    background: Transparent url('../images/supplemental/bg-footer.png') bottom no-repeat;
	width: auto;
	padding: 0 0 18px 0;
}

#nav-footer {
	background: transparent url(../images/supplemental/bg-footernav.png) no-repeat;
	margin-left: 14px;
}

#nav-footer ul {
	margin-right: 16px;
}

#nav-footer li {
	font-size: 12px;
	color: #000;
}

#nav-footer li a {
	font-size: 12px;
	color: #820000;
}

#nav-footer li a:hover {
	color: #b90000;
}

#nav-footer li strong {
	font-weight: normal;
}