Cannot make leaderboard ad from Google DFP responsive

Hello everyone,

I am relatively new to these forums and I am in a bit of a bind, as my client needs a leaderboard ad responsive. The rest of the site is responsive however this ad (generated in Doubleclick) is not.

I have tried several different ways to make this work. For now, I inputted the following code in header.php (code taken from the following site: https://support.google.com/dfp_premium/answer/3423562?hl=en) and used a generated tag from the Doubleclick site itself for the ad.

Here is the code I put in the head section of header.php:
<script type=’text/javascript’>

var mapping = googletag.sizeMapping().
addSize([1024, 768], [970, 250]).
addSize([980, 690], [728, 90]).
addSize([640, 480], [120, 60]).
addSize([0, 0], [88, 31]).
// Fits browsers of any size smaller than 640 x 480
build();
adSlot.defineSizeMapping(mapping);

// This mapping will only display ads when user is on desktop sized viewport
var mapping1 = googletag.sizeMapping().
addSize([0, 0], []).
addSize([1050, 200], [1024, 120]). // Desktop
build();

// This mapping will only display ads when user is on mobile or tablet sized viewport
var mapping2 = googletag.sizeMapping().
addSize([0, 0], []).
addSize([320, 700], [300, 250]). // Tablet
addSize([1050, 200], []). // Desktop
build();

gptAdSlots[0] = googletag.defineSlot(‘/18345437/Header_Homepage_728x90’, [728, 90], ‘div-gpt-ad-1441331189265-0’).
defineSizeMapping(mapping1).
setCollapseEmptyDiv(true).
addService(googletag.pubads());

gptAdSlots[1] = googletag.defineSlot(‘/18345437/Header_Homepage_728x90’, [300, 250], ‘div-gpt-ad-1441331189265-0’).
defineSizeMapping(mapping2).
setCollapseEmptyDiv(true).
addService(googletag.pubads());

// Start ad fetching
googletag.enableServices();
</script>

// Ad Header

<script type=’text/javascript’>
(function() {
var useSSL = ‘https:’ == document.location.protocol;
var src = (useSSL ? ‘https:’ : ‘http:’) +
‘//www.googletagservices.com/tag/js/gpt.js’;
document.write(‘<scr’ + ‘ipt src=”‘ + src + ‘”></scr’ + ‘ipt>’);
})();
</script>

<script type=’text/javascript’>
googletag.cmd.push(function() {
googletag.defineSlot(‘/18345437/Header_Homepage_728x90’, [728, 90], ‘div-gpt-ad-1441331189265-0’).addService(googletag.pubads());
googletag.pubads().enableSingleRequest();
googletag.pubads().enableSyncRendering();
googletag.enableServices();
});
</script>

As for the ad code itself, I placed it in the body of header.php:

//Ad body

<!– /18345437/Header_Homepage_728x90 –>
<div id=’div-gpt-ad-1441331189265-0′ style=’height:90px; width:728px;’>
<script type=’text/javascript’>
googletag.cmd.push(function() { googletag.display(‘div-gpt-ad-1441331189265-0’); });
</script>
</div>

My question is, what am I missing here?

I have never spent so long trying to make something responsive ever.

I seriously need your help and I appreciate your time to read this long post.