Accordion widget in side html block

Hi,
I am using the accordion widget inside the HTML block however the final result displayed on the pages is not similar to the one I see in the HTML block. please review the following isuues:

1)The gray box padding of each accordion tab is not correct. in the HTML block, it is as I wish but when displayed on pages it is very narrow and does not go beyond the text height.
2) in the HTML block the whole gray box of the accordion tab is clickable but in the pages, the text is the only clickable part.
3) the navigation icons (plus, chevron..) in the HTML block is positioned next to the accordion text but it acts in a funny way in the pages when the accordion tab is closed and open.

Please see the attached images.

Thanks