* {box-sizing: border-box;}
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}template,[hidden]{display:none}a{background-color:transparent}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold}button,input,select{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{cursor:pointer}[disabled]{cursor:default}button,html [type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}button:-moz-focusring,input:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}

/*! player.css v1.0.0 | by Cross Host*/
body {display: flex; flex-direction: column; justify-content: center; height: 220px; background: transparent;}
.box-conteudo {margin: 10px auto; width: 460px; min-width: 220px; max-width: calc(100% - 20px); border-radius: 8px; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);}
.player {display: grid; grid-template-columns: 100%; width: 100%; min-height: 100px;}
.player .esq {display: flex; flex-direction: column; justify-content: center; height: 100px; text-align: center; background: #fff; border-radius: 8px 8px 0 0;}
.player .logo img {max-width: 127px;}
.player .dir {height: 100px; background: url(../images/bg-vermelho.png) repeat-x; border-radius: 0 0 8px 8px;}
.player .waveform {width: 100%; height: 70px; overflow: hidden;}
.player .waveform canvas {display: none; width: 100%; height: 60px;}
.player .controles {float: left; margin-left: 16px;}
.player #audio-player {display: none;}
.player .assinatura {display: none; float: right; margin: 1px 10px 0 0}
.player .assinatura img {border: none;}

/* Volume */
#player {width: 150px; height: auto; margin-top: 7px; position: relative; float: right; margin-left: 10px}
#player img { position: absolute; margin-top: -2px; margin-left: 10px; color: #666;}
#volume {position: absolute; left: 30px; margin: 0 auto; height: 4px; width: 130px; background: #6E120C; border-radius: 10px;}
#volume .ui-slider-range-min {height: 4px; width: 130px; position: absolute; background: #e73729; border: none; border-radius: 10px; outline: none;}
#volume .ui-slider-handle {width: 20px; height: 16px; border-radius: 20px; background: #fff; position: absolute; margin-left: -8px; margin-top: -6px; cursor: pointer; outline: none;}

/* --- The End \0/ --- */
.hide {display: none;}
.play,.pause{width: 22px;display: block;float: left;}
.canvashide{width: 100%; height: 1px; margin-top: 30px; background-color: rgba(231,55,41,100);}

@media only screen and (min-width: 320px) {
    .player .dir .assinatura {display: block;}
}

@media only screen and (min-width: 480px) {
    .player {grid-template-columns: 33% 67%;}
    .player .esq {border-radius: 8px 0 0 8px;}
    .player .dir {border-radius: 0 8px 8px 0;}
}