@import url(https://fonts.bunny.net/css?family=heuristica:400|assistant:400);
@import url(https://unpkg.com/aos@next/dist/aos.css);
@import url(https://cdn.linearicons.com/free/1.0.0/icon-font.min.css);
.masonry {width:600px;
  display: grid;
  grid-template-columns: repeat(
    auto-fit,
    minmax(min(var(--item-width, 200px), 100%), 1fr)
  );
  grid-template-rows: masonry;
  gap: 1rem;
  grid-auto-flow: dense;

  > *,
  > astro-slot > * {
    align-self: center;
    grid-column-end: span var(--span, 1);
  }
}

/* Stylistic Purposes */
html {
  font-family: system-ui, sans-serif;
}

body {
  margin: 1rem;
}

.box {
  display: flex; 
  flex-flow: column;
  border:1px solid #f2d5e2; 
  background: white;
}

img {
  display: block; 
  max-width: 100%;
}

body{
background: #fff2f6;
color:#333;
  font-family:'assistant';
  display: flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  font-size:1em;
  }  
  ::selection {
  background-color:#f7cde5;
  color: black;
  text-shadow: none;
}

::-moz-selection {
  background-color:#f7cde5;
  color: black;
  text-shadow: none;
}
.content {display:flex;flex-direction:row;align-items: flex-start;
  justify-content: center;}
 
.box {}
.box p b {color:#d490cd}
.box .title {background-image: linear-gradient(40deg,#f7cde5 0%, #ffebeb 49%, #FFEBD4 100%);font-style:italic;
  border-top:1px solid #f2d5e2;border-bottom:1px solid #f2d5e2;
  align-items: center; font-size:1.1em;margin:0; ;padding-left:3px;font-family:'Heuristica';letter-spacing:2px;color:#848fb5}
  
.box .section {padding:1rem;}  
.box .icon img {max-width:250px;display:block;border-radius:100%}
#statuscafe {
  padding:1rem;
    background-color: azure;
    border: 1px solid midnightblue;
}
#statuscafe-username {
margin:0;
   
}
#statuscafe-content {
margin:0;
 
}
@media screen and (max-width: 1500px) {
 .content {width:100%;flex-direction:column;align-items:center;}
 .masonry {width:100%;}
 .box {width:100%}
}
@media screen and (max-width: 500px) {
 .content {width:100%;flex-direction:column;align-items:center;}
 .masonry {width:100%;display:flex;flex-direction:column}
 .box {width:100%}
}