/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Sep 9, 2021, 10:18:09 AM
    Author     : WB-Jullie
*/
.wb-ue-media-action-btns > .col-md-6 > div {
  min-height: 21px;
  position:relative;
  vertical-align: bottom;
}
.wb-ue-save{
  display:inline-block;
}

.wb-ue-sub-btn,
.wb-ue-like-button,
.wb-ue-download-media-btn {
	color: #065f5d;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    border: none;
    background: transparent;
    cursor: pointer;
    padding-left: 0px;
}

.wb-ue-like-button svg{
    height: 22.5px;
    width: 24px;
    margin-right: 5px;
}

.wb-ue-like-button:hover{
    color: #34393F;
}

.wb-ue-like-button:hover path{
    fill:#34393F;
}

.wb-ue-save-button{
	color: #065f5d;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    border: none;
    background: transparent;
    cursor: pointer;
    padding-right: 0px;
    position: relative;
    padding-left: 27px;
        line-height: 12px;
}

.wb-ue-save-button svg{
    height: 23px;
    width: 24px;position: absolute;
    top: -4px;
    left: 0;
}

.wb-ue-save-button:hover{
    color: #34393F;
}

#wb-save-saved:hover path{
    fill:#34393F;
    stroke:#34393F;
}

#wb-save-notsaved:hover path{
    stroke:#34393F;
}

#sb-overlay {
    position: fixed;
    /* Positioning and size */
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(50.2, 50.2, 50.2, 0.2);
    /* color */
    z-index: 1;
    /* filter optional */
    backdrop-filter: blur(1px);
}

.login-container {
    width: 502px;
    height: 140px;
    background: #ffffff;
    box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.3);
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: fixed;
    margin: auto;
    z-index: 2;
}

.flex {
    display: flex;
}

.f-auto {
    flex: 1;
}

.sb-tr-l {
    font-family: inherit;
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 27px;
    /* text-transform: uppercase; */
    /* color: #6e6259;
border-bottom: 4px solid #991e66; */

    margin-left: 48px;
    margin-top: 24px;
    max-width: 300px;
    min-width: 300px;
}

.sb-tr-r {
    text-align: right;

    margin-right: 26px;
    margin-top: 30px;
}

.sb-tr-r img {
    height: 16px;
    width: 16px;
}

.icon img {
    height: 32px;
    width: 32px;
}

.sb-middle-row {
    margin-left: 48px;
    margin-right: 48px;
    margin-top: 20px;
}

.wb-ue-login-btns {
    flex: 1;
}

.wb-ue-login-btns button {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #065f5d;
    font-family: inherit;
    color: #065f5d;
    font-weight: 500;
}

.wb-ue-cls-x{
    color: #065f5d;
    font-weight: 500;
    font-family: inherit;
}

.clickable {
    cursor: pointer;
}

.wb-ue-subs,
.wb-ue-download-media {
    display: inline-block;
    margin-right: 20px;
}

.wb-ue-subs svg.wb-svg-rss-icon,
.wb-ue-download-media svg {
    height: 30px;
    width: 30px;
    fill: #065f5d
}

.wb-ue-distribution-icons {
    width: 32px;
    height: auto;
}

.d-flex.collapse:not(.show) {
    display: none !important;
}

.wb-subscribe-modal hr {
    border-top: 1px solid #7A858F !important;
    margin: 1.25rem 0 1rem 0 !important;
}

.wb-subscribe-modal p,
.wb-subscribe-modal span {
    color: #000000;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
}

.wb-subscribe-modal .modal-header,
.wb-subscribe-modal .modal-body {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}

.wb-subscribe-modal .modal-header {
    border-bottom: none !important;
    padding-bottom: 0.5rem !important;
}

.wb-subscribe-modal .modal-header h4 {
    color: #000000;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 24px;
    line-height: 28px;
}

.wb-subscribe-modal .modal-header a {
    display: block;
    margin-right: 42px;
    margin-top: 6px;
}

.wb-subscribe-modal .modal-header a .wb-close-icon:before,
.wb-subscribe-modal .modal-header a .wb-close-icon:after {
    height: 28px;
}

.wb-subscribe-modal .modal-body h3 {
    color: #000000;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
}

.wb-subscribe-modal .modal-body input {
    color: #424850;;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 35px;
    padding-left: 12px;
    border: 1px solid #B4B4B4;
}

.wb-subscribe-modal .wb-ue-copy-link {
    color: #065F5D;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
}

#wb-toggle-podcast-collapsible-distributions {
    color: #065F5D;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
}

#wb-toggle-podcast-collapsible-distributions i {
    background-image: none !important;
    color: #065F5D;
}

#wb-toggle-podcast-collapsible-distributions .fa-chevron-down::before, 
#wb-toggle-podcast-collapsible-distributions .fa-chevron-up:before {
    opacity: 1 !important;
}

.wb-ue-media-action-btns .px-3 .wbmu-media-transcript {
    margin-right: 20px !important;
}

.wb-ue-media-action-btns .px-3 .wb-ue-like-button,
.wb-ue-media-action-btns .px-3 .wbmu-media-transcript,
.wb-ue-media-action-btns .px-3 .wbmu-media-transcript > a,
.wb-ue-media-action-btns .px-3 .wb-ue-share .wb-share-btn {
    align-items: center!important;
    display: flex!important;
    flex-direction: row!important;
    justify-content: center!important;
}

.wb-ue-media-action-btns .px-3 .wb-ue-share span.wb-heading,
.wb-ue-media-action-btns .px-3 .wbmu-media-transcript > a {
    top: 0 !important;
}

.wb-ue-media-action-btns .px-3 .wbmu-media-transcript i.fas.fa-file-alt {
    position: unset !important;
    margin-right: 0.5rem!important;
}

.modal .wb-modal-close {
    display: block;
    margin-right: 50px;
    margin-top: 0;
}

.modal .wb-modal-close .wb-close-icon:before, 
.modal .wb-modal-close .wb-close-icon:after {
    background-color: #fff !important;
    left: 9px;
}

/*** MOBILE PORTRAIT ***/
@media (max-width: 575.98px) {
    .wb-ent-no-banner .wb-ue-media-action-btns.justify-content-between {
        flex-wrap: nowrap;
    }

    .wb-ent-no-banner .wb-ue-media-action-btns.justify-content-between .px-3.left-side{
        padding-right: 0rem !important;
    }

    .wb-ent-no-banner .wb-ue-media-action-btns.justify-content-between .px-3.right-side{
        padding-left: 0.5rem !important;
    }

    .wb-ent-no-banner .wb-ue-media-action-btns .wb-ue-share,
    .wb-ent-no-banner .wb-ue-media-action-btns .wb-ue-save {
        display: block !important;
    }

    .wb-ent-no-banner .wb-ue-media-action-btns .wb-ue-share {
        margin-right: 10px !important;
    }

    .wb-ent-no-banner .wb-ue-media-action-btns .px-3 .wbmu-media-transcript {
        margin-right: 12px !important;
    }

    .wb-ent-no-banner .wb-ue-media-action-btns .px-3 .wbmu-media-transcript > a {
        padding-left: 0 !important;
    }
}


/*** TABLET ***/
@media (max-width: 768px) {
    .wb-ent-has-banner .wb-ue-media-action-btns.justify-content-between {
        flex-wrap: nowrap;
    }

    .wb-ent-has-banner .wb-ue-media-action-btns.justify-content-between .px-3.left-side{
        padding-right: 0rem !important;
    }

    .wb-ent-has-banner .wb-ue-media-action-btns.justify-content-between .px-3.right-side{
        padding-left: 0.5rem !important;
    }

    .wb-ent-has-banner .wb-ue-media-action-btns .wb-ue-share,
    .wb-ent-has-banner .wb-ue-media-action-btns .wb-ue-save {
        display: block !important;
    }

    .wb-ent-has-banner .wb-ue-media-action-btns .wb-ue-share {
        margin-right: 10px !important;
    }

    .wb-ent-has-banner .wb-ue-media-action-btns .px-3 .wbmu-media-transcript {
        margin-right: 12px !important;
    }

    .wb-ent-has-banner .wb-ue-media-action-btns .px-3 .wbmu-media-transcript > a {
        padding-left: 0 !important;
    }
}
