@import url(dialog.css);
@import url(forms.css);

/* GLOBAL
-------------------------------------------------------- */
html,body,p,div,img,h1,h2,h3,h4,li,ul,ol,dl,dd,dt,form,table,td,tr
{
	margin:0;
	padding:0;
	border:0;
	border-collapse:separate;
	border-spacing:0;
}

html,body
{
	height:100%;
}

body
{
	font:62.5%/180% "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	color:#444;
	background:#FFF url(../img/bg.gif) repeat-x;
	text-align:center;
}

*
{
	margin:0;
}

p
{
	font-size:1.2em;
	margin-bottom:10px;
}

#bgMountain
{
	background:url(../img/home/bg-mountain.gif) repeat-x 50% 0;
	height:234px;
	margin:0 0 84px;
	z-index:10;
}

#mascot
{
	background:url(../img/mascot.png) no-repeat;
	width:79px;
	height:113px;
	float:right;
	z-index:50;
}

#container
{
	min-height:100%;
	height:auto!important;
	height:100%;
	margin:0 auto -80px; /* the bottom margin is the negative value of the footer's height */
}

#page
{
	width:750px;
	margin:30px auto 0;
	text-align:left;
}

a:link,a:visited
{
	text-decoration:underline;
	color:#55afef;
	font-weight:normal;
}

a:hover
{
	color:#000;
	text-decoration:none;
}

ul#quicklinks a:link, ul#quicklinks a:visited
{
	text-decoration:none;
	color:#55afef;
	font-weight:700;
}




ul#quicklinks a:hover
{
	color:#000;
	text-decoration:none;
}

#skip
{
	display:none;
}

#error
{
	color:red;
	font-size:1.2em;
}

/* THAWTE SECURITY
-------------------------------------------------------- */

#security
{
	height:60px;
	float:left;
	width:180px;
	margin:10px 0;
}

#security img
{
	float:left;
	margin-right:10px;
}

#security em
{
	font-size:1.2em;
	font-style:normal;
	font-weight:700;
}

/* CLEARFIX
-------------------------------------------------------- */
#myYabba:after,#DIV_joinClub:after,.btns:after,.content:after,#page:after, .accountSummary:after
{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

/* NAV
-------------------------------------------------------- */
#nav
{
	min-width:779px;
	width:779px;
	height:30px;
	background-color:#3f6778;
	margin:0 auto;
}

#nav ul
{
	margin:0;
	padding:0;
}

	
#nav li
{
	float:left;
	margin:0;
	list-style-type:none;
}

#nav li a
{
	display:block;
	height:0!important;
	height /**/:30px; /* IE 5/Win hack */
	padding:30px 0 0 0;
	overflow:hidden;
}

.hidden
{
	display:none;
}

#nav li a:hover
{
	background-position:0 -30px;
}

#nav li#home,#nav li#home a
{
	width:71px;
	background-image:url(../img/nav/home.gif);
}

#nav li#yabbaClub,#nav li#yabbaClub a
{
	width:101px;
	background-image:url(../img/nav/yabbaclub.gif);
}

#nav li#rechargeOrBuy,#nav li#rechargeOrBuy a
{
	width:163px;
	background-image:url(../img/nav/recharge.gif);
}

#nav li#callRates,#nav li#callRates a
{
	width:97px;
	background-image:url(../img/nav/callrates.gif);
}

#nav li#accessNumbers,#nav li#accessNumbers a
{
	width:133px;
	background-image:url(../img/nav/accessnumbers.gif);
}

#nav li#whereToBuy,#nav li#whereToBuy a
{
	width:119px;
	background-image:url(../img/nav/wheretobuy.gif);
}

#nav li#needHelp,#nav li#needHelp a
{
	width:95px;
	background-image:url(../img/nav/needhelp.gif);
}

body.home li#home,body.home li#home a,body.home li#home a:hover
body.yabbaClub li#yabbaClub,body.yabbaClub li#yabbaClub a,body.yabbaClub li#yabbaClub a:hover,body.rechargeOrBuy li#rechargeOrBuy,body.rechargeOrBuy li#rechargeOrBuy a,body.rechargeOrBuy li#rechargeOrBuy a:hover,body.callRates li#callRates,body.callRates li#callRates a,body.callRates li#callRates a:hover,body.accessNumbers li#accessNumbers,body.accessNumbers li#accessNumbers a,body.accessNumbers li#accessNumbers a:hover,body.whereToBuy li#whereToBuy,body.whereToBuy li#whereToBuy a,body.whereToBuy li#whereToBuy a:hover,body.needHelp li#needHelp,body.needHelp li#needHelp a,body.needHelp li#needHelp a:hover
{
	background-position:0 -30px;
}

/* HEADER
-------------------------------------------------------- */
#header
{
	background:url(../img/header-bg.jpg) no-repeat 50% 60%;
	min-width:779px;
	height:150px;
}

#header-content
{
	width:779px;
	margin:0 auto;
}

#header #header-logo
{
	width:253px;
	padding:0;
	margin:0;
	position:absolute;
	top:49px;
	z-index:30;
}

#header #logo-telecom
{
	background:url(../img/telecom_new.gif) no-repeat;
	width:148px;
	height:61px;
	position:absolute;
	top:49px;
	margin-left:450px;
}

#header #header-card
{
	background:url(../img/yabbacard.png) no-repeat;
	position:absolute;
	top:40px;
	margin:0 0 0 631px;
	padding:0;
}

#header #header-card-btm
{
	background:url(../img/yabbacardbtm.gif) no-repeat;
	position:absolute;
	top:132px;
	margin:0 0 0 640px;
	padding:0;
	width:125px;
	height:42px;
}

#header #header-card a
{
	display:block;
	width:143px;
	height:92px;
}

#header #header-logo h1
{
	background:url(../img/header-logo.png) no-repeat;
	width:253px;
	height:115px;
	margin-left:-10px;
}

#header #header-logo h1 a
{
	display:block;
	width:253px;
	height:115px;
}

#header #header-logo h1 span,#logo-telecom span,#header-card span
{
	position:absolute;
	left:-5000px;
	width:4000px;
}

#header-bdr
{
	background:url(../img/header-bdr.png) repeat-x;
	height:5px;
	position:absolute;
	top:125px;
	width:100%;
}

/* MAIN BUTTONS
-------------------------------------------------------- */
h4#buycard a,h4#rechargenow a,h4#competition a,h4#joinclub a,h4#joinclub2 a,h4#referfriend a
{
	background-repeat:no-repeat;
	display:block;
	height:40px;
	text-decoration:none;
	width:220px;
	margin:0 0 10px;
}

h4#buycard a
{
	background:url(../img/btns/buycard.png) no-repeat;
}

h4#rechargenow a
{
	background:url(../img/btns/recharge.png) no-repeat;
}

h4#competition a
{
	background:url(../img/btns/competition.gif) no-repeat;
}

h4#joinclub a, h4#joinclub2 a
{
	background:url(../img/btns/jointheclub.gif) no-repeat;
}

h4#referfriend a
{
	background:url(../img/btns/referfriend.gif) no-repeat;
}

h4#buycard a:hover,h4#rechargenow a:hover,h4#competition a:hover,h4#joinclub a:hover,h4#joinclub2 a:hover,h4#referfriend a:hover
{
	background-position:0 -40px;
}

/* OTHER BUTTONS
-------------------------------------------------------- */
.btns
{
	clear:both;
	height:29px;
}

h4#save,h4#back,h4#continue,h4#preview,h4#print,h4#send,h4#enter
{
	float:left;
	margin:0 10px 0 0;
}

h4#save a,h4#back a,h4#continue a,h4#preview a,h4#print a,h4#send a,h4#enter a
{
	background-repeat:no-repeat;
	display:block;
	height:29px;
	text-decoration:none;
	width:100px;
	margin:0 0 10px;
}

h4#save a
{
	background:url(../img/btns/save.gif) no-repeat;
}

h4#back a
{
	background:url(../img/btns/back.gif) no-repeat;
}

h4#continue a
{
	background:url(../img/btns/continue.gif) no-repeat;
}

h4#preview a
{
	background:url(../img/btns/preview.gif) no-repeat;
}

h4#print a
{
	background:url(../img/btns/print_bl_bg.gif) no-repeat;
}

h4#send a
{
	background:url(../img/btns/send.gif) no-repeat;
}

h4#enter a
{
	background:url(../img/btns/enter.gif) no-repeat;
}

h4#save a:hover,h4#back a:hover,h4#continue a:hover,h4#preview a:hover,h4#print a:hover,h4#send a:hover,h4#enter a:hover
{
	background-position:0 -29px;
}

#page h4 span
{
	position:absolute;
	left:-5000px;
	width:4000px;
}

/* HOME DIALOG BOXES
-------------------------------------------------------- */
#page .dialog
{
	float:left;
}

#page .dialog h2
{
	color:#55afef;
}

#page .dialog p
{
	color:#444;
}

#page .right h2
{
	text-transform:uppercase;
}

/* HOME HEADERS
-------------------------------------------------------- */
.home h2
{
	color:#55afef;
	font-size:2em;
	margin:0 0 20px;
	letter-spacing:-1px;
}

.home h3
{
	font-size:1.8em;
	color:#55afef;
	letter-spacing:-1px;
	margin:0 0 20px;
}

.home #homeintro p
{
	text-transform:uppercase;
	margin:0 0 10px;
	font-size:1.6em;
	color:#999;
}

/* PAGE HEADERS
-------------------------------------------------------- */
.rechargeOrBuy h2,.yabbaClub h2,.callRates h2,.accessNumbers h2,.whereToBuy h2,.needHelp h2,.competitionArea h2
{
	color:#55afef;
	font-size:2em;
	margin:0 0 20px;
	letter-spacing:-1px;
}

#page h5
{
	font-size:1.4em;
}

/* TOOLTIP
-------------------------------------------------------- */
.tool-tip
{
	color:#fff;
	width:139px;
	z-index:13000;
}

.tool-title
{
	font-weight:700;
	font-size:11px;
	margin:0;
	color:#FFF;
	padding:8px 8px 4px;
	background:url(../img/bubble.png) top left;
}

.tool-text
{
	font-size:11px;
	padding:4px 8px 8px;
	background:url(../img/bubble.png) bottom right;
}

.custom-tip
{
	color:#000;
	width:130px;
	z-index:13000;
}

.custom-title
{
	font-weight:700;
	font-size:11px;
	margin:0;
	color:#3E4F14;
	padding:8px 8px 4px;
	background:#C3DF7D;
	border-bottom:1px solid #B5CF74;
}

.custom-text
{
	font-size:11px;
	padding:4px 8px 8px;
	background:#CFDFA7;
}

/* PRIMARY/SECONDARY/MAIN CONTENT DIVS
-------------------------------------------------------- */
#primaryContent
{
	width:490px;
	float:left;
}

#primaryContent p,#secondaryContent p
{
	margin:0 0 10px;
}

#primaryContent #homeintro
{
	margin:10px 0 20px;
}

#primaryContent #homeintro p
{
	text-transform:uppercase;
	margin:0 0 10px;
	font-size:1.6em;
	color:#999;
}

#primaryContent #homeintro .left
{
	background:url(../img/home/globe.png) no-repeat 0 0;
	width:135px;
	height:123px;
	float:left;
}

#primaryContent #homeintro .right
{
	width:354px;
	float:left;
}

#primaryContent .dialog .content .left
{
	width:123px;
	float:left;
}

#primaryContent .dialog .content .d1left
{
	background:url(../img/home/dialog-1.png) no-repeat;
	height:62px;
	width:123px;
	float:left;
}

#primaryContent .dialog .content .d2left
{
	background:url(../img/home/dialog-2.gif) no-repeat;
	/*height:85px;*/
	height:141px;
	width:123px;
	float:left;
}

#primaryContent .dialog .content .d3left
{
	background:url(../img/home/dialog-3.png) no-repeat 50% 0;
	height:158px;
	width:123px;
	float:left;
}

#primaryContent .dialog .content .right
{
	width:342px;
	float:left;
}

#secondaryContent
{
	width:240px;
	float:right;
}

#secondaryContent h3
{
	background:url(../img/dottedline.gif) repeat-x bottom left;
	font-size:1.4em;
	padding:0;
	text-transform:uppercase;
}

#secondaryContent #banner
{
	background:url(../img/flashbanner.gif) no-repeat;
	width:240px;
	height:212px;
	margin:20px 0;
}

#secondaryContent h4
{
	font-size:1.3em;
	color:#55afef;
	margin:0 0 10px;
	clear:both;
}

#mainContent
{
	margin-bottom:50px;
	clear:both;
}

#mainContent h3
{
	margin:0;
	color:#fff;
}

#mainContent p
{
	margin-bottom:10px;
}

/* CALL RATES
-------------------------------------------------------- */
.hdrCallRates
{
	background:url(../img/tblHdrCallRates2.gif) no-repeat;
	height:77px;
	width:490px;
}

.hdrCallRates .callingFrom
{
	float:left;
	width:490px;
	margin:10px 0 0;
}

.hdrCallRates .callingTo
{
	float:left;
	width:490px;
	margin:10px 0 0;
}

.txt
{
	width:232px;
}

.hdrCallRates .callingFrom em,.hdrCallRates .callingTo em
{
	color:#000;
	font-size:1.4em;
	float:left;
	font-style:normal;
}

.hdrCallRates .callingFrom label,.hdrCallRates .callingTo label
{
	color:#fff;
	font-size:1.4em;
	margin:0;
	padding:4px 10px 0 50px;
	width:170px;
}

.hdrCallRates .callingFrom select,.hdrCallRates .callingTo select
{
	font-size:1.3em;
	border:none;
	padding:0;
	float:none;
	width:240px;
	height:22px;
	padding:3px 2px;
}

.callRates table
{
	width: 489px;
	border-top: 1px solid #c1e0f5;
	border-right: 1px solid #c1e0f5;
	margin: 2px 0 2px 1px;
	border-collapse: collapse;
}

.callRates .column1
{
	text-align:left;
}

.callRates td
{
	color:#444;
	border-bottom:1px solid #c1e0f5;
	border-left:1px solid #c1e0f5;
	padding:.3em .8em;
	text-align:left;
	font-size:1.2em;
}

.callRates th
{
	font-weight:400;
	font-size:1.2em;
	color:#444;
	font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	text-align:left;
	border-bottom:1px solid #c1e0f5;
	border-left:1px solid #c1e0f5;
	padding:.3em .8em;
}

.callRates thead th
{
	background:#deeff9;
	text-align:left;
	font:bold 1.3em/2em "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	color:#444;
}

/* THANKYOU
-------------------------------------------------------- */

ul#card-info li
{
	margin:0 0 10px 25px;
	list-style-image:url(../img/icons/info.gif);
	float:none;
	width:auto;
	display:list-item;
	padding:0 0 0 20px;
}



/* TERMS AND CONDITIONS
-------------------------------------------------------- */
ul.terms
{
	margin: 0 0 10px 0;
	padding-left: 16px;
}

ul.terms li
{

	list-style-image: url(../img/squaredot.gif);
	display:list-item;
	margin:0;
	float:none;
}

/* CALLING TIPS
-------------------------------------------------------- */
ul#calling-tips
{
	font-size:1em;
	margin-bottom:20px;
}

ul#calling-tips li
{
	display:inline;
	float:none;
}

ul#calling-tips li a
{
	background:url(../img/downarrow.gif) no-repeat left center;
	padding:0 10px 0 15px;
}

/* NEED HELP
-------------------------------------------------------- */
.needHelp ol
{
	margin:0 0 0 20px;
}

.needHelp li
{
	font-size:1.2em;
	float:none;
	display:list-item;
	width:auto;
}

.needHelp table, .needHelp td
{
	border-style: none;
}

.box em
{
	font-style:normal;
	font-weight:700;
}

/* ACCESS NUMBERS
-------------------------------------------------------- */
.accessNumbers ol
{
	list-style:upper-alpha;
	margin:0 0 0 25px;
}

.accessNumbers li
{
	font-size:1.2em;
	display:list-item;
	float:none;
	width:auto;
}

/* YABBA CLUB
-------------------------------------------------------- */

.yabbaClub #intro ul
{
	float:left;
	width:200px;
	margin:0 0 0 20px;
	padding:0;
}

.yabbaClub #intro li
{
	background:url(../img/dottedline.gif) repeat-x bottom left;
}

.yabbaClub #intro li a
{
	background:url(../img/downarrow.gif) no-repeat left center;
	display:block;
	padding:5px 0 5px 20px;
}

.yabbaClub #intro h4
{
	float:left;
}

.yabbaClub #intro
{
	background:url(../img/yabbaClub.gif) no-repeat right top;
	height:150px;
}

.yabbaClub #loggedin, .competitionArea #loggedin
{
	float:left;
}

.home #loggedin
{
	float:none;
}

.yabbaClub #loggedin #hdr, .competitionArea #loggedin #hdr, .home #loggedin #hdr
{
	margin:0;
	float:left;
	width:400px;
}

.yabbaClub #loggedin p, .competitionArea #loggedin p, .home #loggedin p
{
	float:right;
}

.yabbaClub .tbl_instructions
{
	padding: 3px;
	border-style: none;
}

.yabbaClub .tbl_instructions td
{
	border-style: none;
	font-family: Arial, Helvetica, sans-serif;
}



/* YABBA CLUB - ACCOUNT INFO
-------------------------------------------------------- */




#accountInfoA,#accountInfoB
{
	margin:0;
	width:242px;
}

#accountInfoA
{
	float:left;
}

#accountInfoB
{
	float:right;
}

#accountInfoA strong,#accountInfoB strong
{
	font-size:1.2em;
	color:#FFF;
	float:left;
	margin-top:5px;
}

#accountInfoA ul li,#accountInfoB ul li
{
	float:none;
	width:auto;
	padding-bottom:5px;
	display:block;
}

#accountInfoA ul li a,#accountInfoB ul li a
{
	background:url(../img/btns/accountinfo.gif) no-repeat;
	display:block;
	padding:0 10px;
	height:46px;
}

#accountInfoA ul li a:hover,#accountInfoB ul li a:hover
{
	background-position:0 -46px;
}

#accountInfoA ul li a span,#accountInfoB ul li a span
{
	font-size:1em;
	color:#FFF;
	font-weight:400;
}

/* HOME
-------------------------------------------------------- */
#myYabba
{
	margin:10px 0 0;
}

/* COMPETITION AREA
-------------------------------------------------------- */
#competitionArea
{
	margin:20px 0 0;
}

/* YABBA CLUB - MY CALLS
-------------------------------------------------------- */
#callDetails
{
	margin:0 0 10px;
	float:left;
}

#callDetails .left
{
	float:left;
}

#callDetails .right
{
	float:right;
}

#callDetails select
{
	margin:0 0 0 10px;
}

#callDetails p
{
	display:inline;
}

#callDetails .right p
{
	margin:0 0 0 10px;
}

/* YABBA CLUB - OPTIONS BOX
-------------------------------------------------------- */
#options
{
	float:left;
	width:100%;
}

#options #breadcrumb
{
	float:left;
}

#options #tools
{
	float:right;
}

/* YABBA CLUB - JOIN CLUB
-------------------------------------------------------- */
#DIV_joinClub
{
	background:url(../img/home/free.gif) no-repeat 100% 25%;
	margin:20px 0 0;
}

#DIV_joinClub li
{
	padding:0 20px 10px 15px;
	background:url(../img/listarrow.gif) no-repeat 0 2px;
	float:none;
	width:auto;
}

/* YABBA BOX DIVS
-------------------------------------------------------- */
.box
{
	padding:20px;
	margin:0 0 20px;
	background:#deeff9;
	color:#444;
}

#page .box h3
{
	font-size:1.6em;
	line-height:150%;
	color:#55afef;
	margin-bottom:20px;
}

.yabbaClub #page .box h3.accessnumbers
{
	margin:0;
	float:left;
}

.yabbaClub #page .box h3.speeddials
{
	margin:0 0 10px 50px;
	float:left;
}

.yabbaClub #page .box h3, .home #path .box h3
{
	margin:0 0 10px;
}

.box h4
{
	font-size:1.3em;
	color:#55afef;
	margin:10px 0 0;
}

#page .box p, #page .error p, #page .success p
{
	margin: 0 0 10px 0;
}

#page .error p
{
	background: url(../img/icons/failed.gif) no-repeat left center;
	padding-left: 50px;
	padding-top: 15px;
	padding-bottom: 15px;
}

#page .success p
{
	background: url(../img/icons/success.gif) no-repeat left center;
	padding-left: 50px;
	padding-top: 15px;
	padding-bottom: 15px;
}

.error
{
	padding:20px;
	margin:0 0 20px;
	background:#ffcfcf;
	color:#444;
}

.success
{
	padding: 20px;
	margin: 0 0 20px;
	background: #b3e594;
	color: #444;
}

/* TABLES
-------------------------------------------------------- */

.yabbaClub table#accountSummary {
	border: none;
}

.yabbaClub #accountSummary thead th {
	text-align:left;
	background: none;
	border: none;
	font-size:1.6em;
	line-height:150%;
	color:#55afef;
	padding: 0;
}



.yabbaClub #accountSummary .col1
{
	width:120px;
}

.yabbaClub td,.rechargeOrBuy td
{
	border:none;
	padding:0;
	text-align:left;
}

.yabbaClub table,.rechargeOrBuy table
{
	width:auto;
}

.yabbaClub table#myCalls,.yabbaClub table#autoPin,.yabbaClub table#rechargeHistory, .yabbaClub table#speedDials, .yabbaClub table#accountSummary
{
	width:100%;
	clear:both;
}

.yabbaClub table#myCalls td,.yabbaClub table#autoPin td,.yabbaClub table#rechargeHistory td,.yabbaClub table#speedDials td
{
	padding:.3em 1em;
	border-bottom:1px solid #c1e0f5;
	border-left:1px solid #c1e0f5;
}

.callRates .colRPM
{
	width: 170px;
}

.callRates .col1
{
	width:34px;
}

.callRates .col2
{
	width:144px;
}

/* BASE TABLE STYLES
-------------------------------------------------------- */
table
{
	width:100%;
	border-top:1px solid #c1e0f5;

	border-right:1px solid #c1e0f5;

	margin:0 auto;
	border-collapse:collapse;
}

td
{
	color:#444;
	border-bottom:1px solid #c1e0f5;
	border-left:1px solid #c1e0f5;
	font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	padding:.3em 1em;
	text-align:left;
	font-size:1.2em;
}

th
{
	font-weight:400;
	font-size:1.2em;
	color:#444;
	font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	text-align:left;
	border-bottom:1px solid #c1e0f5;
	border-left:1px solid #c1e0f5;
	padding:.3em .8em;
}

thead th
{
	background:#c1e0f5;
	text-align:left;
	font:bold 1.2em/2em "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	color:#444;
}

/* FOOTER
-------------------------------------------------------- */
#footer
{
	background-color:#8ec4f3;
	color:#FFF;
}

#footer,.push
{
	height:100px;
/* .push must be the same height as .footer */
}

#footer #info
{
	margin:0 auto;
	width:750px;
}

#footer #info .left
{
	float:left;
}

#footer #info .right
{
	float:right;
}

#footer p
{
	font-size:1.1em;
	clear:both;
	text-align:left;
	margin-bottom:10px;
}

#footer a
{
	text-decoration:none;
	color:#FFF;
	font-weight:400;
}

#footer a:hover
{
	color:#FFF;
	text-decoration:underline;
}

#footer #bdr
{
	background:url(../img/footer-bdr.png) repeat-x;
	height:10px;
	position:relative;
	top:-10px;
	width:100%;
}

.lbluebg
{
	background-color:#deeff9;
}

.whitebg
{
	background-color:#FFFFFF;
}

.space_30px 
{
	margin-top:30px;
}

.div_mobilesincluded
{
	text-align: center;
	font-size: 12px;
}