/* :root{
    --primaryColour: #10947C;
    --secondaryColour: #3CB0ED;
    --tertiaryColour: #203A49;
    --quaternaryColour: white;
} */

:root{ 
    --primaryColour: #1A5319;
    --secondaryColour: #508D4E;
    --tertiaryColour: #80AF81;
    --quaternaryColour: #D6EFD8;
}

html, body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body::-webkit-scrollbar {
    display: none;
}

html {
    scrollbar-width: none;
    --quaternaryColour: #D6EFD8;
}

.body{
    background-color: var(--quaternaryColour);
    height: 100vh;
}

.headerBox{
    display: flex;
    align-items: center;
    justify-content: space-around;
    background-color: var(--tertiaryColour);
    height: 20vh;
    margin-top: 0;
    padding-top: 0;
}

.headerImage{
    height: 80%;
}

.headerText{
    text-align: center;
    text-align-last: center;
    height: 80%;
    font-size: large;
    color: var(--primaryColour);
    max-width: 70%;
}

.cardRow{
    margin-top: 5%;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: stretch;
}

.card{
    width: 40%;
    background-color: var(--secondaryColour);
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2); /* Small shadow on the bottom right */
    transition: box-shadow 0.3s ease-in-out, transform 0.3s ease-in-out; /* Smooth transition for the shadow */
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
}

.cardHeader{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.card:hover {
    box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.6); /* Slightly stronger shadow on hover */
    transform: translate(-1%, -1%); /* Move the card 10px up and 10px left */
}

.cardImage{
    width: 80%;
}

.cardTitle{
    font-size: large;
    color: var(--quaternaryColour);
    text-align: center;
}

.cardText{
    font-size: medium;
    color: var(--quaternaryColour);
    text-align: left;
    padding-left: 5%;
    padding-right: 5%;
    background-color: var(--tertiaryColour);
    border-radius: 15px;
}

.footerBox{
    margin-top: 5%;
    width: 100vw;
    background-color: var(--tertiaryColour);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
}

.footerBoxTopRow{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.footerItem{
    width: 30%;
    color: var(--quaternaryColour);
    font-size: large;
    display: flex;
    flex-direction: column;
    justify-content: start;
}

.footerItemTitle{
    font-size: larger;
    color: var(--quaternaryColour);
    text-align: center;
}

.footerItemParagraph{
    color: var(--quaternaryColour);
    font-size: large;
    text-align: center;
}

.footerSecondRow{
    width: 100%;
    text-align: center;
    color: var(--quaternaryColour);
}

.footerLink{
    color: var(--quaternaryColour);
}

.footerLink:hover{
    color: var(--primaryColour);
}

.pdfLink{
    text-align: center;
}

.pdfLink:link{
    color: var(--quaternaryColour);
    text-decoration: none;
}

.pdfLink:link:hover{
    color: var(--primaryColour);
    text-decoration: underline;
}
.pdfLink:visited{
    color: var(--primaryColour);
    text-decoration: none;
}