html,
body {
    height: 100%
}

body {
    top: 0;
    font-family: 'Fira Sans', sans-serif
}

.container {
    min-height: 100%;
    height: auto
}

h1,
h2,
h3,
h4,
h5,
h6,
h7 {
    font-weight: 500;
    font-family: 'Montserrat', sans-serif
}

p {
    margin-bottom: .5rem
}

strong,
b {
    font-weight: bold
}

button {
    color: #ffc107;
    border: none;
    cursor: pointer;
    transition: .2s ease-in-out
}

button:hover {
    color: #fff
}

button:focus {
    color: #fff;
    outline: none
}

.vertical-align {
    display: flex;
    align-items: center;
    flex-direction: column
}

hr.star-light,
hr.star-dark {
    max-width: 15rem;
    padding: 0;
    text-align: center;
    border: none;
    border-top: solid .20rem;
    margin-top: 2.5rem;
    margin-bottom: 2.5rem
}

hr.star-light:after,
hr.star-dark:after {
    position: relative;
    top: -.8em;
    display: inline-block;
    padding: 0 .25em;
    content: url(logo_cb.png);
    font-family: FontAwesome;
    font-size: 2em
}

hr.star-light {
    border-color: #fff
}

hr.star-light:after {
    color: #fff;
    background-color: #ffc107
}

hr.star-dark {
    border-color: #1a2236
}

hr.star-dark:after {
    color: #1a2236;
    background-color: white
}

section {
    position: relative;
    margin-top: 0;
    padding: 10rem 0 3rem 0
}

section h2 {
    font-size: 2.25rem;
    line-height: 2rem
}

a {
    color: #ffc107;
    transition: color 500ms
}

a:hover,
a:active,
a:focus {
    color: #fff;
    text-decoration: none
}

.btn {
    border-width: 2px
}

.bg-primary {
    background-color: #C20D19 !important
}

.bg-secondary {
    background-color: #1a2236 !important
}

.text-primary {
    color: #1a2236 !important
}

.text-secondary {
    color: #1a2236 !important
}

.btn-primary {
    background-color: #3464e9;
    border-color: #3464e9
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #537ef5;
    border-color: #537ef5
}

.btn-secondary {
    background-color: #1a2236;
    border-color: #1a2236
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    background-color: #1a252f;
    border-color: #1a252f
}

.playlist {
    margin-top: -.5rem !important
}

.owl-theme .owl-nav [class*='owl-'] {
    color: #ffc107;
    background: #1a2236;
    border-radius: 2px
}

div.audio-player {
    position: relative;
    width: 100%;
    height: 7rem;
    background-color: rgba(26, 37, 47, .9) !important
}

.audio-player .cover {
    display: block;
    height: 7rem;
    width: 7rem;
    float: left;
    border: 3px solid #fff;
    position: absolute;
    top: 0;
    left: 0
}

#player-naslov-cont {
    padding: 0 10rem 0 10rem;
    font-family: "Oswald";
    text-transform: uppercase;
    text-align: center;
    z-index: 4
}

.streaming #player-naslov-cont {
    display: none
}

#player-naslov-fwd-bck-flex {
    display: inline-flex;
    max-width: max-content
}

.audio-naslov-text {
    margin: auto
}

#audio-naslov,
#audio-naslov-RDS {
    position: absolute;
    left: 20vw;
    width: calc(100% - 42vw);
    margin: 1.2rem auto 0;
    color: #ececec;
    font-size: .9rem;
    line-height: 1rem;
    text-align: center;
    text-overflow: ellipsis;
    text-overflow: " ...";
    overflow: hidden;
    white-space: nowrap
}

#audio-naslov-RDS {
    padding-top: 0
}

.mejs__container {
    background: none;
    text-align: center;
    margin: 0 6rem 0 9rem;
    width: calc(100vw - 15rem) !important;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: .3s
}

.mejs__container a,
.mejs__container a:focus,
.mejs__container button,
.mejs__container button:focus,
.mejs__container [role=slider],
.mejs__container [role=slider]:focus {
    outline: 0
}

.mejs__controls {
    background: none !important;
    background-color: rgba(26, 37, 47, 0) !important;
    padding: 20px 5px 20px 5px;
    height: 100px;
    width: 100%;
    position: absolute;
    bottom: 0
}

.mejs__button button {
    background: transparent url();
    overflow: visible;
    margin: 0 auto;
    position: relative;
    color: #ffc107;
    height: 60px;
    width: fit-content;
    transition: .3s
}

.mejs__button button:hover,
.mejs__button button:focus {
    color: #fff
}

.mejs__play,
.mejs__pause,
.mejs__replay {
    width: 60px;
    height: 60px;
    margin: auto 5px
}

.mejs__volume-button {
    width: 30px;
    height: 60px;
    margin: auto 5px
}

.mejs__horizontal-volume-slider {
    height: auto
}

.mejs__skip-back-button,
.mejs__jump-forward-button {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin-top: 15px
}

.mejs__skip-back-button {
    margin-right: 10px;
    margin-left: 5px
}

.mejs__jump-forward-button {
    margin-right: 5px;
    margin-left: 5px
}

.mejs__button.mejs__skip-back-button button,
.mejs__button.mejs__jump-forward-button button {
    width: 30px;
    height: 30px;
    display: inline-block
}

#defaultSeekBackInterval {
    z-index: 5;
    width: 30px;
    height: 30px;
    background-color: #ffc107;
    -webkit-mask-image: url('../vendor/element-media-player/dist/skip-back/skip-back.svg');
    mask-image: url('../vendor/element-media-player/dist/skip-back/skip-back.svg');
    transition: mask-image 500ms
}

#defaultSeekForwardInterval {
    z-index: 5;
    width: 30px;
    height: 30px;
    background-color: #ffc107;
    -webkit-mask-image: url('../vendor/element-media-player/dist/jump-forward/jump-forward.svg');
    mask-image: url('../vendor/element-media-player/dist/jump-forward/jump-forward.svg');
    transition: mask-image 500ms
}

#defaultSeekBackInterval:hover,
#defaultSeekForwardInterval:hover,
#defaultSeekBackInterval:focus,
#defaultSeekForwardInterval:focus {
    background-color: rgb(255, 255, 255)
}

.streaming #defaultSeekBackInterval,
.streaming #defaultSeekForwardInterval {
    display: none
}

.mejs__play button::before {
    font-family: "Font Awesome 5 Free";
    content: "\f144";
    font-weight: 900;
    font-size: 60px;
    line-height: 60px;
    display: inline-block;
    vertical-align: middle;
    background: transparent url()
}

.mejs__pause button::before {
    font-family: "Font Awesome 5 Free";
    content: "\f28b";
    font-weight: 900;
    font-size: 60px;
    line-height: 60px;
    display: inline-block;
    vertical-align: middle;
    background: transparent url()
}

.mejs__replay button::before {
    font-family: "Font Awesome 5 Free";
    content: "\f2f9";
    font-weight: 900;
    font-size: 60px;
    line-height: 60px;
    display: inline-block;
    vertical-align: middle;
    background: transparent url()
}

.mejs__unmute button::before {
    font-family: "Font Awesome 5 Free";
    content: "\f026";
    font-weight: 600;
    font-size: 26px;
    line-height: 26px;
    display: inline-block
}

.mejs__unmute button {
    vertical-align: middle;
    background: transparent url()
}

.mejs__mute button::before {
    font-family: "Font Awesome 5 Free";
    content: "\f028";
    font-weight: 600;
    font-size: 26px;
    line-height: 26px;
    display: inline-block
}

.mejs__mute button {
    vertical-align: middle;
    background: transparent url()
}

.mejs__time {
    font-size: 12px;
    vertical-align: middle;
    padding-top: 25px;
    height: fit-content;
    max-height: 11rem;
    padding: 0;
    margin: 25px 10px
}

.mejs__time-rail {
    margin: auto 5px;
    height: 60px;
    vertical-align: middle;
    padding-top: 25px
}

.mejs__broadcast {
    font-family: Oswald;
    font-size: 1rem;
    line-height: 1.2rem;
    color: #ececec;
    position: absolute;
    top: 20px;
    left: 0
}

.mejs__time-current,
.mejs__time-handle-content {
    background: #ffc107
}

span.mejs__time-total.mejs__time-slider {
    margin-top: 0
}

.mejs__time-buffering,
.mejs__time-current,
.mejs__time-float,
.mejs__time-float-corner,
.mejs__time-float-current,
.mejs__time-hovered,
.mejs__time-loaded,
.mejs__time-marker,
.mejs__time-total {
    border-radius: 0
}

.mejs__horizontal-volume-total {
    background: hsla(0, 0%, 100%, .3);
    top: 0;
    width: 70px
}

.mejs__horizontal-volume-current {
    background: #ffc107
}

.mejs__horizontal-volume-current:hover,
.mejs__horizontal-volume-current:focus {
    background: hsla(0, 0%, 100%, .8);
    transition: .3s
}

.mejs__horizontal-volume-slider {
    width: 70px;
    margin: 26px 5px
}

.mejs__horizontal-volume-current,
.mejs__horizontal-volume-total {
    border-radius: 0
}

.mejs__chapters-button {
    width: 40px;
    height: 60px;
    margin: auto 0 auto 5px
}

.mejs__chapters-button button {
    width: 40px;
    height: 60px;
    margin: auto
}

.mejs__chapters-button button::before {
    font-family: "Font Awesome 5 Free";
    content: "\f039";
    font-weight: 600;
    font-size: 20px;
    line-height: 20px;
    display: inline-block
}

.mejs__captions-button>.mejs__captions-selector,
.mejs__chapters-button>.mejs__chapters-selector {
    background: rgba(26, 37, 47, 0);
    margin-bottom: 0;
    right: 0;
    padding: 2rem 0 2rem 0;
    width: 150px
}

.mejs__captions-selector-label,
.mejs__chapters-selector-label {
    font-size: .8rem;
    line-height: 1.2rem
}

.mejs__captions-selector-list,
.mejs__chapters-selector-list {
    background: rgba(26, 37, 47, .9);
    overflow: visible
}

.mejs__captions-selector-list-item,
.mejs__chapters-selector-list-item {
    padding: .4rem 0 .4rem 0;
    margin: 0
}

.mejs__captions-selector-list-item:hover,
.mejs__chapters-selector-list-item:hover,
.mejs__captions-selector-list-item:focus,
.mejs__chapters-selector-list-item:focus {
    color: #ffc107;
    font-weight: 700;
    background-color: rgb(200, 200, 200) !important;
    background-color: rgba(26, 37, 47, 1) !important
}

.mejs__chapters-button>.mejs__chapters-selector {
    margin-right: -60px
}

.mejs__captions-selector-input,
.mejs__chapters-selector-input {
    display: none
}

.btn-podcast {
    color: rgb(60, 69, 98);
    font-family: 'Fira Sans', sans-serif;
    background-color: #ffc107 !important;
    border: none !important
}

.btn-podcast:hover,
.btn-podcast:focus {
    color: #fff !important;
    border: none !important
}

.dropdown-menu {
    color: #fff;
    background-color: #ffc107 !important;
    border: none !important;
    border-radius: 0 !important;
    width: 80%;
    box-shadow: 0 0 30px rgba(0, 0, 0, .4)
}

button,
html [type=button] {
    -webkit-appearance: none !important
}

.dropdownMenuButton {
    background-color: #ffc107 !important;
    border: none
}

.dropdown-item:focus,
.dropdown-item:hover {
    color: #fff;
    background-color: #d39e00
}

.naslov-hover {
    margin: .5em 1em;
    padding: 0;
    line-height: .9rem;
    font-size: .8rem
}

.dropdown .dropdown-triangle {
    height: 0;
    width: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #d39e00;
    position: absolute;
    top: -11px;
    left: 10%;
    z-index: 100
}

.dropdown-top-border {
    border-top: 5px solid #d39e00 !important;
    margin-top: -8px;
    top: 0;
    z-index: 100
}

.search-form {
    background-color: transparent;
    float: left;
    height: 3.2rem;
    margin: 0;
    overflow: hidden;
    border-radius: 0;
    border: 1px solid #fff;
    cursor: pointer;
    z-index: 5
}

.search-form.manjse {
    float: left;
    margin: 0;
    overflow: hidden;
    border-radius: 0;
    border: none !important
}

.search-form input[type=text] {
    background-color: #1a2236;
    padding: .8rem 0 .8rem .8rem;
    margin-right: -4px;
    font-size: 1rem;
    border: none;
    cursor: pointer
}

.nav-btn-2 {
    padding: .8rem 1.2rem .8rem 1.2rem;
    margin: auto;
    color: #ffc107;
    background: #1a2236;
    font-size: 17px;
    cursor: pointer;
    border: none
}

.search-form:hover .nav-btn-2 {
    color: #fff !important
}

#nav-btn {
    position: relative;
    right: 0;
    top: 0;
    padding: .8rem 1.2rem .8rem 1.2rem;
    margin-left: 0;
    color: #ffc107;
    background: #1a2236;
    font-size: 17px;
    cursor: pointer;
    border: none
}

#nav-btn:hover,
#nav-btn:focus {
    color: #fff
}

.form-control {
    border-radius: 0
}

input:focus {
    outline: none
}

input::-webkit-input-placeholder {
    padding: 6px;
    color: #ffc107;
    transition: color .3s
}

input:-moz-placeholder {
    padding: 6px;
    color: #ffc107;
    font-weight: 400;
    opacity: .9;
    transition: color .3s;
    -moz-transition: color .3s
}

input::-moz-placeholder {
    padding: 6px;
    color: #ffc107;
    font-weight: 400;
    opacity: .9;
    transition: color .3s;
    -moz-transition: color .3s
}

input:-ms-input-placeholder {
    padding: 6px;
    color: #ffc107;
    transition: color .3s
}

.search-form form:hover input::-webkit-input-placeholder {
    color: rgb(255, 255, 255)
}

.search-form form:hover input:-moz-placeholder {
    color: rgb(255, 255, 255)
}

.search-form form:hover input::-moz-placeholder {
    color: rgb(255, 255, 255)
}

.search-form form:hover input:-ms-input-placeholder {
    color: rgb(255, 255, 255)
}

.img-thumbnail {
    border-radius: 0
}

.btn {
    border-radius: 0
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: none;
    box-shadow: none
}

.alert {
    border-radius: 0 !important
}

.overlay#myPlayer {
    display: none;
    flex-direction: column;
    height: auto;
    width: 100vw;
    position: fixed;
    z-index: 10;
    bottom: 0;
    left: 0;
    background: none;
    transition: 1s
}

.player-open .overlay#myPlayer {
    display: flex
}

.overlay#myPlayer .closebtn {
    position: absolute;
    top: calc(3.5rem - .35rem);
    right: 3.5rem;
    line-height: 1.5rem;
    font-size: 1.5rem;
    padding: 0;
    margin: 0;
    background-color: rgb(0, 0, 0);
    background: transparent;
    transition: .7s ease-in-out;
    z-index: 11
}

.overlay#myPlayer .player-vec {
    position: absolute;
    top: 0;
    right: 2.6rem;
    line-height: .8rem;
    font-size: .8rem;
    padding: .25rem .75rem;
    margin: 0;
    color: rgb(26, 37, 47);
    background-color: #ffc107;
    border-radius: 0 0 6px 6px;
    transition: .4s ease-in-out;
    z-index: 11
}

.overlay#myPlayer .player-vec.hidden {
    display: none
}

.overlay#myPlayer .player-vec:hover,
.overlay#myPlayer .player-vec:focus,
.overlay#myPlayer .player-vec.active {
    color: #fff
}

.search-overlay {
    height: 0;
    width: 100%;
    position: fixed;
    z-index: 1031;
    top: 0;
    left: 0;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, .9);
    transition: .7s ease-in-out;
    overflow: hidden
}

.search-overlay.visible {
    height: 100%
}

.search-content {
    position: relative;
    top: 35%;
    margin: 30px auto;
    width: 80vw
}

.search-overlay .closebtn,
.modal-overlay .closebtn {
    text-decoration: none;
    line-height: 2.5rem;
    font-size: 2.5rem;
    color: #ffc107;
    background: transparent;
    display: block;
    position: absolute;
    z-index: 10;
    transition: .3s
}

.search-overlay .closebtn {
    top: 3.5rem;
    right: 5vw
}

.search-overlay .closebtn:hover,
.search-overlay .closebtn:focus {
    color: #fff
}

#search-page {
    margin-bottom: 10vh;
    width: 100%
}

.search-content input[type=text] {
    width: 100%;
    padding: 0 0 0 1rem;
    color: #1a2236;
    background-color: #fff;
    line-height: 50px;
    font-size: 1rem;
    border: none
}

.search-content .search-form {
    position: relative;
    width: 100%;
    padding: 0
}

.search-content button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 15px 16px 11px 18px;
    margin: 0;
    color: #1a2236 !important;
    background: #ffc107 !important;
    font-size: 1rem;
    cursor: pointer;
    border: none
}

.search-content button:hover,
.search-content button:focus {
    color: #fff !important;
    transition: .3s
}

.shadow-box.search-form {
    box-shadow: 1px 2px 10px lightgrey
}

#search-results .search-content {
    box-shadow: 1px 2px 10px lightgrey;
    margin-bottom: 0
}

#search-results .search-tagi i {
    color: #ffc107
}

#search-results .search-tagi a {
    color: rgba(60, 69, 98, .8)
}

#search-results .search-tagi a:hover,
#search-results .search-tagi a:focus {
    color: #ffc107
}

#search-results .search-content input[type=text] {
    cursor: auto
}

@keyframes autofill {
    to {
        color: #fff;
        background: #d39e00;
        border-radius: 0 !important
    }
}

.search-content input:-webkit-autofill {
    animation-name: autofill;
    animation-fill-mode: both;
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both
}

.kartica-desno {
    background-color: rgb(60, 69, 98);
    padding: 0 0 2.5rem;
    border-bottom: 6px solid #ffc107 !important;
    overflow: hidden
}

.img-fluid.avtor {
    margin-top: 1rem;
    height: 7rem;
    z-index: 1
}

.discription-bg {
    padding: 2rem 2rem
}

.discription-bg-share {
    color: #fff;
    text-align: left;
    background-color: rgb(60, 69, 98);
    padding: 2rem 2rem;
    min-height: 15vh;
    border-bottom: 6px solid #ffc107 !important
}

#mainNav-top {
    background-color: #1a2236
}

.opis-avtor {
    font-size: .9rem;
    margin: 3rem 0 0 0;
    color: #fff;
    vertical-align: middle
}

.opis-oddaja {
    text-align: justify;
    font-size: .9rem;
    line-height: 1.1rem;
    color: #fff;
    margin-bottom: 1rem
}

div.playlist {
    padding: 0;
    background-color: rgba(232, 232, 232, .6);
    overflow-y: scroll;
    max-height: 60vh
}

ol.playlist {
    padding: 0 0 0 0 !important;
    margin: 0 !important;
    list-style: none;
    text-align: left !important;
    overflow-x: hidden !important
}

li.play-item {
    padding: .5em 4em .5em 5em !important;
    margin: 0 -2.6em 0 -2.6em !important
}

li.play-item:nth-child(odd) {
    background-color: rgba(232, 232, 232, 1)
}

.btn-xl {
    padding: 1rem 1.75rem;
    font-size: 1.25rem
}

.btn-social {
    width: 3.25rem;
    height: 3.25rem;
    font-size: 1.25rem;
    line-height: 2.25rem
}

.scroll-to-top {
    position: relative;
    z-index: 5;
    right: 1rem;
    bottom: 1rem;
    display: none
}

.scroll-to-top a {
    width: 3.5rem;
    height: 3.5rem;
    background-color: rgba(33, 37, 41, .5);
    line-height: 3.1rem;
    border-radius: 1.75rem
}

body#page-top.player-open .scroll-to-top {
    bottom: 8rem
}

.js-scroll-trigger {
    display: block
}

#mainNav {
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-weight: 600;
    font-family: 'Montserrat', sans-serif
}

#mainNav .navbar-brand {
    color: #fff
}

#mainNav .navbar-brand #ro-avdio-logo {
    margin-right: .8rem;
    width: 3.2rem;
    height: 3.2rem;
    vertical-align: middle;
    fill: #ffc107;
    transition: fill 500ms
}

#mainNav .navbar-brand a:hover #ro-avdio-logo,
#mainNav .navbar-brand a:focus #ro-avdio-logo {
    fill: #ffff !important
}

#mainNav .navbar-nav {
    margin-top: 1rem;
    letter-spacing: .0625rem
}

#mainNav .navbar-nav li.nav-item a.nav-link {
    color: #fff
}

#mainNav .navbar-nav li.nav-item a.nav-link:hover,
#mainNav .navbar-nav li.nav-item a.nav-link:focus {
    color: #C20D19
}

#mainNav .navbar-nav li.nav-item a.nav-link:active,
#mainNav .navbar-nav li.nav-item a.nav-link:focus {
    color: #fff
}

#mainNav .navbar-nav li.nav-item a.nav-link.active {
    color: #C20D19
}

#mainNav .navbar-toggler {
    font-size: 80%;
    padding: .8rem
}

@media (min-width:992px) {
    #mainNav {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
        -webkit-transition: padding-top .3s, padding-bottom .3s;
        -moz-transition: padding-top .3s, padding-bottom .3s;
        transition: padding-top .3s, padding-bottom .3s
    }

    #mainNav .navbar-brand {
        font-size: 1.4rem;
        -webkit-transition: font-size .3s;
        -moz-transition: font-size .3s;
        transition: font-size .3s
    }

    #mainNav .navbar-nav {
        margin-top: 0
    }

    #mainNav .navbar-nav>li.nav-item>a.nav-link.active {
        color: #fff;
        background: #ffc107
    }

    #mainNav .navbar-nav>li.nav-item>a.nav-link.active:active,
    #mainNav .navbar-nav>li.nav-item>a.nav-link.active:focus,
    #mainNav .navbar-nav>li.nav-item>a.nav-link.active:hover {
        color: #fff;
        background: #ffc107
    }

    #mainNav.navbar-shrink {
        padding-top: .5rem;
        padding-bottom: .5rem
    }

    #mainNav.navbar-shrink .navbar-brand {
        font-size: 1.5em
    }
}

header.masthead {
    padding-top: calc(6rem + 72px);
    padding-bottom: 6rem
}

header.masthead h1 {
    font-size: 3rem;
    line-height: 3rem
}

header.masthead h2 {
    font-size: 1.3rem;
    font-family: 'Ubuntu', sans-serif
}

@media (min-width:992px) {
    header.masthead {
        padding-top: calc(6rem + 106px);
        padding-bottom: 6rem
    }

    header.masthead h1 {
        font-size: 4.75em;
        line-height: 4rem
    }

    header.masthead h2 {
        font-size: 1.75em
    }
}

.casovni-trak {
    color: #fff;
    background: #59738D;
    background: linear-gradient(to right, #1D2835, #59738D, #99BF36, #edb900);
    position: fixed;
    top: 5rem;
    width: 100%;
    z-index: 15;
    box-shadow: 1px 1px 10px lightgrey;
    transition: all .3s
}

.casovni-trak.move-up {
    top: -5rem;
    transition: all .3s
}

.casovni-trak .vsebina {
    height: 4rem;
    padding: 0 15px;
    width: 2500px
}

.casovni-trak .vsebina .zavihek {
    position: relative;
    display: inline-block;
    margin: 0;
    height: 100%;
    min-width: 20rem;
    padding: 0;
    background: linear-gradient(to right, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0));
    cursor: pointer
}

.casovni-trak .vsebina .zavihek img {
    height: 4rem
}

.casovni-trak .vsebina .zavihek p {
    display: inline-block;
    margin: .5rem 2rem 0 .5rem
}

.casovni-trak .vsebina .zavihek span.ura {
    font-weight: 700
}

.casovni-trak .vsebina .zavihek button {
    background-color: #ffc107;
    color: #1a2236;
    padding: 0;
    vertical-align: middle
}

.casovni-trak .vsebina .zavihek button:hover,
.casovni-trak .vsebina .zavihek button:focus {
    color: #fff
}

.casovni-trak .vsebina .zavihek button i {
    padding: .5rem
}

@media (min-width:991.8px) {
    .casovni-trak {
        top: 7rem
    }
}

@media (max-width:768px) {
    .kartica-desno {
        padding: 0 0 1.5rem
    }

    .casovni-trak {
        top: 5rem
    }

    .casovni-trak .vsebina {
        height: 3rem;
        padding: 0 10px
    }

    .casovni-trak .vsebina .zavihek {
        width: 10rem
    }

    .casovni-trak .vsebina .zavihek img {
        height: 3rem
    }
}

#aktualno,
#priporocamo {
    display: none;
    width: 100%
}

.active#aktualno,
.active#priporocamo {
    display: block
}

#tab-aktualno,
#tab-priporocamo {
    cursor: pointer
}

#tab-aktualno:hover,
#tab-priporocamo:hover,
#tab-aktualno:focus,
#tab-priporocamo:focus {
    color: #ffc107;
    transition: .3s
}

#tab-aktualno.active,
#tab-priporocamo.active {
    color: #ffc107 !important
}

#vse,
#svetovanje,
#vzgoja,
#duhovnost,
#mladi,
#druzba,
#komentar,
#arhivskeOddaje {
    display: none;
    width: 100%
}

.active#vse,
.active#svetovanje,
.active#vzgoja,
.active#duhovnost,
.active#mladi,
.active#druzba,
.active#komentar,
.active#arhivskeOddaje {
    display: block
}

#tab-vse,
#tab-svetovanje,
#tab-duhovnost,
#tab-vzgoja,
#tab-mladi,
#tab-druzba,
#tab-komentar,
#tab-arhivskeOddaje {
    cursor: pointer
}

#tab-vse:hover,
#tab-svetovanje:hover,
#tab-duhovnost:hover,
#tab-vzgoja:hover,
#tab-mladi:hover,
#tab-druzba:hover,
#tab-komentar:hover,
#tab-arhivskeOddaje:hover {
    color: #ffc107;
    transition: .3s
}

#tab-vse:focus,
#tab-svetovanje:focus,
#tab-duhovnost:focus,
#tab-vzgoja:focus,
#tab-mladi:focus,
#tab-druzba:focus,
#tab-komentar:focus,
#tab-arhivskeOddaje:focus {
    color: #ffc107;
    transition: .3s
}

#tab-vse.active,
#tab-svetovanje.active,
#tab-duhovnost.active,
#tab-vzgoja.active,
#tab-mladi.active,
#tab-druzba.active,
#tab-komentar.active,
#tab-arhivskeOddaje.active {
    color: #ffc107 !important
}

.kartica-oddaja {
    font-size: .8rem;
    line-height: 1rem;
    margin: 0 1rem 0 .7rem
}

.kartica-oddaja.naslov {
    font-size: .9rem;
    line-height: 1rem;
    padding-top: 1.1rem;
    padding-bottom: .5rem;
    margin-bottom: 0
}

@media (max-width:768px) {
    .kartica-oddaja.naslov {
        font-size: .8rem;
        line-height: .9rem
    }
}

.kartica-oddaja.manjse {
    line-height: 1rem;
    font-size: .75rem;
    margin: 0
}

.kartica-oddaja.manjse.tag {
    width: 90%;
    white-space: nowrap;
    overflow: hidden
}

.kartica-oddaja.manjse.naslov {
    font-size: .85rem;
    line-height: 1rem;
    padding-top: 1em;
    padding-bottom: .5em;
    margin-bottom: 0
}

.divider {
    margin: 0 .5rem
}

.kartica-oddaja.datum {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: .5rem .6rem;
    margin: 0;
    z-index: 5
}

.kartica-oddaja.izpostavljeno-datum {
    position: absolute;
    bottom: 0;
    right: 3.5rem;
    padding: .5rem .6rem;
    margin: 0;
    z-index: 5
}

.kartica-oddaja.avtor {
    margin: 0 1rem 4rem 1rem
}

.pod-datum {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2.8rem;
    width: 100%;
    z-index: 1;
    margin: 0;
    background: linear-gradient(rgba(60, 69, 98, .0), rgb(60, 69, 98));
    border-bottom: 1.4rem solid rgb(60, 69, 98)
}

.pod-datum.visje {
    height: 5rem;
    border-bottom: 1.5rem solid rgb(60, 69, 98);
    width: 100%
}

.nad-rob {
    position: absolute;
    top: 0;
    left: 0;
    height: 1rem;
    width: 100%;
    z-index: 1;
    margin: 0;
    background: linear-gradient(rgb(60, 69, 98), rgba(60, 69, 98, .0));
    border-top: .2rem solid rgb(60, 69, 98)
}

.podcast-item.izpostavljeno-cikel .pod-datum.visje {
    width: calc(100% - 4rem)
}

.podcast-item.izpostavljeno-cikel.mobile .pod-datum.visje {
    width: 100%
}

.nad-opis {
    position: absolute;
    top: 0;
    left: 0;
    height: .8rem;
    width: 100%;
    z-index: 1;
    margin: 0;
    background: linear-gradient(rgb(60, 69, 98), rgba(60, 69, 98, .0));
    border-top: .3rem solid rgb(60, 69, 98)
}

.kartica-oddaja.manjse.datum {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: .3rem .5rem;
    margin: 0;
    background-color: rgba(60, 69, 98, 0);
    z-index: 5
}

.oddaja-vsebina {
    font-size: .8rem;
    line-height: 1rem;
    position: absolute;
    top: 0;
    left: 14rem;
    margin: 0 1rem 0 .7rem;
    overflow: hidden;
    height: calc(100% - 9px);
    z-index: 0
}

.oddaja-vsebina.izpostavljeno {
    position: absolute;
    top: 0;
    left: 6rem;
    overflow: hidden;
    height: calc(6rem - .7rem);
    z-index: 0
}

.oddaja-vsebina.izpostavljeno-cikel {
    height: calc(100% - 9px);
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    overflow: hidden
}

.vec {
    color: #ffc107;
    cursor: pointer
}

.vec:hover,
.vec:focus {
    color: #fff
}

.vec.active {
    color: #fff
}

.vec-overlay {
    display: none
}

.vec-overlay.vsebina,
.vec-overlay.share,
.vec-overlay.vsebina-player {
    display: block;
    height: 100%;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    background-color: rgb(0, 0, 0);
    background-color: rgba(255, 255, 255, .65);
    -webkit-transition: height 300ms ease-in-out;
    -moz-transition: height 300ms ease-in-out;
    -o-transition: height 300ms ease-in-out;
    transition: height 300ms ease-in-out;
    z-index: 9
}

.vec-vsebina {
    display: none;
    position: absolute;
    top: 8rem;
    right: 0;
    color: #fff;
    background-color: rgb(60, 69, 98);
    min-height: 14rem;
    height: 100%;
    width: 100%;
    border-bottom: 6px solid #ffc107 !important;
    padding: 1rem 0 1rem .7rem
}

.vec-vsebina.visible {
    display: block
}

.tekst {
    position: absolute;
    top: 0;
    line-height: 1rem;
    font-size: .75rem;
    width: calc(100% - 4.2rem);
    max-height: 12rem;
    height: 100%;
    overflow: hidden
}

.oddaja-vsebina.izpostavljeno-cikel .tekst {
    height: 100%;
    max-height: 13rem
}

.vec-vsebina .tekst {
    width: calc(100% - 4.25rem)
}

.vec-vsebina.izpostavljeno-cikel .tekst {
    width: calc(100% - 1rem)
}

.vec-vsebina.player .tekst .kartica-oddaja.manjse.avtor {
    margin: 0 1rem 0 .6rem
}

.avtor a {
    margin-right: .5rem
}

.vec-vsebina .tekst .avtor {
    margin-bottom: 4rem
}

.tekst .kartica-oddaja {
    margin: 0 .5rem 0 0
}

.tekst .kartica-oddaja.tag {
    position: relative;
    bottom: 0;
    left: 0;
    padding: 0;
    z-index: auto;
    width: 100%;
    margin-bottom: 4rem
}

.podcast-item .tag {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: .5rem .7rem;
    margin: 0;
    width: calc(100% - 4rem);
    z-index: 5
}

.podcast-item.izpostavljeno-cikel .tag p {
    left: 0
}

.podcast-item.izpostavljeno-cikel.mobile .tag {
    left: 0;
    width: 90%
}

.podcast-item.izpostavljeno-cikel.mobile .tag a {
    left: 2rem;
    width: 90%
}

.tag a {
    margin-right: .5rem
}

.tag i {
    left: 0
}

.vec-vsebina.player .spodaj .tag {
    width: 22rem;
    bottom: 1.4rem;
    white-space: nowrap;
    overflow: hidden
}

.vec-vsebina.player .spodaj .tag i {
    left: 0
}

.vec-vsebina.player .spodaj .tag a {
    left: 2rem
}

.vec-vsebina.player .tekst .avtor {
    margin-bottom: .5rem
}

.search-tagi {
    max-width: 80vw;
    position: relative;
    top: 0;
    left: 0;
    z-index: 15;
    color: #fff;
    text-transform: none
}

.tag-list {
    position: relative;
    left: 0;
    margin-top: 1rem;
    color: #ffc107;
    display: flex;
    flex-wrap: wrap;
    font-size: .8rem;
    padding-left: 1rem
}

.tag-list i {
    color: #fff;
    margin-right: .3rem
}

.tag-list li {
    margin-right: 1.3rem;
    list-style-type: none
}

.tag-list li a {
    display: block
}

.vec-vsebina.player .pod-datum {
    bottom: 0
}

.vec-vsebina .dropdown-triangle {
    height: 0;
    width: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid rgb(60, 69, 98);
    position: absolute;
    top: -12px;
    left: 83%;
    z-index: 10
}

.vec-vsebina.izpostavljeno {
    top: 7rem
}

.vec-vsebina.player {
    position: fixed;
    top: auto;
    bottom: 8rem;
    right: 2.6rem;
    display: block;
    height: 14rem;
    width: 30rem;
    z-index: 10;
    text-align: left;
    display: none
}

.vec-vsebina.player.visible {
    display: block
}

.vec-vsebina.player .dropdown-triangle {
    height: 0;
    width: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top: 12px solid #ffc107;
    border-bottom: none;
    top: 14rem;
    left: calc(100% - 2.5rem);
    z-index: 10
}

.vec-vsebina.izpostavljeno .dropdown-triangle {
    left: 75%
}

.podcast-item-div {
    position: relative
}

.podcast .podcast-item {
    position: relative;
    display: block;
    overflow: hidden;
    background-color: rgb(60, 69, 98);
    height: 27rem;
    width: 100%;
    padding: 0;
    box-shadow: 1px 2px 10px lightgrey;
    text-align: left;
    color: white;
    border-bottom: 6px solid #ffc107 !important;
    z-index: 0
}

.podcast-item.active {
    overflow: visible;
    z-index: 9
}

.podcast .podcast-item.manjse {
    height: 20rem
}

.podcast .podcast-item #naslov-oddaje {
    text-align: left;
    font-size: 1.2rem;
    color: white
}

.podcast .podcast-item:hover,
.podcast .podcast-item:focus {
    text-align: left
}

.podcast .podcast-item .p:hover,
.podcast .podcast-item .p:focus {
    text-decoration: none
}

.podcast .podcast-item .podcast-item-caption {
    -webkit-transition: all ease .5s;
    -moz-transition: all ease .5s;
    transition: all ease .5s;
    opacity: 0;
    background-color: rgba(32, 32, 60, .8);
    z-index: 3
}

.podcast .podcast-item .podcast-item-caption:hover,
.podcast .podcast-item .podcast-item-caption:focus {
    opacity: 1;
    z-index: 3
}

.podcast .podcast-item .podcast-item-caption .podcast-item-caption-content .naslov-hover {
    line-height: 1.6rem;
    font-size: 1.5rem;
    margin: auto;
    padding: 1rem
}

.podcast .podcast-item .podcast-item-caption .podcast-item-caption-content .naslov-hover-manjse {
    line-height: 1.3rem;
    font-size: 1.1rem;
    margin: auto;
    padding: 1rem
}

.podcast-item.vodoravno {
    height: 7rem;
    line-height: 1.1em;
    font-size: 1em
}

.podcast-item.vodoravno-desno {
    height: 18vh;
    line-height: 1.1em;
    font-size: 1em
}

.container img.section-bg {
    opacity: .5;
    min-height: 100%;
    width: 100%;
    position: fixed;
    left: 0;
    bottom: 0;
    background-position: center;
    background-size: cover;
    background-repeat: repeat-y;
    z-index: -1;
    margin-top: -15rem
}

.img-fluid {
    position: relative;
    z-index: 2
}

.podcast-item .img-fluid {
    margin-right: 1rem
}

.img-fluid.vodoravno {
    position: relative;
    height: 100%;
    float: left;
    padding: 0;
    margin-right: 1rem;
    margin-left: 7rem;
    z-index: 2
}

.kartica-oddaja-play.vodoravno {
    line-height: 7rem;
    font-size: 1.3rem;
    position: absolute;
    height: 100%;
    width: 7rem;
    text-align: center;
    bottom: 0;
    left: 0;
    float: left
}

.podcast-item.izpostavljeno {
    height: 6rem;
    padding: 0
}

.img-fluid.izpostavljeno {
    height: 100%;
    float: left;
    margin-right: 1rem
}

.kartica-oddaja-play {
    position: absolute;
    z-index: 5;
    color: rgb(60, 69, 98);
    background-color: #ffc107;
    padding: .4rem .4rem calc(.4rem - 6px) .4rem;
    bottom: 0;
    left: 0;
    overflow: hidden;
    cursor: pointer
}

.kartica-oddaja-play.izpostavljeno-cikel {
    color: rgba(255, 193, 7, .9);
    background-color: transparent;
    line-height: 16rem;
    font-size: 4rem;
    position: absolute;
    height: 100%;
    width: 14rem;
    text-align: center;
    bottom: 0;
    left: 0;
    float: left
}

.kartica-oddaja-play.vodoravno:hover,
.kartica-oddaja-play.vodoravno:focus,
.kartica-oddaja-play.vodoravno:active {
    color: #fff
}

.kartica-oddaja-play:hover,
.kartica-oddaja-play:focus,
.kartica-oddaja-play:active {
    color: #fff
}

.kartica-oddaja-play#manjse {
    font-size: .6rem;
    padding: .35rem
}

.kartica-oddaja-play.vodoravno.selected {
    color: #fff
}

.kartica-oddaja-play.selected {
    color: #fff
}

.kartica-oddaja-play.izpostavljeno-cikel:hover,
.kartica-oddaja-play.izpostavljeno-cikel:focus {
    color: rgba(255, 255, 255, .9);
    background-color: transparent
}

.kartica-oddaja-play.izpostavljeno-cikel.mobile {
    color: rgb(60, 69, 98);
    background-color: rgba(255, 193, 7, 1);
    line-height: 3.5rem;
    font-size: 1.3rem;
    position: absolute;
    height: calc(4rem - 9px);
    width: calc(4rem - 3px);
    text-align: center;
    bottom: 0;
    left: 0;
    float: left
}

.kartica-oddaja-play.izpostavljeno-cikel.mobile:hover,
.kartica-oddaja-play.izpostavljeno-cikel.mobile:focus,
.kartica-oddaja-play.izpostavljeno-cikel.mobile.selected {
    color: #fff
}

.kartica-oddaja-share.izpostavljeno-cikel.mobile {
    color: rgb(60, 69, 98);
    background-color: rgb(254, 94, 94);
    line-height: 3.5rem;
    font-size: 1.5rem;
    position: absolute;
    height: calc(4rem - 9px);
    width: calc(4rem - 3px);
    text-align: center;
    bottom: 0;
    left: calc(4rem - 3px);
    float: left;
    z-index: 5
}

.kartica-oddaja-share.izpostavljeno-cikel.mobile:hover,
.kartica-oddaja-share.izpostavljeno-cikel.mobile:focus,
.kartica-oddaja-share.izpostavljeno-cikel.mobile.active {
    color: #fff
}

.img-fluid.izpostavljeno-cikel.mobile {
    height: calc(8rem - 6px)
}

.podcast-item.izpostavljeno-cikel {
    height: 14rem;
    padding: 0
}

.podcast-item.izpostavljeno-cikel.mobile {
    height: calc(12rem - 9px);
    max-height: 100%
}

button.vec-cikel {
    display: none
}

button.manj-cikel {
    display: none
}

.share {
    float: right;
    height: 100%;
    width: 3.5rem;
    position: absolute;
    bottom: -6px;
    right: 0
}

.share-dropdown {
    position: absolute;
    top: 12.35rem;
    left: 4rem;
    display: none;
    height: 3.5rem;
    width: 100%
}

.share-dropdown.visible {
    display: block
}

.share-dropdown .dropdown-triangle {
    height: 0;
    width: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #00aced;
    position: absolute;
    top: -11px;
    left: calc(1.75rem - 12px);
    z-index: 10
}

.icon-fa,
.icon-twitt,
.icon-download,
.icon-share,
.icon-share,
.icon-ro {
    color: rgb(60, 69, 98);
    line-height: 3.5rem;
    font-size: 1.5rem;
    text-align: center;
    z-index: 5;
    cursor: pointer;
    width: 3.5rem;
    height: 3.5rem
}

.icon-ro {
    cursor: default
}

.icon-twitt {
    position: absolute;
    bottom: 10.5rem;
    background-color: #00aced
}

.icon-fa {
    position: absolute;
    bottom: 7rem;
    background-color: #6d84b4
}

.icon-download {
    position: absolute;
    bottom: 3.5rem;
    background-color: #e35a4f
}

.icon-ro {
    position: absolute;
    bottom: 3.5rem;
    background-color: #e35a4f
}

.icon-share,
.icon-share {
    position: absolute;
    bottom: 0;
    background-color: #ffc107
}

.share-dropdown .icon-twitt {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #00aced
}

.share-dropdown .icon-fa {
    position: absolute;
    top: 0;
    left: 3.5rem;
    background-color: #6d84b4
}

.share-dropdown .icon-download {
    position: absolute;
    top: 0;
    left: 7rem;
    background-color: #e35a4f
}

.share-dropdown .icon-ro {
    position: absolute;
    top: 0;
    left: 7rem;
    background-color: #e35a4f
}

.share-dropdown .icon-mail,
.share-dropdown .icon-share {
    position: absolute;
    top: 0;
    left: 10.5rem;
    background-color: #ffc107
}

.icon-fa:hover,
.icon-twitt:hover,
.icon-download:hover,
.icon-share:hover,
.icon-share:focus {
    color: #fff
}

.icon-fa:focus,
.icon-twitt:focus,
.icon-download:focus,
.icon-share:focus,
.icon-share:focus {
    color: #fff
}

.vec-vsebina .spodaj {
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(100% - 4rem);
    z-index: 5
}

.share-this-time {
    display: block;
    cursor: pointer;
    float: left;
    font-size: .8rem;
    line-height: 20px;
    margin-bottom: .5rem;
    margin-left: .6rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.share-this-time span.opis {
    float: left
}

.share-this-time input {
    position: absolute;
    right: 0;
    opacity: 0;
    cursor: pointer
}

.checkmark {
    position: absolute;
    top: 0;
    right: 0;
    height: 20px;
    width: 20px;
    background-color: rgba(255, 255, 255, .3);
    border: 1px solid #ffc107
}

.share-this-time:hover input~.checkmark {
    background-color: rgba(255, 255, 255, .8)
}

.share-this-time input~.checkmark:focus {
    background-color: rgba(255, 255, 255, .8)
}

.share-this-time input:checked~.checkmark {
    background-color: #ffc107
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none
}

.share-this-time input:checked~.checkmark:after {
    display: block
}

.share-this-time .checkmark:after {
    left: 6px;
    top: 2px;
    width: 6px;
    height: 10px;
    border: solid rgb(60, 69, 98);
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.modal-overlay {
    height: 100vh;
    width: 100vw;
    position: fixed;
    z-index: 10;
    top: 100vh;
    left: 0;
    background-color: rgb(66, 66, 66);
    background-color: rgba(255, 255, 255, .5);
    transition: .7s ease-in-out;
    overflow: hidden
}

.modal-overlay.visible {
    top: 0
}

.modal-item {
    padding: 3.5rem 2.5rem;
    color: #fff;
    width: fit-content;
    max-width: 80vw;
    position: relative;
    z-index: 11;
    top: calc(50vh - 100px);
    margin: auto;
    background-color: rgb(60, 69, 98);
    transition: .7s ease-in-out;
    overflow: hidden
}

.modal-obvestilo {
    font-size: 1rem;
    text-transform: none;
    padding: 0 2rem;
    margin: 0
}

.modal-overlay .closebtn {
    line-height: 2rem;
    font-size: 2rem;
    top: .5rem;
    right: .5rem
}

#lazy-trigger.search,
#lazy-trigger.cikel {
    cursor: pointer;
    text-align: center;
    font-size: 1rem;
    padding: 1rem;
    color: #ffc107;
    background-color: rgb(60, 69, 98);
    width: max-content;
    min-width: 10rem;
    height: 3.5rem;
    margin: 3rem auto 0 auto;
    visibility: hidden;
    transition: all 500ms
}

#lazy-trigger.search.visible,
#lazy-trigger.cikel.visible {
    visibility: visible
}

#lazy-trigger.visible:hover,
#lazy-trigger.visible:focus {
    opacity: .75
}

#ad-1.sticky {
    position: sticky;
    top: 7rem
}

@media (max-width:767.98px) {
    .podcast .podcast-item .podcast-item-caption .podcast-item-caption-content {
        line-height: 1.6rem;
        font-size: 1.5rem;
        margin: auto
    }

    .podcast .podcast-item .podcast-item-caption .podcast-item-caption-content .naslov-hover-manjse {
        font-size: 1.2rem;
        font-size: 1.1rem
    }

    .img-fluid.vodoravno {
        margin-left: 7rem
    }

    .cikel {
        position: relative;
        top: 0;
        height: 12rem;
        overflow: hidden;
        width: 100%;
        position: relative
    }

    .cikel.visible {
        height: auto
    }

    img.img-fluid.img-cikel {
        position: relative;
        top: -20vw;
        left: 0;
        width: 100%;
        height: auto;
        margin: 0
    }

    img.img-fluid.img-cikel.visible {
        top: 0;
        width: 100%;
        height: auto;
        margin: 0
    }

    .discription-bg {
        top: 0;
        overflow: hidden;
        max-height: 7rem
    }

    .discription-bg.visible {
        max-height: 100%
    }

    .discription-bg-share {
        position: relative;
        top: 0;
        overflow: hidden;
        height: 100%;
        max-height: 10rem;
        transition: .3s ease-in-out
    }

    button.vec-cikel {
        display: block;
        position: absolute;
        bottom: calc(0px - 2rem);
        left: calc(50% - 2.5rem);
        background: rgba(255, 255, 255, .3);
        color: #ffc107;
        font-size: 2rem;
        height: 5rem;
        width: 5rem;
        border: none;
        border-radius: 2.5rem;
        z-index: 4
    }

    button.manj-cikel {
        display: none;
        position: absolute;
        bottom: calc(0px - 2rem);
        left: calc(50% - 2.5rem);
        background: rgba(255, 255, 255, .3);
        color: #ffc107;
        font-size: 2rem;
        height: 5rem;
        width: 5rem;
        border: none;
        border-radius: 2.5rem;
        z-index: 4
    }

    .dropdown-menu {
        transform: translate3d(0, 55px, 0) !important
    }

    .dropdown-triangle {
        left: 85%
    }

    .dropdownMenuButton {
        position: absolute;
        top: .05rem;
        right: 0;
        z-index: 5;
        margin: 0;
        font-size: 1rem;
        height: 3.5rem;
        width: 40%;
        padding: 0
    }

    .vec-vsebina .dropdown-triangle {
        left: 72%
    }

    .vec-vsebina.player {
        bottom: 8rem;
        right: 15px;
        height: 14rem;
        width: calc(100vw - 30px)
    }

    .overlay#myPlayer .player-vec {
        right: 15px
    }
}

@media (max-width:991.98px) {
    .podcast .podcast-item {
        height: 8rem;
        padding: 0
    }

    .podcast .podcast-item .podcast-item-caption .podcast-item-caption-content {
        line-height: 1rem;
        font-size: 1rem;
        margin: auto
    }

    .podcast .podcast-item .podcast-item-caption .podcast-item-caption-content .naslov-hover-manjse {
        font-size: 1.1rem
    }

    .podcast-item.vodoravno {
        height: 7rem;
        line-height: 1.1em;
        font-size: 1em
    }

    .kartica-oddaja {
        line-height: 1rem;
        font-size: .75rem;
        margin: 0 1.8rem 3.6rem 1.8rem
    }

    .kartica-oddaja-play.vodoravno {
        line-height: 7rem;
        width: 7rem
    }

    .podcast-item.izpostavljeno {
        height: 7rem;
        padding: 0
    }

    .img-fluid {
        height: 100%;
        float: left;
        padding: 0
    }

    .img-fluid.img-cikel {
        height: auto
    }

    .img-fluid.izpostavljeno {
        height: 7rem;
        float: left
    }

    .podcast-item .vec-vsebina.izpostavljeno-cikel.mobile {
        top: 12.5rem
    }

    .podcast-item .vec-vsebina {
        top: 9rem
    }

    .oddaja-vsebina {
        left: 7.7rem
    }

    .oddaja-vsebina .kartica-oddaja {
        margin: 0
    }

    .oddaja-vsebina.izpostavljeno {
        left: 7rem
    }

    .oddaja-vsebina.izpostavljeno-cikel {
        margin: 0 1rem 0 .7rem
    }

    .vec-vsebina .dropdown-triangle {
        left: 70%
    }
}

.podcast-item.manjse .oddaja-vsebina {
    position: initial
}

.podcast-modal .podcast-modal-dialog {
    padding: 3rem 1rem;
    min-height: calc(100vh - 2rem);
    margin: 1rem calc(1rem - 8px);
    position: relative;
    z-index: 2;
    -moz-box-shadow: 0 0 3rem 1rem rgba(0, 0, 0, .5);
    -webkit-box-shadow: 0 0 3rem 1rem rgba(0, 0, 0, .5);
    box-shadow: 0 0 3rem 1rem rgba(0, 0, 0, .5)
}

.podcast-modal .podcast-modal-dialog .close-button {
    position: absolute;
    top: 2rem;
    right: 2rem
}

.podcast-modal .podcast-modal-dialog .close-button i {
    line-height: 38px
}

.podcast-modal .podcast-modal-dialog h2 {
    font-size: 2rem
}

.floating-label-form-group {
    position: relative;
    border-bottom: 1px solid #e9ecef
}

.floating-label-form-group input,
.floating-label-form-group textarea {
    font-size: 1.5em;
    position: relative;
    z-index: 1;
    padding-right: 0;
    padding-left: 0;
    resize: none;
    border: none;
    border-radius: 0;
    background: none;
    box-shadow: none !important
}

.floating-label-form-group label {
    font-size: .85em;
    line-height: 1.764705882em;
    position: relative;
    z-index: 0;
    top: 2em;
    display: block;
    margin: 0;
    -webkit-transition: top .3s ease, opacity .3s ease;
    -moz-transition: top .3s ease, opacity .3s ease;
    -ms-transition: top .3s ease, opacity .3s ease;
    transition: top .3s ease, opacity .3s ease;
    opacity: 0
}

.floating-label-form-group:not(:first-child) {
    padding-left: 14px;
    border-left: 1px solid #e9ecef
}

.floating-label-form-group-with-value label {
    top: 0;
    opacity: 1
}

.floating-label-form-group-with-focus label {
    color: #C20D19
}

form .row:first-child .floating-label-form-group {
    border-top: 1px solid #e9ecef
}

.footer {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #1a2236;
    color: #fff
}

.copyright {
    background-color: #454d65
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #ffc107
}

.mCSB_scrollTools {
    top: 1rem;
    bottom: 1.5rem;
    z-index: 5
}

.oddaja-vsebina.izpostavljeno-cikel .mCSB_scrollTools {
    bottom: 3rem
}

.tekst>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar:hover,
.tekst>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar:focus {
    background-color: #fff
}

body>.mCustomScrollBox>.mCSB_scrollTools {
    top: 10rem;
    height: 75vh
}

body>.mCustomScrollBox>.mCSB_scrollTools>.mCSB_buttonUp {
    color: #ffc107
}

body>.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: rgba(33, 37, 41, .75)
}

.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 1.5rem
}

.casovni-trak>.mCSB_horizontal.mCSB_inside>.mCSB_container {
    margin-bottom: 0
}

.casovni-trak>.mCSB_scrollTools .mCSB_draggerContainer {
    top: 5rem
}

.casovni-trak>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    margin: 0 auto;
    top: 0;
    max-width: 20rem
}

@media (max-width:576px) {
    .casovni-trak>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
        max-width: 40vw
    }

    .casovni-trak>.mCSB_scrollTools .mCSB_draggerContainer {
        top: 4.7rem
    }
}

section.doniraj {
    padding: 11rem 0 6rem 0
}

button a {
    color: inherit
}

.kartica.doniraj {
    color: #1a2236;
    box-shadow: 1px 2px 10px lightgrey
}

button.doniraj {
    height: 3.2rem;
    width: 12rem;
    margin-left: 1rem;
    color: #1a2236;
    font-weight: 600;
    background: #ffc107
}

button.doniraj:hover,
button.doniraj:focus {
    color: white;
    font-weight: 400
}

.doniraj-gumb {
    float: left
}

button.doniraj-gumb {
    height: 3.2rem;
    max-width: 9rem;
    margin-left: 1rem;
    color: #1a2236;
    font-weight: 600;
    background: #ffc107;
    border: none;
    transition: all ease .5s
}

.kartica.doniraj .doniraj-gumb {
    min-width: 12rem
}

button.doniraj-gumb:hover,
button.doniraj-gumb:focus {
    color: #fff;
    cursor: pointer
}

.doniraj input {
    background: #fff;
    padding: .375rem .75rem;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da
}

.doniraj.alert {
    font-size: .75rem
}

.doniraj.alert a {
    font-weight: 600;
    color: inherit
}

.doniraj.alert a:hover,
.doniraj.alert a:focus {
    color: #fff
}

.doniraj.slogan {
    font-size: 1.75rem;
    font-weight: 600
}

.doniraj.foto {
    width: 100%;
    height: auto;
    margin-bottom: 1rem
}

.doniraj .gumb.opis {
    width: 100%;
    margin: .7rem auto 1rem auto;
    font-size: .75rem
}

.doniraj.foto .opis {
    font-size: 1rem;
    line-height: 1.1rem;
    font-weight: 400
}

.doniraj .vprasanja {
    font-size: .9rem;
    color: #ffc107
}

@media (max-width:1024px) {
    .mejs__container {
        width: calc(100vw - 13rem) !important
    }

    #audio-naslov,
    #audio-naslov-RDS {
        margin: 1rem auto 1.2rem auto;
        font-size: .75rem
    }

    .discription-bg {
        padding: 1.5rem
    }

    img-fluid.avtor {
        height: 4rem
    }

    .opis-oddaja {
        font-size: .8rem;
        line-height: 1rem
    }

    .opis-avtor {
        font-size: .8rem
    }

    .overlay#myPlayer .closebtn {
        right: 2.4rem
    }

    .btn-podcast {
        font-size: 1.1rem
    }
}

@media (max-width:768px) {
    .mejs__container {
        margin: 0 1rem 0 1rem;
        width: calc(100vw - 6rem) !important
    }

    .mejs__time {
        position: relative;
        margin: 0
    }

    .mejs__currenttime-container {
        font-size: 10px;
        position: relative;
        top: 10px
    }

    .mejs__duration-container {
        font-size: 10px;
        position: relative;
        top: 10px;
        right: 10px;
        width: 60px;
        text-align: right !important
    }

    .mejs__time-rail {
        margin-left: -25px;
        margin-right: -50px
    }

    .mejs__volume-button {
        margin-left: 15px
    }

    .mejs__horizontal-volume-slider {
        display: none !important
    }

    #audio-naslov,
    #audio-naslov-RDS {
        left: 15vw;
        width: calc(100% - 36vw);
        margin: .8rem auto 1.2rem auto;
        font-size: .7rem;
        line-height: .8rem
    }

    .mejs__broadcast {
        font-size: .85rem;
        line-height: .9rem
    }

    .audio-player .cover {
        display: none
    }

    section {
        padding: 7rem 1rem 4rem 1rem !important
    }

    .kartica.doniraj {
        padding: 4rem
    }

    .doniraj .gumb.opis {
        text-align: center
    }

    button.doniraj-gumb {
        margin-left: .25rem
    }

    .overlay#myPlayer .closebtn {
        right: 5vw
    }

    .dropdown .dropdown-triangle {
        left: 75%
    }

    section h2 {
        font-size: 1.8rem;
        line-height: 1.6rem
    }

    section h3 {
        padding: 0;
        font-size: 1.3rem;
        line-height: 1.5rem
    }

    section h4 {
        padding: 0;
        font-size: 1.1rem;
        line-height: 1.2rem
    }

    #mainNav .navbar-brand #ro-avdio-logo {
        width: 2.7rem;
        height: 2.7rem
    }
}

@media (max-width:598px) {
    h5 {
        font-size: 1.1rem
    }

    h6 {
        font-size: .9rem
    }

    #player-naslov-cont {
        padding: 0
    }

    div.audio-player {
        height: 8rem
    }

    .mejs__container {
        margin: 0 1rem 0 1rem;
        width: calc(100vw - 5.5rem) !important
    }

    .mejs__chapters-button {
        margin: auto 5px auto -10px
    }

    .mejs__jump-forward-button {
        margin-left: 0
    }

    .mejs__volume-button {
        margin-left: 5px
    }

    #audio-naslov,
    #audio-naslov-RDS {
        left: 5vw;
        width: calc(100% - 10vw);
        margin: 1.5rem auto 1.2rem auto;
        font-size: .75rem;
        line-height: 1rem
    }

    .mejs__time-total,
    .mejs__time-buffering,
    .mejs__time-loaded,
    .mejs__time-current,
    .mejs__time-float,
    .mejs__time-hovered,
    .mejs__time-float-current,
    .mejs__time-float-corner,
    .mejs__time-marker {
        height: 8px
    }

    body#page-top.player-open .scroll-to-top {
        bottom: 9rem
    }

    .vec-vsebina.player {
        bottom: 9rem
    }
}

@media (min-width:768px) {
    .podcast-modal .podcast-modal-dialog {
        min-height: 100vh;
        padding: 5rem;
        margin: 3rem calc(3rem - 8px)
    }

    .podcast-modal .podcast-modal-dialog h2 {
        font-size: 3rem
    }

    section {
        padding: 9rem 0 2rem 0 !important
    }

    section h2 {
        font-size: 1.8rem;
        line-height: 1.6rem
    }

    section h3 {
        padding: 0;
        font-size: 1.6rem;
        line-height: 1.6rem
    }

    section h4 {
        padding: 0;
        font-size: 1.3rem;
        line-height: 1.4rem
    }
}

@media (min-width:992px) {
    section h2 {
        font-size: 2.5rem;
        line-height: 2.3rem
    }
}

@media (min-width:1024px) {
    section h4 {
        padding: 0;
        font-size: 1.5rem;
        line-height: 1.6rem
    }
}

@media (max-width:576px) {
    .overlay a {
        font-size: .75rem
    }

    .overlay a i {
        font-size: 1.1rem
    }

    .overlay .closebtn {
        font-size: 35px;
        top: .8vh
    }

    .overlay#myPlayer .closebtn {
        top: 3.8rem;
        right: 5.5vw;
        font-size: 2rem
    }

    .search-overlay .closebtn {
        top: 1rem
    }

    #search-results .search-content {
        box-shadow: 1px 2px 10px lightgrey;
        margin-top: 2rem !important
    }
}