/* i don't fully understand this pseudo class... */
           :root {
               /* background image for whole site */
               --body-bg-image: url('media/meadow1.png');
               --content: #0a730c;
           }
           /* CUSTOM FONT SET UP */
           @font-face {
               font-family: Nunito;
               src: url('https://sadhost.neocities.org/fonts/Nunito-Regular.ttf');
           }
            @font-face {
               font-family: Nunito;
               src: url('https://sadhost.neocities.org/fonts/Nunito-Bold.ttf');
               font-weight: bold;
           }
            @font-face {
                font-family: Nunito;
               src: url('https://sadhost.neocities.org/fonts/Nunito-Italic.ttf');
               font-style: italic;
           }
            @font-face {
               font-family: Nunito;
               src: url('https://sadhost.neocities.org/fonts/Nunito-BoldItalic.ttf');
               font-style: italic;
               font-weight: bold;
           }
            /* FORMATTING OF ALL BASE TEXT */
           body {
              font-family: 'Nunito', sans-serif;
              margin: 0;
              background-color: #08031A;
              color: #34441A;
              background-image: var(--body-bg-image);
           }

            /* DEFINES THE SIZE OF A BOX TO INCLUDE PADDING AND MARGINS */
            * {
                box-sizing: border-box;
            }

            /* CSS FOR LAYOUT */
            #container {
                /* Width of the entire container */
                max-width: 1000px;
                /* this centers the entire page */
                margin: 0 auto;
            }

            /* LINKS */
            #container a {
                color: #2BB03B;
                font-weight: bold;
            }


            #header {
                width: 100%;
                background-color: rgb(250 212 192 / 95%);
                height: 250px;
            }

            #mobNav {
                display: none;
            }

            #flex {
                display: flex;
            }

            /* LEFT SIDE BAR STYLING AND SIZING */
            leftSidebar {
                background-color: #b19ed3ef;
                width: 150px;
                height: 100%;
                padding: 20px;
            }

            /* RIGHT SIDE BAR STYLING AND SIZING */
            rightSidebar {
                background-color: #b19ed3ef;
                width: 250px;
                height: 100%;
                padding: 20px;
                font-size: smaller;
            }

            /* MAIN CONTENT STYLING */
            main {
                background-color: rgb(250 212 192 / 95%);
                flex: 1;
                padding: 20px;
                order: 2;
            }

            #logsHome {
                background-color: #b19ed3ef;
            }


            /* FLEX ORDERING */
            #leftSidebar {
                order: 1;
            }

            #rightSidebar {
                order: 3;
            }

            #rightSidebarLogs {
                display: none;
            }

/*          FOOTER CURRENTLY UNUSED   
            footer {
                background-color: #13092D;
                width: 100%;
                height: 40px;
                padding: 10px;
                text-align: center;
            } */

            h1{
               font-size: 40px;
               color:#382383;
               font-style: italic;
            }

            h2,
            h3 {
                color: #343A1A;
            }

            strong {
                color: #343A1A;
            }

            .box {
                background-color: #58cf58;
                border: 1px solid #343A1A;
                margin: 5px;
                padding: 5px;
                padding-bottom: 5px;
            }

            .guestbookBox {
                background-color: rgb(250 212 192);
                border: 1px solid #343A1A;
                margin: 5px;
                padding: 5px;
                padding-bottom: 5px;
            }

            /* CSS formatting for box/updates */
            .header2Update {
                font-family: 'Nunito', Bold;
                color: #4127a0;
                font-size: 1.5em;
                padding-top: 0px;
                padding-bottom: 0px;
                margin: 0px;
                font-weight:bolder;
            }

            .header3Update {
                font-family: 'Nunito';
                font-size: 1.1em;
                padding-top: 0px;
                padding-bottom: 0px;
                margin: 0px;
                font-weight:bold;
                font-style: italic;
            }

            .pUpdate {
                font-family: 'Nunito', sans-serif;
                font-size: 1.2em;
                padding-top: 1px;
                padding-bottom: 1px;
                margin: 1px;
                font-weight: 400;
                clear:left;
            }

            .dateTagUpdate {
                font-family: 'Nunito';
                font-size: 1em;
                padding-top: 1px;
                padding-bottom: 1px;
                margin: 1px;
                font-style: italic;
            }

            .ratingUpdate{
                float:left;
                margin-right: 2px;
            }

            .ratingTextUpdate{
                padding-bottom: 0%;
                padding-top: 0%;
                margin: 0%;
            }
            /* end of update box CSS */

            /* CSS for extras */
            #topBar {
                width: 100%;
                height: 30px;
                padding: 10px;
                font-size: smaller;
                background-color: #13092D;
            }