styles.scss

/*-- scss:defaults --*/

// Colors
$green-highligts: #20be9f;
$grey-code-background: #2c3e501a;
$dark-blue: #2c3e50;

$light-grey: #F5F9FB;

/*-- scss:rules --*/ 

// Inline code
code {
  color: $green-highligts;
  background-color: $grey-code-background;
  border-radius: 5px;
  padding: 0.2em 0.25em 0.2em 0.25em
  //padding-top: 0.2em;
  //padding-right: 0.25em;
  //padding-bottom: 0.2em;
  //padding-left: 0.25em;
}


// Blockquote
blockquote {
  font-size: 1em;
  color: $dark-blue;
  border-left-color: $dark-blue;
}


/* Case usage */
.usercase {
  background-color: $light-grey;
  border-left: 6px solid $green-highligts;
  /*border: 1px solid #da222200;*/
  border-radius: 4px;
  padding: 10px 10px 10px 10px;
  margin: 10px 0px 10px 0px;
  position: relative;
  width: fit-content;
}

.usercase p {
 width: fit-content; 
 color: var(--primary);
 margin: 0;
}

.usercase-header {
  //margin-left: 0em;
  margin-top: -1px;
  padding-left:  60px;
  padding-top:  5px;
  padding-bottom: 0.1em;
  
  color: $dark-blue;
  background-color: $grey-code-background;
  
  border-top-right-radius: 10px;
  font-size: .9rem;
  font-weight: 600;
  background-size: 40px;
  background-repeat: no-repeat;
  background-position: 15px center;
  //background-image: url("goal.png");
  
  overflow-wrap: anywhere;
  flex: 1 1 auto !important;
  box-sizing: border-box;
}





.my_new_box {
  margin: 1em 0;
  border: 2px solid gray;
  border-left: 10px solid $green-highligts; 
  border-radius: 10px;
}