body {
    background-image: url("Images/Auora\ \(Business\ Auorua\).png");
    background-size: cover;
    background-repeat: no-repeat;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1920px;
    max-height:fit-content;
    overflow: hidden;
}

.layout{

    display:grid;

    grid-template-columns:330px 1fr;

    height:100vh;
}

.page{
    display:flex;
    width:100%;
    height:100vh;
    overflow:hidden;
}

/* width */
::-webkit-scrollbar {
  width: 20px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgb(41, 47, 78); 
  border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: linear-gradient(transparent, rgba(44, 163, 210, 0.574)); 
  border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(rgba(0, 130, 163, 0.525), transparent);
  border-radius: 10px;
}

#loader{
    position:fixed;
    inset:0;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:20px;

    background:url("Images/Auora\ \(Business\).png") center/cover no-repeat;
    z-index:99999;

    transition:opacity .8s ease;
}

#loader.fade{
    opacity:0;
    pointer-events:none;
}

#loadingVideo{
    width:180px;
    user-select:none;
}

#loadingText{
    font-size:18px;
    margin:0;
}

#loader [role="progressbar"]{
    width:320px;
}

#progressBar {
    filter:
        hue-rotate(80deg)
        saturate(1.3)
        brightness(1.1);
}