/* AUDIO PLAYER STYLE */

.audio_id {  } /* margin: 10px 0; background-color: #f3f3f3; padding: 5px; border-radius: 3px */
.audio_id .play { cursor: pointer; border-bottom: 1px dotted #ccc; opacity: 0.8; }
.audio_id_on {  }
.audio_id_on .play { color: #f60 !important; opacity: 1; }
.audio_id audio { display: none; overflow: hidden; height: 0; opacity: 0.5; }
.audio_id:hover .play { border-bottom: 1px dotted #666; opacity: 1; }

#audio_place { min-height: 72px; margin: 20px 0; } /* background-color: #fff; */

.audio_control { background-color: #fcfad5; border: 1px solid #e3e0b7; padding: 5px 10px; border-radius: 4px; } /* box-shadow: 1px 1px 0 #ccc; */
.audio_control .foto { padding:0 10px 0 0 }
.audio_control .foto img { width: 50px; height: 50px; border-radius: 3px; }
.audio_control .speed > span { background-color: #dedcb7; padding: 2px 5px; border-radius: 3px; line-height: 100%; margin: 0 5px 0 10px; color: #35352f; font-weight: 500; cursor: pointer; opacity: 0.9; }
.audio_control .speed:hover > span { opacity: 1; color: #000; }
.audio_control .control_but { white-space: nowrap; }
.audio_control .control_but span { opacity: 0.5; cursor: pointer; display: inline-block; }
.audio_control .control_but span:hover { opacity: 1; }
.audio_control .control_but span.prev { background: url(/img/audio_prev.svg) no-repeat center center; width: 28px; height: 28px; padding: 5px 5px; margin: 0; }
.audio_control .control_but span.play { background: url(/img/audio_play.svg) no-repeat center center; width: 28px; height: 28px; padding: 5px 5px; margin: 0 5px; }
.audio_control .control_but span.next { background: url(/img/audio_next.svg) no-repeat center center; width: 28px; height: 28px; padding: 5px 5px; margin: 0; }
.audio_control .control_volume { position: relative; }
.audio_control .control_volume span.sound { display: inline-block; background: url(/img/audio_sound.svg) no-repeat center center; width: 28px; height: 28px; padding: 5px 5px; margin: 0; opacity: 0.5; cursor: pointer; }
.audio_control .control_volume > div { display: none; position: absolute; border: 8px solid #efedc6; background-color: #fff; right: 7px; bottom: 30px; border-radius: 4px; padding: 1px; }
.audio_control .control_volume > div > div { height: 100px; width: 10px; background-color: #fff; position: relative; cursor: pointer; }
.audio_control .control_volume > div > div > div { position: absolute; bottom: 0px; left: 0px; width: 10px; height: 50px; background-color: #64a9d5; }
.audio_control .control_volume:hover > div { display: block; }
.audio_control .control_volume:hover span { opacity: 1; }
#control_audio_name { font-size: 15px; color: #444; overflow: hidden; text-overflow: ellipsis; height: 16px; line-height: 100%; margin: 5px 0 3px 0; position: relative; }
#control_audio_name::after { content: ''; position:absolute; display: block; top: 0; right: 0; height: 15px; width: 1px; box-shadow: 0 0 50px 50px #fcfad5; }
#audio_progress { background-color: #dedcb7; border-radius: 2px; overflow: hidden; height: 16px; margin: 0 10px; cursor: pointer; }
#audio_progress > div { background-color: #64a9d5; width: 0%; height: 15px; }
#audio_cur_time { color: #666; font: 12px Verdana; line-height: 100%; white-space: nowrap; margin-right: 10px; }

.audio_control_fly { background-color: #fdfbdd; border-width: 2px 0 0 0; position: fixed; bottom: 0; left: 0; right: 0; max-width: 960px; margin: 0 auto; z-index: 100; box-sizing: border-box; border-radius: 0; }