:root {
    --green-main-color: #000;
    --white-color: #fefefe;
    --background-green-light-color: #c7c7c7;
}

* {
    margin: 0;
}


.main-container {
    color:  solid #fff;
    width: 100%;
    align-items: center;
}
/*Player*/
.container-audio {
    position: fixed;
    height: 65px;
    width: 100%;
    background-color: var(--white-color);
    /* z-index: 9999999; */
    border-radius: 20px;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
}

.audio-player {
    width: 100%;
    height: 100%;
    font-weight:300;
    font-family:open sans,sans-serif;
    color:#333;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}

button{
    padding:0;
    border:0;
    background:0 0;
    cursor:pointer
}

.logo-audima{
    background:url(img/535308d8f2af97fc03b61ad2de3c26b7.png) no-repeat;
    width:62px;
    height:14px
}
.logo-audima:hover{
    background:url(img/bd7115abde60e93d8d601f96242121f3.png) no-repeat
}
.div-play{
    background:url('') no-repeat;
    background-position:center;
    outline:none
}
.div-play:hover{
    background:url('') no-repeat;
    background-position:center
}
.div-pause{
    background:url('') no-repeat;
    background-position:center
}
.div-pause:hover{
    background:url('') no-repeat;
    background-position:center
}
.screen-reader-text-btn{
    visibility:hidden
}
.audima-play-widget{
    height:70px;
    width:40px
}
.timeline_wrap{
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%
}
.timeline_wrap .progress-bar-wrapper{
    position:relative;
    width:100%;
    height:12px;
}
.timeline_wrap .progress-bar-wrapper .progress-bar-pointer{
    top:-4px;
    right:-7px;
    width:9px;
    height:9px;
    border:1px solid #666;
    background:#666
}
.timeline_wrap .line_played{
    width:0;
    -webkit-transition:width .1s;
    -moz-transition:width .1s;
    -ms-transition:width .1s;
    -o-transition:width .1s;
    transition:width .1s;
    position:absolute;
    top:4px;
    height:4px;
    background-color:var(--green-main-color)
}
.timeline_wrap .progress-bar-pointer.progress-bar-pointer_up{
    background:#00b2fa
}
.timeline_wrap .full_line{
    position:absolute;
    top:4px;
    width:100%;
    height:4px;
    -webkit-transition:background-color .2s ease-in-out;
    transition:background-color .2s ease-in-out;
    background-color:var(--background-green-light-color)
}
.timeline_wrap .progress-bar-pointer{
    position:absolute;
    top:0;
    right:-1px;
    width:0;
    height:0;
    -webkit-transition:all .1s ease-in-out;
    transition:all .1s ease-in-out;
    border-radius:50%;
    background:#fff
}
/*
#playPause .img-play {
 width: 95%;
}*/
button:focus{
    outline:none
}
:focus{
    outline:none!important
}
.i-amphtml-layout-size-defined{
    height:60px
}
.container-wrap{
    max-width:600px;
    width:100vw;
    white-space:nowrap!important;
    font-weight:300
}
.content-player{
    display:flex;
    flex-direction: row;
    justify-content: space-around;
    width:100%;
    margin:0 auto;
    /*background: var(--white-color);*/
    border-radius:4px;
    align-items:center;
    height: 100%;
    box-sizing:border-box;
    color:#000
}

@media(max-height:1000px) {
        #perto-digital-tool .main-contacts-container::-webkit-scrollbar-thumb {
        background-color: #F0F0F0;
        border: 4px solid transparent;
        border-radius: 8px;
        background-clip: padding-box;
       
       
    }
    #perto-digital-tool .main-contacts-container::-webkit-scrollbar {
        width: 15px;
        
    }
     #perto-digital-tool .main-contacts-container {
        overflow: auto;
    }    
}
@media(max-width:768px){

    .content-player{
        width:100%
    }
}

@media(min-width:1750px){

    #controls > button.aud-btn-control.bwd_btn{
        background-size:45px !important;
        width: 45px !important;
        height: 45px !important;
    }
    
    #controls > button.aud-btn-control.fwd_btn.btn-volume .active{
        height: 45px !important;
        width: 45px !important;
        background-size:45px !important;
       
    }
    
    #controls > button.aud-btn-control.fwd_btn.btn-volume{
        height: 45px !important;
        width: 45px !important;
        background-size:45px !important;
       
    }
    .content-player .hidden-menu-controls {
        width: 200px !important;
    }
    #playPause > img {
        height: 100% !important;
    }

}

.content-player .play-pause-btn{
    display:flex;
    cursor:pointer;
    border-bottom-left-radius:4px
}
.content-player .play-pause-btn button#playPause{
    border:0;
    background:0 0
}
.content-player #playPause{
    padding:0 13px
}
@media(min-width:414px){
    .content-player #playPause:hover i.fa{
        color:#56b7b5
    }
}

.content-player .aud-content{
    display:flex;
    align-items:center;
    position:relative;
    justify-content:flex-end;
    height:inherit;
    width:95%
}
@media(max-width:375px){
    .content-player .aud-content{
        justify-content:flex-end
    }
}
@media(max-width:414px){
    .content-player .aud-content{
        justify-content:flex-end
    }
}
@media(max-width:360px){
    .content-player .aud-content{
        justify-content:flex-end
    }
}
.content-player .aud-content .aud-title{
    padding:0 10px;
    display:inherit;
    color:#55606E;
    font-size:12px;
    width:70%;
    -webkit-transition:width 1s;
    -moz-transition:width 1s;
    -ms-transition:width 1s;
    -o-transition:width 1s;
    transition:width 1s
}
@media(max-width:320px){
    .content-player .aud-content .aud-title{
        width:80%!important
    }
}
.content-player .aud-content span.total_time,.content-player .aud-content .current_time{
    font-size:12px;
    color:#55606E
}
.content-player .aud-content .timeline_wrap{
    width:70%;
    transition:width 1s;
    -webkit-transition:width 1s;
    margin-left:15px;
    margin-right:15px
}
@media(max-width:375px){
    .content-player .aud-content .timeline_wrap{
        margin-left:2px;
        margin-right:2px
    }
}
@media(max-width:414px){
    .content-player .aud-content .timeline_wrap{
        margin-left:2px;
        margin-right:2px
    }
}
@media(max-width:360px){
    .content-player .aud-content .timeline_wrap{
        margin-left:2px;
        margin-right:2px
    }
}

@media(max-width:655px){
    .content-player .aud-content .timeline_wrap{
        width:50%!important
    }
}

@media(max-width:480px){
    .content-player .aud-content .timeline_wrap{
        width:50%!important
    }
}

@media(max-width:400px){
    .content-player .aud-content .timeline_wrap{
        width:35%!important
    }
}

@media(max-width:300px){
    .content-player .aud-content .timeline_wrap{
        width:25%!important
    }
}

@media(max-width:280px){
    .content-player .aud-content .timeline_wrap{
        width:20%!important
    }
}
.content-player .aud-content .timeline_wrap .progress-bar-wrapper .progress-bar-pointer{
    top:-4px;
    right:-7px;
    width:11px;
    height:11px;
    border:1px solid var(--green-main-color);
    background:var(--green-main-color);
}
.content-player .aud-content .timeline_wrap.grow{
    width:62%
}
@media(max-width:375px){
    .content-player .aud-content .timeline_wrap.grow{
        width:40%!important
    }
}
@media(max-width:414px){
    .content-player .aud-content .timeline_wrap.grow{
        width:40%!important
    }
}
@media(max-width:320px){
    .content-player .aud-content .timeline_wrap.grow{
        width:25px!important
    }
}
.content-player .logo-audima{
    margin:0 10px 0 5px;
    width:31px!important;
    height:7px!important;
    background-size:31px
}
@media(max-width:375px){
    .content-player .logo-audima{
        width:30px!important;
        height:7px!important;
        background-size:30px
    }
}
@media(max-width:414px){
    .content-player .logo-audima{
        width:30px!important;
        height:7px!important;
        background-size:30px
    }
}
@media(max-width:360px){
    .content-player .logo-audima{
        width:30px!important;
        height:7px!important;
        background-size:30px
    }
}
.content-player .hidden-menu-controls{
    padding:1px 15px 0 15px;
    box-sizing:border-box;
    /*background:var(--white-color);*/
    display:flex;
    width:175px;
    top:0;
    left:0;
    position:absolute;
    justify-content:space-between;
    height:100%;
    align-items: center;
}
@media(max-width:375px){
    .content-player .hidden-menu-controls{
        width:155px;
        padding-left:10px;
        padding-right:0;
        padding-top:0;
        padding-bottom:0
    }
}
@media(max-width:414px){
    .content-player .hidden-menu-controls{
        width:155px;
        padding-left:10px;
        padding-right:0;
        padding-top:0;
        padding-bottom:0
    }
}
@media(max-width:360px){
    .content-player .hidden-menu-controls{
        width:155px;
        padding-left:10px;
        padding-right:0;
        padding-top:0;
        padding-bottom:0
    }
}
.content-player .hidden-menu-controls .bwd_btn{
    background:url(assets/skip_previous.svg) no-repeat center !important;
    background-size:30px !important;
   
}

.content-player .hidden-menu-controls .bwd_btn .active{
    background:url(assets/skip_previous.svg) no-repeat center !important;
    background-size:30px !important;
   
}
.content-player .hidden-menu-controls .aud-btn-control.btn-volume {
    background:url(assets/volume_up.svg) no-repeat center !important;
    background-size:30px !important;
}

.content-player .hidden-menu-controls .aud-btn-control.btn-volume.active{
    background:url(assets/muteSounds.svg) no-repeat center !important;
    background-size:30px !important;
   
}

.content-player .hidden-menu-controls .speed_btn {
    background-size:22px;
    font-weight: 600;
    color: #55606E !important;
}


.content-player .hidden-menu-controls .aud-btn-control{
    cursor:pointer;
    color:#515454;
    font-size:16px;
    height:32px;
    width:30px
}
.content-player .hidden-menu-controls .aud-btn-control:focus{
    outline:0
}

.progress-bar-wrapper{
    margin:0 10px
}

.fa-redo,.fa-undo{
    font-size:15px
}
#beforeMarquee{
    margin-right:10px
}


 .lds-ring {
    display: none;
    border-radius: 20px;
    position: fixed;
    height: 65px;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.74);
    z-index: 9999999;
    
    justify-content: center;
    align-items: center;
}

.lds-ring span {
    margin-top: 7rem;
    color: #3d4a46;
    background-image: linear-gradient(to right, rgb(255, 255, 255) , rgb(218, 218, 218));
}

  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid var(--green-main-color);
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: var(--green-main-color) transparent transparent transparent;
  }

  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
  }

  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
  }

  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
  }

  @keyframes lds-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }

/*Final Player*/
