/*==========================================================
        Page Styles
==========================================================*/


html {
    overflow-x: hidden;
    overflow-x: clip;
    overflow-y: auto;
    scroll-behavior: smooth;
}

body {

    background: var(--colour-page);

    color: var(--colour-text);

    font-family: var(--font-family);

    font-size: var(--font-size-body);

    line-height: 1.65;

    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    overflow-x: clip;

}

body, .page{
    margin: 0 auto;
    padding: 0;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
    overflow-x: clip;
}

.page,
#content {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

#content {
    transition: opacity 420ms ease-in-out;
    overflow-x: hidden;
    overflow-x: clip;
}

#content.htmx-swapping,
#content.htmx-settling {
    opacity: 0;
}

#content.htmx-swapping {
    transition-delay: 300ms;
}

#content.htmx-swapped {
    opacity: 1;
}