:root {
    --color-palette-dark: #155A5A;
    --color-palette-medium: #2C9393;
    --color-palette-light: #E0F6F6;
}

body {
    inset: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
    position: fixed;
}

#loading {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
}

.container{
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
}

.header{
    color: var(--color-palette-dark);
    font-family: Poppins,sans-serif;
    font-size: 24px;
    font-weight: 600;
}

.subText{
    color: var(--color-palette-medium);
    font-family: Poppins,sans-serif;
    font-size: 16px;
    font-weight: 300;
}

.loading{
    width: 100%;
    height: 6px;
    border-radius: 60px;
    background: var(--color-palette-light);
    position: relative;
    overflow: hidden;
}

.loadingBar{
    position: absolute;
    width: 33%;
    height: 6px;
    border-radius: 60px;
    background: var(--color-palette-medium);
    animation: load 3s normal infinite forwards;
}
.topImage {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    padding-right: 6px;
}

.textContainer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

p {
    margin: 0;
}

.logo img {
    display: block;
}

@keyframes load {
    0% {left:-33%;}
    100% {left:133%;}
}