@font-face { font-family: DefSlammerTag; src: url(slammertag.ttf); }
@font-face { font-family: DefSlammerTagEot; src: url(slammertag.eot); }

html { height: 100%; }
body {
  background: #000 url(../pic/Better-Definition-BG3.jpg) no-repeat scroll 50% 0%;
  color:#fff;
  height:100%;
  margin:auto;
  font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
  font-size:9.4pt;
}

table { font-size: 9.4pt; }

sup, sub { line-height:1em; }

a:link, a:active, a:visited { color:#99beff; text-decoration:none; }
a:hover {  text-decoration: underline; }

a.playLink { background: transparent url('../pic/play-listen-s.png') no-repeat 0 0; background-size:32px; 
             padding:0 0 0 34px; height:32px; line-height:32px; display:inline-block; font-size:11pt; }
a.playLink span { padding:0 0 0 5px; }
a.playLink:hover { color:#4c7bfc; background-position:0 -32px; text-decoration:none; }

a.LinkBtn { padding:3px 6px; display:inline-block; background-color:#2563BA; color:#eef; }
a.LinkBtn:hover { background-color:#37c; text-decoration:none; color:#fff; }

h1, .heading1
{
    margin-top:0;
    color:#ccd192;
    font-size:20pt;
    line-height:1.5;
    font-weight:normal;
}
.kongbanana h1 { color:#100; font-weight:bold; font-size:16pt; }


h2 { margin-top:0; font-size:15pt; }

h3, .plHTbl th { 
  color:#95c7e5;
  font-size:12pt;
}
h4 
{
	color:#2563BA;
	font-style:italic;
	font-size:11pt;
}

p, li { line-height:1.5; }

blockquote {
    padding: 2px 8px 2px 20px;
    border-style: solid;
    border-color: #ccc;
    border-width: 0 0 0 5px;
}

textarea.sameStyleAsReal { font-family: 'lucida grande', tahoma, verdana, arial, sans-serif; font-size:9.3pt; }

.nowrap { white-space:nowrap; }
.clearBoth { clear:both; float:none !important; }

.tab { margin-left:40px; }

.supergorilla 
{
    background:#232531 url(../pic/better-definition-website-bg.jpg) repeat-x; position: absolute; top:0px; left: 50%; 
    width:940px; margin-left:-470px; min-height:700px;
}
.headgorilla
{
    background: transparent url(../pic/Definition-Web-Logo.png) no-repeat scroll 7px 12px;
    height:100px; margin: 0px 0px 15px; position:relative;
}

#aLogoLink { display:block; position:absolute; top:20px; left:25px; width:295px; height:80px; z-index:1; }

/*.bighairyone 
{ 
    position:absolute; top:84px; right:16px; color:#a31; font-size:8.3pt; 
    width:887px; text-align:right; 
}*/


.gbox  
{
    margin: 0px 15px 15px; padding:0; /*box-shadow:1px 1px 3px #222;*/ background-color:#2b2d39;
    border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;
}
.gbox .boxhead 
{ 
    min-height:20px; padding:3px 10px 1px; background:#363b59 url(../pic/DefColourBgSprite.jpg) no-repeat scroll; 
}
.gbox .boxhead h1, .tHead h1 { 
    font-family:DefSlammerTag, DefSlammerTagEot, 'lucida grande', tahoma, verdana, arial, sans-serif; 
    color:#ddd; font-size:14pt; font-weight:lighter; line-height:100%; margin:0; letter-spacing:0.1em;
}
.boxhead a { color: #d9cf82; float: right;  line-height: 19px; margin: 0 2px; }

.gbox .boxhead img:first-child { height:18px; }
.gbox .boxfoot { clear:both; font-size:8.5pt; text-align:center; padding:2px 0; 
                 border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }
.gbox img { border:none; }
.gbox.gbListen { color:#b8e5d2; }
.gbListen .boxhead { background-color: #264d3c; background-position:0 -102px; }
.gbox.gbEvents { width:273px; margin-left: 0; }
.gbEvents .boxhead { background-color: #1a4480; background-position:0 -302px; }
.gbTopTracks .boxhead { background-color: #777135; background-position:0 -445px; }


.contentGorilla { padding-bottom:180px; }
.contentkong { margin: 15px; position:relative; }


.footerBox { background-color: #1f2026; margin:32px 0 0; clear:both; padding:20px 0; 
             min-height:120px; position:absolute; bottom:0; width:100%; }
.footerBox a { color:#bbb; }
.footerBox a:hover { color:#bbc; }

ul.footerList { list-style:none; float:left; margin:0; }
ul.footerList ul { list-style:none; padding-left:0; }

.footerRight { text-align:right; margin:3px 25px 0 0; }
.footerRight img { height:70px; margin:0 15px; }

.copycontact { text-align:left; margin:20px 40px 0; clear:both; border-top:#333541 1px solid; padding-top:5px; }
.copycontact, .copycontact a { color:#ccc; }
.copycontact p { float:left; width:50%; margin:0; font-size:8pt; }
.copycontact p:last-child { text-align:right; }


#pageeditwindow
{
	position:relative;
	top:20px;
	display:block;
	z-index:10;
	padding:5px;
}
#pageeditbuttons
{ 
	text-align:center; 
	padding:2px 0;
	background-color:#7799cc;	
}

.hiddencolumn { visibility:hidden; }

.alignleft { float:left; margin: 0px 4px 4px 0px; }
.alignright { float:right; margin: 0px 0px 5px 5px; }


/* ---- Navigation / Menu ---- */

.nav, .nav ul {
	padding: 0;
	margin: 74px 0px 0px;
	list-style: none;
	text-align:center;
	
	height:24px;
	float:right;
}

.nav a {
	display: block;
	width: auto;
	
	color:#eeeeee;
	display:block;
	font-size:10pt;
	height:24px;
	line-height:24px;
	padding:0pt 12px;
	text-decoration:none;
	
	border-bottom: solid 1px #aa1f1f;
}

.nav li { float: left; width: 80px; }
.nav li a:hover { border-bottom: solid 2px #1a40ac; color:#ffffff; text-shadow: 0px 0px 10px #ff9999; }

.nav li ul 
{
	position: absolute;
	left: -999em;
	background: #00023A url(../pic/dropmenubg.jpg) no-repeat scroll center bottom;
	height:auto;
	width: 120px;
}
.nav li ul li  { width:120px; text-align: left; }
.nav li:hover ul { left: auto; margin-top:0px; }
.nav li.sfhover ul { left: auto; margin-left: -35px; }

.navadmin { padding: 3px 0px; text-align: center; background-color:#235; background-image:none; font-size:8pt; margin:0 0 5px; box-shadow:rgba(0,0,0,0.5) 0px 1px 3px; }
/* ---- END Navigation / Menu ---- */



/*---- Playlist ----*/
.tblPlaylist { border: solid 2px #334; width:640px; border-spacing:0; color:#fff;
               background-color:#252733; }
.tblPlaylist p { margin: 2px 0; }
.plGuests { color:#FFCCAA;font-size:9pt; }
span.plArtist, a.plArtist:link, a.plArtist:visited { color: #eaeaff; font-weight:bold; }
a.plArtist:hover { color:#f5c149; }
.plAlbum { color:#aaa; }
.plAlbumImg { width:64px; height:64px; float:left; padding-right:8px; }
.tblPlaylist td { padding: 2px 3px; line-height:150%; }

.showPlaya { width:100%; max-width:640px; }

td.starcell, td.starvoted, td.readvote { text-align:center; color:#56668E; cursor:pointer; min-width:24px; }
td.starcell:hover { color:#89b; }
td.starcell:hover .thumbsup { background-position:0 -16px; }
td.starcell:hover, td.starcell:hover + td { background-color:#237; }
.tblPlaylist tr.altRow { background-color:#30303c; }
td.starvoted { font-weight:bold; cursor:auto; color:#dc3; }
td.starvoted .thumbsup { background-position:0 -16px; }

.plComment { float:right; color:#aa8; font-size:8pt; }

td.readvote { cursor:auto; }
td.readvote .thumbsup { background:none; display:none; }

.thumbsup { margin:auto; width:16px; height:16px; background:transparent url('../pic/big-thumbs-up.png') no-repeat 0 0; }

.playlistLeft { float:left; max-width:650px; }
.playlistRight { color: #679; float: left; margin: 0 0 0 25px; width: 230px; }


/* ---- Events ---- */
.eventColLeft { float:left; }
.eventColLeft > div { margin: 0 0 15px 15px; position: relative; }
.eventColRight { float:left; width:250px; margin:0 0 0 20px; }

.eventWords { color:White; overflow-y:hidden;
              height:280px; padding:0px; margin: 0; }
.eventDate { padding:5px 5px 0; margin: 0px; font-size:8.5pt; color:#ccc; }
.eventName { font-weight:bold; color:#dcebf5; }
a.eventDetail { display:block; color:#fff; padding: 5px;}
.eventTag { margin-top:4px; }
.eventLoc { font-size:8pt; margin-top:4px; }
.eventTime { font-size:8pt; }
a.eventEdit { display:block; color:#00f; padding:0px 5px 5px; text-align:right; }

a.newsLink:hover, a.eventDetail:hover { text-decoration:none; color:White; background:#163F54; cursor:pointer; }


a.overeventbox {
    display:block; width:100%;
    color:#fff; /*z-index:1;*/
}
a.overeventbox:hover { text-decoration:none; background-color:rgba(230,230,255,0.1) }
a.overeventbox:hover + div { filter: blur(4px) brightness(70%); }
.overeventbox > div { padding:8px; }
.overeventbox div div { margin:7px 0; }
.overeventbox div div:first-child { font-size:8.5pt; color:#ccc; margin:0; }
.overeventbox div div:nth-child(2) { font-size:10pt; font-weight:bold; }
.overeventbox div div:last-child { font-size:9pt; color:#eee; margin:0; }



/* ---- Front Page News ---- */
.def-scroll .jspVerticalBar { width:10px; }
.def-scroll .jspTrack { background-color:#1B3644; }
.def-scroll .jspDrag { background-color:#224754; }
.def-scroll .jspDrag:hover { background-color:#2E6270; }

.titlebar
{
	padding: 0px 5px 0px 3px;
	margin: 5px 0px;
	height: 11pt; 
	line-height: 11pt;
    background: #002856 url(../pic/titlebarbg.jpg) no-repeat scroll left center;
	color:#FFE3B1;
	font-size:11pt;
	font-weight:bold;
	font-family:Century Gothic, Tahoma;
    width:100%;
    border-top:ridge 3px #2050a0;
}

.entry-image { vertical-align: top; padding-top: 10px; width:100px; height:25px; }
.entry-image img { width:140px; }
.entry-header
{
	color:#697fbf;
	font-size:9pt;
	font-weight:bold;
	vertical-align: bottom;
	border-bottom: solid 1px #2543a0;
	padding:10px 0 2px 10px;
	height:18px;
}
.entry-date
{
	color:#2563BA;
	font-size:8pt;
	vertical-align: bottom;
	border-bottom: solid 1px #2543a0;
	padding-bottom:1px;
	padding-right:1px;	
	white-space: nowrap;
}
.entry-news { padding:2px 1px 2px 10px; vertical-align:top; }
.entry-news p { margin:0.5em 0; }

div.advertRight { float:right; text-align: center; width: 200px; margin:2px 0; }

div.moreNews { max-width:640px; color:#eee; border:solid #457; border-width:2px 0; padding:8px 2px; margin:2em 0 3em; }
.moreNews h2 { font-size: 10pt; margin:0; }
.moreNews ul { padding-left:0; }
.moreNews li { margin:0 0 0.7em; list-style:none; width:50%; float:left; min-width: 240px; }
.moreNews p { margin: 1em 0 0; }

/* ---- Front Page News ---- */
.rssBlogTitle { color: #00bcdf; font-size: 11pt; font-weight:bold; }
.rssBlogDescription { font-size:9pt; }
.rssBlogLink { text-align:center; font-size:8pt; }

.rssTitle { font-weight: bold; }
.rssSynopsis { font-size:9pt; padding-top:2px; }
.rssInfo { color:#2563BA; font-size:8pt; padding-top:2px; }

.ncsubhead { color: #ffbb00; font-weight: bold; }

/* ---- News & Event Pages ---- */
.kongbanana
{
    background: #f0f0f0; font-size:9.5pt; color:#000; padding:5px;
}
.kongbanana p
{
     line-height:1.6;
}
.kongbanana img { border: none; }
.kongbanana a:link, .kongbanana a:active, .kongbanana a:visited { color:#35a; }
.kongbanana h3 { color:Black; }

.artistTags a { white-space:nowrap; padding:0 5px; }



/* ---- Top Tracks numbers ---- */
.ttName { padding-left:2px; padding-right:22px; background-repeat: no-repeat; 
          background-attachment: scroll; background-image: url(../pic/numbers-blue.png); }
.ttNo1 { background-position: right 0px; }    .ttNo2 { background-position: right -40px; }
.ttNo3 { background-position: right -80px; }  .ttNo4 { background-position: right -120px; }
.ttNo5 { background-position: right -160px; } .ttNo6 { background-position: right -200px; }
.ttNo7 { background-position: right -240px; } .ttNo8 { background-position: right -280px; }
.ttNo9 { background-position: right -320px; } .ttNo10 { background-position: right -360px; }


/* ---- Playlist history ---- */
.plHTbl th 
{
	text-align: left; padding: 20px 0px 5px;
}
.plHTbl td span
{
	font-size: 9pt; color: #ffccaa;
}


/* ---- Playlist Editor ---- */
.editBtn, .upBtn, .downBtn { width:16px; height:16px; cursor:pointer; margin: 1px; }
.uItemSelected { background-color: #bba000; }

/* ---- Auto-Complete Box ---- */
.uAutoCompBox {position:absolute; display:none; padding:0px; cursor:pointer; color:Black; z-index:99;
                border: 1px solid #8e9aee; background: #f0f7ff; margin:0px; font-size: 9pt;}
.uAutoCompBox li { list-style-type: none; padding: 2px 8px 2px 3px; }
.uAutoCompBox li:hover { background-color:#252ee7; color:White; }
.uAutoCompBox .uNewTrackAC { font-style:italic; color:#007700; }


/* --- Artist Tagging --- */
.delBtn {
    color: #fff; display: inline-block; background-color: #67d;
    padding: 0 4px; margin: 0 0 0 5px; cursor:pointer; max-height:18px;
}
.delBtn:hover { background-color:#9af; text-decoration:none; }
#ulArtistTags { padding-left:15px; margin:1em 0; }


#divSocialHead { position:fixed; top:140px; left:10px; }
#divSocialHead img { width:24px; height:24px; border:none; }
#divSocialHead a { opacity:0.25; display:block; margin:0 0 10px; }
#divSocialHead a:hover { opacity:0.8; }


/* ---- web forms ---- */
.cellnotes
{
	font-size: 8pt;
	color:#ff6969;
}
.emailcelltitle
{
	width:70px;
	text-align:right;
	padding-right:4px;
}

.youtubeFrame { width:630px; height:354px; }
.newskong .youtubeFrame { height:354px; }
.kickstartervideo { width:630px; height:473px; }

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
    /* Retina-specific stuff here */
    .gbox .boxhead h1, .tHead h1 { color:#eaeaea; font-weight:bold; }
}

@media only screen and (max-width: 1000px) {
    #divSocialHead { position:absolute; top:10px; right:15px; left:auto; }
    #divSocialHead img { width:18px; height:18px; }
    #divSocialHead a { margin:0 0 0 8px; display:inline; }
}

@media only screen and (max-width: 768px) {
  .supergorilla { width:100%; left:0; margin-left:0; }
  .bighairyone { width:755px; }
  div.advertRight { display:none; }
  .tblPlaylist, .playlistLeft, .playlistRight { width:100%; }
  .showPlaya { max-width:none; }
  .playlistRight { margin:1em 0 0; }
  .eventColLeft { float:none; }
  .eventColLeft > div { margin-right:15px; }
  .kongbanana, #pEventTags, div.moreNews { width:auto !important; max-width:none; }
  .eventColRight { float:none; width: 50%; margin: 20px 25% 10px; }
  .eventColRight .gbox.gbEvents { width: 100% !important; }

  .footerRight { margin-top:8px; }
  .footerRight img { height:55px; margin:0 10px; }
  ul.nav li { width:70px; }
}

@media only screen and (max-width: 720px) {
    ul.nav { margin: 105px 0px 32px; }
  	ul.nav li { width:62px; }
    .bighairyone { top: 134px; }
}
.allowScroll { overflow-y: scroll !important; }
