html {
    height: 100%;
}
footer {
    background-color: #daab80;
    color: #663d27;
    position:absolute;
    bottom:0;
    width:100%;
    text-align:center;
    height: 50px;
}
body {
    background-color: #d2f7b7;
    background-image: url("Images/green_background.jpg");
    height: 100%;
}
#kontaktBody {
    background-color: #d2f7b7;
    background-image: url("Images/Leaf-Background-Wallpaper-05458.jpg");
    height: 100%;
}
nav {
    background-color: #daab80;

    h1,h2,h3,h4,h5,h6,a {
    color: #663d27
}
}

h1,h2,h3,h4,h5,h6 {
    color: #130c07
}
a {
    color: #744935;
}
a:hover {
    color: #3b2216;
}

.pfp {
    border-radius: 5%;
    border-color: #063b07;
    border-width: 1px;
    border-style: solid;
}

li:nth-child(even) {
    background-color: #95ce87;
}
li:nth-child(odd) {
    background-color: #a9e081;
}

#tekstBoks, #infoBoks, .card {
    background-color: #d2f7b7;
    padding: 10px;;
    outline-color: #063b07;
    outline-style: solid;
    outline-width: 1px;
    color: #663d27;
}



/*-----------------------new stuff--------------------*/
.page-layout {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    margin: 6rem auto 2rem;
    max-width: 1200px;
    padding: 0 1rem;
    box-sizing: border-box;
}
.cat-sidebar {
    flex: 0 0 220px;
    position: sticky;
    top: 6rem;
    /* Make the sidebar fill the viewport between the fixed navbar and footer */
    height: calc(100vh - 6rem - 50px);
    align-self: flex-start;
    background-color: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 0.75rem;
    padding: 1rem;
    overflow: auto;
}
.cat-sidebar-nav .nav-link {
    padding: 0.5rem 0;
}
.page-main {
    flex: 1;
    min-width: 0;
    padding-bottom: 6rem;
}
.cat-container {
    position: relative;
    width: 100%;
    max-width: 540px;
    height: 960px;
}
.cat-container .cat {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.cat {
    width: 540px;
    height: 960px;
}