Text verschieben

Hallo Leute, Ich bekomme es nicht hin den Text an die markierten Stellen zu verschieben ohne neue "graue Boxen" zu erstellen.
Kommentar abgeben zu diesen Beitrag/Code ?
Dann hier klicken

Der hier verwendete Code

<!DOCTYPE HTML>
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Poiret+One|Varela+Round' rel='stylesheet' type='text/css'>
<meta charset="utf-8">
<style>
* {
margin: 0;
padding: 0;
}
main , header , footer {
width:100%;
margin:0px auto;
padding:10px;
font-family: 'Poiret One';
line-height:20px;
letter-spacing:1px;
box-sizing:border-box;
}
main {
background:white;
display:flex;
}
.links,.rechts{
background:white;
color: Black;
display:flex;
flex:1;
padding: 1em;
font-weight: bold;
text-align: center;
}
main{
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX