:root {
  /* --background: #1f1f1f; */
  --background: #420420;
  --background-dark: #3b051d;
  --foreground: #37ff37;
  --color0: #151515; 
  --color8: #ffffff; 
  --color1: #e61111; 
  --color9: #ff0000;
  --color2:  #19e619; 
  --color10: #00ff00;
  --color3:  #e21270; 
  --color11: #ffff00;
  --color4:  #1212db; 
  --color12: #0000ff;
  --color5:  #e1651a; 
  --color13: #d600ff;
  --color6:  #119fde;
  --color14: #00b1ff;
  --color7:  #aaaaaa;
  --color15: #ffffff;
}

/* * { */
  /* background-color: var(--background); */
  /* color: var(--foreground); */

/* } */
main {
  /* background-color: var(--color5); */
  margin-left: 1vw;
  margin-right: 1vw;
}
html {
  text-align: center;
  background-color: var(--background);
  color: var(--foreground);
}
a {
  color: #37ff37;
  text-decoration-style: wavy;
}

div{
  margin: auto;
}

.post{
  color: var(--foreground);
  background-color: var(--background-dark);
  /* margin: 10px 50% 10px 50%; */
  /* width: 50em; */
  margin: 0px 4vw;
  border-style: outset;
  
}

.microposts{
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  grid-template-rows: auto;
  /* gap: 1em; */
}

.micropost{
  margin: 0px;
  color: var(--foreground);
  background-color: var(--background-dark);
  border-style: groove;
}

#firstpost {
  grid-column: 1 / 3;
}
#gptvibe{
  grid-column: 3 / 5;
  grid-row: 1 / 3;
}


.mobile_1250px {
  display: none;
}

@media (max-width: 1250px) {
  .desktop_1250px {
    display: none;
  }

  .mobile_1250px {
    display: block;
    width: 100%;
    overflow: hidden;
  }

  .mobile_1250px pre {
    margin: 0;
  }
}


.mobile_880px {
  display: none;
}

@media (max-width: 880px) {
  .desktop_880px {
    display: none;
  }

  .mobile_880px {
    display: block;
    width: 100%;
    overflow: hidden;
  }

  .mobile_880px pre {
    margin: 0;
  }
}

.mobile_569px {
  display: none;
}

@media (max-width: 569px) {
  .desktop_569px {
    display: none;
  }

  .mobile_569px {
    display: block;
    width: 100%;
    overflow: hidden;
  }

  .mobile_569px pre {
    margin: 0;
  }
}

.sageata {
  text-decoration: none;
}