body {font-family: Arial, Helvetica, sans-serif; font-size:14px; line-height:20px; color:#333333; margin:0; padding:0; background:#be9665 url(images/babe-ruth-background.jpg) top center;}

.headerwrap {background:url(images/babe-ruth-header.png) top center no-repeat; float:left; position:relative; z-index:1000; top:0; width:100%; height:643px;}
.contentwrap {display:block; margin:0 auto; width:100%; max-width:1024px;}

.navigation {float:left; width:315px; height:421px; position:relative; top:-420px; z-index:1999;}
.mobileheader, .tabletheader {display:none;}
ul.menu {display:block; list-style:none; margin:90px 0 0 0; padding:0;}
ul.menu li {margin:0; padding:0; text-align:center; line-height:35px; display:block;}
ul.menu li:hover {background:url(images/menu-hover-background.png) center repeat-y;} 
ul.menu li a {color:#825731; font-size:16px; text-decoration:none; padding:5px 10px; font-weight:bold;}
ul.menu li a:hover {color:#000000;}

.content {float:left; width:580px; min-height:674px; display:inline-block; margin:-520px 0 10px -90px; position:relative; padding:200px 30px 20px 70px;z-index:2000;}
h1 {font-family:Arial, Helvetica, sans-serif; font-weight:bold; color:#825731; margin:0 0 20px 0; padding:0 0 8px 0; background:url(images/header-background.png) bottom left no-repeat; font-size:32px; line-height:32px;}
h2 {font-family:Arial, Helvetica, sans-serif; font-weight:bold; color:#825731; margin:20px 0; padding:0; font-size:20px; line-height:24px;}
h3 {font-family:Georgia, "Times New Roman", Times, serif; font-weight:bold; font-size:16px; color:#333333;}
a {color:#825731;}
a:hover {color:#000000;}

textarea {padding:3px; color:#666; border:#999 1px solid; background-color:#FFFFFF; width:300px; height:140px;}
input {padding:3px; color:#666; border:#999 1px solid; background-color:#FFFFFF; width:300px;}

input.formbutton, a.button {background-color:#825731; border-color:#42200A; border-width:1px; padding:8px 8px; color:#FFF; text-decoration:none; font-weight:bold; text-align:center; border-radius: 5px; -moz-border-radius:5px; -webkit-border-radius:5px; cursor:pointer;}
input.formbutton:hover, a.button:hover {background-color:#42200A; border-color:#825731; border-width:1px; color:#EEE;}
input.formbutton, input.formdullbutton {display:inline-block; width:150px; margin-right:10px; flaot:left;}

input.formdullbutton, a.dullbutton {background-color:#CCC; border-color:#999; border-width:1px; padding:8px 8px; color:#FFF; text-decoration:none; font-weight:bold; text-align:center; border-radius: 5px; -moz-border-radius:5px; -webkit-border-radius:5px; cursor:pointer;}
input.formdullbutton:hover, a.dullbutton:hover {background-color:#999; border-color:#CCC; border-width:1px; color:#EEE;}

.footer {float:none; display:block; width:90%; max-width:500px; text-align:center; color:#999; font-size:12px; font-family:Arial, Helvetica, sans-serif; margin:0 auto 20px auto; padding:30px 0 10px 0;}

#slideshow { left:0 }
#nav { width:100%; margin:0 0 0 0; float:left;}
#nav li { width: 35px; float:left; margin:5px; padding:0; list-style: none }
#nav a { width: 35px; padding:3px; display: block; border: 1px solid #ccc; }
#nav li.activeSlide a { background: #CCC }
#nav a:focus { outline: none;}
#nav img { border:none; display:block;}
ul#nav {margin:547px 0 20px 0; padding:0;}
@media only screen and (min-width: 1023px) {
    .menu {
        display: block !important;
    }
}
@media only screen and (max-width: 1022px) {
body {background:#be9665 url(images/babe-ruth-background-tablet.jpg) top center;}
.contentwrap {width:100%; max-width:1022px; margin:0 auto;}
.content {float:none; width:90%; max-width:700px; display:block; margin:0 auto; background:none; padding:0 5%;}

.tabletheader {display:block; width:100%; height:auto;float:left; position:relative; top:0;}
.headerwrap {display:none; height:0px;}

.navigation {float:left; width:100%; height:auto; position:relative; top:0; z-index:9999;}
ul.menu {display:none; list-style:none; margin:0; padding:0; height:auto; background:#2c4e6f;}
ul.menu li {margin:10px; padding:0; text-align:center; line-height:25px; display:inline-block;}
ul.menu li a {color:#FFFFFF; font-size:16px; text-decoration:none; padding:10px;}
ul.menu li a:hover {color:#be9665;}

}
@media only screen and (max-width: 480px) {
.mobileheader {display:block; width:100%; height:auto;}
.tabletheader {display:none;}
.content {max-width:480px;}
ul.menu {display:none; list-style:none; margin:0; padding:0; background-color:#FFFFFF; border-bottom:#2c4e6f 7px solid;}
ul.menu li {margin:0; padding:0; text-align:left; line-height:35px; width:100%; border-bottom:#CCC 1px dotted;}
ul.menu li:hover {background:url(images/menu-hover-background.png) center repeat-y;} 
ul.menu li a {color:#825731; font-size:20px; text-decoration:none; padding:5px 10%; width:80%;}
.pics img {width:90%; height:auto;}
ul#nav {margin:380px 0 20px 0; padding:0;}
.statstable {font-family: 'Open Sans Condensed', sans-serif; width:100%; font-size:10px;}
textarea {width:70%;}
input {width:70%;}
.navigation {
    float: none;
    width: 100%;
    height: 0px;
    position: relative;
    top: 0;
    z-index: 9999;
}
h1 {margin:20px 0;}
}