header {
  background-color: transparent;
  margin: 0.1em 0.1em ;
  padding: 0.1em 0.2em;
}
  header div {
    background-color: transparent;
    margin: 0.1em 0.4em ;
    padding: 0.2em 0.5em;
  }
  header div>div:first-child {
    background-color: transparent;
    float: left;
    margin: 0.1em 0.4em ;
    padding: 0.2em 0.5em;
    width: 26px;
  }
  header div>div:last-child {
    background-color: transparent;
    margin: 0.1em 0.2em ;
    padding: 0.2em 0.2em;
  }
#back {
  background-color; transparent
  width: 23px; height: 34px;
  margin-top: -0.2em;
  display: block
}

#back:hover {

  border-radius: 50%;
  /*border: 1px solid;*/
  background-color: #eee;
  color: #000;

}

.backarrow {
  background-color: transparent; 
  width: 21px; 
  margin: 0.1em;
  margin-left: -0.05em;
  padding: 0.2em;
}

h1 {}

h1 {
  background-color: transparent;
  font-family: Arial,sans-serif;
  font-size: 1.12em;
  margin: 0.9em 0.6em 0.3em 0.2em;
  padding: 0.4em 0.4em;
  display: inline
}

#notice {
  background-color: transparent;
  margin: 0.9em 0.9em;
  padding: 0.6em 0.2em;
  max-width: 590px;
  font-family: Arial,sans-serif;
  border: 1px solid rgba(150, 150, 200, 0.3)
}
#avatar {
  background-color: transparent;
  width: 54px;
  float: left;
  margin: 0.1em;
  padding: 0.3em 0.2em;
}
#avatar img {
  background-color: transparent;
  width: 35px;
  margin: 0.1em 0.5em;
  margin-top: -0.7em;
  padding: 0.5em 0.1em;
}

#title {
  background-color: transparent;
  font-size: 0.9em;
  min-height: 48px
}

#title div:first-child {
  background-color: transparent;
  margin: 0 0.2em;
  padding: 0.2em 0.5em;
  font-weight: 700;
}

#title div a {color: #000; text-decoration: none}
#title div a:hover {text-decoration: underline}

#title div+div {
  background-color: transparent;
  margin: 0 0.2em;
  padding: 0.1em 0.5em;
  font-size: 1.0em;
  color: #888;
  font-weight: 500;
}

#desc  {
  background-color: transparent;
  margin: 0.2em;
  padding: 0.4em;
  font-size: 1.4em;

}

#time  {
  background-color: transparent;
  margin: 0.1em 0.3em;
  padding: 0.3em 0.86em;
  font-size: 0.9em;
  color: #777;
}

#time a:link {
  background-color: transparent;
  color: #224;
  text-decoration: none;
}
#time a:hover {
  background-color: transparent;
  text-decoration: underline
}

#time a:visited {
  background-color: transparent;
  color: #555;
  text-decoration: none;
}

/* status/photo  */

.photo img {width:50%; }
.img1 {max-width: 560px; border-radius: 15px;}

  .top-crop { 
    background-color: #422;
    overflow: hidden;
    border-radius: 15px;
    max-height: 280px;
    /*display: flex;*/
    /*align-items: flex-end;*/
    /*justify-content: center*/
    /*align-items: center; */
   }

.top-crop img {
    max-width: initial;

}


  .center {
    display: flex;
    justify-content: center;
    align-items: center; 
   }

/* Twitter card */

  .card { background-color: transparent; width: 400px:  color: #f22; clear: both; border: 1px solid #ccc; border-radius: 15px; padding-bottom: 0.4em; margin: 0.3em 0em}
  /*.card:hover { background-color: #000}*/
  .card img {width: 100%; border-radius: 15px 15px 0 0;}
  .card a {text-decoration: none; color: #900}
  .card a:hover {text-decoration: none; color: #900}
  .card span {color: #000}
  .card .title {background-color: transparent; display: block;  font-size: 0.65em; font-weight: 300; font-family: Verdana, Arial; margin: 0.8em 0.5em 0.4em 0.4em; padding: 0.1em 0.4em}
  .card .desc {background-color: transparent; color: #555; display: block; font-size: 0.65em; font-weight: 300; margin: 0.1em 0.3em; padding: 0.1em 0.9em 0.3em 0.6em;}
  .card .link { display: block}
  .card .linkurl {color: #555; font-weight: 300; margin: 0.3em 0em; padding: 0.4em 0em; font-size: 0.65em }
  .card .link svg {color: #ccc; width: 15px; margin-left: 16px}
  .card .top-crop {border-radius: 15px 15px 0 0;}


/* end of Twitter card */

/* start of summary card */
    .card2 {background-color: transparent;  overflow: hidden; border-radius: 15px; border: 1px solid #ccc}
    /*.card2:hover {background-color: #ee2; }*/
    .card2 img {width: 130px; }
    #content {
       background-color: transparent;
       font-family: Arial, Verda;
       font-size: 0.92em;
       margin: 0.4em; padding: 0.8em;
    }
    #col1 {
      background-color: transparent; float: left; 
      border-right: 1px solid #ccc; margin: 0; padding: 0;
    }
    #col2 {
      background-color: transparent;
      margin: 0em; padding: 0em;
}
#col1, #col2 {
  height: 130px;
  display: flex;
  justify-content: center;
  align-items: center;
}
/* Clear floats after the columns */
#col2:after {
  content: "";
  clear: both;
}
    .card2 a {text-decoration: none;}
    .card2 span {color: #000; font-size: 0.71em;}
    .card2 .title {background-color: transparent; display: block;   font-weight: 300; font-family: Verdana, Arial; margin: 0.1em 0em; padding: 0.2em 0em}
    .card2 .desc {background-color: transparent; color: #555; display: block; margin: 0.1em 0em; padding: 0.2em 0em; line-height: 1.2em;}
    .card2 .link { display: block}
    .card2 .linkurl {color: #555; font-size: 1.05em;}
    .card2 .link svg {color: #555; width: 15px}
/* end of summary card */