/*
** Trance Hub v2 style sheet for CSS2-capable browsers.
** Copyright 2007 - 2009 Trance Hub, http://www.trancehub.com/
**
** Coded by Priyank Sharma, http://priyanksharma.com/
*/


/* Page
-------- */
body {
  background:#133860 url(../images/bg.jpg) top center no-repeat;
  color:#bcddff;
  font-family:arial;
  font-size:12px;
  line-height:15px;
  margin:0;
  padding:0;
}


/* Menu
-------- */
div#menu {
  background:url(../images/menu.gif) no-repeat;
  height:30px;
  margin:0 auto;
  overflow:hidden;
  width:900px;
}
div#menu ul#nav {
  background:url(../images/menu.gif) no-repeat;
  height:30px;
  margin:0;
  overflow:hidden;
  position:relative;
  width:900px;
}
div#menu ul#nav li {
  float:left;
  list-style:none;
}
div#menu ul#nav li a {
  border:none;
  height:30px;
  position:absolute;
  text-decoration:none;
  text-indent:-9999px;
  top:0;
}

div#menu ul#nav li#nav-home a {
  background:url(../images/menu.gif) no-repeat -15px 0;
  left:15px;
  width:65px;
}
div#menu ul#nav li#nav-news a {
  background:url(../images/menu.gif) no-repeat -80px 0;
  left:80px;
  width:68px;
}
div#menu ul#nav li#nav-interviews a {
  background:url(../images/menu.gif) no-repeat -148px 0;
  left:148px;
  width:105px;
}
div#menu ul#nav li#nav-reviews a {
  background:url(../images/menu.gif) no-repeat -253px 0;
  left:253px;
  width:82px;
}
div#menu ul#nav li#nav-artists a {
  background:url(../images/menu.gif) no-repeat -335px 0;
  left:335px;
  width:80px;
}
div#menu ul#nav li#nav-radio a {
  background:url(../images/menu.gif) no-repeat -415px 0;
  left:415px;
  width:118px;
}
div#menu ul#nav li#nav-events a {
  background:url(../images/menu.gif) no-repeat -533px 0;
  left:533px;
  width:78px;
}
div#menu ul#nav li#nav-videos a {
  background:url(../images/menu.gif) no-repeat -611px 0;
  left:611px;
  width:75px;
}
div#menu ul#nav li#nav-about a {
  background:url(../images/menu.gif) no-repeat -686px 0;
  left:686px;
  width:95px;
}
div#menu ul#nav li#nav-contact a {
  background:url(../images/menu.gif) no-repeat -781px 0;
  left:781px;
  width:105px;
}


div#menu ul#nav li#nav-home a:hover {
  background-position:-15px -30px;
}
div#menu ul#nav li#nav-news a:hover {
  background-position:-80px -30px;
}
div#menu ul#nav li#nav-interviews a:hover {
  background-position:-148px -30px;
}
div#menu ul#nav li#nav-reviews a:hover {
  background-position:-253px -30px;
}
div#menu ul#nav li#nav-artists a:hover {
  background-position:-335px -30px;
}
div#menu ul#nav li#nav-radio a:hover {
  background-position:-415px -30px;
}
div#menu ul#nav li#nav-events a:hover {
  background-position:-533px -30px;
}
div#menu ul#nav li#nav-videos a:hover {
  background-position:-611px -30px;
}
div#menu ul#nav li#nav-about a:hover {
  background-position:-686px -30px;
}
div#menu ul#nav li#nav-contact a:hover {
  background-position:-781px -30px;
}

div#menu ul#nav li#nav-home a.active {
  background-position:-15px -60px;
}
div#menu ul#nav li#nav-news a.active {
  background-position:-80px -60px;
}
div#menu ul#nav li#nav-interviews a.active {
  background-position:-148px -60px;
}
div#menu ul#nav li#nav-reviews a.active {
  background-position:-253px -60px;
}
div#menu ul#nav li#nav-artists a.active {
  background-position:-335px -60px;
}
div#menu ul#nav li#nav-radio a.active {
  background-position:-415px -60px;
}
div#menu ul#nav li#nav-events a.active {
  background-position:-533px -60px;
}
div#menu ul#nav li#nav-videos a.active {
  background-position:-611px -60px;
}
div#menu ul#nav li#nav-about a.active {
  background-position:-686px -60px;
}
div#menu ul#nav li#nav-contact a.active {
  background-position:-781px -60px;
}


/* Interface
------------- */
div#interface {
  background:url(../images/bg-interface.gif) top center repeat-y;
  margin:0 auto;
  width:900px;
}

div#main {
  margin:0 auto;
  width:900px;
}

div#main div#left-col {
  background:#1b4776 url(../images/bg-leftcol.gif) top no-repeat;
  float:left;
  width:535px;
}
div#main div#left-col img.left-col-img {
  margin:20px 0 10px 20px;
}
div#main div#left-col p {
  margin:10px 15px 0 15px;
}

div#main div#right-col {
  background:#1b4776 url(../images/bg-rightcol.gif) top no-repeat;
  float:right;
  width:365px;
}
div#main div#right-col p {
  margin:5px 15px 0 15px;
}
div#main div#right-col h2 {
  margin:0 0 0 15px;
}

div#main2 {
  background:#1b4776 url(../images/bg-maincol.gif) top no-repeat;
  margin:0 auto;
  width:900px;
}
div#main2 p {
  margin:10px 15px 0 25px;
}
div#main2 h2 {
  margin:0 15px 0 25px;
}
div#main2 span.date {
  margin:0 0 0 25px;
}

div#bottom {
  background:url(../images/bg-bottom.gif);
  clear:both;
  height:30px;
  margin:0 auto;
  width:900px;
}

div#footer {
  background:#133860;
  color:#4f81b7;
  font-size:11px;
  height:100px;
  line-height:15px;
  margin:0 auto;
  padding:10px 0 0 0;
  text-align:center;
  width:900px;
}
div#footer a:link,
div#footer a:visited {
  border:none;
  color:#5a8dc5;
  font-size:11px;
  font-weight:bold;
}
div#footer a:hover,
div#footer a:active {
  color:#6ea1d8;
}

img {
  border:none;
}
img.float-left {
  float:left;
  margin:15px 15px 10px 20px;
}
img.float-left2 {
  float:left;
  margin:0 15px 0 17px;
}
img.left {
  margin:15px 15px 10px 20px;
}


/* Logo
-------- */
div#logo {
  background:url(../images/bg-logo.jpg);
  height:100px;
  margin:0 auto;
  width:900px;
}
div#logo a {
  border:none;
}


/* Typography
-------------- */
p strong {
  color:#e9f4ff;
  font-size:14px;
  font-style:italic;
  font-variant:small-caps;
}
p.toplink {
  padding-right:5px;
  text-align:right;
}
p.toplink a {
  font-size:9px;
}
div.rounded p {
  margin:10px 15px 0 15px;
}

span.date {
  color:#83b0e0;
  font-size:10px;
  letter-spacing:1px;
  margin:0 0 0 15px;
  padding:0;
  text-transform:uppercase;
}
span.red {
  color:#ff8800;
}
span.info {
  color:#83b0e0;
  font-size:10px;
  font-variant:small-caps;
  letter-spacing:1px;
  line-height:10px;
  margin:0 0 0 15px;
  text-transform:uppercase;
}
span.info2 {
  color:#83b0e0;
  font-size:10px;
  font-variant:small-caps;
  letter-spacing:1px;
  line-height:10px;
  margin:0;
  text-transform:uppercase;
}

h2 {
  color:#ffffff;
  font-family:arial;
  font-size:17px;
  font-weight:normal;
  line-height:12px;
  margin:2px 0 0 15px;
}
h2.show-hide {
  border:none;
  font-size:10px;
}
h3 {
  color:#ffffff;
  font-family:arial;
  font-size:17px;
  font-weight:normal;
  line-height:7px;
  margin:2px 0 0 35px;
}


/* Hyperlinks
-------------- */
a:link,
a:visited {
  border-bottom:1px #aaa solid;
  color:#e9f4ff;
  font-size:13px;
  text-decoration:none;
}
a:hover,
a:active {
  border-bottom:1px #fff solid;
  color:#fff;
}
a.noborder {
  border:none;
}


/* Spacers
----------- */
div.spacer-void {
  clear:both;
  display:block;
  height:0;
}
div.fix {
  clear:both;
  display:block;
  height:5px;
}
div.spacer-half {
  clear:both;
  display:block;
  height:10px;
}
div.spacer {
  clear:both;
  display:block;
  height:20px;
}
div.spacer-double {
  clear:both;
  display:block;
  height:40px;
}
div.spacer-triple {
  clear:both;
  display:block;
  height:60px;
}

div.void {
  clear:both;
  display:block;
  height:200px;
}
div.void-double {
  clear:both;
  display:block;
  height:400px;
}
div.void-triple {
  clear:both;
  display:block;
  height:600px;
}


/* Newsletter
-------------- */
div#right-col div#newsletter1 {
  float:left;
  width:270px;
}
div#right-col div#newsletter2 {
  float:left;
  width:75px;
}
div#right-col input.newsletter-email {
  background:url(../images/newsletter-field.gif) no-repeat;
  border:none;
  color:#4b91d5;
  font-family:tahoma;
  font-size:12px;
  font-weight:bold;
  height:23px;
  margin:48px 0 3px 25px;
  outline:none;
  padding:2px 0 0 5px;
  width:240px;
}

div#right-col input.newsletter-submit {
  background:url(../images/newsletter-button.gif) no-repeat;
  border:none;
  height:22px;
  margin:48px 0 0 4px;
  width:55px;
}
div#right-col input.newsletter-submit:hover {
  background-position:0 -22px;
  border:none;
  cursor:pointer;
  height:22px;
  width:55px;
}
div#right-col input.newsletter-submit:active {
  background-position:0 0;
}

div#right-col div#newsletter-add {
  clear:left;
  color:#5799e5;
  display:none;
  font-size:10px;
  margin:0 0 0 28px;
}
div#right-col div#newsletter-success {
  clear:left;
  color:#5799e5;
  display:none;
  font-size:10px;
  margin:0 0 0 28px;
}


/* Rounded corners
------------------- */
div.rounded {
  background-color:#27598e;
  margin:0 0 0 20px;
  width:495px;
}
div.rounded2 {
  background-color:#27598e;
  margin:0 0 0 15px;
  width:300px;
}

div.rounded-top {
  background:url(../images/panel-tr.gif) top right no-repeat;
  margin-bottom:10px;
}
div.rounded-bottom {
  background:url(../images/panel-br.gif) bottom right no-repeat;
  margin-top:10px;
}

img.corner {
  border:none;
  display:block;
  height:10px;
  width:10px;
}


/* Forms
--------- */
form {
  margin:0;
  padding:0;
}

input.textfield {
  background:url(../images/form-text.gif) no-repeat;
  border:none;
  color:#4b91d5;
  font-family:tahoma;
  font-size:12px;
  font-weight:bold;
  height:23px;
  margin:3px 0 5px 0;
  outline:none;
  padding:2px 0 0 5px;
  width:240px;
}
.textareafield {
  background:url(../images/form-textarea.gif) no-repeat;
  border:none;
  color:#4b91d5;
  font-family:tahoma;
  font-size:12px;
  font-weight:bold;
  height:93px;
  margin:3px 0 5px 0;
  padding:5px 0 0 5px;
  resize:none;
  width:240px;
}

select {
  color:#1b4776;
  height:22px;
  margin:3px 0 5px 0;
  padding:0;
  width:250px;
}
