Décalage de div avec overflow-wrap

Bonjour,

J'ai un petit souci de CSS avec overflow-wrap.

Voici le code, testable ici : http://argyxgames.com/logos/test
Quand je coupe un texte, la div se décale. Comment empêcher cela ?
Merci par avance.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<style>
.mot1 {
    padding-left:32px;
    font-size:1.6em;
    font-weight:bold;  
}
.mot2 {
    margin-top:20px;
    font-size:1.2em;
    font-weight:bold;
    overflow-wrap: break-word;
    line-height: 0.9em;
}
.frame {
    padding:3px 7px;
    margin:0 2px;
    background-color: white;
    border:1px solid black;
    display:inline-block;
    width:80px;
    height:120px;
}
</style>
</head>
 
<body>
 
<div class="frame">
    <div class="mot1">Mot1</div>
    <div class="mot2">Mot2</div>
</div>
<div class="frame">
    <div class="mot1">Mot1</div>
    <div class="mot2">Mot2</div> 
</div>
<div class="frame">
    <div class="mot1">Mot1</div>
    <div class="mot2">Mot2</div>
</div>
 
<br/> 
 
<div class="frame">
    <div class="mot1">Mot1</div>
    <div class="mot2">Mot2</div>
</div>
<div class="frame">
    <div class="mot1">Mot1</div>
    <div class="mot2">Mot2vraimentlong</div> 
</div>
<div class="frame">
    <div class="mot1">Mot1</div>
    <div class="mot2">Mot2</div>
</div>