.headerMenu{
    position: fixed;
    top: -2px;
    left: 0;
    width: 100%;
    height: 102%;
    background: rgba(0, 0, 0, 0.7);
    transition:background 0.4s ease-in-out;
}
.mediaContainer{
    display: none;
}
.burgerButtonContainer{
    width:max-content;
    display: flex;
    justify-content: end;
    align-items: center;
    position:fixed;
    top:2.08vw;
    right:2.08vw;
}
.headerMenuContent.animationStart .burgerButtonContainer{
    position: absolute;
}

.burgerButton{
    position: relative;
    width: 4.166vw;
    height:4.166vw;
}
.burgerButton::before{
    position: absolute;
    border-radius: 50%;
    content:'';
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(50% 50% at 50% 50%, #F8701A 0%, #FFF 100%);
    background-size: cover;
    z-index: -1;
}
.burgerButton::after{
    position: absolute;
    content:'';
    top:1.25vw;
    left: 1.25vw;
    width: 1.66vw;
    height: 1.66vw;
    z-index:1;
    background: url('../../../img/kindalbom/headerMenu/burger.svg');
    background-blend-mode: multiply;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.burgerButtonContainerLogo{
    display: none;
}
.headerMenu.closed{
    height:auto;
    display: block;
    background: rgba(0, 0, 0, 0);
}
.headerMenuContent{
    max-height:31.25vw;
    position:fixed;
    top:-100%;
    left: 0;
    background: radial-gradient(50% 50% at 50% 50%, #F8701A 0%, #FFF 100%);
    border-bottom-left-radius: 4vw;
    border-bottom-right-radius:4vw;
    display: grid;
    grid-template-areas: 
    "logo logo logo logo"
    "pl .  ml buy";
    width: 100%;
    height: max-content;
    padding:8.33vw 6.25vw 3.95vw 6.25vw;
    transition:top 0.3s ease-in-out;
}
.headerMenuContent.animationStart{
    top:0;
}
.headerMenuContent.animationStop{
    top:-100%;
}
.headerMenuPageLink, .headerMenuBuy {
    color: #2d2d2d;
    text-decoration: none;
}
.burgerButton.closed::after{
    width: 100%;
    height: 100%;
    top:0;
    left: 0;
    background-image: url('../../../img/kindalbom/headerMenu/close.svg');
}
.burgerButton.closed::before{
    display: none;
}
.headerMenuPageLinkMainPage{
    color:#760000;
    text-decoration: underline;
}
.headerMenuPageLinks{
    display: flex;
    justify-content: start;
    align-items: center;
    grid-area: pl;
    padding:1.2vw 0;
}
.headerMenuPageLink{
    margin-right: 1.458vw;
}
.headerMenuMediaLinks{
    grid-area: ml;
    display: flex;
    justify-content: end;
    align-items: center;
    padding:1.2vw 0;
    justify-self:end;
    margin-right: 2.6vw;
}
.headerMenuMediaLink{
    height: 2vw;
    width: 2vw;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    margin-left: 1.6vw;
}
.headerMenuMediaLink.inst{
    background-image: url("../../../img/kindalbom/footer/inst.svg");
}
.headerMenuMediaLink.vk{
    background-image: url("../../../img/kindalbom/footer/vk.svg");
}
.headerMenuMediaLink.whatsap{
    background-image: url("../../../img/kindalbom/footer/whatsap.svg");
}
.headerMenuBuy{
    grid-area: buy;
    border:1px solid #2d2d2d;
    border-radius: 2vw;
    padding:0.8vw 2.4vw;
    display: flex;
    justify-content: start;
    align-items: center;
    width: min-content;
    justify-self:end;
    transition:all 0.3s ease;
}
.headerMenuBuy:hover{
    background-color: #2d2d2d;
    border: 1px solid #2d2d2d;
    color: white;
}
.headerMenuBuyIcon{
    width: 1.875vw;
    margin-right: 0.8vw;
}
.headerMenuLogo{
    grid-area: logo;
    width: 87.5vw;
    height:9.89878vw;
    background-image: url('../../../img/kindalbom/footer/logo.svg');
    background-size: 100% auto;
    background-repeat: no-repeat;
    border:0px solid white;
    margin-bottom: 4.166vw;
}