Together, SmugMug+Flickr

<!DOCTYPE html> <html lang="en" xml:lang="en"> <head><script type="text/javascript" src="/_static/js/bundle-playback.js?v=HxkREWBo" charset="utf-8"></script> <script type="text/javascript" src="/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("https://web.archive.org/web"); __wm.wombat("https://www.smugmug.com/together/?utm_campaign=flickr-launch&utm_source=Flickr&utm_medium=blog&utm_content=faq","20190320150717","https://web.archive.org/","web","/_static/", "1553094437"); </script> <link rel="stylesheet" type="text/css" href="/_static/css/banner-styles.css?v=S1zqJCYt" /> <link rel="stylesheet" type="text/css" href="/_static/css/iconochive.css?v=3PDvdIFv" />  <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0"/> <meta charset="utf-8"> <meta property="og:url" content="https://web.archive.org/web/20190320150717/https://www.smugmug.com/together"> <meta property="og:title" content="Together, SmugMug+Flickr"> <meta property="og:description" content="Together is better."> <meta property="og:image" content="https://web.archive.org/web/20190320150717im_/https://photos.smugmug.com/photos/i-bxWKMS5/0/580fae3e/XL/i-bxWKMS5-XL.png"> <meta name="twitter:url" content="https://web.archive.org/web/20190320150717im_/https://www.smugmug.com/together"> <meta name="twitter:title" content="Together, SmugMug+Flickr"> <meta name="twitter:description" content="Together is better."> <meta name="twitter:image" content="https://web.archive.org/web/20190320150717im_/https://photos.smugmug.com/photos/i-bxWKMS5/0/580fae3e/XL/i-bxWKMS5-XL.png"> <title>Together, SmugMug+Flickr</title> <script> // Temporary hack window.__isFirebase = (document.URL.indexOf('firebaseapp.com') !== -1); // Yuuup var isProd = (document.URL.indexOf('smugmug.com') !== -1); var pixelDensity = window.devicePixelRatio; // Limit the pixelDensity variable to a valid value. Otherwise weird or invalid // devices will cause issues in the BE. if (pixelDensity && pixelDensity > 0 && pixelDensity < 10) { pixelDensity *= 100; pixelDensity = Math.floor(pixelDensity); pixelDensity /= 100; } else { pixelDensity = undefined; } window.SM = { BRONTO_BEACON_ID: 'aybwvnnqnvnoyjivkhhqiyrhtnembmk', BRONTO_LIST_ID: '0bdf03ec0000000000000000000000129ae7', COOKIE_DOMAIN: isProd ? 'smugmug.com' : 'smugmug.net', GA_ID: isProd ? 'UA-138402-3' : 'UA-33847068-1', GTM_ID: isProd ? 'GTM-KQPLTF' : 'GTM-536MNW', HOST_LEVEL: isProd ? 'live' : 'test', SNOWPLOW_JS: isProd ? 'https://web.archive.org/web/20190320150717/https://cdn.smugmug.com/include/js/snowplow-20170927184456.js' : 'https://web.archive.org/web/20190320150717/https://cdn.inside.smugmug.net/include/js/snowplow-20170515225357.js', SNOWPLOW_2_JS: isProd ? 'https://web.archive.org/web/20190320150717/https://cdn.smugmug.com/include/js/snowplow_2-20170927184456.js' : 'https://web.archive.org/web/20190320150717/https://cdn.inside.smugmug.net/include/js/snowplow_2-20170515225357.js', SEGMENT_SOURCE_ID: isProd ? 'uEyhh7woGFZHnKhfJXIxzcJaYb3R0dNc' : '7nHKQ7MBFlZvdVvoWbrrWu00SunB6EiQ' }; !function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on"];analytics.factory=function(t){return function(){var e=Array.prototype.slice.call(arguments);e.unshift(t);analytics.push(e);return analytics}};for(var t=0;t<analytics.methods.length;t++){var e=analytics.methods[t];analytics[e]=analytics.factory(e)}analytics.load=function(t,e){var n=document.createElement("script");n.type="text/javascript";n.async=!0;n.src=("https:"===document.location.protocol?"https://":"http://")+"cdn.segment.com/analytics.js/v1/"+t+"/analytics.min.js";var o=document.getElementsByTagName("script")[0];o.parentNode.insertBefore(n,o);analytics._loadOptions=e};analytics.SNIPPET_VERSION="4.1.0"; analytics.load(SM.SEGMENT_SOURCE_ID); analytics.page(); }}(); window.SMDataLayer = [{ first_party_cookie_domain: SM.COOKIE_DOMAIN, host_level: SM.HOST_LEVEL, page_type: 'Marketing', site_version: 'SMN', smugmug_ga_config: { id: SM.GA_ID }, snowplow_2_js_location: SM.SNOWPLOW_2_JS, snowplow_js_location: SM.SNOWPLOW_JS, tag_manager_id: SM.GTM_ID, tracking_enabled: 1, }]; window.dataLayerPush = function(data) { // While in development don't try to do any tracking here. if (window.__isFirebase) { return; } // Because GTM merges objects SMDataLayer.push(_.mapValues(data, function() { return ''; })); // Remove undefined/null values before pushing to dataLayer SMDataLayer.push(_.omitBy(data, _.isNil)); }; window.trackSnowplowEvent = function(data) { data || (data = {}); var contexts = getDefaultSnowplowContexts(); if (data.contexts) { contexts = contexts.concat(data.contexts); } dataLayerPush({ event: 'metric', event_action: data.action, event_category: data.category, event_contexts: contexts, event_label: data.label, event_property: data.property, event_snowplow_version: 2, event_value: data.value }); }; window.getDefaultSnowplowContexts = function() { return [{ schema: 'iglu:com.smugmug/device/jsonschema/1-0-1', data: { pixel_density: pixelDensity } }, { schema: 'iglu:com.smugmug/content/jsonschema/1-0-0', data: { page_type: 'Marketing' } } ]; }; </script>  <script> (function(w, d, s, l, i) { if (window.__isFirebase) { return; } w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date() .getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://web.archive.org/web/20190320150717/https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'SMDataLayer', SM.GTM_ID); </script>   <script> setTimeout(function() { if (window.__isFirebase) { return; } var a = document.createElement('script'); var b = document.getElementsByTagName('script')[0]; a.src = '//web.archive.org/web/20190320150717/https://script.crazyegg.com/pages/scripts/0000/1230.js?' + Math.floor(new Date() .getTime() / 3600000); a.async = true; b.parentNode.insertBefore(a, b) }, 1); </script>  <script> //Polyfil for Object.assign for ie11 if (typeof Object.assign != 'function') { Object.assign = function(target) { 'use strict'; if (target == null) { throw new TypeError('Cannot convert undefined or null to object'); } target = Object(target); for (var index = 1; index < arguments.length; index++) { var source = arguments[index]; if (source != null) { for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } } return target; }; } </script> <script src="https://web.archive.org/web/20190320150717js_/https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js"></script> <script src="https://web.archive.org/web/20190320150717js_/https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.3/ScrollMagic.js"></script> <script src="https://web.archive.org/web/20190320150717js_/https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.4/TimelineMax.min.js"></script>  <script src="https://web.archive.org/web/20190320150717js_/https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://web.archive.org/web/20190320150717js_/https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/TweenMax.min.js"></script> <script src="https://web.archive.org/web/20190320150717js_/https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/easing/EasePack.min.js"></script> <script src="https://web.archive.org/web/20190320150717js_/https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/plugins/CSSPlugin.min.js"></script> <script src="https://web.archive.org/web/20190320150717js_/https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/animation.gsap.js"></script>   <link rel="stylesheet" type="text/css" href="https://web.archive.org/web/20190320150717cs_/https://cloud.typography.com/7363674/773688/css/fonts.css"/> <style>a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}#master-wrapper,body,html{height:100%;width:100%;overflow:hidden}#cake-pt .shutter,#clown-pt .clown-top,#fire-container-2 .fire-frame-1,#fire-container-2 .fire-frame-2,#fire-container-2 .fire-frame-3,#fire-container-2 .fire-frame-4,#fire-container-2 .fire-frame-5,#fire-container-2 .fire-frame-6,#fire-container-2 .fire-frame-7,#fire-container-2 .fire-frame-8,#fire-container-2 .fire-frame-9,#fire-container-2 .fire-frame-10,#fire-container-2 .fire-frame-11,#fire-container-2 .fire-frame-12,#fire-container-2 .fire-frame-13,#fire-container-2 .fire-frame-14,#fire-container-2 .fire-frame-15,#fire-container-2 .fire-frame-16,#fire-container-2 .fire-frame-17,#fire-container-2 .fire-frame-18,#fire-container-2 .fire-frame-19,#fire-container-2 .fire-frame-20,#fire-container-2 .fire-frame-21,#still-pt .play-arrow,#tunnel-pt .rocks,.container,.top-shadow .logo a{top:0;left:0;right:0;bottom:0;position:absolute}.image{width:100%}body{margin:0;font-family:Gotham A,Gotham B;font-style:normal;font-weight:300;letter-spacing:-1;line-height:.9;background-color:#000}.cake,.cake-sub,.clown,.fire,.sky,.tunnel{font-size:60px;font-weight:300;color:#fff;-webkit-transform:translateZ(0);transform:translateZ(0)}.cake-sub.small,.cake.small,.clown.small,.fire.small,.sky.small,.tunnel.small{margin-top:1em;font-style:normal;font-weight:300;font-size:16px;line-height:1.8;letter-spacing:1px}.scroll-container{position:relative;height:100%;margin:auto;overflow-y:scroll;overflow-x:hidden;width:100%;max-width:100vw;-webkit-overflow-scrolling:touch}#base.desktop{overflow-y:visible}.top-shadow{position:fixed;top:0;left:0;right:0;height:150px;max-height:20vh;background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/top_shadow.png);background-size:100% 100%;z-index:9999999;text-align:left}.top-shadow .logo{margin-left:30px;margin-top:20px;position:relative;display:inline-block}.top-shadow .logo .click-smug{position:absolute;top:0;bottom:0;left:0;width:60%;cursor:pointer}.top-shadow .logo .click-flickr{position:absolute;top:0;bottom:0;right:0;width:40%;cursor:pointer}.point{border-top:1px solid transparent}.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_1366.jpg);overflow:hidden;-webkit-transform:translateZ(0);transform:translateZ(0)}#still-pt,.content{background-position:50%;background-size:cover}#still-pt{height:100vh;cursor:pointer}#still-pt .video-container{background-color:#000000c1;width:100%;height:100%;vertical-align:middle;position:relative;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#still-pt .video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%}#still-pt .play-arrow{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/play_button.png);background-position:52% 52%;background-repeat:no-repeat;opacity:1;-webkit-transform:scale(.8);-ms-transform:scale(.8);transform:scale(.8);pointer-events:none}#still-pt .down-arrow{position:absolute;bottom:0;margin-left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)}#cake-pt{height:167vh;position:relative;background-position:50%;background-size:cover}#cake-pt .cake-bits-1{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_1.png)}#cake-pt .cake-bits-1,#cake-pt .cake-bits-2{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-2{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_2.png)}#cake-pt .cake-bits-3{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_3.png)}#cake-pt .cake-bits-3,#cake-pt .cake-bits-4{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-4{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_4.png)}#cake-pt .cake-bits-5{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_5.png)}#cake-pt .cake-bits-5,#cake-pt .cake-bits-6{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-6{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_6.png)}#cake-pt .cake-bits-7{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_7.png)}#cake-pt .cake-bits-7,#cake-pt .cake-bits-8{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-8{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_8.png)}#cake-pt .cake-bits-9{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_9.png)}#cake-pt .cake-bits-9,#cake-pt .cake-bits-10{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-10{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_10.png)}#cake-pt .cake-bits-11{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_11.png)}#cake-pt .cake-bits-11,#cake-pt .cake-bits-12{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-12{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_12.png)}#cake-pt .cake-bits-13{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_13.png)}#cake-pt .cake-bits-13,#cake-pt .cake-bits-14{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-14{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_14.png)}#cake-pt .cake-bits-15{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_15.png)}#cake-pt .cake-bits-15,#cake-pt .cake-bits-16{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-16{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_16.png)}#cake-pt .cake-bits-17{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_17.png)}#cake-pt .cake-bits-17,#cake-pt .cake-bits-18{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-18{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_18.png)}#cake-pt .cake-bits-19{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_19.png)}#cake-pt .cake-bits-19,#cake-pt .cake-bits-20{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-20{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_20.png)}#cake-pt .cake-bits-21{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_21.png)}#cake-pt .cake-bits-21,#cake-pt .cake-bits-22{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-22{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_22.png)}#cake-pt .cake-bits-23{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_23.png)}#cake-pt .cake-bits-23,#cake-pt .cake-bits-24{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-24{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_24.png)}#cake-pt .cake-bits-25{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_25.png)}#cake-pt .cake-bits-25,#cake-pt .cake-bits-26{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-26{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_26.png)}#cake-pt .cake-bits-27{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_27.png)}#cake-pt .cake-bits-27,#cake-pt .cake-bits-28{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-28{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_28.png)}#cake-pt .cake-bits-29{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_29.png)}#cake-pt .cake-bits-29,#cake-pt .cake-bits-30{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-30{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_30.png)}#cake-pt .cake-bits-31{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_31.png)}#cake-pt .cake-bits-31,#cake-pt .cake-bits-32{width:200px;height:200px;position:absolute;top:0;left:0;-webkit-transform:translate3d(1,1,1);transform:translate3d(1,1,1);background-position:50%;background-repeat:no-repeat}#cake-pt .cake-bits-32{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/cake_bits/cake_bits_32.png)}#cake-pt .shutter{background-color:transparent;background-position:50%;background-size:auto}#cake-pt .cake{opacity:1}#cake-pt .cake-text{position:absolute;top:0;left:calc(5vw + 50px);-webkit-transform:translateZ(0);transform:translateZ(0)}#cake-pt .cake-text-relative{position:relative}#cake-pt .cake-text-wrapper{position:absolute;top:0;left:0;right:0;height:100vh;padding-top:100px}#cake-pt .streamers{pointer-events:none;position:absolute;top:0;left:0;right:0;width:100%}#cake-pt .streamers img{width:100%}#cake-pt .cake-bits-over,#cake-pt .cake-bits-under{position:absolute;top:0;left:0;right:0;bottom:0}#clown-pt{background-position:50%;background-size:cover;height:123vh}#clown-pt .clown-text{position:absolute;top:10vh;left:calc(5vw + 50px);-webkit-transform:translateZ(0);transform:translateZ(0)}#clown-pt .clown-top{background-position:50%;background-size:cover}#clown-pt .ball-blue,#clown-pt .ball-pink{width:21px;height:19px;position:absolute;background-position:50%;background-size:auto;background-repeat:no-repeat}#clown-pt .ball-pink{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/balls/pink_ball.png)}#clown-pt .ball-blue{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/balls/blue_ball.png)}#fire-container-2{position:absolute;top:0;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position-x:center;background-position-y:top}#fire-container-2 .fire-frame-1{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_1.png)}#fire-container-2 .fire-frame-1,#fire-container-2 .fire-frame-2{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-2{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_2.png)}#fire-container-2 .fire-frame-3{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_3.png)}#fire-container-2 .fire-frame-3,#fire-container-2 .fire-frame-4{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-4{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_4.png)}#fire-container-2 .fire-frame-5{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_5.png)}#fire-container-2 .fire-frame-5,#fire-container-2 .fire-frame-6{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-6{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_6.png)}#fire-container-2 .fire-frame-7{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_7.png)}#fire-container-2 .fire-frame-7,#fire-container-2 .fire-frame-8{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-8{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_8.png)}#fire-container-2 .fire-frame-9{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_9.png)}#fire-container-2 .fire-frame-9,#fire-container-2 .fire-frame-10{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-10{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_10.png)}#fire-container-2 .fire-frame-11{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_11.png)}#fire-container-2 .fire-frame-11,#fire-container-2 .fire-frame-12{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-12{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_12.png)}#fire-container-2 .fire-frame-13{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_13.png)}#fire-container-2 .fire-frame-13,#fire-container-2 .fire-frame-14{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-14{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_14.png)}#fire-container-2 .fire-frame-15{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_15.png)}#fire-container-2 .fire-frame-15,#fire-container-2 .fire-frame-16{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-16{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_16.png)}#fire-container-2 .fire-frame-17{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_17.png)}#fire-container-2 .fire-frame-17,#fire-container-2 .fire-frame-18{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-18{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_18.png)}#fire-container-2 .fire-frame-19{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_19.png)}#fire-container-2 .fire-frame-19,#fire-container-2 .fire-frame-20{opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-container-2 .fire-frame-20{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_20.png)}#fire-container-2 .fire-frame-21{background-image:url(https://web.archive.org/web/20190320150717im_/https://dsr2sewjocywl.cloudfront.net/images/fire_frames/fire_21.png);opacity:0;width:100%;height:100%;background-size:100% auto;background-repeat:no-repeat}#fire-pt{height:100vh;background-position:top;background-size:cover}#fire-pt .fire-text{position:absolute;top:10vh;left:calc(5vw + 50px);-webkit-transform:translateZ(0);transform:translateZ(0)}#fire-pt .fire-text .text-shad{opacity:.4}#tunnel-pt{height:115vh;background-position:100% 0}#tunnel-pt .tunnel-text{position:absolute;top:10vh;left:calc(5vw + 100px);-webkit-transform:translateZ(0);transform:translateZ(0)}#tunnel-pt .tunnel{display:inline-block}#tunnel-pt .rocks{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/rocks.png);background-position:top;background-repeat:no-repeat}#sky-pt{height:216.5vh;position:relative;background-position:50%;background-size:cover}#sky-pt .parrot{position:absolute;top:30vh;left:0;-webkit-transform:scale(.7);-ms-transform:scale(.7);transform:scale(.7)}#sky-pt .parrot-1{left:10%}#sky-pt .parrot-2{left:35%}#sky-pt .parrot-3{left:45%;top:20}#sky-pt .parrot-4{left:75%}#sky-pt .cloud-1{position:absolute;top:-30vh;left:-50vw;opacity:.8}#sky-pt .clouds-bg{opacity:.3}#sky-pt .cloud-2{top:-20vh}#sky-pt .cloud-2,#sky-pt .cloud-3{position:absolute;left:20vw;opacity:.5}#sky-pt .cloud-3{top:50vh;-webkit-transform:scale(.5);-ms-transform:scale(.5);transform:scale(.5)}#sky-pt .cloud-4{position:absolute;top:40vh;left:50vw;opacity:.25;-webkit-transform:scale(2);-ms-transform:scale(2);transform:scale(2)}#sky-pt .sky-text{position:absolute;top:30vh;left:calc(5vw + 50px)}#sky-pt .sky-text .text-shad{opacity:.2}#final-pt{height:100vh;position:relative;background-color:#000;text-align:center;margin:0 auto;padding-top:1px}#final-pt .logo-lg{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:523px;height:100%;max-width:80vw;background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/logo_lg.png);background-repeat:no-repeat;background-size:contain;background-position:50%}#final-pt .final-out-edge{width:80vw;height:70vh;margin-left:auto;margin-right:auto;margin-top:15vh;max-width:970px;position:relative}#final-pt .final-out-edge .bottom-left-corner,#final-pt .final-out-edge .bottom-right-corner,#final-pt .final-out-edge .top-left-corner,#final-pt .final-out-edge .top-right-corner{position:absolute;width:24px;height:34px}#final-pt .final-out-edge .top-left-corner{border-top:2px solid #fff;border-left:2px solid #fff}#final-pt .final-out-edge .bottom-left-corner{bottom:0;border-bottom:2px solid #fff;border-left:2px solid #fff}#final-pt .final-out-edge .bottom-right-corner{right:0;bottom:0;border-bottom:2px solid #fff;border-right:2px solid #fff}#final-pt .final-out-edge .top-right-corner{right:0;border-top:2px solid #fff;border-right:2px solid #fff}#final-pt .final-in-edge{width:50vw;height:30vh;position:absolute;top:0;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);margin-top:35vh;border-left:1px solid hsla(0,0%,100%,.363);border-right:1px solid hsla(0,0%,100%,.363);opacity:1;max-width:580px}#final-pt .final-in-edge .bottom-left-corner,#final-pt .final-in-edge .bottom-right-corner,#final-pt .final-in-edge .top-left-corner,#final-pt .final-in-edge .top-right-corner{position:absolute;width:20px;height:20px}#final-pt .final-in-edge .top-left-corner{border-top:1px solid hsla(0,0%,100%,.363)}#final-pt .final-in-edge .bottom-left-corner,#final-pt .final-in-edge .bottom-right-corner{bottom:0;border-bottom:1px solid hsla(0,0%,100%,.363)}#final-pt .final-in-edge .bottom-right-corner{right:0}#final-pt .final-in-edge .top-right-corner{right:0;border-top:1px solid hsla(0,0%,100%,.363)}#final-pt .squares{position:absolute;border:0 solid blue;width:100px;height:40vh;top:50%;-webkit-transform:translateY(-50%) translateX(-100%);-ms-transform:translateY(-50%) translateX(-100%);transform:translateY(-50%) translateX(-100%);left:0;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:distribute;justify-content:space-around;-ms-flex-wrap:wrap;flex-wrap:wrap;opacity:.3}#final-pt .squares.right{left:unset;right:0;-webkit-transform:translateY(-50%) translateX(100%);-ms-transform:translateY(-50%) translateX(100%);transform:translateY(-50%) translateX(100%)}#final-pt .focus-square{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;border:0 solid #fff;height:19%;width:50%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:distribute;justify-content:space-around;-ms-flex-wrap:wrap;flex-wrap:wrap}#final-pt .focus-square .square{width:13px;height:13px;margin:0 auto;border:2px solid #fff;opacity:.5}#final-pt #email-subscribe{position:absolute;bottom:-42%;left:0;display:inline-block;width:100%}#final-pt #email-subscribe .email-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}#final-pt #email-subscribe .email-wrapper *{-webkit-box-sizing:border-box;box-sizing:border-box;font-family:Roboto,Helvetica,Arial,sans-serif}#final-pt #email-subscribe input{border:none;border-radius:0;background-color:#333;color:#fff;height:60px;width:240px;font-size:18px;padding:3px 3px 3px 12px}#final-pt #email-subscribe button{background-color:#fff;border-radius:0;border:0 solid gray;color:#000;cursor:pointer;height:60px;width:144px;font-size:14px;letter-spacing:1px;padding-left:18px;padding-right:18px;text-transform:uppercase}#final-pt #email-subscribe label{color:#fff;display:block;padding-bottom:36px;letter-spacing:1px}#final-pt #email-subscribe ::-webkit-input-placeholder{color:#878787}#final-pt #email-subscribe :-ms-input-placeholder,#final-pt #email-subscribe ::-ms-input-placeholder{color:#878787}#final-pt #email-subscribe ::placeholder{color:#878787}.front{display:none}.cake,.clown,.fire,.sky,.tunnel{display:inline-block;position:relative;z-index:999999;-webkit-transform:translateZ(0);transform:translateZ(0)}.cake .text-shad,.clown .text-shad,.fire .text-shad,.sky .text-shad,.tunnel .text-shad{position:absolute;left:-20%;right:-10%;top:-10%;bottom:-8%;background-color:#313131;opacity:.4;z-index:-1000;border-radius:1000px;background-repeat:no-repeat;background-size:100% 100%;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-filter:blur(18px);filter:blur(18px)}.desktop .cake .text-shad,.desktop .clown .text-shad,.desktop .fire .text-shad,.desktop .sky .text-shad,.desktop .tunnel .text-shad{position:absolute;left:-20%;right:-20%;top:-20%;bottom:-80%;opacity:.5;z-index:-1000;border-radius:1000px;background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/text_shadow.png);background-repeat:no-repeat;background-size:100% 100%;-webkit-transform:none!important;-ms-transform:none!important;transform:none!important;background-color:transparent!important}.clown .text-shad{opacity:.4}.sky .text-shad{opacity:.25!important}.tunnel .text-shad{opacity:.4}.point{position:relative}.cake-sub{display:inline-block}.clown .text-shad{opacity:.25!important}#footer{background-color:#ececec;padding-bottom:20px;padding-top:15px;position:relative;text-align:center}#footer .footer-wrapper{margin:0 auto}#footer .smug-logo{-webkit-transform:translateY(-3px);-ms-transform:translateY(-3px);transform:translateY(-3px)}#footer .flickr-logo{-webkit-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px)}#footer .social{padding-left:0;padding-right:0}#footer .social svg{color:#434343}#footer a{text-decoration:none;color:#2e2e2e}#footer .bordered{border-left:1px solid #b3b3b3}#footer div{display:inline-block;padding:0 13px;vertical-align:middle;font-weight:500;font-size:18px;color:#2e2e2e}#footer .footer-section{border-left:1px solid #b3b3b3;width:1px;height:45px;padding:0;margin-left:15px;margin-right:15px}@media only screen and (max-width:600px){.cake,.cake-sub,.clown,.fire,.sky,.tunnel{font-size:48px;font-weight:400;color:#fff;-webkit-transform:translateZ(0);transform:translateZ(0)}}@media only screen and (max-width:400px){.cake,.cake-sub,.clown,.fire,.sky,.tunnel{font-size:42px;font-weight:400;color:#fff;-webkit-transform:translateZ(0);transform:translateZ(0)}.cake-sub.small,.cake.small,.clown.small,.fire.small,.sky.small,.tunnel.small{font-weight:400;font-size:18px;line-height:1.5}}@media only screen and (max-width:500px){#final-pt .logo-lg{top:35%}#final-pt form#email-subscribe{left:-50%;width:200%}#final-pt form#email-subscribe label{font-size:14px}#final-pt form#email-subscribe .email-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#final-pt form#email-subscribe button{margin-top:12px;width:240px}.top-shadow{text-align:center}.top-shadow .logo{margin-left:0}#final-pt .final-in-edge,#final-pt .final-in-edge .bottom-left-corner,#final-pt .final-in-edge .bottom-right-corner,#final-pt .final-in-edge .top-left-corner,#final-pt .final-in-edge .top-right-corner,#final-pt .focus-square .square{border:none}#footer div{font-weight:300;font-size:14px;padding:0 8px}#footer .flickr-logo,#footer .smug-logo{display:block;padding-bottom:10px}#footer .smug-logo{-webkit-transform:translateX(8px);-ms-transform:translateX(8px);transform:translateX(8px)}#footer .flickr-logo{margin-top:13px}#footer .bordered.about{border-left:0 solid #000}}@media only screen and (max-width:1100px){#footer div.flickr-section,#footer div.smug-section{display:block;padding-top:10px;padding-bottom:10px}#footer .footer-section{display:none}}@media only screen and (max-width:350px){#final-pt form#email-subscribe label{font-size:12px}}@media (max-aspect-ratio:1000/217){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_480.jpg)}}@media (max-aspect-ratio:1000/217) and (min-height:270px) and (max-height:360px),(max-aspect-ratio:1000/217) and (min-width:480px) and (max-width:640px){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_640.jpg)}}@media (max-aspect-ratio:1000/217) and (min-height:565px) and (max-height:767px),(max-aspect-ratio:1000/217) and (min-width:641px) and (max-width:1000px){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_1000.jpg)}}@media (max-aspect-ratio:1000/217) and (min-height:767px) and (max-height:1124px),(max-aspect-ratio:1000/217) and (min-width:1000px) and (max-width:1366px){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_1366.jpg)}}@media (max-aspect-ratio:1000/217) and (min-height:1367px),(max-aspect-ratio:1000/217) and (min-width:1025px){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_2000.jpg)}}@media (max-aspect-ratio:1000/217) and (-o-min-device-pixel-ratio:3/2),(max-aspect-ratio:1000/217) and (-webkit-min-device-pixel-ratio:1.5),(max-aspect-ratio:1000/217) and (min-resolution:144dpi){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_1366.jpg)}}@media (max-aspect-ratio:1000/217){.content{padding-top:822vh}}@media (min-aspect-ratio:500/277){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_480.jpg)}}@media (min-aspect-ratio:500/277) and (min-height:270px) and (max-height:360px),(min-aspect-ratio:500/277) and (min-width:480px){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_640.jpg)}}@media (min-aspect-ratio:500/277) and (min-height:565px) and (max-height:767px),(min-aspect-ratio:500/277) and (min-width:641px){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_1000.jpg)}}@media (min-aspect-ratio:500/277) and (min-height:767px) and (max-height:1124px),(min-aspect-ratio:500/277) and (min-width:1000px){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_1366.jpg)}}@media (min-aspect-ratio:500/277) and (min-height:1124px),(min-aspect-ratio:500/277) and (min-width:1367px){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_2000.jpg)}}@media (min-aspect-ratio:500/277) and (-o-min-device-pixel-ratio:3/2),(min-aspect-ratio:500/277) and (-webkit-min-device-pixel-ratio:1.5),(min-aspect-ratio:500/277) and (min-resolution:144dpi){.content{background-image:url(https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg_1366.jpg)}}@media (min-aspect-ratio:500/277){.content{padding-top:461.78624vw;background-position:top}#still-pt{height:56.14934vw}#cake-pt{height:93.85066vw}#clown-pt{height:69.07895vw}#fire-pt{height:56.44217vw}#tunnel-pt{height:64.42167vw}#sky-pt{height:121.81552vw}}@media (min-width:768px) and (max-width:1024px) and (orientation:landscape){#final-pt .final-in-edge{width:80%}#final-pt #email-subscribe{bottom:-70%}#final-pt .final-in-edge,#final-pt .final-in-edge .bottom-left-corner,#final-pt .final-in-edge .bottom-right-corner,#final-pt .final-in-edge .top-left-corner,#final-pt .final-in-edge .top-right-corner,#final-pt .focus-square .square{border:none}}@media (max-width:768px) and (orientation:landscape){#final-pt .final-in-edge{width:80%}#final-pt #email-subscribe{bottom:-70%}#final-pt .final-in-edge,#final-pt .final-in-edge .bottom-left-corner,#final-pt .final-in-edge .bottom-right-corner,#final-pt .final-in-edge .top-left-corner,#final-pt .final-in-edge .top-right-corner,#final-pt .focus-square .square{border:none}}</style> </head> <body> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="height:0;width:0;position:absolute;"><symbol fill="currentColor" viewbox="0 0 30 30" id="svg-Facebook"><title>Facebook</title><path d="M23.896 5H6.104C5.496 5 5 5.494 5 6.104v17.792C5 24.506 5.495 25 6.104 25h9.578v-7.745h-2.606v-3.019h2.606v-2.225c0-2.584 1.577-3.99 3.882-3.99 1.105 0 2.053.082 2.33.12v2.698l-1.598.001c-1.253 0-1.497.596-1.497 1.47v1.926h2.99l-.39 3.02h-2.6V25h5.098c.609 0 1.104-.494 1.104-1.104V6.104C25 5.494 24.505 5 23.895 5" fill-rule="evenodd"></path></symbol><symbol fill="currentColor" viewbox="0 0 30 30" id="svg-Instagram"><title>Instagram</title><g fill-rule="evenodd"><path d="M15 5c-2.715 0-3.061.013-4.122.06-1.068.05-1.794.215-2.426.466A4.858 4.858 0 0 0 6.68 6.68a4.808 4.808 0 0 0-1.154 1.77c-.251.634-.414 1.362-.466 2.429C5.015 11.946 5 12.285 5 15c0 2.716.015 3.055.06 4.122.052 1.066.215 1.794.466 2.428a4.82 4.82 0 0 0 1.154 1.771 4.82 4.82 0 0 0 1.772 1.154c.632.25 1.358.415 2.426.466 1.061.046 1.407.059 4.122.059 2.716 0 3.06-.013 4.122-.059 1.068-.051 1.794-.216 2.426-.466a4.823 4.823 0 0 0 1.773-1.154 4.804 4.804 0 0 0 1.153-1.771c.251-.634.422-1.362.466-2.428.045-1.067.06-1.406.06-4.122 0-2.715-.015-3.054-.06-4.121-.044-1.067-.215-1.795-.466-2.429a4.792 4.792 0 0 0-1.153-1.77 4.862 4.862 0 0 0-1.773-1.154c-.632-.251-1.358-.416-2.426-.466C18.06 5.013 17.716 5 15 5m0 1.8c2.673 0 2.987.014 4.042.057.976.05 1.504.212 1.856.349.468.179.8.395 1.152.745.35.351.566.684.745 1.151.137.352.304.88.348 1.857.043 1.054.058 1.368.058 4.041 0 2.674-.015 2.988-.058 4.042-.044.976-.211 1.505-.348 1.856a3.056 3.056 0 0 1-.745 1.151 3.078 3.078 0 0 1-1.152.746c-.352.137-.88.299-1.856.348-1.055.043-1.369.058-4.042.058s-2.987-.015-4.042-.058c-.976-.049-1.504-.211-1.855-.348a3.07 3.07 0 0 1-1.152-.746 3.056 3.056 0 0 1-.745-1.151c-.137-.351-.306-.88-.348-1.856C6.814 17.988 6.8 17.674 6.8 15c0-2.673.014-2.987.058-4.041.042-.977.211-1.505.348-1.857.179-.467.395-.8.745-1.151.351-.35.684-.566 1.152-.745.351-.137.879-.299 1.855-.349C12.013 6.814 12.327 6.8 15 6.8"></path><path d="M15.136 18.473a3.341 3.341 0 0 1-3.335-3.337 3.338 3.338 0 0 1 3.335-3.333 3.34 3.34 0 0 1 3.337 3.333 3.342 3.342 0 0 1-3.337 3.337m0-8.473A5.14 5.14 0 0 0 10 15.136a5.14 5.14 0 0 0 5.136 5.137 5.14 5.14 0 0 0 5.136-5.137A5.14 5.14 0 0 0 15.136 10M21.401 9.205c0 .66-.542 1.196-1.206 1.196A1.195 1.195 0 0 1 19 9.205 1.2 1.2 0 0 1 20.195 8c.664 0 1.206.542 1.206 1.205"></path></g></symbol><symbol fill="currentColor" viewbox="0 0 30 30" id="svg-Twitter"><title>Twitter</title><path d="M24.75 9.804a7.64 7.64 0 0 1-2.209.606 3.858 3.858 0 0 0 1.691-2.129 7.68 7.68 0 0 1-2.442.934 3.847 3.847 0 0 0-6.556 3.509 10.923 10.923 0 0 1-7.93-4.02 3.846 3.846 0 0 0 1.19 5.136 3.815 3.815 0 0 1-1.74-.482v.05a3.849 3.849 0 0 0 3.085 3.771 3.833 3.833 0 0 1-1.738.067 3.852 3.852 0 0 0 3.593 2.671 7.717 7.717 0 0 1-4.777 1.647A7.88 7.88 0 0 1 6 21.51a10.895 10.895 0 0 0 5.896 1.728c7.076 0 10.947-5.862 10.947-10.945 0-.166-.005-.333-.013-.498a7.803 7.803 0 0 0 1.92-1.991" fill-rule="evenodd"></path></symbol> </svg> <div class="top-shadow"> <div class="logo"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/logo_lockup.png" srcset="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/logo_lockup_2x.png 2x"> <div class="click-smug"> <a href="https://web.archive.org/web/20190320150717/http://www.smugmug.com/" target="_blank" rel="noopener"></a> </div> <div class="click-flickr"> <a href="https://web.archive.org/web/20190320150717/http://www.flickr.com/" target="_blank" rel="noopener"></a> </div> </div> </div> <div id="master-wrapper"> <div id="base" class="scroll-container"> <div class="content" id="content"> <div id="trigger"></div> <div class="container"> <div id="fire-container-2"></div> <div id="still-pt" class="point"> <div class="video-container" id="together-video"> <div id="youtube-together"></div> </div> <div id="down-arrow" class="down-arrow"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/down_arrow.png"></div> </div> <div id="cake-pt" class="point"> <div class="cake-bits-under"></div> <div class="streamers"> <img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/streamers.png"> </div> <div class="cake-text-wrapper"> <div class="cake-text-relative"> <div class="cake-text text-back"> <div class="cake cake-1"> <div class="text-shad"></div> <div class="text-content">This</div> </div><br> <div class="cake cake-2"> <div class="text-shad"></div> <div class="text-content">Community</div> </div><br> <div class="cake cake-3"> <div class="text-shad"></div> <div class="text-content">Always</div> </div><br> <div class="cake cake-4"> <div class="text-shad"></div> <div class="text-content">Existed. Now</div> </div><br> <div class="cake cake-5"> <div class="text-shad"></div> <div class="text-content">It's Uniting.</div> </div><br> <div class="cake cake-6 small"> <div class="text-shad"></div> <div class="text-content"> Together, SmugMug and Flickr represent<br> the world's most influential<br> photographer-centric community. </div> </div> </div> </div> </div> <div class="cake-bits-over"></div> </div> <div id="clown-pt" class="point"> <div class="balls-behind"></div> <div class="clown-text text-back"> <div class="clown clown-1"> <div class="text-shad"></div> <div class="text-content">We're All</div> </div><br> <div class="clown clown-2"> <div class="text-shad"></div> <div class="text-content">Shooting</div> </div><br> <div class="clown clown-3"> <div class="text-shad"></div> <div class="text-content">For the</div> </div><br> <div class="clown clown-4"> <div class="text-shad"></div> <div class="text-content">Same</div> </div><br> <div class="clown clown-5"> <div class="text-shad"></div> <div class="text-content">Thing.</div> </div><br> </div> <div class="clown-top"></div> <div class="balls-front"></div> </div> <div id="fire-pt" class="point"> <div class="fire-container"></div> <div class="fire-text text-back"> <div class="fire fire-1"> <div class="text-shad"></div> <div class="text-content">A Place</div> </div><br> <div class="fire fire-2"> <div class="text-shad"></div> <div class="text-content">Where</div> </div><br> <div class="fire fire-3"> <div class="text-shad"></div> <div class="text-content">Perspective</div> </div><br> <div class="fire fire-4"> <div class="text-shad"></div> <div class="text-content">Is Shared</div> </div><br> <div class="fire fire-5"> <div class="text-shad"></div> <div class="text-content">Not Forced.</div> </div> </div> </div> <div id="tunnel-pt" class="point"> <div class="rocks"></div> <div class="tunnel-text text-back"> <div class="tunnel tunnel-1"> <div class="text-shad"></div> <div class="text-content">A Place</div> </div><br> <div class="tunnel tunnel-2"> <div class="text-shad"></div> <div class="text-content">Where</div> </div><br> <div class="tunnel tunnel-3"> <div class="text-shad"></div> <div class="text-content">Photographers</div> </div><br> <div class="tunnel tunnel-4"> <div class="text-shad"></div> <div class="text-content">Belong.</div> </div><br> </div> </div> <div id="sky-pt" class="point"> <div class="clouds-bg"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/cloud_front.png"></div> <div class="parrot-1 parrot"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/parrot_1.png"></div> <div class="parrot-2 parrot"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/parrot_2.png"></div> <div class="parrot-3 parrot"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/parrot_3.png"></div> <div class="parrot-4 parrot"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/parrot_4.png"></div> <div class="sky-text text-back"> <div class="sky sky-1"> <div class="text-shad"></div> <div class="text-content">Yeah,</div> </div><br> <div class="sky sky-2"> <div class="text-shad"></div> <div class="text-content">But Wait...</div> </div><br> <div class="sky sky-3"> <div class="text-shad"></div> <div class="text-content">What?</div> </div><br> <div class="sky sky-4 small"> <div class="text-shad"></div> <div class="text-content"> SmugMug has acquired Flickr. <br> If you use our products today, rest easy, they aren't going anywhere.<br> The future is bright, but we'll only get there together.<br> Let's do this.</div> </div> </div> <div class="cloud cloud-2"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/cloud_front.png"></div> <div class="cloud cloud-1"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/cloud_front.png"></div> <div class="cloud cloud-3"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/cloud_front.png"></div> <div class="cloud cloud-4"><img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/cloud_front.png"></div> </div> </div> </div> <div id="final-pt" class="point"> <div class="logo-lg"></div> <div class="final-out-edge"> <div class="top-left-corner"></div> <div class="top-right-corner"></div> <div class="bottom-left-corner"></div> <div class="bottom-right-corner"></div> </div> <div class="final-in-edge"> <div class="squares"> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> </div> <div class="top-left-corner"></div> <div class="top-right-corner"></div> <div class="bottom-left-corner"></div> <div class="bottom-right-corner"></div> <div class="squares right"> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> <div class="focus-square"> <div class="square"></div> </div> </div> <form id="email-subscribe"> <label for="email">We're better together. Stay in the know.</label> <div class="email-wrapper"> <input id="email" name="email" placeholder="jane.doe@email.com" type="email"> <button type="submit">Submit</button> </div> </form> </div> </div> <div id="footer"> <div class="footer-wrapper"> <div class="smug-section"> <div class="smug-logo"> <a href="https://web.archive.org/web/20190320150717/https://www.smugmug.com/" target="_blank" rel="noopener"> <img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/smugmug_logo_footer.png" srcset="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/smugmug_logo_footer_2x.png 2x"> </a> </div> <div class="bordered about"> <a href="https://web.archive.org/web/20190320150717/https://www.smugmug.com/about" target="_blank" rel="noopener">About</a> </div> <div class="bordered"> <a href="/web/20190320150717/https://www.smugmug.com/together/faq" target="_blank" rel="noopener">FAQ</a> </div> <div class="bordered"> Follow Us </div> <div class="social"> <a href="https://web.archive.org/web/20190320150717/https://twitter.com/smugmug" target="_blank" rel="noopener"> <svg role="presentation" width="30px" height="30px"><use href="#svg-Twitter" xlink:href="/web/20190320150717im_/https://www.smugmug.com/together/?utm_campaign=flickr-launch&utm_source=Flickr&utm_medium=blog&utm_content=faq#svg-Twitter"/></svg> </a> </div> <div class="social"> <a href="https://web.archive.org/web/20190320150717/https://www.instagram.com/smugmug/" target="_blank" rel="noopener"> <svg role="presentation" width="30px" height="30px"><use href="#svg-Instagram" xlink:href="/web/20190320150717im_/https://www.smugmug.com/together/?utm_campaign=flickr-launch&utm_source=Flickr&utm_medium=blog&utm_content=faq#svg-Instagram"/></svg> </a> </div> <div class="social"> <a href="https://web.archive.org/web/20190320150717/https://www.facebook.com/SmugMug" target="_blank" rel="noopener"> <svg role="presentation" width="30px" height="30px"><use href="#svg-Facebook" xlink:href="/web/20190320150717im_/https://www.smugmug.com/together/?utm_campaign=flickr-launch&utm_source=Flickr&utm_medium=blog&utm_content=faq#svg-Facebook"/></svg> </a> </div> </div> <div class="footer-section"></div> <div class="flickr-section"> <div class="flickr-logo"> <a href="https://web.archive.org/web/20190320150717/https://www.flickr.com/?utm_campaign=flickr-launch&utm_source=SmugMug&utm_medium=referral&utm_content=ms-footer-txt" target="_blank" rel="noopener"> <img src="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/flickr_footer_logo.png" srcset="https://web.archive.org/web/20190320150717im_/https://d1w83c4dzsxgte.cloudfront.net/images/flickr_footer_logo_2x.png 2x"> </a> </div> <div class="bordered about"> <a href="https://web.archive.org/web/20190320150717/https://www.flickr.com/about?utm_campaign=flickr-launch&utm_source=SmugMug&utm_medium=referral&utm_content=ms-footer-txt" target="_blank" rel="noopener">About</a> </div> <div class="bordered"> Follow Us </div> <div class="social"> <a href="https://web.archive.org/web/20190320150717/https://twitter.com/Flickr" target="_blank" rel="noopener"> <svg role="presentation" width="30px" height="30px"><use href="#svg-Twitter" xlink:href="/web/20190320150717im_/https://www.smugmug.com/together/?utm_campaign=flickr-launch&utm_source=Flickr&utm_medium=blog&utm_content=faq#svg-Twitter"/></svg> </a> </div> <div class="social"> <a href="https://web.archive.org/web/20190320150717/https://www.instagram.com/flickr/" target="_blank" rel="noopener"> <svg role="presentation" width="30px" height="30px"><use href="#svg-Instagram" xlink:href="/web/20190320150717im_/https://www.smugmug.com/together/?utm_campaign=flickr-launch&utm_source=Flickr&utm_medium=blog&utm_content=faq#svg-Instagram"/></svg> </a> </div> <div class="social"> <a href="https://web.archive.org/web/20190320150717/https://www.facebook.com/flickr" target="_blank" rel="noopener"> <svg role="presentation" width="30px" height="30px"><use href="#svg-Facebook" xlink:href="/web/20190320150717im_/https://www.smugmug.com/together/?utm_campaign=flickr-launch&utm_source=Flickr&utm_medium=blog&utm_content=faq#svg-Facebook"/></svg> </a> </div> </div> </div> </div> </div> </div> <script> // Firefox CAN NOT handle this page, seems due to re-painting the entire // page while scrolling (huge background image). Even a test with ALL // JS disabled and a nearly black page, scrolling fast still leads to // jank. It's hacky, but it makes the user experience much better on // Firefox. Trust me. var isFirefox = (navigator.userAgent.indexOf('Firefox') > -1); var tag = document.createElement('script'); tag.src = 'https://web.archive.org/web/20190320150717/https://www.youtube.com/iframe_api'; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); var player; function onYouTubeIframeAPIReady() { if (window.YT) { player = new YT.Player('youtube-together', { videoId: 'T4B_qlaN8C4', playerVars: { modestbranding: 1, showinfo: 0, rel: 0, autoplay: 0 }, events: { onReady: function(e) { /*e.target.playVideo();*/ }, onStateChange: function (e) { // Hide bouncing down arrow if (e.data === -YT.PlayerState.UNSTARTED){ document.getElementById('down-arrow').style.display = "none"; } window.onTogetherVideoStateChange(e); } } }); } else { // console.log("No YouTube Player API defined") } } if (!isFirefox) { var stillScene = new ScrollMagic.Scene({ triggerHook: 0 }), streamerScene = new ScrollMagic.Scene({ triggerHook: 0 }), cakeScene = new ScrollMagic.Scene({ triggerHook: 0 }), ballScene = new ScrollMagic.Scene({ triggerHook: 0 }), clownScene = new ScrollMagic.Scene({ triggerHook: 0 }), fireScene = new ScrollMagic.Scene({ triggerHook: 0 }), tunnelScene = new ScrollMagic.Scene(), cloudScene = new ScrollMagic.Scene({ triggerHook: 0 }), skyScene = new ScrollMagic.Scene({ triggerHook: 0 }), cityScene = new ScrollMagic.Scene(), finalScene = new ScrollMagic.Scene(), cakeTextScene = new ScrollMagic.Scene({ triggerHook: 0 }), clownTextScene = new ScrollMagic.Scene({ triggerHook: 0 }), fireTextScene = new ScrollMagic.Scene({ triggerHook: 0 }), tunnelTextScene = new ScrollMagic.Scene({ triggerHook: 0 }), skyTextScene = new ScrollMagic.Scene({ triggerHook: 0 }), finalScene = new ScrollMagic.Scene({ triggerHook: 0 }); } var TM = TweenMax; var contentDiv = document.getElementById("content"); var style = contentDiv.currentStyle || window.getComputedStyle(contentDiv, false); var bgImageSrc = style.backgroundImage.slice(5, -2); var protoImage = new Image(); protoImage.src = "https://web.archive.org/web/20190320150717/https://d1w83c4dzsxgte.cloudfront.net/images/full_site_bg.jpg"; var coverSize = function(imageWidth, imageHeight, x, y, origWidth, origHeight, offsetX, offsetY) { if (arguments.length === 2) { x = y = 0; origWidth = ctx.canvas.width; origHeight = ctx.canvas.height; } // default offset is center offsetX = typeof offsetX === "number" ? offsetX : 0.5; offsetY = typeof offsetY === "number" ? offsetY : 0.5; // keep bounds [0.0, 1.0] if (offsetX < 0) offsetX = 0; if (offsetY < 0) offsetY = 0; if (offsetX > 1) offsetX = 1; if (offsetY > 1) offsetY = 1; var imageWidth = imageWidth, imageHeight = imageHeight, ratio = Math.min(origWidth / imageWidth, origHeight / imageHeight), newWidth = imageWidth * ratio, // new prop. width newHeight = imageHeight * ratio, // new prop.origHeighteight cx, cy, cw, ch, aspectRatio = 1; // decide which gap to fill if (newWidth < origWidth) aspectRatio = origWidth / newWidth; if (Math.abs(aspectRatio - 1) < 1e-14 && newHeight < origHeight) aspectRatio = origHeight / newHeight; newWidth *= aspectRatio; newHeight *= aspectRatio; // calc source rectangle cw = imageWidth / (newWidth / origWidth); ch = imageHeight / (newHeight / origHeight); cx = (imageWidth - cw) * offsetX; cy = (imageHeight - ch) * offsetY; // make sure source rectangle is valid if (cx < 0) cx = 0; if (cy < 0) cy = 0; if (cw > imageWidth) cw = imageWidth; if (ch > imageHeight) ch = imageHeight; var output = { x: cx, y: cy, width: newWidth, height: newHeight }; return output; // fill image in dest. rectangle // ctx.drawImage(img, cx, cy, cw, ch, x, y, w, h); } var setFireSize = function() { style = (contentDiv.currentStyle) != null ? contentDiv.currentStyle : window.getComputedStyle(contentDiv, false); contentDiv = document.getElementById("content"); if (protoImage.width > protoImage.height) { var ratio = protoImage.height / protoImage.width; if (contentDiv.offsetWidth > contentDiv.offsetHeight) { var bgW = contentDiv.offsetWidth; var bgH = Math.round(contentDiv.offsetWidth * ratio); if (bgH < contentDiv.offsetHeight) { bgH = contentDiv.offsetHeight; bgW = Math.round(bgH / ratio); } } else { var bgW = Math.round(contentDiv.offsetHeight / ratio); var bgH = contentDiv.offsetHeight; } } else { var ratio = protoImage.width / protoImage.height; if (contentDiv.offsetHeight > contentDiv.offsetWidth) { var bgH = contentDiv.offsetHeight; var bgW = Math.round(contentDiv.offsetHeight * ratio); if (bgW > contentDiv.offsetWidth) { bgW = contentDiv.offsetWidth; bgH = Math.round(bgW / ratio); } } else { var bgW = Math.round(contentDiv.offsetWidth / ratio); var bgH = contentDiv.offsetWidth; } } var fireFrames = document.getElementsByClassName('fire-frame'); var firePt = document.getElementById('fire-pt'); var fireFrameRatio = 292 / 1397; var size = coverSize(protoImage.width, protoImage.height, 0, 0, contentDiv.offsetWidth, contentDiv.offsetHeight); for (let i = 0; i < fireFrames.length; i++) { fireFrames[i].style.width = contentDiv.offsetWidth; fireFrames[i].style.height = contentDiv.offsetHeight; fireFrames[i].style.backgroundPosition = "center " + (firePt.offsetTop) + "px"; fireFrames[i].style.backgroundSize = (size.width * 1) + "px " + fireFrameRatio * (size.width * 1) + "px"; } // debugger; } protoImage.onload = setFireSize; // var slideScene = new ScrollMagic.Scene({triggerHook: 0}); var resetOffsets = function() { var contentHeight = $('.content') .outerHeight(); if (!isFirefox) { stillScene.duration($("#still-pt") .outerHeight()); stillScene.offset(0); streamerScene.duration($("#cake-pt") .outerHeight()) streamerScene.offset(stillScene.duration() * 0 + stillScene.offset()) cakeTextScene.duration($("#cake-pt") .outerHeight() + stillScene.duration() * .75) cakeTextScene.offset(stillScene.duration() / 4.2); var clownDiv = $("#clown-pt"); clownTextScene.duration(clownDiv.outerHeight() + (clownDiv.outerHeight() * .25)); clownTextScene.offset(clownDiv.offset() .top - (clownDiv.outerHeight() * .5)); cakeScene.duration($("#cake-pt") .outerHeight() + stillScene.duration() * .75); cakeScene.offset(stillScene.duration() / 4); clownScene.duration($("#clown-pt") .outerHeight() + $("#cake-pt") .outerHeight() / 2); clownScene.offset($("#cake-pt") .outerHeight() * .75 + stillScene.duration()); ballScene.offset(cakeScene.offset() + cakeScene.duration() * .75); ballScene.duration($("#clown-pt") .outerHeight()); fireScene.duration($("#fire-pt") .outerHeight()); fireScene.offset(clownScene.duration() / 2 + clownScene.offset()); tunnelTextScene.duration($("#tunnel-pt") .outerHeight()); tunnelTextScene.offset($("#tunnel-pt") .offset() .top - ($("#tunnel-pt") .outerHeight() * .5)); tunnelScene.duration($("#tunnel-pt") .outerHeight() * .7); tunnelScene.offset(clownScene.duration() + clownScene.offset() + $("#fire-pt") .outerHeight() - ($("#tunnel-pt") .outerHeight())); cloudScene.duration($("#sky-pt") .outerHeight() / 2); cloudScene.offset($("#sky-pt") .offset() .top - $("#sky-pt") .outerHeight() * 0.5); skyTextScene.duration($("#sky-pt") .outerHeight() * 1); skyTextScene.offset($("#sky-pt") .offset() .top - $("#sky-pt") .outerHeight() * .35); skyScene.duration($("#sky-pt") .outerHeight() * .5); skyScene.offset(tunnelScene.duration() + tunnelScene.offset()); finalScene.duration(100); finalScene.offset(document.getElementById("final-pt").offsetTop - skyScene.duration()*.2 ); } setFireSize(); }; $(window) .resize(function() { resetOffsets(); }); if (!isFirefox) { var isBlue = false; var screenWidth = window.innerWidth; var ballCount = screenWidth > 1000 ? 50 : screenWidth > 500 ? 30 : 20; var cakeCount = screenWidth > 1000 ? 15 : screenWidth > 500 ? 10 : 5; // Add Cake bits for (let i = 0; i < cakeCount; i++) { var newDiv = document.createElement("div"); newDiv.className = 'cake-bits cake-bits-' + i; document.getElementsByClassName(i % 3 === 0 ? "cake-bits-over" : "cake-bits-under")[0].appendChild(newDiv); } // Add Balls for (let i = 0; i < ballCount; i++) { var newDiv = document.createElement("div"); isBlue = !isBlue; newDiv.className = "clown-ball " + ((isBlue === true) ? "ball-blue " : "ball-pink ") + (Math.random() >= 0.5 ? "ball-big" : "ball-sm"); document.getElementsByClassName(i % 2 === 0 ? "balls-front" : "balls-behind")[0].appendChild(newDiv); } var tmSequence = function(selector, duration, options, endAt) { var startAt = 1; var items = [] for (let i = startAt; i <= endAt; i++) { items.push(TM.to(selector + i, duration, Object.assign({}, options))); } return items; } var rangedRandom = function(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } var rangedFraction = function(min, max) { return Math.random() * (max - min) + min;; } var randomMoveCake = function(selector, duration) { var items = [] var elements = document.getElementsByClassName(selector), min = window.innerWidth * -0.25, xRange = [window.innerWidth * -0.15, window.innerWidth * 1.15], overflowY = $("#cake-pt") .outerHeight(), yRange = [0, overflowY], duration = 1, setFirst = true, options = {}, minScale = 0.5, maxScale = 1.1; for (let i = 0; i < elements.length; i++) { if (setFirst === true) { var preset = { x: rangedRandom(xRange[0], xRange[1]), y: rangedRandom(yRange[0], yRange[1]), scale: rangedFraction(minScale, maxScale) } if (i % 3 === 0) { preset.backgroundImage = "url('https://web.archive.org/web/20190320150717/https://d1w83c4dzsxgte.cloudfront.net/images/cake_bits/cake_bits_blur_" + (i + 1) + ".png')" } TM.set(elements[i], preset); } var elementOptions = Object.assign({}, options); elementOptions.x = rangedRandom(xRange[0], xRange[1]); elementOptions.ease = Sine.easeInOut; elementOptions.y = rangedRandom(yRange[0], yRange[1]); elementOptions.scale = rangedRandom(minScale, maxScale); items.push(TM.to(elements[i], duration, elementOptions)); } return items; } var randomBallsMove = function(selector) { var items = [] var elements = document.getElementsByClassName(selector), min = window.innerWidth * -0.25, duration = 1, moveX = false, moveY = true, onlyDown = true, options = {}, minScale = 1, maxScale = 1.3, setFirst = true, overflowY = $("#clown-pt") .outerHeight() + 25, xRange = [0, window.innerWidth * 1.15], yRange = [-75, overflowY], moveY = true, scaleSegment = (maxScale - 1) / 3; for (let i = 0; i < elements.length; i++) { if (setFirst === true) { var preset = { left: rangedRandom(xRange[0], xRange[1]), top: rangedRandom(yRange[0], yRange[1]), scale: rangedFraction(minScale, maxScale) } if (preset.scale > (maxScale - minScale) / 2) { var scaleImg = 1; if (elements[i].className.indexOf("blue") === -1) { preset.backgroundImage = "url('https://web.archive.org/web/20190320150717/https://d1w83c4dzsxgte.cloudfront.net/images/balls/blue_blur_" + scaleImg + ".png"; } else { preset.backgroundImage = "url('https://web.archive.org/web/20190320150717/https://d1w83c4dzsxgte.cloudfront.net/images/balls/pink_blur_" + scaleImg + ".png"; } } TM.set(elements[i], preset); } var elementOptions = Object.assign({}, options); // elementOptions.x = rangedRandom(xRange[0], xRange[1]); elementOptions.ease = Sine.easeInOut; elementOptions.top = rangedRandom(preset.css.top, yRange[1]); // elementOptions.scale = rangedRandom(minScale, maxScale); if (moveY === false) { delete elementOptions.y; } items.push(TM.to(elements[i], duration, elementOptions)); } return items; } } $(function() { // wait for document ready // document.getElementById("still-pt").onclick = function() { // var vid = document.getElementById("together-video"); // // vid.style.display = 'block'; // vid.style.opacity = 1; // // player.playVideo(); // // var downArrow = document.querySelector('#still-pt .down-arrow'); // var playArrow = document.querySelector('#still-pt .play-arrow'); // // if (downArrow) { // downArrow.style.opacity = 0; // } // // if (playArrow) { // playArrow.style.opacity = 0; // } // // // var vidTime = new TimelineMax(); // // document.getElementById("together-video").style.display = "block"; // document.getElementById("still-pt").onclick = null; // // // vidTime.add(TM.to('.video-container', .5, { opacity: 1 })) // // .add(TM.to('.play-arrow ', .5, { opacity: 0 }), 0) // // vidTime.add(TM.to('.down-arrow ', .5, { opacity: 0 }), 0) // // .add(function(d) { // // document.getElementById('play-arrow') // // .style.display = "none"; // // document.getElementById("still-pt").style.zIndex = 10000; // // }); // // vidTime.play(); // } var emailForm = document.getElementById('email-subscribe'); if (emailForm) { var button = emailForm.querySelector('button'); var input = emailForm.querySelector('input[name="email"]'); emailForm.addEventListener('submit', function(e) { e.preventDefault(); var value = input.value.trim(); if (value.length === 0){ $('#email-subscribe').trigger('email:error', "Please enter your email address and try again."); return; } button.disabled = false; // $.ajax({ // url : $(this).attr('action'), // type: "POST", // data: $(this).serialize(), // // success: function (data) { // button.disabled = false; // $('#email-subscribe').trigger('email:add'); // }, // // error: function (jXHR, textStatus, errorThrown) { // button.disabled = false; // $('#email-subscribe').trigger('email:error'); // } // }); if (value) { var attempts = 0; var image = new Image(); var successFn = function () { button.disabled = false; $('#email-subscribe').trigger('email:add'); }; var errorFn = function () { var self = this; if (++attempts < 3) { setTimeout(function () { self.src = window.getBrontoSubscribeBeacon(value); }, 500); } else { button.disabled = false; $('#email-subscribe').trigger('email:error'); } }; image.onload = successFn; image.onerror = errorFn; image.src = window.getBrontoSubscribeBeacon(value); } }); $('#email-subscribe').on("email:add", function(){ var doneTime = new TimelineMax(); doneTime.add(TM.to("#email-subscribe button", .5, {opacity: 0})); doneTime.add(TM.to("#email-subscribe label", .5, {opacity: 0}),0); doneTime.add(TM.to("#email-subscribe input", .5, {opacity: 0}),0); doneTime.call(function(){$("#email-subscribe label").text("Thank you! We will be in touch soon.")}); doneTime.add(TM.to("#email-subscribe label", 1, {opacity: 1, color: 'white'})); }); $('#email-subscribe').on("email:error", function(e, message){ if (message == null){ message = "There was an error saving your email. Please try again."; } var doneTime = new TimelineMax(); doneTime.add(TM.to("#email-subscribe label", .5, {opacity: 0}),0); doneTime.call(function(){$("#email-subscribe label").text(message)}); doneTime.add(TM.to("#email-subscribe label", 1, {opacity: 1, color: "#c69638"})); }); } if (!isFirefox) { function isMobileDevice() { return (typeof window.orientation !== "undefined") || (navigator.userAgent.indexOf('IEMobile') !== -1); }; var isMobile = isMobileDevice(), controller; if (isMobile) { controller = new ScrollMagic.Controller({ container: ".scroll-container" }); document.getElementById('master-wrapper') .className += "mobile"; } else { controller = new ScrollMagic.Controller(); document.getElementById('master-wrapper') .className += "desktop"; } var controller = new ScrollMagic.Controller({ container: ".scroll-container" }), shutterTime = new TimelineMax(), stillTime = new TimelineMax(), ballTime = new TimelineMax(), cakeTime = new TimelineMax(), clownTime = new TimelineMax(), fireTime = new TimelineMax(), tunnelTime = new TimelineMax(), cloudTime = new TimelineMax(), skyTime = new TimelineMax(), finalTime = new TimelineMax(), slideTime = new TimelineMax(), wh = window.innerHeight; } TM.set('.content', { opacity: 1 }); // var slideStill = TM.to('.content', $("#still-pt").outerHeight(), {} ); // slideCake = TM.to('.content', $("#cake-pt").outerHeight(), {ease: Sine.easeInOut}), // slideClown = TM.to('.content', $("#clown-pt").outerHeight(), {ease: Sine.easeInOut}), // slideDumpster = TM.to('.content', $("#fire-pt").outerHeight(), {ease: Sine.easeInOut}), // slideTunnel = TM.to('.content', $("#tunnel-pt").outerHeight(), {backgroundPosition: "right center", ease: Sine.easeInOut}), // slideSky = TM.to('.content', $("#sky-pt").outerHeight(), { ease: Sine.easeInOut}); var downArrowTween = TM.to('.down-arrow', 0.75, { y: -30 }) .repeat(-1) .yoyo(true); if (!isFirefox) { var doForce3d = false; // window.innerWidth < 500; var cakeTimeTextBits = tmSequence('.cake-', .3, { left: -50, force3D: doForce3d }, 9); stillTime.add(TM.to('.play-arrow', 1, { opacity: 1, scale: 1 })) var streamerTween = TM.to('.streamers', 1, { y: "-150" }); stillScene.setTween(stillTime) // .addIndicators({ name: "Still Time", }) .on("leave", function(e){ if(e.type === "leave" && e.direction != "FORWARD" && e.state === "AFTER"){ player.pauseVideo(); } }) .addTo(controller); streamerScene.setTween(streamerTween) // .addIndicators({ name: "Streamer Time", }) .addTo(controller); //Cake var cakePtHeight = $("#cake-pt") .outerHeight(), cakeTextHeight = $(".cake-text") .outerHeight(), cakeWrapperY = $(".cake-text-relative") .position() .top; var cakeTextTime = new TimelineMax(); cakeTextTime.add(cakeTimeTextBits, "+=0", "start", .1); cakeTextTime.add(TM.to('.cake-text', 2, { top: $('#cake-pt') .outerHeight() * .3, ease: Sine.easeInOut }), 0); cakeTextScene.setTween(cakeTextTime) // .addIndicators({ name: "Cake Text Time", }) .addTo(controller); var flyingCake = randomMoveCake('cake-bits', 1); cakeTime.add(flyingCake, 0); cakeScene.setTween(cakeTime) // .addIndicators({ name: "Cake Time", }) .addTo(controller); //Balls //Clowns var clownTextTime = new TimelineMax(), clownTimeTextBits = tmSequence('.clown-', .3, { left: -50, force3D: doForce3d }, 6, 1); clownTextTime.add(clownTimeTextBits, "+=0", "start", 0.1); clownTextTime.add(TM.to('.clown-text', 2, { top: $('#clown-pt') .outerHeight() * .3 - $('.clown-text') .position() .top, force3D: doForce3d }), .5); clownTextScene.setTween(clownTextTime) // .addIndicators({ name: "Clown Text" }) .addTo(controller); var flyingBalls = randomBallsMove('clown-ball'); ballTime.add(flyingBalls, 0); ballScene.setTween(ballTime) // .addIndicators({ name: "Ball Time", }) .addTo(controller); tunnelTimeTextBits = tmSequence('.tunnel-', 1, { opacity: 1, left: -100, force3D: doForce3d, ease: Sine.easeInOut }, 4, 1); } // End FF hack // Fire Frames for (let i = 1; i <= 21; i++) { var newDiv = document.createElement("div"); newDiv.className = 'fire-frame fire-frame-' + i; document.getElementById('fire-container-2') .appendChild(newDiv); } // Show one frame on Firefox if (isFirefox) { var fireEl = document.querySelector('#fire-container-2 .fire-frame-1'); if (fireEl) { fireEl.style.opacity = 1; } } if (!isFirefox) { var fireTimeTextBits = tmSequence('.fire-', 1, { opacity: 1, ease: Sine.easeInOut, left: -50, force3D: doForce3d }, 5); var start; var curFrame = 1; function step(timestamp) { if (timestamp - start > 90) { var thisFlame = document.getElementsByClassName('fire-frame-' + curFrame)[0]; thisFlame.style.opacity = 1; var prevFrame = (curFrame === 1) ? 21 : curFrame - 1; var prevFlame = document.getElementsByClassName('fire-frame-' + prevFrame)[0]; prevFlame.style.opacity = 0; if (curFrame === 21) { curFrame = 1; } else { curFrame++; } start = timestamp; } if (!start) start = timestamp; window.requestAnimationFrame(step); } window.requestAnimationFrame(step); fireTime.add(fireTimeTextBits, "+=0", "start", 0.2); fireTime.add(TM.to('.fire-text', fireTime.duration(), { top: $('#fire-pt') .outerHeight() * .3 - $('.fire-text') .position() .top, force3D: doForce3d, ease: Sine.easeInOut })); fireScene.setTween(fireTime) // .addIndicators({ name: "Fire Time", }) .addTo(controller); var tunnelTextTime = new TimelineMax(); tunnelTextTime.add(tunnelTimeTextBits, "+=0", "start", 0.1); tunnelTextTime.add(TM.to('.tunnel-text', 3, { top: $('#tunnel-pt') .outerHeight() * .5 - $('.tunnel-text') .position() .top, ease: Sine.easeInOut, force3D: true }), .5); tunnelTextScene.setTween(tunnelTextTime) // .addIndicators({ name: "Tunnel Text", }) .addTo(controller); tunnelTime.add(TM.to('.content', 1, { backgroundPosition: "90% center", ease: Sine.easeInOut, force3D: false }), 0); TM.set('.rocks', { y: $('#tunnel-pt') .outerHeight() * -.1 }); tunnelTime.add(TM.to('.rocks', 1, { y: 0, ease: Sine.easeInOut, force3D: doForce3d }), 0); tunnelScene.setTween(tunnelTime) // .addIndicators({ name: "Tunnel Time", }) .addTo(controller); TM.set('.clouds-bg', { x: -400, y: 100 }); var cloud1 = TM.to('.cloud-1', 1, { x: 700, y: 100, ease: Sine.easeInOut }), cloud2 = TM.to('.cloud-2', 1, { x: 500, y: 50, ease: Sine.easeInOut }), cloud3 = TM.to('.cloud-3', 1, { x: 300, y: 50, ease: Sine.easeInOut }), cloud4 = TM.to('.cloud-4', 1, { x: 50, y: 20, ease: Sine.easeInOut }), cloudBg = TM.to('.clouds-bg', 1, { x: 0, y: 70, ease: Sine.easeInOut }); cloudTime.add(cloudBg, 0); cloudTime.add(cloud1, 0); cloudTime.add(cloud2, 0); cloudTime.add(cloud3, 0); cloudTime.add(cloud4, 0); cloudScene.setTween(cloudTime) // .addIndicators({ name: "Cloud Time", }) .addTo(controller); var parrot1 = TM.to('.parrot-1', 2, { x: 100, y: 70, ease: Sine.easeIn }), parrot2 = TM.to('.parrot-2', 2, { x: 200, y: 30, ease: Sine.easeIn }), parrot3 = TM.to('.parrot-3', 2, { x: 150, y: 30, ease: Sine.easeIn }), parrot4 = TM.to('.parrot-4', 2, { x: 250, y: -30, ease: Sine.easeIn }); skyTime.add([parrot1, parrot2, parrot3, parrot4], 0); var skyTextBits = tmSequence('.sky-', 1, { left: -50, opacity: 1, ease: Sine.easeInOut, force3D: doForce3d }, 4, 1); var skyTextTime = new TimelineMax(); skyTextTime.add(skyTextBits, "+=0", "start", 0.2); skyTextTime.add(TM.to('.sky-text', 3, { y: $('#sky-pt') .outerHeight() * .6 - $('.sky-text') .position() .top, ease: Sine.easeInOut, force3D: false }), .5); skyTextScene.setTween(skyTextTime) // .addIndicators({ name: "Sky Text", }) .addTo(controller); // skyTime.add(TM.to('.sky-text', skyTime.duration(), { y: 500, ease: Sine.easeInOut }), "-=3"); skyScene.setTween(skyTime) // .addIndicators({ name: "Sky Time", }) .addTo(controller); var finalTime = new TimelineMax(); finalTime.add(TM.to('.top-shadow',1, {opacity: 0})); finalScene.setTween(finalTime) // .addIndicators({ name: "Final Time", }) .addTo(controller); } // End FF hack resetOffsets(); return; }); </script>  <div class="spacer s_viewport"></div> <script>$(function(){var i,r;analytics.page("Microsite"),window.dataLayerPush({event:"page_view",event_snowplow_version:2,page_view_contexts:window.getDefaultSnowplowContexts()}),window.getBrontoSubscribeBeacon=function(e){return"https://app.bronto.com/public/?q=direct_add&fn=Public_DirectAddForm&id="+window.SM.BRONTO_BEACON_ID+"&email="+encodeURIComponent(e)+"&createCookie=1&list2="+window.SM.BRONTO_LIST_ID},window.onTogetherVideoStateChange=(r={25:{logged:!1},50:{logged:!1},75:{logged:!1}},function(e){var a,t,n,o=e.target;i||e.data!=YT.PlayerState.PLAYING||(i=setInterval(function(){!function(e){e.d=e.d||e.getDuration();var a=Math.round(e.getCurrentTime())/e.d*100,t=25*Math.floor(a/25);t in r&&!r[t].logged&&(r[t].logged=!0,window.trackSnowplowEvent({category:"Marketing Page",action:"Video Completion Percent",label:"Flickr",value:t}),analytics.track("Video Completion Percent",{category:"Marketing Page",label:"Flickr",value:t}))}(o)},2e3)),!i||e.data!=YT.PlayerState.PAUSED&&e.data!=YT.PlayerState.ENDED||(clearInterval(i),i=null),a=o,t=e.data,n=Math.round(a.getCurrentTime()),t==YT.PlayerState.PLAYING?0==n&&(window.trackSnowplowEvent({category:"Marketing Page",action:"Play Video",label:"Flickr"}),analytics.track("Play Video",{category:"Marketing Page",label:"Flickr"}),window.trackSnowplowEvent({category:"Marketing Page",action:"Video Completion Percent",label:"Flickr",value:0}),analytics.track("Video Completion Percent",{category:"Marketing Page",label:"Flickr",value:0})):t==YT.PlayerState.ENDED&&(window.trackSnowplowEvent({category:"Marketing Page",action:"Video Completion Percent",label:"Flickr",value:100}),analytics.track("Video Completion Percent",{category:"Marketing Page",label:"Flickr",value:100}))}),$("#email-subscribe").on("email:add",function(){window.trackSnowplowEvent({category:"Marketing Page",action:"Email Sign Up",label:"Sign Up",contexts:[{schema:"iglu:com.smugmug/screen/jsonschema/1-0-0",data:{section_name:"Body"}}]}),analytics.track("Email Sign Up",{category:"Marketing Page",label:"Sign Up"})}),$("#email-subscribe").on("email:error",function(){window.trackSnowplowEvent({category:"Marketing Page",action:"Email Sign Up Error",contexts:[{schema:"iglu:com.smugmug/screen/jsonschema/1-0-0",data:{section_name:"Body"}}]}),analytics.track("Email Sign Up Error",{category:"Marketing Page",label:"Sign Up Error"})})});</script> </body> </html>

CINXE.COM

Together, SmugMug+Flickr