/* . ======================================= Author           email            Created         2015-03-09 16:32:15 Description     . Edited by        Edited          2016-01-12 14:43:39
*/
@import url(https://fonts.googleapis.com/css?family=Paytone+One|Lato);
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/** 1. Set default font family to sans-serif. 2. Prevent iOS and IE text size adjust after device orientation change, without disabling user zoom. */
html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }

/** Remove default margin. */
body { margin: 0; }

/* HTML5 display definitions ========================================================================== */
/** Correct `block` display not defined for any HTML5 element in IE 8/9. Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. Correct `block` display not defined for `main` in IE 11. */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

/** 1. Correct `inline-block` display not defined in IE 8/9. 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */
audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ }

/** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }

/** Address `[hidden]` styling not present in IE 8/9/10. Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22. */
[hidden], template { display: none; }

/* Links ========================================================================== */
/** Remove the gray background color from active links in IE 10. */
a { background-color: transparent; }

/** Improve readability of focused elements when they are also in an active/hover state. */
a:active, a:hover { outline: 0; }

/* Text-level semantics ========================================================================== */
/** Address styling not present in IE 8/9/10/11, Safari, and Chrome. */
abbr[title] { border-bottom: 1px dotted; }

/** Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */
b, strong { font-weight: bold; }

/** Address styling not present in Safari and Chrome. */
dfn { font-style: italic; }

/** Address variable `h1` font-size and margin within `section` and `article` contexts in Firefox 4+, Safari, and Chrome. */
h1 { font-size: 2em; margin: 0.67em 0; }

/** Address styling not present in IE 8/9. */
mark { background: #ff0; color: #000; }

/** Address inconsistent and variable font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* Embedded content ========================================================================== */
/** Remove border when inside `a` element in IE 8/9/10. */
img { border: 0; }

/** Correct overflow not hidden in IE 9/10/11. */
svg:not(:root) { overflow: hidden; }

/* Grouping content ========================================================================== */
/** Address margin not present in IE 8/9 and Safari. */
figure { margin: 1em 40px; }

/** Address differences between Firefox and other browsers. */
hr { box-sizing: content-box; height: 0; }

/** Contain overflow in all browsers. */
pre { overflow: auto; }

/** Address odd `em`-unit font size rendering in all browsers. */
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

/* Forms ========================================================================== */
/** Known limitation: by default, Chrome and Safari on OS X allow very limited styling of `select`, unless a `border` property is set. */
/** 1. Correct color not being inherited. Known issue: affects color of disabled elements. 2. Correct font properties not being inherited. 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */
button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ }

/** Address `overflow` set to `hidden` in IE 8/9/10/11. */
button { overflow: visible; }

/** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. Correct `select` style inheritance in Firefox. */
button, select { text-transform: none; }

/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. */
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ }

/** Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/** Remove inner padding and border in Firefox 4+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */
input { line-height: normal; }

/** It's recommended that you don't attempt to style these elements. Firefox's implementation doesn't respect box-sizing, padding, or width.  1. Address box sizing set to `content-box` in IE 8/9/10. 2. Remove excess padding in IE 8/9/10. */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** Fix the cursor style for Chrome's increment/decrement buttons. For certain `font-size` values of the `input`, it causes the cursor style of the decrement button to change from `default` to `text`. */
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Address `appearance` set to `searchfield` in Safari and Chrome. 2. Address `box-sizing` set to `border-box` in Safari and Chrome. */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ box-sizing: content-box; /* 2 */ }

/** Remove inner padding and search cancel button in Safari and Chrome on OS X. Safari (but not Chrome) clips the cancel button when the search input has padding (and `textfield` appearance). */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Define consistent border, margin, and padding. */
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

/** 1. Correct `color` not being inherited in IE 8/9/10/11. 2. Remove padding so people aren't caught out if they zero out fieldsets. */
legend { border: 0; /* 1 */ padding: 0; /* 2 */ }

/** Remove default vertical scrollbar in IE 8/9/10/11. */
textarea { overflow: auto; }

/** Don't inherit the `font-weight` (applied by a rule above). NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */
optgroup { font-weight: bold; }

/* Tables ========================================================================== */
/** Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; }

td, th { padding: 0; }

/* Text mixins ======================================= Author           email            Created         2014-11-03 16:27:08 Description     . Edited by        Edited          2015-01-20 10:09:53
*/
/* Various image mixins ======================================= Author           email            Created         2014-11-03 17:06:00 Description     . Edited by        Edited          2015-03-09 17:17:17
*/
/* Transition mixins ======================================= Author           email            Created         2014-11-04 09:07:18 Description     . Edited by        Edited          2015-12-21 13:22:26
*/
@-moz-keyframes VideoTopVideoLeft { 0% { opacity: 0; -moz-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -moz-transform: translateX(0); transform: translateX(0); } }
@-webkit-keyframes VideoTopVideoLeft { 0% { opacity: 0; -webkit-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } }
@keyframes VideoTopVideoLeft { 0% { opacity: 0; -moz-transform: translateX(-200px); -ms-transform: translateX(-200px); -webkit-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -moz-transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } }
@-moz-keyframes VideoTopVideoRight { 0% { opacity: 0; -moz-transform: translateX(200px); transform: translateX(200px); }
  100% { opacity: 1; -moz-transform: translateX(0); transform: translateX(0); } }
@-webkit-keyframes VideoTopVideoRight { 0% { opacity: 0; -webkit-transform: translateX(200px); transform: translateX(200px); }
  100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } }
@keyframes VideoTopVideoRight { 0% { opacity: 0; -moz-transform: translateX(200px); -ms-transform: translateX(200px); -webkit-transform: translateX(200px); transform: translateX(200px); }
  100% { opacity: 1; -moz-transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } }
@-moz-keyframes VideoTopTxt { 0% { opacity: 0; -moz-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); }
  100% { opacity: 1; -moz-transform: none; transform: none; } }
@-webkit-keyframes VideoTopTxt { 0% { opacity: 0; -webkit-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); }
  100% { opacity: 1; -webkit-transform: none; transform: none; } }
@keyframes VideoTopTxt { 0% { opacity: 0; -moz-transform: translate(0, 0) scale(0); -ms-transform: translate(0, 0) scale(0); -webkit-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); }
  100% { opacity: 1; -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; } }
@-moz-keyframes BattleCardTopImage { 0% { -moz-transform-origin: 50% 50%; transform-origin: 50% 50%; -moz-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); }
  100% { -moz-transform: none; transform: none; } }
@-webkit-keyframes BattleCardTopImage { 0% { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); }
  100% { -webkit-transform: none; transform: none; } }
@keyframes BattleCardTopImage { 0% { -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -moz-transform: translate(0, 0) scale(0); -ms-transform: translate(0, 0) scale(0); -webkit-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); }
  100% { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; } }
@-moz-keyframes BattleCardTopTxt { 0% { opacity: 0; -moz-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -moz-transform: translateX(0); transform: translateX(0); } }
@-webkit-keyframes BattleCardTopTxt { 0% { opacity: 0; -webkit-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } }
@keyframes BattleCardTopTxt { 0% { opacity: 0; -moz-transform: translateX(-200px); -ms-transform: translateX(-200px); -webkit-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -moz-transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } }
@-moz-keyframes BattleTopImage { 0% { -moz-transform-origin: 100% 40%; transform-origin: 100% 40%; -moz-transform: translate(200px, 150px) scale(0); transform: translate(200px, 150px) scale(0); }
  100% { -moz-transform: none; transform: none; } }
@-webkit-keyframes BattleTopImage { 0% { -webkit-transform-origin: 100% 40%; transform-origin: 100% 40%; -webkit-transform: translate(200px, 150px) scale(0); transform: translate(200px, 150px) scale(0); }
  100% { -webkit-transform: none; transform: none; } }
@keyframes BattleTopImage { 0% { -moz-transform-origin: 100% 40%; -ms-transform-origin: 100% 40%; -webkit-transform-origin: 100% 40%; transform-origin: 100% 40%; -moz-transform: translate(200px, 150px) scale(0); -ms-transform: translate(200px, 150px) scale(0); -webkit-transform: translate(200px, 150px) scale(0); transform: translate(200px, 150px) scale(0); }
  100% { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; } }
@-moz-keyframes BattleTopTxt { 0% { opacity: 0; -moz-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -moz-transform: translateX(0); transform: translateX(0); } }
@-webkit-keyframes BattleTopTxt { 0% { opacity: 0; -webkit-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } }
@keyframes BattleTopTxt { 0% { opacity: 0; -moz-transform: translateX(-200px); -ms-transform: translateX(-200px); -webkit-transform: translateX(-200px); transform: translateX(-200px); }
  100% { opacity: 1; -moz-transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } }
@-moz-keyframes homeTrailer { 50% { -moz-transform: translateY(-200px); transform: translateY(-200px); }
  51% { position: relative; z-index: 2; }
  100% { -moz-transform: translateY(0); transform: translateY(0); position: relative; z-index: 4; } }
@-webkit-keyframes homeTrailer { 50% { -webkit-transform: translateY(-200px); transform: translateY(-200px); }
  51% { position: relative; z-index: 2; }
  100% { -webkit-transform: translateY(0); transform: translateY(0); position: relative; z-index: 4; } }
@keyframes homeTrailer { 50% { -moz-transform: translateY(-200px); -ms-transform: translateY(-200px); -webkit-transform: translateY(-200px); transform: translateY(-200px); }
  51% { position: relative; z-index: 2; }
  100% { -moz-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); position: relative; z-index: 4; } }
@-moz-keyframes dropin { 0% { -moz-transform: translateY(-120%); transform: translateY(-120%); }
  100% { -moz-transform: translateY(0); transform: translateY(0); } }
@-webkit-keyframes dropin { 0% { -webkit-transform: translateY(-120%); transform: translateY(-120%); }
  100% { -webkit-transform: translateY(0); transform: translateY(0); } }
@keyframes dropin { 0% { -moz-transform: translateY(-120%); -ms-transform: translateY(-120%); -webkit-transform: translateY(-120%); transform: translateY(-120%); }
  100% { -moz-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } }
@-moz-keyframes hover { 0% { -moz-transform: translateY(-40px); transform: translateY(-40px); }
  50% { -moz-transform: translateY(0px); transform: translateY(0px); }
  100% { -moz-transform: translateY(-40px); transform: translateY(-40px); } }
@-webkit-keyframes hover { 0% { -webkit-transform: translateY(-40px); transform: translateY(-40px); }
  50% { -webkit-transform: translateY(0px); transform: translateY(0px); }
  100% { -webkit-transform: translateY(-40px); transform: translateY(-40px); } }
@keyframes hover { 0% { -moz-transform: translateY(-40px); -ms-transform: translateY(-40px); -webkit-transform: translateY(-40px); transform: translateY(-40px); }
  50% { -moz-transform: translateY(0px); -ms-transform: translateY(0px); -webkit-transform: translateY(0px); transform: translateY(0px); }
  100% { -moz-transform: translateY(-40px); -ms-transform: translateY(-40px); -webkit-transform: translateY(-40px); transform: translateY(-40px); } }
@-moz-keyframes rotate6 { 0% { -moz-transform: rotate(-3deg); transform: rotate(-3deg); }
  50% { -moz-transform: rotate(3deg); transform: rotate(3deg); }
  100% { -moz-transform: rotate(-3deg); transform: rotate(-3deg); } }
@-webkit-keyframes rotate6 { 0% { -webkit-transform: rotate(-3deg); transform: rotate(-3deg); }
  50% { -webkit-transform: rotate(3deg); transform: rotate(3deg); }
  100% { -webkit-transform: rotate(-3deg); transform: rotate(-3deg); } }
@keyframes rotate6 { 0% { -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); transform: rotate(-3deg); }
  50% { -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -webkit-transform: rotate(3deg); transform: rotate(3deg); }
  100% { -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); transform: rotate(-3deg); } }
@-moz-keyframes rubberband { 0% { -moz-transform: scale(1); transform: scale(1); }
  30% { -moz-transform: scaleX(1.125) scaleY(0.83333); transform: scaleX(1.125) scaleY(0.83333); }
  40% { -moz-transform: scaleX(0.83333) scaleY(1.125); transform: scaleX(0.83333) scaleY(1.125); }
  60% { -moz-transform: scaleX(1.035) scaleY(0.94444); transform: scaleX(1.035) scaleY(0.94444); }
  100% { -moz-transform: scale(1); transform: scale(1); } }
@-webkit-keyframes rubberband { 0% { -webkit-transform: scale(1); transform: scale(1); }
  30% { -webkit-transform: scaleX(1.125) scaleY(0.83333); transform: scaleX(1.125) scaleY(0.83333); }
  40% { -webkit-transform: scaleX(0.83333) scaleY(1.125); transform: scaleX(0.83333) scaleY(1.125); }
  60% { -webkit-transform: scaleX(1.035) scaleY(0.94444); transform: scaleX(1.035) scaleY(0.94444); }
  100% { -webkit-transform: scale(1); transform: scale(1); } }
@keyframes rubberband { 0% { -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
  30% { -moz-transform: scaleX(1.125) scaleY(0.83333); -ms-transform: scaleX(1.125) scaleY(0.83333); -webkit-transform: scaleX(1.125) scaleY(0.83333); transform: scaleX(1.125) scaleY(0.83333); }
  40% { -moz-transform: scaleX(0.83333) scaleY(1.125); -ms-transform: scaleX(0.83333) scaleY(1.125); -webkit-transform: scaleX(0.83333) scaleY(1.125); transform: scaleX(0.83333) scaleY(1.125); }
  60% { -moz-transform: scaleX(1.035) scaleY(0.94444); -ms-transform: scaleX(1.035) scaleY(0.94444); -webkit-transform: scaleX(1.035) scaleY(0.94444); transform: scaleX(1.035) scaleY(0.94444); }
  100% { -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); } }
@-moz-keyframes wobble { 0% { -moz-transform: translateX(0%); transform: translateX(0%); }
  15% { -moz-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); }
  30% { -moz-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); }
  45% { -moz-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); }
  60% { -moz-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); }
  75% { -moz-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); }
  100% { -moz-transform: translateX(0%); transform: translateX(0%); } }
@-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); }
  15% { -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); }
  30% { -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); }
  45% { -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); }
  60% { -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); }
  75% { -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); }
  100% { -webkit-transform: translateX(0%); transform: translateX(0%); } }
@keyframes wobble { 0% { -moz-transform: translateX(0%); -ms-transform: translateX(0%); -webkit-transform: translateX(0%); transform: translateX(0%); }
  15% { -moz-transform: translateX(-25%) rotate(-5deg); -ms-transform: translateX(-25%) rotate(-5deg); -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); }
  30% { -moz-transform: translateX(20%) rotate(3deg); -ms-transform: translateX(20%) rotate(3deg); -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); }
  45% { -moz-transform: translateX(-15%) rotate(-3deg); -ms-transform: translateX(-15%) rotate(-3deg); -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); }
  60% { -moz-transform: translateX(10%) rotate(2deg); -ms-transform: translateX(10%) rotate(2deg); -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); }
  75% { -moz-transform: translateX(-5%) rotate(-1deg); -ms-transform: translateX(-5%) rotate(-1deg); -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); }
  100% { -moz-transform: translateX(0%); -ms-transform: translateX(0%); -webkit-transform: translateX(0%); transform: translateX(0%); } }
@-moz-keyframes rubberbandCharacter { 0% { -moz-transform: scale(1, 1); transform: scale(1, 1); }
  100% { -moz-transform: scale(1.25, 1.25); transform: scale(1.25, 1.25); } }
@-webkit-keyframes rubberbandCharacter { 0% { -webkit-transform: scale(1, 1); transform: scale(1, 1); }
  100% { -webkit-transform: scale(1.25, 1.25); transform: scale(1.25, 1.25); } }
@keyframes rubberbandCharacter { 0% { -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); transform: scale(1, 1); }
  100% { -moz-transform: scale(1.25, 1.25); -ms-transform: scale(1.25, 1.25); -webkit-transform: scale(1.25, 1.25); transform: scale(1.25, 1.25); } }
@-moz-keyframes chracterHover { 0% { -moz-transform: translate(0px, -40px) rotate(-3deg); transform: translate(0px, -40px) rotate(-3deg); }
  20% { -moz-transform: translate(5px, -30px) rotate(0deg); transform: translate(5px, -30px) rotate(0deg); }
  40% { -moz-transform: translate(-5px, -30px) rotate(3deg); transform: translate(-5px, -30px) rotate(3deg); }
  50% { -moz-transform: translate(-5px, -20px) rotate(0deg); transform: translate(-5px, -20px) rotate(0deg); }
  60% { -moz-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  60% { -moz-transform: translate(-4px, 10px) rotate(-2deg); transform: translate(-4px, 10px) rotate(-2deg); }
  70% { -moz-transform: translate(-4px, 13px) rotate(2deg); transform: translate(-4px, 13px) rotate(2deg); }
  80% { -moz-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  90% { -moz-transform: translate(5px, 0px) rotate(-3deg); transform: translate(5px, 0px) rotate(-3deg); }
  100% { -moz-transform: translate(-2px, -15px) rotate(0deg); transform: translate(-2px, -15px) rotate(0deg); } }
@-webkit-keyframes chracterHover { 0% { -webkit-transform: translate(0px, -40px) rotate(-3deg); transform: translate(0px, -40px) rotate(-3deg); }
  20% { -webkit-transform: translate(5px, -30px) rotate(0deg); transform: translate(5px, -30px) rotate(0deg); }
  40% { -webkit-transform: translate(-5px, -30px) rotate(3deg); transform: translate(-5px, -30px) rotate(3deg); }
  50% { -webkit-transform: translate(-5px, -20px) rotate(0deg); transform: translate(-5px, -20px) rotate(0deg); }
  60% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  60% { -webkit-transform: translate(-4px, 10px) rotate(-2deg); transform: translate(-4px, 10px) rotate(-2deg); }
  70% { -webkit-transform: translate(-4px, 13px) rotate(2deg); transform: translate(-4px, 13px) rotate(2deg); }
  80% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  90% { -webkit-transform: translate(5px, 0px) rotate(-3deg); transform: translate(5px, 0px) rotate(-3deg); }
  100% { -webkit-transform: translate(-2px, -15px) rotate(0deg); transform: translate(-2px, -15px) rotate(0deg); } }
@keyframes chracterHover { 0% { -moz-transform: translate(0px, -40px) rotate(-3deg); -ms-transform: translate(0px, -40px) rotate(-3deg); -webkit-transform: translate(0px, -40px) rotate(-3deg); transform: translate(0px, -40px) rotate(-3deg); }
  20% { -moz-transform: translate(5px, -30px) rotate(0deg); -ms-transform: translate(5px, -30px) rotate(0deg); -webkit-transform: translate(5px, -30px) rotate(0deg); transform: translate(5px, -30px) rotate(0deg); }
  40% { -moz-transform: translate(-5px, -30px) rotate(3deg); -ms-transform: translate(-5px, -30px) rotate(3deg); -webkit-transform: translate(-5px, -30px) rotate(3deg); transform: translate(-5px, -30px) rotate(3deg); }
  50% { -moz-transform: translate(-5px, -20px) rotate(0deg); -ms-transform: translate(-5px, -20px) rotate(0deg); -webkit-transform: translate(-5px, -20px) rotate(0deg); transform: translate(-5px, -20px) rotate(0deg); }
  60% { -moz-transform: translate(0px, 0px) rotate(0deg); -ms-transform: translate(0px, 0px) rotate(0deg); -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  60% { -moz-transform: translate(-4px, 10px) rotate(-2deg); -ms-transform: translate(-4px, 10px) rotate(-2deg); -webkit-transform: translate(-4px, 10px) rotate(-2deg); transform: translate(-4px, 10px) rotate(-2deg); }
  70% { -moz-transform: translate(-4px, 13px) rotate(2deg); -ms-transform: translate(-4px, 13px) rotate(2deg); -webkit-transform: translate(-4px, 13px) rotate(2deg); transform: translate(-4px, 13px) rotate(2deg); }
  80% { -moz-transform: translate(0px, 0px) rotate(0deg); -ms-transform: translate(0px, 0px) rotate(0deg); -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  90% { -moz-transform: translate(5px, 0px) rotate(-3deg); -ms-transform: translate(5px, 0px) rotate(-3deg); -webkit-transform: translate(5px, 0px) rotate(-3deg); transform: translate(5px, 0px) rotate(-3deg); }
  100% { -moz-transform: translate(-2px, -15px) rotate(0deg); -ms-transform: translate(-2px, -15px) rotate(0deg); -webkit-transform: translate(-2px, -15px) rotate(0deg); transform: translate(-2px, -15px) rotate(0deg); } }
@-moz-keyframes chracterHoverHome { 0% { -moz-transform: translate(0px, -40px) rotate(-3deg); transform: translate(0px, -40px) rotate(-3deg); }
  20% { -moz-transform: translate(5px, -30px) rotate(0deg); transform: translate(5px, -30px) rotate(0deg); }
  40% { -moz-transform: translate(-5px, -20px) rotate(3deg); transform: translate(-5px, -20px) rotate(3deg); }
  50% { -moz-transform: translate(-5px, -10px) rotate(0deg); transform: translate(-5px, -10px) rotate(0deg); }
  60% { -moz-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  60% { -moz-transform: translate(-4px, 10px) rotate(-2deg); transform: translate(-4px, 10px) rotate(-2deg); }
  70% { -moz-transform: translate(-4px, 0px) rotate(2deg); transform: translate(-4px, 0px) rotate(2deg); }
  80% { -moz-transform: translate(0px, -10px) rotate(0deg); transform: translate(0px, -10px) rotate(0deg); }
  90% { -moz-transform: translate(5px, -25px) rotate(-3deg); transform: translate(5px, -25px) rotate(-3deg); }
  100% { -moz-transform: translate(-2px, -30px) rotate(0deg); transform: translate(-2px, -30px) rotate(0deg); } }
@-webkit-keyframes chracterHoverHome { 0% { -webkit-transform: translate(0px, -40px) rotate(-3deg); transform: translate(0px, -40px) rotate(-3deg); }
  20% { -webkit-transform: translate(5px, -30px) rotate(0deg); transform: translate(5px, -30px) rotate(0deg); }
  40% { -webkit-transform: translate(-5px, -20px) rotate(3deg); transform: translate(-5px, -20px) rotate(3deg); }
  50% { -webkit-transform: translate(-5px, -10px) rotate(0deg); transform: translate(-5px, -10px) rotate(0deg); }
  60% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  60% { -webkit-transform: translate(-4px, 10px) rotate(-2deg); transform: translate(-4px, 10px) rotate(-2deg); }
  70% { -webkit-transform: translate(-4px, 0px) rotate(2deg); transform: translate(-4px, 0px) rotate(2deg); }
  80% { -webkit-transform: translate(0px, -10px) rotate(0deg); transform: translate(0px, -10px) rotate(0deg); }
  90% { -webkit-transform: translate(5px, -25px) rotate(-3deg); transform: translate(5px, -25px) rotate(-3deg); }
  100% { -webkit-transform: translate(-2px, -30px) rotate(0deg); transform: translate(-2px, -30px) rotate(0deg); } }
@keyframes chracterHoverHome { 0% { -moz-transform: translate(0px, -40px) rotate(-3deg); -ms-transform: translate(0px, -40px) rotate(-3deg); -webkit-transform: translate(0px, -40px) rotate(-3deg); transform: translate(0px, -40px) rotate(-3deg); }
  20% { -moz-transform: translate(5px, -30px) rotate(0deg); -ms-transform: translate(5px, -30px) rotate(0deg); -webkit-transform: translate(5px, -30px) rotate(0deg); transform: translate(5px, -30px) rotate(0deg); }
  40% { -moz-transform: translate(-5px, -20px) rotate(3deg); -ms-transform: translate(-5px, -20px) rotate(3deg); -webkit-transform: translate(-5px, -20px) rotate(3deg); transform: translate(-5px, -20px) rotate(3deg); }
  50% { -moz-transform: translate(-5px, -10px) rotate(0deg); -ms-transform: translate(-5px, -10px) rotate(0deg); -webkit-transform: translate(-5px, -10px) rotate(0deg); transform: translate(-5px, -10px) rotate(0deg); }
  60% { -moz-transform: translate(0px, 0px) rotate(0deg); -ms-transform: translate(0px, 0px) rotate(0deg); -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  60% { -moz-transform: translate(-4px, 10px) rotate(-2deg); -ms-transform: translate(-4px, 10px) rotate(-2deg); -webkit-transform: translate(-4px, 10px) rotate(-2deg); transform: translate(-4px, 10px) rotate(-2deg); }
  70% { -moz-transform: translate(-4px, 0px) rotate(2deg); -ms-transform: translate(-4px, 0px) rotate(2deg); -webkit-transform: translate(-4px, 0px) rotate(2deg); transform: translate(-4px, 0px) rotate(2deg); }
  80% { -moz-transform: translate(0px, -10px) rotate(0deg); -ms-transform: translate(0px, -10px) rotate(0deg); -webkit-transform: translate(0px, -10px) rotate(0deg); transform: translate(0px, -10px) rotate(0deg); }
  90% { -moz-transform: translate(5px, -25px) rotate(-3deg); -ms-transform: translate(5px, -25px) rotate(-3deg); -webkit-transform: translate(5px, -25px) rotate(-3deg); transform: translate(5px, -25px) rotate(-3deg); }
  100% { -moz-transform: translate(-2px, -30px) rotate(0deg); -ms-transform: translate(-2px, -30px) rotate(0deg); -webkit-transform: translate(-2px, -30px) rotate(0deg); transform: translate(-2px, -30px) rotate(0deg); } }
@-moz-keyframes chracterHoverEllineHome { 0% { -moz-transform: translate(0px, -20px) rotate(-3deg); transform: translate(0px, -20px) rotate(-3deg); }
  20% { -moz-transform: translate(5px, -10px) rotate(0deg); transform: translate(5px, -10px) rotate(0deg); }
  40% { -moz-transform: translate(-5px, -5px) rotate(3deg); transform: translate(-5px, -5px) rotate(3deg); }
  60% { -moz-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  70% { -moz-transform: translate(-4px, 5px) rotate(-2deg); transform: translate(-4px, 5px) rotate(-2deg); }
  80% { -moz-transform: translate(-4px, 0px) rotate(2deg); transform: translate(-4px, 0px) rotate(2deg); }
  90% { -moz-transform: translate(0px, -10px) rotate(0deg); transform: translate(0px, -10px) rotate(0deg); }
  100% { -moz-transform: translate(5px, -20px) rotate(-3deg); transform: translate(5px, -20px) rotate(-3deg); } }
@-webkit-keyframes chracterHoverEllineHome { 0% { -webkit-transform: translate(0px, -20px) rotate(-3deg); transform: translate(0px, -20px) rotate(-3deg); }
  20% { -webkit-transform: translate(5px, -10px) rotate(0deg); transform: translate(5px, -10px) rotate(0deg); }
  40% { -webkit-transform: translate(-5px, -5px) rotate(3deg); transform: translate(-5px, -5px) rotate(3deg); }
  60% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  70% { -webkit-transform: translate(-4px, 5px) rotate(-2deg); transform: translate(-4px, 5px) rotate(-2deg); }
  80% { -webkit-transform: translate(-4px, 0px) rotate(2deg); transform: translate(-4px, 0px) rotate(2deg); }
  90% { -webkit-transform: translate(0px, -10px) rotate(0deg); transform: translate(0px, -10px) rotate(0deg); }
  100% { -webkit-transform: translate(5px, -20px) rotate(-3deg); transform: translate(5px, -20px) rotate(-3deg); } }
@keyframes chracterHoverEllineHome { 0% { -moz-transform: translate(0px, -20px) rotate(-3deg); -ms-transform: translate(0px, -20px) rotate(-3deg); -webkit-transform: translate(0px, -20px) rotate(-3deg); transform: translate(0px, -20px) rotate(-3deg); }
  20% { -moz-transform: translate(5px, -10px) rotate(0deg); -ms-transform: translate(5px, -10px) rotate(0deg); -webkit-transform: translate(5px, -10px) rotate(0deg); transform: translate(5px, -10px) rotate(0deg); }
  40% { -moz-transform: translate(-5px, -5px) rotate(3deg); -ms-transform: translate(-5px, -5px) rotate(3deg); -webkit-transform: translate(-5px, -5px) rotate(3deg); transform: translate(-5px, -5px) rotate(3deg); }
  60% { -moz-transform: translate(0px, 0px) rotate(0deg); -ms-transform: translate(0px, 0px) rotate(0deg); -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
  70% { -moz-transform: translate(-4px, 5px) rotate(-2deg); -ms-transform: translate(-4px, 5px) rotate(-2deg); -webkit-transform: translate(-4px, 5px) rotate(-2deg); transform: translate(-4px, 5px) rotate(-2deg); }
  80% { -moz-transform: translate(-4px, 0px) rotate(2deg); -ms-transform: translate(-4px, 0px) rotate(2deg); -webkit-transform: translate(-4px, 0px) rotate(2deg); transform: translate(-4px, 0px) rotate(2deg); }
  90% { -moz-transform: translate(0px, -10px) rotate(0deg); -ms-transform: translate(0px, -10px) rotate(0deg); -webkit-transform: translate(0px, -10px) rotate(0deg); transform: translate(0px, -10px) rotate(0deg); }
  100% { -moz-transform: translate(5px, -20px) rotate(-3deg); -ms-transform: translate(5px, -20px) rotate(-3deg); -webkit-transform: translate(5px, -20px) rotate(-3deg); transform: translate(5px, -20px) rotate(-3deg); } }
@-moz-keyframes brontoHover { 100% { -moz-transform: translateY(20px) rotate(-10deg); transform: translateY(20px) rotate(-10deg); } }
@-webkit-keyframes brontoHover { 100% { -webkit-transform: translateY(20px) rotate(-10deg); transform: translateY(20px) rotate(-10deg); } }
@keyframes brontoHover { 100% { -moz-transform: translateY(20px) rotate(-10deg); -ms-transform: translateY(20px) rotate(-10deg); -webkit-transform: translateY(20px) rotate(-10deg); transform: translateY(20px) rotate(-10deg); } }
@-moz-keyframes ropeSparkle { 0% { -moz-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 0.9; }
  50% { -moz-transform: scale(1, 1); transform: scale(1, 1); opacity: 1; }
  100% { -moz-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 0.9; } }
@-webkit-keyframes ropeSparkle { 0% { -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 0.9; }
  50% { -webkit-transform: scale(1, 1); transform: scale(1, 1); opacity: 1; }
  100% { -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 0.9; } }
@keyframes ropeSparkle { 0% { -moz-transform: scale(0.8, 0.8); -ms-transform: scale(0.8, 0.8); -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 0.9; }
  50% { -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); transform: scale(1, 1); opacity: 1; }
  100% { -moz-transform: scale(0.8, 0.8); -ms-transform: scale(0.8, 0.8); -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); opacity: 0.9; } }
/*   Flex helpters ======================================= Author           email            Created         2015-10-23 15:02:04 Description     . Edited by        Edited          2015-10-23 15:02:32
*/
/* . ======================================= Author           email            Created         2015-10-23 15:03:15 Description     . Edited by        Edited          2015-11-02 16:38:51
*/
/*   . ======================================= Author           email            Created         2015-11-02 14:47:22 Description     . Edited by        Edited          2015-11-02 16:37:19
*/
/* Flex grid system settings ======================================= Author           email            Created         2015-11-02 14:44:25 Description     . Edited by        Edited          2015-11-02 14:48:52
*/
/* Responsive settings ======================================= Author           email            Created         2015-11-02 14:42:06 Description     . Edited by        Edited          2015-11-02 14:43:43
*/
/* Variables. Nothing should appear in the CSS for this file ======================================= Author           email            Created         2014-11-03 15:18:16 Description     . Edited by        Edited          2015-12-17 13:33:33
*/
/*   . ======================================= Author           email            Created         2015-03-09 16:38:44 Description     . Edited by        Edited          2015-03-09 17:16:07
*/
/*   Basic link styles ======================================= Author           email            Created         2014-11-03 16:14:07 Description     . Edited by        Edited          2015-03-09 17:01:39
*/
/* Button styles ======================================= Author           email            Created         2014-11-03 16:14:14 Description     . Edited by        Edited          2016-01-14 10:02:08
*/
button.button { -moz-appearance: none; -webkit-appearance: none; background: none; border: none; }
button.button:active, button.button:focus { outline: none; }

.button { font-family: 'Paytone One', sans-serif; line-height: 1.05em; color: black; display: inline-block; text-decoration: none; font-size: 1.1em; overflow: hidden; padding: 5px; line-height: 1em; }
.button > span { text-shadow: 0px 1px rgba(255, 255, 255, 0.4); background-color: #28a6ee; display: block; border: solid 4px white; box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.6); padding: 12px 30px 14px; }
.button.button-yellow > span { background-color: #fbe53e; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZiZTY0MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Y1YzIwMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbe641), color-stop(100%, #f5c200)); background-image: -moz-linear-gradient(top, #fbe641 0%, #f5c200 100%); background-image: -webkit-linear-gradient(top, #fbe641 0%, #f5c200 100%); background-image: linear-gradient(to bottom, #fbe641 0%, #f5c200 100%); }
.button.button-green > span { background-color: #94d615; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk1ZDYxOCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzgzY2YwMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #95d618), color-stop(100%, #83cf00)); background-image: -moz-linear-gradient(top, #95d618 0%, #83cf00 100%); background-image: -webkit-linear-gradient(top, #95d618 0%, #83cf00 100%); background-image: linear-gradient(to bottom, #95d618 0%, #83cf00 100%); }
.button.button-orange > span { background-color: #ff8e00; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmOGUwMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmN2IwMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ff8e00), color-stop(100%, #ff7b00)); background-image: -moz-linear-gradient(top, #ff8e00 0%, #ff7b00 100%); background-image: -webkit-linear-gradient(top, #ff8e00 0%, #ff7b00 100%); background-image: linear-gradient(to bottom, #ff8e00 0%, #ff7b00 100%); }
.button.button-orange-red > span { background-color: #F76833; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y3NjgzMyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Y2NTAxNCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f76833), color-stop(100%, #f65014)); background-image: -moz-linear-gradient(top, #f76833 0%, #f65014 100%); background-image: -webkit-linear-gradient(top, #f76833 0%, #f65014 100%); background-image: linear-gradient(to bottom, #f76833 0%, #f65014 100%); }
.button.button-purple > span { background-color: #dc7aff; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RjN2JmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2QzNWNmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dc7bff), color-stop(100%, #d35cff)); background-image: -moz-linear-gradient(top, #dc7bff 0%, #d35cff 100%); background-image: -webkit-linear-gradient(top, #dc7bff 0%, #d35cff 100%); background-image: linear-gradient(to bottom, #dc7bff 0%, #d35cff 100%); }
.button.button-red > span { background-color: #FF3600; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmMzYwMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmMjMwMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ff3600), color-stop(100%, #ff2300)); background-image: -moz-linear-gradient(top, #ff3600 0%, #ff2300 100%); background-image: -webkit-linear-gradient(top, #ff3600 0%, #ff2300 100%); background-image: linear-gradient(to bottom, #ff3600 0%, #ff2300 100%); }
.button.button-black > span { background-color: #2C2C2C; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ5NDk0OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzJjMmMyYyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #494949), color-stop(100%, #2c2c2c)); background-image: -moz-linear-gradient(top, #494949 0%, #2c2c2c 100%); background-image: -webkit-linear-gradient(top, #494949 0%, #2c2c2c 100%); background-image: linear-gradient(to bottom, #494949 0%, #2c2c2c 100%); }
.button.button-blue > span { background-color: #28a6ee; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzI4YTZlZSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzI2YTJlOCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #28a6ee), color-stop(100%, #26a2e8)); background-image: -moz-linear-gradient(top, #28a6ee 0%, #26a2e8 100%); background-image: -webkit-linear-gradient(top, #28a6ee 0%, #26a2e8 100%); background-image: linear-gradient(to bottom, #28a6ee 0%, #26a2e8 100%); }
.button.button-red { color: white; }
.button.button-small { font-size: 0.875rem; }
.button.button-small > span { padding: 7px 22px 9px; }
.button.button-round > span { border-radius: 2em; border: none; padding: 10px 20px; box-shadow: none; text-align: center; }

@media only screen and (min-width: 54.063em) { .button { -moz-transform: translate3d(0, 0, 1px); -webkit-transform: translate3d(0, 0, 1px); transform: translate3d(0, 0, 1px); }
  .button > span { -moz-transition: -moz-transform 0.2s ease; -o-transition: -o-transform 0.2s ease; -webkit-transition: -webkit-transform 0.2s ease; transition: transform 0.2s ease; }
  .button:hover > span, .button.is-active > span { -moz-transform: translate3d(0, 0, 1px) rotate(4deg); -ms-transform: translate3d(0, 0, 1px) rotate(4deg); -webkit-transform: translate3d(0, 0, 1px) rotate(4deg); transform: translate3d(0, 0, 1px) rotate(4deg); text-shadow: 0px 1px rgba(0, 0, 0, 0.4); background-color: #2C2C2C; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ5NDk0OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzJjMmMyYyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #494949), color-stop(100%, #2c2c2c)); background-image: -moz-linear-gradient(top, #494949 0%, #2c2c2c 100%); background-image: -webkit-linear-gradient(top, #494949 0%, #2c2c2c 100%); background-image: linear-gradient(to bottom, #494949 0%, #2c2c2c 100%); }
  .button::after, .button::before { -moz-transform: translate3d(0, 0, 1px); -webkit-transform: translate3d(0, 0, 1px); transform: translate3d(0, 0, 1px); }
  .button.button-yellow:hover, .button.button-yellow.is-active { color: #fbe53e; }
  .button.button-green:hover, .button.button-green.is-active { color: #94d615; }
  .button.button-orange:hover, .button.button-orange.is-active { color: #ff8e00; }
  .button.button-orange-red:hover, .button.button-orange-red.is-active { color: #F76833; }
  .button.button-purple:hover, .button.button-purple.is-active { color: #dc7aff; }
  .button.button-red:hover, .button.button-red.is-active { color: #FF3600; }
  .button.button-black:hover, .button.button-black.is-active { color: #2C2C2C; }
  .button.button-blue:hover, .button.button-blue.is-active { color: #28a6ee; }
  .button.button-red.button-no-hover:hover > span { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; background-color: #FF3600; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmMzYwMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmMjMwMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ff3600), color-stop(100%, #ff2300)); background-image: -moz-linear-gradient(top, #ff3600 0%, #ff2300 100%); background-image: -webkit-linear-gradient(top, #ff3600 0%, #ff2300 100%); background-image: linear-gradient(to bottom, #ff3600 0%, #ff2300 100%); color: #fff; }
  .button.button-round:hover > span { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; } }
/* . ======================================= Author           email            Created         2015-12-08 16:05:31 Description     . Edited by        Edited          2016-01-06 10:33:46
*/
.video-card { display: block; max-width: 460px; padding: .5em; overflow: hidden; position: relative; margin-left: auto; margin-right: auto; }
.video-card .play-btn { -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; width: 86px; height: 60px; top: 50%; left: 50%; }
.video-card .play-btn::before { -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in; content: ''; background: rgba(255, 63, 0, 0.75); border: solid 4px #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.video-card .play-btn::after { content: ''; position: absolute; background: url('../img/arrow.svg?1456424083') no-repeat center center; top: 50%; left: 50%; margin-left: -16px; margin-top: -14px; width: 32px; height: 28px; }
.video-card .play-btn .paper { position: absolute; width: 100%; height: 100%; background: red; }
.video-card:hover .play-btn::before { background: #ff3f00; }
.video-card > div { background: #dedfd4; box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.5); position: relative; }
.video-card video { display: block; }
.video-card img { display: block; width: 100%; }

/*rotation */
.video-card-left { transform: rotate(3deg); }
.video-card-left > div:before, .video-card-left > div:after { transform: rotate(-3deg); }

.video-card-right { transform: rotate(-3deg); }
.video-card-right > div:before, .video-card-right > div:after { transform: rotate(3deg); }

/*colors*/
.video-card-bg-green { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-green::after, .video-card-bg-green::before { position: absolute; background-color: #93d514; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-green::after, .video-card-bg-green::before { height: 120px; width: 60px; }
.video-card-bg-green::before { content: ''; left: -20px; }
.video-card-bg-green::after { content: ''; right: -20px; }
.video-card-bg-green::before, .video-card-bg-green::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-green::before { bottom: auto; top: -55px; }
.video-card-bg-green::after { top: auto; bottom: -55px; }

.video-card-green > div { border: solid 10px #93d514; }

.video-card-bg-green-dark { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-green-dark::after, .video-card-bg-green-dark::before { position: absolute; background-color: #5cb324; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-green-dark::after, .video-card-bg-green-dark::before { height: 120px; width: 60px; }
.video-card-bg-green-dark::before { content: ''; left: -20px; }
.video-card-bg-green-dark::after { content: ''; right: -20px; }
.video-card-bg-green-dark::before, .video-card-bg-green-dark::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-green-dark::before { bottom: auto; top: -55px; }
.video-card-bg-green-dark::after { top: auto; bottom: -55px; }

.video-card-green-dark > div { border: solid 10px #5cb324; }

.video-card-bg-blue { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-blue::after, .video-card-bg-blue::before { position: absolute; background-color: #28a6ee; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-blue::after, .video-card-bg-blue::before { height: 120px; width: 60px; }
.video-card-bg-blue::before { content: ''; left: -20px; }
.video-card-bg-blue::after { content: ''; right: -20px; }
.video-card-bg-blue::before, .video-card-bg-blue::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-blue::before { bottom: auto; top: -55px; }
.video-card-bg-blue::after { top: auto; bottom: -55px; }

.video-card-blue > div { border: solid 10px #28a6ee; }

.video-card-bg-black { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-black::after, .video-card-bg-black::before { position: absolute; background-color: #000000; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-black::after, .video-card-bg-black::before { height: 120px; width: 60px; }
.video-card-bg-black::before { content: ''; left: -20px; }
.video-card-bg-black::after { content: ''; right: -20px; }
.video-card-bg-black::before, .video-card-bg-black::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-black::before { bottom: auto; top: -55px; }
.video-card-bg-black::after { top: auto; bottom: -55px; }

.video-card-black > div { border: solid 10px #000000; }

.video-card-bg-red { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-red::after, .video-card-bg-red::before { position: absolute; background-color: #ff3f00; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-red::after, .video-card-bg-red::before { height: 120px; width: 60px; }
.video-card-bg-red::before { content: ''; left: -20px; }
.video-card-bg-red::after { content: ''; right: -20px; }
.video-card-bg-red::before, .video-card-bg-red::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-red::before { bottom: auto; top: -55px; }
.video-card-bg-red::after { top: auto; bottom: -55px; }

.video-card-red > div { border: solid 10px #ff3f00; }

.video-card-bg-orange { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-orange::after, .video-card-bg-orange::before { position: absolute; background-color: #ff8e00; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-orange::after, .video-card-bg-orange::before { height: 120px; width: 60px; }
.video-card-bg-orange::before { content: ''; left: -20px; }
.video-card-bg-orange::after { content: ''; right: -20px; }
.video-card-bg-orange::before, .video-card-bg-orange::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-orange::before { bottom: auto; top: -55px; }
.video-card-bg-orange::after { top: auto; bottom: -55px; }

.video-card-orange > div { border: solid 10px #ff8e00; }

.video-card-bg-orange-dark { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-orange-dark::after, .video-card-bg-orange-dark::before { position: absolute; background-color: #f56e00; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-orange-dark::after, .video-card-bg-orange-dark::before { height: 120px; width: 60px; }
.video-card-bg-orange-dark::before { content: ''; left: -20px; }
.video-card-bg-orange-dark::after { content: ''; right: -20px; }
.video-card-bg-orange-dark::before, .video-card-bg-orange-dark::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-orange-dark::before { bottom: auto; top: -55px; }
.video-card-bg-orange-dark::after { top: auto; bottom: -55px; }

.video-card-orange-dark > div { border: solid 10px #f56e00; }

.video-card-bg-yellow { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-yellow::after, .video-card-bg-yellow::before { position: absolute; background-color: #ffd000; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-yellow::after, .video-card-bg-yellow::before { height: 120px; width: 60px; }
.video-card-bg-yellow::before { content: ''; left: -20px; }
.video-card-bg-yellow::after { content: ''; right: -20px; }
.video-card-bg-yellow::before, .video-card-bg-yellow::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-yellow::before { bottom: auto; top: -55px; }
.video-card-bg-yellow::after { top: auto; bottom: -55px; }

.video-card-yellow > div { border: solid 10px #ffd000; }

.video-card-bg-gray { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-gray::after, .video-card-bg-gray::before { position: absolute; background-color: #dedfd4; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-gray::after, .video-card-bg-gray::before { height: 120px; width: 60px; }
.video-card-bg-gray::before { content: ''; left: -20px; }
.video-card-bg-gray::after { content: ''; right: -20px; }
.video-card-bg-gray::before, .video-card-bg-gray::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-gray::before { bottom: auto; top: -55px; }
.video-card-bg-gray::after { top: auto; bottom: -55px; }

.video-card-gray > div { border: solid 10px #dedfd4; }

.video-card-bg-white { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-white::after, .video-card-bg-white::before { position: absolute; background-color: #fff; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-white::after, .video-card-bg-white::before { height: 120px; width: 60px; }
.video-card-bg-white::before { content: ''; left: -20px; }
.video-card-bg-white::after { content: ''; right: -20px; }
.video-card-bg-white::before, .video-card-bg-white::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-white::before { bottom: auto; top: -55px; }
.video-card-bg-white::after { top: auto; bottom: -55px; }

.video-card-white > div { border: solid 10px #fff; }

.video-card-bg-purple { position: relative; overflow: hidden; padding: 0.3em; }
.video-card-bg-purple::after, .video-card-bg-purple::before { position: absolute; background-color: #a447c6; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
.video-card-bg-purple::after, .video-card-bg-purple::before { height: 120px; width: 60px; }
.video-card-bg-purple::before { content: ''; left: -20px; }
.video-card-bg-purple::after { content: ''; right: -20px; }
.video-card-bg-purple::before, .video-card-bg-purple::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
.video-card-bg-purple::before { bottom: auto; top: -55px; }
.video-card-bg-purple::after { top: auto; bottom: -55px; }

.video-card-purple > div { border: solid 10px #a447c6; }

/* Basic text styles ======================================= Author           email            Created         2014-10-31 08:53:33 Description     Basic text styles Edited by        Edited          2015-03-09 17:12:06 namespace       text/
*/
/* Basic text elements */
html { font-size: 14px; }

body { font-family: 'Lato', sans-serif; line-height: 1.5; }

p { margin-bottom: 0.8em; }

/* Headers */
h1, h2, h3, h4 { font-family: 'Paytone One', sans-serif; line-height: 1.05em; }

h1 { font-size: 3em; line-height: 1.1; }

h2 { font-size: 2.1em; margin-bottom: 25px; }

h3 { font-size: 1.5rem; }

h4 { font-size: 1.5rem; font-weight: bold; }

h5 { font-size: 1.25rem; }

@media only screen and (min-width: 40.063em) { h1 { font-size: 3.4em; }
  h2 { font-size: 2.25rem; } }
@media only screen and (min-width: 54.063em) { html { font-size: 16px; } }
/* Modal layouts ======================================= Author           email            Created         2014-11-05 11:17:23 Description     . Edited by        Edited          2016-01-18 13:43:05
*/
#ModalView { background: rgba(0, 0, 0, 0.7); display: none; position: fixed; top: 0; z-index: 50001; }
#ModalView .modal-container { width: 100%; height: 100%; position: relative; }
#ModalView .modal-container > .modal-content { background: #ff3f00; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); padding: 50px; left: 50%; position: absolute; top: 50%; z-index: 101; max-width: 940px; }
#ModalView .modal-container > .modal-content .modal-content { display: block; margin: 1em auto; border: solid 4px #fff; position: relative; overflow: hidden; left: 0px; top: 0px; }
#ModalView .modal-container > .modal-content .modal-content img { width: 100%; }
#ModalView .modal-container > .modal-content h2, #ModalView .modal-container > .modal-content p { text-align: center; }
#ModalView .modal-container > .modal-content p { margin: 0.6em 0 0; }
#ModalView .modal-close { font-family: 'Paytone One', sans-serif; line-height: 1.05em; cursor: pointer; position: absolute; top: -20px; right: 15px; padding: 10px; border: solid 4px #fff; background: red; color: white; font-weight: bold; -moz-transform: rotate(-10deg); -ms-transform: rotate(-10deg); -webkit-transform: rotate(-10deg); transform: rotate(-10deg); -moz-transition: -moz-transform 0.2s ease-in-out; -o-transition: -o-transform 0.2s ease-in-out; -webkit-transition: -webkit-transform 0.2s ease-in-out; transition: transform 0.2s ease-in-out; }
#ModalView .modal-close:after { content: 'Close'; }
.lang-es #ModalView .modal-close:after { content: 'Cerrar'; }
.lang-fr #ModalView .modal-close:after { content: 'Fermer'; }
#ModalView .modal-close:hover { background: #000; color: red; transform: rotate(0deg); }

@media only screen and (min-width: 40.063em) { #ModalView .modal-container > .modal-content { padding: 73px; } }
@media only screen and (min-width: 54.063em) { #ModalView .modal-container > .modal-content { padding: 80px; }
  #ModalView .modal-container .modal-close { top: -20px; right: -20px; } }
/* FlexGrid helpers ======================================= Author           email            Created         2015-10-23 15:01:17 Description     . Edited by        Edited          2015-11-02 16:38:12
*/
/* WARNING These are helper functions, only used to generate the html classes. Disregard them. */
/* FLEX GRID The grid only starts to actually work for medium-up. It felt unnecessary to use it at small size because the content is always 100% wide.  USAGE: .row-flex > parent .column-flex-{size} > children  Media Queries: If you want a row or column to start behaving as flex or to change it's width at a certain size you can use: .row-flex-{media-querie} > parent .column-flex-{media-querie}-{size} > children  NON HTML CLASSES Change the variable 'include-html-flexgrid-classes' inside settings/variables.scss to deactivate the html classes and use only the mixins.  No secret with the mixins here, I use foundation's grid-calc() function to generate the correct sizes using the settings in the settings.scss file. So if needed to change the number of columns, etc, just overwrite the variable creating a new one inside our own settings.scss, located on the /settings/variables.scss folder.  BE FUCKING WARE!!!! When using the non html classes version you WILL HAVE TO ADD THE WII U FIX BY HAND! You can find the fix at the bottom of this file.  HTML CLASSES - STRIPPED VERSION With this version you get the basic ONLY, the row-flex and column-flex classes along with the Wii U global fix.  You might like this one Liam.  */
/* flex-grid-row() This is equivalent to grid-row() from foundation. */
/* flex-grid-column() This is equivalent to grid-column() from foundation. */
html, body { height: 100%; }

*, *:before, *:after { box-sizing: border-box; }

[class*='row-flex'], .row { margin: 0 auto; max-width: 1140px; width: 100%; }
[class*='row-flex'] [class*='row-flex'] [class*='column-flex'], .row [class*='row-flex'] [class*='column-flex'] { padding-left: 0; padding-right: 0; }

.row { padding-left: 10px; padding-right: 10px; }

[class*='column-flex'] { -ms-flex: 0 1 auto; padding-left: 10px; padding-right: 10px; }

@media only screen and (min-width: 40.063em) { [class*='row-flex'] { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; -webkit-flex-pack: center; -webkit-justify-content: center; justify-content: center; }
  [class*='row-flex'] [class*='row-flex'] [class*='column-flex']:first-child { padding-right: 10px; padding-left: 0; }
  [class*='row-flex'] [class*='row-flex'] [class*='column-flex']:last-child { padding-left: 10px; padding-right: 0; }
  .row-flex { display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; }
  .row-flex-nowrap { -ms-flex-wrap: none; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; }
  .row-flex-vertical-center { -ms-flex-align: center; -webkit-flex-align: center; -webkit-align-items: center; align-items: center; }
  .row-flex-vertical-center [class*="column-flex"] { margin-top: 0; margin-bottom: 0; }
  .row-flex-vertical-uncenter { -ms-flex-align: baseline; -webkit-flex-align: baseline; -webkit-align-items: baseline; align-items: baseline; }
  .row-flex-horizontal-uncenter { -ms-flex-pack: start; -webkit-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; }
  .column-flex-1 { -ms-flex-preferred-size: 8.33333%; -webkit-flex-basis: 8.33333%; flex-basis: 8.33333%; width: 8.33333%; max-width: 8.33333%; }
  .column-flex-2 { -ms-flex-preferred-size: 16.66667%; -webkit-flex-basis: 16.66667%; flex-basis: 16.66667%; width: 16.66667%; max-width: 16.66667%; }
  .column-flex-3 { -ms-flex-preferred-size: 25%; -webkit-flex-basis: 25%; flex-basis: 25%; width: 25%; max-width: 25%; }
  .column-flex-4 { -ms-flex-preferred-size: 33.33333%; -webkit-flex-basis: 33.33333%; flex-basis: 33.33333%; width: 33.33333%; max-width: 33.33333%; }
  .column-flex-5 { -ms-flex-preferred-size: 41.66667%; -webkit-flex-basis: 41.66667%; flex-basis: 41.66667%; width: 41.66667%; max-width: 41.66667%; }
  .column-flex-6 { -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; width: 50%; max-width: 50%; }
  .column-flex-7 { -ms-flex-preferred-size: 58.33333%; -webkit-flex-basis: 58.33333%; flex-basis: 58.33333%; width: 58.33333%; max-width: 58.33333%; }
  .column-flex-8 { -ms-flex-preferred-size: 66.66667%; -webkit-flex-basis: 66.66667%; flex-basis: 66.66667%; width: 66.66667%; max-width: 66.66667%; }
  .column-flex-9 { -ms-flex-preferred-size: 75%; -webkit-flex-basis: 75%; flex-basis: 75%; width: 75%; max-width: 75%; }
  .column-flex-10 { -ms-flex-preferred-size: 83.33333%; -webkit-flex-basis: 83.33333%; flex-basis: 83.33333%; width: 83.33333%; max-width: 83.33333%; }
  .column-flex-11 { -ms-flex-preferred-size: 91.66667%; -webkit-flex-basis: 91.66667%; flex-basis: 91.66667%; width: 91.66667%; max-width: 91.66667%; }
  .column-flex-12 { -ms-flex-preferred-size: 100%; -webkit-flex-basis: 100%; flex-basis: 100%; width: 100%; max-width: 100%; } }
@media only screen and (min-width: 54.063em) { .row-flex-large { display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; }
  .row-flex-large-nowrap { -ms-flex-wrap: none; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; }
  .row-flex-large-vertical-center { -ms-flex-align: center; -webkit-flex-align: center; -webkit-align-items: center; align-items: center; }
  .row-flex-large-vertical-center [class*="column-flex"] { margin-top: 0; margin-bottom: 0; }
  .row-flex-large-vertical-uncenter { -ms-flex-align: baseline; -webkit-flex-align: baseline; -webkit-align-items: baseline; align-items: baseline; }
  .row-flex-large-horizontal-uncenter { -ms-flex-pack: start; -webkit-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; }
  .column-flex-large-1 { -ms-flex-preferred-size: 8.33333%; -webkit-flex-basis: 8.33333%; flex-basis: 8.33333%; width: 8.33333%; max-width: 8.33333%; }
  .column-flex-large-2 { -ms-flex-preferred-size: 16.66667%; -webkit-flex-basis: 16.66667%; flex-basis: 16.66667%; width: 16.66667%; max-width: 16.66667%; }
  .column-flex-large-3 { -ms-flex-preferred-size: 25%; -webkit-flex-basis: 25%; flex-basis: 25%; width: 25%; max-width: 25%; }
  .column-flex-large-4 { -ms-flex-preferred-size: 33.33333%; -webkit-flex-basis: 33.33333%; flex-basis: 33.33333%; width: 33.33333%; max-width: 33.33333%; }
  .column-flex-large-5 { -ms-flex-preferred-size: 41.66667%; -webkit-flex-basis: 41.66667%; flex-basis: 41.66667%; width: 41.66667%; max-width: 41.66667%; }
  .column-flex-large-6 { -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; width: 50%; max-width: 50%; }
  .column-flex-large-7 { -ms-flex-preferred-size: 58.33333%; -webkit-flex-basis: 58.33333%; flex-basis: 58.33333%; width: 58.33333%; max-width: 58.33333%; }
  .column-flex-large-8 { -ms-flex-preferred-size: 66.66667%; -webkit-flex-basis: 66.66667%; flex-basis: 66.66667%; width: 66.66667%; max-width: 66.66667%; }
  .column-flex-large-9 { -ms-flex-preferred-size: 75%; -webkit-flex-basis: 75%; flex-basis: 75%; width: 75%; max-width: 75%; }
  .column-flex-large-10 { -ms-flex-preferred-size: 83.33333%; -webkit-flex-basis: 83.33333%; flex-basis: 83.33333%; width: 83.33333%; max-width: 83.33333%; }
  .column-flex-large-11 { -ms-flex-preferred-size: 91.66667%; -webkit-flex-basis: 91.66667%; flex-basis: 91.66667%; width: 91.66667%; max-width: 91.66667%; }
  .column-flex-large-12 { -ms-flex-preferred-size: 100%; -webkit-flex-basis: 100%; flex-basis: 100%; width: 100%; max-width: 100%; }
  [class*='row-flex'] [class*='row-flex'] [class*='column-flex'] { padding-left: 10px; padding-right: 10px; } }
@media only screen and (min-width: 71.063em) { .row-flex-xlarge { display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; }
  .row-flex-xlarge-nowrap { -ms-flex-wrap: none; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; }
  .row-flex-xlarge-vertical-center { -ms-flex-align: center; -webkit-flex-align: center; -webkit-align-items: center; align-items: center; }
  .row-flex-xlarge-vertical-center [class*="column-flex"] { margin-top: 0; margin-bottom: 0; }
  .row-flex-xlarge-vertical-uncenter { -ms-flex-align: baseline; -webkit-flex-align: baseline; -webkit-align-items: baseline; align-items: baseline; }
  .row-flex-xlarge-horizontal-uncenter { -ms-flex-pack: start; -webkit-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; }
  .column-flex-xlarge-1 { -ms-flex-preferred-size: 8.33333%; -webkit-flex-basis: 8.33333%; flex-basis: 8.33333%; width: 8.33333%; max-width: 8.33333%; }
  .column-flex-xlarge-2 { -ms-flex-preferred-size: 16.66667%; -webkit-flex-basis: 16.66667%; flex-basis: 16.66667%; width: 16.66667%; max-width: 16.66667%; }
  .column-flex-xlarge-3 { -ms-flex-preferred-size: 25%; -webkit-flex-basis: 25%; flex-basis: 25%; width: 25%; max-width: 25%; }
  .column-flex-xlarge-4 { -ms-flex-preferred-size: 33.33333%; -webkit-flex-basis: 33.33333%; flex-basis: 33.33333%; width: 33.33333%; max-width: 33.33333%; }
  .column-flex-xlarge-5 { -ms-flex-preferred-size: 41.66667%; -webkit-flex-basis: 41.66667%; flex-basis: 41.66667%; width: 41.66667%; max-width: 41.66667%; }
  .column-flex-xlarge-6 { -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; width: 50%; max-width: 50%; }
  .column-flex-xlarge-7 { -ms-flex-preferred-size: 58.33333%; -webkit-flex-basis: 58.33333%; flex-basis: 58.33333%; width: 58.33333%; max-width: 58.33333%; }
  .column-flex-xlarge-8 { -ms-flex-preferred-size: 66.66667%; -webkit-flex-basis: 66.66667%; flex-basis: 66.66667%; width: 66.66667%; max-width: 66.66667%; }
  .column-flex-xlarge-9 { -ms-flex-preferred-size: 75%; -webkit-flex-basis: 75%; flex-basis: 75%; width: 75%; max-width: 75%; }
  .column-flex-xlarge-10 { -ms-flex-preferred-size: 83.33333%; -webkit-flex-basis: 83.33333%; flex-basis: 83.33333%; width: 83.33333%; max-width: 83.33333%; }
  .column-flex-xlarge-11 { -ms-flex-preferred-size: 91.66667%; -webkit-flex-basis: 91.66667%; flex-basis: 91.66667%; width: 91.66667%; max-width: 91.66667%; }
  .column-flex-xlarge-12 { -ms-flex-preferred-size: 100%; -webkit-flex-basis: 100%; flex-basis: 100%; width: 100%; max-width: 100%; } }
@media only screen and (min-width: 120.063em) { .row-flex-xxlarge { display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; }
  .row-flex-xxlarge-nowrap { -ms-flex-wrap: none; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; }
  .row-flex-xxlarge-vertical-center { -ms-flex-align: center; -webkit-flex-align: center; -webkit-align-items: center; align-items: center; }
  .row-flex-xxlarge-vertical-center [class*="column-flex"] { margin-top: 0; margin-bottom: 0; }
  .row-flex-xxlarge-vertical-uncenter { -ms-flex-align: baseline; -webkit-flex-align: baseline; -webkit-align-items: baseline; align-items: baseline; }
  .row-flex-xxlarge-horizontal-uncenter { -ms-flex-pack: start; -webkit-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; }
  .column-flex-xxlarge-1 { -ms-flex-preferred-size: 8.33333%; -webkit-flex-basis: 8.33333%; flex-basis: 8.33333%; width: 8.33333%; max-width: 8.33333%; }
  .column-flex-xxlarge-2 { -ms-flex-preferred-size: 16.66667%; -webkit-flex-basis: 16.66667%; flex-basis: 16.66667%; width: 16.66667%; max-width: 16.66667%; }
  .column-flex-xxlarge-3 { -ms-flex-preferred-size: 25%; -webkit-flex-basis: 25%; flex-basis: 25%; width: 25%; max-width: 25%; }
  .column-flex-xxlarge-4 { -ms-flex-preferred-size: 33.33333%; -webkit-flex-basis: 33.33333%; flex-basis: 33.33333%; width: 33.33333%; max-width: 33.33333%; }
  .column-flex-xxlarge-5 { -ms-flex-preferred-size: 41.66667%; -webkit-flex-basis: 41.66667%; flex-basis: 41.66667%; width: 41.66667%; max-width: 41.66667%; }
  .column-flex-xxlarge-6 { -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; width: 50%; max-width: 50%; }
  .column-flex-xxlarge-7 { -ms-flex-preferred-size: 58.33333%; -webkit-flex-basis: 58.33333%; flex-basis: 58.33333%; width: 58.33333%; max-width: 58.33333%; }
  .column-flex-xxlarge-8 { -ms-flex-preferred-size: 66.66667%; -webkit-flex-basis: 66.66667%; flex-basis: 66.66667%; width: 66.66667%; max-width: 66.66667%; }
  .column-flex-xxlarge-9 { -ms-flex-preferred-size: 75%; -webkit-flex-basis: 75%; flex-basis: 75%; width: 75%; max-width: 75%; }
  .column-flex-xxlarge-10 { -ms-flex-preferred-size: 83.33333%; -webkit-flex-basis: 83.33333%; flex-basis: 83.33333%; width: 83.33333%; max-width: 83.33333%; }
  .column-flex-xxlarge-11 { -ms-flex-preferred-size: 91.66667%; -webkit-flex-basis: 91.66667%; flex-basis: 91.66667%; width: 91.66667%; max-width: 91.66667%; }
  .column-flex-xxlarge-12 { -ms-flex-preferred-size: 100%; -webkit-flex-basis: 100%; flex-basis: 100%; width: 100%; max-width: 100%; } }
/* IMPORTANT WII U FIX */
body[data-useragent*='WiiU'] [class*='column-flex'] { -webkit-flex: 1 1; }

/*   . ======================================= Author           email            Created         2014-11-08 12:40:09 Description     . Edited by        Edited          2014-11-08 12:42:46
*/
.small-only { display: initial; }

.medium-only { display: none; }

figure.screenshot { margin: 0 auto; }
figure.screenshot > div { position: relative; overflow: hidden; padding: 0.3em; margin: 0 auto 20px; }
figure.screenshot > div::after, figure.screenshot > div::before { position: absolute; background-color: black; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
figure.screenshot > div::after, figure.screenshot > div::before { height: 80px; width: 40px; }
figure.screenshot > div::before { content: ''; left: -15px; }
figure.screenshot > div::after { content: ''; right: -15px; }
figure.screenshot > div::before, figure.screenshot > div::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
figure.screenshot > div::before { bottom: auto; top: -35px; }
figure.screenshot > div::after { top: auto; bottom: -35px; }
figure.screenshot > div img { border: solid 8px white; display: block; max-width: 100%; width: 100%; }
figure.screenshot figcaption { font-family: 'Paytone One', sans-serif; line-height: 1.05em; color: #28a6ee; text-align: center; }

@media only screen and (min-width: 54.063em) { figure.screenshot > div img { -moz-transition: -moz-transform 0.2s ease; -o-transition: -o-transform 0.2s ease; -webkit-transition: -webkit-transform 0.2s ease; transition: transform 0.2s ease; }
  figure.screenshot:hover > div img { -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); } }
.divider { position: relative; margin-bottom: 0; }
.divider::after, .divider::before { height: 60px; width: 100%; display: block; background: url('../img/divider-blue.svg?1456424088') center bottom repeat-x; pointer-events: none; position: absolute; left: 0; }
.divider::after { top: 100%; }
.divider::before { -moz-transform: scaleY(-1); -ms-transform: scaleY(-1); -webkit-transform: scaleY(-1); transform: scaleY(-1); bottom: 100%; }
.divider-wrapper { padding: 40px 0; background-color: #28a6ee; }
.divider-wrapper > .row-flex:last-child { margin-bottom: 0; }
.divider.divider-top::before { content: ''; }
.divider.divider-bottom::after { content: ''; }
.divider.divider-bottom + div, .divider.divider-bottom + footer { padding-top: 80px; }
.divider.divider-both::after, .divider.divider-both::before { content: ''; }
.divider.divider-both + div, .divider.divider-both + footer { padding-top: 80px; }

.divider-color-blue::before, .divider-color-blue::after { background-image: url('../img/divider-blue.svg?1456424088'); }
.divider-color-blue .divider-wrapper { background-color: #28a6ee; }

.divider-color-green::before, .divider-color-green::after { background-image: url('../img/divider-green.svg?1456424088'); }
.divider-color-green .divider-wrapper { background-color: #93d514; }

.divider-color-purple::before, .divider-color-purple::after { background-image: url('../img/divider-purple.svg?1456424088'); }
.divider-color-purple .divider-wrapper { background-color: #a447c6; }

.divider-color-red::before, .divider-color-red::after { background-image: url('../img/divider-red.svg?1456424088'); }
.divider-color-red .divider-wrapper { background-color: #ff4100; }

.divider-color-yellow::before, .divider-color-yellow::after { background-image: url('../img/divider-yellow.svg?1456424088'); }
.divider-color-yellow .divider-wrapper { background-color: #fed100; }

.divider-color-orange::before, .divider-color-orange::after { background-image: url('../img/divider-orange.svg?1456424088'); }
.divider-color-orange .divider-wrapper { background-color: #ff8e00; }

.divider-color-orange-dark::before, .divider-color-orange-dark::after { background-image: url('../img/divider-orange-dark.svg?1456424088'); }
.divider-color-orange-dark .divider-wrapper { background-color: #f56e00; }

.sliding-box { margin: 0 auto; display: block; }
.sliding-box .sliding-box-img { box-shadow: 0px 0px 8px -1px rgba(0, 0, 0, 0.5); position: relative; overflow: hidden; }
.sliding-box .sliding-box-img .video-wrapper { margin-bottom: 20%; }
.sliding-box .sliding-box-img .sliding-box-img-wrapper { margin-bottom: 15%; }
.sliding-box .sliding-box-img img { max-width: 100%; display: block; width: 100%; }
.sliding-box .sliding-box-img video { max-width: 100%; width: 100%; }
.sliding-box .sliding-box-text { -moz-transition: height 0.5s ease; -o-transition: height 0.5s ease; -webkit-transition: height 0.5s ease; transition: height 0.5s ease; display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; -ms-flex-align: center; -webkit-flex-align: center; -webkit-align-items: center; align-items: center; -ms-flex-pack: center; -webkit-flex-pack: center; -webkit-justify-content: center; justify-content: center; background-color: white; position: absolute; bottom: 0; height: 40%; text-align: center; width: 100%; padding: 0 20px; }
.sliding-box .sliding-box-text::before { -moz-transition: border 0.5s ease; -o-transition: border 0.5s ease; -webkit-transition: border 0.5s ease; transition: border 0.5s ease; content: ''; width: 0; height: 0; border-top: 50px solid transparent; border-bottom: 0px solid transparent; border-left: 380px solid white; margin-left: -20px; position: absolute; bottom: 100%; left: 0; }

@media only screen and (max-width: 40em) { .sliding-box { max-width: 380px; } }
@media only screen and (min-width: 54.063em) { .sliding-box:hover .sliding-box-text { height: 28.5%; }
  .sliding-box:hover .sliding-box-text::before { border-top-width: 0px; } }
.lang-fr .sliding-box h2 { font-size: 1.875em; }

.lang-es .sliding-box h2 { font-size: 1.6em; }

body.is-ie10 .sliding-box .sliding-box-text h2 { -ms-flex: 0 1 auto; }

.split-bg .txt { background: white; }
.split-bg .img { position: relative; }
.split-bg .img img { display: block; }

@media only screen and (min-width: 40.063em) { .split-bg .txt { display: -ms-inline-flexbox; display: -webkit-inline-flexbox; display: -webkit-inline-flex; display: inline-flex; -ms-flex-align: center; -webkit-flex-align: center; -webkit-align-items: center; align-items: center; position: relative; }
  .split-bg .txt::before { content: ""; position: absolute; right: 0; height: 100%; width: 50vw; background: white; top: 0; }
  .split-bg .txt.txt-right::before { right: auto; left: 0; }
  .split-bg .txt > div { position: relative; } }
@media only screen and (min-width: 40.063em) { .split-bg .txt::after { content: ''; background: url('../img/split-bg-triangle.svg?1456424088') left bottom no-repeat; background-size: cover; height: 100%; width: 56px; display: block; position: absolute; left: 100%; top: 0; }
  .split-bg .txt.txt-right::after { -moz-transform: scaleX(-1); -ms-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); left: auto; right: 100%; } }
/*   . ======================================= Author           email            Created         2015-12-15 15:53:59 Description     . Edited by        Edited          2015-12-16 13:53:36
*/
/* pfold style */
.uc-container { position: relative; width: 100px; height: 100px; top: 0; left: 0; }

.uc-single, .uc-final-wrapper, .uc-initial-content, .uc-back, .uc-front { background: #ff3f00; }

.uc-final, .uc-initial, .uc-final-wrapper { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }

.uc-initial-content, .uc-final-content { width: 100%; height: 100%; position: relative; }

.uc-final, .uc-final-content { display: none; }

.uc-initial-content { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; }

.uc-part { top: 0; left: 0; position: absolute; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateZ(0); transform: translateZ(0); }

.uc-part > div { display: block; position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; }

.uc-part .uc-back { -webkit-transform: rotateY(-180deg); -moz-transform: rotateY(-180deg); -o-transform: rotateY(-180deg); -ms-transform: rotateY(-180deg); transform: rotateY(-180deg); }

/* Transformation-origin classes */
.uc-unfold-left { -webkit-transform-origin: 0 50%; -moz-transform-origin: 0 50%; -o-transform-origin: 0 50%; -ms-transform-origin: 0 50%; transform-origin: 0 50%; }

.uc-unfold-right { -webkit-transform-origin: 100% 50%; -moz-transform-origin: 100% 50%; -o-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; }

.uc-unfold-top { -webkit-transform-origin: 50% 0%; -moz-transform-origin: 50% 0%; -o-transform-origin: 50% 0%; -ms-transform-origin: 50% 0%; transform-origin: 50% 0%; }

.uc-unfold-bottom { -webkit-transform-origin: 50% 100%; -moz-transform-origin: 50% 100%; -o-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; transform-origin: 50% 100%; }

/* Unfolding classes */
.uc-unfold-left.uc-unfold { -webkit-transform: rotateY(-180deg); -moz-transform: rotateY(-180deg); -o-transform: rotateY(-180deg); -ms-transform: rotateY(-180deg); transform: rotateY(-180deg); }

.uc-unfold-right.uc-unfold { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); -ms-transform: rotateY(180deg); transform: rotateY(180deg); }

.uc-unfold-top.uc-unfold { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -o-transform: rotateX(180deg); -ms-transform: rotateX(180deg); transform: rotateX(180deg); }

.uc-unfold-bottom.uc-unfold { -webkit-transform: rotateX(-180deg); -moz-transform: rotateX(-180deg); -o-transform: rotateX(-180deg); -ms-transform: rotateX(-180deg); transform: rotateX(-180deg); }

.uc-overlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }

.uc-overlay, .uc-flipoverlay { background-color: rgba(100, 100, 100, 0.7); position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; }

.uc-flipoverlay { background-color: rgba(100, 100, 100, 0.4); }

.uc-inner { position: absolute; left: 0; top: 0; overflow: hidden; width: 100%; height: 100%; }

.uc-inner-rotate { -webkit-transform: rotateY(180deg) rotateX(180deg); -moz-transform: rotateY(180deg) rotateX(180deg); -o-transform: rotateY(180deg) rotateX(180deg); -ms-transform: rotateY(180deg) rotateX(180deg); transform: rotateY(180deg) rotateX(180deg); }

.uc-container.uc-current { z-index: 9999; }

#PaperFold { position: fixed; width: 86px; height: 60px; z-index: 5555; }
#PaperFold .paper { position: absolute; width: 100%; height: 100%; }
#PaperFold::before { content: ''; background: #ff3f00; border: solid 4px #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in; }
#PaperFold.hide-arrow::before { border: none; }
#PaperFold.hide-arrow::after { content: none; }

/*   . ======================================= Author           email            Created         2015-09-12 10:08:09 Description     . Edited by        Edited          2015-12-18 10:59:35
*/
.SBParticle { background: url('../img/home/spark-yellow.png?1456424088'); background-size: cover; display: block; height: 70px; left: 50%; position: absolute; top: 50%; width: 70px; }
.SBParticle.particle2 { background-image: url('../img/home/spark-blue.png?1456424088'); }
.SBParticle.particle3 { background-image: url('../img/home/spark-pink.png?1456424088'); }

/* Switcher layout ======================================= Author           email            Created         2014-11-06 11:31:09 Description     . Edited by        Edited          2015-12-18 15:13:56
*/
.switcher { -moz-perspective: 1300px; -webkit-perspective: 1300px; perspective: 1300px; display: table; margin: 0 auto; position: relative; text-align: center; width: 100%; }
.switcher .switcher-wrapper { border: solid 12px #28a6ee; box-shadow: 3px 3px 8px 0px rgba(0, 0, 0, 0.4); position: relative; width: 100%; }
.switcher .switcher-wrapper img { position: absolute; top: 0; left: 0; display: block; width: 100%; }
.switcher .switcher-wrapper img:first-child { position: relative; }
.switcher .switcher-shadow { position: absolute; top: 0; width: 100%; height: 100%; opacity: 0; }
.switcher .switcher-shadows-left, .switcher .switcher-shadows-right { background: rgba(0, 0, 0, 0.5); position: absolute; top: 0; width: 50%; height: 100%; }
.switcher .switcher-shadows-left { left: 0; }
.switcher .switcher-shadows-right { right: 0; }
.switcher .switcher-flipper { width: 100%; height: 100%; position: absolute; top: 0; right: 0; }
.switcher .switcher-flipper .switcher-flipper-left, .switcher .switcher-flipper .switcher-flipper-right { -moz-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; position: absolute; top: 0; width: 50%; height: 100%; }
.switcher .switcher-flipper .switcher-flipper-left { -moz-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; left: 0; }
.switcher .switcher-flipper .switcher-flipper-left .switcher-flipper-front { background-position: left top; }
.switcher .switcher-flipper .switcher-flipper-left .switcher-flipper-back { -moz-transform: rotateY(-180deg); -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); background-position: right top; }
.switcher .switcher-flipper .switcher-flipper-right { -moz-transform-origin: 0 50%; -ms-transform-origin: 0 50%; -webkit-transform-origin: 0 50%; transform-origin: 0 50%; right: 0; }
.switcher .switcher-flipper .switcher-flipper-right .switcher-shadow-front { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuNSIgeDI9IjEuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjMiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4wIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g'); background-size: 100%; background-image: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, rgba(0, 0, 0, 0.3)), color-stop(100%, rgba(0, 0, 0, 0))); background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%); background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%); }
.switcher .switcher-flipper .switcher-flipper-right .switcher-shadow-back { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjEuMCIgeTE9IjAuNSIgeDI9IjAuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjMiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4wIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g'); background-size: 100%; background-image: -webkit-gradient(linear, 100% 50%, 0% 50%, color-stop(0%, rgba(0, 0, 0, 0.3)), color-stop(100%, rgba(0, 0, 0, 0))); background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%); background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%); background-image: linear-gradient(to left, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%); }
.switcher .switcher-flipper .switcher-flipper-right .switcher-flipper-front { background-position: right top; }
.switcher .switcher-flipper .switcher-flipper-right .switcher-flipper-back { -moz-transform: rotateY(180deg); -webkit-transform: rotateY(180deg); transform: rotateY(180deg); background-position: left top; }
.switcher .switcher-flipper .switcher-flipper-front, .switcher .switcher-flipper .switcher-flipper-back { backface-visibility: hidden; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-size: auto 100%; }
.switcher .switcher-button { width: 65px; height: 80px; position: relative; display: inline-block; margin-top: 20px; overflow: hidden; }
.switcher .switcher-button:hover { cursor: pointer; }
.switcher .switcher-button button { -moz-appearance: none; -webkit-appearance: none; text-indent: 120%; white-space: pre; overflow: hidden; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmOGUwMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmN2EwMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ff8e00), color-stop(100%, #ff7a00)); background-image: -moz-linear-gradient(top, #ff8e00 0%, #ff7a00 100%); background-image: -webkit-linear-gradient(top, #ff8e00 0%, #ff7a00 100%); background-image: linear-gradient(to bottom, #ff8e00 0%, #ff7a00 100%); text-indent: 180%; border: none; display: block; height: 100%; width: 100%; position: relative; }
.switcher .switcher-button button:focus, .switcher .switcher-button button:active { outline: none; }
.switcher .switcher-button button::before { -moz-transform: scale(0.8, 0.8); -ms-transform: scale(0.8, 0.8); -webkit-transform: scale(0.8, 0.8); transform: scale(0.8, 0.8); content: ''; background: url('../img/switcher-arrows-sprite.svg?1456424088') left top no-repeat; display: block; height: 34px; width: 26px; position: absolute; top: 50%; margin-top: -17px; }
.switcher .switcher-button::after { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHJhZGlhbEdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjAiIGN5PSI1MCUiIHI9IjcwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjUiLz48c3RvcCBvZmZzZXQ9IjcwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjAiLz48L3JhZGlhbEdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -moz-radial-gradient(0 50%, ellipse farthest-corner, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 70%); background-image: -webkit-radial-gradient(0 50%, ellipse farthest-corner, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 70%); background-image: radial-gradient(ellipse farthest-corner at 0 50%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 70%); content: ''; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 7px; }
.switcher .switcher-button.next { padding: 10px 10px 10px 0; }
.switcher .switcher-button.next button { box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.5); border-right: solid 8px white; border-top: solid 8px white; border-bottom: solid 8px white; }
.switcher .switcher-button.next button::before { left: 9px; }
.switcher .switcher-button.prev { padding: 10px 0 10px 10px; margin-right: 40px; }
.switcher .switcher-button.prev button { box-shadow: -1px 1px 1px 0px rgba(0, 0, 0, 0.5); border-left: solid 8px white; border-top: solid 8px white; border-bottom: solid 8px white; }
.switcher .switcher-button.prev button::before { background-position: -26px 0; left: 10px; }
.switcher .switcher-button.prev::after { -moz-transform: scaleX(-1); -ms-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); left: auto; right: 0; }

@media only screen and (min-width: 54.063em) { .switcher .switcher-button button { -moz-transition: -moz-transform 0.4s ease; -o-transition: -o-transform 0.4s ease; -webkit-transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; }
  .switcher .switcher-button.next button { -moz-transform: translateX(-17px); -ms-transform: translateX(-17px); -webkit-transform: translateX(-17px); transform: translateX(-17px); }
  .switcher .switcher-button.prev button { -moz-transform: translateX(17px); -ms-transform: translateX(17px); -webkit-transform: translateX(17px); transform: translateX(17px); }
  .switcher .switcher-button:hover button { -moz-transform: translateX(0); -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } }
@media only screen and (min-width: 71.063em) { .switcher { padding: 0 80px; }
  .switcher .switcher-button { width: 65px; height: 90px; position: absolute; top: 50%; margin-top: -30px; }
  .switcher .switcher-button button::before { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; }
  .switcher .switcher-button.prev { left: 0; margin-right: 0; }
  .switcher .switcher-button.prev button { border-left-width: 10px; border-top-width: 10px; border-bottom-width: 10px; }
  .switcher .switcher-button.prev::before { left: 20px; }
  .switcher .switcher-button.next { right: 0; }
  .switcher .switcher-button.next button { border-right-width: 10px; border-top-width: 10px; border-bottom-width: 10px; } }
body, html { height: auto; min-height: 100%; }

body { position: relative; }

img { max-width: 100%; }
img.img-block { display: block; }

#wrap { overflow: hidden; width: 100%; position: relative; }

.main-top { background: url('../img/top-background.jpg?1456424088') center top repeat-x; margin-top: 45px; }

.white-content { color: white; }

.content-title { padding: 0 10px; margin: 0 auto 40px; text-align: center; }
.content-title h1 { margin: 0 0 20px; }
.content-title h5 { font-size: 1.125rem; }

#footer-main { background-color: black; padding-bottom: 1px; }
#footer-main .row { margin-bottom: 20px; }
#footer-main .touts { margin-bottom: 40px; }
#footer-main .touts .screenshot { max-width: 300px; }
#footer-main .touts a { display: block; text-decoration: none; }
#footer-main .middle { display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; -webkit-flex-pack: center; -webkit-justify-content: center; justify-content: center; -ms-flex-align: center; -webkit-flex-align: center; -webkit-align-items: center; align-items: center; }
#footer-main .legal { font-size: 0.75rem; text-align: center; color: white; }
#footer-main .legal a { color: inherit; text-decoration: none; }
#footer-main .legal a:hover { color: #28a6ee; }
#footer-main .buttons { background: white; border-radius: 2em; padding: 3px; margin-bottom: 20px; }
#footer-main .buttons .button { display: table; float: left; }
#footer-main .buttons .button > span span { display: block; }
#footer-main .social { text-shadow: 0px 1px rgba(255, 255, 255, 0.4); font-family: 'Paytone One', sans-serif; line-height: 1.05em; background-color: #fbe53e; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZiZTY0MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Y1YzIwMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbe641), color-stop(100%, #f5c200)); background-image: -moz-linear-gradient(top, #fbe641 0%, #f5c200 100%); background-image: -webkit-linear-gradient(top, #fbe641 0%, #f5c200 100%); background-image: linear-gradient(to bottom, #fbe641 0%, #f5c200 100%); border: solid 4px white; border-radius: 2em; color: black; font-size: 1.25rem; padding: 10px 20px 12px; position: relative; text-align: center; margin-bottom: 20px; margin-right: 20px; }
#footer-main .social h3, #footer-main .social div { display: inline-block; }
#footer-main .social h3 { margin-top: 0; margin-bottom: 0; }

@media only screen and (max-width: 40em) { #footer-main .touts a { margin-bottom: 20px; } }
@media only screen and (min-width: 40.063em) { .content-title { text-align: left; }
  #footer-main .buttons .button > span span { display: inline; } }
@media only screen and (min-width: 54.063em) { .main-top { margin-top: 72px; }
  #footer-main .touts a .screenshot > div { -moz-transition: -moz-transform 0.2s ease; -o-transition: -o-transform 0.2s ease; -webkit-transition: -webkit-transform 0.2s ease; transition: transform 0.2s ease; }
  #footer-main .touts a:hover .screenshot > div { -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  #footer-main .social { padding-left: 50px; margin-right: 40px; }
  #footer-main .social::after { background: url('../img/footer-share_2x.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 92.5px; width: 81.5px; content: ''; position: absolute; left: -45px; top: 50%; margin-top: -46.25px; }
  #footer-main .buttons { padding-left: 50px; position: relative; }
  #footer-main .buttons::after { background: url('../img/footer-mario_2x.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 95px; width: 77.5px; content: ''; position: absolute; left: -25px; top: 50%; margin-top: -47.5px; } }
@media only screen and (min-width: 71.063em) { .content-title { text-align: left; }
  .main-top { margin-top: 85px; } }
/* . ======================================= Author           email            Created         2014-11-06 13:07:21 Description     . Edited by        Edited          2016-01-15 11:11:47
*/

div#nintendo-footer { display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; -webkit-flex-pack: center; -webkit-justify-content: center; justify-content: center; -ms-flex-align: center; -webkit-flex-align: center; -webkit-align-items: center; align-items: center; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
div#nintendo-footer > div { float: none !important; margin: 0 20px 0 0 !important; height: auto !important; min-height: 0 !important; }
div#nintendo-footer > div:last-child { margin-right: 0 !important; }

#footer-followus-container { color: white !important; text-align: center; }

#footer-privacypolicy-container a { color: white !important; }

#footer-esrb-container > a { border: 1px solid #fff !important; }

/* Main navigation styles ======================================= Author           email            Created         2014-11-03 16:14:22 Description     . Edited by        Edited          2016-01-13 14:47:23
*/
label#mobile-nav { -moz-transition: top 0.3s ease; -o-transition: top 0.3s ease; -webkit-transition: top 0.3s ease; transition: top 0.3s ease; left: 10px; top: 46px; position: fixed; z-index: 3; text-align: center; }
label#mobile-nav > span { color: white; background-color: black; padding: 11px 11px 8px; font-size: 0.75rem; }
label#mobile-nav .burguer, label#mobile-nav .burguer:before, label#mobile-nav .burguer:after { -moz-transition: background-color 0.3s ease, -moz-transform 0.4s ease; -o-transition: background-color 0.3s ease, -o-transform 0.4s ease; -webkit-transition: background-color 0.3s ease, -webkit-transform 0.4s ease; transition: background-color 0.3s ease, transform 0.4s ease; background: white; content: " "; display: block; height: 5px; margin: 3px 0; box-shadow: 0px 1px 1px 0px rgba(255, 255, 255, 0.6); }
label#mobile-nav .burguer { margin: 8px 0; width: 100%; }
label#mobile-nav .burguer:before { -moz-transform: translateY(-8px); -ms-transform: translateY(-8px); -webkit-transform: translateY(-8px); transform: translateY(-8px); }

input#mobile-nav-toggle { display: none; }
input#mobile-nav-toggle:checked ~ label > span { text-shadow: none; }
input#mobile-nav-toggle:checked ~ label .burguer { -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); background-color: transparent; box-shadow: none; }
input#mobile-nav-toggle:checked ~ label .burguer::before { -moz-transform: rotate(45deg) translate(0px, 2px); -ms-transform: rotate(45deg) translate(0px, 2px); -webkit-transform: rotate(45deg) translate(0px, 2px); transform: rotate(45deg) translate(0px, 2px); background-color: white; box-shadow: none; }
input#mobile-nav-toggle:checked ~ label .burguer::after { -moz-transform: rotate(-45deg) translate(4px, -5px); -ms-transform: rotate(-45deg) translate(4px, -5px); -webkit-transform: rotate(-45deg) translate(4px, -5px); transform: rotate(-45deg) translate(4px, -5px); background-color: white; box-shadow: none; }
input#mobile-nav-toggle:checked ~ nav { display: block; overflow: auto; }

header[role="navigation"] { position: relative; margin: 0; z-index: 3; }
header[role="navigation"] nav { width: 100%; height: 100vh; position: fixed; z-index: 2; top: 0; left: 0; display: none; background: rgba(255, 255, 255, 0.8); }
header[role="navigation"] nav ul { margin-top: 90px; padding: 0 10px; }
header[role="navigation"] nav a { width: 100%; text-align: center; }
header[role="navigation"] nav .logo { display: none; }
header[role="navigation"] nav .button { display: block; }

body.is-fixed label#mobile-nav { top: 14px; }

#main-logo { display: table; margin: 15px auto; padding: 0 10px; width: 51vw; max-width: 400px; }
#main-logo img { max-width: 100%; width: 100%; }

#main-3ds-logo { position: absolute; right: 50%; margin-right: -50px; top: 16vw; }
#main-3ds-logo img { width: 100px; }

@media (max-height: 568px) { header[role="navigation"] nav { padding-bottom: 60px; } }
@media only screen and (max-width: 768px) { label#mobile-nav { top: 106px; } }
@media only screen and (min-width: 40.063em) { #main-3ds-logo { right: auto; left: 10px; top: 22px; }
  #main-logo { max-width: 250px; }
  header[role="navigation"] nav .buy { display: none; } }
@media only screen and (min-width: 40.063em) and (max-width: 54em) { #main-3ds-logo { left: 94px; }
  header[role="navigation"] nav li { width: 60%; margin: 0 auto; } }
@media only screen and (min-width: 54.063em) { #main-logo { display: none; }
  label#mobile-nav { display: none; }
  header[role="navigation"] { z-index: 99; }
  header[role="navigation"] nav { display: block; height: auto; background: none; top: 70px; z-index: 99; }
  header[role="navigation"] nav::before { -moz-transition: width 0.4s linear; -o-transition: width 0.4s linear; -webkit-transition: width 0.4s linear; transition: width 0.4s linear; content: ''; width: 0; height: 140%; display: block; background: url('../img/nav-details_2x.png?1456424088') right bottom repeat-x; background-size: 539px auto; position: absolute; top: 0; right: 0; }
  header[role="navigation"] nav .home { display: none; }
  header[role="navigation"] nav .logo { display: inline-block; }
  header[role="navigation"] nav .logo img { max-width: 206px; }
  header[role="navigation"] nav .cards a { line-height: 1em; }
  header[role="navigation"] nav .cards a > span { padding: 8px 30px 10px; }
  header[role="navigation"] nav .cards a > span span { display: block; }
  header[role="navigation"] nav ul { -moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none; display: table; margin: 10px auto 5px; position: relative; }
  header[role="navigation"] nav li { display: inline-block; margin-right: 10px; margin-bottom: 0; vertical-align: middle; }
  header[role="navigation"] nav .button { position: relative; overflow: hidden; padding: 0.3em; }
  header[role="navigation"] nav .button::after, header[role="navigation"] nav .button::before { position: absolute; background-color: white; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
  header[role="navigation"] nav .button::after, header[role="navigation"] nav .button::before { height: 80px; width: 40px; }
  header[role="navigation"] nav .button::before { content: ''; left: -15px; }
  header[role="navigation"] nav .button::after { content: ''; right: -15px; }
  header[role="navigation"] nav .button::before, header[role="navigation"] nav .button::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
  header[role="navigation"] nav .button::before { bottom: auto; top: -35px; }
  header[role="navigation"] nav .button::after { top: auto; bottom: -35px; }
  header[role="navigation"] nav .battle .button::before, header[role="navigation"] nav .battle .button::after, header[role="navigation"] nav .videos .button::before, header[role="navigation"] nav .videos .button::after { -moz-transform: translate3d(0, 0, 1px) rotate(-45deg); -ms-transform: translate3d(0, 0, 1px) rotate(-45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(-45deg); transform: translate3d(0, 0, 1px) rotate(-45deg); }
  header[role="navigation"] nav .battle .button::before, header[role="navigation"] nav .videos .button::before { top: auto; bottom: -35px; }
  header[role="navigation"] nav .battle .button::after, header[role="navigation"] nav .videos .button::after { bottom: auto; top: -35px; }
  body.is-fixed header[role="navigation"] nav::before { width: 100%; }
  body.is-fixed header[role="navigation"] nav ul { margin: 10px auto 5px; }
  .lang-fr:not(#page-home) header[role="navigation"] nav .button { font-size: .75em; }
  .lang-es:not(#page-home) header[role="navigation"] nav .button { font-size: .8em; } }
@media only screen and (min-width: 54.063em) and (max-width: 71em) { #main-3ds-logo img { max-width: 97px; }
  header[role="navigation"] nav li { margin-right: 5px; }
  header[role="navigation"] nav a { font-size: 0.9375rem; }
  header[role="navigation"] nav .button > span { padding: 7px 20px 10px; }
  header[role="navigation"] nav .cards a { line-height: 0.9em; }
  header[role="navigation"] nav .cards a > span { padding: 8px 19px 10px; }
  header[role="navigation"] nav .logo img { max-width: 166px; } }
@media only screen and (min-width: 71.063em) { #main-3ds-logo { top: 35px; }
  #main-3ds-logo img { width: 137px; }
  .lang-fr:not(#page-home) header[role="navigation"] nav .button { font-size: .88em; }
  .lang-es:not(#page-home) header[role="navigation"] nav .button { font-size: .9em; } }
/* . ======================================= Author           email            Created         2015-03-09 17:02:39 Description     . Edited by        Edited          2016-01-28 15:40:58
*/
#page-home #main-logo { display: none; }
#page-home .lang-message { margin-top: -30px; text-align: center; margin-bottom: 10px; }
#page-home .lang-message p { font-weight: bold; }
#page-home .content-title { text-align: center; max-width: 1220px; }
#page-home header[role="navigation"] nav .logo { display: none; }
#page-home .main-top { padding: 1px; position: relative; }
#page-home .top-trailer { -moz-transform: translateY(230px); -ms-transform: translateY(230px); -webkit-transform: translateY(230px); transform: translateY(230px); display: table; margin: 27px auto 0; position: relative; }
.no-csspointerevents #page-home .top-trailer { z-index: 2; }
#page-home .top-trailer .video-card::before, #page-home .top-trailer .video-card::after { display: none; }
#page-home .top-trailer .video-card span { border-width: 8px; }
#page-home .intro { width: 100%; position: relative; pointer-events: none; }
#page-home .intro > div { position: absolute; left: 50%; }
#page-home .intro .luigi { background: url('../img/home/intro-1.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 136px; width: 84px; top: 360px; margin-left: -42px; }
#page-home .intro .book { background: url('../img/home/intro-2.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 247px; width: 218px; -moz-transform: translateY(-700px); -ms-transform: translateY(-700px); -webkit-transform: translateY(-700px); transform: translateY(-700px); top: 300px; margin-left: -109px; }
#page-home .intro .shine { background: url('../img/home/intro-3.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 900px; width: 900px; -moz-transform: scale(0, 0); -ms-transform: scale(0, 0); -webkit-transform: scale(0, 0); transform: scale(0, 0); top: -80px; margin-left: -450px; opacity: 0; }
#page-home #intro-particles { display: none; }
#page-home .top-logo { width: 90%; max-width: 723px; padding-bottom: 69.08714%; margin: 0 auto 10px; position: relative; z-index: 2; pointer-events: none; }
#page-home .top-logo > div { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-position: left top; background-repeat: no-repeat; background-size: 100% auto; }
#page-home .top-logo .mario { background-image: url('../img/home/main-logo-mario.png?1456424088'); height: 0; bottom: 25%; }
#page-home .top-logo .type { -moz-transform: translateY(-200px); -ms-transform: translateY(-200px); -webkit-transform: translateY(-200px); transform: translateY(-200px); background-image: url('../img/home/main-logo.png?1456424088'); opacity: 0; }
#page-home .top-logo .luigi { background-image: url('../img/home/main-logo-luigi.png?1456424088'); height: 0; bottom: 30%; }
#page-home .top-logo .paper-mario { -moz-transform: rotateY(90deg); -webkit-transform: rotateY(90deg); transform: rotateY(90deg); -moz-transform-origin: 82% 20%; -ms-transform-origin: 82% 20%; -webkit-transform-origin: 82% 20%; transform-origin: 82% 20%; background-image: url('../img/home/main-logo-paper-mario.png?1456424088'); }
#page-home .divider.middle .sliding-box img { margin-bottom: 20%; }
#page-home .divider.middle .sliding-box h2 { margin-bottom: 0; }
#page-home .box-left { position: relative; overflow: hidden; padding: 0.3em; padding: 0.5em; color: #ffd000; }
#page-home .box-left::after, #page-home .box-left::before { position: absolute; background-color: #28a6ee; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
#page-home .box-left::after, #page-home .box-left::before { height: 80px; width: 40px; }
#page-home .box-left::before { content: ''; left: -15px; }
#page-home .box-left::before, #page-home .box-left::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
#page-home .box-left::before { bottom: auto; top: -35px; }
#page-home .box-middle { color: #93d514; padding: 0.5em; }
#page-home .box-right { position: relative; overflow: hidden; padding: 0.3em; padding: 0.5em; color: #ff3f00; }
#page-home .box-right::after, #page-home .box-right::before { position: absolute; background-color: #28a6ee; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
#page-home .box-right::after, #page-home .box-right::before { height: 80px; width: 40px; }
#page-home .box-right::after { content: ''; right: -15px; }
#page-home .box-right::before, #page-home .box-right::after { -moz-transform: translate3d(0, 0, 1px) rotate(-45deg); -ms-transform: translate3d(0, 0, 1px) rotate(-45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(-45deg); transform: translate3d(0, 0, 1px) rotate(-45deg); }
#page-home .box-right::after { bottom: auto; top: -35px; }
#page-home .quotes.vp-on-20 .characters .char { -moz-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); }
#page-home .quotes ul { position: relative; padding: 30px 0 40px; overflow: hidden; width: 100%; }
#page-home .quotes ul::after { background: url('../img/home/quotes-shadow.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 9px; width: 313px; -moz-transform: scaleY(-1); -ms-transform: scaleY(-1); -webkit-transform: scaleY(-1); transform: scaleY(-1); content: ''; position: absolute; bottom: 0; left: 50%; margin-left: -156.5px; }
#page-home .quotes ul li { -moz-transition: -moz-transform 0.6s ease, opacity 0.6s ease; -o-transition: -o-transform 0.6s ease, opacity 0.6s ease; -webkit-transition: -webkit-transform 0.6s ease, opacity 0.6s ease; transition: transform 0.6s ease, opacity 0.6s ease; -moz-transform: translateY(100%) scale(0); -ms-transform: translateY(100%) scale(0); -webkit-transform: translateY(100%) scale(0); transform: translateY(100%) scale(0); position: absolute; top: 30px; opacity: 0; }
#page-home .quotes ul li.is-active { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; position: static; opacity: 1; }
#page-home .quotes ul p { text-align: center; font-size: 1.5rem; }
#page-home .quotes ul p span { font-weight: bold; font-style: italic; font-size: 1.125rem; display: block; }
#page-home .quotes .characters { width: 313px; height: 83px; margin: 0 auto; overflow: hidden; position: relative; }
#page-home .quotes .characters .char { -moz-transform: translateY(100%); -ms-transform: translateY(100%); -webkit-transform: translateY(100%); transform: translateY(100%); -moz-transition: -moz-transform 0.4s ease; -o-transition: -o-transform 0.4s ease; -webkit-transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; background: url('../img/home/quotes-sprite.png?1456424088') left top no-repeat; width: 107px; height: 83px; position: absolute; bottom: 0; left: 49px; }
#page-home .quotes .characters .luigi { -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; -webkit-transition-delay: 0.2s; transition-delay: 0.2s; background-position: -107px 0; left: 100px; }
#page-home .quotes .characters .mario-paper { -moz-transition-delay: 0.1s; -o-transition-delay: 0.1s; -webkit-transition-delay: 0.1s; transition-delay: 0.1s; background-position: -214px 0; left: 156px; }
#page-home .quotes .characters::after { background: url('../img/home/quotes-shadow.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 9px; width: 313px; content: ''; position: absolute; bottom: 0; left: 0; }
#page-home #print-play.vp-on-20 .txt { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; opacity: 1; text-align: center; }
#page-home #print-play.vp-on-20 .papers:after, #page-home #print-play.vp-on-20 .papers:before { -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); -moz-transition: all 0.4s ease 1.6s; -o-transition: all 0.4s ease 1.6s; -webkit-transition: all 0.4s ease; -webkit-transition-delay: 1.6s; transition: all 0.4s ease 1.6s; opacity: 1; }
#page-home #print-play.vp-on-20 .papers .paper-char { -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); opacity: 1; }
#page-home #print-play.vp-on-20 .papers .paper-char:nth-child(1) { -moz-transition-delay: 0.3s; -o-transition-delay: 0.3s; -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
#page-home #print-play.vp-on-20 .papers .paper-char:nth-child(2) { -moz-transition-delay: 0.6s; -o-transition-delay: 0.6s; -webkit-transition-delay: 0.6s; transition-delay: 0.6s; }
#page-home #print-play.vp-on-20 .papers .paper-char:nth-child(3) { -moz-transition-delay: 0.9s; -o-transition-delay: 0.9s; -webkit-transition-delay: 0.9s; transition-delay: 0.9s; }
#page-home #print-play.vp-on-20 .papers .paper-char:nth-child(4) { -moz-transition-delay: 1.2s; -o-transition-delay: 1.2s; -webkit-transition-delay: 1.2s; transition-delay: 1.2s; }
#page-home #print-play .txt { -moz-transition: all 0.4s ease 0.4s; -o-transition: all 0.4s ease 0.4s; -webkit-transition: all 0.4s ease; -webkit-transition-delay: 0.4s; transition: all 0.4s ease 0.4s; -moz-transform: translateX(-200px); -ms-transform: translateX(-200px); -webkit-transform: translateX(-200px); transform: translateX(-200px); margin-bottom: 10px; opacity: 0; }
#page-home #print-play .padding-box { padding: 0 0 0 0.5em; margin-right: -1em; }
#page-home #print-play .papers { width: 90%; margin: 0 auto; position: relative; }
#page-home #print-play .papers:after, #page-home #print-play .papers:before { content: ''; position: absolute; top: 0; opacity: 0; -moz-transform: scale(0.2); -ms-transform: scale(0.2); -webkit-transform: scale(0.2); transform: scale(0.2); }
#page-home #print-play .papers:before { right: 100%; top: 50%; margin-top: -81px; width: 84px; height: 162px; background: url('../img/stars-left.png?1456424088') no-repeat left top; background-size: 84px 162px; }
#page-home #print-play .papers:after { left: 100%; top: 50%; margin-top: -60.5px; width: 42px; height: 121px; background: url('../img/stars-right.png?1456424088') no-repeat left top; background-size: 42px 121px; }
#page-home #print-play .papers .paper-char { width: 25%; padding: 2%; height: auto; opacity: 0; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
#page-home #print-play .button { position: relative; overflow: hidden; padding: 0.3em; }
#page-home #print-play .button::after, #page-home #print-play .button::before { position: absolute; background-color: #ff8e00; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
#page-home #print-play .button::after, #page-home #print-play .button::before { height: 80px; width: 40px; }
#page-home #print-play .button::before { content: ''; left: -15px; }
#page-home #print-play .button::after { content: ''; right: -15px; }
#page-home #print-play .button::before, #page-home #print-play .button::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
#page-home #print-play .button::before { bottom: auto; top: -35px; }
#page-home #print-play .button::after { top: auto; bottom: -35px; }

@media only screen and (max-width: 40em) { #page-home #main-3ds-logo { right: auto; left: 90px; margin-right: -20px; top: 37px; } }
@media only screen and (min-width: 40.063em) { #page-home #main-3ds-logo { top: 37px; }
  #page-home #intro-particles { display: block; position: absolute; top: 0; left: 0; z-index: 1; pointer-events: none; }
  #page-home .top-logo { height: 444px; width: 578.4px; padding: 0px; }
  #page-home .intro-char { position: absolute; bottom: 0; }
  #page-home .intro-char.char-1, #page-home .intro-char.char-2, #page-home .intro-char.char-3, #page-home .intro-char.char-4 { -moz-transform: translateY(250px); -ms-transform: translateY(250px); -webkit-transform: translateY(250px); transform: translateY(250px); position: absolute; }
  #page-home .intro-char.char-1 { background: url('../img/home/intro-char-1.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 197px; width: 284px; }
  #page-home .intro-char.char-2 { background: url('../img/home/intro-char-2.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 209px; width: 118px; }
  #page-home .intro-char.char-3 { background: url('../img/home/intro-char-3.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 188px; width: 127px; }
  #page-home .intro-char.char-4 { background: url('../img/home/intro-char-4.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 204px; width: 256px; }
  #page-home .intro-char.char-1 { left: 50%; margin-left: 194px; bottom: 12px; }
  #page-home .intro-char.char-2 { left: 50%; margin-left: 139px; bottom: 0; }
  #page-home .intro-char.char-3 { left: 50%; margin-left: -266px; bottom: 0; }
  #page-home .intro-char.char-4 { left: 50%; margin-left: -473px; bottom: 9px; }
  #page-home #print-play .txt { text-align: left; margin-bottom: 0; } }
@media only screen and (min-width: 40.063em) and (max-width: 54em) { #page-home .divider.middle .sliding-box h2 { font-size: 2.5vw; }
  #page-home .divider.middle .sliding-box .sliding-box-text::before { border-top-width: 20px; border-left-width: 32vw; } }
@media only screen and (min-width: 54.063em) { #page-home header[role="navigation"] { z-index: 0; }
  #page-home header[role="navigation"] nav { z-index: 0; }
  #page-home.is-fixed header[role="navigation"] { z-index: 3; }
  #page-home.is-fixed header[role="navigation"] nav { z-index: 2; }
  #page-home #main-3ds-logo { top: 28px; }
  #page-home #main-3ds-logo img { max-width: 137px; }
  #page-home .top-logo { height: 555px; width: 723px; } }
@media only screen and (min-width: 54.063em) and (max-width: 71em) { #page-home .divider.middle .sliding-box h2 { font-size: 1.8125rem; } }
.retailers-modal { position: fixed !important; }

div.preview-overlay { z-index: 5 !important; }

#buyNowFallback { display: inherit; width: 0; height: 0; }

#main-buy-fallback { position: fixed; top: 70px; right: 0; overflow: hidden; width: 100%; height: 100%; pointer-events: none; z-index: 100; }
#main-buy-fallback > div { width: 100%; height: 100%; background: url('../img/chess-pattern.jpg?1456424088') right top; top: 0; position: absolute; right: 0; }

#main-buy { background: url('../img/chess-pattern.jpg?1456424088'); position: fixed; top: 70px; right: 0; z-index: 100; width: 100%; height: 100vh; -webkit-clip-path: polygon(100% 0px, 100% 0px, 100% 190px); opacity: 0; pointer-events: none; }
#main-buy .wrapper { padding: 1px 0 0 0; margin-bottom: 100px; }
#main-buy .buy-dupli { margin-top: 30px; }
#main-buy .buy-dupli #nintendo-footer { margin-top: 80px; }
#main-buy .buy-dupli #nintendo-footer > div, #main-buy .buy-dupli #nintendo-footer a { color: black !important; }
#main-buy .buy-dupli.legal { font-size: 0.75rem; text-align: center; }
#main-buy .buy-dupli.legal a { color: inherit; text-decoration: none; }
#main-buy .buy-dupli.legal a:hover { color: #28a6ee; }
#main-buy .retailer-buttons { margin-top: 20px; }
#main-buy .retailer-buttons .retailer-buttons-us, #main-buy .retailer-buttons .retailer-buttons-ca { display: inline-block; width: 80px; height: 80px; }
#main-buy .retailer-buttons .retailer-buttons-us a, #main-buy .retailer-buttons .retailer-buttons-ca a { box-shadow: 1px 4px 0 0 rgba(0, 0, 0, 0.25); border: solid 7px white; background-position: center center; background-size: 100px auto; border-radius: 50%; display: block; text-indent: 100%; white-space: nowrap; overflow: hidden; width: 100%; height: 100%; }
#main-buy .retailer-buttons .retailer-buttons-us a:hover, #main-buy .retailer-buttons .retailer-buttons-ca a:hover { -moz-transform: translateY(2px); -ms-transform: translateY(2px); -webkit-transform: translateY(2px); transform: translateY(2px); box-shadow: 1px 2px 0px 0px rgba(0, 0, 0, 0.25); }
#main-buy .retailer-buttons-us { margin-right: 20px; }
#main-buy .retailer-buttons-us a { background-image: url('../img/buy-now/flag-us.jpg?1456424088'); }
#main-buy .retailer-buttons-ca a { background-image: url('../img/buy-now/flag-ca.jpg?1456424088'); background-size: 140px auto; background-repeat: no-repeat; background-color: white; }
#main-buy .retailer { font-size: 1.125rem; }
#main-buy .retailer .retailer-buttons { margin: 30px 0; }
#main-buy .retailer .img { text-align: center; }
#main-buy .retailer .img img { max-width: 100%; }
#main-buy .title { background: url('../img/buy-now/tittle-bg.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 130px; width: 338px; display: block; margin: 40px auto 65px; }
#main-buy .title span { -moz-transform: translate(-3px, 43px) rotate(-3deg); -ms-transform: translate(-3px, 43px) rotate(-3deg); -webkit-transform: translate(-3px, 43px) rotate(-3deg); transform: translate(-3px, 43px) rotate(-3deg); display: block; text-align: center; color: white; font-size: 0.9em; line-height: 1; }
#main-buy #digital { margin-bottom: 60px; }
#main-buy #digital .eshop { margin-top: 5px; display: block; }
#main-buy #digital .eshop img { max-width: 266px; }
#main-buy #retail { margin-bottom: 0; }
#main-buy #retail img { border-radius: 6px; box-shadow: 0px 0px 9px 3px rgba(0, 0, 0, 0.25); }

#main-buy-peek { position: fixed; z-index: 100; right: 0; top: 70px; height: 190px; width: 190px; }
#main-buy-peek .fold { height: 250px; width: 250px; background: url('../img/buy-now/corner-fold_2x.png?1456424088') left top no-repeat; background-size: 100% auto; position: absolute; top: 0; right: 0; pointer-events: none; }
#main-buy-peek .button { position: absolute; top: -10px; }
#main-buy-peek .close { -moz-transition: -moz-transform 0.8s cubic-bezier(0.59, 0.01, 0.35, 1.32); -o-transition: -o-transform 0.8s cubic-bezier(0.59, 0.01, 0.35, 1.32); -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.59, 0.01, 0.35, 1.32); transition: transform 0.8s cubic-bezier(0.59, 0.01, 0.35, 1.32); -moz-transform: translateY(-100px); -ms-transform: translateY(-100px); -webkit-transform: translateY(-100px); transform: translateY(-100px); right: 18px; }
#main-buy-peek .open { -moz-transition: -moz-transform 0.8s cubic-bezier(0.73, -0.3, 0.14, 0.97); -o-transition: -o-transform 0.8s cubic-bezier(0.73, -0.3, 0.14, 0.97); -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.73, -0.3, 0.14, 0.97); transition: transform 0.8s cubic-bezier(0.73, -0.3, 0.14, 0.97); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); transform: rotate(-3deg); right: 14px; top: -11px; }
#main-buy-peek .pack { -moz-transition: -moz-transform 0.8s ease; -o-transition: -o-transform 0.8s ease; -webkit-transition: -webkit-transform 0.8s ease; transition: transform 0.8s ease; max-width: 99px; position: absolute; top: 28px; right: 18px; }

body.is-buy { overflow: hidden; }
body.is-buy #main-buy { pointer-events: auto; overflow: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; }
body.is-buy #main-buy .wrapper { -webkit-transform: translateZ(0); }
body.is-buy #main-buy-peek .pack { -moz-transform: translateX(200px); -ms-transform: translateX(200px); -webkit-transform: translateX(200px); transform: translateX(200px); }
body.is-buy #main-buy-peek .open { -moz-transform: translateY(-100px); -ms-transform: translateY(-100px); -webkit-transform: translateY(-100px); transform: translateY(-100px); }
body.is-buy #main-buy-peek .close { -moz-transform: rotate(3deg) translateY(0); -ms-transform: rotate(3deg) translateY(0); -webkit-transform: rotate(3deg) translateY(0); transform: rotate(3deg) translateY(0); }

html.cssclippathpolygon #main-buy { opacity: 1; }

html.no-cssclippathpolygon #main-buy { -moz-transition: opacity 0.4s ease 0.8s; -o-transition: opacity 0.4s ease 0.8s; -webkit-transition: opacity 0.4s ease; -webkit-transition-delay: 0.8s; transition: opacity 0.4s ease 0.8s; background: none; opacity: 0; pointer-events: none; }
html.no-cssclippathpolygon body.is-buy #main-buy { -moz-transition-delay: 1s; -o-transition-delay: 1s; -webkit-transition-delay: 1s; transition-delay: 1s; opacity: 1; pointer-events: auto; }

html.no-supports #main-buy, body.is-edge #main-buy { -moz-transition-delay: 0s; -o-transition-delay: 0s; -webkit-transition-delay: 0s; transition-delay: 0s; background: url('../img/chess-pattern.jpg?1456424088'); z-index: -1; }
html.no-supports #main-buy-peek .fold, body.is-edge #main-buy-peek .fold { -moz-transition: opacity 0.4s ease; -o-transition: opacity 0.4s ease; -webkit-transition: opacity 0.4s ease; transition: opacity 0.4s ease; }
html.no-supports #main-buy-peek::before, body.is-edge #main-buy-peek::before { content: ''; display: block; position: absolute; right: 0; top: 0; width: 250px; height: 250px; background: url('../img/buy-now/corner-fold-fallback.png?1456424088') right top no-repeat; background-size: 100% auto; }

html.no-supports body.is-buy #main-buy, body.is-edge.is-buy #main-buy { -moz-transition-delay: 0s; -o-transition-delay: 0s; -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-clip-path: none; z-index: 100; }
html.no-supports body.is-buy #main-buy-peek .fold, body.is-edge.is-buy #main-buy-peek .fold { opacity: 0; }
html.no-supports body.is-buy #main-buy-peek::before, body.is-edge.is-buy #main-buy-peek::before { opacity: 0; }

.lang-fr #main-buy-peek .button { font-size: 0.75rem; text-align: center; }
.lang-fr #main-buy-peek .button span { padding-left: 15px; padding-right: 15px; }
.lang-fr #main-buy-peek .pack { top: 32px; }
.lang-fr #main-buy .title span { -moz-transform: translate(-3px, 29px) rotate(-3deg); -ms-transform: translate(-3px, 29px) rotate(-3deg); -webkit-transform: translate(-3px, 29px) rotate(-3deg); transform: translate(-3px, 29px) rotate(-3deg); }

.lang-es #main-buy-peek .button { cursor: default; font-size: 0.75rem; text-align: center; }
.lang-es #main-buy-peek .button span { padding-left: 6px; padding-right: 6px; }
.lang-es #main-buy-peek .pack:hover { cursor: default; }
.lang-es #main-buy-peek:hover img { -moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none; -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); transform: scale(1, 1); }

@media only screen and (max-width: 40em) { #main-buy .title { width: 268px; margin: 10px auto 15px; }
  #main-buy .title span { font-size: 0.8em; padding-top: 5px; }
  #main-buy .retailer { text-align: center; }
  #main-buy-peek { height: 90px; width: 90px; }
  #main-buy-peek .pack, #main-buy-peek .open, #main-buy-peek .fold { display: none; }
  html.no-cssclippathpolygon header[role="navigation"] { -moz-transition: z-index 0s ease 2s; -o-transition: z-index 0s ease 2s; -webkit-transition: z-index 0s ease; -webkit-transition-delay: 2s; transition: z-index 0s ease 2s; z-index: 100; }
  html.no-cssclippathpolygon body.is-buy header[role="navigation"] { -moz-transition-delay: 0s; -o-transition-delay: 0s; -webkit-transition-delay: 0s; transition-delay: 0s; z-index: 3; } }
@media only screen and (max-width: 768px) { #main-buy-peek { top: 96px; }
  #main-buy-fallback { top: 96px; } }
@media only screen and (min-width: 40.063em) { #main-buy { -webkit-clip-path: polygon(calc(100% - 190px) 0px, 100% 0px, 100% 190px); } }
@media only screen and (min-width: 40.063em) and (max-width: 54em) { #main-buy-peek { height: 93px; }
  #main-buy-peek .pack { top: 21px; right: 5px; }
  html.no-cssclippathpolygon #main-buy { -moz-transition: opacity 0.4s ease 0.8s, z-index 0s 2s; -o-transition: opacity 0.4s ease 0.8s, z-index 0s 2s; -webkit-transition: opacity 0.4s ease, z-index 0s; -webkit-transition-delay: 0.8s, 2s; transition: opacity 0.4s ease 0.8s, z-index 0s 2s; z-index: 3; }
  html.no-cssclippathpolygon body.is-buy #main-buy { -moz-transition-delay: 1s, 0s; -o-transition-delay: 1s, 0s; -webkit-transition-delay: 1s, 0s; transition-delay: 1s, 0s; z-index: 100; } }
@media only screen and (min-width: 54.063em) { #main-buy-peek .pack:hover { cursor: pointer; }
  #main-buy-peek:hover img { -moz-transition: -moz-transform 0.4s ease; -o-transition: -o-transform 0.4s ease; -webkit-transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; -moz-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); } }
@media only screen and (min-width: 54.063em) and (max-width: 71em) { #main-buy { -webkit-clip-path: polygon(calc(100% - 144px) 0px, 100% 0px, 100% 144px); }
  #main-buy-peek { height: 142px; width: 142px; }
  #main-buy-peek .pack { max-width: 82px; right: 3px; top: 24px; }
  #main-buy-peek .fold { height: 190px; width: 190px; }
  #main-buy-peek .button > span { padding-left: 14px; padding-right: 14px; }
  html.no-supports #main-buy-peek::before, body.is-edge #main-buy-peek::before { width: 190px; height: 190px; }
  .lang-fr #main-buy-peek .button span { padding-left: 5px; padding-right: 5px; }
  .lang-fr #main-buy-peek .pack { max-width: 70px; right: 3px; } }
/* . ======================================= Author           email            Created         2015-12-10 13:30:11 Description     . Edited by        Edited          2016-01-05 11:55:29
*/
#page-videos .feature-video-header { text-align: center; }
#page-videos .main-top h1, #page-videos .main-top h2 { color: #a447c6; text-align: center; }
#page-videos .intro { padding-bottom: 70px; }
#page-videos .sliding-box .play-btn { -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; width: 86px; height: 60px; top: 50%; left: 50%; }
#page-videos .sliding-box .play-btn::before { -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in; content: ''; background: rgba(255, 63, 0, 0.75); border: solid 4px #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#page-videos .sliding-box .play-btn::after { content: ''; position: absolute; background: url('../img/arrow.svg?1456424083') no-repeat center center; top: 50%; left: 50%; margin-left: -16px; margin-top: -14px; width: 32px; height: 28px; }
#page-videos .sliding-box .play-btn .paper { position: absolute; width: 100%; height: 100%; background: red; }
#page-videos .sliding-box:hover .play-btn::before { background: #ff3f00; }
#page-videos .sliding-box .play-btn { top: 38%; }
#page-videos .sliding-box-text h2 { color: #a447c6; font-size: 1.5rem; margin-bottom: 0; }
#page-videos .secondary-videos .sliding-box { margin-bottom: 20px; }

@media only screen and (max-width: 40em) { #page-videos .intro .feature-video-header { margin-bottom: 20px; } }
@media only screen and (min-width: 40.063em) { #page-videos .main-top { margin-top: 0; }
  #page-videos .sliding-box-text { height: 32%; }
  #page-videos .sliding-box-text h2 { font-size: 1.25rem; } }
@media only screen and (min-width: 54.063em) { #page-videos .intro { padding-bottom: 50px; }
  #page-videos .main-top { margin-top: 130px; }
  #page-videos .main-top .content-title { -moz-animation: VideoTopTxt 0.8s ease; -webkit-animation: VideoTopTxt 0.8s ease; animation: VideoTopTxt 0.8s ease; }
  #page-videos .main-top .main-video-left { -moz-animation: VideoTopVideoLeft 0.8s ease; -webkit-animation: VideoTopVideoLeft 0.8s ease; animation: VideoTopVideoLeft 0.8s ease; }
  #page-videos .main-top .main-video-right { -moz-animation: VideoTopVideoRight 0.8s ease; -webkit-animation: VideoTopVideoRight 0.8s ease; animation: VideoTopVideoRight 0.8s ease; }
  #page-videos .sliding-box-text { height: 34%; }
  #page-videos .sliding-box-text h2 { font-size: 1.5rem; } }
@media only screen and (min-width: 54.063em) and (max-width: 71em) { #page-videos .main-top { margin-top: 110px; } }
@-moz-keyframes StoryTopImage { 0% { transform-origin: 50% 30%; transform: translate(200px, -150px) scale(0); }
  50% { transform: translate(-100px, -50px) scale(0.5); }
  100% { transform: none; } }
@-webkit-keyframes StoryTopImage { 0% { transform-origin: 50% 30%; transform: translate(200px, -150px) scale(0); }
  50% { transform: translate(-100px, -50px) scale(0.5); }
  100% { transform: none; } }
@keyframes StoryTopImage { 0% { transform-origin: 50% 30%; transform: translate(200px, -150px) scale(0); }
  50% { transform: translate(-100px, -50px) scale(0.5); }
  100% { transform: none; } }
#page-story .main-top h1 { color: #ffd000; }
#page-story .primary-color h2 { color: #ffd000; }
#page-story .secondary-color h2 { color: #ff3f00; }
#page-story .main-top { background-position: center -10%; }
#page-story .main-top .main-img { position: relative; z-index: 1; margin-bottom: -40px; }
#page-story .main-top + .divider .divider-wrapper { padding-bottom: 0; }
#page-story .split-bg .txt { padding-top: 20px; padding-bottom: 20px; }
#page-story .split-bg .img img { margin: 0 auto; position: relative; z-index: 1; }
#page-story .speech-bubble { background: white; border: solid 2px black; position: absolute; padding: 13px 19px; border-radius: 10px; font-weight: bold; font-size: 1.25rem; top: 0; text-align: center; line-height: 1.1em; z-index: 1; color: black; }
#page-story .speech-bubble :last-child { margin-bottom: 0px; }
#page-story .speech-bubble::after { content: ''; background: url('../img/speech-bubble-tip.svg?1456424088') left top no-repeat; position: absolute; top: 98%; left: 12%; width: 26.71px; height: 29.41px; }
#page-story .video-3ds { margin-top: 20px; position: relative; display: block; }
#page-story .video-3ds .play-btn { -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; width: 86px; height: 60px; top: 50%; left: 50%; }
#page-story .video-3ds .play-btn::before { -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in; content: ''; background: rgba(255, 63, 0, 0.75); border: solid 4px #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#page-story .video-3ds .play-btn::after { content: ''; position: absolute; background: url('../img/arrow.svg?1456424083') no-repeat center center; top: 50%; left: 50%; margin-left: -16px; margin-top: -14px; width: 32px; height: 28px; }
#page-story .video-3ds .play-btn .paper { position: absolute; width: 100%; height: 100%; background: red; }
#page-story .video-3ds:hover .play-btn::before { background: #ff3f00; }
#page-story .video-3ds .play-btn { top: 37%; }
#page-story .video-3ds img { margin: 0 auto; }
#page-story #mario { background: url('../img/chess-pattern-yellow.jpg?1456424088'); }
#page-story #mario .speech-bubble { left: 62%; top: 8px; }
#page-story #peach { background: #fbe643; }
#page-story #peach .speech-bubble { max-width: 250px; bottom: 30%; top: auto; right: 7%; }
#page-story #peach .speech-bubble::after { -moz-transform: scaleY(-1); -ms-transform: scaleY(-1); -webkit-transform: scaleY(-1); transform: scaleY(-1); top: auto; bottom: 98%; }
#page-story #toad { background: url('../img/characters-bg.jpg?1456424087'); }
#page-story #toad .img { padding-top: 100px; }
#page-story #toad .speech-bubble { max-width: 215px; top: 15px; left: 28%; }
#page-story #bowser { background: #ff3f00; }
#page-story #bowser .img { padding-top: 60px; }
#page-story #bowser .speech-bubble { top: 10px; left: 25%; }
#page-story #bjr { background: url('../img/chess-pattern-red.jpg?1456424087'); }
#page-story #bjr .img { padding-top: 33px; }
#page-story #bjr .speech-bubble { bottom: 12px; left: 40%; top: auto; }
#page-story #bjr .speech-bubble::after { -moz-transform: scale(-1, -1); -ms-transform: scale(-1, -1); -webkit-transform: scale(-1, -1); transform: scale(-1, -1); top: auto; bottom: 98%; }
#page-story #bottom h2 { color: white; margin-bottom: 25px; }
#page-story #bottom .txt { text-align: center; margin-bottom: 20px; margin-top: 20px; }
#page-story #bottom .img { text-align: center; position: relative; }
#page-story #bottom .starlow .speech-bubble { right: 5%; left: auto; top: auto; bottom: 10px; max-width: 280px; }
#page-story #bottom .starlow .speech-bubble::after { -moz-transform: scaleY(-1); -ms-transform: scaleY(-1); -webkit-transform: scaleY(-1); transform: scaleY(-1); top: auto; bottom: 98%; }
#page-story #bottom .toadette .speech-bubble { max-width: 240px; top: auto; bottom: 17px; left: 7%; }
#page-story #bottom .toadette .speech-bubble::after { -moz-transform: scale(-1, -1); -ms-transform: scale(-1, -1); -webkit-transform: scale(-1, -1); transform: scale(-1, -1); top: auto; bottom: 98%; }

@media only screen and (max-width: 40em) { #page-story #peach .speech-bubble { bottom: 10%; } }
@media only screen and (max-width: 40em), only screen and (min-width: 40.063em) and (max-width: 54em) { #page-story .split-bg .img { padding: 20px; }
  #page-story .split-bg .img img { max-height: 220px; margin: 0px auto; } }
@media only screen and (min-width: 40.063em) and (max-width: 54em) { #page-story .main-top h1 { text-align: left; }
  #page-story .split-bg .img img { max-height: 220px; margin: 20px auto; }
  #page-story #peach .speech-bubble { bottom: 10%; } }
@media only screen and (min-width: 40.063em) { #page-story .main-top .main-img { margin-bottom: -50px; }
  #page-story .main-top + .divider .divider-wrapper { padding-top: 0; }
  #page-story #top .txt, #page-story #peach .txt, #page-story #bowser .txt { -ms-flex-order: 1; -webkit-flex-order: 1; -webkit-order: 1; order: 1; }
  #page-story #top .img, #page-story #peach .img, #page-story #bowser .img { -ms-flex-order: 0; -webkit-flex-order: 0; -webkit-order: 0; order: 0; }
  #page-story .video-3ds { margin-top: -20px; position: relative; }
  #page-story #bottom .text { margin-bottom: 0; } }
@media only screen and (min-width: 54.063em) { #page-story .main-top .main-img { -moz-animation: StoryTopImage 0.6s linear; -webkit-animation: StoryTopImage 0.6s linear; animation: StoryTopImage 0.6s linear; }
  #page-story .main-top .content-title { -moz-animation: BattleTopTxt 1s ease; -webkit-animation: BattleTopTxt 1s ease; animation: BattleTopTxt 1s ease; }
  #page-story .split-bg .img, #page-story .split-bg .txt { padding-bottom: 0; padding-top: 0; }
  #page-story .speech-bubble { padding: 20px 18px; }
  #page-story #mario .speech-bubble { padding: 20px 32px; left: 63%; top: -17px; }
  #page-story #mario .img img { margin-top: -40px; margin-bottom: -8px; position: relative; }
  #page-story #peach .img { z-index: 1; }
  #page-story #peach .img img { margin-top: -34px; margin-bottom: -39px; }
  #page-story #toad .img { padding-bottom: 20px; }
  #page-story #toad .speech-bubble { left: 40%; }
  #page-story #bowser .speech-bubble { right: 8%; left: auto; top: -10px; }
  #page-story #bowser .img { padding-top: 30px; z-index: 1; }
  #page-story #bowser .img img { margin-bottom: -6px; }
  #page-story #bjr .img { z-index: 1; }
  #page-story #bjr .speech-bubble { max-width: 210px; bottom: auto; top: 129px; right: 5%; left: auto; }
  #page-story #bjr .speech-bubble::after { -moz-transform: scale(1, -1); -ms-transform: scale(1, -1); -webkit-transform: scale(1, -1); transform: scale(1, -1); }
  #page-story #bjr .img { padding-top: 0; }
  #page-story #bjr .img img { margin-top: -30px; margin-bottom: -20px; }
  #page-story #bottom .toadette { margin-right: 8.33333%; }
  #page-story #bottom .starlow { margin-left: 8.33333%; }
  #page-story #bottom .starlow .img { text-align: left; } }
@media only screen and (min-width: 71.063em) { #page-story #toad .speech-bubble { top: -15px; left: 45%; }
  #page-story #toad .img { padding-top: 60px; }
  #page-story #bottom .toadette .speech-bubble { bottom: 47px; left: -26%; }
  #page-story #bottom .starlow .speech-bubble { right: -13%; bottom: 40px; } }
#page-battle .main-top h1 { color: #5cb324; }
#page-battle .primary-color h2 { color: #5cb324; }
#page-battle .secondary-color h2 { color: #28a6ee; }
#page-battle .main-top .main-img { position: relative; z-index: 1; margin-bottom: -100px; }
#page-battle .main-top + .divider .divider-wrapper { padding-top: 100px; }
#page-battle .main-top + .divider .txt { margin-top: 30px; }
#page-battle .split-bg .txt, #page-battle #bros .txt, #page-battle #bottom .txt { padding-top: 20px; padding-bottom: 20px; z-index: 1; }
#page-battle .split-bg .img { padding: 0; }
#page-battle .video { display: table; position: relative; }
#page-battle .video .play-btn { -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; width: 86px; height: 60px; top: 50%; left: 50%; }
#page-battle .video .play-btn::before { -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in; content: ''; background: rgba(255, 63, 0, 0.75); border: solid 4px #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#page-battle .video .play-btn::after { content: ''; position: absolute; background: url('../img/arrow.svg?1456424083') no-repeat center center; top: 50%; left: 50%; margin-left: -16px; margin-top: -14px; width: 32px; height: 28px; }
#page-battle .video .play-btn .paper { position: absolute; width: 100%; height: 100%; background: red; }
#page-battle .video:hover .play-btn::before { background: #ff3f00; }
#page-battle .video-card { padding: 0.4em; }
#page-battle .video-card::before { display: none; }
#page-battle #paper { background: url('../img/chess-pattern-green.jpg?1456424087'); }
#page-battle #paper .img { background: url('../img/battle/thumb-paper-cut-noslice.jpg?1456424088') left top no-repeat; background-size: cover; }
#page-battle #paper .img img { visibility: hidden; }
#page-battle #bros { background-color: #5cb324; padding-top: 60px; padding-bottom: 60px; }
#page-battle #triple { background: url('../img/characters-bg-green.jpg?1456424086'); }
#page-battle #triple .img { background: url('../img/battle/thumb-triple-trouble-noslice.jpg?1456424088') left top no-repeat; background-size: cover; }
#page-battle #triple .img img { visibility: hidden; }

@media only screen and (min-width: 40.063em) { #page-battle .main-top + .divider .txt { margin-top: 0; }
  #page-battle .split-bg .txt + .img { padding-left: 0; }
  #page-battle .split-bg .txt, #page-battle #bros .txt, #page-battle #bottom .txt { padding-top: 0; padding-bottom: 0; }
  #page-battle #top .txt, #page-battle #peach .txt, #page-battle #bowser .txt { -ms-flex-order: 1; -webkit-flex-order: 1; -webkit-order: 1; order: 1; }
  #page-battle #top .img, #page-battle #peach .img, #page-battle #bowser .img { -ms-flex-order: 0; -webkit-flex-order: 0; -webkit-order: 0; order: 0; }
  #page-battle .video-3ds { margin-top: -20px; position: relative; }
  #page-battle #bottom .text { margin-bottom: 0; } }
@media only screen and (min-width: 40.063em) and (max-width: 54em) { #page-battle .main-top .main-img { margin-bottom: 0; }
  #page-battle .main-top + .divider .divider-wrapper { padding-top: 50px; } }
@media only screen and (min-width: 54.063em) { #page-battle .main-top .main-img { -moz-animation: BattleTopImage 0.8s ease; -webkit-animation: BattleTopImage 0.8s ease; animation: BattleTopImage 0.8s ease; }
  #page-battle .main-top .content-title { -moz-animation: BattleTopTxt 1s ease; -webkit-animation: BattleTopTxt 1s ease; animation: BattleTopTxt 1s ease; }
  #page-battle #paper .img, #page-battle #triple .img { background: none; }
  #page-battle #paper .img img, #page-battle #triple .img img { visibility: visible; }
  #page-battle #paper .img::after, #page-battle #triple .img::after { -moz-transition: -moz-transform 0.6s ease 0.4s, opacity 0.6s ease 0.4s; -o-transition: -o-transform 0.6s ease 0.4s, opacity 0.6s ease 0.4s; -webkit-transition: -webkit-transform 0.6s ease, opacity 0.6s ease; -webkit-transition-delay: 0.4s, 0.4s; transition: transform 0.6s ease 0.4s, opacity 0.6s ease 0.4s; background: url('../img/battle/paper-cuts.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 355px; width: 403px; content: ''; position: absolute; right: 0; top: -10px; }
  #page-battle #triple { position: relative; z-index: 1; }
  #page-battle #triple .img::after { -moz-transition-timing-function: cubic-bezier(0.13, 0.84, 0.86, 1); -o-transition-timing-function: cubic-bezier(0.13, 0.84, 0.86, 1); -webkit-transition-timing-function: cubic-bezier(0.13, 0.84, 0.86, 1); transition-timing-function: cubic-bezier(0.13, 0.84, 0.86, 1); background: url('../img/battle/triple-trouble.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 426px; width: 505px; -moz-transform: translate(200px, 400px) scale(0); -ms-transform: translate(200px, 400px) scale(0); -webkit-transform: translate(200px, 400px) scale(0); transform: translate(200px, 400px) scale(0); -moz-transform-origin: 100% 100%; -ms-transform-origin: 100% 100%; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; right: auto; right: -120px; top: -30px; }
  #page-battle #triple.vp-on-40 .img::after { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; }
  #page-battle #bros .img, #page-battle #bottom .img { position: relative; }
  #page-battle #bros .img::after, #page-battle #bottom .img::after { -moz-transition: -moz-transform 0.6s ease 0.4s, opacity 0.6s ease 0.4s; -o-transition: -o-transform 0.6s ease 0.4s, opacity 0.6s ease 0.4s; -webkit-transition: -webkit-transform 0.6s ease, opacity 0.6s ease; -webkit-transition-delay: 0.4s, 0.4s; transition: transform 0.6s ease 0.4s, opacity 0.6s ease 0.4s; background: url('../img/battle/bros.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 460px; width: 481px; content: ''; position: absolute; right: 56%; top: -137px; z-index: 1; }
  #page-battle #bros .img .video-card, #page-battle #bottom .img .video-card { position: relative; z-index: 1; }
  #page-battle #bros .img { z-index: 1; }
  #page-battle #bottom .img::after { background: url('../img/battle/toadette.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 387px; width: 369px; right: 86%; top: -31px; }
  #page-battle #paper .img .video-card, #page-battle #bros .img .video-card, #page-battle #bottom .img .video-card { z-index: 2; }
  #page-battle #paper .img::after, #page-battle #bros .img::after, #page-battle #bottom .img::after { -moz-transform: translateX(-200px); -ms-transform: translateX(-200px); -webkit-transform: translateX(-200px); transform: translateX(-200px); opacity: 0; }
  #page-battle #paper.vp-on-40 .img::after, #page-battle #bros.vp-on-40 .img::after, #page-battle #bottom.vp-on-40 .img::after { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; opacity: 1; } }
@media only screen and (min-width: 54.063em) and (max-width: 71em) { #page-battle #paper .img::after, #page-battle #triple .img::after { display: none; }
  #page-battle #bros .row-flex, #page-battle #bottom .row-flex { -ms-flex-pack: end; -webkit-flex-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; }
  #page-battle #bros .img::after { width: 331px; top: -130px; right: 71%; }
  #page-battle #bottom .img::after { width: 299px; top: -71px; } }
@media only screen and (min-width: 71.063em) { #page-battle #bros .img, #page-battle #bottom .img { margin-left: 25%; } }
/* . ======================================= Author           email            Created         2015-12-17 12:59:05 Description     . Edited by        Edited          2016-01-07 09:50:50
*/
#page-battle-cards .main-top h1 { color: #ff8e00; }
#page-battle-cards .primary-color h2 { color: #ff8e00; }
#page-battle-cards .secondary-color h2 { color: #28a6ee; }
#page-battle-cards .main-top + .divider .txt { margin-top: 30px; }
#page-battle-cards .main-img { position: relative; z-index: 1; }
#page-battle-cards .video-card { padding: 0.4em; }
#page-battle-cards .video-card::before { display: none; }
#page-battle-cards .divider-top .img { z-index: 2; }
#page-battle-cards #character-cards { margin-top: 30px; }
#page-battle-cards .switcher-nav { display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; -webkit-flex-pack: center; -webkit-justify-content: center; justify-content: center; margin-bottom: 20px; display: none; }
#page-battle-cards .switcher-nav > li { -ms-flex: 1 0 104px 1 auto; -webkit-flex: 1 0 104px 1 auto; flex: 1 0 104px 1 auto; position: relative; width: 104px; height: 104px; margin: 0 5px 30px 5px; }
#page-battle-cards .switcher-nav > li.active a span, #page-battle-cards .switcher-nav > li:hover a span { -moz-transform: scale(1.05); -ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); background: #93d514; }
#page-battle-cards .switcher-nav > li a { position: absolute; width: 104px; height: 104px; margin: 20px 5px; }
#page-battle-cards .switcher-nav > li a span { width: 104px; height: 104px; border-radius: 50%; border: solid 8px #fff; box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.5); background: #f56e00; position: absolute; left: 50%; top: 50%; margin-top: -52px; margin-left: -52px; }
#page-battle-cards .switcher-nav > li img { position: absolute; max-width: none; left: 50%; top: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
#page-battle-cards .videoswitcher-container { position: relative; width: 269.5px; height: 222px; margin: 0 auto; }
#page-battle-cards .videoswitcher-container::after { content: ''; top: 0; left: 0; position: absolute; background: url('../img/battle-cards/3ds_2x.png?1456424088') no-repeat top left; background-size: 100%; width: 100%; height: 100%; }
#page-battle-cards .videoswitcher-container .switcher-items > li { position: absolute; top: 0; left: 0; display: block; opacity: 0; visibility: hidden; width: 100%; height: 100%; }
#page-battle-cards .videoswitcher-container .switcher-items > li.active { visibility: visible; opacity: 1; }
#page-battle-cards .videoswitcher-container .threeds-top { position: absolute; width: 156px; height: 172px; background: #000; top: 20px; left: 58px; }
#page-battle-cards .videoswitcher-container .threeds-top video { max-width: 100%; }
#page-battle-cards .videoswitcher-container .threeds-bottom { position: absolute; width: 174px; height: 68px; bottom: 38px; left: 75px; }
#page-battle-cards .videoswitcher-container .threeds-bottom .starburst { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#page-battle-cards .videoswitcher-container .amiibos { position: absolute; z-index: 2; bottom: 0px; left: 70%; width: 80px; height: 170px; }
#page-battle-cards .videoswitcher-container .amiibos > .item { position: absolute; bottom: 0; left: 0; display: block; opacity: 0; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; -moz-transform: translate3d(200%, 0, 0); -ms-transform: translate3d(200%, 0, 0); -webkit-transform: translate3d(200%, 0, 0); transform: translate3d(200%, 0, 0); }
#page-battle-cards .videoswitcher-container .amiibos > .item.active { opacity: 1; -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
#page-battle-cards .videoswitcher-container .amiibos > .item img { position: absolute; bottom: 0; left: 0; max-width: none; max-height: 100%; }
#page-battle-cards .full-amiibos { text-align: center; margin-top: 1.5em; }
#page-battle-cards .full-amiibos a { color: inherit; }

@media only screen and (max-width: 40em) { #page-battle-cards .videoswitcher-container .mobile-play { display: none; position: absolute; top: 30%; left: 50%; margin-top: -30px; margin-left: -43px; width: 86px; height: 60px; z-index: 3; }
  #page-battle-cards .videoswitcher-container .mobile-play::before { -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in; content: ''; background: rgba(255, 63, 0, 0.75); border: solid 4px #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
  #page-battle-cards .videoswitcher-container .mobile-play::after { content: ''; position: absolute; background: url('../img/arrow.svg?1456424083') no-repeat center center; top: 50%; left: 50%; margin-left: -16px; margin-top: -14px; width: 32px; height: 28px; }
  #page-battle-cards .videoswitcher-container .mobile-play.hide { display: none; }
  #page-battle-cards .videoswitcher-container .threeds-top .active { background: url('../img/battle-cards/poster.png?1456424088') no-repeat left top; background-size: 100%; }
  #page-battle-cards .videoswitcher-container .threeds-top .active video { display: none; } }
@media only screen and (min-width: 40.063em) { #page-battle-cards .main-top + .divider .txt { margin-top: 0; }
  #page-battle-cards .switcher-nav { display: -ms-flexbox; display: -webkit-flexbox; display: -webkit-flex; display: flex; }
  #page-battle-cards .videoswitcher-container { width: 539px; height: 444px; }
  #page-battle-cards .videoswitcher-container .threeds-top { width: 310px; height: 345px; top: 40px; left: 115px; }
  #page-battle-cards .videoswitcher-container .threeds-bottom { width: 295px; height: 112px; bottom: 62px; left: 121px; }
  #page-battle-cards .videoswitcher-container .amiibos { left: 70%; width: 210px; height: 380px; } }
@media only screen and (min-width: 54.063em) { #page-battle-cards .main-top .main-img { -moz-animation: BattleCardTopImage 0.8s ease; -webkit-animation: BattleCardTopImage 0.8s ease; animation: BattleCardTopImage 0.8s ease; }
  #page-battle-cards .main-top .content-title { -moz-animation: BattleCardTopTxt 1s ease; -webkit-animation: BattleCardTopTxt 1s ease; animation: BattleCardTopTxt 1s ease; } }
@media only screen and (min-width: 71.063em) { #page-battle-cards #video .img { position: relative; }
  #page-battle-cards #video .img::before { background: url('../img/battle-cards/turtle-cloud.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 380px; width: 292px; content: ''; position: absolute; right: 59%; top: -70px; z-index: 1; }
  #page-battle-cards #video .img .video-card { position: relative; float: right; z-index: 1; }
  #page-battle-cards .switcher-nav { -ms-flex-pack: justify; -webkit-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } }
/* . ======================================= Author           email            Created         2016-01-28 09:25:55 Description     . Edited by        Edited          2016-02-19 14:32:13
*/
@-moz-keyframes DownloadsTopImage { 0% { transform-origin: 80% 30%; transform: translate(200px, -150px) scale(0); }
  50% { transform: translate(100px, -50px) scale(0.5); }
  100% { transform: none; } }
@-webkit-keyframes DownloadsTopImage { 0% { transform-origin: 80% 30%; transform: translate(200px, -150px) scale(0); }
  50% { transform: translate(100px, -50px) scale(0.5); }
  100% { transform: none; } }
@keyframes DownloadsTopImage { 0% { transform-origin: 80% 30%; transform: translate(200px, -150px) scale(0); }
  50% { transform: translate(100px, -50px) scale(0.5); }
  100% { transform: none; } }
#page-downloads .main-top h1 { color: #ff3f00; }
#page-downloads .primary-color h2 { color: #ff3f00; }
#page-downloads .secondary-color h2 { color: #ff3f00; }
#page-downloads h2 sup { top: -0.4em; }
#page-downloads .cta { text-align: center; }
#page-downloads .main-top { background-position: center -10%; }
#page-downloads .main-top .main-img { position: relative; z-index: 1; margin-bottom: -65px; }
#page-downloads .main-top + .divider .divider-wrapper { padding-bottom: 0; }
#page-downloads .divider-top .txt { margin-bottom: 15px; }
#page-downloads .divider-top .img { padding-bottom: 15px; }
#page-downloads .divider-top .button { position: relative; overflow: hidden; padding: 0.3em; }
#page-downloads .divider-top .button::after, #page-downloads .divider-top .button::before { position: absolute; background-color: #ff3f00; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
#page-downloads .divider-top .button::after, #page-downloads .divider-top .button::before { height: 80px; width: 40px; }
#page-downloads .divider-top .button::before { content: ''; left: -15px; }
#page-downloads .divider-top .button::after { content: ''; right: -15px; }
#page-downloads .divider-top .button::before, #page-downloads .divider-top .button::after { -moz-transform: translate3d(0, 0, 1px) rotate(-45deg); -ms-transform: translate3d(0, 0, 1px) rotate(-45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(-45deg); transform: translate3d(0, 0, 1px) rotate(-45deg); }
#page-downloads .divider-top .button::before { top: auto; bottom: -35px; }
#page-downloads .divider-top .button::after { bottom: auto; top: -35px; }
#page-downloads #build-your-own { background-color: #ff8e00; padding-top: 40px; padding-bottom: 20px; }
#page-downloads #build-your-own .txt { padding-right: 4%; padding-bottom: 0; z-index: 1; }
#page-downloads #build-your-own .img img { width: 25%; height: auto; padding: 0 2%; }
#page-downloads #build-your-own .button { position: relative; overflow: hidden; padding: 0.3em; }
#page-downloads #build-your-own .button::after, #page-downloads #build-your-own .button::before { position: absolute; background-color: #ff8e00; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
#page-downloads #build-your-own .button::after, #page-downloads #build-your-own .button::before { height: 80px; width: 40px; }
#page-downloads #build-your-own .button::before { content: ''; left: -15px; }
#page-downloads #build-your-own .button::after { content: ''; right: -15px; }
#page-downloads #build-your-own .button::before, #page-downloads #build-your-own .button::after { -moz-transform: translate3d(0, 0, 1px) rotate(-45deg); -ms-transform: translate3d(0, 0, 1px) rotate(-45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(-45deg); transform: translate3d(0, 0, 1px) rotate(-45deg); }
#page-downloads #build-your-own .button::before { top: auto; bottom: -35px; }
#page-downloads #build-your-own .button::after { bottom: auto; top: -35px; }
#page-downloads #showcase { background: #ff3f00; padding: 30px 0; margin-bottom: 0; }
#page-downloads #showcase .txt { padding-bottom: 10px; }
#page-downloads #showcase .button { position: relative; overflow: hidden; padding: 0.3em; }
#page-downloads #showcase .button::after, #page-downloads #showcase .button::before { position: absolute; background-color: #ff3f00; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
#page-downloads #showcase .button::after, #page-downloads #showcase .button::before { height: 80px; width: 40px; }
#page-downloads #showcase .button::before { content: ''; left: -15px; }
#page-downloads #showcase .button::after { content: ''; right: -15px; }
#page-downloads #showcase .button::before, #page-downloads #showcase .button::after { -moz-transform: translate3d(0, 0, 1px) rotate(-45deg); -ms-transform: translate3d(0, 0, 1px) rotate(-45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(-45deg); transform: translate3d(0, 0, 1px) rotate(-45deg); }
#page-downloads #showcase .button::before { top: auto; bottom: -35px; }
#page-downloads #showcase .button::after { bottom: auto; top: -35px; }
#page-downloads #hammer .img { text-align: right; padding-right: 5%; }
#page-downloads #hammer .img img { margin-top: -60px; }
#page-downloads #hammer .txt > div { color: #000000; }
#page-downloads #hammer .txt > div p a { color: inherit; }
#page-downloads #hammer .txt > div p a:hover { text-decoration: none; }
#page-downloads #hammer .txt h2 { color: #fff; }
#page-downloads #hammer .txt .button { position: relative; overflow: hidden; padding: 0.3em; color: #000000; }
#page-downloads #hammer .txt .button::after, #page-downloads #hammer .txt .button::before { position: absolute; background-color: #ffd000; border-radius: 13%; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8); z-index: 1; }
#page-downloads #hammer .txt .button::after, #page-downloads #hammer .txt .button::before { height: 80px; width: 40px; }
#page-downloads #hammer .txt .button::before { content: ''; left: -15px; }
#page-downloads #hammer .txt .button::after { content: ''; right: -15px; }
#page-downloads #hammer .txt .button::before, #page-downloads #hammer .txt .button::after { -moz-transform: translate3d(0, 0, 1px) rotate(45deg); -ms-transform: translate3d(0, 0, 1px) rotate(45deg); -webkit-transform: translate3d(0, 0, 1px) rotate(45deg); transform: translate3d(0, 0, 1px) rotate(45deg); }
#page-downloads #hammer .txt .button::before { bottom: auto; top: -35px; }
#page-downloads #hammer .txt .button::after { top: auto; bottom: -35px; }

@media only screen and (min-width: 40.063em) { #page-downloads .main-top h1 { color: #ff3f00; }
  #page-downloads .primary-color h2 { color: #ff3f00; }
  #page-downloads .secondary-color h2 { color: #ff3f00; }
  #page-downloads .cta { text-align: left; }
  #page-downloads .main-top .main-img { margin-bottom: -135px; }
  #page-downloads .divider-top .txt { margin-bottom: 60px; }
  #page-downloads .divider-top .img { padding-bottom: 0; }
  #page-downloads #build-your-own .img { padding-bottom: 10px; }
  #page-downloads #showcase { padding: 60px 0; }
  #page-downloads #showcase .txt { padding-bottom: 0; }
  #page-downloads #hammer .txt > div { max-width: 360px; } }
@media only screen and (min-width: 54.063em) { #page-downloads .main-top .main-img { -moz-animation: DownloadsTopImage 0.6s linear; -webkit-animation: DownloadsTopImage 0.6s linear; animation: DownloadsTopImage 0.6s linear; }
  #page-downloads .main-top .content-title { -moz-animation: BattleTopTxt 1s ease; -webkit-animation: BattleTopTxt 1s ease; animation: BattleTopTxt 1s ease; }
  #page-downloads #showcase { margin-bottom: 0; }
  #page-downloads #showcase .img::before { -moz-transform: translateX(200px); -ms-transform: translateX(200px); -webkit-transform: translateX(200px); transform: translateX(200px); opacity: 0; }
  #page-downloads #showcase .img::after { -moz-transform: translateX(-200px); -ms-transform: translateX(-200px); -webkit-transform: translateX(-200px); transform: translateX(-200px); opacity: 0; }
  #page-downloads #showcase.vp-on-40 .img::before, #page-downloads #showcase.vp-on-40 .img::after { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; opacity: 1; }
  #page-downloads #showcase .img { text-align: center; }
  #page-downloads #showcase .img::before { -moz-transition: -moz-transform 0.6s ease 0.6s, opacity 0.6s ease 0.6s; -o-transition: -o-transform 0.6s ease 0.6s, opacity 0.6s ease 0.6s; -webkit-transition: -webkit-transform 0.6s ease, opacity 0.6s ease; -webkit-transition-delay: 0.6s, 0.6s; transition: transform 0.6s ease 0.6s, opacity 0.6s ease 0.6s; background: url('../img/downloads/showcase-left.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 319px; width: 310px; content: ''; position: absolute; left: -8%; top: 50%; margin-top: -159.5px; }
  #page-downloads #showcase .img::after { -moz-transition: -moz-transform 0.6s ease 0.6s, opacity 0.6s ease 0.6s; -o-transition: -o-transform 0.6s ease 0.6s, opacity 0.6s ease 0.6s; -webkit-transition: -webkit-transform 0.6s ease, opacity 0.6s ease; -webkit-transition-delay: 0.6s, 0.6s; transition: transform 0.6s ease 0.6s, opacity 0.6s ease 0.6s; background: url('../img/downloads/showcase-right.png?1456424088') center center no-repeat; background-size: contain; display: inline-block; height: 387px; width: 158px; content: ''; position: absolute; right: 0; top: 50%; top: 50%; margin-top: -193.5px; }
  #page-downloads #showcase .img img { position: relative; z-index: 2; display: block; margin-left: 28%; }
  #page-downloads #hammer .txt .button:hover { color: #FF3600; } }
body[data-useragent*='WiiU'] .retailers-modal { z-index: 9999 !important; }
body[data-useragent*='WiiU'] #main-logo { margin: 0 0 0 auto; }
body[data-useragent*='WiiU'] header[role="navigation"] { width: 77%; }
body[data-useragent*='WiiU'] #main-buy, body[data-useragent*='WiiU'] #main-buy-peek { z-index: 2; }
body[data-useragent*='WiiU'].is-buy #main-buy, body[data-useragent*='WiiU'].is-buy #main-buy-peek { z-index: 100; }
body[data-useragent*='WiiU'] .split-bg .txt > div { -webkit-flex: 0 1 auto; }
body[data-useragent*='WiiU'] .sliding-box-text h2 { -webkit-flex: 1 1 auto; }
body[data-useragent*='WiiU']#page-home .sliding-box-text::before { border: none; bottom: 90%; background: url('../img/sliding-box-triangle-wiiu.png?1456424088') no-repeat top center; width: 345px; height: 50px; left: 0; position: absolute; }
body[data-useragent*='WiiU']#page-videos .secondary-videos { margin-bottom: 20px; }
body[data-useragent*='WiiU'] #footer-main .buttons .button { display: block; float: none; }

body.is-ie10 .split-bg .txt > div { -ms-flex: 0 1 auto; }
body.is-ie10 .divider::before { bottom: calc(100% - 1px); }
body.is-ie10#page-home .divider-top { z-index: 2; }
body.is-ie10#page-home #footer-main { position: relative; z-index: 2; }

/* RESPONSIVE HOOKS ================ */
body::after { content: 'S'; display: none; position: fixed; padding: 10px; background: #FFF; bottom: 0px; right: 0px; z-index: 9999; }

@media only screen and (min-width: 40.063em) and (max-width: 54em) { body::after { content: 'M'; } }
@media only screen and (min-width: 54.063em) and (max-width: 71em) { body::after { content: 'L'; } }
@media only screen and (min-width: 71.063em) and (max-width: 120em) { body::after { content: 'XL'; } }
@media only screen and (min-width: 120.063em) { body::after { content: 'XXL'; } }

@media only screen and (max-width: 54em) {
  #main-buy-peek button.close.hide, #main-buy.hide {
    display: none;
  }
}
/*# sourceMappingURL=main.css.map */