[
  {
    "path": ".gitignore",
    "content": "*.DS_Store\n"
  },
  {
    "path": "README.md",
    "content": "# Stack Motion Hover Effect\n\nExperimental hover effects that reveal a stack of multiple colored cards behind the hovered item, inspired by [Merci-Michel](http://www.merci-michel.com/projects/)\n\n[Article on Codrops](https://tympanus.net/codrops/?p=30373)\n\n[Demo](http://tympanus.net/Development/StackMotionHoverEffects/)\n\n## Credits\n\n- Idea based on the effect seen on the projects page of [Merci-Michel](http://www.merci-michel.com/projects/)\n- [Anime.js](http://anime-js.com/) by Julian Garnier\n- Images made with designs by [Freepik.com](http://www.freepik.com/free-vector/new-year-party-brochure-with-colorful-geometric-shapes_997206.htm)\n- Typeface [Overpass Mono](https://fonts.google.com/specimen/Overpass+Mono) by Delve Withrington\n\n\n## License\nThis resource can be used freely if integrated or build upon in personal or commercial projects such as websites, web apps and web templates intended for sale. It is not allowed to take the resource \"as-is\" and sell it, redistribute, re-publish it, or sell \"pluginized\" versions of it. Free plugins built using this resource should have a visible mention and link to the original work. Always consider the licenses of all included libraries, scripts and images used.\n\n## Misc\n\nFollow Codrops: [Twitter](http://www.twitter.com/codrops), [Facebook](http://www.facebook.com/codrops), [Google+](https://plus.google.com/101095823814290637419), [GitHub](https://github.com/codrops), [Pinterest](http://www.pinterest.com/codrops/), [Instagram](https://www.instagram.com/codropsss/)\n\n[© Codrops 2017](http://www.codrops.com)\n\n\n\n\n\n"
  },
  {
    "path": "css/demo.css",
    "content": "*,\r\n*::after,\r\n*::before {\r\n\t-webkit-box-sizing: border-box;\r\n\tbox-sizing: border-box;\r\n}\r\n\r\nbody {\r\n\tfont-family: 'Overpass Mono', monospace;\r\n\tcolor: #edecf2;\r\n\tbackground: #37373e;\r\n\t-webkit-font-smoothing: antialiased;\r\n\t-moz-osx-font-smoothing: grayscale;\r\n}\r\n\r\na {\r\n\ttext-decoration: none;\r\n\tcolor: #ff3d53;\r\n\toutline: none;\r\n\ttransition: color 0.2s;\r\n}\r\n\r\na:hover,\r\na:focus {\r\n\tcolor: #fff;\r\n}\r\n\r\n.hidden {\r\n\tposition: absolute;\r\n\toverflow: hidden;\r\n\twidth: 0;\r\n\theight: 0;\r\n\tpointer-events: none;\r\n}\r\n\r\n/* Icons */\r\n.icon {\r\n\tdisplay: block;\r\n\twidth: 1.5em;\r\n\theight: 1.5em;\r\n\tmargin: 0 auto;\r\n\tfill: currentColor;\r\n}\r\n\r\n.message-mobile {\r\n\tfont-size: 0.85em;\r\n\tdisplay: none;\r\n\twidth: 100%;\r\n\tpadding: 0.5em;\r\n\ttext-align: center;\r\n\tbackground: #ff3d53;\r\n}\r\n\r\n/* Header */\r\n.codrops-header {\r\n\tdisplay: flex;\r\n\tflex-direction: row;\r\n\tflex-wrap: wrap;\r\n\talign-items: center;\r\n\twidth: 100%;\r\n\tpadding: 1.5em 1.5em 4em;\r\n\ttext-align: left;\r\n}\r\n\r\n.codrops-header__title {\r\n\tfont-size: 1.15em;\r\n\tmargin: 0;\r\n\tpadding: 0 0.5em;\r\n}\r\n\r\n.codrops-header__tagline {\r\n\tfont-size: 0.85em;\r\n\twidth: 100%;\r\n\tmargin: 0;\r\n\tcolor: #b0adad;\r\n}\r\n\r\n.codrops-header__tagline::before {\r\n\tcontent: '> ';\r\n}\r\n\r\n.github {\r\n\tfont-size: 0.85em;\r\n\tfont-weight: bold;\r\n\tmargin: 0 0 0 auto;\r\n}\r\n\r\n/* Top Navigation Style */\r\n.codrops-links {\r\n\tposition: relative;\r\n\tdisplay: flex;\r\n\tjustify-content: center;\r\n\ttext-align: center;\r\n\twhite-space: nowrap;\r\n}\r\n\r\n.codrops-links::after {\r\n\tcontent: '';\r\n\tposition: absolute;\r\n\ttop: 20%;\r\n\tleft: 50%;\r\n\twidth: 1px;\r\n\theight: 60%;\r\n\tbackground: #b0adad;\r\n\ttransform: rotate3d(0, 0, 1, 22.5deg);\r\n}\r\n\r\n.codrops-icon {\r\n\tdisplay: inline-block;\r\n\tmargin: 0.25em 0 0.25em 0.25em;\r\n\tpadding: 0.35em 0 0.35em 0.35em;\r\n}\r\n\r\n.codrops-icon:first-child {\r\n\tmargin: 0.25em 0.25em 0.25em 0;\r\n\tpadding: 0.35em 0.35em 0.35em 0;\r\n}\r\n\r\n/* Content */\r\n.content {\r\n\tposition: relative;\r\n\tdisplay: flex;\r\n\tflex-wrap: wrap;\r\n\talign-items: center;\r\n\tpadding: 0 0 1em;\r\n}\r\n\r\n.content:not(:first-child) {\r\n\tpadding: 4em 0;\r\n}\r\n\r\n.content.content--padded {\r\n\tpadding: 4em 0 8em;\r\n}\r\n\r\n.content__title {\r\n\tfont-size: 0.85em;\r\n\tposition: absolute;\r\n\ttop: 18%;\r\n\tleft: 2em;\r\n\twidth: 5em;\r\n\tmargin: 0.75em 0;\r\n\tcolor: #b0adad;\r\n}\r\n\r\n/* Grid */\r\n.grid {\r\n\tposition: relative;\r\n\tdisplay: flex;\r\n\tflex-wrap: wrap;\r\n\tjustify-content: center;\r\n\talign-items: center;\r\n\twidth: 100%;\r\n\tpadding: 0 7em;\r\n\tperspective: 800px;\r\n\tperspective-origin: 50% 100%;\r\n}\r\n\r\n.grid__item {\r\n\tposition: relative;\r\n\tdisplay: block;\r\n\tflex: none;\r\n\twidth: 250px;\r\n\tmargin: 1.5em 2vw;\r\n\tcursor: default;\r\n\ttransform-style: preserve-3d;\r\n}\r\n\r\n.grid__item:hover,\r\n.grid__item:focus {\r\n\toutline: none;\r\n}\r\n\r\n.grid__item--c1,\r\n.grid__item--c1:hover,\r\n.grid__item--c1:focus {\r\n\tcolor: #52649e;\r\n}\r\n\r\n.grid__item--c2,\r\n.grid__item--c2:hover,\r\n.grid__item--c2:focus {\r\n\tcolor: #ee7074;\r\n}\r\n\r\n.grid__item--c3,\r\n.grid__item--c3:hover,\r\n.grid__item--c3:focus {\r\n\tcolor: #f7f295;\r\n}\r\n\r\n.stack {\r\n\tposition: relative;\r\n\twidth: 100%;\r\n\theight: 200px;\r\n\ttransform-style: preserve-3d;\r\n}\r\n\r\n.stack__deco {\r\n\tposition: absolute;\r\n\ttop: 0;\r\n\tleft: 0;\r\n\twidth: 100%;\r\n\theight: 100%;\r\n\tbackground-color: currentColor;\r\n\ttransform-origin: 50% 100%;\r\n}\r\n\r\n.stack__deco:first-child {\r\n\topacity: 0.2;\r\n}\r\n\r\n.stack__deco:nth-child(2) {\r\n\topacity: 0.4;\r\n}\r\n\r\n.stack__deco:nth-child(3) {\r\n\topacity: 0.6;\r\n}\r\n\r\n.stack__deco:nth-child(4) {\r\n\topacity: 0.8;\r\n}\r\n\r\n.stack__figure {\r\n\tposition: relative;\r\n\tdisplay: flex;\r\n\tjustify-content: center;\r\n\talign-items: center;\r\n\toverflow: hidden;\r\n\twidth: 100%;\r\n\theight: 100%;\r\n\tcursor: pointer;\r\n\ttransform-origin: 50% 100%;\r\n}\r\n\r\n.stack__img {\r\n\tposition: relative;\r\n\tdisplay: block;\r\n\tflex: none;\r\n}\r\n\r\n.grid__item-caption {\r\n\tposition: relative;\r\n\tdisplay: flex;\r\n\tflex-wrap: wrap;\r\n\twidth: 100%;\r\n\ttransform-style: preserve-3d;\r\n}\r\n\r\n.grid__item-title {\r\n\tfont-size: 1.15em;\r\n\twidth: 100%;\r\n\tmargin: 1em 0;\r\n\ttext-align: left;\r\n\tcolor: #fff;\r\n}\r\n\r\n.column {\r\n\twidth: 50%;\r\n\tpadding: 0 0.5em;\r\n\topacity: 0;\r\n}\r\n\r\n.column--left {\r\n\ttext-align: right;\r\n}\r\n\r\n.column--right {\r\n\ttext-align: left;\r\n}\r\n\r\n.column__text {\r\n\tfont-size: 0.85em;\r\n\tdisplay: block;\r\n\tcolor: #fff;\r\n}\r\n\r\n.column--left .column__text {\r\n\tfont-weight: bold;\r\n}\r\n\r\n.column--right .column__text {\r\n\tcolor: #b0adad;\r\n}\r\n\r\n/* Individual effects */\r\n\r\n/* Vega */\r\n.grid--effect-vega .column {\r\n\topacity: 1;\r\n}\r\n\r\n/* Castor */\r\n.grid--effect-castor .stack__figure,\r\n.grid--effect-castor .stack__deco {\r\n\ttransform-origin: 50% 50%;\r\n}\r\n\r\n.grid--effect-castor .column {\r\n\topacity: 1;\r\n}\r\n\r\n/* Hamal */\r\n.grid--effect-hamal {\r\n\tperspective: none;\r\n}\r\n\r\n.grid--effect-hamal .column {\r\n\topacity: 1;\r\n}\r\n\r\n/* polaris */\r\n.grid--effect-polaris {\r\n\tperspective-origin: 100% -100%;\r\n}\r\n\r\n.grid--effect-polaris .column {\r\n\topacity: 1;\r\n}\r\n\r\n/* Alphard */\r\n.grid--effect-alphard {\r\n\tperspective: none;\r\n}\r\n\r\n.grid--effect-alphard .column {\r\n\topacity: 1;\r\n}\r\n\r\n.grid--effect-alphard .stack__figure,\r\n.grid--effect-alphard .stack__deco {\r\n\ttransform-origin: 50% 150%;\r\n}\r\n\r\n/* Altair */\r\n.grid--effect-altair {\r\n\tperspective-origin: 50% -50%;\r\n}\r\n\r\n.grid--effect-altair .column {\r\n\topacity: 1;\r\n}\r\n\r\n.grid--effect-altair .stack__figure,\r\n.grid--effect-altair .stack__deco {\r\n\ttransform-origin: 50% 100%;\r\n}\r\n\r\n/* rigel */\r\n.grid--effect-rigel {\r\n\tperspective-origin: 50% 100%;\r\n}\r\n\r\n.grid--effect-rigel .column {\r\n\topacity: 1;\r\n}\r\n\r\n/* Canopus */\r\n.grid--effect-canopus {\r\n\tperspective-origin: 50% 0%;\r\n}\r\n\r\n.grid--effect-canopus .column {\r\n\topacity: 1;\r\n}\r\n\r\n.grid--effect-canopus .stack__figure,\r\n.grid--effect-canopus .stack__deco {\r\n\ttransform-origin: 50% 100%;\r\n}\r\n\r\n/* pollux */\r\n.grid--effect-pollux {\r\n\tperspective: 1000px;\r\n\tperspective-origin: 50% -70%;\r\n}\r\n\r\n.grid--effect-pollux .column {\r\n\topacity: 1;\r\n}\r\n\r\n.grid--effect-pollux .stack__figure,\r\n.grid--effect-pollux .stack__deco {\r\n\ttransform-origin: 50% 50%;\r\n}\r\n\r\n.grid--effect-pollux .grid__item-caption > .grid__item-title {\r\n\ttransform-origin: 50% -200%;\r\n}\r\n\r\n/* deneb */\r\n.grid--effect-deneb {\r\n\tperspective: none;\r\n}\r\n\r\n.grid--effect-deneb .stack__figure,\r\n.grid--effect-deneb .stack__deco {\r\n\ttransform-origin: 50% 50%;\r\n}\r\n\r\n.grid--effect-deneb .grid__item-caption > .column {\r\n\ttransform-origin: 50% -200%;\r\n}\r\n\r\n/* Related demos */\r\n.content.content--related {\r\n\tfont-weight: bold;\r\n\tjustify-content: center;\r\n\tmin-height: 0;\r\n\tpadding-bottom: 10em;\r\n\ttext-align: center;\r\n\tbackground: #5d5d66;\r\n}\r\n\r\n.content--related a {\r\n\tcolor: #b0adad;\r\n}\r\n\r\n.content--related a:hover,\r\n.content--related a:focus {\r\n\tcolor: #fff;\r\n}\r\n\r\n.content--related p:first-child {\r\n\tpadding: 6em 0 2em;\r\n}\r\n\r\n.content--related p {\r\n\twidth: 100%;\r\n\tcolor: #37373e;\r\n}\r\n\r\n.media-item {\r\n\tfont-size: 0.85em;\r\n\tdisplay: inline-block;\r\n\tpadding: 1em 2vw;\r\n\tvertical-align: top;\r\n\ttransition: color 0.3s;\r\n}\r\n\r\n.media-item__img {\r\n\tmax-width: 100%;\r\n\topacity: 0.6;\r\n\ttransition: opacity 0.3s;\r\n}\r\n\r\n.media-item:hover .media-item__img,\r\n.media-item:focus .media-item__img {\r\n\topacity: 1;\r\n}\r\n\r\n.media-item__title {\r\n\tfont-size: 1em;\r\n\tmargin: 0;\r\n\tpadding: 0.5em;\r\n}\r\n\r\n@media screen and (max-width: 42em) {\r\n\t.codrops-header {\r\n\t\tdisplay: block;\r\n\t\ttext-align: center;\r\n\t}\r\n\t.github {\r\n\t\twidth: 100%;\r\n\t\tmargin: 0;\r\n\t\tpadding: 0.5em 0;\r\n\t}\r\n\t.message-mobile {\r\n\t\tdisplay: block;\r\n\t}\r\n}\r\n"
  },
  {
    "path": "css/normalize.css",
    "content": "article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:\"\\201C\" \"\\201D\" \"\\2018\" \"\\2019\";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type=\"button\"],input[type=\"reset\"],input[type=\"submit\"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type=\"checkbox\"],input[type=\"radio\"]{box-sizing:border-box;padding:0;}input[type=\"search\"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type=\"search\"]::-webkit-search-cancel-button,input[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}"
  },
  {
    "path": "index.html",
    "content": "<!DOCTYPE html>\n<html lang=\"en\" class=\"no-js\">\n\t<head>\n\t\t<meta charset=\"UTF-8\" />\n\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n\t\t<title>Stack Motion Hover Effects | Codrops</title>\n\t\t<meta name=\"description\" content=\"Item hover effects that reveal a colored stack behind the hovered item\" />\n\t\t<meta name=\"keywords\" content=\"hover effect, reveal, hover, css, animations, anime.js, javascript, motion, ux\" />\n\t\t<meta name=\"author\" content=\"Codrops\" />\n\t\t<link rel=\"shortcut icon\" href=\"favicon.ico\">\n\t\t<link href=\"https://fonts.googleapis.com/css?family=Overpass+Mono:400,700\" rel=\"stylesheet\">\n\t\t<link rel=\"stylesheet\" type=\"text/css\" href=\"css/normalize.css\" />\n\t\t<link rel=\"stylesheet\" type=\"text/css\" href=\"css/demo.css\" />\n\t\t<script>document.documentElement.className = 'js';</script>\n\t</head>\n\t<body>\n\t\t<svg class=\"hidden\">\n\t\t\t<symbol id=\"icon-arrow\" viewBox=\"0 0 24 24\">\n\t\t\t\t<title>arrow</title>\n\t\t\t\t<polygon points=\"6.3,12.8 20.9,12.8 20.9,11.2 6.3,11.2 10.2,7.2 9,6 3.1,12 9,18 10.2,16.8 \"/>\n\t\t\t</symbol>\n\t\t\t<symbol id=\"icon-drop\" viewBox=\"0 0 24 24\">\n\t\t\t\t<title>drop</title>\n\t\t\t\t<path d=\"M12,21c-3.6,0-6.6-3-6.6-6.6C5.4,11,10.8,4,11.4,3.2C11.6,3.1,11.8,3,12,3s0.4,0.1,0.6,0.3c0.6,0.8,6.1,7.8,6.1,11.2C18.6,18.1,15.6,21,12,21zM12,4.8c-1.8,2.4-5.2,7.4-5.2,9.6c0,2.9,2.3,5.2,5.2,5.2s5.2-2.3,5.2-5.2C17.2,12.2,13.8,7.3,12,4.8z\"/><path d=\"M12,18.2c-0.4,0-0.7-0.3-0.7-0.7s0.3-0.7,0.7-0.7c1.3,0,2.4-1.1,2.4-2.4c0-0.4,0.3-0.7,0.7-0.7c0.4,0,0.7,0.3,0.7,0.7C15.8,16.5,14.1,18.2,12,18.2z\"/>\n\t\t\t</symbol>\n\t\t</svg>\n\t\t<main>\n\t\t\t<div class=\"message-mobile\">This is a hover effect. Best viewed on desktop.</div>\n\t\t\t<header class=\"codrops-header\">\n\t\t\t\t<div class=\"codrops-links\">\n\t\t\t\t\t<a class=\"codrops-icon codrops-icon--prev\" href=\"https://tympanus.net/Development/GeekyGlasses/\" title=\"Previous Demo\"><svg class=\"icon icon--arrow\"><use xlink:href=\"#icon-arrow\"></use></svg></a>\n\t\t\t\t\t<a class=\"codrops-icon codrops-icon--drop\" href=\"https://tympanus.net/codrops/?p=30373\" title=\"Back to the article\"><svg class=\"icon icon--drop\"><use xlink:href=\"#icon-drop\"></use></svg></a>\n\t\t\t\t</div>\n\t\t\t\t<h1 class=\"codrops-header__title\">Stack Motion Hover Effects</h1>\n\t\t\t\t<a class=\"github\" href=\"https://github.com/codrops/StackMotionHoverEffects/\">/Github</a>\n\t\t\t\t<p class=\"codrops-header__tagline\">Decorative motion hover effects for grid items</p>\n\t\t\t\t<p class=\"codrops-header__tagline\">Inspired by <a href=\"http://www.merci-michel.com/projects/\">Merci-Michel</a></p>\n\t\t\t</header>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_001</h2>\n\t\t\t\t<div class=\"grid grid--effect-vega\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_002</h2>\n\t\t\t\t<div class=\"grid grid--effect-castor\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_003</h2>\n\t\t\t\t<div class=\"grid grid--effect-hamal\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_004</h2>\n\t\t\t\t<div class=\"grid grid--effect-polaris\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_005</h2>\n\t\t\t\t<div class=\"grid grid--effect-alphard\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_006</h2>\n\t\t\t\t<div class=\"grid grid--effect-altair\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_007</h2>\n\t\t\t\t<div class=\"grid grid--effect-rigel\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_008</h2>\n\t\t\t\t<div class=\"grid grid--effect-canopus\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content\">\n\t\t\t\t<h2 class=\"content__title\">_009</h2>\n\t\t\t\t<div class=\"grid grid--effect-pollux\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t<section class=\"content content--padded\">\n\t\t\t\t<h2 class=\"content__title\">_010</h2>\n\t\t\t\t<div class=\"grid grid--effect-deneb\">\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c1\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/1.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">anaerobic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c2\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/2.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">exothermic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t\t<a href=\"#\" class=\"grid__item grid__item--c3\">\n\t\t\t\t\t\t<div class=\"stack\">\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__deco\"></div>\n\t\t\t\t\t\t\t<div class=\"stack__figure\">\n\t\t\t\t\t\t\t\t<img class=\"stack__img\" src=\"img/3.png\" alt=\"Image\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"grid__item-caption\">\n\t\t\t\t\t\t\t<h3 class=\"grid__item-title\">diatomic</h3>\n\t\t\t\t\t\t\t<div class=\"column column--left\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Period</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Subjects</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Result</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"column column--right\">\n\t\t\t\t\t\t\t\t<span class=\"column__text\">2045</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">133456</span>\n\t\t\t\t\t\t\t\t<span class=\"column__text\">Positive</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t\t\n\t\t\t<!-- Related demos -->\n\t\t\t<section class=\"content content--related\">\n\t\t\t\t<p>Images made with designs by <a href=\"http://www.freepik.com/free-vector/new-year-party-brochure-with-colorful-geometric-shapes_997206.htm\">Freepik.com</a></p>\n\t\t\t\t<p>If you enjoyed this demo you might also like:</p>\n\t\t\t\t<a class=\"media-item\" href=\"https://tympanus.net/Development/TiltHoverEffects/\">\n\t\t\t\t\t<img class=\"media-item__img\" src=\"img/related/TiltHoverEffects.jpg\">\n\t\t\t\t\t<h3 class=\"media-item__title\">Tilt Hover Effects</h3>\n\t\t\t\t</a>\n\t\t\t\t<a class=\"media-item\" href=\"https://tympanus.net/Development/HoverEffectIdeas/\">\n\t\t\t\t\t<img class=\"media-item__img\" src=\"img/related/HoverEffectIdeas.jpg\">\n\t\t\t\t\t<h3 class=\"media-item__title\">Hover Effect Ideas</h3>\n\t\t\t\t</a>\n\t\t\t\t<a class=\"media-item\" href=\"https://tympanus.net/Development/LineMenuStyles/\">\n\t\t\t\t\t<img class=\"media-item__img\" src=\"img/related/LineMenuStyles.jpg\">\n\t\t\t\t\t<h3 class=\"media-item__title\">Line Menu Styles</h3>\n\t\t\t\t</a>\n\t\t\t</section>\n\t\t</main>\n\t\t<script src=\"js/anime.min.js\"></script>\n\t\t<script src=\"js/main.js\"></script>\n\t\t<script>\n\t\t(function() {\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-vega > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew VegaFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-castor > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew CastorFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-hamal > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew HamalFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-polaris > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew PolarisFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-alphard > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew AlphardFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-altair > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew AltairFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-rigel > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew RigelFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-canopus > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew CanopusFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-pollux > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew PolluxFx(stackEl);\n\t\t\t});\n\t\t\t[].slice.call(document.querySelectorAll('.grid--effect-deneb > .grid__item')).forEach(function(stackEl) {\n\t\t\t\tnew DenebFx(stackEl);\n\t\t\t});\n\t\t})();\n\t\t</script>\n\t</body>\n</html>\n"
  },
  {
    "path": "js/main.js",
    "content": "/**\n * main.js\n * http://www.codrops.com\n *\n * Licensed under the MIT license.\n * http://www.opensource.org/licenses/mit-license.php\n * \n * Copyright 2017, Codrops\n * http://www.codrops.com\n */\n;(function(window) {\n\n\t'use strict';\n\n\t/**\n\t * StackFx: The parent class.\n\t */\n\tfunction StackFx(el) {\n\t\tthis.DOM = {};\n\t\tthis.DOM.el = el;\n\t\tthis.DOM.stack = this.DOM.el.querySelector('.stack');\n\t\tthis.DOM.stackItems = [].slice.call(this.DOM.stack.children);\n\t\tthis.totalItems = this.DOM.stackItems.length;\n\t\tthis.DOM.img = this.DOM.stack.querySelector('.stack__figure > .stack__img');\n\t\tthis.DOM.caption = this.DOM.el.querySelector('.grid__item-caption');\n\t\tthis.DOM.title = this.DOM.caption.querySelector('.grid__item-title');\n\t\tthis.DOM.columns = {left: this.DOM.caption.querySelector('.column--left'), right: this.DOM.caption.querySelector('.column--right')};\n\t}\n\n\tStackFx.prototype._removeAnimeTargets = function() {\n\t\tanime.remove(this.DOM.stackItems);\n\t\tanime.remove(this.DOM.img);\n\t\tanime.remove(this.DOM.title);\n\t\tanime.remove(this.DOM.columns.left);\n\t\tanime.remove(this.DOM.columns.right);\n\t};\n\n\t/************************************************************************\n\t * VegaFx.\n\t ************************************************************************/\n\tfunction VegaFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tVegaFx.prototype = Object.create(StackFx.prototype);\n\tVegaFx.prototype.constructor = VegaFx;\n\n\tVegaFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tVegaFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tthis.DOM.stackItems.map(function(e, i) {\n\t\t\te.style.opacity = i !== self.totalItems - 1 ? 0.2*i+0.2 : 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\ttranslateZ: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn index*8 + 8;\n\t\t\t\t\t},\n\t\t\t\t\tduration: 200 ,\n\t\t\t\t\teasing: [0.42,0,1,1]\n\t\t\t\t},\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn index*20 + 20;\n\t\t\t\t\t},\n\t\t\t\t\tduration: 700,\n\t\t\t\t\teasing: [0.2,1,0.3,1]\n\t\t\t\t}\n\t\t\t],\n\t\t\trotateX: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn -1 * (index*2 + 2);\n\t\t\t\t\t},\n\t\t\t\t\tduration: 200,\n\t\t\t\t\teasing: [0.42,0,1,1]\n\t\t\t\t},\n\t\t\t\t{ \n\t\t\t\t\tvalue: 0, \n\t\t\t\t\tduration: 700,\n\t\t\t\t\teasing: [0.2,1,0.3,1]\n\t\t\t\t}\n\t\t\t]\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 900,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\tscale: 0.7\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\ttranslateY: {\n\t\t\t\tvalue: [35,0], \n\t\t\t\tduration: 500, \n\t\t\t\teasing: [0.5,1,0.3,1]\n\t\t\t},\n\t\t\topacity: {\n\t\t\t\tvalue: [0,1], \n\t\t\t\tduration: 400, \n\t\t\t\teasing: 'linear'\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\ttranslateY: [\n\t\t\t\t{\n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn index === 0 ? [40,0] : [60,0];\n\t\t\t\t\t}, \n\t\t\t\t\tduration: 500, \n\t\t\t\t\teasing: [0.5,1,0.3,1], \n\t\t\t\t\tdelay: 100\n\t\t\t\t}\n\t\t\t],\n\t\t\topacity: [\n\t\t\t\t{value: [0,0], duration: 1, easing: 'linear'},\n\t\t\t\t{value: 1, delay: 100, duration: 400, easing: 'linear'}\n\t\t\t]\n\t\t});\n\t};\n\n\tVegaFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\ttranslateZ: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn index * 20 + 20 - 8;\n\t\t\t\t\t},\n\t\t\t\t\tduration: 200 ,\n\t\t\t\t\teasing: [0.42,0,1,1]\n\t\t\t\t},\n\t\t\t\t{ \n\t\t\t\t\tvalue: 0,\n\t\t\t\t\tduration: 900,\n\t\t\t\t\teasing: [0.2,1,0.3,1]\n\t\t\t\t}\n\t\t\t],\n\t\t\trotateX: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn index*2 + 2;\n\t\t\t\t\t},\n\t\t\t\t\tduration: 200,\n\t\t\t\t\teasing: [0.42,0,1,1]\n\t\t\t\t},\n\t\t\t\t{ \n\t\t\t\t\tvalue: 0, \n\t\t\t\t\tduration: 900,\n\t\t\t\t\teasing: [0.2,1,0.3,1]\n\t\t\t\t}\n\t\t\t],\n\t\t\topacity: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t\t},\n\t\t\t\tduration: 900,\n\t\t\t\tdelay: 200,\n\t\t\t\teasing: [0.2,1,0.3,1]\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 900,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\tscale: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\tduration: 750,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\ttranslateY: 0,\n\t\t\topacity: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 750,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\ttranslateY: 0,\n\t\t\topacity: 1\n\t\t});\n\t};\n\n\twindow.VegaFx = VegaFx;\n\t\n\t/************************************************************************\n\t * CastorFx.\n\t ************************************************************************/\n\tfunction CastorFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tCastorFx.prototype = Object.create(StackFx.prototype);\n\tCastorFx.prototype.constructor = CastorFx;\n\n\tCastorFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tCastorFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\trotateX: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index === cnt - 1 ? 0 : [70, 0];\n\t\t\t\t},\n\t\t\t\tduration: 1000,\n\t\t\t\teasing: 'easeOutExpo'\n\t\t\t},\n\t\t\ttranslateZ: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index === cnt - 1 ? index*20 : [-300, index*20];\n\t\t\t\t},\n\t\t\t\tduration: 1000,\n\t\t\t\teasing: 'easeOutExpo'\n\t\t\t},\n\t\t\topacity: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index === cnt - 1 ? 1 : [0,0.2*index+0.2];\n\t\t\t\t},\n\t\t\t\tduration: 1000,\n\t\t\t\teasing: 'linear'\n\t\t\t},\n\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\treturn (cnt-index-1)*100\n\t\t\t}\n\t\t});\n\t\t\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tscale: 0.7\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateZ: 30\n\t\t});\n\t};\n\n\tCastorFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateZ: 0,\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tscale: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateZ: 0\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tdelay: function(target, index) {\n\t\t\t\treturn index === 0 ? 150 : 200;\n\t\t\t},\n\t\t\ttranslateX: 0,\n\t\t\ttranslateY: 0\n\t\t});\n\t};\n\n\twindow.CastorFx = CastorFx;\n\n\t/************************************************************************\n\t * HamalFx.\n\t ************************************************************************/\n\tfunction HamalFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tHamalFx.prototype = Object.create(StackFx.prototype);\n\tHamalFx.prototype.constructor = HamalFx;\n\n\tHamalFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tHamalFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tthis.DOM.stackItems.map(function(e, i) {\n\t\t\te.style.opacity = i !== self.totalItems - 1 ? 0.2*i+0.2 : 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateY: function(target, index) {\n\t\t\t\treturn -1*index*5;\n\t\t\t},\n\t\t\trotate: function(target, index, cnt) {\n\t\t\t\tif( index === cnt - 1 ) {\n\t\t\t\t\treturn 0;\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\treturn index%2 ? (cnt-index)*1 : -1*(cnt-index)*1;\n\t\t\t\t}\n\t\t\t},\n\t\t\tscale: function(target, index, cnt) {\n\t\t\t\tif( index === cnt - 1 ) {\n\t\t\t\t\treturn 1;\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\treturn 1.05;\n\t\t\t\t}\n\t\t\t},\n\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\treturn (cnt-index-1)*30\n\t\t\t}\n\t\t});\n\t\t\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tscale: 0.7\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateX: function(target, index) {\n\t\t\t\treturn index === 0 ? -30 : 30;\n\t\t\t}\n\t\t});\n\t\t\n\t};\n\n\tHamalFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateY: 0,\n\t\t\trotate: 0,\n\t\t\tscale: 1,\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutElastic',\n\t\t\tscale: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateX: 0\n\t\t});\n\t};\n\n\twindow.HamalFx = HamalFx;\n\n\t/************************************************************************\n\t * PolarisFx.\n\t ************************************************************************/\n\tfunction PolarisFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tPolarisFx.prototype = Object.create(StackFx.prototype);\n\tPolarisFx.prototype.constructor = PolarisFx;\n\n\tPolarisFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tPolarisFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tthis.DOM.stackItems.map(function(e, i) {\n\t\t\te.style.opacity = i !== self.totalItems - 1 ? 0.2*i+0.2 : 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutElastic',\n\t\t\ttranslateZ: function(target, index) {\n\t\t\t\treturn index*10;\n\t\t\t},\n\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\treturn (cnt-index-1)*20\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tscale: 0.7\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutElastic',\n\t\t\ttranslateZ: 30\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutElastic',\n\t\t\ttranslateX: function(target, index) {\n\t\t\t\treturn index === 0 ? -30 : 30;\n\t\t\t},\n\t\t\ttranslateY: 30\n\t\t});\n\t};\n\n\tPolarisFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateZ: 0,\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tscale: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\tduration: 500,\n\t\t\tdelay: 100,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateZ: 0\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tdelay: function(target, index) {\n\t\t\t\treturn index === 0 ? 150 : 200;\n\t\t\t},\n\t\t\ttranslateX: 0,\n\t\t\ttranslateY: 0\n\t\t});\n\t};\n\n\twindow.PolarisFx = PolarisFx;\n\n\t/************************************************************************\n\t * AlphardFx.\n\t ************************************************************************/\n\tfunction AlphardFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tAlphardFx.prototype = Object.create(StackFx.prototype);\n\tAlphardFx.prototype.constructor = AlphardFx;\n\n\tAlphardFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tAlphardFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tthis.DOM.stackItems.map(function(e, i) {\n\t\t\te.style.opacity = i !== self.totalItems - 1 ? 0.2*i+0.2 : 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\topacity: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index !== cnt - 1 ? [0,0.2*index+0.2] : 1\n\t\t\t\t},\n\t\t\t\tduration: 1,\n\t\t\t\teasing: 'linear',\n\t\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\t\treturn (cnt-index-1)*30 + 250\n\t\t\t\t}\n\t\t\t},\n\t\t\trotate: [\n\t\t\t\t{\n\t\t\t\t\tvalue: 12,\n\t\t\t\t\tduration: 250,\n\t\t\t\t\teasing: 'easeOutQuad'\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn -1*index*3 - 3;\n\t\t\t\t\t},\n\t\t\t\t\tduration: 1000,\n\t\t\t\t\teasing: 'easeOutExpo'\n\t\t\t\t}\n\t\t\t],\n\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\treturn (cnt-index-1)*30\n\t\t\t}\n\t\t});\n\t\t\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\trotate: [\n\t\t\t\t{\n\t\t\t\t\tvalue: [0,12], \n\t\t\t\t\tduration: 250, \n\t\t\t\t\teasing: 'easeOutQuad', \n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tvalue: [12,0], \n\t\t\t\t\tduration: 1200, \n\t\t\t\t\tdelay: 50,\n\t\t\t\t\teasing: 'easeOutExpo', \n\t\t\t\t}\n\t\t\t]\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateY: function(target, index) {\n\t\t\t\treturn index === 0 ? -5 : 5;\n\t\t\t}\n\t\t});\n\t};\n\n\tAlphardFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\trotate: 0,\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutExpo',\n\t\t\trotate: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateY: 0\n\t\t});\n\t};\n\n\twindow.AlphardFx = AlphardFx;\n\n\t/************************************************************************\n\t * AltairFx.\n\t ************************************************************************/\n\tfunction AltairFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tAltairFx.prototype = Object.create(StackFx.prototype);\n\tAltairFx.prototype.constructor = AltairFx;\n\n\tAltairFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tAltairFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tthis.DOM.stackItems.map(function(e, i) {\n\t\t\te.style.opacity = i !== self.totalItems - 1 ? 0.2*i+0.2 : 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutElastic',\n\t\t\ttranslateZ: function(target, index, cnt) {\n\t\t\t\treturn index*3;\n\t\t\t},\n\t\t\trotateX: function(target, index, cnt) {\n\t\t\t\treturn -1*index*4;\n\t\t\t},\n\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\treturn (cnt-index-1)*30\n\t\t\t}\n\t\t});\n\t\t\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tscale: 0.7\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutElastic',\n\t\t\ttranslateY: 20\n\t\t});\n\t\t\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutElastic',\n\t\t\ttranslateY: function(target, index) {\n\t\t\t\treturn index === 0 ? 30 : 20;\n\t\t\t}\n\t\t});\n\t};\n\n\tAltairFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t},\n\t\t\ttranslateZ: 0,\n\t\t\trotateX: 0\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tscale: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right, this.DOM.title],\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateY: 0\n\t\t});\n\t};\n\n\twindow.AltairFx = AltairFx;\n\n\t/************************************************************************\n\t * RigelFx.\n\t ************************************************************************/\n\tfunction RigelFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tRigelFx.prototype = Object.create(StackFx.prototype);\n\tRigelFx.prototype.constructor = RigelFx;\n\n\tRigelFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tRigelFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\ttranslateZ: {\n\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\treturn index*10;\n\t\t\t\t},\n\t\t\t\tduration: 800,\n\t\t\t\teasing: 'easeOutExpo',\n\t\t\t\tdelay: 200\n\t\t\t},\n\t\t\topacity: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index !== cnt - 1 ? [0,0.1*index+0.1] : 1\n\t\t\t\t},\n\t\t\t\tduration: 1,\n\t\t\t\teasing: 'linear',\n\t\t\t\tdelay: 200\n\t\t\t},\n\t\t\ttranslateY: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn -1*index*10;\n\t\t\t\t\t}, \n\t\t\t\t\tduration: 800, \n\t\t\t\t\tdelay: 200, \n\t\t\t\t\telasticity: 300 \n\t\t\t\t},\n\t\t\t],\n\t\t\tscaleY: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: 0.8, \n\t\t\t\t\tduration: 200, \n\t\t\t\t\teasing: 'easeOutExpo' \n\t\t\t\t},\n\t\t\t\t{ \n\t\t\t\t\tvalue: 1, \n\t\t\t\t\tduration: 800, \n\t\t\t\t\telasticity: 300 \n\t\t\t\t}\n\t\t\t],\n\t\t\tscaleX: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: 1.1, \n\t\t\t\t\tduration: 200, \n\t\t\t\t\teasing: 'easeOutExpo' \n\t\t\t\t},\n\t\t\t\t{ \n\t\t\t\t\tvalue: 1, \n\t\t\t\t\tduration: 800, \n\t\t\t\t\telasticity: 300 \n\t\t\t\t}\n\t\t\t]\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 900,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tdelay: 200,\n\t\t\tscale: 0.7\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\ttranslateY: {\n\t\t\t\tvalue: [200,0], \n\t\t\t\tduration: 800, \n\t\t\t\teasing: 'easeOutExpo', \n\t\t\t},\n\t\t\topacity: {\n\t\t\t\tvalue: [0,1], \n\t\t\t\tduration: 400, \n\t\t\t\tdelay: 200,\n\t\t\t\teasing: 'linear'\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\ttranslateY: [\n\t\t\t\t{\n\t\t\t\t\tvalue: [60,0],\n\t\t\t\t\tduration: 800, \n\t\t\t\t\teasing: 'easeOutExpo', \n\t\t\t\t\tdelay: 200\n\t\t\t\t}\n\t\t\t],\n\t\t\topacity: [\n\t\t\t\t{value: [0,0], duration: 1, easing: 'linear'},\n\t\t\t\t{value: 1, delay: 300, duration: 400, easing: 'linear'}\n\t\t\t]\n\t\t});\n\t};\n\n\tRigelFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 800,\n\t\t\teasing: 'easeOutElastic',\n\t\t\ttranslateZ: 0,\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t},\n\t\t\ttranslateY: 0\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 800,\n\t\t\teasing: 'easeOutElastic',\n\t\t\tscale: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\tduration: 800,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateY: 0,\n\t\t\topacity: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 800,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateY: 0,\n\t\t\topacity: 1\n\t\t});\n\t};\n\n\twindow.RigelFx = RigelFx;\n\n\t/************************************************************************\n\t * CanopusFx.\n\t ************************************************************************/\n\tfunction CanopusFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tCanopusFx.prototype = Object.create(StackFx.prototype);\n\tCanopusFx.prototype.constructor = CanopusFx;\n\n\tCanopusFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tCanopusFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tthis.DOM.stackItems.map(function(e, i) {\n\t\t\te.style.opacity = i !== self.totalItems - 1 ? 0 : 1\n\t\t});\n\n\t\tvar self = this;\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\ttranslateZ: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn -1*(cnt-index-1)*20;\n\t\t\t\t},\n\t\t\t\tduration: 800,\n\t\t\t\teasing: 'easeOutExpo',\n\t\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\t\treturn (cnt-index-1)*70 + 200;\n\t\t\t\t}\n\t\t\t},\n\t\t\ttranslateY: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\t\treturn -1*index*20 - 30;\n\t\t\t\t\t}, \n\t\t\t\t\tduration: 800, \n\t\t\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\t\t\treturn (cnt-index-1)*70 + 200;\n\t\t\t\t\t}, \n\t\t\t\t\telasticity: 500 \n\t\t\t\t},\n\t\t\t],\n\t\t\tscaleY: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\t\treturn index === cnt-1 ? 0.6 : 1;\n\t\t\t\t\t}, \n\t\t\t\t\tduration: 200, \n\t\t\t\t\teasing: 'easeOutExpo' \n\t\t\t\t},\n\t\t\t\t{ \n\t\t\t\t\tvalue: 0.8, \n\t\t\t\t\tduration: 800, \n\t\t\t\t\telasticity: 450 \n\t\t\t\t}\n\t\t\t],\n\t\t\tscaleX: [\n\t\t\t\t{ \n\t\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\t\treturn index === cnt-1 ? 1.1 : 1;\n\t\t\t\t\t},\n\t\t\t\t\tduration: 200, \n\t\t\t\t\teasing: 'easeOutExpo' \n\t\t\t\t},\n\t\t\t\t{ \n\t\t\t\t\tvalue: 0.8, \n\t\t\t\t\tduration: 800, \n\t\t\t\t\telasticity: 300 \n\t\t\t\t}\n\t\t\t],\n\t\t\topacity: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index === cnt-1 ? 1 : [0,0.2*index+0.2];\n\t\t\t\t},\n\t\t\t\tduration: 200,\n\t\t\t\teasing: 'linear',\n\t\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\t\treturn (cnt-index-1)*70 + 200;\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tscale: [\n\t\t\t\t{\n\t\t\t\t\tvalue: 1.8,\n\t\t\t\t\tduration: 200,\n\t\t\t\t\teasing: 'easeOutExpo'\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tvalue: 0.7,\n\t\t\t\t\tduration: 1100,\n\t\t\t\t\teasing: 'easeOutExpo'\n\t\t\t\t}\n\t\t\t]\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.title, this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeOutElastic',\n\t\t\ttranslateY: -30,\n\t\t\tdelay: 200\n\t\t});\n\t};\n\n\tCanopusFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateZ: 0,\n\t\t\ttranslateY: 0,\n\t\t\tscaleY: 1,\n\t\t\tscaleX: 1,\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\tscale: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.title, this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 500,\n\t\t\teasing: 'easeOutExpo',\n\t\t\ttranslateY: 0\n\t\t});\n\t};\n\n\twindow.CanopusFx = CanopusFx;\n\n\t/************************************************************************\n\t * PolluxFx.\n\t ************************************************************************/\n\tfunction PolluxFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tPolluxFx.prototype = Object.create(StackFx.prototype);\n\tPolluxFx.prototype.constructor = PolluxFx;\n\n\tPolluxFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tPolluxFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\topacity: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index !== cnt - 1 ? [0,0.1*index+0.1] : 1\n\t\t\t\t},\n\t\t\t\teasing: 'linear',\n\t\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\t\treturn (cnt-index-1)*60;\n\t\t\t\t}\n\t\t\t},\n\t\t\ttranslateY: {\n\t\t\t\tvalue: function(target, index) {\n\t\t\t\t\treturn -1*index*10;\n\t\t\t\t}, \n\t\t\t\teasing: 'easeInOutCubic'\n\t\t\t},\n\t\t\trotateX: {\n\t\t\t\tvalue: 80,\n\t\t\t\teasing: 'easeInOutCubic'\n\t\t\t},\n\t\t\trotateZ: {\n\t\t\t\tvalue: 360,\n\t\t\t\teasing: 'easeInOutCubic',\n\t\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\t\treturn (cnt-index-1)*60;\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeInOutCubic',\n\t\t\tscale: 0.7\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\trotate: [\n\t\t\t\t{\n\t\t\t\t\tvalue: [0,10], \n\t\t\t\t\tduration: 300, \n\t\t\t\t\tdelay: 300,\n\t\t\t\t\teasing: 'easeOutCubic', \n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tvalue: [-20,0], \n\t\t\t\t\tduration: 300, \n\t\t\t\t\teasing: 'easeOutCubic', \n\t\t\t\t}\n\t\t\t],\n\t\t\topacity: [\n\t\t\t\t{\n\t\t\t\t\tvalue: [1,0], \n\t\t\t\t\tduration: 100, \n\t\t\t\t\tdelay: 300,\n\t\t\t\t\teasing: 'easeOutCubic'\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tvalue: [0,1], \n\t\t\t\t\tduration: 100, \n\t\t\t\t\tdelay: 300,\n\t\t\t\t\teasing: 'easeOutCubic'\n\t\t\t\t}\n\t\t\t]\n\t\t});\n\t};\n\n\tPolluxFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\topacity: {\n\t\t\t\tvalue: function(target, index, cnt) {\n\t\t\t\t\treturn index !== cnt - 1 ? 0 : 1\n\t\t\t\t},\n\t\t\t\teasing: 'linear',\n\t\t\t\tdelay: function(target, index) {\n\t\t\t\t\treturn index*60;\n\t\t\t\t},\n\t\t\t},\n\t\t\ttranslateY: {\n\t\t\t\tvalue: 0, \n\t\t\t\teasing: 'easeInOutCubic'\n\t\t\t},\n\t\t\trotateX: {\n\t\t\t\tvalue: 0,\n\t\t\t\teasing: 'easeInOutCubic'\n\t\t\t},\n\t\t\trotateZ: {\n\t\t\t\tvalue: 0,\n\t\t\t\teasing: 'easeInOutCubic',\n\t\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\t\treturn (cnt-index-1)*60;\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeInOutCubic',\n\t\t\tscale: 1\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.title,\n\t\t\tduration: 1000,\n\t\t\teasing: 'easeInOutCubic',\n\t\t\trotate: 0,\n\t\t\topacity: 1\n\t\t});\n\t};\n\n\twindow.PolluxFx = PolluxFx;\n\n\t/************************************************************************\n\t * DenebFx.\n\t ************************************************************************/\n\tfunction DenebFx(el) {\n\t\tStackFx.call(this, el);\n\t\tthis._initEvents();\n\t}\n\n\tDenebFx.prototype = Object.create(StackFx.prototype);\n\tDenebFx.prototype.constructor = DenebFx;\n\n\tDenebFx.prototype._initEvents = function() {\n\t\tvar self = this;\n\t\tthis._mouseenterFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._in();\n\t\t};\n\t\tthis._mouseleaveFn = function() {\n\t\t\tself._removeAnimeTargets();\n\t\t\tself._out();\n\t\t};\n\t\tthis.DOM.stack.addEventListener('mouseenter', this._mouseenterFn);\n\t\tthis.DOM.stack.addEventListener('mouseleave', this._mouseleaveFn);\n\t};\n\n\tDenebFx.prototype._in = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\trotate: 360,\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? [0,0.1*index+0.1] : 1\n\t\t\t},\n\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\treturn (cnt-index-1)*30;\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1100,\n\t\t\tdelay: 20,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\tscale: 0.7,\n\t\t\trotate: 360\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 650,\n\t\t\tdelay: 400,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\trotate: [-20,0],\n\t\t\topacity: 1\n\t\t});\n\t};\n\n\tDenebFx.prototype._out = function() {\n\t\tvar self = this;\n\n\t\tanime({\n\t\t\ttargets: this.DOM.stackItems,\n\t\t\tduration: 1000,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\trotate: 0,\n\t\t\topacity: function(target, index, cnt) {\n\t\t\t\treturn index !== cnt - 1 ? [0,0.1*index+0.1] : 1\n\t\t\t},\n\t\t\tdelay: function(target, index, cnt) {\n\t\t\t\treturn (cnt-index-1)*30;\n\t\t\t}\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: this.DOM.img,\n\t\t\tduration: 1750,\n\t\t\teasing: [0.2,1,0.3,1],\n\t\t\tscale: 1,\n\t\t\trotate: 0\n\t\t});\n\n\t\tanime({\n\t\t\ttargets: [this.DOM.columns.left, this.DOM.columns.right],\n\t\t\tduration: 400,\n\t\t\teasing: 'easeInCubic',\n\t\t\trotate: [0,-10],\n\t\t\topacity: 0\n\t\t});\n\t};\n\n\twindow.DenebFx = DenebFx;\n\n})(window);"
  }
]