/* MAIN STUFF */

* {
  padding: 0;
  margin: 0;
  border: 0;
}
body {
  background: transparent url("bilder/bkg.jpg") repeat-y;
  background-position: center top;
  font: 11px Verdana, Arial, Helvetica, sans-serif;
  line-height: 20px;
  min-width: 800px;
}
p {
  text-align: justify;
}
ul {
  list-style-type: none;
}
strong {
  color: green;
}
a {
  color: white;
  text-decoration: none;
}
h2 {
  margin: 10px 0 5px 0;
}
div.expandButton {
  cursor: pointer;
}
span.expandSpan {
  display: none;
}

/* HEADER */

#headerWrapper {
  background: transparent url( "bilder/footerBorder.png" ) center 66px no-repeat;
}
#headerContent {
  width: 542px;
  height: 312px;
  margin: 0 auto;
  position: relative;
  text-align: justify;
}
#title {
  position: absolute;
  background: transparent url( "bilder/headlineglansbandet.gif" ) no-repeat scroll left top;
  height: 132px;
  width: 420px;
  top: 80px;
  left: 129px;
  text-indent: -1000em;
}
#players {
  position: absolute;
  width: 330px;
  height: 300px;
  top: 0px;
  left: -275px;
}
#trumpet {
  position: absolute;
  top: 84px;
  left: -151px;
  width: 66px;
  height: 59px;
  cursor: pointer;
}
#saxophone {
  position: absolute;
  top: 111px;
  left: -99px;
  width: 100px;
  height: 88px;
  cursor: pointer;
}

/* HEADER: HIDDEN SPANS :: JAVASCRIPT HOVER */

#trumpet span {
  background: transparent url( "bilder/explTrumpet.gif" ) no-repeat;
  display: none;
  position: absolute;
  width: 66px;
  height: 59px;
}
#saxophone span {
  background: transparent url( "bilder/explSaxophone.gif" ) no-repeat;
  display: none;
  position: absolute;
  width: 100px;
  height: 88px;
}

/* HEADER: MENU */

#headerContent a {
  display: block;
}
#headerContent li {
  float: left;
}
#menu {
  position: relative;
  top: 218px;
  left: 168px;
  text-indent: -1000em;
}
#hem a {
  position: absolute;
  top: -112px;
  left: 15px;
  width: 365px;
  height: 80px;
}
#filer {
  position: absolute;
  left: -123px;
  width: 94px;
  height: 17px;
}
#fakta {
  width: 104px;
  height: 17px;
}
#spela {
  margin-left: 26px;
  width: 90px;
  height: 17px;
}
#boka {
  margin-left: 26px;
  width: 81px;
  height: 17px;
}
#filer a {
  background: url( "bilder/menufilerbkg.gif" ) no-repeat 0px 0px;
  width: 94px;
  height: 17px;
}
#fakta a {
  background: url( "bilder/menubkg.gif" ) no-repeat 0px 0px;
  width: 104px;
  height: 17px;
}
#spela a {
  background: url( "bilder/menubkg.gif" ) no-repeat -130px 0px;
  width: 90px;
  height: 17px;
}
#boka a {
  background: url( "bilder/menubkg.gif" ) no-repeat -246px 0px;
  width: 81px;
  height: 17px;
}
#filer a:hover, #filer a.active {
  background-position: 0px -20px;
}
#fakta a:hover, #fakta a.active {
  background-position: 0px -20px;
}
#spela a:hover, #spela a.active {
  background-position: -130px -20px;
}
#boka a:hover, #boka a.active {
  background-position: -246px -20px;
}

/* HEADER: MENU: HIDDEN SPANS :: JAVASCRIPT HOVER */

#menu span {
  position: absolute;
  display: none;
}
#filer span {
  background: url("bilder/explFiler.gif") no-repeat;
  top: 25px;
  left: -28px;
  width: 151px;
  height: 37px;
}
#fakta span {
  background: url("bilder/explFakta.gif") no-repeat;
  top: 25px;
  left: -20px;
  width: 136px;
  height: 25px;
}
#spela span {
  background: url("bilder/explSpela.gif") no-repeat;
  top: 25px;
  left: 111px;
  width: 125px;
  height: 32px;
}
#boka span {
  background: url("bilder/explBoka.gif") no-repeat;
  top: 22px;
  left: 220px;
  width: 149px;
  height: 38px;
}

/* CONTENT */

#contentWrapper {
  width: 442px;
  margin: 0 auto;
  position: relative;
}
#content p {
  margin: 0 0 15px 0;
}
#content a {
  color: green;
  font-weight: bold;
}
#content {
  padding: 0 0 50px 0;
  text-align: justify;
}

/* FOOTER */

#footerWrapper {
  background: transparent url( "bilder/footerBorder.png" ) no-repeat;
}
#footerContent {
  height: 202px;
  width: 542px;
  margin: 0 auto;
  padding-top: 14px;
  position: relative;
}
#contact {
  position: absolute;
  color: white;
  text-align: right;
  top: 40px;
  left: -10px;
}
#contact a {
  color: green;
}
#login ul {
  position: absolute;
  background-color: black;
  color: white;
  top: 40px;
  left: -15px;
  padding: 20px 5px 5px 5px;
  width: 205px;
  height: 55px;
}
#login label {
  float: left;
  width: 60px;
  margin-right: 10px;
}
#login input {
  width: 100px;
  font-size: 11px;
  font: 11px Verdana, Arial, Helvetica, sans-serif;
}
#loginAdm {
  position: absolute;
  background-color: black;
  top: 0px;
  left: 377px;
  width: 120px;
  height: 55px;
  padding: 20px 5px 5px 5px;
}
#loginAdm input {
  width: 120px;
  text-align: left;
  color: white;
  background-color: black;
  cursor: pointer;
}
#login li.submit input {
  /* image replacement hack */
  padding: 35px 0 0 0;
  overflow: hidden;
  height: 0px !important;
  height /**/:35px;
  /*hack ends here */
  position: absolute;
  top: 22px;
  left: 182px;
  width: 20px;
  height: 35px;
  background: url("bilder/key.gif") no-repeat;
  cursor: pointer;
}
/**/
#lock {
  position: absolute;
  top: 62px;
  left: -58px;
  width: 22px;
  height: 33px;
}
#lockout {
  position: absolute;
  top: 62px;
  left: -58px;
  width: 22px;
  height: 33px;
}
/**/
#login #lock { 
  background: url("bilder/padlockClosed.gif") no-repeat;
}
#logout input {
  /* image replacement hack */
  padding: 33px 0 0 0;
  overflow: hidden;
  height: 0px !important;
  height /**/:33px;
  /*hack ends here */
  position: absolute;
  width: 22px;
  height: 33px;
  background: url("bilder/padlockOpened.gif") no-repeat;
  cursor: pointer;
}
#radio {
  position: absolute;
  top: 40px;
  left: 520px;
  background: url("bilder/bushradio.png") no-repeat;
  width: 150px;
  height: 161px;
}
#listen ul {
  position: absolute;
  top: 40px;
  left: 370px;
  width: 130px;
  height: 80px;
  color: white;
}
#listen li {
  cursor: pointer;
}
#logo {
  position: absolute;
  top: 30px;
  left: 220px;
  width: 103px;
  height: 100px;
}


/* FOOTER: HIDDEN SPANS :: JAVASCRIPT CLICK */

#radio span {
  position: absolute;
  display: none;
  background: url("bilder/explRadio.gif") no-repeat;
  top: 0;
  left: -35px;
  width: 185px;
  height: 161px;
}
/**/
#lock span {
  position: absolute;
  display: none;
  top: 0px;
  left: -32px;
  width: 54px;
  height: 56px;
}
#lockout span {
  position: absolute;
  display: none;
  top: 0px;
  left: -32px;
  width: 54px;
  height: 56px;
}
/**/
#login #lock span {
  background: url("bilder/explLogin.gif") no-repeat 0px 15px;
}
#logout #lockout span {
  background: url("bilder/explLogout.gif") no-repeat 0px 15px;
}

/* FAKTA SPECIFIC */

#bandet li {
  height: 80px;
  width: 340px;
  font: 14px Verdana, Arial, Helvetica, sans-serif;
}
#bandet .fototext {
margin: 10px;
}
#bandet .left  .fototext {
  float: left;
}
#bandet .right  .fototext {
  float: right;
}
#bandet .left img {
  float: left;
}
#bandet .right img {
  float: right;
}

/* HEADLINE REPLACEMENTS */

#headAktuella {
  width: 274px;
  height: 18px;
  background: url("bilder/headAktuella.png") no-repeat;
  text-indent: -1000em;
}
#headBandet {
  width: 114px;
  height: 14px;
  background: url("bilder/headBandet.png") no-repeat;
  text-indent: -1000em;
}


/* TEMPORARY CHANGES */

#audition {
  position: absolute;
  top: 125px;
  left: 295px;
  width: 200px;
  height: 119px;  
  background: url("bilder/audition.png") no-repeat;
}

#nya {
  text-align: center;
}

#tjej {
  float:left;
}

#kille {
  float:right;
}