Cube CSS animation for architecture website

I need to create a CSS animation for a website dedicated to architecture that replicates this cube effect with certain modifications: [login to view URL] 1) The cube on its 6 sides will only have one color with transparency effect: # 546D79 2) The cube must be 450 pixels wide by 450 pixels high. 3) The cube must have controls for its execution as TABS and not as radio buttons. 4) The TABS should also appear with an initial animation below the cube. 5) The cube should start with an implosion entry animation. 6) When hovering the mouse over the cube, it must be rotated on its own axis following the pointer. 7) In addition, the cube must contain a mouse DRAG effect that allows rotation on its own axis. 8) The texts inside the cube should be a momentary hyperlink to "#" I will assign the final link later. 9) By clicking the link, the cube should disarm or explode and then direct to the assigned link. 10) The font must be taken from Google Fonts: Open Sans 11) It must be RESPONSIVE or self-adapting for mobile. 12) Two versions are required: The first with the HTML, JS and CSS source as separate files. The second with the HTML, JS and CSS source in a single file. Check the document attached