Live Preview
Tag didn’t load? Click here and let us know!Share this result
Previews are deleted daily. Get a permanent share link sent to your inbox:
Script
<!DOCTYPE html>
<html stage-mask="">
<head>
<meta charset="utf-8">
<meta name="generator" content="Google Web Designer 16.0.2.0124">
<meta name="template" content="Banner 3.0.0">
<meta name="environment" content="gwd-dv360">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="gwdpage_style.css" rel="stylesheet" data-version="13" data-exports-type="gwd-page">
<link href="gwdpagedeck_style.css" rel="stylesheet" data-version="14" data-exports-type="gwd-pagedeck">
<link href="gwdgooglead_style.css" rel="stylesheet" data-version="9" data-exports-type="gwd-google-ad">
<link href="gwdimage_style.css" rel="stylesheet" data-version="17" data-exports-type="gwd-image">
<link href="gwdtaparea_style.css" rel="stylesheet" data-version="7" data-exports-type="gwd-taparea">
<style id="gwd-lightbox-style">
.gwd-lightbox {
overflow: hidden;
}
</style>
<style id="gwd-text-style">
p {
margin: 0px;
}
h1 {
margin: 0px;
}
h2 {
margin: 0px;
}
h3 {
margin: 0px;
}
</style>
<style>
html, body {
width: 100%;
height: 100%;
margin: 0px;
}
.gwd-page-container {
position: relative;
width: 100%;
height: 100%;
}
.gwd-page-content {
background-color: transparent;
transform: perspective(1400px) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
position: absolute;
transform-style: preserve-3d;
}
.gwd-page-content * {
transform-style: preserve-3d;
}
.gwd-page-wrapper {
background-color: rgb(255, 255, 255);
position: absolute;
transform: translateZ(0px);
}
.gwd-page-size {
width: 728px;
height: 90px;
}
.gwd-image-113k {
width: 728px;
height: 90px;
}
.gwd-image-14jo {
position: absolute;
left: 0px;
top: 0px;
}
.gwd-image-xti4 {
width: 110px;
height: 256px;
}
.gwd-image-13ds {
position: absolute;
transform-origin: 50% 50% 0px;
left: -10px;
top: -83px;
transform: translate3d(0px, 5px, 0px);
}
.gwd-image-14us {
width: 208px;
height: 303px;
}
.gwd-image-repz {
position: absolute;
transform-origin: 50% 50% 0px;
left: 606px;
top: -51px;
transform: translate3d(0px, 0px, 0px);
}
.gwd-image-174z {
width: 189px;
height: 48px;
}
.gwd-image-1873 {
position: absolute;
transform-origin: 50% 50% 0px;
top: 24px;
left: 521px;
}
.gwd-image-19k0 {
width: 269px;
height: 76px;
}
.gwd-image-jcn3 {
position: absolute;
transform-origin: 50% 50% 0px;
top: 14px;
left: 235px;
opacity: 0;
}
.gwd-image-erh7 {
width: 29px;
height: 80px;
}
.gwd-image-z8ma {
position: absolute;
transform-origin: 50% 50% 0px;
top: 11px;
left: 180px;
transform: translate3d(0px, 80px, 0px);
}
.gwd-image-iwqp {
width: 39px;
height: 57px;
}
.gwd-image-1xx9 {
position: absolute;
transform-origin: 50% 50% 0px;
left: 111px;
top: 4px;
transform: translate3d(0px, -65px, 0px);
}
.gwd-image-bwiw {
width: 70px;
height: 31px;
}
.gwd-image-10xr {
position: absolute;
transform-origin: 50% 50% 0px;
top: 53px;
left: 127px;
opacity: 0;
}
@keyframes gwd-gen-ne42gwdanimation_gwd-keyframes {
0% {
opacity: 0;
animation-timing-function: linear;
}
28.5714% {
opacity: 0;
animation-timing-function: linear;
}
42.8571% {
opacity: 1;
animation-timing-function: linear;
}
80% {
opacity: 1;
animation-timing-function: linear;
}
100% {
opacity: 0;
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-ne42gwdanimation {
animation: 3.5s linear 0s 1 normal forwards running gwd-gen-ne42gwdanimation_gwd-keyframes;
}
@keyframes gwd-gen-l5odgwdanimation_gwd-keyframes {
0% {
transform: translate3d(0px, -65px, 0px);
animation-timing-function: linear;
}
16.6667% {
transform: translate3d(0px, -65px, 0px);
animation-timing-function: linear;
}
22.2222% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
94.4444% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
100% {
transform: translate3d(0px, -65px, 0px);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-l5odgwdanimation {
animation: 9s linear 0s 1 normal forwards running gwd-gen-l5odgwdanimation_gwd-keyframes;
}
@keyframes gwd-gen-nwavgwdanimation_gwd-keyframes {
0% {
transform: translate3d(0px, 80px, 0px);
animation-timing-function: linear;
}
16.6667% {
transform: translate3d(0px, 80px, 0px);
animation-timing-function: linear;
}
22.2222% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
94.4444% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
100% {
transform: translate3d(0px, 80px, 0px);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-nwavgwdanimation {
animation: 9s linear 0s 1 normal forwards running gwd-gen-nwavgwdanimation_gwd-keyframes;
}
@keyframes gwd-gen-4oqigwdanimation_gwd-keyframes {
0% {
opacity: 0;
animation-timing-function: linear;
}
16.6667% {
opacity: 0;
animation-timing-function: linear;
}
22.2222% {
opacity: 1;
animation-timing-function: linear;
}
94.4444% {
opacity: 1;
animation-timing-function: linear;
}
100% {
opacity: 0;
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-4oqigwdanimation {
animation: 9s linear 0s 1 normal forwards running gwd-gen-4oqigwdanimation_gwd-keyframes;
}
@keyframes gwd-gen-165hgwdanimation_gwd-keyframes {
0% {
transform: translate3d(0px, 5px, 0px);
animation-timing-function: linear;
}
16.6667% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
33.3333% {
transform: translate3d(0px, 5px, 0px);
animation-timing-function: linear;
}
50% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
66.6667% {
transform: translate3d(0px, 5px, 0px);
animation-timing-function: linear;
}
83.3333% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
100% {
transform: translate3d(0px, 5px, 0px);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-165hgwdanimation {
animation: 9s linear 0s 1 normal forwards running gwd-gen-165hgwdanimation_gwd-keyframes;
}
@keyframes gwd-gen-1gr6gwdanimation_gwd-keyframes {
0% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
16.6667% {
transform: translate3d(0px, 5px, 0px);
animation-timing-function: linear;
}
33.3333% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
50% {
transform: translate3d(0px, 5px, 0px);
animation-timing-function: linear;
}
66.6667% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
83.3333% {
transform: translate3d(0px, 5px, 0px);
animation-timing-function: linear;
}
100% {
transform: translate3d(0px, 0px, 0px);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-1gr6gwdanimation {
animation: 9s linear 0s 1 normal forwards running gwd-gen-1gr6gwdanimation_gwd-keyframes;
}
.gwd-image-1agg {
width: 292px;
height: 28px;
}
.gwd-image-1h2k {
position: absolute;
transform-origin: 50% 50% 0px;
top: 31px;
left: 221px;
opacity: 0;
transform: translate3d(3px, 6px, 0px);
}
@keyframes gwd-gen-dun9gwdanimation_gwd-keyframes {
0% {
opacity: 0;
transform: translate3d(3px, 6px, 0px);
animation-timing-function: linear;
}
58.3333% {
opacity: 0;
transform: translate3d(3px, 6px, 0px);
animation-timing-function: linear;
}
66.6667% {
opacity: 1;
transform: translate3d(3px, 6px, 0px);
animation-timing-function: linear;
}
91.6667% {
opacity: 1;
transform: translate3d(3px, 6px, 0px);
animation-timing-function: linear;
}
100% {
opacity: 0;
transform: translate3d(3px, 6px, 0px);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-dun9gwdanimation {
animation: 6s linear 0s 1 normal forwards running gwd-gen-dun9gwdanimation_gwd-keyframes;
}
.gwd-image-vz8r {
width: 285px;
height: 39px;
}
.gwd-image-10ab {
position: absolute;
transform-origin: 50% 50% 0px;
top: 26px;
left: 222px;
opacity: 0;
transform: translate3d(8px, 4px, 0px) scale3d(0.9579, 0.9579, 1);
}
@keyframes gwd-gen-1s5ugwdanimation_gwd-keyframes {
0% {
opacity: 0;
transform: translate3d(8px, 4px, 0px) scale3d(0.9579, 0.9579, 1);
animation-timing-function: linear;
}
66.6667% {
opacity: 0;
transform: translate3d(8px, 4px, 0px) scale3d(0.9579, 0.9579, 1);
animation-timing-function: linear;
}
72.2222% {
opacity: 1;
transform: translate3d(8px, 4px, 0px) scale3d(0.9579, 0.9579, 1);
animation-timing-function: linear;
}
75.5556% {
opacity: 1;
transform: translate3d(8px, 4px, 0px) scale3d(1, 1, 1);
animation-timing-function: linear;
}
77.7778% {
opacity: 1;
transform: translate3d(8px, 4px, 0px) scale3d(0.9579, 0.9579, 1);
animation-timing-function: linear;
}
81.1111% {
opacity: 1;
transform: translate3d(8px, 4px, 0px) scale3d(1, 1, 1);
animation-timing-function: linear;
}
84.4444% {
opacity: 1;
transform: translate3d(8px, 4px, 0px) scale3d(0.9579, 0.9579, 1);
animation-timing-function: linear;
}
94.4444% {
opacity: 1;
transform: translate3d(8px, 4px, 0px) scale3d(0.9579, 0.9579, 1);
animation-timing-function: linear;
}
100% {
opacity: 0;
transform: translate3d(8px, 4px, 0px) scale3d(0.9579, 0.9579, 1);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-1s5ugwdanimation {
animation: 9s linear 0s 1 normal forwards running gwd-gen-1s5ugwdanimation_gwd-keyframes;
}
.gwd-image-xc1b {
width: 15px;
height: 20px;
}
.gwd-image-xwyu {
position: absolute;
transform-origin: 50% 50% 0px;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) translate3d(-136px, 26px, 0px);
opacity: 0;
}
.gwd-image-s5vk {
width: 21px;
height: 18px;
}
.gwd-image-1htg {
position: absolute;
transform-origin: 50% 50% 0px;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) translate3d(145px, -21px, 0px);
opacity: 0;
}
@keyframes gwd-gen-1w20gwdanimation_gwd-keyframes {
0% {
opacity: 0;
animation-timing-function: linear;
}
66.6667% {
opacity: 0;
animation-timing-function: linear;
}
72.2222% {
opacity: 1;
animation-timing-function: linear;
}
94.4444% {
opacity: 1;
animation-timing-function: linear;
}
100% {
opacity: 0;
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-1w20gwdanimation {
animation: 9s linear 0s 1 normal forwards running gwd-gen-1w20gwdanimation_gwd-keyframes;
}
@keyframes gwd-gen-4u6bgwdanimation_gwd-keyframes {
0% {
opacity: 0;
animation-timing-function: linear;
}
66.6667% {
opacity: 0;
animation-timing-function: linear;
}
72.2222% {
opacity: 1;
animation-timing-function: linear;
}
94.4444% {
opacity: 1;
animation-timing-function: linear;
}
100% {
opacity: 0;
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-4u6bgwdanimation {
animation: 9s linear 0s 1 normal forwards running gwd-gen-4u6bgwdanimation_gwd-keyframes;
}
.gwd-taparea-p4nf {
position: absolute;
width: 728px;
height: 90px;
top: 0px;
left: 0px;
}
</style>
<script data-source="gwd_webcomponents_v1_min.js" data-version="2" data-exports-type="gwd_webcomponents_v1" src="gwd_webcomponents_v1_min.js"></script>
<script data-source="gwdpage_min.js" data-version="13" data-exports-type="gwd-page" src="gwdpage_min.js"></script>
<script data-source="gwdpagedeck_min.js" data-version="14" data-exports-type="gwd-pagedeck" src="gwdpagedeck_min.js"></script>
<script data-source="https://s0.2mdn.net/ads/studio/Enabler.js" data-exports-type="gwd-google-ad" src="https://s0.2mdn.net/ads/studio/Enabler.js"></script>
<script data-source="gwdgooglead_min.js" data-version="9" data-exports-type="gwd-google-ad" src="gwdgooglead_min.js"></script>
<script data-source="gwdimage_min.js" data-version="17" data-exports-type="gwd-image" src="gwdimage_min.js"></script>
<script data-source="gwdtaparea_min.js" data-version="7" data-exports-type="gwd-taparea" src="gwdtaparea_min.js"></script>
<script type="text/javascript" gwd-events="support" src="gwd-events-support.1.0.js"></script>
<script type="text/javascript" gwd-events="handlers">
gwd.auto_Page1Event_1 = function(event) {
// GWD Predefined Function
gwd.actions.timeline.gotoAndPlay('page1', 'loop');
};
gwd.auto_Gwd_taparea_1Action = function(event) {
// GWD Predefined Function
gwd.actions.gwdGoogleAd.exit('gwd-ad', 'clickTag', 'https://hcbb.com/schedule/', true, true, 'page1');
};
</script>
<script type="text/javascript" gwd-events="registration">
// Support code for event handling in Google Web Designer
// This script block is auto-generated. Please do not edit!
gwd.actions.events.registerEventHandlers = function(event) {
gwd.actions.events.addHandler('page1', 'event-1', gwd.auto_Page1Event_1, false);
gwd.actions.events.addHandler('gwd-taparea_1', 'action', gwd.auto_Gwd_taparea_1Action, false);
gwd.actions.timeline.captureAnimationEnd(document.body);
};
gwd.actions.events.deregisterEventHandlers = function(event) {
gwd.actions.events.removeHandler('page1', 'event-1', gwd.auto_Page1Event_1, false);
gwd.actions.events.removeHandler('gwd-taparea_1', 'action', gwd.auto_Gwd_taparea_1Action, false);
gwd.actions.timeline.releaseAnimationEnd(document.body);
};
document.addEventListener("DOMContentLoaded", gwd.actions.events.registerEventHandlers);
document.addEventListener("unload", gwd.actions.events.deregisterEventHandlers);
</script>
</head>
<body>
<gwd-google-ad id="gwd-ad" polite-load="">
<gwd-metric-configuration>
<gwd-metric-event source="gwd-taparea_1" event="tapareaexit" metric="" exit="Exit"></gwd-metric-event>
</gwd-metric-configuration>
<gwd-pagedeck class="gwd-page-container" id="pagedeck">
<gwd-page id="page1" class="gwd-page-wrapper gwd-page-size gwd-lightbox" data-gwd-width="728px" data-gwd-height="90px" data-gwd-animation-labels="loop,0">
<div class="gwd-page-content gwd-page-size">
<gwd-image source="assets/white bg.png" scaling="stretch" id="white_bg" class="gwd-image-113k gwd-image-14jo"></gwd-image>
<gwd-image source="assets/bg1.png" scaling="stretch" id="bg1" class="gwd-image-xti4 gwd-image-13ds gwd-gen-165hgwdanimation"></gwd-image>
<gwd-image source="assets/bg2.png" scaling="stretch" id="bg2" class="gwd-image-14us gwd-image-repz gwd-gen-1gr6gwdanimation"></gwd-image>
<gwd-image source="assets/Houchin Logo.png" scaling="stretch" id="Houchin_Logo" class="gwd-image-174z gwd-image-1873"></gwd-image>
<gwd-image source="assets/yourtypematters.png" scaling="stretch" id="yourtypematters" class="gwd-image-19k0 gwd-image-jcn3 gwd-gen-ne42gwdanimation"></gwd-image>
<gwd-image source="assets/hand.png" scaling="stretch" id="hand" class="gwd-image-erh7 gwd-image-z8ma gwd-gen-nwavgwdanimation"></gwd-image>
<gwd-image source="assets/blood-bag.png" scaling="stretch" id="blood-bag" class="gwd-image-iwqp gwd-image-1xx9 gwd-gen-l5odgwdanimation"></gwd-image>
<gwd-image source="assets/heart.png" scaling="stretch" id="heart" class="gwd-image-bwiw gwd-image-10xr gwd-gen-4oqigwdanimation"></gwd-image>
<gwd-image source="assets/discoveryourtype.png" scaling="stretch" id="discoveryourtype" class="gwd-image-1agg gwd-image-1h2k gwd-gen-dun9gwdanimation"></gwd-image>
<gwd-image source="assets/Button.png" scaling="stretch" id="Button" class="gwd-image-vz8r gwd-image-10ab gwd-gen-1s5ugwdanimation"></gwd-image>
<gwd-image source="assets/graphic left.png" scaling="stretch" id="graphic_left" class="gwd-image-xc1b gwd-image-xwyu gwd-gen-1w20gwdanimation"></gwd-image>
<gwd-image source="assets/graphic right.png" scaling="stretch" id="graphic_right" class="gwd-image-s5vk gwd-image-1htg gwd-gen-4u6bgwdanimation"></gwd-image>
<div class="gwd-animation-event event-1-animation" data-event-name="event-1" data-event-time="9000"></div>
<gwd-taparea id="gwd-taparea_1" class="gwd-taparea-p4nf"></gwd-taparea>
</div>
</gwd-page>
</gwd-pagedeck>
<gwd-exit metric="clickTag" url="https://hcbb.com/schedule/"></gwd-exit>
</gwd-google-ad>
<script type="text/javascript" id="gwd-init-code">
(function() {
var gwdAd = document.getElementById('gwd-ad');
/**
* Handles the DOMContentLoaded event. The DOMContentLoaded event is
* fired when the document has been completely loaded and parsed.
*/
function handleDomContentLoaded(event) {
}
/**
* Handles the WebComponentsReady event. This event is fired when all
* custom elements have been registered and upgraded.
*/
function handleWebComponentsReady(event) {
// Start the Ad lifecycle.
requestAnimationFrame(function() {
setTimeout(function() {
gwdAd.initAd();
}, 1);
});
}
/**
* Handles the event that is dispatched after the Ad has been
* initialized and before the default page of the Ad is shown.
*/
function handleAdInitialized(event) {}
window.addEventListener('DOMContentLoaded',
handleDomContentLoaded, false);
window.addEventListener('WebComponentsReady',
handleWebComponentsReady, false);
window.addEventListener('adinitialized',
handleAdInitialized, false);
})();
</script>
</body>
</html>Landing Page
This ad does not have a landing page available
Network Timeline
Performance Summary
26
Requests
2
Domains
52KB
Transfer Size
159KB
Content Size
504.0ms
Dom Content Loaded
505.0ms
First Paint
505.0ms
Load Time
Domain Breakdown
Transfer Size (bytes)
Loading...
Content Size (bytes)
Loading...
Header Size (bytes)
Loading...
Requests
Loading...
Timings (ms)
Loading...
Total Time
Loading...
Content Breakdown
Transfer Size (bytes)
Loading...
Content Size (bytes)
Loading...
Header Size (bytes)
Loading...
Requests
Loading...