JavaFX CheckBox changes size when clicking

When I click the checkbox it changes size, then after it's selected, click somewhere else on the GUI that isn't the checkbox and the checkbox box changes size by about 1px. How can I get this to stop? I have included a gif to show what I mean.

.check-box {
    -fx-background-radius: 20px;
    -fx-background-color: linear-gradient(to right, #030045, #002869);
    -fx-text-fill: #ffffff;
    -fx-padding: 6px 10px;
}

.check-box > .box {
    -fx-background-radius: 8px;
    -fx-background-color: white;
    -fx-padding: 3px;
}

.check-box:selected > .box > .mark,
.check-box:indeterminate  > .box > .mark {
    -fx-background-color: #030045;
}