@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700;800&display=swap');

/* Box sizing rules */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
    margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role="list"],
ol[role="list"] {
    list-style: none;
}

/* Set core root defaults */
html:focus-within {
    scroll-behavior: smooth;
}

/* Set core body defaults */
body {
    min-height: 100vh;
    text-rendering: optimizeSpeed;
    line-height: 1.5;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
    text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img,
picture {
    max-width: 100%;
    display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
    font: inherit;
}

/* Remove all animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
    html:focus-within {
        scroll-behavior: auto;
    }
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/*Bootstrap*/
.flex-column {
    flex-direction: column!important;
}

.h-100 {
    height: 100%!important;
}

.d-flex {
    display: flex!important;
}

.py-3 {
    padding-top: 1rem!important;
    padding-bottom: 1rem!important;
}

.mt-auto {
    margin-top: auto!important;
}

.donate {
    background-color: #FE338C;
    text-align: center;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #fff;
    text-transform: uppercase;
}

.donate a {
    display: block;
    color: #fff;
    text-decoration: none;
}

.donate a:hover {
    text-decoration: underline;
}

/*Player*/
#player {
    position: fixed;
    width: 100%;
    background-color: rgba(26,26,26,0.9);
    z-index: 100;
}

.player_wrap {
    display: flex;
    height: 89px;
}

#player .container {
    position: relative;
}

.logo {
    position: absolute;
    top: 25px;
    left: 85px;
}

.logo.christmaslogo {
    top: 26px;
}

/*Основные стили страницы*/
body {
    font-family: 'Montserrat', sans-serif;
    margin: 0;
}

.container {
    width: 100%;
    max-width: 1920px;
    padding: 0 15px;
    margin: 0 auto;
}

.cont {
    width: 100%;
    max-width: 1250px;
    margin: 0 auto;
}

header {
    background-color: #000;
}

#page header.main .container {
    display: flex;
    position: relative;
    z-index: 100;
    justify-content: center;
    align-items: center;
    height: 887px;
    background-repeat: no-repeat;
    background-size: cover;
}

header .top {
    position: absolute;
    left: 0;
    top: 122px;
    width: 100%;
    padding-top: 27px;
    padding-bottom: 27px;
    background-color: #E7E7E7;
}

header.main .top {
    /*position: relative;*/
    z-index: 2;
    padding-top: 0;
    padding-bottom: 0;
    top: 152px;
    background-color: transparent;
}

header .intro {
    position: relative;
    text-align: center;
    color: #fff;
    z-index: 2;
}

.menu ul {
    display: flex;
    margin: 0;
    padding: 0;
}

.menu ul li {
    font-size: 14px;
    font-weight: 700;
    color: #000;
    margin: 0 15px;
    list-style: none;
}

header.main .menu ul li {
    text-shadow: #000000 1px 0 30px;
    color: #fff;
}

.menu ul li a {
    color: inherit;
    text-decoration: none;
    text-transform: uppercase;
}

header.main .menu ul li a {
    color: #fff
}

.menu ul li a:hover,
.menu ul li.active a {
    /*text-decoration: underline;*/
    color: #FE338C;
}

header .intro h1 {
    margin: 0;
    font-size: 64px;
    line-height: 78px;
}

header .intro .title {
    font-weight: bold;
    margin: 0;
    font-size: 64px;
    line-height: 78px;
}

header .intro .subtitle {
    font-size: 18px;
    line-height: 26px;
    margin-top: 40px;
}

header .top .cont {
    display: flex;
    position: relative;
}

header .top .actions {
    position: absolute;
    right: 0;
}

header .top .actions ul {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
}

header .top .actions ul li {
    list-style: none;
    margin-left: 10px;
    margin-right: 10px;
}

#onair {
    margin-top: 70px;
}

#onair .cont {
    display: flex;
    flex-wrap: nowrap;
}

#onair .program_onair {
    position: relative;
    width: 50%;
    border-radius: 10px;
    overflow: hidden;
}

#onair .links {
    display: block;
    margin-top: 50px;
}

.program_onair .playbut {
    position: absolute;
    top: 7px;
    left: 7px;
    width: 62px;
    height: 62px;
    background-image: url('../img/play_onair.svg');
    background-repeat: no-repeat;
}

#onair .program_onair_opys {
    width: 50%;
    padding-left: 40px;
}

#onair .title {
    color: #FE338C;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 30px;
    text-align: center;
}

#onair .title .cont {
    display: flex;
}

#onair .programtitle {
    color: #000;
    font-size: 30px;
    font-weight: 700;
    margin-top: 15px;
}

#onair .programtitle a {
    color: #000;
}

#onair .programintro {
    margin-top: 15px;
}

#onair .program_onair_opys p {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 30px;
}

#onair .program_onair_opys p a {
    color: #FE338C;
    font-weight: bold;
}

.program_onair_opys .program_next {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 18px;
}

.program_onair_opys .program_next_opys {
    display: flex;
}

.program_next_opys_img {
    margin-right: 15px;
    border-radius: 10px;
    overflow: hidden;
}

.program_next_title {
    font-size: 24px;
    line-height: 1.2;
    font-weight: 700;
}

#programsmain {
    margin-top: 123px;
}

#programsmain ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    justify-content: space-between;
}

#programsmain ul li {
    list-style: none;
    margin-bottom: 10px;
}

#programsmain ul li:nth-child(7),
#programsmain ul li:nth-child(8),
#programsmain ul li:nth-child(9) {
    margin-bottom: 0;
}

#programsmain .stitle {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 32px;
    text-align: center;
}

#programsmain .cont {
    position: relative;
}

.programsmain_wrap {
    background-color: #F8F8F8;
}

#about {
    margin-top: 166px;
}

#about .cont {
    min-height: 544px;
    background-image: url('../img/about.jpeg');
    background-repeat: no-repeat;
    background-size: contain;
}

.about {
    float: right;
    width: 45%;
}

.about .title {
    text-align: center;
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 15px;
}

.about ul {
    margin: 0;
    padding: 0;
}

.about ul li {
    font-size: 18px;
    list-style: none;
}

.about .but {
    text-align: center;
    margin-top: 50px;
}

a.butmore {
    background-color: #FE338C;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 100px;
    color: #FAFAFA;
    font-size: 14px;
    font-weight: 700;
    padding: 13px 22px 10px;
    text-decoration: none;
    line-height: 1;
}

button.butmore {
    background-color: #FE338C;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 100px;
    color: #FAFAFA;
    font-size: 14px;
    font-weight: 700;
    padding: 14px 22px 11px;
    text-decoration: none;
    border: none;
    line-height: 1;
}

a.butmore:hover {
    background-color: #2DDBE2;
}

button.butmore:hover {
    background-color: #2DDBE2;
    cursor: pointer;
}

#dovira {
    background-color: #121212;
    margin-top: 166px;
}

#dovira .cont {
    display: flex;
    justify-content: center;
    align-items: center;
}

.dovira_about {
    color: #fff;
    padding-left: 30px;
}

.dovira_about .title {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 38px;
}

.dovira_about p {
    font-size: 18px;
}

.dovira_about .number {
    margin-top: 26px;
    font-size: 48px;
    font-weight: 700;
}

.dovira_about .number a {
    text-decoration: none;
    color: inherit;
}

.dovira_about .number a:hover {
    text-decoration: underline;
}

#apps {
    text-align: center;
    margin-top: 109px;
    overflow: hidden;
}

#apps .cont {
    position: relative;
    padding-bottom: 110px;
}

#apps .title {
    font-size: 36px;
    font-weight: 700;
    line-height: 43px;
    margin-bottom: 38px;
}

#apps p {
    font-size: 18px;
    margin-bottom: 51px;
}

#apps .butmore {
    margin: 0 10px;
}

.appimg {
    position: absolute;
    left: -215px;
    bottom: -170px;
}

footer {
    background-color: #0A0A0A;
    padding-top: 80px;
    padding-bottom: 30px;
}

.logof {
    margin-left: 63px;
}

.fcont {
    display: flex;
}

.fmenu {
    padding-top: 10px;
}

.fmenu ul {
    display: flex;
    margin: 0 0 0 30px;
    padding: 0;
}

.fmenu ul li {
    font-size: 14px;
    margin-left: 15px;
    margin-right: 15px;
}

.fmenu ul li a {
    color: #fff;
    text-decoration: none;
}

.fmenu ul li a:hover {
    text-decoration: underline;
}

.fcopy {
    font-size: 12px;
    margin-top: 50px;
    margin-left: 63px;
    color: #fff;
}

.link_schedule {
    display: inline-block;
    width: 45px;
    height: 65px;
    position: absolute;
    left: -45px;
    top: 0;
    background-color: #FE338C;
    background-image: url('../img/icon-calendar.svg');
    background-position: center;
    background-size: 26px 26px;
    background-repeat: no-repeat;
}

.link_all_programs {
    display: inline-block;
    width: 45px;
    height: 65px;
    position: absolute;
    right: -45px;
    bottom: 0;
    background-color: #FE338C;
    background-image: url('../img/icon-arrow.svg');
    background-position: center;
    background-size: 26px 26px;
    background-repeat: no-repeat;
    text-indent: -9999px;
}

.link {
    color: #fff;
}

.jp-play {
    display: inline-block;
    width: 55px;
    height: 50px;
    background-image: url('../img/player_play.svg');
    background-repeat: no-repeat;
    background-size: 50px 50px;
    margin-right: 40px;
    margin-top: 10px;
}

.jp-pause {
    display: inline-block;
    width: 55px;
    height: 50px;
    background-size: 50px 50px;
    margin-right: 40px;
    background-image: url('../img/button_pause.svg');
    background-repeat: no-repeat;
    text-indent: -99999px;
    margin-top: 10px;
}

.player {
    display: flex;
    height: 89px;
    align-items: center;
}

.jp-progress {
    display: flex;
    height: 89px;
    width: 100%;
}

.player_col {
    height: 89px;
}

.player_image {
    display: flex;
    align-items: center;
}

.rt-song-name {
    font-size: 16px;
    line-height: 1.2;
    height: 21px;
    overflow: hidden;
    color: #fff;
    font-weight: 700;
}

.player_img {
    display: inline-block;
    overflow: hidden;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    border-radius: 7px;
    width: 56px;
    height: 56px;
    margin-right: 15px;
}

.player_title {
    display: flex;
    align-items: center;
}

#jp-play-range,
#jp-volume-range {
    -webkit-appearance: none;
    margin-right: 15px;
    width: 500px;
    height: 7px;
    background: #FE338C;
    border-radius: 5px;
    background-image: linear-gradient(#2EDBE2, #2EDBE2);
    background-size: 0% 100%;
    background-repeat: no-repeat;
}

#jp-volume-range {
    width: 131px;
}

.jp-current-time {
    color: #fff;
    font-size: 14px;
}

/* Input Thumb */
#jp-play-range::-webkit-slider-thumb,
#jp-volume-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: #2EDBE2;
    cursor: ew-resize;
    box-shadow: 0 0 2px 0 #555;
    transition: background .3s ease-in-out;
}

#jp-play-range::-moz-range-thumb,
#jp-volume-range::-moz-range-thumb {
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: #2EDBE2;
    cursor: ew-resize;
    box-shadow: 0 0 2px 0 #555;
    transition: background .3s ease-in-out;
}

#jp-play-range::-ms-thumb,
#jp-volume-range::-ms-thumb {
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: #2EDBE2;
    cursor: ew-resize;
    box-shadow: 0 0 2px 0 #555;
    transition: background .3s ease-in-out;
}

#jp-play-range::-webkit-slider-thumb:hover,
#jp-volume-range::-webkit-slider-thumb:hover {
    background: #2EDBE2;
}

#jp-play-range::-moz-range-thumb:hover,
#jp-volume-range::-moz-range-thumb:hover {
    background: #2EDBE2;
}

#jp-play-range::-ms-thumb:hover,
#jp-volume-range::-ms-thumb:hover{
    background: #2EDBE2;
}

/* Input Track */
#jp-play-range::-webkit-slider-runnable-track,
#jp-volume-range::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

#jp-play-range::-moz-range-track,
#jp-volume-range::-moz-range-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

#jp-play-range::-ms-track,
#jp-volume-range::-ms-track {
    -webkit-appearance: none;
    box-shadow: none;
    border: none;
    background: transparent;
}

output {
    background: #ff4500;
    padding: 5px 16px;
    border-radius: 3px;
    color: #fff;
}

.jp-volume-controls {
    display: flex;
    align-items: center;
    padding-top: 30px;
}

.jp-volume-max {
    border: none;
    background-image: url('../img/volume_plus.svg');
    background-position: center center;
    background-repeat: no-repeat;
    background-color: transparent;
    text-indent: -9999px;
    width: 26px;
    height: 26px;
}

.jp-mute {
    border: none;
    background-image: url('../img/volume_minus.svg');
    background-position: center center;
    background-repeat: no-repeat;
    background-color: transparent;
    text-indent: -9999px;
    width: 22px;
    height: 22px;
}

.righted {
    margin-left: auto;
}

.menumob {
    display: none;
}

.top_mob {
    position: relative;
    z-index: 5;
    display: none;
}

main {
    margin-top: 200px;
}

main.mainpage {
    margin-top: 0;
}

.page_header {
    margin-bottom: 30px;
    padding-top: 15px;
}

#program {
    margin-bottom: 50px;
}

#programs .program_item {
    display: flex;
    padding-bottom: 70px;
    margin-bottom: 70px;
    border-bottom: 2px solid rgba(209, 209, 209, 0.5);
}

#programs .program_img {
    width: 381px;
    max-width: 100%;
    margin-right: 70px;
}

#programs .program_img img {
    filter: drop-shadow(10px 10px 30px rgba(0, 0, 0, 0.25));
    border-radius: 10px;
    max-width: 100%;
}

#programs .program_desc {
    flex: 1 0;
}

#programs .program_desc .progtam_title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 20px;
}

#programs .program_desc .progtam_title a {
    color: inherit;
    text-decoration: none;
}

#programs .program_desc .progtam_title a:hover {
    text-decoration: underline;
}

.page_program {
    padding-top: 30px;
}

.page_program .program_desc {
    min-height: 501px;
    background-image: url('../img/bg-program.svg');
    background-repeat: no-repeat;
    background-position: center 0px;
}

.page_program .program_image {
    text-align: center;
    margin-bottom: 36px;
}

.page_program .program_image img {
    border-radius: 10px;
    margin: 0 auto;
}

.page_program .program_title {
    text-align: center;
    margin-bottom: 30px;
    font-size: 24px;
}

.page_program .program_intro {
    margin: 0 auto;
    max-width: 770px;
    text-align: left;
}

.page_program .program_items {
    margin-top: 100px;
}

.page_program .program_items .subtitle {
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    border-bottom: 2px solid rgba(209, 209, 209, 0.5);
    padding-bottom: 17px;
}

.program_items .program_item {
    margin-top: 33px;
    padding-bottom: 33px;
    border-bottom: 2px solid rgba(209, 209, 209, 0.5);
}

.program_items .program_item:last-child {
    border: none;
}

.program_items .program_item .program_item-image {
    margin-bottom: 15px;
}

.program_items .program_item .program_item-image img {
    border-radius: 10px;
    margin: 0 auto;
}

.program_items .program_item .program_item-title {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    max-width: 745px;
    margin: 0 auto;
}

.program_items .program_item .program_item-title a {
    color: inherit;
    text-decoration: none;
}

.program_items .program_item .program_item-title a:hover {
    text-decoration: underline;
}

.program_items .program_item .program_item-date {
    color: rgba(0, 0, 0, 0.5);
    font-size: 16px;
    text-align: center;
    margin-bottom: 15px;
}

.program_items .program_item .program_item-desc {
    max-width: 745px;
    margin: 0 auto;
    text-align: left;
}

.program_items .program_item .program_item-but {
    margin-top: 30px;
    text-align: center;
}

.program_items .program_item .program_item-but a,
.program_items .program_item .program_item-but button {
    margin-left: 10px;
    margin-right: 10px;
}

ul.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 50px 0 70px;
    padding: 0;
}

ul.pagination li {
    list-style: none;
    font-size: 18px;
}

ul.pagination li a {
    color: #000;
    text-decoration: none;
    padding-left: 5px;
    padding-right: 5px;
}

ul.pagination li.active span {
    color: #FE338C;
    padding-left: 5px;
    padding-right: 5px;
}

ul.pagination li a:hover {
    text-decoration: underline;
}

#schedule .cont {
    max-width: 730px;
    margin: 0 auto;
}

.schedule-block .program {
    display: flex;
    align-items: center;
    font-size: 18px;
    font-weight: 700;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 2px solid rgba(209, 209, 209, 0.5);
    color: #000;
    text-decoration: none;
}

.schedule-block .program:last-child {
    border: none;
}

.schedule-block .program:hover {
    text-decoration: underline;
}

.schedule-block .program > span.program-time {
    flex: 1;
    text-align: right;
    padding-right: 30px;
}

.schedule-block .program > span.program-name {
    flex: 1;
    padding-left: 30px;
}

.schedule-block .program .program-image {
    border-radius: 10px;
}

.schedule-block .weekdays {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 95px;
}

.schedule-block .weekdays a {
    display: block;
    padding: 6px 11px;
    border-radius: 10px;
    background: #FE338C;
    line-height: 1;
    text-decoration: none;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}

.schedule-block .weekdays a.active {
    background: #2EDBE2;
}

#schedule .cont h1 {
    font-size: 24px;
    margin-bottom: 30px;
    text-align: center;
    padding-top: 15px;
}

.team-items {
    display: flex;
    flex-wrap: wrap;
}

.team-item {
    width: 33.33%;
    text-align: center;
    margin-bottom: 70px;
}

.team-item .team-photo {
    display: inline-block;
    border-radius: 130px;
    overflow: hidden;
    margin-right: 15px;
    margin-left: 15px;
}

.team-item .team-photo.gender1 {
    border: 4px solid #2EDBE2;
}

.team-item .team-photo.gender2 {
    border: 4px solid #FE338C;
}

.team-item .itemimg {
    margin-bottom: 15px;
}

.team-item .itemtit,
.team-item .itemintro {
    color: #000;
    padding-left: 15px;
    padding-right: 15px;
}

.team-item .itemtit {
    font-size: 18px;
    margin-bottom: 5px;
}

.team-item .itemtit a {
    color: inherit;
    text-decoration: none;
}

.team-item .itemintro {
    font-size: 14px;
}

.team-title {
    text-align: center;
}

#blog {
    margin-bottom: 100px;
}

#blog .blogwrap {
    display: flex;
    flex-wrap: wrap;
}

#blog .blogitem {
    width: 50%;
}

#blog .blogitem {
    text-align: center;
    margin-bottom: 70px;
}

#blog .blogitem .itemtit {
    font-size: 18px;
    width: 100%;
    max-width: 381px;
    margin: 0 auto 15px;
}

#blog .blogitem .itemtit a {
    color: inherit;
}

#blog .blogitem .itemimg img {
    display: inline-block;
    width: 100%;
    max-width: 381px;
    border-radius: 10px;
    margin: 0 auto;
}

#blog .blogitem .itemimg {
    margin-bottom: 15px;
}

div.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 50px 0 70px;
    padding: 0;
}

div.pagination a {
    display: inline-block;
    font-size: 18px;
    color: #000;
    text-decoration: none;
    padding-left: 5px;
    padding-right: 5px;
}

div.pagination b {
    font-size: 18px;
    color: #FE338C;
    padding-left: 5px;
    padding-right: 5px;
}

#blog .pagination {
    margin-top: 0px;
}

#blog .blogitem .itemsum {
    width: 381px;
    margin: 0 auto;
}

#blog-item {
    margin-bottom: 70px;
}

#blog-item .cont {
    width: 100%;
    max-width: 740px;
    padding-left: 15px;
    padding-right: 15px;
}

#blog-item .cont p {
    margin-bottom: 15px;
}

#blog-item .blog-item-img img {
    max-width: 381px;
    margin: 0 auto;
    border-radius: 10px;
}

#blog-item .blog-item-img {
    margin-bottom: 30px;
}

#blog-item li {
    margin-bottom: 15px;
}

.page_header h1 {
    text-align: center;
}

#text {
    margin-bottom: 70px;
}

#text .cont {
    max-width: 740px;
}

#text .cont p {
    margin-bottom: 15px;
}

#search {
    text-align: center;
    margin-bottom: 30px;
}

#search input {
    border: 1px solid #FE338C;
    border-radius: 5px;
    padding: 5px 20px;
    min-width: 300px;
    outline-color: #2EDBE2;
    margin-bottom: 15px;
    text-align: center;
}

.noresult {
    text-align: center;
}

.payabout {
    margin-bottom: 15px;
}

.payur {
    margin-top: 30px;
}

.payur .title {
    margin-bottom: 30px;
}

#donate .docs {
    margin-top: 30px;
}

#donate .docs li {
    list-style: none;
}

#donate .docs ul {
    margin: 0;
    padding: 0;
}

#donate .docs li a {
    color: #FE338C;
}

#donate .cont {
    width: 100%;
    max-width: 740px;
}

#donate img {
    display: inline;
    margin: 0;
    width: auto;
}

.cards_logo {
    margin-top: 15px;
}

#search-result .program_items {
    margin-top: 30px;
}

.statinfo {
    text-align: center;
    color: #FE338C;
}

.player_menu {
    position: relative;
    margin-right: 30px;
    margin-top: 10px;
}

.player_menu_but {
    width: 36px;
    height: 25px;
    background-image: url('../img/menu_player.svg');
    background-repeat: no-repeat;
    background-size: 36px 25px;
    cursor: pointer;
}

.player_menu_but.active {
    background-image: url('../img/menu_player_active.svg');
}

.player_menu_but .player_menu_cont {
    display: none;
    position: absolute;
    left: 50px;
    top: -37px;
    height: 89px;
    background-color: rgba(26,26,26,0.9);
    z-index: 100;
    min-width: 750px;
}

.player_menu_but .player_menu_cont.active {
    display: block;
}

.player_menu_but .player_menu_cont ul {
    display: flex;
    margin: 0;
    padding: 0;
    align-items: center;
    height: 89px;
    user-select: none;
}

.player_menu_but .player_menu_cont ul li {
    width: auto;
    text-align: center;
    white-space: nowrap;
    list-style: none;
}

.player_menu_but .player_menu_cont ul li a {
    position: relative;
    color: #fff;
    display: flex;
    padding-left: 20px;
    padding-right: 20px;
    text-decoration: none;
    height: 89px;
    align-items: center;
    /*border-right: 1px solid #FE338C;*/
    margin-right: 1px;
}

.player_menu_but .player_menu_cont ul li a:after {
    content: '';
    position: absolute;
    right: -1px;
    top: 15px;
    height: 59px;
    width: 1px;
    background-color: #FE338C;
}

.player_menu_but .player_menu_cont ul li a:hover {
    background-color: #FE338C;
}

.player_menu_but .player_menu_cont ul li a.active {
    background-color: #FE338C;
}

.team-member_about {
    text-align: center;
    margin-bottom: 70px;
    padding-left: 15px;
    padding-right: 15px;
}

.team-member_about .pimg {
    margin-bottom: 36px;
}

.team-member_about .pimg img {
    border-radius: 185px;
    margin-left: auto;
    margin-right: auto;
}

.team-member_about h1 {
    font-size: 36px;
    line-height: 1.1;
    margin-bottom: 15px;
}

.team-member_about .intro {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 30px;
}

.coopis {
    max-width: 770px;
    margin-left: auto;
    margin-right: auto;
}

.coopis p {
    margin-bottom: 15px;
}

.page_header-programs h1 {
    text-align: left;
}

.day_title {

}

#ether .pimg {
    margin-bottom: 30px;
}

#ether .pimg img {
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
}

#ether h1 {
    text-align: center;
    margin-bottom: 15px;
    font-size: 30px;
}

#ether .programtitle {
    text-align: center;
    margin-bottom: 30px;
}

#ether .programtitle a {
    color: inherit;
}

#ether .intro {
    margin-bottom: 30px;
    width: 100%;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

#ether .buts {
    text-align: center;
    margin-bottom: 30px;
}

#ether .buts > a,
#ether .buts > button {
    margin-left: 10px;
    margin-right: 10px;
}

.main {
    position: relative;
}

.bgc {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
}

header.main {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.program-desc {
    display: block;
    margin-left: 15px;
}

.program-time {
    display: block;
    font-size: 26px;
}

.butarch {
    margin-bottom: 50px;
    text-align: center;
    font-size: 30px;
}

.butarch a.butmore {
    font-size: 20px;
}

.program-but {
    color: #FE338C;
    font-size: 24px;
    text-decoration: none;
    margin-left: 20px;
    margin-right: 20px;
    cursor: pointer;
}

.team-item {
    padding-left: 15px;
    padding-right: 15px;
}

.team-item .itemimg img {
    border-radius: 10px;
}

.team-item .itemimg {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    width: 260px;
    height: 0;                 /* Задаємо висоту як 0 */ /* Відступ внизу рівний 100% ширини елемента, що забезпечує співвідношення сторін 1:1 */
    overflow: hidden;/* Сховати вміст, який може виходити за межі блоку */
}

.team-item .top-image, .bottom-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transition: opacity 0.4s; /* анімація зміни прозорості */
}

.team-item .top-image:hover {
    opacity: 0; /* зробити прозорим при наведенні */
}

.team_ai {
    text-align: center;
    margin-bottom: 50px;
    font-size: 20px;
}

.team_ai a {
    display: inline-block;
    border-radius: 10px;
    line-height: 1;
    color: #FE338C;
    font-size: 20px;
    font-weight: 700;
    margin: 10px 10px;
    text-decoration: underline;
}

.team_ai a.active {
    text-decoration: none;
    color: #2EDBE2;
}

.contacts .phones {
    font-size: 20px;
    text-align: center;
}

.contacts .phones div {
    margin-bottom: 30px;
}

.contacts .phones .small {
    font-size: 14px;
}

.contacts .phones div a {
    color: inherit;
}

.contacts .phones .number {
    font-size: 30px;
}

.contacts .ss {
    text-align: center;
    margin-bottom: 50px;
}

.contacts .ss .icon {
    text-align: center;
}

.contacts .ss .icon img {
    display: inline-block;
}

.contacts .ss ul {
    padding: 0;
}

.contacts .ss ul li {
    list-style: none;
    padding: 0;
}

.contacts .ss .title {
    font-size: 20px;
}

.contacts .ss a {
    color: inherit;
}

.contacts .ss a:hover {
    color: #FE338C;
}

.contacts .content {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: 600px;
    max-width: 100%;
    margin-bottom: 50px;
}

.contacts .content p {
    margin-bottom: 15px;
}

.contacts .content .title {
    font-size: 20px;
    margin-bottom: 15px;
}















@media (max-width: 1920px) {

    #jp-play-range, #jp-volume-range {
        width: 400px;
    }

    #jp-volume-range {
        width: 131px;
    }

    .player {
        margin-left: 200px;
    }

}



@media (max-width: 1439px) {
    #jp-play-range, #jp-volume-range {
        width: 200px;
    }

    #jp-volume-range {
        width: 131px;
    }

    .logo {
        left: 15px;
    }

    .player {
        margin-left: 200px;
    }

    .jp-play {
        width: 55px;
        margin-right: 15px;
    }

    #programsmain .links {
        position: absolute;
        bottom: -70px;
        width: 100%;
        text-align: center;
    }

    a.link_all_programs {
        display: inline-block;
        background-color: #FE338C;
        box-shadow: 0px 4px 4px rgb(0 0 0 / 25%);
        border-radius: 100px;
        color: #FAFAFA;
        font-size: 14px;
        font-weight: 700;
        padding: 13px 22px 10px;
        text-decoration: none;
        position: relative;
        right: auto;
        background-image: none;
        width: auto;
        height: auto;
        margin: 0 auto;
        text-indent: 0px;
    }

    .program_onair img {
        height: auto;
    }

    .programsmain_wrap li {
        width: 32%;
    }

    .link_schedule {
        display: none;
    }
}


@media (max-width: 1023px) {

    body.active {
        overflow-y: hidden;
    }

    #player {
        height: 118px;
    }

    .player {
        margin-left: 0;
        height: 70px;
    }

    .player_title {
        align-items: baseline;
    }

    .jp-progress {
        height: 70px;
        padding-top: 12px;
    }

    header .top {
        display: none;
    }

    header.main .top {
        display: block;
        position: absolute;
    }

    .menumob.active {
        display: block;
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        align-items: stretch;
        z-index: 100;
        background-color: rgba(26,26,26,0.9);
    }

    .menuwrap {
        height: 100%;
        flex: 1;
    }

    .top_mob {
        display: block;
        position: fixed;
        top: 0px;
        left: 0;
        width: 100%;
        height: 50px;
        background-color: #000;
    }

    .top_mob .logo {
        position: relative;
        top: 0;
        left: 0;
        z-index: 101;
        text-align: center;
        margin-top: 10px;
    }

    .top_mob .logo img {
        width: 130px;
        display: inline;
    }

    .menumob nav {
        margin-top: 70px;
    }

    .menumob nav ul {
        margin: 0;
        padding: 0;
    }

    .menumob nav ul li a {
        color: #fff;
        text-decoration: none;
        display: block;
        text-align: center;
        text-transform: uppercase;
        font-weight: 700;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .mmenubl {
        position: fixed;
        right: 15px;
        top: 0;
        background-color: transparent;
        z-index: 101;
    }

    .c-hamburger {
        display: block;
        overflow: hidden;
        margin: 0;
        padding: 0;
        width: 45px;
        height: 45px;
        font-size: 0;
        text-indent: -9999px;
        appearance: none;
        box-shadow: none;
        border: none;
        cursor: pointer;
        transition: background 0.3s;
    }

    .c-hamburger span {
        display: block;
        position: absolute;
        top: 20px;
        left: 7px;
        right: 7px;
        height: 5px;
        background: white;
    }

    .c-hamburger span::before, .c-hamburger span::after {
        position: absolute;
        display: block;
        left: 0;
        width: 100%;
        height: 5px;
        background-color: #fff;
        content: "";
    }

    .c-hamburger span::before {
        top: -12px;
    }

    .c-hamburger--htx span::before, .c-hamburger--htx span::after {
        transition-duration: 0.3s, 0.3s;
        transition-delay: 0.3s, 0s;
    }

    .c-hamburger--htx span::before {
        transition-property: top, transform;
    }

    .c-hamburger span::after {
        bottom: -12px;
    }

    .c-hamburger--htx span::after {
        transition-property: bottom, transform;
    }

    .c-hamburger--htx {
        background-color: transparent;
    }
    .c-hamburger--htx span {
        transition: background 0s 0.3s;
    }
    .c-hamburger--htx span::before,
    .c-hamburger--htx span::after {
        transition-duration: 0.3s, 0.3s;
        transition-delay: 0.3s, 0s;
    }
    .c-hamburger--htx span::before {
        transition-property: top, transform;
    }
    .c-hamburger--htx span::after {
        transition-property: bottom, transform;
    }
    /* состояние active при открытом меню  */
    .c-hamburger--htx.is-active {
        background-color: transparent;
    }
    .c-hamburger--htx.is-active span {
        background: none;
    }
    .c-hamburger--htx.is-active span::before {
        top: 0;
        transform: rotate(45deg);
    }
    .c-hamburger--htx.is-active span::after {
        bottom: 0;
        transform: rotate(-45deg);
    }
    .c-hamburger--htx.is-active span::before,
    .c-hamburger--htx.is-active span::after {
        transition-delay: 0s, 0.3s;
    }

    header {
        background-color: #000;
    }

    header.main .container {
        position: relative;
        height: auto !important;
    }

    header .top .cont {
        position: static;
    }

    header .intro {
        position: relative;
        z-index: 2;
        padding-top: 50px;
        padding-bottom: 50px;
    }

    header .intro h1 {
        font-size: 30px;
        line-height: normal;
    }

    header .intro .title {
        font-size: 24px;
        line-height: normal;
    }

    .actions {
        width: 100%;
        bottom: -90px;
    }

    #player {
        position: fixed;
        bottom: 0;
    }

    #player .logo {
        display: none;
    }

    .jp-seek-bar {
        display: none;
    }

    .menu {
        display: none;
    }

    .fmenu {
        display: none;
    }

    #about {
        display: flex;
        padding-left: 15px;
        padding-right: 15px;
    }

    #about .about {
        display: block;
        width: 100%;
        padding-top: 275px;
    }

    .about .title {
        font-size: 36px;
    }

    #jp-play-range {
        display: none;
    }

    .player_image {
        display: none;
    }

    .jp-play,
    .jp-pause {
        width: 60px;
        margin-right: 20px;
    }

    #dovira {
        margin-top: 70px;
        padding-right: 15px;
        padding-left: 15px;
    }

    #dovira .cont {
        display: block;
        padding-top: 15px;
    }

    #dovira img {
        height: auto;
        max-width: 100%;
        margin: 0 auto;
    }

    .dovira_about {
        padding-left: 0;
        padding-bottom: 30px;
        padding-top: 25px;
    }

    #onair .cont {
        display: block;
    }

    .link_schedule {
        display: none;
    }

    .link_all_programs {
        display: none;
    }

    #onair {
        margin-top: 100px;
        padding-left: 15px;
        padding-right: 15px;
    }

    #onair .links {
        display: block;
        text-align: center;
        margin-top: 50px;
    }

    #onair .program_onair {
        width: 100%;
        margin-bottom: 30px;
    }

    #onair .program_onair img {
        height: auto;
    }

    #onair .program_onair_opys {
        width: 100%;
        padding: 0;
    }

    #programsmain {
        margin-top: 70px;
    }

    #programsmain .programsmain_wrap {
        padding-left: 15px;
        padding-right: 15px;
    }

    #programsmain ul {
        display: flex;
        max-width: 820px;
        margin: 0 auto;
    }

    #programsmain ul li {
        margin-bottom: 0;
        width: 50%;
    }

    #programsmain ul li:last-child {
        display: none;
    }

    #programsmain ul li img {
        margin: 0 auto;
    }

    footer {
        padding-bottom: 130px;
    }

    #apps .cont {
        padding-bottom: 100px;
    }

    .appimg {
        display: none;
    }

    .jp-volume-controls {
        display: none;
    }

    #about .cont {
        min-height: 544px;
        background-image: url('../img/about_mob.jpg');
        background-repeat: no-repeat;
        background-size: auto 275px;
        background-position: center 0;
    }

    #programsmain .links {
        position: absolute;
        bottom: -70px;
        width: 100%;
        text-align: center;
    }

    a.link_all_programs {
        display: inline-block;
        background-color: #FE338C;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
        border-radius: 100px;
        color: #FAFAFA;
        font-size: 14px;
        font-weight: 700;
        padding: 13px 22px 10px;
        text-decoration: none;
        position: relative;
        right: auto;
        background-image: none;
        width: auto;
        height: auto;
        margin: 0 auto;
        text-indent: 0px;
    }

    a.link_all_programs:hover {
        background-color: #2DDBE2;
    }
    
    .page_header {
        text-align: center;
    }

    main {
        margin-top: 50px;
    }

    #programs {
        padding-left: 15px;
        padding-right: 15px;
    }

    .program_item {
        display: block;
        padding-bottom: 50px;
        margin-bottom: 50px;
    }

    .program_item .program_img {
        margin-bottom: 30px;
        margin-right: 0;
    }

    .program_item .program_img img {
        max-width: 100%;
    }

    .page_program .program_image img {
        width: 100%;
        height: auto;
        border-radius: 0;
        max-width: 100%;
    }

    .page_program {
        padding-top: 0;
    }

    .page_program .program_image {
        margin-bottom: 15px;
    }

    .page_program .program_title {
        margin-bottom: 15px;
        padding-left: 15px;
        padding-right: 15px;
    }

    .page_program .program_desc {
        min-height: auto;

    }

    .page_program .program_intro {
        padding-left: 15px;
        padding-right: 15px;
        text-align: left;
    }

    .page_program .program_items {
        margin-top: 50px;
    }

    .program_items .program_item {
        padding-left: 15px;
        padding-right: 15px;
    }

    .program_items .program_item .program_item-but a, .program_items .program_item .program_item-but button {
        margin-left: 0;
        margin-right: 0;
    }

    .page_header h1 {
        padding-left: 15px;
        padding-right: 15px;
    }

    #blog .blogitem {
        width: 100%;
    }

    #blog .cont {
        padding-left: 15px;
        padding-right: 15px;
    }

    #blog .blogitem .itemimg img {
        min-width: 100%;
    }

    .program-list {
        padding-left: 15px;
        padding-right: 15px;
    }

    #text .cont {
        padding-left: 15px;
        padding-right: 15px;
    }

    #donate .cont {
        padding-left: 15px;
        padding-right: 15px;
    }

    #donate .cont a {
        word-break: break-word;
    }

    .player_menu_but .player_menu_cont {
        height: 70px;
        top: -27px;
    }

    .player_menu_but .player_menu_cont ul {
        height: 70px;
    }

    .player_menu_but .player_menu_cont ul li a {
        height: 70px;
    }

    #team-member {
        margin-top: 80px;
    }

    #ether {
        padding-top: 15px;
        padding-left: 15px;
        padding-right: 15px;
    }

}


@media (max-width: 767px) {

    header.main .top {
        top: auto;
        bottom: -55px;
    }

    header.main .top .actions {
        bottom: 0;
    }

    header .intro .subtitle {
        font-size: 14px;
        line-height: 18px;
        margin-top: 20px;
    }

    header .intro .subtitle br {
        display: none;
    }

    #programsmain ul li {
        width: 100%;
        margin-bottom: 15px;
    }

    #programs .program_item {
        display: block;
        padding-bottom: 30px;
        margin-bottom: 30px;
    }

    .team-item {
        width: 50%;
    }

    .schedule-block .program {
        display: block;
    }

    .schedule-block .program span {
        display: block;
        text-align: center !important;
        padding: 0 !important;
    }

    .schedule-block .program .program-image {
        display: inline;
        width: auto;
    }

    .schedule-block .program span.program-time {
        margin-bottom: 15px;
    }

    .schedule-block .program span.program-name {
        margin-top: 15px;
    }

    .schedule-block .weekdays {
        margin-bottom: 50px;
    }

    footer {
        padding-top: 30px;
    }

    .fcont {
        justify-content: center;
    }

    .logof {
        margin-left: 0;
    }

    .fcopy {
        margin-left: 0;
        text-align: center;
    }

    .player_menu {
        margin-right: 10px;
    }

    /*.player_menu {*/
    /*    position: absolute;*/
    /*    right: -15px;*/
    /*    top: 40px;*/
    /*}*/

    .player .container {
        position: relative;
    }

    .jp-play, .jp-pause {
        width: 79px;
        margin-right: 10px;
    }

    #ether {
        padding-top: 15px;
        padding-left: 15px;
        padding-right: 15px;
    }
}


@media (max-width: 424px) {

    .team-item {
        width: 100%;
    }

}

.program_but {
    margin-top: 50px;
}

.program_but .butarch {
    margin-bottom: 0;
}

/* Загальний стиль для форми */
.vacancy-form {
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    max-width: 400px;
    margin: 20px auto;
    /*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);*/
    font-family: Arial, sans-serif;
}

.vacancy-form h2 {
    font-size: 20px;
    color: #333;
    margin-bottom: 15px;
    text-align: center;
}

.vacancy-form label {
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
    display: block;
}

.vacancy-form input[type="text"],
.vacancy-form input[type="tel"],
.vacancy-form input[type="email"],
.vacancy-form textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin-bottom: 15px;
    font-size: 14px;
}

.vacancy-form textarea {
    resize: vertical;
}

.vacancy-form button {
    width: 100%;
    padding: 12px;
    background-color: #007bff;
    color: #fff;
    border: none;
    border-radius: 5px;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.vacancy-form button:hover {
    background-color: #0056b3;
}

.vacancy-image {
    margin-bottom: 50px;
}

.vacancy-image img {
    border-radius: 30px;
    height: auto;
}