body {
    display: flex;
    flex-wrap: wrap;
    font-family: 'Courier New';
    margin: 0;
    font-size: 15px;
}



main {
    left: 330px;
    top: 10px;
    width: 800px;
    height: 55em;
    position: absolute;
    padding: 5px;
    border: solid #5c5a99;
    border-width: 2px 2px 2px 0;
    background: #fab9d1;
background: linear-gradient(0deg, rgba(250, 185, 209, 0.9) 0%, rgba(255, 213, 191, 0.9) 11%, rgba(255, 240, 153, 0.9) 34%, rgba(199, 240, 146, 0.9) 50%, rgba(172, 225, 186, 0.9) 65%, rgba(138, 206, 237, 0.9) 80%, rgba(216, 206, 242, 0.9) 100%);
    overflow-y: auto;
}

aside {
    left: 89px;
    top: 10px;
    width: 231px;
    height: 55em;
    padding: 5px;
    float: left;
    position: absolute;
    border: solid #5c5a99;
    border-width: 2px 0px 2px 2px;
    background: #fab9d1;
background: linear-gradient(0deg, rgba(250, 185, 209, 0.9) 0%, rgba(255, 213, 191, 0.9) 11%, rgba(255, 240, 153, 0.9) 34%, rgba(199, 240, 146, 0.9) 50%, rgba(172, 225, 186, 0.9) 65%, rgba(138, 206, 237, 0.9) 80%, rgba(216, 206, 242, 0.9) 100%);
}


p {
    padding: 7px;
    margin: 1px;
}

a:hover {
    color: white;
}

h1 {
 color: #5c5a99;
    padding: 5px;
    background-color: white;
    font-size: 28px;
    border: 2px solid #5c5a99;
    margin: 0px;
}
h2 {
    color: #5c5a99;
    padding: 5px;
    background-color: white;
    font-size: 21px;
    margin: 0px;
}

h3 {
    color: #5c5a99;
    padding: 5px;
    background-color: white;
    margin: 0px;
}

iframe {
    height: 53em;
    width: 790px;
    border: solid 2px #5c5a99;
}

.updates {
    height: 300px;
    width: 210px;
    border: none;
}


img { 
  margin: 10px;
  
}

.center {
 display: block;
  margin-left: auto;
  margin-right: auto;
  width: 90%;
  text-align: center;
}

.nospace img {
    margin: 0;  
}
.column {
    float: left;
    width: 48%;
    padding: 5px;
}

.margin {
    margin-top: 15px;
}

.gallery {
 float: left;
 border: solid 2px #C37E98;
 color: #773850;
}

.gallery img {
 width: 100%;
 height: auto;
 margin: 0;
}

.gallery p {
  background-color: #f7f5fd;
  
}


/* ---------graphics-------------*/

.blinkie img {
  width: 150px;
  height: 20px;
}

.blinkie p {
  color: white; 
}

.stamp img {
  width: 99px;
  height: 55px;
}

.stamp p {
  color: white; 
}

.button img {
  width: 88px;
  height: 31px; 
}

/* -----------------pink----------------- */

.pink {
    background-color: #FAB4CF;
    border: 2px solid #e4679e;
    margin-bottom: 10px;
    color: #5d032a;
}

.pink h2 {
    color: #e4679e;
}

.pink h3 {
    color: #e4679e;
}

.pink a {
    color: #5d032a;
}

.pink a:hover {
    color: #fff;
}

/* -----------------orange----------------- */ 

.orange {
    background-color: #FCC69A;
    border: 2px solid #d26c36;
    margin-bottom: 10px;
    color: #501802;
}

.orange h2 {
    color: #d26c36;
}

.orange h3 {
    color: #d26c36;
}

.orange a {
    color: #501802;
}

.orange a:hover {
    color: #fff;
}

/* -----------------yellow----------------- */

.yellow {
    background-color: #ffe566;
    border: 2px solid #fba848;
    margin-bottom: 10px;
    color: #6d2f02;
}

.yellow h2 {
    color: #fba848;
}

.yellow h3 {
    color: #fba848;
}


.yellow a {
    color: #6d2f02;
}

.yellow a:hover {
    color: #fff;
}

/* -----------------green----------------- */

.green {
    background-color: #93C9B8;
    border: 2px solid #46928e;
    margin-bottom: 10px;
    color: #01362a;
}

.green h2 {
    color: #46928e;
}

.green h3 {
    color: #46928e;
}

.green a {
    color: #01362a;
}

.green a:hover {
    color: #fff;
}

/* -----------------blue----------------- */

.blue {
    background-color: #93D7ED;
    border: 2px solid #4776c0;
    margin-bottom: 10px;
    color: #0c287e;
}

.blue h2 {
    color: #4776c0;
}

.blue h3 {
    color: #4776c0;
}

.blue a {
    color: #0c287e;
}

.blue a:hover {
    color: #fff;
}

/* -----------------purple----------------- */

.purple {
    background-color: #C1BAE8;
    border: 2px solid #7C54B3;
    margin-bottom: 10px;
    color: #2e0b7a;
}

.purple h2 {
    color: #7C54B3;
}

.purple h3 {
    color: #7C54B3;
}

.purple a {
    color: #2e0b7a;
}

.purple a:hover {
    color: #fff;
}

/*------------------IDs----------------*/

#index {
  background: #000 url(https://styrofoampuppy.neocities.org/images/backgrounds/welcometomyspecialhell.png);
}

#index main {
    border: 2px solid #5c5a99;
}


#home {
  background: #fff url("https://styrofoampuppy.neocities.org/images/backgrounds/ponybg.gif");
}

#graphics {
 background: #fff url('https://styrofoampuppy.neocities.org/images/backgrounds/stars3slow.gif');
}

#graphicspage {
 background: #000 url('https://styrofoampuppy.neocities.org/images/backgrounds/space.png');
}

#diary {
  background: #fff url('https://styrofoampuppy.neocities.org/images/backgrounds/flowers.png');
  background-size: cover;
}

#artpage {
  background: #fff url('https://styrofoampuppy.neocities.org/images/backgrounds/graphpaper.png');
}

#art {
  background: #fff url(https://styrofoampuppy.neocities.org/images/backgrounds/cinnabg.jpg);
  background-size: 50%;
}

#links {
  background: #fff url(https://styrofoampuppy.neocities.org/images/backgrounds/kitty.png);
}

#test {
  background: #000;
}