/* positioning and proportioning for controls */
/* until I have LESS time, this will have to do */


/* courtesy http://css-tricks.com/snippets/css/css-triangle/ */
.arrow-right {
    width: 0; 
    height: 0; 
    margin-left: 37%;
    margin-top: 7%;
}

.pauseDash{
    height: 60%;
    margin-left: 37%;
    margin-top: 9%;
    width: 20%;
}

.cornerStyle0{
    width:25%;
    height:20%;
    margin-top: 15%;
    position: relative;
    margin-left:15%;
    float:left;
    display: inline;  
}

.cornerStyle1{
    width:25%;
    height:20%;
    margin-top: 15%;
    margin-left:20%;
    position: relative;
    float:left;
    display: inline;
}

.cornerStyle2{
    width:25%;
    height:20%;
    position: relative;
    float:left;
    margin-left:15%;
    display: inline;
    margin-top: 5%;
}

.cornerStyle3{
    width:25%;
    height:20%;
    margin-left: 20%;
    position: relative;
    float:left;
    display: inline;
    margin-top: 5%;
}


#play_pause_button{
    width: 8%;
    height:100%;
    position:relative;
    float:left;
    display:inline;
    cursor: pointer;
}
.play_btn{
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.pause_btn{
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;

}
#time_count{
    display: inline;
    float: left;
    font-size: 15px;
    height: 100%;
    /*margin-left:1%;*/
    position: relative;
    width: 11%;
}
#time_text{
    width:100%;
    height: 100%;
    margin-top: 5%;
    font-size: 1em;
    font-weight:100;
}
#share_text{
    width:100%;
    height: 100%;
    margin-top: 5%;
    font-size: 1em;
}
#fullscreen_button{
    width:6%;
    height:100%;
    position:relative;
    float:left;
    display:inline;
    margin-left: 1%;
    cursor: pointer;
}

#embed_button{
    width:8%;
    height:100%;
    position:relative;
    float:left;
    display:inline;
    margin-left: 1%;
    cursor: pointer;
}

#scrubber {
        position: relative;
        width: 81% !important;
        height: 100%;
        float: left;
        display: inline;
        /*margin-left: 1%;*/
        padding-left:1%;
        padding-right:1%;
    }
    #progress_bkgrnd{
        width: 100%;
        height: 65%;
        display: inline;
        float:left;
        cursor: pointer;
        margin-top: 5px;

    }
    #progress {
        width: 0;
        height: 100%;
        display: inline;
        float:left;
    }
#custom_controls{
    margin: 0 auto;
    /*position: relative;*/
    width: 100%;
    z-index: 1002;  

    position: absolute;
    bottom: -30px !important;
    top: inherit !important;
}