unable to override style block within wp_head()

Question

I am using the wpbootstrap theme based on bones. I noticed that my website had a white band along the top and I haven't been able to workout what was causing it however I have finally worked it out. the tag has a padding of 42px attributed. I have tried to override this within my css file but because it is loaded within wp_head() and includes !important it won't seem to work. Below is the code:

Part of header.php

wordpress head functions
    <?php wp_head(); ?>
    end of wordpress head

Loaded HTML on website:

<style type="text/css" media="screen">
html { margin-top: 32px !important; }
* html body { margin-top: 32px !important; }
@media screen and ( max-width: 782px ) {
    html { margin-top: 46px !important; }
    * html body { margin-top: 46px !important; }
}
</style>

my custom.css:

html {
margin-top: 0 !important;
}

Any help would be appreciated

Answer 1

I simply added the below code right before the closing head tag. I am not sure if this is the best way to do it but it works.

<style>
html {
margin-top: 0 !important;
}
</style>