.logo{z-index:1;position:absolute;top:24px;left:24px}
@media screen and (max-width:600px) and (max-height:1000px) and (orientation:portrait),screen and (max-width:1000px) and (max-height:600px) and (orientation:landscape){.logo{width:100px}}
.navigation-btns-container{z-index:1;display:flex;position:absolute;top:24px;left:50%;transform:translate(-50%)}.navigation-btns-container .mobile-btn{display:none}.navigation-btns-container .container-items{gap:10px;display:flex}.navigation-btns-container .container-items .nav-btn{color:#fff;border-radius:64px;justify-content:center;align-items:center;width:100px;height:35px;font-size:14px;transition:all .3s ease-in-out;display:flex;position:relative;overflow:hidden}.navigation-btns-container .container-items .nav-btn .btn-text{z-index:2;transition:color .3s ease-in-out}.navigation-btns-container .container-items .nav-btn:hover .btn-text,.navigation-btns-container .container-items .nav-btn:hover.active .btn-text,.navigation-btns-container .container-items .nav-btn:hover.oystra .btn-text{color:#000}.navigation-btns-container .container-items .nav-btn.disabled{pointer-events:none;opacity:.4;cursor:default}.navigation-btns-container .container-items .nav-btn.active{filter:blur();background-color:#f7f7f73d;border:1px solid #fff}.navigation-btns-container .container-items .nav-btn.oystra{background-color:#0086f9;border:1px solid #0085f900}.navigation-btns-container .container-items .nav-btn .background-con{z-index:1;background-color:#fff;border-radius:64px;width:100%;height:100%;transition:all .3s ease-in-out;position:absolute}.navigation-btns-container .container-items .nav-btn .background-con.initial{transform:translateY(110px)}.navigation-btns-container .container-items .nav-btn .background-con.entered,.navigation-btns-container .container-items .nav-btn .background-con.leave-ready{transform:translateY(0)}.navigation-btns-container .container-items .nav-btn .background-con.exited{transform:translateY(-110px)}
@media screen and (max-width:600px) and (max-height:1000px) and (orientation:portrait) and (pointer:coarse){.navigation-btns-container{flex-direction:column;align-items:end;gap:24px;left:auto;right:24px;transform:translate(0)}.navigation-btns-container .mobile-btn{cursor:pointer;background-color:#fff;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.navigation-btns-container .mobile-btn .icon{transition:opacity .3s,transform .3s}.navigation-btns-container .mobile-btn .icon.opened{opacity:0;position:absolute;transform:rotate(-90deg)}.navigation-btns-container .mobile-btn .icon.closed{opacity:1;transform:rotate(0)}.navigation-btns-container .container-items{opacity:0;pointer-events:none;flex-direction:column;max-height:0;transition:opacity .3s,transform .3s,max-height .3s;display:flex;overflow:hidden;transform:translateY(-8px)}.navigation-btns-container.open .mobile-btn .icon.closed{opacity:0;transform:rotate(90deg)}.navigation-btns-container.open .mobile-btn .icon.opened{opacity:1;transform:rotate(0)}.navigation-btns-container.open .container-items{opacity:1;pointer-events:auto;max-height:500px;transform:translateY(0)}}