/* General definitions that carry through all of preachit unless overridden */

/* background colour for alternation on lists */

.melodd {
	background-color: transparent;
}
.meleven {
	background-color: transparent;
}

/* message list items */

#melmedialist .listblock, #albumlist .listblock,
#artistlist .listblock {
    margin: 0 10px;
    padding: 15px 5px 15px 5px;
}

#melmedialist .meldescription, #songdetails .meldescription, #melmedialist .melcomment-count, #melmedialist .medialinks, #melmedialist .melodyrating,
.melpage .song-desc, .melpage .melcomment-count, .melpage .medialinks, .melpage .melodytagscontainer {
    margin: 8px 9px;
}

.melplay {
    margin: 8px 9px;
}

#melmedialist .mellistimage,
#albumlist .mellistimage,
#artistlist .mellistimage {
    float: left;
    margin: 10px 10px 10px 0;
}

.mel-box {
    background-color: #F5F5F5;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    padding: 5px 10px;
    margin: 0 10px 20px 10px;
}

#songdetails .mellistimage {
    float: left;
    margin: 5px 10px 5px 0;
}


#albumview .head .mellistimage,
#artistview .head .mellistimage {
    float: left;
    margin: 0 15px 15px 0;
}

.melodytags span {
    color: #000000;
    font-style: normal;
    padding: 0 8px 0 5px;
}

#melmedialist dd, .melpage dd {
    margin-left: 9px;
}

#songdetails .song-info dd {
    margin-bottom: 10px;
}

/* list buttons */

#meltaglist .listblock {
    padding: 15px 0;
}

.medialinks .btn-group:first-child {
    margin: 0 5px 10px 0;
}
.medialinks .btn-group + .btn-group  {
    margin: 0 5px 10px 0;
}

.melnostyle a.mellink {
    padding-left: 10px;
}
.melnostyle {
    list-style: none !important;
    padding-left: 0 !important;
}

.melbtn {
    margin: 10px 10px 10px 0;
}

#melheader-list .melbtn {
    margin: 10px;
}

#melalphalist {
    margin: 10px 0;
}

#jform_comment_text {
    width: 400px !important;
}

/* mediaplayer */

.localvideoplayer div object, .localvideoplayer p object, #pivideocontainer .localhtmlplayer embed, #pivideocontainer .localhtmlplayer video, .vimeoplayer iframe, .vimeoplayer object, .vimeoplayer embed, .youtubeplayer iframe, .youtubeplayer object, .youtubeplayer embed, .blipplayer iframe, .blipplayer object, .blipplayer embed {
    height: 100% !important;
    left: 0 !important;
    position: absolute !important;
    top: 0 !important;
    width: 100% !important;
}
.localaudioplayer div object, .localaudioplayer p object{
    height: 100% !important;
    left: 0 !important;
    position: absolute !important;
    top: 0 !important;
    width: 100%!important;
}
.localvideoplayer div, .localvideoplayer p, .localaudioplayer div, .localaudioplayer p, #pivideocontainer .localhtmlplayer, .vimeoplayer, .youtubeplayer, .blipplayer {
    height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
}

.localvideoplayer div, .localvideoplayer p, #pivideocontainer .localhtmlplayer, .vimeoplayer, .youtubeplayer, .blipplayer {
    padding-bottom: 56.25% !important;
}

.localaudioplayer div, .localaudioplayer p {
    padding-bottom: 29px !important;
}

.localaudioplayer, .localvideoplayer, .vimeoplayer, .youtubeplayer, .blipplayer {
    margin-bottom: 15px;
}

/* backlink classes */

.backlink {
    text-align: center;
    margin: 20px 0;
}

/* add these classes to the ul to effect the change to the correct number of stars */
.rating{
    width:96px;
    height:16px;
    margin:0 0 6px !important;
    padding:0;
    list-style:none;
    position:relative;
    background: url(../images/star_groups.png) no-repeat 0 0;
}

ul.rating {
    padding: 0 !important;
    margin-top: 0 !important;
}
.nostar {background-position:0 -3px;}
.onestar {background-position:0 -48px;}
.twostar {background-position:0 -91px;}
.threestar {background-position:0 -135px;}
.fourstar {background-position:0 -180px;}
.fivestar {background-position:0 -224px;}
ul.rating li {
    cursor: pointer;
 /*ie5 mac doesn't like it if the list is floated\*/
    float:left;
    /* end hide*/
    text-indent:-999em;
    list-style: none;
}
ul.rating li a {
    position:absolute;
    left:0;
    top:0;
    width:20px;
    height:20px;
    text-decoration:none;
    z-index: 200;
}
ul.rating li.one a {left: 0;}
ul.rating li.two a {left: 19px;}
ul.rating li.three a {left: 38px;}
ul.rating li.four a {left: 57px;}
ul.rating li.five a {left: 76px;}

ul.rating li a:hover {
    z-index:2;
    width:96px;
    height:16px;
    overflow:hidden;
    left:0;    
    background: url(../images/star_groups.png) no-repeat 0 0 transparent !important;
}
ul.rating li.one a:hover {background-position:0 -48px !important;}
ul.rating li.two a:hover {background-position:0 -91px !important;}
ul.rating li.three a:hover {background-position:0 -135px !important;}
ul.rating li.four a:hover {background-position:0 -180px !important;}
ul.rating li.five a:hover {background-position:0 -224px !important;}

.pagination {text-align:center;}

/* responsive for mel column */

@media only screen and (min-width: 481px) {

#songdetails  .melcolumn {
    width: 50%;
}

}

@media only screen and (max-width: 480px) {
    #songdetails  .melcolumn {
    width: 100%;
}
}
