/* 2021feb */
#cblock69, #cblock68, #cblock67, #cblock66, #cblock65, #cblock64, #cblock63, #cblock62, #cblock59,
#cblock58, #cblock57, #cblock56, #cblock55, #cblock1, #cblock2, #cblock3, #cblock4, #cblock5,
#cblock6, #cblock7, #cblock8, #cblock9, #cblock10, #cblock11, #cblock12, #cblock13, #cblock14,
#cblock15, #cblock16, #cblock17, #cblock18, #cblock19, #cblock20, #cblock21, #cblock22, #cblock23, 
#cblock24, #cblock25, #cblock26, #cblock27, #cblock28, #cblock29, #cblock30, #cblock31, #cblock32,
#cblock33, #cblock34, #cblock35, #cblock36, #cblock37, #cblock38, #cblock39, #cblock40, #cblock41,
#cblock42, #cblock43, #cblock44, #cblock45, #cblock46, #cblock47, #cblock48, #cblock49, #cblock50,
#cblock51, #cblock52, #cblock53, #cblock54 {
  padding: 0.125rem 0.625rem; /* top and bottom 0.125rem, right and left 0.625rem */
  border-top-style: solid;
  border-top-color: #FA8072; /* LAVENDER MIST */;
  border-top-width: 0.25rem; 
}
.avatarimg {
  margin-top: 10px; 
  width: 72px;
  height:72px;
/*  padding-left: 0.5%; */
  border-radius: 50%;
}
/* 202202Lighthouse Start */
.yellupdownimg {
  width: 16px;
  height:16px;
} /* 202202Lighthouse End */
.commentdetail {
  float: left;
}
.avatardate {
  font-size: 1em; /* 13 / 16 changed from 0.8125*/
  font-weight: bold;
  text-align: center; 
/*  padding-left: 0.5%; */
}
.inlineNoDisplay {
  display: none;
}
.cIdent {
  display: block;
  padding-left: 2em;
}
.smallerfont {
  font-size: 1em; 
}
.colorblack {
  color: black;
}
.bgcolor {
  background-color: #FA8072; /* LAVENDER MIST */
}
.boldul {
  font-weight: bold;
  text-decoration: underline;
}
.boldcolor {
  font-weight: bold;
  color: #8c5416; /* #8f250c; is good too */
}

.raven {
  color : #373D3F; /* Raven */ 
}
.whitecolor {
  color: white;
}
.lighterdaisy {
  background-color : #cd594a; /* #c02f1d; #d68021; c2571a is good too */ 
}
.btnMore {
  font-weight: bold;
  color: yellow; /* #8f250c; is good too */
  text-decoration: none;
}
a.btnMore:visited {text-decoration: none; color: yellow; font-weight:bold;}
a.btnMore:hover {text-decoration: none; color: lime; font-weight:bold;}
.btnLess {
  font-weight: bold;
  color: yellow; /* #8f250c; is good too */
  text-decoration: none;
  display: none;
}
a.btnLess:visited {text-decoration: none; color: yellow; font-weight:bold;}
a.btnLess:hover {text-decoration: none; color: lime; font-weight:bold;}


/* ============================================================================================================================
== BUBBLE WITH AN ISOCELES TRIANGLE
** ============================================================================================================================ */
/* THE SPEECH BUBBLE
------------------------------------------------------------------------------------------------------------------------------- */
.triangle-isosceles {
  position:relative;
  padding:5px; /* changed from just padding 15px */
  margin:0em 6px 0em 0em; /* top 0em changed from 1em, right and left 0, bottom 0em changed from 3em */
  color:white;
  background:#cd594a; /* #D68021; :#f3961c; default background for browsers without gradient support */
  /* css3 */
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#cd594a), to(#cd594a));
  background:-moz-linear-gradient(#cd594a, #cd594a);
  background:-o-linear-gradient(#cd594a, #cd594a);
  background:linear-gradient(#cd594a, #cd594a);
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
}
/* Variant : for top positioned triangle
------------------------------------------ */
.triangle-isosceles.top {
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#cd594a), to(#cd594a));
  background:-moz-linear-gradient(#cd594a, #cd594a);
  background:-o-linear-gradient(#cd594a, #cd594a);
  background:linear-gradient(#cd594a, #cd594a);
}
/* THE TRIANGLE
------------------------------------------------------------------------------------------------------------------------------- */
/* creates triangle */
.triangle-isosceles:after {
  content:"";
  position:absolute;
  bottom:-15px; /* value = - border-top-width - border-bottom-width */
  left:50px; /* controls horizontal position */
  border-width:15px 15px 0; /* vary these values to change the angle of the vertex */
  border-style:solid;
  border-color:#cd594a transparent;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}
/* Variant : top
------------------------------------------ */
.triangle-isosceles.top:after {
  top:-15px; /* value = - border-top-width - border-bottom-width */
  right:50px; /* controls horizontal position */
  bottom:auto;
  left:auto;
  border-width:0 15px 15px; /* vary these values to change the angle of the vertex */
  border-color:#cd594a transparent;
}
/* need to take into account 1.6% for margin, so the span_avatar plus span_comment
   plus 1.6 must equal 100
*/
.span_avatar {
  width: 11.1%; 
  display: none;
}
.span_comment {
  width: 100%; 
}
/* make the images visible for desktops and tablets */
@media only screen and (min-width:40em) { /* 40em will be 40x16 i.e. >= 640px */
  .span_avatar {
    display: block;
  }
  .span_comment {
    width: 87.3%; 
  }
}
.commentpadding {
  padding: 1rem 1rem; /* top and bottom 0.125rem, right and left 0.625rem */
}
  
