/**
 * @package Archaic_Horizon
 * @copyright Copyright (c) 2009, Dan Bettles 
 * @author Dan Bettles <danbettles@yahoo.co.uk>
 */

/*$HIDDEN="position: absolute; left: -9999px; font-size: 0;";*/

body {
    font-family: helvetica, arial, sans-serif;
    font-size: .7em;
    color: #5b5b5b;
    background: #f2f2f2 url(/image/gradient.png) 0 0 repeat-x;
    margin: 0;
    padding: 0;
}

h1, h2, h3 {
    font-size: 1.7em;
    margin: 0;
    padding: 0;
}

* html h1,
* html h2,
* html h3 {
    font-size: 1.6em;
}

h1, h2, h3,
.release a.play,
p.pagecontrols a,
p.audioformats a.audioformat {
    letter-spacing: -1px;
    text-transform: lowercase;
}

a,
a:link,
a:visited,
a:hover {
    color: #5b5b5b;
    text-decoration: underline;
}

a:hover {
    text-decoration: none;
}

a img {
    border: 0;
}

h1 a,
h1 a:link,
h1 a:visited,
h1 a:hover,
h2 a,
h2 a:link,
h2 a:visited,
h2 a:hover,
h3 a,
h3 a:link,
h3 a:visited,
h3 a:hover {
    color: #fff;
    text-decoration: none;
}

/*--------------------------------------------------------------------------------------------------------------------*/

form div.item {
    margin-bottom: 1em;
}

form div.item-last {
    text-align: right;
}

label {
    font-weight: bold;
    text-transform: lowercase;
}

form div.item label {
    display: block;
    margin-bottom: .5em;
}

input, textarea {
    font-family: helvetica, arial, sans-serif;
    font-size: 1em;
    vertical-align: top;
    color: #5b5b5b;
}

input.text, textarea {
    background-color: #f2f2f2;
    padding: 3px;
    border: 0;
}

input.text.focussed, textarea.focussed {
    background-color: #fff;
}

/*--------------------------------------------------------------------------------------------------------------------*/

table th,
table td {
    text-align: left;
    vertical-align: top;
}

/*--------------------------------------------------------------------------------------------------------------------*/

.screenreadertext {
    position: absolute; left: -9999px; font-size: 0;
}

/*--------------------------------------------------------------------------------------------------------------------*/

ul.tracklist {
    list-style: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}

ul.tracklist li {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: .5em;
    padding-left: 1em;
    padding-right: 0;
}

/*--------------------------------------------------------------------------------------------------------------------*/

/*N.B. Add nothing more to this*/
div#shrinkwrap-outer {
    width: 763px;
    text-align: center;
    margin: 0 auto;
}

div#shrinkwrap-inner {
    text-align: left;
}

/*--------------------------------------------------------------------------------------------------------------------*/

div#header,
div#footer {
    text-transform: lowercase;
}

div#header a,
div#footer #subscriptions a,
div#footer #relatedsites a {
    text-decoration: none;
}

/*~~~ HEADER ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

div#header {
    width: 751px;  /*763 - 12*/
    height: 25px;
    background: #dfdfdf url(/image/gradient.png) 0 0 repeat-x;
    margin-bottom: 12px;
    padding-left: 12px;
}

/*--- Logo -----------------------------------------------------------------------------------------------------------*/

div#header h1 {
    float: left;
    width: 157px;
    line-height: 0;  /*Safari*/
    padding-top: 4px;
}

/*--- Main Menu ------------------------------------------------------------------------------------------------------*/

ul#mainmenu {
    float: left;
    /*width: 423px;  *//*474 - 18*/
width: 582px;  /*@todo Until the audio player and/or search are implemented*/
    line-height: 25px;
    list-style: none;
    text-align: right;
    margin: 0;
    /*padding: 0 18px 0 0;*/
padding: 0 12px 0 0;  /*@todo Until the audio player and/or search are implemented*/
}

ul#mainmenu li {
    display: inline;
    font-weight: bold;
    padding: 0 6px 0 0;
}

ul#mainmenu li.item-last {
    padding-right: 0;
}

/*~~~ MAIN CONTENT ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

div#body {
    float: left;
    width: 100%;
    padding-bottom: 12px;
}

/*--------------------------------------------------------------------------------------------------------------------*/

.release h2,
.release h3 {
    color: #fff;
}

.release h2 span,
.release h3 span {
    display: block;
    margin: 0 0 12px 0;
}

.release h2 span.title,
.release h3 span.title {
    font-size: .75em;
    color: #5b5b5b;
}

.release a.play,
p.pagecontrols a {
    font-size: 1.2em;
    font-weight: bold;
    text-decoration: none;
}

.release a.play {
    color: #fff;
}

.release p.metadata,
.newsstory p.metadata {
    margin: 0 0 12px 0;
    padding: 12px 0 0 0;
    border-top: 1px solid #fff;
}

/*~~~ UPDATE ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

div#update,
body#newsletter div#feature {
    float: left;
    width: 100%;
    background: url(/image/update-middle.png) 0 0 repeat-y;
    margin-bottom: 12px;
}

body#newsletter div#feature {
    margin-bottom: 0;
}

div#update h2,
body#newsletter div#feature h2,
body#newsletter div#feature h3 {
    color: #fff;
    margin-bottom: 12px;
    padding: 6px 12px 0 12px;
}

body#newsletter div#feature h2,
body#newsletter div#feature h3 {
    padding-left: 0;
    padding-right: 0;
}

div#latestrelease,
div#news,
body#newsletter div#feature div.introduction {
    float: left;
    background: url(/image/corner-topright.png) right 0 no-repeat;
}

div#latestrelease {
    width: 453px;
    margin-right: 12px;
}

body#newsletter div#feature div.introduction {
    width: 429px;
    margin-right: 12px;
    padding: 0 12px 12px 12px;
}

div#latestrelease h2 {
    float: left;
    width: 209px;
}

div#latestrelease h2 a {
    display: block;
    height: 236px;  /*15 + 12 + 209*/
    background: 0 27px no-repeat;
}

div#latestrelease .release {
    margin-left: 233px;  /*@todo May need _padding_ for IE*/
}

div#latestrelease .release h3 {
    padding: 6px 12px 0 0;
}

div#latestrelease .release h3 span.code,
div#news h2 {
    height: 15px;
}

div#latestrelease .release div.content {
    padding-right: 12px;
}

div#news {
    width: 298px;
}

div#news div.newsstory {
    padding: 0 12px;
}

div#news div.newsstory h3 {
    font-size: 1.275em;  /*75% of 1.7*/
}
* html div#news div.newsstory h3 {
    font-size: 1.2em;
}

body#newsletter div#feature {
    min-height: 300px;
}
* html body#newsletter div#feature {
    height: 300px;
}

body#newsletter div#feature div.subscribe,
body#newsletter div#feature div.unsubscribe {
    float: right;
    clear: right;
    width: 274px;
    background: url(/image/corner-topright.png) right 0 no-repeat;
    padding: 0 12px 12px 12px;
}

body#newsletter div#feature div.subscribe {
    border-bottom: 12px solid #f2f2f2;
}

body#newsletter div#feature form div.item-last {
    margin-bottom: 0;
}

body#newsletter div#feature div.subscribe input.text,
body#newsletter div#feature div.unsubscribe input.text {
    width: 268px;
}

/*~~~ PREVIOUS RELEASES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

div#previousreleases {
    float: left;
    width: 100%;
    background: #dfdfdf url(/image/previousreleases-top.png) 0 0 repeat-x;
}

/*Hidden*/
div#previousreleases h2 {
    position: absolute; left: -9999px; font-size: 0;
}

div#previousreleases ul {
    float: left;
    width: 100%;
    list-style: none;
    background: url(/image/previousreleases-bottom.png) 0 bottom repeat-x;
    margin: 0;
    padding: 0 0 15px 0;  /*Allow for the background image*/
}

div#previousreleases ul li.release {
    float: left;
    width: 143px;
    min-height: 455px;
    margin: 0;
    padding: 0;
    border-right: 12px solid #f2f2f2;
}
* html div#previousreleases ul li.release {
    height: 455px;
}

div#previousreleases ul li.release div.content p.metadata {
    margin-bottom: 0;
}

div#previousreleases ul li.col-1 {
    clear: left;
}

div#previousreleases ul li.col-last {
    border-right: 0;
}

div#previousreleases ul li.release h3 {
    padding: 6px 12px 0 12px;
}

div#previousreleases ul li.release h3 span.title {
    background: 0 0 no-repeat;
    padding: 131px 0 0 0;
}

div#previousreleases ul li.release div.content {
    padding: 0 12px;
}

div#previousreleases ul li div.content {
    padding-bottom: 0;  /*Spacing will be taken care of by the row of rounded corners*/
}

/*~~~ PAGE CONTROLS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

p.pagecontrols {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
}

body.hijaxed p.pagecontrols {
    height: 0;
    padding: 0;
}

p.pagecontrols a {
    color: #5b5b5b;
}

/*Safari won't completely hide text, so we make it as small as it will go (1px) and then hide it against the background*/
body.hijaxed p.pagecontrols a {
    position: absolute;
    display: block;
    float: none;
    height: 0;  /*Safari: for the text*/
    font-size: 0;
    color: #f2f2f2;  /*Safari: camouflage the 'hidden' text*/
}

/*--------------------------------------------------------------------------------------------------------------------*/

div#previousreleases p.pagecontrols,
body#releases-show p.pagecontrols {
    background: #f2f2f2;
    padding-top: 3px;
}

body.hijaxed div#previousreleases p.pagecontrols,
body#releases-show.hijaxed div#feature p.pagecontrols {
    padding: 0;
}






/*@todo Sort-out this lot:*/

div#previousreleases p.pagecontrols a.previous {
    float: right;
}

div#previousreleases p.pagecontrols a.next {
    float: left;
}

body#index.hijaxed div#previousreleases p.pagecontrols a {
    width: 22px;
    background: url(/image/pagecontrols.png) 0 0 no-repeat;
    padding-top: 128px;  /*For the background image*/
}

body#index.hijaxed div#previousreleases p.pagecontrols a.next {
    background-position: 0 0;
}

body#index.hijaxed div#previousreleases p.pagecontrols a.next:hover {
    background-position: -22px 0;
}

body#index.hijaxed div#previousreleases p.pagecontrols a.previous {
    background-position: -44px 0;
}

body#index.hijaxed div#previousreleases p.pagecontrols a.previous:hover {
    background-position: -66px 0;
}






body#releases-show.hijaxed div#feature p.pagecontrols a,
body#contact.hijaxed div#feature p.pagecontrols a {
    width: 28px;
    background: url(/image/return.png) 0 0 no-repeat;
    padding-top: 17px;  /*For the background image*/
}

body#releases-show.hijaxed div#feature p.pagecontrols a.return,
body#contact.hijaxed div#feature p.pagecontrols a.return {
    background-position: 0 0;
}

body#releases-show.hijaxed div#feature p.pagecontrols a.return:hover,
body#contact.hijaxed div#feature p.pagecontrols a.return:hover {
    background-position: -28px 0;
}

/*~~~ SINGLE RELEASE ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body#releases-show div#feature {
    float: left;
    width: 100%;
    background: url(/image/releasesshow-bottom.png) 0 bottom repeat-y;
}

body#releases-show div#feature div.release div.bob {
    float: left;
    width: 100%;
    min-height: 399px;
    background: #dfdfdf url(/image/corner-topright.png) right 0 no-repeat;
    border-bottom: 12px solid #f2f2f2;
}
* html body#releases-show div#feature div.release div.bob {
    height: 399px;
}

/*Hidden*/
body#releases-show div#feature div.release div.bob h3 {
    position: absolute; left: -9999px; font-size: 0;
}

body#releases-show div#feature div.release div.bob div.coverbrowser {
    float: left;
    width: 357px;
    min-height: 357px;
    margin: 0;
    padding: 12px;
}
* html body#releases-show div#feature div.release div.bob div.coverbrowser {
    height: 357px;
}

body#releases-show div#feature div.release div.bob div.margaret {
    float: right;
    width: 370px;
    padding-right: 12px;
}

body#releases-show div#feature div.release div.bob div.margaret h2 {
    padding-top: 6px;
}

body#releases-show div#feature div.release div.bob div.margaret p.audioformats {
    font-size: 1.7em;
    margin: 12px 0;
}

body#releases-show div#feature div.release div.bob div.margaret p.audioformats a.audioformat {
    font-size: .75em;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}

body#releases-show div#feature div.release div.bob div.margaret p.audioformats a.active {
    color: #5B5B5B;
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-bottom: 12px;
}

/*Hidden*/
body#releases-show div#feature div.release div.bob div.margaret table.tracks caption {
    position: absolute; left: -9999px; font-size: 0;
}
/*IE6 and IE7 fail to offset the caption so it needs to be 'hidden'*/
* html body#releases-show div#feature div.release div.bob div.margaret table.tracks caption {
    color: #dfdfdf;
}
*+html body#releases-show div#feature div.release div.bob div.margaret table.tracks caption {
    color: #dfdfdf;
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks td {
    line-height: 15px;  /*The same as the height of the play and download icons*/
    padding: 0 9px 6px 0;
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks tr.item-last td,
body#releases-show div#feature div.release div.bob div.margaret table.tracks tr.newreleasepart td {
    padding-top: 12px;
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks td.item-1 {
    width: 15px;  /*The same as the play and download icons*/
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks td.item-2,
body#releases-show div#feature div.release div.bob div.margaret table.tracks td.item-3 {
    width: 0;
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks td.item-last {
    width: 100%;
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks a.play,
body#releases-show div#feature div.release div.bob div.margaret table.tracks a.download {
    display: block;
    width: 15px;
    height: 0;
    line-height: 0;  /*IE6*/
    font-size: 0;
    color: #dfdfdf;
    background: url(/image/icons-medium.png) 0 0 no-repeat;
    padding-top: 15px;
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks a.play {
    background-position: 0 -30px;
}

body#releases-show div#feature div.release div.bob div.margaret table.tracks a.download {
    background-position: 0 -45px;
}

body#releases-show div#feature div.release div.relatedcontent {
    float: left;
    width: 274px;
    margin-right: 12px;
}

body#releases-show div#feature div.release div.fulldescription {
    float: right;
    width: 429px;
}
* html body#releases-show div#feature div.release div.fulldescription {
    padding-bottom: 12px;
}

body#releases-show div#feature div.release div.relatedcontent,
body#releases-show div#feature div.release div.fulldescription {
    background: url(/image/corner-topright.png) right 0 no-repeat;
    padding: 6px 12px 0 12px;
}

body#releases-show div#feature div.release div.relatedcontent h3,
body#releases-show div#feature div.release div.fulldescription h3 {
    margin-bottom: 12px;
}

/*~~~ ABOUT ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body#about div#feature {
    min-height: 300px;
    background: url(/image/about-bottom.png) 0 0 repeat-y;
}
* html body#about div#feature {
    height: 300px;
}

/*Hidden*/
body#about div#feature h2 {
    position: absolute; left: -9999px; font-size: 0;
}

body#about div#feature div.item {
    float: left;
}

body#about div#feature div.item-1,
body#about div#feature div.item-2 {
    width: 298px;
    border-right: 12px solid #f2f2f2;
}

body#about div#feature div.item-last {
    width: 143px;
}

body#about div#feature div.item h3 {
    color: #fff;
    background: url(/image/corner-topright.png) right 0 no-repeat;
    margin: 0 0 12px 0;
    padding: 6px 12px 0 12px;
}

body#about div#feature div.item p,
body#about div#feature div.item form {
    margin: 0 0 12px 0;
    padding: 0 12px;
}

/*~~~ CONTACT ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body#contact div#feature,
body#error-404 div#feature {
    float: left;
    width: 739px;
    min-height: 300px;
    background: #dfdfdf url(/image/corner-topright.png) right 0 no-repeat;
    padding: 0 12px;
}
* html body#contact div#feature,
* html body#error-404 div#feature {
    height: 300px;
}

body#contact div#feature h2,
body#error-404 div#feature h2 {
    color: #fff;
    margin-bottom: 12px;
    padding-top: 6px;
}

body#contact div#feature form div.item {
    float: left;
    width: 100%;
    margin-bottom: 1em;
}

body#contact div#feature form div.item-3 {
    width: 268px;
}

body#contact div#feature form div.item-4 {
    width: 471px;
}

body#contact div#feature form div.item-1 input,
body#contact div#feature form div.item-3 input,
body#contact div#feature form div.item-4 input {
    width: 250px;
}

/*Hidden*/
body#contact div#feature form div.item-5 label {
    position: absolute; left: -9999px; font-size: 0;
}

body#contact div#feature form div.item-5 textarea {
    width: 733px;
}

/*~~~ FOOTER ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

div#footer {
    float: left;
    height: 100px;
    background: #dfdfdf url(/image/footer-logo.png) right 0 no-repeat;
    margin-bottom: 12px;
}

/*Hidden*/
div#footer h2 {
    position: absolute; left: -9999px; font-size: 0;
}

ul#subscriptions,
ul#relatedsites,
p#smallprint {
    width: 602px;  /*763 - (12 - 12 - 137)*/
    margin: 0 137px 12px 0;
    padding: 0 12px;
}

ul#subscriptions,
ul#relatedsites {
    height: 12px;
    list-style: none;
    font-weight: bold;  /*@todo May need to move this down*/
    margin-bottom: 9px;
}

ul#subscriptions li,
ul#relatedsites li {
    display: inline;
    padding: 0 6px 0 0;
}

/*--- Subscriptions --------------------------------------------------------------------------------------------------*/

ul#subscriptions {
    background: url(/image/gradient.png) 0 0 repeat-x;
    padding-top: 12px;
}

ul#subscriptions li a {
    background: url(/image/icons-small.png) 0 0 no-repeat;
}

ul#subscriptions li.item-1 a {
    background-position: 0 0;
    padding-left: 15px;
}

ul#subscriptions li.item-2 a {
    background-position: 0 -15px;
    padding-left: 12px;
}

ul#subscriptions li.item-last a {
    background-position: 0 -30px;
    padding-left: 18px;
}

/*--- Small Print ----------------------------------------------------------------------------------------------------*/

p#smallprint {
    height: 12px;
    line-height: 12px;
    background: url(/image/corner-bottomleft.png) bottom left no-repeat;
    margin-bottom: 0;
    padding-top: 22px;  /*= (100 - 54) - 12 - 12*/
    padding-bottom: 12px;
}

/*--- Cover Browser --------------------------------------------------------------------------------------------------*/

div.coverbrowser p.cover-current {
    margin: 0 0 6px;
    padding: 0;
}

body#releases-show div.coverbrowser p.cover-current {
    height: 357px;
}

div.coverbrowser p.cover-current a {
    font-size: 0;  /*Removes unwanted space within the link*/
}

div.coverbrowser ul.pagination {
    list-style: none;
    text-align: center;
    font-size: 0;  /*Removes unwanted space within the list and items*/
    margin: 0;
    padding: 0;
}

div.coverbrowser ul.pagination li {
    display: inline;  /*This might have been inline-block, but "inline" seems to do the trick in all browsers*/
    margin: 0;
    padding: 1px 0;  /*Allow a couple of pixels for the dotted line Firefox draws around links*/
}

/*See http://www.kryogenix.org/code/browser/lir/*/
div.coverbrowser ul.pagination li a {
    display: inline-block;
    width: 13px;
    height: 0px !important;
    height /**/: 13px;
    overflow: hidden;
    background: url(/image/icons-pagination.png) 0 -52px no-repeat;
    margin: 0 3px 0;
    padding: 13px 0 0;
}

div.coverbrowser ul.pagination li a.pagination-current {
    background-position: 0 -65px;
}

body#coverbrowser-index {
    background: #dfdfdf;
}

body#coverbrowser-index div.coverbrowser p.cover-current {
    height: 600px;
}

/*--- Fancybox -------------------------------------------------------------------------------------------------------*/

/*We start at div#fancybox-wrap to increase specificity*/
div#fancybox-wrap div#fancybox-outer {
    background: #dfdfdf url(/image/gradient.png) 0 0 repeat-x;
}

div#fancybox-wrap a#fancybox-close {
    background: url(/image/fancy_close.png) center center no-repeat;
}

/*--- end Fancybox ---------------------------------------------------------------------------------------------------*/

.fblike {
    height: 20px;
}
