.speech-bubble {
    width: auto;
    margin: 20px auto;
    border: 5px solid rgb(200, 200, 200);
    padding: 20px;
    text-align: left;
    font-weight: normal;
    color:black;
    position: relative;
    background-color:white;
    border-radius:0px;
    text-transform: none !important;
}

.speech-bubble:before {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 11px solid transparent;
    border-right: 11px solid rgb(200, 200, 200);     /* same as border color */
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    left: -27px;
    top: calc(50% - 11px); /*i.e. half the height*/
     top: -webkit-calc(50% - 11px); /*i.e. half the height*/
}



.speech-bubble:after {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 11px solid transparent;
    border-right: 11px solid white;      /* same as interior color */
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    left: -20px;
    top: calc(50% - 11px); /*i.e. half the height*/
    top: -webkit-calc(50% - 11px); /*i.e. half the height*/
}


.speech-bubble-error {
    width: auto;
    margin: 20px auto;
    border: 5px solid crimson;
    padding: 20px;
    text-align: left;
    font-weight: normal;
    color:black;

    position: relative;
    background-color:white;
    border-radius:0px;
    text-transform: none !important;
}

.speech-bubble-error:before {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 11px solid transparent;
    border-right: 11px solid crimson;     /* same as border color */
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    left: -27px;
    top: calc(50% - 11px); /*i.e. half the height*/
     top: -webkit-calc(50% - 11px); /*i.e. half the height*/
}



.speech-bubble-error:after {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 11px solid transparent;
    border-right: 11px solid white;      /* same as interior color */
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    left: -20px;
    top: calc(50% - 11px); /*i.e. half the height*/
    top: -webkit-calc(50% - 11px); /*i.e. half the height*/
}