.component.shape{width:200px;height:200px;display:-webkit-flex;display:-ms-flexbox;display:-ms-flex;display:flex;-webkit-align-items:center;-ms-align-items:center;align-items:center;margin:0 auto}
.component.shape .content{position:relative;margin:0 auto;height:160px}
.component.shape .content.speech{width:194px}
.component.shape .content.speech>div{height:calc(160px - 12px*2)}
.component.shape .content.circle{width:160px}
.component.shape .content.balloon{width:144px}
.component.shape .content.balloon>div{height:calc(160px - 8px*2)}
.component.shape .content svg{position:absolute;fill:currentColor}
.component.shape .content.turquoise{color:#31a3ae}
.component.shape .content.orange{color:#ff5f00}
.component.shape .content.liliac{color:#c5569a}
.component.shape .content>div{position:relative;display:-webkit-flex;display:-ms-flexbox;display:-ms-flex;display:flex;-webkit-justify-content:center;-ms-justify-content:center;justify-content:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;text-align:center;-webkit-align-items:center;-ms-align-items:center;align-items:center;-webkit-flex-grow:0;-ms-flex-grow:0;flex-grow:0;height:100%;font-family:SwedbankHeadlineBlack,Arial,sans-serif;color:#fff}
.component.shape .content.large,.component.shape .content span{font-size:2.875rem;line-height:3rem}
.component.shape .content.medium{font-size:1.75rem;line-height:2.125rem}
.component.shape .content.small,.component.shape .content.smallAndLarge{font-size:1.25rem;line-height:1.375rem}
.component.shape .content.small>div,.component.shape .content.smallAndLarge>div{padding:0 4px}