@import url('header.css');
@import url('footer.css');

@import url('frames/main.css');
@import url('frames/location.css');
@import url('frames/accordion.css');

.head_frame {
    position: fixed;
    top: 0px;
    z-index: -5;
    width: 100%;
    user-select: none;
}

.head_frame > img {
    width: 100%;
    flex-shrink: 0;
}

main {
    margin-top: calc(100vw / 3.2 - 83px);
    padding-bottom: 0;
}

main .frame_head > .title{
    font-weight: 700;
    letter-spacing: -1.65px;
}

main .about .frame_content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

main .about .frame_content > .text {
    text-indent: 340px;
    user-select: text;
    font-size: 27px;
    font-style: normal;
    font-weight: 600;
    line-height: 95%;
}

main .about .frame_content > .frame {
    padding-left: 340px;
    display: flex;
    gap: 10px;
} 

main .about .frame_content > .frame > .frame_l {
    width: 342px;
    display: flex;
    flex-direction: column;
    gap: 10px;

    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 95%;
}

main .about .frame_content > .frame > .frame_l > img {
    width: 460px;
    height: 258px;
}

main .exibition .frame_content {
    padding: 0 20px;
}
main .exibition .frame_content > .entry > .t > div {
    position: relative;
    top: 5px;
    width: 100%;
    display: flex;
    gap: calc(25% - 46px);
    align-items: baseline;
}

main .exibition .frame_content > .entry > .t > div > .y {
    width: 44px;
    opacity: 0.4;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 80%;
    letter-spacing: -0.42px;
}

main .exibition .frame_content > .entry > .t > div > .l {
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 80%;
    letter-spacing: -0.6px;
}

main .exibition .frame_content > .entry > .c {
    display: flex;
    gap: 10px;
    margin-left: calc(25% - 7px);
}

main .exibition .frame_content > .entry > .c > .text {
    width: 460px;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 95%;
}
main .exibition .frame_content > .entry > .c > .image {
    width: 277px;
    height: 150px;
    flex-shrink: 0;
}

main .books .frame_content {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin: 0 auto;
    padding: 20px 20px 25px 20px;
}

main .books .frame_content .card {
    width: 295px;
    height: 295px;
    padding: 20px;
    flex-shrink: 0;
    background: var(--color-light);
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
}

main .books .frame_content .space {
    width: 335px;
    height: 335px;
}

@media screen and (width < 1440px) {
    main .books .frame_content .space {
        display: none;
    }
}

main .books .frame_content .card > .title {
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 95%;
    letter-spacing: -0.6px;
}

main .books .frame_content .card > .picture {
    padding: 9px;
    background: #E1E1E1;
}
main .books .frame_content .card > .picture > img {
    width: 81px;
    height: 110px;
    flex-shrink: 0;
}

main .books .frame_content .card > .desc {
    margin-top: auto;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 95%;
}


#colaborate_btn {
    display: flex;
    gap: 47px;
    /* max-width: 1400px; */
    justify-content: center;
    padding: 50px 0;
    background: var(--color-dark);
    color: var(--color-font-light);
    cursor: pointer;
}

#colaborate_btn > span {
    font-size: 130px;
    font-style: normal;
    font-weight: 700;
    line-height: 80%;
    letter-spacing: -3.9px;
    text-transform: uppercase;
}

#colaborate_btn > img {
    width: 104px;
    height: 104px;
}