Skip to content

Tenzing / banners-with-skip

Go to a project
Toggle navigation
Toggle navigation pinning
e3cb0cf1 by Dan Rempel
Options

Code 300x250 gif and 300x600 html5 ads for approval

1 parent 3947aab6
Inline Side-by-side
Showing 24 changed files with 358 additions and 0 deletions
This diff could not be displayed because it is too large.
<svg xmlns="http://www.w3.org/2000/svg" width="272" height="570.95" viewBox="0 0 272 570.95"><defs><style>.cls-1{fill:#fff;}</style></defs><title>border</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><polygon class="cls-1" points="1.1 0.43 1.06 1.23 1.16 3.29 1.1 0.43"/><path class="cls-1" d="M1.33,14c0-.4.05-.2.07-.61L1.1,5.48C.93,9,1.44,11.69,1.33,14Z" transform="translate(0 -0.06)"/><path class="cls-1" d="M1.3,16.37a44.3,44.3,0,0,0,.12,5.08C1.31,20.37,1.45,15.7,1.3,16.37Z" transform="translate(0 -0.06)"/><path class="cls-1" d="M1.37,287.72v-1C1.35,287.24,1.36,287.55,1.37,287.72Z" transform="translate(0 -0.06)"/><path class="cls-1" d="M1.84,358.51l.11.74c-.2-13.21,0-28.11-.08-42.08l0,.95c0-35.45-.14-68.14-.23-103.31l.06,1.3c0-1.7-.11-3.58-.1-5.48,0-.5.05.53.06,1.14.18-7.43-.12-21.82,0-26.46,0-2.09-.1-3-.15-1.85l-.22-85c0-1.35.07-1.59.14-1.22-.3-24-.18-49.08-.13-73.6-.08-.94-.08,2.5-.16.09-.1,7.88.19,14.44,0,21.59l-.07-.92c0,5.2.19,1.05.09,6.45-.06,2.13-.1-.53-.1.46,0,11.06,0,22.59.15,33-.16,2.57,0,11.88-.16,16,.06,2.86,0,5.73.16,6.82,0,38.7,0,78.24.06,117.88.32,18.55-.06,40.77,0,62.79,0,.15,0,.13,0,0,.08,7.18.11,17.64.07,26.21l.13,7.26c-.27,51.55-.08,104.24-.2,156.6L1.25,571l38.5,0,38.87-.19c-.08,0,.39,0-1.1.06l47.71,0,0,0c39.08-.26,81.34,0,119-.25h27.68c0-37.76-.06-79.37-.09-118.8l.06.11c-.13-38.84.2-76.38.1-115.13.14-39.85-.36-82-.17-122.16.31-24.87-.35-57.54,0-80.9.22-22.44.28-44.56.24-66.67L271.69.57l-9.21.06C218.21.46,174,.9,131.15.55,110.83.77,88.4.27,65.8.34l.81.08C58.49.18,48.53.74,43.46.39l.85,0C40,.2,34.34.8,31.73.59L31,.67c-5.2,0-.62-.1-4.63-.13-1.51,0-.57.16-3.72.11C22,.29,9.95.73,9.59.32c2.84,0-4.46-.16,1.93-.24C9.7,0,1,.06,1.76.23,1,.41-2.39.57,2.91.71L4,.58A17.68,17.68,0,0,1,6,.75c6.92,0,7.85.21,12.81.29,0,0-.1,0,0,0C22.15.86,26.84,1,29.53,1l1.08.07c1.63.15,7.87-.3,5.77,0L82.3.95c2.2-.1,12,0,8.6-.18,3.94.22,15.64.28,20,.27a6.42,6.42,0,0,1-1,0c8.43.29,10-.26,17.89.09,1.23-.25,14.35.08,18.82-.21,1,.06,1.3.1.95.15l42,.11c10.28-.22,24.89.1,33.73-.2,7.33.06,19.17.19,29.4.07l-1,0L271.22,1l.06,7,.1,6.16c-.29,3.41-.23,8.4-.32,13.38.13,7.7.09,23.25.21,35-.13,1.8.06,9.7-.14,10.3.37,32.93.24,73.65,0,108.81v-.51c.11,4.56.34,9.82.47,14.46,0,.46,0,.4,0-.57,0,6.42-.15,12.43-.12,18.84,0-.05,0-.05-.06-1.09.09,6-.15,12.44,0,19.55l-.05.4.07,4.52c-.06-.11-.16-.28-.14-2.7.07,55.14.15,112.05.22,168.66l-.06-2.08.11,11a8.51,8.51,0,0,1-.06-1.11c-.11,14,.07,28.49,0,42.12,0-.06-.09-2.13-.13-.22.17,10.09-.22,16.2.13,21.25,0,.47-.1.79-.13-.24.12,28.06.11,56.88.05,85.15l.11,11.12-31.13.06c-10.61,0-21.25,0-31.56.12l.12-.07c-31.67.23-65.26,0-98.08,0l-36.53.05-.34-.08c-11.48.15-23.55.09-35.73,0l-18.32-.07-9.12,0-9,.08v-.25l0,.23,1.28-.09-1.23,0,0-1.68v-2.05c0-1.41,0-2.86,0-4.13,0-2.54,0-4.38-.16-3.74l.09-4.25c-.39-16.34.18-29.74-.07-49.76l.07,1.32c-.05-5.32-.1-11.53,0-15.47,0,.62,0,.33,0,1.59.27-16.67,0-35.23,0-52.82l.13,2c-.15-8.5,0-24.1-.08-35.28l.06.68-.09-5.66.12-.15Z" transform="translate(0 -0.06)"/><path class="cls-1" d="M1.7,211.76v.15C1.7,212.35,1.7,212.14,1.7,211.76Z" transform="translate(0 -0.06)"/><path class="cls-1" d="M20.56,1.06,18.78,1C18.92,1.06,20,1.05,20.56,1.06Z" transform="translate(0 -0.06)"/></g></g></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" width="134.51" height="14.43" viewBox="0 0 134.51 14.43"><defs><style>.cls-1{fill:#fff;}</style></defs><title>donatehere</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M37,17H32.6V3.12H37c4.84,0,7.34,2.84,7.34,6.93S41.75,17,37,17ZM37,5.32H35.26v9.51H37c2.92,0,4.68-1.49,4.68-4.76S39.78,5.32,37,5.32Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M53.39,17.29c-4,0-6.51-2.9-6.51-7.2s2.58-7.24,6.55-7.24,6.51,2.9,6.51,7.2S57.38,17.29,53.39,17.29Zm0-12.21c-2.38,0-3.81,2-3.81,5s1.43,5,3.81,5,3.83-2,3.83-5S55.79,5.08,53.41,5.08Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M72.1,17,65.55,7.46V17H63.07V3.12h2.52l6.25,9.11V3.12h2.48V17Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M87.34,17.17,86,13.5H80.75L79.48,17H76.84l5.22-14H84.9L90,16.69ZM83.37,6l-1.89,5.36h3.79Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M96.83,5.44V17H94.15V5.44H90V3.12h10.8l.38,2.32Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M103.72,17V3.12h8.08V5.38h-5.44V8.64h4.19l.36,2.3h-4.55v3.83H112V17Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M128.47,17V11h-5.91v6h-2.68V3.12h2.68V8.6h5.91V3.12h2.68V17Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M134.88,17V3.12H143V5.38h-5.44V8.64h4.19l.36,2.3h-4.55v3.83h5.64V17Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M156.39,16.67l-2.72.5L150,11.71h-1.21V17h-2.66V3.12h4.31c3.1,0,5,1.47,5,4.17a3.9,3.9,0,0,1-2.78,3.91ZM150.28,5.26h-1.47V9.67h1.35c1.65,0,2.68-.79,2.68-2.24S152,5.26,150.28,5.26Z" transform="translate(-32.6 -2.86)"/><path class="cls-1" d="M158.83,17V3.12h8.08V5.38h-5.44V8.64h4.19l.36,2.3h-4.55v3.83h5.64V17Z" transform="translate(-32.6 -2.86)"/></g></g></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="223" height="71" viewBox="0 0 223 71"><defs><style>.cls-1{isolation:isolate;}.cls-2{opacity:0.8;mix-blend-mode:multiply;}.cls-3{fill:#ff7175;}.cls-4{fill:none;stroke:#fff;stroke-miterlimit:10;stroke-width:1.14px;}</style></defs><title>donatehereback</title><g class="cls-1"><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><image class="cls-2" width="223" height="71" xlink:href="data:image/png;base64,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"/><rect class="cls-3" x="10.4" y="10.42" width="200.84" height="48.25" rx="5.48" ry="5.48"/><rect class="cls-4" x="10.4" y="10.42" width="200.84" height="48.25" rx="5.48" ry="5.48"/></g></g></g></svg>
\ No newline at end of file
<!DOCTYPE html>
<head>
</script>
<meta charset="utf-8">
<title>HTML5 GSAP Ad</title>
<meta name="ad.size" content="width=300,height=600">
<!--
<script type="text/javascript">
// IAB source: modified to allow link testing
var clickTag = "http://thecommonwell.ca/wave";
function getParameterByName(name)
{
var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
if (match == null || match == ""){
return clickTag;
} else{
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}
}
clickTag = getParameterByName('clickTag');
</script>
-->
<script type="text/javascript" src="https://quickresource.eyereturn.com/eyebuild/eyebuild_1_19.js"></script>
<script type="text/javascript">
window.onload = function() {
eyeBuild.initialize();
}
</script>
<style>
body{
margin: 0;
padding: 0;
width: 300px;
height: 600px;
line-height: 1.2;
font-size: 27px;
letter-spacing: .4;
color: #CD040B;
font-family: "Neue Haas Grotesk", Arial, sans-serif;
/*font-weight: 800;*/ /*BOLD-800, MEDIUM-600, ROMAN - 400*/
font-style: normal;
}
a{
text-decoration: none;
color: inherit;
}
#border{
position: absolute;
width: 300px;
height: 600px;
border: 1px solid #55565A;
background-color: #282828;
overflow: hidden;
cursor: pointer;
box-sizing: border-box;
background: url(img-50.jpg);
/* background: url(guide2@2x.png) no-repeat center center; */
/* background-size: 300px 600px ; */
}
#border-rough{
position: absolute;
left: 13px;
top: 16px;
width: 270px;
height: auto;
}
.txt1 {
position: absolute;
height: auto;
left: 45px;
opacity: 0;
}
#txt1a{
top:49px;
width: 142px;
}
#txt1b{
top:88px;
width: 136px;
}
#txt1c{
top:130px;
width: 91px;
}
#txt1d{
top:170px;
left: 43px;
width: 207px;
}
#txt1e{
top:211px;
width: 133px;
}
#blue{
width:300px;
height: 600px;
background-color: #007298;
opacity: 0;
}
.txt2 {
position: absolute;
height: auto;
left: 49px;
opacity: 0;
}
#txt2a{
top:49px;
left: 41px;
width: 153px;
}
#txt2b{
top:88px;
left: 40px;
width: 192px;
}
#txt2c{
top:129px;
left: 40px;
width: 87px;
}
#txt2d{
top:129px;
left: 135px;
width: 110px;
}
#txt2e{ /* x-raying */
top:172px;
left: 37px;
width: 121px;
}
#txt2f{
top:172px;
left: 170px;
width: 87px;
}
#txt2g{
top:216px;
left: 40px;
width: 228px;
}
#cta-btn{
position: absolute;
left: 29px;
top:307px;
opacity: 0;
}
#cta{
position: absolute;
left: 73px;
top:334px;
opacity: 0;
}
/*
#tag-mask{
position: absolute;
width:0;
height:100%;
overflow: hidden;
}
*/
#logo{
width: 198px;
height: auto;
position: absolute;
left: 38px;
bottom:40px;
opacity: 0;
}
</style>
</head>
<body>
<a href="javascript:eyeBuild.doClick(0)" class="cta">
<div id="border">
<img id="logo" src="logo_1@2x.png" alt="Huntsville Hospital Foundation logo. Healthcare for Life. Here.">
<img id="txt1a" class="txt txt1" alt="Laughing," src="txt1-laughing@2x.png">
<img id="txt1b" class="txt txt1" alt="splashing," src="txt1-splashing@2x.png">
<img id="txt1c" class="txt txt1" alt="skiing," src="txt1-skiing@2x.png">
<img id="txt1d" class="txt txt1" alt="wake-jumping," src="txt1-wakejumping@2x.png">
<img id="txt1e" class="txt txt1" alt="climbing?" src="txt1-climbing@2x.png">
<div id="blue"></div>
<img id="txt2a" class="txt txt2" alt="We're ready" src="txt2-were@2x.png">
<img id="txt2b" class="txt txt2" alt="with mending," src="txt2-withmending@2x.png">
<img id="txt2c" class="txt txt2" alt="fixing," src="txt2-fixing@2x.png">
<img id="txt2d" class="txt txt2" alt="healing," src="txt2-healing@2x.png">
<img id="txt2e" class="txt txt2" alt="x-raying," src="txt2-xraying@2x.png">
<img id="txt2f" class="txt txt2" alt="caring" src="txt2-caring@2x.png">
<img id="txt2g" class="txt txt2" alt="at Huntsville Hospital Emergency." src="txt2-hhfe.svg">
<img id="cta-btn" src="donatehereback.svg" alt="Donate Here">
<img id="cta" src="donatehere.svg" alt="Donate Here">
<img id="border-rough" src="border.svg" alt="decorative border">
<!-- <div id="tag-mask"> -->
</div>
<!--
-->
</div>
</a>
<!-- GREENSOCK-->
<script src="TweenMax.min.js"></script>
<script>
function stage1(){
var tl = new TimelineMax({repeat:1, repeatDelay:4}); /* {repeat:2, repeatDelay:2} */
var d=.35;
tl.to("#txt1a", d, {opacity:1, ease:Power1.easeOut, delay:d });
tl.to("#txt1b", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#txt1c", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#txt1d", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#txt1e", d, {opacity:1, ease:Power1.easeInOut, delay:d });
// phase 2
tl.to(".txt1", d, {opacity:0, ease:Power1.easeInOut, delay:2 });
tl.to("#blue", d, {opacity:1, ease:Power1.easeInOut, delay:0 });
tl.to("#logo", .7, {opacity:1, ease:Power1.easeInOut, delay:-d });
tl.to("#txt2a", d, {opacity:1, ease:Power1.easeOut, delay:0 });
tl.to("#txt2b", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#txt2c", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#txt2d", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#txt2e", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#txt2f", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#txt2g", d, {opacity:1, ease:Power1.easeInOut, delay:d });
tl.to("#cta-btn", d, {opacity:1, ease:Linear.easeNone, delay:d });
tl.to("#cta", d, {opacity:1, ease:Linear.easeNone, delay:0 });
/*
tl.fromTo("#tag-mask", d, {width:0}, {width:320, ease:Linear.easeNone, delay:-.2 });
tl.fromTo("#tag-mask", d, {width:0}, {width:320, ease:Linear.easeNone, delay:0 });
tl.fromTo("#tag-mask", d, {width:0}, {width:320, ease:Linear.easeNone, delay:0 });
*/
console.log( "time: " + tl.totalDuration() );
}
//---------------------
stage1();
</script>
</body>
</html>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" width="226.88" height="65.09" viewBox="0 0 226.88 65.09"><defs><style>.cls-1{fill:#fff;}</style></defs><title>txt2-hhfe</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M8.93,20l-.31-1.76A7.29,7.29,0,0,1,4,20.3c-2.21,0-4-1.12-4-3.5,0-2.94,2.24-4.51,8.57-5.1V10.56c0-1.85-1.09-2.74-2.91-2.74A9.84,9.84,0,0,0,1.15,9L1,7.76A11.23,11.23,0,0,1,5.71,6.61C8.4,6.61,9.86,8,9.86,10.5V20ZM8.57,12.8c-5.43.59-7.22,1.74-7.22,3.89A2.4,2.4,0,0,0,4,19.15a7.52,7.52,0,0,0,4.54-2.1Z"/><path class="cls-1" d="M17.58,20.24c-1.88,0-3.11-.78-3.11-3V8h-2V6.86h2V2.18l1.32-.28v5H19L19.17,8H15.78v9c0,1.54.62,2.07,2.07,2.07a5.92,5.92,0,0,0,1.32-.2l.2,1.06A5.42,5.42,0,0,1,17.58,20.24Z"/><path class="cls-1" d="M42.69,20V10.5H31.18V20H29.84V.7h1.34V9.3H42.69V.7H44V20Z"/><path class="cls-1" d="M57.89,20l-.34-2c-1.6,1.4-3.05,2.27-4.79,2.27-2.72,0-4-1.54-4-4.17V6.86h1.32V16c0,2,1,3.08,2.83,3.08,1.46,0,3-.84,4.62-2.38V6.86h1.32V20Z"/><path class="cls-1" d="M71.84,20V10.86c0-2-1-3.08-2.83-3.08-1.46,0-3,.84-4.62,2.38V20H63.07V6.86h1l.34,2c1.6-1.4,3.05-2.27,4.79-2.27,2.72,0,4,1.54,4,4.17V20Z"/><path class="cls-1" d="M80.86,20.24c-1.88,0-3.11-.78-3.11-3V8h-2V6.86h2V2.18l1.32-.28v5h3.22L82.45,8H79.06v9c0,1.54.62,2.07,2.07,2.07a5.92,5.92,0,0,0,1.32-.2l.2,1.06A5.42,5.42,0,0,1,80.86,20.24Z"/><path class="cls-1" d="M89.85,20.24a10.19,10.19,0,0,1-4.68-1.18l.25-1.29A9.39,9.39,0,0,0,90,19.07c2,0,3.25-.87,3.25-2.41,0-1.37-.81-2.07-3.64-2.86s-4-1.71-4-3.72S87.3,6.61,89.9,6.61a8.64,8.64,0,0,1,3.86.9l-.22,1.26a8.06,8.06,0,0,0-3.7-1c-2.07,0-3,1-3,2.18s.79,1.85,3.14,2.49c3,.81,4.54,1.85,4.54,4.06C94.52,18.93,92.59,20.24,89.85,20.24Z"/><path class="cls-1" d="M102.77,20.16h-1.2L96.64,7,98,6.72l4.26,11.84,4.2-11.7h1.37Z"/><path class="cls-1" d="M111.47,3.3a1.19,1.19,0,0,1-1.15-1.15A1.15,1.15,0,0,1,111.47,1a1.12,1.12,0,0,1,1.12,1.12A1.17,1.17,0,0,1,111.47,3.3ZM110.83,20V6.86h1.29V20Z"/><path class="cls-1" d="M116.49,20V.28L117.78,0V20Z"/><path class="cls-1" d="M122.15,20V.28L123.44,0V20Z"/><path class="cls-1" d="M137.65,13.44h-9.3c0,3.36,1.57,5.71,4.51,5.71a7.13,7.13,0,0,0,4.56-2l.2,1.23a7.34,7.34,0,0,1-4.82,1.93c-3.47,0-5.8-2.58-5.8-6.86s2.41-6.86,5.6-6.86c3.36,0,5,2.94,5,6.58Zm-5-5.77c-2.49,0-3.89,1.93-4.2,4.68h7.84C136.17,9.77,134.91,7.67,132.61,7.67Z"/><path class="cls-1" d="M14.2,60V50.5H2.69V60H1.34V40.7H2.69v8.6H14.2V40.7h1.34V60Z"/><path class="cls-1" d="M25.41,60.3c-3.28,0-5.8-2.52-5.8-6.86s2.6-6.86,5.8-6.86,5.82,2.49,5.82,6.86S28.63,60.3,25.41,60.3Zm0-12.57c-2.86,0-4.42,2.32-4.42,5.71s1.6,5.71,4.42,5.71,4.45-2.3,4.45-5.71S28.26,47.73,25.41,47.73Z"/><path class="cls-1" d="M38.27,60.24a10.19,10.19,0,0,1-4.68-1.18l.25-1.29a9.39,9.39,0,0,0,4.56,1.29c2,0,3.25-.87,3.25-2.41,0-1.37-.81-2.07-3.64-2.86s-4-1.71-4-3.72,1.74-3.47,4.34-3.47a8.65,8.65,0,0,1,3.86.9L42,48.76a8.06,8.06,0,0,0-3.7-1c-2.07,0-3,1-3,2.18s.78,1.85,3.14,2.49c3,.81,4.54,1.85,4.54,4.06C42.94,58.93,41,60.24,38.27,60.24Z"/><path class="cls-1" d="M51,60.19a9.32,9.32,0,0,1-3.53-.67v5.29l-1.32.28V46.86h1l.34,1.9a5.4,5.4,0,0,1,4.2-2.18c2.91,0,5.4,2.07,5.4,6.5C57.06,57.86,54.2,60.19,51,60.19Zm.62-12.4c-1.6,0-2.83.92-4.14,2.41v8A7.86,7.86,0,0,0,51,59c2.63,0,4.7-1.88,4.7-5.91C55.68,49.66,54,47.78,51.63,47.78Z"/><path class="cls-1" d="M61.26,43.3a1.19,1.19,0,0,1-1.15-1.15A1.15,1.15,0,0,1,61.26,41a1.12,1.12,0,0,1,1.12,1.12A1.17,1.17,0,0,1,61.26,43.3ZM60.62,60V46.86H61.9V60Z"/><path class="cls-1" d="M70,60.24c-1.88,0-3.11-.78-3.11-3V48h-2V46.86h2V42.18l1.32-.28v5h3.22L71.6,48H68.21v9c0,1.54.62,2.07,2.07,2.07a5.92,5.92,0,0,0,1.32-.2l.2,1.06A5.42,5.42,0,0,1,70,60.24Z"/><path class="cls-1" d="M83.08,60l-.31-1.76a7.29,7.29,0,0,1-4.65,2c-2.21,0-4-1.12-4-3.5,0-2.94,2.24-4.51,8.57-5.1V50.56c0-1.85-1.09-2.74-2.91-2.74A9.83,9.83,0,0,0,75.3,49l-.17-1.23a11.22,11.22,0,0,1,4.73-1.15C82.55,46.61,84,48,84,50.5V60Zm-.36-7.22c-5.43.59-7.22,1.74-7.22,3.89a2.4,2.4,0,0,0,2.69,2.46,7.53,7.53,0,0,0,4.54-2.1Z"/><path class="cls-1" d="M88.23,60V40.28L89.52,40V60Z"/><path class="cls-1" d="M101.28,60V40.7H111v1.2h-8.43V49.3h6.78l.17,1.2h-6.94v8.32h8.71V60Z"/><path class="cls-1" d="M131.82,60V50.86c0-2-.87-3.08-2.77-3.08-1.4,0-2.88.81-4.54,2.32V60h-1.29V50.86c0-2-.87-3.08-2.77-3.08-1.4,0-2.91.81-4.54,2.3V60H114.6V46.86h1l.34,1.9c1.57-1.34,3-2.18,4.7-2.18,2.07,0,3.25.84,3.7,2.38,1.65-1.46,3.14-2.38,4.93-2.38,2.72,0,3.92,1.51,3.92,4.12V60Z"/><path class="cls-1" d="M147.21,53.44h-9.3c0,3.36,1.57,5.71,4.51,5.71a7.13,7.13,0,0,0,4.56-2l.2,1.23a7.34,7.34,0,0,1-4.82,1.93c-3.47,0-5.8-2.58-5.8-6.86s2.41-6.86,5.6-6.86c3.36,0,5,2.94,5,6.58Zm-5-5.77c-2.49,0-3.89,1.93-4.2,4.68h7.84C145.72,49.77,144.46,47.67,142.17,47.67Z"/><path class="cls-1" d="M152.05,51.37V60h-1.32V46.86h.87L152,49.6a6,6,0,0,1,4.73-3l.22,1.23A6.38,6.38,0,0,0,152.05,51.37Z"/><path class="cls-1" d="M170.3,46.64l.25,1.46-2.8.31a4.11,4.11,0,0,1,.87,2.6,4.48,4.48,0,0,1-4.79,4.42,6.21,6.21,0,0,1-1.26-.14c-.76.42-1.06.73-1.06,1.06,0,.59.59.84,3.08,1.32l1,.2c3,.59,4.51,1.43,4.51,3.28,0,2.38-2.74,3.86-6.13,3.86s-5.88-1.2-5.88-3.42c0-1.32,1.09-2.6,3.19-3.58-.76-.42-1.12-.87-1.12-1.4,0-.7.45-1.18,1.32-1.71A4.18,4.18,0,0,1,159,51a4.48,4.48,0,0,1,4.73-4.42,5,5,0,0,1,3.28,1.12Zm-10.86,14.9c0,1.6,2.07,2.41,4.65,2.41,2.77,0,4.7-1.15,4.7-2.63,0-1.2-1-1.76-3.72-2.3l-1-.2-1.57-.34C160.42,59.35,159.44,60.38,159.44,61.53Zm4.34-13.92A3.22,3.22,0,0,0,160.39,51a3.46,3.46,0,0,0,6.92,0A3.36,3.36,0,0,0,163.78,47.62Z"/><path class="cls-1" d="M182.88,53.44h-9.3c0,3.36,1.57,5.71,4.51,5.71a7.13,7.13,0,0,0,4.56-2l.2,1.23A7.34,7.34,0,0,1,178,60.3c-3.47,0-5.8-2.58-5.8-6.86s2.41-6.86,5.6-6.86c3.36,0,5,2.94,5,6.58Zm-5-5.77c-2.49,0-3.89,1.93-4.2,4.68h7.84C181.39,49.77,180.13,47.67,177.84,47.67Z"/><path class="cls-1" d="M195.17,60V50.86c0-2-1-3.08-2.83-3.08-1.46,0-3,.84-4.62,2.38V60h-1.32V46.86h1l.34,2c1.6-1.4,3.05-2.27,4.79-2.27,2.72,0,4,1.54,4,4.17V60Z"/><path class="cls-1" d="M205.64,60.3c-3.22,0-5.8-2.52-5.8-6.86s2.6-6.86,5.88-6.86A7,7,0,0,1,210,48l-.25,1.34a6,6,0,0,0-4.06-1.65c-2.8,0-4.45,2.32-4.45,5.71s1.6,5.71,4.56,5.71a6.12,6.12,0,0,0,4.12-1.68l.17,1.23A6.69,6.69,0,0,1,205.64,60.3Z"/><path class="cls-1" d="M218,62c-.81,2.18-1.76,3-3.53,3a3.89,3.89,0,0,1-.62-.06l-.2-1.15c.2,0,.45,0,.84,0,1.15,0,1.76-.48,2.32-1.93l.7-1.79L212.38,47l1.29-.28,4.48,11.82,4.23-11.68h1.37Z"/><path class="cls-1" d="M225.2,60V57.75h1.68V60Z"/></g></g></svg>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>HTML5 Online Ads</title>
<meta name="description" content="An interactive getting started guide for Brackets.">
<link rel="stylesheet" href="main.css">
<script src="main.js"></script>
</head>
<body>
<!-- <h3><a href="index.html">Summer 2017 Ads</a> &nbsp; &nbsp; | &nbsp; &nbsp;<a href="index_may.html">May 2016 Ads</a></h3> -->
<img src="300x250.gif" class="b300x250 stacked" alt="300x250" width="300" height="250">
<iframe id='' class="b300x600 stacked" scrolling="no" src="en_300x600/index.html"></iframe>
</body>
</html>
html {
background-color: #d4d4d4;
}
body {
margin: 0 auto;
padding: 2em 2em 4em;
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 1.5em;
color: #8e8e8e;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 600;
line-height: 1.3em;
margin-left: 10px;
}
a {
color: #8e8e8e;
}
a:hover {
color: #FFFFFF;
}
iframe, img {
margin: 10px;
border: 1px #d4d4d4 solid;
overflow: hidden;
iframe::-webkit-scrollbar {
display: none;
};
}
.stacked {
display: flex;
}
.b300x250 {
width: 300px;
height: 250px;
}
.b728x90 {
width: 728px;
height: 90px;
}
.b300x600 {
width: 300px;
height: 600px;
}
.b600x566 {
width: 600px;
height: 566px;
}
//js file
\ No newline at end of file