
.roboto-bold-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: italic;
  }

  body { background-color:#8A5F2D;
    font-family: “Roboto”, ‘Helvetica Neue’, Helvetica, Arial, sans-serif; font-weight: 400;
    font-style: normal; }
    h1 { font-family: “Roboto”,‘Helvetica Neue’, Helvetica, Arial, sans-serif; font-weight: 900; }

    footer p {text-align: center;
    color: white;}

    #logo {
        width: 70px;
        height: auto;
        position: relative;}

        header span { position:relative;
       top: -21px; }

        header {
            position: relative;
            background-color: #b2c5b5; /* fill */
            /* rgba(255,255,255,0.5) => 0.5 = semi-transparent color */
            border: 1px solid #000; /* stroke */
            /* width of stroke, type of line, and color */
            height: 25px;
            padding: 10px;
            /* inset the image */
            }
           
            body {
                font-family: "Roboto", sans-serif;
                font-weight: 400;
                font-style: normal;
                margin: 0; /* add these two new lines */
                padding: 0;
                }

                header {
                    background-color: #341C00;
                    padding: 30px;
                    height: 100px;
                    color: white;
                    font-size: 50px; /* add these three new lines */
                    font-weight: 900;
                    font-style: normal;
                    }

                    nav ul { color: #FFFFFF;
                        list-style-type: none;
                        }
                        nav ul li {
                            display: inline;
                            margin-right: 16px;
                            }

                            a {text-decoration: none;}
                            
                            main {
                                margin-left: 36px;
                                }    
                                footer {
                                    background-color: #341C00; /* fill */
                                    /* rgb(255 255 255) => 0.5 = semi-transparent color */
                                    border: 0px solid #1500FF; /* stroke */
                                    /* width of stroke, type of line, and color */
                                    height: 55px;
                                    padding: 20px;
                                    /* inset the image */
                                    } a {
                                        color: white;
                                      }

                                      h1 {color: white;}

                                      .thumbnails {
                                        display: flex; /* this is called a flexbox */
                                        }

                                        footer{position:fixed;
                                        bottom: 0;
                                    width: 100vw;}