#dragandrophandler {

    border: 2px dotted #0B85A1;

    margin: 5px 0;

    -webkit-border-radius: 3px;

    -moz-border-radius: 3px;

    border-radius: 3px;    

    font-size: 12px;

    visibility: hidden;

}

 #dragandrophandler.dragandrophandlerActive {

    border: 2px dotted black;

    background-color: #0B85A1;

    color: white;

    visibility: visible;

}



#dragandrophandler .ddh_progressBar {

    width: 200px;

    height: 22px;

    border: 1px solid #ddd;

    border-radius: 5px; 

    overflow: hidden;

    display:inline-block;

    margin:0px 10px 5px 5px;

    vertical-align:top;

}

 

#dragandrophandler .ddh_progressBar div {

    height: 100%;

    color: #fff;

    text-align: right;

    line-height: 22px; /* same as #progressBar height if we want text middle aligned */

    width: 0;

    background-color: #0ba1b5; border-radius: 3px; 

}

#dragandrophandler .ddh_statusbar

{

    border-top:1px solid #A9CCD1;

    min-height:15px;

    padding:10px 10px 0px 10px;

    vertical-align:top;

}

#dragandrophandler .ddh_statusbar:nth-child(odd){

    background:#EBEFF0;

}

#dragandrophandler .ddh_filename

{

display:inline-block;

vertical-align:top;

width:250px;

} 

#dragandrophandler .ddh_filesize

{

display:inline-block;

vertical-align:top;

color:#30693D;

width:100px;

margin-left:10px;

margin-right:5px;

}

#dragandrophandler .ddh_abort{

    background-color:#A8352F;

    -moz-border-radius:4px;

    -webkit-border-radius:4px;

    border-radius:4px;display:inline-block;

    color:#fff;

    padding:4px 15px;

    cursor:pointer;

    vertical-align:top

    }





#dragandrophandler {position: fixed; bottom: 0;  }