* {
	margin: 0;
	padding: 0;
}

#multitracks_canvas{
	font-family: "FontApp", Arial, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	-webkit-font-smoothing: antialiased;
	line-height: 1.4;
	background-color: #FFF;
	width: 100%;
 	height: 100%;
	position: relative;
}


----- CONTENTS ----- */

#multitracks_contentEqlz{
  bottom: 60px;
  left: 0px;
  right: 0px;
  top: 0px;
  position: absolute;
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}


#multitracks_player{
  height: 40px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  position: absolute;
  padding-top: 8px;
  border-top: #e7e7e7 thin solid;
    background: #000;
}


/* GLOBAL */

#content{
	width: 800px;
	height: 800px;
}

#tableMixage_master {
	width: 100%;
	height: 100%;
}

#loader {
	position: absolute;
	top: 0;
	height: 100%;
	width:100%;
	background-color: rgba(255, 255, 255, 0.8);
	z-index:5000;
	color: #4a4a4a;
	text-align: center;
}


#loading_info{
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#loading_info p{
	color : #6c6c6c;
}


#tableMixage_canvas {
	width: 100%;
	height: 100%;
}

#tableMixage_equalizer{
	background:#fff;
	border-top: #e7e7e7 thin solid;
	border-bottom: #e7e7e7 thin solid;
}

#tableMixage_player {
	height: 40px;
	width: 100%;
	background-color:#fff;
}

/* ----------   PLAYER -------------- */
#player_container{
	width: 100%;
	height: 100%;
}
#btn_play {
	width: 40px;
	height: 40px;
	cursor:pointer;
}

.btn_play_on {
	background-image: url(img/player_play_on.png);
}

.btn_pause_on {
	background-image: url(img/player_pause_on.png);
}

#btn_loop {
	width: 40px;
	height: 40px;
	cursor:pointer;
}

.btn_loop_off {
	background-image: url(img/player_loop_off.png);
}

.btn_loop_on {
	background-image: url(img/player_loop_on.png);
}

#player_slider {
  vertical-align: top;
  height: 40px;
  padding-left: 15px;
  padding-right: 15px;
}

#timer{
	width: 70px;
  	text-align: right;
 	padding-right: 10px;
  	padding-top: 5px;
	font-size: 12px;
	color: #fff;
}



.piste{
  width: 135px;
  height: 100%;
  display: inline-block;
  position: relative;
  background-color:rgb(33, 33, 33);
}

.btn_container{
  position: absolute;
  top: 0;
  left: 20px;
  right: 0;
  width: 90px;
}


.volume_container {
  width: 110px;
  position: absolute;
  top: 75px;
  left: 10px;
  right: 0px;
  bottom: 45px;
}

.volume_container ul{
  position: absolute;
  height: 100%;
  width: 60%;
  left: 20%;
}

.volume_slider {
   width: 100%; 
}

#name {
	position: relative;
	bottom: 10px;
}


.border_line {
  width: 1px;
  background: #fff;
    opacity: 0.1;
  position: absolute;
  top: 8px;
  right: 0px;
  bottom: 3px;
}

/*  ----- Audio mixer -------------- */

  .audiomixer-equalizer {
        position: absolute;
        bottom: 47px;
        width: 100%;
        height: 45%;
        min-height: 320px;
        background-color: rgba(33, 33, 33, 0.8);
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
    }
    
    .audioMixerPlayer {
        background-color: rgba(33, 33, 33, 0.8);
        height: 47px;
        border-top: rgba(255, 255, 255, 0.3) 1px solid;
        position: absolute;
        bottom: 0px;
        width: 100%;
    }
    
    .volume_slider {
        width: 100%;
        height: 100%;
        padding-left: 8px;
    }
    
    .btn-MS {
        
        display: flex;
        justify-content: center;
        align-items: center;
        height: 35px;
        width: 35px;
        line-height: 40px;
        cursor: pointer;
        font-size: 55px;
        font-weight: 200;
        float: right;
        padding: 0 5px;
        cursor: pointer;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        border-radius: 20px;
        border: thin rgba(255, 255, 255, 0.3) solid;
        background: transparent;
        margin-top: 20px;
    }
    
    .btn-MS.active {
        opacity: 1;
        background-color: #718390;
    }
    
    .btn-MS span {
        color		: white;
        font-size	: 18px;
        font-weight	: 600;
    }
    
    .audioMixerPlayer .amp-bar {
        display: table;
        bottom: 0;
        height: 100%;
        width: 100%;
        padding: 0 .5em;
        box-sizing: inherit;
    }
    
    .audioMixerPlayer .amp-btn {
        display: inline-block;
        height: 100%;
        position: relative;
        line-height: 47px;
        vertical-align: middle;
        cursor: pointer;
        padding: 0 .5em;
    }
    
    .audioMixerPlayer .amp-btn.amp-btn-play {
        width: 2.1em;
        text-align: center;
    }
    
    .audioMixerPlayer .amp-text {
        font-family: Arial, Helvetica, sans-serif;
        font-size: .8em;
        font-style: normal;
        font-weight: 400;
        color: #fff;
        text-align: center;
        font-variant: normal;
        font-stretch: normal;
        display: inline-block;
        height: 100%;
        position: relative;
        line-height: 47px;
        vertical-align: middle;
        cursor: pointer;
        padding: 0 .5em;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
    }
    
    .audioMixerPlayer .amp-left {
        white-space: nowrap;
        display: table-cell;
        box-sizing: inherit;
    }
    
    .audioMixerPlayer .amp-center {
        width: 100%;
        display: table-cell;
        box-sizing: inherit;
        vertical-align: top;
        padding: 0px 8px;
    }
    
    .audioMixerPlayer .amp-right {
        white-space: nowrap;
        display: table-cell;
        box-sizing: inherit;
    }
    
    /* BTNS */
.instru_name {
  position: absolute;
  text-align: center;
  font-size: 14px;
  /* color: silver; */
  bottom: 0;
  left	: 0;
  right	: 0;
  padding-bottom: 10px;
}

.instru_name .btn-note{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background:   none;    
    border-style: solid;
    border-width: thin;
    border-color: rgba(255,255,255,.4);
    padding: 3px 5px;
    /* width:20%; */
    min-width: 40px;
    margin-left:-8px;
    /* height: 45px; */
}

.instru_name .btn-note.active, .btn-note:hover {
    /*opacity:1;*/
    background-color : rgba(255,255,255,1);
}