

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">



.root{
--Primary:   #E95420;  /* Orange   */
--Secondary: #AEA79F;  /* Grau     */
--Success:   #34A945;  /* Gruen    */
--Info:      #17A2B8;  /* Blau     */
--Warning:   #EFB73E;  /* Gelb     */
--Danger:    #DF382C;  /* Rot      */
--Light:     #E9ECEF;  /* Hellgrau */
--Dark:      #772953;  /* Violett  */
}



blockquote { font-style: normal;
             font-size: 14px;
             background-color:  #E9ECEF;
             border-left-color: #17A2B8;
             border-left-width: 10px;
}

#achtung { font-style: italic;
           font-size: 14px;
           background-color:  #E9ECEF;
           border-left-color: #DF382C;
           border-left-width: 5px;
}

#ubuntu { font-style: normal;
          font-size: 14px;
          font-weight: bold; 
          background-color:  #E9ECEF;
          border-left-color: #772953;
          border-left-width: 5px;
}



#overflow {
  background: #E9ECEF;
  color: #772953;
  padding: 15px;
  width:  600px;
  height: 350px;
  overflow: scroll;
  border:2px solid #AEA79F;
}

.grid_2x3070 {
  display: grid;
  grid-template-columns: 30% 70%;
  gap: 10px;  
  padding: 5px;
}

.item1 {
  grid-column-start: 1;
  grid-column-end: span 1;
}

.item2 {
  grid-column-start: 2;
  grid-column-end: span 1;
}