.musicpage {
    max-width:80em;
    margin:auto;
}


.center {
    text-align:center;
}


.playpause {
    padding:0 !important;
}

.behindsong {
    background-color:#eaeaea;
    padding-top:.25em;
}

#songSlider {
    display:inline-block;
    margin-top:.2em;
    height:.6em !important;
    background-color:#c1c3c5 !important;
}

#trackProgress {
    height:.8em !important;
    margin-top:-.12em;
    background-color:#3cb4ec !important;
    border-right:solid 5px black;
    border-radius:3px;
}

.downloadit {
    padding:0 !important;
    margin-left:.4em;
}

.scrubber {
    float:right;
}

.artistart img {
    border:solid white 5px;
    border-radius:15em;
    box-shadow:0px 0px 5px #ccc;
}

.artistart img:hover {
    border:solid #454545 .5em;
    border-radius:15em;
    box-shadow:0px 0px 5px #909090;
}


.musicheader {
    border-bottom:solid .15em #c1c3c5;
    margin-bottom:2em;
    padding:0;
}


.playlist {
    border-top:solid .15em #c1c3c5;
    border-bottom:solid .15em #c1c3c5;
    margin-top:3em;
    padding-left:1em;
    padding-right:1em;
    margin-bottom:3em;
    padding-top:1em;
    padding-bottom:2em;
}

.albumTitle {
    margin-left:1.5em;
    font-size:1.3em;
    color:#acacac;
}


.songtitle {
    color:#787878;
}

.currentartist {
    color:#3d3d3d;
}

.tagheaders {
    margin:0;
    margin-top:3em;
}

.taggy {
    background-color:#d3d3d3;
    padding:.2em;
}


.playerbox {
    background-color:#eaeaea;
    border:solid .2em #d4d4d4;
    padding:.7em;
    border-radius:7px;
    min-height:6em;
    width: 400px;
}


.playertitleholder {
    background-color:#ffffff;
    padding:.4em;
    border-radius:5px;
    width: 55%;
    display: inline-block;
}

.playerbuttonholder {
    background-color:#e8e8e8;
    border-radius:5px;
    border: 1px solid #f8f8f8;
    text-align:center;
    width:10%;
    display: inline;
    margin: 5px;
    padding:2px 2px 5px 5px;
    

}


.AboutUsTitle {
    font-size: 24px;
}


a.current-page:link {
    background: none repeat scroll 0 0 #d4d4d4;
    border: 1px dashed #D94917;
    color: #fff;
    padding: 5px 10px;
}
a, a:visited {
    color: #333333;
    outline: 0 none;
    text-decoration: none;
    transition: color 0.1s ease-in-out 0s;
}

a.page:link, a.page:visited {
    border: 1px solid #DDDDDD;
    color: #000000;
    padding: 5px 10px;
}
a, a:visited {
    color: #333333;
    outline: 0 none;
    text-decoration: none;
    transition: color 0.1s ease-in-out 0s;
}

/* ----------  PLAYER 2  --------------   */


.post-title h1 {
    margin-left: 0px;
    padding-top: 20px;
    font-family: "museo",sans-serif;
    color: #4d4d4d !important;

    
    }

.audioplayerarea {
    text-align: center;
    margin-left: -20px;

    
    }



.playerbox2 {
    border:solid 2px #d4d4d4;
    padding:3px;
    border-radius:7px;
    width: 50%;
    min-width: 30%;
    max-height: 35px;
    display: inline-flex;
        display: -webkit-inline-box;

    /*display: -webkit-flex;
    display: -moz-inline-box;*/

    
    
    background: #e2e2e2; /* Old browsers */
/*    background: -moz-linear-gradient(top,  #e2e2e2 0%, #d1d1d1 41%, #e2e2e2 100%);  FF3.6+ 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(41%,#2b2b2b), color-stop(100%,#e2e2e2)); /* Chrome,Safari4+ */
 /*   background: -webkit-linear-gradient(top,  #e2e2e2 0%,#d1d1d1 41%,#e2e2e2 100%); /* Chrome10+,Safari5.1+ */
 /*   background: -o-linear-gradient(top,  #e2e2e2 0%,#d1d1d1 41%,#e2e2e2 100%); /* Opera 11.10+ */
 /*   background: -ms-linear-gradient(top,  #e2e2e2 0%,#d1d1d1 41%,#e2e2e2 100%); /* IE10+ */
 /*   background: linear-gradient(to bottom,  #e2e2e2 0%,#d1d1d1 41%,#e2e2e2 100%); /* W3C */  
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-9 */

}


.listen {
    font-size: 11pt !important;
}

.playbutton2 {
    padding-left: 10px;
}


.sliderarea2 {
    padding-left: 10%;
    padding-top:4px;
}


.slider2 {
    width: 100%;
    display: inline;
}

/*
input[type="range"]{
    width: 350px;
    margin-top: -20px;
}

*/

.currenttime2 {
    font-size:9pt;
    color: #787878;
    vertical-align: 47%;
}


.totaltime2 {
    font-size:9pt;
    color: #787878;
    vertical-align: 47%;
}


.songtime2 {
    font-size:1.5em;
    color:#b0b0b0;
    text-align:right;
}





.songtime {
    font-size:1.5em;
    color:#b0b0b0;
    text-align:right;
}


.playbar {
    border-left:solid #4ba8f7 9em;
    border-right:solid silver 15em;
    color:#494949;
    background-color:#494949;
}


#slide {
    border-color:#494949;
    width:80%;
    display: inline;
        padding-top:12px;

}

.slider {
    width: 80%;
    display: inline;


}
.sliderarea {
    margin-top:-20px;
}

.currenttime {
    font-size:11pt;
    color: #787878;
    display: inline-block;
    padding-top:-12px;

}

.totaltime {
    font-size:11pt;
    color: #787878;
    margin-top:-10px;


}

  .large-1-andahalf {
    width: 6.250005%; }





@media only screen and (max-width: 920px)
 {
    
     input[type="range"]{
    width: 250px;
    margin-top: -20px;
}
     
 }

@media only screen and (min-width: 921px)
 {
    
     input[type="range"]{
    width: 310px;
    margin-top: -20px;
}
     
 }


@media only screen and (max-width: 800px)
 {
   input[type="range"]{
    width: 225px;
    margin-top: -20px;
}
     
 }






@media only screen and (max-width: 755px)
 {
    
     input[type="range"]{
    width: 200px;
    margin-top: -20px;
}
     
 }


@media only screen and (max-width: 700px)
 {
    
     input[type="range"]{
    width: 170px;
    margin-top: -20px;
}
     
 }



@media only screen and (max-width: 640px)
 {
    
    .logoholder {
        text-align:center;
    }
    
    .homelogo {
        font-size:2.5em !important;
        text-align:center !important;
    }
    
 	.playerbuttonholder {
    background-color: #e8e8e8;
    border-radius: 5px;
    padding: 0;
    text-align: center;
}
     
input[type="range"]{
    width: 300px;
    margin-top: -20px;
}

    

.artistart img {
    border:solid white 3px;
    border-radius:.1em;
    box-shadow:0px 0px 5px #ccc;
}

.artistart img:hover {
    border:solid white 3px;
    box-shadow:0px 0px 5px #ccc;
}

.blurredimage {
    padding-bottom:0;
}

.playertitleholder {
    padding-top:1em;
    padding-bottom:1em;
    font-size:1.3em;
}

 }

     




@media only screen and (max-width: 600px)
 {
    
     input[type="range"]{
    width: 300px;
    margin-top: -20px;
}
     
 }



@media only screen and (max-width: 550px)
 {
    
     input[type="range"]{
    width: 245px;
    margin-top: -20px;
}
     
 }

 


@media only screen and (max-width: 500px)
 {
    
     input[type="range"]{
    width: 205px;
    margin-top: -20px;
}
     
 }


@media only screen and (max-width: 470px)
 {
    
     input[type="range"]{
    width: 175px;
    margin-top: -20px;
}
     
 }



@media only screen and (max-width: 410px)
 {
    
     input[type="range"]{
    width: 145px;
    margin-top: -20px;
}
     
 }




@media only screen and (max-width: 370px)
 {
    
     input[type="range"]{
    width: 105px;
    margin-top: -20px;
}
     
 }

*/