After creating the mockup I'm playing with different bootstrap versions + the html we have to take some decision about what to do with bootstrap.

• Layouts are mostly working (spanX…)
• Minor adjustments needed (padding, margin, fonts, line-heights…), check the Specific rules in the source code of the mockup.
• Replace all the responsive rules for proper ones, because all the environment (wrapper) has changed, responsive rules are not valid anymore.
• Adjust font-style in titles
• Adjust the video area
• Delete the .spanX class to pick te 100% of the space (profile, webinars…)
• Same issues found in Bootstrap-2.3.2 (last version in branch 2.x)
• IMHO: Easy to move our version to the last of this release (2.3.2), we have to adjust details but it's doable. As we're going to change environment (common parts) we should go page per page but changes should be few and common.

• Fonts need adjusts
• Buttons CSS are not working
• Layouts depending on spanX are not working. Span rules are not working at all, we should need to go through all the pages to check layouts
• Replace all the responsive rules for proper ones, because all the environment (wrapper) has changed, responsive rules are not valid anymore.
• Adjust font-style in titles
• Adjust the video area
• Delete the .spanX class to pick te 100% of the space (profile, webinars…)
• IMHO: Not that easy to change to the 3.x branch because the syntax has changed a lot (spanX is no longer existing, now it's like col-md-X…) and we should review page per page to check the layout. Sooner or later we should review page per page to adapt our contents to responsive resolutions… and don't know really if it's better to adapt the content to bootstrap-3 (or bootstrap-4) or just use bootstrap for .js components and make our own layouts. But this task is probably out of the scope of this ticket,

• They've dropped support for IE8 and IOS6 (IE9 and IOS7+ are ok)
• Bootstrap4 changes LESS → SASS
• Changed font-base 14px → 16px
• Dropped panels, thumbnails, and wells for a new all-encompassing component, cards.
• Dropped the Affix jQuery plugin
• They're using node + grunt + npm + ruby_bundler to create the dist (css/js) from source
• We can just download the compiled css/js to use it but we lose all the mixins features
• http://v4-alpha.getbootstrap.com/getting-started/build-tools/#tooling-setup
• http://v4-alpha.getbootstrap.com/migration/
• IMHO: Too much changes for a refactor. Probably it worths starting from scratch, but it's not our case.

1. I would discard any alpha version, it's not closed/stable yet and things are moving. On the other hand → too much work to move from 2.x to 4.x.
2. Upgrade from 2.x to 3.x is hard too, syntax has changed and we need to review every page. On the other hand we should review every page some time to try to adapt contents at least to tablet resolution. Dunno if the moment is now.
3. Upgrade from 2.3.0 to 2.3.2 is the faster option. It's almost done because the syntax has not changed. We have to check every page to see if the new css code (the new one from common parts) is doing bad things out there, but it should be not that difficult.
4. Use our own layouts + bootstrap for js components: If we depend the less from bootstrap we're not going to be involved in issues like this one, but there are some spots to discuss here:
   1. We don't want to change all the html, so the new-css-stuff has to be compatible with our html markup
   2. Have to look through all the pages changing/adapting only layout markup BUT other JS elements has to run as they are now (modals, dropdowns…)
   3. The new-css-stuff documentation is the key to know how to properly create new contents.