html {
    background-color: #000000;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Verdana","Arial","Helvetica", "sans-serif";
}

a {
    color: inherit;
}

#container {
    top: 0;
    left: 0;
    background-image: url("../images/homepage/bkgrd-html4.gif");
    height: 406px; /* This is how it was hardcoded in 1999 */
    width: 745px; /* This is how it was hardcoded in 1999 */
}

header {
    height: 24px;
}

#navBanner {
    position: absolute;
    top: 6px;
    left: 319px;
}

#container-header {
    display: flex;
    font-size: 0.6rem;
    font-weight: bold;
    padding: 39px 0px 0px 7px;
}

#container-header-blue-bar {
    position: absolute;
    top: 32px;
    left: 185px;
}

#container-header-blue-bar > span {
    vertical-align: top;
    padding-left: 19px;
    padding-right: 19px;
}

#header-tips, #header-screenshots, #header-spacer {
    color: white;
}

#header-tips::before {
    display: inline-block;
    content: url("../images/homepage/blue_bar_link_icon.gif");
    position: relative;
    top: 4px;
    right: 5px;
}

#header-screenshots::before {
    display: inline-block;
    content: url("../images/homepage/blue_bar_link_icon.gif");
    position: relative;
    top: 4px;
    right: 7px;
}

main {
    padding-left: 7px;
    display: flex;
    flex-direction: row;
    height: 340px;
}

#zelda-logo {
    padding-left: 9px;
    padding-top: 5px;
}

#welcome-text {
    font-size: 0.6rem;
    font-weight: bold;
    padding-left: 23px;
    width: 125px;
    margin-top: -2px;
}

#player-guide {
    padding-left: 46px;
    padding-top: 1px;
}
#buy-player-guide {
    color: #003466;
    font-size: 0.7rem;
    font-weight: bold;
    text-align: center;
    padding-left: 20.5px;
    width: 125px;
    margin-top: -5px;
}

#rotating-panel {
    background-image: url("../images/homepage/strategy_window.gif");
    height: 269px;
    width: 222px;
    margin-top: 31px;
    margin-left: 25px;
}

#rotating-panel-title {
    color: white;
    font-family: "Arial Black","Verdana","Helvetica", "sans-serif";
    font-size:1em;
    font-style:italic;
    padding-left: 27px;
    margin-top: 9px;
    padding-bottom: 1px;
}

#rotating-panel-text {
    font-family: "Arial","Verdana","Helvetica", "sans-serif";
    font-size: 0.78rem;
    margin-left: 27px;
    width: 123px;
}

#rotating-panel-link {
    display: inline-block;
    position: absolute;
    margin-left: 20px;
    top: 319px;
    border-radius: 10px;
    width: 74px;
    height: 22px;
}

#rotating-panel-character {
    /* This overlaps the rotating-panel, so we're using the numbers they set for aligning the image correctly */
    position: absolute;
    left: 315px;
    top: 115px;
    height: 300px;
    width: 250px;
}

#right-content {
    padding-left: 89px;
    padding-top: 21px;
}

.right-content-text {
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    font-size: 0.75rem;
    font-style: italic;
    font-weight: bold;
    letter-spacing: -0.5px;
    position: relative;
    top: -10px;
}

#hyrule-news-text {
    position: relative;
    top: -6px;
    left: -7px;
}

#hyrule-news-image:hover + #hyrule-news-text, #hyrule-news-text:hover {
    content: url("../images/homepage/hr_iconlabel_ro.gif");
}

#ocarina-legend {
    position: relative;
    margin-left: 28px;
    margin-top: 10px;
}

#ocarina-legend-text {
    position: relative;
    top: -8px;
}

#ocarina-legend-image:hover + #ocarina-legend-text, #ocarina-legend-text:hover {
    content: url("../images/homepage/oc_iconlabel_ro.gif");
}

#adventure-strategy {
    position: relative;
    margin-left: 54px;
    margin-top: 2px;
}

#adventure-strategy-text {
    position: relative;
    top: -10px;
    left: -4px;
}

#adventure-strategy-image:hover + #adventure-strategy-text, #adventure-strategy-text:hover {
    content: url("../images/homepage/ad_iconlabel_ro.gif");
}

#legends-of-zelda {
    position: relative;
    margin-left: 54px;
    margin-top: 10px;
}

#legends-of-zelda-text {
    position: relative;
    top: -10px;
    left: -2px;
}

#legends-of-zelda-image:hover + #legends-of-zelda-text, #legends-of-zelda-text:hover {
    content: url("../images/homepage/lz_iconlabel_ro.gif");
}

#village-square {
    position: relative;
    margin-left: 69px;
    margin-top: 3px;
}

#village-square-text {
    position: relative;
    top: -6px;
    left: -7px;
}

#village-square-image:hover + #village-square-text, #village-square-text:hover {
    content: url("../images/homepage/vs_iconlabel_ro.gif");
}

#treasure-chest {
    position: relative;
    margin-left: 66px;
    margin-top: 13px;
}

#treasure-chest-text {
    position: relative;
    top: -11px;
    left: -6px;
}

#treasure-chest-image:hover + #treasure-chest-text, #treasure-chest-text:hover {
    content: url("../images/homepage/tc_iconlabel_ro.gif");
}

footer {
    padding-left: 21px;
}

#footer-nintendo-link {
    color: white;
    font-family: "Verdana","Arial","Helvetica", "sans-serif";
    font-size: 0.6rem;
    font-weight: bold;
    padding-bottom: 3px;
}

#footer-copyright {
    color: gray;
    font-family:  "Verdana","Arial","Helvetica", "sans-serif";
    font-size: 7pt;
}

#footer-links {
    margin-left: 412px;
    margin-top: -21px;
}

#footer-faqs, #footer-sitemap, #footer-parents {
    color: white;
    font-family:  "Verdana","Arial","Helvetica", "sans-serif";  
	font-size: .6em;
	font-weight: bold;
    vertical-align: top;
    position: relative;
}

#footer-faqs {
    top: -18px;
}

#footer-sitemap {
    top: -21px;
}

#footer-parents {
    top: -19px;
}

#footer-faqs::before {
    display: inline-block;
    content: url("../images/homepage/bot_faq.gif");
    position: relative;
    top: 11px;
    right: 3px;
}

#footer-sitemap::before {
    display: inline-block;
    content: url("../images/homepage/bot_sitemap.gif");
    position: relative;
    top: 14px;
    right: 3px;
}

#footer-parents::before {
    display: inline-block;
    content: url("../images/homepage/bot_parents.gif");
    position: relative;
    top: 12px;
    right: 1px;
}

#footer-spacer-1 {
    position: relative;
    padding-left: 6px;
    padding-right: 1px;
}

#footer-spacer-2 {
    position: relative;
    padding-left: 4px;
    padding-right: 3px;
}