/**
http://computerarcheology.com/zelda/zelda.html#TOC-3
Name Table Layout

The PPU generates a background on the screen that is 32x30 tiles. Each tile is 8x8 pixels. A pixel can have one of 4 colors (2 bits per pixel). Thus an 8x8 tile definition (pattern) requires 2bits*8*8 = 16 bytes.

A “name table” holds 32x30 = 960 bytes, one byte per screen tile, to describe which tile from pattern memory (PPU 0000-1FFF) to draw at each cell on the screen. If the first byte of the name table is a 00 then the first tile from pattern memory at 0000 is used to draw the 8x8 pixels at the top left of the screen. The name table includes 40 bytes of “attributes” that describes the colors of the rendered tiles. This rounds the name table out to an even 1K bytes.

Each cell in the name table can specify one of 256 tiles. In pattern memory 256 tiles consume 256x16 = 4K bytes. The pattern memory thus contains TWO separate areas: one at 0000-0FFF and one at 1000-1FFF. The sprites and the background can be configured to read from either area individually (sprites from one, background from the other, or both from the same pattern area).

The PPU provides for four separate name tables and various scrolling/mirroring modes among them. The four name tables make a 2x2 square creating a giant name table of 64x60 cells. The screen can only show an area 32x30, and scrolling registers allow the display to be moved around (on a pixel boundary) within the giant map. This makes for smooth and easy scrolling around the larger background.

The PPU hardware on the console only includes space for two name tables (a total of 2K bytes). Games that need the giant map must include 2K of RAM on the cartridge for the extra two name tables. More commonly, games used the two built-in name tables to provide a 2-table scroller … either vertically or horizontally.

Games can either join the tables horizontally to make a 64x30 table or vertically to make a 32x60 table. Zelda switches configurations to scroll left/right or up/down as the player moves between two play fields.

If “horizontal mirroring” is enabled then the two built-in name tables are joined vertically. The two name tables on the right are exact copies of the left. The terminology can be misleading since with “horizontal mirroring” the tables are joined vertically and no mirror-imaging is performed.

If “vertical mirroring” is enabled then the two built in tables are joined horizontally, and the two name tables on the bottom are copies of the top two.

The cartridge provides an electrical signal to the PPU to describe how the name tables should be accessed. Thus the built-in name table layout (mirroring) is controlled by the cartridge hardware and thus the MMC1 registers.


The first bank of VRAM (0000-0FFF) is used for sprites. The second bank of VRAM (1000-1FFF) is used for background tiles.

Tile images are 16 bytes each for an 8x8 pixel pattern. Each pixel is 2 bits. The actual color of a pixel is controlled by a color pallet. The color is independent of the pattern.

The 256 background tiles in VRAM (1000-1FFF) are divided into fixed tiles that never change over the course of the game and tiles that are swapped in and out as the player moves between the surface and dungeons. The fixed tiles are numbered 00-6F and F2-FF. I suspect the second fixed set was added with new functionality as the development progressed. Interestingly, the tiles from 30-5F are blank and could have been used for this overflow.

The common (fixed) background tiles are loaded from ROM bank 2 (877F and 8E7F).

The 130 background tiles from 70-F1 are swapped in and out as the game progresses. The splash screen tiles are loaded from ROM bank 1 (96B4). The surface tiles are loaded from ROM bank 3 (893B). The dungeon tiles are loaded from ROM bank 3 (811B).

The 256 sprite tiles in VRAM (0000-FFF) are divided into fixed tiles that never change and enemy images that change as the player moves to different areas. Zelda uses two-tile sprites (8x16 pixels). Multiple sprites are grouped together to make larger creatures.

The fixed sprite tiles are numbered 00-8D. These are the images of Link, the game objects, and other miscellaneous sprites used everywhere. These are loaded from two separate places. The main area 00-6F comes from ROM bank 2 (807F). The area from 70-8D loads as part of the splash sequence from ROM bank 1 (8DB4). This area is loaded as part of a much larger “splash screen sprites”. These pictures must have been developed “on top” of TileSetC from bank 3 because some of those images “show through” into unused slots.



**/
@font-face{font-family:"gradius_nesregular";
    src: url('http://dev.bowdenweb.com/nes/a/fonts/gradius-nes/gradius-nes.eot');
    src: url('http://dev.bowdenweb.com/nes/a/fonts/gradius-nes/gradius-nes.eot?#iefix') format('embedded-opentype'),
         url('http://dev.bowdenweb.com/nes/a/fonts/gradius-nes/gradius-nes.woff') format('woff'),
         url('http://dev.bowdenweb.com/nes/a/fonts/gradius-nes/gradius-nes.ttf') format('truetype'),
         url('http://dev.bowdenweb.com/nes/a/fonts/gradius-nes/gradius-nes.svg#gradius_nesregular') format('svg');
    font-weight: normal;
    font-style: normal}


/** HTML5 Reset http://host.sonspring.com/formalize/assets/stylesheets/html.css **/
a,abbr,address,article,aside,audio,b,blockquote,body,caption,cite,code,dd,del,dfn,dialog,div,dl,dt,em,fieldset,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{border:0; margin:0; padding:0; font-size:100%} /** why not border:none **/
article,aside,figure,figcaption,footer,header,hgroup,nav,section{display:block}

html{overflow-y:scroll} /** prevent firefox scrollbar jump. firefox hides vertical scrollbar if content < visibile window by default **/
html,body{height:100%}
body{text-align:center; font:62.5%/1.5 "open_sansregular", Cambria, Verdana, Arial, Helvetica, sans-serif; background-color:#faf93c; color:#000; -webkit-font-smoothing:antialiased}
body{font-family:"gradius_nesregular"; font-weight:normal}
body:before{content:""; position:fixed; top:-15px; left:0; width:100%; height:15px; z-index:100; -webkit-box-shadow:0px 0px 10px rgba(0,0,0,.9); -moz-box-shadow:0px 0px 10px rgba(0,0,0,.9); box-shadow:0px 0px 10px rgba(0,0,0,.9)}

abbr,acronym{border:none; cursor:help; text-transform:uppercase; letter-spacing:0.1em; font-variant:small-caps}
b,strong{font-weight:700} /* b,strong{font-weight:bold} */
img{display:block; font-size:0; -moz-box-shadow:0 0 4px #000; -ms-box-shadow:0 0 4px #000; -o-box-shadow:0 0 4px #000; -webkit-box-shadow:0 0 4px #000; box-shadow:0 0 4px #000; margin:5px auto}
pre{white-space:pre; white-space:pre-wrap; white-space:pre-line; white-space:-pre-wrap; white-space:-o-pre-wrap; white-space:-moz-pre-wrap; white-space:-hp-pre-wrap; word-wrap:break-word; padding:0 5px 10px 5px; text-align:left; background-color:#ffff80; outline:1px solid #e6db55}
code{font-family:monospace; font-weight:700; background-color:#ffff80}
pre code{font-size:17px}

table{border-collapse:collapse; border-spacing:0; padding-top:0.5em; padding-bottom:0.5em; margin:0.8em auto; -moz-box-shadow:0 0 4px #000; -ms-box-shadow:0 0 4px #000; -o-box-shadow:0 0 4px #000; -webkit-box-shadow:0 0 4px #000; box-shadow:0 0 4px #000; color:#000; width:80%}
td,caption{font-weight:normal; vertical-align:top}

caption{text-align:center; background-color:#333; color:#fff; padding:0.75em; font-size:16px}
thead{}
tbody{background-color:#f1f1f1}
tfoot{}
tfoot p{padding:1em 1.5em; font-size:18px; line-height:18px; margin: 0 auto}

th{font-weight:700; text-align:center; vertical-align:top; font-size:20px; padding-top:0.5em; padding-bottom:0.5em}


tr{}
td{padding:1em; text-align:left; text-indent:0.25em; font-size:15px}
td p{margin:0 auto; font-size:22px; line-height:22px; padding:10px 5px}
td ul{margin:5px 0 5px 5px; font-size:22px; line-height:22px; padding:5px}
td li{text-indent:10px}
td ul ol{padding:10px; margin:0 0 10px 10px}
/** td + code{font-size:22px; line-height:22px; padding:5px} **/
td p code{padding:0}
td img{vertical-align:top} 
.img-table img{box-shadow:none}

tbody{}
tr{}
th{}
td{}


ul{list-style-type:none}
.directory{}

.spriteimg{}

.h-reg{font:300 62.5%/1.5 "gradius_nesregular", monospace}
.h1-reg{font-size:26px}
.h2-reg{font-size:18px}
.h3-reg{font-size:15px}

header{height:110px; background:#393939 url("http://dev.bowdenweb.com/nes/a/i/retro-nes-wallpaper-1280x1024-slice-h265-stripes-36.gif") 0 75% repeat-x}
header h1,header h2{height:100%}
header h1{float:left; color:#fff; font-size:28px; width:50%}
header h2{float:right; background-color:#000; width:355px}

header h2 b{display:block; float:left; height:100%; margin-left:10px; text-indent:-9999px; background-position:50% 50%; background-repeat:no-repeat}
header h2 abbr{}

/** header h2 b.lozlogo{width:210px; background-image:url("http://dev.bowdenweb.com/nes/loz/a/i/logo/the-legend-of-zelda-logo-02-198x110.gif")} **/
.lozlogo{margin-top:0.5em; height:100px; width:180px; background-color:#f0d0b0; position:relative; background-image:url("http://dev.bowdenweb.com/nes/loz/a/i/logo/the-legend-of-zelda-logo-02-180x100.gif"); background-repeat:no-repeat;  background-position:0 0; z-index:10}
.lozlogo::before{position:absolute; content:""; background-position:18px 10px; background-image:url("http://dev.bowdenweb.com/nes/loz/a/i/logo/an-the-legend-of-zelda-logo-10-144x78.gif"); background-repeat:no-repeat; height:100%; width:100%; top:0; left:0; z-index:11}
.neslogo{width:125px; background-image:url("http://dev.bowdenweb.com/nes/a/i/logo/abbr/nes-abbr-logo-115x35-white.gif")}

header h2 abbr{}

.maincontent{padding-top:2em; clear:both; float:none}
.embellish{background-image:url("http://dev.bowdenweb.com/nes/loz/a/i/mapgrayscale.gif"); background-repeat:no-repeat; background-position:50% 50%; height:32px;  margin:3em auto; border:none}
.clearleft{clear:left; float:none}

.content{margin-left:auto; margin-right:auto; text-align:center; background-color:#fff}
.maincontent{margin-left:auto; margin-right:auto; text-align:center; min-width:650px; min-height:650px; padding-bottom:2em}


.screenframe{margin-left:auto; margin-right:auto; position:relative}

/** used as gamenav in a few shitty demos **/
.topnav{float:left; background-color:#000; width:100%; height:31.25%}

/** gamenav **/
.gamenav{position:absolute; top:0; left:0; width:100%; height:128px; background-color:#000}


.gamenavmain{width:100%; position:absolute; top:48px}
/** you really don't need to use a bg img for gps. it's a color .gps{background-color:#757575} **/
.gps{position:absolute; width:128px; height:64px; left:32px; background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/gps.gif"); background-repeat:no-repeat; background-position:0 0}
.gpsactive{background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/gps-active.gif"); background-repeat:no-repeat; background-position:0 0}


.itemcount{width:62px; position:absolute; left:176px} /** 176px from left **/
.itemcount li{ /** for double digit sums...not three...fix this moron **/ height:16px}
.item-rupees{background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/item-rupees-icon-and-x.gif"); background-position:0 0; background-repeat:no-repeat}
.item-rupees-value{}
.item-keys{margin-top:16px; background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/item-keys-icon-and-x.gif"); background-position:0 0; background-repeat:no-repeat}
.item-keys-value{}
.item-bombs{background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/item-bombs-icon-and-x.gif"); background-position:0 0; background-repeat:no-repeat}
.item-bombs-value{}

.item-value{margin-top:1px; margin-bottom:1px; display:block; margin-left:30px; height:14px}

.item-value-0{background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/item-value-0.gif"); background-position:0 0; background-repeat:no-repeat; width:14px}
.item-value-52{background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/item-value-52.gif"); background-position:0 0; background-repeat:no-repeat; width:30px}



/** http://dev.bowdenweb.com/nes/loz/a/gamenav/i/pad-boxes.gif **/
.padbox{position:absolute; width:36px; height:58px; background-repeat:no-repeat; background-position:0 0}
.padb{background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/pad-boxb.gif"); right:230px}
.pada{background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/pad-boxa.gif"); right:182px}
.lifebox{position:absolute; top:0; right:0; width:160px; height:80px; /** background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/lifebox-full-01.gif"); **/ }
.lifebox h1{height:14px; background-position:16px 0; text-indent:-9999px; background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/lifebox-h-text.gif"); background-repeat:no-repeat}
.lifehearts{}
.lifeheart{margin-left:1px; margin-right:1px}
.lifeheartfull{}
.lifehearthalf{}

.lifehearts{position:absolute; bottom:16px}
.lifehearts li{}
.lifeheart{width:14px; height:16px; float:left; display:block; margin:1px; background-repeat:no-repeat; background-position:0 0}
.lifeheartfull{background-image:url("http://dev.bowdenweb.com/nes/loz/a/items/i/032/menu-icon-life-meter-heart-01.gif")}
.lifehearthalf{background-image:url("http://dev.bowdenweb.com/nes/loz/a/items/i/032/menu-icon-life-meter-heart-02.gif")}
.lifeheartempty{background-image:url("http://dev.bowdenweb.com/nes/loz/a/items/i/032/menu-icon-life-meter-heart-03.gif")}













.listitems{}

/**
.listitems .values

dungeon-title
.gamenav .level01{left:34px; top:32px}
dungeon-title-01{background-image:url("http://dev.bowdenweb.com/nes/loz/a/gamenav/i/game-nav-title-level-01.gif");}
http://dev.bowdenweb.com/nes/loz/a/gamenav/i/gps-dungeon-01.gif"); width:94px; height:46px}

**/
.box900{width:900px; height:900px}
.box512{width:512px; height:512px}
.box512x448{width:512px; height:448px}

.blocka{clear:left; float:none; display:block; margin:5px auto}

.outline{outline:1px solid #000}


.tile.tile-black{background-color:#000; background-image:none}

.clearleft{clear:left; float:none}
.clearright{clear:right; float:none}
.clearboth{clear:left; clear:right; float:none}

/** quicknav is on the grid pages **/
.quicknav{}
.quicknav li{}
.quicknav .disabled{display:none}
.quicknav a{font-size:22px; font-weight:700; display:block}


.bg-black{background-color:#000}