/* phonegnome.css */


/* general declarations */

* { margin: 0; padding: 0; }


body {
	text-align: center;
	font-family: "lucida grande", verdana, arial, helvetica, sans-serif;
	font-size: 12px;
	background: url("../images/tile2.gif") repeat /* #dfdddb */;
}

h1, h2, h3, h5 {
        font-family: "trebuchet ms", arial, helvetica, sans-serif;
}

h1 {
	color: #5c5c70;
	font-size: 200%;
	font-weight: normal;
	text-align: left;
}

h2 {
	padding: 5px 0px;
	font-size: 180%;
	font-weight: normal;
	line-height: 1.5em;
	color: #633;
	text-align: left;
}

h3 {
	padding: .83em 0;
     padding-bottom: 0;
	font-size: 140%;
	font-weight: bold;
	line-height: 1.2em;
	color: #666;
	text-align: left;
}


p, ul, ol, blockquote {
	font-family: "lucida grande", verdana, arial, helvetica, sans-serif;
	padding: 10px 0px;
	line-height: 1.5em;
	text-align: left;
}

dt, dd {
	text-align: left;
}

dd {
	margin-left: 40px;
}

dt {
	margin-left: 15px;
}

pre {
        font-family: "Couier", monospace;
        padding: 10px 0px;
        line-height: 1.5em;
        text-align: left;
}

ul, ol, blockquote {
	margin-left: 15px;
	padding-left: 15px;
}

li {
	padding: 3px 0px;
}

a {
	color: #313863;
}

a:visited {
	color: #666;
}

a:hover {
	color: #633;
}

.links a { font-weight: bold; }
.links a:hover { font-weight: bold; color: #633; }

table { 
	border: 0px; 
	text-align: left;
}

th, td {
	padding: 10px;
}

img {
	vertical-align: bottom;
	border: 0px;
}

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


.tablewrapper {
	text-align: center;
}
	
/* used on free.html and friends.html */
.standout {
/*        margin:0 20px;
        padding: 4px 10px;  */
        font-weight: normal;
        line-height: 1.5em;
        color: #333;
        text-align: left;
}

/* div specific declarations */

#wrapper {
	width: 754px;
	margin: auto;
	text-align: center;
	border-left: 1px solid #666; /* was 5c5c70  */
 	border-right: 1px solid #666;
	background-color: #dfdddb;
}

#mmwrapper {
	border-bottom: 1px solid #999;
	text-align: center;
	clear: both;
}

#mainmenu {
	background-color: #dfdddb;
	margin: auto;
	width: 754px;
}

#mainmenu a {
	background-color: #dfdddb;
	display: block;
	color: #61617e;
	float: left;
	padding: 7px 24px;
	text-decoration: none;
	border-right: 1px solid #ccc;
}

#mainmenu a.last {
	border-right: 0px;
	margin-right: -3px;
}


#mainmenu a:hover {
	color: white;
/*	background: #61617E; */
	background: #633;
}


#home { width: 140px;  }
#store {  width: 110px; }
#forum { width: 120px; }
#about, #contact { width: 70px; }


#content {
	text-align: center;
	padding: 40px 40px 20px 40px;
	background: url("../images/menu-shadow_grey.gif") top left repeat-x white;
	border-bottom: 1px solid white;
}

/* leftblurb used on front page and how_to_buy.html page */
#leftblurb {
	width: 320px;
	float: left;
	padding: 0px 40px 40px 40px;
}

#lefttext {
	position: relative;
	padding: 0px 40px 40px 40px;
}


/* footer and copyright */

#copyright {
	background: #faa223;
	font-size: 90%;
	color: white;
}

#copyright p {
	text-align: center;
}



#footer {
	text-align: right;
	background-color: #5c5c70;
	margin-top: -1px;
}	

.heightindicator {
	clear: both;

}


/********************************************/
/* Declarations specifc to individual pages */
/********************************************/


/****************************/
/* front page specific divs */


/* #right used on 'free.html' */
#mainimage, #right {
	width: 250px;
	float: left;
	padding-top: 0px;
	padding-bottom: 10px;
}

#mainimage h4 {
	padding: .83em 0;
}

#adv {  /* table containing advantages */
	clear: both;
	vertical-align: top;
	width: 600px;
	margin: auto;
} 

td { vertical-align: top; }

td.advantages {
	width: 40%;
}

td#plus { 
	vertical-align: middle; 
	padding: 20px;
	color: #b09254;
	font-weight: bold;
	font-size: 130%;
	width: 10%;	
}

#zerocost, #lowrates, #minutes, .featuresBox {
	border: 1px solid #b8cee2;
}

.corner {
	float: left;
	margin-top: -1px;
	margin-left: -1px;
	width: 21px;
	height: 21px;
	position: relative;
}

.boxesbottom {
	background: url("../images/menu-shadow.gif") top left repeat-x;
	height: 10px;
}

#zerocost p, #lowrates p, #minutes p, .featuresBox p {
	padding: 10px 30px;
}


#zerocost h1, #lowrates h1, #minutes h1, .featuresBox h1 {
	padding: 5px 12px;
	font-size: 140%;
	text-align: center;
	color: #333;
	background: #edf3f8;
	border-bottom: 1px solid #b8cee2;

}



/* everybodywins on front page */
#everybodywins {
	width: 200px;
	height: 70px;
	padding: 0;
	border: 1px solid #000;
	margin: 8px;

}

/***************************************************/
/* how_phonegnome_works.html specific declarations */


/* wrapper around the three columns so we have better control of 
   the total placement */

#steps_wrapper {
	margin: auto;
	text-align: center;
	padding-left: 15px;
}

/* class for each 'steps' column */
.steps
{
	padding: 0px;
	margin: 10px 0px 0px 0px;
	width: 202px;
	color: #333;
	float: left;    
	text-align: center;
	
}

/* specific declarations for things inside 'steps' column */
.steps h4 {
	padding: 1em 0;
	font-size: 130%;
	font-family: "trebuchet ms", arial, helvetica, sans-serif;
	font-weight: bold;
	line-height: 1.2em;
	color: #666;
	text-align: center;
}

.steps p {
	padding: 20px 10px 34px 13px;
	color: #000;
	text-align: left;
	height: 7em;
	margin: auto;
}

.steps img {
	text-align: center;
}

.steps .learn_more {
	padding: 0px 0px 30px 0px;
}

/* vertical separator */
.dotted
{
        margin: 10px;
        width: 3px; 
        height: 26em;
        float: left;
        display: inline;
        background: url("../images/dotted.gif");
 
}

/*****************************************/
/* how_to_buy.html specific declarations */

.buy {
	text-align: center;
}

#bluebox_wrapper {
	width: 250px;
	float: left;
	padding-left: 20px;

}

/********************************************/
/* how_to_buy.html and free.html uses these */

#bluebox {
	border: 1px solid #b8cee2;
	padding-bottom: 10px;
}

#bluebox p {
	padding: 10px 30px;
	font-size: 95%;
}

#bluebox h1 {
	padding: 5px 12px;
	font-size: 140%;
	text-align: center;
	color: #333;
    background: #edf3f8;
	border-bottom: 1px solid #b8cee2;
}


#bluebox h3, #bluebox ul, #bluebox ol {
	padding: 10px 20px;
}

#bluebox h3 {
	font-size: 120%;
	color: #666;
	text-align: center;
}

#bluebox ul, #bluebox ol {
	color: #630; 
}

/*****************************************************************************/
/* minutes.html specific declarations 
/* we also refer to declarations exactly like #lowrate and #zerocost, see 
/* declarations for front page */


#minutes #rate {
	padding: 10px 0px 10px 0px;
}

#minutes h2 {
	padding: 20px 10px 10px 0px;
}

#destinations {
	padding: 10px 0px;
}

#minutes #rate,  #destinations #dest_list {
	float: left;
	width: 250px;
}

#minutes h2, #destinations #map { 
	float: left; 
	width: 300px; 

}

/**************************************/
/* friends.html specific declarations */

#friendsprices {
	text-align: center;
	float: left;
	margin: 0px 30px 30px 0px;
}

#friendsprices th {
	border-bottom: 1px solid #ccc;
}

.originalprice {
	color: #363;
	font-weight: bold;
}
.specialprice {
	color: white;
	font-weight: bold;
	background-color: #f30;
}

/************************************/
/* setup.html specific declarations */

.setupleft, .setupright {
	float: left;
}

.setuptext {
	width: 216px;
}

.setupleft .setuptext  {
	padding: 0px 30px 0px 0px;
}

.setupright .setuptext {
	padding: 0px 0px 0px 30px;
}

.setupleft h3, .setupright h3 {
	padding: 5px;
}

.setupleft p, .setupright p {
	padding: 5px;
}

.setuprow {
	clear: both;
	padding: 20px 0px;
}

/************************************/
/* using.html specific declarations */


/* refer also to .featuresBox definitions which are identical to
   that of #zerocost and #lowcost */

#featurestable * td {
	width: 300px;
}

 .featuresBox ul, .featuresBox ol {
 	padding-left: 30px;
 	margin-left: 30px;
 }


/**********************************/
/* FAQ page specific declarations */

#faq-full {
    text-align: center;
}

#faq-full h2 { 
	border-bottom: 1px solid #b8cee2;
}
 #faq-full p, #faq-full ol {
        padding-left: 30px;
}

#categories { 
	text-align: left;
	width: 150px;
	float: left;
	padding: 10px;
}

#categories h3 {
	font-size: 100%;
	color: #333;
	padding-top: 20px;
	border-bottom: 1px solid #b8cee2;
}

#categories ul {
	list-style: none;
	padding-left: 5px;
	margin-left: 5px;
}


#faq-main {
	float: left;
	border-left: 1px solid #b8cee2;
	width: 503px;

}

#questionswrapper {
		background-color: #edf3f8; 
        padding: 20px;
        text-align: left;
        color: #333;
        line-height: 1.2em;
}

#questionswrapper h2 {
	padding: 0px 0px 10px 0px;
    font-size: 160%;
    font-weight: bold;
	color: #313863; 
	text-align: left;
	border: 0px;
}

/* ordered list of questions */
#questions li {
        padding-bottom: 6px;
}
 
#categories * a, #questions a {

        text-decoration: none;
        border-bottom: 1px dotted #313863;
}
 
#categories * a:hover, #questions a:hover {
        border-bottom: 1px solid #633;
}
      
/* class for individual questions */
.question {
        padding-top: 15px;
        font-weight: bold;
        color: black;
        text-align: left;
}

#answers {
        width: 70%;
        margin:auto;
        text-align: left;
}       

p.toplink { text-align: right; font-size: 90%; }

p.fineprint { font-size: 75%; }
#leftnav {
width: 175px;
margin-left: 7px;
padding: 0px;
float: left;
}

#leftnav {
margin: 0px;
padding-bottom: 15px;
font: 11px arial, helvetica, sans-serif;
}

#leftnav ul {
margin: 0px;
padding: 0px;
border: none;
list-style-type: none;
}
#leftnav li {
margin: 0;

}

html>body #leftnav li a {
width: auto;
height: auto;
}

#leftnav ul li a {
height: 16px;
display: block;
padding: 3px 0px 0px 14px;
/* border-bottom: 1px dashed #C1E7FF; */
/* color: #005FA2; */
border-bottom: 1px dashed #d56321;
color: #986313;
background-color: #FBFBFB;
text-decoration: none;

}
#leftnav ul li a:hover {
background-color: #fff;
/* color: #2773AF; */
color: #eb6e19;
}

p.ha 
{
        border: 0;
        background-color: white;
        padding-top: 4px;
        padding-bottom: 4px;
        padding-left: 4px;
        padding-right:4px;
        margin: 0px 0px 4px 0px;

}
.ha {
/* background-color: #2772AC; */
background-color: #633;
margin: 0px;
padding: 6px 6px 3px 6px;
color: white;
font: bold 14px, arial, helvetica, sans-serif;
}

.ha  a:link 
{
   font-size: 14px;
   color: white;

 }

.ha  a:visited { 
    font-size: 14px;
    color: white;

 }

.var {
	color: red;
	font-style: italic;
}
.sample {
	background: #DDDDDD;
}