I am using the Twitter Bootstrat Freelance theme (Freelancer - A Free Start Bootstrap Theme) and have incorporated Own Carousel.js (Demos | Owl Carousel | 2.0.0-beta.2.4).

All is working well apart from whenever I click an image to view it in a modal window, it appears the wrong size - until I resize my browser window, or refresh the page, or eg press f12. It then seems to 'fix itself'.

Not sure if this is a js conflict issue or I am doing something silly (I am quite new to js). I have looked at the console and can't see any errors, I have also tried different versions of jquery and bootstrap however no difference.

I have created a jsfiddle here bootstrap freelancer - JSFiddle If you view the jsfiddle, try click an image and once it opens in the modal window, resize the screen slightly and you will see what I mean. It somehow suddenly fixes itself.

I would appreciate any help or direction on this issue, as I am trying to create a personal project which needs to be finished quite soon :s