body {
    font-style: normal;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;  /* Browserdefault, 16px  */
    background-color:rgb(255, 247, 216);
    color:rgb(109, 107, 102);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    height: 100vh;
    };
h1 {font-size: 1.75rem; } /* 28/16 = 1.75 */
h2 {font-size: 1.375rem; } /* 22/16 = 1.375 */
p  {font-size: 0.875rem; }; /* 14/16 = 0.875 */
/*Knopf*/
button {
    padding: 0.3em;
    background-color: transparent;
    border: none;
    cursor: pointer;
    color:rgb(109, 107, 102);}

form{
    color:rgb(109, 107, 102);
    background-color: rgb(255, 247, 216);
    font-family: Arial, Helvetica, sans-serif;}
ul
{list-style-type: type " ";}
/*output*/
output {
	position: relative;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	height: 2em;
	color: white;
	background-image: rgb(197, 15, 30);
	border-radius: 1em;
	padding: 1em .5em;
	display: inline-block;
    margin-left: -1%;};
    

      .content {
        box-shadow: 
        rgba(156, 172, 172, 0.2) 0px 2px 2px, 
        rgba(156, 172, 172, 0.2) 0px 4px 4px, 
        rgba(156, 172, 172, 0.2) 0px 8px 8px, 
        rgba(156, 172, 172, 0.2) 0px 16px 16px, 
        rgba(156, 172, 172, 0.2) 0px 32px 32px, 
        rgba(156, 172, 172, 0.2) 0px 64px 64px;
        border-radius: 3px;
        height: 100vh;
        max-height: 600px;
        width: 100vw;
        max-width: 400px;
        display: flex;
        flex-direction: column;
      }
      .messages {
        flex-grow: 1;
        padding: 20px 30px;
        overflow: auto;
      }
      .message {
        display: flex;
        flex-direction: column;
      }
      .message--mine {
        align-items: flex-end;
      }
      .message--theirs {
        align-items: flex-start;
      }
      .message__name {
        padding: 10px 0;
      }
      .message__bubble {
        padding: 20px;
        border-radius: 3px;
      }
      .message--theirs .message__bubble {
        background: #6363bf;
        color: white;
      }
      .message--mine .message__bubble {
        background: rgba(156, 172, 172, 0.2);
      }
      .footer {
        line-height: 76px;
        border-top: 1px solid rgba(156, 172, 172, 0.2);
        display: flex;
        flex-shrink: 0;
      }
      input {
        height: 76px;
        border: none;
        flex-grow: 1;
        padding: 0 30px;
        font-size: 16px;
        background: transparent;
      }