/* 
	Designed by Greg Reimer
	
	Bugfixed by Andrew Tay (www.andrewtay.com) for HostBaby.com April 2007 
   All styles that have been changed are indented
	
	- fixed problem with #content position. before, it was pushed down by a combo for #container padding-top and
	  #content margin-top, but IE collapses these for some reason. Now it's all done with container padding
	- IE6 was messing up display on pages with little conent due to max-height issues
	- new styling added for #calendar div.entry .price
	
*/

/* main style sheet */

body {
  margin: 0px;
  padding: 0px;
  background-attachment: fixed;
  color: black;
  text-align: center;
  font-family: arial,helvetica,sans-serif;
  background: #ddd url(/shared/machine/middle_iesux.png) repeat-y 50%;
  }

html>body {
  background: #ddd url(/shared/machine/middle.png) repeat-y 50%;
  }

a:link { color: #474; }
a:visited { color: #474; }
a:active { color: #474; }
a:hover { color: #474; }

div#accessibility {
  position: absolute;
  font-size: 1px;
  left: -1000px;
  top: -1000px;
  }

               div#container {
                 background: transparent url(/shared/machine/top.png) no-repeat 50% 0%;
                 color: black;
                 width: 510px;
                 margin: 0px auto;
                 text-align: left;
                 padding: 160px 238px 0px 0px;	/* NEW!! was 70px; this kills need for margin-top on #content */
                 position:relative;
                 }

div#navigation {
  position: absolute;
  left: 510px;
  top: 96px;
  width: 230px;
  }

div#navigation ul {
  margin: 0;
  padding: 0;
  font: bold 14px verdana,sans-serif;
  }

div#navigation li {
  list-style: none;
  display: block;
  margin: 0px;
  white-space: nowrap;
  }

div#navigation li a {
  text-decoration: none;
  text-transform: none;
  display: block;
  background: transparent url(/shared/machine/button_darklight.png) no-repeat 0px -44px;
  font: bold 17px verdana,sans-serif;
  height: 19px;
  padding: 10px 10px 13px 50px;
  }

div#navigation li a:link {
  color: #444;
  }

div#navigation li a:visited {
  color: #444;
  }

div#navigation li a:hover {
  color: #090;
  background: transparent url(/shared/machine/button_darklight.png) no-repeat 0px 0px;
  }

div#navigation li a:active {
  color: #444;
  }

div#emailsignup {
  position: absolute;
  top: 5px;
  right: 33px;
  font: bold 8pt verdana,sans-serif;
  color: #777;
  width: 80%;
  text-align: right;
  }

div#emailsignup input {
  margin: 0px 0px 0px 7px;
  border: 1px solid #888;
  font: bold 8pt verdana,sans-serif;
  color: #555;
  padding: 2px 3px;
  }

div#emailsignup input[type="text"] {
  background: white url(/shared/machine/input_bg.png) repeat-y 0px 0px;
  }

div#emailsignup input[type="submit"] {
  background: white url(/shared/machine/button_bg.png) repeat-y 0px 0px;
  }

div.entry {
  margin: 20px 0;
  text-align: justify;
  }

div#banner div.photo {
  display: none;
  }

div#banner div.band {
  display: block;
  position: absolute;
  left: 0px;
  top: 40px;
  width: 710px;
  height: 50px;
  white-space: nowrap;
  overflow: auto;
  text-align: left;
  text-transform: uppercase;
  font: bold 17pt impact,verdana,sans-serif;
  color: #777;
  letter-spacing: 5px;
  padding: 0px 0px 0px 40px;
  }

div.entry h2, div.entry h3, div.entry h4 {
  margin: 0 0 10px 0;
  font: bold 16px sans-serif;
  text-align: left;
  }

div#content h2 {
  font-size: 16px;
  padding-bottom: 5px;
  margin-bottom: 5px;
  }

div#content h3 {
  font-size: 14px;
  }

div#content h4 {
  font-size: 12px;
  }

               div#content {
                 width: 430px;
                 margin: 0px 0px 30px 40px; /* was margin-top 90px; IE collapsed this with container padding */
                 padding: 0px 0px 0px 0px;
                 font: normal 11pt arial,sans-serif;
                 color: #454;
                 min-height: 340px;
                 }

					/* NEW!! only IE5 & IE6 can see this hack, so it's reasonably future-proof */
					* html div#content {
                 height: 340px;		/* NEW!! an IE6 bug makes this behave like min-height, as intended */
                 }
					               
					/* NEW!! This hack fixed problems in IE6, but IE7 can't see it so the problem persisted.
               html>body div#content {
                 margin-top: 90px;
                 }
					  */

div#content h1 {
  position: absolute;
  left: 35px;
  top: 111px;
  margin: 0px;
  padding: 0px;
  font: bold 17px verdana,sans-serif;
  z-index: 100;
  color: #555;
  text-transform: none;
  width: 380px;
  white-space: nowrap;
  overflow: auto;
  height: 50px;
  }

div#content h1:after {
  content:"::";
  }

body.contact div#content ul {
  padding: 0px;
  margin: 10px 0px;
  }

body.contact div#content li {
  display: block;
  padding: 0px 0px 0px 24px;
  margin: 0px;
  background: transparent url(/shared/machine/bullet.png) no-repeat 6px 4px;
  }

form {
  margin:0px;
  }

body.photos dt {
  margin: 0px 0px 0px 0px;
  padding: 15px 0px 0px 20px;
  text-align: center;
  font: bold 10pt verdana,sans-serif;
  background: transparent url(/shared/machine/gallerytop.png) 50% 0px;
  }

body.photos dd {
  margin: 0px 0px 20px 0px;
  padding: 0px;
  text-align: center;
  padding: 5px 0px 10px 0px;
  background: transparent url(/shared/machine/gallerybottom.png) 50% 100%;
  }

body.photos img {
  border: 1px solid #898;
  }

div#footer {
  background: transparent url(/shared/machine/bottom.png) no-repeat -1px 0px;
  padding: 37px 0px 340px 20px;
  width: 510px;
  font: bold 8pt verdana,sans-serif;
  color: #777;
  position: relative;
  left: 0px;
  top: 0px;
  voice-family: "\"}\"";
  voice-family: inherit;
  width: auto;
  }

html>body div#footer {
  width: auto;
  }

body.music div#content div.details {
  border: 1px solid #9a9;
  background: transparent url(/shared/machine/eq.png) no-repeat 321px 27px;
  padding: 4px 4px 0px 4px;
  font: bold 10pt sans-serif;
  position: relative;
  }

body.music div#content h3 {
  background: transparent url(/shared/machine/songheader.png) no-repeat 0px 0px;
  margin: 10px 0px 0px 0px;
  color: #ecf5e9;
  font: bold 11px sans-serif;
  padding: 4px 9px;
  width: 308px;
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 290px;
  }

html>body.music div#content h3 {
  width: 290px;
  }

body.music div#content div.details ul {
  margin: 0px;
  padding: 0px;
  list-style: none;
  }

body.music div#content div.details li {
  display: block;
  padding: 0px;
  margin: 0px;
  }

body.music div#content div.details div.artist, 
body.music div#content div.details li a {
  display: block;
  border: 1px solid #9a9;
  font: bold 10px arial,sans-serif;
  text-decoration: none;
  color: #676;
  padding: 4px 6px;
  margin-bottom: 4px;
  width: 314px;
  height: 14px;
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 302px;
  }

html>body.music div#content div.details div.artist, 
html>body.music div#content div.details li a {
  width: 302px;
  }

body.music div#content div.details div.artist {
  background: #c7cfc4;
  font: bold 11px sans-serif;
  color: #676;
  padding: 3px 6px 2px 6px;
  height: 15px;
  width: 418px;
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 406px;
  }

html>body.music div#content div.details div.artist {
  width: 406px;
  }

body.music div#content div.details li a {
  background: transparent url(/shared/machine/play.png) no-repeat 99% 50%;
  margin: 4px 0px;
  }

body.music div#content div.details li a:hover {
  background-color: #ecf5e9;
  margin: 4px 0px;
  }

body.press div#content div.entry {
  border: 1px solid #9a9;
  margin: 10px 0px;
  padding: 5px;
  background: transparent url(/shared/machine/lomidhi_iesux.png) no-repeat 100% 100%;
  }

html>body.press div#content div.entry {
  background: transparent url(/shared/machine/lomidhi.png) no-repeat 100% 100%;
  }

body.press div#content div.entry blockquote {
  margin: 0px 0px 5px 0px;
  border: 1px solid #9a9;
  font: normal 10pt verdana,sans-serif;
  text-align: left;
  padding: 5px;
  background: #e2ebdf;
  }

body.press div#content div.entry div.caption {
  margin: 0px;
  padding: 5px 8px;
  border: 1px solid #9a9;
  font: normal 8pt arial,sans-serif;
  background: #b2bfb2;
  color: white;
  width: 295px;
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 279px;
  min-height: 14px;
  }

html>body.press div#content div.entry div.caption {
  width: 279px;
  }

body.press div#content div.entry div.caption a {
  text-decoration: none;
  color: white;
  }

body.press div#content div.entry div.caption a:hover {
  text-decoration: underline;
  }

div#calendar div.entry {
  border: 1px solid #9a9;
  padding: 5px 5px 0px 5px;
  margin: 0px 0px 10px 0px;
  position: relative;
  background: transparent url(/shared/machine/atarrow.png) no-repeat 6px 47px;
  }

html>body div#calendar div.entry {
  background: transparent url(/shared/machine/atarrow.png) no-repeat 5px 46px;
  }

div#calendar div.entry h2, div#calendar div.entry h3 {
  margin: 0px 0px 5px 0px;
  border: 1px solid #9a9;
  font: bold 11px arial,sans-serif;
  padding: 10px;
  min-height: 14px;
  }

div#calendar div.entry h2 {
  background: #c5ccc2;
  width: 260px;
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 240px;
  }

html>body div#calendar div.entry h2 {
  width: 240px;
  }

div#calendar div.entry h3 {
  margin-left: 40px;
  width: 220px;
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 200px;
  }

html>body div#calendar div.entry h3 {
  width: 200px;
  }

div#calendar div.entry div.details {
  border: 1px solid #9a9;
  position: absolute;
  left: 267px;
  top: 6px;
  height: 75px;
  width: 149px;
  background: #b2bfb2;
  text-align: left;
  }

html>body div#calendar div.entry div.details {
  left: 272px;
  top: 5px;
  }

div#calendar div.entry div.details h4 {
  padding: 10px 0px 0px 10px;
  margin: 0px;
  font: bold 9pt arial,sans-serif;
  }

div#calendar div.entry div.details address {		
  padding: 0px 0px 0px 10px;
  margin: 0px;
  font: italic normal 8pt arial,sans-serif;
  }
					  
					div#calendar div.entry div.details div.price { /* NEW!! adds styling to new .price class */
                 padding: 0px 0px 0px 10px;
                 margin: 0px;
                 font: normal 8pt arial, sans-serif;
					  text-transform: uppercase;
                 }
					
div#calendar div.entry p {
  border: 1px solid #9a9;
  margin: 0px 0px 5px 0px;
  font-size: 9pt;
  padding: 5px 9px;
  }

div.products table {
  border: 1px solid #9a9;
  margin-bottom: 15px;
  font: bold 11px sans-serif ! important;
  }

div.products td {
  padding: 4px;
  }

div.products img {
  border: none;
  }

div.products hr {
  display: none;
  }

div.products div.entry {
  margin: 0px ! important;
  }

div.products div.entry h2 {
  margin: 0px ! important;
  border: 1px solid #9a9;
  background: #b2bfb2;
  padding: 5px 8px ! important;
  font: bold 11px arial,sans-serif ! important;
  }

div.products div.entry p {
  margin: 4px 0px 0px 0px ! important;
  border: 1px solid #9a9;
  background: #cbd6cb;
  padding: 5px 8px ! important;
  font: bold 11px arial,sans-serif ! important;
  }

div.products a {
  color: #474;
  }

div#postForm {
  border: 1px solid #9a9;
  background: transparent url(/shared/machine/faders.png) no-repeat 319px 0px;
  min-height: 296px;
  }

div#postForm label {
  display: block;
  margin: 5px;
  font: bold 10pt arial,sans-serif;
  border: 1px solid #9a9;
  padding: 6px 9px;
  background: #bbc7bb;
  width: 312px;
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 294px;
  }

html>body div#postForm label {
  width: 294px;
  }

div#postForm input {
  display: block;
  width: 308px;
  height: 22px;
  margin: 5px;
  }

div#postForm textarea {
  display: block;
  width: 308px;
  height: 95px;
  margin: 5px;
  }

body.guestbook div.entry {
  border: 1px solid #9a9;
  padding: 5px;
  margin: 10px 0px;
  }

body.guestbook div.entry h2 {
  border: 1px solid #9a9;
  margin: 0px ! important;
  padding: 5px 8px 5px 8px ! important;
  font: bold 11px arial,sans-serif ! important;
  background: #bbc7bb;
  }

body.guestbook div.entry h3 {
  border: 1px solid #9a9;
  margin: 5px 0px 0px 0px;
  padding: 5px 8px 5px 8px;
  font: bold 11px arial,sans-serif ! important;
  background: #c7d4c7;
  }

body.guestbook div.entry blockquote {
  border: 1px solid #9a9;
  margin: 5px 0px 0px 0px;
  padding: 5px 8px 5px 8px;
  font: normal 13px arial,sans-serif;
  text-align: left;
  }

body.links div#content a {
  color: #474;
  }

#splashimage { text-align: center; margin: 100px auto; }
#splashimage a img { border: 0; }