*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family: 'Inter', sans-serif;
  overflow-x:hidden;
  display: flex;
  flex-direction: column;
  background: #efefef;
  gap: 2%;
}

img,video{
  max-width:100%;
  display:block;
}
button{
    background: transparent;
    border-color: transparent;
    
}

.header{
    display: flex;
    align-items: center;

    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);

    width: 100%;
    max-width: 1200px;
    padding: 12px 20px;
    border-radius: 20px;

    background: rgba(255,255,255,0.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    border: 1px solid rgba(255,255,255,0.15);

    z-index: 10;
}

.logo-button{
    display: flex;
    align-items: center;
    justify-content: center;

    background: transparent;
    border: 1px solid transparent;
    border-radius: 20%;

    padding: 0;
    margin: 0;
    cursor: pointer;
    transition: 0.3s;
}
.logo-button:hover{

    border-top-color: blue;
    border-bottom-color: blue;

}


#stslogo{
    display: block;
    height: 70px;
    width: auto;
}


#fast-nav-btn{
    margin-left: auto;
    position: relative;
    background: transparent;
    height: fit-content;
    border: none;

    width: fit-content;
}
.fast-nav{
    padding-top: 5%;
    background: transparent;
    height: 50px;
    background: #efefef;
    border: 1px solid #1e1f2b;
    font-size: 20px;
    width: 222px;
    transition: 0.3s;
}
.fast-nav:hover{
    color: #efefef;
    background: #1e1f2b;
}

footer{
    display: flex;
    flex-direction: row;
    gap: 5%;
    padding: 0 2%;
    width: 100%;
    
    height: 30vh;
    background: #1e1f2b;
}

.footer-socials{
    padding: 1%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6%;
    background: transparent;
    height: 100%;
    width: 20%;
}
.footer-rights{
    color: #efefef;
    text-align: center;
    font-size: 10px;
    padding: 4%;
    background: #1e1f2b;
    height: fit-content;
    width: 100%;
    font-size: 7px;
    border: 1px solid transparent;
    border-bottom-color: blue;
}
.footer-socials-btn{
    position: relative;
    margin-right: auto;
    background: #efefef;
    width: 50%;
    height: fit-content;
    border: 1px solid transparent;
    cursor: pointer;
    transition: 0.3s;
}
.footer-socials-btn:hover{
    border-bottom-color: blue;
    width: 100%;
    background: black;
    color: #efefef;
}
.footer-links{
    padding: 1%;
    display: flex;
    flex-direction: row;
    gap: 6%;
    background: transparent;
    height: 100%;
    width: 17%;
}
.footer-links-page{
    
    background: transparent;
    width: 100%;
    height: fit-content;
    color: #efefef;
    cursor: pointer;
}
.footer-links-page div{
    
    margin-right: auto;
    font-size: 20px;
    border: 1px solid transparent;
    border-bottom-color: #efefef;
}