/* Global reset */
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */ 
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin: 0; padding: 0}
table { border-collapse: collapse; border-spacing: 0}
fieldset, img { border: 0}
address, caption, cite, code, dfn, em, strong, th, var {font-style: normal; font-weight: normal}
ol, ul, li { list-style: none}
caption, th { text-align: left}
h1, h2, h3, h5, h5, h6 { font-size: 100%}
q:before, q:after { content: ''}
/* Global reset-RESET */
/* The below restores some sensible defaults */
strong { font-weight: bold}
em { font-style: italic}
ol, ul, li {list-style: none}
* a { position: relative}
/* Gets links displaying over a PNG background */
a { outline: none}
/* Gets rid of Firefox's dotted borders */
a img { border: none}
/* Gets rid of IE's blue borders */
body { color: #000; text-align: center; background-color: #000; margin: 0; padding: 0;}
div.box { margin: 0; padding: 0; border : 1px solid #666; background: #000;}
p.info { position: relative; text-align:left; padding-top:8px; padding-left: 10px; top: -28px; left: 0px; height :20px; border : 1px solid #666; background: #141414; color:#ffffff; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; font-variant:small-caps;}
p.djinfo { position: relative; text-align:left; top: -29px; left: 0px; height :55px; border : 1px solid #666; background: #000 url(profilestrip.png); color:#ffffff; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; font-variant:small-caps;}

#djname p { position: absolute; left: 28px; top: 15px; font-family:Arial, Helvetica, sans-serif; font-weight: bold; font-size: 22px; color:#ffffff;}

#daytime p { position: absolute; left: 260px; top: 20px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 15px; color:#ffffff;}

#profilepic { position: absolute; top:30px; left: 1px; width:472px; height: 284px;}
#profilepic img {position: relative; top: -28px; float:right; } 
#genre {position: relative; top: 100px; left: 25px; width: 180px; height: 150px; text-align:left; color:#ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 12px;}
#genre p {position: relative; padding-bottom:8px;}

p.wordstyle {font-weight: bold;}
a.wordstyle {font-weight: bold;}
#bio {position: relative; top: 150px; left: 25px; width: 448px; height: 200px; text-align:left; color:#ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 12px; overflow: auto;}
#bio p {position: relative; padding-bottom:4px; padding-right:20px;}
#wrapper {height: 400px;}
#wrapper a:link {color:#FFFFFF; text-decoration:none;}    /* unvisited link */
#wrapper a:visited {color:#FFFFFF; text-decoration:none;} /* visited link */
#wrapper a:active {color:#FFFFFF; text-decoration:none;}  /* selected link */
#socialmedia {position: absolute; top: 500px;}
#socialmedia li { margin: 0; padding: 0; list-style: none; position: absolute; top: 0px;}
#socialmedia a { height:60px; display: block;}

#fb { left:282px; width: 43px; height: 60px;}
#fb { background: url('biofacebook.png');}

#twit { left: 317px; width: 42px; height: 60px;}
#twit { background: url('biotwit.png');}

#li { left: 350px; width: 45px; height: 60px;}
#li { background: url('biolinkedIn.png');}

#ms { left: 384px; width: 46px; height: 60px;}
#ms { background: url('biomyspace.png');}

#sc { left: 420px; width: 45px; height: 60px;}
#sc { background: url('biosoundcloud.png');}
#weblink {position: absolute; top: 520px; left: 25px; text-align:left; color:#ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 14px;}

#close {position: absolute; top: 570px; left: 25px; text-align:left; color:#ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 14px;}