/* DerrichJohn.com */

/*============================ main elements ========================*/
* { margin:0;padding:0;}

body {
margin:0;
padding:0;
background: #131313 url(images/bg.gif) top left repeat-x;
font: normal 12px Tahoma;
color: #FFFFFF;
font-size:11px;
}


div#wrapper {
width:698px;
margin:0 auto;
padding:0;
}

div#banner-box {
width:375px;
height:111px;
margin:0;
padding:0;
background: url(images/banner.jpg) top left no-repeat;
}
a:link, a:active, a:visited {
color:#ffffff;
font-size:11px;
font-family: Tahoma;
text-decoration: none;
}
a:hover {
color:#ff0000;
font-size:11px;
font-family: Tahoma;
text-decoration: none;
}

a.ue {
color:#ffffff;
font-size:11px;
font-family: Tahoma;
text-decoration: none;
border:0;
}
a.ue:hover {
color:#ffffff;
font-size:11px;
font-family: Tahoma;
text-decoration: none;
border-bottom: 1px dotted #ffffff;
}
.content-mid a:link, .content-mid a:visited, .content-mid a:active {
color:#ff0000;
font-size:11px;
font-family: Tahoma;
text-decoration: none;
}
.content-mid a:hover {
color:#ff0000;
font-size:11px;
font-family: Tahoma;
text-decoration: none;
border-bottom: 1px dotted #ff0000;
}
/*============================ hide text ========================*/

div#nav ul li a span {display:none;}


/*============================ navigation ========================*/

div#nav {
width:698px;
height:47px;
margin:0;
padding:0;
}

#nav ul li {
list-style: none;
float:left;
}
#nav ul li a {
height:47px;
display:block;
}
#nav ul li a.homepage {
width:143px;
background: url(images/homepage-btn.gif) no-repeat;
}
#nav ul li a.homepage:hover {
background-position: 0 -47px;
}
#nav ul li a.thedeejay {
width:123px;
background: url(images/thedeejay-btn.gif) no-repeat;
}
#nav ul li a.thedeejay:hover {
background-position: 0 -47px;
}
#nav ul li a.schedule {
width:115px;
background: url(images/schedule-btn.gif) no-repeat;
}
#nav ul li a.schedule:hover {
background-position: 0 -47px;
}
#nav ul li a.music {
width:93px;
background: url(images/music-btn.gif) no-repeat;
}
#nav ul li a.music:hover {
background-position: 0 -47px;
}
#nav ul li a.media {
width:95px;
background: url(images/media-btn.gif) no-repeat;
}
#nav ul li a.media:hover {
background-position: 0 -47px;
}
#nav ul li a.contact {
width:129px;
background: url(images/contact-btn.gif) no-repeat;
}
#nav ul li a.contact:hover {
background-position: 0 -47px;
}


/*============================ center box ========================*/

div#center-box {
width:698px;
height:200px;
margin:4px 0 5px 0;
padding:0;
}
#flash-box {
float:left;
width:540px;
height:200px;
margin:0;
padding:0;
background: url(images/flashpic.jpg) no-repeat;
}
#music-tabs {
float:left;
width:158px;
height:200px;
margin: 0 ;
padding:0;
}
#music-tabs ul li {
list-style: none;
}
#music-tabs ul li a {
height:44px;
display:block;
}
#music-tabs ul li a.tab1{
font-family:Tahoma;
color:#767676;
font-size:11px;
text-decoration:none;
line-height: 20px;
padding: 5px 0 0 10px;
width:148px;
background: url(images/music-tab.gif) no-repeat;
}
#music-tabs ul li a.tab1:hover {
font-family:Tahoma;
color:#ffffff;
font-size:11px;
text-decoration:none;
line-height: 20px;
padding: 5px 0 0 10px;
background-position: 0 -49px;
}
#music-tabs ul div a {

height:53px;
display:block;
}
#music-tabs ul div a.tab4{
width:158px;
background: url(images/viewallmusictab.gif) no-repeat;
}
#music-tabs ul div a.tab4:hover {
background-position: 0 -53px;
}


/*============================ sidebar ========================*/

#sidebar {
width:231px;
margin:0;margin-top:20px;
padding:0;
float:left;
}
.smallbox {
width:231px;
padding:0;
margin: 0 0 15px 0;
background-color: #000000;
}
.smallbox-content {
margin:0;
padding: 0 5px 0 5px;
}
.smallbox-bottom {
width:231px;
height:10px;
margin:0;
padding:0;
background: url(images/smallbox-bottom.gif) no-repeat;
}
h2 {
height:43px;
width:231px;
}
h2 span {
display:none;
}
h2.mailing-list {
background: url(images/mailinglist-top.gif) no-repeat;
}
h2.upcoming-events {
background: url(images/upcomingevents-top.gif) no-repeat;
}
h2.quick-contacts {
background: url(images/quickcontacts-top.gif) no-repeat;
}

/*============================ upcoming events ========================*/

.upcomingevents-list {
width:221px;
}
.upcomingevents-list li span {
font-family:Tahoma;
font-size: 11px;
color:#ff0000;
margin-right:4px;
}
.upcomingevents-list li {
list-style: none;
height:25px;
width:210px;
background: #000000 url(images/inputbg.gif) repeat-x;
margin:0;margin-bottom:5px;
padding: 9px 5px 0 6px;
font-family:Tahoma;
font-size: 11px;
color:#ffffff;
}

/*============================ mailing list ========================*/
.mlinput {
width: 209px;
height:25px;
background: #000000 url(images/inputbg.gif) repeat-x;
margin:0 0 7px 0;
padding:9px 5px 0 7px;
border:0;
font-family:Tahoma;
font-size: 11px;
color:#767676;
}
.submitbtn {
width:69px;
height:30px;
margin:0;margin-top:7px;
border:0;
background: url(images/submitbutton.gif) no-repeat;
}
/*============================ main content ========================*/

#content {
width: 467px;
margin:0;margin-top:20px;
padding:0;
float:left;
}
.content-box {
width:452px;
margin:0 0 15px 15px;
padding:0;
float:left;
background-color: #000000;
}
.content-bottom {
width:452px;
height: 15px;
margin:0;
padding:0;
background: url(images/contentbox-bottom.gif) no-repeat;
}
h3.content-head {
width:422px;
height: 40px;
background: #000000 url(images/contentbox-top.gif) top left no-repeat;
margin:0;
padding:10px 15px 10px 15px;
font-size: 17px;
line-height: 22px;
font-weight:normal;
font-family: verdana;
color:#ffffff;
}
h3.content-head span {
font-size: 11px;
font-weight:normal;
font-family: Tahoma;
color:#767676;

}
.content-mid {
padding:0 15px;
font-size:11px;
color:#ffffff;
font-family: Tahoma;
line-height: 24px;
}
.redtext {
color:#ff0000;
}
.greytext {
color:#767676;
}



/*============================ schedule ========================*/

#equip li{
list-style: none;
background: url(images/redbullet.gif) center left no-repeat;
height:25px;
padding-left:12px;
}

/*============================ schedule ========================*/

.moreinfo {
margin-right:7px;
padding-right:20px;
height:22px;
text-align:right;
background: url(images/infobullet.gif) center right no-repeat;
}
.schedule-listing {
background: url(images/schedule-line.gif) bottom repeat-x;
width: 422px;
padding: 0 0 7px 0;
margin-bottom:7px;
}


/*============================ contacts ========================*/
.fullname {
width: 300px;
height:25px;
background: #000000 url(images/inputbg.gif) repeat-x;
margin:5px 0;
padding:9px 5px 0 7px;
border:0;
font-family:Tahoma;
font-size: 11px;
color:#767676;
}
.email {
width: 300px;
height:25px;
background: #000000 url(images/inputbg.gif) repeat-x;
margin:5px 0;
padding:9px 5px 0 7px;
border:0;
font-family:Tahoma;
font-size: 11px;
color:#767676;
}

.subject {
width: 300px;
height:25px;
background: #000000 url(images/inputbg.gif) repeat-x;
margin:5px 0;
padding:9px 5px 0 7px;
border:0;
font-family:Tahoma;
font-size: 11px;
color:#767676;
}
.message {
width: 300px;
height:100px;
background: #131313 url(images/textareabg.gif) top left repeat-x;
margin:5px 0;
padding:9px 5px 0 7px;
border:0;
font-family:Tahoma;
font-size: 11px;
color:#767676;
}
.sendbtn {
width:84px;
height:30px;
margin:0;margin-top:7px;
border:0;
background: url(images/sendmsgbtn.gif) no-repeat;
}
.resetbtn {
width:69px;
height:30px;
margin:0;margin-top:7px;
border:0;
background: url(images/resetbtn.gif) no-repeat;
}
/*============================ music ========================*/
.music-box {
background: url(images/musicthumb.jpg) top left no-repeat;
width: 422px;
height:90px;
margin:0 0 40px 0;
padding:0;
}
.music-info {
width: 322px;
height:90px;
padding:0;
margin:0 0 0 100px;
}
.music-line {
height:20px;

}
.flashplayer {
height:30px;
width:68px;
}

/*============================ copyright ========================*/

#copyright {
width:452px;
height: 52px;
background: url(images/copyrightbar.gif) top left no-repeat;
float:left;
margin:0 0 15px 15px;
padding:0;
}
#copyright a {
width:58px;
height:52px;
background: url(images/topbutton.gif) no-repeat;
display:block;
float:right;
}
#cuten {
width:452px;
height: 52px;
background: url(images/copyrightbar.gif) top left no-repeat;
float:left;
margin:0 0 15px 15px;
padding:0;
}
#cuten a {
width:70px;
height:52px;
background: url(images/cutenewsbutton.gif) no-repeat;
display:block;
float:right;
}