        <style>
            
            body {
                margin: 0;
                background-color: #282828;
                
            }

            * {
                box-sizing: border-box;
            }

            #container {
                max-width: 900px;
                margin: 0 auto;
                font-family: 'Courier New', monospace;
                color: #fbf1c7;
                flex-flow: row wrap;
            }


            #navbar {
                height: 40px;
                background-color: #282828;
                flex-basis: auto;
            }

            #navbar ul {
                display: flex;
                padding: 0;
                margin: 0;
                list-style-type: none;
                justify-content: space-evenly;
            }
            
            #navbar ul a {
                padding:0;
            }

            #navbar li {
                padding-top: 10px;
            }
            
            #navbar li a {
                color: #ebdbb2;
                font-weight: 800;
                text-decoration: none;
                 flex-basis: auto;
            }

            #navbar ul a:hover {
                color: #fabd2f;
                text-decoration: underline dotted;
                flex-basis: auto;
            }

            #flex {
                display: flex;
                
           }

            main {
                font-size: smaller;
                display: flex;
                flex-flow: row wrap;
                justify-content: space-between;
                background-color: #3c3836;
                
                
                text-align: center;
                
            }
            
            img {
              max-width:50%;
            }
            
            .fullitem {
            flex-basis: auto;
            background-color: #3c3836;
            align-items: center;
            padding: 20px;
            flex: 1;
            
            }
            
            .fullitem:hover {
              background-color: #282828;
              color: #fabd2f;
            }
            
            .centre {
            align-items: center;
            align-self: center;
            justify-content: center;
            }
            
            .item {
            flex-basis: auto;
            background-color: #3c3836;
            align-items: center;
            padding: 20px;
            flex: 1;
            align-self: stretch;
            }
            
            .item:hover {
              background-color: #282828;
              color: #fabd2f;
            }
            
          

            h1,
            h2,
            h3 {
                color: #ebdbb2;
            }

            h1 {
                font-size: 25px;
            }

            strong {
                color: #fabd2f;
            }


            #topBar {
                display: flex;
                flex-direction: column;
                width: 100%;
                padding: 10px;
                font-size: smaller;
                background-color: #3c3836;
                justify-content:center;
                text-align: center;
            }

        </style>