Can't fix the width of popup element (colorbox jquery override)

I have the following code on my site that's supposed to show a popup window

<span class="fbridge-signup-form" data-widget-id="21378"></span>
<script type="text/javascript">
(function() {
  var secure = ("https:" == document.location.protocol);
  var fb_js_host = (secure ? "https://www.fanbridge.com" : "http://widget-platform.fanbridge.com");
  window._FBRIDGE_WIDGETS_HOST = fb_js_host; var p, s, id = 'fbridge-widgetjssdk-v1';
  p = document.createElement('script'); p.id = id; p.type = 'text/javascript'; p.async = true;
  p.src = (secure ? "https://ssl.fbridgecdn.net" : "http://static.fbridgecdn.net") + '/js/fb/widget/v1/platform.js?_=' + ((new Date()).getTime());
  s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(p, s);

})();
</script>

It works fine, but the problem is that there's some setting with lightboxes on my Drupal site that makes this window of a smaller width and height than the actual content inside.

I tried getting the element with getElementByClassName or writing the width and heightparameters into the style property of fbridge-signup-form but it didn't work out.

Do you know what I could do to force it to be a certain width and height? Say 480px by 400px?

You can check the actual page on http://waytorussia.net/Moscow/Intro.html (it has a cookie set to show only once).

UPDATE: maybe it's possible to use another kind of popup so this one is not overridden by my other settings?

Solution

Thanks to @Vincent G and @KyleT for their help I found that I had to edit the CSS styles for colorbox module.

#cboxLoadedContent iframe{display:block; min-width: 480px; min-height: 400px; border:0;}

and

#colorbox{min-width: 480px !important; min-height: 400px !important; }

in the colorbox.css file which was part of my Drupal installation.

After that the widget was loading fine.