increase space between dashed border css

1div.two{border:2px dashed #FF0000}
2
3div.five:before {
4  content: "";
5  position: absolute;
6  border: 5px dashed #FF0000;
7  top: -3px;
8  bottom: -3px;
9  left: -3px;
10  right: -3px;
11}
12
13div.ten:before {
14  content: "";
15  position: absolute;
16  border: 10px dashed #FF0000;
17  top: -8px;
18  bottom: -8px;
19  left: -8px;
20  right: -8px;
21}
22
23div.odd:before {left:0;right:0;border-radius:60px}
24
25div {
26  overflow: hidden;
27  position: relative;
28
29
30  text-align:center;
31  padding:10px;
32  margin-bottom:20px;
33}
34
35<div class="two">Kupo nuts here</div>
36<div class="five">Kupo nuts<br/>here</div>
37<div class="ten">Kupo<br/>nuts<br/>here</div>
38<div class="ten odd">Kupo<br/>nuts<br/>here</div>

1.block {
2   width: 100px;
3   height: 100px;
4   /* dashed border */
5   background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23333' stroke-width='4' stroke-dasharray='6%2c 14' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
6}