@import '../../../root/css/root.css';

.program-to-home-link_wrapper {
    margin: 0 0 50px 0;
}

/* ___PROGRAM-SECTION___ */
.program-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 135px 0 0 0;
}

.program-main_wrapper {
    display: flex;
    flex-direction: column;
    align-self: center;
    width: 1810px;
}

@media all and (max-width: 1810px) {
    .program-main_wrapper {
        display: flex;
        flex-direction: column;
        align-self: center;
        width: 100%;
    }
}

.program-buttons_wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 0 86px 0;
}

.program-buttons {
    display: flex;
    justify-content: center;
    margin: 0 0 40px 0;
}

.program-button_wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.program-button-date {
    font-family: Inter-Light, sans-serif;
    font-size: 22px;
    font-weight: 100;
    color: var(--blue-color);
    margin: 0 0 9px 0;
}

.program-button {
    font-family: Inter-Medium, sans-serif;
    font-size: 24px;
    font-weight: 100;
    color: var(--white-color);
    background: var(--blue-color);
    outline: none;
    border: none;
    padding: 30px 80px 30px 80px;
    margin: 0 72px 0 72px;
    cursor: pointer;
}

.program-button:hover {
    transition: var(--transition);
    background: var(--hover-color);
}

.program-button:not(:hover) {
    transition: var(--transition-not);
    background: var(--blue-color);
}

.program-button.active {
    color: var(--blue-color);
    background: var(--white-color);
    outline: 5px solid var(--blue-color);
    outline-offset: -5px;
}

.program-buttons-date-15-info, .program-buttons-date-16-info, .program-buttons-date-14-info {
    display: none;
    font-family: Inter-Light, sans-serif;
    font-size: 22px;
    font-weight: 100;
    text-align: center;
    color: var(--light-blue-color);
    margin: 0 var(--main-indent) 0 var(--main-indent);
}

.program-buttons-date-15-info.active , .program-buttons-date-16-info.active, .program-buttons-date-14-info.active {
    display: block;
}

/* ___program-items___ */
.program-items {
    display: flex;
    flex-direction: column;
}

.program-items-day-2-title {
    font-family: Inter-Regular, sans-serif;
    font-size: 28px;
    font-weight: 100;
    text-align: center;
    color: var(--white-color);
    margin: 0 var(--main-indent) 0 var(--main-indent);
    background: var(--blue-color);
    padding: 10px 5px 10px 5px;


}

.program-items-day-1, .program-items-day-2, .program-items-day-3 {
    display: none;
}

.program-items-day-1.active, .program-items-day-2.active, .program-items-day-3.active {
    display: flex;
    flex-direction: column;
}

.program-item {
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    box-shadow: 1px 4px 30px rgba(0, 0, 0, 0.09);
    box-sizing: border-box;
    margin: 0 var(--main-indent) 45px var(--main-indent);
    padding: 75px;
}

.program-item-time {
    font-family: Inter-Medium, sans-serif;
    font-size: 32px;
    font-weight: 100;
    color: var(--dark-text-color);
    white-space: nowrap;
}

.program-item-center {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin: 0 75px 0 75px;
}

.program-item-center-title {
    font-family: Inter-Medium, sans-serif;
    font-size: 40px;
    font-weight: 100;
    color: var(--light-blue-color);
    margin: 23px 0 23px 0;
}

.program-item-center-text {
    font-family: Inter-Regular, sans-serif;
    font-size: 22px;
    font-weight: 100;
    color: var(--light-text-color);
    margin: 15px 0 15px 0;
}

.program-item-center-bold-text {
    font-family: Inter-Medium, sans-serif;
    font-size: 24px;
    font-weight: 100;
    color: var(--dark-text-color);
    margin: 18px 0 18px 0;
}

.program-item-center-list {
    margin: 0 0 0 80px;
}

.program-item-center-list-item {
    font-family: Inter-Regular, sans-serif;
    font-size: 22px;
    font-weight: 100;
    color: var(--light-text-color);
    margin: 15px 0 15px 0;
}

.program-item-link {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--blue-color);
    border: none;
    outline: none;
    padding: 22px 41px 22px 41px;
    cursor: pointer;
    text-decoration: none;
}

.program-item-link:hover {
    transition: var(--transition);
    background: var(--hover-color);
}

.program-item-link:not(:hover) {
    transition: var(--transition-not);
    background: var(--blue-color)
}

.program-item-link-text {
    font-family: Inter-Medium, sans-serif;
    font-size: 24px;
    color: var(--white-color);
    margin: 0 7px 0 0;
    text-decoration: none;
}

@media all and (max-width: 1610px) {
    .program-to-home-link_wrapper {
        margin: 0 0 41px 0;
    }

    .program-section {
        margin: 112px 0 0 0;
    }

    .program-button-date {
        font-size: 18px;
        margin: 0 0 7px 0;
    }

    .program-buttons_wrapper {
        margin: 0 0 71px 0;
    }

    .program-buttons {
        margin: 0 0 33px 0;
    }

    .program-button {
        font-size: 20px;
        padding: 25px 66px 25px 66px;
        margin: 0 59px 0 59px;
    }

    .program-buttons-date-15-info, .program-buttons-date-16-info, .program-buttons-date-14-info {
        font-size: 18px;
    }

    .program-items-day-2-title {
        font-size: 23px;
    }

    .program-item {
        margin: 0 var(--main-indent) 37px var(--main-indent);
        padding: 62px;
    }

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

    .program-item-center {
        margin: 0 62px 0 62px;
    }

    .program-item-center-text {
        font-size: 20px;
        margin: 12px 0 12px 0;
    }

    .program-item-center-title {
        font-size: 33px;
    }

    .program-item-center-bold-text {
        font-size: 20px;
        margin: 15px 0 15px 0;
    }

    .program-item-center-list {
        margin: 0 0 0 66px;
    }

    .program-item-center-list-item {
        font-size: 20px;
        margin: 12px 0 12px 0;
    }

    .program-item-link {
        padding: 18px 34px 18px 34px;
    }

    .program-item-link-text {
        font-size: 20px;
        margin: 0 6px 0 0;
    }

    .program-item-link-image {
        width: 37px;
        height: 13px;
    }
}

@media all and (max-width: 1450px) {
    .program-to-home-link_wrapper {
        margin: 0 0 37px 0;
    }

    .program-section {
        margin: 101px 0 0 0;
    }

    .program-button-date {
        font-size: 16px;
        margin: 0 0 6px 0 ;
    }

    .program-buttons_wrapper {
        margin: 0 0 64px 0;
    }

    .program-buttons {
        margin: 0 0 30px 0;
    }

    .program-button {
        font-size: 18px;
        padding: 22px 59px 22px 59px;
        margin: 0 53px 0 53px;
    }

    .program-buttons-date-15-info, .program-buttons-date-16-info, .program-buttons-date-14-info {
        font-size: 16px;
    }

    .program-items-day-2-title {
        font-size: 21px;
    }

    .program-item {
        margin: 0 var(--main-indent) 37px var(--main-indent);
        padding: 56px;
    }

    .program-item-time {
        font-size: 23px;
    }

    .program-item-center {
        margin: 0 56px 0 56px;
    }

    .program-item-center-text {
        font-size: 18px;
        margin: 11px 0 11px 0;
    }

    .program-item-center-title {
        font-size: 30px;
    }

    .program-item-center-bold-text {
        font-size: 18px;
        margin: 13px 0 13px 0;
    }

    .program-item-center-list {
        margin: 0 0 0 59px;
    }

    .program-item-center-list-item {
        font-size: 18px;
        margin: 11px 0 11px 0;
    }

    .program-item-link {
        padding: 16px 30px 16px 30px;
    }

    .program-item-link-text {
        font-size: 18px;
        margin: 0 5px 0 0;
    }

    .program-item-link-image {
        width: 33px;
        height: 12px;
    }
}

@media all and (max-width: 1250px) {
    .program-to-home-link_wrapper {
        margin: 0 0 31px 0;
    }

    .program-section {
        margin: 86px 0 0 0;
    }

    .program-button-date {
        font-size: 13px;
        margin: 0 0 5px 0;
    }

    .program-buttons_wrapper {
        margin: 0 0 54px 0;
    }

    .program-items-day-2-title {
        font-size: 18px;
    }

    .program-buttons {
        margin: 0 0 26px 0;
    }

    .program-button {
        font-size: 15px;
        padding: 20px 50px 20px 50px;
        margin: 0 45px 0 45px;
    }

    .program-buttons-date-15-info, .program-buttons-date-16-info, .program-buttons-date-14-info {
        font-size: 13px;
    }

    .program-item {
        margin: 0 var(--main-indent) 37px var(--main-indent);
        padding: 47px;
    }

    .program-item-time {
        font-size: 19px;
    }

    .program-item-center {
        margin: 0 47px 0 47px;
    }

    .program-item-center-text {
        font-size: 15px;
        margin: 9px 0 9px 0;
    }

    .program-item-center-title {
        font-size: 25px;
    }

    .program-item-center-bold-text {
        font-size: 15px;
        margin: 11px 0 11px 0;
    }

    .program-item-center-list {
        margin: 0 0 0 50px;
    }

    .program-item-center-list-item {
        font-size: 15px;
        margin: 9px 0 9px 0;
    }

    .program-item-link {
        padding: 13px 25px 13px 25px;
    }

    .program-item-link-text {
        font-size: 15px;
        margin: 0 4px 0 0;
    }

    .program-item-link-image {
        width: 28px;
        height: 10px;
    }
}

@media all and (max-width: 1015px) {
    .program-item {
        flex-direction: column;
    }

    .program-item-center {
        margin: 0;
    }

    .program-item-link {
        margin: 15px 0 0 0;
    }

    .program-item-center {
        text-align: center;
    }

    .program-item-center-list {
        margin: 0 0 0 10px;
    }

    .program-item-center-list-item {
        text-align: start;
    }
}

@media all and (max-width: 799px) {
    .program-item-center-title {
        font-size: 22px;
    }
}

@media all and (max-width: 760px) {
    .program-button {
        margin: 0 35px 0 35px;
    }
}

@media all and (max-width: 700px) {
    .program-button {
        font-size: 12px;
        padding: 18px 45px 18px 45px;
        margin: 0 30px 0 30px;
    }
}

@media all and (max-width: 600px) {
    .program-items-day-2-title {
        font-size: 16px;
    }

    .program-item {
        padding: 47px 30px 47px 30px;
    }

    .program-button {
        margin: 0 12px 0 12px;
    }

    .program-buttons-date-15-info, .program-buttons-date-16-info, .program-buttons-date-14-info {
        font-size: 11px;
    }
}

@media all and (max-width: 505px) {
    .program-items-day-2-title {
        font-size: 14px;
    }

    .program-item {
        padding: 30px;
    }

    .program-buttons {
        margin: 0 0 16px 0;
    }

    .program-button {
        padding: 15px 30px 15px 30px;
    }

    .program-buttons-date-15-info, .program-buttons-date-16-info, .program-buttons-date-14-info {
        font-size: 10px;
    }
}

@media all and (max-width: 440px) {
    .program-items-day-2-title {
        font-size: 12px;
    }

    .program-button-date {
        font-size: 11px;
    }

    .program-button {
        padding: 12px 20px 12px 20px;
    }

    .program-buttons-date-15-info, .program-buttons-date-16-info, .program-buttons-date-14-info {
        font-size: 9px;
    }

    .program-item-time {
        font-size: 17px;
    }

    .program-item-center-title {
        font-size: 18px;
        margin: 10px 0 10px 0;
    }

    .program-item-center-list {
        margin: 0 0 0 30px;
    }

    .program-item-center-bold-text {
        font-size: 14px;
    }

    .program-item-center-list-item {
        font-size: 12px;
    }
}

@media all and (max-width: 350px) {
    .program-button:first-child {
        margin: 0 12px 0 0;
    }

    .program-button:last-child {
        margin: 0 0 0 12px;
    }

    .program-item-time {
        font-size: 15px;
    }

    .program-item-center-title {
        font-size: 16px;
        margin: 10px 0 10px 0;
    }

    .program-item-center-bold-text {
        font-size: 13px;
    }

    .program-item-center-list-item {
        font-size: 11px;
    }
}