/* ------------------------------ */
/* ------------------------------ */
/* FOOTER */
#Footer {
   position: fixed;
   display: flex;
   bottom: 0px;
   width: 100%;
   height: calc(96px * var(--scale));
   background-color: var(--background-secondary);
   border-bottom: calc(5px * var(--scale)) solid var(--border-color);
   border-top: calc(1px * var(--scale)) solid var(--border-color);
   z-index: 50;
}

#Footer .center {
   position: relative;
   display: flex;
   width: 100%;
   height: calc(90px * var(--scale));
   margin: auto;
}

#Footer .logo {
   display: flex;
   flex-basis: calc(500px * var(--scale));
   justify-content: center;
   align-items: center;
   height: calc(90px * var(--scale));
   padding: calc(30px * var(--scale));
   border-left: calc(1px * var(--scale)) solid var(--border-color);
   color: var(--placeholder);
   font-size: calc(var(--font-large) * var(--scale));
   font-weight: var(--font-bold);
   line-height: 1;
}

#Footer .nav {
   display: flex;
   gap: calc(15px * var(--scale));
   width: 100%;
   height: calc(90px * var(--scale));
   padding: calc(15px * var(--scale));
}

#Footer .link {
   position: relative;
   display: block;
   width: 100%;
   height: calc(60px * var(--scale));
   padding: calc(20px * var(--scale));
   background-color: var(--background-secondary);
   border-top: calc(5px * var(--scale)) solid var(--border-color);
   border-radius: 0px;
   color: var(--text-primary);
   font-size: calc(var(--font-small) * var(--scale));
   font-weight: var(--font-bold);
   line-height: 1;
   text-align: left;
   text-transform: uppercase;
}

#Footer .link::after {
   content: var(--entity-link);
   position: absolute;
   top: calc(18px * var(--scale));
   right: calc(27px * var(--scale));
}

#Footer .link.x,
#Footer .link:hover {
   cursor: pointer;
   background-color: var(--background-secondary);
   border-top: calc(5px * var(--scale)) solid var(--primary-color);
   color: var(--primary-color);
}

#Footer .logo.x,
#Footer .logo:hover {
   cursor: pointer;
   background-color: var(--background-secondary);
   color: var(--primary-color);
}

#FooterNav {
   display: none;
}

/* ------------------------------ */
/* 1500PX */
@media only screen and (max-width: 1500px){

#FooterNav {
   display: flex;
   justify-content: center;
   align-items: center;
   width: calc(90px * var(--scale));
   height: calc(90px * var(--scale));
   padding: calc(15px * var(--scale));
   border-right: calc(1px * var(--scale)) solid var(--border-color);
}

#Footer .center {
   position: relative;
   display: flex;
   justify-content: end;
   width: 100%;
   height: calc(90px * var(--scale));
   margin: auto;
}

#Footer .logo {
   display: flex;
   flex-basis: calc(300px * var(--scale));
   justify-content: center;
   align-items: center;
   height: calc(90px * var(--scale));
   padding: calc(30px * var(--scale));
   border-right: 1px solid var(--border-color);
   color: var(--text-primary);
   font-size: calc(var(--font-large) * var(--scale));
   font-weight: var(--font-bold);
   line-height: 1;
}

#Footer .nav {
   position: fixed;
   display: flex;
   flex-direction: column;
   justify-content: start;
   gap: calc(15px * var(--scale));
   top: 0px;
   left: calc(300px * -1);;
   width: 300px;
   height: 100vh;
   padding: calc(15px * var(--scale));
   background-color: var(--background-secondary);
   border-left: calc(5px * var(--scale)) solid var(--primary-color);
   border-right: calc(1px * var(--scale)) solid var(--border-color);
   transition: left 500ms;
   z-index: 100;
}

}