html, body {
margin : 0;
padding : 0;
}
#wrapper {
background : #000000 none repeat scroll 0% 0%;
width : 100%;
}
#wrapper.padded{
padding:0 6px 0 6px;
}
#header-wrapper {
background : transparent url("/esi-images/new-header-bg.png") repeat-x scroll 0% 0%;
height : 220px;
width : 100%;
z-index : 1;
}
#header{
clear:both;
width:732px;
height:185px;
margin:auto;
z-index:2;
color:#ffffff;
}
#logo-container{
float:left;
padding-top:40px;
}
#header-text-container {
float:left;
padding-top:64px;
padding-left:12px;
margin : 0;
font-family : helvetica, arial, sans;
font-size : 1.6em;
color : #ffffff;
}
#header-image-container{
float:right; 
padding-top:1px;
}
#main-nav {
width :860px;
height : 33px;
margin-left:auto;
margin-right:auto;
padding : 0;
}
#page-container {
left : 0;
margin : auto;
position : relative;
top : -1px;
width : 732px;
}
#background-container {
margin : auto;
width : 732px;
/* Normal Height:*/
height : 400px;
/* Christmas Height height:607px; /* PUT BACK TO NORMAL WHEN REMOVING CHRISTMAS OPENING HOURS */
background-color:#000000;
}
#content {
margin-right : 310px;
}
#sidebar-a {
float : right;
width : 310px;
height : 285px;
/* Normal margin-top */ 
margin-top: 35px;
/*Christmas margin-top:5px */
margin-right : 22px;
padding-top : 6px;
z-index : 30;
}
#footer {
width : 732px;
height : 600px;
margin : auto;
padding-left : 100px;
padding-top : 24px;
background : transparent none repeat scroll 0% 0%;
clear : both;
color : #ffffff;
height : 30px;
text-align : right;
}
#footer-wrapper {
position : relative;
top : -1px;
background : transparent url("/esi-images/footer-bg-2.png") repeat-x scroll 0% 0%;
clear : both;
height : 600px;
width : 100%;
}

/* NAVBAR */
#nav {
background : url('/esi-images/nav.png');
background-repeat : repeat-x;
border-bottom : medium none;
border-top : medium none;
float : left;
list-style : none;
margin : 0;
padding : 0;
width : 100%;
}
#nav li {
float : left;
margin-right:10px;
position:relative;
display:block;
}
#nav li a {
border-right : 1px solid #cccccc;
color : #ffffff;
display : block;
font-family : helvetica, arial, sans;
font-weight : normal;
font-size:90%;
padding : 6px 15px;
text-decoration : none;
text-transform : uppercase;
}
#nav li a.last {
border-right : medium none;
}
#nav li a:hover {
background : url('/esi-images/nav-hover.png');
background-repeat : repeat-x;
color : #cc0000;
}
#nav li a:active {
background-color : #ffffff;
color : #cc0000;
}

/* Dropdown */

#nav ul{
	list-style:none;
	position:absolute;
	display:none; /* Hide off-screen when not needed */
	opacity:0; /* Set initial state to transparent */
	-webkit-transition:0.25s linear opacity; /* Make the dropdown fade-in in Webkit */
}
#nav ul li{
	padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
#nav ul a{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
	display:block;
}
#nav li:hover ul{ /* Display the dropdown on hover */
     display:block; /* Bring back on-screen when needed */
	 opacity:1; /* Fade to opaque */
     position:absolute;
}
#nav li:hover a{ /* Set styles for top level when dropdown is hovered */
background : url('/esi-images/nav-hover.png');
background-repeat : repeat-x;
color : #cc0000;
text-decoration:underline;
}
#nav li:hover ul a{ /* Override some top level styles when dropdown is hovered */
	text-decoration:none;
	-webkit-transition:-webkit-transform 0.075s linear;
}
#nav li:hover ul li a:hover{ /* Set styles for dropdown when items are hovered */
background : url('/esi-images/nav-hover.png');
background-repeat : repeat-x;
color : #cc0000;
}

/* CHRISTMAS TRIMMINGS
#hat{
position:absolute;
top:-5px;
left:5px;
z-index:99999;
}

#opening{
position:absolute;
width:650px;
top:350px;
left:40px;
}

p.christmas{
padding-left:5px;
padding-right:5px;
margin:0;
}

h3{
padding-left:5px;
padding-top:15px;
padding-bottom:0px;
color:#ffffff;
font-family:helvetica,arial,sans;
font-size:24px;
font-weight:normal;
margin:15px 0 6px 0;
}

*/

/*KEY PAD*/
#key1 {
position : absolute;
top : 40px;
left : 40px;
}
#key3 {
position : absolute;
top : 40px;
left : 260px;
}
#key4 {
position : absolute;
top : 115px;
left : 40px;
}
#key6 {
position : absolute;
top : 115px;
left : 260px;
}


a.rollover-2{
position : absolute;
top : 40px;
left : 150px;
display: block;
width: 104px;
height: 69px;
background:url("/esi-images/key2.png");
text-decoration: none;
}
a.rollover-2:hover{
background-position: 0px -69px;
}

a.rollover-5{
position : absolute;
top : 115px;
left : 150px;
display: block;
width: 104px;
height: 69px;
background:url("/esi-images/key5.png");
text-decoration: none;
}
a.rollover-5:hover{
background-position: 0px -69px;
}

a.rollover-7 {
position : absolute;
top : 190px;
left : 40px;
display: block;
width: 104px;
height: 69px;
background:url("/esi-images/key7.png");
text-decoration: none;
}
a.rollover-7:hover{
background-position: 0px -69px;
}

a.rollover-8{
position : absolute;
top : 190px;
left : 150px;
display: block;
width: 104px;
height: 69px;
background:url("/esi-images/key8.png");
text-decoration: none;
}
a.rollover-8:hover{
background-position: 0px -69px;
}

a#rollover-9{
position : absolute;
top : 190px;
left : 260px;
display: block;
width: 104px;
height: 69px;
background:url("/esi-images/key9.png");
text-decoration: none;
}
a#rollover-9:hover{
background-position: 0px -69px;
}

a.rollover-10{
position : absolute;
top : 265px;
left : 40px;
display: block;
width: 104px;
height: 69px;
background:url("/esi-images/key10.png");
text-decoration: none;
}
a.rollover-10:hover{
background-position: 0px -69px;
}

a.rollover-11{
position : absolute;
top : 265px;
left : 150px;
display: block;
width: 104px;
height: 69px;
background:url("/esi-images/key11.png");
text-decoration: none;
}
a.rollover-11:hover{
background-position: 0px -69px;
}

a#rollover-12{
position : absolute;
top : 265px;
left : 260px;
display: block;
width: 104px;
height: 69px;
background:url("/esi-images/key12.png");
text-decoration: none;
}
a#rollover-12:hover{
background-position: 0px -69px;
}

a.plain {
text-decoration:underline;
font-weight:bold;
}
a.plain:hover {
color:red;
}
#quotation {
background : transparent none repeat scroll 0% 0%;
color : #ffffff;
font-family : helvetica, arial, sans;
font-size : 12px;
height : 140px;
padding-left : 5px;
}
h1 {
font-family : helvetica, arial, sans;
font-size : 105%;
color : #ffffff;
padding : 16px 4px 4px 4px;
margin : 0;
font-weight : bold;
}
h1.contact {
font-family : helvetica, arial, sans;
font-size :20px;
color : #ffffff;
padding : 10px 4px 4px 4px;
margin : 0;
font-weight : bold;
}
h2 {
font-family : helvetica, arial, sans;
font-size : 18px;
color : #ffffff;
padding : 4px;
margin : 0;
font-weight : normal;
}
h3 {
font-family : helvetica, arial, sans;
font-size : 16px;
color : #ffffff;
padding : 4px;
margin : 0;
font-weight : normal;
}
p {
font-family : helvetica, arial, sans;
font-size : 14px;
color : #ffffff;
padding : 4px;
margin : 0;
line-height:120%;
}
p.footer-text {
font-family : helvetica, arial, sans;
font-size : 12px;
color : #ffffff;
line-height : normal;
font-weight : normal;
padding : 2px 20px 2px 2px;
margin : 0;
}
ul{
font-family : helvetica, arial, sans;
font-size : 14px;
color : #ffffff;
line-height : normal;
font-weight : normal;
padding : 2px 20px 2px 2px;
margin : 0;
 }
a.plain {
font-family : helvetica, arial, sans;
font-size : 14px;
color : #ffffff;
padding : 0;
margin : 0;
text-decoration : none;
}
.img {
border : none;
}

#about{
position:absolute;
top:60px;
left:15px;
}

#about-img{
border:none;
width:350px;
}

a.credit{
color:#ffffff;
font-size:60%;
text-decoration:none;
}