Thumbnail classes in CSS

Hello guys,

Hope someone can help me with this problem.

Bootstrap has thumbnails included, our site will use these on 3 certain ways:

1- Thumbnail without border (border and padding are still there, but on hover no action)
2- Hover Thumbnail (normally no border made it white, but on hover blue a border)
3- Normal Thumbnail (grey border, when hover blue border)
All have need the same padding and border size*


So the first 2 types are achieved with custom css:

1-
.row .thumbnail-white {
padding: 4px;
line-height: 1.42857143;
background-color: #ffffff;
border: 1px solid #ffffff;
border-radius: 4px;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
display: inline-block;
max-width: 100%;
height: auto;

}

2-
.row .thumbnail {
padding: 4px;
line-height: 1.42857143;
background-color: #ffffff;
border: 1px solid #ffffff;
border-radius: 4px;

}

My problem now is that the normal thumbnail acts like nr. 2-
Probably my CSS is a bit odd, been working with T3 and CSS for only 2 weeks

Greets and thanks for reading!