body{background-color:#000;color:#000;font:.90em arial,helvetica,sans-serif;}
a:link {color:#0000CC;}
a:visited {color:#0000CC;}
a:hover {color:#66c;}
img {border:0px}
table {padding:0px;border-spacing:0px}
.contentcontainer2{width:885px;margin:0 auto;background: #fff url(http://www.hackthatphone.com/gif/rounded_top.gif) no-repeat 0 top;}
.content2{padding:15px 30px 5px 30px;text-align:left}
h1,h2 {text-shadow: 3px 3px 5px #999; filter: dropshadow(color=#999, offx=3, offy=3);}
.toovanilla {color:#fff;text-shadow: 3px 3px 5px #000; filter: dropshadow(color=#000, offx=3, offy=3);font-size:80px;display:inline-block;vertical-align:middle;padding-right:15px;}

/* This is the hack that phone banner */
.banner {
    height: 95px;
	width: 820px;
    background-color: black;
	background-image: url(http://www.hackthatphone.com/png/banner.png);
	background-repeat: no-repeat;
	background-position: center;
    margin: 0 auto;
}



/* The navbar begins! */
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop5.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

/* keeps menu same width as banner can not mix width with padding in .menu */
.menucontainer{width:825px}

/* style the outer div to give it width - aligns menu under banner - also creates white gap between banner and menu bar it's set to 0 so no white line is being created right now */
.menu {margin:0 2px 0 3px;font-size:0.85em;padding-bottom:0px;border-top:2px #ffffff solid;}

/* remove all the bullets, borders and padding from the default list styling, background color for main menu buttons*/
.menu ul {padding:0;margin:0;list-style-type:none; height:3em; background:#000000;}

/* style the sub-level lists */
.menu ul ul 000000{width:15em;}

/* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu ul li {float:left;height:3em;line-height:3em;}

/* style the sub level list items */
.menu ul ul li {display:block;width:12em;height:auto; line-height:1em;}

/* style the links for the top level, background color for top menu buttons only, the last solid color code controls the color of the divider line between the last button and the rest of the colored menu bar, 
border-right sets the width of the color divider line */
.menu a, .menu a:visited {display:block;float:left;height:100%;font-size:1.2em;text-decoration:none;color:#ffffff;background:#000000;padding:0 1em 0 1em; border-left:1px solid #555555; border-right:1px solid #ffffff;}

/* style the sub level button text, background color for drop down menus */
.menu ul ul a, .menu ul ul a:visited {display:block;background:#000000; color:#ffffff;width:14em;height:100%;font-size:95%;line-height:1em; padding:0.5em 1em;border-bottom:1px #777777 solid;}
* html .menu ul ul a, * html .menu ul ul a:visited  {width:16em; width:14em;}

/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute; left:1px; top:0; width:0; height:0; font-size:1em; z-index:-1;}

/* style the flyout menu background color */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#000000;}

/* style the fourth level background - NOT USED */
.menu ul ul ul ul a, .menu ul ul ul ul a:visited {background:#000000;}

/* style the flyout menu header background color (item with multiple choices Misc and News feeds menus O N L Y) */
.menu ul :hover a.sub1 {background:#000000;}

/* style the flyout menu header background - (items with multiple choices in Start here and Hacking menus O N L Y */
.menu ul ul :hover a.sub2 {background:#000000;}



/* style the menu button hover color */

/* main buttons - start here, hacking, miscellaneous, news feeds */
* html .menu a:hover {color:#888888;background:#000000; position:relative; z-index:100;}
.menu li:hover {position:relative;}
.menu :hover > a {color:#888888;background:#000000;}

/* individual tutorial hover color */
* html .menu ul ul a:hover{color:#888888;background:#000000; position:relative; z-index:110;}
.menu ul ul li:hover {position:relative;}
.menu ul ul :hover > a {color:#888888;background:#000000;}

/* flyout tutorial hover color*/
* html .menu ul ul ul a:hover {background:#000000; position:relative; z-index:120;}
.menu ul ul ul :hover > a {background:#000000;}

/* second level flyout hover color - NOT USED  */
.menu ul ul ul ul a:hover {background:#000000; position:relative; z-index:130;}



/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:2.5em;left:0;width:14em; z-index:99999999999999}
/* position the third level flyout menu */
.menu ul ul ul{left:12em;top:0;width:14em;}
/* make the second level visible when hover on first level list OR link */
.menu ul :hover ul{visibility:visible; height:auto; padding-bottom:3em; background:transparent;}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu ul :hover ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{visibility:visible;}
/* make the fourth level visible when you hover over third level list OR link */
.menu ul :hover ul :hover ul :hover ul {visibility:visible;}

.ifSprite {background: transparent url(http://www.hackthatphone.com/png/indexFreeSprite.png) no-repeat 0 0; height: 130px; width:130px; display: block; text-decoration:none;}
.ios1 {background-position: 0 0;}
.ios1:hover {background-position: 0 -132px;}
.ios2 {background-position: -132px 0;}
.ios2:hover {background-position: -132px -132px;}
.ios3 {background-position: -264px 0;}
.ios3:hover {background-position: -264px -132px;}
.ios4 {background-position: -396px 0;}
.ios4:hover {background-position: -396px -132px;}
.ios5 {background-position: -528px 0;}
.ios5:hover {background-position: -528px -132px;}
.ios6 {background-position: -660px 0;}
.ios6:hover {background-position: -660px -132px;}
.ios7 {background-position: -792px 0;}
.ios7:hover {background-position: -792px -132px;}


.ifSpriteSmall {background: transparent url(http://www.hackthatphone.com/png/indexFreeSpriteSmall2.png) no-repeat 0 0; height: 65px; width:65px; display: block; text-decoration:none;}
.ios1a {background-position: 0 0;}
.ios1a:hover {background-position: 0 -66px;}
.ios2a {background-position: -66px 0;}
.ios2a:hover {background-position: -66px -66px;}
.ios3a {background-position: -132px 0;}
.ios3a:hover {background-position: -132px -66px;}
.ios4a {background-position: -198px 0;}
.ios4a:hover {background-position: -198px -66px;}
.ios5a {background-position: -264px 0;}
.ios5a:hover {background-position: -264px -66px;}
.ios6a {background-position: -330px 0;}
.ios6a:hover {background-position: -330px -66px;}
.ios7a {background-position: -396px 0;}
.ios7a:hover {background-position: -396px -66px;}

/* This is for that goofy biteSMS section on the read me first page so it will have 3 even cells */
.tb33 td {width:33%;}


/* Sets the width for all text and graphic content below the menu bar (and above the bottom box) and indents it all to the right to stay within menu bar width */
.tutorialcontent {width: 825px;padding-left:3px;}


/* Bottom of page, provides rounded white corners for main content, this is NOT the donate banner */

.rounded_bottom {
	background-image: url(http://www.hackthatphone.com/gif/rounded_bottom.gif);
	background-repeat: no-repeat;
	height: 10px;
	width: 885px;
	margin: 0 auto;
}


/* This is for stylizing the step numbers in the tutorials */

.step {

	font-size:17pt;
	font-family:Eurostile, Andale Mono, Verdana;
	font-weight:700;
	background: url(gif/dot.gif) repeat-x 0px 25px;	
}


/* Sets the OCR font in the navbar only */

@font-face {
	font-family: ocraextended;
    src: local(ocraextended), url('http://www.hackthatphone.com/font/ocraextended.ttf') format('opentype');
}


.menu ul, .menu li {
        font-family:ocraextended;
        font-size:14px;
}

/* Donate footer banner */

.lowerBannerArea {position:relative;}
/* #donLink {background: transparent url(http://www.hackthatphone.com/png/btnDonate.png) no-repeat 0 0; height: 64px; width:166px; position:absolute; top:35px; left:340px; z-index:99999999} */
/* #donLink:hover {background-position: 0 -62px;} */