body {
    font-family: arial, helvetica, sans-serif;
    font-size: 14px;
    color: black;
    background-color: #f6f7da;
    background-image: url("https://i.pinimg.com/originals/b2/58/85/b258854e249c5d4673a5938b90b6bbf5.gif");
    background-size: 100% ;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    margin: 20px;
    padding: 0;
}
/* https://i.pinimg.com/originals/80/93/eb/8093eb596b38846d47cf30feb907d68f.gif */
 #navbar {
                height: 40px;
                background-color: #f8fc83;
                /* navbar color */
                width: 100%;
            }

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

            #navbar li {
                padding-top: 10px;
            }

            /* navigation links*/
            #navbar li a {
                color: #592378;
                /* navbar text color */
                font-weight: 800;
                text-decoration: none;
                /* this removes the underline */
            }

            /* navigation link when a link is hovered over */
            #navbar li a:hover {
                color: #ba82ff;
                text-decoration: underline;
            }

            #flex {
                display: flex;
            }
  #header {
              background-image: url("images/canva2.png") ;
              background-repeat: no-repeat;
                width: 880px;
                height: 110px;
                padding: 10px ;
                
            }

/* This is a comment, by the way */
 #container {
                max-width: 880px;
                /* this is the width of your layout! */
                /* if you change the above value, scroll to the bottom
      and change the media query according to the comment! */
                margin: 0 auto;
                /* this centers the entire page */
            }
#flex {
                display: flex;
            }
.button.button1 {
  border: none;
  color: white;
  background-image: url("images/buton1.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 85px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  
}
.button.button1:hover {
  border: none;
  color: white;
  background-image: url("images/buton1hover.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 85px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  
}
.button.button2 {
  border: none;
  background-image: url("images/button2.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 60px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  
}
.button.button2:hover {
  border: none;
  background-image: url("images/button2.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 60px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  
} 
.button.button3 {
  border: none;
  background-image: url("images/button3.png");
  background-repeat: no-repeat;
   background-color: white;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 60px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  
}
.button.button3:hover {
  
  border: none;
  background-image: url("images/button3.png");
  background-repeat: no-repeat;
  background-color: white;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 60px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  
}
            aside {
                background-color: #f8fc83;
                width: 200px;
                padding: 20px;
                font-size: smaller;
                /* this makes the sidebar text slightly smaller */
            }


            /* this is the color of the main content area,
    between the sidebars! */
            main {
                background-color: #592378;
                flex: 1;
                padding: 20px;
                order: 2;
            }

            /* what's this "order" stuff about??
    allow me to explain!
    if you're using both sidebars, the "order" value
    tells the CSS the order in which to display them.
    left sidebar is 1, content is 2, and right sidebar is 3! */

             #leftSidebar {
                order: 1;
            }
            #leftSidebar a {
               color: white;
                /* navbar text color */
                
                text-decoration: none;
            }
            #leftSidebar a:hover {
               color: white;
                text-decoration: underline;
            }

            #rightSidebar {
                order: 3;
            }
#spacecat {
  height: auto;
}
.button.button1 {
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}
p {
    line-height: 21px;
}
marquee {
  color: white;
   text-shadow: 2px 2px 3px #000000 ;
   font-weight: bold;
}

h1 {
    color: #ffc;
    background-color: #592378;
    font-size: 2em;
    margin: 0;
    margin-bottom: 5px;
    padding: 4px;
    font-style: italic;
    text-align: center;
    letter-spacing: 0.1em;
    border-bottom-style: solid;
    border-bottom-width: 0.5em;
    border-bottom-color: #8248a3;
}

h2 {
    color: white;
    background-color: #1f7c9c;
    font-size: 1.5em;
    margin: 0;
    padding: 2px;
    padding-left: 14px;
}

h3 {
    color: #999;
    font-size: 1.25em;
}


img {
    border-style: none;
    border-width: 2px;
    border-color: #ccc;
}

a {
    text-decoration: none;
}

strong {
    font-style: italic;
    text-transform: uppercase;
}

li {
    color: #900;
    font-style: italic;
}

table {
    background-color: #ccc;
}