
.progress {
    background: none repeat scroll 0 0 #333;
    border-radius: 10px;
    box-shadow: 0 1px 2px #000 inset;
    height: 16px;
    margin-bottom: 20px;
    opacity: 0.75;
    overflow: hidden;
}
.progress .bar {
background: #f1e767; /* Old browsers */
background: -moz-linear-gradient(top,  #f1e767 0%, #feb645 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f1e767), color-stop(100%,#feb645)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f1e767 0%,#feb645 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f1e767 0%,#feb645 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f1e767 0%,#feb645 100%); /* IE10+ */
background: linear-gradient(to bottom,  #f1e767 0%,#feb645 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645',GradientType=0 ); /* IE6-9 */

    border-radius: 10px;
    box-sizing: border-box;
    color: #ffffff;
    float: left;
    font-size: 12px;
    height: 12px;
    margin-left: 2px;
    margin-top: 2px;
    text-align: center;
    transition: width 0.6s ease 0s;
   
	  min-width: 12px;
}
#soundSlider{
max-width:80px;
}
.progress .bar + .bar {
    box-shadow: 1px 0 0 rgba(0, 0, 0, 0.15) inset, 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
}
.progress-striped .bar {
    background-color: #149bdf;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-size: 40px 40px;
}
.progress.active .bar {
    animation: 2s linear 0s normal none infinite progress-bar-stripes;
}
.progress-danger .bar, .progress .bar-danger {
    background-color: #dd514c;
    background-image: linear-gradient(to bottom, #ee5f5b, #c43c35);
    background-repeat: repeat-x;
}
.progress-danger.progress-striped .bar, .progress-striped .bar-danger {
    background-color: #ee5f5b;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-success .bar, .progress .bar-success {
    background-color: #5eb95e;
    background-image: linear-gradient(to bottom, #62c462, #57a957);
    background-repeat: repeat-x;
}
.progress-success.progress-striped .bar, .progress-striped .bar-success {
    background-color: #62c462;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-info .bar, .progress .bar-info {
    background-color: #4bb1cf;
    background-image: linear-gradient(to bottom, #5bc0de, #339bb9);
    background-repeat: repeat-x;
}
.progress-info.progress-striped .bar, .progress-striped .bar-info {
    background-color: #5bc0de;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-warning .bar, .progress .bar-warning {
    background-color: #faa732;
    background-image: linear-gradient(to bottom, #fbb450, #f89406);
    background-repeat: repeat-x;
}
.progress-warning.progress-striped .bar, .progress-striped .bar-warning {
    background-color: #fbb450;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
ul#muziklistesi {
    display: inline-block;
    list-style: none outside none;
    margin-top: 30px;
    position: relative;
    width: 612px;
}
ul#muziklistesi li {
    cursor: move;
    font: 14px arial;
    margin-bottom: 6px;
    padding: 5px 15px;
}
#listem {
    border-radius: 12px;
    box-shadow: 0 1px 6px #999999 inset;
    margin-bottom: 10px;
    margin-left: 0;
    margin-top: 10px;
    padding: 20px;
    width: 620px;
}
#pSlider {
    float: left;
    width: 280px;
}
#sesKontrol {
    margin-left: 20px;
}
#kontrolButonlari > div {
    float: left;
    margin-right: 0;
}
#kontrolButonlari {
    float: left;
    margin-left: 25px;
    margin-right: 0;
    margin-top: 4px;
}
#yukleniyor {
    height: 31px;
    position: absolute;
    width: 31px;
}
#sureler {
    border-radius: 10px;
    color: #777;
    float: left;
    font: 12px/21px rc;
    height: 20px;
    margin-left: 15px;
    margin-top: 5px;
    opacity: 0.8;
    padding: 0 12px;
    text-align: center;
}
.dugme {
    background: none repeat scroll 0 0 #fff;
    border: 6px solid #ffffff;
    border-radius: 20px;
    box-shadow: 0 1px 2px #888888;
    float: right;
    height: 16px;
    margin-top: -7px;
    position: absolute;
    transition: margin 0.6s ease 0s;
    width: 16px;
}
.sdugme {
    background: none repeat scroll 0 0 #ffffff;
    border: 6px solid #ffffff;
    border-radius: 20px;
    box-shadow: 0 1px 2px #888888;
    float: right;
    height: 16px;
    margin-top: -7px;
    position: absolute;
    transition: margin 0.6s ease 0s;
    width: 16px;
}
.calinan {
    background: none repeat scroll 0 0 #222222;
    border-radius: 18px;
    box-shadow: 0 1px 2px #000000 inset;
    color: #ffffff;
    opacity: 0.6;
}
.yer {
    border-radius: 18px;
    box-shadow: 0 1px 2px #000000 inset;
    color: #ffffff;
    height: 20px;
    opacity: 0.6;
}
#player {
    opacity: 0;
}
#mplayer {
    background-image: linear-gradient(to right bottom, #e0e0e0 0%, #e6e6e6 0%, #ebebeb 15%, #ffffff 100%);
    border-radius: 20px 60px;
    box-shadow: 0 2px 2px #ddd;
    display: inline-block;
    margin: 0 auto 5px;
    overflow: hidden;
    padding-bottom: 0;
    padding-top: 10px;
    width: 100%;
}
#oy_but {
    display: inline-block;
    float: left;
    margin-left: 15px;
    margin-top: 9px;
}
.kontrol {
    opacity: 0;
}
.C_durdur {
    background: url("../ekler/cc_durdur.png") no-repeat scroll 0 0 transparent;
    cursor: pointer;
    display: inline-block;
    float: left;
    height: 24px;
    margin-left: 0;
    margin-right: 10px;
    position: relative;
    top: 1px;
    width: 24px;
}
.C_dinle {
    background: url("../ekler/cc_oynat.png") no-repeat scroll 0 0 transparent;
    cursor: pointer;
    display: inline-block;
    float: left;
    height: 24px;
    margin-left: 0;
    margin-right: 10px;
    position: relative;
    top: 1px;
    width: 24px;
}
